/*--
Author: W3layouts
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
--*/
/* 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,dl,dt,dd,ol,nav ul,nav 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;}
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
ol,ul{list-style:none;margin:0px;padding:0px;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
table{border-collapse:collapse;border-spacing:0;}
/* start editing from here */
a{text-decoration:none;}
.txt-rt{text-align:right;}/* text align right */
.txt-lt{text-align:left;}/* text align left */
.txt-center{text-align:center;}/* text align center */
.float-rt{float:right;}/* float right */
.float-lt{float:left;}/* float left */
.clear{clear:both;}/* clear float */
.pos-relative{position:relative;}/* Position Relative */
.pos-absolute{position:absolute;}/* Position Absolute */
.vertical-base{	vertical-align:baseline;}/* vertical align baseline */
.vertical-top{	vertical-align:top;}/* vertical align top */
nav.vertical ul li{	display:block;}/* vertical menu */
nav.horizontal ul li{	display: inline-block;}/* horizontal menu */
img{max-width:100%;}
/*end reset*/
/****-----start-body----****/

body, html{	
	font-family: 'Oxygen', sans-serif;
	height: 100%;
}
.main{
	/* margin:2em auto 0; */
	margin:0 auto 0;
	width:44%;
	padding-bottom:90px;   /* Height of the "Powered by" */
	/* padding-top:20px; */
	overflow: auto;
}

.main-card, .completion-page {
	margin:0 auto 0;
	padding-bottom:90px;   /* Height of the "Powered by" */
	overflow: auto;
	width: 100%;
	padding-top: 0px;
}

.main h2,.main h3{
	font-size: 1em;
	text-align: center;
	color:black;
	padding:1em 0;
	font-family: 'Oxygen', sans-serif;
}
.main h3{
	font-size: 1em;
	text-align:left;
	font-family: 'Oxygen', sans-serif;
}

ul.facebook{
	list-style:none;
	padding:0;
	-webkit-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-ms-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	background: #3B5998;
	padding: 12px;
}
i.fb{
	width:30px;
	height:30px;
	background:url(../images/fb.png);
	float:left;
	margin-right: 2em;
}
ul.facebook li{
	color:#fff;
	font-size:1em;
	float: left;
	margin-top: 5px;
}
ul.facebook:hover{
	background: #5D7BBA;
}

ul.twitter{
	list-style:none;
	padding:0;
	-webkit-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-ms-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	background:#55ACEE;
	padding: 12px;
}
i.tw{
	width:30px;
	height:30px;
	background:url(../images/fastfillin_logo.gif);
	float:left;
	margin-right: 2em;
}
ul.twitter li{
	color:#fff;
	font-size:1em;
	float: left;
	margin-top: 5px;
}
ul.twitter:hover{
	background: #71B8ED;
}
span.term a{
	color: #1888A8;
	font-weight: bold;
}
span.term a:hover{
	color:#fff;
}
.lable input[type="text"] {
	padding: 15px;
	font-size: 1.1em;
	margin: 18px 0px;
	color: black;	
	width:87%;
	cursor: pointer;
	font-family: 'Oxygen', sans-serif;
	outline: none;
	font-weight: 600;
	margin-left: 3px;
	background: #FFFFFF;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	/* border-left: 6px solid #fff; replaced in JSP */
	border-bottom: none;
	/* border-right: none; replaced in JSP */
	border-top: none;
}
.lable input[type="text"]:hover,.lable-2 input[type="text"]:hover,input[type="Password"]:hover,input[type="number"]:hover,input[type="email"]:hover,input[type="date"]:hover,input[type="time"]:hover,input[type="tel"]:hover,select:hover,textarea:hover {
	color:black; /* overwritten in JSP */
	/*border-left:6px solid#FFFFFF;  replaced in JSP */
}
.lable-2 input[type="text"],input[type="password"],input[type="number"],input[type="email"],input[type="date"],input[type="time"],input[type="tel"],select, textarea, .signature-pad { 	
	padding: 14px;
	width: 100%;
	height:	3em;
	font-size: 1em;
	margin: 0px 0px;
	border:none;
	color: #666666; /* overwritten in JSP */
	cursor: pointer;
	background: none;
	float: left;
	outline: none;
	font-weight: 700;
	font-family: 'Oxygen', sans-serif;
	background: #ffffff;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	/*border-left: 6px solid #000000; replaced in JSP */
	border-bottom: none;
	/*border-right: none; replaced in JSP */
	border-top: none;	
	min-height: 1.2em;
		
	-webkit-box-sizing: border-box; /* http://stackoverflow.com/questions/895904/select-inputs-and-text-inputs-in-html-best-way-to-make-equal-width */ 
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    
    border-radius: 5px;
    
    /* Fix for date display on iPhone: */
    -webkit-appearance: textfield;
	-moz-appearance: textfield;
}

.lable-2 label { 
	/*padding: 14px;*/
	width: 94%;
	font-size: 1em;
	margin: 25px 0px 5px 0px;	
	border:none;
	color: #000000;  /* overwritten in JSP */
	/* cursor: pointer; */
	background: none;
	float: left;
	outline: none;
	font-weight: 600;
	font-family: 'Oxygen', sans-serif;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	border-bottom: none;
	/*border-right: none;*/
	border-top: none;
}

.errorLabel { 
	/*padding: 14px;*/
	width: 94%;
	font-size: 1em;
	margin: 25px 0px 5px 0px;	
	border:none;
	color: #000000;  /* overwritten in JSP */
	cursor: pointer;
	background: none;
	float: left;
	outline: none;
	font-weight: 600;
	font-family: 'Oxygen', sans-serif;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	border-bottom: none;
	/*border-right: none;*/
	border-top: none;
}


.submit{
	padding:5px 4px;
	text-align: center;
	/* margin-top: 1cm; */
}

.poweredByBlock {
	/* http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page */
    text-align:center;
    display:block;
    margin:auto;    
    padding-top: 30px;
    position: absolute;
    bottom: 0;
    width: 100%; 
    height: 40px;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;    
    }
    
.youtubeFrame {
	height: 300px;
}    
    
.logoImage {
    text-align:right;
    display:block;
    margin:15px auto 0px auto;
    max-width: 85%;
    max-height: 200px;
}

.youTubeContainer {
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	height:0;
	overflow:hidden;	
	width: 95%;
	margin: 0px auto;
}

.youTubeContainer iframe, .video-container object, .video-container embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

input[type=submit], input[type=button] {
	padding: 17px 30px;
	color: #fff; /* Overriden in JSP */
	float: right;
	font-family: 'Oxygen', sans-serif;
	background: #000000;  /* Overriden in JSP */
	border: 1px solid #000000;
	cursor: pointer;
	font-size: 18px;
	transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-ms-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	outline:none;
	width: 100%;
	-webkit-appearance: none;
	border-radius: 5px;
}

.submit input[type=submit]:hover, input[type=button]:hover {
	 background:#FFFFFF; /* Overriden in JSP */
	 color: #000000; /* Overriden in JSP */
	 border:1px solid #000000; /* Overriden in JSP */
}

/**start-copy-right**/
.copy-right {
	text-align: center;
	margin: 2em 0;
}
.copy-right p {
	color: #FFF;
	font-size:1em;
}
.copy-right p a {
	font-family: 'Oxygen', sans-serif;
	font-size:1em;
	font-weight:600;
	color:#55ACEE;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
.copy-right a:hover{
	color:#fff;
}
.col_1_of_2:first-child {
	margin-left: 0;
}
.span_1_of_2 {
	width:49.7%;
}
.col_1_of_2 {
	display: block;
	float: left;
	margin:0 0 0 0.6%;
}
.col_1_of_f:first-child {
	margin-left: 0;
}
.span_1_of_f {
	width:49.7%;
}
.col_1_of_f {
	display: block;
	float: left;
	margin:0 0 0 0;
}
/*----start-responsive design-----*/
@media (max-width:1024px){
.col_1_of_2 {
	margin: 0 0 0 3.6%;
}
.span_1_of_2 {
	width: 47.7%;
}
.span_1_of_f {
	width: 50%;
}
i.fb, i.tw {
	margin-right: 1em;
}
.main {
	width: 60%;
}
    
}
@media (max-width:800px){
.span_1_of_f {
	width: 100%;
}
.col_1_of_f {
	float:none;
}
.span_1_of_2 {
	width: 100%;
}
.col_1_of_2 {
	margin:0;
}
.lable-2 input[type="text"],input[type="password"],input[type="number"],input[type="email"],input[type="date"],input[type="time"],input[type="tel"],select, textarea {
	padding: 14px;
	/*width: 85%;*/
}
}
@media (max-width:480px){
	.main {
		/* margin: 7em auto 0; */
		width:70%;
	}
	.main-card {
		width: 100%;
	}	
}

@media (max-width:320px) {
	.main {
		width:80%;
	}
	.main-card {
		width: 100%;
	}
	.lable input[type="text"] {
		width: 83%;
}
	.lable-2 input[type="text"],input[type="password"],input[type="number"],input[type="email"],input[type="date"],input[type="time"],input[type="tel"],select, textarea {
		/*width: 84%;*/
	}
	.logoImage {
		max-height: 120px; 		
	}
	.youtubeFrame {
		height: auto;
	}
}

/* Slider */
.slider { margin: 0px auto; padding: 10px; max-width: 600px;}
.flexslider { margin: 0px;}
#carousel li {margin-right: 5px;}
#carousel img {display: block; opacity: .5; cursor: pointer;}
#carousel img:hover {opacity: 1;}
#carousel .flex-active-slide img {opacity: 1; cursor: default;}