Template:Team:Uppsala/index-style
From 2013.igem.org
/*Dropdown list code ends */
h1 {
color:#0089d1;
}
h3 {
color:#0089d1;
}
- bottom-pic {
width: 100%; height: 200px; margin-top: 50px; }
/* Code for the size of content section */
#main_frame { min-height: 1800px; width: 950px; margin: 20px auto; border: 1px solid ligth gray; border-radius: 15px; box-shadow: 0px 0px 30px rgba(110,110,110, .8); background: white;
} /* Content section size code ends */
#main_frame {
min-height: 1800px;
width: 950px;
margin: 20px auto;
border: 1px solid ligth gray;
border-radius: 15px;
box-shadow: 0px 0px 30px rgba(110,110,110, .8);
background: white;
}
h1 {
color:#0089d1;
}
h3 {
color:#0089d1;
}
- bottom-pic {
width: 100%; height: 200px; margin-top: 50px; }
- team-div{
width: 100%; margin-left:auto; margin-right:auto; /*border-top: 1px solid #22409a;*/ clear: both; }
- team-pic{
position: center; /*padding-top: 10px;*/ margin-left: 100px; height:400px; width:700px; border:solid 3px; margin-top:10px;
}
.team-text {
float: right;
padding-left: 1px;
}
- profile-div{
width: 100%; margin-left:auto; margin-right:auto; border-bottom: 1px solid #22409a; margin-bottom: 10px; margin-top: 20px; clear: both; }
- profile_pic{
position: left; float:left; height:270px; width:250px; /*border:solid 3px;*/ margin-top:20px; }
- profile_pic_right{
position: right; /* padding-top: px;*/ float:right; height:270px; width:250px; /*border:solid 3px;*/ margin-top:20px;
}
- container_right{
height:270px; padding-top:0px; width:650px; /*border:solid 3px;*/ float:right; margin-top:15px; } /*section * {border: solid 1px;}*/
- container_left{
height:270px; padding-top:0px; width:650px; /*border:solid 3px;*/ float:left; margin-top:15px; }
.profile-text {
float: right;
padding-left: 1px;
}
- project-description {
width: 100%; border-bottom: 1px solid #22409a; padding-bottom: 10px;
clear:both
}
- grid-matrix {
width: 64%; float: left; padding-top: 20px;
padding-bottom: 20px;
}
- sidebar {
width: 34%; float: right; padding-top: 20px; }
- twitter-feed {
padding-top:20px; }
- grid-a {
width: 276.5px; float: left; height: 276.5px; border: 3px solid; background-image: url(); }
- grid-b {
width: 276.5px; float: right; height: 276.5px; border: 3px solid;
background-image: url();
}
- grid-c {
width: 276.5px; float: left; height: 276.5px; border: 3px solid; margin-top: 20px;
background-image: url();
}
- grid-d {
width: 276.5px; float: right; height: 276.5px; border: 3px solid; margin-top: 20px;
background-image: url();
}
- grid-e {
width: 276.5px; float: left; height: 276.5px; border: 3px solid; margin-top: 20px;
background-image: url();
}
- grid-f {
width: 276.5px; float: right; height: 276.5px; border: 3px solid; margin-top: 20px;
background-image: url();
}
/* Hover effect on grid pictures begin */
- grid-a img {
-webkit-transition: opacity 0.2s ease-in-out; -moz-transition: opacity 0.2s ease-in-out; -o-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out;
}
- grid-a img.top:hover {
opacity:0;
}
- grid-b img {
-webkit-transition: opacity 0.2s ease-in-out; -moz-transition: opacity 0.2s ease-in-out; -o-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out;
}
- grid-b img.top:hover {
opacity:0;
}
- grid-c img {
-webkit-transition: opacity 0.2s ease-in-out; -moz-transition: opacity 0.2s ease-in-out; -o-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out;
}
- grid-c img.top:hover {
opacity:0;
}
- grid-d img {
-webkit-transition: opacity 0.2s ease-in-out; -moz-transition: opacity 0.2s ease-in-out; -o-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out;
}
- grid-d img.top:hover {
opacity:0;
}
- grid-e img {
-webkit-transition: opacity 0.2s ease-in-out; -moz-transition: opacity 0.2s ease-in-out; -o-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out;
}
- grid-e img.top:hover {
opacity:0;
}
- grid-f img {
-webkit-transition: opacity 0.2s ease-in-out; -moz-transition: opacity 0.2s ease-in-out; -o-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out;
}
- grid-f img.top:hover {
opacity:0;
}
/* Hover effect in grid pictures end Grid pictures styling begin */
.top { width: 277px; }
.grid-pic { width: 276.5px; }
.grid-test { width: 200px; }