|
|
| Line 218: |
Line 218: |
| | figcaption.model-caption { | | figcaption.model-caption { |
| | color: #92cc78; | | color: #92cc78; |
| − | font-style: normal; | + | font-style: n |
| − | font-size: 1.2em;
| + | |
| − | text-transform: uppercase;
| + | |
| − | }
| + | |
| − | | + | |
| − | /*---Requirements Page----------------------------------------------------------------------------*/
| + | |
| − | | + | |
| − | .requirements-text {
| + | |
| − | font-size: 18px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .elaboration-text {
| + | |
| − | font-size: 14px;
| + | |
| − | color: #0E3A5A
| + | |
| − | }
| + | |
| − | | + | |
| − | /*Stuff left over from last year?*/
| + | |
| − | #medals-container {
| + | |
| − | margin: 0px;
| + | |
| − | }
| + | |
| − | h1.medals, h2.medals {
| + | |
| − | border-bottom: 0px;
| + | |
| − | }
| + | |
| − | h1.medals {
| + | |
| − | text-align: center;
| + | |
| − | color: #23b593 !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | /*---Header & Footer------------------------------------------------------------------------------*/
| + | |
| − | | + | |
| − | | + | |
| − | footer {
| + | |
| − | bottom: 0;
| + | |
| − | clear: both;
| + | |
| − | position: relative;
| + | |
| − | /*z-index: 10;*/
| + | |
| − | width: 100%;
| + | |
| − | padding: 0;
| + | |
| − | -webkit-box-shadow: inset 0 10px 15px -10px #424242;
| + | |
| − | -moz-box-shadow: inset 0 10px 15px -10px #424242;
| + | |
| − | -ms-box-shadow: inset 0 10px 15px -10px #424242;
| + | |
| − | -o-box-shadow: inset 0 10px 15px -10px #424242;
| + | |
| − | box-shadow: inset 0 10px 15px -10px #424242;
| + | |
| − | background: #2a2e33;
| + | |
| − | line-height: 2em;
| + | |
| − | color: #fff;
| + | |
| − | box-sizing: border-box;
| + | |
| − | text-align: center;
| + | |
| − | }
| + | |
| − | | + | |
| − | footer .footer-company-motto {
| + | |
| − | color: #8d9093;
| + | |
| − | font-size: 0.9em;
| + | |
| − | margin: 0;
| + | |
| − | }
| + | |
| − | | + | |
| − | footer .footer-company-name {
| + | |
| − | color: #8d9093;
| + | |
| − | font-size: 1.3em;
| + | |
| − | margin: 0;
| + | |
| − | }
| + | |
| − | footer .footer-links {
| + | |
| − | list-style: none;
| + | |
| − | padding: 1.5em 0 0;
| + | |
| − | margin: 0;
| + | |
| − | }
| + | |
| − | | + | |
| − | footer p.footer-links a {
| + | |
| − | display:inline-block;
| + | |
| − | text-decoration: none;
| + | |
| − | padding-right: 1.2em !important;
| + | |
| − | color: #ffffff;
| + | |
| − | font-size: 0.8em;
| + | |
| − | }
| + | |
| − | | + | |
| − | footer p.footer-links a:hover {
| + | |
| − | color: #23b593;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* If you don't want the footer to be responsive, remove these media queries */
| + | |
| − | | + | |
| − | @media (max-width: 1000px) {
| + | |
| − | footer .footer-company-motto .footer-company-name .footer-links {
| + | |
| − | font-size: 1.2em;
| + | |
| − | }
| + | |
| − | footer .footer-links a {
| + | |
| − | padding: 25px 0 20px;
| + | |
| − | line-height: 1.8;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | /*---Toggle Button for collapsible groups-------------*/
| + | |
| − | .toggle-arrow {
| + | |
| − | display: inline-block;
| + | |
| − | height: 25px;
| + | |
| − | width: 25px;
| + | |
| − | /* image replacement properties */
| + | |
| − | overflow: hidden;
| + | |
| − | text-indent: 100%;
| + | |
| − | white-space: nowrap;
| + | |
| − | background: rgba(35, 181, 147, 0.8) url("/wiki/images/b/bd/Waterloo_cd-top-arrow.png") no-repeat scroll center; 50%
| + | |
| − | -moz-transform: scaleY(1);
| + | |
| − | -o-transform: scaleY(1);
| + | |
| − | -webkit-transform: scaleY(1);
| + | |
| − | transform: scaleY(1);
| + | |
| − | }
| + | |
| − | .collapsed .toggle-arrow {
| + | |
| − | -moz-transform: scaleY(-1);
| + | |
| − | -o-transform: scaleY(-1);
| + | |
| − | -webkit-transform: scaleY(-1);
| + | |
| − | transform: scaleY(-1);
| + | |
| − | filter: FlipV;
| + | |
| − | -ms-filter: "FlipV";
| + | |
| − | }
| + | |
| − | | + | |
| − | /* disappear on small screen sizes */
| + | |
| − | | + | |
| − | /*---Scroll to Top button ---------------------------*/
| + | |
| − | .cd-top {
| + | |
| − | display: inline-block;
| + | |
| − | height: 40px;
| + | |
| − | width: 40px;
| + | |
| − | position: fixed;
| + | |
| − | bottom: 40px;
| + | |
| − | right: 10px;
| + | |
| − | box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
| + | |
| − | /* image replacement properties */
| + | |
| − | overflow: hidden;
| + | |
| − | text-indent: 100%;
| + | |
| − | white-space: nowrap;
| + | |
| − | background: rgba(35, 181, 147, 0.8) url(/wiki/images/b/bd/Waterloo_cd-top-arrow.png) no-repeat center 50%;
| + | |
| − | visibility: hidden;
| + | |
| − | opacity: 0;
| + | |
| − | -webkit-transition: opacity .3s 0s, visibility 0s .3s;
| + | |
| − | -moz-transition: opacity .3s 0s, visibility 0s .3s;
| + | |
| − | -ms-transition: opacity .3s 0s, visibility 0s .3s;
| + | |
| − | -o-transition: opacity .3s 0s, visibility 0s .3s;
| + | |
| − | transition: opacity .3s 0s, visibility 0s .3s;
| + | |
| − | }
| + | |
| − | .cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
| + | |
| − | -webkit-transition: opacity .3s 0s, visibility 0s .3s;
| + | |
| − | -moz-transition: opacity .3s 0s, visibility 0s .3s;
| + | |
| − | -ms-transition: opacity .3s 0s, visibility 0s .3s;
| + | |
| − | -o-transition: opacity .3s 0s, visibility 0s .3s;
| + | |
| − | transition: opacity .3s 0s, visibility 0s .3s;
| + | |
| − | }
| + | |
| − | .cd-top.cd-is-visible {
| + | |
| − | /* the button becomes visible */
| + | |
| − | visibility: visible;
| + | |
| − | opacity: 1;
| + | |
| − | }
| + | |
| − | .cd-top.cd-fade-out {
| + | |
| − | /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
| + | |
| − | opacity: .5;
| + | |
| − | }
| + | |
| − | .no-touch .cd-top:hover {
| + | |
| − | background-color: rgb(35, 181, 147);
| + | |
| − | opacity: 1;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* tablet */
| + | |
| − | @media only screen and (min-device-width: 768px) {
| + | |
| − | .cd-top {
| + | |
| − | height: 60px;
| + | |
| − | width: 60px;
| + | |
| − | background: rgba(35, 181, 147, 0.8) url(/wiki/images/b/bd/Waterloo_cd-top-arrow.png) no-repeat center 50%;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | /* phone */
| + | |
| − | @media only screen and (max-device-width: 768px) {
| + | |
| − | .cd-top {
| + | |
| − | height: 100px;
| + | |
| − | width: 100px;
| + | |
| − | background: rgba(35, 181, 147, 0.8) url(/wiki/images/b/bd/Waterloo_cd-top-arrow.png) no-repeat center 50%;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | /*---Splash images & team page --------------------------------------------------------------------*/
| + | |
| − | .cover, .small-cover {
| + | |
| − | position: relative;
| + | |
| − | height: 20em;
| + | |
| − | background: rgba(0, 0, 0, 0.5);
| + | |
| − | width: 100%;
| + | |
| − | color: #fff;
| + | |
| − | margin: auto;
| + | |
| − | text-align: center;
| + | |
| − | line-height: 20em;
| + | |
| − | }
| + | |
| − | .cover::after {
| + | |
| − | content : "";
| + | |
| − | display: block;
| + | |
| − | position: absolute;
| + | |
| − | top: 0;
| + | |
| − | left: 0;
| + | |
| − | background-size: cover;
| + | |
| − | width: 100%;
| + | |
| − | height: 100%;
| + | |
| − | z-index: -1;
| + | |
| − | opacity: 0.8;
| + | |
| − | }
| + | |
| − | .cover#lab::after {
| + | |
| − | background-image: url('/wiki/images/c/c9/Waterloo_lab_cover.JPG');
| + | |
| − | }
| + | |
| − | .cover#math::after {
| + | |
| − | background-image: url('/wiki/images/e/e8/Waterloo_math_cover.jpg');
| + | |
| − | }
| + | |
| − | .cover#policy::after {
| + | |
| − | background-image: url('/wiki/images/2/22/Waterloo_policy_cover.jpg');
| + | |
| − | }
| + | |
| − | .cover#advisors::after {
| + | |
| − | background-image: url('/wiki/images/c/cc/Waterloo_advisors_cover.jpg');
| + | |
| − | }
| + | |
| − | .cover#leads::after {
| + | |
| − | background-image: url('/wiki/images/1/1e/Waterloo_cover_leads.jpg');
| + | |
| − | }
| + | |
| − | | + | |
| − | .jumbotron.landing-links {
| + | |
| − | width: 100%;
| + | |
| − | background-color: inherit;
| + | |
| − | margin-bottom: 0;
| + | |
| − | padding-bottom: 0;
| + | |
| − | }
| + | |
| − | .jumbotron.landing-links div.container {
| + | |
| − | width: 100%;
| + | |
| − | }
| + | |
| − | .small-cover {
| + | |
| − | display: inline-block;
| + | |
| − | float: left;
| + | |
| − | color: #ccc;
| + | |
| − | font-weight: 500;
| + | |
| − | text-align: center;
| + | |
| − | line-height: 200px;
| + | |
| − | height: 200px;
| + | |
| − | text-shadow: 0 0 10px #000;
| + | |
| − | }
| + | |
| − | .small-cover a {
| + | |
| − | display: block;
| + | |
| − | color: #ccc;
| + | |
| − | }
| + | |
| − | .small-cover a:hover {
| + | |
| − | color: #23b593;
| + | |
| − | }
| + | |
| − | .small-cover#desc {
| + | |
| − | background: #555 url('/wiki/images/2/20/Waterloo_cover_desc.png') no-repeat center center;
| + | |
| − | background-size: cover;
| + | |
| − | }
| + | |
| − | .small-cover#medal {
| + | |
| − | background: #555 url('/wiki/images/b/b5/Waterloo_cover_trophy.png') no-repeat center center;
| + | |
| − | background-size: cover;
| + | |
| − | }
| + | |
| − | .small-cover#team {
| + | |
| − | background: #555 url('/wiki/images/8/84/Waterloo_cover_team.png') no-repeat center center;
| + | |
| − | background-size: cover;
| + | |
| − | }
| + | |
| − | .small-cover#att {
| + | |
| − | background: #555 url('/wiki/images/7/72/Waterloo_cover_att.jpg') no-repeat center center;
| + | |
| − | background-size: cover;
| + | |
| − | }
| + | |
| − | .small-cover#collab {
| + | |
| − | background: #555 url('/wiki/images/4/45/Waterloo_cover_collab.jpg') no-repeat center center;
| + | |
| − | background-size: cover;
| + | |
| − | }
| + | |
| − | .small-cover#lab {
| + | |
| − | background: #555 url('/wiki/images/5/5e/Waterloo_smallcover_lab.jpg') no-repeat center center;
| + | |
| − | background-size: cover;
| + | |
| − | }
| + | |
| − | .small-cover#math {
| + | |
| − | background: #555 url('/wiki/images/c/c9/Waterloo_smallcover_math.jpg') no-repeat center center;
| + | |
| − | background-size: cover;
| + | |
| − | }
| + | |
| − | .small-cover#policy {
| + | |
| − | background: #555 url('/wiki/images/a/a7/Waterloo_smallcover_policy.jpg') no-repeat center center;
| + | |
| − | background-size: cover;
| + | |
| − | }
| + | |
| − | | + | |
| − | a.cover-text, a.cover-text:hover, a.cover-text:visited, a.cover-text:active {
| + | |
| − | color: #ccc;
| + | |
| − | font-size: 2em;
| + | |
| − | text-shadow: 0 0 10px #000;
| + | |
| − | text-decoration: none;
| + | |
| − | }
| + | |
| − | .cover-desc {
| + | |
| − | color: #999;
| + | |
| − | margin-top: -9em;
| + | |
| − | text-shadow: 0 0 10px #000;
| + | |
| − | text-decoration: none;
| + | |
| − | }
| + | |
| − | .accordion-inner {
| + | |
| − | margin-top: 10px;
| + | |
| − | margin-left: auto;
| + | |
| − | margin-right: auto;
| + | |
| − | width: 800px;
| + | |
| − | max-width: 95%;
| + | |
| − | }
| + | |
| − | .accordion-inner dl dt {
| + | |
| − | min-width: 150px;
| + | |
| − | width: 30%;
| + | |
| − | display: inline-block;
| + | |
| − | text-align: center;
| + | |
| − | vertical-align: middle;
| + | |
| − | }
| + | |
| − | .accordion-inner dl dd {
| + | |
| − | width: 60%;
| + | |
| − | display: inline-block;
| + | |
| − | vertical-align: middle;
| + | |
| − | }
| + | |
| − | .accordion-inner dl dt img {
| + | |
| − | max-width: 100px;
| + | |
| − | display: inline-block;
| + | |
| − | border-radius: 50%;
| + | |
| − | -webkit-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
| + | |
| − | -moz-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
| + | |
| − | -ms-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
| + | |
| − | -o-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
| + | |
| − | box-shadow: 0 0 20px 0 rgba(66,66,66,1);
| + | |
| − | }
| + | |
| − | | + | |
| − | figure {
| + | |
| − | position: relative;
| + | |
| − | }
| + | |
| − | .img-att {
| + | |
| − | position: absolute;
| + | |
| − | bottom: 10px;
| + | |
| − | right: 10px;
| + | |
| − | height: 30px;
| + | |
| − | width: 30px;
| + | |
| − | line-height: 30px;
| + | |
| − | border-radius: 40px;
| + | |
| − | display: inline-block;
| + | |
| − | background-color: #989;
| + | |
| − | color: #261a28;
| + | |
| − | text-align: center;
| + | |
| − | font-family: georgia, serif;
| + | |
| − | font-style: italic;
| + | |
| − | }
| + | |
| − | .img-att .img-att-bubble {
| + | |
| − | position: absolute;
| + | |
| − | right: 10px;
| + | |
| − | bottom: 10px;
| + | |
| − | width: 200px;
| + | |
| − | display: none;
| + | |
| − | background: rgba(255, 255, 255, 0.8);
| + | |
| − | border-radius: 2px;
| + | |
| − | color: #000;
| + | |
| − | font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
| + | |
| − | font-style: normal;
| + | |
| − | font-weight: 300;
| + | |
| − | text-align: left;
| + | |
| − | padding: 1em;
| + | |
| − | font-size: 14px;
| + | |
| − | | + | |
| − | -webkit-box-shadow: 0 0 5px 0 rgba(66,66,66,1);
| + | |
| − | -moz-box-shadow: 0 0 5px 0 rgba(66,66,66,1);
| + | |
| − | -ms-box-shadow: 0 0 5px 0 rgba(66,66,66,1);
| + | |
| − | -o-box-shadow: 0 0 5px 0 rgba(66,66,66,1);
| + | |
| − | box-shadow: 0 0 5px 0 rgba(66,66,66,1);
| + | |
| − | }
| + | |
| − | .img-att .img-att-bubble li {
| + | |
| − | list-style: none;
| + | |
| − | line-height: normal;
| + | |
| − | margin: 5px 0;
| + | |
| − | }
| + | |
| − | .img-att:hover .img-att-bubble, .img-att-bubble:hover {
| + | |
| − | display: block;
| + | |
| − | }
| + | |
| − | | + | |
| − | /*---Sponsor images-------------------------------------------------------------------------------*/
| + | |
| − | ul.sponsors {
| + | |
| − | list-style: none;
| + | |
| − | width: 100%;
| + | |
| − | margin-left: auto;
| + | |
| − | margin-right: auto;
| + | |
| − | }
| + | |
| − | ul.sponsors li a {
| + | |
| − | margin-left: auto;
| + | |
| − | margin-right: auto;
| + | |
| − | }
| + | |
| − | .glyphicon {
| + | |
| − | font-size: medium;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | /*---Attributions---------------------------------------------------------------------------------*/
| + | |
| − | dl.attributions dt {
| + | |
| − | font-size: 1.5em;
| + | |
| − | font-style: normal;
| + | |
| − | font-weight: normal;
| + | |
| − | margin: 0.67em 0;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | /*---Quote Styling--------------------------------------------------------------------------------*/
| + | |
| − | q:before, blockquote:before {
| + | |
| − | content: "\201C" !important;
| + | |
| − | font-family: serif !important;
| + | |
| − | font-size: 5em;
| + | |
| − | font-style: normal;
| + | |
| − | line-height: normal;
| + | |
| − | z-index: -999;
| + | |
| − | }
| + | |
| − | q, blockquote {
| + | |
| − | display: block;
| + | |
| − | font-size: 1.2em;
| + | |
| − | font-weight: lighter;
| + | |
| − | font-style: italic;
| + | |
| − | font-family: inherit;
| + | |
| − | padding: 0 0 0 120px;
| + | |
| − | border-left: none !important;
| + | |
| − | }
| + | |
| − | blockquote p {
| + | |
| − | text-indent: 3.5em;
| + | |
| − | margin-top: -4em;
| + | |
| − | }
| + | |
| − | blockquote p.source {
| + | |
| − | text-indent: 3.5em;
| + | |
| − | margin-top: 0px;
| + | |
| − | font-size: 0.8em;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | /*---Description links----------------------------------------------------------------------------*/
| + | |
| − | .desc-links a {
| + | |
| − | padding: 0 1.5em;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | /*---Human practices page--------------------------------------------------------------------------*/
| + | |
| − | .jumbotron.hp-landing {
| + | |
| − | background-color: inherit;
| + | |
| − | color: #000;
| + | |
| − | }
| + | |
| − | .jumbotron.hp-landing dl {
| + | |
| − | text-align: center;
| + | |
| − | }
| + | |
| − | .jumbotron.hp-landing dt img {
| + | |
| − | border-radius: 50%;
| + | |
| − | -webkit-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
| + | |
| − | -moz-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
| + | |
| − | -ms-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
| + | |
| − | -o-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
| + | |
| − | box-shadow: 0 0 20px 0 rgba(66,66,66,1);
| + | |
| − | }
| + | |
| − | /*New Navbar settings*/
| + | |
| − | .cd-auto-hide-header {
| + | |
| − | position: fixed;
| + | |
| − | z-index: 2;
| + | |
| − | top: 15px;
| + | |
| − | left: 0;
| + | |
| − | width: 100%;
| + | |
| − | height: 60px;
| + | |
| − | background-color:rgb(39, 40, 34);
| + | |
| − | box-shadow: 0px 2px 3px #888888;
| + | |
| − | /* Force Hardware Acceleration */
| + | |
| − | -webkit-transform: translateZ(0);
| + | |
| − | transform: translateZ(0);
| + | |
| − | will-change: transform;
| + | |
| − | -webkit-transition: -webkit-transform .5s;
| + | |
| − | transition: -webkit-transform .5s;
| + | |
| − | transition: transform .5s;
| + | |
| − | transition: transform .5s, -webkit-transform .5s;
| + | |
| − | border-bottom-style: solid;
| + | |
| − | border-bottom-width: 6px;
| + | |
| − | border-bottom-color: #F5636D
| + | |
| − | }
| + | |
| − | .cd-auto-hide-header::after {
| + | |
| − | clear: both;
| + | |
| − | content: "";
| + | |
| − | display: block;
| + | |
| − | }
| + | |
| − | .cd-auto-hide-header.is-hidden {
| + | |
| − | -webkit-transform: translateY(-100%);
| + | |
| − | -ms-transform: translateY(-100%);
| + | |
| − | transform: translateY(-100%);
| + | |
| − | }
| + | |
| − | @media only screen and (min-width: 1024px) {
| + | |
| − | .cd-auto-hide-header {
| + | |
| − | height: 84px;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | .cd-auto-hide-header .logo,
| + | |
| − | .cd-auto-hide-header .nav-trigger {
| + | |
| − | position: absolute;
| + | |
| − | top: 50%;
| + | |
| − | bottom: auto;
| + | |
| − | -webkit-transform: translateY(-50%);
| + | |
| − | -ms-transform: translateY(-50%);
| + | |
| − | transform: translateY(-50%);
| + | |
| − | }
| + | |
| − | | + | |
| − | .cd-auto-hide-header .logo {
| + | |
| − | left: 5%;
| + | |
| − | }
| + | |
| − | .cd-auto-hide-header .logo a, .cd-auto-hide-header .logo img {
| + | |
| − | display: block;
| + | |
| − | }
| + | |
| − | | + | |
| − | .cd-auto-hide-header .nav-trigger {
| + | |
| − | /* vertically align its content */
| + | |
| − | display: table;
| + | |
| − | height: 100%;
| + | |
| − | padding: 0 1em;
| + | |
| − | font-size: 1.2rem;
| + | |
| − | text-transform: uppercase;
| + | |
| − | color: #25283D;
| + | |
| − | font-weight: bold;
| + | |
| − | right: 0;
| + | |
| − | border-left: 1px solid #f2f2f2;
| + | |
| − | }
| + | |
| − | .cd-auto-hide-header .nav-trigger span {
| + | |
| − | /* vertically align inside parent element */
| + | |
| − | display: table-cell;
| + | |
| − | vertical-align: middle;
| + | |
| − | }
| + | |
| − | .cd-auto-hide-header .nav-trigger em, .cd-auto-hide-header .nav-trigger em::after, .cd-auto-hide-header .nav-trigger em::before {
| + | |
| − | /* this is the menu icon */
| + | |
| − | display: block;
| + | |
| − | position: relative;
| + | |
| − | height: 2px;
| + | |
| − | width: 22px;
| + | |
| − | background-color: #25283D;
| + | |
| − | -webkit-backface-visibility: hidden;
| + | |
| − | backface-visibility: hidden;
| + | |
| − | }
| + | |
| − | .cd-auto-hide-header .nav-trigger em {
| + | |
| − | /* this is the menu central line */
| + | |
| − | margin: 6px auto 14px;
| + | |
| − | -webkit-transition: background-color .2s;
| + | |
| − | transition: background-color .2s;
| + | |
| − | }
| + | |
| − | .cd-auto-hide-header .nav-trigger em::before, .cd-auto-hide-header .nav-trigger em::after {
| + | |
| − | position: absolute;
| + | |
| − | content: '';
| + | |
| − | left: 0;
| + | |
| − | -webkit-transition: -webkit-transform .2s;
| + | |
| − | transition: -webkit-transform .2s;
| + | |
| − | transition: transform .2s;
| + | |
| − | transition: transform .2s, -webkit-transform .2s;
| + | |
| − | }
| + | |
| − | .cd-auto-hide-header .nav-trigger em::before {
| + | |
| − | /* this is the menu icon top line */
| + | |
| − | -webkit-transform: translateY(-6px);
| + | |
| − | -ms-transform: translateY(-6px);
| + | |
| − | transform: translateY(-6px);
| + | |
| − | }
| + | |
| − | .cd-auto-hide-header .nav-trigger em::after {
| + | |
| − | /* this is the menu icon bottom line */
| + | |
| − | -webkit-transform: translateY(6px);
| + | |
| − | -ms-transform: translateY(6px);
| + | |
| − | transform: translateY(6px);
| + | |
| − | }
| + | |
| − | @media only screen and (min-width: 1024px) {
| + | |
| − | .cd-auto-hide-header .nav-trigger {
| + | |
| − | display: none;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | .cd-auto-hide-header.nav-open .nav-trigger em {
| + | |
| − | /* transform menu icon into a 'X' icon */
| + | |
| − | background-color: rgba(255, 255, 255, 0);
| + | |
| − | }
| + | |
| − | .cd-auto-hide-header.nav-open .nav-trigger em::before {
| + | |
| − | /* rotate top line */
| + | |
| − | -webkit-transform: rotate(-45deg);
| + | |
| − | -ms-transform: rotate(-45deg);
| + | |
| − | transform: rotate(-45deg);
| + | |
| − | }
| + | |
| − | .cd-auto-hide-header.nav-open .nav-trigger em::after {
| + | |
| − | /* rotate bottom line */
| + | |
| − | -webkit-transform: rotate(45deg);
| + | |
| − | -ms-transform: rotate(45deg);
| + | |
| − | transform: rotate(45deg);
| + | |
| − | }
| + | |
| − | | + | |
| − | .cd-primary-nav {
| + | |
| − | display: inline-block;
| + | |
| − | float: right;
| + | |
| − | height: 100%;
| + | |
| − | padding-right: 5%;
| + | |
| − | | + | |
| − | }
| + | |
| − | .cd-primary-nav > ul {
| + | |
| − | position: absolute;
| + | |
| − | z-index: 2;
| + | |
| − | top: 60px;
| + | |
| − | left: 0;
| + | |
| − | width: 100%;
| + | |
| − | background-color: #ffffff;
| + | |
| − | display: none;
| + | |
| − | box-shadow: 0 14px 20px rgba(0, 0, 0, 0.2);
| + | |
| − | }
| + | |
| − | .cd-primary-nav > ul a {
| + | |
| − | /* target primary-nav links */
| + | |
| − | display: block;
| + | |
| − | font-weight: bold;
| + | |
| − | height: 50px;
| + | |
| − | line-height: 50px;
| + | |
| − | padding-left: 5%;
| + | |
| − | color: white;
| + | |
| − | font-size: 1.8rem;
| + | |
| − | border-top: 1px solid #f2f2f2;
| + | |
| − | }
| + | |
| − | .cd-primary-nav > ul a:hover, .cd-primary-nav > ul a:active, .cd-primary-nav > ul a:focus {
| + | |
| − | color: #F5636D;
| + | |
| − | font-weight: bold;
| + | |
| − | border-top-style: solid;
| + | |
| − | border-top-width: 3px;
| + | |
| − | border-top-color: #F5636D;
| + | |
| − | text-decoration: none;
| + | |
| − | }
| + | |
| − | @media only screen and (min-width: 1024px) {
| + | |
| − | .cd-primary-nav {
| + | |
| − | /* vertically align its content */
| + | |
| − | display: table;
| + | |
| − | }
| + | |
| − | .cd-primary-nav > ul {
| + | |
| − | /* vertically align inside parent element */
| + | |
| − | display: table-cell;
| + | |
| − | vertical-align: middle;
| + | |
| − | /* reset mobile style */
| + | |
| − | position: relative;
| + | |
| − | width: auto;
| + | |
| − | top: 0;
| + | |
| − | padding: 0;
| + | |
| − | background-color: transparent;
| + | |
| − | box-shadow: none;
| + | |
| − | }
| + | |
| − | .cd-primary-nav > ul::after {
| + | |
| − | clear: both;
| + | |
| − | content: "";
| + | |
| − | display: block;
| + | |
| − | }
| + | |
| − | .cd-primary-nav > ul li {
| + | |
| − | display: inline-block;
| + | |
| − | float: left;
| + | |
| − | margin-right: 1.5em;
| + | |
| − | }
| + | |
| − | .cd-primary-nav > ul li:last-of-type {
| + | |
| − | margin-right: 0;
| + | |
| − | }
| + | |
| − | .cd-primary-nav > ul a {
| + | |
| − | /* reset mobile style */
| + | |
| − | height: auto;
| + | |
| − | line-height: normal;
| + | |
| − | padding: 0;
| + | |
| − | border: none;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | .nav-open .cd-primary-nav ul,
| + | |
| − | .cd-primary-nav ul:target {
| + | |
| − | /*
| + | |
| − | show primary nav - mobile only
| + | |
| − | :target is used to show navigation on no-js devices
| + | |
| − | */
| + | |
| − | display: block;
| + | |
| − | }
| + | |
| − | @media only screen and (min-width: 1024px) {
| + | |
| − | .nav-open .cd-primary-nav ul,
| + | |
| − | .cd-primary-nav ul:target {
| + | |
| − | display: table-cell;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | /* --------------------------------
| + | |
| − | | + | |
| − | 2. Auto-Hiding Navigation - with Sub Nav
| + | |
| − | | + | |
| − | -------------------------------- */
| + | |
| − | .cd-secondary-nav {
| + | |
| − | overflow: hidden;
| + | |
| − | position: relative;
| + | |
| − | z-index: 1;
| + | |
| − | clear: both;
| + | |
| − | width: 100%;
| + | |
| − | height: 1.95vw;
| + | |
| − | background-color: white;
| + | |
| − | /* Force Hardware Acceleration */
| + | |
| − | -webkit-transform: translateZ(0);
| + | |
| − | transform: translateZ(0);
| + | |
| − | will-change: transform;
| + | |
| − | -webkit-transition: -webkit-transform .5s;
| + | |
| − | transition: -webkit-transform .5s;
| + | |
| − | transition: transform .5s;
| + | |
| − | transition: transform .5s, -webkit-transform .5s;
| + | |
| − | }
| + | |
| − | .cd-secondary-nav::after {
| + | |
| − | /* gradient on the right - to indicate it's possible to scroll */
| + | |
| − | content: '';
| + | |
| − | position: absolute;
| + | |
| − | z-index: 1;
| + | |
| − | top: 0;
| + | |
| − | right: 0;
| + | |
| − | height: 100%;
| + | |
| − | width: 1.365vw;
| + | |
| − | background: transparent;
| + | |
| − | background: -webkit-linear-gradient(right, #25283D, rgba(37, 40, 61, 0));
| + | |
| − | background: linear-gradient(to left, #25283D, rgba(37, 40, 61, 0));
| + | |
| − | pointer-events: none;
| + | |
| − | -webkit-transition: opacity .2s;
| + | |
| − | transition: opacity .2s;
| + | |
| − | }
| + | |
| − | .cd-secondary-nav.nav-end::after {
| + | |
| − | opacity: 0;
| + | |
| − | }
| + | |
| − | .cd-secondary-nav ul, .cd-secondary-nav li, .cd-secondary-nav a {
| + | |
| − | height: 100%;
| + | |
| − | }
| + | |
| − | .cd-secondary-nav ul {
| + | |
| − | /* enables a flex context for all its direct children */
| + | |
| − | display: -webkit-box;
| + | |
| − | display: -webkit-flex;
| + | |
| − | display: -ms-flexbox;
| + | |
| − | display: flex;
| + | |
| − | padding: 0 5%;
| + | |
| − | overflow-x: auto;
| + | |
| − | overflow-y: hidden;
| + | |
| − | -webkit-overflow-scrolling: touch;
| + | |
| − | }
| + | |
| − | .cd-secondary-nav ul::after {
| + | |
| − | clear: both;
| + | |
| − | content: "";
| + | |
| − | display: block;
| + | |
| − | }
| + | |
| − | .cd-secondary-nav li {
| + | |
| − | display: inline-block;
| + | |
| − | float: left;
| + | |
| − | /* do not shrink - elements float on the right of the element */
| + | |
| − | -webkit-flex-shrink: 0;
| + | |
| − | -ms-flex-negative: 0;
| + | |
| − | flex-shrink: 0;
| + | |
| − | }
| + | |
| − | .cd-secondary-nav li:last-of-type {
| + | |
| − | padding-right: 20px;
| + | |
| − | }
| + | |
| − | .cd-secondary-nav a {
| + | |
| − | display: block;
| + | |
| − | color: slategray;
| + | |
| − | opacity: .6;
| + | |
| − | line-height: 50px;
| + | |
| − | padding: 0 1em;
| + | |
| − | }
| + | |
| − | .cd-secondary-nav a:hover, .cd-secondary-nav a.active {
| + | |
| − | opacity: 1;
| + | |
| − | }
| + | |
| − | @media only screen and (min-width: 1024px) {
| + | |
| − | .cd-secondary-nav {
| + | |
| − | height: 70px;
| + | |
| − | overflow: visible;
| + | |
| − | }
| + | |
| − | .cd-secondary-nav ul {
| + | |
| − | /* reset mobile style */
| + | |
| − | display: block;
| + | |
| − | text-align: center;
| + | |
| − | }
| + | |
| − | .cd-secondary-nav li {
| + | |
| − | /* reset mobile style */
| + | |
| − | float: none;
| + | |
| − | -webkit-flex-shrink: 1;
| + | |
| − | -ms-flex-negative: 1;
| + | |
| − | flex-shrink: 1;
| + | |
| − | }
| + | |
| − | .cd-secondary-nav a {
| + | |
| − | line-height: 70px;
| + | |
| − | }
| + | |
| − | .cd-secondary-nav a.active {
| + | |
| − | box-shadow: inset 0 -3px #8F3985;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | /* --------------------------------
| + | |
| − | | + | |
| − | 3. Auto-Hiding Navigation - with Sub Nav + Hero Image
| + | |
| − | | + | |
| − | -------------------------------- */
| + | |
| − | .cd-secondary-nav.fixed {
| + | |
| − | position: fixed;
| + | |
| − | top: 60px;
| + | |
| − | }
| + | |
| − | .cd-secondary-nav.slide-up {
| + | |
| − | -webkit-transform: translateY(-60px);
| + | |
| − | -ms-transform: translateY(-60px);
| + | |
| − | transform: translateY(-60px);
| + | |
| − | }
| + | |
| − | @media only screen and (min-width: 1024px) {
| + | |
| − | .cd-secondary-nav.fixed {
| + | |
| − | top: 80px;
| + | |
| − | /* fixes a bug where nav and subnab move with a slight delay */
| + | |
| − | box-shadow: 0 -6px 0 #25283D;
| + | |
| − | }
| + | |
| − | .cd-secondary-nav.slide-up {
| + | |
| − | -webkit-transform: translateY(-80px);
| + | |
| − | -ms-transform: translateY(-80px);
| + | |
| − | transform: translateY(-80px);
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | /* --------------------------------
| + | |
| − | | + | |
| − | Main content
| + | |
| − | | + | |
| − | -------------------------------- */
| + | |
| − | .cd-main-content {
| + | |
| − | padding: 60px 5% 2em;
| + | |
| − | overflow: hidden;
| + | |
| − | }
| + | |
| − | .cd-main-content.sub-nav {
| + | |
| − | /* to be used if there is sub nav */
| + | |
| − | padding-top: 110px;
| + | |
| − | }
| + | |
| − | .cd-main-content.sub-nav-hero {
| + | |
| − | /* to be used if there is hero image + subnav */
| + | |
| − | padding-top: 0;
| + | |
| − | }
| + | |
| − | .cd-main-content.sub-nav-hero.secondary-nav-fixed {
| + | |
| − | margin-top: 50px;
| + | |
| − | }
| + | |
| − | .cd-main-content p {
| + | |
| − | max-width: 1024px;
| + | |
| − | line-height: 1.6;
| + | |
| − | margin: 2em auto;
| + | |
| − | font-family: "David Libre", serif;
| + | |
| − | color: #a5a8a9;
| + | |
| − | }
| + | |
| − | @media only screen and (min-width: 1024px) {
| + | |
| − | .cd-main-content {
| + | |
| − | padding-top: 80px;
| + | |
| − | }
| + | |
| − | .cd-main-content.sub-nav {
| + | |
| − | padding-top: 150px;
| + | |
| − | }
| + | |
| − | .cd-main-content.sub-nav-hero.secondary-nav-fixed {
| + | |
| − | margin-top: 70px;
| + | |
| − | }
| + | |
| − | .cd-main-content p {
| + | |
| − | font-size: 2.4rem;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | /*
| + | |
| − | adjust the positioning of in-page links
| + | |
| − | http://nicolasgallagher.com/jump-links-and-viewport-positioning/
| + | |
| − | */
| + | |
| − | .cd-main-content.sub-nav :target::before,
| + | |
| − | .cd-main-content.sub-nav-hero :target::before {
| + | |
| − | display: block;
| + | |
| − | content: "";
| + | |
| − | margin-top: -50px;
| + | |
| − | height: 50px;
| + | |
| − | visibility: hidden;
| + | |
| − | }
| + | |
| − | @media only screen and (min-width: 1024px) {
| + | |
| − | .cd-main-content.sub-nav :target::before,
| + | |
| − | .cd-main-content.sub-nav-hero :target::before {
| + | |
| − | margin-top: -70px;
| + | |
| − | height: 70px;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | /* --------------------------------
| + | |
| − | | + | |
| − | Intro Section
| + | |
| − | | + | |
| − | -------------------------------- */
| + | |
| − | .cd-hero {
| + | |
| − | /* vertically align its content */
| + | |
| − | display: table;
| + | |
| − | width: 100%;
| + | |
| − | margin-top: 60px;
| + | |
| − | height: 300px;
| + | |
| − | background: url(../img/cd-hero-background.jpg) no-repeat center center;
| + | |
| − | background-size: cover;
| + | |
| − | }
| + | |
| − | .cd-hero .cd-hero-content {
| + | |
| − | /* vertically align inside parent element */
| + | |
| − | display: table-cell;
| + | |
| − | vertical-align: middle;
| + | |
| − | text-align: center;
| + | |
| − | }
| + | |
| − | @media only screen and (min-width: 768px) {
| + | |
| − | .cd-hero {
| + | |
| − | height: 400px;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | @media only screen and (min-width: 1024px) {
| + | |
| − | .cd-hero {
| + | |
| − | height: 600px;
| + | |
| − | margin-top: 80px;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | /*---Example page----------------------------------------------------------------------------------*/
| + | |
| − | table.split-col {
| + | |
| − | margin: auto;
| + | |
| − | width: 95%;
| + | |
| − | }
| + | |
| − | table.split-col td {
| + | |
| − | width: 50%;
| + | |
| − | }
| + | |
| − | pre code {
| + | |
| − | color: #c7254e;
| + | |
| − | }
| + | |
| − | .landing{
| + | |
| − | position: relative;
| + | |
| − | font-family: 'Ubuntu', sans-serif;
| + | |
| − | background-color: #404855;
| + | |
| − | padding: 15vh;
| + | |
| − | margin-bottom: -2vh;
| + | |
| − | overflow: hidden;
| + | |
| − | }
| + | |
| − | .changingcircles{
| + | |
| − | display: flex;
| + | |
| − | flex-flow: column;
| + | |
| − | align-items: center;
| + | |
| − | }
| + | |
| − | #circle1 {
| + | |
| − | position: relative;
| + | |
| − | right: 3vw;
| + | |
| − | width: 4vw;
| + | |
| − | height: 4vw;
| + | |
| − | -webkit-border-radius: 50%;
| + | |
| − | -moz-border-radius: 50%;
| + | |
| − | border-radius: 50%;
| + | |
| − | background: #F9EC69;
| + | |
| − | }
| + | |
| − | #circle2 {
| + | |
| − | position: relative;
| + | |
| − | right: 11vw;
| + | |
| − | width: 4vw;
| + | |
| − | height: 4vw;
| + | |
| − | -webkit-border-radius: 50%;
| + | |
| − | -moz-border-radius: 50%;
| + | |
| − | border-radius: 50%;
| + | |
| − | background: #F9EC69;
| + | |
| − | }
| + | |
| − | #circle3 {
| + | |
| − | position: relative;
| + | |
| − | left: 3vw;
| + | |
| − | width: 4vw;
| + | |
| − | height: 4vw;
| + | |
| − | -webkit-border-radius: 50%;
| + | |
| − | -moz-border-radius: 50%;
| + | |
| − | border-radius: 50%;
| + | |
| − | background: #F9EC69;
| + | |
| − | }
| + | |
| − | #circle4 {
| + | |
| − | position: relative;
| + | |
| − | left: 7vw;
| + | |
| − | width: 4vw;
| + | |
| − | height: 4vw;
| + | |
| − | -webkit-border-radius: 50%;
| + | |
| − | -moz-border-radius: 50%;
| + | |
| − | border-radius: 50%;
| + | |
| − | background: #F9EC69;
| + | |
| − | }
| + | |
| − | #circle5 {
| + | |
| − | position: relative;
| + | |
| − | width: 4vw;
| + | |
| − | height: 4vw;
| + | |
| − | -webkit-border-radius: 50%;
| + | |
| − | -moz-border-radius: 50%;
| + | |
| − | border-radius: 50%;
| + | |
| − | background: #F9EC69;
| + | |
| − | }
| + | |
| − | #circle6 {
| + | |
| − | position: relative;
| + | |
| − | left: 14vw;
| + | |
| − | width: 4vw;
| + | |
| − | height: 4vw;
| + | |
| − | -webkit-border-radius: 50%;
| + | |
| − | -moz-border-radius: 50%;
| + | |
| − | border-radius: 50%;
| + | |
| − | background: #F9EC69;
| + | |
| − | }
| + | |
| − | | + | |
| − | .landing #caption{
| + | |
| − | position: relative;
| + | |
| − | top: 35px;
| + | |
| − | font-weight: bold;
| + | |
| − | padding-left: 15px;
| + | |
| − | color: #F5636D;
| + | |
| − | font-size: 4vw;
| + | |
| − | font-style: underline;
| + | |
| − | }
| + | |
| − | .landing #title {
| + | |
| − | bottom: 5vw;
| + | |
| − | font-size: 2vw;
| + | |
| − | color: #F5636D;
| + | |
| − | font-weight: bold;
| + | |
| − | text-align: center;
| + | |
| − | }
| + | |
| − | .landing .btn-danger{
| + | |
| − | margin-top: 3vh;
| + | |
| − | transition: ease;
| + | |
| − | transition-duration: 0.4s;
| + | |
| − | border-color: #F5636D;
| + | |
| − | color: white;
| + | |
| − | background-color: #F5636D;
| + | |
| − | }
| + | |
| − | .landing .btn-danger:hover{
| + | |
| − | transition: ease;
| + | |
| − | transition-duration: 0.4s;
| + | |
| − | border-color: #F5636D;
| + | |
| − | color: #F5636D;
| + | |
| − | background-color: rgba(0,0,0,0.2);
| + | |
| − | }
| + | |
| − | .project-logo{
| + | |
| − | position: relative;
| + | |
| − | display: flex;
| + | |
| − | align-items: center;
| + | |
| − | justify-content: center;
| + | |
| − | font-size: ;
| + | |
| − | }
| + | |
| − | .project-logo svg{
| + | |
| − | width: 30vw;
| + | |
| − | }
| + | |
| − | .wcontent-box{
| + | |
| − | margin: 7.5vh 12.5vw;
| + | |
| − | box-shadow: 3px 7px 5px #888888;
| + | |
| − | position:relative;
| + | |
| − | height: auto;
| + | |
| − | width: 75vw;
| + | |
| − |
| + | |
| − | }
| + | |
| − | .wcontent-title{
| + | |
| − | align-items: center;
| + | |
| − | text-transform: uppercase;
| + | |
| − | background-color: #404855;
| + | |
| − | color: #F5636D;
| + | |
| − | font-size: 28px;
| + | |
| − | padding: 15px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .wcontent{
| + | |
| − | background-color: white;
| + | |
| − | color: #141823;
| + | |
| − | padding: 40px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .wcontent p{
| + | |
| − | line-height: 2;
| + | |
| − | font-size: 1.7rem !important;
| + | |
| − | font-family: 'Ubuntu', sans-serif !important;
| + | |
| − | }
| + | |
| − | /* Made this specifically for the parts page and the protocols page, which need less padding. */
| + | |
| − | .wcontent_alt{
| + | |
| − | background-color: white;
| + | |
| − | color: #141823;
| + | |
| − | padding: 10px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .wcontent-protocol{
| + | |
| − | margin: 7.5vh 5vw;
| + | |
| − | box-shadow: 3px 7px 5px #888888;
| + | |
| − | position:relative;
| + | |
| − | height: auto;
| + | |
| − | width: 30vw;
| + | |
| − |
| + | |
| − | }
| + | |
| − | .initial-bar{
| + | |
| − | background-color:rgb(39, 40, 34);
| + | |
| − | box-shadow: 0px 2px 3px #2a2e2f;
| + | |
| − | height: 8vh;
| + | |
| − | }
| + | |
| − | nav .button-toggle{
| + | |
| − | background-color: white;
| + | |
| − | }
| + | |
| − | .navbar{
| + | |
| − | display: inline-block;
| + | |
| − | }
| + | |
| − | .navbar-nav > li > a{
| + | |
| − | padding-top: 18px;
| + | |
| − | transition-duration: 0.1s;
| + | |
| − | transition-timing-function: linear;
| + | |
| − | | + | |
| − | }
| + | |
| − | | + | |
| − | .navbar-toggle .icon-bar{
| + | |
| − | background-color: white;
| + | |
| − | }
| + | |
| − | | + | |
| − | .initial-bar .navbar-nav > li > a:hover{
| + | |
| − | background-color: rgba(0,0,0,0);
| + | |
| − | border-top-style: solid;
| + | |
| − | border-top-color: white;
| + | |
| − | padding-top: 15px;
| + | |
| − | }
| + | |
| − | .initial-bar .navbar-nav > li > a:focus {
| + | |
| − | background-color: rgba(0,0,0,0);
| + | |
| − | border-top-style: solid;
| + | |
| − | border-top-color: indianred;
| + | |
| − | padding-top: 15px;
| + | |
| − | color:indianred;
| + | |
| − | }
| + | |
| − | .protocol-page .wcontent-box{
| + | |
| − | width: 50vw;
| + | |
| − | }
| + | |
| − | .wcontent-img33{
| + | |
| − | width: 33%;
| + | |
| − | display: inline-block;
| + | |
| − | margin: auto;
| + | |
| − | }
| + | |
| − | .wcontent-img50{
| + | |
| − | width: 49%;
| + | |
| − | display: inline-block;
| + | |
| − | margin: auto;
| + | |
| − | }
| + | |
| − | .wcontent-img-solo25{
| + | |
| − | width: 25vw;
| + | |
| − | display:block;
| + | |
| − | margin: auto;
| + | |
| − | }
| + | |
| − | .wcontent-img-solo50{
| + | |
| − | width: 50vw;
| + | |
| − | display:block;
| + | |
| − | margin: auto;
| + | |
| − | }
| + | |
| − | | + | |
| − | .precard{
| + | |
| − | display:flex;
| + | |
| − | flex-flow: row wrap;
| + | |
| − | padding: 55px;
| + | |
| − | }
| + | |
| − | .team-card{
| + | |
| − | position: relative;
| + | |
| − | z-index: 1;
| + | |
| − | margin: 3vw;
| + | |
| − | /* width: 25vw; */
| + | |
| − | }
| + | |
| − | .card-desc{
| + | |
| − | transition-timing-function: linear;
| + | |
| − | transition-duration: 1s;
| + | |
| − | padding: 110px 50px 50px 50px;
| + | |
| − | width: 100%;
| + | |
| − | height: 450px;
| + | |
| − | background-color: white;
| + | |
| − | }
| + | |
| − | .monster{
| + | |
| − | padding-top: 20px;
| + | |
| − | color:#F5636D;
| + | |
| − | font-size: 24px;
| + | |
| − | padding-left: 75%;
| + | |
| − | padding-right: 15px;
| + | |
| − | padding-bottom: 10px;
| + | |
| − | background-color: #404855;
| + | |
| − | }
| + | |
| − | | + | |
| − | .monster p {
| + | |
| − | font-size: 1.5rem;
| + | |
| − | }
| + | |
| − | .person-program{
| + | |
| − | color: #F5636D;
| + | |
| − | font-size: 16px;
| + | |
| − | }
| + | |
| − | .person-labteam{
| + | |
| − | color: #3f7f7f;
| + | |
| − | font-size: 19px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .person-desc{
| + | |
| − | color: #777777;
| + | |
| − | font-size: 14px;
| + | |
| − | }
| + | |
| − | .urinacircle{
| + | |
| − | z-index: 2;
| + | |
| − | position: absolute;
| + | |
| − | top: -35px;
| + | |
| − | margin-left: 15px;
| + | |
| − | background-color: #cccccc;
| + | |
| − | height: 200px;
| + | |
| − | width: 200px;
| + | |
| − | width: 60%;
| + | |
| − | height: auto;
| + | |
| − | border-radius:50%;
| + | |
| − | }
| + | |
| − | .bigyou{
| + | |
| − | transition-timing-function: linear;
| + | |
| − | transition-duration: 1s;
| + | |
| − | padding: 110px 50px 50px 50px;
| + | |
| − | width: 100%;
| + | |
| − | height: 450px;
| + | |
| − | background-color: white;
| + | |
| − | }
| + | |
| − | | + | |
| − | .wcontent-box .wcontent-caption{
| + | |
| − | margin-top: 2vh;
| + | |
| − | margin-bottom: 2vh;
| + | |
| − | display: block;
| + | |
| − | text-align: center !important;
| + | |
| − | color: #777777;
| + | |
| − | }
| + | |
| − | .wcontent-img-solo37{
| + | |
| − | width: 37vw;
| + | |
| − | display:block;
| + | |
| − | margin: auto;
| + | |
| − | }
| + | |
| − | .train-5{
| + | |
| − | width: 19%;
| + | |
| − | display: inline-block;
| + | |
| − | margin:auto;
| + | |
| − | }
| + | |
| − | | + | |
| − | .img-train-4{
| + | |
| − | margin:2.5%;
| + | |
| − | width: 19%;
| + | |
| − | display: inline-block;
| + | |
| − | }
| + | |
| − | | + | |
| − | .paragraph-medium {
| + | |
| − | font-size: 15px !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* header-image and header-text are classes for making a somewhat opaque header with
| + | |
| − | text in its center and an image in the background. it adjusts size with the size of the window. */
| + | |
| − | | + | |
| − | .header-image {
| + | |
| − | width: 100%;
| + | |
| − | height:20vw;
| + | |
| − | opacity:0.7;
| + | |
| − | background-position: center center;
| + | |
| − | background-size: cover;
| + | |
| − | }
| + | |
| − | | + | |
| − | .header-text {
| + | |
| − | padding:5.5vw 5.5vw 5.5vw 5.5vw;
| + | |
| − | opacity: 0.7;
| + | |
| − | font-size: 8vw;
| + | |
| − | text-align:center;
| + | |
| − | font-family:sans-serif;
| + | |
| − | }
| + | |
| − | | + | |
| − | .idkmakeityellow {
| + | |
| − | background-color: #ffe86a;
| + | |
| − | }
| + | |
| − | | + | |
| − | .noalightyellow {
| + | |
| − | background-color: #fff9d4;
| + | |
| − | }
| + | |
| − | | + | |
| − | .justmakeitlightorange {
| + | |
| − | background-color: #ffaa30;
| + | |
| − | }
| + | |
| − | | + | |
| − | .bloodorangeisacolour {
| + | |
| − | background-color: #f24a2c;
| + | |
| − | }
| + | |
| − | | + | |
| − | .nonpretentiousorange {
| + | |
| − | background-color: #f15a24;
| + | |
| − | }
| + | |
| − | | + | |
| − | .itsnotpinkitssalmon {
| + | |
| − | background-color: #F5C2C7;
| + | |
| − | }
| + | |
| − | | + | |
| − | .evenlighteryellow {
| + | |
| − | background-color: #fdf9d2;
| + | |
| − | }
| + | |
| − | | + | |
| − | .pinkredorsomething {
| + | |
| − | background-color: #F5636D;
| + | |
| − | }
| + | |
| − | | + | |
| − | #wrapper {
| + | |
| − | height:100%;
| + | |
| − | width: 100%;
| + | |
| − | margin: 0 auto;
| + | |
| − | }
| + | |
| − | | + | |
| − | #footer {
| + | |
| − | position:fixed;
| + | |
| − | bottom:0;
| + | |
| − | width:100%;
| + | |
| − | height:60px; /* Height of the footer */
| + | |
| − | background:#6cf;
| + | |
| − | }
| + | |
| − | @keyframes panning {
| + | |
| − | 0% {
| + | |
| − | background-position: 0% 0%;
| + | |
| − | }
| + | |
| − | 25% {
| + | |
| − | background-position: 100% 100%;
| + | |
| − | }
| + | |
| − | 50% {
| + | |
| − | background-position: 100% 0%;
| + | |
| − | }
| + | |
| − | 75% {
| + | |
| − | background-position: 0 100%;
| + | |
| − | }
| + | |
| − | 200% {
| + | |
| − | background-position: 0 0;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | .yeastpan {
| + | |
| − | position: relative;
| + | |
| − | height:30vh;
| + | |
| − | width:100%;
| + | |
| − | opacity:0.7;
| + | |
| − | background: black url(https://static.igem.org/mediawiki/2016/5/51/T--Waterloo--Yeast.jpg);
| + | |
| − | background-size: 200%;
| + | |
| − | display: flex;
| + | |
| − | align-items: center;
| + | |
| − | animation: panning 50s infinite linear;
| + | |
| − | }
| + | |
| − | .pan-text{
| + | |
| − | padding:5.5vw 5.5vw 5.5vw 5.5vw;
| + | |
| − | font-size: 4vw;
| + | |
| − | text-align:center;
| + | |
| − | font-family: 'Ubuntu', sans-serif;
| + | |
| − | }
| + | |
| − | span.pan-background{
| + | |
| − | background-color: white;
| + | |
| − | }
| + | |
| − | .test {
| + | |
| − | position: relative;
| + | |
| − | height: 300px;
| + | |
| − | width: 100%;
| + | |
| − | background: black url(http://unsplash.it/1900/1900/?random&blur);
| + | |
| − | background-size: 200%;
| + | |
| − | animation: panning 50s infinite linear;
| + | |
| − | }
| + | |
| − | .image-wide{
| + | |
| − | width:100%;
| + | |
| − | }
| + | |
| − | .yeastpan > .overlay {
| + | |
| − | position: absolute;
| + | |
| − | top: 0;
| + | |
| − | left: 0;
| + | |
| − | width: 100%;
| + | |
| − | height: 100%;
| + | |
| − | background: rgba(255,232,106, .3);
| + | |
| − | z-index: 10;
| + | |
| − | }
| + | |
| − | .overlay {
| + | |
| − | position: absolute;
| + | |
| − | top: 0;
| + | |
| − | left: 0;
| + | |
| − | width: 100%;
| + | |
| − | height: 100%;
| + | |
| − | background: rgba(255,232,106, .3);
| + | |
| − | z-index: 10;
| + | |
| − | }
| + | |
| − | | + | |
| − | .text {
| + | |
| − | position: absolute;
| + | |
| − | top: 0;
| + | |
| − | left: 0;
| + | |
| − | right: 0;
| + | |
| − | bottom: 0;
| + | |
| − | z-index: 20;
| + | |
| − | height: 60px;
| + | |
| − | width: 290px;
| + | |
| − | margin: auto;
| + | |
| − | font-family: Roboto;
| + | |
| − | font-size: 34px;
| + | |
| − | color: white;
| + | |
| − | font-weight: 100;
| + | |
| − | text-align: center;
| + | |
| − | padding: 10px 40px;
| + | |
| − | border: 3px solid #ccc;
| + | |
| − | border-radius: 2px;
| + | |
| − | -webkit-font-smoothing: antialiased;
| + | |
| − | }
| + | |
| − | .tsc{
| + | |
| − | background: white;
| + | |
| − | padding-top: 3vh;
| + | |
| − | padding-bottom: 3vh;
| + | |
| − | padding-left: 3vw;
| + | |
| − | display: flex;
| + | |
| − | flex-flow: column;
| + | |
| − | }
| + | |
| − | .tsc-content{
| + | |
| − | display: flex;
| + | |
| − | align-items: center;
| + | |
| − | }
| + | |
| − | .tsc-content img{
| + | |
| − | width: 15vw;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* Footer things */
| + | |
| − | | + | |
| − | footer {
| + | |
| − | bottom: 0;
| + | |
| − | width: 100%;
| + | |
| − | padding: 0;
| + | |
| − | -webkit-box-shadow: inset 0 10px 15px -10px #424242;
| + | |
| − | -moz-box-shadow: inset 0 10px 15px -10px #424242;
| + | |
| − | -ms-box-shadow: inset 0 10px 15px -10px #424242;
| + | |
| − | -o-box-shadow: inset 0 10px 15px -10px #424242;
| + | |
| − | box-shadow: inset 0 10px 15px -10px #424242;
| + | |
| − | background: #2a2e33;
| + | |
| − | line-height: 2em;
| + | |
| − | color: #fff;
| + | |
| − | box-sizing: border-box;
| + | |
| − | text-align: center;
| + | |
| − | }
| + | |
| − | | + | |
| − | footer .footer-company-motto {
| + | |
| − | color: #8d9093;
| + | |
| − | font-size: 0.9em;
| + | |
| − | margin: 0;
| + | |
| − | }
| + | |
| − | | + | |
| − | footer .footer-company-name {
| + | |
| − | color: #8d9093;
| + | |
| − | font-size: 1.3em;
| + | |
| − | margin: 0;
| + | |
| − | }
| + | |
| − | footer .footer-links {
| + | |
| − | list-style: none;
| + | |
| − | padding: 1.5em 0 0;
| + | |
| − | margin: 0;
| + | |
| − | }
| + | |
| − | | + | |
| − | footer p.footer-links a {
| + | |
| − | display:inline-block;
| + | |
| − | text-decoration: none;
| + | |
| − | padding-right: 1.2em !important;
| + | |
| − | color: #ffffff;
| + | |
| − | font-size: 0.8em;
| + | |
| − | }
| + | |
| − | | + | |
| − | footer p.footer-links a:hover {
| + | |
| − | color: #23b593;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* If you don't want the footer to be responsive, remove these media queries */
| + | |
| − | | + | |
| − | @media (max-width: 1000px) {
| + | |
| − | footer .footer-company-motto .footer-company-name .footer-links {
| + | |
| − | font-size: 1.2em;
| + | |
| − | }
| + | |
| − | footer .footer-links a {
| + | |
| − | padding: 25px 0 20px;
| + | |
| − | line-height: 1.8;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | blockquote {
| + | |
| − | border-left: 5px solid #23b593 !important;
| + | |
| − | font-size: 1.1em;
| + | |
| − | padding: 1em;
| + | |
| − | font-weight: bold;
| + | |
| − | color: #23b593;
| + | |
| − | }
| + | |
| − | .wcontent li{
| + | |
| − | font-size: 14px;
| + | |
| − | }
| + | |
| − | .clickmepls{
| + | |
| − | display: flex;
| + | |
| − | flex-flow: row;
| + | |
| − | justify-content: center
| + | |
| − | }
| + | |
| − | .medal{
| + | |
| − | position: relative;
| + | |
| − | align-items: center;
| + | |
| − | padding: 10vh 2vw 5vh 2vw;
| + | |
| − | background-color: #404855;
| + | |
| − | margin: 5vh;
| + | |
| − | box-shadow: 3px 7px 5px #888888;
| + | |
| − | position:relative;
| + | |
| − | height: auto;
| + | |
| − | width: 20vw ;
| + | |
| − | | + | |
| − | }
| + | |
| − | .medal .wcontent-title{
| + | |
| − | position: absolute;
| + | |
| − | width: 100%;
| + | |
| − | background-color: white;
| + | |
| − | top: 0px;
| + | |
| − | left: 0px;
| + | |
| − | right: 0px;
| + | |
| − | }
| + | |
| − | .medal img{
| + | |
| − | width: 15vw;
| + | |
| − | }
| + | |
| − | @media (max-width: 976px){
| + | |
| − | .landing #caption{
| + | |
| − | position: absolute;
| + | |
| − | top: -10vh;
| + | |
| − | right:0px;
| + | |
| − | left:0px;
| + | |
| − | }
| + | |
| − |
| + | |
| − | }
| + | |
| − | | + | |
| − | .sticker {
| + | |
| − | position:fixed;
| + | |
| − | top:18vh;
| + | |
| − | right:2vw;
| + | |
| − | }
| + | |
| − | | + | |
| − | #cd-navigation {
| + | |
| − | list-style: none;
| + | |
| − | margin: 0px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .secondary-nav {
| + | |
| − | list-style: none;
| + | |
| − | }
| + | |
| − | | + | |
| − | @media only screen and (max-width: 1023px){
| + | |
| − | .mobile-menu {
| + | |
| − | background: #373B40 !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | .cd-secondary-nav {
| + | |
| − | display: none !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | ul.secondary-nav{
| + | |
| − | display: none !important;
| + | |
| − | visibility: hidden;
| + | |
| − | }
| + | |
| − | | + | |
| − | #cd-navigation {
| + | |
| − | height: calc(100vh - 80px);
| + | |
| − | height: -moz-calc(100vh - 80px);
| + | |
| − | height: -o-calc(100vh - 80px);
| + | |
| − | height: -webkit-calc(100vh - 80px);
| + | |
| − | overflow-y: scroll;
| + | |
| − | }
| + | |
| − | | + | |
| − | #cd-navigation li.show-secondary-nav > ul.secondary-nav{
| + | |
| − | display: block !important;
| + | |
| − | visibility: visible !important;
| + | |
| − | }
| + | |
| − |
| + | |
| − | .cd-primary-nav > ul ul a,
| + | |
| − | .cd-primary-nav > ul ul a:hover{
| + | |
| − | border-top: none;
| + | |
| − | }
| + | |
| − |
| + | |
| − | .cd-auto-hide-header.nav-open .nav-trigger em::before ,
| + | |
| − | .cd-auto-hide-header.nav-open .nav-trigger em::after{
| + | |
| − | background-color: #fff
| + | |
| − | }
| + | |
| − |
| + | |
| − | .cd-auto-hide-header .nav-trigger em::before,
| + | |
| − | .cd-auto-hide-header .nav-trigger em::after,
| + | |
| − | .cd-auto-hide-header .nav-trigger em{
| + | |
| − | background-color: #fff;
| + | |
| − | }
| + | |
| − |
| + | |
| − | .cd-auto-hide-header .nav-trigger{
| + | |
| − | color: #fff
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | @media only screen and (min-width: 1024px){
| + | |
| − | ul.secondary-nav{
| + | |
| − | display: none !important;
| + | |
| − | visibility: hidden !important;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | .labsticker{
| + | |
| − | position: fixed;
| + | |
| − | top: 18vw;
| + | |
| − | left: 2vw;
| + | |
| − | background-color: #2590FF;
| + | |
| − | border-radius: 50%;
| + | |
| − | color: black;
| + | |
| − | height: 5vw;
| + | |
| − | width: 5vw;
| + | |
| − | font-size: .76vw;
| + | |
| − | display: flex;
| + | |
| − | justify-content: center;
| + | |
| − | align-items: center;
| + | |
| − | text-align: center;
| + | |
| − | font-weight: bold;
| + | |
| − | font-family: "Ubuntu";
| + | |
| − | }
| + | |
| − | .mathsticker{
| + | |
| − | position: fixed;
| + | |
| − | background-color: #FF2590;
| + | |
| − | border-radius: 50%;
| + | |
| − | color: black;
| + | |
| − | top: 24vw;
| + | |
| − | left: 2vw;
| + | |
| − | height: 5vw;
| + | |
| − | width: 5vw;
| + | |
| − | font-size: .76vw;
| + | |
| − | display: flex;
| + | |
| − | justify-content: center;
| + | |
| − | align-items: center;
| + | |
| − | text-align: center;
| + | |
| − | font-weight: bold;
| + | |
| − | font-family: "Ubuntu";
| + | |
| − | }
| + | |
| − | .pnpsticker{
| + | |
| − | position: fixed;
| + | |
| − | background-color: #90ff25;
| + | |
| − | border-radius: 50%;
| + | |
| − | color: black;
| + | |
| − | height: 5vw;
| + | |
| − | width: 5vw;
| + | |
| − | top: 30vw;
| + | |
| − | left: 2vw;
| + | |
| − | font-size: .76vw;
| + | |
| − | display: flex;
| + | |
| − | justify-content: center;
| + | |
| − | align-items: center;
| + | |
| − | text-align: center;
| + | |
| − | font-weight: bold;
| + | |
| − | font-family: "Ubuntu";
| + | |
| − | }
| + | |
| − | | + | |
| − | </style>
| + | |
| − | </html>
| + | |
