|
|
Line 8: |
Line 8: |
| <meta http-equiv="content-type" content="text/html; charset=windows-1252" /> | | <meta http-equiv="content-type" content="text/html; charset=windows-1252" /> |
| <!--<link rel="stylesheet" type="text/css" href="css/style.css" />--> | | <!--<link rel="stylesheet" type="text/css" href="css/style.css" />--> |
− | <style>
| |
− | @font-face {
| |
− | font-family: News Cycle;
| |
− | src: url('https://static.igem.org/mediawiki/2017/1/1a/NewsCycle-Regular.eot');
| |
− | src: local("News Cycle"), url('https://static.igem.org/mediawiki/2017/5/52/NewsCycle-Regular.ttf');
| |
− | }
| |
| | | |
− | html
| |
− | { height: 100%;}
| |
− |
| |
− | *
| |
− | { margin: 0;
| |
− | padding: 0;}
| |
− |
| |
− | body
| |
− | { font: normal 80% Arial, Helvetica, sans-serif;
| |
− | color: #FFF;
| |
− | text-shadow: 1px 1px #000;
| |
− | background: transparent url(https://static.igem.org/mediawiki/2017/1/1f/Background.jpg) repeat;}
| |
− |
| |
− | /* tell the browser to render HTML 5 elements as block */
| |
− | article, aside, figure, footer, header, hgroup, nav, section {
| |
− | display:block;
| |
− | }
| |
− |
| |
− | p
| |
− | { padding: 0 0 10px 0;
| |
− | line-height: 1.7em;}
| |
− |
| |
− | img
| |
− | { border: 0;}
| |
− |
| |
− | h1, h2, h3, h4, h5, h6
| |
− | { font: normal 250% 'News Cycle', Arial, sans-serif;
| |
− | color: #FFF;
| |
− | letter-spacing: -1px;
| |
− | margin: 0 0 10px 0;}
| |
− |
| |
− | h2
| |
− | { font-size: 165%;
| |
− | }
| |
− |
| |
− | h3
| |
− | { font-size: 130%;}
| |
− |
| |
− | h4, h5, h6
| |
− | { margin: 0;
| |
− | padding: 0 0 0px 0;
| |
− | font-size: 150%;
| |
− | line-height: 1.5em;}
| |
− |
| |
− | h5, h6
| |
− | { font: normal 95% Arial, Helvetica, sans-serif;
| |
− | padding-bottom: 15px;}
| |
− |
| |
− | span
| |
− | { color: #432415;
| |
− | text-shadow: 1px 1px #FFF;}
| |
− |
| |
− | a, a:hover
| |
− | { color: #FFF;
| |
− | background: transparent;
| |
− | outline: none;
| |
− | text-decoration: none;}
| |
− |
| |
− | a:hover
| |
− | { text-decoration: underline;}
| |
− |
| |
− | ul
| |
− | { margin: 2px 0 22px 30px;
| |
− | line-height: 1.7em;
| |
− | font-style: normal;
| |
− | font-size: 100%;}
| |
− |
| |
− | ol
| |
− | { margin: 8px 0 22px 20px;}
| |
− |
| |
− | ol li
| |
− | { margin: 0 0 11px 0;}
| |
− |
| |
− | #main, header, #banner, #menubar, #site_content, footer, #content_grey, nav
| |
− | { margin-left: auto;
| |
− | margin-right: auto;}
| |
− |
| |
− | #main
| |
− | { background: transparent;}
| |
− |
| |
− | header
| |
− | { height: 120px;}
| |
− |
| |
− | #banner
| |
− | { width: 940px;
| |
− | position: relative;
| |
− | height: 50px;
| |
− | padding: 15px 0 0 0;
| |
− | background: transparent;}
| |
− |
| |
− | nav
| |
− | { height: 50px;}
| |
− |
| |
− | #menubar
| |
− | { width: 940px;
| |
− | height: 50px;
| |
− | text-align: center;
| |
− | margin: 0 auto;
| |
− | background: #432415;
| |
− | background: -moz-linear-gradient(#723D27, #432415);
| |
− | background: -o-linear-gradient(#723D27, #432415);
| |
− | background: -webkit-linear-gradient(#723D27, #432415);
| |
− | border-radius: 7px 7px 0px 0px;
| |
− | -moz-border-radius: 7px 7px 0px 0px;
| |
− | -webkit-border: 7px 7px 0px 0px;}
| |
− |
| |
− | #welcome
| |
− | { width: 880px;
| |
− | float: left;
| |
− | height: 50px;
| |
− | margin: 0 auto;
| |
− | padding-left: 20px;
| |
− | background: transparent;}
| |
− |
| |
− | #welcome_slogan
| |
− | { width: 880px;
| |
− | float: left;
| |
− | height: 50px;
| |
− | margin: 0 auto;
| |
− | padding-left: 20px;
| |
− | background: transparent;}
| |
− |
| |
− | #welcome H3
| |
− | { font: bold 300% 'News Cycle', Arial, sans-serif;
| |
− | text-shadow: 1px 1px #000;
| |
− | color: #FFF;}
| |
− |
| |
− | #welcome_slogan H3
| |
− | { font: bold 200% 'News Cycle', Arial, sans-serif;
| |
− | text-shadow: 1px 1px #000;
| |
− | color: #FFF;}
| |
− |
| |
− | ul#nav
| |
− | { margin:0;
| |
− | float: right;}
| |
− |
| |
− | ul#nav li
| |
− | { padding: 0 0 0 0px;
| |
− | list-style: none;
| |
− | margin: 2px 0 0 0;
| |
− | display: inline;
| |
− | background: transparent;}
| |
− |
| |
− | ul#nav li a
| |
− | { float: left;
| |
− | font: bold 120% Arial, Helvetica, sans-serif;
| |
− | height: 24px;
| |
− | margin: 10px 20px 0 0;
| |
− | text-shadow: 0px -1px 0px #000;
| |
− | padding: 6px 20px 0 20px;
| |
− | background: transparent;
| |
− | border-radius: 7px 7px 7px 7px;
| |
− | -moz-border-radius: 7px 7px 7px 7px;
| |
− | -webkit-border: 7px 7px 7px 7px;
| |
− | text-align: center;
| |
− | color: #FFF;
| |
− | text-decoration: none;}
| |
− |
| |
− | ul#nav li.current a, ul#nav li:hover a
| |
− | { color: #FFF;
| |
− | background: #723D27;
| |
− | background: -moz-linear-gradient(#432415, #723D27);
| |
− | background: -o-linear-gradient(#432415, #723D27);
| |
− | background: -webkit-linear-gradient(#432415, #723D27);
| |
− | text-shadow: none;}
| |
− |
| |
− | #site_content
| |
− | { width: 940px;
| |
− | overflow: hidden;
| |
− | margin-bottom: 30px;
| |
− | background: #884C34;
| |
− | border-radius: 0px 0px 7px 7px;
| |
− | -moz-border-radius: 0px 0px 7px 7px;
| |
− | -webkit-border: 0px 0px 7px 7px;
| |
− | -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
| |
− | -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
| |
− | box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;}
| |
− |
| |
− | #content
| |
− | { width: 900px;
| |
− | margin: 0 0 20px 20px;
| |
− | float: left;
| |
− | text-align: justify;}
| |
− |
| |
− | .content_item
| |
− | { width: 900px;
| |
− | margin-bottom: 20px;}
| |
− |
| |
− | .content_item h1
| |
− | { text-align: center;}
| |
− |
| |
− | .content_imagetext
| |
− | { width: 890px;
| |
− | padding: 5px;
| |
− | margin: 20px 0 0 0;
| |
− | float: left;}
| |
− |
| |
− | .content_image
| |
− | { float: left;
| |
− | width: 300px;
| |
− | height: 150px;
| |
− | margin: 0 20px 10px 0;
| |
− | padding: 10px;
| |
− | -moz-box-shadow: inset 0 0 20px #ADADAD;
| |
− | -webkit-box-shadow: inset 0 0 20px #ADADAD;
| |
− | box-shadow: inset 0 0 20px #ADADAD;}
| |
− |
| |
− | .content_container
| |
− | { width: 275px;
| |
− | padding: 5px;
| |
− | margin: 10px 10px 20px 0;
| |
− | float: left;}
| |
− |
| |
− | footer
| |
− | { width: 940px;
| |
− | height: 50px;
| |
− | padding-top: 15px;
| |
− | padding-bottom: 15px;
| |
− | margin-bottom: 30px;
| |
− | font-weight: bold;
| |
− | text-align: center;
| |
− | background: #432415;
| |
− | background: -moz-linear-gradient(#723D27, #432415);
| |
− | background: -o-linear-gradient(#723D27, #432415);
| |
− | background: -webkit-linear-gradient(#723D27, #432415);
| |
− | border-radius: 7px 7px 7px 7px;
| |
− | -moz-border-radius: 7px 7px 7px 7px;
| |
− | -webkit-border: 7px 7px 7px 7px;
| |
− | -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
| |
− | -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
| |
− | box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;}
| |
− |
| |
− | footer a, footer a:hover
| |
− | { text-decoration: none;
| |
− | padding-bottom: 20px;
| |
− | color: #FFF;}
| |
− |
| |
− | footer a:hover
| |
− | { text-decoration: underline;}
| |
− |
| |
− | .button_small
| |
− | { font: normal 110% Arial, Helvetica, sans-serif;
| |
− | width: 180px;
| |
− | padding: 5px 2px 7px 2px;
| |
− | background: #432415;
| |
− | background: -moz-linear-gradient(#723D27, #432415);
| |
− | background: -o-linear-gradient(#723D27, #432415);
| |
− | background: -webkit-linear-gradient(#723D27, #432415);
| |
− | border-radius: 7px 7px 7px 7px;
| |
− | -moz-border-radius: 7px 7px 7px 7px;
| |
− | -webkit-border: 7px 7px 7px 7px;
| |
− | -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
| |
− | -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
| |
− | box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;}
| |
− |
| |
− | .button_small a
| |
− | { color: #FFF;
| |
− | text-shadow: 1px 1px #000;
| |
− | padding-left: 5px;}
| |
− |
| |
− | .form_settings
| |
− | { margin: 15px 0 0 0;}
| |
− |
| |
− | .form_settings p
| |
− | { padding: 0 0 4px 0;}
| |
− |
| |
− | .form_settings span
| |
− | { float: left;
| |
− | width: 280px;
| |
− | text-align: left;
| |
− | text-shadow: 1px 1px #000;
| |
− | color: #FFF;}
| |
− |
| |
− | .form_settings input, .form_settings textarea
| |
− | { padding: 2px;
| |
− | width: 299px;
| |
− | font: 100% arial;
| |
− | border: 1px solid #E5E5DB;
| |
− | background: #FFF;
| |
− | color: #47433F;}
| |
− |
| |
− | .form_settings input[type="checkbox"]
| |
− | { padding: 2px 0;
| |
− | width: 15px;
| |
− | font: 100% arial;
| |
− | border: 0;
| |
− | background: #FFF;
| |
− | color: #47433F;
| |
− | margin: 28px 0;}
| |
− |
| |
− | .form_settings .submit
| |
− | { font: 100% arial;
| |
− | border: none;
| |
− | width: 99px;
| |
− | margin: 0 0 0 206px;
| |
− | height: 26px;
| |
− | padding: 2px 0 3px 0;
| |
− | cursor: pointer;
| |
− | background: #432415;
| |
− | background: -moz-linear-gradient(#723D27, #432415);
| |
− | background: -o-linear-gradient(#723D27, #432415);
| |
− | background: -webkit-linear-gradient(#723D27, #432415);
| |
− | border: 1px solid #432415;
| |
− | color: #FFF;}
| |
− |
| |
− | .slideshow
| |
− | { width: 900px;
| |
− | height: 250px;
| |
− | margin-left: 20px;
| |
− | -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
| |
− | -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
| |
− | box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;}
| |
− |
| |
− | /* styling for the slideshow on the homepage */
| |
− | ul.slideshow {
| |
− | list-style: none;
| |
− | width: 900px;
| |
− | height: 250px;
| |
− | overflow: hidden;
| |
− | position: relative;
| |
− | margin: 20px 0 0 0;}
| |
− |
| |
− | ul.slideshow li {
| |
− | position: absolute;
| |
− | margin: 0;
| |
− | padding: 0;
| |
− | left: 0;
| |
− | right: 0;}
| |
− |
| |
− | ul.slideshow li.show {
| |
− | z-index: 500;}
| |
− |
| |
− | ul img {
| |
− | border: none;}
| |
− |
| |
− | #slideshow-caption {
| |
− | width: 900px;
| |
− | height: 38px;
| |
− | position: absolute;
| |
− | bottom: 0;
| |
− | left: 0;
| |
− | z-index: 500;}
| |
− |
| |
− | #slideshow-caption .slideshow-caption-container {
| |
− | padding: 10px 25px 10px 25px;
| |
− | background: transparent url(https://static.igem.org/mediawiki/2017/8/8c/Transparent.png) repeat;
| |
− | z-index: 1000;}
| |
− |
| |
− | #slideshow-caption p {
| |
− | padding: 0;
| |
− | font: normal 130% arial, sans-serif;
| |
− | color: #FFF;
| |
− | text-shadow: 1px 1px #000;}
| |
− |
| |
− | table, th, td {
| |
− | border: 1px solid white;
| |
− | }
| |
− |
| |
− | td{
| |
− | text-align: left;
| |
− | }
| |
− |
| |
− | th {
| |
− | text-align: center;
| |
− | padding: 8px;
| |
− | }
| |
− |
| |
− | #htd{
| |
− | text-align: center;
| |
− | font-size: 240%;
| |
− | }
| |
− |
| |
− | .content_imagetext1
| |
− | { width: 890px;
| |
− | padding: 5px;
| |
− | margin: 20px 0 0 0;
| |
− | float: left;}
| |
− |
| |
− | .content_image1
| |
− | { float: left;
| |
− | width: 199px;
| |
− | height: 284px;
| |
− | margin: 0 20px 10px 0;
| |
− | padding: 10px;
| |
− | -moz-box-shadow: inset 0 0 20px #ADADAD;
| |
− | -webkit-box-shadow: inset 0 0 20px #ADADAD;
| |
− | box-shadow: inset 0 0 20px #ADADAD;}
| |
− |
| |
− | .content_imagetext2
| |
− | { width: 890px;
| |
− | padding: 5px;
| |
− | margin: 20px 0 0 0;
| |
− | float: left;}
| |
− |
| |
− | .content_image2
| |
− | { float: left;
| |
− | width: 250px;
| |
− | height: 284px;
| |
− | margin: 0 20px 10px 0;
| |
− | padding: 10px;
| |
− | -moz-box-shadow: inset 0 0 20px #ADADAD;
| |
− | -webkit-box-shadow: inset 0 0 20px #ADADAD;
| |
− | box-shadow: inset 0 0 20px #ADADAD;}
| |
− |
| |
− | </style>
| |
| <!-- modernizr enables HTML5 elements and feature detects --> | | <!-- modernizr enables HTML5 elements and feature detects --> |
| <script type="text/javascript" src="js/modernizr-1.5.min.js"></script> | | <script type="text/javascript" src="js/modernizr-1.5.min.js"></script> |