AndrewWild (Talk | contribs) |
AndrewWild (Talk | contribs) |
||
Line 53: | Line 53: | ||
#links{ | #links{ | ||
color:#47BCC2; | color:#47BCC2; | ||
− | font-size:20px; | + | /*font-size:20px;*/ |
+ | font-size:1.2vw; | ||
+ | margin:0 0.9vw 0.5vh 0.9vw; | ||
+ | padding:0; | ||
line-height:0px; | line-height:0px; | ||
padding-top:28px; | padding-top:28px; | ||
} | } | ||
− | + | /*Fixes font size when nav-bar is collapsed*/ | |
+ | @media (max-width: 920px) { | ||
+ | #links{ | ||
+ | font-size:20px; | ||
+ | } | ||
+ | #links_drop{ | ||
+ | margin:0.9vw -0.4vw 0 -0.2vw; | ||
+ | } | ||
+ | } | ||
#links:hover{ | #links:hover{ | ||
color:#339499; | color:#339499; | ||
Line 97: | Line 108: | ||
#soc{ | #soc{ | ||
margin-top:-12px; | margin-top:-12px; | ||
− | + | margin-left:-15px; | |
} | } | ||
− | + | .soc_1{ | |
− | + | ||
− | + | ||
margin-right:3px; | margin-right:3px; | ||
− | |||
− | |||
} | } | ||
− | + | .soc_2{ | |
− | + | ||
margin-right:3px; | margin-right:3px; | ||
− | |||
− | |||
} | } | ||
− | + | .soc_3{ | |
− | + | ||
margin-right:3px; | margin-right:3px; | ||
− | |||
− | |||
− | |||
} | } | ||
Line 211: | Line 211: | ||
border-style:none; | border-style:none; | ||
} | } | ||
− | |||
#pp{ | #pp{ | ||
− | + | padding-top:20px; | |
− | + | padding-right:40px; | |
− | + | padding-left:40px; | |
− | font-size: | + | font-size:150%; |
} | } | ||
− | + | .container ul, .container ol{ | |
− | . | + | font-size:140%; |
+ | padding-right:40px; | ||
+ | padding-left:60px; | ||
+ | padding-top:10px; | ||
} | } | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
/*Heading styles*/ | /*Heading styles*/ | ||
− | + | h1, h2, h3, h4, h5{ | |
text-align:center; | text-align:center; | ||
color:#339499; | color:#339499; | ||
font-weight:500; | font-weight:500; | ||
+ | padding-left: 40px; | ||
+ | padding-right: 40px; | ||
+ | padding-top: 40px; | ||
+ | padding-bottom:0; | ||
} | } | ||
h1{font-size:340%;} | h1{font-size:340%;} | ||
Line 327: | Line 238: | ||
h4{font-size:260%;} | h4{font-size:260%;} | ||
h5{font-size:220%;} | h5{font-size:220%;} | ||
− | + | h6{ | |
color:#339499; | color:#339499; | ||
font-weight:500; | font-weight:500; | ||
font-size:200%; | font-size:200%; | ||
− | padding-left: | + | padding-left:40px; |
+ | padding-top: 20px; | ||
+ | padding-bottom:-10px; | ||
} | } | ||
− | |||
/*Italics for Quotes using i tag*/ | /*Italics for Quotes using i tag*/ | ||
q{ | q{ | ||
Line 344: | Line 256: | ||
} | } | ||
/*Styling for links*/ | /*Styling for links*/ | ||
− | + | a{ | |
color:#339499; | color:#339499; | ||
font-weight:550; | font-weight:550; | ||
Line 397: | Line 309: | ||
background-size: 100% auto; | background-size: 100% auto; | ||
width:100%; | width:100%; | ||
− | height: | + | height:88vh; |
} | } | ||
#title{ | #title{ | ||
Line 426: | Line 338: | ||
height:8vh; | height:8vh; | ||
padding:0; | padding:0; | ||
+ | margin:auto; | ||
+ | position:relative; | ||
+ | bottom:0; | ||
+ | right:0; | ||
} | } | ||
.subdiv_banner.left{ | .subdiv_banner.left{ | ||
Line 442: | Line 358: | ||
width:100%; | width:100%; | ||
position: relative; | position: relative; | ||
− | top: | + | top: 38%; |
-ms-transform: translateY(-50%) /* IE 9 */ | -ms-transform: translateY(-50%) /* IE 9 */ | ||
-webkit-transform: translateY(-50%) /* Chrome, Safari, Opera */ | -webkit-transform: translateY(-50%) /* Chrome, Safari, Opera */ | ||
− | transform: translateY(-50%) | + | transform: translateY(-50%); |
} | } | ||
.banner_link,.banner_link:visited{ | .banner_link,.banner_link:visited{ | ||
+ | position: relative; | ||
height:100%; | height:100%; | ||
+ | padding:0, 2px!important; | ||
color:#47BCC2; | color:#47BCC2; | ||
text-align:center; | text-align:center; | ||
+ | font-size:1.5vw; | ||
/*Max font size where "section" and "1" don't appear on*/ | /*Max font size where "section" and "1" don't appear on*/ | ||
+ | } | ||
+ | .banner_link span.oneline{ | ||
+ | position: relative; | ||
+ | top: 34.5%; | ||
+ | -ms-transform: translateY(-50%) /* IE 9 */ | ||
+ | -webkit-transform: translateY(-50%) /* Chrome, Safari, Opera */ | ||
+ | transform: translateY(-50%); | ||
+ | } | ||
+ | .banner_link span.twoline{ | ||
+ | position: relative; | ||
+ | top: 7.5%; | ||
+ | -ms-transform: translateY(-50%) /* IE 9 */ | ||
+ | -webkit-transform: translateY(-50%) /* Chrome, Safari, Opera */ | ||
+ | transform: translateY(-50%); | ||
} | } | ||
.banner_link:hover{ | .banner_link:hover{ | ||
Line 457: | Line 390: | ||
color:#339499; | color:#339499; | ||
} | } | ||
− | + | .link_fix{ | |
+ | display:block; | ||
+ | position:relative; | ||
+ | height:1px; | ||
+ | top:-15px; | ||
+ | } | ||
/*Mobile and small screen css*/ | /*Mobile and small screen css*/ | ||
@media (max-width: 767px){ | @media (max-width: 767px){ | ||
+ | .link_fix{ | ||
+ | display:none; | ||
+ | } | ||
.div_vl.backgroundimage{ | .div_vl.backgroundimage{ | ||
background-image: url('#'); | background-image: url('#'); | ||
Line 465: | Line 406: | ||
} | } | ||
#title{ | #title{ | ||
− | font-size: | + | font-size:260%; |
+ | } | ||
+ | .banner_link{ | ||
+ | font-size:22px; | ||
+ | } | ||
+ | .div_banner{ | ||
+ | margin-top:20px; | ||
} | } | ||
/*Makes side pictures on banner invisible on small screens*/ | /*Makes side pictures on banner invisible on small screens*/ | ||
Line 473: | Line 420: | ||
} | } | ||
} | } | ||
+ | #dropdownMenu1{ | ||
+ | margin-top:-0.15vw; | ||
+ | background:#e8e8e8; | ||
+ | border-style:none; | ||
+ | } | ||
+ | @media (min-width: 767px){ | ||
+ | .dropdown-menu{ | ||
+ | margin-top:24px; | ||
+ | left:-19px; | ||
+ | border-radius:0px; | ||
+ | padding:4px; | ||
+ | } | ||
+ | } | ||
+ | /*Mobile and small screen css*/ | ||
+ | @media (max-width: 767px){ | ||
+ | .div_vl.backgroundimage{ | ||
+ | height:65vh; | ||
+ | background-size: auto 200%; | ||
+ | } | ||
+ | .banner_link.filler{ | ||
+ | display:none; | ||
+ | } | ||
+ | .div_l{ | ||
+ | display:none; | ||
+ | } | ||
+ | #logo_Banner_Desktop{ | ||
+ | display:none; | ||
+ | } | ||
+ | #logo_Banner_Mobile{ | ||
+ | display:block; | ||
+ | width:100%; | ||
+ | max-width:200px; | ||
+ | margin:auto; | ||
+ | } | ||
+ | #dropdownMenu1{ | ||
+ | padding:2.5% 0 2% 0; | ||
+ | margin:-1.6% auto -1.4% 0.9%; | ||
+ | } | ||
+ | #links{ | ||
+ | padding:10px 0; | ||
+ | margin-left:0.85vw; | ||
+ | } | ||
+ | } | ||
+ | #links_drop{ | ||
+ | color:#47BCC2; | ||
+ | /*font-size:20px;*/ | ||
+ | font-size:1.2vw; | ||
+ | margin:8px 0.9vw 0.5vh 0.9vw; | ||
+ | padding:0.06vw 0 0 0; | ||
+ | line-height:0px; | ||
+ | } | ||
+ | @media (max-width: 920px){ | ||
+ | #links_drop{ | ||
+ | margin-left:0; | ||
+ | padding-top:9px; | ||
+ | margin-top:-4px; | ||
+ | font-size:20px; | ||
+ | } | ||
+ | } | ||
+ | button.dropdown-toggle{ | ||
+ | padding-top:21px; !important | ||
+ | } | ||
+ | @media (max-width: 767px){ | ||
+ | button.dropdown-toggle{ | ||
+ | padding-top:5px; | ||
+ | } | ||
+ | } | ||
+ | #links_drop:hover span{ | ||
+ | color:#339499; | ||
} | } | ||
</style> | </style> | ||
− | + | <div id="top_page" class="link_fix"></div> | |
− | + | ||
<nav id="Top" class="navbar navbar-inverse navbar-static-top"> | <nav id="Top" class="navbar navbar-inverse navbar-static-top"> | ||
<div class="container-fluid"> | <div class="container-fluid"> | ||
Line 493: | Line 508: | ||
<div> | <div> | ||
<div class="collapse navbar-collapse" id="myNavbar"> | <div class="collapse navbar-collapse" id="myNavbar"> | ||
− | + | <ul class="nav navbar-nav"> | |
− | <li ><a id="links"href="https://2016.igem.org/Team:Exeter/Project">Project</a></li> | + | <li><div id="links_drop" class="dropdown"> |
+ | <button class="dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> | ||
+ | <span style="margin-bottom:4px;">Lab</span> | ||
+ | <span class="caret"></span> | ||
+ | </button> | ||
+ | <ul class="dropdown-menu" style="background:#e8e8e8;margin-left:25px;" aria-labelledby="dropdownMenu1"> | ||
+ | <li><a id="links" style="margin:10px 0 30px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/Project">Lab Project</a></li> | ||
+ | <li><a id="links" style="margin:30px 0 10px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/Labbook">Lab Book</a></li> | ||
+ | |||
+ | </ul> | ||
+ | </div></li> | ||
<li ><a id="links"href="https://2016.igem.org/Team:Exeter/Parts">Parts</a></li> | <li ><a id="links"href="https://2016.igem.org/Team:Exeter/Parts">Parts</a></li> | ||
<li ><a id="links"href="https://2016.igem.org/Team:Exeter/Team">Team</a></li> | <li ><a id="links"href="https://2016.igem.org/Team:Exeter/Team">Team</a></li> | ||
− | + | <li><a id="links" href="https://2016.igem.org/Team:Exeter/Interlab">InterLab</a></li> | |
+ | <li><div id="links_drop" class="dropdown"> | ||
+ | <button class="dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> | ||
+ | <span style="margin-bottom:4px;">Human Practices</span> | ||
+ | <span class="caret"></span> | ||
+ | </button> | ||
+ | <ul class="dropdown-menu" style="background:#e8e8e8;margin-left:25px;" aria-labelledby="dropdownMenu1"> | ||
+ | <li><a id="links" style="margin:10px 0 10px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/Integrated_Practices">Integrated</a></li> | ||
+ | <li><a id="links" style="background:none;line-height:0.7vh;margin:30px 0 10px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/Engagement">Public Engagement<br /><br /><br /> & Education</a></li><li><a id="links" style="margin:30px 0 10px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/Log">Log</a></li> | ||
+ | |||
+ | </ul> | ||
+ | </div></li> | ||
+ | |||
<li ><a id="links"href="https://2016.igem.org/Team:Exeter/Attributions">Attributions</a></li> | <li ><a id="links"href="https://2016.igem.org/Team:Exeter/Attributions">Attributions</a></li> | ||
− | + | ||
− | + | <li><div id="links_drop" class="dropdown"> | |
− | + | <button class="dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> | |
− | + | <span style="margin-bottom:4px;">Awards</span> | |
− | + | <span class="caret"></span> | |
− | + | </button> | |
− | + | <ul class="dropdown-menu" style="background:#e8e8e8;margin-left:25px;" aria-labelledby="dropdownMenu1"> | |
− | + | ||
− | + | <li><a id="links" style="margin:10px 0 30px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/Awards">Awards</a></li> | |
− | + | <li><span style="margin:10px 0 30px 2px;padding:0;">Special pages</span></li> | |
− | + | <li><a id="links" style="margin:30px 0 10px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/HP/Silver">HP Silver</a></li> | |
− | + | <li><a id="links" style="margin:30px 0 10px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/HP/Gold">HP Gold</a></li> | |
− | + | ||
− | + | </ul> | |
− | + | </div></li> | |
− | + | <li ><a id="links"href="https://2016.igem.org/Team:Exeter/Model">Models</a></li> | |
− | + | <li ><a id="links"href="https://2016.igem.org/Team:Exeter/Collaborations">Collaborations</a></li> | |
− | + | ||
+ | |||
+ | |||
</ul> | </ul> | ||
+ | <ul class="nav navbar-nav navbar-right"> | ||
+ | <li style="height:50px;width:48px;"class="soc_1"> | ||
+ | <a href="https://www.youtube.com/channel/UC31qfG4hnm8gRHDCkrBtAiQ"> | ||
+ | <img id = "soc" src="https://static.igem.org/mediawiki/2016/2/23/You.png"/></a> | ||
+ | </li> | ||
+ | <li style="height:50px;width:48px;"class="soc_2"> | ||
+ | <a href="https://www.facebook.com/ExeteriGEM2016/?ref=aymt_homepage_panel"> | ||
+ | <img id = "soc" src="https://static.igem.org/mediawiki/2016/5/51/Fb.png"/></a> | ||
+ | </li> | ||
+ | <li style="height:50px;width:48px;"class="soc_3"> | ||
+ | <a href="https://twitter.com/exeter_igem"> | ||
+ | <img id = "soc" src="https://static.igem.org/mediawiki/2016/7/76/Twit.jpg"/></a> | ||
+ | </li> | ||
+ | </ul> | ||
</div> | </div> | ||
</div> | </div> |
Revision as of 22:42, 19 October 2016