@charset "utf-8";
/* CSS Document */
/***********************
	FONT FACES
***********************/
@font-face {
    font-family: 'Desyrel';
    src: url('../fonts/desyrel.eot');
    src: url('../fonts/desyrel.eot?#iefix') format('embedded-opentype'),
         url('../fonts/desyrel.woff') format('woff'),
         url('../fonts/desyrel.ttf') format('truetype'),
         url('../fonts/desyrel.svg#desyrel') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'MyriadPro-Regular';
    src: url('../fonts/myriadpro-regular.eot');
    src: url('../fonts/myriadpro-regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/myriadpro-regular.woff') format('woff'),
         url('../fonts/myriadpro-regular.ttf') format('truetype'),
         url('../fonts/myriadpro-regular.svg#myriadpro-regular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'MyriadPro-Bold';
    src: url('../fonts/myriadpro-bold.eot');
    src: url('../fonts/myriadpro-bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/myriadpro-bold.woff') format('woff'),
         url('../fonts/myriadpro-bold.ttf') format('truetype'),
         url('../fonts/myriadpro-bold.svg#myriadpro-bold') format('svg');
    font-weight: normal;
    font-style: normal;
}
/***********************
	COMMON ELEMENTS
***********************/
body {
	margin:0;
	padding:0;
	font-size:18px;
	color:#7e7e7e;
	font-family:'MyriadPro-Regular';
}
a { text-decoration:none; } a:hover { text-decoration:underline; }
.pattern1 {
	background:url(../images/bg/pattern1.jpg);
}
.pattern2 {
	background:url(../images/bg/pattern2.jpg);
}
.pattern3 {
	background:url(../images/bg/pattern3.jpg);
}
.pattern4 {
	background:url(../images/bg/pattern4.jpg);
}
.pattern5 {
	background:url(../images/bg/pattern5.jpg);
}
.pattern6 {
	background:url(../images/bg/pattern6.jpg);
}
.pattern7 {
	background:url(../images/bg/pattern7.jpg);
}
.pattern8 {
	background:url(../images/bg/pattern8.jpg);
}
h1 {
	font-size:50px;
	font-weight:normal;
	line-height:1.2em;
	margin:0;
}
h2 {
	font-family:'Desyrel';
	color:#353434;
	line-height:1.2em;
	font-size:28px;
	margin:0;
	padding: 10px 15px;
}
.blue, a.blue, a.blue:hover, a.blue:visited {
	color:#2889cc;
}
.red, a.red, a.red:hover, a.red:visited {
	color:#cb3041;
}
.green, a.green, a.green:hover, a.green:visited {
	color:#6b9648;
}
.orange, a.orange, a.orange:hover, a.orange:visited {
	color:#dd4e00;
}

h3 {
	font-size:16px;
	line-height:38px;
	font-weight:normal;
}
h4 {
	margin:0 0 18px;
	line-height:1em;
	font-size:35px;
	font-weight:normal;
}
/***********************
	FOOTER
***********************/
.footer {
	padding:2% 1%;
	width:96%;
	margin:5px auto;
	text-align: center;
}
.footer a {
	color:#555;
}
.flink {
	color:#999;
	text-decoration:none;
}
/***********************
	MISC
***********************/
.bold_mp {
	font-family:'MyriadPro-Bold';
	font-weight:bold;
}
.kit { display:inline-block; }
#benefits {
	font-family:'MyriadPro-Bold';
	color: #333;
	font-size: 21px;
	font-weight: normal;
}

#companies {
	font-family:'MyriadPro-Bold';
	color: #333;
	font-size: 23px;
	text-align:center;
	font-weight: normal;
}

.last {
	margin-right:0px !important;
}
.spacer {
	clear:both;
	display:block;
	width:100%;
}
.video-wrap {
	width:96%;
	margin:2vh auto 4vh;
	border:#222 solid 5px;
	background: #000;
	box-shadow: 0px 0px 20px 10px #777;
	border-radius:3px;
}
.blue .video-wrap {
	border-color:#2889cc;
	background: #2889cc;
}
.red .video-wrap {
	border-color:#cb3041;
	background: #cb3041;
}
.green .video-wrap {
	border-color:#6b9648;
	background: #6b9648;
}
.orange .video-wrap {
	border-color:#dd4e00;
	background: #dd4e00;
}

.video-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	margin: 0 auto;
}
.video-container iframe, .video-container object, .video-container embed, .video-container video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border:none;
}

.button {
	color:#FFF;
	display: inline-block;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	font-family:Tahoma, Geneva, sans-serif;
	font-weight: bold;
	white-space: nowrap;
	/*position:relative;*/
	outline: none;
	overflow: visible; /* removes extra side padding in IE */
	cursor: pointer;
	border: 2px solid #999;/* IE */
	border: rgba(0, 0, 0, .2) 2px solid;/* Saf4+, Chrome, FF3.6 */
	border-bottom:rgba(0, 0, 0, .4) 2px solid;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
	background: -moz-linear-gradient(
		center top,
		rgba(255, 255, 255, .1) 0%,
		rgba(0, 0, 0, .1) 100%
	);/* FF3.6 */
	background: -webkit-gradient(
		linear,
		center bottom,
		center top,
		from(rgba(0, 0, 0, .1)),
		to(rgba(255, 255, 255, .1))
	);/* Saf4+, Chrome */
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', 

EndColorStr='#19000000'); /* IE6,IE7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient

(startColorStr='#19FFFFFF', EndColorStr='#19000000')"; /* IE8 */
	-moz-user-select: none;
	-webkit-user-select:none;
	-khtml-user-select: none;
	user-select: none;
	margin:0;
	font-size:28px;
	padding:10px 18px;
}
.button:hover {
	text-decoration:none;
	background: -moz-linear-gradient(
		center top,
		rgba(255, 255, 255, .2) 0%,
		rgba(255, 255, 255, .1) 100%
	);/* FF3.6 */
	background: -webkit-gradient(
		linear,
		center bottom,
		center top,
		from(rgba(255, 255, 255, .1)),
		to(rgba(255, 255, 255, .2))
	);/* Saf4+, Chrome */
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#33FFFFFF', EndColorStr='#19FFFFFF'); /* IE6,IE7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient (startColorStr='#33FFFFFF', EndColorStr='#19FFFFFF')"; /* IE8 */

}
.button.grey { background-color: #666666 }
.blue .button { background: #2889cc; }
.red .button { background: #cb3041; }
.green .button { background: #6b9648; }
.orange .button { background: #dd4e00; }

.wrapper {
	padding:0 4% 2%;
	background:#FFF;
	border:solid 2px #EEE;
	box-shadow:inset 0px 0px 6px rgba(0, 0, 0, .5), 1px 1px 5px #444;
	width:90%;
	max-width:650px;
	margin:0 auto;
	border-radius: 6px;
}
.login {
	font-weight:bold;
	font-size: 22px;
	text-align:right;
	line-height:70px;
	padding-right:3%;
	width:97%;
	max-width:690px;
	margin:0 auto;
}
.login a:hover {
	text-decoration:none;
}

@media only screen and (max-width: 700px) {
 .pattern1,.pattern2,.pattern3,.pattern4,.pattern5,.pattern6,.pattern7,.pattern8 { background:#FFF;}
 .wrapper {
	padding:0;
	margin:0;
	border: none;
	box-shadow: none;
	width:100%;
	max-width:701px;
	border-radius: 0;
 }
}