Team:USTC-Software/css/footer style

From 2012.igem.org

Latest revision as of 12:15, 24 September 2012

1. thanks{

   width:990px;
   margin: 100px auto;
   background:url('https://static.igem.org/mediawiki/2012/d/de/USTC-Software-images-half-black.png');
   overflow: hidden;
   }
   

1. sponsors-title{

   color:white;
   position:relative;
   font-family: 'Coda', sans-serif;
   font-size:40px;
   line-height:40px;
   top:10px;
   left:20px;

}

.sponsor{

   display:block;
   float:left;
   width:290px;
   height:65px;
   margin: 20px;
   overflow:hidden;
   color:white;
   
   }
   .sponsor:hover p{
       margin-top:-65px;
   }
   .sponsor p{
       display:block;
       width:290px;
       height:65px;
       line-height:20px;
       font-size:18px;
       text-align:center;
       vertical-align:center;
       font-family: 'Coda', 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{
       text-decoration:none;
       color:white;
   } 
   
   .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;
       
       -webkit-transform: rotate(6deg);
   }
   .sponsor:hover a img{
       opacity:1;
       -webkit-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);
   }
   
   

/* transition for the sponsor links */