|
|
| Line 82: |
Line 82: |
| | | | |
| | /********** Basic Content Class CSS Style **********/ | | /********** Basic Content Class CSS Style **********/ |
| − | p {
| |
| − | font-family:"Montserrat", serif;
| |
| − | font-size: 18px;
| |
| − | line-height:150%;
| |
| − | text-align:justify;
| |
| − | color:#000000;
| |
| − | }
| |
| − |
| |
| − | h1 {
| |
| − | color: #b48608;
| |
| − | font-family: 'Bookman', serif;
| |
| − | font-size: 40px;
| |
| − | font-weight: 400;
| |
| − | line-height: 44px;
| |
| − | margin: 0 0 12px;
| |
| − | text-align: center;
| |
| − | font-weight: 1500;
| |
| − | border-style: none;
| |
| − | }
| |
| − |
| |
| − | h2 {
| |
| − | color: #2E86C1;
| |
| − | font-family:"Calibri", serif;
| |
| − | font-size: 30px;
| |
| − | font-weight: 200;
| |
| − | line-height: 44px;
| |
| − | margin: 0 0 12px;
| |
| − | text-align: center;
| |
| − | font-weight: bold;
| |
| − | width:80%;
| |
| − | padding-left:10%;
| |
| − | padding-right:10%;
| |
| − | }
| |
| − |
| |
| − | #teamh2 {
| |
| − | width:100%;
| |
| − | padding-left:0;
| |
| − | padding-right:0;
| |
| − | }
| |
| − |
| |
| − | h3 {
| |
| − | color:#FAA403;
| |
| − | font-family:"Calibri", serif;
| |
| − | font-size: 25px;
| |
| − | font-weight: 200;
| |
| − | line-height: 44px;
| |
| − | margin: 0 0 12px;
| |
| − | text-align: left;
| |
| − | font-weight:bold;
| |
| − | width:80%;
| |
| − | padding-left:10%;
| |
| − | padding-right:10%;
| |
| − | }
| |
| − |
| |
| − | h4 {
| |
| − | color:#b48608;
| |
| − | font-family:"Calibri", serif;
| |
| − | font-size: 20px;
| |
| − | font-weight: 180;
| |
| − | line-height: 44px;
| |
| − | margin: 0 0 12px;
| |
| − | text-align: center;
| |
| − | font-weight:bold;
| |
| − | width:80%;
| |
| − | padding-left:10%;
| |
| − | padding-right:10%;
| |
| − | }
| |
| − |
| |
| − | .nus ul {
| |
| − | font-family:"Montserrat", serif;
| |
| − | font-size: 18px;
| |
| − | line-height:150%;
| |
| − | color:#000000;
| |
| − |
| |
| − | }
| |
| − |
| |
| − | .nus ol {
| |
| − | font-family:"Montserrat", serif;
| |
| − | font-size: 18px;
| |
| − | line-height:150%;
| |
| − | color:#000000;
| |
| − | }
| |
| − | .nus {
| |
| − | font-family:"Montserrat", serif;
| |
| − | font-size: 18px;
| |
| − | line-height:150%;
| |
| − | color:#000000;
| |
| − | }
| |
| − |
| |
| − | ul.nus {
| |
| − | font-family:"Montserrat", serif;
| |
| − | font-size: 18px;
| |
| − | line-height:150%;
| |
| − | color:#000000;
| |
| − |
| |
| − | }
| |
| − |
| |
| − | ol.nus {
| |
| − | font-family:"Montserrat", serif;
| |
| − | font-size: 18px;
| |
| − | line-height:150%;
| |
| − | color:#000000;
| |
| − | }
| |
| − |
| |
| − | /****************** image description subline ****************/
| |
| − | #imgdescription {
| |
| − | font-size:15px;
| |
| − | width:60%;
| |
| − | padding-left:20%;
| |
| − | padding-right:20%;
| |
| − | font-style:oblique;
| |
| − | text-align:center;
| |
| − | }
| |
| − |
| |
| − | /****************** Reference ****************/
| |
| − | #Ref {
| |
| − | font-size:15px;
| |
| − | }
| |
| | | | |
| | /************************************************** Back to top button style **************************************************/ | | /************************************************** Back to top button style **************************************************/ |
| Line 258: |
Line 140: |
| | | | |
| | } | | } |
| − | /* The inner border contains the nav bar, header and whatever content is in the page....i need to close this div in the footer*/ | + | /* The inner border contains the nav bar, header and whatever content is in the page....I NEED TO USE THIS CLASS FOR EVERY DIV AS AN OVERALL PAGE WRAPPER*/ |
| | .inner-border{ | | .inner-border{ |
| − | border-top: 2px solid black;
| |
| | border-left: 2px solid black; | | border-left: 2px solid black; |
| | border-right: 2px solid black; | | border-right: 2px solid black; |
| Line 280: |
Line 161: |
| | height: 60px; | | height: 60px; |
| | padding-top: 1em; | | padding-top: 1em; |
| − | /* This color means white */ | + | /* This color means white and slightly transparent */ |
| | background-color: rgba(255, 255, 255, 0.82); | | background-color: rgba(255, 255, 255, 0.82); |
| | font-family: "Montserrat"; | | font-family: "Montserrat"; |
| Line 382: |
Line 263: |
| | } | | } |
| | /*********** End of New Nav Menu CSS ****************/ | | /*********** End of New Nav Menu CSS ****************/ |
| − |
| |
| − |
| |
| − | /********** Last working navigational format ********/
| |
| − | /*.team-logo {
| |
| − | width:%;
| |
| − | height:140px;
| |
| − | margin-left:20px;
| |
| − | padding-top:5px;
| |
| − | position:absolute;
| |
| − | }
| |
| − |
| |
| − | .topmenu-container {
| |
| − | overflow: hidden;
| |
| − | background-color: #F8F9F9;
| |
| − | padding-top:100px;
| |
| − | margin:0;
| |
| − | }
| |
| − |
| |
| − | .topmenu-container a {
| |
| − | float: right;
| |
| − | font-family:"Bookman", sans-serif;
| |
| − | font-size: 18px;
| |
| − | color: #566573;
| |
| − | text-align: center;
| |
| − | padding: 19px 16px;
| |
| − | text-decoration: none;
| |
| − | border: none;
| |
| − |
| |
| − | }
| |
| − |
| |
| − | .dropdown {
| |
| − | float: right;
| |
| − | overflow: hidden;
| |
| − | }
| |
| − |
| |
| − | .dropdown .dropbtn {
| |
| − | font-family:"Bookman", sans-serif;
| |
| − | font-size: 18px;
| |
| − | border: none;
| |
| − | text-align: center;
| |
| − | outline: none;
| |
| − | color: #566573;
| |
| − | padding: 14px 16px;
| |
| − | background-color: inherit;
| |
| − | }
| |
| − |
| |
| − | .dropdown-content {
| |
| − | display: none;
| |
| − | position: absolute;
| |
| − | background-color:#FFFFFF;
| |
| − | min-width: 160px;
| |
| − | box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
| |
| − | z-index: 1;
| |
| − | }
| |
| − |
| |
| − | .dropdown-content a {
| |
| − | float: none;
| |
| − | color: #566573;
| |
| − | padding: 12px 16px;
| |
| − | text-decoration: none;
| |
| − | display: block;
| |
| − | text-align: center;
| |
| − | }
| |
| − |
| |
| − |
| |
| − | /*************************************************** Hover effect of Top menu ***************************************/
| |
| − | .topmenucontainer a:hover, .dropdown:hover .dropbtn {
| |
| − | background-color: #AED6F1;
| |
| − | }
| |
| − |
| |
| − | .dropdown-content a:hover {
| |
| − | background-color: #ddd;
| |
| − | }
| |
| − |
| |
| − | .dropdown:hover .dropdown-content {
| |
| − | display: inline-block;
| |
| − | }
| |
| − | */
| |
| − |
| |
| − | /*************************** Social contact link *************************/
| |
| − | /*.fa {
| |
| − | padding: 20px;
| |
| − | font-size: 30px;
| |
| − | width: 30px;
| |
| − | text-align: center;
| |
| − | text-decoration: none;
| |
| − | border-radius: 50%;
| |
| − | }
| |
| − |
| |
| − | .fa:hover {
| |
| − | opacity: 0.7;
| |
| − | }
| |
| − |
| |
| − | .fa-facebook {
| |
| − | background: #3B5998;
| |
| − | color: #FFFFFF;
| |
| − | }
| |
| − |
| |
| − | .fa-instagram {
| |
| − | background: #125688;
| |
| − | color: #FFFFFF;
| |
| − | }
| |
| − |
| |
| − | .fa-google {
| |
| − | background: #dd4b39;
| |
| − | color: #FFFFFF;
| |
| − | }*/
| |
| − | /************ End of last working navigational menu ************/
| |
| − |
| |
| − | /************************ Quick Link Footer **************************/
| |
| − | .quicklink p {
| |
| − | background-color:#F0F3F4;
| |
| − | width:100%;
| |
| − | text-align: center;
| |
| − | height:60px;
| |
| − | padding:10px;
| |
| − | margin:0px;
| |
| − | font-weight: bold;
| |
| − | font-size: 20px;
| |
| − | }
| |
| − |
| |
| − | .quicklink-container {
| |
| − | background-color:#F0F3F4;
| |
| − | width:100%;
| |
| − | height:200px;
| |
| − | position:absolute;
| |
| − | }
| |
| − | .quicklink-1 {
| |
| − | background-color:#F0F3F4;
| |
| − | width:25%;
| |
| − | height:300px;
| |
| − | padding-left:7%;
| |
| − | padding-right:7%;
| |
| − | position:relative;
| |
| − | float:left;
| |
| − | text-align: center;
| |
| − | text-decoration: none;
| |
| − |
| |
| − | }
| |
| − | .quicklink-2 {
| |
| − | background-color:#F0F3F4;
| |
| − | width:25%;
| |
| − | height:300px;
| |
| − | padding-left:7%;
| |
| − | padding-right:7%;
| |
| − | position:relative;
| |
| − | float:left;
| |
| − | text-align: center;
| |
| − | text-decoration: none;
| |
| − | }
| |
| − | .quicklink-3 {
| |
| − | background-color:#F0F3F4;
| |
| − | width:25%;
| |
| − | height:300px;
| |
| − | padding-left:7%;
| |
| − | padding-right:7%;
| |
| − | position:relative;
| |
| − | float:left;
| |
| − | text-align: center;
| |
| − | text-decoration: none;
| |
| − | }
| |
| − | .quicklink-4 {
| |
| − | background-color:#F0F3F4;
| |
| − | width:25%;
| |
| − | height:300px;
| |
| − | padding-left:7%;
| |
| − | padding-right:7%;
| |
| − | position:relative;
| |
| − | float:left;
| |
| − | text-align: center;
| |
| − | text-decoration: none;
| |
| − | }
| |
| − |
| |
| − | .quicklink-4 a {
| |
| − | color:#808B96;
| |
| − | font-size:15px;
| |
| − | }
| |
| − | .quicklink-3 a {
| |
| − | color:#808B96;
| |
| − | font-size:15px;
| |
| − | }
| |
| − | .quicklink-2 a {
| |
| − | color:#808B96;
| |
| − | font-size:15px;
| |
| − | }
| |
| − | .quicklink-1 a {
| |
| − | color:#808B96;
| |
| − | font-size:15px;
| |
| − | }
| |
| − |
| |
| − | /**************************************** Sponsor and Social Connact Link Cover ****************************************/
| |
| − | .footer-container{
| |
| − | width:100%;
| |
| − | height:300px;
| |
| − | background-color:#F0F3F4 ;
| |
| − | position:absolute;
| |
| − | }
| |
| − |
| |
| − | .footer-sponsor-container{
| |
| − | width:70%; /*split the sponsor container from the full footer-container */
| |
| − | background-color:inherit;
| |
| − | padding:20px;
| |
| − | padding-top:30px;
| |
| − | float:left;
| |
| − | }
| |
| − |
| |
| − | .footer-contact-container{
| |
| − | width:30%; /*split the sponsor container from the full footer-container */
| |
| − | padding-top:20px;
| |
| − | background-color:inherit;
| |
| − | float:right;
| |
| − | }
| |
| − |
| |
| − | img.social-icon {
| |
| − | margin:2%;
| |
| − | position:relative;
| |
| − | float:left;
| |
| − |
| |
| − | }
| |
| − |
| |
| | | | |
| | /*Responsive Design*/ | | /*Responsive Design*/ |
| Line 761: |
Line 422: |
| | <a href="https://www.facebook.com/NUSGEM2018/"><i class="fa fa-facebook fblogo"></i> | | <a href="https://www.facebook.com/NUSGEM2018/"><i class="fa fa-facebook fblogo"></i> |
| | <a href="#"><i class="fa fa-envelope maillogo"></i> | | <a href="#"><i class="fa fa-envelope maillogo"></i> |
| − | <div class="inner-border"> | + | <div class="inner-border" style="border-top: 2px solid black;"> |
| | <div class='logo'><a href="https://2018.igem.org/Team:NUS_Singapore-A"><img class='logo' src='https://static.igem.org/mediawiki/2018/2/21/T--NUS_Singapore-A--TeamLogo.jpg' alt='nus logo'></a> | | <div class='logo'><a href="https://2018.igem.org/Team:NUS_Singapore-A"><img class='logo' src='https://static.igem.org/mediawiki/2018/2/21/T--NUS_Singapore-A--TeamLogo.jpg' alt='nus logo'></a> |
| | </div> | | </div> |
