html { // Quick hack to make a footer not-on-the-bottom look better. background: $background-filter; } body { padding-top: 50px; position: relative; font-weight: 300; // Not overridable in bootstrap at the moment. /*background: url("../images/website-background.svg"); background-size: cover; background-repeat: no-repeat;*/ } .chunkfive { font-family: ChunkFivePrint, Impact, sans-serif; } // Not overridable in bootstrap at the moment .dropdown-menu >li >a { font-weight: 300; } // Not overridable in bootstrap at the moment. strong { font-weight: 500; } section { padding: 20px 0px; } .modal form { margin-bottom: 0px; } footer { padding-top: 40px; padding-bottom: 20px; //text-shadow: 0px 0px 0.5px lighten($logo-sky-blue, 0.1); //color: white; } .ftr-wrapper { background-image: linear-gradient(transparent, $background-filter, $background-filter, $background-filter); //background-color: black; } p.login-signup { margin-top: 20px; } .feature-columns { @include make-row(); > div { i.fa { margin-bottom: 0.2em; } @include make-sm-column(4); /*.text-center; margin: 2em 0;*/ } } body.reviews.review-list .review-list, body.reviews.voting-status .voting-status, body.reviews.review-results .review-results { z-index: 2; // Place active items above their siblings for proper border styling color: $list-group-active-color; background-color: $list-group-active-bg; border-color: $list-group-active-border; } body.reviews.voting-status { &.positive a.positive, &.negative a.negative, &.indifferent a.indifferent, &.controversial a.controversial, &.too_few a.too_few { z-index: 2; color: #333; background-color: #e6e6e6; border-color: #adadad; outline: 0; background-image: none; box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); } } #accountLogOutForm { display: none; } .sponsor-list h3 { margin-top: 3em; } .sponsor-list > div { margin: 10px 0; } body.auth .panel-heading .panel-title span.pull-right { margin: 0 auto; } .home { margin: 0; padding-top: $navbar-height - $navbar-padding-vertical - 8; } .home#content_body { margin: 0; padding: 0; } #content_body { //background-color: $background-filter-transparent; //box-shadow: 0px 0px 2em $background-filter; //, inset 0px -5px 1em rgba(0, 0, 0, 0.8); } .hidden-accessible { border:0 none; clip:rect(0px,0px,0px,0px); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px } $homepage-block-min-height: 480px; $homepage-block-smaller-min-height: 360px; .homepage-block { margin-top: 0; margin-bottom: 0; min-height: $homepage-block-min-height; position: relative; box-shadow: $box-shadow; z-index: 3; &.shallow { padding-top: 12px; padding-bottom: 12px; min-height: 0px; } &.smaller { min-height: $homepage-block-smaller-min-height; } .sponsor { $sponsor-height: 150px; @include make-xs-column(6); @include make-sm-column(4); @include make-md-column(3); max-width: 600px; height: $sponsor-height; .logo-alignment { max-width: 300px; width: 100%; height: 100%; // Center the icon horizontally and vertically text-align: center; line-height: ($sponsor-height - 5px); vertical-align: middle; a img { max-width: 100%; max-height: 100%; width: auto; height: auto; } } } .speaker { @include make-xs-column(6); @include make-sm-column(4); @include make-md-column(3); max-width: 600px; min-height: 22em; margin-bottom: 2em; text-align: center; vertical-align: middle; .image-alignment { width: 80%; height: 80%; margin: auto auto; // Center the icon horizontally and vertically } } .speaker-list { margin-top: 2em; } } .homepage-block-content { min-height: ($homepage-block-min-height - 80px); } .homepage-block-content-cloudsep { min-height: ($homepage-block-smaller-min-height - 40px); } .homepage-block-bloop { min-height: 40px; } .homepage-callout { @extend .col-xs-12; @extend .col-sm-6; @extend .col-md-4; .callout-image { position: relative; width: 95%; min-height: 240px; margin: 2%; padding: 5%; color: white; .txt { z-index: 2; position: relative; } .filter { @extend .fill; z-index: -1; background-color: rgba(0,0,0,0.7); } .bg { @extend .fill; z-index: -2; } } a { color: $logo-sky-blue; } } /* ??? */ .homepage-block-footer { } .homepage-block.light { background-color: $background-filter; z-index: 2; } .homepage-block.white { background-color: white; z-index: 1; } .homepage-block-bg { top: 0; bottom: 0; width: 100%; height: 100%; position: absolute; background-size: cover; background-position: center; opacity: 0.3; background-blend-mode: multiply; z-index: -9999; box-shadow: $box-shadow; } .homepage-background-opacity { top: 0; bottom: 0; width: 100%; height: 100%; position: absolute; opacity: 0.7; z-index: -9999; background-blend-mode: multiply; } .homepage-block.dark { background: $gray-base; color: white; //text-shadow: 1px 1px $gray-dark; a:not(.btn) { color: lighten($brand-primary, 20%); &:hover, &:focus, &:active { color: lighten($brand-primary, 15%); } } } .navbar { box-shadow: $box-shadow; } .navbar ul.navbar-nav > li > a, .navbar-header a.navbar-brand { &:active, &:focus, &:hover { background-color: #004303; } } .tight-headings { h1, h2, h3, h4, h5, h6 { margin: 0.05em; } } .btn-shadow { box-shadow: 1px 1px 5px $gray-dark; } .hills { background-size: 100%; background-position: bottom; background-repeat: no-repeat; width: 50%; height: 100%; position: absolute; bottom: 0; right: 0; z-index: -7999; &.main { } &.footer { } } .hphbg { background-color: $logo-sky-blue; opacity: 1; /* will be "on top", if browser supports it */ background-size: 100%; background-position: bottom; top: 0; bottom: 0; background-repeat: no-repeat; width: 100%; height: 100%; } .grey-gradient { background-size: 100%; background-position: bottom; background-repeat: no-repeat; width: 100%; height: 50%; position: absolute; bottom: 0; right: 0; z-index: -9999; //background-color: $logo-sky-blue; background-image: linear-gradient(transparent, black); &.homepage-footer { height: 10%; } &.main { height: 80%; } } .clouds { background-position: bottom; background-repeat: repeat-x; width: 100%; height: 100%; position: absolute; top: 0; //right: 0; z-index: -9000; &.main { } &.ftr { opacity: 0.1; } &.hdr { background-position: top; opacity: 0.6; } } .circle { position: relative; border-radius: 100%; overflow: hidden; width: 100%; box-shadow: 0px 0px 1em $gray-dark; &.border { border: 0.05em solid black; } } .circle:before { content: ""; display: block; padding-top: 100%; } .fill { position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; left: 0; right:0; background-size: cover; background-position: center; } .squish { position: relative; width: 70%; margin: auto; margin-top: 5%; margin-bottom: 5%; } .btn-group + p { margin-top: 1em; } .website-background { /*background-image: url("../images/website-background.svg");*/ } .homepage-header-background { } .sponsor-list a img { width: 100%; max-width: 300px; } .sponsor-list { margin-top: 1em; } .full-width { width: 100%; } body.about { h2, h3, h4 { clear: both; } .team-headshot { height: 150px; width: 150px; float: left; margin-right: 1em; margin-top: 0.25em; margin-bottom: 1em; } } body.news { h2, .h2 { font-size: 28px; } } body:not(.home) { #background-filter a:not(.btn) { text-decoration: underline; } } span.date { font-weight: 900; } .email-signup-panel { max-width: 600px; } .logo { &.left { float: left !important; } &.right { float: right !important; } &.small { width: 80px; height: 80px; margin: 0 1em 2em 2em; .circle { width: 80px; height: 80px; } } &.large { $sz: $jumbotron-heading-font-size * 2; width: $sz; height: $sz; .circle { width: $sz; height: $sz; } } } footer .footer-copy { margin-left: 1em; p { font-size: 16px; } } @media (max-width: 1200px) and (min-width: 992px) { .email-signup-panel input.btn { margin-top: 1em; } } @media (max-width: 992px) { .photo-attribution { margin-top: 1em; text-align: left; } .email-signup-panel { margin-top: 2em; } } @media (max-width: 768px) { .navbar-nav.pull-right { float: left !important; } } @media (max-width: 992px) and (min-width: 768px) { .nav > li > a { padding: 15px 7px; } } @media (max-width: 550px) { } @media (min-width: 992px) { .email-signup-panel { margin-top: 22px; } } .homepage-title { font-weight: 600; } .homepage-subtitle { line-height: 1.25; font-weight: 300; } .navbar-toggle { background-color: $gray-lighter; font-size: 10px; } body.login #content_body .row > div.col-md-9 > p + div.container { padding-left: 0px; } .homepage-vertical-space { height: 20px; } .wrap-break { display: inline-block; } .speakers_ { text-align: center; } .speaker_ { font-size: x-large; margin-bottom: 0.5em; &.headline { font-size: xx-large; } } .speaker-description { font-size: smaller; display: block; font-variant: small-caps; }