﻿@charset "utf-8";

/* CSS Document */


@media (min-width:768px) {
.container {
	width: 750px
}
}

@media (min-width:800px) {
.container {
	width: 770px
}
}

@media (min-width:900px) {
.container {
	width: 870px
}
}

@media (min-width:992px) {
.container {
	width: 970px
}
}

@media (min-width:1200px) {
.container {
	width: 990px
}
}
/*General*/
body{font-family:"Open Sans","Helvetica Neue",Helvetica,sans-serif}
.container {
	max-width: none;
	margin: 0 auto;
}
iframe {
	width: 100%;
}
.h4, .h5, .h6, h4, h5, h6, h1, h2, h3 {
	margin-top: 0px;
	margin-bottom: 0px;
	font-weight: normal;
}
h1 {
	font-size: 3.5em;
	font-weight: 300;
}
h3 {
	font-size: 1.2em;
}
h2 {
	font-size: 2.5em;
	font-weight:300;
}
h4 {
	font-size: 1em;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{line-height:1.4em;}
/*General*/
/*Header*/
header {
	overflow: hidden;
}
header nav li {
	padding-left: 5%;
}
header h3 {
	margin-top: 0px;
	font-weight: normal;
	font-size: 22px;
	position: absolute;
	right: 0px;
}

header nav li, .navbar-brand {
	font-size: 100%;
}
header nav li a.current, .navbar-default .navbar-brand {
	color: #4289ba;
}
.navbar-default .navbar-brand {
	padding-right: 5px;
}
.navbar-default .navbar-brand span {
	color: #656565;
	padding-left: 20px;
	display: inline-block;
	width: 5%;
}
header nav {
	width: 74%;
	padding-top: 50px;
}
/*Navigation*/
.navbar-default {
	background: none;
	border: 0px;
}
.navbar-brand {
	padding-top: 10px;
	padding-bottom: 5px;
}
.nav > li > a {
	padding: 10px 0 5px 0;
}
header #login {
	margin-top: 50px;
}
.navbar-nav {
	width: 74%;
}
/*Hero section*/
section#hero .halfs.pitch, section#hero .halfs.video, .thirds, section .features, section .icon-set, .halfs {
	width: 100%;
}
section#hero .halfs h3 {
	margin: 0px;
}
hr {
	background: rgba(0, 0, 0, 0) url("../img/hr.png") repeat-x scroll left bottom;
	border: 0 none;
	clear: both;
	height: 3px;
	margin-bottom: 60px;
	margin-top: 60px;
}
/*Testimonials*/
section#testimonials .tleft .testimonial {
	padding-right: 0px;
}
section#testimonials .tmiddle .testimonial {
	padding-left: 0px;
	padding-right: 0px;
}
section#testimonials .tright .testimonial {
	padding-left: 0px;
}
/*Footer*/
footer .footer {
	text-align: left;
	margin-right: 0px;
	font-size: 105%;
}
footer h4 {
	text-align: left;
}

/*Pricing Page*/
section#pricing .grid{width:600px; margin:0 auto; float:none; }
h3.subhead{padding-bottom:120px;}
.pricing-panel{padding-top:90px;}
section#pricing h2 {width:100%;}
.pricing-panel h2 strong{line-height:24px;}
section .icon-set{min-height:140px;}
/*Tour*/
.chrome{margin-top:15px;}
section .feature-set .halfs.left ul, section .feature-set .halfs.left h6{margin-right:0px;}
section .feature-set .halfs.right ul, section .feature-set .halfs.right h6{margin-left:0px}
.bx-wrapper .bx-viewport{border:0px; box-shadow:none; left:auto;}
section#features #bx-pager .tabbar{
 	border: 1px solid #c9c7c7;
    border-radius: 5px;
    box-shadow: 0 1px 3px #ccc;
    list-style: outside none none;
    overflow: hidden;
}	
section#features #bx-pager .tabbar a{
background: rgba(0, 0, 0, 0) url("../img/tabbar.png") repeat-x scroll 0 0;
width: 20%;	
display: block;
float: left;
text-decoration: none;
margin: 0;
text-align: center;
}

section#features #bx-pager .tabbar a span{
    background: rgba(0, 0, 0, 0) url("../img/tabbar-sep.png") repeat-y scroll right 0;
    color: #838383;
    padding-bottom: 20px;
    padding-top: 20px;
    text-decoration: none;
    white-space: nowrap;
    width: 100%;
	display:block;	
}
section#features #bx-pager .tabbar a:last-child span{background:none;}
section#features #bx-pager .tabbar a.active{ background: rgba(0, 0, 0, 0.02) none repeat scroll 0 0;
    box-shadow: 0 1px 3px #ccc inset; color:#4289ba;}
.footer a{font-size:90%;}

.chrome .frame{width:838px; position:relative;  left:auto; top:27px; margin:0 auto;}
.chrome .shadow{width:838px; position:absolute;  left:50%; bottom:4px; height:16px; margin-left:-419px; }
#features .thirds{min-height:130px;}
#hero h3.subhead{padding-bottom:60px;}

@media (max-width:1024px) {
	.bx-wrapper{margin-bottom:0px;}
	.chrome .frame img{width:100%; height:auto; display:block;}
	.chrome .shadow, .chrome .frame{width:100%; height:auto;}
	.chrome .shadow{height:16px; width:100%; left:auto; margin-left:auto; right:auto; bottom:-30px;}
	
	.chrome{width:100%; overflow:hidden; height:auto; background:none #ECEEF0; border:1px solid #ADADAD; box-shadow:0 -1px 2px rgba(173, 173, 173, 0.85); border-radius:4px 4px 0px 0px;}
	section#features #bx-pager .tabbar a span{font-size:90%;}
}

@media (max-width:980px) {
section#features .thirds {
	min-height: 160px;
	padding-bottom: 40px;
}
header nav {
	width: 68%;
}
}

@media (max-width:899px) {
section#features .thirds {
	min-height: 160px;
	padding-bottom: 40px;
}
header nav {
	width: 68%;
}
.navbar-default .navbar-brand span {
	padding-left: 10px;
}

.navbar-brand, header nav li a{font-size:90%;}
}

@media (max-width:767px) {
.container{width:95%; padding-left:15px; padding-right:15px;}
header img{width:20%}
header nav{width:auto; margin-left:20px; }
header #login{width:15%}
header h3{right:15px;}
.navbar-default .navbar-toggle{ 
	background-color: #d0d2d4;
    background-image: -moz-linear-gradient(-90deg, #eff0f0 0px, #d9dfe3 100%);
    border-radius: 4px;
    box-shadow: 0 2px 1px rgba(0, 0, 0, 0.15), 0 0 1px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.55) inset;
    color: #777;
    display: inline-block;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
	margin-top:0px;
	float:none; 
	}
	.navbar-default .navbar-brand{display:none}
	.navbar-collapse{
	background-color: #d0d2d4;
    background-image: -moz-linear-gradient(-90deg, #eff0f0 0px, #d9dfe3 100%);
    border-radius: 4px;
    box-shadow: 0 2px 1px rgba(0, 0, 0, 0.15), 0 0 1px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.55) inset;
    color: #777;	
	text-shadow: 0 5px 10px rgba(255, 255, 255, 0.5);	
	}
	.navbar-nav, header nav li{width:100%;}
	header nav li a{display:block; width:100%;}
	.navbar-nav{margin-left:0px; margin-right:0px; margin-top:10px; margin-bottom:10px;}
	header nav li{padding-left:0px; margin-bottom:3px;}
	header nav li a.current{border:none; background:#4289ba!important; color:#ffffff!important;}
	.nav > li > a{ padding-left:10px!important; border-radius:5px;}
	header nav li a:hover{background:#4289ba!important; color:#ffffff!important; border:none;}
	section#features .thirds{min-height:auto;}
	h2 img{width:20%;}
	#testimonials h2{padding-bottom:20px;}
	section#testimonials .testimonial{padding-top:0px!important; padding-bottom:10px;}
	#testimonials span{font-size:80%;}
	.button.cta{padding:12px 34px;}
	h1{font-size:2.0em;}
	footer .footer{margin-bottom:25px;}
	footer h4{text-align:center;}
	footer .footer{text-align:center;}
	/*Pricing*/
	section#pricing h2{text-align:center; margin-bottom:25px;}
	section .icon-set{min-height:auto; margin-bottom:25px; padding-bottom:0px; overflow:hidden;}
	.thirds{margin-bottom:25px;}
	hr{margin-top:35px;}
	.chrome{margin-bottom:35px;}
	.navbar-collapse{position:absolute; z-index:999; left:0px; right:0px; width:100%;}
	.navbar-default .navbar-toggle{float:left;}
	.navbar-default .navbar-collapse, .navbar-default .navbar-form{margin-left:0px;}
	header{overflow:visible;}
	header nav{ width:50%;}
	section#features .thirds{padding-bottom:0px;}


}

@media (max-width:700px) {
	section#pricing .grid, section#pricing .grid .inset{width:100%; overflow:hidden; height:auto;}
	section#pricing .grid .freelancer, section#pricing .grid .studio, section#pricing .grid .agency{width:100%; float:none; margin-bottom:40px; margin-top:0px;}
	section#pricing .grid .inset{background:none; border:none; box-shadow:none; text-align:center;}
	section#pricing .grid .freelancer, section#pricing .grid .agency,  section#pricing .grid .studio{background:rgba(0, 0, 0, 0.02)!important; border:1px solid #c9c7c7!important; box-shadow:0 1px 3px #ccc inset!important; padding-bottom:20px;}
	section#pricing .grid h6.noborder{border-bottom:1px solid rgba(0, 0, 0, 0.1); box-shadow:0 1px 1px rgba(255, 255, 255, 0.4); margin-bottom:15px;}
	section#pricing .grid .studio h5.price, section#pricing .grid .agency h5.price, section#pricing .grid .freelancer h5.price{border-top:1px solid rgba(0, 0, 0, 0.1); box-shadow:0 1px 1px rgba(255, 255, 255, 0.4) inset;}
 section#pricing .grid .studio{background:rgba(0, 0, 0, 0) url("../img/studio.png") repeat-x scroll 0 0!important}
 section#pricing .grid .agency{margin-bottom:0px;}
 h3.subhead{padding-bottom:50px;}
}

@media (max-width:480px) {
	.container{width:98%;}
	header{padding-top:10px; padding-bottom:0px;}
	header img{width:20%;}
	header nav{float:left; padding-top:32px; width:50%;}
	header #login{margin-top:32px; width:auto; float:right; width:18%;}
	h1{margin-top:25px;}
	header nav{padding-left:0px;}
	
	

}
@media (max-width:369px) {
	header img{width:26%;}
	header nav{width:40%;}
	header #login{width:25%}
	navbar-header{margin-left:0px!important;}
	header .nav > li > a{font-size:12px; padding:5px!important; }
	.navbar-collapse{width:100%!important;}
	
}

