|
|
| Line 59: |
Line 59: |
| | } | | } |
| | | | |
| − | #fullWidthBanner {
| |
| − | margin:auto;
| |
| − | width: 975px;
| |
| − | z-index:100;
| |
| − | }
| |
| | | | |
| − | #leftColumn {
| |
| − | background-color: #d3d3d3;
| |
| − | width: 215px;
| |
| − | height: 100%;
| |
| − | float: left;
| |
| − | padding: 15px 5px 5px 5px;
| |
| − | border-radius: 5px;
| |
| − | margin-top: 10px;
| |
| − | }
| |
| | | | |
| − | #rightColumn {
| |
| − | background-color: #fff;
| |
| − | width: 740px;
| |
| − | height: 100%;
| |
| − | padding: 5px 5px 5px 5px;
| |
| − | float: left;
| |
| − | }
| |
| − |
| |
| − | #featureBoxLeft {
| |
| − | background-color: #ffffff;
| |
| − | padding: 5px 10px 10px 10px;
| |
| − | margin: 0px 10px 20px 10px;
| |
| − | border: 1px solid #cccccc;
| |
| − | border-radius: 5px;
| |
| − | }
| |
| − |
| |
| − |
| |
| − | .fullWidthRight {
| |
| − | background-color: #ffffff;
| |
| − | padding: 5px 10px 10px 10px;
| |
| − | margin-bottom: 5px;
| |
| − | }
| |
| − |
| |
| − |
| |
| − | .smallBlockRight{
| |
| − | margin-bottom: 5px;
| |
| − | padding: 5px 20px 10px 20px;
| |
| − | width : 200px;
| |
| − | float: left;
| |
| − | }
| |
| − |
| |
| − | .newsItem {
| |
| − | background-color: #fff;
| |
| − | padding: 5px 20px 5px 20px;
| |
| − | border: 1px solid #cccccc;
| |
| − | margin-bottom: 5px;
| |
| − | border-radius: 5px;
| |
| − | }
| |
| − |
| |
| − | .newsDate {
| |
| − | font-style: italic;
| |
| − | display: inline-block;
| |
| − | color: #383838;
| |
| − | float: right;
| |
| − | padding: 7px 0px 10px 15px;
| |
| − | }
| |
| − |
| |
| − | .clear {
| |
| − | clear: both;
| |
| − | }
| |
| − |
| |
| − | .button {
| |
| − | width: 120px;
| |
| − | border: 1px solid #cccccc;
| |
| − | background-color: fff;
| |
| − | height: 30px;
| |
| − | text-align: center;
| |
| − | border-radius: 5px;
| |
| − | padding-top: 10px;
| |
| − | margin: auto;
| |
| − | }
| |
| − |
| |
| − | .button:hover {
| |
| − | background-color: #c1dfa6;
| |
| − | }
| |
| − |
| |
| − | /* general styling */
| |
| − |
| |
| − | /* Titles are switched to Arial Black with no line decoration */
| |
| − | h1, h2, h3, h4, h5 {
| |
| − | font-family: "Trebuchet MS", Helvetica, sans-serif;
| |
| − | border-bottom:none;
| |
| − | font-weight: bold;
| |
| − | color: #434343;
| |
| − | }
| |
| − |
| |
| − | /* Establish font size and family for all text */
| |
| − | p {
| |
| − | font-family: "Trebuchet MS", Helvetica, sans-serif;
| |
| − | font-size: 12px;
| |
| − | }
| |
| − |
| |
| − | /*styling for the links*/
| |
| − | #rightColumn a, #featureBoxLeft a {
| |
| − | color:#3aa76c;
| |
| − | font-weight: bold;
| |
| − | text-decoration: none;
| |
| − | opacity: 1.0;
| |
| − | filter: alpha(opacity=100); /* For IE8 and earlier */
| |
| − | }
| |
| − |
| |
| − | #rightColumn a:hover, #featureBoxLeft a:hover {
| |
| − | opacity: 0.4;
| |
| − | filter: alpha(opacity=40); /* For IE8 and earlier */
| |
| − | }
| |
| − |
| |
| − | #featureBoxLeft img {
| |
| − | margin:auto;
| |
| − | text-align: center;
| |
| − | display: block;
| |
| − | opacity: 1.0;
| |
| − | filter: alpha(opacity=100); /* For IE8 and earlier */
| |
| − | }
| |
| − |
| |
| − | #featureBoxLeft img:hover {
| |
| − | opacity: 0.4;
| |
| − | filter: alpha(opacity=40); /* For IE8 and earlier */
| |
| − | }
| |
| − |
| |
| − |
| |
| − | .smallBlockRight img {
| |
| − | width:200px;
| |
| − | height: 116px;
| |
| − | padding-bottom: 5px;
| |
| − | opacity: 1.0;
| |
| − | filter: alpha(opacity=100); /* For IE8 and earlier */
| |
| − | }
| |
| − |
| |
| − |
| |
| − | .smallBlockRight img:hover {
| |
| − | opacity: 0.4;
| |
| − | filter: alpha(opacity=40); /* For IE8 and earlier */
| |
| − | }
| |
| − |
| |
| − |
| |
| − |
| |
| − | /* menu styling */
| |
| − | #menuWrap {
| |
| − | background: #d3d3d3;
| |
| − | padding: 5px 10px 10px 10px;
| |
| − | -moz-box-shadow: 0 5px 15px #cccccc;
| |
| − | -webkit-box-shadow: 0 5px 15px #cccccc;
| |
| − | }
| |
| − |
| |
| − | /*styling for the menu header */
| |
| − | .accordion-header {
| |
| − | background: #f2f2f2
| |
| − | margin: 5px 0 0 0;
| |
| − | padding: 5px 20px;
| |
| − | border: 1px solid #cccccc;
| |
| − | cursor: pointer;
| |
| − | color: #434343;
| |
| − | border-radius: 5px;
| |
| − | -moz-box-shadow: 0 5px 15px #cccccc;
| |
| − | -webkit-box-shadow: 0 5px 15px #cccccc;
| |
| − | }
| |
| − |
| |
| − | /* switches background color to green */
| |
| − | .active-header {
| |
| − | background: #95cea0;
| |
| − | }
| |
| − |
| |
| − | /* switches background color to light green */
| |
| − | .active-header:hover {
| |
| − | background: #c1dfa6;
| |
| − | }
| |
| − |
| |
| − | /* switches background color to default gray */
| |
| − | .inactive-header {
| |
| − | background: #f2f2f2;
| |
| − | }
| |
| − |
| |
| − | /* switches background color to light green */
| |
| − | .inactive-header:hover {
| |
| − | background: #c1dfa6;
| |
| − | }
| |
| − |
| |
| − | /* styling for the submenus */
| |
| − | .accordion-content {
| |
| − | display: none;
| |
| − | padding: 10px 20px 10px 20px;
| |
| − | margin-bottom: 10px;
| |
| − | background: #ffffff;
| |
| − | border: 1px solid #cccccc;
| |
| − | border-top: 0;
| |
| − | border-radius: 5px;
| |
| − | color: #434343;
| |
| − | -moz-box-shadow: 0 5px 15px #cccccc;
| |
| − | -webkit-box-shadow: 0 5px 15px #cccccc;
| |
| − | font-family: "Trebuchet MS", Helvetica, sans-serif;
| |
| − | }
| |
| − |
| |
| − |
| |
| − | /*styling the links inside the submenus */
| |
| − | ul.submenuoptions {
| |
| − | list-style: none;
| |
| − | margin: 0px;
| |
| − | margin-left: -15px;
| |
| − | padding: 0px;
| |
| − | }
| |
| − |
| |
| − | /* change the color and styling of the links */
| |
| − | ul.submenuoptions li a{
| |
| − | color: #383838;
| |
| − | font-size: 12px;
| |
| − | font-weight: bold;
| |
| − | padding-left: 15px;
| |
| − | border-radius: 5px;
| |
| − | }
| |
| − |
| |
| − | /* change background color on hover */
| |
| − | ul.submenuoptions li:hover a, ul.submenuoptions li:hover {
| |
| − | background-color: #c1dfa6;
| |
| − | text-decoration: none;
| |
| − | border-radius: 5px;
| |
| − | }
| |
| | | | |
| | </style> | | </style> |
| Line 290: |
Line 70: |
| | | | |
| | | | |
| − | <!-- jquery -->
| |
| | | | |
| − | <script ="text/javascript">
| |
| − | $(document).ready(function() {
| |
| − | //Add Inactive Class To All Accordion Headers
| |
| − | $('.accordion-header').toggleClass('inactive-header');
| |
| − |
| |
| − | //Set The Accordion Content Width
| |
| − | var contentwidth = $('.accordion-header').width();
| |
| − | $('.accordion-content').css({'width' : contentwidth });
| |
| − |
| |
| − | //Open The First Accordion Section When Page Loads
| |
| − | $('.accordion-header').first().toggleClass('active-header').toggleClass('inactive-header');
| |
| − | $('.accordion-content').first().slideDown().toggleClass('open-content');
| |
| − |
| |
| − | // The Accordion Effect
| |
| − | $('.accordion-header').click(function () {
| |
| − | if($(this).is('.inactive-header')) {
| |
| − | $('.active-header').toggleClass('active-header').toggleClass('inactive-header').next().slideToggle().toggleClass('open-content');
| |
| − | $(this).toggleClass('active-header').toggleClass('inactive-header');
| |
| − | $(this).next().slideToggle().toggleClass('open-content');
| |
| − | }
| |
| − |
| |
| − | else {
| |
| − | $(this).toggleClass('active-header').toggleClass('inactive-header');
| |
| − | $(this).next().slideToggle().toggleClass('open-content');
| |
| − | }
| |
| − | });
| |
| − |
| |
| − | return false;
| |
| − | });
| |
| − |
| |
| − | $(".button").click(function(){
| |
| − | if($(this).find("a").length){
| |
| − | window.location.href = $(this).find("a:first").attr("href");
| |
| − | }
| |
| − | });
| |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − | </script>
| |
| − |
| |
| − | <!-- end of html -->
| |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − | <!-- menu css -->
| |
| | <div id ="contentWrap"> | | <div id ="contentWrap"> |
| − | <div id="fullwidthBanner">
| |
| − | <img src="https://static.igem.org/mediawiki/2014/c/cb/Demobannerimage2.jpg" width="970px">
| |
| − | </div>
| |
| − |
| |
| − | <div class="clear"></div>
| |
| − | <div id="leftColumn">
| |
| − | <!-- this is where the menu and feature box go -->
| |
| − |
| |
| | | | |
| − | <div id="featureBoxLeft">
| |
| − | <h3>Registrations ends in one week!</h3>
| |
| − | <a href=""> <img src="https://static.igem.org/mediawiki/2014/4/4c/Featureboxdemo.jpg" height="180px" > </a>
| |
| − | <p>Registration ends March 31st. More information: <a href="">Registration </a></p>
| |
| − | </div>
| |
| − |
| |
| − | <div class="clear"></div>
| |
| − |
| |
| − |
| |
| − | <div id="menuWrap">
| |
| − |
| |
| − | <h3 class="accordion-header">iGEM</h3>
| |
| − | <div class="accordion-content">
| |
| − | <ul class="submenuoptions">
| |
| − | <li><a href="https://2014.igem.org/sifuentes_anita3">What is iGEM?</a></li>
| |
| − | <li><a href="www.html">Previous Competitions</a></li>
| |
| − | <li><a href="www.html">iGEM Headquarters</a></li>
| |
| − | <li><a href="www.html">Press Kit</a></li>
| |
| − | <li><a href="www.html">Join our Newsletter</a></li>
| |
| − | <li><a href="www.html">Sponsor iGEM</a></li>
| |
| − | </ul>
| |
| − | </div>
| |
| − |
| |
| − | <h3 class="accordion-header">Starting a Team</h3>
| |
| − | <div class="accordion-content">
| |
| − | <ul class="submenuoptions">
| |
| − | <li><a href="https://2014.igem.org/Sifuentes_contentpage3">General iGEM Guide</a></li>
| |
| − | <li><a href="www.html">General Requirements</a></li>
| |
| − | <li><a href="www.html">Calendar of Events</a></li>
| |
| − | </ul>
| |
| − | </div>
| |
| − |
| |
| − | <h3 class="accordion-header">Registration</h3>
| |
| − | <div class="accordion-content">
| |
| − | <ul class="submenuoptions">
| |
| − | <li><a href="www.html">How to register</a></li>
| |
| − | <li><a href="www.html">Fees</a></li>
| |
| − | <li><a href="www.html">Funding</a></li>
| |
| − | <li><a href="www.html">Tracks</a></li>
| |
| − | <li><a href="www.html">New Tracks</a></li>
| |
| − | <li><a href="www.html">High School</a></li>
| |
| − | </ul>
| |
| − | </div>
| |
| − |
| |
| − | <h3 class="accordion-header">Summer Work</h3>
| |
| − | <div class="accordion-content">
| |
| − | <ul class="submenuoptions">
| |
| − | <li><a href="www.html">Registry at a glance</a></li>
| |
| − | <li><a href="www.html">2015 DNA distribution</a></li>
| |
| − |
| |
| − | </ul>
| |
| − | </div>
| |
| − |
| |
| − |
| |
| − | <h3 class="accordion-header">2015 Teams</h3>
| |
| − | <div class="accordion-content">
| |
| − | <ul class="submenuoptions">
| |
| − | <li><a href="www.html">Wikis</a></li>
| |
| − | <li><a href="www.html">List</a></li>
| |
| − | <li><a href="www.html">Parts</a></li>
| |
| − | <li><a href="www.html">Tracks</a></li>
| |
| − | <li><a href="www.html">Meetups</a></li>
| |
| − | <li><a href="www.html">Community page</a></li>
| |
| − | </ul>
| |
| − | </div>
| |
| − |
| |
| − | <h3 class="accordion-header">Requirements</h3>
| |
| − | <div class="accordion-content">
| |
| − | <ul class="submenuoptions">
| |
| − | <li><a href="">General Requirements</a></li>
| |
| − | <li><a href="www.html">Wiki how-to</a></li>
| |
| − | <li><a href="www.html">Poster Guidelines</a></li>
| |
| − | <li><a href="www.html">Presentation Guidelines</a></li>
| |
| − | <li><a href="www.html">Two Page Summary</a></li>
| |
| − | <li><a href="www.html">Safety Requirements</a></li>
| |
| − |
| |
| − | </ul>
| |
| − | </div>
| |
| − |
| |
| − | <h3 class="accordion-header">Safety</h3>
| |
| − | <div class="accordion-content">
| |
| − | <ul class="submenuoptions">
| |
| − | <li><a href="www.html">Introduction</a></li>
| |
| − | <li><a href="www.html">Risk Groups</a></li>
| |
| − | <li><a href="www.html">Biosafety Levels</a></li>
| |
| − | <li><a href="www.html">Safety Committee</a></li>
| |
| − | <li><a href="www.html">Deadlines</a></li>
| |
| − | <li><a href="www.html">Help</a></li>
| |
| − | <li><a href="www.html">About our Lab</a></li>
| |
| − | <li><a href="www.html">Safety Form</a></li>
| |
| − | </ul>
| |
| − | </div>
| |
| − |
| |
| − |
| |
| − | <h3 class="accordion-header">Judging</h3>
| |
| − | <div class="accordion-content">
| |
| − | <ul class="submenuoptions">
| |
| − | <li><a href="www.html">Introduction</a></li>
| |
| − | <li><a href="www.html">Medals and Awards</a></li>
| |
| − | <li><a href="www.html">Deadlines</a></li>
| |
| − | <li><a href="www.html">Judging Handbook</a></li>
| |
| − | <li><a href="www.html">Judging Form</a></li>
| |
| − | </ul>
| |
| − | </div>
| |
| − |
| |
| − | <h3 class="accordion-header">Giant Jamboree</h3>
| |
| − | <div class="accordion-content">
| |
| − | <ul class="submenuoptions">
| |
| − | <li><a href="www.html">General Information</a></li>
| |
| − | <li><a href="www.html">Event Website</a></li>
| |
| − | </ul>
| |
| − | </div>
| |
| − |
| |
| − |
| |
| − |
| |
| − | </div> <!-- this closes the menu div -->
| |
| | | | |
| − | </div> <!-- this closes the content wrap div -->
| + | </div> |
| | | | |
| | | | |
| | | | |
| | | | |
| − | </div>
| + | |
| | </html> | | </html> |