/* Link Market Services - Base Styles
Blue: #252d59
orange: #f26729
Light Grey: #e1e1e1

-------------------------------------------------- */

/* 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 { /*sticky foot*/position: relative; min-height: 100%; /*End Sticky foot*/ }
body { /* Margin bottom by footer height */ margin-bottom: 60px;  /*End Sticky foot*/ font-family: Arial,sans-serif,"Helvetica Neue",Helvetica; color: #000000; }

/* Typography
-------------------------------------------------- */
h1 { color: #f26729; margin: 0 0 0.5em 0;}
h2 { color: #252d59; font-weight: 400;}
h3 {  }
h4 { color: #252d59; border-bottom:1px solid #252d59; padding-bottom: 5px; }
h5 {  }
h6 {  margin: 0 }

/* Links
-------------------------------------------------- */
a {color: #0099CC;outline: none;text-decoration: none;}
a:hover {color: #0099CC;text-decoration: underline;}
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: #252d59; }
#mobileMenuBtn.selected:after { content: "\f00d";  position:absolute; font-family: 'FontAwesome'; top:0px; right:0px; font-size: 30px; color: #252d59; }

.branding { margin: 20px 0;}
.branding .logo-row { padding: 10px; *width: 250px !important }
/*#logo { background: url(/FormBuilder/_Resource/_module/9D1jtIKFMk-ymn1DO5ieQQ/image/gateway-logo.png) no-repeat 0 0px; display: block; height:125px; width: 280px;}*/


/* Primary Header - Main Navigation
--------------------------------------------------------*/
.navigation {background: #f26729;margin: 10px 0;}
.nav { margin: 0; padding: 0;}
.nav > li { cursor: pointer; float: left; }
.nav > li > a { color: #FFFFFF; text-decoration: none;}
.nav > li:first-child > a { padding-left: 0; }
.nav > li > a:hover {text-decoration: underline; }

/* Primary Page content
--------------------------------------------------------*/
.page-content { background: #FFF; width: 100%; padding: 30px 0;}


/* Footer
--------------------------------------------------------*/
.page-footer { /* stkicy foot */position: absolute;bottom: 0;width: 100%; /* Set the fixed height of the footer here */height: 60px;/* End sticky foot*/background-color: #4E4E50;}
.page-footer { padding: 20px 0; color: #FFFFFF;}
.page-footer a { color: #FFFFFF;}


/* 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-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 .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 #e1e1e1; border-radius: 3px;}
.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%; background: #e1e1e1; 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;font-weight: bold;color: #FFFFFF;background: #4E4E50;text-decoration: none;border:0;padding: 10px 20px;}

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


/* Homepage buttons */
a[data-icon="button"]:after { content: "\f138"; position:absolute; font-family: FontAwesome; top:7px; right:20px; font-size: 35px }
.home-btn { padding: 20px; display:block;}

/******************* Errors **********************/
.errorContainer { border: 1px solid #FF4F4F}
.error {clear:both; background:#FFFFFF; color:#FF4F4F; padding:15px 0 5px 70px; position:relative; margin: 10px 0; font-size: 12px; display: block;}
.error h6 { font-weight: bold;}
div.error:before { content: "\f06a";  position:absolute; font-family: FontAwesome; font-size: 35px; top:0px; left:20px; }
div.error ul {margin:0; font-family: Arial, sans-serif;padding: 0;}
div.error li {list-style-type: none; padding: 0px; margin: 10px 0px;}
span.error {padding-left:5px;clear: none; color:#FF4F4F; display:inline }

/******************* Icons **********************/
.iconLink {-webkit-border-radius: 0px;-moz-border-radius: 0px;border-radius: 0px;}
.iconLink a {background-image: none !important;padding: 10px 15px 10px 24px !important;display:block;position:relative;text-decoration: none;font-weight: bold;}
.iconLink a:hover { text-decoration: underline; }
    .iconLink a[href*="/DocumentDownload"]:before {content: "\f1c1";position:absolute;font-family: FontAwesome;top: 50%;left: 0;font-size: 20px;margin-top: -14px;font-weight: normal;color: #f26729;} /* 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:#252d59; font-weight:bold; color:#FFF; padding:10px; text-align:left}
.tablestyle td {padding:10px; border-bottom:1px solid #e1e1e1}

.confirmation { padding:20px 0; }
.confirmation table { width: 80%; border:1px solid #e1e1e1}
.confirmation table td {border-bottom:1px solid #e1e1e1; padding:5px;}
.confirmation td.label {font-weight:bold;width: 50%;vertical-align: top; border-right:1px solid #e1e1e1;}

/*** FAQ ***/
.QAViewer {margin-bottom:5px; -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: #39C}
    .QALink:before { content: "\f054";  position:absolute; font-family: 'FontAwesome'; top:10px; left:10px; font-size: 18px; color: #f26729;}
    .open .QALink:before { content: "\f078";  position:absolute; font-family: 'FontAwesome'; top:10px; left:10px; font-size: 18px;}
.QAViewer .QALink:hover { color:#252d59; -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: 767px) {

    /* 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; }
    .page-content { margin: 20px 0;}

    h1 { font-size: 1.8em;}
    h2 { font-size: 1.5em;}
    h3 { font-size: 1.3em;}
    h4 { font-size: 1.2em;}

    /* Header */
    .branding { padding: 0; border: 0; position:relative;}
    .branding .logo { margin: 0; padding: 25px;}
    h1.top-title{ display: none;}

      /* main-nav */
    #mobileMenuBtn {display: block;}
    .navigation {width: 100%;margin: 0;display: none;background: #252d59;}
    .nav { position: relative; width: 100%; text-align:center; background: #252d59; top: 0px; margin: 0; padding: 1em 0px }
    .nav > li {  display: block; }
    .nav > li > a { color: #FFFFFF; padding-left: 0; padding-right: 0; text-align: center; }
    .nav > li > a:hover { background: #f26729; color: #FFFFFF;}


    /* page-content */
    .inputFields { width: 100% !important; }
    .step .row { margin: 0.25em 0;}

    /* buttons */
    /* buttons */
    .home-btn {padding: 10px; text-align: center}
    a[data-icon="button"]:after { content: " "; top: 0; right: 0; font-size: 0;}

      /*footer*/
    .footer-row > column { text-align:center; font-size: 0.8em;}

}