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; | |
} | } | ||
@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;} |
- | + | li.bullet{float: left; width: 940px; margin-left: 20px;padding: 5px 0;list-style-type: circle;} | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | . | + | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | } | + | |
/** WRAPPERS **/ | /** WRAPPERS **/ | ||
Line 250: | Line 60: | ||
/** header **/ | /** header **/ | ||
- | #logo{width: | + | #logo{width: 345px;float: left; margin-top: 55px;} |
- | + | #igem{float: right;margin-top: 55px;} | |
- | + | ||
- | + | ||
- | #igem{float: right;margin-top: | + | |
/* slideshow */ | /* slideshow */ | ||
- | #slideshow-wrap{float: left;clear: left; width: 1000px; margin-top: | + | #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: | + | #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: | + | #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