Team:USTC CHINA/xyshao/home.css
From 2013.igem.org
@charset "utf-8"; /* CSS Document */
.Container {
background:#fff;
margin:0 auto 0px; padding:5px 0px 0px;
overflow:hidden; width:960px;
}
.top{
width:940px;
background-image:url(); height:150px;
margin-bottom:10px;
border-radius:10px; } .nav{ width:960px; height:66px; z-index:1; }
strong { font-style: normal; font-weight: normal; font-weight: bold; } a { cursor: pointer; text-decoration: none; }
- container {
width: 960px; }
- nav, .nav-container, .nav-container ul, #nav .nav-sub a:hover, #nav .nav-sub a:hover span {
margin:0px; padding:0px; }
- nav, .nav-container, .nav-container ul, #nav .nav-sub a:hover, #nav .nav-sub a:hover span, #nav .nav-master-a:hover, #nav .nav-master-a:hover strong, #nav li.current .nav-master-a strong, #nav li.current .nav-master-a {
background-image:url(""); background-repeat: no-repeat; }
- nav {
position: relative; height: 66px; background-position: 0pt -230px; background-repeat: repeat-x;
} .nav-container { padding-left: 15px;/**/ height: 66px; background-position: 0pt 0pt; } .nav-container ul { height: 100%; background-position: right -66px; } .nav-container ul ul.nav-sub { background: none repeat scroll 0% 0% transparent; height: auto; } .nav-master { display: block; float: left; height: 36px; line-height: 36px; text-align: center; padding-right: 6px; } .nav-master-a { display: block; font-size:20px; height: 26px; line-height: 26px; overflow: hidden; background: none repeat scroll 0% 0% transparent; text-decoration: none; margin-top: 5px; } .nav-master-a strong { display: block; color: rgb(255, 255, 255); height: 100%; } li.current .nav-master-a strong, #nav li.current .nav-master-a:hover strong { color: rgb(0, 0, 0); } .nav-master-a:hover { text-decoration: none; background-position: 0pt -315px; } .nav-master-a:hover strong { background-position: right -360px; }
- nav li.current .nav-master-a strong {
background-position: right -180px; padding-top: 2px; }
- nav li.current .nav-master-a {
background-position: 0pt -131px; overflow: hidden; color: rgb(0, 0, 0); height: 31px; }
- nav li.current .nav-master-a:hover strong {
color: rgb(0, 0, 0); } ul.nav-sub { position: absolute; width: 920px;/*菜单总宽*/ text-align: left; top: 38px; left: 15px;/*调整二级菜单位置*/ display: none; background: none repeat scroll 0% 0% transparent; }
- nav .current .nav-sub {
display: block; } .nav-sub li { float: left; display: block; width:122px;/*调整一、二级菜单每栏宽*/ text-align: center; height: 35px; padding-right:4px; }
- nav .nav-sub a {
display: block; height: 22px; overflow: hidden; color: rgb(77, 77, 77); font-weight:300;/**/ font-size:16px;/**/ text-decoration: none; }
- nav .nav-sub a span {
display: block; line-height: 22px; height: 22px; }
- nav .nav-sub a:hover {
background-position: 0pt -405px; }
- nav .nav-sub a:hover span {
background-position: right -446px; }
- slider {
width: 940px; /* important to be same as image width */ height:360px; /* important to be same as image height */ position: relative; /* important */
overflow: hidden; /* important */ margin-top: 10px; margin-right: auto; margin-bottom: 10px; margin-left:auto; border-radius:10px; }
- slider img{
border: 0px;
}
- sliderContent {
width: 940px; /* important to be same as image width or wider */ position: absolute; top: 0; margin-left: 0;
} .sliderImage {
float: left; position: relative; display: none;
} .sliderImage span {
position: absolute; font: 12px/14px Arial, Helvetica, sans-serif; padding: 10px 13px; width:940px; height:40px; background-color: #000; color: #fff; display: none;
} .clear {
clear: both;
} .sliderImage span strong {
font-size: 14px;
} .bottom {
bottom: 0; left: 0;
} ul { list-style-type: none;}
- content1 {
height:460px; width: 900px; margin-top: 0px; margin-right: auto; margin-bottom:10px; margin-left: auto; border-radius:10px; background-color:#D0ECF4; overflow:hidden; padding:20px; }
- content1p{
width:900px;
font-size:28px; font-weight:bold;
background:#transparent;
}
- content2p{
width:900px; font-size:16px; background:#transparent; margin-top:20px; }
- thanks{
width:940px; height:280px; margin:0 auto; background-color:#F2F2F2; border-radius:10px; margin-top: 0; margin-right: auto; margin-bottom: 10px; margin-left:auto;
}
- sponsors-title{
color: #174974; position:relative; font-family: 'McLaren', cursive; font-size:40px; line-height:40px;
}
.sponsor{
display:block; float:left; width:280px; height:68px; margin: 10px; overflow:hidden; color:#174974; } .sponsor:hover p{ margin-top:-65px; } .sponsor p{ display:block; width:290px; height:65px; line-height:20px; font-size:16px; text-align:center; vertical-align:center; font-family: Verdana, Arial, Helvetica, sans-serif; margin:0; -webkit-transition: margin-top 0.2s linear; -moz-transition: margin-top 0.2s linear; -o-transition: margin-top 0.2s linear; -ms-transition: margin-top 0.2s linear; transition: margin-top 0.2s linear; } .sponsor a img{ opacity:0; -webkit-transition:all 0.3s linear; -o-transition:all 0.3s linear; -ms-transition:all 0.3s linear; -moz-transition:all 0.3s linear; transition:all 0.3s linear; -moz-transform: rotate(6deg); -o-transform: rotate(6deg); -webkit-transform: rotate(6deg); } .sponsor:hover a img{ opacity:1; -webkit-transform:rotate(0deg);
-moz-transform:rotate(0deg); -o-transform:rotate(0deg);
} .sponsor a p{ height:45px; padding:10px; font-family: 'Petit Formal Script', cursive; font-size:14px; opacity:0; -webkit-transition:all 0.3s linear; -o-transition:all 0.3s linear; -ms-transition:all 0.3s linear; -moz-transition:all 0.3s linear; transition:all 0.3s linear; -webkit-transform: rotate(6deg); } .sponsor:hover a p{ opacity:1; -webkit-transform:rotate(0deg); }