@import url(//fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900,200italic,300italic,400italic,600italic,700italic,900italic|Dosis:200,300,400,500,600,700,800|Lato:100,300,400,700,900,100italic,300italic,400italic,700italic,900italic);

/* ====== RESET ====== */

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;
  outline: none;
}
html { height: 101%; } /* always display scrollbars */
body { font-size: 62.5%; line-height: 1; font-family: Arial, Tahoma, Verdana, sans-serif; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
ol, ul { list-style: none; }

blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
strong { font-weight: bold; } 

input { outline: none; }

table { border-collapse: collapse; border-spacing: 0; }
img { border: 0; max-width: 100%; }

a { text-decoration: none; }
a:hover { text-decoration: underline; }

/* ====== RETINA ====== */

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) { 
    .logo a {
			background: url(/images/2013/logo-flat@2x.png) no-repeat 0 center !important;
		}
		
		#footer-logo a {
			background: url(/images/landing/logo-footer@2x.png) no-repeat !important;
		}

}

/* ====== BODY ====== */

body {
	font-family: 'Source Sans Pro', sans-serif;
	font-weight: 300;
	background-image: url(/images/landing/bg2.png);
}

/* ====== Clearfix ====== */

.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

/* ====== Header ====== */

header#header {
	height: 50px;
	background-color: #1f2833;
	border-bottom: 1px solid #fff;
	background-image: url(/images/2011/bg.png);
	padding-bottom: 60px;
	padding-top: 60px;
}

div.wrapper {
	width: 960px;
	margin-left: auto;
	margin-right: auto;
}

div#tagline, h1#tagline {
	color: #fff;
	font-size: 14px;
	float: right;
	margin-top: 16px;
	font-weight: 300 !important;
	font-family: 'Source Sans Pro', sans-serif;
	text-shadow: none;
}

div#tagline span, h1#tagline span {
	font-weight: 600;
	color: #b6e90c;
}

div#logo {
	float: left;
}

div#logo a {
	height: 50px;
	float: left;
	width: 129px;
	background: url(/images/2013/logo-flat.png) no-repeat left top;
	     background-size: 129px 50px;
	-moz-background-size: 129px 50px;
}

/* ====== Form Styles ====== */

form#email {
	float: left;
	position: relative;
	left: -21px;
	top: -21px;
}

form#email input {
	width: 450px;
	padding: 20px 20px 20px 30px;
	color: #a1a1a1;
	border: 1px solid #feffff;
	height: 71px;
	position: relative;
	font: 300 32px 'Source Sans Pro', sans-serif;
}

form#email input:focus {
	background-color: ;
}

button#button {
	float: right;
	text-align: center;
	color: #fff;
	text-shadow: #86b11f 1px 1px 0;
	text-decoration: none;
	width: 460px;
	background-color: #9ECD2E;
	margin-right: -21px;
	font: 700 38px 'Source Sans Pro', sans-serif;
	overflow: hidden;
	margin-top: -21px;
	border: none;
	height: 113px;
	cursor: pointer;
}

button#button:hover {
	background-color: #98c52d;
	/* background-image: -moz-linear-gradient(top, #98c52d, #7ba21e);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#98c52d), to(#7ba21e));
	background-image: -webkit-linear-gradient(top, #98c52d, #7ba21e);
	background-image: -o-linear-gradient(top, #98c52d, #7ba21e);
	background-image: linear-gradient(to bottom, #98c52d, #7ba21e);
    cursor: pointer; */
}

/* ====== OEM Password ====== */

#form-wrapper {
	float: right;
	width: 400px;
	background-color: #fff;
	box-shadow: 0 0 px #eaeaea;
	-moz-box-shadow: 0 0 8px #eaeaea;
	-webkit-box-shadow: 0 0 8px #eaeaea;
	padding: 30px;
}

#form-wrapper p {
	font-size: 14px;
	line-height: 20px;
	color: #7e7e7e;
}

form#password {
	width: 400px;
	float: left;
}

form#password input {
	float: left;
	clear: left;
	padding: 20px;
	font-size: 16px;
	width: 360px;
	border: 1px solid #eee;
	background-color: #fbfbfb;
	margin-bottom: 20px;
}

form#password input:focus {
	background-color: #f1f1f1;
}

form#password button {
	text-align: center;
	color: #fff;
	text-shadow: #86b11f 1px 1px 0;
	text-decoration: none;
	background-color: #9ECD2E;
	font: 700 28px 'Source Sans Pro', sans-serif;
	overflow: hidden;
	border: none;
	cursor: pointer;
	width: 100%;
	padding-top: 10px;
	padding-bottom: 10px;
	height: 60px;
}

form#password button:hover {
	background-color: #98c52d;
	/* background-image: -moz-linear-gradient(top, #98c52d, #7ba21e);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#98c52d), to(#7ba21e));
	background-image: -webkit-linear-gradient(top, #98c52d, #7ba21e);
	background-image: -o-linear-gradient(top, #98c52d, #7ba21e);
	background-image: linear-gradient(to bottom, #98c52d, #7ba21e);
    cursor: pointer; */
}

/* ====== Main Content ====== */

a {
	color: #3e76b3;
}

h1 {
	margin-bottom: 25px;
	font-size: 44px;
	font-weight: 300;
	color: #4b4b4b;
	text-shadow: #fff 1px 0 0;
}

h2 {
	font-size: 20px;
	color: #3e76b3;
	text-shadow: #fff 1px 0 0;
	margin-bottom: 10px;
}

p {
	color: #4b4b4b;
	font-size: 16px;
	font-weight: 400;
	line-height: 30px;
	margin-bottom: 20px;
}

p strong {
	font-size: 18px;
}

p strong.blue {
	color: #3e76b3;
}

section#main-content {
	padding-bottom: 30px;
}

.topmarg {
	margin-top: 40px;
}

.nomarg {
	margin-bottom: 0 !important;
}

/* ====== Headline ====== */

div#headline {
	padding-top: 60px;
	margin-bottom: 30px;
}

div#headline-image {
	float: right;
	width: 460px;
	overflow: hidden;
	height: 425px;
	background: url(/images/landing/main-image.png) right top;
}

div#vid {
	width: 415px;
	height: 261px;
	margin-left: 23px;
	margin-top: 22px;
	background: #f0f0f0 url(/images/landing/vid-bg.png) no-repeat left top;
	cursor: pointer;
}

div#vid.hostname {
	background: #f0f0f0 url(/images/landing/hostname.png) no-repeat left top;
}

div#headline-image img {
	float: right;
}

div#headline-content {
	float: left;
	width: 460px;
}

ul#headline-list {
	
}

ul#headline-list li {
	padding-left: 20px;
    background: url(/images/2011/checkmark.png) no-repeat left 6px;
	color: #4b4b4b;
	float: left;
	width: 210px;
	font: 18px 'Dosis', sans-serif;
	margin-bottom: 15px;
}

/* ====== Callout Box ====== */

div#callout-box {
	box-shadow: 0 0 2px #d7d7d7, inset 0 0 29px #ebebeb;
	-moz-box-shadow: 0 0 2px #d7d7d7, inset 0 0 29px #ebebeb;
	-webkit-box-shadow: 0 0 2px #d7d7d7, inset 0 0 29px #ebebeb;
	clear: left;
	background-color: #f6f6f6;
	border: 1px solid #ebebeb;
	width: 920px;
	height: 91px;
	padding: 20px 20px 0;
}

div#callout-box.top {
	margin-top: 60px;
}

div#callout-box h1 {
	margin: 0 0 5px;
	font-size: 26px;
	text-shadow: #fff 1px 1px 0;
}

div#callout-box p {
	margin: 0;
	line-height: 20px;
	font-size: 14px;
}

div#callout-box p span {
	color: #3e76b3;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding-left: 5px;
	padding-right: 5px;
	padding-bottom: 2px;
	font-weight: bold;
	font-size: 16px;
}

div#callout-message {
	float: left;
	width: 460px;
}

div#button-wrapper {
	float: right;
}

a#button {
	float: right;
	text-align: center;
	color: #fff;
	text-shadow: #86b11f 1px 1px 0;
	text-decoration: none;
	width: 460px;
	background-color: #9ECD2E;
	margin-right: -21px;
	margin-top: -21px;
	height: 80px;
	font: 700 38px 'Source Sans Pro', sans-serif;
	overflow: hidden;
	padding-top: 33px;
}

a#button:hover {
	background-color: #98c52d;
	/* background-image: -moz-linear-gradient(top, #98c52d, #7ba21e);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#98c52d), to(#7ba21e));
	background-image: -webkit-linear-gradient(top, #98c52d, #7ba21e);
	background-image: -o-linear-gradient(top, #98c52d, #7ba21e);
	background-image: linear-gradient(to bottom, #98c52d, #7ba21e);
    cursor: pointer; */
}

a#button.light {
	-webkit-border-radius: 0px 3px 3px 0px;
	-moz-border-radius: 0px 3px 3px 0px;
	-border-radius: 0px 3px 3px 0px;
	color: #5a5a5a;
	text-shadow: #feffff 1px 1px 0;
	border: 1px solid #d1d0d2;
	background: rgb(255,255,255); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(239,239,239,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(239,239,239,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(239,239,239,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(239,239,239,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(239,239,239,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(239,239,239,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=0 );
}

a#button.light:hover {
	background: rgb(239,239,239,1); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(239,239,239,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(239,239,239,1)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(239,239,239,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(239,239,239,1) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgba(239,239,239,1) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom, rgba(239,239,239,1) 0%,rgba(255,255,255,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=0 );
}

/* ====== Featured Items ====== */

div#featured-items {
	margin-top: 60px;
	float: left;
	width: 990px;
	margin-left: -30px;
}

div#item {
	float: left;
	width: 300px;
	margin-left: 30px;
}

div#item p {
	line-height: 20px;
	font-size: 14px;
	margin-top: 3px;
}

div#item p strong {
	font-weight: bold;
	font-size: 18px;
	text-shadow: #fff 1px 0 0;
}

div.icon {
	float: left;
	width: 64px;
	height: 64px;
	background-color: #3e76b3 !important;
	-webkit-border-radius: 37px;
	-moz-border-radius: 37px;
	border-radius: 37px;
	margin-right: 20px;
	margin-bottom: 50px;
}

div.icon.blue {
	background: url(/images/landing/icons.png) no-repeat 21px 20px;
}

div.icon.green {
	background: url(/images/landing/icons.png) no-repeat 21px -138px;
}

div.icon.orange {
	background: url(/images/landing/icons.png) no-repeat 20px -84px;
}

/* ====== Footer ====== */

footer#footer {
	
}

div#foot {
	border-top: 1px solid #e1e1e1;
	padding-top: 20px;
	padding-bottom: 29px;
}

div#footer-logo {
	float: right;
	padding-right: 20px;
	margin-top: 4px;
}

div#footer-logo a {
	width: 51px;
	height: 23px;
	float: right;
	background: url(/images/landing/logo-footer.png) no-repeat;
	     background-size: 51px 23px;
	-moz-background-size: 51px 23px;
}

div#copyright {
	float: left;
	width: 450px;
	font: 10px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	color: #959595;
	margin-top: 8px;
	margin-left: 15px;
}

div#google_translate_element {
	float: left;
	margin-top: 4px;
}

/* ====== Social Icons ====== */

ul#social-icons {
	float: left;
	margin-right: 10px;
}

ul#social-icons li {
	float: left;
	margin-right: 5px;
}

ul#social-icons li a {
	width: 31px;
	height: 32px;
	float: left;
}

a#facebook {
	background: url(/images/landing/social-icons.png) left top;
}

a#twitter {
	background: url(/images/landing/social-icons.png) -31px;
}

a#youtube {
	background: url(/images/landing/social-icons.png) -62px;
}