/* -- BEGIN RESET & SUPPORT
--------------------------------------------------------------------------------------------------------------- */

article, footer, header, section { 
	display:block;
	overflow:hidden; 
}
*, *:after, *:before {
	-webkit-box-sizing: border-box;
  	-moz-box-sizing: border-box;
  	box-sizing: border-box; 
}

/* -- END RESET & SUPPORT
--------------------------------------------------------------------------------------------------------------- */

/* -- BEGIN GLOBAL
--------------------------------------------------------------------------------------------------------------- */

body {
	background: #f3f3f3;
	color: #3e423f;
	font-family: 'Open Sans', sans-serif;
	font-size:100%;
	margin:0;
	padding:0;
	text-align: center;
}
a { color:#3b56be; text-decoration:none;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out; }

a:hover {text-decoration:underline;}

.fl{ float:left}
.fr{ float: right}


form {overflow:hidden;position:relative;background:#FFFFFF; padding:35px; max-width:360px; margin:auto;
-webkit-border-radius:5px; -moz-border-radius: 5px; border-radius: 5px;	
}
input, select, textarea{-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;padding:14px;	width:100%; border: solid 1px #d2d6f3; background:#f1f1f1; border:none; margin-bottom:0.5em; font-size:16px; }
label{
	font-size:16px;
	margin-bottom:0.5em;
	margin-right: 20px;
	width:100%;
	display: block;
	text-align: left;
}
input[type=checkbox], input[type=radio] {
	margin-top: 5px;
	width:10px;
}
form p{
	color:#000 !important;
}
.button {border:none; color:#fff; width:100%;-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
background:#f87a23;margin:.5em auto 0; font-size:18px; font-weight:bold;
}
.button:hover {cursor:pointer; background:#b0d500;}
.wrapper {margin:0 auto;max-width:1140px;overflow:hidden;padding:20px 15px; /*48px 16px;*/}

/* -- BEGIN TYPOGRAPHY
--------------------------------------------------------------------------------------------------------------- */

h1,h2,h3,h4,h5,h6 {
	line-height: normal;
	margin:0;
        word-wrap: break-word;
}

/* -- BEGIN LAYOUT
--------------------------------------------------------------------------------------------------------------- */
#headline{background:#fff;}
#headline .left{font-size:34px; float:left; color:#3b56be; text-align:left;text-transform:uppercase; word-wrap: break-word;}
#headline .right{font-size:20px; font-style:italic; color:#626263; float:right; text-align:right; font-weight:300; word-wrap: break-word;}

.panel-main { background:#3b56be; }

.left-section{float: left; width: 50%; text-align:left; }
.left-section img {margin:0; width:75%; max-width:75%;}

.right-section{float: right; width: 50%; text-align:left;}
.right-section h3{font-size: 2em;text-align: left; color: #FFF; display: block;font-weight: 400;margin: 16px auto;}
.right-section p{margin: 2em 0px;text-align: left;color: #c0e6fc;font-size:15px;}
.right-section p.note{font-size: 80%; margin: 25px auto;}

#footer .wrapper {padding:10px 15px; /*48px 16px;*/}
#footer p{margin: 10px 0px;text-align: center;color: #636f78; font-family: "Open Sans",sans-serif;font-size:90%;}
#footer .left{float:left}
#footer .right{float:right}
/* -- media Query
--------------------------------------------------------------------------------------------------------------- */

@media screen and (max-width: 640px){
	.right-section h3{font-size:25px;margin: 15px auto;}
	.right-section p{margin: 1em 0px;}
	.left-section img {	margin:0 auto; 	width:80%; max-width:70% !Important;}

	#footer .left, #footer .right {float:none !important;}
}

@media screen and (max-width: 768px){
	.left-section, .right-section {float:none;width:100%; text-align: center; }
	.left-section img {	margin:0 auto; 	width:50%!; max-width:50%;}
	.right-section h3{text-align:center;}
	#headline .left{float:none;text-align:center;}
	#headline .right{float:none; text-align:center;}
}
@media screen and (max-width: 320px){
	form{ padding:20px;}
	.left-section img {	margin:0 auto; 	width:95%; max-width:95% !Important;}
}