/*-------------------------------------------------------------- # Elements --------------------------------------------------------------*/ html { box-sizing: border-box; } *, *:before, *:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ box-sizing: inherit; } body { background: #fff; /* Fallback for when there is no custom background color defined. */ } blockquote, q { quotes: "" ""; &:before, &:after { content: ""; } } hr { background-color: #ccc; border: 0; height: 1px; margin-bottom: 1.5em; } ul, ol { @include margin(0 0 1.5em 0); } ul { list-style: disc; } ol { list-style: decimal; } li > ul, li > ol { margin-bottom: 0; margin-left: 1.5em; } dt { font-weight: bold; } dd { margin: 0 1.5em 1.5em; } img { height: auto; // Make sure images are scaled correctly. max-width: 100%; // Adhere to container width. display: block; vertical-align: middle; } table { border-spacing: 0; width: 100%; border-collapse: separate; border: 1px solid $border_color; @include border-radius(2px); a { text-decoration: none; } caption { @include padding(0); @include padding(0 null); font-weight: $bold; } td, th { @include padding(4px 8px!important); @include padding(0 null); text-align: left; vertical-align: top; p:last-child { margin-bottom: 0; } } thead { td, th { text-transform: uppercase; @include padding(8px!important); @include padding(0 null); vertical-align: middle; background: lighten($light-gray,2%); } } tbody { td, th { @include padding(8px!important); @include padding(0 null); vertical-align: middle; } tr { &:nth-child(2) { background: lighten($light-gray,4%); } } } tfoot { td, th { @include padding(4px 8px); @include padding(0 null); vertical-align: middle; } } } /*-------------------------------------------------------------- # Accessibility --------------------------------------------------------------*/ /* Text meant only for screen readers. */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; &:focus { background-color: $light-gray; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } } /* Do not show the outline on the skip link target. */ #content[tabindex="-1"]:focus { outline: 0; } /*-------------------------------------------------------------- # Alignments --------------------------------------------------------------*/ .alignleft { display: inline; float: left; margin-right: 1.5em; } .alignright { display: inline; float: right; margin-left: 1.5em; } .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; } /*-------------------------------------------------------------- # Clearings --------------------------------------------------------------*/ .clear, .entry-content, .comment-content, .site-header, .site-content, .site-footer { @extend %clearfix; }