Team:HIT-Harbin/css/style.css

From 2013.igem.org

(Difference between revisions)
 
(12 intermediate revisions not shown)
Line 1: Line 1:
-
/*
+
/* ------------------------------------------------------------------------------------ */
-
* Site Author: Vasterad
+
/* -------------------------------- BASIC STYLE RESET --------------------------------- */
-
* Skeleton V1.1
+
/* ------------------------------------------------------------------------------------ */
-
* Copyright 2011, Dave Gamache
+
-
* www.getskeleton.com
+
-
* Free to use under the MIT license.
+
-
* http://www.opensource.org/licenses/mit-license.php
+
-
* 8/17/2011
+
-
*/
+
-
/* ======================================================= */
+
html, body, div, span, object, iframe,
-
/* Import Section
+
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
-
/* ======================================================= */
+
a, abbr, acronym, address, code,
 +
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
 +
fieldset, form, label, legend,
 +
table, caption, tbody, tfoot, thead, tr, th, td {
 +
    margin: 0;
 +
    padding: 0;
 +
    border: 0;
 +
    font-weight: inherit;
 +
    font-style: inherit;
 +
    font-size: 100%;
 +
    font-family: inherit;
 +
    vertical-align: baseline;
 +
}
-
/*================================================= */
+
html { overflow-x: hidden; }
-
/* Header
+
-
================================================== */
+
-
#header {background: #363636; padding:0; margin:0;}
+
-
#logo {display: block; height: 70px;}
+
-
.clearfix {content: "."; display: block; height: 0px; clear: both; visibility: hidden;}
+
/* Tables still need 'cellspacing="0"' in the markup. */
-
.spacer {margin-top: 20px;}
+
table { border-collapse: separate; border-spacing: 0; }
 +
caption, th, td { text-align: left; font-weight: normal; }
 +
table, td, th { vertical-align: middle; }
-
/*================================================= */
+
/* Remove possible quote marks (") from <q>, <blockquote>. */
-
/* Navigation
+
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
-
================================================== */
+
blockquote, q { quotes: "" ""; }
-
#navigation select {display: none; width: 100%; padding: 7px; height: 35px}
+
-
#navigation select option {padding: 5px;}
+
-
#navigation {float: right;}
+
-
#navigation ul, #navigation li  {list-style:none; padding:0; margin:0; display:inline; }
+
-
#navigation ul li{ float:left; position:relative; }
+
-
#navigation ul li a {  
+
/* Remove annoying border on linked images. */
-
font-family: "Open Sans", Arial, sans-serif;
+
a img { border: none; }
-
display: inline-block;
+
a { outline: none; }
-
color: #aaa;
+
img { vertical-align: top; }
-
padding: 23px 18px 26px 18px;
+
.clearer { height: 0px; clear: both; }
-
text-transform: uppercase;
+
-
text-decoration: none;
+
-
font-weight: bold;
+
-
font-size: 12px;
+
-
border-top: 3px solid transparent;
+
-
-webkit-transition: all 0.1s ease;
+
-
-moz-transition: all 0.1s ease;
+
-
-ms-transition: all 0.1s ease;
+
-
-o-transition: all 0.1s ease;
+
-
transition: all 0.1s ease;
+
-
margin: 0 -4px 0 0;
+
-
}
+
-
#navigation ul li a:hover{
+
/* ------------------------------------------------------------------------------------ */
-
background: #3f3f3f;
+
/* -------------------------------- MAIN STYLES DEFINITION ---------------------------- */
-
border-top: 3px solid #81b600;
+
/* ------------------------------------------------------------------------------------ */
-
color: #fff;
+
-
}
+
-
#navigation ul ul {  
+
body {
-
opacity: 0;  
+
    margin: 0;
-
  filter: alpha(opacity=0);  
+
    padding: 0;
-
position: absolute;
+
    line-height: 20px;
-
top:-99999px;
+
    width: 100%;
-
left: 0;
+
    font-family: Arial, Verdana;
-
z-index: 999999;
+
    font-size: 62.5%;
-
background: #3f3f3f;
+
    cursor: default;
-
width: 200px;
+
    color: #000000;
-
-webkit-transition: opacity 0.4s ease-out;
+
    background: #fff url("https://static.igem.org/mediawiki/2013/d/dc/Bkg-pattern.jpg") repeat left top;
-
-moz-transition: opacity 0.4s ease-out;
+
-
-o-transition: opacity 0.4s ease-out;
+
-
-ms-transition: opacity 0.4s ease-out;
+
-
transition: opacity 0.4s ease-out;
+
}
}
-
#navigation ul ul li a:hover {
+
/* ----------------------------------------------------------
-
background: #81b600;
+
* HEADLINES
-
color: #fff !important;
+
* ----------------------------------------------------------*/
-
border-bottom: 1px solid transparent;
+
-
border-top: 1px solid transparent;
+
-
}
+
-
#navigation ul ul li a {
+
h1, h2, h3, h4, h5, h6 {
-
padding: 8px 15px;
+
    margin: 0;
-
display: block;
+
    padding: 2px 0 0 0;
-
width: 170px;
+
    font-family: Arial;
-
font-family: Tahoma, Arial, sans-serif;
+
    font-weight: normal;
-
text-transform: none;
+
    color: #37342d;
-
text-decoration: none;
+
    margin-bottom: 30px;
-
font-weight: normal;
+
    text-transform: uppercase;
-
font-size: 12px;
+
    word-spacing: 2px;
-
border-bottom: 1px solid #4a4a4a;
+
-
border-top: 1px solid transparent;
+
}
}
-
#navigation ul ul ul {  
+
h1, h1 a {
-
position:absolute;
+
    font-size: 28px;
-
top:-99999px;
+
    line-height: 28px;
-
left:100%;
+
-
opacity: 0;
+
-
-webkit-transition: opacity 0.4s ease-out;
+
-
-moz-transition: opacity 0.4s ease-out;
+
-
-o-transition: opacity 0.4s ease-out;
+
-
-ms-transition: opacity 0.4s ease-out;
+
-
transition: opacity 0.4s ease-out;
+
-
margin-left: 4px;
+
}
}
-
 
+
h2, h2 a {
-
#navigation ul li:hover>ul{ opacity: 1; position:absolute; top:99%; left:0;}
+
    font-size: 24px;
-
#navigation ul ul li:hover>ul{ position:absolute; top:0; left:100%; opacity: 1; z-index:497; background: #3f3f3f; border: 0; }
+
    line-height: 27px;
-
#navigation ul li:hover > a {background: #3f3f3f; border-top: 3px solid #81b600; color: #fff;}
+
-
#navigation ul ul li:hover > a {border-top: 1px solid transparent; color: #aaa;}
+
-
#current {background: #3f3f3f !important;border-top: 3px solid #81b600 !important;color: #fff !important;}
+
-
 
+
-
/*================================================= */
+
-
/* Tagline
+
-
================================================== */
+
-
#tagline {
+
-
margin: 30px 0;
+
-
font-size: 22px;
+
-
font-family: "Open Sans", Arial, sans-serif;
+
-
color: #505050;
+
-
letter-spacing: -0.6px;
+
-
text-align: center;
+
-
line-height: 30px;
+
}
}
-
 
+
h3, h3 a {
-
#tagline span, #tagline a {
+
    font-size: 22px;
-
background: #81b600;
+
    line-height: 22px;
-
color: #fff;
+
-
padding: 0 7px;
+
-
-webkit-border-radius: 3px;
+
-
-moz-border-radius: 3px;
+
-
border-radius: 3px;
+
-
text-decoration: none;
+
-
-webkit-transition: all 0.2s ease;
+
-
-moz-transition: all 0.2s ease;
+
-
-ms-transition: all 0.2s ease;
+
-
-o-transition: all 0.2s ease;
+
-
transition: all 0.2s ease;
+
}
}
-
 
+
h4, h4 a {
-
#tagline span:hover, #tagline a:hover {background: #6b6b6b;}
+
    font-size: 20px;
-
#tagline p {margin: 3px;}
+
    line-height: 20px;
-
.tagline_page{border-bottom: 1px solid #e1e1e1; padding: 0 0 30px 0}
+
}
-
 
+
h5, h5 a {
-
/*================================================= */
+
    font-size: 18px;
-
/* Subtitle
+
    line-height: 18px;
-
================================================== */
+
}
-
#subtitle {background: #f7f7f7; padding:0; margin:0; border-bottom: 1px solid #d7d7d7;}
+
h6, h6 a {
-
#subtitle h3 {line-height: 70px; letter-spacing: -0.5px; font-size: 24px;}
+
    font-size: 16px;
-
#subtitle h3 span {color:#999999; font-size: 24px;}
+
    line-height: 16px;
-
 
+
-
.page_headline {
+
-
font-family: "Open Sans", Arial, Tahoma;
+
-
font-size: 16px;
+
-
font-weight: bold;
+
-
letter-spacing: -0.5px;
+
-
display: block;
+
-
border-bottom: 1px solid #e1e1e1;
+
-
padding: 0 0 8px 0;
+
-
margin: 20px 0;
+
}
}
-
 
+
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
-
/*================================================= */
+
    display: block;
-
/* Single Project
+
    padding: 0;
-
================================================== */
+
    margin: 0;
-
.project_overview p {
+
    text-decoration: none !important;
-
margin: 15px 0;
+
    color: #37342d;
 +
    overflow: visible;
}
}
-
.project_overview h3 {
+
h1.hashed, h2.hashed, h3.hashed, h4.hashed, h5.hashed, h6.hashed { background: transparent url("https://static.igem.org/mediawiki/2013/e/e6/Separator-bkg.png") repeat-x left center scroll ; clear: both; }
-
font-family: "Open Sans", Arial, Tahoma;
+
h1.hashed span, h2.hashed span, h3.hashed span, h4.hashed span, h5.hashed span, h6.hashed span {
-
font-size: 14px;
+
    background: #fff url("https://static.igem.org/mediawiki/2013/d/dc/Bkg-pattern.jpg") repeat left top scroll;
-
font-weight: bold;
+
    padding: 0 10px 0 0;
-
letter-spacing: -0.5px;
+
-
display: block;
+
-
border-bottom: 1px solid #e1e1e1;
+
-
padding: 0 0 3px 0;
+
-
margin: 0 0 15px 0;
+
}
}
 +
.nocufon { padding: 0; }
 +
.subtitle { color: #37342d; font-weight: bold; margin-bottom: 20px; }
 +
h4.subtitle, h4.subtitle a { font-size: 16px; line-height: 16px; }
 +
h5.subtitle, h5.subtitle a { font-size: 14px; line-height: 14px; }
 +
h6.subtitle, h6.subtitle a { font-size: 12px; line-height: 12px; }
-
.project_navi {margin-top: -55px !important;}
+
span.colored { color: #ca9351; }
 +
h1 span.colored, h2 span.colored, h3 span.colored, h4 span.colored, h5 span.colored, h6 span.colored { color: #c0b294; }
-
/*================================================= */
+
p {
-
/* Blog Post Container
+
    color: #37342d;
-
================================================== */
+
    font: 13px/21px Arial;
-
#blog_post_container {margin-top: 15px;}
+
    padding-bottom: 26px;
-
 
+
-
.post {border-bottom: 1px solid #e1e1e1; margin-bottom: 15px;}
+
-
 
+
-
.post h2 a {
+
-
font-size: 22px;
+
-
font-weight: normal;
+
-
color: #464646;
+
-
font-family: "Open Sans", Arial, Tahoma, sans-serif;
+
-
text-decoration: none;
+
-
display: inline-block;
+
-
line-height: 28px;
+
-
letter-spacing: -0.5px;
+
}
}
-
.post h2 a:hover {color: #777;}
+
a { color: #ca9351; text-decoration: none; }
 +
a:hover { text-decoration: underline; }
-
.post-content p {
+
img {
-
line-height: 20px;
+
    background: transparent;
-
margin: 15px 0 0 0;
+
    padding: 0;
 +
    margin: 0;
 +
/*    margin-bottom: 20px;*/
 +
    display: inline-block;
}
}
-
 
+
img.icon {
-
a.post-entry {
+
    padding: 6px 18px 0 18px;
-
font-size: 12px;
+
    margin: 0 0 10px 0;
-
color: #6f9c00;
+
-
font-family: Tahoma, Arial, sans-serif;
+
-
margin: 15px 0 20px 0;
+
-
display: inline-block;
+
-
padding: 0 12px 0 0;
+
-
background: url(../images/bullet_post_entry.png) no-repeat right;
+
-
background-position: 100% 60%;
+
}
}
-
 
+
img.clean {
-
a.post-entry:hover {
+
    background: none;
-
color: #888;  
+
    padding: 0;
-
background: url(../images/bullet_post_entry_hover.png) no-repeat right;
+
    border: 0;
-
background-position: 100% 60%;
+
}
}
-
 
+
a.image-holder {
-
.post-meta {color: #777; font-size: 12px; margin: 1px 0 15px 0;}
+
    position: relative;
-
.post-meta a {color: #6f9c00;text-decoration: none;}
+
    display: block;
-
.post-meta a:hover {color: #999;}
+
    margin: 0 0 30px 0;
-
 
+
    padding: 0;
-
 
+
    overflow: hidden;
-
.icon-calendar {
+
-
background: url(../images/calendar_ico.png) no-repeat;
+
-
display: inline-block;
+
-
height: 13px;
+
-
width: 12px;
+
-
margin: 0 0 -1px 0;
+
-
padding: 0 5px 0 0;
+
}
}
-
 
+
a.image-holder img { margin: 0; position: relative; z-index: 10; }
-
.icon-author {
+
a.image-holder .image-zoom {
-
background: url(../images/author_ico.png) no-repeat;
+
    display: block;
-
display: inline-block;
+
    display: none;
-
height: 16px;
+
    width: 100%;
-
width: 13px;
+
    height: 100%;
-
margin: 0 0 -5px 8px;
+
    background: transparent url("https://static.igem.org/mediawiki/2013/a/aa/Zoom-icon.png") no-repeat center;
-
padding: 0 8px 0 0;
+
    position: absolute;
 +
    margin: 0;
 +
    padding: 0;
 +
    top: 0px;
 +
    left: 0px;
 +
    z-index: 20;
 +
    overflow: hidden;
}
}
-
.icon-comment {
+
body .alignleft {
-
background: url(../images/comment_ico.png) no-repeat;
+
    float: left;
-
display: inline-block;
+
    margin-right: 24px;
-
height: 15px;
+
    margin-bottom: 20px;
-
width: 11px;
+
-
margin: 0 0 -5px 8px;
+
-
padding: 0 8px 0 0;
+
}
}
-
 
+
body .alignright {
-
/* Blog Blockquote */
+
    float: right;
-
.post-quote {
+
    margin-left: 24px;
-
background: #363636;
+
    margin-bottom: 20px;
-
padding: 20px;
+
}
}
-
 
+
body .aligncenter {
-
.post-quote blockquote {
+
    margin: 0 auto;
-
color: #ececec;
+
    margin-bottom: 20px;
-
font-family: "Droid Serif", Arial, sans-serif;
+
    display: block;
-
font-size: 14px;
+
-
font-style: italic;
+
-
line-height: 22px;
+
-
border-left: 1px solid #545455;
+
-
padding: 0 0 0 18px;
+
-
margin-left: 40px;
+
-
 
+
}
}
-
.post-quote span, .post-quote a {color: #7db000; text-decoration: none;}
 
-
.post-quote .icon {
+
body .alignleft.margin-bottom, body .alignright.margin-bottom, body .aligncenter.margin-bottom { margin-bottom: 30px; }
-
background: url(../images/quote_ico.png) no-repeat;
+
-
height: 15px; width: 25px;
+
-
display: block;
+
-
float: left;
+
-
margin: 4px 0 0 0;
+
-
}
+
-
/** Comments **/
+
.red { color: #e35337; }
-
.comments-sec{float:left; width:100%; line-height: 20px;}
+
-
.comments-sec h3 {font-size: 16px; font-weight: bold; color: #464646; font-family: "Open Sans", Arial, sans-serif; border-bottom: 1px solid #e1e1e1; margin: -9px 0 0 0; padding-bottom: 8px; letter-spacing: -0.5px;}
+
-
.comments-sec h3 span {color: #888;}
+
-
ol.commentlist{float:left; width:100%;}
+
em { font-style: italic; }
-
ol.commentlist li{float:left; border-top:1px solid #e1e1e1; padding: 25px 0 20px 0;}
+
-
ol.commentlist li:first-child{border:none; padding: 25px 0 0px 0;}
+
-
ol.commentlist li{list-style: none;}
+
-
ol li ol.childlist{ float:right; width:89%; margin:0px}
+
input { outline: 0; }
-
ol.commentlist li ol.childlist li:first-child{border-top:1px solid #e1e1e1; padding: 25px 0 0 0; font-size: 12px;}
+
-
ol.commentlist li ol.childlist li{border-top:1px solid #e1e1e1; margin:25px 0 15px 0; font-size: 12px;}
+
-
.comments{float:left; width:100%}
+
ul {
-
ol li ol.childlist .comment-des{ float:right; width:88%}
+
    list-style-type: square;
-
.avatar{float:left}
+
    list-style-position: outside;
-
 
+
    margin: 0 0 26px 20px;
-
.comment-des{float:right; width:89%}
+
-
.comment-des strong{float:left; color:#464646; padding-right:5px; font-family: "Open Sans", Arial,sans-serif; font-size:14px; letter-spacing: -0.5px;}
+
-
.comment-des span{float:left; color:#777; font-family: Tahoma, Arial, sans-serif;}
+
-
.comment-by{float:left; width:100%; padding-bottom:5px; padding-top:5px; color: #000;}
+
-
.comment-by span.reply{color:#777;  float:right}
+
-
.comment-by span.reply a{color:#6f9c00; font-weight:bold; float:right; height:17px; margin-left:5px; font-weight: normal;}
+
-
.comment-by span.reply a:hover{border:none; color: #888;}
+
-
.comment-by span.date{color:#888; padding-right:7px; float:right}
+
-
 
+
-
/** Leave a Comment **/
+
-
.form_comment label {
+
-
display: block;
+
-
color: #676767;
+
-
margin-top: 15px;
+
-
padding-bottom: 4px;
+
}
}
 +
ul li { font: 13px/25px Arial; }
-
.form_comment label span {color:#dd1d1d;}
+
.separator {
-
 
+
    clear: both;
-
.form_comment input, .form_comment textarea {
+
    height: 1px;
-
width: 250px;
+
    width: auto;
-
border: 1px solid #d7d7d7;
+
    background: transparent url("https://static.igem.org/mediawiki/2013/e/e6/Separator-bkg.png") repeat-x left top;
-
color: #999;
+
    margin-bottom: 40px;
-
font-size: 12px;
+
-
font-family: Arial;
+
-
padding: 8px;
+
-
background-color: #fff;
+
-
outline: none;
+
-
cursor: text;
+
-
font-family: Tahoma, Arial, sans-serif;
+
}
}
-
.form_comment textarea {
+
blockquote { clear: both; }
-
width: 97%;
+
blockquote p {
-
max-width: 97%;
+
    background: transparent url("https://static.igem.org/mediawiki/2013/6/65/Quotes.png") no-repeat left top;
-
height:140px;
+
    background-position: 0 6px;
 +
    padding: 0 0 0 66px;
 +
    margin: 0;
 +
    font: italic 18px/25px "Times New Roman";
 +
    color: #37342d;
}
}
-
 
+
blockquote cite {
-
.form_comment input:focus, .form_comment textarea:focus {
+
    margin: 12px 0 40px 0;
-
border: 1px solid #d1d1d1;
+
    padding: 10px 0 0 0;
-
color: #676767;
+
    display: block;
-
-webkit-box-shadow: 0 0 3px #e8e8e8;
+
    color: #c78c45;
-
-moz-box-shadow: 0 0 3px #e8e8e8;
+
    font: bold 14px "Times New Roman";
-
box-shadow: 0 0 3px #e8e8e8;
+
    background: url("https://static.igem.org/mediawiki/2013/e/e6/Separator-bkg.png") repeat-x top left transparent;
}
}
-
.form_send input {margin: 10px 0 20px 0;}
+
.preload { position: relative; overflow: hidden; }
 +
.preloading { background: #fcfbf9 url("https://static.igem.org/mediawiki/2013/archive/4/42/20130923094421%21Loading.gif") no-repeat center; position: absolute; z-index: 20; width: 100%; height: 100%; }
 +
.preload img { visibility: hidden; }
-
/*================================================= */
+
/* ----------------------------------------------------------
-
/* Blog - Widget
+
* FORM ELEMENTS
-
================================================== */
+
* ----------------------------------------------------------*/
-
#blog_widget_container {margin-top: 32px;}
+
-
.search input {
+
.form-details { color: #888172; font-size: 12px; float: right; text-align: right; margin-right: 162px; line-height: 40px; }
-
width: 85%;
+
label {
-
border: 1px solid #d7d7d7;
+
    display: block;
-
color: #999;
+
    color: #8c8c8c;
-
font-size: 12px;
+
    font-size: 12px;
-
font-family: Arial;
+
    padding: 4px 0;
-
padding: 8px 15px 8px 28px;
+
    font-style: italic;
-
background: url(../images/search_ico.png) no-repeat 4% 54%;
+
-
background-color: #fff;
+
-
outline: none;
+
-
cursor: text;
+
-
font-family: Tahoma, Arial, sans-serif;
+
-
margin-bottom: 15px;
+
}
}
-
 
+
input, textarea {
-
.search input:focus {
+
    height: 16px;
-
border: 1px solid #d1d1d1;
+
    padding: 8px 10px 8px 10px;
-
color: #676767;
+
    border: 1px solid #c3b598;
-
-webkit-box-shadow: 0 0 3px #e8e8e8;
+
    font: 12px/16px Arial;
-
-moz-box-shadow: 0 0 3px #e8e8e8;
+
    color: #888172;
-
box-shadow: 0 0 3px #e8e8e8;
+
    margin: 0 0 20px 0;
 +
}
 +
textarea { height: auto; }
 +
input:focus, textarea:focus {
 +
    border: 1px solid #eadcbf;
 +
    outline: none;
}
}
-
.widget {margin-bottom: 20px;}
+
/* ----------------------------------------------------------
-
.widget-text p {color: #676767; line-height: 21px;}
+
* ROOT TEMPLATE DEFINITION
 +
* ----------------------------------------------------------*/
-
.widget-title h3 {
+
#root {
-
font-size: 14px;
+
    margin: 0;
-
font-family: "Open Sans", Arial, Tahoma;
+
    padding: 0;
-
font-weight: bold;
+
    font: 13px/21px Arial;
-
color: #464646;
+
    color: #37342d;
-
letter-spacing: -0.5px;
+
-
border-bottom: 1px solid #e1e1e1;
+
-
padding-bottom: 1px;
+
-
margin-bottom: 9px;
+
}
}
-
.widget-categories a {color: #676767; display: block;}
+
/* ----------------------------------------------------------
-
.widget-categories a:hover {color: #6f9c00;}
+
* HEADER DEFINITION
 +
* ----------------------------------------------------------*/
-
.widget-categories li {
+
#header { position: relative; width: 960px; margin: 0 auto; }
-
background: url(../images/bullet_categories.png) no-repeat 0% 50%;
+
#header .header-bar {
-
padding: 3px  12px;
+
    margin: 50px 0 50px 0;
-
margin:0;
+
    clear: both;
-
list-style: none;
+
    height: 79px;
 +
    background: transparent url("https://static.igem.org/mediawiki/2013/4/42/Header-bar-bkg.png") repeat-x left top;
 +
    position: relative;
}
}
-
/* Twitter - Blog */
+
#header #logo {
-
#twitter-blog {
+
    height: 128px;
-
font-size: 12px;
+
    background: transparent url("https://static.igem.org/mediawiki/2013/8/82/Logo-bkg.png") repeat-x left top;
-
font-family: Tahoma, Arial, sans-serif;
+
    padding: 0;
-
float: left;
+
    margin: 0;
-
display: block;
+
    display: block;
-
color: #676767;
+
    width: auto;
 +
    position: relative;
 +
    vertical-align: top;
 +
    top: -24px;
 +
    left: 30px;
 +
    float: left;
 +
}
 +
#header #logo h1 {
 +
    position: relative;
 +
    margin: 0;
 +
    margin-top: 24px;
 +
    left: -5px;
 +
    right: -5px;
 +
    top: 0;
 +
    color: #fff;
 +
    background: transparent url("https://static.igem.org/mediawiki/2013/f/f2/Logo-fg.png") repeat-x left top;
 +
    height: 54px;
 +
    padding: 26px 5px 0 5px;
 +
    width: 100%;
 +
    display: block;
 +
    font-size: 35px;
 +
}
 +
body.js-enabled #header #logo h1 {}
 +
#header #logo h1 a {
 +
    font-size: 35px;
 +
    color: #fff;
 +
    display: block;
 +
    padding: 0 20px;
 +
    text-align: center;
 +
}
 +
#header #logo h1 a:hover {
 +
    text-decoration: none;
}
}
-
#twitter-blog b a {color: #999999;}
+
/* ----------------------------------------------------------
-
#twitter-blog li {line-height: 21px;}
+
* MAIN MENU DEFINITION
-
#twitter-blog li:last-child {padding: 0; margin: 0;}
+
* ----------------------------------------------------------*/
-
#twitter-blog a {color: #6f9c00;}
+
-
#twitter-blog a:hover {color: #999;}
+
-
/* Flickr - Blog */
+
ul#menu {
-
.flickr-widget-blog {margin-right: -12px; margin-top: 15px;}
+
    position: relative;
-
.flickr-widget-blog img {display: block; width: 100%;}
+
    right: 0;
-
.flickr-widget-blog a:hover {border-color: #6b6b6b;}
+
    margin: 0;
-
 
+
    padding: 0;
-
.flickr-widget-blog a {
+
    background: transparent;
-
float: left;
+
    z-index: 50;
-
width: 55px;
+
     overflow: visible;
-
height: 55px;
+
     list-style-type: none;
-
margin-right: 12px;
+
     display: block;
-
margin-bottom: 12px;
+
     float: right;
-
border: 3px solid #dcdcdc;
+
-
-webkit-transition: all 0.2s ease-in-out;
+
-
     -moz-transition: all 0.2s ease-in-out;
+
-
     -o-transition: all 0.2s ease-in-out;
+
-
     -ms-transition: all 0.2s ease-in-out;
+
-
     transition: all 0.2s ease-in-out;
+
}
}
-
 
+
ul#menu > li {
-
a.older_entires {
+
    display: inline-block;
-
float: left;
+
    float: left;
-
margin: 5px 0 20px 0;
+
    margin: 0;
-
color: #676767;
+
    padding: 0;
-
padding: 0 0 0 12px;
+
    position: relative;
-
background: url(../images/bullet_post_entry_hover_left.png) no-repeat left;
+
-
background-position: 0% 60%;
+
}
}
-
 
+
ul#menu > li > a {
-
a.older_entires:hover {
+
    color: #777163;
-
color: #6f9c00;
+
    font: 15px/15px Arial;
-
background: url(../images/bullet_post_entry_left.png) no-repeat left;
+
    display: block;
-
background-position: 0% 60%;
+
    float: left;
 +
    margin: 0 14px;
 +
    height: 15px;
 +
    padding: 12px 0;
 +
    margin-top: 22px;
 +
    vertical-align: top;
 +
    text-transform: uppercase;
}
}
-
 
+
body.js-enabled ul#menu > li > a { margin-top: 25px; padding: 10px 0; }
-
a.newer_entires {
+
ul#menu > li > a:hover {
-
float: right;
+
    color: #37342d;
-
margin: 5px 0 20px 0;
+
    text-decoration: none;
-
color: #676767;
+
-
padding: 0 12px 0 0;
+
-
background: url(../images/bullet_post_entry_hover.png) no-repeat right;
+
-
background-position: 100% 60%;
+
}
}
-
 
+
ul#menu > li.current-menu-item > a,
-
.newer_entires:hover {
+
ul#menu > li.current_page_parent > a,  ul#menu > li.current-menu-parent > a,
-
color: #6f9c00;
+
ul#menu > li.current-menu-ancestor > a,  ul#menu > li.current_page_ancestor > a {
-
background: url(../images/bullet_post_entry.png) no-repeat right;
+
    color: #37342d;
-
background-position: 100% 60%;
+
}
}
-
/*================================================= */
+
ul#menu > li.current-menu-item a:hover,
-
/* Features
+
ul#menu > li.current_page_parent a:hover,  ul#menu > li.current-menu-parent a:hover,
-
================================================== */
+
ul#menu > li.current-menu-ancestor a:hover,  ul#menu > li.current_page_ancestor a:hover {  }
-
.feature {margin: 0 0 20px 0;}
+
-
.feature.page {margin: 0 0 40px 0;}
+
-
.feature-description {margin-left: 45px;}
+
-
.feature h4 {
+
ul#menu li:hover > ul.sub-menu { display: block; }
-
font-size: 16px;
+
 
-
font-weight: bold;
+
/* ----------------------------------------------------------
-
letter-spacing: -0.5px;
+
* SUBMENU
 +
* --------------------------------------------------------- */
 +
 
 +
ul#menu li ul.sub-menu {
 +
    margin: 0;
 +
    display: none;
 +
    position: absolute;
 +
    top: 60px;
 +
    left: 0px;
 +
    background: #fff;
 +
    z-index: 50;
 +
    border: 1px solid #f6e5cc;
 +
    border-radius: 3px;
 +
    box-shadow: 0 4px 5px rgba(0,0,0, .05);
 +
    width: 180px;
}
}
-
.feature-circle {
+
ul#menu li ul.sub-menu li {
-
font-size: 16px;
+
    margin: 0;
-
font-weight: bold;
+
    position: relative;
-
font-family: "open sans", sans-serif;
+
    clear: both;
-
display: inline-block;
+
    display: block;
-
width: 35px;
+
    width: 180px;
-
line-height: 35px;
+
    padding: 0;
-
text-align: center;
+
}
-
color: #fff;
+
ul#menu li ul.sub-menu li a {
-
-moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px;
+
    position: relative;
-
float: left;
+
    clear: both;
-
margin-top: 10px;
+
    display: block;
 +
    cursor: pointer;
 +
    border: 0;
 +
    text-shadow: 0 0 0 transparent;
 +
    background: transparent none;
 +
    font-size: 12px;
 +
    font-weight: normal;
 +
    text-transform: none;
 +
    color: #888172;
 +
    width: 160px;
 +
    height: 20px;
 +
    line-height: 20px;
 +
    padding: 8px 10px;
 +
    text-align: left;
 +
    border-top: 1px solid #f6e5cc;
 +
    border-radius: 0;
 +
}
 +
ul#menu li ul.sub-menu li a.last, ul#menu li ul.sub-menu li:first-child > a { border-top: 0; }
 +
ul#menu li ul.sub-menu li a:hover {
 +
    box-shadow: 0 0 0 transparent;
 +
    border-radius: 0;
 +
    color: #37342d;
 +
    text-decoration: none;
 +
}
 +
ul#menu li ul.sub-menu li a.more { background: transparent url("https://static.igem.org/mediawiki/2013/c/cc/Menu-item-more.png") no-repeat right center; background-position: 166px; }
 +
ul#menu li ul.sub-menu ul.sub-menu,  ul#menu li ul.sub-menu ul.sub-menu ul.sub-menu {
 +
    left: 160px;
 +
    top: 8px;
}
}
-
.feature-circle.green {background: #81b600;}
+
/* ----------------------------------------------------------
-
.feature-circle.gray {background: #6b6b6b;}
+
* MEGAMENU
 +
* --------------------------------------------------------- */
-
/*================================================= */
+
#menu .pixel-mega-menu {
-
/* Image Overlay
+
     display: none;
-
================================================== */
+
-
.item-img, .post-thumb, .slides {position: relative;}
+
-
 
+
-
.overlay {
+
-
height: 100%;
+
-
     left: 0;
+
     position: absolute;
     position: absolute;
-
     top: 0px;
+
    left: 0;
 +
     top: 60px;
 +
    min-width: 460px;
 +
    border-radius: 0;
 +
}
 +
#menu .pixel-mega-menu ul.sub-menu {
     width: 100%;
     width: 100%;
-
     z-index: 1;
+
     padding: 30px 20px 20px 20px;
-
z-index: 40;
+
    margin: 0;
-
opacity: 0;
+
    display: block;
-
-moz-opacity: 0;
+
    top: auto;
-
filter:alpha(opacity=0);
+
    left: auto;
-
-webkit-transition: opacity 150ms ease-in-out;
+
    background: #fff;
-
-moz-transition: opacity 150ms ease-in-out;
+
    border-radius: 3px;
-
-o-transition: opacity 150ms ease-in-out;
+
    border: 0;
-
transition: opacity 150ms ease-in-out;
+
}
 +
#menu .pixel-mega-menu > ul.sub-menu { border: 1px solid #f6e5cc; }
 +
#menu .pixel-mega-menu > ul.sub-menu li ul.sub-menu {
 +
    padding: 0;
 +
    background: none;
 +
    position: relative;
 +
    left: auto;
 +
    top: auto;
 +
    color: #555;
 +
    overflow: hidden;
 +
    box-shadow: 0 0 0 transparent;
 +
}
 +
#menu .pixel-mega-menu > ul.sub-menu ul li {
 +
    margin: 0;
 +
    color: #777;
 +
    height: 24px;
 +
    line-height: 23px;
 +
    width: 90%;
 +
    margin-left: 0px;
 +
}
 +
#menu .pixel-mega-menu > ul.sub-menu > li a {
 +
    display: block;
 +
    border: 0;
 +
    padding: 0;
 +
    margin: 0;
 +
    height: auto;
 +
    height: 30px;
 +
    line-height: 30px;
 +
    text-indent: 0;
 +
    color: #888172;
 +
    text-decoration: underline;
 +
}
 +
#menu .pixel-mega-menu ul.sub-menu a:hover { background: none; color: #37342d; text-decoration: none; }
 +
ul#menu li:hover > .pixel-mega-menu { display: block; }
 +
#menu .pixel-mega-menu > ul.sub-menu > li {
 +
    clear: none;
 +
    float: left;
 +
    display: block;
 +
    margin: 0;
 +
    padding: 0;
 +
    margin-bottom: 30px;
 +
    width: 48%;
 +
    margin-right: 2%;
 +
}
 +
#menu .pixel-mega-menu > ul.sub-menu > li:last-child,  #menu .pixel-mega-menu > ul.sub-menu > li.last {
 +
    width: 50%;
 +
    margin-right: 0;
 +
}
 +
#menu .pixel-mega-menu > ul.sub-menu li h4 {
 +
    font: 14px/18px Arial;
 +
    color: #948d7c;
 +
    border-bottom: 1px solid #f6e5cc;
 +
    margin-bottom: 14px;
 +
    padding: 0px 10px 4px 0;
 +
    background: none;
 +
}
 +
#menu .pixel-mega-menu > ul.sub-menu > li p {
 +
    padding-bottom: 10px;
 +
    color: #999;
 +
    color: #888172;
 +
    font: italic 12px/20px Arial;
}
}
-
.overlay.link {background: url(../images/overlay_link.png) no-repeat center center, url(../images/overlay_bg.png) center center;}
+
#menu .pixel-mega-menu.two-columns { width: 460px; }
-
.overlay.zoom {background: url(../images/overlay_zoom.png) no-repeat center center, url(../images/overlay_bg.png) center center;}
+
#menu .pixel-mega-menu.three-columns { width: 660px; }
 +
#menu .pixel-mega-menu.four-columns { width: 920px; }
 +
#menu .pixel-mega-menu.two-columns > ul.sub-menu > li { width: 48%; margin-right: 2%; }
 +
#menu .pixel-mega-menu.three-columns > ul.sub-menu > li { width: 31%; margin-right: 2%; }
 +
#menu .pixel-mega-menu.four-columns > ul.sub-menu > li { width: 23%; margin-right: 2%; }
 +
#menu .pixel-mega-menu.two-columns > ul.sub-menu > li.last { width: 50%; margin-right: 0; }
 +
#menu .pixel-mega-menu.three-columns > ul.sub-menu > li.last { width: 33%; margin-right: 0; }
 +
#menu .pixel-mega-menu.four-columns > ul.sub-menu > li.last { width: 25%; margin-right: 0; }
 +
#menu .pixel-mega-menu > ul.sub-menu > li.newline { clear: both; width: 100%; padding: 0; margin: 0; }
 +
#menu .pixel-mega-menu > ul.sub-menu > li.half-column { width: 48%; margin-right: 2%; }
 +
#menu .pixel-mega-menu > ul.sub-menu > li.third-column { width: 31%; margin-right: 2%; }
 +
#menu .pixel-mega-menu > ul.sub-menu > li.two-thirds-column { width: 65%; margin-right: 2%; }
 +
#menu .pixel-mega-menu > ul.sub-menu > li.half-column.last { width: 50%; margin-right: 0; }
 +
#menu .pixel-mega-menu > ul.sub-menu > li.third-column.last { width: 33%; margin-right: 0; }
 +
#menu .pixel-mega-menu > ul.sub-menu > li.two-thirds-column.last { width: 67%; margin-right: 0; }
 +
#menu .pixel-mega-menu > ul.sub-menu > li.fourth-column { width: 23%; margin-right: 2%; }
 +
#menu .pixel-mega-menu > ul.sub-menu > li.fourth-column.last { width: 25%; margin-right: 0; }
 +
#menu .pixel-mega-menu > ul.sub-menu > li.full-column { width: 100%; margin-right: 0; }
 +
#menu .pixel-mega-menu > ul.sub-menu > li.last { margin-right: 0; }
-
.overlay:hover {
+
/* ----------------------------------------------------------
-
opacity: 1;
+
* SUBHEADER
-
-moz-opacity: 1;
+
* --------------------------------------------------------- */
-
filter:alpha(opacity=100);
+
-
}
+
-
.item {margin: 0 0 35px 0;}
+
#subheader-bar { margin-bottom: 30px; background: transparent url("https://static.igem.org/mediawiki/2013/e/e6/Separator-bkg.png") repeat-x bottom left; padding-bottom: 20px; overflow: hidden; }
 +
#subheader-bar div.site-description { color: #37342d; font: italic 13px/18px Arial; margin-top: 8px; display: inline-block; float: left; }
 +
#subheader-bar div.site-description h4 { margin: 0; padding: 0; font-style: normal; }
-
.item-meta h4 {
 
-
font-size: 12px;
 
-
font-family: Arial, sans-serif;
 
-
font-weight: bold;
 
-
line-height: 16px;
 
-
padding: 16px 0 0 0;
 
-
}
+
/* ----------------------------------------------------------
 +
* MULTI COLUMNS
 +
* ----------------------------------------------------------*/
-
.meta-blog p {color: #676767;}
+
.multi-columns { clear: both; overflow: hidden; margin-bottom: 20px; }
-
.item-meta {color: #888;}
+
.multi-columns .multi-columns { clear: both; margin: 0; }
-
.item-meta h4 a:hover{color:#6f9c00;}
+
.multi-columns .half { float: left; width: 48%; margin-right: 4%; }
-
.item-meta span {color: #a0a0a0; display: block; line-height: 18px;}
+
.multi-columns .third { float: left; width: 31%; margin-right: 3.5%; }
-
.item-meta p {line-height: 18px; margin-top: 7px;}
+
.multi-columns .twothirds { float: left; width: 65.5%; margin-right: 3.5%; }
 +
.multi-columns .fourth { float: left; width: 22%; margin-right: 4%; }
 +
#root .clearer { clear: both; }
 +
#root .last { margin-right: 0; }
-
/*================================================= */
+
/* ----------------------------------------------------------
-
/* Headlines
+
* CONTENT
-
================================================== */
+
* --------------------------------------------------------- */
-
#divider {
+
 
-
margin: 17px 0 26px 10px;
+
#content {
-
border-bottom: 1px solid #e1e1e1;
+
    width: 960px;
 +
    margin: 0 auto;
 +
    padding: 0 0 30px 0;
 +
    min-height: 300px;
}
}
-
.related-title {
+
/* ----------------------------------------------------------
-
background: url(../images/divider_bg.png) repeat-x;
+
* MAINAREA + SIDEBARS
-
background-position: 50% 62%;
+
* ----------------------------------------------------------*/
-
margin: 0 0 15px 0;
+
-
}
+
-
.related-title span {
+
.sidebar-left, .sidebar-right {
-
color: #464646;
+
    float: left;
-
font-size: 18px;
+
    width: 190px;
-
font-weight: bold;
+
    margin: 0 0 40px 0;
-
letter-spacing: -0.5px;
+
    padding: 4px 10px 0 0;
-
font-family: "Open Sans", sans-serif;
+
    margin-right: 30px;
-
background: #fdfdfd;
+
    background: transparent url("https://static.igem.org/mediawiki/2013/5/55/Sidebar-vert-sep-bkg.jpg") repeat-y right top scroll;
-
padding: 0 10px 0 0;
+
}
}
 +
.mainarea-right, .mainarea-left, .mainarea-center {
 +
    float: left;
 +
    width: 730px;
 +
    overflow: hidden;
 +
    margin: 0;
 +
    padding: 4px 0 20px 0;
 +
}
 +
.sidebar-right { float: right; margin: 0; background: transparent url("https://static.igem.org/mediawiki/2013/5/55/Sidebar-vert-sep-bkg.jpg") repeat-y left top scroll; padding: 4px 0 0 10px; }
 +
.mainarea-left { float: left; margin: 0 30px 0 0; }
 +
.mainarea-center { width: 500px; margin: 0 30px 0 0; float: left; }
 +
.sidebar-right.margin { float: left; }
-
/*================================================= */
 
-
/* Testimonials
 
-
================================================== */
 
-
.testimonial_page {margin-bottom: 40px;}
 
-
.testimonials {
 
-
background: #fff;
 
-
border: 1px solid #ddd;
 
-
padding:20px;
 
-
line-height: 21px;
 
-
}
 
-
.testimonials_bg {
 
-
background: url(../images/testimonials_bg.png) no-repeat;
 
-
margin-top: -1px;
 
-
display: block; width: 200px;
 
-
height: 30px;
 
-
}
 
-
.testimonials_author {
 
-
color:#6f9c00;
 
-
float: right;
 
-
display: block;
 
-
margin-top: -23px;
 
-
margin-bottom: 20px;
 
-
}
 
-
.testimonials_author_page {
+
/* ----------------------------------------------------------
-
color:#6f9c00;
+
* CUSTOM HEADLINES
-
float: right;
+
* ----------------------------------------------------------*/
-
display: block;
+
 
-
margin-top: -23px;
+
.custom-headline {
-
margin-bottom: 20px;
+
    font: 15px/18px Arial;
 +
    text-transform: uppercase;
 +
    color: #c78c45;
 +
    margin-bottom: 26px;
}
}
-
.testimonials_author span {color:#a0a0a0}
+
/* ----------------------------------------------------------
-
.testimonials_author_page span {color:#a0a0a0}
+
* CUSTOM BUTTONS
 +
* --------------------------------------------------------- */
-
/* Testomonials Carousel */
+
a.custom-button {
-
.carousel-disabled, .mr-rotato-disabled {
+
    display: inline-block;
-
height: 21px;
+
    height: 34px;
-
width: 21px;
+
    font: bold 13px/34px Arial;
-
background-color: #c0c0c0 !important;
+
    color: #fff;
-
display: block;
+
    background: #fff url("https://static.igem.org/mediawiki/2013/1/15/Button-bkg.jpg") repeat-x center top;
-
position: absolute;
+
    padding: 0 16px;
 +
    border: 1px solid #aa9973;
 +
    text-shadow: 0 1px 0 #948564;
 +
    margin: 0 0 30px 0;
 +
    box-shadow: inset 0 0 1px 0 #fee7b4;
 +
    text-align: center;
}
}
-
 
+
a.custom-button:hover {
-
.mr-rotato-next {
+
    text-decoration: none;
-
height: 21px;
+
    background: #fff url("https://static.igem.org/mediawiki/2013/9/92/Button-bkg-over.jpg") repeat-x center top;
-
width: 21px;
+
    box-shadow: inset 0 -10px 20px #b5a789;
-
background: url(../images/carousel-next.png);
+
-
background-color: #6b6b6b;
+
-
display: block;
+
-
position: absolute;
+
-
right: 10px;
+
}
}
-
.mr-rotato-prev {
+
a.more-button {
-
height: 21px;
+
    display: inline-block;
-
width: 21px;
+
    height: 23px;
-
background: url(../images/carousel-prev.png);
+
    background: #c3b598 url("https://static.igem.org/mediawiki/2013/b/bf/More-button-arrow.gif") no-repeat right center;
-
background-color: #6b6b6b;
+
    padding: 0 26px 0 10px;
-
display: block;
+
    color: #fff;
-
right: 33px;
+
    font: italic 13px/22px Arial;
-
position: absolute;
+
    margin: 0 0 30px 0;
}
}
-
 
+
a.more-button:hover {
-
.mr-rotato-prev, .mr-rotato-next, .mr-rotato-disabled {
+
    background: #6c675c url("https://static.igem.org/mediawiki/2013/c/c9/More-button-arrow-over.gif") no-repeat right center;
-
margin-top: -45px;
+
     text-decoration: none;
-
-moz-border-radius: 50px;
+
-
-webkit-border-radius: 50px;
+
-
border-radius: 50px;
+
-
-webkit-transition: all 0.1s ease-in-out;
+
-
    -moz-transition: all 0.1s ease-in-out;
+
-
    -o-transition: all 0.1s ease-in-out;
+
-
     -ms-transition: all 0.1s ease-in-out;
+
-
    transition: all 0.1s ease-in-out;
+
}
}
-
 
-
.mr-rotato-prev:hover, .mr-rotato-next:hover {background-color:#81b600; }
 
-
/*================================================= */
+
/* ----------------------------------------------------------
-
/* Contact Form Styles
+
* CALL TO ACTION BOX
-
================================================== */
+
* --------------------------------------------------------- */
-
#google_map {padding: 0 0 40% 0;}
+
-
.page_content {margin-bottom: 25px;}
+
-
.page_content span.no_error {
+
.cta-box {
-
display: block;
+
    height: 59px;
-
color: #458e4b;
+
    line-height: 79px;
-
font-weight: normal;
+
    background: transparent url("https://static.igem.org/mediawiki/2013/4/42/Header-bar-bkg.png") repeat-x center top;
-
background-color: #defbc7;
+
    overflow: hidden;
-
border: 1px solid #abcf9d;
+
    padding: 20px 14px 0 14px;
-
     font-size: 12px;
+
     margin: 0 0 44px 0;
-
text-align: center;
+
}
-
height: 0;
+
.cta-box p {
-
opacity:0;
+
    color: #37342d;
-
filter: alpha(opacity=0);
+
    font: italic 25px/34px "Times New Roman";
-
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
+
    margin: 0;
-
overflow:hidden;
+
    padding: 0;
-
width: 100%;
+
}
 +
.cta-box a.custom-button {
 +
    position: relative;
 +
    top: -4px;
 +
    float: right;
 +
    font-size: 16px;
 +
    line-height: 46px;
 +
    width: 150px;
 +
    height: 46px;
 +
    margin: 0;
}
}
-
.contact_submit {margin: 10px 0 0 0;}
+
/* ----------------------------------------------------------
 +
* NIVO SLIDER
 +
* --------------------------------------------------------- */
-
.contact_text {
+
.px-slider-wrapper {
-
width: 250px;
+
    position: relative;
-
border: 1px solid #d7d7d7;
+
    padding-bottom: 50px;
-
color: #888;
+
    margin-bottom: 44px;
-
font-size: 12px;
+
-
font-family: Tahoma, Arial, sans-serif;
+
-
padding: 9px;
+
-
background-color: #fff;
+
-
outline: none;
+
}
}
-
 
+
.px-slider.nivoSlider img, .px-slider.nivoSliderThumbs img { display: none; }
-
.contact_form label {
+
.px-slider .nivo-controlNav img { display: block; }
-
display: block;
+
.px-slider-wrapper.nodescr { padding: 0; margin-bottom: 30px; }
-
    margin: 20px 0 5px 0;
+
.px-slider.nivoSlider, .px-slider.nivoSliderThumbs {
 +
    width: 960px;
 +
    height: 340px;
 +
    position: relative;
 +
    background: transparent url("https://static.igem.org/mediawiki/2013/archive/4/42/20130923094421%21Loading.gif") no-repeat 50% 50%;
}
}
 +
.mainareaSlider { width: 730px !important; background: transparent url("https://static.igem.org/mediawiki/2013/archive/4/42/20130923094421%21Loading.gif") no-repeat 50% 50%; }
 +
.px-slider.nivoSlider .nivo-controlNav {
 +
    position: absolute;
 +
    bottom: 0px;
 +
    right: 0px;
 +
    background: #000;
 +
    background: rgba(0, 0, 0, 0.5);
 +
    overflow: hidden;
 +
    padding: 8px 12px;
 +
    width: auto;
 +
    z-index: 10;
 +
}
 +
.px-slider.nivoSlider .nivo-controlNav a {
 +
    display: block;
 +
    float: left;
 +
    margin-left: 8px;
 +
    width: 6px;
 +
    height: 6px;
 +
    border-radius: 6px;
 +
    text-indent: -9999px;
 +
    background: #f6eee5;
 +
}
 +
.px-slider.nivoSlider .nivo-controlNav a:first-child { margin-left: 0; }
 +
.px-slider.nivoSlider .nivo-controlNav a.active { background: #dcb78d; }
-
.contact_form label span {color: #ff0000;}
+
.px-slider.nivoSlider .nivo-caption {
-
 
+
    position: absolute;
-
.contact_textarea {
+
    bottom: -46px;
-
width: 96%;
+
    height: 40px;
-
max-width: 96%;
+
    line-height: 40px;
-
height: 140px;
+
    background: transparent url("https://static.igem.org/mediawiki/2013/8/87/Nivo-caption-bkg.png") repeat top left;
-
border: 1px solid #d7d7d7;
+
}
-
color: #888;
+
.px-slider.nivoSlider .nivo-caption p {
-
font-size: 12px;
+
    line-height: 40px;
-
font-family: Tahoma, Arial, sans-serif;
+
    padding: 0 10px;
-
padding: 10px;
+
    font-size: 13px;
-
background-color: #fff;
+
    color: #242320;
-
outline: none;
+
}
 +
.px-slider.nivoSlider .nivo-caption p span.caption-title {
 +
    color: #242320;
 +
    padding: 0 20px 0 10px;
 +
    font: bold 13px Arial;
 +
    text-transform: uppercase;
 +
}
 +
.px-slider.nivoSlider .nivo-directionNav {
 +
    position: absolute;
 +
    left: 0;
 +
    top: 50%;
 +
    margin-top: -20px;
 +
    right: 10px;
 +
    display: block;
 +
    width: 100%;
 +
    height: 40px;
 +
}
 +
.px-slider.nivoSlider .nivo-directionNav a {
 +
    display: block;
 +
    top: 0;
 +
    width: 69px;
 +
    height: 40px;
 +
    text-indent: -9999px;
 +
}
 +
.px-slider.nivoSlider .nivo-directionNav a.nivo-prevNav {
 +
    background: transparent url("https://static.igem.org/mediawiki/2013/d/dc/Nivo-nav-left.png") no-repeat left top;
 +
    left: -24px;
 +
}
 +
.px-slider.nivoSlider .nivo-directionNav a.nivo-nextNav {
 +
    background: transparent url("https://static.igem.org/mediawiki/2013/8/80/Nivo-nav-right.png") no-repeat left top;
 +
    right: -24px;
}
}
-
.input_error {background: #ffeceb; border: 1px solid #f2c4c2;}
+
/* THUMBNAILS */
-
.input_noerror {background: #fff; border: 1px solid #d8d8d8;}
+
-
.contact_text:focus, .contact_textarea:focus {
+
.px-slider.nivoSliderThumbs .nivo-controlNav {
-
border: 1px solid #cbcbcb;
+
    left: 0;
-
-webkit-box-shadow: 0 0 3px #e8e8e8;
+
    bottom: -62px;
-
-moz-box-shadow: 0 0 3px #e8e8e8;
+
    background: none;
-
box-shadow: 0 0 3px #e8e8e8;
+
    background: #000;
 +
    background: #000 url("https://static.igem.org/mediawiki/2013/6/63/Slider-thumbs-bkg.png") repeat-x top left;
 +
    height: 60px;
 +
    margin: 0;
 +
    padding: 1px;
 +
    overflow: hidden;
}
}
 +
.px-slider.nivoSliderThumbs .nivo-controlNav a {
 +
    width: 80px;
 +
    height: 60px;
 +
    margin: 0 0 0 1px;
 +
    background: transparent;
 +
    border-radius: 0;
 +
}
 +
.px-slider.nivoSliderThumbs .nivo-controlNav a:first-child { margin-left: 0; }
 +
.px-slider-wrapper.thumbs { margin-bottom: 90px; }
 +
.px-slider.nivoSliderThumbs .nivo-controlNav a.active { background: transparent; }
 +
.px-slider.nivoSliderThumbs .nivo-caption { bottom: -106px; }
-
.address_contact {color:#676767; font-family: Tahoma,arial, sans-serif; padding-bottom:12px; line-height: 18px;}
 
-
.address_contact  img{float:left; padding-right:7px}
 
-
.address_contact  strong{font-weight:bold; color:#555; display:block; float:left; padding-bottom:8px; padding-right:4px; font-family:Arial,Helvetica,sans-serif}
 
-
.address_contact  a{color:#6f9c00}
 
-
.address_contact  a:hover{color:#888}
 
-
/*================================================= */
+
/* ----------------------------------------------------------
-
/* Portfolio Styles
+
* ROUNDABOUT SLIDER
-
================================================== */
+
* --------------------------------------------------------- */
-
#filters {
+
.px-slider.circles ul {
-
float: left;
+
    position: relative;
-
margin-top: 25px;
+
    top: 0;
-
padding-bottom: 15px;
+
    display: block;
-
border-bottom: 1px solid #e1e1e1;
+
    list-style-type: none;
-
display: block;
+
    list-style-position: outside;
-
width: 100%;
+
    margin: 0 auto;
-
margin-bottom: 20px;
+
    padding: 0;
 +
    width: 100%;
 +
    width: 760px;
 +
    z-index: 0;
}
}
-
 
+
body.js-enabled .px-slider.circles ul {
-
#filters ul li {
+
    margin: 0 auto 80px auto;
-
display: inline;
+
-
padding: 0 10px 0 0;
+
-
margin: 0 5px 0 0;
+
-
background: url(../images/filter_divider.png) no-repeat  100% 50%;
+
}
}
 +
.px-slider.circles ul li {
 +
    display: inline-block;
 +
    float: left;
 +
    width: 400px;
 +
    margin: 0 20px 20px 0;
 +
}
 +
.circles .roundabout-holder {
 +
    list-style: none;
 +
    padding: 0;
 +
    margin: 0 auto;
 +
    height: 370px;
 +
    width: 760px;
 +
}
 +
.circles .roundabout-moveable-item {
 +
    height: 360px;
 +
    width: 400px;
 +
    cursor: pointer;
 +
}
 +
.circles .roundabout-moveable-item img {
 +
    width: 100%;
 +
    height: 100%;
 +
    padding: 0;
 +
    border: 0;
 +
    margin: 0;
 +
    background: none;
 +
    border-radius: 6px;
 +
    overflow: hidden;
 +
}
 +
.circles .roundabout-moveable-item a {
 +
    position: relative;
 +
    border-radius: 6px;
 +
    width: 100%;
 +
    height: 100%;
 +
    overflow: hidden;
 +
    display: block;
 +
    background: #eee;
 +
    border: 1px solid #fff;
 +
}
 +
.circles .roundabout-moveable-item.roundabout-in-focus a { border: 1px solid #fff; }
 +
.circles .roundabout-moveable-item span {
 +
    position: relative;
 +
    width: 100%;
 +
    padding: 14px 0;
 +
    display: block;
 +
    text-align: center;
 +
    font: bold 0.9em/24px Arial;
 +
    text-transform: uppercase;
 +
    color: #e5c8a6;
 +
}
 +
.circles .roundabout-moveable-item.roundabout-in-focus span { color: #ab7b40; }
 +
.circles .roundabout-in-focus { cursor: auto; }
-
#filters li:last-child {background: none;}
+
/* ----------------------------------------------------------
 +
  * BLOG
 +
* ----------------------------------------------------------*/
-
#filters a {
+
.large-post {
-
color: #777;
+
    overflow: hidden;
-
font-size: 12px;
+
    margin: 0 0 10px 0;
-
-webkit-transition: all 0.1s ease-in-out;
+
    padding: 0;
-
     -moz-transition: all 0.1s ease-in-out;
+
}
-
     -o-transition: all 0.1s ease-in-out;
+
.large-post .meta-column {
-
     -ms-transition: all 0.1s ease-in-out;
+
    width: 35%;
-
     transition: all 0.1s ease-in-out;
+
    float: left;
-
padding: 2px 5px;
+
    margin-right: 4%;
 +
}
 +
.large-post .content-column {
 +
    width: 59%;
 +
    float: left;
 +
}
 +
.large-post .meta-column h2.nocufon {
 +
    margin: 0 0 8px 0;
 +
    padding: 0 0 14px 0;
 +
    background: url("https://static.igem.org/mediawiki/2013/e/e6/Separator-bkg.png") repeat-x bottom left transparent;
 +
}
 +
.large-post .meta-column h2.nocufon a { color: #c78c45; }
 +
.large-post .meta-column h2.nocufon a:hover { color: #b0752e; text-decoration: none; }
 +
.large-post .meta-column div.meta-data, ul.post-list li .meta-data {
 +
    color: #37342d;
 +
    font-size: 11px;
 +
    height: 19px;
 +
    overflow: hidden;
 +
}
 +
.large-post .meta-column div.meta-data a, ul.post-list li .meta-data a {
 +
    color: #37342d;
 +
     font-weight: bold;
 +
    font-size: 11px;
 +
}
 +
.large-post .meta-column div.meta-data .author, ul.post-list li .meta-data .author {
 +
    height: 19px;
 +
     padding: 0 14px 0 0;
 +
    background: url("https://static.igem.org/mediawiki/2013/1/19/Post-meta-sep.jpg") no-repeat right top transparent;
 +
}
 +
.large-post .meta-column div.meta-data .comments, ul.post-list li .meta-data .comments {
 +
    padding: 0 10px;
 +
    height: 19px;
 +
}
 +
ul.post-list {
 +
    margin: 0 0 20px 0;
 +
    padding: 0;
 +
    list-style-type: none;
 +
     list-style-position: outside;
 +
    overflow: hidden;
 +
}
 +
ul.post-list li { padding: 0; margin: 0; float: left; width: 48%; margin-right: 4%; overflow: hidden; }
 +
ul.post-list li .post-title {
 +
     background: transparent url("https://static.igem.org/mediawiki/2013/8/87/Nivo-caption-bkg.png") repeat left top;
 +
    margin: 0;
 +
    padding: 10px;
 +
    text-align: center;
 +
    clear: both;
 +
    font: bold 13px/18px Arial;
 +
    text-transform: uppercase;
}
}
 +
ul.post-list li .post-title a { color: #37342d; }
 +
ul.post-list li .meta-data { text-align: center; padding: 14px 0; margin: 0 0 16px 0; background: url("https://static.igem.org/mediawiki/2013/e/e6/Separator-bkg.png") repeat-x bottom left transparent; }
 +
ul.post-list li.separator { width: 100%; clear: both; margin: 0 0 30px 0; }
-
#filters a:hover {
+
.post-navigator {
-
color: #fff;
+
    margin: 0 0 30px 0;
-
background: #888;
+
    padding: 30px 0 0 0;
-
padding: 2px 5px;
+
    overflow: hidden;
 +
    background: url("https://static.igem.org/mediawiki/2013/e/e6/Separator-bkg.png") repeat-x top left transparent;
}
}
 +
.post-navigator a {
 +
    min-height: 20px;
 +
    font: italic 17px/25px Georgia;
 +
    vertical-align: top;
 +
    color: #37342d;
 +
    display: block;
 +
    padding: 0;
 +
    width: 250px;
 +
}
 +
.post-navigator a:hover { color: #c78c45; text-decoration: none; }
 +
.post-navigator a.prev { float: left; background: url("https://static.igem.org/mediawiki/2013/0/03/Prev-posts.png") no-repeat left center; padding-left: 20px; text-align: left; }
 +
.post-navigator a.next { float: right; background: url("https://static.igem.org/mediawiki/2013/c/c1/Next-posts.png") no-repeat right center; padding-right: 20px; text-align: right; }
 +
.post-navigator a.prev:hover { float: left; background: url("https://static.igem.org/mediawiki/2013/2/2e/Prev-posts-over.png") no-repeat left center; }
 +
.post-navigator a.next:hover { float: right; background: url("https://static.igem.org/mediawiki/2013/3/30/Next-posts-over.png") no-repeat right center; }
-
.selected {background: #81b600; color: #fff !important;}
+
/* ----------------------------------------------------------
-
.selected:hover {background: #81b600!important;}
+
* COMMENTS
 +
* ----------------------------------------------------------*/
-
.portfolio-item {margin-bottom: 20px;}
+
ul.commentlist {
-
 
+
    margin: 0 0 20px 0;
-
.portfolio-item-meta h4 {
+
    padding: 0;
-
font-size: 12px;
+
    overflow: hidden;
-
font-family: Arial, sans-serif;
+
    list-style-type: none;
-
font-weight: bold;
+
    list-style-position: outside;
-
line-height: 16px;
+
}
-
padding: 12px 0 8px 0;
+
ul.commentlist li .comment-content, ul.commentlist li ul.children .comment-content {
-
margin: 0 0 8px 0;
+
    background: url("https://static.igem.org/mediawiki/2013/e/e6/Separator-bkg.png") repeat-x top left;
-
border-bottom: 1px solid #e1e1e1;
+
    padding-top: 30px;
 +
    margin: 0;
 +
    overflow: hidden;
 +
}
 +
ul.commentlist li:first-child > .comment-content {
 +
    border-top: 0;
 +
    background: none;
 +
    padding-top: 0;
 +
}
 +
ul.commentlist li ul.children {
 +
    padding-left: 20px;
 +
    list-style-type: none;
 +
    list-style-position: outside;
 +
    margin: 0;
 +
}
 +
ul.commentlist li img {
 +
    padding: 3px;
 +
    background: #fff;
 +
    float: left;
 +
}
 +
ul.commentlist li .comment-body {
 +
    overflow: hidden;
 +
    margin-left: 90px;
 +
}
 +
ul.commentlist li .comment-body .meta-data .author {
 +
    font: bold 13px/20px Arial;
 +
    color: #000;
 +
    margin-right: 4px;
 +
    padding-right: 8px;
 +
    background: url("https://static.igem.org/mediawiki/2013/a/a5/Dot-bkg.gif") no-repeat right center transparent;
 +
}
 +
ul.commentlist li .comment-body .meta-data, ul.commentlist li .comment-body .meta-data a {
 +
    color: #000;
 +
    font: normal 13px/20px Arial;
 +
    margin-bottom: 14px;
 +
}
 +
ul.commentlist li .comment-body .meta-data a.comment-reply-link {
 +
    color: #b76552;
 +
    margin-left: 20px;
}
}
-
.portfolio-item-meta a:hover {color:#6f9c00;}
+
/* ----------------------------------------------------------
-
.portfolio-item-meta p {color: #888;}
+
* RECENT WORK BOX
 +
* --------------------------------------------------------- */
-
/*================================================= */
+
.recent-work .custom-headline {
-
/* Isotope Styles
+
    margin-bottom: 10px;
-
================================================== */
+
}
-
/**** Isotope Filtering ****/
+
/* ----------------------------------------------------------
 +
* PORTFOLIO
 +
* ----------------------------------------------------------*/
-
.isotope-item {
+
.portfolio-navbar {
-
z-index: 2;
+
    overflow: hidden;
 +
    margin: 0 0 36px 0;
 +
    padding: 0;
}
}
-
 
+
.portfolio-navbar ul {
-
.isotope-hidden.isotope-item {
+
    margin: 0;
-
pointer-events: none;
+
    padding: 0;
-
z-index: 1;
+
    list-style-type: none;
 +
    list-style-position: outside;
 +
    overflow: hidden;
}
}
-
 
+
.portfolio-navbar ul li {
-
/**** Isotope CSS3 transitions ****/
+
    display: inline-block;
-
 
+
    float: left;
-
.isotope,
+
    color: #d1cab8;
-
.isotope .isotope-item {
+
    font-weight: bold;
-
-webkit-transition-duration: 0.8s;
+
    margin: 0 6px 0 0;
-
-moz-transition-duration: 0.8s;
+
-
-ms-transition-duration: 0.8s;
+
-
-o-transition-duration: 0.8s;
+
-
transition-duration: 0.8s;
+
}
}
-
 
+
.portfolio-navbar ul li a {
-
.isotope {
+
    display: block;
-
-webkit-transition-property: height, width;
+
    float: left;
-
-moz-transition-property: height, width;
+
    color: #37342d;
-
-ms-transition-property: height, width;
+
    padding: 0 6px 0 0;
-
-o-transition-property: height, width;
+
    font-weight: normal;
-
transition-property: height, width;
+
    font-size: 13px;
}
}
-
.isotope .isotope-item {
+
/* ----------------------------------------------------------
-
-webkit-transition-property: -webkit-transform, opacity;
+
* PORTFOLIO COLUMNS
-
-moz-transition-property:    -moz-transform, opacity;
+
* ----------------------------------------------------------*/
-
-ms-transition-property:    -ms-transform, opacity;
+
-
-o-transition-property:        top, left, opacity;
+
-
transition-property:        transform, opacity;
+
-
}
+
-
/**** Disabling Isotope CSS3 transitions ****/
+
ul.portfolio {
-
 
+
    margin: 0 0 10px 0;
-
.isotope.no-transition,
+
    padding: 0;
-
.isotope.no-transition .isotope-item,
+
    list-style-type: none;
-
.isotope .isotope-item.no-transition {
+
    list-style-position: outside;
-
-webkit-transition-duration: 0s;
+
    overflow: hidden;
-
-moz-transition-duration: 0s;
+
    width: 100%;
-
-ms-transition-duration: 0s;
+
    position: relative;
-
-o-transition-duration: 0s;
+
    display: block;
-
transition-duration: 0s;
+
}
}
 +
ul.portfolio li {
 +
    margin: 0 0 30px 0;
 +
    padding: 0;
 +
    float: left;
 +
    overflow: hidden;
 +
    position: relative;
 +
}
 +
ul.portfolio li a.image-holder { display: block; background: #fff; }
 +
ul.portfolio.third li { width: 31%; margin-right: 3.5%; }
 +
ul.portfolio.half li { width: 48%; margin-right: 4%; }
 +
ul.portfolio.third li a.image-holder { margin-bottom: 10px; height: 200px; z-index: 10; }
 +
ul.portfolio.third.notfull li a.image-holder { width: 230px; }
 +
ul.portfolio.half li a.image-holder { margin-bottom: 10px; height: 250px; z-index: 10; }
 +
ul.portfolio.half.notfull li a.image-holder { width: 355px; }
-
/* Disable CSS transitions for containers with infinite scrolling*/
+
ul.portfolio li.separator {
-
.isotope.infinite-scrolling {
+
    clear: left;
-
-webkit-transition: none;
+
    height: 1px;
-
-moz-transition: none;
+
    background: transparent url("https://static.igem.org/mediawiki/2013/e/e6/Separator-bkg.png") repeat-x bottom left;
-
-ms-transition: none;
+
    width: 100%;
-
-o-transition: none;
+
    margin: 0 0 30px 0;
-
transition: none;
+
    padding: 0;
}
}
-
 
+
ul.portfolio li .meta-data {
-
/*================================================= */
+
    background: transparent url("https://static.igem.org/mediawiki/2013/8/87/Nivo-caption-bkg.png") repeat left top;
-
/* About
+
    margin: 0;
-
================================================== */
+
    padding: 10px;
-
.clients {border: 1px solid #e1e1e1; background: #fff; width: 100%; margin: 0 0 20px 0;}
+
    text-align: center;
-
.team_img {border: 1px solid #e1e1e1; margin-bottom:15px;}
+
    clear: both;
-
.team {margin-bottom: 30px}
+
    font: bold 13px/18px Arial;
-
.team h4 {
+
    text-transform: uppercase;
-
font-size: 14px;
+
-
font-weight: bold;
+
-
letter-spacing: -0.5px;
+
-
color: #464646;
+
-
line-height: 17px;
+
}
}
 +
ul.portfolio li .meta-data a { color: #37342d; }
 +
ul.portfolio li .description {
 +
    background: rgb(235, 225, 204);
 +
    background: none repeat 0 0 rgba(235, 225, 204, 0.95);
 +
    padding: 20px;
 +
    position: absolute;
 +
    top: 0;
 +
    left: 0;
 +
    display: block;
 +
    opacity: 0;
 +
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 +
    z-index: 30;
 +
}
 +
ul.portfolio li .description span { display: block; padding-bottom: 20px; font: normal 13px/20px Georgia; color: #555; }
 +
ul.portfolio li .description em { font: italic 11px/16px Georgia; color: #917e4d; }
 +
ul.portfolio.third li .description { height: 200px; }
 +
ul.portfolio.half li .description { height: 250px; }
-
.team span {color: #777;}
 
-
.team p {padding-top: 8px;}
 
-
/*================================================= */
+
/* ----------------------------------------------------------
-
/* Footer
+
* WIDGETS
-
================================================== */
+
* ----------------------------------------------------------*/
-
#footer {background: #363636; margin: 0; color:#bbbbbb; padding: 5px 0; }
+
-
#footer p {line-height: 20px;}
+
-
#footer_bottom {background: #3f3f3f; border-top: 1px solid #484848;}
+
-
#footer-logo {height: 70px; margin: 5px 0 0 0;}
+
-
#footer h4 {
+
.widget { margin: 0 0 40px 0; overflow: visible !important; }
-
font-family: "Open Sans", Arial, sans-serif;
+
#content .widget .px-widget-title h3, #content .widget h3 {
-
font-size: 16px;
+
    font: bold 13px/18px Arial;
-
color:#fff;
+
    color: #c78c45;
-
font-weight: bold;
+
    text-transform: uppercase;
-
letter-spacing: -0.5px;
+
    margin-bottom: 18px;
-
display: block;
+
    background: none;
-
border-bottom: 1px solid #484848;
+
-
padding: 10px 0;
+
-
margin: 5px 0 15px 0;
+
}
}
-
 
+
#content .widget ul {
-
.copyright, .author-info {line-height: 50px; color: #aaa;}
+
    margin: 0;
-
.copyright a, .copyright span, .author-info a, .author-info span {color:#ffffff;}
+
    padding: 0;
-
.author-info {float: right;}
+
    list-style-type: none;
-
 
+
    list-style-position: outside;
-
/*================================================= */
+
    position: relative;
-
/* Footer - Social Icons
+
-
================================================== */
+
-
ul.social{
+
-
float: left;
+
-
width:100%;
+
-
margin-top: 18px;
+
}
}
-
ul.social li{
+
#content .widget ul li {
-
float:left;
+
    position: relative;
-
margin-right:5px;
+
    background: transparent url("https://static.igem.org/mediawiki/2013/e/e6/Separator-bkg.png") repeat-x left bottom;
-
width:27px;
+
-
height:27px;
+
-
display: block;
+
}
}
-
ul.social li a {
+
#content .widget ul li a {
-
-webkit-transition: opacity 120ms ease-in-out;
+
    position: relative;
-
-moz-transition: opacity 120ms ease-in-out;
+
    font: 12px/18px Arial;
-
-o-transition: opacity 120ms ease-in-out;
+
    color: #625d52;
-
transition: opacity 120ms ease-in-out;
+
    display: block;
-
float:left; width:27px; height:27px; display: block; -moz-opacity: 0.4;opacity: 0.4; filter:alpha(opacity=0.4);
+
    padding: 7px 8px 8px 12px;
 +
    width: 170px;
}
}
-
 
+
#content .widget ul li a:hover {
-
ul.social li a:hover {
+
    overflow: visible !important;
-
opacity: 1;
+
    color: #fff;
-
-moz-opacity: 1;
+
    font-weight: bold;
 +
    text-decoration: none;
 +
    background: transparent url("https://static.igem.org/mediawiki/2013/9/99/Sidebar-link-over-right.jpg") no-repeat left top scroll;
}
}
 +
#content .sidebar-right.margin { margin-right: 30px }
 +
#content .sidebar-right .widget ul li a:hover { background: transparent url("https://static.igem.org/mediawiki/2013/3/33/Sidebar-link-over-left.jpg") no-repeat left top scroll; padding-left: 26px; }
 +
#content .sidebar-right .px-widget-title { padding-left: 4px; }
 +
#content .widget.nohover ul li a:hover {
 +
    background: none;
 +
    color: #c78c45;
 +
    font-weight: normal;
 +
}
 +
#content .sidebar-right .widget.nohover ul li a:hover { padding-left: 12px; }
-
ul.social li.facebook a{background:url(../images/social_icons/facebook.png) no-repeat;}
 
-
ul.social li.twitter a{background:url(../images/social_icons/twitter.png) no-repeat;}
 
-
ul.social li.vimeo a{background:url(../images/social_icons/vimeo.png) no-repeat;}
 
-
ul.social li.linked a{background:url(../images/social_icons/linked.png) no-repeat;}
 
-
ul.social li.flickr a{background:url(../images/social_icons/flickr.png) no-repeat;}
 
-
ul.social li.behance a{background:url(../images/social_icons/behance.png) no-repeat;}
 
-
ul.social li.delicious a{background:url(../images/social_icons/delicious.png) no-repeat;}
 
-
ul.social li.deviantart a{background:url(../images/social_icons/deviantart.png) no-repeat;}
 
-
ul.social li.dribbble a{background:url(../images/social_icons/dribbble.png) no-repeat;}
 
-
ul.social li.forrst a{background:url(../images/social_icons/forrst.png) no-repeat;}
 
-
ul.social li.google a{background:url(../images/social_icons/google.png) no-repeat;}
 
-
ul.social li.lastfm a{background:url(../images/social_icons/lastfm.png) no-repeat;}
 
-
ul.social li.myspace a{background:url(../images/social_icons/myspace.png) no-repeat;}
 
-
ul.social li.picassa a{background:url(../images/social_icons/picassa.png) no-repeat;}
 
-
ul.social li.quik a{background:url(../images/social_icons/quik.png) no-repeat;}
 
-
ul.social li.reddit a{background:url(../images/social_icons/reddit.png) no-repeat;}
 
-
ul.social li.rss a{background:url(../images/social_icons/rss.png) no-repeat;}
 
-
/*================================================= */
 
-
/* Footer - Address
 
-
================================================== */
 
-
.address{color:#bbb; font-family: Tahoma,arial, sans-serif; padding-bottom:12px; line-height: 18px;}
 
-
.address img{float:left; padding-right:7px}
 
-
.address strong{font-weight:bold; color:#fff; display:block; float:left; padding-bottom:8px; padding-right:4px; font-family:Arial,Helvetica,sans-serif}
 
-
.address a{color:#75a500}
 
-
.address a:hover{color:#bbb}
 
-
/*================================================= */
+
/* ----------------------------------------------------------
-
/* Footer - Twitter Widget
+
* GALLERY
-
================================================== */
+
* ----------------------------------------------------------*/
-
#twitter {
+
 
-
font-size: 12px;
+
ul.gallery {
-
font-family: Tahoma, Arial, sans-serif;
+
    list-style-type: none;
-
float: left;
+
    list-style-position: outside;
-
display: block;
+
    margin: 0 0 10px 0;
-
color: #bbb;
+
    padding: 0;
-
margin-bottom: 20px;
+
    overflow: hidden;
 +
}
 +
ul.gallery li {
 +
    display: inline-block;
 +
    float: left;
 +
    margin: 0 8px 8px 0;
 +
}
 +
ul.gallery li a.image-holder { margin: 0; }
 +
ul.gallery li img {
 +
    display: block;
 +
    margin: 0;
 +
    float: left;
}
}
-
#twitter b a {color: #6b6b6b}
+
ul.gallery.small li { margin: 0 6px 6px 0; }
-
#twitter li {line-height: 18px;}
+
ul.gallery.small li img { border: 0; padding: 0; }
-
#twitter li:last-child {padding: 0; margin: 0;}
+
-
#twitter a {color: #75a500;}
+
-
#twitter a:hover {color: #bbb;}
+
-
/*================================================= */
+
.wrapper960 {
-
/* Footer - Flickr Widget
+
    width: 960px;
-
================================================== */
+
    margin: 0 auto;
-
.flickr-widget {margin-right: -6px}
+
-
 
+
-
.flickr-widget a {
+
-
float: left;
+
-
width: 42px;
+
-
height: 42px;
+
-
margin-right: 8px;
+
-
margin-bottom: 8px;
+
-
border: 3px solid #6b6b6b;
+
-
-webkit-transition: all 0.2s ease-in-out;
+
-
    -moz-transition: all 0.2s ease-in-out;
+
-
    -o-transition: all 0.2s ease-in-out;
+
-
    -ms-transition: all 0.2s ease-in-out;
+
-
    transition: all 0.2s ease-in-out;
+
}
}
-
 
-
.flickr-widget img {display: block;width: 100%;}
 
-
.flickr-widget a:hover {border-color: #c0c0c0;}
 
-
 
/*================================================= */
/*================================================= */
/* Back To Top
/* Back To Top
Line 992: Line 1,197:
width:45px;
width:45px;
height:45px;
height:45px;
-
background: url(../images/back_to_top_btn.png) no-repeat 50% 50%;
+
background: url("https://static.igem.org/mediawiki/2013/a/a1/Back_to_top.png") no-repeat 50% 50%;
background-color:#c0c0c0;
background-color:#c0c0c0;
-webkit-transition: all 0.1s ease-in-out;
-webkit-transition: all 0.1s ease-in-out;
Line 1,002: Line 1,207:
#backtotop a:hover {background-color: #81b600;}
#backtotop a:hover {background-color: #81b600;}
-
 
-
/*================================================= */
 
-
/* #Media Queries
 
-
================================================== */
 
-
/* Desktop 960 */
 
-
@media only screen and (min-width: 960px) {
 
-
.flexslider.home {height: 390px;}
 
-
.flexslider {min-height: 1px;}
 
-
.flexslider.blog {height: auto;}
 
-
#portfolio-wrapper {min-height: 600px;}
 
-
}
 
-
 
-
/* Smaller than standard 960 (devices and browsers) */
 
-
@media only screen and (max-width: 959px) {}
 
-
 
-
/* Tablet Portrait size to standard 960 (devices and browsers) */
 
-
@media only screen and (min-width: 768px) and (max-width: 959px) {
 
-
#tagline {font-size: 20px}
 
-
#navigation ul li a {font-size: 11px;}
 
-
#navigation ul ul li a {font-size: 12px;}
 
-
.testimonials_author {display: none;}
 
-
.flickr-widget a {height: 45px; width: 45px;}
 
-
.flickr-widget-blog a {height: 59px; width: 59px;}
 
-
.avatar {height: 40px; width: 40px;}
 
-
}
 
-
 
-
/* All Mobile Sizes (devices and browser) */
 
-
@media only screen and (max-width: 767px) {
 
-
#navigation {float: left; width: 100%}
 
-
#navigation select {display: block; float: left;}
 
-
#navigation ul {display: none;}
 
-
.slider-caption {display: none;}
 
-
.slider-caption-2 {display: none;}
 
-
#tagline {font-size: 20px}
 
-
.author-info {display: none}
 
-
.copyright {font-size: 11px;}
 
-
.mr-rotato-prev, .mr-rotato-next, .mr-rotato-disabled {margin-right: -10px;}
 
-
.flickr-widget {margin-bottom: 25px;}
 
-
.meta-blog h4 {padding-top: 0;margin-top: 0;}
 
-
#blog_widget_container {display: none;}
 
-
.portfolio-item-meta {margin: 0 0 25px 0}
 
-
#backtotop a {display: none;}
 
-
}
 
-
 
-
/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
 
-
@media only screen and (min-width: 480px) and (max-width: 767px) {
 
-
.flickr-widget a {height: 39px; width: 39px;}
 
-
.img-blog {float: left; width: 30%; margin: 0 15px 15px 0;}
 
-
.avatar {height: 35px; width: 35px;}
 
-
.contact_textarea {width: 94%; max-width: 94%;}
 
-
}
 
-
 
-
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
 
-
@media only screen and (max-width: 479px) {
 
-
.flickr-widget a {height: 47px; width: 47px;}
 
-
.img-blog {float: left; width: 30%; margin: 0 15px 15px 0;}
 
-
.meta-blog span, .meta-blog p {font-size: 11px; padding:0; line-height: 18px; margin: 0;}
 
-
.post-meta {display: none;}
 
-
.post h2 a {margin-bottom: 10px;}
 
-
.avatar {height: 25px; width: 25px;}
 
-
.contact_textarea {width: 92%; max-width: 92%;}
 
-
}
 
-
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
 
-
margin: 0;
 
-
padding: 0;
 
-
border: 0;
 
-
font-size: 100%;
 
-
font: inherit;
 
-
vertical-align: baseline; }
 
-
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
 
-
display: block; }
 
-
body {
 
-
line-height: 1; }
 
-
ol, ul {
 
-
list-style: none; }
 
-
blockquote, q {
 
-
quotes: none; }
 
-
blockquote:before, blockquote:after,
 
-
q:before, q:after {
 
-
content: '';
 
-
content: none; }
 
-
table {
 
-
border-collapse: collapse;
 
-
border-spacing: 0; }
 
-
 
-
 
-
/* #Basic Styles
 
-
================================================== */
 
-
body {
 
-
background: #fdfdfd;
 
-
font: 12px/21px Tahoma, Arial, sans-serif;
 
-
color: #676767;
 
-
-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
 
-
-webkit-text-size-adjust: 100%;
 
-
}
 
-
 
-
/* Basic Alginment
 
-
================================================== */
 
-
.columns img, .column img{max-width: 100%; height: auto;}
 
-
.content img{border: 1px solid #dfdfdf; margin-bottom: 15px;}
 
-
 
-
.align-left{float: left;}
 
-
.align-center{text-align: center;}
 
-
.align-right{float: right}
 
-
 
-
img.align-left{float: left; margin: 0 15px 12px 0;}
 
-
img.align-center{text-align: center; clear: both; margin: 15px auto; display: block;}
 
-
img.align-right{float: right; margin: 0 0 12px 15px;}
 
-
 
-
img, object, video {max-width: 100%; height: auto;display:block;}
 
-
img {width: auto;max-width: 100%; border: 0;-ms-interpolation-mode: bicubic;}
 
-
 
-
/* Flexible Embeds */
 
-
.embed {
 
-
    position: relative;
 
-
    padding: 0px;
 
-
    padding-bottom: 56.25%; /* 16/9 ratio */
 
-
    height: 0;
 
-
    overflow: hidden;
 
-
}
 
-
 
-
.embed iframe,
 
-
.embed object,
 
-
.embed embed {
 
-
    position: absolute;
 
-
    top: 0;
 
-
    left: 0;
 
-
    width: 100%;
 
-
    height: 100%;
 
-
}
 
-
 
-
.clearfix {content: "."; display: block; height: 0px; clear: both; visibility: hidden;}
 
-
.spacer {margin-top: 20px;}
 
-
 
-
/* #Typography
 
-
================================================== */
 
-
h1, h2, h3, h4, h5, h6 {
 
-
color: #464646;
 
-
font-family: "Open Sans", Arial, sans-serif;
 
-
font-weight: normal; }
 
-
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; }
 
-
h1 { font-size: 36px; line-height: 50px;}
 
-
h2 { font-size: 25px; line-height: 40px; }
 
-
h3 { font-size: 18px; line-height: 34px; }
 
-
h4 { font-size: 16px; line-height: 30px; }
 
-
h5 { font-size: 14px; line-height: 24px; }
 
-
h6 { font-size: 12px; line-height: 21px; }
 
-
.subheader { color: #777; }
 
-
 
-
p {}
 
-
p img { margin: 0; }
 
-
p.lead { font-size: 21px; line-height: 27px; color: #777;  }
 
-
 
-
em { font-style: italic; }
 
-
strong { font-weight: bold; color: #333; }
 
-
small { font-size: 80%; }
 
-
 
-
 
-
/* #Links
 
-
================================================== */
 
-
a, a:visited { color: #333; text-decoration: none; outline: 0;-webkit-transition: color 0.1s ease-in-out; -moz-transition: color 0.1s ease-in-out; -o-transition: color 0.1s ease-in-out; -transition: color 0.1s ease-in-out;}
 
-
a:hover, a:focus { color: #000; }
 
-
p a, p a:visited { line-height: inherit; }
 
-
 
-
 
-
/* #Lists
 
-
================================================== */
 
-
ul, ol { }
 
-
ul { list-style: none outside; }
 
-
ol { list-style: decimal; }
 
-
ol, ul.square, ul.circle, ul.disc {  }
 
-
ul.square { list-style: square outside; }
 
-
ul.circle { list-style: circle outside; }
 
-
ul.disc { list-style: disc outside; }
 
-
ul ul, ul ol,
 
-
ol ol, ol ul { margin: 4px 0 5px 30px; font-size: 90%;  }
 
-
ul ul li, ul ol li,
 
-
ol ol li, ol ul li { margin-bottom: 6px; }
 
-
li { line-height: 18px; margin-bottom: 12px; }
 
-
ul.large li { line-height: 21px; }
 
-
li p { line-height: 21px; }
 
-
 
-
/* #Images
 
-
================================================== */
 
-
 
-
img.scale-with-grid {
 
-
max-width: 100%;
 
-
height: auto; }
 
-
 
-
/* #Responsive Menu
 
-
================================================== */
 
-
select {
 
-
border: 0px;
 
-
padding: 6px 4px;
 
-
outline: none;
 
-
font: 13px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
 
-
color: #777;
 
-
margin: 0;
 
-
width: 210px;
 
-
cursor: pointer;
 
-
max-width: 100%;
 
-
display: block;
 
-
margin-bottom: 20px;
 
-
background: #fff; }
 
-
 
-
select{padding: 0;}
 
-
 
-
 
-
.container                                  { position: relative; width: 960px; margin: 0 auto; padding: 0; }
 
-
    .container .column,
 
-
    .container .columns                        { float: left; display: inline; margin-left: 10px; margin-right: 10px; }
 
-
    .row                                        { margin-bottom: 20px; }
 
-
 
-
    /* Nested Column Classes */
 
-
    .column.alpha, .columns.alpha              { margin-left: 0; }
 
-
    .column.omega, .columns.omega              { margin-right: 0; }
 
-
 
-
    /* Base Grid */
 
-
    .container .one.column,
 
-
    .container .one.columns                    { width: 40px;  }
 
-
    .container .two.columns                    { width: 100px; }
 
-
    .container .three.columns                  { width: 160px; }
 
-
    .container .four.columns                    { width: 220px; }
 
-
    .container .five.columns                    { width: 280px; }
 
-
    .container .six.columns                    { width: 340px; }
 
-
    .container .seven.columns                  { width: 400px; }
 
-
    .container .eight.columns                  { width: 460px; }
 
-
    .container .nine.columns                    { width: 520px; }
 
-
    .container .ten.columns                    { width: 580px; }
 
-
    .container .eleven.columns                  { width: 640px; }
 
-
    .container .twelve.columns                  { width: 700px; }
 
-
    .container .thirteen.columns                { width: 760px; }
 
-
    .container .fourteen.columns                { width: 820px; }
 
-
    .container .fifteen.columns                { width: 880px; }
 
-
    .container .sixteen.columns                { width: 940px; }
 
-
 
-
    .container .one-third.column                { width: 300px; }
 
-
    .container .two-thirds.column              { width: 620px; }
 
-
 
-
    /* Offsets */
 
-
    .container .offset-by-one                  { padding-left: 60px;  }
 
-
    .container .offset-by-two                  { padding-left: 120px; }
 
-
    .container .offset-by-three                { padding-left: 180px; }
 
-
    .container .offset-by-four                  { padding-left: 240px; }
 
-
    .container .offset-by-five                  { padding-left: 300px; }
 
-
    .container .offset-by-six                  { padding-left: 360px; }
 
-
    .container .offset-by-seven                { padding-left: 420px; }
 
-
    .container .offset-by-eight                { padding-left: 480px; }
 
-
    .container .offset-by-nine                  { padding-left: 540px; }
 
-
    .container .offset-by-ten                  { padding-left: 600px; }
 
-
    .container .offset-by-eleven                { padding-left: 660px; }
 
-
    .container .offset-by-twelve                { padding-left: 720px; }
 
-
    .container .offset-by-thirteen              { padding-left: 780px; }
 
-
    .container .offset-by-fourteen              { padding-left: 840px; }
 
-
    .container .offset-by-fifteen              { padding-left: 900px; }
 
-
 
-
 
-
/* #Tablet (Portrait)
 
-
================================================== */
 
-
 
-
    /* Note: Design for a width of 768px */
 
-
 
-
    @media only screen and (min-width: 768px) and (max-width: 959px) {
 
-
        .container                                  { width: 768px; }
 
-
        .container .column,
 
-
        .container .columns                        { margin-left: 10px; margin-right: 10px;  }
 
-
        .column.alpha, .columns.alpha              { margin-left: 0; margin-right: 10px; }
 
-
        .column.omega, .columns.omega              { margin-right: 0; margin-left: 10px; }
 
-
        .alpha.omega                                { margin-left: 0; margin-right: 0; }
 
-
 
-
        .container .one.column,
 
-
        .container .one.columns                    { width: 28px; }
 
-
        .container .two.columns                    { width: 76px; }
 
-
        .container .three.columns                  { width: 124px; }
 
-
        .container .four.columns                    { width: 172px; }
 
-
        .container .five.columns                    { width: 220px; }
 
-
        .container .six.columns                    { width: 268px; }
 
-
        .container .seven.columns                  { width: 316px; }
 
-
        .container .eight.columns                  { width: 364px; }
 
-
        .container .nine.columns                    { width: 412px; }
 
-
        .container .ten.columns                    { width: 460px; }
 
-
        .container .eleven.columns                  { width: 508px; }
 
-
        .container .twelve.columns                  { width: 556px; }
 
-
        .container .thirteen.columns                { width: 604px; }
 
-
        .container .fourteen.columns                { width: 652px; }
 
-
        .container .fifteen.columns                { width: 700px; }
 
-
        .container .sixteen.columns                { width: 748px; }
 
-
 
-
        .container .one-third.column                { width: 236px; }
 
-
        .container .two-thirds.column              { width: 492px; }
 
-
 
-
        /* Offsets */
 
-
        .container .offset-by-one                  { padding-left: 48px; }
 
-
        .container .offset-by-two                  { padding-left: 96px; }
 
-
        .container .offset-by-three                { padding-left: 144px; }
 
-
        .container .offset-by-four                  { padding-left: 192px; }
 
-
        .container .offset-by-five                  { padding-left: 240px; }
 
-
        .container .offset-by-six                  { padding-left: 288px; }
 
-
        .container .offset-by-seven                { padding-left: 336px; }
 
-
        .container .offset-by-eight                { padding-left: 384px; }
 
-
        .container .offset-by-nine                  { padding-left: 432px; }
 
-
        .container .offset-by-ten                  { padding-left: 480px; }
 
-
        .container .offset-by-eleven                { padding-left: 528px; }
 
-
        .container .offset-by-twelve                { padding-left: 576px; }
 
-
        .container .offset-by-thirteen              { padding-left: 624px; }
 
-
        .container .offset-by-fourteen              { padding-left: 672px; }
 
-
        .container .offset-by-fifteen              { padding-left: 720px; }
 
-
    }
 
-
 
-
 
-
/*  #Mobile (Portrait)
 
-
================================================== */
 
-
 
-
    /* Note: Design for a width of 320px */
 
-
 
-
    @media only screen and (max-width: 767px) {
 
-
        .container { width: 300px; }
 
-
        .container .columns,
 
-
        .container .column { margin: 0; }
 
-
 
-
        .container .one.column,
 
-
        .container .one.columns,
 
-
        .container .two.columns,
 
-
        .container .three.columns,
 
-
        .container .four.columns,
 
-
        .container .five.columns,
 
-
        .container .six.columns,
 
-
        .container .seven.columns,
 
-
        .container .eight.columns,
 
-
        .container .nine.columns,
 
-
        .container .ten.columns,
 
-
        .container .eleven.columns,
 
-
        .container .twelve.columns,
 
-
        .container .thirteen.columns,
 
-
        .container .fourteen.columns,
 
-
        .container .fifteen.columns,
 
-
        .container .sixteen.columns,
 
-
        .container .one-third.column,
 
-
        .container .two-thirds.column  { width: 300px; }
 
-
 
-
        /* Offsets */
 
-
        .container .offset-by-one,
 
-
        .container .offset-by-two,
 
-
        .container .offset-by-three,
 
-
        .container .offset-by-four,
 
-
        .container .offset-by-five,
 
-
        .container .offset-by-six,
 
-
        .container .offset-by-seven,
 
-
        .container .offset-by-eight,
 
-
        .container .offset-by-nine,
 
-
        .container .offset-by-ten,
 
-
        .container .offset-by-eleven,
 
-
        .container .offset-by-twelve,
 
-
        .container .offset-by-thirteen,
 
-
        .container .offset-by-fourteen,
 
-
        .container .offset-by-fifteen { padding-left: 0; }
 
-
 
-
    }
 
-
 
-
 
-
/* #Mobile (Landscape)
 
-
================================================== */
 
-
 
-
    /* Note: Design for a width of 480px */
 
-
 
-
    @media only screen and (min-width: 480px) and (max-width: 767px) {
 
-
        .container { width: 420px; }
 
-
        .container .columns,
 
-
        .container .column { margin: 0; }
 
-
 
-
        .container .one.column,
 
-
        .container .one.columns,
 
-
        .container .two.columns,
 
-
        .container .three.columns,
 
-
        .container .four.columns,
 
-
        .container .five.columns,
 
-
        .container .six.columns,
 
-
        .container .seven.columns,
 
-
        .container .eight.columns,
 
-
        .container .nine.columns,
 
-
        .container .ten.columns,
 
-
        .container .eleven.columns,
 
-
        .container .twelve.columns,
 
-
        .container .thirteen.columns,
 
-
        .container .fourteen.columns,
 
-
        .container .fifteen.columns,
 
-
        .container .sixteen.columns,
 
-
        .container .one-third.column,
 
-
        .container .two-thirds.column { width: 420px; }
 
-
    }
 
-
 
-
 
-
/* #Clearing
 
-
================================================== */
 
-
 
-
    /* Self Clearing Goodness */
 
-
    .container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
 
-
 
-
    /* Use clearfix class on parent to clear nested columns,
 
-
    or wrap each row of columns in a <div class="row"> */
 
-
    .clearfix:before,
 
-
    .clearfix:after,
 
-
    .row:before,
 
-
    .row:after {
 
-
      content: '\0020';
 
-
      display: block;
 
-
      overflow: hidden;
 
-
      visibility: hidden;
 
-
      width: 0;
 
-
      height: 0; }
 
-
    .row:after,
 
-
    .clearfix:after {
 
-
      clear: both; }
 
-
    .row,
 
-
    .clearfix {
 
-
      zoom: 1; }
 
-
 
-
    /* You can also use a <br class="clear" /> to clear columns */
 
-
    .clear {
 
-
      clear: both;
 
-
      display: block;
 
-
      overflow: hidden;
 
-
      visibility: hidden;
 
-
      width: 0;
 
-
      height: 0;
 
-
    }
 
-
 
-
.flex-container a:active,
 
-
.flexslider a:active,
 
-
.flex-container a:focus,
 
-
.flexslider a:focus  {outline: none;}
 
-
.slides,
 
-
.flex-control-nav,
 
-
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}
 
-
 
-
/* FlexSlider Necessary Styles
 
-
*********************************/
 
-
.flexslider {margin: 0; padding: 0;}
 
-
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
 
-
.flexslider .slides img {max-width: 100%; display: block;}
 
-
.flex-pauseplay span {text-transform: capitalize;}
 
-
 
-
/* Clearfix for the .slides element */
 
-
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
 
-
html[xmlns] .slides {display: block;}
 
-
* html .slides {height: 1%;}
 
-
 
-
/* No JavaScript Fallback */
 
-
/* If you are not using another script, such as Modernizr, make sure you
 
-
* include js that eliminates this class on page load */
 
-
.no-js .slides > li:first-child {display: block;}
 
-
 
-
 
-
/* FlexSlider Default Theme
 
-
*********************************/
 
-
.flexslider {position: relative;  zoom: 1;}
 
-
.flexslider .slides {zoom: 1;}
 
-
.flexslider .slides > li {position: relative;}
 
-
/* Suggested container for "Slide" animation setups. Can replace this with your own, if you wish */
 
-
.flex-container {zoom: 1; position: relative;}
 
-
 
-
/* Caption Style 1 */
 
-
.slider-caption {width: 30%; padding: 22px; margin: 0 0 20px 20px; position: absolute; left: 0; bottom: 0; background: url(../images/slider_caption_bg.png); color: #aaa; font-family: Tahoma, sans-serif; font-size: 12px; line-height: 19px;}
 
-
.slider-caption h3 {color: #fff; font-size: 16px; font-family: "Open Sans", Arial, sans-serif; font-weight: bold; letter-spacing: -0.5px; padding-bottom: 10px; margin:0; line-height: 22px; }
 
-
 
-
/* Caption Style 2 */
 
-
.slider-caption-2 {margin-left: 20px; position: absolute; left: 0; top: 40%; color: #fff; font-weight: bold; font-family: Arial, sans-serif; font-size: 12px; line-height: 19px;}
 
-
.slider-caption-2 h3 {padding: 8px 10px; color: #fff; font-size: 19px; font-family: "Open Sans", Arial, sans-serif; font-weight: bold; letter-spacing: -0.5px; margin:0; line-height: 22px; background:#81b600; display: inline-block;}
 
-
 
-
.slider-caption p, .slider-caption-2 p{line-height: 19px; }
 
-
.slider-caption-2 p{background: #363636; padding: 5px 10px;}
 
-
 
-
/* Control Nav */
 
-
.flex-control-nav {width: 100%; text-align: center; margin-top: 8px;}
 
-
.flex-control-nav li {margin: 0 0 0 3px; display: inline-block; zoom: 1; *display: inline;}
 
-
.flex-control-nav li:first-child {margin: 0;}
 
-
.flex-control-nav li a {width: 14px; height: 14px; display: block; background: url(../images/slider_nav.png) no-repeat; cursor: pointer; text-indent: -999em;}
 
-
.flex-control-nav li a:hover {background-position: 0 -0px;}
 
-
.flex-control-nav li a.active {background-position: 0 -14px; cursor: default;}
 

Latest revision as of 17:13, 27 September 2013

/* ------------------------------------------------------------------------------------ */ /* -------------------------------- BASIC STYLE RESET --------------------------------- */ /* ------------------------------------------------------------------------------------ */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {

   margin: 0;
   padding: 0;
   border: 0;
   font-weight: inherit;
   font-style: inherit;
   font-size: 100%;
   font-family: inherit;
   vertical-align: baseline;

}

html { overflow-x: hidden; }

/* Tables still need 'cellspacing="0"' in the markup. */ table { border-collapse: separate; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; } table, td, th { vertical-align: middle; }

/* Remove possible quote marks (") from <q>,
. */ blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } /* Remove annoying border on linked images. */ a img { border: none; } a { outline: none; } img { vertical-align: top; } .clearer { height: 0px; clear: both; } /* ------------------------------------------------------------------------------------ */ /* -------------------------------- MAIN STYLES DEFINITION ---------------------------- */ /* ------------------------------------------------------------------------------------ */ body { margin: 0; padding: 0; line-height: 20px; width: 100%; font-family: Arial, Verdana; font-size: 62.5%; cursor: default; color: #000000; background: #fff url("Bkg-pattern.jpg") repeat left top; } /* ---------------------------------------------------------- * HEADLINES * ----------------------------------------------------------*/ h1, h2, h3, h4, h5, h6 { margin: 0; padding: 2px 0 0 0; font-family: Arial; font-weight: normal; color: #37342d; margin-bottom: 30px; text-transform: uppercase; word-spacing: 2px; } h1, h1 a { font-size: 28px; line-height: 28px; } h2, h2 a { font-size: 24px; line-height: 27px; } h3, h3 a { font-size: 22px; line-height: 22px; } h4, h4 a { font-size: 20px; line-height: 20px; } h5, h5 a { font-size: 18px; line-height: 18px; } h6, h6 a { font-size: 16px; line-height: 16px; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { display: block; padding: 0; margin: 0; text-decoration: none !important; color: #37342d; overflow: visible; } h1.hashed, h2.hashed, h3.hashed, h4.hashed, h5.hashed, h6.hashed { background: transparent url("Separator-bkg.png") repeat-x left center scroll ; clear: both; } h1.hashed span, h2.hashed span, h3.hashed span, h4.hashed span, h5.hashed span, h6.hashed span { background: #fff url("Bkg-pattern.jpg") repeat left top scroll; padding: 0 10px 0 0; } .nocufon { padding: 0; } .subtitle { color: #37342d; font-weight: bold; margin-bottom: 20px; } h4.subtitle, h4.subtitle a { font-size: 16px; line-height: 16px; } h5.subtitle, h5.subtitle a { font-size: 14px; line-height: 14px; } h6.subtitle, h6.subtitle a { font-size: 12px; line-height: 12px; } span.colored { color: #ca9351; } h1 span.colored, h2 span.colored, h3 span.colored, h4 span.colored, h5 span.colored, h6 span.colored { color: #c0b294; } p { color: #37342d; font: 13px/21px Arial; padding-bottom: 26px; } a { color: #ca9351; text-decoration: none; } a:hover { text-decoration: underline; } img { background: transparent; padding: 0; margin: 0; /* margin-bottom: 20px;*/ display: inline-block; } img.icon { padding: 6px 18px 0 18px; margin: 0 0 10px 0; } img.clean { background: none; padding: 0; border: 0; } a.image-holder { position: relative; display: block; margin: 0 0 30px 0; padding: 0; overflow: hidden; } a.image-holder img { margin: 0; position: relative; z-index: 10; } a.image-holder .image-zoom { display: block; display: none; width: 100%; height: 100%; background: transparent url("Zoom-icon.png") no-repeat center; position: absolute; margin: 0; padding: 0; top: 0px; left: 0px; z-index: 20; overflow: hidden; } body .alignleft { float: left; margin-right: 24px; margin-bottom: 20px; } body .alignright { float: right; margin-left: 24px; margin-bottom: 20px; } body .aligncenter { margin: 0 auto; margin-bottom: 20px; display: block; } body .alignleft.margin-bottom, body .alignright.margin-bottom, body .aligncenter.margin-bottom { margin-bottom: 30px; } .red { color: #e35337; } em { font-style: italic; } input { outline: 0; } ul { list-style-type: square; list-style-position: outside; margin: 0 0 26px 20px; } ul li { font: 13px/25px Arial; } .separator { clear: both; height: 1px; width: auto; background: transparent url("Separator-bkg.png") repeat-x left top; margin-bottom: 40px; } blockquote { clear: both; } blockquote p { background: transparent url("Quotes.png") no-repeat left top; background-position: 0 6px; padding: 0 0 0 66px; margin: 0; font: italic 18px/25px "Times New Roman"; color: #37342d; } blockquote cite { margin: 12px 0 40px 0; padding: 10px 0 0 0; display: block; color: #c78c45; font: bold 14px "Times New Roman"; background: url("Separator-bkg.png") repeat-x top left transparent; } .preload { position: relative; overflow: hidden; } .preloading { background: #fcfbf9 url("20130923094421%21Loading.gif") no-repeat center; position: absolute; z-index: 20; width: 100%; height: 100%; } .preload img { visibility: hidden; } /* ---------------------------------------------------------- * FORM ELEMENTS * ----------------------------------------------------------*/ .form-details { color: #888172; font-size: 12px; float: right; text-align: right; margin-right: 162px; line-height: 40px; } label { display: block; color: #8c8c8c; font-size: 12px; padding: 4px 0; font-style: italic; } input, textarea { height: 16px; padding: 8px 10px 8px 10px; border: 1px solid #c3b598; font: 12px/16px Arial; color: #888172; margin: 0 0 20px 0; } textarea { height: auto; } input:focus, textarea:focus { border: 1px solid #eadcbf; outline: none; } /* ---------------------------------------------------------- * ROOT TEMPLATE DEFINITION * ----------------------------------------------------------*/
  1. root {
margin: 0; padding: 0; font: 13px/21px Arial; color: #37342d; } /* ---------------------------------------------------------- * HEADER DEFINITION * ----------------------------------------------------------*/
  1. header { position: relative; width: 960px; margin: 0 auto; }
  2. header .header-bar {
margin: 50px 0 50px 0; clear: both; height: 79px; background: transparent url("Header-bar-bkg.png") repeat-x left top; position: relative; }
  1. header #logo {
height: 128px; background: transparent url("Logo-bkg.png") repeat-x left top; padding: 0; margin: 0; display: block; width: auto; position: relative; vertical-align: top; top: -24px; left: 30px; float: left; }
  1. header #logo h1 {
position: relative; margin: 0; margin-top: 24px; left: -5px; right: -5px; top: 0; color: #fff; background: transparent url("Logo-fg.png") repeat-x left top; height: 54px; padding: 26px 5px 0 5px; width: 100%; display: block; font-size: 35px; } body.js-enabled #header #logo h1 {}
  1. header #logo h1 a {
font-size: 35px; color: #fff; display: block; padding: 0 20px; text-align: center; }
  1. header #logo h1 a:hover {
text-decoration: none; } /* ---------------------------------------------------------- * MAIN MENU DEFINITION * ----------------------------------------------------------*/ ul#menu { position: relative; right: 0; margin: 0; padding: 0; background: transparent; z-index: 50; overflow: visible; list-style-type: none; display: block; float: right; } ul#menu > li { display: inline-block; float: left; margin: 0; padding: 0; position: relative; } ul#menu > li > a { color: #777163; font: 15px/15px Arial; display: block; float: left; margin: 0 14px; height: 15px; padding: 12px 0; margin-top: 22px; vertical-align: top; text-transform: uppercase; } body.js-enabled ul#menu > li > a { margin-top: 25px; padding: 10px 0; } ul#menu > li > a:hover { color: #37342d; text-decoration: none; } ul#menu > li.current-menu-item > a, ul#menu > li.current_page_parent > a, ul#menu > li.current-menu-parent > a, ul#menu > li.current-menu-ancestor > a, ul#menu > li.current_page_ancestor > a { color: #37342d; } ul#menu > li.current-menu-item a:hover, ul#menu > li.current_page_parent a:hover, ul#menu > li.current-menu-parent a:hover, ul#menu > li.current-menu-ancestor a:hover, ul#menu > li.current_page_ancestor a:hover { } ul#menu li:hover > ul.sub-menu { display: block; } /* ---------------------------------------------------------- * SUBMENU * --------------------------------------------------------- */ ul#menu li ul.sub-menu { margin: 0; display: none; position: absolute; top: 60px; left: 0px; background: #fff; z-index: 50; border: 1px solid #f6e5cc; border-radius: 3px; box-shadow: 0 4px 5px rgba(0,0,0, .05); width: 180px; } ul#menu li ul.sub-menu li { margin: 0; position: relative; clear: both; display: block; width: 180px; padding: 0; } ul#menu li ul.sub-menu li a { position: relative; clear: both; display: block; cursor: pointer; border: 0; text-shadow: 0 0 0 transparent; background: transparent none; font-size: 12px; font-weight: normal; text-transform: none; color: #888172; width: 160px; height: 20px; line-height: 20px; padding: 8px 10px; text-align: left; border-top: 1px solid #f6e5cc; border-radius: 0; } ul#menu li ul.sub-menu li a.last, ul#menu li ul.sub-menu li:first-child > a { border-top: 0; } ul#menu li ul.sub-menu li a:hover { box-shadow: 0 0 0 transparent; border-radius: 0; color: #37342d; text-decoration: none; } ul#menu li ul.sub-menu li a.more { background: transparent url("Menu-item-more.png") no-repeat right center; background-position: 166px; } ul#menu li ul.sub-menu ul.sub-menu, ul#menu li ul.sub-menu ul.sub-menu ul.sub-menu { left: 160px; top: 8px; } /* ---------------------------------------------------------- * MEGAMENU * --------------------------------------------------------- */
  1. menu .pixel-mega-menu {
display: none; position: absolute; left: 0; top: 60px; min-width: 460px; border-radius: 0; }
  1. menu .pixel-mega-menu ul.sub-menu {
width: 100%; padding: 30px 20px 20px 20px; margin: 0; display: block; top: auto; left: auto; background: #fff; border-radius: 3px; border: 0; }
  1. menu .pixel-mega-menu > ul.sub-menu { border: 1px solid #f6e5cc; }
  2. menu .pixel-mega-menu > ul.sub-menu li ul.sub-menu {
padding: 0; background: none; position: relative; left: auto; top: auto; color: #555; overflow: hidden; box-shadow: 0 0 0 transparent; }
  1. menu .pixel-mega-menu > ul.sub-menu ul li {
margin: 0; color: #777; height: 24px; line-height: 23px; width: 90%; margin-left: 0px; }
  1. menu .pixel-mega-menu > ul.sub-menu > li a {
display: block; border: 0; padding: 0; margin: 0; height: auto; height: 30px; line-height: 30px; text-indent: 0; color: #888172; text-decoration: underline; }
  1. menu .pixel-mega-menu ul.sub-menu a:hover { background: none; color: #37342d; text-decoration: none; }
ul#menu li:hover > .pixel-mega-menu { display: block; }
  1. menu .pixel-mega-menu > ul.sub-menu > li {
clear: none; float: left; display: block; margin: 0; padding: 0; margin-bottom: 30px; width: 48%; margin-right: 2%; }
  1. menu .pixel-mega-menu > ul.sub-menu > li:last-child, #menu .pixel-mega-menu > ul.sub-menu > li.last {
width: 50%; margin-right: 0; }
  1. menu .pixel-mega-menu > ul.sub-menu li h4 {
font: 14px/18px Arial; color: #948d7c; border-bottom: 1px solid #f6e5cc; margin-bottom: 14px; padding: 0px 10px 4px 0; background: none; }
  1. menu .pixel-mega-menu > ul.sub-menu > li p {
padding-bottom: 10px; color: #999; color: #888172; font: italic 12px/20px Arial; }
  1. menu .pixel-mega-menu.two-columns { width: 460px; }
  2. menu .pixel-mega-menu.three-columns { width: 660px; }
  3. menu .pixel-mega-menu.four-columns { width: 920px; }
  4. menu .pixel-mega-menu.two-columns > ul.sub-menu > li { width: 48%; margin-right: 2%; }
  5. menu .pixel-mega-menu.three-columns > ul.sub-menu > li { width: 31%; margin-right: 2%; }
  6. menu .pixel-mega-menu.four-columns > ul.sub-menu > li { width: 23%; margin-right: 2%; }
  7. menu .pixel-mega-menu.two-columns > ul.sub-menu > li.last { width: 50%; margin-right: 0; }
  8. menu .pixel-mega-menu.three-columns > ul.sub-menu > li.last { width: 33%; margin-right: 0; }
  9. menu .pixel-mega-menu.four-columns > ul.sub-menu > li.last { width: 25%; margin-right: 0; }
  10. menu .pixel-mega-menu > ul.sub-menu > li.newline { clear: both; width: 100%; padding: 0; margin: 0; }
  11. menu .pixel-mega-menu > ul.sub-menu > li.half-column { width: 48%; margin-right: 2%; }
  12. menu .pixel-mega-menu > ul.sub-menu > li.third-column { width: 31%; margin-right: 2%; }
  13. menu .pixel-mega-menu > ul.sub-menu > li.two-thirds-column { width: 65%; margin-right: 2%; }
  14. menu .pixel-mega-menu > ul.sub-menu > li.half-column.last { width: 50%; margin-right: 0; }
  15. menu .pixel-mega-menu > ul.sub-menu > li.third-column.last { width: 33%; margin-right: 0; }
  16. menu .pixel-mega-menu > ul.sub-menu > li.two-thirds-column.last { width: 67%; margin-right: 0; }
  17. menu .pixel-mega-menu > ul.sub-menu > li.fourth-column { width: 23%; margin-right: 2%; }
  18. menu .pixel-mega-menu > ul.sub-menu > li.fourth-column.last { width: 25%; margin-right: 0; }
  19. menu .pixel-mega-menu > ul.sub-menu > li.full-column { width: 100%; margin-right: 0; }
  20. menu .pixel-mega-menu > ul.sub-menu > li.last { margin-right: 0; }
/* ---------------------------------------------------------- * SUBHEADER * --------------------------------------------------------- */
  1. subheader-bar { margin-bottom: 30px; background: transparent url("Separator-bkg.png") repeat-x bottom left; padding-bottom: 20px; overflow: hidden; }
  2. subheader-bar div.site-description { color: #37342d; font: italic 13px/18px Arial; margin-top: 8px; display: inline-block; float: left; }
  3. subheader-bar div.site-description h4 { margin: 0; padding: 0; font-style: normal; }
/* ---------------------------------------------------------- * MULTI COLUMNS * ----------------------------------------------------------*/ .multi-columns { clear: both; overflow: hidden; margin-bottom: 20px; } .multi-columns .multi-columns { clear: both; margin: 0; } .multi-columns .half { float: left; width: 48%; margin-right: 4%; } .multi-columns .third { float: left; width: 31%; margin-right: 3.5%; } .multi-columns .twothirds { float: left; width: 65.5%; margin-right: 3.5%; } .multi-columns .fourth { float: left; width: 22%; margin-right: 4%; }
  1. root .clearer { clear: both; }
  2. root .last { margin-right: 0; }
/* ---------------------------------------------------------- * CONTENT * --------------------------------------------------------- */
  1. content {
width: 960px; margin: 0 auto; padding: 0 0 30px 0; min-height: 300px; } /* ---------------------------------------------------------- * MAINAREA + SIDEBARS * ----------------------------------------------------------*/ .sidebar-left, .sidebar-right { float: left; width: 190px; margin: 0 0 40px 0; padding: 4px 10px 0 0; margin-right: 30px; background: transparent url("Sidebar-vert-sep-bkg.jpg") repeat-y right top scroll; } .mainarea-right, .mainarea-left, .mainarea-center { float: left; width: 730px; overflow: hidden; margin: 0; padding: 4px 0 20px 0; } .sidebar-right { float: right; margin: 0; background: transparent url("Sidebar-vert-sep-bkg.jpg") repeat-y left top scroll; padding: 4px 0 0 10px; } .mainarea-left { float: left; margin: 0 30px 0 0; } .mainarea-center { width: 500px; margin: 0 30px 0 0; float: left; } .sidebar-right.margin { float: left; } /* ---------------------------------------------------------- * CUSTOM HEADLINES * ----------------------------------------------------------*/ .custom-headline { font: 15px/18px Arial; text-transform: uppercase; color: #c78c45; margin-bottom: 26px; } /* ---------------------------------------------------------- * CUSTOM BUTTONS * --------------------------------------------------------- */ a.custom-button { display: inline-block; height: 34px; font: bold 13px/34px Arial; color: #fff; background: #fff url("Button-bkg.jpg") repeat-x center top; padding: 0 16px; border: 1px solid #aa9973; text-shadow: 0 1px 0 #948564; margin: 0 0 30px 0; box-shadow: inset 0 0 1px 0 #fee7b4; text-align: center; } a.custom-button:hover { text-decoration: none; background: #fff url("Button-bkg-over.jpg") repeat-x center top; box-shadow: inset 0 -10px 20px #b5a789; } a.more-button { display: inline-block; height: 23px; background: #c3b598 url("More-button-arrow.gif") no-repeat right center; padding: 0 26px 0 10px; color: #fff; font: italic 13px/22px Arial; margin: 0 0 30px 0; } a.more-button:hover { background: #6c675c url("More-button-arrow-over.gif") no-repeat right center; text-decoration: none; } /* ---------------------------------------------------------- * CALL TO ACTION BOX * --------------------------------------------------------- */ .cta-box { height: 59px; line-height: 79px; background: transparent url("Header-bar-bkg.png") repeat-x center top; overflow: hidden; padding: 20px 14px 0 14px; margin: 0 0 44px 0; } .cta-box p { color: #37342d; font: italic 25px/34px "Times New Roman"; margin: 0; padding: 0; } .cta-box a.custom-button { position: relative; top: -4px; float: right; font-size: 16px; line-height: 46px; width: 150px; height: 46px; margin: 0; } /* ---------------------------------------------------------- * NIVO SLIDER * --------------------------------------------------------- */ .px-slider-wrapper { position: relative; padding-bottom: 50px; margin-bottom: 44px; } .px-slider.nivoSlider img, .px-slider.nivoSliderThumbs img { display: none; } .px-slider .nivo-controlNav img { display: block; } .px-slider-wrapper.nodescr { padding: 0; margin-bottom: 30px; } .px-slider.nivoSlider, .px-slider.nivoSliderThumbs { width: 960px; height: 340px; position: relative; background: transparent url("20130923094421%21Loading.gif") no-repeat 50% 50%; } .mainareaSlider { width: 730px !important; background: transparent url("20130923094421%21Loading.gif") no-repeat 50% 50%; } .px-slider.nivoSlider .nivo-controlNav { position: absolute; bottom: 0px; right: 0px; background: #000; background: rgba(0, 0, 0, 0.5); overflow: hidden; padding: 8px 12px; width: auto; z-index: 10; } .px-slider.nivoSlider .nivo-controlNav a { display: block; float: left; margin-left: 8px; width: 6px; height: 6px; border-radius: 6px; text-indent: -9999px; background: #f6eee5; } .px-slider.nivoSlider .nivo-controlNav a:first-child { margin-left: 0; } .px-slider.nivoSlider .nivo-controlNav a.active { background: #dcb78d; } .px-slider.nivoSlider .nivo-caption { position: absolute; bottom: -46px; height: 40px; line-height: 40px; background: transparent url("Nivo-caption-bkg.png") repeat top left; } .px-slider.nivoSlider .nivo-caption p { line-height: 40px; padding: 0 10px; font-size: 13px; color: #242320; } .px-slider.nivoSlider .nivo-caption p span.caption-title { color: #242320; padding: 0 20px 0 10px; font: bold 13px Arial; text-transform: uppercase; } .px-slider.nivoSlider .nivo-directionNav { position: absolute; left: 0; top: 50%; margin-top: -20px; right: 10px; display: block; width: 100%; height: 40px; } .px-slider.nivoSlider .nivo-directionNav a { display: block; top: 0; width: 69px; height: 40px; text-indent: -9999px; } .px-slider.nivoSlider .nivo-directionNav a.nivo-prevNav { background: transparent url("Nivo-nav-left.png") no-repeat left top; left: -24px; } .px-slider.nivoSlider .nivo-directionNav a.nivo-nextNav { background: transparent url("Nivo-nav-right.png") no-repeat left top; right: -24px; } /* THUMBNAILS */ .px-slider.nivoSliderThumbs .nivo-controlNav { left: 0; bottom: -62px; background: none; background: #000; background: #000 url("Slider-thumbs-bkg.png") repeat-x top left; height: 60px; margin: 0; padding: 1px; overflow: hidden; } .px-slider.nivoSliderThumbs .nivo-controlNav a { width: 80px; height: 60px; margin: 0 0 0 1px; background: transparent; border-radius: 0; } .px-slider.nivoSliderThumbs .nivo-controlNav a:first-child { margin-left: 0; } .px-slider-wrapper.thumbs { margin-bottom: 90px; } .px-slider.nivoSliderThumbs .nivo-controlNav a.active { background: transparent; } .px-slider.nivoSliderThumbs .nivo-caption { bottom: -106px; } /* ---------------------------------------------------------- * ROUNDABOUT SLIDER * --------------------------------------------------------- */ .px-slider.circles ul { position: relative; top: 0; display: block; list-style-type: none; list-style-position: outside; margin: 0 auto; padding: 0; width: 100%; width: 760px; z-index: 0; } body.js-enabled .px-slider.circles ul { margin: 0 auto 80px auto; } .px-slider.circles ul li { display: inline-block; float: left; width: 400px; margin: 0 20px 20px 0; } .circles .roundabout-holder { list-style: none; padding: 0; margin: 0 auto; height: 370px; width: 760px; } .circles .roundabout-moveable-item { height: 360px; width: 400px; cursor: pointer; } .circles .roundabout-moveable-item img { width: 100%; height: 100%; padding: 0; border: 0; margin: 0; background: none; border-radius: 6px; overflow: hidden; } .circles .roundabout-moveable-item a { position: relative; border-radius: 6px; width: 100%; height: 100%; overflow: hidden; display: block; background: #eee; border: 1px solid #fff; } .circles .roundabout-moveable-item.roundabout-in-focus a { border: 1px solid #fff; } .circles .roundabout-moveable-item span { position: relative; width: 100%; padding: 14px 0; display: block; text-align: center; font: bold 0.9em/24px Arial; text-transform: uppercase; color: #e5c8a6; } .circles .roundabout-moveable-item.roundabout-in-focus span { color: #ab7b40; } .circles .roundabout-in-focus { cursor: auto; } /* ---------------------------------------------------------- * BLOG * ----------------------------------------------------------*/ .large-post { overflow: hidden; margin: 0 0 10px 0; padding: 0; } .large-post .meta-column { width: 35%; float: left; margin-right: 4%; } .large-post .content-column { width: 59%; float: left; } .large-post .meta-column h2.nocufon { margin: 0 0 8px 0; padding: 0 0 14px 0; background: url("Separator-bkg.png") repeat-x bottom left transparent; } .large-post .meta-column h2.nocufon a { color: #c78c45; } .large-post .meta-column h2.nocufon a:hover { color: #b0752e; text-decoration: none; } .large-post .meta-column div.meta-data, ul.post-list li .meta-data { color: #37342d; font-size: 11px; height: 19px; overflow: hidden; } .large-post .meta-column div.meta-data a, ul.post-list li .meta-data a { color: #37342d; font-weight: bold; font-size: 11px; } .large-post .meta-column div.meta-data .author, ul.post-list li .meta-data .author { height: 19px; padding: 0 14px 0 0; background: url("Post-meta-sep.jpg") no-repeat right top transparent; } .large-post .meta-column div.meta-data .comments, ul.post-list li .meta-data .comments { padding: 0 10px; height: 19px; } ul.post-list { margin: 0 0 20px 0; padding: 0; list-style-type: none; list-style-position: outside; overflow: hidden; } ul.post-list li { padding: 0; margin: 0; float: left; width: 48%; margin-right: 4%; overflow: hidden; } ul.post-list li .post-title { background: transparent url("Nivo-caption-bkg.png") repeat left top; margin: 0; padding: 10px; text-align: center; clear: both; font: bold 13px/18px Arial; text-transform: uppercase; } ul.post-list li .post-title a { color: #37342d; } ul.post-list li .meta-data { text-align: center; padding: 14px 0; margin: 0 0 16px 0; background: url("Separator-bkg.png") repeat-x bottom left transparent; } ul.post-list li.separator { width: 100%; clear: both; margin: 0 0 30px 0; } .post-navigator { margin: 0 0 30px 0; padding: 30px 0 0 0; overflow: hidden; background: url("Separator-bkg.png") repeat-x top left transparent; } .post-navigator a { min-height: 20px; font: italic 17px/25px Georgia; vertical-align: top; color: #37342d; display: block; padding: 0; width: 250px; } .post-navigator a:hover { color: #c78c45; text-decoration: none; } .post-navigator a.prev { float: left; background: url("Prev-posts.png") no-repeat left center; padding-left: 20px; text-align: left; } .post-navigator a.next { float: right; background: url("Next-posts.png") no-repeat right center; padding-right: 20px; text-align: right; } .post-navigator a.prev:hover { float: left; background: url("Prev-posts-over.png") no-repeat left center; } .post-navigator a.next:hover { float: right; background: url("Next-posts-over.png") no-repeat right center; } /* ---------------------------------------------------------- * COMMENTS * ----------------------------------------------------------*/ ul.commentlist { margin: 0 0 20px 0; padding: 0; overflow: hidden; list-style-type: none; list-style-position: outside; } ul.commentlist li .comment-content, ul.commentlist li ul.children .comment-content { background: url("Separator-bkg.png") repeat-x top left; padding-top: 30px; margin: 0; overflow: hidden; } ul.commentlist li:first-child > .comment-content { border-top: 0; background: none; padding-top: 0; } ul.commentlist li ul.children { padding-left: 20px; list-style-type: none; list-style-position: outside; margin: 0; } ul.commentlist li img { padding: 3px; background: #fff; float: left; } ul.commentlist li .comment-body { overflow: hidden; margin-left: 90px; } ul.commentlist li .comment-body .meta-data .author { font: bold 13px/20px Arial; color: #000; margin-right: 4px; padding-right: 8px; background: url("Dot-bkg.gif") no-repeat right center transparent; } ul.commentlist li .comment-body .meta-data, ul.commentlist li .comment-body .meta-data a { color: #000; font: normal 13px/20px Arial; margin-bottom: 14px; } ul.commentlist li .comment-body .meta-data a.comment-reply-link { color: #b76552; margin-left: 20px; } /* ---------------------------------------------------------- * RECENT WORK BOX * --------------------------------------------------------- */ .recent-work .custom-headline { margin-bottom: 10px; } /* ---------------------------------------------------------- * PORTFOLIO * ----------------------------------------------------------*/ .portfolio-navbar { overflow: hidden; margin: 0 0 36px 0; padding: 0; } .portfolio-navbar ul { margin: 0; padding: 0; list-style-type: none; list-style-position: outside; overflow: hidden; } .portfolio-navbar ul li { display: inline-block; float: left; color: #d1cab8; font-weight: bold; margin: 0 6px 0 0; } .portfolio-navbar ul li a { display: block; float: left; color: #37342d; padding: 0 6px 0 0; font-weight: normal; font-size: 13px; } /* ---------------------------------------------------------- * PORTFOLIO COLUMNS * ----------------------------------------------------------*/ ul.portfolio { margin: 0 0 10px 0; padding: 0; list-style-type: none; list-style-position: outside; overflow: hidden; width: 100%; position: relative; display: block; } ul.portfolio li { margin: 0 0 30px 0; padding: 0; float: left; overflow: hidden; position: relative; } ul.portfolio li a.image-holder { display: block; background: #fff; } ul.portfolio.third li { width: 31%; margin-right: 3.5%; } ul.portfolio.half li { width: 48%; margin-right: 4%; } ul.portfolio.third li a.image-holder { margin-bottom: 10px; height: 200px; z-index: 10; } ul.portfolio.third.notfull li a.image-holder { width: 230px; } ul.portfolio.half li a.image-holder { margin-bottom: 10px; height: 250px; z-index: 10; } ul.portfolio.half.notfull li a.image-holder { width: 355px; } ul.portfolio li.separator { clear: left; height: 1px; background: transparent url("Separator-bkg.png") repeat-x bottom left; width: 100%; margin: 0 0 30px 0; padding: 0; } ul.portfolio li .meta-data { background: transparent url("Nivo-caption-bkg.png") repeat left top; margin: 0; padding: 10px; text-align: center; clear: both; font: bold 13px/18px Arial; text-transform: uppercase; } ul.portfolio li .meta-data a { color: #37342d; } ul.portfolio li .description { background: rgb(235, 225, 204); background: none repeat 0 0 rgba(235, 225, 204, 0.95); padding: 20px; position: absolute; top: 0; left: 0; display: block; opacity: 0; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; z-index: 30; } ul.portfolio li .description span { display: block; padding-bottom: 20px; font: normal 13px/20px Georgia; color: #555; } ul.portfolio li .description em { font: italic 11px/16px Georgia; color: #917e4d; } ul.portfolio.third li .description { height: 200px; } ul.portfolio.half li .description { height: 250px; } /* ---------------------------------------------------------- * WIDGETS * ----------------------------------------------------------*/ .widget { margin: 0 0 40px 0; overflow: visible !important; }
  1. content .widget .px-widget-title h3, #content .widget h3 {
font: bold 13px/18px Arial; color: #c78c45; text-transform: uppercase; margin-bottom: 18px; background: none; }
  1. content .widget ul {
margin: 0; padding: 0; list-style-type: none; list-style-position: outside; position: relative; }
  1. content .widget ul li {
position: relative; background: transparent url("Separator-bkg.png") repeat-x left bottom; }
  1. content .widget ul li a {
position: relative; font: 12px/18px Arial; color: #625d52; display: block; padding: 7px 8px 8px 12px; width: 170px; }
  1. content .widget ul li a:hover {
overflow: visible !important; color: #fff; font-weight: bold; text-decoration: none; background: transparent url("Sidebar-link-over-right.jpg") no-repeat left top scroll; }
  1. content .sidebar-right.margin { margin-right: 30px }
  2. content .sidebar-right .widget ul li a:hover { background: transparent url("Sidebar-link-over-left.jpg") no-repeat left top scroll; padding-left: 26px; }
  3. content .sidebar-right .px-widget-title { padding-left: 4px; }
  4. content .widget.nohover ul li a:hover {
background: none; color: #c78c45; font-weight: normal; }
  1. content .sidebar-right .widget.nohover ul li a:hover { padding-left: 12px; }
/* ---------------------------------------------------------- * GALLERY * ----------------------------------------------------------*/ ul.gallery { list-style-type: none; list-style-position: outside; margin: 0 0 10px 0; padding: 0; overflow: hidden; } ul.gallery li { display: inline-block; float: left; margin: 0 8px 8px 0; } ul.gallery li a.image-holder { margin: 0; } ul.gallery li img { display: block; margin: 0; float: left; } ul.gallery.small li { margin: 0 6px 6px 0; } ul.gallery.small li img { border: 0; padding: 0; } .wrapper960 { width: 960px; margin: 0 auto; } /*================================================= */ /* Back To Top ================================================== */
  1. backtotop {
position: fixed; right:0px; display:none; bottom: 20px; margin: 0 20px 0 0; }
  1. backtotop a {
text-decoration:none; border:0 none; display:block; width:45px; height:45px; background: url("Back_to_top.png") no-repeat 50% 50%; background-color:#c0c0c0; -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; -ms-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; }
  1. backtotop a:hover {background-color: #81b600;}