Team:Macquarie Australia/CSS Navbar

1. content {

   width: 100vw;
   margin: 0;
   margin-left: auto !important;
   margin-right: auto !important;
   padding: 0;

} /* Clear the default wiki settings */

#home_logo, #sideMenu { display:none; } #sideMenu, #top_title, .patrollink {display:none;} #content { width:100%; padding:0px; margin-top:-7px; margin-left:0px;} body {background-color: #f2f2f2; } #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; } /********************************* DEFAULT WIKI SETTINGS ********************************/ /*FROM STYLESHEET*/

.dropdown-menu {

 position: absolute;
 top: 100%;
 left: 0;
 z-index: 1000;
 display: none;
 float: left;
 min-width: 160px;
 padding: 5px 0;
 margin: 2px 0 0;
 font-size: 14px;
 text-align: left;
 list-style: none;
 background-color: #fff;
 -webkit-background-clip: padding-box;
         background-clip: padding-box;
 border: 1px solid #ccc;
 border: 1px solid rgba(0, 0, 0, .15);
 border-radius: 4px;
 -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
         box-shadow: 0 6px 12px rgba(0, 0, 0, .175);

} /* Prevents header buttons fron turning dark upon hover */

   .navbar-default .navbar-nav > li > a:hover, 

.navbar-default .navbar-nav > li > a:focus {

 color: #333;
 background-color: transparent;

}

/* Makes menu buttons stick to right hand side of screen */ @media (min-width: 768px) {

 .navbar-left {
   float: left !important;
 }
 .navbar-right {
   float: right !important;
   margin-right: -5px;
 }
 .navbar-right ~ .navbar-right {
   margin-right: 0;
 }

}

/* Makes drop-downs appear left to right instead of up to down */ @media (min-width: 768px) {

 .navbar-nav {
   float: left;
   margin: 0;
 }
 .navbar-nav > li {
   float: left;
 }
 .navbar-nav > li > a {
   padding-top: 15px;
   padding-bottom: 15px;
 }

}

/* Formatting navbar */ .navbar-fixed-top {

 top: 0;
 border-width: 0 0 1px;

} .navbar-fixed-top, .navbar-fixed-bottom {

 position: fixed;
 right: 0;
 left: 0;
 z-index: 1030;

} @media (min-width: 768px) {

 .container > .navbar-header,
 .container-fluid > .navbar-header,
 .container > .navbar-collapse,
 .container-fluid > .navbar-collapse {
   margin-right: 0;
   margin-left: 0;
 }

} a {

 color: #337ab7;
 text-decoration: none;

} @media (min-width: 768px) {

 .navbar-header {
   float: left;
 }

} .nav > li > a {

 position: relative;
 display: block;
 padding: 10px 15px;

} .nav {

 padding-left: 0;
 margin-bottom: 0;
 list-style: none;

} .dropdown-menu > li > a {

 display: block;
 padding: 3px 20px;
 clear: both;
 font-weight: normal;
 line-height: 1.42857143;
 color: #333;
 white-space: nowrap;

} .dropup, .dropdown {

 position: relative;

} .caret {

 display: inline-block;
 width: 0;
 height: 0;
 margin-left: 2px;
 vertical-align: middle;
 border-top: 4px dashed;
 border-top: 4px solid \9;
 border-right: 4px solid transparent;
 border-left: 4px solid transparent;

} .img-responsive, .thumbnail > img, .thumbnail a > img, .carousel-inner > .item > img, .carousel-inner > .item > a > img {

 display: block;
 max-width: 100%;
 height: auto;

}

/*END FROM SPREADHEET */

/* Navbar */

.some-padding {

 padding-top: 20px;

}

/*adds necessary spacing to the navbar so links display correctly below the black iGEM navbar */

.navbar-default {

 background-color: white;
 border-color: rgba(255, 255, 255, 0.3);
 font-family: 'Quicksand', sans-serif;
 font-weight: 300;
 -webkit-transition: all 0.35s;
 -moz-transition: all 0.35s;
 transition: all 0.35s;

}

.navbar-default .navbar-header .navbar-brand {

 color: #52658F;
 font-family: 'Quicksand', sans-serif;
 font-weight: bold;
 font-size: 22px;
 display: inline-block;

}

.navbar-default .navbar-header .navbar-brand:hover, .navbar-default .navbar-header .navbar-brand:focus {

 color: #52658F;

}

.navbar-default .navbar-header .navbar-toggle {

 font-family: 'Quicksand', sans-serif;
 font-weight: 400;
 font-size: 14px;
 color: #333A56;
 text-transform: uppercase;

}

.navbar-default .nav > li > a, .navbar-default .nav > li > a:focus {

 text-transform: uppercase;
 font-family: 'Quicksand', sans-serif;
 font-weight: 400;
 font-size: 14px;
 color: #222222;

}

.navbar-default .nav > li > a:hover, .navbar-default .nav > li > a:focus:hover {

 color: #333A56;

}

.navbar-default .nav > li.active > a, .navbar-default .nav > li.active > a:focus {

 color: #333A56 !important;
 background-color: white;

}

.navbar-default .nav > li.active > a:hover, .navbar-default .nav > li.active > a:focus:hover {

 background-color: white;

}

.navbar-default .navbar-toggle {

 border: none;

}

.navbar-default .dropdown-menu > li > a:hover, .navbar-default .dropdown-menu > li > a:focus {

 background-color: #F7F5E6;
 color: #333A56;

}

.navbar-default .dropdown-menu {

 border: none;
 outline: none;
 font-family: 'Quicksand', sans-serif;
 text-transform: uppercase;
 font-weight: 400 !important;
 font-size: 13.2px !important;
 color: #222222;

}

1. sitelinks a {

 display: inline-block;
 border: 3px solid #fff;
 color: #fff;
 padding: 10px 20px;
 margin: 10px

}

1. footer {

 background: #333;
 text-align: center;
 color: #fff;
 line-height: 50px;

}

1. footer a {

 color: #fff;

}

/*END FROM STYLESHEET*/

body {

 background-color: white;
 width: 100%;
 padding-top: 50px;

}

1. bodyContent {

 padding-right: 0px;

}

1. globalWrapper {

 font-size: 100%;
 padding: 0px;
 margin: -10px -20px -20px -20px;

}

.navbar-collapse {

 padding-left: 0px;

}

1. banner {

 margin-top: 50px;

}

1. sideMenu {

 margin-top: 10px;

}

.dropdown-menu li:hover .sub-menu {

 visibility: visible;

}

.dropdown:hover .dropdown-menu {

 display: block;

}

.navbar-nav .dropdown-menu, .navbar .dropdown-menu {

 margin-top: 0;

}

/********************************* CONTENT OF THE PAGE ********************************/

/* Wrapper for the content */

.content_wrapper {

 width: 85%;
 margin-left: 150px;
 padding: 0px;
 float: left;
 background-color: white;

}

/*LAYOUT */

.column {

 padding: 10px 0px;
 float: left;
 background-color: white;

}

.full_size {

 width: 100%;

}

.full_size img {

 padding: 10px 15px;
 width: 96.5%;

}

.half_size {

 width: 50%;

}

.half_size img {

 padding: 10px 15px;
 width: 93%;

}

.img:hover {

 opacity: 1.0 !important;

}

/*STYLING */

/* styling for the titles */

.content_wrapper h1, .content_wrapper h2 {

 padding: 5px 15px;
 border-bottom: 0px;
 color: #72c9b6;

}

.content_wrapper h3, .content_wrapper h4, .content_wrapper h5, .content_wrapper h6 {

 padding: 5px 15px;
 border-bottom: 0px;
 color: #000000;

}

/* font and text */

.content_wrapper p {

 padding: 0px 15px;
 font-size: 13px;
 font-family: 'Roboto', sans-serif;

}

/* Links */

.content_wrapper a {

 font-weight: bold;
 text-decoration: underline;
 text-decoration-color: #72c9b6;
 color: #72c9b6;
 -webkit-transition: all 0.4s ease;
 -moz-transition: all 0.4s ease;
 -ms-transition: all 0.4s ease;
 -o-transition: all 0.4s ease;
 transition: all 0.4s ease;

}

/* hover for the links */

.content_wrapper a:hover {

 text-decoration: none;
 color: #000000;

}

/* non numbered lists */

.content_wrapper ul {

 padding: 0px 20px;
 font-size: 13px;
 font-family: 'Quicksand', sans-serif;

}

/* numbered lists */

.content_wrapper ol {

 padding: 0px;
 font-size: 13px;
 font-family: 'Quicksand', sans-serif;

}

/* Table */

.content_wrapper table {

 width: 97%;
 margin: 15px 10px;
 border: 1px solid #d3d3d3;
 border-collapse: collapse;

}

/* table cells */

.content_wrapper td {

 padding: 10px;
 vertical-align: text-top;
 border: 1px solid #d3d3d3;
 border-collapse: collapse;

}

/* table headers */

.content_wrapper th {

 padding: 10px;
 vertical-align: text-top;
 border: 1px solid #d3d3d3;
 border-collapse: collapse;
 background-color: #f2f2f2;

}

/* Button class */

.button_click {

 margin: 10px auto;
 padding: 15px;
 width: 12%;
 text-align: center;
 font-weight: bold;
 background-color: #72c9b6;
 cursor: pointer;
 -webkit-transition: all 0.4s ease;
 -moz-transition: all 0.4s ease;
 -ms-transition: all 0.4s ease;
 -o-transition: all 0.4s ease;
 transition: all 0.4s ease;

}

/* button class on hover */

.button_click:hover {

 background-color: #000000;
 color: #72c9b6;

}

.top-pad {

 padding: 35px;

}

/* NEW STUFF FROM CURRENT PAGE

/* column stuff */ .column { float: left; padding: 1px; }

/* side columns */ .column.side { width: 20%; }

/* main content */ .column.middle { Width: 60%; min-height: 850px;

/* change the background image of the main column */ background-size: contain; background-position: center; background-repeat: no-repeat; }

/* Clear floats after the columns */ .row:after {

   content: "";
   display: table;
   clear: both;

}

/* footer*/ .footer {

   background-color: white;
   text-align: center;
   padding: 35px;

}

/*ROTATING SCRIPT */ .rotate {

   -webkit-animation: spin .8s infinite linear;
   animation: spin 20s infinite linear;

} @-webkit-keyframes spin {

   100% { -webkit-transform: rotate(360deg); }

} @-moz-keyframes spin {

   100% { -moz-transform: rotate(360deg); }

} @keyframes spin {

   100% {
       -moz-transform:rotate(360deg);
       -o-transform:rotate(360deg);
       transform:rotate(360deg);
   }

}