"
Template:WashU/Layout
From 2014.igem.org
(Test Layout template) |
(changed css links) |
||
| Line 7: | Line 7: | ||
*/ | */ | ||
| - | + | {{WashU/navi}} | |
| - | + | {{WashU/forms}} | |
| - | + | {{WashU/tables}} | |
| - | + | {{WashU/featured_slide}} | |
| + | |||
body{ | body{ | ||
| Line 403: | Line 404: | ||
margin:0; | margin:0; | ||
padding:0; | padding:0; | ||
| - | + | } | |
Revision as of 17:08, 20 June 2014
/* Template Name: Ost Magazine File: Layout CSS Author: OS Templates Author URI: http://www.os-templates.com/ Licence: <a href="http://www.os-templates.com/template-terms">Website Template Licence</a>
- /
/* Template Name: Ost Magazine File: Navigation CSS Author: OS Templates Author URI: http://www.os-templates.com/ Licence: <a href="http://www.os-templates.com/template-terms">Website Template Licence</a>
- /
- topnav{
display:block; float:right; margin-top:22px; width:600px; font-size:14px; font-family:Georgia, "Times New Roman", Times, serif; }
- topnav ul, #topnav li{
margin:0; padding:0; list-style:none; }
- topnav li{
float:right; margin-right:30px; }
- topnav li li{
margin-right:0; }
- topnav li span{
display:block; margin:5px 0 0 0; padding:0; font-size:12px; font-weight:bold; font-family:Arial, Helvetica, sans-serif; text-transform:lowercase; color:#666666; background-color:#000000; font-weight:normal; line-height:normal; }
- topnav li a:link, #topnav li a:visited, #topnav li a:hover{
display:block; margin:0; padding:20px 0 0 0; color:#FFFFFF; background-color:#000000; text-transform:uppercase; border-top:2px solid #000000; font-weight:bold; }
- topnav ul ul li a:link, #topnav ul ul li a:visited{
border:none; }
- topnav li a:hover, #topnav li.active a{
color:#FFFF00; background-color:#000000; border-top-color:#FFFF00; }
- topnav li li a:link, #topnav li li a:visited{
width:150px; float:none; margin:0; padding:7px 10px; font-size:12px; font-weight:normal; color:#FFFFFF; background-color:#000000; border:none; }
- topnav li li a:hover{
color:#FFFF00; background-color:#000000; }
- topnav ul ul{
z-index:9999; position:absolute; left:-999em; height:auto; width:170px; border-left:1px solid #666666; border-bottom:1px solid #666666; }
- topnav ul ul a{width:140px;}
- topnav li:hover ul{left:auto;}
- topnav li:hover{position:static;}
- topnav li.last{margin-right:0;}
/* ----------------------------------------------Column Navigation-------------------------------------*/
.column .subnav{display:block; width:218px; padding:20px; border:1px solid #F9F9F9; margin-bottom:30px;}
.column .subnav h2{ margin:0 0 15px 0; padding:0 0 8px 0; font-size:16px; font-weight:normal; font-family:Georgia, "Times New Roman", Times, serif; line-height:normal; border-bottom:1px dotted #666666; }
.column .subnav ul{ margin:0; padding:0; list-style:none; }
.column .subnav li{ margin:0 0 3px 0; padding:0; }
.column .subnav ul ul, .column .subnav ul ul ul, .column .subnav ul ul ul ul, .column .subnav ul ul ul ul ul{border-top:none; padding-top:0;}
.column .subnav a{ display:block; margin:0; padding:5px 10px 5px 20px; color:#666666; background:url("../images/blue_file.gif") no-repeat 10px center #FFFFFF; text-decoration:none; border-bottom:1px dotted #666666; }
.column .subnav a:hover{color:#660000; background-color:#FFFFFF;}
.column .subnav ul ul a, .column .subnav ul ul ul a, .column .subnav ul ul ul ul a, .column .subnav ul ul ul ul ul a{background:url("../images/black_file.gif") no-repeat #FFFFFF;} .column .subnav ul ul a{padding-left:40px; background-position:30px center;} .column .subnav ul ul ul a{padding-left:50px; background-position:40px center;} .column .subnav ul ul ul ul a{padding-left:60px; background-position:50px center;} .column .subnav ul ul ul ul ul a{padding-left:70px; background-position:60px center;} /* Template Name: Ost Magazine File: Forms CSS Author: OS Templates Author URI: http://www.os-templates.com/ Licence: <a href="http://www.os-templates.com/template-terms">Website Template Licence</a>
- /
form, fieldset, legend{margin:0; padding:0; border:none;} legend{display:none;} input, textarea, select{font-size:12px; font-family:Georgia, "Times New Roman", Times, serif;}
/* ----------------------------------------------Search Form-------------------------------------*/
- topline input{
display:block; float:left; width:155px; margin:0 5px 0 0; padding:5px; color:#B6B6B6; background-color:#525252; border:1px solid #B6B6B6; font-size:12px; font-family:Arial, Helvetica, sans-serif; }
- topline input#go{
width:68px; height:26px; margin:0; padding:4px 0; text-transform:uppercase; color:#FFFFFF; background-color:#525252; border:1px solid #B6B6B6; cursor:pointer; font-weight:bold; font-family:Arial, Helvetica, sans-serif; }
/* ----------------------------------------------Forms in Content Area-------------------------------------*/
.container #respond{display: block; width:100%;}
.container #respond input{width:170px; padding:2px; border:1px solid #CCCCCC; margin:5px 5px 0 0;}
.container #respond textarea{width:98%; border:1px solid #CCCCCC; padding:2px; overflow:auto;}
.container #respond p{margin:5px 0;}
.container #respond #submit, .container #respond #reset{ margin:0; padding:5px; color:#666666; background-color:#F7F7F7; border:1px solid #CCCCCC; cursor:pointer; } /* Template Name: Ost Magazine File: Tables CSS Author: OS Templates Author URI: http://www.os-templates.com/ Licence: <a href="http://www.os-templates.com/template-terms">Website Template Licence</a>
- /
table{ width:100%; border-collapse:collapse; table-layout:auto; vertical-align:top; margin-bottom:15px; border:1px solid #CCCCCC; }
table thead th{ color:#FFFFFF; background-color:#666666; border:1px solid #CCCCCC; border-collapse:collapse; text-align:center; table-layout:auto; vertical-align:middle; }
table tbody td{ vertical-align:top; border-collapse:collapse; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; }
table thead th, table tbody td{ padding:5px; border-collapse:collapse; }
table tbody tr.light{ color:#666666; background-color:#F7F7F7; }
table tbody tr.dark{ color:#666666; background-color:#E8E8E8; } /* Template Name: Ost Magazine File: Featured Slider CSS Author: OS Templates Author URI: http://www.os-templates.com/ Licence: <a href="http://www.os-templates.com/template-terms">Website Template Licence</a>
- /
- featured_slide {
position:relative; margin:0 auto 0; display:block; width:960px; height:390px; overflow:hidden; font-size:13px; font-family:Verdana, Arial, Helvetica, sans-serif; color:#FFFFFF; background:url("../images/trans_top.png") top left no-repeat #E3E5E5; }
- featured_slide a, #featured_slide ul, #featured_slide img, #featured_slide p{
margin:0; padding:0; border:none; outline:none; list-style:none; text-decoration:none; line-height:normal; }
- featured_slide h1, #featured_slide h2, #featured_slide h3, #featured_slide h4, #featured_slide h5, #featured_slide h6{
margin:0 0 8px 0; padding:0; line-height:normal; font-size:14px; font-weight:bold; font-family:Georgia, "Times New Roman", Times, serif; border-bottom:none; }
/* ----------------------------------------------Content-------------------------------------*/
.featured_box{ position:relative; display:block; width:930px; height:375px; margin:15px 0 0 15px; }
.featured_box img{ width:930px; height:375px; }
.featured_box .floater{ position:absolute; bottom:30px; width:590px; height:60px; margin:0 0 0 30px; padding:3px 5px; overflow:hidden; background:url("../images/fs_txt_trans_bg.png"); }
- featured_slide p.readmore{
position:absolute; bottom:30px; right:30px; margin:0 0 25px 0; }
- featured_slide p.readmore a{
color:#FFFF00; background:url("../images/fs_txt_trans_bg.png"); padding:25px; }
/* ----------------------------------------------Navigation Buttons-------------------------------------*/
/*
Navigation dynamically created using: jquery.cycle.setup.js and jquery.cycle.min.js
HTML Output:
- <a href="javascript:void()">1</a>
- <a href="javascript:void()">2</a>
- <a href="javascript:void()">3</a>
- <a href="javascript:void()">4</a>
- <a href="javascript:void()">5</a>
- /
- fsn{
position:relative; margin:0 auto 0; display:block; width:960px; height:44px; text-align:center; color:#666666; background:url("../images/trans.png") #E3E5E5; z-index:1000; }
- fsn ul{
position:relative; margin:0 auto 0; display:block; width:200px; height:20px; padding:12px 0 0 0; overflow:hidden; list-style:none; }
- fsn ul li, #fsn ul li a{
display:block; float:left; width:20px; height:20px; margin:0 20px 0 0; padding:0; }
- fsn ul li a{
float:none; border:none; margin:0; outline:none; text-indent:-5000px; text-decoration:none; background:url("../images/slide.png") 50% 50% no-repeat; }
- fsn .activeSlide{
background:url("../images/slide.png") 0% 50% no-repeat; }
body{
margin:0;
padding:0;
font-size:13px;
font-family:Georgia, "Times New Roman", Times, serif;
color:#666666;
background-color:#FFFFFF;
}
img{display:block; margin:0; padding:0; border:none;} .justify{text-align:justify;} .bold{font-weight:bold;} .center{text-align:center;} .right{text-align:right;} .nostart{list-style-type:none; margin:0; padding:0;} .clear{clear:both;} br.clear{clear:both; margin-top:-15px;}
a{outline:none; text-decoration:none; color:#660000; background-color:#FFFFFF;}
.fl_left{float:left;} .fl_right{float:right;}
.imgl, .imgr{border:1px solid #C7C5C8; padding:5px;} .imgl{float:left; margin:0 8px 8px 0; clear:left;} .imgr{float:right; margin:0 0 8px 8px; clear:right;}
/* ----------------------------------------------Wrapper-------------------------------------*/
div.wrapper{ display:block; width:100%; text-align:left; }
div.wrapper h1, div.wrapper h2, div.wrapper h3, div.wrapper h4, div.wrapper h5, div.wrapper h6{ margin:0 0 15px 0; padding:0; font-size:20px; font-weight:normal; line-height:normal; }
.col0, .col0 a{color:#999999; background-color:#333333;} .col1{color:#666666; background-color:#000000; border-bottom:1px solid #363636;} .col2{color:#FFFFFF; background-color:#191919; padding:20px 0;} .col2 a{color:#FFFFFF; background-color:#191919;} .col3{margin:1px 0; border-top:1px solid #363636; border-bottom:1px solid #363636;} .col4{color:#FFFFFF; background-color:#000000;} .col4 a{color:#FFFF00; background-color:#000000;} .col5, .col5 a{color:#999999; background-color:#1B1B1B;} .col4, .col5{font-family: Verdana, Geneva, sans-serif;} .col4 h2, .col5 h2{font-family: Georgia, "Times New Roman", Times, serif;}
/* ----------------------------------------------Generalise-------------------------------------*/
- header, #topline, #topbar, #breadcrumb, .container, #hpage_cats, #adblock, #socialise, #footer, #copyright{
position:relative; margin:0 auto 0; display:block; width:960px; }
/* ----------------------------------------------TopBar-------------------------------------*/
- topline{
padding:10px 0; }
- topline ul{
float:left; margin:6px 0 0 0; padding:0; list-style:none; }
- topline li{
display:inline; margin:0 8px 0 0; padding:0 10px 0 0; border-right:1px solid #999999; }
- topline li.last{
margin-right:0; padding-right:0; border:none; }
- topline #search{
display:block; float:right; margin:0; padding:0; overflow:hidden; }
/* ----------------------------------------------Header-------------------------------------*/
- header{
padding:10px 0 20px; z-index:1000; }
- header h1, #header p, #header ul{
margin:0; padding:0; list-style:none; line-height:normal; }
- header #logo{
display:block; float:left; margin-top:7px; overflow:hidden; }
- header #logo h1 a{
font-size:46px; color:#999999; background-color:#000000; }
- header h1 strong{
font-weight:normal; color:#FFFF00; background-color:#000000; }
- header #logo p{
text-align:right; margin-top:5px; font-family:Arial, Helvetica, sans-serif; text-transform:lowercase; }
/* ----------------------------------------------BreadCrumb-------------------------------------*/
- breadcrumb ul{
margin:0; padding:0; list-style:none; }
- breadcrumb ul li{display:inline;}
- breadcrumb ul li.current a{text-decoration:underline; color:#FFFF00; background-color:#191919;}
/* ----------------------------------------------Content-------------------------------------*/
.container{ padding:20px 0; }
.content{ display:block; float:left; width:630px; }
/* ------Comments-----*/
- comments{margin-bottom:40px;}
- comments .commentlist {margin:0; padding:0;}
- comments .commentlist ul{margin:0; padding:0; list-style:none;}
- comments .commentlist li.comment_odd, #comments .commentlist li.comment_even{margin:0 0 10px 0; padding:15px; list-style:none;}
- comments .commentlist li.comment_odd{color:#666666; background-color:#F7F7F7;}
- comments .commentlist li.comment_odd a{color:#660000; background-color:#F7F7F7;}
- comments .commentlist li.comment_even{color:#666666; background-color:#E8E8E8;}
- comments .commentlist li.comment_even a{color:#660000; background-color:#E8E8E8;}
- comments .commentlist .author .name{font-weight:bold;}
- comments .commentlist .submitdate{font-size:smaller;}
- comments .commentlist p{margin:10px 5px 10px 0; padding:0; font-weight: normal;text-transform: none;}
- comments .commentlist li .avatar{float:right; border:1px solid #EEEEEE; margin:0 0 0 10px;}
/* ----------------------------------------------Column-------------------------------------*/
.column{ display:block; float:right; width:270px; }
.column .holder{ display:block; width:260px; margin-bottom:20px; padding-left:10px; }
/* Sponsors Block */
.column .sponsors{ display:block; width:270px; margin-bottom:20px; }
.column .sponsors h2{ margin:0 0 15px 10px; padding:0 0 8px 0; border-bottom:2px solid #E3E3E3; }
.column .sponsors .b_250{ display:block; width:250px; margin:0 0 10px 10px; padding:4px; border:1px solid #C7C5C8; }
.column .sponsors .b_125 ul{ margin:0; padding:0; list-style:none; }
.column .sponsors .b_125 ul{ margin:0; padding:0; list-style:none; }
.column .sponsors .b_125 li{ float:right; margin:0 0 10px 10px; }
/* ----------------------------------------------Homepage Specific-------------------------------------*/
- topstory{
display:block; width:100%; margin-bottom:25px; }
- topstory h2, #latestnews h2{
margin:0 0 15px 0; padding:0 0 8px 0; border-bottom:2px solid #E3E3E3; }
- topstory ul{
margin:0; padding:0; list-style:none; display:inline; }
- topstory li{
display:block; float:left; width:200px; margin:0 15px 0 0; padding:0; }
- topstory li.last{
margin-right:0; }
- topstory img{
margin:0; padding:4px; border:1px solid #C7C5C8; }
- topstory .readmore{
font-weight:bold; text-align:right; }
- latestnews{
display:block; width:630px; margin-bottom:35px; }
- latestnews .latestnews h2{
margin:0; padding:0; font-size:16px; font-weight:bold; border-bottom:none; }
- latestnews ul, #latestnews li{
display:block; width:100%; margin:0; padding:0; list-style:none; }
- latestnews li{
margin:0 0 15px 0; padding:0 0 15px 0; border-bottom:1px dotted #666666; }
- latestnews div.imgholder{
display:block; float:left; width:125px; height:125px; margin:0; padding:4px; border:1px solid #666666; }
- latestnews div.latestnews{
display:block; float:right; width:475px; margin:0; padding:0; }
- latestnews p.readmore{
display:block; margin-top:10px; text-align:right; font-weight:bold; }
/* ----------------------------------------------Footer-------------------------------------*/
- footer{
padding:20px 0; }
- footer ul{
margin:0; padding:0; list-style:none; }
- footer h2{
margin:0 0 15px 0; padding:0 0 8px 0; font-size:18px; color:#CCCCCC; background-color:#000000; border-bottom:1px dotted #CCCCCC; }
- footer .box{
display:block; float:right; width:250px; margin:0 0 0 25px; padding:0; }
- footer .box1{
display:block; float:left; width:400px; line-height:1.6em; }
- footer .box1 .imgl{border:1px solid #CCCCCC; padding:5px; color:#FFFFFF; background-color:#000000;}
- footer .contactdetails li{
margin:0 0 8px 0; }
- footer .flickrbox, #footer .flickrbox .wrap{display:block; width:260px;}
- footer .flickrbox .wrap .fix{clear:both;}
- footer .flickrbox .wrap .flickr_badge_image{display:block; float:left; margin:0 10px 10px 0; width:80px; height:80px;}
- footer .flickrbox .wrap #flickr_badge_image3, #footer .flickrbox .wrap #flickr_badge_image6{margin-right:0;}
/* ----------------------------------------------Copyright-------------------------------------*/
- copyright{
padding:10px 0; }
- copyright p{
margin:0; padding:0;
}
