"

From 2014.igem.org

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend { font-family:Verdana, Geneva, sans-serif; margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent } body { line-height:1 } ol, ul { list-style:none } blockquote, q { quotes:none } blockquote:before, blockquote:after, q:before, q:after { content:; content:none }

focus {

outline:0 } ins { text-decoration:none } del { text-decoration:line-through } table { border-collapse:collapse; border-spacing:0 } .clear { clear:both; display:block; overflow:hidden; visibility:hidden; width:0; height:0 } .clearfix:after { clear:both; content:' '; display:block; font-size:0; line-height:0; visibility:hidden; width:0; height:0 } .clearfix { display:inline-block }

• html .clearfix {

height:1% } .clearfix { display:block } th, td { margin:0; padding:0 } table { border-collapse:collapse; border-spacing:0 } .clear { clear: both; } br { line-height: 10px; } input[type="submit"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner {

border : 0px;

} input[type="submit"]:focus, input[type="button"]:focus { outline : none; } /*-----------------------------------------------------------------------------------*/ /* GENERAL /*-----------------------------------------------------------------------------------*/

body { background: #1a1a1a; color: #4d4d4d; font-family: 'PTSansRegular'; font-size: 14px; } p {

font-size: 14px; line-height: 20px; } a { color: #4d87ab; text-decoration: none; -webkit-transition:all 200ms ease-in; -moz-transition:all 200ms ease-in; } a:hover { color: #d3573e; } h1, h2, h3, h4, h5, h6 { font-family: 'Museo500'; color: #4d87ab; font-weight: normal; padding-bottom: 12px; } h1 { font-size: 22px; line-height: 26px; } h2 { font-size: 20px; line-height: 24px; } h3 { font-size: 18px; line-height: 22px; } h4 { font-size: 16px; line-height: 20px; } h5 { font-size: 14px; line-height: 20px; } h6 { font-size: 12px; line-height: 18px; } .caps { text-transform: uppercase; } ul { font-family: 'CharisSILItalic'; line-height: 20px; font-size: 14px; } ul li { background: transparent url(bullet.png) center left no-repeat; padding-left: 15px; } ol { font-family: 'CharisSILItalic'; font-size: 14px; list-style: decimal; list-style-position: inside; line-height: 20px; } ol li { padding: 0; margin: 0; } .intro { font-family: 'CharisSILItalic'; font-size: 21px; line-height: 31px; text-align: center; margin-bottom: -2px; } blockquote { font-family: 'CharisSILItalic'; font-size: 18px; font-weight: normal; line-height: 25px; padding-left: 30px; background: transparent url(quote.png) no-repeat left 7px; } .hr2 { border-top: 3px solid #454545; height: 4px; border-bottom: 1px solid #454545; margin: 36px 0; } .hr1 { height: 0; border-bottom: 1px solid #454545; margin: 36px 0; } .center { text-align: center; display: block; margin: 0 auto; } p .center { text-align: center; display: block; margin: 0 auto 10px; } img { display: block; } img.left { float: left; margin: 10px 10px 5px 0; } img.right { float: right; margin: 10px 0 5px 10px; } .lite1 { color: #4d87ab; } .lite2 { border-bottom: 1px dotted #4d87ab; } a.button { background: #5499c3 url(button.png) repeat-x; border: none; height: 15px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; color: #fff; font-family: 'CharisSILItalic'; font-size: 14px; padding: 6px 15px 6px 15px; margin: 10px 0; display: inline-block; -webkit-transition:all 200ms ease-in; -o-transition:all 200ms ease-in; -moz-transition:all 200ms ease-in; } /* Webkit Fix */ @media screen and (-webkit-min-device-pixel-ratio:0) { a.button {padding: 5px 15px 7px 15px;} }

/* Opera Fix */ @media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) { a.button {padding: 5px 15px 7px 15px;}

}

a.button.blue { background-color: #5499c3; }

a.button.green { background-color: #4dab96; }

a.button.lime { background-color: #92ab4d; }

a.button.red { background-color: #ab4d63; }

a.button.purple { background-color: #8d4dab; }

a.button.blue:hover { color: #fff; background-color: #ab4d63; }

a.button.green:hover { color: #fff; background-color: #ab4d63; }

a.button.lime:hover { color: #fff; background-color: #ab4d63; }

a.button.red:hover { color: #fff; background-color: #4d87ab; }

a.button.purple:hover { color: #fff; background-color: #4dab96; }

.dropcap { display:block; float:left; font-size:45px; padding:0; margin: 0; margin:10px 8px 3px 0; font-family: 'Museo500'; } pre { margin: 5px 0px 40px 0px; padding: 0 10px 0px 10px; display: block; clear: both; background: url(codebg.jpg) repeat; line-height: 20px; font-size: 12px; border: 1px solid #cfcfcf; } .download-box, .warning-box, .info-box, .note-box { clear:both; margin: 10px 0px; text-shadow: none; padding: 15px 15px 13px 15px; line-height: 17px; } .info-box { background:#c2ddf9; border:1px solid #80bbef; color:#4783b7; } .warning-box { background:#ffcccc; border:1px solid #ff9999; color:#c31b00; } .download-box { background:#d1f7b6; border:1px solid #8bca61; color:#5e9537; } .note-box { background:#fdebae; border:1px solid #e6c555; color:#9e660d; }

/*-----------------------------------------------------------------------------------*/ /* LAYOUT /*-----------------------------------------------------------------------------------*/

1. wrapper {

width: 960px; margin: 0 auto; }

1. header {

padding: 30px 0 25px 0; display: block; overflow: hidden; position: relative; } .logo { float: left; } .social { float: right; position: absolute; bottom: 25px; right: 0; } .social ul li { float: left; margin-left: 1px; background: none; padding: 0; }

1. container {

width: 900px; margin: 20px auto; padding: 30px; overflow: hidden; background-color: #fff; position: relative; -webkit-box-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.6); -moz-box-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.6); box-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.6); }

1. copyright {

width: 900px; margin: 20px auto; padding: 17px 30px 13px; background-color: #fff; -webkit-box-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.6); -moz-box-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.6); box-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.6); }

1. copyright p {

font-size: 12px; text-align: center; }

1. footer {

padding: 40px 0 0 0; overflow: hidden; }

1. footer h3 {

margin-bottom: 5px; } .footer-top { border-top: 3px solid #454545; height: 4px; border-bottom: 1px solid #454545; margin: 0 0 36px 0; } ul.latest-posts { margin-bottom: -15px; overflow: hidden; padding-left: 2px; } ul.latest-posts li { padding: 0; background: none; font-family: 'PTSansRegular'; font-style: normal; font-size: 14px; padding-top: 10px; margin-bottom: 10px; border-top: 1px dashed #454545; } ul.latest-posts li a { color: #4d4d4d; } ul.latest-posts li a:hover { color: #d3573e; } ul.latest-posts li:first-child { padding: 0; border: none; } ul.latest-posts li span.date { float: left; font-family: 'CharisSILItalic'; padding-right: 15px; padding-top: 2px; text-align: center; color: #3d3d3d; font-style: normal; } ul.latest-posts li em.day { font-size: 25px; font-style: normal; } ul.latest-posts li em.month { font-size: 13px; text-transform: uppercase; display: block; line-height: 8px; margin-top: 1px; font-style: normal; } ul.flickr { margin-right: -40px; margin-bottom: -20px; overflow: hidden; display: block; padding: 0; } ul.flickr li { padding: 0; background: none; display: inline-block; background-color: #fff; padding: 0; margin: 0 8px 8px 0; } ul.flickr li img { width: 58px; height: 58px; padding: 0; } /*-----------------------------------------------------------------------------------*/ /* MENU /*-----------------------------------------------------------------------------------*/

.menu { font-family: 'Museo500'; list-style: none; font-weight: normal; width: 960px; padding: 0; background: #FFF; -webkit-box-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.6); -moz-box-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.6); box-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.6); z-index: 1000; position: relative; } .menu ul { margin: 0; list-style-type: none; font-family: 'Museo500'; font-style: normal; letter-spacing: normal; } .menu ul li { position: relative; display: inline; float: left; padding: 0; background: none; } .menu ul li a { display: block; padding: 20px 30px; text-decoration: none; display:block; line-height: 1; border-right: 1px solid #b4b4b4; font-size: 14px; }

/* Webkit Fix */ @media screen and (-webkit-min-device-pixel-ratio:0) { .menu ul li a {padding: 21px 30px 19px;} }

• html .menu ul li a {

display: inline-block; } .menu ul li a:link, .menu ul li a:visited { color: #4d4d4d; } .menu ul li a.active { color: #4d87ab; } .menu ul li a.selected { background: #fff; color: #4d87ab; } .menu ul li a:hover { background: #fff; color: #4d87ab; } .menu ul li ul { position: absolute; left: 0; display: none; visibility: hidden; width: 180px; padding: 0; border-radius:0 0 0.5em 0.5em; background-color: #fff; } .menu ul li ul li { display: list-item; float: none; padding: 0 17px; } .menu ul li ul li:first-child a { border: none; } .menu ul li ul li ul { top: 0; } .menu ul li ul li a { margin: 0; border: none; padding: 17px 0; line-height: 1; border-top: 1px solid #b4b4b4; font-size: 12px; }

• html .menu {

height: 1%; } .quote { clear: both; overflow: hidden; margin-bottom: 25px; } .quote blockquote { background: #FFF url(quote.png) no-repeat 15px 15px; padding: 15px 15px 15px 40px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-bottom: 10px; border:1px solid #dedede; } .quote span { float: right; } .quote em { font-family: 'CharisSILItalic'; font-style: normal; }

1. piecemaker {

margin-top: -30px; } /*-----------------------------------------------------------------------------------*/ /* SHOWCASE /*-----------------------------------------------------------------------------------*/

1. awOnePageButton .view-slide {

display: none; } .showcase-load { height: 470px; /* Same as showcase javascript option */ overflow: hidden; }

.showcase-onepage { /**/ } .showcase { position: relative; margin: 0 auto 33px auto; height: 426px; } .showcase-content-container { background-color: #000; } .showcase-arrow-previous, .showcase-arrow-next { position: absolute; top: 50%; margin-top: -9px; background: url('arrows.png'); width: 25px; height: 25px; cursor: pointer; } .showcase-arrow-previous { background-position: 0 0; } .showcase-arrow-previous:hover { background-position: 0 -25px; } .showcase-arrow-next { background-position: 25px 0; } .showcase-arrow-next:hover { background-position: -25px -25px; } .showcase-content { background-color: #000; text-align: center; } .showcase-content-wrapper { text-align: center; height: 400px; width: 900px; display: table-cell; vertical-align: middle; } .showcase-plus-anchor { background-image: url('plus.png'); background-repeat: no-repeat; } .showcase-plus-anchor:hover { background-position: -32px 0; } div.showcase-tooltip { background-color: #fff; color: #000; text-align: left; padding: 5px 8px; background-image: url(white-opacity-80.png); } .showcase-caption { color: #000; padding: 9px 15px 7px 15px; text-align: left; position: absolute; bottom: 10px; left: 10px; display: none; width: auto; background-image: url(white-opacity-80.png); } .showcase-onepage .showcase-content { margin-bottom: 10px; } .showcase-button-wrapper { clear: both; margin-top: 15px; text-align: center; position: relative; margin-right:-7px; } .showcase-button-wrapper span { cursor: pointer; margin: 3px 7px 0 0; width: 12px; height: 12px; text-indent: -99999px; display: inline-block; background: url('navs.png'); } .showcase-button-wrapper span:hover, .showcase-button-wrapper span.active { background-position: 0 -12px; } .showcase-thumbnail-container /* Used for backgrounds, no other styling!!! */ { background-color: #000; } .showcase-thumbnail-wrapper { overflow: hidden; } .showcase-thumbnail { width: 120px; height: 90px; cursor: pointer; border: solid 1px #333; position: relative; } .showcase-thumbnail-caption { position: absolute; bottom: 2px; padding-left: 10px; padding-bottom: 5px; } .showcase-thumbnail-content { padding: 10px; text-align: center; padding-top: 25px; } .showcase-thumbnail-cover { background-image: url(black-opacity-40.png); position: absolute; top: 0; bottom: 0; left: 0; right: 0; } .showcase-thumbnail:hover { border: solid 1px #999; } .showcase-thumbnail:hover .showcase-thumbnail-cover { display: none; } .showcase-thumbnail.active { border: solid 1px #999; } .showcase-thumbnail.active .showcase-thumbnail-cover { display: none; } .showcase-thumbnail-wrapper-horizontal { padding: 10px; } .showcase-thumbnail-wrapper-horizontal .showcase-thumbnail { margin-right: 10px; width: 116px; } .showcase-thumbnail-wrapper-vertical { padding: 10px; } .showcase-thumbnail-wrapper-vertical .showcase-thumbnail { margin-bottom: 10px; } .showcase-thumbnail-button-backward, .showcase-thumbnail-button-forward { padding: 7px; cursor: pointer; } .showcase-thumbnail-button-backward { padding-bottom: 0px; padding-right: 0px; } .showcase-thumbnail-button-backward .showcase-thumbnail-vertical, .showcase-thumbnail-button-forward .showcase-thumbnail-vertical, .showcase-thumbnail-button-forward .showcase-thumbnail-horizontal, .showcase-thumbnail-button-backward .showcase-thumbnail-horizontal { background-image: url(arrows-small.png); background-repeat: no-repeat; display: block; width: 17px; height: 17px; } .showcase-thumbnail-button-backward .showcase-thumbnail-vertical { background-position: 0 -51px; margin-left: 55px; } .showcase-thumbnail-button-backward:hover .showcase-thumbnail-vertical { background-position: -17px -51px; } .showcase-thumbnail-button-forward .showcase-thumbnail-vertical { background-position: 0 -34px; margin-left: 55px; } .showcase-thumbnail-button-forward:hover .showcase-thumbnail-vertical { background-position: -17px -34px; } .showcase-thumbnail-button-backward .showcase-thumbnail-horizontal { background-position: 0 -17px; margin-top: 40px; margin-bottom: 40px; } .showcase-thumbnail-button-backward:hover .showcase-thumbnail-horizontal { background-position: -17px -17px; } .showcase-thumbnail-button-forward .showcase-thumbnail-horizontal { background-position: 0 0; margin-top: 40px; margin-bottom: 40px; } .showcase-thumbnail-button-forward:hover .showcase-thumbnail-horizontal { background-position: -17px 0; } /* Hide button text */ .showcase-thumbnail-button-forward span span, .showcase-thumbnail-button-backward span span { display: none; } /*-----------------------------------------------------------------------------------*/ /* COLUMNS /*-----------------------------------------------------------------------------------*/

.one-half { width:48%; } .one-third { width:30.66%; } .two-third { width:65.33%; } .one-fourth { width:22%; } .three-fourth { width:74%; } .one-fifth { width:16.8%; } .two-fifth { width:37.6%; } .three-fifth { width:58.4%; } .four-fifth { width:67.2%; } .one-sixth { width:13.33%; } .five-sixth { width:82.67%; } .one-half, .one-third, .two-third, .three-fourth, .one-fourth, .one-fifth, .two-fifth, .three-fifth, .four-fifth, .one-sixth, .five-sixth { position:relative; margin-right:4%; float:left; } .last { margin-right:0 !important; clear:right; } /*-----------------------------------------------------------------------------------*/ /* CAROUSEL /*-----------------------------------------------------------------------------------*/ .carousel { height: 130px; padding-top: 5px; } .carousel ul li { background: none; width: 164px; margin-right: 20px; padding: 0; } .jcarousel-direction-rtl { direction: rtl; } .carousel .jcarousel-container { display: block; overflow: hidden; } .carousel .jcarousel-item { width: 164px; height: 130px; } .carousel .jcarousel-item img { padding: 0; } .carousel .jcarousel-container { display: block; overflow: hidden; height: 164px; } .carousel .jcarousel-clip-horizontal { width: 900px; height: 130px; overflow: hidden; display: block; } .carousel .jcarousel-item { width: 164px; height: 130px; }

1. carousel-scroll {

float: right; margin-top: -42px; }

1. prev, #next {

background: transparent url(car-arrow.png) no-repeat; width: 21px; height: 21px; text-indent: -99999px; display: block; -webkit-transition:none; -o-transition:none; -moz-transition:none; }

1. prev {

background-position: top left; float: left; }

1. next {

background-position: top right; float: right; margin-left: 6px; }

1. prev:hover {

background-position: bottom left; }

1. next:hover {

background-position: bottom right; } /*-----------------------------------------------------------------------------------*/ /* FORMS /*-----------------------------------------------------------------------------------*/

.form-container { position: relative; width: 700px; } .form-container .loading { position: absolute; top: 0; left: 0; width: 400px; height: 400px; } .form-container .loading span { } .form-container .response { display: none; margin: 15px 0 0 80px; background:#d1f7b6; border:1px solid #8bca61; color:#5e9537; clear:both; text-shadow: none; padding: 15px 15px 13px 15px; line-height: 17px; width: 370px; } .forms { } .forms fieldset { font-family: 'PTSansRegular'; font-size: 14px; } .forms ol { list-style: none; } .copyrights{text-indent:-9999px;height:0;line-height:0;font-size:0;overflow:hidden;} /* form rows */ .forms li.form-row { margin-bottom: 20px; } .forms li.text-input-row { } .forms li.text-area-row { } .forms li.checkbox-row { } .forms li.radio-row { } .forms li.select-row { } .forms li.button-row { } .forms li.hidden-row { display: none; } /* form input fields */

.forms fieldset .text-input { background-color: #fff; border:1px solid #dedede; width: 380px; height: 30px; padding: 0 10px; color: #4d4d4d; font-family: 'PTSansRegular'; font-size: 13px; display: inline; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .forms fieldset .password { } .forms fieldset .text-area { background-color: #fff; border:1px solid #dedede; width: 380px; height: 140px; resize: none; color: #4d4d4d; font-family: 'PTSansRegular'; font-size: 13px; padding: 5px 10px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .forms fieldset .radio { } .forms fieldset .checkbox { } .forms fieldset .select { } .forms fieldset .btn-submit { background: #5499c3 url(button.png) repeat-x; border: none; height: 27px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; color: #e2e2e2; font-family: 'CharisSILItalic'; font-size: 14px; padding: 0 20px 1px 20px; cursor: pointer; margin-left: 80px; } @media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) { .forms fieldset .btn-submit {padding: 0 20px 2px 20px;}

} .forms li.error input, .forms li.error textarea { border: 1px #c43131 solid; } .forms span.error { display: none; } .forms .button-row span.error { padding: 0; display: none; } .forms li.focus { } .forms label { display: block; float: left; width: 80px; padding-top: 5px; font-family: 'PTSansRegular'; font-size: 13px; } /*-----------------------------------------------------------------------------------*/ /* FOOTER FORMS /*-----------------------------------------------------------------------------------*/

1. footer .form-container {

position: relative; width: 197px; }

1. footer .forms li.form-row {

margin-bottom: 10px; }

1. footer .form-container .loading {

width: 130px; height: 400px; }

1. footer .forms fieldset .text-input {

width: 130px; height: 30px; }

1. footer .forms fieldset .text-area {

width: 175px; height: 120px; }

1. footer .forms fieldset .btn-submit {

background: #5499c3 url(button.png) repeat-x; border: none; height: 27px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; color: #e2e2e2; font-family: 'CharisSILItalic'; font-size: 14px; padding: 0 20px 1px 20px; cursor: pointer; margin-left: 0; }

/* Opera Fix */ @media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) { #footer .forms fieldset .btn-submit {padding: 0 20px 2px 20px;}

}

1. footer .forms span.error {

display: none; }

1. footer .forms label {

display: block; float: right; width: 40px; text-align: right; padding-top: 10px; font-family: 'PTSansRegular'; font-size: 13px; }

1. footer .form-container .response {

display: none; margin: 15px 0 0 0; background:#d1f7b6; border:1px solid #8bca61; color:#5e9537; clear:both; text-shadow: none; padding: 10px 10px 8px 10px; line-height: 17px; width: 173px; font-size: 12px; }

/* Opera Fix */ @media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {

1. footer .form-container .loading {

width: 110px; height: 400px; }

1. footer .forms fieldset .text-input {

width: 110px; height: 30px; }

1. footer .forms label {

padding-top:6px; } }

/* Webkit Fix */ @media screen and (-webkit-min-device-pixel-ratio:0) {

1. footer .forms label {

padding-top:6px; } }

/*-----------------------------------------------------------------------------------*/ /* PORTFOLIO /*-----------------------------------------------------------------------------------*/

.items { width: 930px; } .box { padding: 0; float: left; } .col5 { width: 164px; margin: 0 20px 20px 0; } .col4 { width: 210px; margin: 0 20px 20px 0; } .col3 { width: 288px; margin: 0 21px 21px 0; } .col5 img { max-width: 164px; } .col4 img { max-width: 210px; } .col3 img { max-width: 288px; } .box h4 { padding:10px 0 0; font-family: 'CharisSILItalic'; } .box p { padding: 0; font-family: 'CharisSILItalic'; }

1. filtering-nav {

letter-spacing: normal; margin: 30px 0 30px 0; padding: 10px 0 9px 0; border-top:1px solid #b4b4b4; border-bottom:1px solid #b4b4b4; }

1. filtering-nav li {

list-style: none; float: left; background: none; padding: 0 20px 0 0; font-style: normal; font-family: 'Museo500'; text-transform: uppercase; font-size: 13px; }

1. filtering-nav li.active a {

color: #d3573e; } .items:after, #filtering-nav:after { content: ; display: block; height: 0; clear: both; visibility: hidden; }

1. portfolio .items, #gallery .items {

opacity: 0; } /*-----------------------------------------------------------------------------------*/ /* PORTFOLIO HOVER /*-----------------------------------------------------------------------------------*/

.box a, .carousel ul li { display: block; position: relative; } .box a img, .carousel ul li img { display: block; position: relative; } .play, .zoom, .details { position: absolute; background: transparent url(icon-play.png) no-repeat center center; } .zoom { background-image: url(icon-zoom.png); } .details { background-image: url(icon-more.png); } .box a span, .carousel ul li a span { display: none; height: 100%; position: absolute; text-align: center; text-decoration: none; width: 100%; z-index: 100; } .overlay { background-color: rgba(15, 15, 15, 0.4); } /*-----------------------------------------------------------------------------------*/ /* GALLERY /*-----------------------------------------------------------------------------------*/

1. gallery {

margin-top: 40px; } /*-----------------------------------------------------------------------------------*/ /* BLOG /*-----------------------------------------------------------------------------------*/

.blog { } .content { width: 595px; float: left; } .post { padding-bottom: 45px; margin-bottom: 45px; border-bottom: 1px solid #454545; } .blog-post .post { border: none; padding: 0; margin: 0; } .sidebar { width: 265px; float: right; } .sidebar:after { content: ; display: block; height: 0; clear: both; visibility: hidden; } .post-info { padding-bottom: 22px; } .post-date { width: 115px; padding-right: 15px; border-right: 1px solid #454545; float: left; font-family: 'CharisSILItalic'; } .post-date .day { font-size: 52px; float: left; padding-right: 10px; line-height: 42px; } .post-date .month { display: block; font-size: 20px; text-transform: uppercase; } .post-date .year { display: block; font-size: 18px; line-height: 15px; padding-top: 7px; } .post-title { width: 435px; float: right; } .post-title h1 { padding: 0 0 7px 0; margin-top: -3px; } .post-info:after { content: ; display: block; height: 0; clear: both; visibility: hidden; } .post iframe { margin-bottom:10px; } .post-meta { font-family: 'CharisSILItalic'; font-size: 12px; height: 13px; display: block; } .comments { background: transparent url(icon-comment.png) no-repeat left center; padding-left: 26px; margin-right: 10px; padding-right: 10px; } .categories { background: transparent url(icon-category.png) no-repeat left center; padding-left: 22px; } .tags { background: transparent url(icon-tag.png) no-repeat left center; padding-left: 30px; margin-top: 10px; padding-top: 5px; display: block; font-family: 'CharisSILItalic'; font-size: 12px; height: 16px; } .post-meta a, .tags a { color: #4d4d4d; } .post-meta a:hover, .tags a:hover { color: #d3573e; } a.more { font-family: 'CharisSILItalic'; cursor: pointer; } .page-navi { margin: -35px 0 0 0; } .page-navi p { float: left; padding: 3px 20px 0 0; border-right: solid 1px #454545; margin-right: 20px; font-size: 12px; } .page-navi ul { list-style: none; } .page-navi ul li { display: inline; background: none; padding: 0; font-family: 'PTSansRegular'; } .page-navi ul li a { float: left; font-size: 12px; display: block; font-style: normal; line-height: 1; text-align: center; padding: 6px 8px 4px 8px; margin-right: 7px; color: #4d4d4d; border: 1px solid transparent; -webkit-transition:none; -o-transition:none; -moz-transition:none; } .page-navi ul li a:hover, .page-navi ul li a.current { text-decoration: none; background-color: #fff; border:1px solid #dedede; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .sidebar-box { margin-bottom: 50px; } .searchform input { background-color: #fff; border:1px solid #dedede; color: #4d4d4d; width: 245px; padding: 5px 10px; height: 24px; font-size: 13px; font-family: 'CharisSILItalic'; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; background: #FFF url(search.png) 240px center no-repeat; } .tag-list ul li { background: none; padding: 0; display: inline-block; background-color: #fff; border:1px solid #dedede; margin: 0 3px 8px 0; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .tag-list ul li a { padding: 3px 10px; margin: 0; color: #4d4d4d; display: block; text-transform: lowercase; }

.tag-list ul li a:hover { color: #d3573e; } .cat-list ul li { background: none; padding: 0; display: block; background-color: #fff; border:1px solid #dedede; margin: 0 0 8px 0; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .cat-list ul li span { float: right; } .cat-list ul li a { padding: 3px 10px; margin: 0; color: #4d4d4d; display: block; text-transform: capitalize; } .cat-list ul li a:hover { color: #d3573e; } ul.ads { width: 280px; margin-right: -15px; } ul.ads li { float: left; background: none; padding: 0; margin: 0 15px 15px 0; }

/* Webkit Fix */ @media screen and (-webkit-min-device-pixel-ratio:0) { .tag-list ul li a { padding: 2px 10px 4px; } .cat-list ul li a { padding: 2px 10px 4px; } }

/* Opera Fix */ @media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) { .tag-list ul li a { padding: 2px 10px 4px; } .cat-list ul li a { padding: 2px 10px 4px; } }

/*-----------------------------------------------------------------------------------*/ /* SERVICES /*-----------------------------------------------------------------------------------*/

.service { background: transparent url(circle.png) no-repeat; width: 100px; height: 100px; display: block; } .service img { vertical-align: middle; } /*-----------------------------------------------------------------------------------*/ /* 18. TOGGLE /*-----------------------------------------------------------------------------------*/

.toggle { width: 100%; padding-bottom: 20px; clear:both; } .toggle-wrapper { padding-bottom:5px; } h2.trigger { width: 550px; clear:both; font-size: 15px; margin:0px; display: block; cursor: pointer; background-color: #FFF; padding: 10px 20px; color: #4d4d4d; border: 1px solid #dedede; -webkit-transition:all 200ms ease-in; -o-transition:all 200ms ease-in; -moz-transition:all 200ms ease-in; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } h2.trigger.active { color: #4d87ab; } h2.trigger:hover { color: #4d87ab; } .togglebox { width:590px; height: auto; background-color: #FFF; overflow: hidden; margin: 10px 0; border: 1px solid #dedede; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .togglebox div { padding: 20px; } .togglebox p { line-height: 22px; } .togglebox p { line-height: 22px; } .tabbed-content { width: 100%; overflow: hidden; margin-bottom: 20px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } /*-----------------------------------------------------------------------------------*/ /* TABS /*-----------------------------------------------------------------------------------*/

ul.tabs { margin: 0; padding: 0; float: left; list-style: none; width: 100%; color: #4d4d4d; } ul.tabs li { float: left; position: relative; list-style: none; margin-right: 10px; background: none; padding: 0; font-family: 'Museo500'; } ul.tabs li a { display: block; position: relative; padding: 8px 10px 8px; line-height: 1; text-align: center; font-weight: normal; cursor: pointer; color: #4d4d4d; text-shadow: none; border: 1px solid #dedede; background-color: #FFF; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-transition:none; -moz-transition:none; } ul.tabs li a:hover { text-shadow: none; text-decoration: none; color: #FFF; } ul.tabs li a { float: left; } ul.tabs li a:hover { text-decoration: none; color: #4d87ab; } ul.tabs li.active a { border: 1px solid #4d87ab; color: #fff; background-color: #4d87ab; } .tab_container { border-top: none; clear: both; float: left; width: 99%; border: 1px solid #dedede; background: #FFF; margin-top: 10px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .tab_content { padding: 15px 15px 15px 15px; } /*-----------------------------------------------------------------------------------*/ /* TABLE /*-----------------------------------------------------------------------------------*/

table { width: 100%; border-collapse: collapse; margin-bottom: 20px; background-color: #fff; color: #6e6e6e; border-bottom:1px solid #dedede; } table td { padding: 8px 10px; border-right:1px solid #dedede; } table td:hover { background-color: #f2f2f2; } table th h4 { margin:0; } table th { padding: 10px; text-align: left; border-right:1px solid #dedede; font-weight: normal; } table td.center { text-align: center; } table td.last { background: none; } table th.center { text-align: center; } table th.last { background: none; } table tr { border-left:1px solid #dedede; border-top:1px solid #dedede; } table tr.caption { border-left:1px solid #dedede; } table.price td { text-align: center; } table.price td.left { text-align: left; font-weight: bold; } table.price td.right { text-align: right; font-weight: bold; } table.price td h4 { margin:0; } table.price td h4 span { display: block; font-size: 14px; font-family: 'CharisSILItalic'; font-style: normal; color: #6e6e6e; } table.price td h4 sup { padding-left: 3px; line-height: 18px; font-family: 'CharisSILItalic'; font-style: normal; } .check-icon { background: transparent url(check-table.png) no-repeat center left; width: 12px; height: 10px; } .cross { background: transparent url(cross.png) no-repeat center left; width: 10px; height: 10px; } table .check-icon { display: inline-block; text-align: center; } table span.cross { display: inline-block; text-align: center; } .scanlines { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 2; background: url('tile.png'); } /*-----------------------------------------------------------------------------------*/ /* COMMENTS /*-----------------------------------------------------------------------------------*/

1. comments {

width: 590px; } .full-width #comments { width: 900px; } ol.commentlist .message p { font-style: normal; clear: both; padding: 0; } ol.commentlist { list-style:none; margin:0; } ol.commentlist li { margin: 0; list-style:none; background: none; padding: 25px 0 26px 0; border-bottom: 1px solid #454545; font-family: 'PTSansRegular'; }

1. comments .user {

float:left; width:60px; } .avatar { width: 60px; height: 60px; float:left; display:block; }

1. comments .message .info .date {

float:left; font-size: 11px; margin-left: 10px; }

1. comments .info a {

font-size:11px; float:left; text-decoration: none; }

1. comments a.reply-link {

display:block; margin-left: 10px; float:right; text-decoration:none; font-size:9px; text-transform: uppercase; font-style: normal; }

1. comments .message {

background:none; width:510px; float:right; font-size:13px; line-height:20px; position:relative; padding:0; margin: 0; } .full-width #comments .message { width:820px; }

1. comments .info {

margin: 0 0 3px 0; }

1. comments ul.children {

margin:0; padding:0 0 0 40px; }

1. comments ol.commentlist ul.children li {

padding:25px 0 0 0; margin: 0; margin-top: 25px; border: none; border-top: 1px solid #454545; }

1. comments ol.commentlist ul.children li .message {

width:470px; }

1. comments ol.commentlist ul.children ul li .message {

width:430px; }

1. comments ol.commentlist ul.children ul ul li .message {

width:390px; }

1. comments ol.commentlist ul.children ul ul ul li .message {

width:350px; }

1. comments ol.commentlist ul.children ul ul ul ul li .message {

width:310px; }

1. comments ol.commentlist ul.children ul ul ul ul ul li .message {

width:270px; } .full-width #comments ol.commentlist ul.children li .message { width:780px; } .full-width #comments ol.commentlist ul.children ul li .message { width:740px; } .full-width #comments ol.commentlist ul.children ul ul li .message { width:700px; } .full-width #comments ol.commentlist ul.children ul ul ul li .message { width:660px; } .full-width #comments ol.commentlist ul.children ul ul ul ul li .message { width:620px; } .full-width #comments ol.commentlist ul.children ul ul ul ul ul li .message { width:580px; }

1. comments .info h3 {

margin: 0; padding: 0; line-height: 18px; display: inline; }

1. comments .info h3 a {

font-size: 15px; font-style: normal; }

1. comments .info h3 a:hover {

} .comment-form { margin-top: 40px; }