/*

BASE (MOBILE) SIZE
	These are the mobile styles. It's what people see on their phones.
	Remember, keep it light: Speed is Important.
*/

/* typography */


body{
	background:#f3f6fb;
	color:#666;
	font-family:'Source Sans Pro',Helvetica Neue,Helvetica,Arial, sans-serif; 
	font-size:1em;
	line-height:1.4em; 
	font-weight:300;
}
h1, h2, h3, h4, h5, h6{
	font-weight:300;
	font-family:'Source Sans Pro',Helvetica Neue,Helvetica,Arial, sans-serif; 
	line-height:1.2em;
	margin:.45em 0;
	padding:0;
} 

/* links */
a,
a:visited,
a:active,
a:hover{color:#0099ff;}
a:hover{ text-decoration:none;}


*{	box-sizing:border-box;
	-moz-box-sizing:border-box;}
  
/* structure */   
.wrapper{
	width: 92%; 
	margin: 0 auto;
}
header{ 
	padding:15px 0;
}
#banner{ 
	text-align:center;
	background:#333f4b;
}

#bannerText {
	text-align:left;
	width: 100%;
    margin: 0 auto;
	padding-top: 45px;
	color: #ffffff;
}

#bannerText p {
	padding-top: 30px;
}

.formTop {
	color:#fff; 
	background-color:#40b3ec; 
	border-top-right-radius: 4px; 
	border-top-left-radius: 4px;
	-webkit-border-top-right-radius: 4px; 
	-webkit-border-top-left-radius: 4px; 
	-moz-border-top-right-radius: 4px; 
	-moz-border-top-left-radius: 4px;	
	padding: 5px 0; 
	text-align:center;
}
	
#hero,
#page-header{
	background:#e57e31;
	padding:20px 0 0 0;
	font-size:1.1em;
}

#page-header h1{
	margin:0;
}

.flexslider{
	display:none;
}

#content,
aside,
.vertical-padding{  
	padding:0;
}



p{ 
	margin:0 0 1.5em;
	line-height: 1.5em;
	}
	
li {
	line-height: 1.5em;
}


img{ max-width:100%; height:auto;}


.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	margin-bottom:40px;
	position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
}

#content {  

	margin-top: 2em;
	margin-bottom: 2em;
}

/*FOOTER*/

.footer-icons {
    padding: 18px 30px 0 0;
	float:right;
}
#mktFooter #mktFooterTopLinks {
    -moz-box-shadow: 0 7px 5px -7px #CCCCCC;
    -webkit-box-shadow: 0 7px 5px -7px #CCCCCC;
    box-shadow: 0 7px 5px -7px #CCCCCC;
    position: relative;
    z-index: 9;
	}
	

.footer-copyright {
    color: #fff;
    padding: 30px 0 0;
    text-align: left;
	}

footer{  
	background:#4d5159;
	color:#ccc;
	font-size:80%;
	padding:20px 0;
}

ul{
	margin:0 0 0 3%;
	padding:0;
}



.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
  content: " ";
  display: table;
}
.clearfix:after,
.container:after,
.row:after{
  clear: both;
}



@media only screen and (min-width: 481px) {
#banner{
	float:left;
	text-align:left;
	margin-bottom:-40px;
}

#page-header{
	background:#e57e31;
	padding:20px 0 0 0;
	font-size:1.1em;
}

} 


@media only screen and (min-width: 920px) {
	
#page-header{
	background:#e57e31;
	padding:20px 0 0 0;
	font-size:1.1em;
	background: url("http://info.saucelabs.com/rs/saucelabsinc/images/bannerBkgd-orange-slice.jpg")
}	

.wrapper {
	max-width: 1000px; 
	margin: .75em auto 0 auto;
}
header {
	padding:0;
}
#banner { 
	float:left; 
	text-align:left;
	margin-bottom:0px;
	margin-top:5px;
}

#bannerImage {
	background-image: url("http://info.saucelabs.com/rs/saucelabsinc/images/bannerBkgd-orange.jpg");
	width: 100%;
	background-repeat:no-repeat;
	height: 296px;
}

#bannerText {
	text-align:left;
	width: 65%;
    margin: 0 0 0 320px;
	padding-top: 45px;
	color: #ffffff;
}

#bannerText p {
	padding-top: 30px;
}

.subTitle {
	font-size:.5em; 
	font-weight:bold;
}

#content {  
	float:left;
	width:55%;
	margin-top: 2em;
	margin-bottom: 2em;
}

#content.wide-content {
	float:none;
	width:100%;
}


aside { 
	float:right;
	width:40%;
	margin-top: -2em;
}


/*GRID*/
/*
 & Columns : 12 

 */
 .row{
	 margin-left: -15px;
     margin-right: -15px;
}
 
.grid_1 { width: 8.33333333%; }
.grid_2 { width: 16.66666667%; }
.grid_3 { width: 25%; }
.grid_4 { width: 33.33333333%; }
.grid_5 { width: 41.66666667%; }
.grid_6 { width: 50%; }
.grid_7 { width: 58.33333333%; }
.grid_8 { width: 66.66666667%; }
.grid_9 { width: 75%; }
.grid_10 { width: 83.33333333%; }
.grid_11 { width: 91.66666667%; }
.grid_12 { width: 100%; }

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	float: left;
	display: block;
}

.rightfloat{float:right;}

.leftfloat{float:left;}



