Difference between revisions of "Team:Oxford/Assets/stylesheet.css"

Line 1: Line 1:
−
{{:Team:Oxford/Templates/Nav}}
+
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
 +
    display:none;
 +
}
 +
#top-section {
 +
    border: none;
 +
    height: 0px;
 +
}
  
−
<html>
+
#content {
−
     <div class="container-fluid" id="title">
+
     width:100%;
−
        <img src="https://static.igem.org/mediawiki/2015/9/9a/Ox_igem_logo_white.png" id="oxigem-logo">
+
}
−
        <img src="https://static.igem.org/mediawiki/2015/2/2a/Ox_solution_jumbo.png">
+
−
        <h3>A TARGETED APPROACH TO ANTIMICROBIAL RESISTANCE</h3>
+
−
    </div>
+
−
    <div class="container page-content">
+
−
        <div class="row">
+
−
            <div class="col-md-12">
+
−
                <div class="quote quote-left">
+
−
                    <p>
+
−
                        "Antimicrobial resistance poses a catastrophic threat. If we don't act now, any one of us could go into hospital in 20 years for minor surgery and die because of an ordinary infection that can't be treated by antibiotics."
+
−
                    </p>
+
−
                    <h3>Professor Dame Sally Davies<br><em>Chief Medical Officer</em><br><em>March 2013</em></h3>
+
−
                </div>
+
  
−
            </div>
 
  
−
        </div>
+
.row {
 +
    background-color: #fff;
 +
}
 +
.navbar  {
 +
    margin-top: 16px;
 +
    position: fixed;
 +
    font-size: 13px;
 +
    background-color: #fff;
 +
    margin-bottom: 0;
 +
}
  
−
     </div>
+
.navbar-right li {
−
</html>
+
     font-family: "Avenir",sans-serif;
−
{{:Team:Oxford/Templates/Foot}}
+
    color: #cccccc;
 +
}
 +
 
 +
.navbar-nav > li > a {
 +
    padding-left: 5px;
 +
    padding-right: 5px;
 +
}
 +
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav> .active > a:hover {
 +
    background-color: #fff;
 +
    color:#4776E6;
 +
}
 +
 
 +
.navbar-default .navbar-nav > .active {
 +
    background-color: #fff;
 +
 
 +
}
 +
 
 +
.navbar-brand {
 +
    font-weight: bold;
 +
}
 +
 
 +
 
 +
#main-container {
 +
    top:0;
 +
    left:0;
 +
    right:0;
 +
    margin:50px 0 0 0;
 +
    padding:0;
 +
    background-color:#fff;
 +
    overflow:scroll;
 +
    position:absolute;
 +
}
 +
 
 +
 
 +
#title {
 +
    width: 100%;
 +
    background: -webkit-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* Chrome 10+, Saf5.1+ */
 +
    background:    -moz-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* FF3.6+ */
 +
    background:    -ms-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* IE10 */
 +
    background:      -o-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* Opera 11.10+ */
 +
    background:        linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* W3C */
 +
    border-radius: 0;
 +
    margin-top: -10px;
 +
}
 +
 
 +
#title img {
 +
    width:80%;
 +
    margin: 10em auto;
 +
    margin-bottom: 4em;
 +
    display: block;
 +
}
 +
 
 +
#title h3 {
 +
    color: #fff;
 +
    text-align: center;
 +
    font-family: "Avenir", sans-serif;
 +
    font-weight: lighter;
 +
    font-size: 1.5em;
 +
    margin-bottom: 5.5em;
 +
}
 +
 
 +
#oxigem-logo {
 +
    padding-top: 2em;
 +
    padding-bottom: 2em;
 +
    height: 2em;
 +
}
 +
.page-content {
 +
    margin-top: -3em;
 +
    background-color: #fff;
 +
    z-index: 10;
 +
}
 +
 
 +
.quote {
 +
    font-family: "Avenir", sans-serif;
 +
    background: -webkit-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* Chrome 10+, Saf5.1+ */
 +
    -webkit-background-clip: text;
 +
    -webkit-text-fill-color: transparent;
 +
    margin: 1em;
 +
}
 +
 
 +
.quote p {
 +
    text-align: justify;
 +
    text-transform: uppercase;
 +
    font-size: 1em;
 +
    font-weight: lighter;
 +
    margin-bottom: 0;
 +
}
 +
 
 +
.quote h3 {
 +
    text-align: right;
 +
    font-size: 1em;
 +
    text-transform: uppercase;
 +
    margin-top: 0;
 +
}
 +
 
 +
.quote-full {
 +
    width: 90%;
 +
    margin-left: auto;
 +
    margin-right: auto;
 +
}
 +
 
 +
.quote-right {
 +
    width: 40%;
 +
    float: right;
 +
}
 +
 
 +
.quote-left {
 +
    width:40%;
 +
    float: left;
 +
}
 +
 
 +
#foot {
 +
    background-color: #4776E6;
 +
    color: white;
 +
    font-family: "Avenir",sans-serif;
 +
    text-align: center;
 +
    padding-top: 1em;
 +
    z-index: -10;
 +
    text-transform: uppercase;
 +
    vertical-align: middle;
 +
    background: -webkit-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* Chrome 10+, Saf5.1+ */
 +
    background:    -moz-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* FF3.6+ */
 +
    background:    -ms-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* IE10 */
 +
    background:      -o-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* Opera 11.10+ */
 +
    background:        linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* W3C */
 +
}
 +
 
 +
#foot ul {
 +
    list-style-type: none;
 +
    list-style-image: none;
 +
}
 +
 
 +
#foot li {
 +
    display: inline;
 +
}
 +
 
 +
#foot a {
 +
    color: white;
 +
    font-size: 1em;
 +
}
 +
 
 +
#foot p {
 +
    font-size: 0.5em;
 +
}

Revision as of 09:54, 3 August 2015

  1. contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
   display:none;

}

  1. top-section {
   border: none;
   height: 0px;

}

  1. content {
   width:100%;

}


.row { 

   background-color: #fff;

} .navbar { 

   margin-top: 16px;
   position: fixed;
   font-size: 13px;
   background-color: #fff;
   margin-bottom: 0;

}

.navbar-right li { 

   font-family: "Avenir",sans-serif;
   color: #cccccc;

}

.navbar-nav > li > a { 

   padding-left: 5px;
   padding-right: 5px;

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

   background-color: #fff;
   color:#4776E6;

}

.navbar-default .navbar-nav > .active { 

   background-color: #fff;

}

.navbar-brand { 

   font-weight: bold;

}


  1. main-container {
   top:0;
   left:0;
   right:0;
   margin:50px 0 0 0;
   padding:0;
   background-color:#fff;
   overflow:scroll;
   position:absolute;

}


  1. title {
   width: 100%;
   background: -webkit-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* Chrome 10+, Saf5.1+ */
   background:    -moz-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* FF3.6+ */
   background:     -ms-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* IE10 */
   background:      -o-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* Opera 11.10+ */
   background:         linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* W3C */
   border-radius: 0;
   margin-top: -10px;

}

  1. title img {
   width:80%;
   margin: 10em auto;
   margin-bottom: 4em;
   display: block;

}

  1. title h3 {
   color: #fff;
   text-align: center;
   font-family: "Avenir", sans-serif;
   font-weight: lighter;
   font-size: 1.5em;
   margin-bottom: 5.5em;

}

  1. oxigem-logo {
   padding-top: 2em;
   padding-bottom: 2em;
   height: 2em;

} .page-content { 

   margin-top: -3em;
   background-color: #fff;
   z-index: 10;

}

.quote { 

   font-family: "Avenir", sans-serif;
   background: -webkit-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* Chrome 10+, Saf5.1+ */
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   margin: 1em;

}

.quote p { 

   text-align: justify;
   text-transform: uppercase;
   font-size: 1em;
   font-weight: lighter;
   margin-bottom: 0;

}

.quote h3 { 

   text-align: right;
   font-size: 1em;
   text-transform: uppercase;
   margin-top: 0;

}

.quote-full { 

   width: 90%;
   margin-left: auto;
   margin-right: auto;

}

.quote-right { 

   width: 40%;
   float: right;

}

.quote-left { 

   width:40%;
   float: left;

}

  1. foot {
   background-color: #4776E6;
   color: white;
   font-family: "Avenir",sans-serif;
   text-align: center;
   padding-top: 1em;
   z-index: -10;
   text-transform: uppercase;
   vertical-align: middle;
   background: -webkit-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* Chrome 10+, Saf5.1+ */
   background:    -moz-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* FF3.6+ */
   background:     -ms-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* IE10 */
   background:      -o-linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* Opera 11.10+ */
   background:         linear-gradient(90deg, #4776E6 10%, #8E54E9 90%); /* W3C */

}

  1. foot ul {
   list-style-type: none;
   list-style-image: none;

}

  1. foot li {
   display: inline;

}

  1. foot a {
   color: white;
   font-size: 1em;

}

  1. foot p {
   font-size: 0.5em;

}