Team:Uppsala/stylesheet.css
From 2014.igem.org
- master {
width: 100%; min-height: 500px; }
- main_frame_upper {
width: 100%;
background-color: #fff;
/*url('https://static.igem.org/mediawiki/2014/7/7e/Uppsala_igem2014_Head.png');
*/
}
- header {
width: 1130px; margin-left: auto; margin-right: auto;
}
- left_content_header {
float: left; width: 310px;
padding-bottom: 20px;
}
- right_content_header {
margin-top:20px;
float: right; padding-bottom: 20px;
}
- main_frame_lower {
border: none;
width: 99.5%; height: 99.5%;
width: 100%; }
- main_content {
border: 2px solid #a1a1a1;
/*background-color: #dddddd;*/
background-color: #fff;
width: 1050px; min-height: 400px; margin-right: auto; margin-left: auto;
margin-top: 80px; margin-bottom:50px; padding: 20px; border-radius: 25px;
font-family: "Times New Roman", Times, serif;
font-size: 18px; font-weight:bold; }
- tracking_system {
clear: both; width: 100%; height: 100px; /* IMPORTANT NOTE!! This needs to be removed or replaced, just a placeholder! */ border: 1px solid; /* IMPORTANT NOTE!! This needs to be removed or replaced, just a placeholder! */
}
- tabs {
overflow: auto; width: 100%; list-style: none; margin: 0; padding: 0;
}
- tabs li {
margin: 0; padding: 0; float: left;
}
- tabs a {
box-shadow: -4px 0 0 rgba(0, 0, 0, .2); background: #ad1c1c; background: linear-gradient(220deg, transparent 10px, #ad1c1c 10px); text-shadow: 0 1px 0 rgba(0,0,0,.5); color: #fff; float: left; font: bold 12px/35px 'Lucida sans', Arial, Helvetica; height: 35px; padding: 0 30px; text-decoration: none;
}
- tabs a:hover {
background: #c93434; background: linear-gradient(220deg, transparent 10px, #c93434 10px);
}
- tabs a:focus {
outline: 0;
}
- tabs #current a {
background: #fff; background: linear-gradient(220deg, transparent 10px, #fff 10px); text-shadow: none; color: #333;
}
/* Remove the rule below if you want the content to be "organic" */
- section_selector div {
height: 220px;
}
- tab1 {
width: 100%; min-height: 300px; border: 1px solid; }
.logo {
width: 300px; }
.pic {
width: 224px;
}
/* CSS FOR MENU_2 BEGINS */
- menu_2 {
margin-bottom: 20px; }
.button_first {
float: left; position: relative; width: 200px; height: 50px; color: #fff; display: block; text-decoration: none; margin-left: 0 auto; border-radius: 5px; border: 1px solid d31906; background: #d1d2d4; text-align: center; margin: 20px 50px; padding-bottom: 20px 30px;
-webkit-tansition: all 0.1s;
-moz-transition: all 0.1s;
transition: all 0.1s;
}
.button_first:hover, .button_middle:hover, .button_last:hover {
background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0.2)), to(rgba(0,0,0,0))), #fff;
-moz-transition-duration: 0.8s;
-webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s;
}
.button_middle {
float: left; position: relative; width: 200px; height: 50px; color: #fff; display: block; text-decoration: none; margin-left: 0 auto; border-radius: 5px; border-radius: solid 1px #D94E3B; background: #348aff; text-align: center; margin: 20px 50px; padding-bottom: 20px 30px; border: 1px solid;
-webkit-tansition: all 0.1s; -moz-transition: all 0.1s; transition: all 0.1s;
}
.button_last {
float: left; position: relative; width: 200px; height: 50px; color: #fff; display: block; text-decoration: none; margin-left: 0 auto; border-radius: 5px; border-radius: solid 1px #D94E3B; background: #348aff; text-align: center; margin: 20px 50px; padding-bottom: 20px 30px; border: 1px solid;
-webkit-tansition: all 0.1s; -moz-transition: all 0.1s; transition: all 0.1s;
}
.button_text {
color: #fff; padding-top: 10px;
text-decoration: none;
}
.button_text:hover {
color: #d31906; padding-top: 10px;
text-decoration: none;
}
- menu_container {
clear: both; width: 100%;
}
- clear {
clear: both; }
- middle_logo {
width: 20%; height: 0px; border-top: 54px solid black; float: left; }
.home_logo { position: relative; top: -150px; z-index: 2; width: 100%;
}
- menu {
background: #000; height: 46px; text-align: center; font-family: "Times New Roman", Times, serif; font-size: 16px; font-weight:bold; float: left; width: 40%;
}
- menu ul {
margin:0;padding:0; position:absolute; width:40%;
}
- menu ul a {
text-decoration: none;
}
- menu ul li {
list-style: none; float: left; position: relative; width: calc(225%/9);
}
- menu > ul > li {
list-style: none; float: left; position: relative; width: calc(225%/9); border-top: 5px solid #000; border-bottom: 5px solid #000;
webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
}
- menu > ul > li:hover {
list-style: none; float: left; position: relative; width: calc(225%/9); border-top: 5px solid #d40400; border-bottom: 5px solid #d40400; background-color: #000;
}
- menu ul li a:hover {
color: #d40400; background-color: #000; }
- menu ul li a {
background: #000; color: #fff; display: block; padding-top: 10px; padding-bottom: 10px; width:100%;
}
- menu ul ul {
padding:0; overflow: hidden; width: 100%;
}
- menu ul ul li:first-child {
margin-top: 5px; float: none; display: none; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc;' width: 100%;
}
- menu ul ul li {
float: none; display: none; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc; width: 100%;
}
- menu ul ul li a {
background: #f0f0f0; color: #333; border:none; width: calc(100%/9);
}
- menu ul ul li a:hover {
background: #ccc;
}
- menu ul li a:hover,
- menu ul li:hover ul li {
display:block !important;
}
- menu ul li ul li{
width:900%; }
- menu_right {
text-align: center;
background: #000; height: 46px; font-family: "Times New Roman", Times, serif; font-size: 16px; font-weight:bold; float: right; width: 40%;
}
- menu_right ul {
margin:0;padding:0; position:absolute; width:40%;
}
- menu_right ul a {
text-decoration: none;
}
- menu_right ul li {
list-style: none; float: left; position: relative; width: calc(225%/9);
}
- menu_right > ul > li {
list-style: none; float: left; position: relative; width: calc(225%/9); border-top: 5px solid #000; border-bottom: 5px solid #000;
webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
}
- menu_right > ul > li:hover {
list-style: none; float: left; position: relative; width: calc(225%/9); border-top: 5px solid #d40400; border-bottom: 5px solid #d40400; background-color: #000;
}
- menu_right ul li a:hover {
color: #d40400; background-color: #000; }
- menu_right ul li a {
background: #000; color: #fff; display: block; padding-top: 10px; padding-bottom: 10px; width:100%;
}
- menu_right ul ul {
padding:0; overflow: hidden; width: 100%;
}
- menu_right ul ul li:first-child {
margin-top: 5px; float: none; display: none; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc;' width: 100%;
}
- menu_right ul ul li {
float: none; display: none; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc; width: 100%;
}
- menu_right ul ul li a {
background: #f0f0f0; color: #333; border:none; width: calc(100%/9);
}
- menu_right ul ul li a:hover {
background: #ccc;
}
- menu_right ul li a:hover,
- menu_right ul li:hover ul li {
display:block !important;
}
- menu_right ul li ul li{
width:900%; }