Template:Team:Styling

From 2012e.igem.org

(Difference between revisions)
 
(77 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
<style type="text/css">
<style type="text/css">
 +
 +
/* Default Reformatting and Header */
 +
 +
#catlinks, #globalWrapper #content, #search-controls, #p-logo{display: none;}
 +
#top-section{border-left: 0; border-right: 0; border-bottom: 0; height: 20px;}
 +
#footer-box{border: 0; background-color: #f5f5f5;margin-top: 30px;}
 +
#footer li{margin: 0 15px;}
 +
#footer li a{text-decoration: none;color: #5A7BB7;}
 +
/*** RESET STYLES ***/
/*** RESET STYLES ***/
Line 21: Line 30:
background: transparent;
background: transparent;
text-decoration: none;
text-decoration: none;
-
list-style: none;
+
        list-style: none;
}
}
@font-face {
@font-face {
font-family: museoslab;
font-family: museoslab;
-
src: url('20EAB6_0_0.ttf');
+
src: url('http://vampa.org/igem/20EAB6_0_0.ttf');
}
}
Line 36: Line 45:
h1{font-size: xx-large;}
h1{font-size: xx-large;}
h2{font-size: x-large;}
h2{font-size: x-large;}
-
h3{font-size: large}
+
h3{float: left; margin-top: 15px;width: 960px;padding-bottom: 10px;font-size: large;}
-
/* Default Reformatting and Header */
+
li.bullet{float: left; width: 940px; margin-left: 20px;padding: 5px 0;list-style-type: circle;}
-
 
+
-
#globalwrapper {
+
-
    width:1000px;
+
-
    padding:0px 0px;
+
-
    margin: 0 auto;
+
-
    background-color: #BABABA;
+
-
    background-attachment: fixed;
+
-
    background-position: center;
+
-
    background-size:100% 100%;
+
-
}
+
-
 
+
-
body {
+
-
    background: #CECECE;
+
-
    background-image:url('https://static.igem.org/mediawiki/2012/d/d3/Uiucbackground10.png');
+
-
    background-attachment: fixed;
+
-
    background-position: center;
+
-
    height:100%;
+
-
    background-size:100% 100%;
+
-
}
+
-
.firstHeading {
+
-
    height:0px;
+
-
    visibility:hidden;
+
-
}
+
-
 
+
-
#p-logo {
+
-
    height:0px;
+
-
    overflow:hidden;
+
-
    display: none;
+
-
}
+
-
 
+
-
#search-controls {
+
-
display:none;
+
-
margin-top:0px;
+
-
}
+
-
 
+
-
#content{
+
-
    visibility: hidden;
+
-
}
+
-
 
+
-
#top-section {
+
-
    background-image:url('https://static.igem.org/mediawiki/2012/e/e6/Newbanner6.png');
+
-
    background-color:#151F4E;
+
-
    background-position: top;
+
-
    width:1000px;
+
-
    height:219px;
+
-
    background-repeat: no-repeat;
+
-
    border-width:0px;
+
-
    border-top-width:0px;
+
-
    -webkit-box-shadow: 0 8px 6px -6px black;
+
-
    -moz-box-shadow: 0 8px 6px -6px black;
+
-
    box-shadow: 0 8px 6px -6px black;
+
-
    border: 10px solid rgba(255, 255, 255,0.7);
+
-
    background-clip: padding-box;
+
-
    margin-top: -10px;
+
-
    margin-bottom: -50px;
+
-
}
+
-
 
+
-
 
+
-
#menubar {
+
-
    color: white;
+
-
    background-color: transparent;
+
-
}
+
-
#menubar ul li a {
+
-
    color: white;
+
-
    background-color: transparent;
+
-
}
+
-
 
+
-
.right-menu li a {
+
-
    color: white;
+
-
    background-color: transparent;
+
-
}
+
-
 
+
-
/* Header */
+
-
 
+
-
#igemlogozone {
+
-
position: absolute;
+
-
top: 25px;
+
-
left: 960px;
+
-
height: 125px;
+
-
width: 150px;
+
-
background-color: transparent;
+
-
}
+
-
 
+
-
#wrapper {
+
-
width: 1000px;
+
-
height: 100%;
+
-
float: center;
+
-
padding-left: 0%;
+
-
padding-right: 0%;
+
-
        padding-top: 1%;
+
-
        background-color: #BABABA;
+
-
background-attachment: fixed;
+
-
        background-position: center;
+
-
 
+
-
}
+
-
 
+
-
#header {
+
-
        width: 750px;
+
-
        float: center;
+
-
background-color:#FFE4C4;
+
-
height: 150px;
+
-
        -webkit-box-shadow: 0 8px 6px -6px black;
+
-
-moz-box-shadow: 0 8px 6px -6px black;
+
-
box-shadow: 0 8px 6px -6px black;
+
-
border: 10px solid rgba(255, 255, 255,0.7);
+
-
background-clip: padding-box;
+
-
margin-left: auto;
+
-
margin-right: auto;     
+
-
}
+
-
 
+
-
img {
+
-
border: none;
+
-
}
+
-
 
+
-
#headernavigation{
+
-
        width: 1000px;
+
-
        float: center;
+
-
background-color: transparent;
+
-
height: 60px;
+
-
margin-left: auto;
+
-
margin-right: auto; 
+
-
        margin-top: -49px; 
+
-
        margin-bottom: 10px;
+
-
        z-index: 2; 
+
-
-webkit-transition: all 300ms ease-in-out;
+
-
}
+
-
 
+
-
#headernavbar{
+
-
list-style:none;
+
-
font-weight:bold;
+
-
float:left;
+
-
width:100%;
+
-
        margin:0;
+
-
        padding:0;
+
-
        z-index: 2; 
+
-
}
+
-
#headernavbar li{
+
-
        float:left;
+
-
position:relative;
+
-
        text-align:center;
+
-
        z-index: 2; 
+
-
}
+
-
#headernavbar a{
+
-
        margin-left:0px;
+
-
display:block;
+
-
        padding-bottom:10px;
+
-
        padding-top:10px;
+
-
        width: 100px;
+
-
color:#ffffff;
+
-
background:#f68e3c;
+
-
        font: bold 16px Arial;
+
-
        z-index: 2; 
+
-
 
+
-
}
+
-
#headernavbar a:hover{
+
-
color:#ffffff;
+
-
background:#003C7D;
+
-
text-decoration:none;
+
-
        z-index: 2; 
+
-
 
+
-
}
+
-
 
+
-
#headernavbar ul{
+
-
background: #003C7D;
+
-
list-style:none;
+
-
position:absolute;
+
-
left:-9999px;
+
-
        z-index: 2; 
+
-
}
+
-
#headernavbar ul li{
+
-
padding-top:0px;
+
-
        margin-bottom:-1px;
+
-
float:none;
+
-
        margin-top:-3px;
+
-
        z-index: 2; 
+
-
}
+
-
#headernavbar ul a{
+
-
white-space:nowrap;
+
-
        z-index: 2; 
+
-
}
+
-
#headernavbar li:hover ul{
+
-
left: -15px;
+
-
        z-index: 2;
+
-
 
+
-
}
+
-
#headernavbar li:hover a{
+
-
background:#003C7D;
+
-
text-decoration:none;
+
-
        z-index: 2; 
+
-
}
+
-
#headernavbar li:hover ul a{
+
-
text-decoration:none;
+
-
        z-index: 2; 
+
-
 
+
-
}
+
-
#headernavbar li:hover ul li a:hover{
+
-
background:#f68e3c;
+
-
        z-index: 2;
+
-
}
+
/** WRAPPERS **/
/** WRAPPERS **/
Line 250: Line 60:
/** header **/
/** header **/
-
#logo{width: 412px;margin-top: 45px;}
+
#logo{width: 345px;float: left; margin-top: 55px;}
-
 
+
#igem{float: right;margin-top: 55px;}
-
#banner{width: 1000px;float: left;}
+
-
#uiuc{float: left;}
+
-
#igem{float: right;margin-top: -10px;}
+
/* slideshow */
/* slideshow */
-
#slideshow-wrap{float: left;clear: left; width: 1000px; margin-top: 10px; background-color: aqua;height: 300px;}
+
#slideshow-wrap{float: left;clear: left; width: 1000px; margin-top: 25px; background-color: aqua;height: 300px;}
/* nav */
/* nav */
#nav{float: left; clear: left; margin-top: 15px; width: 1000px;}
#nav{float: left; clear: left; margin-top: 15px; width: 1000px;}
-
#nav li{float: left;margin-left: 40px;}
+
#nav li{float: left;margin-left: 47px;}
#nav > li:first-child{margin-left: 2px;}
#nav > li:first-child{margin-left: 2px;}
#nav li a{font-family: museoslab; font-size: 18px;color: #5a7bb7; padding-bottom: 5px;border-bottom: 3px solid #f5f5f5;}
#nav li a{font-family: museoslab; font-size: 18px;color: #5a7bb7; padding-bottom: 5px;border-bottom: 3px solid #f5f5f5;}
#nav li a.active{color: #e45339;border-bottom-color: #e45339;}
#nav li a.active{color: #e45339;border-bottom-color: #e45339;}
-
#nav li a:hover{color: #e45339;}
+
#nav li a:hover{color: #e45339;text-decoration: none;}
-
 
+
/** CONTENT **/
/** CONTENT **/
Line 276: Line 82:
#home-content{float: left; clear: left; width: 1000px;text-align: left; margin-top: 30px;}
#home-content{float: left; clear: left; width: 1000px;text-align: left; margin-top: 30px;}
#home-content h3{float: left; padding-bottom: 8px; border-bottom: solid 1px #c9c9c9;width: 629px; margin-bottom: 15px;}
#home-content h3{float: left; padding-bottom: 8px; border-bottom: solid 1px #c9c9c9;width: 629px; margin-bottom: 15px;}
-
#home-content p{float: left; clear: left; line-height: 24px; width: 629px; margin-bottom: 20px;}
+
#home-content p{float: left; clear: left; line-height: 24px; width: 629px; margin-bottom: 20px;text-align: justify;}
#igb{float: right;width: 343px;margin-top: 30px;}
#igb{float: right;width: 343px;margin-top: 30px;}
/* sponsors */
/* sponsors */
-
#sponsors-wrap{float: left; clear: both; width: 1000px; text-align: center;margin-top: 25px; padding-top: 10px; border-top: 1px solid #c9c9c9;}
+
#sponsors-wrap{float: left; clear: both; width: 1000px; text-align: center;margin-top: 25px; padding-top: 25px; border-top: 1px solid #c9c9c9;border-bottom: 1px solid #c9c9c9; padding-bottom: 25px;}
#sponsors{width: 640px; margin: 0 auto;}
#sponsors{width: 640px; margin: 0 auto;}
.sponsor-thumb{float: left;margin: 0 15px;}
.sponsor-thumb{float: left;margin: 0 15px;}
.sponsor-thumb img{max-height: 75px;}
.sponsor-thumb img{max-height: 75px;}
 +
 +
/* content */
 +
 +
#page-content{float: left; width: 958px; clear: both;margin-top: 20px;padding: 20px;background: white;border: 1px solid #c9c9c9;}
 +
#page-content h2{float: left;width: 958px; padding: 5px 0 8px 0;border-bottom: 1px solid #c9c9c9;text-align: left;}
 +
#page-content p{float: left; line-height: 25px;}
 +
 +
/** CODA SLIDER **/
 +
 +
#exec-summary-panel .panel-wrapper{height: 2250px;}
 +
.mop-pane{height: 3500px;}
 +
 +
/* provided */
 +
 +
.coda-slider-wrapper {padding: 20px 0;margin-top: 15px;float: left;margin-left: 0;}
 +
.coda-slider-wrapper .coda-slider {background: #f5f5f5;width: 1000px;}
 +
.coda-slider-wrapper .coda-slider .panel {width: 1000px;}
 +
.coda-slider-wrapper .coda-slider .panel .panel-wrapper {padding: 20px;background: white; border: 1px solid #c9c9c9;}
 +
.coda-slider-wrapper .coda-nav {float: left; width: 1000px;margin-bottom: -2px;}
 +
.coda-slider-wrapper .coda-nav-left, .coda-slider-wrapper .coda-nav-right {display: none;}
 +
.coda-slider-wrapper .loading{height:100%;padding:20px;text-align:center}
 +
.coda-slider-wrapper{clear:both;overflow:auto}
 +
.coda-slider-wrapper .coda-slider{float:left;overflow:hidden;position:relative}
 +
.coda-slider-wrapper .coda-slider .panel-container{position:relative}
 +
.coda-slider-wrapper .coda-slider .panel-container .panel{display:block;float:left}
 +
 +
/* custom */
 +
 +
.coda-slider-wrapper .coda-slider .panel{text-align: left;}
 +
.coda-slider-wrapper .coda-slider .panel h2{float: left; padding: 10px 0 8px 0px;width: 960px;margin-bottom: 15px;border-bottom: 1px solid #e0e0e0;}
 +
.coda-slider-wrapper .coda-slider .panel p{ margin-top: 15px; line-height: 25px;}
 +
.coda-slider-wrapper .coda-nav{width: 1000px; text-align: center;}
 +
.coda-slider-wrapper .coda-nav ul{margin-left: 10px;}
 +
.coda-slider-wrapper .coda-nav ul li{float: left;border-right: 1px solid #c9c9c9;margin-bottom: -1px;}
 +
.coda-slider-wrapper .coda-nav ul li a{float: left;padding: 10px 13px 10px 13px;color: #565656;}
 +
.coda-slider-wrapper .coda-nav ul li a.current{background: url('https://static.igem.org/mediawiki/2012e/f/f7/Hover.png') repeat-x bottom;}
 +
.coda-slider-wrapper .coda-nav ul li a:hover{background: url('https://static.igem.org/mediawiki/2012e/f/f7/Hover.png') repeat-x bottom; }
 +
.coda-slider-wrapper .coda-nav ul > li:last-child{border-right: 0;}
 +
</style>
</style>
</html>
</html>

Latest revision as of 21:29, 28 October 2012