(Prototype team template page) |
Ryancoates (Talk | contribs) |
||
Line 87: | Line 87: | ||
− | + | <style type="text/css">body { cursor: url('data:image/x-icon;base64,AAACAAEAICAQAAAAAADoAgAAFgAAACgAAAAgAAAAQAAAAAEABAAAAAAAAAIAAAAAAAAAAAAAEAAAAAAAAAAAAAAAI1lPABNuFAAWlDQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACIiIAARAAAAAAAAAAAAACIiMyMyIAAAAAAAAAAAACIiMzMiIiAAAAAAAAAAAAIiMyIiIiIgAAAAAAAAAAACIzMzMiIzIAAAAAAAAAAAIjIiIiIyIiAAAAAAAAAAACIzMzIiMyIgAAAAAAAAAAAiIiIiMiMyIAAAAAAAAAAAIjMzIjMjIiAAAAAAAAAAACMyIiIzIyIgAAAAAAAAAAAiIiIyMzMiAAAAAAAAAAAAIzIiMjMyIgAAAAAAAAAAACMiMjMzIiAAAAAAAAAAAAAiIzIzIiIAAAAAAAAAAAAAIjMyMyIAAAAAAAAAAAAAACIiIiIAAAAAAAAAAAAAAAD//////////////////////////////////////////////////////////////////////////////////////Bz///AB///AAf//gAH//4AB//8AAf//AAH//wAB//8AAf//AAH//wAD//8AA///AAf//wAP//8AP///AP///w=='), auto; } | |
<style> | <style> | ||
− | |||
− | |||
/***************************************************** DEFAULT WIKI SETTINGS ****************************************************/ | /***************************************************** DEFAULT WIKI SETTINGS ****************************************************/ | ||
Line 181: | Line 179: | ||
/* styling for the menu buttons on hover */ | /* styling for the menu buttons on hover */ | ||
.igem_2017_menu_wrapper .menu_button:hover, .igem_2017_menu_wrapper .submenu_button:hover , .submenu_button.current_page:hover { | .igem_2017_menu_wrapper .menu_button:hover, .igem_2017_menu_wrapper .submenu_button:hover , .submenu_button.current_page:hover { | ||
− | background-color: # | + | background-color: #b3ffb3; |
text-decoration: none; | text-decoration: none; | ||
color:#ffffff; | color:#ffffff; | ||
Line 221: | Line 219: | ||
/* Wrapper for the content */ | /* Wrapper for the content */ | ||
.igem_2017_content_wrapper { | .igem_2017_content_wrapper { | ||
− | width: | + | width: 100%; |
margin: 2%; | margin: 2%; | ||
display:block; | display:block; | ||
Line 236: | Line 234: | ||
padding:5px 15px; | padding:5px 15px; | ||
border-bottom: 0px; | border-bottom: 0px; | ||
− | + | ||
} | } | ||
Line 244: | Line 242: | ||
padding:5px 15px; | padding:5px 15px; | ||
border-bottom:0px; | border-bottom:0px; | ||
− | + | ||
} | } | ||
Line 258: | Line 256: | ||
font-weight: bold; | font-weight: bold; | ||
text-decoration: underline; | text-decoration: underline; | ||
− | text-decoration-color: # | + | text-decoration-color: #b3ffb3; |
− | color: # | + | color: #b3ffb3; |
-webkit-transition: all 0.4s ease; | -webkit-transition: all 0.4s ease; | ||
-moz-transition: all 0.4s ease; | -moz-transition: all 0.4s ease; | ||
Line 339: | Line 337: | ||
.column.half_size img { | .column.half_size img { | ||
width: 94.5%; | width: 94.5%; | ||
+ | padding: 10px 15px; | ||
+ | } | ||
+ | |||
+ | |||
+ | /************************************** ADDED ******************************/ | ||
+ | /* class for a third width column */ | ||
+ | .column.third_size { | ||
+ | width: 30%; | ||
+ | } | ||
+ | |||
+ | /* styling for images in a half width column*/ | ||
+ | .column.half_size img { | ||
+ | width: 92%; | ||
padding: 10px 15px; | padding: 10px 15px; | ||
} | } | ||
Line 373: | Line 384: | ||
/* highlight with decoration blue line on top */ | /* highlight with decoration blue line on top */ | ||
.igem_2017_content_wrapper .highlight.blue_top { | .igem_2017_content_wrapper .highlight.blue_top { | ||
− | border-top: 4px solid # | + | border-top: 4px solid #b3ffb3; |
} | } | ||
/* highlight with a full blue border decoration */ | /* highlight with a full blue border decoration */ | ||
.igem_2017_content_wrapper .highlight.blue_border { | .igem_2017_content_wrapper .highlight.blue_border { | ||
− | border: 4px solid # | + | border: 4px solid #b3ffb3; |
} | } | ||
Line 387: | Line 398: | ||
margin: 30px auto; | margin: 30px auto; | ||
padding: 12px 10px; | padding: 12px 10px; | ||
− | background-color: # | + | background-color: #b3ffb3; |
text-align: center; | text-align: center; | ||
color: #ffffff; | color: #ffffff; | ||
Line 398: | Line 409: | ||
/* styling for button on hover */ | /* styling for button on hover */ | ||
.igem_2017_content_wrapper .button:hover{ | .igem_2017_content_wrapper .button:hover{ | ||
− | background-color: # | + | background-color: #b3ffb3; |
color: #000000; | color: #000000; | ||
} | } | ||
Line 442: | Line 453: | ||
margin: 5px 15px; | margin: 5px 15px; | ||
display: block; | display: block; | ||
− | border: 4px solid # | + | border: 4px solid #b3ffb3; |
font-weight: bold; | font-weight: bold; | ||
} | } | ||
− | |||
− | |||
+ | /************************** OUR STYLE ***************************/ | ||
+ | #content { | ||
+ | width: 100% !important; | ||
+ | padding: 0px !important; | ||
+ | margin: 0px !important; | ||
+ | top: 0px !important; | ||
+ | position: absolute !important; | ||
− | + | } | |
− | + | html,body,h2,h3,h4,h5,h6,par { | |
− | + | font-family: "Verdana"; | |
+ | color:#b3ffb3 | ||
+ | } | ||
− | + | h1 { | |
+ | color: black; | ||
+ | font-family: "Verdana" | ||
+ | |||
+ | } | ||
+ | body { | ||
+ | background-color: black; | ||
+ | } | ||
+ | p { | ||
+ | color:#b3ffb3; | ||
+ | font-family: courier; | ||
+ | font-size: 160%; | ||
+ | } | ||
+ | img { margin-top: 0px; | ||
+ | margin-bottom: 0px; | ||
+ | margin-right: 50px; | ||
+ | margin-left: 50px; | ||
+ | } | ||
− | |||
+ | .container { | ||
+ | overflow: hidden; | ||
+ | background-color: #00802b; | ||
+ | font-family: Arial; | ||
+ | } | ||
+ | .container a { | ||
+ | float: left; | ||
+ | font-size: 16px; | ||
+ | color: white; | ||
+ | text-align: center; | ||
+ | padding: 14px 16px; | ||
+ | text-decoration: none; | ||
+ | } | ||
− | + | .dropdown { | |
− | + | float: left; | |
− | + | overflow: hidden; | |
+ | } | ||
+ | .dropdown .dropbtn { | ||
+ | font-size: 16px; | ||
+ | border: none; | ||
+ | outline: none; | ||
+ | color: white; | ||
+ | padding: 14px 16px; | ||
+ | background-color: inherit; | ||
+ | } | ||
− | + | .container a:hover, .dropdown:hover .dropbtn { | |
− | + | background-color: #00b33c; opacity:1.0; | |
− | + | } | |
− | + | ||
− | + | .dropdown-content { | |
− | + | display: none; | |
+ | position: absolute; | ||
+ | background-color: #00b33c; | ||
+ | min-width: 160px; | ||
+ | box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); | ||
+ | z-index: 1; | ||
+ | } | ||
+ | .dropdown-content a { | ||
+ | float: none; | ||
+ | color: white; | ||
+ | padding: 12px 16px; | ||
+ | text-decoration: none; | ||
+ | display: block; | ||
+ | text-align: left; | ||
+ | } | ||
+ | .dropdown-content a:hover { | ||
+ | background-color: #00cc44; | ||
+ | } | ||
− | + | .dropdown:hover .dropdown-content { | |
− | + | display: block; | |
− | + | } | |
− | + | ||
− | + | ||
+ | div.background { | ||
+ | background-color: black; | ||
+ | border: 2px solid black; | ||
+ | background-attachment: scroll; | ||
+ | background-position: center; | ||
+ | opacity: 0.95; | ||
+ | height: 100%; | ||
+ | width: 100%; | ||
+ | } | ||
− | |||
− | |||
− | |||
− | + | div.transbox { | |
− | + | margin: 0px; | |
− | + | background-color: #000000; | |
− | + | border: 0px solid black; | |
− | + | opacity: 1; | |
− | + | height:100% | |
− | + | } | |
+ | </style> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
+ | <!--- THIS IS WHERE THE HTML BEGINS ---> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | <head> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | <!-- This tells the browser that your page is responsive --> | |
− | + | <meta name="viewport" content="width=device-width, initial-scale=1"> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
+ | </head> | ||
− | </div> | + | <nav> |
+ | <div class="container"> | ||
+ | <a href="#home">Home</a> | ||
+ | <div class="container"> | ||
+ | <div class="dropdown"> | ||
+ | <button class="dropbtn">Project</button> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="#">Link 1</a> | ||
+ | <a href="#">Link 2</a> | ||
+ | <a href="#">Link 3</a> | ||
+ | </div></div> | ||
+ | <div class="container"> | ||
+ | <div class="dropdown"> | ||
+ | <button class="dropbtn">Progress</button> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="#">Link 1</a> | ||
+ | <a href="#">Link 2</a> | ||
+ | <a href="#">Link 3</a> | ||
+ | </div></div> | ||
+ | <div class="container"> | ||
+ | <div class="dropdown"> | ||
+ | <button class="dropbtn">Health and Safety</button> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="#">Link 1</a> | ||
+ | <a href="#">Link 2</a> | ||
+ | <a href="#">Link 3</a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="container"> | ||
+ | <div class="dropdown"> | ||
+ | <button class="dropbtn">Human Practice</button> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="#">Link 1</a> | ||
+ | <a href="#">Link 2</a> | ||
+ | <a href="#">Link 3</a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="container"> | ||
+ | <div class="dropdown"> | ||
+ | <button class="dropbtn">Team</button> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="#">Link 1</a> | ||
+ | <a href="#">Link 2</a> | ||
+ | <a href="#">Link 3</a> | ||
+ | </div> | ||
+ | </div> | ||
+ | </nav> | ||
<!-- start of content --> | <!-- start of content --> | ||
<div class="igem_2017_content_wrapper"> | <div class="igem_2017_content_wrapper"> | ||
− | <h1> | + | <center> |
+ | <h1> Nicotiana medicinae</h1> | ||
+ | </center> |
Revision as of 10:59, 15 August 2017