Team:Colombia
From 2012.igem.org
Sylvita1015 (Talk | contribs) |
Sylvita1015 (Talk | contribs) |
||
Line 421: | Line 421: | ||
margn:0; | margn:0; | ||
padding:0; | padding:0; | ||
+ | } | ||
+ | |||
+ | Inspired By: Sliding Login Panel with jQuery from http://web-kreation.com/index.php/tutorials/nice-clean-sliding-login-panel-built-with-jquery/ | ||
+ | */ | ||
+ | |||
+ | #topbar{ | ||
+ | position:relative; | ||
+ | margin:0 auto 0; | ||
+ | display:block; | ||
+ | width:960px; | ||
+ | font-size:12px; | ||
+ | font-family:Verdana, Arial, Helvetica, sans-serif; | ||
+ | } | ||
+ | |||
+ | #topbar a{ | ||
+ | color:#02ACEE; | ||
+ | background-color:#4A5155; | ||
+ | } | ||
+ | |||
+ | #topbar a:hover{ | ||
+ | color:#FFFFFF; | ||
+ | background-color:#4A5155; | ||
+ | } | ||
+ | |||
+ | #slidepanel{ | ||
+ | display:none; | ||
+ | position:relative; | ||
+ | width:960px; | ||
+ | overflow:hidden; | ||
+ | color:#E3DFD2; | ||
+ | background:url("../images/tab_l.gif") bottom left no-repeat #4A5155; | ||
+ | } | ||
+ | |||
+ | /* ----------------------------------------------Content-------------------------------------*/ | ||
+ | |||
+ | #topbar .topbox{ | ||
+ | display:block; | ||
+ | float:left; | ||
+ | width:270px; | ||
+ | margin:0 30px 0 0; | ||
+ | padding:15px; | ||
+ | } | ||
+ | |||
+ | #topbar .last{ | ||
+ | margin-right:0; | ||
+ | } | ||
+ | |||
+ | #topbar h1, #topbar h2, #topbar h3, #topbar h4, #topbar h5, #topbar h6{ | ||
+ | font-size:18px; | ||
+ | margin:0 0 15px 0; | ||
+ | padding:0 0 8px 0; | ||
+ | border-bottom:1px dotted #E7E6E6; | ||
+ | } | ||
+ | |||
+ | #topbar p{ | ||
+ | margin:0 0 15px 0; | ||
+ | padding:0; | ||
+ | line-height:1.6em; | ||
+ | } | ||
+ | |||
+ | #topbar p.readmore{ | ||
+ | display:block; | ||
+ | margin:0; | ||
+ | text-align:right; | ||
+ | line-height:normal; | ||
+ | font-weight:bold; | ||
+ | } | ||
+ | |||
+ | /* ----------------------------------------------Forms-------------------------------------*/ | ||
+ | |||
+ | #topbar form, #topbar fieldset, #topbar legend{margin:0; padding:0; border:none;} | ||
+ | #topbar legend{display:none;} | ||
+ | #topbar input, #topbar textarea, #topbar select{font-size:12px; font-family:Verdana, Arial, Helvetica, sans-serif;} | ||
+ | |||
+ | #topbar label{ | ||
+ | display:block; | ||
+ | width:270px; | ||
+ | margin:0 0 12px 0; | ||
+ | padding:0; | ||
+ | } | ||
+ | |||
+ | #topbar label input{ | ||
+ | display:block; | ||
+ | width:262px; | ||
+ | margin:5px 0; | ||
+ | padding:3px; | ||
+ | color:#333333; | ||
+ | background-color:#F8F7DF; | ||
+ | border:1px solid #CCCCCC; | ||
+ | } | ||
+ | |||
+ | #topbar .topbox p input{ | ||
+ | padding:3px 10px; | ||
+ | color:#666666; | ||
+ | background-color:#F7F7F7; | ||
+ | border:1px solid #CCCCCC; | ||
+ | cursor:pointer; | ||
+ | } | ||
+ | |||
+ | #topbar label input.checkbox{ | ||
+ | display:inline; | ||
+ | width:auto; | ||
+ | margin:0 5px 0 0; | ||
+ | padding:0; | ||
+ | } | ||
+ | |||
+ | /* ----------------------------------------------Tab Panel-------------------------------------*/ | ||
+ | |||
+ | #loginpanel{ | ||
+ | display:block; | ||
+ | position:relative; | ||
+ | top:0; | ||
+ | } | ||
+ | |||
+ | #loginpanel ul{ | ||
+ | display:block; | ||
+ | float:right; | ||
+ | width:210px; | ||
+ | height:24px; | ||
+ | margin:0; | ||
+ | padding:6px 0 0 0; | ||
+ | text-align:center; | ||
+ | color:#E3DFD2; | ||
+ | background-color:#4A5155; | ||
+ | } | ||
+ | |||
+ | #loginpanel li{ | ||
+ | display:block; | ||
+ | height:24px; | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | } | ||
+ | |||
+ | #loginpanel li.left{ | ||
+ | float:left; | ||
+ | text-align:right; | ||
+ | padding-left:10px; | ||
+ | background:url("../images/tab_l.gif") no-repeat bottom left; | ||
+ | } | ||
+ | |||
+ | #loginpanel li.right{ | ||
+ | float:right; | ||
+ | text-align:left; | ||
+ | padding-right:10px; | ||
+ | background:url("../images/tab_r.gif") no-repeat bottom right; | ||
+ | } | ||
+ | |||
+ | #loginpanel a{ | ||
+ | display:block; | ||
+ | width:100px; | ||
} | } |
Revision as of 08:33, 15 July 2012
/* Template Name: School Education 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>
- /
File:Navi.css @import url(forms.css); @import url(tables.css); @import url(featured_slide.css); @import url(loginslider.css);
body{ margin:0; padding:0; font-size:12px; font-family:verdana, Arial, Helvetica, sans-serif; color:#333333; 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;}
.fl_left{float:left;} .fl_right{float:right;}
.imgl, .imgr{border:1px solid #999999; 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%; margin:0; text-align:left; }
div.wrapper h1, div.wrapper h2, div.wrapper h3, div.wrapper h4, div.wrapper h5, div.wrapper h6{ margin:0; padding:0; font-size:20px; font-weight:normal; line-height:normal; font-family:Georgia, "Times New Roman", Times, serif; }
.col0{color:#FFFFFF; background-color:#2D3134; border-top:5px solid #4A5155;} .col1, .col1 a{color:#C4C5C3; background-color:#2D3134;} .col2{color:#FFFFFF; background-color:#02ACEE; padding:15px 0} .col3{color:#666666; background-color:#FFFFFF;} .col3 a{color:#02ACEE; background-color:#FFFFFF;} .col4{color:#CCCCCC; background-color:#2A2B2F;} .col4 a{color:#02ACEE; background-color:#2A2B2F;} .col5, .col5 a{color:#666666; background-color:#1B1B1B;}
/* ----------------------------------------------Generalise-------------------------------------*/
- header, #topbar, #topnav, #breadcrumb, #homecontent, #container, #footer, #copyright{
position:relative; margin:0 auto 0; display:block; width:960px; }
/* ----------------------------------------------Header-------------------------------------*/
- header{
padding:0 0 20px 0; }
- header #logo{
display:block; float:left; width:300px; margin-top:7px; overflow:hidden; }
- header #logo h1, #header p, #header ul{
margin:0; padding:0; list-style:none; line-height:normal; }
- header #logo h1{
font-size:32px; }
/* ----------------------------------------------BreadCrumb-------------------------------------*/
- breadcrumb a{
color:#FFFFFF; background-color:#02ACEE; }
- breadcrumb ul{
margin:0; padding:0; list-style:none; }
- breadcrumb ul li{display:inline;}
- breadcrumb ul li.current a{text-decoration:underline;}
/* ----------------------------------------------Container-------------------------------------*/
- container{
padding:20px 0; }
- container h1, #container h2, #container h3, #container h4, #container h5, #container h6, #homecontent h2{
font-size:20px; margin:0 0 15px 0; padding-bottom:8px; color:#666666; background-color:#FFFFFF; border-bottom:1px dotted #999999; }
/* ----------------------------------------------Homepage-------------------------------------*/
- homecontent{
padding:30px 0; line-height:1.3em; }
- homecontent img{
padding:4px; border:1px solid #999999; }
- homecontent ul{
margin:0; padding:0; list-style:none; }
- homecontent p.readmore{
font-weight:bold; text-align:right; }
/* Left Column */
- homecontent .fl_left{
display:block; float:left; width:530px; }
- homecontent .fl_left .column2{
display:block; width:530px; }
- homecontent .fl_left li{
display:block; float:left; width:250px; margin:0 30px 30px 0; padding:0; }
- homecontent .fl_left li.last{margin-right:0;}
- homecontent .fl_left p.readmore{
display:block; width:240px; padding:5px; text-align:right; line-height:normal; font-weight:bold; }
/* Right Column */
- homecontent .fl_right{
display:block; float:right; width:385px; }
- homecontent .fl_right li{
display:block; width:385px; margin:0 0 10px 0; padding:0 0 8px 0; border-bottom:1px dotted #999999; }
- homecontent .fl_right img{
float:left; width:80px; height:80px; margin:0 10px 0 0; }
/* ----------------------------------------------Content-------------------------------------*/
- content{
display:block; float:left; width:600px; }
/* ------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:#02ACEE; background-color:#F7F7F7;}
- comments .commentlist li.comment_even{color:#666666; background-color:#E8E8E8;}
- comments .commentlist li.comment_even a{color:#02ACEE; 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:300px; }
- column .holder, #column #featured{
display:block; width:300px; margin-bottom:20px; }
- column .holder h2.title{
display:block; width:100%; height:65px; margin:0; padding:15px 0 0 0; font-size:20px; line-height:normal; border-bottom:1px dotted #999999; }
- column .holder h2.title img{
float:left; margin:-15px 8px 0 0; padding:5px; border:1px solid #999999; }
- column div.imgholder{
display:block; width:290px; margin:0 0 10px 0; padding:4px; border:1px solid #CCCCCC; }
- column .holder p.readmore{
display:block; width:100%; font-weight:bold; text-align:right; line-height:normal; }
/* Featured Block */
- column #featured ul, #column #featured h2, #column #featured p{
margin:0; padding:0; list-style:none; color:#666666; background-color:#F9F9F9; }
- column #featured a{
color:#02ACEE; background-color:#F9F9F9; }
- column #featured li{
display:block; width:250px; margin:0; padding:20px 25px; color:#666666; background-color:#F9F9F9; }
- column #featured li p.imgholder{
display:block; width:240px; height:90px; margin:20px 0 15px 0; padding:4px; border:1px solid #CCCCCC; }
- column #featured li h2{
margin:0; padding:0 0 8px 0; font-weight:normal; font-family:Georgia, "Times New Roman", Times, serif; line-height:normal; border-bottom:1px dotted #999999; }
- column #featured p.readmore{
display:block; width:100%; margin-top:15px; font-weight:bold; text-align:right; line-height:normal; }
- column #latestnews{
display:block; width:100%; margin:0; padding:0; list-style:none; }
- column #latestnews li{
display:block; margin:0 0 20px 0; padding:0 0 15px 0; border-bottom:1px dotted #CCCCCC; }
- column #latestnews li.last{
margin-bottom:0; }
- column #latestnews p{
margin:0 0 5px 0; padding:0; }
- column #latestnews p.readmore{
margin:0; padding:0; }
- column #latestnews .imgl{
margin:0 10px 10px 0; padding:4px; }
/* ----------------------------------------------Footer-------------------------------------*/
- footer{
padding:20px 0; }
- footer h2, #footer p, #footer ul, #footer a{
margin:0; padding:0; font-weight:normal; list-style:none; line-height:normal; }
- footer h2{
font-size:18px; font-weight:normal; margin-bottom:10px; padding-bottom:8px; border-bottom:1px dotted #999999; }
- footer li{
margin-bottom:5px; }
- footer .footbox{
display:block; float:left; width:180px; margin:0 15px 0 0; padding:0; }
- footer .last{
margin:0; }
/* ----------------------------------------------Copyright-------------------------------------*/
- copyright{
padding:15px 0; }
- copyright p{
margn:0; padding:0; }
Inspired By: Sliding Login Panel with jQuery from http://web-kreation.com/index.php/tutorials/nice-clean-sliding-login-panel-built-with-jquery/
- /
- topbar{
position:relative; margin:0 auto 0; display:block; width:960px; font-size:12px; font-family:Verdana, Arial, Helvetica, sans-serif; }
- topbar a{
color:#02ACEE; background-color:#4A5155; }
- topbar a:hover{
color:#FFFFFF; background-color:#4A5155; }
- slidepanel{
display:none; position:relative; width:960px; overflow:hidden; color:#E3DFD2; background:url("../images/tab_l.gif") bottom left no-repeat #4A5155; }
/* ----------------------------------------------Content-------------------------------------*/
- topbar .topbox{
display:block; float:left; width:270px; margin:0 30px 0 0; padding:15px; }
- topbar .last{
margin-right:0; }
- topbar h1, #topbar h2, #topbar h3, #topbar h4, #topbar h5, #topbar h6{
font-size:18px; margin:0 0 15px 0; padding:0 0 8px 0; border-bottom:1px dotted #E7E6E6; }
- topbar p{
margin:0 0 15px 0; padding:0; line-height:1.6em; }
- topbar p.readmore{
display:block; margin:0; text-align:right; line-height:normal; font-weight:bold; }
/* ----------------------------------------------Forms-------------------------------------*/
- topbar form, #topbar fieldset, #topbar legend{margin:0; padding:0; border:none;}
- topbar legend{display:none;}
- topbar input, #topbar textarea, #topbar select{font-size:12px; font-family:Verdana, Arial, Helvetica, sans-serif;}
- topbar label{
display:block; width:270px; margin:0 0 12px 0; padding:0; }
- topbar label input{
display:block; width:262px; margin:5px 0; padding:3px; color:#333333; background-color:#F8F7DF; border:1px solid #CCCCCC; }
- topbar .topbox p input{
padding:3px 10px; color:#666666; background-color:#F7F7F7; border:1px solid #CCCCCC; cursor:pointer; }
- topbar label input.checkbox{
display:inline; width:auto; margin:0 5px 0 0; padding:0; }
/* ----------------------------------------------Tab Panel-------------------------------------*/
- loginpanel{
display:block; position:relative;
top:0;
}
- loginpanel ul{
display:block; float:right; width:210px; height:24px; margin:0; padding:6px 0 0 0; text-align:center; color:#E3DFD2; background-color:#4A5155; }
- loginpanel li{
display:block; height:24px; margin:0; padding:0; }
- loginpanel li.left{
float:left; text-align:right; padding-left:10px; background:url("../images/tab_l.gif") no-repeat bottom left; }
- loginpanel li.right{
float:right; text-align:left; padding-right:10px; background:url("../images/tab_r.gif") no-repeat bottom right; }
- loginpanel a{
display:block; width:100px; }