/* ==== Google font ==== */
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700');
@import 'https://fonts.googleapis.com/css?family=Roboto:400';
/* ===================================
1. General
==================================== */
*{margin:0; padding:0;}

img, object, embed, video {max-width: 100%;}

/* IE 6 does not support max-width so default to width 100% */
.ie6 img {width:100%;}

input {padding-left:20px;}
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {display:block;}
audio, canvas, video {display:inline-block; *display:inline; *zoom:1;}
audio:not([controls]) { display: none; }

html {font-size:100%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
body {margin:0; font-size:16px; line-height:1.6em; background-color:#f7f7f9;}
body, button, input, select, textarea {
	font-family:'Source Sans Pro', Arial, sans-serif;
	font-weight:400;
	line-height:1.6em;
	color:#666666;
    margin: 0;
}

a {text-decoration:none;}
a:active {outline:0;}
button:active {outline:0; border:0;}
li {list-style:none;}
img,button {border:none;}

.clearfix::after {
	content:"";
	display:block;
	visibility:hidden;
	height:0;
	clear:both;
}

h1,h2, h3, h4, h5, h6 {
	font-family:'Source Sans Pro', Arial, sans-serif;
	font-weight:700;
	line-height:1.1em;
	color:#333;
}

p {font-family:'Source Sans Pro', Arial, sans-serif;font-weight:400;}

.container {
	display:block;
	max-width:1180px;
	margin:0 auto;
}

.container-fluid {
	display:block;
	width:100%;
}

::selection {background:#127ec3; color:#fff;}
img::selection,button::selection,a::selection {background:transparent;}
.highlight {color:#f25a50;font-weight:700 ; font-family:'Source Sans Pro', Arial, sans-serif;}
.hidden {display:none;}

/* ===================================
2. Header Section
==================================== */
header img {width:100%;}
header h1 {padding:0 20px; font-family:Courgette, Arial, sans-serif; color:#f25a50; font-size:48px; margin:20px 0; text-align: center;}
header h2 {padding:0 20px; font-size:24px; font-weight:300; line-height:1.3em; margin-bottom:0px; text-align: center;}
header article {padding:0;}
header article h1 {padding:0 20px; font-family:Courgette, Arial, sans-serif; color:#f25a50; font-size:48px; margin:20px 0;}
header article h2 {padding:0 20px; font-size:24px; font-weight:300; line-height:1.3em; margin-bottom:20px; max-width:500px;}
header p {background:#f25a50; padding:40px 20px; color:#fff; font-size:18px; font-weight:300; clear:both;}
header p.swap1 {display:none;}
header p.swap2 {display:block;}
header p.swap12 {display:none;background:#f25a50; padding:20px 20px; color:#fff; font-size:18px; font-weight:300; clear:both; text-align: center;}
header p.swap22 {display:block;background:#f25a50; padding:20px 20px; color:#fff; font-size:18px; font-weight:300; clear:both; text-align: center;}

.js-video {height: 0; padding-top: 5px; padding-bottom: 67.5%; margin-bottom: 10px; position: relative; overflow: hidden;}
.js-video.widescreen { padding-bottom: 56.34%;}
.js-video.vimeo { padding-top: 0;}
.js-video embed, .js-video iframe, .js-video object, .js-video video { top: 0; left: 0; width: 100%;height: 100%;position: absolute;}

/* ===================================
3. Content Section
==================================== */
section {padding:40px 20px; margin-bottom:40px;}
section .content {margin-bottom:40px;}
section .content h2 {font-size:28px; font-weight:600; color:#636363; margin-bottom:20px;}
section .content p {font-weight:300; color:#636363; font-size:18px; margin-bottom:20px;}
section .content ul {padding-left:40px; float:left;}
section .content ul li {list-style-image:url(../images/bullet.png); margin-bottom:15px;}

section .form-container {width:96%; max-width:580px; background:#fff; text-align:center; border-radius:10px; border:solid 1px #ccc;}
section .form-container form{padding:40px 2%;}
section .form-container form h3{font-size:30px; color:#f25a50; margin-bottom:10px;}
section .form-container form p {font-size:18px; color:#605d5d;}
section .form-container form h5 {font-size:18px; color:#666; font-weight:600; margin:20px 0;}
section .form-container form input {display:block; margin:10px auto 20px; width:88%; height:35px; color:#bcbcbc;}
section .form-container form input:focus {color:#f25a50;}
section .form-container form button {display:block; margin:10px auto 20px; width:94%; padding:20px 0; color:#fff; background:#f25a50; cursor:pointer; font-size:24px;}
section .form-container form button:hover {background:#333;}
section .form-container a {font-size:14px; color:#666666; text-decoration:underline; font-weight:300;}
section .form-container a:hover {color:#323a45; font-weight:400;}
section .form-container p.disclaimer {font-size:14px; color:#b4b4b4; font-weight:300; padding:10px 20px; text-align:justify; line-height:22px; cursor:default;}
section .form-container p.disclaimer:hover {color:#999;}
section form label.error { display: block; width: 100%; font-weight: bold; color: #fff; background-color: #df1f26; font-size: 12px; border-radius: 20px; padding: 10px; margin-top: 4px; }
section form label.errorblock input { border-color: #df1f26; }

section span.divider {clear:both; border-bottom:solid 1px #ccc; display:block; position:relative; top:40px;}

/* ===================================
4. Footer Section
==================================== */
footer {padding:40px 20px 10px;}
footer img {display:block; margin:0 auto 20px;}
footer h4 {font-size:16px; font-weight:400; text-align:center; margin-bottom:20px; line-height:40px;}
footer h4 span {color:#f25a50;}

@media screen and (min-width:544px) and (min-device-width:544px){
	section .form-container form button {width:92%;}
}


@media screen and (min-width:768px) and (min-device-width:768px){
header img {float:left; width:40%;}
header article {float:left; width:60%;}

section .content {float:right; width:50%; margin-top:40px;}
section .form-container {float:left; width:48%;}
section .form-container form button {width:94%;}


footer img {float:right;}
footer h4 {float:left;}
	
}

@media screen and (min-width:922px) and (min-device-width:922px){
header p.swap1 {display:block;}
header p.swap2 {display:none;}
header p.swap12 {display:block;background:#f25a50; padding:20px 20px; color:#fff; font-size:18px; font-weight:300; clear:both; text-align: center;}
header p.swap22 {display:none;background:#f25a50; padding:20px 20px; color:#fff; font-size:18px; font-weight:300; clear:both; text-align: center;}
	
}

@media screen and (min-width:1080px) and (min-device-width:1080px){
	section .form-container form button {width:92%;}
}