@charset "UTF-8";
/* CSS Document */


/* Reset */

html, body {
	margin:0; 
	padding:0; 
	border:0;  
	background:transparent; 
	font-size:13px; 
}

div, span, article, aside, footer, header, hgroup, nav, section, h1, h2, h3, h4, h5, h6, p, blockquote, a, ol, ul, li, table, tr, th, td, tbody, tfoot, thead {
	margin:0; 
	padding:0; 
	border:0; 
	vertical-align: baseline; 
	background: transparent; 
}

img {
	margin:0; 
	padding:0; 
	border:0; 
}

table, tr, th, td, tbody, tfoot, thead {
	margin: 0; 
	padding: 0; 
	border: 0; 
	vertical-align: baseline; 
	background: transparent; 
}

table {
	border-collapse: collapse; 
	border-spacing: 0; 
}

input, select, textarea, form, fieldset {
	margin: 0; 
	padding: 0; 
	border: 0; }

article, aside, dialog, figure, footer, header, hgroup, nav, section {
	display:block;
}

h1, h2, h3, h4, h5, h6, p, li, address, blockquote, td, th, a, caption, em, i, u, strike {
	font-family: Arial, Helvetica, sans-serif; 
	font-size:100%; 
	font-weight: normal; 
	font-style: normal; 
	line-height: 100%; 
	text-indent: 0; 
	text-decoration: none; 
	text-align: left; 
	color: #000; 
}

ol, ul {
	list-style: none;
}


h1 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:36px;
	font-weight:normal;
	color:#7298E4;
	margin:45px 0px 0px 0px;
}

h2 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:22px;
	font-weight:normal;
	color:#69f;
	margin:20px 0px 20px 0px;
}
p {
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	font-weight:normal;
	line-height:1.3;
	color: #999;
	margin: 0px 0px 5px 0px;
}

a {
	color:#69f;
}

a:hover {
	color:#5285eb;
}


body {
	background-color:#f1f1f1;
}

hr {
	border:solid 2px #F3F3F3;
	margin-bottom:20px;
}


/* Div containers */


#top_spacing {
	width:800px;
	height:30px;
	background-color:#f1f1f1;
	margin:0 auto;
}

#wrapper {
	width:800px;
	height:670px;
	background-color:#FFF;
	margin:0 auto;
    box-shadow: 6px 6px 5px #CCC;
}

#banner {
	width:800px;
	height:100px;
}

#header_box {
	width:670px;
	height:100px;
	margin-left:50px;
	float:left;
}

#help_box {
    display:none;
	width:30px;
	height:30px;
	margin:50px 40px 0px 0px;
	padding:0;
	float:right
}

#help_icon {
	width:30px;
	height:30px;
	background-image:url(images/help-icon-hover.png);
	background-repeat:no-repeat;
	float:left;
}

#help_icon a {
	width:30px;
	height:30px;
	background-repeat:no-repeat;
	background-image:url(images/help-icon.png);
}

#help_icon a:hover {
	background-image:none;
}


#main_container {
	width:700px;
	height:500px;
	margin:0 auto;
}

#intro_box {
	width:700px;
	height:90px;
	margin:0 auto;
}

#form_box {
	width:698px;
	height:398px;
	margin:0 auto;
	border:#ddd 1px solid;
}

#inner_form_box {
	width:560px;
	height:250px;
	margin:20px 70px 0px 70px;
	padding-top:20px;
}

#button-box {
	width:560px;
	height:90px;
	margin:10px 70px 0px 70px;
}

#button {
	font-family:Arial, Helvetica, sans-serif;
	font-size:24px;
	font-style:normal;
	text-align:center;
	line-height:1.3;
	color:#fff;
	width:160px;
	height:30px;
	padding:10px;
	margin:0;
	background-color:#69f;
	border-top:#accaff 2px solid;
	border-left:#accaff 2px solid;
	border-right:#3e71d7 2px solid;
	border-bottom:#3e71d7 2px solid;
	float:right;
}

#button:hover {
	width:160px;
	height:30px;
	background-color:#5c8ff5;
	cursor:pointer;
	float:right;	
}

#footer {
	width:700px;
	height:20px;
	margin-top:10px;
}

.footer_text {
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	font-weight:normal;
	color: #999;
	text-align:center;
}

.activation_number {
	font-family:Arial, Helvetica, sans-serif;
	font-size:24px;
	font-weight:normal;
	color:#000;
	margin:0px 0px 40px 0px;
}

.smaller_text {
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	line-height:1.3;
}


/* Form */

form ol {
	list-style-type:none;
}

form {
	text-align:left;
}

label {
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	line-height:1.3;
	width:540px;
	margin:5px 0px;
	text-align:left;
	display:block;
	background:none;
	color:#999;
}

submit {
	background:none;
}

input {
	width:540px;
	margin:0px 0px 20px 0px;
	border:#ddd 1px solid;
	padding:7px;
	background:none;
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px; 
}
		
input:focus {
	background-color:#eef3fa;
}


br {
	clear:left;
}

.clear {
	clear:both;
}


/* from validate.css */

.forms li {
  overflow: hidden;
  list-style-type:none;
}


em.error {
  clear: both; display: block;
  font-size: 12px; font-style:italic; color: #f00;
  margin: -10px 0 10px 0px;
}






submit {
	background:none;
}

input {
	width:540px;
	margin:0px 0px 20px 0px;
	border:#ddd 1px solid;
	padding:7px;
	background:none;
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px; 
}
		

		
/* mobine friendly  */
@media (max-width:12000px) {  
	#top_spacing { width:80%;}
	#wrapper { 	width:90%; max-width:960px; height:auto;}
	#banner { 	width:100%; }
	#header_box { width:100%; margin-left: 5%; height: auto; }
	#main_container { width:90%; height: auto;}
	#intro_box { width:100%; height: auto; }
	#form_box { 	width:100%; height:auto; }
	#inner_form_box { width:90%; margin: auto; margin-left: 5%; height:auto; }
	#button-box { width:50%; }
	#footer { width:50%; }
	label { width:95%; }
	input { width:95%; padding-left:0px; margin-left: 0px; font-size:1.5rem;}

}



/* Base Styles
末末末末末末末末末末末末末末末末末末末末末末末末末 */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
  font-size: 62.5%; }
body {
  font-size: 2.5em; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.6;
  font-weight: 400;
  font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #222; }


/* Typography
末末末末末末末末末末末末末末末末末末末末末末末末末 */
h1, h2, h3, h4, h5, h6 {
  margin-top: 1rem;
  margin-bottom: 2rem;
  font-weight: 300; }
  
h1 { font-size: 3.0rem; line-height: 1.2;  letter-spacing: -.1rem; margin-top: 3.2rem;}*/
h2 { font-size: 3.0rem; line-height: 1.3;  letter-spacing: -.1rem; }
h3 { font-size: 2.4rem; line-height: 1.35; letter-spacing: -.08rem; }
h4 { font-size: 1.8rem; line-height: 1.5;  letter-spacing: -.05rem; }
h5 { font-size: 1.5rem; line-height: 1.6;  letter-spacing: 0; }
h6 { font-size: 1.5rem; line-height: 1.6;  letter-spacing: 0; }


label, p { font-size: 1.5rem; line-height: 1.1;  letter-spacing: 0; margin-bottom: 2rem;}

input{ font-size:1.5rem;}

/* Larger than phablet */
@media (min-width: 550px) {
  h1 { font-size: 5.0rem; }
  h2 { font-size: 4.2rem; }
  h3 { font-size: 3.6rem; }
  h4 { font-size: 3.0rem; }
  h5 { font-size: 2.4rem; }
  h6 { font-size: 1.5rem; }
}



input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none; }
textarea {
  min-height: 65px;
  padding-top: 6px;
  padding-bottom: 6px; }
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
  border: 1px solid #33C3F0;
  outline: 0; }
  
label{
  margin-bottom: .5rem;
  font-weight: 200; }
fieldset {
  padding: 0;
  border-width: 0; }
input[type="checkbox"],
input[type="radio"] {
  display: inline; }
label > .label-body {
  display: inline-block;
  margin-left: .5rem;
  font-weight: normal; }