/* Heartland - Base Styles
Green: #009b48
Grey: #222222
Light Grey: #434343

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

/* Base
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@import url('/FormBuilder/_Resource/_module/plugin/base.css');
@import url('/FormBuilder/_Resource/_module/plugin/font-awesome.min.css');
@import url('/FormBuilder/_Resource/_module/plugin/webfonts.css');


html { position: relative; min-height: 100%; }
body { font-family: 'Museo Sans 300', Arial, Helvetica, sans-serif; font-weight: normal; font-size: 16px; color: #434343; }

/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@font-face {
    font-family: 'Museo Sans 300';
    src: url('/FormBuilder/_Resource/_module/cq5B8blZI0ORbgp00g_Htg/fonts/MuseoSans-W01-300.eot');
    src: url('/FormBuilder/_Resource/_module/cq5B8blZI0ORbgp00g_Htg/fonts/MuseoSans-W01-300.eot?#iefix') format('embedded-opentype'),
    url('/FormBuilder/_Resource/_module/cq5B8blZI0ORbgp00g_Htg/fonts/MuseoSans-W01-300.woff') format('woff'),
    url('/FormBuilder/_Resource/_module/cq5B8blZI0ORbgp00g_Htg/fonts/MuseoSans-W01-300.ttf') format('truetype'),
    url('/FormBuilder/_Resource/_module/cq5B8blZI0ORbgp00g_Htg/fonts/MuseoSans-W01-300.svg#MuseoSans-W01-300') format('svg');
}
@font-face {
    font-family: 'Museo Sans 500';
    src: url('/FormBuilder/_Resource/_module/cq5B8blZI0ORbgp00g_Htg/fonts/MuseoSans-W01-500.eot');
    src: url('/FormBuilder/_Resource/_module/cq5B8blZI0ORbgp00g_Htg/fonts/MuseoSans-W01-500.eot?#iefix') format('embedded-opentype'),
    url('/FormBuilder/_Resource/_module/cq5B8blZI0ORbgp00g_Htg/fonts/MuseoSans-W01-500.woff') format('woff'),
    url('/FormBuilder/_Resource/_module/cq5B8blZI0ORbgp00g_Htg/fonts/MuseoSans-W01-500.ttf') format('truetype'),
    url('/FormBuilder/_Resource/_module/cq5B8blZI0ORbgp00g_Htg/fonts/MuseoSans-W01-500.svg#MuseoSans-W01-500') format('svg');
}

h1, h2, h3, h4, h5, h6 { font-family: 'Museo Sans 500', Arial, Helvetica, sans-serif; font-weight: normal; color: #666; margin: 1em 0 0.5em 0; }
h1 { font-size: 36px; margin-top: 0; }
h2 { font-size: 28px; }
h3 { font-size: 24px; }
h4 { font-size: 20px; border-bottom:1px solid #666; padding-bottom: 5px; }
h5 { font-size: 18px; }
h6 { font-size: 18px; }

/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
    color: #00703c;
    outline: none;
    -moz-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    -webkit-transition: all 0.25s ease;
    transition: all 0.25s ease;
    text-decoration: underline;
}
a:hover { color: #333; }
a span { display: none; }


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

.branding { margin: 15px 0; }
.branding #logo img { width: 220px; margin: 15px 0; }

.banner { width: 100%; margin: 0 auto; padding: 55px 0; background: #333; text-align: center; }
.banner .banner-image { display: block; text-align: center; }
.banner img { width: 320px; }
.banner h1 { color: #fff; }


/* Primary Header - Main Navigation
--------------------------------------------------------*/
.navigation { margin: 20px 0 0 0; text-align: right; }
.nav { margin: 0; padding: 0; }
.nav li { margin: 0; padding: 0; cursor: pointer; }
.nav li a { padding: 10px; font-family: 'Museo Sans 500', Arial, Helvetica, sans-serif; font-weight: normal; color: #666; text-decoration: none; }
.nav li a:hover { color: #00703c; }
.nav li a.active { color: #00703c; }

/* Primary Page content
--------------------------------------------------------*/
.page-content { background: #fff; width: 100%; }
.content-row { min-height: 400px; padding: 40px 0; }

.row .radioElec label { width: 90%; padding: 0 }
.radioElec { padding-bottom: 10px; }

/* Footer
--------------------------------------------------------*/
.page-footer { width: 100%; padding: 40px 0; background: #111; }
.page-footer p { margin: 10px 0; color: #888; }
.page-footer a { color: #888; }
.page-footer a:hover { color: #fff; }


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

/******************* Forms **********************/
.step .row {clear: both; margin: 1em 0;}
.row label {display:inline-block; *display: inline; zoom: 1; width:300px; padding:5px 10px 0 0; font-family: 'Museo Sans 500', Arial, Helvetica, sans-serif; font-weight: normal; 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 .inputFields input {margin:5px;float:left;}*/
.row select, .row input.text {  padding:5px; margin:0; width:250px; display:inline-block; *display: inline; zoom: 1; border: 1px solid #DDDDDD; border-radius: 3px;}
.row input.text.tiny {width:150px;}
.row strong { font-family: 'Museo Sans 500', Arial, Helvetica, sans-serif; font-weight: normal; }
.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%; background: #f8f8f8; border: 0px}
.row.checkboxFullWidth .inputFields {width:100%;}
.row.checkboxFullWidth label {width: auto;}

.row input.small { width: 100px; font-size: inherit; }

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

.answers { margin: 20px 0; }

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

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

input.next,
input.back,
.btn {
    -moz-box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 1px;
    -webkit-box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 1px;
    box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 1px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background: #00513c;
    font-family: 'Museo Sans 500', Arial, Helvetica, sans-serif;
    color: #fff;
    border: 0;
    text-transform: uppercase;
    font-size: 0.875rem;
    text-align: center;
    padding: 10px 20px;
    cursor: pointer;
    position: relative;
    text-decoration: none;
    border:0;
}

input.next:hover,
input.back:hover,
.btn:hover,
.home-btn:hover { background: #008344; color: #fff; text-decoration: none; }


/* Homepage buttons */
.home-btn { margin: 0 0 10px 0; padding: 20px; display:block; }

/******************* Errors **********************/
.errorContainer { background: #FFFFFF; color:#FF4F4F; padding: 20px; position: relative; border: 1px solid #FF4F4F; }
.error { clear: both; margin: 10px 0; display: block; }
.error h6 { font-family: 'Museo Sans 500', Arial, Helvetica, sans-serif; font-weight: normal; color:#FF4F4F; margin-top: 0; }
span.error { padding-left: 5px; clear: none; color: #FF4F4F; display:inline; }

/******************* Icons **********************/
.iconLink {background:#f8f8f8; 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 */

/*** BPAY ***/
#bpayBox { margin: 2em 0;}
#bpayBox div { box-sizing:content-box !important}
#bpayBox label { padding: 0}
.text { padding: 5px 0;}


/*** Content table ***/
.tablestyle { width:100%; margin: 0 0 1em 0 }
.tablestyle th { background:#00513c; font-family: 'Museo Sans 500', Arial, Helvetica, sans-serif; font-weight: normal; color:#FFF; padding:10px; text-align:left; }
.tablestyle td { padding:10px; border-bottom:1px solid #DDDDDD; }

.confirmation { padding:20px 0; }
.confirmation table { width: 80%; }
.confirmation table td { border-bottom:1px solid #DDDDDD; padding:5px; }
.confirmation td.label { font-family: 'Museo Sans 500', Arial, Helvetica, sans-serif; font-weight: normal; width: 50%; vertical-align: top; }

.email { word-break: break-all; }

th.left, td.left { text-align: left; width:50%;}
th.right, td.right { text-align: right; }

/*** FAQ ***/
.QAViewer {margin-bottom:5px; background: #f8f8f8; -webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.QAViewer .QALink { position:relative; padding:10px 15px 10px 40px !important; display:block; text-decoration: none; color: #009b48}
    .QALink:before { content: "\f054";  position:absolute; font-family: 'FontAwesome'; top:10px; left:10px; font-size: 18px;}
    .open .QALink:before { content: "\f078";  position:absolute; font-family: 'FontAwesome'; top:10px; left:10px; font-size: 18px;}
.QAViewer .QALink:hover { color:#009b48; -webkit-transition: color 0.175s ease-in-out;	-moz-transition: color 0.175s ease-in-out;-o-transition: color 0.175s ease-in-out;transition: color 0.175s ease-in-out;}
.QAViewer .answer {padding:10px 10px 10px 40px;}
.QAViewer .answer p {margin:0 0 10px 0;}



/* 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: 1000px) {

    /* general */
    #wrapper { width: 100%; margin: 0 auto;}
    .container { clear: both; display: block; margin: 0; width: 100%; padding: 0 4%;}
    .column, .columns { float: none; width: 100% !important; display: block; margin: 0; }

    h1 { font-size: 28px; }
    h2 { font-size: 24px; }
    h3 { font-size: 20px; }
    h4 { font-size: 18px; }
    h5 { font-size: 16px; }
    h6 { font-size: 16px; }

    /* Header */
    .branding { padding: 0; border: 0; position:relative; }
    .branding #logo img { width: 180px; }
    .banner img { width: 240px; }

      /* main-nav */
    #mobileMenuBtn {display: block;}
    .navigation { width: 100%; margin: 0; display: none;}
    .nav { position: relative; width: 100%; text-align:center; top: 0px; margin: 0; padding: 1em 0px }
    .nav li {  display: block; border-top: 1px solid #ddd; }
    .nav li.menu-last { border-bottom: 1px solid #ddd; }

    /* page-content */
    .sidebar { margin-bottom: 40px; }
    .inputFields { width: 100% !important; }
    .row label { width: auto; }

    /*footer*/
    p.copyright { text-align:center}

}