/* Ellerston - Base Styles

–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* Base
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@import url('/FormBuilder/_Resource/_module/plugin/base.css');

html{ width: 100%; height: 100%;}
body { height: 100%;font-family: Arial, sans-serif; font-size: 14px; color: #000000; background: url(/FormBuilder/_Resource/_module/6xJVgDnSaUmK4wGkbzBBOA/triangle-bg2.png) top center repeat-x; }

.container { max-width: 800px; }

ul { margin: 10px 0; }

/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1,h2,h3,h4,h5,h6{ font-weight: bold; clear: left;}
h1 {font-size:2.0em;  font-weight: bold; color: #000000;}
h2 {font-size:1.6em;  font-weight: normal; color: #000000;}
h3 {font-size:1.5em;  font-weight: normal; }
h4 {font-size:1.2em;  font-weight: bold; color: #000000; }
h1,h2,h3, h4 {margin: 0.5em 0;}

/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a, a:visited, a:focus { color: #52b1a6; outline: none; text-decoration: none; }
a:hover { color: #52b1a6; text-decoration: underline; }
a span { display: none; }


/* Primary Header - branding
--------------------------------------------------------*/
#mobileMenuBtn {display: none; position: absolute; cursor: pointer; right: 15px; top: 25px; }
#mobileMenuBtn span { display: none; }
#mobileMenuBtn:after { content: "\f0c9";  position:absolute; font-family: 'FontAwesome'; top:0px; right:0px; font-size: 30px; color: #2385C6; }
#mobileMenuBtn.selected:after { content: "\f00d";  position:absolute; font-family: 'FontAwesome'; top:0px; right:0px; font-size: 30px; color: #2385C6; }

.page-header { }
.page-header h1 { margin: 0; }

/* Primary Header - Main Navigation
--------------------------------------------------------*/
.navigation { background: #FFFFFF; }
.nav { margin: 0; padding: 0; }
.nav > li { cursor: pointer; }
.nav > li > a { color: #FFFFFF; text-decoration: none; } 
.nav > li > a:hover { color: #000000; }

/* Primary Page content
--------------------------------------------------------*/
.page-content { width: 100%; min-height: 500px; }
.page-content .TextModule:after { content: ""; display: table; clear: both; }
.terms { text-align: left;  width: 100%; padding: 10px; height: 350px; overflow: auto; border: 1px solid #ccc;}

/* Footer
--------------------------------------------------------*/
.page-footer { padding: 10px 0 10px 0px; }
.page-footer a { color: #666666; }

/* HIPPO Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/******************* Forms **********************/
.step .row {clear: both; padding: 10px; background-color: #e6e6e6; margin: 2px 0; }
.row label {display:inline-block; *display: inline; zoom: 1; width:300px; padding:5px 10px 0 0; font-weight:bold; vertical-align: top; }
.row .inputFields { display:inline-block; *display: inline; zoom: 1; }
	.inputFields label { display: inline; float: none; padding: 0 20px 0 0; text-align: left; width: auto; }
.row select, .row input.text {  padding:5px; margin:0; width:250px; display:inline-block; *display: inline; zoom: 1; border: 1px solid #DDDDDD; }
.row input.text.tiny {width:150px; }
.row strong {font-weight:bold; }
.row .hint {display:block; color:#666;clear:both;font-size: 0.85em; }
.row .text { display:inline-block; *display: inline; zoom: 1; }

.row .inputFields input.checkbox {margin:0px 7px 0 0;padding:0; }
.row .SelectApplicationType2, .row .SelectApplicationType3 {*display:inline; }
.row.checkboxFullWidth {padding:2% 0; border: 0px; }
.row.checkboxFullWidth .inputFields {width:100%; }
.row.checkboxFullWidth label {width: auto; }


.formNav {padding:20px 0;clear:both; }

/******************* Buttons **********************/

input.next {float:right; margin-left: 10px; }

input.next, 
input.back,
.btn {
	position: relative;
	padding: 10px 20px;
    background: #52b1a6;
    cursor: pointer;
    color: #fff;
    font-size: 15px;
    line-height: 22px;
	font-weight: normal;
    text-transform: uppercase;
    border-radius: 5px;
	border: none;
	outline: none;
}

input.next:hover, 
input.back:hover, 
.btn:hover,
.home-btn:hover {}

/******************* Errors **********************/
.errorContainer { border: 1px solid red; }
.error {clear:both; background:#FFFFFF; color:red; padding:15px 30px; position:relative; margin: 10px 0; display: block; }
.error h6 { color:red; }
span.error { padding-left:5px;clear: none; color:red; display:inline; }

/******************* Icons **********************/
.iconLink {background:#DDDDDD; padding:10px 0;margin: 15px 0; -webkit-border-radius: 0px;-moz-border-radius: 0px;border-radius: 0px; }
.iconLink a { background-image: none !important; padding: 10px 15px 10px 70px !important; display:block; position:relative; text-decoration: none; }
	.iconLink a[href*="/DocumentDownload"]:before { content: "\f1c1";  position:absolute; font-family: FontAwesome; top:0px; left:20px; font-size: 30px; } /* for PDF icons */
	.iconLink a[href*="print"]:before { content: "\f02f";  position:absolute; font-family: FontAwesome; top:0px; left:20px; font-size: 30px; } /* for PDF icons */

/*** Content table ***/
.tablestyle { width:100%; margin: 0 0 1em 0; }
.tablestyle th { background:#2385C6; font-weight:bold; color:#FFF; padding:10px; text-align:left; }
.tablestyle td { padding:10px; border-bottom:1px solid #DDDDDD; }

/* Print Styles */
@media print { 
	#main-nav, .iconLink, .returnhome, a.btn { display: none; }
	.branding { height: auto !important; float: none; width: 100%; background: none; }
	.confirmation table { width: 100%; }
	.page-content { padding: 0; margin-left: 0; }
	.confirmation, #bpayBox {page-break-inside: avoid; margin: 0 0 20px; }
}


/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media (max-width: 960px) {
	.container { clear: both; display: block; margin: 0; width: 100%; padding: 20px 3%; }
}

@media (max-width: 767px) {
	
	/* general */
	#wrapper { width: 100%; margin: 0 auto; }
	.column, .columns { float: none; width: 100% !important; display: block; margin: 0; }
	
	h1, h2, h3, h4, h5, h6 {}
	h1 { font-size: 1.8em; }
	h2 { font-size: 1.5em; }
	h3 { font-size: 1.3em; }
	h4 { font-size: 1.2em; }
	h5 { font-size: 1.2em; }
	h6 { font-size: 1.2em; }
	
    /* Header */
	h1.top-title{ display: block; }
	
	/* page-content */
	.inputFields { width: 100% !important; }
	.step .row { margin: 0.25em 0; }
	.row label, .row select, .row input.text { width: 100%; }
	
	.terms a { word-break: break-word; }
	
	/* buttons */
	a[data-icon="button"]:after { content: " "; top: 0; right: 0; font-size: 0; }
		  
  	/*footer*/
	.footer-row > column { text-align:center; font-size: 0.8em; }	
}