// Sheets.scss
// Sheet // —————– // sheets are areas that contain content. Sheets are versatile // and can be used for content emphasis. Sheets have a header, // content, and footer. Each are optional, though allow for // extra custimization. .sheet {
background-color: $white; padding: $spacing-default; margin-bottom: $spacing-default;
}
// Sheet Header // ———— .sheet-header {
text-align: center; margin-bottom: 3rem; .sheet-title { font-size: 26px; line-height: 1; margin: 1.5rem 0; } hr { max-width: 4rem; border-width: 3px; }
}
.sheet-description {
margin: $spacing-default auto; max-width: 24em; text-align: center;
}
// Sheet Callout // ————- .sheet-callout {
background-color: #efefef; margin: $spacing-default -$spacing-default; padding: $spacing-default;
}
// Sheet Content // ————- .sheet-content {
margin: $spacing-default 0;
}
// Sheet Footer // ———— .sheet-footer {
text-align: center; margin-top: $spacing-default; @include clearfix();
}