Team:NCTU Formosa/source/head-index
From 2013.igem.org
(Difference between revisions)
Line 252: | Line 252: | ||
padding-right:5px; | padding-right:5px; | ||
border-radius:3px; | border-radius:3px; | ||
- | |||
- | |||
- | |||
} | } | ||
#sitemap .seclink { | #sitemap .seclink { | ||
display: block; | display: block; | ||
- | |||
margin:10px; | margin:10px; | ||
- | height: | + | height:200px; |
- | width: | + | width:300px; |
float:left; | float:left; | ||
overflow: hidden; | overflow: hidden; | ||
+ | color:white; | ||
+ | border-radius:5px; | ||
} | } | ||
.seclink a { | .seclink a { | ||
+ | position: relative; | ||
display: block; | display: block; | ||
+ | background:rgba(0,0,0,0); | ||
height:100%; | height:100%; | ||
width:100%; | width:100%; | ||
+ | color:white; | ||
+ | -webkit-transition: all 0.5s ease-in-out; | ||
+ | -moz-transition: all 0.5s ease-in-out; | ||
+ | -o-transition: all 0.5s ease-in-out; | ||
+ | transition: all 0.5s ease-in-out; | ||
+ | } | ||
+ | .seclink a:hover { | ||
+ | text-decoration:none; | ||
+ | background:rgba(0,0,0,0.5); | ||
+ | } | ||
+ | #sec1 { | ||
+ | background: #c56d83; | ||
+ | } | ||
+ | #sec2 { | ||
+ | background: #dd9056; | ||
+ | } | ||
+ | #sec3 { | ||
+ | background: #deb754; | ||
+ | } | ||
+ | #sec4 { | ||
+ | background: #8da857; | ||
+ | } | ||
+ | #sec5 { | ||
+ | background: #7b7eb7; | ||
+ | } | ||
+ | #sec6 { | ||
+ | background: #82b1b1; | ||
+ | } | ||
+ | #sec7 { | ||
+ | background: #aaaaaa; | ||
+ | } | ||
+ | .seclink a i { | ||
+ | position:absolute; | ||
+ | font-size:100px; | ||
+ | padding-left:100px; | ||
+ | padding-top:10px; | ||
+ | top:0; | ||
+ | opacity:1; | ||
+ | -webkit-transition: all 0.5s ease-in-out; | ||
+ | -moz-transition: all 0.5s ease-in-out; | ||
+ | -o-transition: all 0.5s ease-in-out; | ||
+ | transition: all 0.5s ease-in-out; | ||
+ | } | ||
+ | #sec1 a i, | ||
+ | #sec7 a i { | ||
+ | padding-left:120px; | ||
+ | } | ||
+ | #sec3 a i, | ||
+ | #sec4 a i, | ||
+ | #sec5 a i, | ||
+ | #sec6 a i { | ||
+ | padding-left:110px; | ||
+ | } | ||
+ | .seclink a:hover i { | ||
+ | //font-size:200px; | ||
+ | opacity:0.5; | ||
+ | top:-150px; | ||
+ | } | ||
+ | .seclink a p { | ||
+ | position:absolute; | ||
+ | display:block; | ||
+ | top:200px; | ||
+ | padding:10px; | ||
+ | -webkit-transition: all 0.5s ease-in-out; | ||
+ | -moz-transition: all 0.5s ease-in-out; | ||
+ | -o-transition: all 0.5s ease-in-out; | ||
+ | transition: all 0.5s ease-in-out; | ||
+ | } | ||
+ | .seclink a:hover p { | ||
+ | top:0; | ||
+ | } | ||
+ | .seclink .smalltitle { | ||
+ | font-family: Lobster Two; | ||
+ | position:absolute; | ||
+ | display:block; | ||
+ | top:130px; | ||
+ | left:0px; | ||
+ | padding-left:30px; | ||
+ | font-size:30px; | ||
+ | opacity:1; | ||
+ | } | ||
+ | .seclink a:hover .smalltitle { | ||
+ | top:100px; | ||
+ | left:-50px; | ||
+ | font-size:100px; | ||
+ | opacity:0.5; | ||
} | } | ||
</style> | </style> |
Revision as of 07:30, 27 September 2013