/** * Site header */ .site-header { background: #faf9f5; border-top: 5px solid $title-color; border-bottom: 1px solid $grey-color-light; min-height: 56px; // Positioning context for the mobile navigation icon position: relative; } .site-title { font-family: "Raleway", sans-serif; font-size: 32px; font-weight: 300; line-height: 40px; margin-bottom: 0; &, &:visited { color: $title-color; } } .search-input-group { max-width: 300px !important; } @media screen and (max-width: 768px) { .search-input-group { max-width: 200px !important; } } /** * Site footer */ .site-footer { min-height: 300px; border-top: 1px solid $grey-color-light; padding: $spacing-unit 0; text-align: center; color: #FFF; line-height: 1.3; } .footer-heading { font-size: 18px; margin-bottom: $spacing-unit / 2; } ul.social-buttons { margin-bottom:0 } ul.social-buttons li a { font-size:20px; line-height:40px; display:block; width:40px; height:40px; transition:all .3s; color: #222; border-radius:100%; outline:0; background-color:#FFF; } ul.social-buttons li a:active,ul.social-buttons li a:focus,ul.social-buttons li a:hover { background-color:#4087c7 } /** * Page content */ aside.aside { padding: 100px 0; } .page-content { padding: $spacing-unit 0; background-attachment: fixed; background-size: cover; background-repeat: no-repeat; } .page-heading { font-size: 20px; } .post-list { margin-left: 0; list-style: none; } .post-meta { color: $grey-color; } .post-link { display: block; font-family: "Raleway", sans-serif; @include media-query($on-palm) { font-size: 1.1em; } } /** * Posts */ .post-header { margin-bottom: $spacing-unit; } .post-title { color: $grey-color; font-family: "Raleway", sans-serif; font-size: 42px; letter-spacing: -1px; line-height: 1; @include media-query($on-laptop) { font-size: 36px; } } .post-content { margin-bottom: $spacing-unit; h2 { font-size: 32px; @include media-query($on-laptop) { font-size: 28px; } } h3 { font-size: 26px; @include media-query($on-laptop) { font-size: 22px; } } h4 { font-size: 20px; @include media-query($on-laptop) { font-size: 18px; } } } #post-nav { display: block; .next, .previous { float: left; margin: 1rem 0; width: 50%; span:before, span:after { border: solid transparent 4px; content: ""; display: inline-block; height: 0; margin: 0 0.5rem; top: 0.8em; width: 0; } } .previous { span:before { border-left: 0; border-right-color: $grey-color; } } .next { text-align: right; span:after { border-left-color: $grey-color; border-right: 0; } } @include media-query($on-palm) { padding: initial; .next, .previous { text-align: center; width: 100%; } } span { color: $brand-color; display: block; font-family: Montserrat; font-size: 0.75rem; font-style: normal; letter-spacing: 1px; text-transform: uppercase; } a { color: $grey-color; font-style: italic; } } /** * Index */ .home { h1 { color: $brand-color; display: block; font-family: "Raleway", sans-serif; font-size: 44px; text-align: center; @include media-query($on-laptop) { font-size: 36px; } } } /** * Error pages */ .error { text-align: center; } /** * Bootstrap Override */ @media (min-width:1200px) { .container { max-width:960px; } } .card { line-height: 1.5; } .card td.img { width: 220px; background-size: cover; background-repeat: no-repeat; } .btn-secondary { background-color:#009fe3; border-color:#009fe3; } .btn-secondary:hover { background-color:#007aae; border-color:#007aae; } .btn-outline-primary { border-color: $brand-color; color: $brand-color; &:hover { background-color: $brand-color; border-color: $brand-color; } } .btn-primary { background-color: transparent; border-color: $brand-color; box-shadow: inset 0px -6px 0 $brand-color; transition: box-shadow 1s; &:hover { background-color: $brand-color-hover; border-color: $brand-color-hover; box-shadow: inset 0px -100px 0 $brand-color; } } .bg-primary { background-color: $brand-color !important; } .text-primary { color: $brand-color !important; } .card-columns { @media (max-width: 1199.98px) { column-count: 2; } @media (max-width: 991.98px) { column-count: 1; } } .dropdown-toggle:after { content: none } .list-inline-item:not(:last-child) { margin-right: .25rem; } .min-height-100 { min-height: 100vh; } .content-bottom { background-color: rgba(0,0,0,0.65); bottom: 0; width: 100%; padding: 100px 15px 100px; }