/* THEME NAME: Beautyboss THEME URI: http://mybeautyboss.com DESCRIPTION:Designed for the myBeautyBoss Marketing site VERSION: 0.3 AUTHOR: Ambient Age (@davkell) */ 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, font, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } :focus {outline: 0;} /*=============================================== Element Styling * -----------------------------------------------*/ body{font-family: arial, helvetica, sans-serif; background: #fff url('images/header_top.gif') repeat-x top; font-size: 1em;} h1{ } h2{font-family: arial, helvetica, sans-serif; font-size: 1.5em; color: #fff; letter-spacing: 0px; font-weight: 500; margin-left: 0em;} h3{font-family: arial, helvetica, sans-serif; font-size: 1.25em; color: #fff; letter-spacing: 0px; font-weight: 500; text-align: center;} p{margin: 0em 1em 1em 1em; font-size: .9em; line-height: 1.35em; color: #333;} blockquote{background: url('images/pink_dark_quote.gif') no-repeat top left; padding-left: 20px;} cite{font-size: .8em; font-family: arial, helvetica, sans-serif; text-align: right; float: right; font-style: italic; margin: 0em 2em 0 0;} a:link{color: #333; text-decoration: underline;} a:visited{color: #333; text-decoration: underline;} a:hover{color: #ff0888; text-decoration: underline;} a:active{color: #ff0888; text-decoration: underline;} a.callout-button{background: url('images/bg-callout-button.gif') repeat-x center; text-decoration: none; height: 38px; line-height: 38px; display: block; float: right; min-width: 140px; padding: 0 10px; margin: 20px 0 20px 40px; text-align: center; color: #fff; font-size: .88em; border: 1px solid #efefef; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;} /*================================================= Generic Classes * ------------------------------------------------*/ .page-width{width: 960px; margin: 0 auto; clear: both;} .small{font-size: 0.8em;} br.clearall{clear: both;} .callout{background-color: #FEFEEE; float: left; clear: both; margin: 10px auto 20px; padding: 20px; border: 1px solid #E6DB55;} a.green-button{display: block; color: #fff; padding: 10px 20px; margin: 0 auto; text-decoration: none; font-family: georgia, serif; border: 2px solid #fff; font-size: 1.4em; text-align: center; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background-color: #70A600; background-image: -moz-linear-gradient(top, #70A600, #578200); background-image: -ms-linear-gradient(top, #70A600, #578200); background-image: -o-linear-gradient(top, #70A600, #578200); background-image: -webkit-gradient(linear, left top, left bottom, from(#70A600), to(#578200)); /* Saf4+, Chrome */ background-image: -webkit-linear-gradient(top, #70A600, #578200); background-image: linear-gradient(top, #70A600, #578200); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#70A600', EndColorStr='#578200'); -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } a.green-button:hover{border: 2px solid #fc0; } a.green-button:active{position: relative; top: 1px; left: 1px;} a.green-button span{font-size: .75em; display: block; text-align: center;} a.blue-button{ display: block; color: #333; padding: 10px 20px; margin: 0 auto; text-decoration: none; font-family: georgia, serif; border: 2px solid #fff; font-size: 1.4em; text-align: center; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background-color: #A9C8FA; background-image: -webkit-gradient(linear, left top, left bottom, from(#A9C8FA), to(#D0E0FC)); background-image: -webkit-linear-gradient(top, #A9C8FA, #D0E0FC); background-image: -moz-linear-gradient(top, #A9C8FA, #D0E0FC); background-image: -ms-linear-gradient(top, #A9C8FA, #D0E0FC); background-image: -o-linear-gradient(top, #A9C8FA, #D0E0FC); background-image: linear-gradient(top, #A9C8FA, #D0E0FC); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#A9C8FA', EndColorStr='#D0E0FC'); -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .ie9 a.blue-button, .ie9 a.green-button{border-radius: 0;} a.blue-button:hover{border: 2px solid #DBDBDB; } a.blue-button:active{position: relative; top: 1px; left: 1px;} a.blue-button span{font-size: .75em; display: block; text-align: center;} .vat-disclaimer{font-size: .75em;} /** * ============================================= * Layout / Type * ---------------------------------------------- */ #container{width: 100%; clear: both; float:left;} #header{clear: both; height: 140px; width: 960px; margin: 1em auto 0 auto;} #login-tab{width: 130px; height: 38px; float: right; clear: both; background: url('images/login_tab.gif') no-repeat right; color: #fff; margin-top: 5px;} #login-tab a{display: block; margin: 5px 0px 0px 40px; color: #fff; font-size: 1.1em; text-decoration: none;} #header #logo-title{width: 40%; float: left; margin-top: 55px;} #header #head-explain{width: 450px; float: right; text-align: center; margin-top: 20px;} #header #head-explain strong{font-family: 'Palatino Linotype','Palatino', serif; font-style: italic; font-size: 18px; font-weight: normal;} #header #main-nav{float: right; width: 450px; height: 31px; background: url('images/bg_nav.gif') repeat-x top left; margin: 40px 0 0 0;} #header #main-nav ul{margin: 5px; width: 100%; text-align: center;} #header #main-nav ul li{display: inline; list-style-type: none; margin-right: 2em;} #header #main-nav ul li a{text-decoration : none; color: #36393D; font-size: 15px; font-weight: bold;} #header #main-nav ul li a:hover{color: #ff0888; } #header #main-nav ul li a.callout-link:link{color: #000;} #header #main-nav ul li a.callout-link:visited{color: #000;} #header #main-nav ul li a.callout-link:hover{color: #ff0844;} #header #main-nav ul li a.callout-link:active{color: #ff0844;} a.callout-link{color: #ff0888;} a.callout-link:hover{color: #ff0844;} #wrapper{clear: both;float: left; width: 100%; } #content{width: 980px; padding: 40px 10px 20px 10px; margin: 0 auto; /* float: left; */ min-height: 400px;} #page-header{width: 100%; height: 90px; float: left; background: url('images/bg_home_dark.gif') repeat-x; padding-top: 20px; border-bottom: 2px solid #999;} /** Featured */ #page-header h2.page-title, #page-header h1.page-title, #page-header div.page-title{font-size: 38px; float: left; width: 450px; text-align: center; font-family: 'Palatino Linotype','Palatino', serif; color: #fff;} #page-header strong.page-pitch{background: url('images/icon_chain_bracket.png') no-repeat; width: 470px; margin-top: -5px; padding-left: 30px; float: right; height: 74px; font-size: 22px; font-family: 'Palatino Linotype','Palatino', serif; display: block; color: #fff; letter-spacing: 0px; font-weight: 500; text-align: center;} div.page-content{width: 680px; float: right; min-height: 400px; padding-bottom: 20px;} .full-width div.page-content{width: 960px;} div.page-content h1, div.page-content h2, div.page-content h3, div.page-content h4, div.page-content h5, div.page-content h6{ color: #2d2d2d; text-align: left; margin: 0 0 10px 10px; } div.page-content ul{margin: 20px 2em;} div.page-content ul li{margin-bottom: 5px; padding-bottom: 5px; border-bottom: 1px dotted #eee;} /** ========================= Sidebars ------------------------- */ /** Right (blog) sidebar */ #sidebar{width: 280px; min-height: 400px; background-color: #fff; border: 1px solid #dbdbdb; float: right; padding: 10px; margin: 40px 0 40px 0;} #sidebar hr{width: 100%; float: left; clear: both; margin: 10px 0;} div.side-col-single{padding: 10px 0; margin: 0; clear: both; width: 100%;} .sidebar h3{font-size: 1.25em; color: #333; font-family: 'Palatino Linotype','Palatino', serif; text-align: center; background: #d0e0fc; padding: 10px 0; margin-bottom: 10px;} .sidebar{width: 100%; float: left;} .sidebar ul li.widget{float: left; width: 100%; clear: both; margin: 0 0 20px 0;} #secondary.sidebar, #third.sidebar{width: 48%;} #secondary.sidebar{ float: left;} #secondary.sidebar ul, #third.sidebar ul{font-size: .9em; line-height: 1.6em;} .sidebar ul{margin: 0px 0 20px 0;} .sidebar ul li{list-style-type: none; font-size: .88em; margin-bottom: 5px;} .sidebar ul ul{margin: 0 0 0 20px;} .sidebar ul ul li{margin-bottom: 10px;} .textwidget small{text-align: right; float: right;} #s{width: 160px;} #searchsubmit{ width: 100px;} #page-menu{width: 230px; float: left; margin: 0 0 0 0; } #page-menu ul{width: 230px; margin: 0 0 80px 0} #page-menu ul li{display: block; text-align: center; width: 230px; background: url('images/bg-sidebar-off.jpg') no-repeat; height: 80px; list-style-type: none; line-height: 80px;} #page-menu ul li.current_page_item{background: url('images/bg-sidebar-on.jpg') no-repeat;} #page-menu ul li a{display: block; width: 230px; height: 80px; text-decoration: none; font-size: .9em; font-weight: bold;} #page-menu ul li a:link{color: #fff;} #page-menu ul li a:visited{color: #fff;} #page-menu ul li a:hover{color: #eee;} #page-menu ul li a:active{color: #eee;} /* *========================================== /blog/ ------------------------------------------- */ /** -- Post -- **/ .post{float: left; width: 600px; padding-bottom: 20px; border-bottom: 1px solid #dbdbdb; margin: 40px 0 20px 0;} .entry-title{float: left; color: #2d2d2d; clear: both; line-height: 1em; font-size: 2.2em; margin-bottom: 10px; width: 100%; letter-spacing: -1px;} .entry-title a:link{text-decoration: none;} .entry-title a:visited{text-decoration: none;} .entry-title a:hover{text-decoration: underline;} .entry-title a:active{text-decoration: underline;} .post-meta-above, .post-meta-below, .comment-holder{font-size: .8em;} .post-meta-above{float: left; width: 100%; line-height: .825em; color: #999} .blog-social{width: 100%; float: left; clear: both; margin: 10px 0; padding-bottom: 10px; border-top: 1px dotted #dbdbdb; border-bottom: 1px dotted #dbdbdb;} .entry-meta-social{width: 320px; float: left; margin-top: 5px;} .tw_button{margin-top: 10px; float: left;} .fb-social{display: block; float: left;} .google_plus_one{display: block; float: left; margin: 10px 20px 0 0;} .post-meta-below{float: left; width: 100%; } .tags{float: right; width: 400px; text-align: right} img.icon-tag{margin: 0 5px -10px 0;} div.sociable{margin: 10px 0 0 0 !important; float: left; width: 200px; text-align: left;} p.comment-status{} .comment-holder{float: right; width: 120px; text-align: center; margin-top: 12px;} .comment-holder a{display: block; text-decoration: none; width: 100%; padding: 4px 0; border: 1px solid #ababab; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;} .comment-holder a:link{color: #fff; background-color: #ababab;} .comment-holder a:visited{color: #fff; background-color: #ababab;} .comment-holder a:hover{color: #000; background-color: #D0E0FC;} .comment-holder a:active{color: #000; background-color: #D0E0FC;} /** Format user added html tags */ .entry-content{float: left; clear: both; width: 100%; margin: 10px 0 0 0; color: #000;} .entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6{ color: #2d2d2d; text-align: left; font-family: georgia, serif; } .entry-content h1{font-size: 2em; margin-bottom: 10px;} .entry-content h2{font-size: 1.75em;margin-bottom: 10px;} .entry-content h3{font-size: 1.5em; line-height: 1.5em; margin-bottom: 10px;;} .entry-content h4{font-size: 1.25em ;margin-bottom: 10px; line-height: 1.2em; ;} .entry-content h5{font-size: 1.125em; margin-bottom: 10px;;} .entry-content h6{font-size: 1em; margin-bottom: 10px; font-weight: bold;;} .entry-content h3 img{ margin: 0 0 0 0; padding-right: 20px; float: left; display: inline; } .entry-content em{font-style: italic;} .entry-content p{margin: 0 0 1.6em; line-height: 1.8em; font-size: .88em;} .entry-content blockquote{margin: 20px; padding: 0px 0 0 20px; border-left: 5px solid #efefef; font-family: georgia, serif; font-style: italic; } .entry-content ul, .entry-content ol{margin: 1em 2.5em;} .entry-content ul li, .entry-content ol li{margin: 0 0 5px 0; line-height: 1.4em;} .entry-content ul li{ font-size: .825em; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #eee; list-style-type: none;} .entry-content img{padding: 1px; border: 1px solid #dbdbdb;} .cat-thumb{width: 150px; height: 150px; float: left; margin: 0 10px 10px 0;} a.more-link{display: block; width: 100%; font-weight: bold; float: left; margin: 20px 0; border: 1px solid #bdbdbd; padding: 10px 0; text-align: center; background-color: #D0E0FC; -moz-border-radius: 30px; -webkit-border-radius: 30px; border-radius: 30px; text-decoration: none;} a.more-link:hover, a.more-link:active {color: #fff; background-color: #333; } #nav-below{margin: 20px auto; width: 300px; clear: both; text-align: center;} ul.paging { list-style: none; padding: 0; font-weight: bold; text-align: center; width: 100%; margin: 0 auto; float: left;} ul.paging li {float: left; margin: 0 6px 6px 0; } ul.paging li a, ul.paging li.active { display: block; padding: 3px 6px; background-color: #f5f5f5; border: 1px solid #ccc; } ul.paging li.active { background-color: #000; border-color: #000; color: #fff; } /** -- Shortcode mailing list */ .callout-form-input-holder{float: left; width: 160px; margin-right: 20px; font-size: .9em;} .callout-form-button-holder{float: left; width: 100px; margin: 15px 0 0 10px;} /** -- MCE Styles -- */ p.post-callout, div.post-callout{background-color: #FEFEEE; float: left; clear: both; margin: 10px auto 20px; width: 560px; padding: 20px; border: 1px solid #E6DB55;} /** * ======================== * Comments *------------------------- */ #comments{float: left; clear: both; width: 540px; margin-bottom: 60px;} .comment{ float: left; clear: both; width :540px; padding: 20px 40px 20px 20px; margin: 0 0 20px 0; border: 1px solid #dbdbdb; background-color: #fff;} .bypostauthor{background: #ECEFF0;} div.comment-author{float: left; width: 300px; margin-bottom: 10px;} div.comment-text{float: right; width: 450px; } div.comment-meta{float: left; width: 100%; clear: both; font-size: .8em; text-align: right; margin: 10px 0 0 0;} #respond{width: 600px; float: left; clear: both;} #respond h3{color: #000; text-align: left; margin: 10px 0;} p#comment-notes{width: 500px; float: left; margin: 10px 20px; font-size: .8em; background: url('images/icon_pink_bullet.png') no-repeat left bottom; padding-left: 20px; line-height: 14px;} #respond textarea{width: 600px;} div#input-group{width: 200px; float: left;} div#input-group div{margin-bottom: 5px;} div.form-label{width: 35%; float: left; text-align: right;} div.form-input{width: 55%; float: right;} div.form-input input{width: 150px;} div.form-submit{width: 245px; float: left; text-align: right;} div.form-submit input#submit{background: url('images/bg-callout-button.gif') repeat-x center; height: 39px; width: 140px; padding: 3px 0; cursor: pointer; color: #fff; border: 1px solid #eee; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;} /** -- Disqus -- */ a.dsq-brlink{float: left; clear: both; display: none;} #disqus_thread{float: left; width: 600px;} /** * ============================================== * Footer * --------------------------------------------- */ #footer{width: 100%; float: left; clear: both; background: #333 url('images/bg_footer_top.gif') repeat-x top left; height: 360px; padding-top: 8px; font-size: .9em; color: #fff; margin-top: 0px;} #footer.landing{height: auto; margin-top: 80px;} #footer * {color: #fff;} #footer h4{font-family: 'arial rounded mt bold', arial, helvetica, sans-serif; font-size: 22px; margin-bottom: 10px; clear: both; float: left; width: 100%;} #footer p{margin: 0; font-size: 1em;} #footer ul{margin-left: 0;} #footer ul li{margin-bottom: 10px; list-style-type: none;} #footer ul li a:link, #footer ul li a:visited{text-decoration: none; color: #fff;} #footer ul li a:hover, #footer ul li a:active{text-decoration: none; color: #ff0888;} #footer-social{width: 300px; float: left; clear: both; margin-bottom: 20px;} #footer-blog ul li{margin-bottom: 20px; } #footer-nav, #footer-blog, #footer-fine-print-web{float: left; height: 265px; margin: 2em 20px 0 0} #footer-blog{width: 340px;} #footer-blog h4{margin-bottom: 15px;} #footer-nav{width: 260px;} #footer-fine-print-web{margin: 2em 0 0 0; width: 300px; float: right;} #footer-fine-print{margin-top: 2em;} #footer-fine-print ul li{font-size: .75em;} #footer-credit{width: 100%; height: 60px; clear: both; float: left; margin-top: 10px;} #footer-credit-logo, #footer-credit-address, #footer-credit-contact{width: 33%; font-size: .8em; float: left;} #footer-credit-contact{float: right; width: 25%;} span.copyright{display: block; float: left; clear: both; font-size: .98em; margin-top: 5px;} /** * ============================================== * Homepage * ---------------------------------------------- */ #home-main{clear: both; width: 100%; float: left; overflow: hidden; height: 390px; background: #fefeee url('images/bg_home_pitch.jpg') repeat-x; color: #fff; padding: 1em 0px;} #home-pitch{height: 250px; width: 450px; float: left;} #home-main h2{font-family: 'Palatino Linotype', 'times new roman', serif; font-size: 1.7em; color: #fff;} #home-main ul{margin: 1em 0px 0px 2em; width: 400px;} #home-main ul li{list-style-image: url('images/icon_pink_bullet.png'); font-size: 1.1em; letter-spacing: 0px; margin-bottom: 1em; font-weight: 500} #home-screen{width: 530px; height: 380px; float: right; margin: -70px -44px 0 0; z-index: 0; background: url('images/screenshot-home-main.png') no-repeat 0 50%;} #home-screen #home-awards-notice{margin: 390px 0 0 120px; } #home-awards-notice #awards-badge-horiz{float: left;} #home-awards-notice p strong{float: left; width: 250px; font-weight: bold; color: #666; font-style: italic; font-family: georgia, serif; margin: 15px 0 0 15px;} #home-call-buttons{width: 960px; margin: 5px auto 0 auto; padding: 0px 0 0 2em; float: left; clear: both} div.home-sales{width: 220px; float: left; margin-right: 10px; } /* div.home-sales a#home-learn{display: block; color: #fff; font-size: 1.1em; text-decoration: none; width: 181px; height: 39px; background: #ff46a6 url('images/button_pink_bg.gif') no-repeat; float: left; margin: 0 40px 10px 0; text-align: center; clear: both;} */ div.home-sales a#home-learn{font-size: 1.1em; /* width: 181px; */ margin: 0 0px 10px 0px; clear: both;} div.home-sales a#home-register{margin-right: 10px; font-size: 1.1em;} div.home-sales span.call-tagline{display: block; color: #333; clear: both; font-size: .8em; width: 100%; margin-top: 10px; text-align: center;} #home-what-why{clear: both; width: 100%; height: 441px; float: left; margin: 0px; background: url('images/bg_home_light.gif') repeat-x;} #home-what-why h2{color: #ff0888; text-align: center; font-weight: bold; font-size: 22px; border-bottom: 1px solid #bdbdbd; padding: 0 0 15px 0; margin: 0 0 15px 0;} #home-what{ width: 450px; min-height: 200px; float: left; margin: 1.5em 0;} #home-why{ width: 450px; min-height: 200px; float: right; margin: 1.5em 0;} #home-what-why strong{color: #333; font-weight: 600;} div.home-callout{text-align: center; background-color: #fff; height: 120px; width: 100%; float: left; clear: both; border-top: 1px solid #dbdbdb; border-bottom: 1px solid #bdbdbd; } div.home-callout p{margin-top: 50px;} #home-testimonial-upcoming{width: 100%; height: 265px; background: #333 url('images/bg_home_dark.gif') repeat; border-bottom: 1px solid #fff; border-top: 1px solid #fff; color: #fff; clear: both; float: left;} #home-testimonial-upcoming h3{margin: 1em 0; font-size: 22px;} #home-testimonial-upcoming a:link{color: #fff} #home-testimonial-upcoming a:visited{color: #fff;} #home-testimonial-upcoming a:hover{color: #ff0888;} #home-testimonial-upcoming a:active{color: #ff0888;} #home-testimonial{width: 450px; float: left;} #home-testimonial p{color: #fff;} .testimonial{width: 400px; float: left; margin: 0 0 1em 0; padding: 0 0 0 20px;background: url('images/icon_pink_quotation.png') no-repeat top left; clear: both;} #home-upcoming{width: 450px; float: right; color: #fff;} #home-upcoming p{color: #fff;} /* * Featured */ #featured-slider-holder{ width:580px;padding:10px;margin:0 auto;position:relative;z-index:0;} #slider-holder {width:600px; height:350px; position:relative;} #frame {position:absolute;z-index:0;width:739px;height:341px;top:-3px;left:-80px;} #slides {position:absolute; top:15px; left:4px; z-index:100;} .slides_container {width:570px; overflow:hidden; position:relative; display:none; } .slides_container img { width:570px; height:270px; display:block;} .slides_container a img { display:block;} #slides .next,#slides .prev {position:absolute;top:107px;left:-39px;width:24px;height:43px; display:block; z-index:101;} #slides .next {left:585px;} .pagination { margin:26px auto 0; width:100px;} .pagination li {float:left;margin:0 1px;list-style:none;} .pagination li a {display:block;width:12px;height:0;padding-top:12px;background-image:url(../img/pagination.png);background-position:0 0;float:left;overflow:hidden;} .pagination li.current a {background-position:0 -12px;} .row{width: 100%; float: left; clear: both; margin-bottom: 20px;} .features-callout{background-color: #FEFEEE; border: 1px solid #E6DB55; clear: both; float: left; margin: 10px auto 30px; padding: 20px; width: 920px; text-align: center; -moz-border-radius: 3px; border-radius: 3px; } .features-callout.quote{font-size: 1.2em; font-family: georgia, serif; font-style: italic;} .featured-panel{width: 300px; margin-right: 40px; min-height: 350px; float: left;} .row .featured-panel:last-child{margin-right: 0; float: right;} .featured-panel img{width: 280px; height: 230px; padding: 0; margin: 0; border-top: 3px solid #666; border-left: 3px solid #666; border-right: 3px solid #666; ;} .featured-panel h4{width: 286px; text-align: center; background: #333; color: #fff; padding: 10px 0; font-family: georgia, serif; margin: -4px 0 0 0;} .featured-panel p{margin: 5px 10px 0; width: 268px; font-size: .875em;} .featured-pitch{width: 930px; float: left; clear: both; margin-bottom: 40px; /* width: 540px; margin: 20px auto; border: 1px dotted #ccc; background: #fefefe; padding: 10px 20px; clear: both; */ color: #000; text-align: center;} .featured-pitch div{width: 320px; float: right; text-align: center;} .featured-pitch p{margin-bottom: 5px;} .featured-pitch a{display:block; margin: 10px auto; float: none; text-align: center; } .featured-pitch a.hint{font-size: .9em; color: #666; margin-top: 0;} .featured-pitch a.green-button{width: 270px; font-size: 1.3em; float :right;} /** -- About page -- */ .post-2{} .post-2 .page-content{width: 600px; margin-right: 60px;} .post-2 .page-content p{line-height: 1.8em; font-size: .88em;} .post-2 .page-content h3, .post-2 .page-content h2{margin-top: 40px; margin-left: -20px;} /** /why-use */ #why-use{ margin-top: 60px;} .section{width: 100%; float: left; clear: both; margin: 0 0 60px;} .section.left img{float: right;} .section.left p, .section.left h2{width: 460px; float: left; margin: 0 0 1em} .section.right img{float: left;} .section.right p, .section.right h2{width: 460px; float: right;margin: 0 0 1em} .section.left h2, .section.right h2{margin-bottom: 10px; } #why-use .callout{float: left; clear: both; width: 940px; margin: 0 0 60px; font-family: georgia, serif;} #why-use .callout h3, .featured-pitch.callout h3{width: 480px; float: left; text-align: center; font-family: georgia, serif; margin-top: 10px; color: #000;} #why-use .callout a.green-button{width: 300px; float: right; font-size: 22px; margin: 25px 60px 0 0; } /** * Landing page designs */ body#landing-page{} body#landing-page #header{position: relative; margin: 0 auto 0;} body#landing-page #header #main-nav{ margin-top: 100px;} #landing-awards-badge{position: absolute; top: 0; right: 30px;} #landing-page #page-header{margin-bottom: 20px;} #landing-page #content{ min-height: 800px; color: #444; padding: 0px 0 0px; } #content.startup-page h1, #content.startup-page h2, #content.startup-page h3, #content.startup-page h4, #content.startup-page h5, #content.startup-page h6{ color: #444; text-align: left; font-family: Georgia, serif; } #landing-page #content h1{font-size: 2.5em; margin: 0 0 0px; width: 940px; background-color: #fff; /*#FEFEEE; border: 1px solid #E6DB55; */ padding: 20px 0; text-align: center; -moz-border-radius: 3px; border-radius: 3px; } .ie7 #landing-page #content h1{font-weight: normal; font-size: 3em;} #content.startup-page h1 .heading-pitch{font-size: .5em; display: block; padding: 20px 0 0; } #content.startup-page h2{padding-left: 40px; font-size: 2em;} #content.startup-page p{font-size: .875em; line-height: 1.6em; margin: 0 0 10px 0;} #content.startup-page li{font-size: .9em;} /* -- startup */ #startup-love{} #startup-love h2{background: url('images/landing-icon-sprite.png') no-repeat -22px -92px; margin-bottom: 20px; } #startup-love h3{margin-bottom: 10px;} #startup-love ul{list-style-type: none; margin: 0 0 0;} #startup-love ul li{display: block; padding-bottom: 20px; float: left; clear: both;} .ie7 #startup-love ul li{width: 100%;} #startup-love ul li img{margin-top: 10px; } #startup-day-to-day{} #startup-day-to-day h2{background: url('images/landing-icon-sprite.png') no-repeat -18px -294px; margin-bottom: 0;} #startup-day-to-day p.startup-hint{padding: 0 0 10px 40px; font-size: .8em; color: #999;} #startup-day-to-day .span12{margin-left: 0;} #startup-day-to-day .span3{background-color: #EDF1F8; height: 170px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;} #content.startup-page #startup-day-to-day .span3 p{padding: 10px; font-size: .825em;} #content.startup-page #startup-day-to-day h4{text-align: center; border-bottom: 1px solid #CCD8EC; padding: 10px; font-size: 1.125em;} #startup-day-to-day h4#startup-appointments{background: url('images/landing-icon-sprite.png') no-repeat 0px -583px;} #startup-day-to-day h4#startup-clients{background: url('images/landing-icon-sprite.png') no-repeat 20px -488px;} #startup-day-to-day h4#startup-marketing{background: url('images/landing-icon-sprite.png') no-repeat 12px -676px;} #startup-day-to-day h4#startup-reporting{background: url('images/landing-icon-sprite.png') no-repeat 17px -394px;} #startup-day-to-day p{border-top: 1px solid #fff;} #startup-billing{ padding: 20px 0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background-color: #f4f4f4;background-image: -webkit-gradient(linear, left top, left bottom, from(#f4f4f4), to(#fcfcfc)); background-image: -webkit-linear-gradient(top, #f4f4f4, #fcfcfc); background-image: -moz-linear-gradient(top, #f4f4f4, #fcfcfc); background-image: -ms-linear-gradient(top, #f4f4f4, #fcfcfc); background-image: -o-linear-gradient(top, #f4f4f4, #fcfcfc); background-image: linear-gradient(top, #f4f4f4, #fcfcfc); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f4f4f4', EndColorStr='#fcfcfc'); } .ie9 #startup-billing{border-radius: 0;} #content.startup-page #startup-billing h2{background: url('images/landing-icon-sprite.png') no-repeat -10px -772px; margin-bottom: 20px; padding-left: 50px;} #startup-billing ul {margin: 0 30px; list-style-image: url('images/icon-grey-bullet.gif'); list-style-position: outside;} #startup-billing ul li{padding-left: 20px; margin-bottom: 20px; font-size: .875em; line-height: 1.6em;} #landing-email{padding-top: 20px;} #landing-email.startup-landing-mail{width: auto; margin-top: 0;} #landing-email.startup-landing-mail .callout-form-input-holder{width: auto; } #landing-email.startup-landing-mail .callout-form-button-holder{margin-left: 40px; } #content.startup-page #landing-email h4{padding-bottom: 20px; text-align: center; font-size: 1.2em;} #content.startup-page #landing-email input[type="submit"]{ display: block; color: #fff; padding: 10px 15px; margin: -10px auto 0; text-decoration: none; font-family: georgia, serif; border: 2px solid #fff; font-size: 1em; text-align: center; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background-color: #70A600; background-image: -moz-linear-gradient(top, #70A600, #578200); background-image: -ms-linear-gradient(top, #70A600, #578200); background-image: -o-linear-gradient(top, #70A600, #578200); background-image: -webkit-gradient(linear, left top, left bottom, from(#70A600), to(#578200)); /* Saf4+, Chrome */ background-image: -webkit-linear-gradient(top, #70A600, #578200); background-image: linear-gradient(top, #70A600, #578200); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#70A600', EndColorStr='#578200'); -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } #uk-price .vat-disclaimer{display: block; padding: 50px 20px; background: #f9f9f9; margin-top: -80px;} /* Startup Sidebar */ .startup-callout{background-color: #FFBF0D; padding: 5px 0px 10px;} #startup-callout-top{height: 236px;} #startup-callout-bottom strong{text-align: center; display: block;} #content.startup-page .startup-callout h2{font-family: georgia, serif; font-size: 1.3em; color: #900; padding-left: 0; text-align: center; margin: 0 10px} .startup-callout ul{list-style-type: none;} .startup-callout ul li{position: relative; text-align: left; background: #FFCD48; display: block; padding: 5px 0 10px 70px; margin: 5px 10px 10px;} #content.startup-page .startup-callout ul li h3{text-align: center; font-size: 1.25em;} .startup-callout .price{display: block; background: url('images/landing-icon-sprite.png') no-repeat -2px -880px; width: 70px; height: 70px; position: absolute; top: 5px; left: 5px; color: #fff; text-align: center; font-size: 1.5em; padding: 6px 0 0; font-family: georgia, serif; } .startup-callout .price span{font-size: .6em; display: block; text-align: center;} .green-button.price-button{padding: 5px 0; width: 180px; font-size: 1.25em; margin-top: 10px; border-width: 1px;} .green-button.price-button:hover{border-width: 1px; border-color: #D90000} .green-button.price-button span{font-size: .75em;} #content.startup-page .startup-callout-hint{text-align: right; font-size: .8em; color: #666; padding-right: 10px; margin: 0;} #content.startup-page .startup-callout-hint a{color: #666;} .startup-sidebar{padding: 20px 0px; background-color: #f4f4f4; border-bottom: 1px solid #d1d1d1; border-top: 2px solid #fff;} .startup-sidebar:last-child{border-bottom: 0 none;} .startup-sidebar h4{padding-left: 40px; line-height: 30px; font-size: 1.25em; margin-bottom: 10px;} .ie7 .startup-sidebar h4{font-size: 1em;} .startup-sidebar div{padding: 0 20px} #content.startup-page .startup-sidebar p{font-size: .825em;} #startup-how-it-works h4{background: url('images/landing-icon-sprite.png') no-repeat -18px 0px; } #startup-need-help h4{background: url('images/landing-icon-sprite.png') no-repeat -22px -198px; } #startup-sidebar-holder{height: 90px; text-align: center;} /** Startup experiment */ .price-v2{display: block; width: 70px; height: 70px; position: absolute; top: 35px; left: 5px; color: #666; text-align: center; font-size: 1.5em; padding: 6px 0 0; font-family: georgia, serif; } .startup-callout .price-v2 span{font-size: .6em; display: block; text-align: center;} a.red-button{display: block; color: #fff; padding: 10px 20px; margin: 0 auto; text-decoration: none; font-family: georgia, serif; border: 2px solid #fff; font-size: 1.4em; text-align: center; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background-color: #D90000; background-image: -webkit-gradient(linear, left top, left bottom, from(#D90000), to(#990000)); background-image: -webkit-linear-gradient(top, #D90000, #990000); background-image: -moz-linear-gradient(top, #D90000, #990000); background-image:-ms-linear-gradient(top, #D90000, #990000); background-image: -o-linear-gradient(top, #D90000, #990000); background-image:linear-gradient(top, #D90000, #990000); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#D90000', EndColorStr='#990000'); -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } a.red-button:hover{border: 2px solid #fc0; } a.red-button:active{position: relative; top: 1px; left: 1px;} a.red-button span{font-size: .75em; display: block; text-align: center;} .red-button.price-button{padding: 5px 0; width: 180px; font-size: 1.25em; margin-top: 10px; border-width: 1px;} .red-button.price-button:hover{border-width: 1px;} .red-button.price-button span{font-size: .75em;} /** * ========================================== * Image defaults (based on Thematic) * ------------------------------------------ */ .entry-content img { margin: 0 0 18px 0; } .alignleft, img.alignleft { float: left; margin-right:20px;} .alignright, img.alignright { display: block; float: right; margin-left:20px; } .aligncenter, img.aligncenter { margin-left:auto; margin-right:auto; display: block; clear: both; } .wp-caption {text-align: center; margin-bottom:18px; } .wp-caption img { margin: 0; padding: 0; border: 0 none; } .wp-caption p.wp-caption-text { margin: 0; padding:5px; } .gallery img { margin:0; } .wp-smiley { max-height:12px;margin:0 !important; } /* Prevent the smileys from breaking line-height */ /** -- Grid -- */ .row { zoom: 1;} .row:before, .row:after { display: table; content: "";} .row:after { clear: both;} .row .span1 { float: left; width: 60px; margin-left: 20px;} .row .span1:first-child { margin-left: 0;} .row .span2 { float: left; width: 140px; margin-left: 20px;} .row .span2:first-child { margin-left: 0;} .row .span3 { float: left; width: 220px; margin-left: 20px;} .row .span3:first-child { margin-left: 0;} .row .span4 { float: left; width: 300px; margin-left: 20px;} .row .span4:first-child { margin-left: 0;} .row .span5 { float: left; width: 380px; margin-left: 20px;} .row .span5:first-child { margin-left: 0;} .row .span6 { float: left; width: 460px; margin-left: 20px;} .row .span6:first-child { margin-left: 0;} .row .span7 { float: left; width: 540px; margin-left: 20px;} .row .span7:first-child { margin-left: 0;} .row .span8 { float: left; width: 620px; margin-left: 20px;} .row .span8:first-child { margin-left: 0;} .row .span9 { float: left; width: 700px; margin-left: 20px;} .row .span9:first-child { margin-left: 0;} .row .span10 { float: left; width: 780px; margin-left: 20px;} .row .span10:first-child { margin-left: 0;} .row .span11 { float: left; width: 860px; margin-left: 20px;} .row .span11:first-child { margin-left: 0;} .row .span12 { float: left; width: 940px; margin-left: 20px;} .row .span12:first-child { margin-left: 0;} /* ==|== non-semantic helper classes ======================================== */ .ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; } .ir br { display: none; } .hidden { display: none !important; visibility: hidden; } .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } .invisible { visibility: hidden; } .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both; } .clearfix { zoom: 1; } /* ==|== print styles ======================================================= */ @media print { * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } }