Line 17: | Line 17: | ||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> | <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> | ||
<link rel="stylesheet" href="https://2016.igem.org/wiki/load.php?debug=false&lang=en&modules=mediawiki.legacy.commonPrint%2Cshared%7Cmediawiki.skinning.content.externallinks%7Cmediawiki.skinning.interface%7Cmediawiki.ui.button%7Cskins.igem.styles&only=styles&skin=igem&*"> | <link rel="stylesheet" href="https://2016.igem.org/wiki/load.php?debug=false&lang=en&modules=mediawiki.legacy.commonPrint%2Cshared%7Cmediawiki.skinning.content.externallinks%7Cmediawiki.skinning.interface%7Cmediawiki.ui.button%7Cskins.igem.styles&only=styles&skin=igem&*"> | ||
+ | /*css for main menu*/ | ||
+ | body { | ||
+ | padding-top: 50px; | ||
+ | background-image: url('media/Golf-Shirt-Grey-Seamless-Pattern-For-Website-Background.jpg'); | ||
+ | font-family: "ourFont"; | ||
+ | padding-bottom: 0; | ||
+ | } | ||
+ | @font-face{ | ||
+ | font-family: ourFont; | ||
+ | src: url("css/bgu-ufonts_segoe-ui-light.woff"); | ||
+ | } | ||
+ | .OurLogo{ | ||
+ | max-width:120px; | ||
+ | margin-top: -4px; | ||
+ | } | ||
+ | .navbar-inverse{ | ||
+ | /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#45484d+0,000000+100;Black+3D+%231 */ | ||
+ | background: #45484d; /* Old browsers */ | ||
+ | background: -moz-linear-gradient(top, #45484d 0%, #000000 100%); /* FF3.6-15 */ | ||
+ | background: -webkit-linear-gradient(top, #45484d 0%,#000000 100%); /* Chrome10-25,Safari5.1-6 */ | ||
+ | background: linear-gradient(to bottom, #45484d 0%,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=0 ); /* IE6-9 */ | ||
+ | } | ||
+ | .navbar-inverse .navbar-nav>li>a{ | ||
+ | color: #fff; | ||
+ | } | ||
+ | .navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.active>a{ | ||
+ | background-image: linear-gradient(to bottom,#41D17D 0,#75D99F 80%) | ||
+ | } | ||
+ | @media (min-width: 767px){ | ||
+ | .navbar-inverse{ | ||
+ | height: 60px; | ||
+ | } | ||
+ | .mainmenu > li{ | ||
+ | width: 14%; | ||
+ | height: 60px; | ||
+ | } | ||
+ | .navbar-nav{ | ||
+ | width: 80%; | ||
+ | } | ||
+ | } | ||
+ | @media (max-width: 767px){ | ||
+ | .navbar-inverse .navbar-nav .open .dropdown-menu > li > a{ | ||
+ | color: #fff; | ||
+ | } | ||
+ | } | ||
+ | /* | ||
+ | .navbar-default { | ||
+ | background-color: #216b9c; | ||
+ | border-color: #4cee30; | ||
+ | } | ||
+ | .navbar-default .navbar-brand { | ||
+ | color: #1c2a2f; | ||
+ | } | ||
+ | .navbar-default .navbar-brand:hover, | ||
+ | .navbar-default .navbar-brand:focus { | ||
+ | color: #f42d24; | ||
+ | } | ||
+ | .navbar-default .navbar-text { | ||
+ | color: #1c2a2f; | ||
+ | } | ||
+ | .navbar-default .navbar-nav > li > a { | ||
+ | color: #1c2a2f; | ||
+ | } | ||
+ | .navbar-default .navbar-nav > li > a:hover, | ||
+ | .navbar-default .navbar-nav > li > a:focus { | ||
+ | color: #f42d24; | ||
+ | } | ||
+ | .navbar-default .navbar-nav > li > .dropdown-menu { | ||
+ | background-color: #216b9c; | ||
+ | } | ||
+ | .navbar-default .navbar-nav > li > .dropdown-menu > li > a { | ||
+ | color: #1c2a2f; | ||
+ | } | ||
+ | .navbar-default .navbar-nav > li > .dropdown-menu > li > a:hover, | ||
+ | .navbar-default .navbar-nav > li > .dropdown-menu > li > a:focus { | ||
+ | color: #f42d24; | ||
+ | background-color: #4cee30; | ||
+ | } | ||
+ | .navbar-default .navbar-nav > li > .dropdown-menu > li > .divider { | ||
+ | background-color: #4cee30; | ||
+ | } | ||
+ | .navbar-default .navbar-nav .open .dropdown-menu > .active > a, | ||
+ | .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, | ||
+ | .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus { | ||
+ | color: #f42d24; | ||
+ | background-color: #4cee30; | ||
+ | } | ||
+ | .navbar-default .navbar-nav > .active > a, | ||
+ | .navbar-default .navbar-nav > .active > a:hover, | ||
+ | .navbar-default .navbar-nav > .active > a:focus { | ||
+ | color: #f42d24; | ||
+ | background-color: #4cee30; | ||
+ | } | ||
+ | .navbar-default .navbar-nav > .open > a, | ||
+ | .navbar-default .navbar-nav > .open > a:hover, | ||
+ | .navbar-default .navbar-nav > .open > a:focus { | ||
+ | color: #f42d24; | ||
+ | background-color: #4cee30; | ||
+ | } | ||
+ | .navbar-default .navbar-toggle { | ||
+ | border-color: #4cee30; | ||
+ | } | ||
+ | .navbar-default .navbar-toggle:hover, | ||
+ | .navbar-default .navbar-toggle:focus { | ||
+ | background-color: #4cee30; | ||
+ | } | ||
+ | .navbar-default .navbar-toggle .icon-bar { | ||
+ | background-color: #1c2a2f; | ||
+ | } | ||
+ | .navbar-default .navbar-collapse, | ||
+ | .navbar-default .navbar-form { | ||
+ | border-color: #1c2a2f; | ||
+ | } | ||
+ | .navbar-default .navbar-link { | ||
+ | color: #1c2a2f; | ||
+ | } | ||
+ | .navbar-default .navbar-link:hover { | ||
+ | color: #f42d24; | ||
+ | } | ||
+ | |||
+ | @media (max-width: 767px) { | ||
+ | .navbar-default .navbar-nav .open .dropdown-menu > li > a { | ||
+ | color: #1c2a2f; | ||
+ | } | ||
+ | .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, | ||
+ | .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus { | ||
+ | color: #f42d24; | ||
+ | } | ||
+ | .navbar-default .navbar-nav .open .dropdown-menu > .active > a, | ||
+ | .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, | ||
+ | .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus { | ||
+ | color: #f42d24; | ||
+ | background-color: #4cee30; | ||
+ | } | ||
+ | } | ||
+ | */ | ||
+ | @media (min-width: 979px) { | ||
+ | ul.nav li.dropdown:hover > ul.dropdown-menu { | ||
+ | display: block; | ||
+ | } | ||
+ | } | ||
+ | .mainmenu > li > a{ | ||
+ | text-align: center; | ||
+ | top: 7%; | ||
+ | font-size: 110%; | ||
+ | font-family: Oswald, sans-serif; | ||
+ | font-weight: bolder; | ||
+ | width: 100%; | ||
+ | } | ||
+ | .submenu{ | ||
+ | background-color: inherit; | ||
+ | max-width: 168px; | ||
+ | min-width: 168px; | ||
+ | text-align: center; | ||
+ | left: -20px; | ||
+ | } | ||
+ | .submenu > li > a{ | ||
+ | color: white; | ||
+ | padding-top: 5px; | ||
+ | padding-bottom: 5px; | ||
+ | } | ||
+ | .mainfooter{ | ||
+ | margin-top: 1%; | ||
+ | margin-bottom: 0; | ||
+ | /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#45484d+0,000000+100;Black+3D+%231 */ | ||
+ | background: #45484d; /* Old browsers */ | ||
+ | background: -moz-linear-gradient(top, #45484d 0%, #000000 100%); /* FF3.6-15 */ | ||
+ | background: -webkit-linear-gradient(top, #45484d 0%,#000000 100%); /* Chrome10-25,Safari5.1-6 */ | ||
+ | background: linear-gradient(to bottom, #45484d 0%,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=0 ); /* IE6-9 */ | ||
+ | } | ||
+ | .mainfooter p{ | ||
+ | margin: 2% auto; | ||
+ | color: white; | ||
+ | } | ||
+ | .mainfooter ul{ | ||
+ | list-style: none; | ||
+ | margin-bottom: 0; | ||
+ | } | ||
+ | .mainfooter a img{ | ||
+ | width: 10%; | ||
+ | height: auto; | ||
+ | margin-left: 3%; | ||
+ | margin-top: 2%; | ||
+ | } | ||
+ | .back-to-top { | ||
+ | display: none; | ||
+ | width: 60px; | ||
+ | height: 60px; | ||
+ | text-indent: -9999px; | ||
+ | position: fixed; | ||
+ | z-index: 999; | ||
+ | right: 13px; | ||
+ | bottom: 30px; | ||
+ | background: black url(media/top-b-bgu.png) no-repeat center 43%; | ||
+ | border-radius: 30px; | ||
+ | } | ||
+ | .socialMediaIcon{ | ||
+ | box-shadow: 0px 2px 3px rgba(0,0,0,0.2); | ||
+ | border-radius: 7px; | ||
+ | } | ||
+ | .mainfooter h4{ | ||
+ | color: #FFF; | ||
+ | margin-top: 4px; | ||
+ | } | ||
+ | ul{ | ||
+ | list-style: none; | ||
+ | } | ||
+ | .mainfooter h5{ | ||
+ | margin: 5% auto; | ||
+ | color: white; | ||
+ | } | ||
+ | .mainfooter ul{ | ||
+ | margin: 6% auto; | ||
+ | padding: 0px; | ||
+ | } | ||
+ | .mainfooter div ul li{ | ||
+ | display: inline; | ||
+ | width: 100%; | ||
+ | margin-right: 5%; | ||
+ | } | ||
+ | footer{ | ||
+ | padding-bottom: 0px; | ||
+ | } | ||
+ | #projectB:hover { | ||
+ | background-color: #FF6961; | ||
+ | } | ||
+ | #teamB:hover { | ||
+ | background-color: #CB99C9; | ||
+ | } | ||
+ | #notebookB:hover { | ||
+ | background-color: #4997D0; | ||
+ | } | ||
+ | #partsB:hover { | ||
+ | background-color: #96FDFD; | ||
+ | } | ||
+ | #humanB:hover { | ||
+ | background-color: #77DD44; | ||
+ | } | ||
+ | #humanB > a{ | ||
+ | top: -5px; | ||
+ | } | ||
+ | #safteyB:hover { | ||
+ | background-color: #FCFC4D; | ||
+ | } | ||
+ | #awardsB:hover { | ||
+ | background-color: #FFA447; | ||
+ | } | ||
+ | @media (min-width: 979px) { | ||
+ | ul.nav li.dropdown:hover > ul.dropdown-menu { | ||
+ | display: block; | ||
+ | } | ||
+ | } | ||
+ | @media (max-width: 1200px){ | ||
+ | ul.nav-pills{ | ||
+ | display: none; | ||
+ | } | ||
+ | } | ||
+ | .nav > li > a:hover, .nav > li > a:focus { | ||
+ | text-decoration: none; | ||
+ | background-color: #eee; | ||
+ | color: black; | ||
+ | } | ||
+ | .nav > li > a{ | ||
+ | color: white; | ||
+ | } | ||
+ | /*end css for main menu*/ | ||
+ | .teamPicSize{ | ||
+ | width: 140px; | ||
+ | } | ||
+ | .infoCard{ | ||
+ | border: 4px solid #CB99C9; | ||
+ | border-radius: 10px; | ||
+ | padding: 2% 3% 2% 3%; | ||
+ | margin-bottom: 5%; | ||
+ | box-shadow: 5px 5px 3px #888888; | ||
+ | background-color: white; | ||
+ | line-height: 2; | ||
+ | } | ||
+ | .infoCard img{ | ||
+ | margin-top: 8%; | ||
+ | } | ||
+ | .teamInfoCon{ | ||
+ | } | ||
+ | ul.nav-pills { | ||
+ | top: 20%; | ||
+ | position: fixed; | ||
+ | width: 150px; | ||
+ | } | ||
+ | div.col-sm-9 div { | ||
+ | height: 250px; | ||
+ | font-size: 28px; | ||
+ | } | ||
+ | #spythisdata{ | ||
+ | position: relative; | ||
+ | } | ||
+ | .bigAssHeader{ | ||
+ | font-size: 60px; | ||
+ | font-weight: bold; | ||
+ | text-align: center; | ||
+ | } | ||
+ | .contentText{ | ||
+ | line-height: 2; | ||
+ | } | ||
+ | .present{ | ||
+ | background-color: #CB99C9; | ||
+ | } | ||
+ | .nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus { | ||
+ | color: #fff; | ||
+ | background-color: #CB99C9 !important; | ||
+ | } | ||
<style> | <style> | ||
Revision as of 16:16, 7 October 2016