Team:Uppsala/navbar.css
From 2014.igem.org
Line 44: | Line 44: | ||
max-height:46px; | max-height:46px; | ||
text-align: center; | text-align: center; | ||
- | font-family: | + | font-family: "My Custom Font", Verdana, Tahoma; |
font-size: 18px; | font-size: 18px; | ||
//font-weight:bold; | //font-weight:bold; |
Revision as of 19:41, 5 August 2014
@font-face {
font-family: DeliciousRoman, Helvetica, Arial, sans-serif; src: url(http://www.font-face.com/fonts/delicious/Delicious-Roman.otf); font-weight:400;
}
/* ------- Nav-bar ----------- */
- menu_container {
clear: both; width:100%; max-width: 1920px; margin-right: auto; margin-left: auto;
}
.clear { clear: both; /* Vettefan varför man behöver en tom div som bara clearar, allting fuckade upp utan denna */ }
- middle_logo {
position: relative;
width: 20%; height: 0px; border-top: 55px solid black; float: left; }
.home_logo { position: absolute;
top: -130px;
left: 50%; margin-left: -125px; width: 250px;
}
- menu {
background: #000; height: 46px; max-height:46px; text-align: center; font-family: "My Custom Font", Verdana, Tahoma; font-size: 18px; //font-weight:bold; float: left; width: 40%; max-width: 768px;
}
- menu ul {
margin:0;padding:0; position:absolute; width:40%; max-width: 768px;
}
- 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: 9px; padding-bottom: 9px; 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%; z-index: 1000;
}
- 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; max-height:46px; float: right; width: 40%; max-width: 768px; text-align: center; font-family: "Cambria"; //"Times New Roman", Times, serif; font-size: 18px;
}
- menu_right ul {
margin:0;padding:0; position:absolute; width:40%; max-width: 768px;
}
- 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: 9px; padding-bottom: 9px; 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%; z-index: 1000;
}
- 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%; }