Team:USTC CHINA/home.css

From 2013.igem.org

Revision as of 22:51, 27 September 2013 by Surine (Talk | contribs)

@charset "utf-8"; /* CSS Document */

  1. header{

width:960px; margin-top:10px; position:relative; z-index:1900; }

  1. logo{

width:190px; height:123px; background:url(2013ustc-china_Logo-bg.png); display:block; float:left; }

  1. header #nav{

margin-left:189px; padding-left:34px; width:740px; } .pic-bar{ width:964px; height:410px; margin:10px auto 0 auto; } .home-pic{ height:100%; background:url(2013ustc-china_Draft.png) no-repeat scroll left top transparent; } .content .pic-bar .home-pic .page-tittle{ margin:0 0 30px; padding:0 0 5px; } .content .pic-bar .home-pic .page-tittle h1{ color: #383636;

       font-size: 36px;
       font-weight: 500;
       text-align: right;

} .content .pic-bar .home-pic .page-para p{ color: #626364;

       font-size: 14px;
       line-height: 20px;

padding-bottom:15px; } .button-home{ background-color: #393939;

       border: 0 none;
       cursor: pointer;
       display: block;
       font-weight: lighter;
       margin: 0;
       overflow: visible;
       padding:0 10px 0 10px;
       text-decoration: none;
       width: 55px;

} a.button-home:hover span{ color:#7bc5ff; } .page-tittle span{color:#ff9933;} .button-home span{ color: #FFFFFF;

       font: lighter 18px/44px Merriweather,Arial;
       height: 44px;
       padding: 0;
       text-align: center;
       white-space: nowrap;
       width: 100%;

}

  1. homecol{

height:1150px; }

  1. home.leftbar{height:1150px;}
  2. home.rightbar{height:1150px;}
  3. abstract-bar{

margin-top:20px; margin-bottom:20px; }

  1. pro-bar{

width:620px; height:500px; }

  1. homecol .conbar2 .leftbar #abstract-bar #abs-1{
       border-radius:1em 1em 1em 1em;
       background:#ffffff;
       border:1px solid rgb(68,68,68);

margin:10px 0 0 0;

       padding:5px 5px 15px 5px;

}

  1. homecol .conbar2 .leftbar #abstract-bar #abs-1 #abs-text{

text-align:center; font-size:13px; line-height:20px;}

  1. homecol span{

color:#F93; font-size:16px;}

  1. homecol .conbar2 #home #pro-bar #pro-text{
 	margin:0 0 20px 0;

font-size:14px; line-height:20px; }

  1. homecol .conbar2 #home #pro-bar #pro-de-text{

height:120px;} .pro-col{ float:left; width:288px; height:150px; margin-bottom:20px; text-align:center;

       border-radius:1em 1em 1em 1em;
       background:#ffffff;
       border:1px solid rgb(68,68,68);
       padding:5px;

}

  1. ls.pro-col{

margin-right:20px}

  1. homecol .conbar2 #home #exp-bar .exp-col{
       border-radius:1em 1em 1em 1em;
       background:#ffffff;
       border:1px solid rgb(68,68,68);

text-align:center; font-size:14px; line-height:20px; margin-bottom:10px;

       padding:5px 5px 15px 5px;

}

  1. homecol .conbar2 #home #modle-bar{

margin-top:20px;}

  1. homecol .conbar2 #home #modle-bar #modle-col{
       border-radius:1em 1em 1em 1em;
       background:#ffffff;
       border:1px solid rgb(68,68,68);
       padding:5px;

}

  1. homecol .conbar2 #home #modle-bar h2{

font-size:16px; font-weight:100; margin-top:10px;}

  1. homecol .conbar2 #home #hum-bar{

margin-top:10px; }

  1. homecol .conbar2 #home #hum-bar #hum-col{
       border-radius:1em 1em 1em 1em;
       background:#ffffff;
       border:1px solid rgb(68,68,68);
       padding:5px;

}

  1. homecol .conbar2 #home #hum-bar h2{
       font-size:16px;

font-weight:100; margin-top:10px; }

  1. footer{
       color:#fff;
       padding-top:30px;

}

  1. thanks{
       width:964px;
       height:280px;

margin-top:10px; margin-left:auto; margin-right:auto; }

  1. sponsors-title{
      color: #303030;
      position:relative;
      margin-top:20px;
      font-size:20px;
      line-height:40px;

}

.sponsor{

   display:block;
   float:left;
   width:280px;
   height:68px;
   margin: 20px;
   overflow:hidden;
   color:#303030;
}

.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;
  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);

}