Template:Regional Europe 2012 Page CSS

From 2012.igem.org

(Difference between revisions)
 
(91 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
-
<!--Design provided by <a href="http://www.freewebtemplates.com/">Free Website Templates</a>.--!>
 
-
<!--Design provided by <a href="https://igem.org/Main_Page">iGEM Main page</a>.--!>
 
-
<type="text/css">
+
<style type="text/css">
-
<style>
+
 
 +
/*
 +
Downtown by Adonis Ronquillo for Free Website Templates
 +
www.freewebsitetemplat.es / www.doni.us
 +
Images by Image Base http://imagebase.davidniblack.com/
 +
Released under the Creative Commons Attribution 3.0 License.
 +
*/
 +
 
 +
 
 +
/* ///////////////////////////////////////////////////////////////////////////
 +
// Reset
 +
/////////////////////////////////////////////////////////////////////////// */
 +
 
 +
 
 +
/*
 +
YUI 3.4.1 (build 4118)
 +
Copyright 2011 Yahoo! Inc. All rights reserved.
 +
Licensed under the BSD License.
 +
http://yuilibrary.com/license/
 +
*/
 +
html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}input,textarea,select{*font-size:100%}legend{color:#000}
 +
 
* {
* {
margin: 0;
margin: 0;
padding: 0;
padding: 0;
-
}
+
Outline: 0;
-
 
+
-
a {
+
-
font-weight: bold;
+
-
  color: #F37321;
+
-
}
+
-
 
+
-
a:hover {
+
-
font-weight: bold;
+
-
text-decoration: underline;
+
}
}
Line 24: Line 34:
font-size: 8pt;
font-size: 8pt;
line-height: 1.75em;
line-height: 1.75em;
-
background: #dddddd url(https://static.igem.org/mediawiki/2012/7/7c/RegionalEurope_Bg.jpg);
 
color: #2B2B2B;
color: #2B2B2B;
}
}
Line 39: Line 48:
margin: 0;
margin: 0;
padding: 0;
padding: 0;
 +
}
 +
 +
 +
/* ///////////////////////////////////////////////////////////////////////////
 +
// Typography and links and headings
 +
/////////////////////////////////////////////////////////////////////////// */
 +
 +
 +
a {
 +
font-weight: bold;
 +
  color: #F37321;
 +
}
 +
 +
a:hover {
 +
font-weight: bold;
 +
text-decoration: underline;
}
}
Line 56: Line 81:
font-size: 1.25em;
font-size: 1.25em;
}
}
 +
h4 {
h4 {
-
font-size: 1.em;
+
font-size: 1.0em;
 +
}
 +
 
 +
h5 {
 +
font-weight: bold;
 +
color:  #F37321;
}
}
Line 69: Line 100:
margin: 8px 0 20px 0;
margin: 8px 0 20px 0;
}
}
 +
 +
img.center {
 +
    display: block;
 +
    margin-left: auto;
 +
    margin-right: auto
 +
}
label.login {
label.login {
Line 77: Line 114:
p {
p {
margin-bottom: 1.5em;
margin-bottom: 1.5em;
 +
}
 +
 +
p.news {
 +
height: 150px;
}
}
ul {
ul {
margin-bottom: 1.5em;
margin-bottom: 1.5em;
 +
padding: 0 0px 0px 20px;
 +
list-style-image:url('https://static.igem.org/mediawiki/2010/6/6c/Grey_circle_bullet_10px.png');
}
}
Line 101: Line 144:
}
}
-
#banner {
 
-
position: relative;
 
-
padding: 0 0 10px 0;
 
-
height: 315px;
 
-
width: 910px;
 
-
margin: 0;
 
-
background: #000;
 
-
}
 
-
 
-
/* ///////////////////////////////////////////////////////////////////////////
 
-
// Logo
 
-
/////////////////////////////////////////////////////////////////////////// */
 
-
 
-
#logo {
 
-
position: absolute;
 
-
bottom: 0;
 
-
left: 0;
 
-
background: url(https://static.igem.org/mediawiki/2012/0/0e/RegionalEurope_Logobg.png) repeat-x top left;
 
-
line-height: 0px;
 
-
width: 100%;
 
-
}
 
-
 
-
#logo a {
 
-
text-decoration: none;
 
-
color: #FFF;
 
-
}
 
-
 
-
#logo h1 {
 
-
font-size: 3em;
 
-
letter-spacing: -2px;
 
-
text-shadow: 2px 2px 2px #000;
 
-
font-family: Philosopher, sans-serif;
 
-
padding-left: 220px;
 
-
color: #FFF;
 
-
}
 
-
 
-
/* ///////////////////////////////////////////////////////////////////////////
 
-
// Logo2
 
-
/////////////////////////////////////////////////////////////////////////// */
 
-
 
-
#logo2 {
 
-
position: absolute;
 
-
top: 0;
 
-
left: 0;
 
-
background: url(https://static.igem.org/mediawiki/2012/0/0e/RegionalEurope_Logobg.png) repeat-x top left;
 
-
line-height: 0px;
 
-
width: 100%;
 
-
}
 
-
 
-
#logo2 a {
 
-
text-decoration: none;
 
-
color: #FFF;
 
-
}
 
-
 
-
#logo2 h1 {
 
-
font-size: 3em;
 
-
letter-spacing: -2px;
 
-
text-shadow: 2px 2px 2px #000;
 
-
font-family: Philosopher, sans-serif;
 
-
padding-left: 28px;
 
-
color: #FFF;
 
-
}
 
-
 
/* ///////////////////////////////////////////////////////////////////////////  
/* ///////////////////////////////////////////////////////////////////////////  
Line 170: Line 150:
#columns {
#columns {
-
background: #bbbbbb url(images/bg2.jpg) repeat-x top left;
+
background: #bbbbbb;
-
padding: 28px 0;
+
padding: 28px 0 10px 0;
}
}
#columns .column {
#columns .column {
width: 260px;
width: 260px;
 +
                background: #bbbbbb;
float: left;
float: left;
}
}
Line 183: Line 164:
#columns .column1 p {
#columns .column1 p {
-
background: url(https://static.igem.org/mediawiki/2012/b/bc/RegionalEurope_Linkbg3b.png)repeat-x top left;
+
height: 265px;
 +
background: url(https://static.igem.org/mediawiki/2012/b/bc/RegionalEurope_Linkbg3b.png);no-repeat;
background-size: 400px
background-size: 400px
Line 200: Line 182:
#columns .column2 p {
#columns .column2 p {
-
background: url(https://static.igem.org/mediawiki/2012/c/c9/RegionalEurope_Linkbg4b.png)repeat-x top left;
+
height: 265px;
-
background-size: 400px
+
background: url(https://static.igem.org/mediawiki/2012/c/c9/RegionalEurope_Linkbg4b.png);no-repeat;
-
 
+
background-size: 400px 400px;
}
}
Line 217: Line 199:
#columns .column3 p {
#columns .column3 p {
-
background: url(https://static.igem.org/mediawiki/2012/2/27/RegionalEurope_Linkbg5b.png) repeat-x  top left;
+
height: 265px;
-
background-size: 400px
+
background: url(https://static.igem.org/mediawiki/2012/2/27/RegionalEurope_Linkbg5b.png);no-repeat;
 +
background-size: 400px 400px;
}
}
Line 297: Line 280:
}
}
 +
 +
#boxes {
 +
padding: 0 0 0 0;
-
 
-
#box1 {
 
-
margin: 0 0 0 0;
 
-
overflow: hidden;
 
-
width: 550px;
 
-
float: left;
 
}
}
-
#box2 {
+
#boxes .box {
-
margin: 0 0 0 0;
+
width: 260px;
-
overflow: hidden;
+
float: left;
-
width: 260px;
+
-
float: left;
+
}
-
padding: 0 28px 0 37px;
+
        #boxes .box1 {
 +
padding: 0 37px 0 0;
-
}
+
}
-
#box2 h2 {
+
#boxes .box2 {
-
padding: 0 28px 0 20px;
+
margin: 0 0 0 5px;
 +
padding: 0;
-
}
+
}
-
#box3 {
+
#boxes .box3 {
 +
margin: 0 0 0 0;
 +
overflow: hidden;
 +
width: 260px;
 +
float: left;
 +
padding: 0 0 0 37px;
 +
}
 +
 +
#boxes .box h2 {
 +
margin: 0 0 0 0;
 +
padding: 0 0 0 20px;
 +
}
 +
 
 +
#boxes .box h3 {
 +
padding: 30px 15px 0 15px;
 +
font-weight: normal;
 +
margin: 0;
 +
}
 +
 
 +
#boxes .box p {
 +
padding: 15px 15px 15px 15px;
 +
font-weight: normal;
 +
margin: 0;
 +
}
 +
 +
 
 +
#box2 {
margin: 0 0 0 0;
margin: 0 0 0 0;
overflow: hidden;
overflow: hidden;
width: 850px;
width: 850px;
float: left;
float: left;
 +
padding: 0 0 0 5px;
}
}
-
#content {
+
#box2 h2 {
-
width: 910px;
+
margin: 0 0 0 0;
-
padding: 32px;
+
padding: 0 0 0 20px;
-
background: #FFF;
+
-
color: #2B2B2B;
+
-
}
+
-
#content a {
+
}
-
color: #F37321;
+
-
text-decoration: none
+
-
}
+
-
#content a:hover {
 
-
color: #F37321;
 
-
}
 
-
#content h2, #content h3, #content h4 {
+
/* ///////////////////////////////////////////////////////////////////////////
-
color: #0F0F0F;
+
// Buttons
 +
/////////////////////////////////////////////////////////////////////////// */
 +
 
 +
table .pbrROL{border-collapse:collapse;border-spacing:0;}
 +
/*Text Link*/
 +
.ROLtxt a
 +
{
 +
font:bold 16px Arial;
 +
text-align:center;
 +
margin-bottom:7px;
 +
text-decoration:underline;
 +
color:#FFF;
}
}
 +
.ROLtxt a:hover
 +
{
 +
text-decoration:underline;
 +
color:#3300FF;
 +
}
 +
.tt
 +
{
 +
    margin-top:18px;
 +
}
 +
.ROLtxt {text-align:center;}
 +
/*Generic PBR link*/
 +
.pbrROL-basic .tt{font:10px Arial, Helvetica, sans-serif; background:none; color:#000; text-align:center;}
 +
.pbrROL-basic .tt a{ background:none; color:#3300FF; text-decoration:underline; }
 +
 +
/* Button 4 */
 +
.pbrROL-04{display:block;}
 +
.pbrROL-04 .ROLbtn {display:block; clear:both;}
 +
.pbrROL-04 .ROLbtn ul{margin:0; padding:0;}
 +
.pbrROL-04 .ROLbtn ul li{list-style:none; margin: 0; padding:0; clear:both; text-align:center;}
 +
.pbrROL-04 .ROLbtn li a{
 +
background:url(../images/ui/button/btn-g04-right.jpg) no-repeat top right;
 +
color:#FFFFFF; display: inline-block;  text-decoration:none; margin-left:auto; margin-right:auto;
 +
color:#FFFFFF; font:bold 16px Arial, Helvetica, sans-serif; white-space:nowrap;} 
 +
.pbrROL-04 .ROLbtn li span{
 +
background:url(../images/ui/button/btn-g04-left.jpg) no-repeat top left;
 +
display: block; line-height:46px; padding:0 31px 0 30px; }
 +
.pbrROL-04 .ROLbtn li a:hover{background:url(../images/ui/button/btn-g04-right.jpg) no-repeat bottom right;
 +
display: inline-block;  text-decoration:none; margin-left:auto; margin-right:auto;
 +
color:#FFFFFF; font:bold 16px Arial, Helvetica, sans-serif; } 
 +
.pbrROL-04 .ROLbtn li a:hover span{background:url(../images/ui/button/btn-g04-left.jpg) no-repeat bottom left;
 +
display: block; line-height:46px; padding:0 31px 0 30px; }
 +
.pbrROL-04 .tt{display:block; clear:both; font:10px Arial, Helvetica, sans-serif; background:none; color:#000; text-align:center;}
 +
.pbrROL-04 .tt a{ background:none; color:#3300FF; text-decoration:underline; }
 +
 +
/* Button 5 */
 +
.pbrROL-05{display:block;}
 +
.pbrROL-05 .ROLbtn {display:block; clear:both;}
 +
.pbrROL-05 .ROLbtn ul{margin:0; padding:0;}
 +
.pbrROL-05 .ROLbtn ul li{list-style:none; margin: 0; padding:0; clear:both; text-align:center;}
 +
.pbrROL-05 .ROLbtn li a{
 +
background:url(../images/ui/button/btn-g05-right.jpg) no-repeat top right;
 +
display: inline-block;  text-decoration:none; margin-left:auto; margin-right:auto;
 +
color:#000; font:bold 16px Arial, Helvetica, sans-serif; white-space:nowrap;} 
 +
.pbrROL-05 .ROLbtn li span{
 +
background:url(../images/ui/button/btn-g05-left.jpg) no-repeat top left;
 +
display: block; line-height:44px; padding:0 31px 0 30px; }
 +
.pbrROL-05 .ROLbtn li a:hover{background:url(../images/ui/button/btn-g05-right.jpg) no-repeat bottom right;
 +
display: inline-block;  text-decoration:none; margin-left:auto; margin-right:auto;
 +
color:#000; font:bold 16px Arial, Helvetica, sans-serif; } 
 +
.pbrROL-05 .ROLbtn li a:hover span{background:url(../images/ui/button/btn-g05-left.jpg) no-repeat bottom left;
 +
display: block; line-height:44px; padding:0 31px 0 30px; }
 +
 +
.pbrROL-05 .tt{display:block; clear:both; font:10px Arial, Helvetica, sans-serif; background:none; color:#000; text-align:center;}
 +
.pbrROL-05 .tt a{ background:none; color:#3300FF; text-decoration:underline; }
-
#header {
+
 
 +
/* ///////////////////////////////////////////////////////////////////////////
 +
// Content holder
 +
/////////////////////////////////////////////////////////////////////////// */
 +
 
 +
#outer {
position: relative;
position: relative;
-
padding: 32px;
+
width: 910px;
-
height: 130px;
+
margin: 32px auto 0 auto;
-
width: 800px;
+
}
}
 +
#main {
#main {
position: relative;
position: relative;
padding: 0;
padding: 0;
-
width: 910px;
+
width: 100%;
margin: 0 0 0 0;
margin: 0 0 0 0;
}
}
Line 378: Line 448:
position: relative;
position: relative;
padding: 28px 0 0 0;
padding: 28px 0 0 0;
-
width: 910px;
+
width: 100%;
-
margin: 0 28px 0 37px;
+
margin: 20px 0 0 28px;
}
}
Line 415: Line 485:
#main3 h2, #main3 h3, #main3 h4 {
#main3 h2, #main3 h3, #main3 h4 {
color: #0F0F0F;
color: #0F0F0F;
-
}
 
-
 
-
#outer {
 
-
position: relative;
 
-
width: 910px;
 
-
margin: 32px auto 0 auto;
 
-
}
 
-
 
-
#search input.button {
 
-
margin-left: 1em;
 
-
border: 0;
 
-
color: #FFF;
 
-
background: #6CC3E0;
 
-
padding: 4px;
 
-
font-family: Philosopher, sans-serif;
 
-
}
 
-
 
-
#search input.text {
 
-
border: dashed 1px #595453;
 
-
padding: 8px;
 
-
}
 
-
 
-
.blogpost h2 {
 
-
margin: 0 0 10px 0;
 
-
}
 
-
 
-
 
-
.comments a {
 
-
background: url(images/linkbg.jpg) repeat-x top left;
 
-
padding: 15px;
 
-
text-decoration: none;
 
-
}
 
-
 
-
.readmore a {
 
-
background: url(images/linkbg2.jpg) repeat-x top left;
 
-
padding: 15px;
 
-
text-decoration: none;
 
-
color: #FFF!important;
 
}
}
Line 471: Line 503:
border-radius: 10px;
border-radius: 10px;
background: #fff;
background: #fff;
-
text-align:center;
+
text-align:left;
}
}
#sponsorsbox img {padding: 10px; }
#sponsorsbox img {padding: 10px; }
Line 500: Line 532:
#happeningnow .widget-url {font-size: 11pt; font-weight: bold; padding: 2px; text-align: center;}
#happeningnow .widget-url {font-size: 11pt; font-weight: bold; padding: 2px; text-align: center;}
 +
/* ///////////////////////////////////////////////////////////////////////////  
/* ///////////////////////////////////////////////////////////////////////////  
Line 508: Line 541:
clear: both;  
clear: both;  
height: 296px;  
height: 296px;  
-
background: url(../images/shadow.png) no-repeat left bottom;
 
margin: 0 0 25px;
margin: 0 0 25px;
}
}
Line 531: Line 563:
}
}
-
 
-
#talen {
 
-
width: 100%;
 
-
height: 30px;
 
-
margin-right: 50px;
 
-
 
-
}
 
-
 
-
 
-
#zoom {
 
-
z-index: 11;
 
-
}
 
/* ///////////////////////////////////////////////////////////////////////////  
/* ///////////////////////////////////////////////////////////////////////////  
Line 549: Line 569:
/*--Menu Bar CSS--*/
/*--Menu Bar CSS--*/
-
#navbarcontainer { width: 100%; height: 35px; background: #666; margin-top:0px;}
+
#navbarcontainer { width: 100%;  
-
#navbar {width:975px; margin-left: auto; margin-right: auto; position:relative; height: 35px;}
+
height: 35px;  
-
#navbarsocial {float:right; padding-top: 4px;}
+
background: #666;  
-
#flashylink {display: block; float: left; border: 0px solid #fff; color: #F37321; text-shadow: #000 1px 1px 1px; padding:3px; line-height: 100%; text-align: center; font-weight: bold; font-size: .8em; -webkit-border-radius: 3px;
+
margin-top:0px;
-
-moz-border-radius: 3px;
+
font-size: 9.3pt;
-
border-radius: 3px; margin-right: 30px;}
+
}
-
#flashylink a:hover {color: #fff;}
+
#navbar { width:975px;  
 +
margin-left: auto;  
 +
margin-right: auto;  
 +
position:relative;  
 +
height: 35px;
 +
}
 +
#navbarsocial { float:right;  
 +
padding-top: 4px;
 +
}
 +
#flashylink {
 +
float: left;  
 +
border: 0px solid #fff;  
 +
color: #F37321;  
 +
text-shadow: #000 1px 1px 1px;  
 +
padding:0px; line-height: 100%;  
 +
text-align: center;  
 +
font-weight: bold; font-size: .8em;
 +
-webkit-border-radius: 3px;
 +
-moz-border-radius: 3px;
 +
border-radius: 3px;  
 +
margin-left: 10px;
 +
}
 +
#flashylink a:hover { color: #fff;
 +
}
/*--Menu Begins Here http://www.sohtanaka.com/web-design/horizontal-sub-nav-with-css-jquery/ --*/
/*--Menu Begins Here http://www.sohtanaka.com/web-design/horizontal-sub-nav-with-css-jquery/ --*/
ul#topnav {
ul#topnav {
-
margin: 0; padding: 0;
+
margin: 0; padding: 0 0 0 37px;
float: left;
float: left;
/*-- width: 960px;--*/
/*-- width: 960px;--*/
Line 566: Line 609:
font-size: 1em;
font-size: 1em;
background: #666/*--url(https://static.igem.org/mediawiki/igem.org/c/c8/Navbar-3.gif) repeat-x--*/;
background: #666/*--url(https://static.igem.org/mediawiki/igem.org/c/c8/Navbar-3.gif) repeat-x--*/;
-
z-index: 6;
+
z-index: 6;
}
}
ul#topnav li {
ul#topnav li {
Line 578: Line 621:
display: block;
display: block;
color: #fff;
color: #fff;
-
font-weight: bold;
+
font-weight: bold;
-
letter-spacing: 1px;
+
letter-spacing: 1px;
-
text-shadow: #333 1px 1px 1px;
+
text-shadow: #333 1px 1px 1px;
text-decoration: none;
text-decoration: none;
}
}
Line 593: Line 636:
position: absolute;
position: absolute;
z-index:10;
z-index:10;
-
left: 0; top:35px;
+
left: 37px; top:35px;
display: none; /*--Hide by default--*/
display: none; /*--Hide by default--*/
-
width: 720px;
+
width: 758px;
background: #F37321;
background: #F37321;
color: #fff;
color: #fff;
Line 624: Line 667:
}
}
.textboxes {
.textboxes {
-
display: block;
 
position: relative;
position: relative;
border: 1px solid #f0f0f0;
border: 1px solid #f0f0f0;
Line 644: Line 686:
background: #fff;
background: #fff;
}  
}  
 +
 +
 +
/* ///////////////////////////////////////////////////////////////////////////
 +
// Timeline
 +
/////////////////////////////////////////////////////////////////////////// */
 +
 +
/* Design provided by <a href="https://2010.igem.org/Team:TU_Delft#page=Home/">iGEM TU Delft 2010</a> */
 +
 +
table {
 +
margin: 0;
 +
padding: 0;
 +
border: none;
 +
}
 +
table td {
 +
padding: 0px;
 +
}
 +
table .head {
 +
background-color: none;
 +
font-weight: normal;
 +
color: #fff;
 +
}
 +
table .odd {
 +
background-color: transparent;
 +
}
 +
#timeline_container {
 +
overflow-x: scroll;
 +
width: 600px;
 +
/* border: 1px solid #216085; */
 +
height: 250px;
 +
overflow-y:hidden;
 +
scrollbar-face-color:#266c96;
 +
scrollbar-shadow-color:#216085;
 +
scrollbar-highlight-color:#216085;
 +
scrollbar-3dlight-color:#216085;
 +
scrollbar-darkshadow-color:#216085;
 +
scrollbar-track-color:#d0f1fa;
 +
scrollbar-arrow-color:#fff;
 +
}
 +
 +
#timeline_content {
 +
width: 1650px;
 +
height: 380px;
 +
}
 +
 +
#content-block {
 +
width: 210px;
 +
padding: 10px;
 +
float: left;
 +
}
 +
.fastlink {
 +
font-size: 9px;
 +
font-weight: bold;
 +
text-decoration:none;
 +
}
 +
.fastlink:hover {
 +
text-decoration: underline;
 +
}
 +
.month {
 +
margin: 10px;
 +
background-color: #108812;
 +
text-align: center;
 +
font-weight:bold;
 +
display:block;
 +
width: 100%;
 +
line-height: 30px;
 +
}
 +
 +
.month-summary {
 +
font-size: 11px;
 +
margin-left: 10px;
 +
margin-right: 10px;
 +
display: block;
 +
margin-bottom: -10px;
 +
line-height: 12px;
 +
}
 +
 +
.month-summary img {
 +
margin-bottom: 10px;
 +
}
 +
 +
.timeline-item {
 +
display:block;
 +
padding: 3px;
 +
border: 1px solid #eee;
 +
font-size: 10px;
 +
float: left;
 +
margin: 3px 10px;
 +
line-height: 19px;
 +
width: 210px;
 +
overflow: hidden;
 +
}
 +
 +
.timeline-item .date {
 +
display: block;
 +
font-weight: bold;
 +
font-size: 12px;
 +
float: left;
 +
line-height: 15px;
 +
color: #fff;
 +
background-color: #c4e438;
 +
padding: 2px;
 +
width: 20px;
 +
text-align: center;
 +
margin-right: 3px;
 +
}
 +
#content-block  a {
 +
color: #000;
 +
}
 +
 +
#content-block  a:hover  {
 +
text-decoration: underline;
 +
color: #000;
 +
}
 +
</style>
</style>
</html>
</html>

Latest revision as of 18:04, 7 October 2012

Retrieved from "http://2012.igem.org/Template:Regional_Europe_2012_Page_CSS"