Template:CSS/team
From 2014.igem.org
(Difference between revisions)
(44 intermediate revisions not shown) | |||
Line 4: | Line 4: | ||
.container_team{ | .container_team{ | ||
width:100%; | width:100%; | ||
- | height: | + | height:3600px; |
background-image: url(https://static.igem.org/mediawiki/2014/6/6e/Scribblebg_iitd.png); | background-image: url(https://static.igem.org/mediawiki/2014/6/6e/Scribblebg_iitd.png); | ||
position:absolute; | position:absolute; | ||
Line 19: | Line 19: | ||
top:120px; | top:120px; | ||
left:220px; | left:220px; | ||
- | background- | + | background-image:url(https://static.igem.org/mediawiki/2014/1/1b/Grouppic_iitd.jpg); |
border-radius:10px; | border-radius:10px; | ||
+ | |||
} | } | ||
Line 166: | Line 167: | ||
top:550px; | top:550px; | ||
left:100px; | left:100px; | ||
+ | width:1200px; | ||
+ | |||
} | } | ||
.coordinator p{ | .coordinator p{ | ||
Line 336: | Line 339: | ||
top:1260px; | top:1260px; | ||
left:100px; | left:100px; | ||
+ | width:1200px; | ||
+ | |||
} | } | ||
.team_iitd p{ | .team_iitd p{ | ||
Line 481: | Line 486: | ||
top:2380px; | top:2380px; | ||
left:1000px; | left:1000px; | ||
+ | } | ||
+ | |||
+ | |||
+ | .phd_iitd{ | ||
+ | position:absolute; | ||
+ | top:2750px; | ||
+ | left:100px; | ||
+ | width:1200px; | ||
+ | |||
+ | } | ||
+ | .phd_iitd p{ | ||
+ | font-size:20px; | ||
+ | font-weight:800; | ||
+ | } | ||
+ | |||
+ | .member17{ | ||
+ | width:250px; | ||
+ | height:300px; | ||
+ | position:absolute; | ||
+ | top:2820px; | ||
+ | left:350px; | ||
+ | } | ||
+ | |||
+ | .member18{ | ||
+ | width:250px; | ||
+ | height:300px; | ||
+ | position:absolute; | ||
+ | top:2820px; | ||
+ | left:550px; | ||
+ | } | ||
+ | |||
+ | .member19{ | ||
+ | width:250px; | ||
+ | height:300px; | ||
+ | position:absolute; | ||
+ | top:2820px; | ||
+ | left:700px; | ||
} | } | ||
Line 536: | Line 578: | ||
color:black; | color:black; | ||
font-weight:400; | font-weight:400; | ||
+ | padding:10px; | ||
/*background-image:url(https://static.igem.org/mediawiki/2014/a/ad/20140725_011606.JPG); | /*background-image:url(https://static.igem.org/mediawiki/2014/a/ad/20140725_011606.JPG); | ||
Line 579: | Line 622: | ||
.prof_phd{ | .prof_phd{ | ||
- | width: | + | width:100%; |
- | height: | + | height:220px; |
position:absolute; | position:absolute; | ||
- | top: | + | top:3200px; |
- | left: | + | left:0px; |
border: thin solid grey; | border: thin solid grey; | ||
float:left; | float:left; | ||
Line 595: | Line 638: | ||
left:50px; | left:50px; | ||
display:inline; | display:inline; | ||
- | width: | + | width:1200px; |
+ | |||
+ | |||
} | } | ||
Line 609: | Line 654: | ||
height:120px; | height:120px; | ||
position:absolute; | position:absolute; | ||
- | top: | + | top:60px; |
- | left: | + | left:280px; |
float:left; | float:left; | ||
display:inline; | display:inline; | ||
Line 616: | Line 661: | ||
} | } | ||
.pic1{ | .pic1{ | ||
- | width: | + | width:150px; |
- | height: | + | height:150px; |
position:absolute; | position:absolute; | ||
- | top: | + | top:-3px; |
left:30px; | left:30px; | ||
} | } | ||
.pic2{ | .pic2{ | ||
position:absolute; | position:absolute; | ||
- | top: | + | top:-3px; |
- | left: | + | left:180px; |
- | width: | + | width:150px; |
- | height: | + | height:150px; |
-webkit-transition:all 0.3s linear 0s; | -webkit-transition:all 0.3s linear 0s; | ||
} | } | ||
.pic3{ | .pic3{ | ||
position:absolute; | position:absolute; | ||
- | top: | + | top:-3px; |
- | left: | + | left:330px; |
- | width: | + | width:150px; |
- | height: | + | height:150px; |
-webkit-transition:all 0.3s linear 0s; | -webkit-transition:all 0.3s linear 0s; | ||
} | } | ||
.pic4{ | .pic4{ | ||
position:absolute; | position:absolute; | ||
- | top: | + | top:-3px; |
- | + | left:480px; | |
- | + | width:150px; | |
- | + | height:150px; | |
- | - | + | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | left: | + | |
- | width: | + | |
- | height: | + | |
-webkit-transition:all 0.3s linear 0s; | -webkit-transition:all 0.3s linear 0s; | ||
} | } | ||
+ | |||
.pic1:hover+.pic2{ | .pic1:hover+.pic2{ | ||
-webkit-transition:all 0.3s linear 0s; | -webkit-transition:all 0.3s linear 0s; | ||
- | transform: translate( | + | transform: translate(150px,0); |
- | -webkit-transform: translate( | + | -webkit-transform: translate(150px,0); /** Safari & Chrome **/ |
- | -o-transform: translate( | + | -o-transform: translate(150px,0); /** Opera **/ |
- | -moz-transform: translate( | + | -moz-transform: translate(150px,0); /** Firefox **/ |
} | } | ||
+ | |||
+ | |||
.pic2:hover+.pic3{ | .pic2:hover+.pic3{ | ||
-webkit-transition:all 0.3s linear 0s; | -webkit-transition:all 0.3s linear 0s; | ||
- | transform: translate( | + | transform: translate(150px,0); |
- | -webkit-transform: translate( | + | -webkit-transform: translate(150px,0); /** Safari & Chrome **/ |
- | -o-transform: translate( | + | -o-transform: translate(150px,0); /** Opera **/ |
- | -moz-transform: translate( | + | -moz-transform: translate(150px,0); /** Firefox **/ |
} | } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | . | + | .pic3:hover+.pic4{ |
-webkit-transition:all 0.3s linear 0s; | -webkit-transition:all 0.3s linear 0s; | ||
- | transform: translate( | + | transform: translate(150px,0); |
- | -webkit-transform: translate( | + | -webkit-transform: translate(150px,0); /** Safari & Chrome **/ |
- | -o-transform: translate( | + | -o-transform: translate(150px,0); /** Opera **/ |
- | -moz-transform: translate( | + | -moz-transform: translate(150px,0); /** Firefox **/ |
} | } | ||
Line 723: | Line 726: | ||
.smallpic{ | .smallpic{ | ||
- | width: | + | width:150px; |
- | height: | + | height:150px; |
- | border-radius: | + | border-radius:0px; |
z-index:52; | z-index:52; | ||
- | border | + | border:thin solid grey; |
} | } | ||
.picdescription{ | .picdescription{ | ||
position: absolute; | position: absolute; | ||
- | left: | + | left:150px; |
top:0px; | top:0px; | ||
width:0px; | width:0px; | ||
- | height: | + | height:150px; |
- | border-radius: | + | border-radius:0px; |
background-color:red; | background-color:red; | ||
-webkit-transition:all 0.3s linear 0s; | -webkit-transition:all 0.3s linear 0s; | ||
z-index:52; | z-index:52; | ||
- | + | ||
} | } | ||
.smallpic:hover + .picdescription{ | .smallpic:hover + .picdescription{ | ||
- | width: | + | width:150px; |
+ | height:150px; | ||
+ | border-radius:0px; | ||
+ | border:thin solid black; | ||
+ | } | ||
+ | |||
+ | |||
+ | .teaminfolink{ | ||
+ | position:absolute; | ||
+ | top:3450px; | ||
+ | left:520px; | ||
+ | } | ||
+ | |||
+ | .teaminfolink a{ | ||
+ | text-decoration:none; | ||
+ | color:grey; | ||
+ | } | ||
+ | |||
+ | .teaminfolink a p{ | ||
+ | font-size:14px; | ||
+ | } | ||
+ | |||
+ | .teaminfolink a:hover{ | ||
+ | text-decoration:none; | ||
+ | color:black; | ||
+ | } | ||
+ | |||
+ | .footerbg_team{ | ||
+ | position:absolute; | ||
+ | top:3500px; | ||
+ | left:0px; | ||
+ | width:100%; | ||
height:100px; | height:100px; | ||
- | + | background-color:#424243; | |
+ | z-index:2; | ||
+ | background-repeat:no-repeat; | ||
} | } | ||
+ | |||
+ | .copyright{ | ||
+ | position:absolute; | ||
+ | bottom:5px; | ||
+ | left:400px; | ||
+ | } | ||
+ | |||
+ | .copyright a,visited{ | ||
+ | color:#a2a1a1; | ||
+ | } | ||
+ | |||
+ | .copyright a:hover{ | ||
+ | color:#c7c6c6; | ||
+ | } | ||
+ | |||
+ | .copyright p{ | ||
+ | font-size:12px; | ||
+ | color:#807f7f; | ||
+ | font-family:Open sans, Helvetica, Arial; | ||
+ | font-weight:400; | ||
+ | } | ||
+ | |||
+ | .nav2{ | ||
+ | position:absolute; | ||
+ | top:10px; | ||
+ | left:280px; | ||
+ | |||
+ | } | ||
+ | .nav2table{ | ||
+ | background-color:#424243; | ||
+ | color:#807f7f; | ||
+ | } | ||
+ | .nav2 a,visited{ | ||
+ | color:#d6d5d5; | ||
+ | font-size:12px; | ||
+ | text-decoration:none; | ||
+ | padding:10px; | ||
+ | } | ||
+ | |||
+ | .nav2 a:hover{ | ||
+ | color:#ffffff; | ||
+ | font-size:12px; | ||
+ | font-weight:500; | ||
+ | text-decoration:none; | ||
+ | padding:10px; | ||
+ | } | ||
+ | |||
Latest revision as of 02:33, 18 October 2014