Difference between revisions of "Team:Dundee/style"

 
(67 intermediate revisions by 3 users not shown)
Line 1: Line 1:
−
__NOTOC__ <!-- Elimination of Table of Contents (TOC) -->
 
 
<html>
 
<html>
−
 
−
<!-- CSS -->
 
 
<style type="text/css">
 
<style type="text/css">
  
−
/*Hidding heading*/
 
−
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {display:none;}
 
−
#top-section {border: none; height: 0px;}
 
−
#content {border: none; background-color: transparent;}
 
−
#globalWrapper { background-color: transparent; border: none; margin: 0; padding: 0; float:left;}
 
−
#top_menu_inside {margin-left: 10px;}
 
−
#bodyContent {background-color: transparent;}
 
  
 +
/* hiding the top section*/
  
 +
#top-section{
 +
  height:0px;
 +
    border:none;
 +
    width:100%;
 +
    margin:0 auto;
 +
    padding:0;
 +
    background-color:transparent;
 +
}
 +
 +
#p-logo {
 +
display:none;
 +
}
 +
 +
#globalWrapper, #content {
 +
  width: 100%;
 +
  height: 100%;
 +
  border: 0px;
 +
  background-color: transparent;
 +
  margin: 0px;
 +
  padding: 0px;
 +
  font-size: 100%;
 +
}
 +
 +
#search-controls{
 +
display:none;
 +
}
 +
 +
#top {
 +
display:none;
 +
}
 +
 +
.firstHeading {
 +
display:none;
 +
}
 +
 +
h1, h2, h3, h4 {
 +
border: none;
 +
color: #d6d6d6;
 +
}
 +
 +
#bodyContent h1, #bodyContent h2 {
 +
  margin-bottom: 0;
 +
}
 +
 +
/* end of hiding the top section*/
 +
 +
/* global setting*/
 +
 +
#globalWrapper{
 +
position:absolute;
 +
top:0px;
 +
left:0px;
 +
right:0px;
 +
width:100%;
 +
padding:0;
 +
margin:0;
 +
height:100%;
 +
}
 +
 +
 +
#content{
 +
    background-color: transparent;
 +
    border:none;
 +
    width:100%;
 +
    height:100%;
 +
    padding:0
 +
    top:-40px;
 +
    display:block;
 +
    }
 +
 +
#bodyContent{
 +
    background-color:transparent;
 +
    border:none;
 +
   
 +
    }
 +
.siteSub{
 +
    display:none;
 +
    border:none;
 +
    }
 +
.contentSub{
 +
    display:none;
 +
    }
 +
/* end of global setting*/
 +
 +
 +
/* Page Start */
 +
 +
html, body, div, h1, h2, h3, h4, span, .btn {
 +
font-family: 'roboto';
 +
    line-height: 1.75;
 +
}
 +
 +
 +
html, body {
 +
    margin: auto;
 +
    padding: 0px;
 +
    color: #d6d6d6;
 +
}
 +
p {
 +
color: #d6d6d6;
 +
}
 +
 +
.container {
 +
    padding-right: 15px; /*15px in bootstrap.css*/
 +
    padding-left: 15px;  /*idem*/
 +
    margin-right: auto;
 +
    margin-left: auto;
 +
}
  
−
/*Background*/
 
 
body {
 
body {
−
    background-color: #999999;
+
background:url(https://static.igem.org/mediawiki/2015/f/f2/Dundee15-background.png) repeat;
−
     padding: 10px 0px;
+
color: #e9e9e9;
−
     border: none;
+
     /*background: -webkit-linear-gradient(#606060, #121212);
−
     margin-left: 10px;
+
     background:   -moz-linear-gradient(#606060, #121212);
−
     margin-bottom: 0px;
+
     background:        linear-gradient(#606060, #121212);*/
−
     width: 0px;
+
    padding-top: 70px;
−
}  
+
     font-family: 'cambria';
 +
     font-size: 16px;
 +
     
 +
}
  
 +
h1, h2, h3, h4, h5, h6, p {
  
−
/* Banner */
+
}
−
#banner {
+
−
    background-image:url('https://static.igem.org/mediawiki/2015/3/32/D2015Banner_Temp.jpg');
+
−
    background-repeat: no-repeat;
+
−
    background-size:contain;
+
−
    background-color:  #000000;
+
−
    width: auto;
+
−
    height: 210px;
+
−
    float:center;
+
−
    margin:auto;
+
−
    text-align:center;
+
  
 +
header > h3 {
 +
color:#FFF;
 +
font-size: 25px;
 
}
 
}
  
 +
body h1 {
 +
color: #339966;
 +
padding-top: -15px;
 +
}
  
−
/* Menu */
+
body h2 {
 +
color: #339966;
 +
margin-top: -20px;
 +
    padding-top: -15px;
 +
}
  
−
br { clear:left }
+
body h4 {
 +
color: #339966;
 +
}
  
−
.menu_simple {
+
.container h3 {
−
    width: auto;
+
color: #339966;
−
    background-color: #111111;
+
 
}
 
}
  
−
.menu_simple ul {
+
.container li {
−
    margin: 0; padding: 0;
+
color: #e9e9e9;
−
    float: left;
+
 
}
 
}
  
−
.menu_simple ul li {
+
 
−
    display: inline;
+
/** FONTS **/
 +
@font-face {
 +
font-family: typewriter;
 +
src: url(https://static.igem.org/mediawiki/2015/5/5a/DUNDEE15-Bohemian-typewriter.ttf) format('truetype');
 
}
 
}
  
−
.menu_simple ul li a {
+
 
−
    float: left; text-decoration: none;
+
 
−
    color: white;
+
@font-face {
−
    padding: 11px 11px;
+
font-family: roboto;
−
    background-color:  #111111;
+
src: url('https://static.igem.org/mediawiki/2015/4/41/RobotoSlab-Light.ttf') format('truetype');
 
}
 
}
−
+
 
−
.menu_simple ul li a:visited {
+
@font-face {
−
    color: white;
+
  font-family: 'FontAwesome';
 +
  src: url('https://static.igem.org/mediawiki/2015/6/60/Dundee15-fafont.ttf') format('truetype');
 +
 
 
}
 
}
−
+
 
−
.menu_simple ul li a:hover, .menu_simple ul li .current {
+
 
 +
/* HEADER */
 +
header {
 +
height: 700px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top: 50px;
 +
}
 +
 
 +
#header-home {
 +
background:url(https://static.igem.org/mediawiki/2015/d/d6/Header-home.jpg) no-repeat;
 +
height:700px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-mask-image: -webkit-gradient(linear, left 80%, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
#header-chromate {
 +
background:url(https://static.igem.org/mediawiki/2015/5/5c/Header-chromate.JPG) no-repeat;
 +
height:700px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-mask-image: -webkit-gradient(linear, left 80%, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
#header-modelling {
 +
background:url(https://static.igem.org/mediawiki/2015/8/81/Header-modelling.JPG) no-repeat;
 +
height:700px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-mask-image: -webkit-gradient(linear, left 80%, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
#header-modelling-appendix {
 +
background:url(https://static.igem.org/mediawiki/2015/5/5b/Header-modelling-appendix.JPG) no-repeat;
 +
height:700px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-mask-image: -webkit-gradient(linear, left 80%, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
#header-lab {
 +
background:url(https://static.igem.org/mediawiki/2015/3/3a/Header-lab.JPG) no-repeat;
 +
height:700px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-mask-image: -webkit-gradient(linear, left 80%, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
#header-tubes {
 +
background:url(https://static.igem.org/mediawiki/2015/1/1a/Header-tubes.JPG) no-repeat;
 +
height:700px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-mask-image: -webkit-gradient(linear, left 80%, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
#header-purify {
 +
background:url(https://static.igem.org/mediawiki/2015/6/60/Header-purify.JPG) no-repeat;
 +
height:700px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-mask-image: -webkit-gradient(linear, left 80%, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
#header-fingerprint {
 +
background:url(https://static.igem.org/mediawiki/2015/8/8f/Ft-fingerprint.JPG) no-repeat;
 +
height:700px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-mask-image: -webkit-gradient(linear, left 80%, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
#header-ethics {
 +
background:url(https://static.igem.org/mediawiki/2015/2/2b/Header-ethics.jpg) no-repeat;
 +
height:700px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-mask-image: -webkit-gradient(linear, left 80%, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
#header-bottles {
 +
background:url(https://static.igem.org/mediawiki/2015/0/06/Header-bottles.JPG) no-repeat;
 +
height:700px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-mask-image: -webkit-gradient(linear, left 80%, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
highlight {
 +
    background-color: black;
 
     color: white;
 
     color: white;
−
     background-color: #33CC33;
+
     padding-left:10px;
 +
    padding-right:10px;
 +
    line-height:
 +
}
 +
.highlight {
 +
font-family: typewriter;
 +
}
 +
 
 +
@media (max-width: 450px) {
 +
 
 +
}
 +
 
 +
@media (min-width: 451px) {
 +
header h1 {
 +
font-size: 60px;
 +
margin-top: 120px;
 +
}
 +
header h3 {
 +
margin-top:-55px;
 +
}
 +
}
 +
 
 +
@media (max-width: 450px) {
 +
header h1 {
 +
line-height: 1.8;
 +
}
 +
header h3 {
 +
line-height: 1.8;
 +
}
 +
header h1 {
 +
font-size: 40px;
 +
}
 +
}
 +
 
 +
 
 +
/* END OF HEADER */
 +
 
 +
/** NAVBAR **/
 +
.dropdown-header {
 +
font-size: 18px;
 +
font-weight: 900;
 +
color: #c1c1c1;
 +
text-align: center;
 +
}
 +
 
 +
.dropdown:active {
 +
background-color: none;
 +
}
 +
 
 +
.dropdown-menu>li>a {
 +
font-weight: bold;
 +
color: black;
 +
}
 +
 
 +
.dropdown-menu>li>a:hover {
 +
background-color: #339966;
 +
color:white;
 +
}
 +
 
 +
.igem-navbar {
 +
padding-top: 5px;
 
}
 
}
  
−
/* Creates a container that will wrap all of the content inside your wiki pages. */
+
.navbar-logo {
−
#mainContainer { 
+
−
background-color: #ffffff;
+
−
width: 1000px;
+
−
overflow:hidden;
+
 
float:left;
 
float:left;
−
margin-left:0px;
+
padding-top: 12px;
 +
}
 +
 
 +
@media (max-width: 800px) {
 +
.navbar-logo {
 +
display:none;
 +
}
 +
.igem-navbar {
 +
display: none;
 +
}
 +
}
 +
#nav.affix {
 +
    position: fixed;
 +
    top: 0;
 +
    width: 100%;
 +
    z-index:10;
 +
}
 +
 
 +
/** END OF NAVBAR **/
 +
 
 +
 
 +
#about {
 +
padding-top: 30px;
 +
padding-bottom: 0px;
 +
}
 +
 
 +
#about .row {
 +
 
 
margin-bottom: 0px;
 
margin-bottom: 0px;
−
background-color: #ffffff;
+
text-align: center;
−
font-family: "Trebuchet MS", Helvetica, sans-serif;
+
 
}
 
}
 +
#about .glyphicon {
 +
font-size: 32px;
 +
color: #FFFFFF;
 +
margin-bottom: 10px;
 +
border: 1px solid transparent;
 +
width: 80px;
 +
border-radius: 100%;
 +
padding-top: 22px;
 +
padding-bottom: 22px;
 +
background: #333333;
 +
}
 +
.col-lg-4 {
 +
padding-right:50px;
 +
padding-left:50px;
 +
}
 +
#about ` {
 +
margin-bottom: 20px;
 +
}
 +
.selection-title {
 +
text-align: center;
 +
margin-top: 20px;
 +
 +
}
 +
#about .glyphicon {
 +
-webkit-transition:0.3s;
 +
-moz-transition:0.3s;
 +
-o-transition:0.3s;
 +
transition:0.3s;
  
 +
}
  
 +
#about .col-md-3:hover .glyphicon {
 +
border: 1px solid transparent;
 +
background: #E8E8E8;
 +
color: #585858;
 +
}
  
−
#general {
+
#about .col-lg-4:hover .glyphicon {
−
        width: 600px;
+
border: 1px solid #E8E8E8;
−
height: auto;
+
background: #E8E8E8;
−
float: left;
+
color: #585858;
−
        font-family: Courier;
+
−
font-size: 14px;
+
−
text-align: justify;
+
−
        margin-top: 8px;
+
−
        margin-bottom: 20px;   
+
−
        margin-left: 12px;
+
−
        margin-right: 12px;
+
−
        padding: 0;
+
 
}
 
}
  
−
#homeCenter {
+
#about .col-lg-3:hover .glyphicon {
−
        width: 630px;
+
border: 1px solid transparent;
−
height: auto;
+
background: #E8E8E8;
−
float: left;
+
color: #585858;
−
        font-family: Courier;
+
−
font-size: 14px;
+
−
text-align: justify;
+
−
        margin-top: 8px;
+
−
        margin-bottom: 20px;   
+
−
        margin-left: 12px;
+
−
        margin-right: 12px;
+
−
        padding: 0;
+
 
}
 
}
 +
#about2 {
 +
padding-top: 180px;
 +
padding-bottom: 50px;
 +
background: #eaeaea;
 +
text-align: right;
  
−
#homeRight {
+
-moz-transition:0.3s;
−
width: 270px;
+
-o-transition:0.3s;
−
height: auto;
+
transition:0.3s;
 +
}
 +
#about2 .glyphicon {
 +
font-size: 32px;
 +
color: #585858;
 +
margin-bottom: 10px;
 +
border: 1px solid #AAA;
 +
width: 80px;
 +
border-radius: 100%;
 +
padding-top: 22px;
 +
padding-bottom: 22px;
 +
text-align: center;
 +
}
 +
 
 +
.about-content {
 +
color: #CCC;
 +
}
 +
 
 +
#submenu-gradient {
 +
background: yellow;
 +
}
 +
 
 +
#about3 {
 +
 
 +
/*background-color: rgba(0,0,0,0);*/
 +
  /*background-image:
 +
    radial-gradient(
 +
    #969696,
 +
      #626262
 +
    );
 +
/*background: url(../img/bg-about.jpg) no-repeat;*/
 +
padding-top: 40px;
 +
padding-bottom: 40px;
 +
color: #ffffff;
 +
}
 +
#about3 .glyphicon {
 +
font-size: 22px;
 +
margin-bottom: 10px;
 +
background-color: #333333;
 +
width: 80px;
 +
border-radius: 100%;
 +
padding:28px;
 +
text-align: center;
 +
}
 +
#about3 .row {
 +
margin-bottom: 40px;
 +
}
 +
#about3 h4 {
 +
font-weight: bold;
 +
}
 +
 
 +
/** FOOTER AND SPONSORS **/
 +
footer {
 +
background: #333333;
 +
padding-top: 40px;
 +
padding-bottom: 40px;
 +
padding-left: 30px;
 +
padding-right: 10px;
 +
color: #ffffff;
 +
font-weight: 100;
 +
width: 100%;
 +
}
 +
 
 +
.footer-btn {
 +
margin-top: 40px;
 +
margin-bottom: 30px;
 +
}
 +
 
 +
@media (max-width: 767px) {
 +
footer {
 +
padding-top: 40px;
 +
padding-bottom: 40px;
 +
padding-left: 20px;
 +
padding-right: 10px;
 +
}
 +
}
 +
#sponsor {
 +
text-align: center;
 +
margin-right: auto;
 +
margin-left: auto;
 +
}
 +
#sponsor-logo {
 +
padding-top: 50px;
 +
height:auto;
 +
width:60%;
 +
}
 +
@media (max-width: 900px) {
 +
#sponsor-logo {
 +
padding-top: 15px;
 +
height:auto;
 +
width:200px;
 +
}
 +
}
 +
 
 +
/** END OF FOOTER AND SPONSORS **/
 +
 
 +
 
 +
@media only screen and (max-width: 480px) {
 +
.btn-lg {
 +
margin-bottom: 10px;
 +
margin-right: auto;
 +
margin-left: auto;
 +
}
 +
.pull-right {
 +
display: none;
 +
}
 +
#about .row .col-md-3 {
 +
margin-bottom: 30px;
 +
}
 +
#about2, #about3 .btn {
 +
width: 100%;
 +
}
 +
#about3 {
 +
text-align: center;
 +
}
 +
#about-section1 {
 +
text-align:center;
 +
}
 +
}
 +
 
 +
 
 +
#page-wrap {
 +
    max-width: 1280px;
 +
    margin: 0 auto;
 +
}
 +
 
 +
 
 +
/* PAGE; TOPIC 1 */
 +
 
 +
#about-section1 {
 +
background: url() no-repeat;
 +
padding-top: 40px;
 +
padding-bottom: 40px;
 +
padding-top: 50px;
 +
padding-bottom: 50px;
 +
}
 +
 
 +
headert1 {
 +
background:url(../img/bg-header.jpg) no-repeat;
 +
height:700px;
 +
width:100%;
 +
padding-top:50px;
 +
color: #fff;
 +
}
 +
 
 +
 
 +
/** BUTTON NAVIGATION ANCHORS. PREVENTS OVERLAP OF NAVBAR ON TOP OF CONTENT **/
 +
a.anchor {
 +
display: block;
 +
position: relative;
 +
top: -75px;
 +
visibility: hidden;
 +
}
 +
 
 +
a.anchorselection {
 +
display: block;
 +
position: relative;
 +
top: -45px;
 +
visibility: hidden;
 +
}
 +
/** PAGE NAVIGATION BUTTONS (EXCLUDING HOMEPAGE) **/
 +
 
 +
.fa {
 +
  position: relative;
 +
  top: 1px;
 +
  display: inline-block;
 +
  -webkit-font-smoothing: antialiased;
 +
  font-style: normal;
 +
  font-weight: normal;
 +
  line-height: 1;
 +
  -moz-osx-font-smoothing: grayscale;
 +
 
 +
}
 +
 
 +
/** LABJOURNAL STYLES **/
 +
 
 +
@media only screen and (max-width: 768px) {
 +
    .box-btn {
 +
margin-top: -15%;
 +
margin-right: 15px;
 
float: right;
 
float: right;
−
font-family: Courier;
 
−
font-size: 14px;
 
−
text-align: left;
 
−
        margin-top: 8px;
 
−
        margin-bottom: 20px;   
 
−
        margin-left: 12px;
 
−
        margin-right: 12px;
 
−
        padding: 0;
 
 
}
 
}
 +
}
  
−
</style>
+
.border, .border-week, .border-day {
−
<div id ="mainContainer">
+
border: 2px solid gray;
 +
}
  
−
<div id="banner"></div>
+
.border {
 +
margin-top: 5px;
 +
margin-bottom: 5px;
 +
}
  
−
<head>
 
−
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
−
<link rel="stylesheet" type="text/css" href="menu.css" />
 
−
<title>CSS Simple Horizontal Menu</title>
 
−
</head>
 
  
−
<div class="menu_simple">
+
.border-week {
−
<ul>
+
margin-top: 20px;
−
<li><a href="https://2015.igem.org/Team:Dundee">Home</a></li>
+
background-color: transparent;
−
<li><a href="https://2015.igem.org/Team:Dundee/Team">Team</a></li>
+
margin-bottom: 0px;
−
<li><a href="https://2015.igem.org/Team:Dundee/Project">Project</a></li>
+
}
−
<li><a href="https://2015.igem.org/Team:Dundee/Notebook">Notebook</a></li>
+
.border-day {
−
<li><a href="https://2015.igem.org/Team:Dundee/Modeling">Modeling</a></li>
+
width: 97%;
−
<li><a href="https://2015.igem.org/Team:Dundee/Human_Practices">Human Practices</a></li>
+
float: right;
−
<li><a href="https://2015.igem.org/Team:Dundee/Attributions">Attributions</a></li>
+
border: 2px solid black;
−
<li><a href="https://2015.igem.org/Team:Dundee/Wiki_Details">          </a></li>
+
background-color: #2b2b2b;
−
</ul>
+
margin-bottom: 0px;
−
<br />
+
margin-top: 5px;
−
</div>
+
}
−
</div>
+
.box-btn {
 +
    margin: 10px;
 +
float: right;
 +
clear: both;
 +
cursor: pointer;
 +
}
 +
.biospray-btn {
 +
    margin: 5px;
 +
float: right;
 +
clear: both;
 +
}
 +
.box-title {
 +
font-size: 30px;
 +
    width: 85%;
 +
margin-top: 10px;
 +
margin-left: 10px;
 +
display: inline-block;
 +
color: #d6d6d6;
 +
}
 +
.biospray-content {
 +
margin-left: 10px;
 +
    padding-left: 5px;
 +
    padding-right: 15px;
 +
padding-bottom: 0px;
 +
margin-right: 0px;
 +
margin-bottom: 10px;
 +
}
 +
.week-content {
 +
margin-left: 10px;
 +
    padding-left: 5px;
 +
    padding-right: 50px;
 +
padding-bottom: 0px;
 +
margin-right: 0px;
 +
margin-bottom: 10px;
 +
}
 +
.box-content {
 +
margin-left: 10px;
 +
    padding-left: 5px;
 +
    padding-right: 0px;
 +
padding-bottom: 0px;
 +
margin-right: 20px;
 +
margin-bottom: 0px;
 +
text-align:left;
 +
    clear: right;
 +
    color: #d6d6d6;
 +
}
 +
#biospray-title {
 +
margin-top: 20px;
 +
margin-left: 10px;
 +
font-size:35px;
 +
    padding-left:0px;
 +
    display: inline-block;
 +
    padding-bottom: 15px;
 +
    color: #d6d6d6;
 +
}
 +
.labtitle {
 +
margin-top: 0px;
 +
font-size:35px;
 +
text-align:center;
 +
    padding-left:10px;
 +
    padding-bottom: 0px;
 +
    display: inline-block;
 +
    color: #d6d6d6;
 +
}
 +
.journal-summary-heading {
 +
color: #669966;
 +
font-size: 20px;
 +
}
 +
.journal-content {
 +
color: #d6d6d6;
 +
}
 +
.journal-protocol, .journal-protocol:hover {
 +
color: #669966;
 +
text-decoration: none;
 +
cursor: pointer;
 +
}
 +
.box-btn.glyphicon {
 +
font-size: 2em;
 +
color: #d6d6d6;
 +
-webkit-transition:0.3s;
 +
-moz-transition:0.3s;
 +
-o-transition:0.3s;
 +
transition:0.3s;
  
 +
}
 +
 +
.box-btn.glyphicon:hover {
 +
color: #669966;
 +
}
 +
.biospray-btn.glyphicon:hover {
 +
color: #669966;
 +
}
 +
/** END OF LABJOURNAL **/
 +
 +
 +
/** GENERAL PAGE STRUCTURE **/
 +
 +
.ribbon {
 +
background-color: transparent;
 +
    padding-right: 0px;
 +
    padding-left: 0px;
 +
}
 +
.rows {
 +
    padding: 20px;
 +
    padding-bottom: 80px;
 +
background-color: transparent;
 +
}
 +
 +
.rows > .btn {
 +
margin-bottom: 15px;
 +
}
 +
.row1, .row2, .row3, .row4, .row5, .row6 {
 +
margin-top: 10px;
 +
margin-bottom:10px;
 +
margin-left:30px;
 +
margin-right:20px;
 +
background-color: transparent;
 +
}
 +
ul .dropdown-menu {
 +
right:0;
 +
}
 +
.btn .btn-info .col-sm-1 .box-btn {
 +
clear: both;
 +
}
 +
 +
.btn-info {
 +
background-color: #339966;
 +
 +
}
 +
 +
a:link, a:visited, a:active, a {
 +
outline: 0;
 +
  color: white;
 +
  text-decoration: none !important;
 +
  cursor: pointer;
 +
}
 +
 +
e {
 +
font-size: 120%;
 +
color: white;
 +
font-weight: 450;
 +
}
 +
/** END OF GENERAL PAGE STRUCTURE **/
 +
 +
/** MODAL THEMES **/
 +
 +
.modal {
 +
top: 70px;
 +
}
 +
 +
.modal-body, .modal-title {
 +
color: black !important;
 +
}
 +
 +
.modal-body p {
 +
color: black;
 +
}
 +
 +
.modal-title a {
 +
color: blue !important;
 +
}
 +
 +
body.modal-open {
 +
    overflow: visible;
 +
}
 +
/** END OF MODAL THEMES **/
 +
 +
 +
/** TABLE **/
 +
table, th, td {
 +
border: 1px solid #339966 !important;
 +
border-collapse: collapse;
 +
}
 +
 +
.modal > table, th, td {
 +
border: 1px solid black;
 +
border-collapse: collapse;
 +
}
 +
/** END OF TABLE **/
 +
 +
 +
 +
#sponsor-logo {
 +
padding-top: 50px;
 +
height:60%;
 +
width:60%;
 +
}
 +
 +
@media (max-width: 992px) {
 +
#sponsor-logo {
 +
padding-top: 15px;
 +
height:100%;
 +
width:200px;
 +
}
 +
.igem-navbar {
 +
display:none;
 +
}
 +
.navbar-logo {
 +
display: none;
 +
}
 +
.navbar-brand {
 +
display:none;
 +
}
 +
.button-center {
 +
margin-bottom: 20px;
 +
text-align: center;
 +
}
 +
}
 +
 +
@media (max-width: 1200px) {
 +
.navbar-logo {
 +
display: none;
 +
}
 +
.igem-navbar {
 +
display:none;
 +
}
 +
.navbar-brand {
 +
padding: 15px 5px;
 +
}
 +
.intro-video {
 +
width: 80%;
 +
margin-top: 20px;
 +
}
 +
}
 +
 +
 +
/** PAGE BREAKING IMAGES **/
 +
.splash {
 +
background:url(../img/splash/modelling.JPG) no-repeat;
 +
height:300px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
 +
.ft-biospray {
 +
background: url(https://static.igem.org/mediawiki/2015/8/8f/Ft-biospray.JPG) no-repeat;
 +
height:300px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
.ft-fingerprint {
 +
background: url(https://static.igem.org/mediawiki/2015/8/8f/Ft-fingerprint.JPG) no-repeat;
 +
height:300px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
.ft-chromate {
 +
background: url(https://static.igem.org/mediawiki/2015/2/22/Ft-chromate.JPG) no-repeat;
 +
height:300px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
 +
.splash-duran {
 +
background: url(https://static.igem.org/mediawiki/2015/6/68/Splash-duran.JPG) no-repeat;
 +
height:300px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
.splash-tank {
 +
background: url(https://static.igem.org/mediawiki/2015/8/8f/Splash-tank.JPG) no-repeat;
 +
height:300px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
.splash-pour {
 +
background: url(https://static.igem.org/mediawiki/2015/f/f5/Splash-pour.JPG) no-repeat;
 +
height:300px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
.splash-incubator {
 +
background: url(https://static.igem.org/mediawiki/2015/2/2e/Splash-incubator.JPG) no-repeat;
 +
height:300px;
 +
width: 100%;
 +
margin: auto;
 +
padding-top:50px;
 +
color: #fff;
 +
background-position: center center;
 +
-webkit-background-size: cover;
 +
    -moz-background-size: cover;
 +
    background-size: cover;
 +
    -o-background-size: cover;
 +
    background-attachment: scroll;
 +
}
 +
 +
 +
.page-break {
 +
border-style: solid;
 +
border-bottom: thin solid #FFF;
 +
margin-bottom: 50px;
 +
margin-top: 20px;
 +
}
 +
 +
.caption-center {
 +
text-align: center;
 +
}
 +
/** END OF PAGE BREAKING IMAGES**/
 +
 +
/** SEQUENCES PAGE **/
 +
 +
.modal-body p {
 +
    word-wrap: break-word;
 +
}
 +
 +
.sequences {
 +
word-wrap: break-word;
 +
}
 +
 +
/** END OF SEQUENCES **/
 +
 +
/** FIGURE STYLES **/
 +
 +
figure {
 +
margin-bottom: 20px;
 +
}
 +
 +
figure figcaption p {
 +
font-size: .9em !important;
 +
}
 +
@media (max-width: 992px) {
 +
figure img {
 +
width: 80%;
 +
background-color: #2b2b2b;
 +
padding: 5px;
 +
}
 +
 +
figure figcaption {
 +
width: 80%;
 +
text-align: center;
 +
margin-left: auto;
 +
margin-right: auto;
 +
background-color: #2b2b2b;
 +
padding: 5px;
 +
}
 +
figure1 img {
 +
width: 80%;
 +
background-color: #2b2b2b;
 +
padding: 5px;
 +
}
 +
figure1 figcaption {
 +
width: 80%;
 +
text-align: center;
 +
margin-left: auto;
 +
margin-right: auto;
 +
background-color: #2b2b2b;
 +
padding: 5px;
 +
}
 +
}
 +
 +
@media (min-width: 993px) {
 +
figure img {
 +
width: 650px;
 +
text-align: center;
 +
margin-left: auto;
 +
margin-right: auto;
 +
background-color: #2b2b2b;
 +
padding: 10px;
 +
}
 +
figure figcaption {
 +
width: 650px;
 +
text-align: center;
 +
margin-left: auto;
 +
margin-right: auto;
 +
background-color: #2b2b2b;
 +
padding: 10px;
 +
}
 +
.col-md-6 figure img {
 +
width: 100%;
 +
text-align: center;
 +
margin-left: auto;
 +
margin-right: auto;
 +
background-color: #2b2b2b;
 +
padding: 10px;
 +
}
 +
.col-md-6 figure figcaption {
 +
width:100%;
 +
text-align: center;
 +
margin-left: auto;
 +
margin-right: auto;
 +
background-color: #2b2b2b;
 +
padding: 10px;
 +
}
 +
figure1 img {
 +
width: 30%;
 +
background-color: #2b2b2b;
 +
padding: 5px;
 +
}
 +
figure1 figcaption {
 +
width: 30%;
 +
text-align: center;
 +
margin-left: auto;
 +
margin-right: auto;
 +
background-color: #2b2b2b;
 +
padding: 5px;
 +
}
 +
.intro-video {
 +
width: 60%;
 +
margin-top: 20px;
 +
}
 +
}
 +
 +
.btn-margin {
 +
margin-bottom: 10px;
 +
}
 +
 +
/** END OF FIGURE STYLES **/
 +
 +
</style>
 
</html>
 
</html>

Latest revision as of 22:25, 18 September 2015