From 2014.igem.org
(Difference between revisions)
|
|
(21 intermediate revisions not shown) |
Line 1: |
Line 1: |
- | #contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
| |
- | display:none;}
| |
- | #top-section {
| |
- | border: none;
| |
- | height: 0px;}
| |
- | #content {
| |
- | border: none;}
| |
- |
| |
- | <script type="text/javascript">
| |
- | $(document).ready(function() {
| |
- | $("p").filter( function() {
| |
- | return $.trim($(this).html()) == '';
| |
- | }).remove()
| |
- | });
| |
- | </script>
| |
- |
| |
- |
| |
| | | |
| /*------------------------------------------------------ | | /*------------------------------------------------------ |
| FLEXSLIDER OVERRIDING | | FLEXSLIDER OVERRIDING |
| --------------------------------------------------------*/ | | --------------------------------------------------------*/ |
- | .flexslider { padding-top: 85px; margin-left: auto; | + | .flexslider { padding-top: 85px; } |
- | margin-right: auto;}
| + | |
| .flexslider a:hover, .flexslider a:focus { text-decoration: none; } | | .flexslider a:hover, .flexslider a:focus { text-decoration: none; } |
| .flexslider { border: none; -webkit-border-radius: 0; border-radius: 0; } | | .flexslider { border: none; -webkit-border-radius: 0; border-radius: 0; } |
Line 42: |
Line 24: |
| .arrow-box { position: relative; color: white; background-color: #e98714; border-radius: 4px; margin-left: 30px; height: 100%;} | | .arrow-box { position: relative; color: white; background-color: #e98714; border-radius: 4px; margin-left: 30px; height: 100%;} |
| .arrow-left { display: block; width: 30px; height: 58px; background: url(../images/left_arrow.png) no-repeat 0 0; position: absolute; left: 1px; margin-top: 20px; } | | .arrow-left { display: block; width: 30px; height: 58px; background: url(../images/left_arrow.png) no-repeat 0 0; position: absolute; left: 1px; margin-top: 20px; } |
- |
| |
- |
| |
| | | |
| | | |
Line 70: |
Line 50: |
| } | | } |
| | | |
- | body {
| + | /*------------------------------------------------------ |
- | background-image: url('img/bg.png');
| + | MEDIA QUERIES |
- | color: black;
| + | --------------------------------------------------------*/ |
- | font-size: 100%; /* Base font size: 12px */
| + | |
- | font-family: "Segoe UI", Frutiger, "Frutiger Linotype", "Dejavu Sans", "Helvetica Neue", Arial, sans-serif;
| + | |
- | line-height: 1;
| + | |
- | margin: 0;
| + | |
- | padding: 0;
| + | |
- | text-align: left;
| + | |
- | }
| + | |
- |
| + | |
- | .body {
| + | |
- | clear: both; | + | |
- | margin: 0 auto;
| + | |
- | width: 100%;
| + | |
- | }
| + | |
- | h2 {font-size: 1.571em} /* 22px */
| + | |
- | h3 {font-size: 1.429em} /* 20px */
| + | |
- | h4 {font-size: 1.286em} /* 18px */
| + | |
- | h5 {font-size: 1.143em} /* 16px */
| + | |
- | h6 {font-size: 1em} /* 14px */
| + | |
| | | |
- | h2, h3, h4, h5, h6 {
| |
- | font-weight: 400;
| |
- | line-height: 1.1;
| |
- | margin-bottom: .8em;
| |
- | color: black;
| |
- | }
| |
- |
| |
- | a {
| |
- | outline: 0;
| |
- | }
| |
- |
| |
- |
| |
- | a:link, a:visited {
| |
- | color: black;
| |
- | padding: 0 1px;
| |
- | text-decoration: none;
| |
- | }
| |
- |
| |
- | a:hover, a:active {
| |
- | background-color: #B9D3E3;
| |
- | color: #fff;
| |
- | text-decoration: none;
| |
- | }
| |
- |
| |
- | .mainHeader h1 {
| |
- | font-family: 'Comfortaa';
| |
- | font-weight: bold;
| |
- | font-style: normal;
| |
- | font-size: 400%;
| |
- | text-align: center;
| |
- | float: none;
| |
- | margin: 3% 0 3% 0;
| |
- | color: #1A1A80;
| |
- | }
| |
- |
| |
- | .mainHeader nav {
| |
- | background: #1A1A80;
| |
- | font-size: 1.143em;
| |
- | height: 40px;
| |
- | line-height: 30px;
| |
- | margin: 0 auto 30px auto;
| |
- | text-align: center;
| |
- | border-radius: 5px;
| |
- | -moz-border-radius: 5px;
| |
- | -webkit-border-radius: 5px;
| |
- | }
| |
- |
| |
- | .mainHeader nav ul {
| |
- | list-style: none;
| |
- | margin: 0 auto;
| |
- | }
| |
- |
| |
- | .mainHeader nav ul li {
| |
- | float: left;
| |
- | display: inline;
| |
- | }
| |
- |
| |
- | .mainHeader nav a:link, .mainHeader nav a:visited {
| |
- | font-family: 'Comfortaa';
| |
- | font-weight: bold;
| |
- | font-style: normal;
| |
- | text-transform: uppercase;
| |
- | color: #FFFFFF;
| |
- | display: inline-block;
| |
- | height: 30px;
| |
- | padding: 5px 23px;
| |
- | text-decoration: none;
| |
- | }
| |
- | .mainHeader nav a:hover, .mainHeader nav a:active,
| |
- | .mainHeader nav .active a:link, .mainHeader nav .active a:visited {
| |
- | background: #B9D3E3;
| |
- | color: #FFFFFF;
| |
- | text-shadow: none !important;
| |
- | }
| |
- |
| |
- | .mainHeader nav li a {
| |
- | border-radius: 5px;
| |
- | -moz-border-radius: 5px;
| |
- | -webkit-border-radius: 5px;
| |
- | }
| |
- |
| |
- | .sciencephoto img{
| |
- | width: 800px;
| |
- | height: auto;
| |
- | display: block;
| |
- | margin-left: auto;
| |
- | margin-right: auto;
| |
- | }
| |
- |
| |
- | .sciencedescription {
| |
- | position:absolute;
| |
- | top:680px;
| |
- | left:88px;
| |
- | width:800px;
| |
- | background-color: #4682B4;
| |
- | font-size:28px;
| |
- | color:white;
| |
- | opacity:0.7;
| |
- | filter:alpha(opacity=70);
| |
- | }
| |
- |
| |
- | .home_leftcontent {
| |
- | background-color: #ADD8E6;
| |
- | border-radius: 5px;
| |
- | -moz-border-radius: 5px;
| |
- | -webkit-border-radius: 5px;
| |
- | padding: 3% 5%;
| |
- | margin: 2% 1% 2% 3%;
| |
- | float: left;
| |
- | width: 35%;
| |
- | font-size:24px;
| |
- | }
| |
- |
| |
- | .home_leftcontent a {
| |
- | color:#000080;
| |
- | font-style: italic;
| |
- | }
| |
- |
| |
- | .home_rightcontent {
| |
- | background-color: #ADD8E6;
| |
- | border-radius: 5px;
| |
- | -moz-border-radius: 5px;
| |
- | -webkit-border-radius: 5px;
| |
- | padding: 3% 5%;
| |
- | margin: 2% 3% 2% 1%;
| |
- | float: right;
| |
- | width: 35%;
| |
- | font-size:24px;
| |
- | }
| |
- |
| |
- | .home_rightcontent a {
| |
- | color:#000080;
| |
- | font-style: italic;
| |
- | }
| |
- |
| |
- | @media only screen and (min-width : 150px) and (max-width : 780px)
| |
- | {
| |
- | .body {
| |
- | clear: both;
| |
- | margin: 0 auto;
| |
- | width: 90%;
| |
- | font-size: 90%;
| |
- | }
| |
- |
| |
- | .mainHeader nav {
| |
- | background:#1A1A80;
| |
- | font-size: 1.143em;
| |
- | height: 160px;
| |
- | line-height: 30px;
| |
- | margin-bottom: 0;
| |
- | border-radius: 5px;
| |
- | -moz-border-radius: 5px;
| |
- | -webkit-border-radius: 5px;
| |
- | }
| |
- |
| |
- | .mainHeader nav ul {
| |
- | list-style: none;
| |
- | margin: 0 auto;
| |
- | padding-left: 0;
| |
- | }
| |
- |
| |
- | .mainHeader nav li {
| |
- | margin-left: 0 auto;
| |
- | width: 100%;
| |
- | }
| |
- |
| |
- | .mainHeader nav a:link, .mainHeader nav a:visited {
| |
- | color: #FFF;
| |
- | display: block;
| |
- | height: 30px;
| |
- | padding: 5px 0;
| |
- | text-decoration: none;
| |
- | }
| |
- |
| |
- | .mainHeader nav a:active,
| |
- | .mainHeader nav .active a:link, .mainHeader nav .active a:visited {
| |
- | background: #CF5C3F;
| |
- | color: #fff;
| |
- | text-shadow: none !important;
| |
- | }
| |
- |
| |
- | .mainHeader nav li a {
| |
- | border-radius: 5px;
| |
- | -moz-border-radius: 5px;
| |
- | -webkit-border-radius: 5px;
| |
- |
| |
- | border-radius: 5px;
| |
- | -moz-border-radius: 5px;
| |
- | -webkit-border-radius: 5px;
| |
- | }
| |
- |
| |
- | .mainHeader img {
| |
- | width: 68%;
| |
- | height: auto;
| |
- | }
| |
- |
| |
- | .Foot {
| |
- | width: 100%;
| |
- | float: left;
| |
- | margin: 2% 0;
| |
- | padding-left: 0;
| |
- | background-color: #B9D3E3;
| |
- | border-radius: 5px;
| |
- | -moz-border-radius: 5px;
| |
- | -webkit-border-radius: 5px;
| |
- | color: #FFF;
| |
- | }
| |
- |
| |
- | .Foot p {
| |
- | font-family:'Comfortaa';
| |
- | font-style: normal;
| |
- | width: 86%;
| |
- | margin: 2% auto;
| |
- | }
| |
- |
| |
- | .project_describe{
| |
- | background-color: #ADD8E6;
| |
- | border-radius: 5px;
| |
- | -moz-border-radius: 5px;
| |
- | -webkit-border-radius: 5px;
| |
- | padding: 3% 5%;
| |
- | margin-bottom: 3%;
| |
- | float: left;
| |
- | width: 40%;
| |
- | justify-content: space-around;
| |
- |
| |
- | }
| |
- |
| |
- | .project_methods{
| |
- |
| |
- |
| |
- | }
| |
- |
| |
- | .project_success{
| |
- |
| |
- |
| |
- | }
| |
- |
| |
- |
| |
- |
| |
- | }
| |
| | | |
| .sciencephoto img{ | | .sciencephoto img{ |
Latest revision as of 01:12, 18 October 2014
/*------------------------------------------------------
FLEXSLIDER OVERRIDING
*/
.flexslider { padding-top: 85px; }
.flexslider a:hover, .flexslider a:focus { text-decoration: none; }
.flexslider { border: none; -webkit-border-radius: 0; border-radius: 0; }
.flexslider .slides li { position: relative; }
.flex-caption {
position:absolute;
left:0;
right:0;
bottom:0;
color: white;
background:rgba(197,82,87,.8);
z-index:1;
padding: 20px;
margin: 0;
width: 75%;
}
/*http://cssarrowplease.com/*/
.arrow-box { position: relative; color: white; background-color: #e98714; border-radius: 4px; margin-left: 30px; height: 100%;}
.arrow-left { display: block; width: 30px; height: 58px; background: url(../images/left_arrow.png) no-repeat 0 0; position: absolute; left: 1px; margin-top: 20px; }
/*------------------------------------------------------
BOOTSTRAP OVERRIDING
*/
.col-md-4, .col-md-5, .col-md-7, .col-md-8 { padding: 0; }
.btn-primary {
font-size: 2em;
padding-bottom: 10px;
background-color: rgb( 226, 90, 148 );
box-shadow: 0px 3px 0px 0px rgb( 180, 52, 107 );
width: 160px;
height: 55px;
border: none; border-radius: 0px;
-moz-transition: background-color .5s ease;
-o-transition: background-color .5s ease;
-webkit-transition: background-color .5s ease;
transition: background-color .5s ease;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active {
background-color: rgb( 180, 52, 107 );
box-shadow: 0px 3px 0px 0px rgb( 226, 90, 148 );
}
/*------------------------------------------------------
MEDIA QUERIES
*/
.sciencephoto img{
width: 800px;
height: auto;
display: block;
margin-left: auto;
margin-right: auto;
}
.sciencedescription {
position:absolute;
top:680px;
left:88px;
width:800px;
background-color: #4682B4;
font-size:28px;
color:white;
opacity:0.7;
filter:alpha(opacity=70);
}