Template:Regional Europe 2012 Page CSS
From 2012.igem.org
(Difference between revisions)
Line 4: | Line 4: | ||
<!--Design provided by <a href="https://igem.org/Main_Page">iGEM Main page</a>.--!> | <!--Design provided by <a href="https://igem.org/Main_Page">iGEM Main page</a>.--!> | ||
- | <type="text/css"> | + | <style type="text/css"> |
- | + | ||
+ | /* /////////////////////////////////////////////////////////////////////////// | ||
+ | // Reset | ||
+ | /////////////////////////////////////////////////////////////////////////// */ | ||
/* | /* | ||
Line 24: | Line 27: | ||
margin: 0; | margin: 0; | ||
padding: 0; | padding: 0; | ||
- | + | Outline: 0; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
Line 54: | 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 71: | Line 81: | ||
font-size: 1.25em; | font-size: 1.25em; | ||
} | } | ||
+ | |||
+ | |||
h4 { | h4 { | ||
Line 84: | Line 96: | ||
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 92: | Line 110: | ||
p { | p { | ||
margin-bottom: 1.5em; | margin-bottom: 1.5em; | ||
+ | } | ||
+ | |||
+ | p.news { | ||
+ | height: 140px; | ||
} | } | ||
Line 116: | Line 138: | ||
} | } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
/* /////////////////////////////////////////////////////////////////////////// | /* /////////////////////////////////////////////////////////////////////////// | ||
Line 130: | Line 144: | ||
#columns { | #columns { | ||
- | background: #bbbbbb | + | background: #bbbbbb; |
padding: 28px 0; | padding: 28px 0; | ||
} | } | ||
Line 143: | Line 157: | ||
#columns .column1 p { | #columns .column1 p { | ||
- | background: url(https://static.igem.org/mediawiki/2012/b/bc/RegionalEurope_Linkbg3b.png) | + | height: 175px; |
- | background-size: 400px | + | background: url(https://static.igem.org/mediawiki/2012/b/bc/RegionalEurope_Linkbg3b.png); |
+ | background-size: 400px 400px; | ||
+ | background-repeat:no-repeat; | ||
} | } | ||
Line 160: | Line 176: | ||
#columns .column2 p { | #columns .column2 p { | ||
- | background: url(https://static.igem.org/mediawiki/2012/c/c9/RegionalEurope_Linkbg4b.png) | + | height: 175px; |
- | background-size: 400px | + | background: url(https://static.igem.org/mediawiki/2012/c/c9/RegionalEurope_Linkbg4b.png); |
+ | background-size: 400px 400px; | ||
+ | background-repeat:no-repeat; | ||
} | } | ||
Line 177: | Line 195: | ||
#columns .column3 p { | #columns .column3 p { | ||
- | background: url(https://static.igem.org/mediawiki/2012/2/27/RegionalEurope_Linkbg5b.png) | + | height: 175px; |
- | background-size: 400px | + | background: url(https://static.igem.org/mediawiki/2012/2/27/RegionalEurope_Linkbg5b.png); |
+ | background-size: 400px 400px; | ||
+ | background-repeat:no-repeat; | ||
} | } | ||
Line 259: | Line 279: | ||
- | # | + | #box { |
margin: 0 0 0 0; | margin: 0 0 0 0; | ||
overflow: hidden; | overflow: hidden; | ||
- | + | ||
- | + | ||
} | } | ||
- | # | + | #box .box { |
- | + | float: left; | |
- | + | width: 260px; | |
- | + | } | |
- | + | #box .box1 { | |
- | + | padding: 0 37px 0 0; | |
- | } | + | } |
- | #box2 | + | #box .box2 { |
- | + | margin: 0 0 0 5px; | |
+ | padding: 0; | ||
- | } | + | } |
- | #box3 { | + | #box .box3 { |
+ | margin: 0 0 0 0; | ||
+ | overflow: hidden; | ||
+ | width: 260px; | ||
+ | float: left; | ||
+ | padding: 0 0 0 37px; | ||
+ | } | ||
+ | |||
+ | #box .box h2 { | ||
+ | margin: 0 0 0 0; | ||
+ | padding: 0 0 0 20px; | ||
+ | } | ||
+ | |||
+ | #box .box h3 { | ||
+ | padding: 30px 15px 0 15px; | ||
+ | font-weight: normal; | ||
+ | margin: 0; | ||
+ | } | ||
+ | |||
+ | #box .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; | ||
} | } | ||
- | # | + | #box2 h2 { |
- | + | margin: 0 0 0 0; | |
- | + | padding: 0 0 0 20px; | |
- | + | } | |
- | + | ||
- | } | + | |
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | + | /* /////////////////////////////////////////////////////////////////////////// | |
- | + | // Content holder | |
- | + | /////////////////////////////////////////////////////////////////////////// */ | |
- | # | + | #outer { |
position: relative; | position: relative; | ||
- | + | width: 910px; | |
- | + | margin: 32px auto 0 auto; | |
- | + | ||
} | } | ||
+ | |||
#main { | #main { | ||
position: relative; | position: relative; | ||
padding: 0; | padding: 0; | ||
- | width: | + | width: 100%; |
margin: 0 0 0 0; | margin: 0 0 0 0; | ||
} | } | ||
Line 338: | Line 376: | ||
position: relative; | position: relative; | ||
padding: 28px 0 0 0; | padding: 28px 0 0 0; | ||
- | width: | + | width: 100%; |
- | margin: 0 | + | margin: 0 0 0 20px; |
+ | |||
} | } | ||
Line 375: | Line 414: | ||
#main3 h2, #main3 h3, #main3 h4 { | #main3 h2, #main3 h3, #main3 h4 { | ||
color: #0F0F0F; | color: #0F0F0F; | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
} | } | ||
Line 431: | Line 432: | ||
border-radius: 10px; | border-radius: 10px; | ||
background: #fff; | background: #fff; | ||
- | text-align: | + | text-align:left; |
} | } | ||
#sponsorsbox img {padding: 10px; } | #sponsorsbox img {padding: 10px; } | ||
Line 460: | Line 461: | ||
#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 468: | Line 470: | ||
clear: both; | clear: both; | ||
height: 296px; | height: 296px; | ||
- | |||
margin: 0 0 25px; | margin: 0 0 25px; | ||
} | } | ||
Line 491: | Line 492: | ||
} | } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
/* /////////////////////////////////////////////////////////////////////////// | /* /////////////////////////////////////////////////////////////////////////// | ||
Line 509: | Line 498: | ||
/*--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; |
- | + | } | |
- | + | #navbar { width:975px; | |
- | #flashylink a:hover {color: #fff;} | + | margin-left: auto; |
+ | margin-right: auto; | ||
+ | position:relative; | ||
+ | height: 35px; | ||
+ | } | ||
+ | #navbarsocial { float:right; | ||
+ | padding-top: 4px; | ||
+ | } | ||
+ | #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; | ||
+ | -moz-border-radius: 3px; | ||
+ | border-radius: 3px; | ||
+ | margin-right: 30px; | ||
+ | } | ||
+ | #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/ --*/ | ||
Line 526: | Line 537: | ||
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 538: | Line 549: | ||
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 604: | Line 615: | ||
background: #fff; | background: #fff; | ||
} | } | ||
+ | |||
</style> | </style> | ||
</html> | </html> |
Revision as of 19:47, 19 March 2012