Template:CSS/team

From 2014.igem.org

(Difference between revisions)
 
(26 intermediate revisions not shown)
Line 4: Line 4:
.container_team{
.container_team{
width:100%;
width:100%;
-
height:2800px;
+
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-color:#b8435b;
+
background-image:url(https://static.igem.org/mediawiki/2014/1/1b/Grouppic_iitd.jpg);
border-radius:10px;
border-radius:10px;
 +
}
}
Line 505: Line 506:
position:absolute;
position:absolute;
top:2820px;
top:2820px;
-
left:250px;
+
left:350px;
}
}
Line 521: Line 522:
position:absolute;
position:absolute;
top:2820px;
top:2820px;
-
left:850px;
+
left:700px;
}
}
Line 577: 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 620: Line 622:
.prof_phd{
.prof_phd{
-
width:95%;
+
width:100%;
-
height:200px;
+
height:220px;
position:absolute;
position:absolute;
top:3200px;
top:3200px;
-
left:20px;
+
left:0px;
border: thin solid grey;
border: thin solid grey;
float:left;
float:left;
Line 652: Line 654:
height:120px;
height:120px;
position:absolute;
position:absolute;
-
top:50px;
+
top:60px;
-
left:200px;
+
left:280px;
float:left;
float:left;
display:inline;
display:inline;
Line 659: Line 661:
}
}
.pic1{
.pic1{
-
width:100px;
+
width:150px;
-
height:100px;
+
height:150px;
position:absolute;
position:absolute;
-
top:5px;
+
top:-3px;
left:30px;
left:30px;
}
}
.pic2{
.pic2{
position:absolute;
position:absolute;
-
top:5px;
+
top:-3px;
-
left:130px;
+
left:180px;
-
width:100px;
+
width:150px;
-
height:100px;
+
height:150px;
-webkit-transition:all 0.3s linear 0s;
-webkit-transition:all 0.3s linear 0s;
}
}
.pic3{
.pic3{
position:absolute;
position:absolute;
-
top:5px;
+
top:-3px;
-
left:230px;
+
left:330px;
-
width:100px;
+
width:150px;
-
height:100px;
+
height:150px;
-webkit-transition:all 0.3s linear 0s;
-webkit-transition:all 0.3s linear 0s;
}
}
.pic4{
.pic4{
position:absolute;
position:absolute;
-
top:5px;
+
top:-3px;
-
left:330px;
+
left:480px;
-
width:100px;
+
width:150px;
-
height:100px;
+
height:150px;
-
-webkit-transition:all 0.3s linear 0s;
+
-
}
+
-
.pic5{
+
-
position:absolute;
+
-
top:5px;
+
-
left:430px;
+
-
width:100px;
+
-
height:100px;
+
-
-webkit-transition:all 0.3s linear 0s;
+
-
}
+
-
.pic6{
+
-
position:absolute;
+
-
top:5px;
+
-
left:530px;
+
-
width:100px;
+
-
height:100px;
+
-
-webkit-transition:all 0.3s linear 0s;
+
-
}
+
-
.pic7{
+
-
position:absolute;
+
-
top:5px;
+
-
left:630px;
+
-
width:100px;
+
-
height:100px;
+
-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(100px,0);
+
transform: translate(150px,0);
-
     -webkit-transform: translate(100px,0); /** Safari & Chrome **/
+
     -webkit-transform: translate(150px,0); /** Safari & Chrome **/
-
     -o-transform: translate(100px,0); /** Opera **/
+
     -o-transform: translate(150px,0); /** Opera **/
-
     -moz-transform: translate(100px,0); /** Firefox **/
+
     -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(100px,0);
+
transform: translate(150px,0);
-
     -webkit-transform: translate(100px,0); /** Safari & Chrome **/
+
     -webkit-transform: translate(150px,0); /** Safari & Chrome **/
-
     -o-transform: translate(100px,0); /** Opera **/
+
     -o-transform: translate(150px,0); /** Opera **/
-
     -moz-transform: translate(100px,0); /** Firefox **/
+
     -moz-transform: translate(150px,0); /** Firefox **/
}
}
-
.pic3:hover+.pic4{
 
-
-webkit-transition:all 0.3s linear 0s;
 
-
transform: translate(100px,0);
 
-
    -webkit-transform: translate(100px,0); /** Safari & Chrome **/
 
-
    -o-transform: translate(100px,0); /** Opera **/
 
-
    -moz-transform: translate(100px,0); /** Firefox **/
 
-
}
 
-
.pic4:hover+.pic5{
 
-
-webkit-transition:all 0.3s linear 0s;
 
-
transform: translate(100px,0);
 
-
    -webkit-transform: translate(100px,0); /** Safari & Chrome **/
 
-
    -o-transform: translate(100px,0); /** Opera **/
 
-
    -moz-transform: translate(100px,0); /** Firefox **/
 
-
}
 
-
.pic5:hover+.pic6{
 
-
-webkit-transition:all 0.3s linear 0s;
 
-
transform: translate(100px,0);
 
-
    -webkit-transform: translate(100px,0); /** Safari & Chrome **/
 
-
    -o-transform: translate(100px,0); /** Opera **/
 
-
    -moz-transform: translate(100px,0); /** Firefox **/
 
-
}
 
-
.pic6:hover+.pic7{
+
.pic3:hover+.pic4{
-webkit-transition:all 0.3s linear 0s;
-webkit-transition:all 0.3s linear 0s;
-
transform: translate(100px,0);
+
transform: translate(150px,0);
-
     -webkit-transform: translate(100px,0); /** Safari & Chrome **/
+
     -webkit-transform: translate(150px,0); /** Safari & Chrome **/
-
     -o-transform: translate(100px,0); /** Opera **/
+
     -o-transform: translate(150px,0); /** Opera **/
-
     -moz-transform: translate(100px,0); /** Firefox **/
+
     -moz-transform: translate(150px,0); /** Firefox **/
}
}
Line 766: Line 726:
.smallpic{
.smallpic{
-
width:100px;
+
width:150px;
-
height:100px;
+
height:150px;
-
border-radius:100px;
+
border-radius:0px;
z-index:52;
z-index:52;
border:thin solid grey;
border:thin solid grey;
Line 775: Line 735:
.picdescription{
.picdescription{
position: absolute;
position: absolute;
-
left:100px;
+
left:150px;
top:0px;
top:0px;
width:0px;
width:0px;
-
height:100px;
+
height:150px;
-
border-radius:100px;
+
border-radius:0px;
background-color:red;
background-color:red;
-webkit-transition:all 0.3s linear 0s;
-webkit-transition:all 0.3s linear 0s;
Line 787: Line 747:
.smallpic:hover + .picdescription{
.smallpic:hover + .picdescription{
-
width:100px;
+
width:150px;
-
height:100px;
+
height:150px;
-
border-radius:100px;
+
border-radius:0px;
border:thin solid black;
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;
 +
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