Team:UESTC/home.css
From 2013.igem.org
(22 intermediate revisions not shown) | |||
Line 80: | Line 80: | ||
#hi { | #hi { | ||
height: auto; | height: auto; | ||
- | width: | + | width: 530px; |
position:relative; | position:relative; | ||
top:-25px; | top:-25px; | ||
margin:0 auto; | margin:0 auto; | ||
- | font: | + | font: 24px BuxtonSketch,arial,verdana; |
z-index:5; | z-index:5; | ||
text-align:center; | text-align:center; | ||
Line 96: | Line 96: | ||
height: auto; | height: auto; | ||
background-color: white; | background-color: white; | ||
+ | width: 80%; | ||
+ | margin: 0 auto; | ||
} | } | ||
#main_footer #footer_head { | #main_footer #footer_head { | ||
- | + | text-align: center; | |
- | + | display:block; | |
- | + | font: 48px arial,verdana; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
#thanks_org { | #thanks_org { | ||
position: relative; | position: relative; | ||
- | height: | + | height:220px; |
top: 76px; | top: 76px; | ||
+ | width:785px; | ||
+ | margin: 0 auto; | ||
+ | } | ||
+ | #thanks_org span{ | ||
+ | font:12px arial,verdana; | ||
} | } | ||
#thanks_org .mem_list li { | #thanks_org .mem_list li { | ||
display: block; | display: block; | ||
width:250px; | width:250px; | ||
- | margin:0. | + | margin:0.5em 0.2em; |
- | + | ||
float:left; | float:left; | ||
z-index:0; | z-index:0; | ||
Line 123: | Line 125: | ||
#project { | #project { | ||
height:auto; | height:auto; | ||
- | width: | + | } |
+ | #project span { | ||
+ | text-align: center; | ||
+ | display:block; | ||
+ | font: 48px arial,verdana; | ||
+ | } | ||
+ | .proj_show { | ||
+ | width:860px; | ||
+ | margin: 0 auto; | ||
+ | } | ||
+ | .proj_show .pp { | ||
+ | display: block; | ||
+ | width: 40%; | ||
+ | text-align: justify; | ||
+ | font: 16px arial,verdana; | ||
+ | float: left; | ||
+ | position: relative; | ||
+ | line-height: 1.4em; | ||
+ | } | ||
+ | .proj_show img { | ||
+ | float:right; | ||
+ | } | ||
+ | #nebula-show { | ||
+ | height: 400px; | ||
+ | } | ||
+ | #nebula-show h1 { | ||
+ | font: 36px arial,verdana; | ||
+ | position: relative; | ||
+ | top:115px; | ||
+ | } | ||
+ | #nebula-show p { | ||
+ | top:123px; | ||
+ | } | ||
+ | #nebula-show a { | ||
+ | top:225px; | ||
+ | right: 100px; | ||
+ | width: auto; | ||
+ | } | ||
+ | #transpeeder-show { | ||
+ | height: 555px; | ||
+ | } | ||
+ | #transpeeder-show h1{ | ||
+ | font: 36px arial,verdana; | ||
+ | position: relative; | ||
+ | top:115px; | ||
+ | } | ||
+ | #transpeeder-show p{ | ||
+ | top:125px; | ||
+ | } | ||
+ | #transpeeder-show a{ | ||
+ | top: 225px; | ||
+ | right: 100px; | ||
+ | width: auto; | ||
} | } |
Latest revision as of 14:04, 28 October 2013
/*
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: 530px; position:relative; top:-25px; margin:0 auto; font: 24px BuxtonSketch,arial,verdana; z-index:5; text-align:center;
} /*
#main_footer style */
- main_footer {
position:relative; top:-20px; height: auto; background-color: white; width: 80%; margin: 0 auto;
}
#main_footer #footer_head { text-align: center;
display:block;
font: 48px arial,verdana; }
- thanks_org {
position: relative; height:220px; top: 76px; width:785px; margin: 0 auto;
}
- thanks_org span{
font:12px arial,verdana; }
- thanks_org .mem_list li {
display: block; width:250px; margin:0.5em 0.2em; float:left; z-index:0; }
- project {
height:auto; }
- project span {
text-align: center; display:block;
font: 48px arial,verdana;
} .proj_show { width:860px; margin: 0 auto; } .proj_show .pp { display: block; width: 40%; text-align: justify;
font: 16px arial,verdana;
float: left; position: relative; line-height: 1.4em; } .proj_show img { float:right; }
- nebula-show {
height: 400px; }
- nebula-show h1 {
font: 36px arial,verdana; position: relative; top:115px;
}
- nebula-show p {
top:123px; }
- nebula-show a {
top:225px; right: 100px; width: auto; }
- transpeeder-show {
height: 555px; }
- transpeeder-show h1{
font: 36px arial,verdana; position: relative; top:115px;
}
- transpeeder-show p{
top:125px; }
- transpeeder-show a{
top: 225px; right: 100px; width: auto; }