* { box-sizing:border-box; }
html, body { position:absolute; width:100%; height:100%; margin:0; font-family:"Montserrat",Helvetica,Arial,Lucida,sans-serif; background:#ededed; scroll-behavior: smooth; -webkit-overflow-scrolling: touch; }
ol, ul { list-style:none; }

.loginPageFlexItem { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; }
.loginPageFlexColumn { flex-direction:column; }

.loginPageWrap { background-repeat:no-repeat; background-position:center; background-size:cover; height:100%; width:100%; overflow-x:hidden; padding-top:8rem; }

.headerContainer { flex:0 0 auto; position:absolute; top:0; width:100%; z-index:11; }

.header { justify-content:center; box-sizing:border-box; width:100%; height:auto; transition:all .3s; }
.header > nav { align-items:center; justify-content:space-between; box-sizing:border-box; width:80%; max-width:70rem; }

.header > nav > .logo { display:flex; height:100%; }
.header > nav > .logo > img { padding:.75rem; width:7rem; }

.header > nav > ul { align-items:center; list-style:none; box-sizing:border-box; margin:0; height:100%; max-height:none; z-index:1; }
.header > nav > ul > li { display:flex; justify-content:center; position:relative; height:100%; color:#fff; }
.header > nav > ul > li > a { display:flex; align-items:center; width:100%; height:100%; padding:0rem 1.5rem; color:#fff; text-decoration:none; font-size:.9rem; font-weight:700; }
.header > nav > ul > li a:hover { color:#ff7300 !important; }
.header > nav > ul > li > ul { position:absolute; background:rgba(0, 0, 0, .9); top:100%; width:calc(100% - 3.5rem); padding:0; max-height:0; overflow:hidden; border-top-style:solid; border-top-width:0; border-top-color:#ff7300; z-index:1; -webkit-transition:max-height .5s ease, border-width .1s ease; -o-transition:max-height .5s ease, border-width .1s ease; transition:max-height .5s ease, border-width .1s ease; -webkit-transform-origin:top; -ms-transform-origin:top; transform-origin:top; }

.header > nav > ul > li:nth-child(4) > a:hover ~ ul, .header > nav > ul > li:nth-child(4) > ul:hover  { max-height:20rem; border-bottom-right-radius:.25rem; border-bottom-left-radius:.25rem; border-top-width:.2rem; }
.header > nav > ul > li:nth-child(4) > a > span.chevron { margin-left:.25rem; }
.header > nav > ul > li:nth-child(4) > ul > li > a { display:flex; align-items:center; width:auto; height:100%; padding:.5rem; color:#fff; text-decoration:none; font-size:.9rem; font-weight:700;  }

.header .menuWrap .menu { flex-direction:row; clear:none; float:right; max-height:5.25rem; }
.header .menuWrap .menu-icon { display:none; }

.chevron::before { border-style:solid; border-width:0.15em 0.15em 0 0; content:''; display:inline-block; height:0.3em; left:0.15em; position:relative; top:0.15em; transform:rotate(-45deg); vertical-align:top; width:0.3em }
.chevron.bottom:before { top:.4em; transform:rotate(135deg); }

.nav_icon,
.nav_icon span { display:none; }
.nav_icon { width:2.25rem; height:1.75rem; margin-right:1.5rem; position:relative; cursor:pointer; }
.nav_icon span { background:rgba(255, 255, 255, 1); position:absolute; left:0; width:100%; height:.25rem; border-radius:.25rem; }
.nav_icon span:nth-of-type(1) { top:0; }
.nav_icon span:nth-of-type(2) { top:.75rem; }
.nav_icon span:nth-of-type(3) { bottom:0; }

.menu-btn { display:none; }
.nav_icon.opened span:nth-of-type(1) { -webkit-transform:translateY(12px) rotate(-45deg); transform:translateY(12px) rotate(-45deg); }
.nav_icon.opened span:nth-of-type(2) { display:none; }
.nav_icon.opened span:nth-of-type(3) { -webkit-transform:translateY(-12px) rotate(45deg); transform:translateY(-12px) rotate(45deg); }

.contentContainer { flex:1 0 auto; justify-content:center; min-height:48rem; overflow-y:auto; padding:1rem; }
.contentWrap { justify-content:center; align-items:center; width:100%; max-width:80rem; }

.promotionWrap { margin-right:2rem; }

.loginFormWrap { position:relative; }

.loginForm { width:18rem; padding:.25rem 1rem; background:#fff; border-radius:.25em; }
.loginForm input[type='text'], .loginForm input[type='password'] { height:2rem; padding:.25rem .25rem .25rem .5rem; margin-bottom:.25rem; border:.1rem solid transparent; border-radius:.25rem; background:#ededed; }
.loginForm input[type='text'].error, .loginForm input[type='password'].error { background:#ffdbdb; border:.1rem solid #ffa5a5; border-radius:.25rem; }
.loginForm > .loginHeader { text-align:center; color:#0b124b; margin:.5rem 0rem;display: block;font-size: 2em;margin-block-start: 0.67em;margin-block-end: 0.67em;margin-inline-start: 0px;margin-inline-end: 0px;font-weight: bold;}

.loginForm > .errorWrap { margin-bottom:.5rem; }
.loginForm > .errorWrap > .errorText { display:none; background:#ffdbdb; border:.1rem solid #ffa5a5; border-radius:.25rem; color:#e11a1a; padding:.25rem; font-size:.9rem; }
.loginForm > .errorWrap > .errorText.show { display:block; }

.loginForm > .loginButtonWrap { display:block; position:relative; margin-bottom:.8rem; }
.loginForm > .loginButtonWrap > button { display:inline-block; width:100%; height:2.5rem; background:#9bca3b; color:#fff; cursor:pointer; font-size:.9rem; font-weight:700; border:none; border-radius:6px; outline:none; margin:1rem 0rem .25rem; padding:0px 24px; }

.companyLoginWrap > .companyLoginHeader, .employeeLoginWrap > .employeeLoginHeader { color:#4bc3d4; font-weight:700; }
.employeeLoginWrap { margin-top:1rem; }
.employeeLoginWrap > .showPasswordCheckbox, .employeeLoginWrap > .showPasswordCheckbox + label { display:inline-flex; }

.forgottenPasswordWrap { margin-bottom:.5rem; }

.supportSectionWrap { justify-content:space-around; align-items:center; background:#ededed; border-radius:6px; padding:.4rem .8rem .4rem .8rem; margin-bottom:.75rem; }
.supportSectionText { text-align: center; white-space:nowrap; font-size:1rem; font-weight:700; color:#4bc3d4; }
.supportSectionCallText { text-align: center; white-space:nowrap; font-size:.8rem; font-weight:500; color:#0b124b; }

.customerSupportWrap { margin-bottom:.3rem; }
.customerSupportWrap > button {display:inline-block;width:100%;height:2.2rem;background:#4bc3d4;color:#fff;cursor:pointer;font-size:.8rem;font-weight:700;border:none;border-radius:6px;outline:none;margin:.1rem 0rem .25rem;}
.customerSupportIcon { width:3.25rem; }
.customerSupportTextWrap { color:#fff; font-weight:700; }
.customerSupportMainText { white-space:nowrap; }
.customerSupportNumText { font-size:.815rem; white-space:nowrap; }

.desktopInstallerWrap { justify-content:space-around; align-items:center; border:.1rem solid #000; border-radius:.2rem; cursor:pointer; padding:.5rem; margin-bottom:.4em; }
.desktopInstallerIcon { width:3.25rem; }
.desktopInstallerMainText { font-weight:700; }

.remoteSupportWrap {  margin-bottom:.2rem;}
.remoteSupportWrap > button {display:inline-block;width:100%;height:2.2rem;background:#0b124b;color:#fff;cursor:pointer;font-size:.8rem;font-weight:700;border:none;border-radius:6px;outline:none;margin:.1rem 0rem .25rem;}

.loginPageContainer { position:relative; min-height:100%; }
.loginPageContentWrap { padding-bottom:25em; padding-top:1em; }

.footerContainer { flex:0 0 auto;display:block; font-size:.9rem; text-align:center; padding-top:.5rem; }
.footerNav { max-width:1080px; width:100%; display:inline-block; margin-left:auto; margin-right:auto; }
.footerInfo { font-size:.7rem; font-family:"Heebo",Helvetica,Arial,Lucida,sans-serif; color:#ffffff; text-align:center; padding-top:1rem; padding-bottom:.5rem; }
.footerCompanyInfo { white-space:nowrap; }
.footerCompanyInfoBreak { display:none; }
.footerNavColumn { width:24%; display:inline-block; color:#ffffff; text-align:left; vertical-align:top; }
.footerNavColumn h2 { font-family:"Heebo",Helvetica,Arial,Lucida,sans-serif; color:#ffffff; text-decoration:none; font-size:.9rem; color:#ff7200; text-align:left; margin-bottom:.25rem; }
.footerNavColumn a { font-family:"Heebo",Helvetica,Arial,Lucida,sans-serif; color:#ffffff; text-decoration:none; display:inline-block; font-size:.8rem; padding-bottom:10px; }
.footerNavColumn a:hover { text-decoration:underline; }

.companyLogInBox td:first-child { width:33%; text-align:right; font-size:14px; white-space:nowrap;}
.companyLogInBox td:nth-child(2) { width:66%; text-align:left; font-size:14px;}
.companyLogInBox input {font-size:14px;}
.companyLogInBox {border-spacing:0 .5em; border-collapse:separate; border:0;}
.companyShortcut {background:#e9e9e9; text-align:center; font-size:14px; margin-top:.5rem; padding:.75rem; border-radius:.25rem; }
fieldset {padding:0; width:300px; margin-top:.5em;  border:1px solid gray;  font-size:14px;}
legend {padding:0 .25em;}

.customCheckbox:checked, .customCheckbox:not(:checked) { position:absolute; visibility:hidden; opacity:0; }
.customCheckbox:checked + label, .customCheckbox:not(:checked) + label { position:relative; padding:5px 28px; margin-left:.5rem; cursor:pointer; font-size:.9rem; line-height:20px; display:inline-block; }
.customCheckbox:checked + label:before, .customCheckbox:not(:checked) + label:before { content:''; position:absolute; left:0; top:0; bottom:0; margin:auto; width:15px; height:15px; border:1.75px solid #ff7200; border-radius:2px; -webkit-transition:all .2s ease; transition:all .2s ease; }
.customCheckbox:checked + label:before { background:#ff7200; }
.customCheckbox:checked + label:after, .customCheckbox:not(:checked) + label:after { content:''; width:4px; height:10px; color:#fff; position:absolute; top:-3px; bottom:0; left:5.5px; margin:auto; -webkit-transition:all .2s ease; transition:all .2s ease; transform:rotate(38deg); border-bottom:.2rem solid #fff; border-right:.2rem solid #fff; }
.customCheckbox:not(:checked) + label:after { opacity:0; }
.customCheckbox:checked + label:after { opacity:1; }

.spinnerButton { display:inline-flex; justify-content:center; align-items:center; padding:.375rem 0.75rem !important; font-size:0 !important; opacity:.65; pointer-events:none; }
.spinnerButton:before { content:''; width:18px; height:18px; margin-right:1rem; border:4px solid rgba(0, 0, 0, 0.1); border-top:4px solid #555; border-radius:50%; animation:rotating 1.2s infinite cubic-bezier(0.785, 0.135, 0.15, 0.86); font-size:1rem; }
.spinnerButton:after { content:'Loading...'; font-size:1rem; letter-spacing:.05rem; margin-left:.5rem; }

/* .loadmask { display:flex; justify-content:center; align-items:center; position:absolute; top:0; left:0; width:100%; height:100%; background:#fff; border-radius:.25rem; opacity:0; z-index:-1; transition:opacity .3s, z-index 0s .3s; }
.loadmask[data-loading] { opacity:1; z-index:1; transition:z-index 0s, opacity .3s; }
.loadmask:after {
    content: '';
    border-radius: 50%;
    width: 64px;
    height: 64px;
    border: 6px solid rgba(0, 0, 0, 0.1);
    border-top: 6px solid #555;
    animation: rotating 1.2s infinite cubic-bezier(0.785, 0.135, 0.15, 0.86);
} */

@keyframes rotating {
    100% { transform: rotate(360deg);	}
}

@media only screen and (max-device-width:480px) {
    .header { top:0 !important; }

    .loginForm { flex-shrink:0; }
    .desktopOnly { display:none; }
    .footerNavColumn { width:20%; }
    .footerNavColumn h2 { font-size:.5em;  }
    .footerNavColumn a { font-size:8px; padding-bottom:0px; }
    .footerContainer {  padding-top:0; }
    .loginPageContentWrap { padding-bottom:16em; padding-top:1em; }
}

@media screen and (max-width:70rem) {
    .loginPageWrap { padding-top:5rem; }
    .header { top:0 !important; }
    .footerNav { display:none; }
    
    header { position:relative; }
    .header > nav { width:100%; }
    .header > nav > ul.mainMenu { flex-direction:column; position:absolute; width:80%; height:auto; max-height:0; top:100%; left:0; right:0; margin:auto; padding:0; background:rgba(0, 0, 0, .9); border-bottom-right-radius:.25rem; border-bottom-left-radius:.25rem; overflow:hidden; transform-origin:top; transition:max-height .5s ease; }
    ul.mainMenu.opened { max-height:35rem !important; }
    .header > nav > .logo { max-height:4rem; }

    h1 { margin:0; }
    .header > nav > ul > li { width:100%; padding-left:0; text-align:center; }
    .header > nav > ul > li > a { margin:0rem 1rem; padding:.5rem; }
    .header > nav > ul > li:first-child > a { margin-top:1rem; }
    .header > nav > ul > li:last-child > a { margin-bottom:1rem; }
    .header > nav > ul > li a:hover { color:#000 !important; background:#fff; border-radius:.2rem; }
    .header > nav > ul > li:nth-child(4) { flex-direction:column; }
    .header > nav > ul > li:nth-child(4) > a { width:auto; }
    .header > nav > ul > li:nth-child(4) > ul { position:relative !important; max-height:none; background:inherit; border-top-width:0; }
    .header > nav > ul > li:nth-child(4) > a:hover ~ ul, .header > nav > ul > li:nth-child(4) > ul:hover { max-height:none; border-top-width:0; }
    .header > nav > ul > li:nth-child(4) > ul > li { text-align:left; padding:0rem 2.5rem; }
    .header > nav > ul > li:nth-child(4) > ul > li > a { height:auto; }
    
    .mainMenu_subMenu { display:none !important; }
    .mainMenu li .chevron { display:none; }
    .nav_icon, .nav_icon span { display:inline-block; transition:all .4s; box-sizing:border-box; z-index:999; }

    .footerContainer { padding-top:.5rem; }
    .footerInfo { padding-top:.5rem; }
}

/* @media screen and (max-height:70rem) {
    .footerNav { display:none; }
    .footerContainer { padding-top:.5rem; }
    .footerInfo { padding-top:.5rem; }
} */

@media screen and (max-width:844px) {
    .footerCompanyInfo { margin-left:0; }
}

@media screen and (max-width:700px) {
    .contentWrap { flex-direction:column; }
    /*
    .contentContainer { min-height:80rem; }
    .slider { order:2; margin:0 auto !important; min-height:25rem; }
    .slider > .slides > .slide > img { max-height:30rem !important; max-width:26rem !important;}
    */
    /* hide sliders for phones */
    .contentContainer {min-height: 0;}
    .slider {display:none;}
    .loginForm { width:100%; }
    
}

@media screen and (max-height: 375px) and (orientation: landscape) {
     /* hide sliders for phones in landscape */
    .contentContainer {min-height: 0;}
    .slider {display:none;}
    .loginForm { width:100%; }
}

@media screen and (max-width:420px) {
    .footerCompanyInfoBreak { display:block; }
}

.slider { position:relative; width:100%; height:100%; max-width:45rem; max-height:43rem; margin-right:2rem; overflow:hidden; }
.slider > .slides {  width:100%;height:100%; max-width:45rem; max-height:43rem; position:relative; }
.slider > .slides > .slide { display:flex; flex-direction:column; justify-content:center; align-items:center; position:absolute; top:0; left:0; width:100%; height:100%;  max-width:45rem; max-height:43rem; color:white; text-align:center; opacity:0; transition:opacity 1.25s; }
.slider > .slides > .slide[data-state="active"] { z-index:10; }
.slider > .slides > .slide > img { width:100%; max-width:45rem; max-height:43rem; }
/* .slide[data-state=active] { display:block; } */
.indicators { position:absolute; bottom:20px; right:20px; }
.indicator { cursor:pointer; }

/* responsive slide images */
.slide img {width: 100%; max-width: 608px; height: auto;}

@media screen and (max-width: 1120px) {
    .MobileNoSubLevel3 .level-2 .menu-arrow,
    .MobileNoSubLevel3 .level-3 { 
     display:none;
     position:absolute;
     right:100%;
     opacity:0;
    }
}
@media screen and (min-width: 768px) {
    .footerColumns ul li,
    .footerColumns span {
        text-align:left;
    }

}