Difference between revisions of "Team:EPF Lausanne/css/main template"
Line 1,511: | Line 1,511: | ||
letter-spacing: 10px; | letter-spacing: 10px; | ||
padding-bottom: 20px; | padding-bottom: 20px; | ||
+ | } | ||
+ | .home-first-section-test a { | ||
+ | color: black; | ||
} | } | ||
.home-first-section-test h2 { | .home-first-section-test h2 { |
Revision as of 15:12, 12 August 2015
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800);
/* get rid of black border.. */
- top_menu_under {
border-style: none;
}
/* ==========================================================================
HTML5 Boilerplate styles - h5bp.com (generated via initializr.com) ========================================================================== */
html, button, input, select, textarea {
color: #222;
} body {
font-size: 1em; line-height: 1.4; padding-top: 0px; border-style: none;
}
@media (max-width: 979px) {
body { padding-top: 0px; border-style: none; }
}
- -moz-selection {
background: #b3d4fc; text-shadow: none;
}
- selection {
background: #b3d4fc; text-shadow: none;
} hr {
display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;
} img {
vertical-align: middle;
} fieldset {
border: 0; margin: 0; padding: 0;
} textarea {
resize: vertical;
} .chromeframe {
margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0;
} /* ==========================================================================
Helper classes ========================================================================== */
.hidden {
display: none !important; visibility: hidden;
} .visuallyhidden {
border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;
} .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {
clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto;
} .invisible {
visibility: hidden;
} .clearfix:before, .clearfix:after {
content: " "; display: table;
} .clearfix:after {
clear: both;
} .clearfix {
*zoom: 1;
} .text-muted {
color: #848b8f;
} /* ==========================================================================
Forms ========================================================================== */
form input[type="text"], form input[type="email"], form input[type="number"], form input[type="password"] {
background: #fff; color: #777; border: 1px solid #dddddd; padding: 12px 15px; width: 100%; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; -o-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out;
} form input[type="text"]:focus, form input[type="email"]:focus, form input[type="number"]:focus, form input[type="password"]:focus {
-webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; outline: none !important; border-color: #f57e37;
} label {
font-weight: normal;
} /*
* jQuery FlexSlider v2.2.0 * http://www.woothemes.com/flexslider/ * * Copyright 2012 WooThemes * Free to use under the GPLv2 license. * http://www.gnu.org/licenses/gpl-2.0.html * * Contributing author: Tyler Smith (@mbmufffin) */
/* Browser Resets
- /
.flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus {
outline: none;
} .slides, .flex-control-nav, .flex-direction-nav {
margin: 0; padding: 0; list-style: none;
} /* Icon Fonts
- /
/* Font-face Icons */ /*@font-face {
font-family: 'flexslider-icon'; src: url('../fonts/flexslider-icon.eot'); src: url('../fonts/flexslider-icon.eot?#iefix') format('embedded-opentype'), url('../fonts/flexslider-icon.woff') format('woff'), url('../fonts/flexslider-icon.ttf') format('truetype'), url('../fonts/flexslider-icon.svg#flexslider-icon') format('svg'); font-weight: normal; font-style: normal;
}*/
- contactSection{ background:#3b3b3b; text-align:center; padding:70px 0 0;}
- contactSection .span8{ float:none; margin:0 auto;}
- contactSection h1{ text-transform:uppercase; color:#fff; padding:0;font-size:60px;}
- applications h1.cntr { text-transform:uppercase; color:#3A494C; padding:0;font-size:60px; text-align: center; margin-bottom: 20px; }
- contactSection p {
color: #fff; font-size: 19px; line-height: 27px; margin: 15px 0;
} /* ==========================================================================
Timeline ========================================================================== */
.timeline-section {
color: transparent; position: relative; z-index: 17; padding-top: 50px 0; margin-top: 0px; background-color: transparent; background-size: cover; border-style: none;
} .timeline-section h3 {
text-align: center; text-transform: uppercase; font-weight: 500; font-size: 24px; color: #000066;
} .timeline-section h2 {
text-align: center; color: #333333; font-weight: 400; margin: 0;
} .timeline-section h4 {
font-size: 16px; font-weight: 600; color: black;
} .timeline-section p {
text-align: justify; font-size: 16px; color : #2F2F2F;
} .timeline-section .image-holder {
margin-top: 50px; overflow: hidden;
} .timeline {
list-style: none; padding: 20px 0 20px; position: relative;
} .timeline:before {
top: 0; bottom: 0; position: absolute; content: " "; width: 3px; background-color: #333333; left: 50%; margin-left: -1.5px;
} .timeline > li {
margin-bottom: 20px; position: relative;
} .timeline > li:before, .timeline > li:after {
content: " "; display: table;
} .timeline > li:after {
clear: both;
} .timeline > li:before, .timeline > li:after {
content: " "; display: table;
} .timeline > li:after {
clear: both;
} .timeline > li > .timeline-panel {
width: 46%; float: left; border: 1px solid #333333; border-radius: 2px; padding: 20px; padding-top: 0px; position: relative; -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175); box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);
} .timeline > li > .timeline-panel:before {
position: absolute; top: 26px; right: -15px; display: inline-block; border-top: 15px solid transparent; border-left: 15px solid #ccc; border-right: 0 solid #ccc; border-bottom: 15px solid transparent; content: " ";
} .timeline > li > .timeline-panel:after {
position: absolute; top: 27px; right: -14px; display: inline-block; border-top: 14px solid transparent; border-left: 14px solid #fff; border-right: 0 solid #fff; border-bottom: 14px solid transparent; content: " ";
} .timeline > li > .timeline-badge {
color: #fff; width: 25px; height: 25px; line-height: 50px; font-size: 2.5em; text-align: center; position: absolute; top: 29px; left: 50%; margin-left: -12.5px; background-color: #999999; z-index: 100; border-top-right-radius: 50%; border-top-left-radius: 50%; border-bottom-right-radius: 50%; border-bottom-left-radius: 50%;
} .timeline > li.timeline-inverted > .timeline-panel {
float: right;
} .timeline > li.timeline-inverted > .timeline-panel:before {
border-left-width: 0; border-right-width: 15px; left: -15px; right: auto;
} .timeline > li.timeline-inverted > .timeline-panel:after {
border-left-width: 0; border-right-width: 14px; left: -14px; right: auto;
} .timeline-badge.primary {
background-color: #2e6da4 !important;
} .timeline-badge.success {
background-color: #3f903f !important;
} .timeline-badge.warning {
background-color: #f0ad4e !important;
} .timeline-badge.danger {
background-color: #d9534f !important;
} .timeline-badge.info {
background-color: #5bc0de !important;
} .timeline-title {
font-size: 28px; margin-top: 0; color: inherit;
} .timeline-body > p, .timeline-body > ul {
margin-bottom: 0;
} .timeline-body > p + p {
margin-top: 5px;
} /* ==========================================================================
Print styles ========================================================================== */
@media print {
* { background: transparent !important; color: #000 !important; /* Black prints faster: h5bp.com/s */ box-shadow: none !important; text-shadow: none !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } /* * Don't show links for images, or javascript/internal links */ .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; /* h5bp.com/t */ } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; }
}
/* ==========================================================================
Structure & Defaults ========================================================================== */
html, body {
font-size: 100%; width: 100%; height: 100%;
} body {
background: #ffffff; color: #777777; font-size: 13px; /*line-height: 24px;*/ font-family: 'Open Sans', sans-serif;
} a {
color: #39c8e2; text-decoration: none !important; -webkit-transition: color 200ms ease-in-out; -moz-transition: color 200ms ease-in-out; -o-transition: color 200ms ease-in-out; transition: color 200ms ease-in-out;
} a:hover {
color: #232323;
} h1, h2, h3, h4, h5, h6 {
font-family: 'Open Sans', sans-serif; font-weight: 500;
} /* ==========================================================================
Header ========================================================================== */
.dropdown:hover .dropdown-menu {
display: block; min-width: 100%;
}
.navbar {
padding-top: 15px; margin-bottom: 0; background-color: #119799; /*background: linear-gradient(#119799 97%, rgba(235, 235, 235,0.3)); */ border-style: none;
}
.navbar-nav {
margin: 0 auto; display: table; table-layout: auto; float: none; width: 100%; border-style: none;
}
.navbar-nav > li {
display: table-cell; float: none; text-align: center; vertical-align: middle; color: #ffffff; width : 230px;
}
.navbar-nav > li > a {
color: #ffffff; text-transform: uppercase; font-size: 16px;
}
.navbar-nav > li > a:hover {
color: #fff; background-color: #74C1C2;
}
.navbar .nav > li.dropdown.open.active{
color: red; background: blue;
} .fill-width.dropdown {
position: static;
} .fill-width.dropdown > .dropdown-menu {
left: auto;
} .fill-width.dropdown > .dropdown-menu > li > a {
white-space: normal;
}
.navbar-default .navbar-toggle {
background-color: #fff; border-color: #fff; font-size: 14px; color: #39c8e2; margin-top: 50px; -webkit-border-radius: 0; -webkit-background-clip: padding-box; -moz-border-radius: 0; -moz-background-clip: padding; border-radius: 0; background-clip: padding-box; padding-top: 30px;
} .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
background-color: #fff; border: 1px solid #fff;
} .navbar-default .navbar-collapse, .navbar-default .navbar-form {
border-color: #fff; display:table; width:100%;
} .navbar-default {
background-color: #119799; border-color: transparent;
} .navbar-header {
padding-top: 15px; padding-bottom: 15px;
}
.navbar-default .navbar-nav > li {
display:table-cell; text-align:center;
}
.navbar-default .navbar-nav > li > a {
color: #ffffff; text-transform: uppercase; font-size: 14px;
} .navbar-default .navbar-nav > li > a:hover {
color: #fff;
} .navbar-default .navbar-nav > li {
border-right: 1px solid #ffffff; padding-top: 10px;
} .navbar-default .navbar-nav > li:first-child {
border-left: 1px solid #ffffff;
} .navbar-default .navbar-brand {
text-transform: uppercase; font-size: 32px; font-weight: 700; color: #fff; padding-top: 25px; padding-bottom: 25px;
} .navbar-default .navbar-brand:hover {
color: #fff;
} .site-header {
background-color: #119799; color: #ffffff; border-style: none;
} .site-slider {
position: relative; z-index: 16; background-color: transparent;
} .site-slider .slide {
position: absolute;
} .site-slider .overlay {
background: -webkit-linear-gradient(rgba(0,0,0,0) 90%, rgba(235, 235, 235,1)); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(rgba(0,0,0,0) 90%, rgba(235, 235, 235,1)); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(rgba(0,0,0,0) 90%, rgba(235, 235, 235,1)); /* For Firefox 3.6 to 15 */ background: linear-gradient(rgba(0,0,0,0) 90%, rgba(235, 235, 235,1)); /* Standard syntax */ position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 9; border-style: none;
} .site-slider .slider-caption {
position: absolute; z-index: 12; width: 100%; top: 30%; text-align: center;
} .site-slider .slider-caption .title {
width: 276px; margin: 0 auto; border: 4px solid #fff; padding: 40px 40px 20px 40px; text-align: center;
} .site-slider .slider-caption .title h2 {
margin: 0 0 20px 0; font-size: 28px; color: #fff; text-transform: uppercase; font-weight: 700;
} .site-slider .slider-caption .slider-button {
color: #fff; margin: 0 0 20px 0; font-size: 28px; display: inline-block; padding: 40px 40px 20px 40px; text-transform: uppercase; font-weight: 700; -webkit-border-radius: 3px; -webkit-background-clip: padding-box; -moz-border-radius: 3px; -moz-background-clip: padding; border-radius: 3px; background-clip: padding-box;
}
.col-centered{
float: none; margin: 0 auto;
} .slider-section {
min-height: 100%; min-width: 100%; display: block; margin-top: 5%;
color: black; padding-right: 5%; padding-top: 10%; padding-bottom: 5%; text-align: center; height: 100%; width: 100%; overflow: auto;
} .slider-section p {
font-size: 18px; padding-top: none; text-align: justify;
}
- bodyContent .slider-section h1 {
border: none; padding-top: 0px; font-size: 95px; margin-top: 0; margin-bottom: 0em; padding-bottom: 0px;
}
- bodyContent .slider-section h2 {
border: none; padding-top: 0px; margin-top: 0px; font-size: 20px; padding-bottom: 20px;
} .slider-section h3 {
font-size: 30px; text-decoration: bold; margin-bottom: 10px;
} .slider-section fa-arrow-circle-down {
color: black;
} .first-section {
color: transparent; position: relative; z-index: 17; padding-top: 40px 0; margin-top: -86px; background-color: transparent; background-size: cover; border-style: none;
} .first-section h3 {
text-align: center; text-transform: uppercase; font-weight: 500; font-size: 24px; color: #000066;
} .first-section h2 {
text-align: center; color: #333333; font-weight: 400; margin: 0;
} .first-section h4 {
font-size: 16px; font-weight: 600; color: black;
} .first-section p {
text-align: justify; font-size: 16px; color : #2F2F2F;
} .first-section .image-holder {
margin-top: 50px; overflow: hidden;
} .home-first-section {
color: #333333; position: relative; z-index: 18; padding: 0px; padding-bottom: 100px; padding-top: 40px; background-color: rgba(16,151,151,0.001); background-size: cover;
} .home-first-section h3 {
text-align: center; text-transform: uppercase; font-weight: 500; font-size: 24px; color: #981110;
} .home-first-section h2 {
text-align: center; color: #981119; font-weight: 400; margin: 0;
} .home-first-section p {
text-align: justify; font-size: 16px; color : #2F2F2F;
} .home-first-section .col-md-3 {
margin-top: 50px;
} .home-first-section h4 {
text-align: center; font-size: 16px; font-weight: 600;
} .home-first-section h5 {
font-size: 14; text-align: center; font-style: italic;
} .home-first-section img {
margin: 0 auto;
} .home-first-section .image-holder {
margin-top: 50px; overflow: hidden;
} .meet-section {
color: #333333; position: relative; z-index: 18; padding: 40px; padding-bottom: 100px; margin-top: -40px; background-color: #EBEBEB;
} .meet-section h4 {
text-align: center; color: #333333; font-size: 18px;
} .meet-section p {
font-style: italic; text-align: center; color: #333333; font-size: 16px;
} .prot-section {
color: #333333; position: relative; z-index: 17; padding: 20px ; margin-top: -86px; padding-bottom: 100px; background-color: #EBEBEB; background-size: cover;
} .prot-section h1 {
text-align: center; text-transform: uppercase; font-weight: 600; font-size: 26; font-color: #00003D;
} .prot-section h3 {
text-align: center; text-transform: uppercase; font-weight: 500; font-size: 24px; color: #000066;
} .prot-section h2 {
text-align: center; color: #333333; font-weight: 400; margin: 0;
} .prot-section h4 {
font-size: 16px; font-weight: 600;
} .prot-section p {
text-align: justify; font-size: 16px; color : #2F2F2F;
} .prot-section .panel {
padding-top: 40px; color: #333; background-color: white; border-color: #ddd; max-width: 90%; margin-left: auto; margin-right: auto;
} .prot-section .panel p {
margin-left: 5px; margin-right: 5px;
} .prot-section .panel h5 {
color: #9A9EA3; margin-left: 5px; font-size: 18px; font-weight: 500;
} .Notebook-section {
color: #333333; position: relative; z-index: 17; padding: 20px 0; margin-top: -86px; background-color: #EBEBEB; background-size: cover;
} .Notebook-section h2 {
text-align: center; color: #333333; font-weight: 400;
} .Notebook-section h4 {
font-size: 16px; font-weight: 600;
} .Notebook-section p {
text-align: justify; font-size: 16px; color : #2F2F2F;
} .second-section {
color: #333333; position: relative; z-index: 18; padding: 0px; padding-bottom: 100px; margin-top: -40px; background-color: #FFFFFF; background-size: cover;
} .second-section h3 {
text-align: center; text-transform: uppercase; font-weight: 500; font-size: 24px; color: #000066;
} .second-section h2 {
text-align: center; color: #191975; font-weight: 400; margin: 0;
} .second-section p {
text-align: justify; font-size: 16px; color : #2F2F2F;
} .second-section .col-md-3 {
margin-top: 50px;
} .second-section h4 {
text-align: center; font-size: 16px; font-weight: 600;
} .second-section h5 {
font-size: 14; text-align: center; font-style: italic;
} .second-section img {
margin: 0 auto;
} .second-section .image-holder {
margin-top: 50px; overflow: hidden;
} .third-section {
color: #fff; position: relative; z-index: 19; padding: 80px 0 20px 0; margin-top: -20px; background: url('https://static.igem.org/mediawiki/2015/d/d7/EPF_Lausanne_Bg3.png') no-repeat top center; background-size: cover;
} .third-section h2 {
text-align: center; color: #39c8e2; font-weight: 700; margin: 0;
} .third-section span {
display: block; margin-bottom: 30px;
} .third-section .col-md-6 {
margin-bottom: 60px;
} .third-section ol {
margin-bottom: 30px;
} .third-section ol li {
color: #39c8e2;
} .third-section ol li h4 {
font-size: 15px; margin: 0;
} .third-section ol li p {
margin: 0 0 20px 20px; color: #fff;
} .third-section ol li ol {
margin: 0 0 30px 20px;
} .third-section ol.no-color li {
color: #fff;
} .fourth-section {
color: #fff; position: relative; z-index: 19; padding: 100px 0; margin-top: -50px; background: url('https://static.igem.org/mediawiki/2015/9/9a/EPF_Lausanne_Banner1.png') no-repeat top center; background-size: cover; background-color: white;
} .fourth-section h2 {
font-size: 32px; color: black; text-transform: uppercase; font-weight: 700; margin: 0 0 20px 0; border: none;
} .fourth-section a {
font-size: 18px;
} .fourth-section a:hover {
color: #39c8e2;
} .sponsors {
color: black; position: relative; z-index: 19; padding: 10px; padding-bottom: 20px; background-size: cover; background-color: rgba(16,151,151,0.01); text-align: center;
} .sponsors h1 {
padding-top: 0px; font-size: 28px; text-transform: uppercase; font-weight: 600; border: none;
} .sponsors .logo {
padding: 1.5em 1.5em; display: inline-block; vertical-align: middle;
} .sponsors .logo img {
max-height: 150px; max-width: 150px;
} .whitebg { padding: 20px; text-align: justify; padding-top: 30px; box-shadow: 2px 2px 1px #888888; background-color: white; } .whitebg a.btn-primary { color: white !important; } .whitebg a.btn-primary:hover { color: white !important; } .whitebg blockquote.blockquote-reverse {
padding-right: 15px; padding-left: 0; margin-top: 40px; margin-bottom: 40px; text-align: right; border-right: 5px solid #39484B; border-left: 0; background-color: #f4f4f4; box-shadow: 10px 10px 20px #bbb;
} .whitebg blockquote.blockquote {
padding-left: 15px; padding-right: 0; margin-top: 40px; margin-bottom: 40px; text-align: left; border-left: 5px solid #39484B; border-right: 0; background-color: #f4f4f4; box-shadow: 10px 10px 20px #bbb;
} .whitebg ul li {
font-size: 18px !important; font-weight: 300; line-height: 1.4;
} .whitebg a, .whitebg a:visited, .whitebg a:active {
color: #649CD2 !important;
} .whitebg a:hover {
color: #A5D2DA !important;
} .page-h {
background: url('https://static.igem.org/mediawiki/2015/9/9a/EPF_Lausanne_Banner1.png') no-repeat bottom center; background-size: cover; padding: 60px 0;
} .page-h h3 {
color: black; font-size: 28px; text-transform: uppercase; font-weight: 600;
} .filter {
background: url('https://static.igem.org/mediawiki/2015/e/e6/EPF_Lausanne_Filterbg.png') no-repeat top center; background-size: cover; padding: 50px 0; margin-top: -60px;
} .filter ul {
padding: 0; margin: 0; list-style: none;
} .filter ul li {
display: inline-block; margin: 0 20px; color: #fff; cursor: pointer;
} .filter ul li.active {
color: #39c8e2;
} .products {
background: url('https://static.igem.org/mediawiki/2015/9/92/EPF_Lausanne_Productsbg.png') no-repeat top center; background-size: cover; padding: 120px 0 80px 0; margin-top: -40px;
} .products .thumb-p {
overflow: hidden; position: relative; -webkit-border-radius: 6px; -webkit-background-clip: padding-box; -moz-border-radius: 6px; -moz-background-clip: padding; border-radius: 6px; background-clip: padding-box;
} .products .thumb-p img {
width: 100%;
} .products .thumb-p .overlay-p {
background-color: #39c8e2; position: absolute; width: 100%; height: 100%; top: 0; left: 0; -webkit-border-radius: 6px; -webkit-background-clip: padding-box; -moz-border-radius: 6px; -moz-background-clip: padding; border-radius: 6px; background-clip: padding-box; -webkit-transform: scaleY(0); -moz-transform: scaleY(0); -o-transform: scaleY(0); -ms-transform: scaleY(0); transform: scaleY(0); -webkit-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out;
} .products .thumb-p .overlay-p a {
position: absolute; top: 50%; left: 50%; margin: -7px 0 0 -8px; font-size: 18px; color: #fff;
} .products .thumb-p:hover .overlay-p {
-webkit-transform: scaleY(1); -moz-transform: scaleY(1); -o-transform: scaleY(1); -ms-transform: scaleY(1); transform: scaleY(1);
} .products .content-p {
margin-bottom: 40px;
} .products .content-p h4 {
font-size: 16px; font-weight: 700; text-transform: uppercase; color: #000;
} .products .content-p span {
font-size: 12px; font-weight: 300; text-transform: uppercase; color: #000;
}
- Grid .mix {
display: none;
} button.main-button, .main-button {
background-color: #39c8e2; color: #fff; padding: 10px 15px; text-transform: uppercase; font-weight: 700; outline: 0; border: 0; -webkit-border-radius: 4px; -webkit-background-clip: padding-box; -moz-border-radius: 4px; -moz-background-clip: padding; border-radius: 4px; background-clip: padding-box;
} .contact {
background: url('https://static.igem.org/mediawiki/2015/9/92/EPF_Lausanne_Contactbg.png') no-repeat top center; background-size: cover; padding: 120px 0; margin-top: -55px;
} .contact fieldset {
margin-bottom: 30px;
} .contact fieldset input, .contact fieldset textarea {
width: 100%; min-width: 100%; max-width: 100%; background: rgba(250, 250, 250, 0.7); border: 1px solid #999; color: #777;
} .contact fieldset input:focus, .contact fieldset textarea:focus {
border: 1px solid #39c8e2; outline: 0;
} .contact fieldset textarea {
padding: 15px;
} .page-h.promotion {
padding-bottom: 100px;
} .video-featured {
background: url('https://static.igem.org/mediawiki/2015/2/25/EPF_Lausanne_Bg1.png') no-repeat top center; background-size: cover; padding: 160px 0; margin-top: -130px;
} .video-featured .video-holder {
overflow: hidden;
} .video-featured .video-holder iframe {
width: 100%;
} .promotion-s {
background: url('https://static.igem.org/mediawiki/2015/9/9a/EPF_Lausanne_Banner1.png') no-repeat top center; background-size: cover; padding: 180px 0 120px 0; margin-top: -120px;
} .product-left {
color: #444444; padding-right: 30px;
} .product-left h3 {
text-transform: uppercase; font-size: 18px; font-weight: 700;
} .product-left .product-image {
margin-right: 15px; float: left; overflow: hidden;
} .product-content {
overflow: hidden;
} .product-content h3 {
text-transform: uppercase; font-size: 18px; font-weight: 700;
} .product-right {
padding-left: 30px; color: #fff;
} .product-right .product-image {
float: right; overflow: hidden; margin-left: 15px;
} .fa-arrow-circle-down {
color: black;
} /* .site-footer {
position: relative; z-index: 19; padding: 100px 0 40px 0; margin-top: -70px; background: url('https://static.igem.org/mediawiki/2015/a/a7/EPF_Lausanne_Footerbg.png') no-repeat top center; background-size: cover;
} .site-footer ul.social {
width: 120px; height: 120px; overflow: hidden; padding: 0; margin: 0 auto; list-style: none; position: relative; background: url('https://static.igem.org/mediawiki/2015/3/3d/EPF_LausanneSocialbg.png') no-repeat center;
} .site-footer ul.social li {
display: inline-block; position: absolute;
} .site-footer ul.social li a {
width: 32px; height: 32px; text-align: center; line-height: 32px; -webkit-border-radius: 3px; -webkit-background-clip: padding-box; -moz-border-radius: 3px; -moz-background-clip: padding; border-radius: 3px; background-clip: padding-box; color: #fff;
} .site-footer ul.social li.facebook {
top: 0; left: 46px;
} .site-footer ul.social li.facebook a {
background-color: #4c66a4;
} .site-footer ul.social li.twitter {
top: 46px; left: 0;
} .site-footer ul.social li.twitter a {
background-color: #55acee;
} .site-footer ul.social li.linkedin {
top: 46px; left: 88px;
} .site-footer ul.social li.linkedin a {
background-color: #006699;
} .site-footer ul.social li.rss {
top: 88px; left: 46px;
} .site-footer ul.social li.rss a {
background-color: #fb6405;
} .site-footer p {
display: block;
}*/ /* Medium devices (desktops, 992px and up) */ @media (max-width: 992px) {
.slider-button { display: none; }
} /* Small devices (tablets, 768px and up) */ @media (max-width: 768px) {
.slider-caption { display: none; } .first-section { background-position: left; margin-top: -20px; } .contact form { margin-top: 60px; } .product-left { color: #fff; }
} /* ==========================================================================
Media Queries ========================================================================== */
ul.affix {
position: fixed; top: 20px; width: 25%; margin-right: 30px; padding-top: 50px;
}
ul.affix-top {
position: static;
}
ul.affix-bottom {
width: inherit; position: absolute; top: auto;
}
/* First level of nav */ .sidenav {
margin-bottom: 30px; padding-top: 10px; padding-bottom: 10px; border-radius: 5px;
}
/* All levels of nav */ .sidebar .nav > li > a {
display: block; color: #3A494C; padding: 5px 20px;
}
.sidebar .nav > li > a:hover, .sidebar .nav > li > a:focus {
text-decoration: none; background-color: #e5e3e9; border-left: 3px solid #109798; font-weight: bold;
} .sidebar .nav > .active > a, .sidebar .nav > .active:hover > a, .sidebar .nav > .active:focus > a {
font-weight: bold; color: #3A494C; background-color: transparent; border-left: 3px solid #109798;
}
/* Nav: second level */ .sidebar .nav .nav {
margin-bottom: 8px;
}
.sidebar .nav li a {
font-size: 100%;
}
.sidebar .nav .nav > li > a {
padding-top: 3px; padding-bottom: 3px; padding-left: 30px; font-size: 90%;
}
.fader {
position: relative; height: 240px; width: 240px; margin-right: auto; margin-left: auto;
}
.fader a:last-child img {
position: absolute; top: 0; left: 0; display: none; height: 240px; width: 240px;
}
- affix-nav li {
display: block;
}
.navbar {
-webkit-backface-visibility: hidden;
}
label {
display: inline;
}
.regular-checkbox {
display: none;
}
.regular-checkbox + label {
background-color: #fafafa; border: 1px solid #cacece; box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05); padding: 9px; border-radius: 3px; display: inline-block; position: relative;
}
.regular-checkbox + label:active, .regular-checkbox:checked + label:active {
box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}
.regular-checkbox:checked + label {
background-color: #e9ecee; border: 1px solid #adb8c0; box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1); color: #99a1a7;
}
.regular-checkbox:checked + label:after {
content: '\2714'; font-size: 14px; position: absolute; top: 0px; left: 3px; color: #99a1a7;
}
.big-checkbox + label {
padding: 18px;
}
.big-checkbox:checked + label:after {
font-size: 28px; left: 6px;
}
.home-first-section-test {
color: #333333; position: relative; z-index: 18; padding: 0px; padding-bottom: 100px; padding-top: 40px; background-color: rgba(16,151,151,0.001); background-size: cover;
} .home-first-section-test h1 {
text-align: center; text-transform: uppercase; font-weight: 700; font-size: 30px; color: #981110; border: none; letter-spacing: 10px; padding-bottom: 20px;
} .home-first-section-test a {
color: black;
} .home-first-section-test h2 {
text-align: center; color: #981119; font-weight: 400;
} .home-first-section-test p {
text-align: justify; font-size: 16px; color : #2F2F2F;
} .home-first-section-test h5 {
font-size: 14; text-align: center; font-style: italic;
} .home-first-section-test img {
margin: 0 auto;
} .home-first-section-test .image-holder {
margin-top: 50px; overflow: hidden;
}
/* =========================== */ .gradImg {
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 59%, rgba(0, 0, 0, 0.65) 100%); z-index: 10;
}