Team:UESTC/style.css
From 2013.igem.org
(30 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
+ | .panel { | ||
+ | max-width: 1400px; | ||
+ | } | ||
/* | /* | ||
nav style | nav style | ||
Line 32: | Line 35: | ||
background:#EC6100; | background:#EC6100; | ||
height: 45px; | height: 45px; | ||
- | font: | + | font:22px/1em BuxtonSketch,arial,verdana; |
} | } | ||
.nav:before, | .nav:before, | ||
Line 116: | Line 119: | ||
home part style | home part style | ||
*/ | */ | ||
+ | .gwd-gen-f18lgwdanimation { | ||
+ | -webkit-animation: gwd-gen-f18lgwdanimation_gwd-keyframes 1.2s linear 0s 1 forwards; | ||
+ | } | ||
+ | .gwd-div-vixx { | ||
+ | -webkit-transform-style: preserve-3d; | ||
+ | -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, -418, 0, 1); | ||
+ | } | ||
+ | @-webkit-keyframes gwd-gen-f18lgwdanimation_gwd-keyframes { | ||
+ | 0% { | ||
+ | -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, -418, 0, 1); | ||
+ | -webkit-animation-timing-function: linear; | ||
+ | } | ||
+ | 100% { | ||
+ | -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); | ||
+ | -webkit-animation-timing-function: linear; | ||
+ | } | ||
+ | } | ||
#home { | #home { | ||
height: 560px; | height: 560px; | ||
Line 134: | Line 154: | ||
margin:0 auto; | margin:0 auto; | ||
position:relative; | position:relative; | ||
- | top: | + | top:90px; |
z-index:10; | z-index:10; | ||
} | } | ||
Line 179: | Line 199: | ||
width: 46.875%; /* 600/1280 */ | width: 46.875%; /* 600/1280 */ | ||
position:relative; | position:relative; | ||
- | top:- | + | top:-25px; |
margin:0 auto; | margin:0 auto; | ||
- | font: 1.8em BuxtonSketch,arial,verdana; | + | font: 27px/1.8em BuxtonSketch,arial,verdana; |
z-index:5; | z-index:5; | ||
text-align:center; | text-align:center; | ||
Line 220: | Line 240: | ||
} | } | ||
.fadeFromBottom h1 { | .fadeFromBottom h1 { | ||
- | font: 2em arial,verdana; | + | font: 28px/2em arial,verdana; |
color:white; | color:white; | ||
} | } | ||
Line 234: | Line 254: | ||
#transpeeder { | #transpeeder { | ||
background: url(https://static.igem.org/mediawiki/2013/e/e5/UESTC-bg3.jpg) | background: url(https://static.igem.org/mediawiki/2013/e/e5/UESTC-bg3.jpg) | ||
+ | } | ||
+ | #ibricks { | ||
+ | background-color: #66CCFF; | ||
} | } | ||
.proj_info { | .proj_info { | ||
Line 240: | Line 263: | ||
text-align: justify; | text-align: justify; | ||
margin: 0 auto; | margin: 0 auto; | ||
- | font: 1. | + | font: 18px/1.5em museo100regular, arial,verdana; |
} | } | ||
.proj_info .red { | .proj_info .red { | ||
Line 253: | Line 276: | ||
} | } | ||
.proj_pic span { | .proj_pic span { | ||
- | font: 0.6em arial,verdana; | + | font: 0.6em museo100regular, arial,verdana; |
margin: 0 auto; | margin: 0 auto; | ||
+ | display: block; | ||
+ | width:130px; | ||
} | } | ||
.nebula-pic { | .nebula-pic { | ||
Line 262: | Line 287: | ||
padding: 10px; | padding: 10px; | ||
float:left; | float:left; | ||
- | font: 0.6em arial,verdana; | + | font: 0.6em museo100regular, arial,verdana; |
} | } | ||
.nebula-pic span { | .nebula-pic span { | ||
Line 276: | Line 301: | ||
width:58.25%; | width:58.25%; | ||
height: auto; | height: auto; | ||
- | font: 0.6em arial,verdana; | + | font: 0.6em museo100regular, arial,verdana; |
} | } | ||
.nebula-pic-promoter span { | .nebula-pic-promoter span { | ||
margin: 0 auto; | margin: 0 auto; | ||
display: block; | display: block; | ||
- | width: | + | width: 253px; |
} | } | ||
.nebula-pic-cds { | .nebula-pic-cds { | ||
width: 65%; | width: 65%; | ||
height: auto; | height: auto; | ||
- | font: 0.6em arial,verdana; | + | font: 0.6em museo100regular, arial,verdana; |
padding: 10px; | padding: 10px; | ||
+ | } | ||
+ | .nebula-pic-cds span { | ||
+ | margin: 0 auto; | ||
+ | display: block; | ||
+ | width: 215px; | ||
} | } | ||
.nebula-pic-terminator { | .nebula-pic-terminator { | ||
width: 39%; | width: 39%; | ||
height: auto; | height: auto; | ||
- | font: 0.6em arial,verdana; | + | font: 0.6em museo100regular, arial,verdana; |
padding: 10px; | padding: 10px; | ||
+ | } | ||
+ | .nebula-pic-terminator span { | ||
+ | margin: 0 auto; | ||
+ | display: block; | ||
+ | width: 260px; | ||
} | } | ||
.nebula-pic-devices { | .nebula-pic-devices { | ||
width: 39%; | width: 39%; | ||
height: auto; | height: auto; | ||
- | font: 0.6em arial,verdana; | + | font: 0.6em museo100regular, arial,verdana; |
padding: 10px; | padding: 10px; | ||
+ | } | ||
+ | .nebula-pic-devices span { | ||
+ | margin: 0 auto; | ||
+ | display: block; | ||
+ | width: 232px; | ||
} | } | ||
.nebula-pic-rank { | .nebula-pic-rank { | ||
width: 47.875%; | width: 47.875%; | ||
height:auto; | height:auto; | ||
- | font: 0.6em arial,verdana; | + | font: 0.6em museo100regular, arial,verdana; |
padding: 10px; | padding: 10px; | ||
+ | } | ||
+ | .nebula-pic-rank span { | ||
+ | margin: 0 auto; | ||
+ | display: block; | ||
+ | width: 175px; | ||
} | } | ||
.transpeeder-online { | .transpeeder-online { | ||
width: 57.875%; | width: 57.875%; | ||
height:auto; | height:auto; | ||
- | font: 0.6em arial,verdana; | + | font: 0.6em museo100regular, arial,verdana; |
padding: 10px; | padding: 10px; | ||
+ | } | ||
+ | .transpeeder-online span { | ||
+ | margin: 0 auto; | ||
+ | display: block; | ||
+ | width: 140px; | ||
} | } | ||
.transpeeder-desktop { | .transpeeder-desktop { | ||
width: 46.875%; | width: 46.875%; | ||
height:auto; | height:auto; | ||
- | font: 0.6em arial,verdana; | + | font: 0.6em museo100regular, arial,verdana; |
padding: 10px; | padding: 10px; | ||
+ | } | ||
+ | .transpeeder-desktop span { | ||
+ | margin: 0 auto; | ||
+ | display: block; | ||
+ | width: 150px; | ||
} | } | ||
.transpeeder-exp { | .transpeeder-exp { | ||
width: 46.875%; | width: 46.875%; | ||
height: auto; | height: auto; | ||
- | font: 0.6em arial,verdana; | + | font: 0.6em museo100regular, arial,verdana; |
padding: 10px; | padding: 10px; | ||
+ | } | ||
+ | .transpeeder-exp span { | ||
+ | margin: 0 auto; | ||
+ | display: block; | ||
+ | width: 165px; | ||
} | } | ||
/* | /* | ||
Line 339: | Line 399: | ||
text-align: justify; | text-align: justify; | ||
margin: 0 auto; | margin: 0 auto; | ||
- | font: 1. | + | font: 18px/1.5em museo100regular, arial,verdana; |
color:white; | color:white; | ||
} | } | ||
#greetings h1 { | #greetings h1 { | ||
color: white; | color: white; | ||
- | font: 2.0em arial,verdana; | + | font: 2.0em museo100regular, arial,verdana; |
} | } | ||
Line 354: | Line 414: | ||
} | } | ||
.mem_panel h1 { | .mem_panel h1 { | ||
- | font: 2.0em arial,verdana; | + | font: 25px/2.0em museo100regular, arial,verdana; |
color: white; | color: white; | ||
} | } | ||
.mem_list { | .mem_list { | ||
- | |||
padding: 0; | padding: 0; | ||
list-style-type: none; | list-style-type: none; | ||
Line 367: | Line 426: | ||
display: block; | display: block; | ||
width:150px; | width:150px; | ||
- | margin:0.8em | + | margin:0.8em 2em; |
height:auto; | height:auto; | ||
float:left; | float:left; | ||
Line 374: | Line 433: | ||
.mem_list li span { | .mem_list li span { | ||
margin: 0 auto; | margin: 0 auto; | ||
- | font: 1.0em arial,verdana; | + | font: 12px/1.0em museo100regular, arial,verdana; |
color:white; | color:white; | ||
} | } | ||
#student_members { | #student_members { | ||
- | height: | + | height: 510px; |
} | } | ||
#advisors { | #advisors { | ||
Line 401: | Line 460: | ||
margin: 0 auto; | margin: 0 auto; | ||
height: 160px; | height: 160px; | ||
- | font: 1.2em arial,verdana; | + | font: 16px/1.2em museo100regular, arial,verdana; |
color: white; | color: white; | ||
} | } | ||
#contact h1 { | #contact h1 { | ||
- | font: 2.0em arial,verdana; | + | font: 25px/2.0em museo100regular, arial,verdana; |
color: white; | color: white; | ||
} | } | ||
Line 438: | Line 497: | ||
text-align: justify; | text-align: justify; | ||
margin: 0 auto; | margin: 0 auto; | ||
- | font: 1. | + | font: 18px/1.5em museo100regular, arial,verdana; |
} | } | ||
#medal_standard span { | #medal_standard span { | ||
Line 463: | Line 522: | ||
text-align: justify; | text-align: justify; | ||
margin: 0 auto; | margin: 0 auto; | ||
- | font: 1. | + | font: 18px/1.5em museo100regular, arial,verdana; |
margin-bottom:20px; | margin-bottom:20px; | ||
} | } | ||
Line 478: | Line 537: | ||
#photo_gallery { | #photo_gallery { | ||
width: 80%; | width: 80%; | ||
- | height: | + | height: 668px; |
margin: 0 auto; | margin: 0 auto; | ||
} | } | ||
#photo_gallery h1 { | #photo_gallery h1 { | ||
- | font: 2.5em arial,verdana; | + | font: 2.5em museo100regular, arial,verdana; |
} | } | ||
#photo_gallery span { | #photo_gallery span { | ||
- | font: 1.2em arial,verdana; | + | font: 12px/1.2em museo100regular, arial,verdana; |
color:red; | color:red; | ||
display: block; | display: block; | ||
- | width: | + | width: 245px; |
height: auto; | height: auto; | ||
position: relative; | position: relative; | ||
Line 504: | Line 563: | ||
display: block; | display: block; | ||
width: 150px; | width: 150px; | ||
- | margin: 0.8em | + | margin: 0.8em 2em; |
float: left; | float: left; | ||
z-index: 0; | z-index: 0; | ||
} | } | ||
- | + | /* | |
+ | * #safety style | ||
+ | */ | ||
+ | #safety { | ||
+ | position:relative; | ||
+ | top:-20px; | ||
+ | height: auto; | ||
+ | background-color:#99D8F6; | ||
+ | } | ||
+ | #safety-form { | ||
+ | width: 80%; | ||
+ | height: auto; | ||
+ | margin: 0 auto; | ||
+ | font: 18px/1.5em museo100regular, arial,verdana; | ||
+ | } | ||
+ | #safety-form span { | ||
+ | color: #0000FF; | ||
+ | } | ||
+ | /* | ||
+ | * #parts-submission style | ||
+ | */ | ||
+ | #my-parts-submission { | ||
+ | position:relative; | ||
+ | top:-30px; | ||
+ | height: auto; | ||
+ | background-color:#99D8F6; | ||
+ | } | ||
+ | #submission { | ||
+ | width: 80%; | ||
+ | height: auto; | ||
+ | margin: 0 auto; | ||
+ | font: 18px/1.5em museo100regular, arial,verdana; | ||
+ | padding-bottom: 30px; | ||
+ | } | ||
/* | /* | ||
#main_footer style | #main_footer style | ||
Line 515: | Line 607: | ||
position:relative; | position:relative; | ||
top:-20px; | top:-20px; | ||
- | height: | + | height: auto; |
background-color: #59493F; | background-color: #59493F; | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
} | } | ||
#main_footer #footer_head_1 { | #main_footer #footer_head_1 { | ||
Line 530: | Line 616: | ||
top: 27px; | top: 27px; | ||
left: 13%; | left: 13%; | ||
- | font: 2.5em arial,verdana; | + | font: 2.5em museo100regular, arial,verdana; |
color:white; | color:white; | ||
} | } | ||
Line 538: | Line 624: | ||
height:100px; | height:100px; | ||
position: relative; | position: relative; | ||
- | top: | + | top: 80px; |
left: 13%; | left: 13%; | ||
- | font: 2.5em arial,verdana; | + | font: 2.5em museo100regular, arial,verdana; |
color: white; | color: white; | ||
} | } | ||
Line 549: | Line 635: | ||
top: 43px; | top: 43px; | ||
left: 13%; | left: 13%; | ||
- | font: 1.5em arial,verdana; | + | font: 1.5em museo100regular, arial,verdana; |
color: white; | color: white; | ||
} | } | ||
Line 555: | Line 641: | ||
position: relative; | position: relative; | ||
height:150px; | height:150px; | ||
- | top: | + | top: 45px; |
} | } | ||
#thanks_org { | #thanks_org { | ||
position: relative; | position: relative; | ||
height:120px; | height:120px; | ||
- | top: | + | top: 76px; |
} | } | ||
#thanks_org .mem_list li { | #thanks_org .mem_list li { | ||
Line 635: | Line 721: | ||
} | } | ||
} | } | ||
+ | |||
@media screen and (max-width:993px) { | @media screen and (max-width:993px) { | ||
#footer-box { | #footer-box { |
Latest revision as of 13:56, 26 October 2013
.panel { max-width: 1400px; } /*
nav style */
nav{ position:fixed; z-index: 50; top:15px;
width:100%; height:45px; background-color:#EC6100; left:0%; text-align:center;
} .toggleMenu {
display: none; background-color:#EC6100; padding: 10px 15px; color: #fff; position: absolute; top: -30px; left: 0px; font:1.6em BuxtonSketch,arial,verdana; color:white;
} .nav {
position:relative; top:0px; display: inline-block; margin:0px; padding:0px; list-style: none; background:#EC6100; height: 45px; font:22px/1em BuxtonSketch,arial,verdana;
} .nav:before, .nav:after {
content: " "; display: block;
} .nav:after {
clear: both;
} .nav ul {
list-style: none; width: 9em;
} .nav a {
padding: 10px 15px; color:#fff;
}
.nav li {
position: relative;
} .nav > li {
float: left; border-top: 1px solid #EC6100;
} .nav > li > .parent {
background-image: url('https://static.igem.org/mediawiki/2013/1/12/UESTC_downArrow.png'); background-repeat: no-repeat; background-position: right;
} .nav > li > a {
display: block;
} .nav li ul {
position: absolute; left: -9999px;
} .nav > li.hover > ul {
left: 0; top:30px;
} .nav li li.hover ul {
left: 100%; top: 0;
} .nav li li li a {
background:#EC6100; z-index:200; border-top: 1px solid #1d7a62;
}
.nav ul {
padding:0; width:110px; background-color:#EC6100; border:1px solid #7788aa;
} .part {
background-color: white; width: 100%; height: auto;
} /*
projects nav style */
- nav_proj {
width: 100%; height: 100px; z-index:50; background-color:white;
} /*
notebook nav style */
- nav_notebook {
height: 250px; z-index: 50; background-color:white;
} /*
home part style */ .gwd-gen-f18lgwdanimation { -webkit-animation: gwd-gen-f18lgwdanimation_gwd-keyframes 1.2s linear 0s 1 forwards; } .gwd-div-vixx { -webkit-transform-style: preserve-3d; -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, -418, 0, 1); } @-webkit-keyframes gwd-gen-f18lgwdanimation_gwd-keyframes { 0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, -418, 0, 1); -webkit-animation-timing-function: linear; } 100% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); -webkit-animation-timing-function: linear; } }
- home {
height: 560px; background-color:#0EA6EA;
background:-webkit-gradient(linear,left top,left bottom,from(#0EA6EA),to(#F8FCFE)); background:-ms-gradient(linear,left top,left bottom,from(#0EA6EA),to(#F8FCFE)); background:gradient(linear,left top,left bottom,from(#0EA6EA),to(#F8FCFE)); background:-moz-linear-gradient(top,#0EA6EA,#F8FCFE); background:-0-linear-gradient(top,#0EA6EA,#F8FCFE); background:linear-gradient(top,#0EA6EA,#F8FCFE); filter: progid:DXImageTransform.Microsoft.gradient(enabled='false',startColorstr='#0EA6EA',endColorstr='#F8FCFE'); -ms-filter:"progid:DXImageTransform.Microsoft.gradient(enabled='false',startColorstr='#0EA6EA',endColorstr='#F8FCFE')";
z-index:0;
}
- logo {
height: 150px; width:46.875%;/* 600/1280 */ margin:0 auto; position:relative; top:90px; z-index:10;
}
#logo #team_logo { float: left; } #logo #igem_logo { float: right; }
/*
moving cloud style */
- experiment{
position: relative; top:0px; height:200px; z-index: 5; }
- background {
background: url('https://2013.igem.org/File:Cloud_back.png') repeat-x;
background: url('https://static.igem.org/mediawiki/2013/7/70/UESTC_cloud2.png') 5% 5%, url('https://static.igem.org/mediawiki/2013/3/33/Cloud_front.jpg') 50% 50%, url('https://2013.igem.org/File:Cloud_back.png') 90% 110% repeat-x; top: -136px; left: 0; right: 0; position:absolute; -webkit-transition: left 300s linear; -moz-transition: left 300s linear; -o-transition: left 300s linear; -ms-transition: left 300s linear; transition: left 300s linear; z-index: 5; height:275px;
}
body:target #background {
left: -5000px;
}
body:hover #background {
left: -9999px;
}
- hi {
height: auto; width: 46.875%; /* 600/1280 */ position:relative; top:-25px; margin:0 auto; font: 27px/1.8em BuxtonSketch,arial,verdana; z-index:5; text-align:center;
}
- team_photo {
position:relative; top: -56px; display:block; margin:0 auto; z-index:5;
} /*
responsive pic */
img {
max-width: 100%;
}
- project {
height: 700px; background-color:orange; z-index:1;
}
#project .line { position:relative; top:683px; height:18px; background: url() repeat-x; }
/*
project slideshow style */
- camera_wrap_1 {
max-width: 1280px; max-height: 720px; width:95%; margin: 0 2.25%; z-index:5;
}
.fadeFromBottom h1 { font: 28px/2em arial,verdana; color:white; } .fadeFromBottom span { color: red; }
/*
project style * */
- nebula {
background: url(); }
- transpeeder {
background: url() }
- ibricks {
background-color: #66CCFF; } .proj_info { height: auto; width: 80%; text-align: justify; margin: 0 auto; font: 18px/1.5em museo100regular, arial,verdana; } .proj_info .red { color: red; } .proj_pic { width: 24.0742%; height: auto; margin: 0 auto; float: left; padding: 10px; } .proj_pic span { font: 0.6em museo100regular, arial,verdana; margin: 0 auto; display: block; width:130px; } .nebula-pic { width: 39.25%; height: auto; margin: 0 auto; padding: 10px; float:left; font: 0.6em museo100regular, arial,verdana; } .nebula-pic span { margin: 0 auto; display: block; width:110px; } .nebula-pic-block { width: 100%; height:300px; } .nebula-pic-promoter { width:58.25%; height: auto; font: 0.6em museo100regular, arial,verdana; } .nebula-pic-promoter span { margin: 0 auto; display: block; width: 253px; } .nebula-pic-cds { width: 65%; height: auto; font: 0.6em museo100regular, arial,verdana; padding: 10px; } .nebula-pic-cds span { margin: 0 auto; display: block; width: 215px; } .nebula-pic-terminator { width: 39%; height: auto; font: 0.6em museo100regular, arial,verdana; padding: 10px;
} .nebula-pic-terminator span { margin: 0 auto; display: block; width: 260px; } .nebula-pic-devices { width: 39%; height: auto; font: 0.6em museo100regular, arial,verdana; padding: 10px;
} .nebula-pic-devices span { margin: 0 auto; display: block; width: 232px; } .nebula-pic-rank { width: 47.875%; height:auto; font: 0.6em museo100regular, arial,verdana; padding: 10px; } .nebula-pic-rank span { margin: 0 auto; display: block; width: 175px; } .transpeeder-online { width: 57.875%; height:auto; font: 0.6em museo100regular, arial,verdana; padding: 10px; } .transpeeder-online span { margin: 0 auto; display: block; width: 140px; } .transpeeder-desktop { width: 46.875%; height:auto; font: 0.6em museo100regular, arial,verdana; padding: 10px; } .transpeeder-desktop span { margin: 0 auto; display: block; width: 150px; } .transpeeder-exp { width: 46.875%; height: auto; font: 0.6em museo100regular, arial,verdana; padding: 10px; } .transpeeder-exp span { margin: 0 auto; display: block; width: 165px; } /*
team info style */
- team_info {
height: auto; background:url() #1B1B1B;
}
- greetings {
width: 80%; height: auto; text-align: justify; margin: 0 auto; font: 18px/1.5em museo100regular, arial,verdana; color:white;
}
#greetings h1 { color: white; font: 2.0em museo100regular, arial,verdana; }
.mem_panel {
width: 80%; height: auto; display: block; margin: 0 auto;
}
.mem_panel h1 { font: 25px/2.0em museo100regular, arial,verdana; color: white; } .mem_list { padding: 0; list-style-type: none; overflow: visible; text-align:center; } .mem_list li { display: block; width:150px; margin:0.8em 2em; height:auto; float:left; z-index:0; } .mem_list li span { margin: 0 auto; font: 12px/1.0em museo100regular, arial,verdana; color:white; }
- student_members {
height: 510px;
}
- advisors {
height: 290px;
}
- instructors {
height: 290px;
} .show {
position: relative; top: 150px; left: 150px;
} .show_content {
z-index: 5;
} /*
contact us style */
- contact {
width: 80%; margin: 0 auto; height: 160px; font: 16px/1.2em museo100regular, arial,verdana; color: white;
}
- contact h1 {
font: 25px/2.0em museo100regular, arial,verdana; color: white;
}
/*
notebook style */
- notebook {
height: auto; background:url();
}
- container {
height: 600px;
}
- container nav {
width: auto; height: auto; background-color: white;
}
/*
mf style */
- mf {
height: auto; background:url();
}
- medal_standard {
width: 80%; height: auto; text-align: justify; margin: 0 auto;
font: 18px/1.5em museo100regular, arial,verdana;
}
- medal_standard span {
color: red; } /*
human practice style */
- hp {
height: auto; background-color: #99D8F6; background: -webkit-gradient(linear,left top,left bottom,from(#FFFFFF),to(#99D8F6)); background: -ms-gradient(linear,left top,left bottom,from(#FFFFFF),to(#99D8F6)); background: gradient(linear,left top,left bottom,from(#FFFFFF),to(#99D8F6)); background: -moz-linear-gradient(top,#FFFFFF,#99D8F6); background: -0-linear-gradient(top,#FFFFFF,#99D8F6); background: linear-gradient(top,#FFFFFF,#99D8F6); filter: progid:DXImageTransform.Microsoft.gradient(enabled='false',startColorstr='#FFFFFF',endColorstr='#99D8F6'); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled='false',startColorstr='#FFFFFF',endColorstr='#99D8F6')";
}
- action_info {
width: 80%; height: auto; text-align: justify; margin: 0 auto; font: 18px/1.5em museo100regular, arial,verdana; margin-bottom:20px;
} /*
#pg style */
- pg {
position:relative; top:-20px; height: auto; background-color:#99D8F6;
}
- photo_gallery {
width: 80%; height: 668px; margin: 0 auto;
}
#photo_gallery h1 { font: 2.5em museo100regular, arial,verdana; } #photo_gallery span { font: 12px/1.2em museo100regular, arial,verdana; color:red; display: block; width: 245px; height: auto; position: relative; top: 0px; left: 0px; }
.gallery {
margin: 0 0 5em; padding: 0; list-style-type: none; overflow: visible; height: auto;
}
.gallery li { display: block; width: 150px; margin: 0.8em 2em; float: left; z-index: 0; }
/*
* #safety style */
- safety {
position:relative;
top:-20px; height: auto; background-color:#99D8F6;
}
- safety-form {
width: 80%;
height: auto; margin: 0 auto; font: 18px/1.5em museo100regular, arial,verdana;
}
- safety-form span {
color: #0000FF; } /*
* #parts-submission style */
- my-parts-submission {
position:relative;
top:-30px; height: auto; background-color:#99D8F6;
}
- submission {
width: 80%;
height: auto; margin: 0 auto; font: 18px/1.5em museo100regular, arial,verdana; padding-bottom: 30px;
} /*
#main_footer style */
- main_footer {
position:relative; top:-20px; height: auto; background-color: #59493F;
}
#main_footer #footer_head_1 { display: block; width:80%; position: relative; top: 27px; left: 13%; font: 2.5em museo100regular, arial,verdana; color:white; } #main_footer #footer_head_2 { display: block; width: 68%; height:100px; position: relative; top: 80px; left: 13%; font: 2.5em museo100regular, arial,verdana; color: white; } #main_footer #footer_p { display: block; width: 80%; position: relative; top: 43px; left: 13%; font: 1.5em museo100regular, arial,verdana; color: white; }
- thanks_people {
position: relative; height:150px; top: 45px;
}
- thanks_org {
position: relative; height:120px; top: 76px;
}
- thanks_org .mem_list li {
display: block; width:250px; margin:0.8em 3em; height:auto; float:left; z-index:0; }
/*
some media queries */
@media screen and (min-width:1011px) and (max-width:1150px) {
/* change in #team_info */ .mem_list li { margin: 0.8em 2em; } #student_members { height: 482px; } #school_StreetView { width: 100%; } /* change in #team_photo */ #team_photo { top: -65px; }
/* change in #pg */ .gallery li{ margin: 0.8em 1em; }
} @media screen and (max-width:1010px) {
/* change in #home */ #hi { width: 51.875%; } /* change in #project */ #project { height: 567px; } #project .line { top: 550px; } /* change in #team_info */ .mem_list li { margin: 0.8em 1em; } #school_StreetView { width: 100%; } /* change in #pg */ .gallery li { margin: 0.8em 1em; } .test { display: none; }
}
@media screen and (max-width:993px) {
#footer-box { width: 98%; }
} @media screen and (max-width:920px) {
#hi { width: 60.875%; }
} @media screen and (max-width:890px) {
#student_members { height: 879px; } .mem_panel { width: 54%; } .mem_list li { margin: 0.8em 2em; } #instructors { height: 461px; } .gallery li { margin: 0.8em 0.2em; } #thanks_people { height: 400px; } #main_footer #footer_head_2 { height: 31px; } #thanks_org { width: 68%; } #thanks_org .mem_list li { margin: 0.8em 1em; }
} @media screen and (max-width:790px) {
#logo { width: 55.875%; } #hi { width: 68.875%; } .mem_list li { margin: 0.8em 1em; } #school_StreetView { height: 624px; } #school_StreetView .campus { margin: 1em; width:70%; } #voice_note span { width: 100px; } #photo_gallery { height: 837px; } .gallery li { margin: 0.8em 1.2em; } #thanks_org .mem_list li { margin: 0.8em 0.2em; }
} @media screen and (max-width: 650px) {
.active { display: block; } nav{ top: 51px; height:0px; } .nav { top: 16px; left: -39%; } .nav > li { background-color:#EC6100; float: none; width: } .nav > li > .parent { background-position: 95% 50%; } .nav li li .parent { background-image: url('https://static.igem.org/mediawiki/2013/1/12/UESTC_downArrow.png'); background-repeat: no-repeat; background-position: 95% 50%; } .nav ul { display: block; width: 100%; position:relative; top:0px; } .nav > li.hover > ul , .nav li li.hover ul { position: static; } #team_photo { display: none; } #project { height: 394px; } #project .line { top: 376px; } .mem_panel { width: 77%; } #photo_gallery { height: 1080px; } #school_StreetView .campus { margin: 1.5em 1em; width: 78%; } #logo { width: 65.875%; }
}