/* Header Sign Up Form CSS BEGINS*/

.header-signup-form{
  display: none;
}

.email-signup-header-banner {
  text-align: center;
  min-height: 40px;
  padding: 8px;
  margin: 0 auto 12px;
  border-style: solid;
  border-color: #d8d8d8;
  border-width: 0 0 1px;
  font-family: 'GillSansforJL', sans-serif;
  font-size: 14px;
  text-transform: uppercase;
  cursor: pointer;
}

.email-signup-header-banner .linkText {
  text-decoration: underline;
}

@media screen and (min-width: 1200px) {
  .email-signup-header-banner {
    border-width: 1px;
    max-width: 1170px;
    margin-top: 12px;
  }
}

/* Header Sign Up Form CSS ENDS*/

/* megaNav - start */

/* ul:hover + div.meganav-dim {
    visibility: visible;
    z-index: 1;
  } */

div.meganav-dimOLD {
    width: 100%;
    height: 100%;
    z-index: -1;
    display: none;
    content: "";
    position: absolute;
    top: 200;
    left: 0;
    background: #000;
    /*background: rgba(0,0,0,0.4);*/
    /*-webkit-transition: opacity .6s ease-in-out .1s,visibility 0s .5s;
    -moz-transition: opacity .6s .1s ease-in-out,visibility 0s .5s;
    transition: opacity .6s ease-in-out .1s,visibility 0s .5s;*/
    opacity: .567;
    -webkit-transition: opacity .5s;
    -moz-transition: opacity .5s;
    transition: opacity .5s;
    visibility: visible;
}

.meganav-link {
    z-index: 900;
    list-style-type: none;
}

.dropdown{
    margin-top: -8px;
}

.no-dropdown{
    margin-top: -8px;
}

.meganav-menustyle {
    border-top:1px solid #d8d8d8;
    /*border-top:1px solid red;*/
}

.meganav-header .visually-hidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.meganav-header .position-static {
    position: static;
}

.meganav-header .navbar-default .navbar-nav>li>a {
    background-color: transparent;
}

.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover{
    background-color: transparent;
}   



@media all and (min-width: 1200px) {
    .meganav-header .container-fluid {
        max-width:  fit-content; /*1200px*/
    }

}

.container-fluid {
    padding-left: 32px;
    padding-right: 32px;
}

@media all and (min-width: 884px) {

    .meganav-header .container-fluid {
        max-width: 992px;
        *width: 992px;
    }

}

@media all and (max-width: 769px) {
    body.mobile-nav-active .page-wrapper {
        height: 100vh;
        overflow-y: hidden;
    }

    .meganav-header .container-fluid {
        padding-left: 16px;
        padding-right: 16px;
    }
}

@media all and (min-width: 992px) {
    .meganav-header .container-fluid {
        max-width: 1150px; /*1150px max-content*/
    }
}

/*@media all and (min-width: 992px) {
    .meganav-header .container-fluid {
        max-width: 1100px;
    }
}*/

@media all and (max-width: 768px) {
    .meganav-header .container-fluid {
        padding-left: 16px;
        padding-right: 16px;
    }

    .meganav-header .row {
        margin-left: -8px;
        margin-right: -8px;
    }
}

.meganav-header .secondary-header {
    background: #000000;
    font-family: 'GillSansforJL', Arial, Helvetica, sans-serif;
    font-weight: 200;
}

.meganav-header .secondary-header-row {
    background: #000000;
}

.meganav-header .navbar-toggle {
    border: none;
    border-radius: 0;
    margin: -12px 0 0 0;
    padding: 16px 16px 17px 16px;
    font-family: 'GillSansforJL', Arial, Helvetica, sans-serif;
    font-weight: 200;
    color: #000000;
}

.meganav-header .navbar-toggle .icon-bar {
    background-color: #000000;
    width: 20px;
    height: 4px;
}

.meganav-header .navbar-toggle .navbar-hb {
    margin: auto;
    width: 20px;
}

.meganav-header .navbar-toggle p {
    font-size: 1.3em;
    margin-top: 4px;
}

.meganav-header .navbar-toggle.active {
    background-color: #000000;
    color: #000000;
}

.meganav-header .navbar-toggle.active .icon-bar {
    background-color: #000000;
}

.meganav-header .navbar-toggle:hover {
    color: #000000;
}

.meganav-header .navbar-default {
    border: 0;
}

.meganav-header .navbar-nav .dropdown.open {
    background-color: #ffffff;
    z-index: 1000;
}

.meganav-header .navbar {
    border-radius: 0;
    min-height: 0;
    margin: 0;
}

.meganav-header .navbar.secondary-header-row {
    font-size: 18px;
}

.meganav-header .navbar .navbar-nav {
    display: inline-block;
    float: none;
}

.meganav-header .navbar .navbar-collapse {
    line-height: 0;
    padding-left: 0;
    padding-right: 0px;
    border-top: none;
    text-align: center;
}

.meganav-header .navbar .navbar-collapse .dropdown-menu {
    text-align: left;
    padding-bottom: 12px;
    font-size: 1em;
}

.meganav-header .navbar .navbar-collapse .dropdown-menu>li>a:hover,
.meganav-header .navbar .navbar-collapse .dropdown-menu>li>a:focus {
    color: #000000;
    background-color: transparent;
}

.meganav-header .secondary-header-row .dropdown-menu {
    min-width: 260px;
    box-shadow: none;
    -webkit-box-shadow: none;
    border: none;
    padding-top: 0;
}

.meganav-header .secondary-header-row .dropdown-menu li a {
    color: #024731;
    padding: 4px 20px;
}

.no-js .meganav-header .navbar-toggle {
    background-color: #ffffff;
    color: #000000;
}

.no-js .meganav-header .navbar-toggle .icon-bar {
    background-color: #000000;
}

@media (min-width: 769px) {
    .navbar {
        border-radius: 4px;
    }
}

@media (min-width: 769px) {
    .navbar-header {
        float: left;
    }
}

/*Reset Bootstrap Navbar collapse*/

@media (min-width: 769px) {
    .navbar-collapse.collapse {
        display: none !important;
    }
}

@media (min-width: 769px) {
    .navbar-collapse {
        width: auto;
        border-top: 0;
        box-shadow: none;
    }

    .navbar-collapse.collapse {
        display: block !important;
        height: auto !important;
        padding-bottom: 0;
        overflow: visible !important;
    }

    .navbar-collapse.in {
        overflow-y: visible;
    }

    .navbar-fixed-top .navbar-collapse,
    .navbar-static-top .navbar-collapse,
    .navbar-fixed-bottom .navbar-collapse {
        padding-left: 0;
        padding-right: 0;
    }
}

@media (min-width: 769px) {

    .container>.navbar-header,
    .container-fluid>.navbar-header,
    .container>.navbar-collapse,
    .container-fluid>.navbar-collapse {
        margin-right: 0;
        margin-left: 0;
    }
}

@media (min-width: 769px) {
    .navbar-static-top {
        border-radius: 0;
    }
}

@media (min-width: 769px) {

    .navbar-fixed-top,
    .navbar-fixed-bottom {
        border-radius: 0;
    }
}

@media (min-width: 769px) {

    .navbar>.container .navbar-brand,
    .navbar>.container-fluid .navbar-brand {
        margin-left: -16px;
    }
}

@media (min-width: 769px) {
    .navbar-toggle {
        display: none;
    }
}

@media (max-width: 769px) {
    .navbar-nav .open .dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        box-shadow: none;
    }

    .navbar-nav .open .dropdown-menu>li>a,
    .navbar-nav .open .dropdown-menu .dropdown-header {
        padding: 5px 15px 5px 25px;
    }

    .navbar-nav .open .dropdown-menu>li>a {
        line-height: 18px;
    }

    .navbar-nav .open .dropdown-menu>li>a:hover,
    .navbar-nav .open .dropdown-menu>li>a:focus {
        background-image: none;
    }
}

@media (min-width: 769px) {
    .navbar-nav {
        float: left;
        margin: 0;
    }

    .navbar-nav>li {
        float: left;
    }

    .navbar-nav>li>a {
        padding-top: 16px;
        padding-bottom: 16px;
    }

    .navbar-nav.navbar-right:last-child {
        margin-right: -16px;
    }
}

@media (min-width: 769px) {
    .navbar-left {
        float: left !important;
    }

    .navbar-right {
        float: right !important;
    }
}

@media (min-width: 769px) and (max-width: 992px) {
    .meganav-header .secondary-header .navbar-nav .dropdown .sub-menu {
        /* left:-16px;
        width: -moz-calc(100% + 32px);
        width: -webkit-calc(100% + 32px);
        width: -o-calc(100% + 32px);
        width: calc(100% + 32px);*/
    }
}

@media (min-width: 769px) {
    .meganav-header .dropdown.home a {
        *zoom: expression(this.runtimeStyle.zoom='1', this.appendChild(document.createElement('span')).className='before');
    }

    .meganav-header .dropdown.home a:after,
    .meganav-header .dropdown.home a .after {
        display: none;
    }
}

.meganav-header {
    /*position: relative;*/
    margin-top: 30px;
    border-bottom: 1px solid #dedbd2;
}

.meganav-header .navbar-nav .dropdown .sub-menu .follow,
.meganav-header .navbar-nav .dropdown .sub-menu .back {
    display: none;
}

.meganav-header .navbar-nav .dropdown .sub-menu li.follow-all-widths a .before,
.meganav-header .navbar-nav .dropdown .sub-menu li.follow a .before,
.meganav-header .navbar-nav .dropdown .sub-menu li.follow-all-widths a:before,
.meganav-header .navbar-nav .dropdown .sub-menu li.follow a:before {
    display: none;
}

 .meganav-header .navbar-nav .dropdown .sub-menu li.follow-all-widths a:hover { /* level 1 */
    color: #000000;
    text-decoration: none;
}

.meganav-header .navbar-nav .dropdown .sub-menu li.follow a:hover {
    color: #000000;
}

/*
.meganav-header .navbar-default .navbar-nav>li>a {
    color: #000000;
}
*/

.meganav-header .secondary-header-row,
.meganav-header .secondary-header {
    background: #ffffff;
}

.meganav-header .navbar-default .navbar-nav>li>a {
    text-decoration: none;
    color: #000000;
    padding: 20px 0 13px 0;
    margin-bottom: -1px;
    margin-left: 45px;
    /*margin-right: 25x;*/
    border: 1px solid transparent;
    /*required to stop jump on hover*/
    -webkit-user-select: none;
    touch-action: pan-y;
    -webkit-user-drag: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    border-style: solid none;
    *zoom: expression(this.runtimeStyle.zoom='1', this.appendChild(document.createElement('span')).className='after');
}

.meganav-header .navbar-default .navbar-nav>li>a span {
    /*padding-left: 25px; /*39px */
    /*padding-right: 25px; /*59px*/   
    line-height: 20px;
    display: block;
}

.meganav-header .navbar-default .navbar-nav>li:last-of-type>a span {
    border-right: none;
}

.meganav-header .navbar-default .navbar-nav>li>a.home {
    color: #000000;
}

/*
.meganav-header .navbar-default .navbar-nav>li>a.home span,
.meganav-header .navbar-default .navbar-nav>li.no-dropdown>a span {
    padding: 0 35px;
}
*/
.meganav-header .navbar-default .navbar-nav>li.no-dropdown>a:after {
    display: none;
}

.meganav-header .navbar-default .navbar-nav>li>a:after,
.meganav-header .navbar-default .navbar-nav>li>a .after {
    font-family: "jl-icon";
    font-style: normal;
    font-weight: normal;
    speak: none;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.38;
    *zoom: expression(this.runtimeStyle['zoom'] '1', this.innerHTML '');
    color: #000000;
    font-size: 11px;
    position: absolute;
    right: 39px;
    bottom: 15px;
}

.meganav-header .navbar-default .navbar-nav>li.last>a span {
    border-right: 0 none;
}

.meganav-header .navbar {
    position: static;
    text-align: center;
}

@media all and (max-width: 769px) {
    .meganav-header .navbar {
        text-align: left;
    }
}

.meganav-header .navbar-nav .dropdown:first-child {
    border-left: 0 none;
}

.meganav-header .navbar-nav .dropdown .sub-menu {
    position: absolute;
    left: 0;
    width: 100%;
    overflow: visible;
    background-color: #ffffff; /* #FBF9F6; PW */
    z-index: 50;
    line-height: 1.2;
    margin-top: -1px;
    /* do not remove, required for the open dropdown border */
}

.meganav-header .navbar-nav .dropdown .sub-menu a:link,
.meganav-header .navbar-nav .dropdown .sub-menu a:visited {
    color: #000;
}

.meganav-header .navbar-nav .dropdown .sub-menu:after {
    content: '';
    width: 100%;
    height: 15px;
    position: absolute;
    bottom: -15px;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 {
    padding-left: 51px; /*16px;*/
    position: absolute;
    top: 15px;
    padding-top: 0;
    width: 33%;
    list-style: none;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1.level-two-r {
    left: 33%;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li {
    padding-right: 20px;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li>a {
    color: #000000;
    /*-webkit-transition: .3s text-indent ease;*/
    /*transition: .3s text-indent ease;*/
    *zoom: expression(this.runtimeStyle.zoom='1', this.appendChild(document.createElement('span')).className='before');
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li>a .before,
.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li>a:before {
    position: absolute;
    right: 10px;
    font-family: 'jl-icon';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 22px;
    *zoom: expression(this.runtimeStyle['zoom'] '1', this.innerHTML '');
    content: "\e856";
    color: #000000;
    font-size: 11px;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.active {
    background: #ffffff;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.l-two-has-subgroup.active {
    background: transparent;
    border-bottom: none;
    border-top: none;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.active .nav-col3,
.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.active .nav-col2 {
    display: block;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.active .nav-col3 a:after,
.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.active .nav-col2 a:after {
    display: none;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.active>a { /*level1 with arrow */
    text-decoration: none; 
    border: 0 none;
    /* color: #000000; */
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.active>a:after {
    width: 5px;
    content: "";
    height: 100%;
    position: absolute;
    right: -21px;
    top: 0;
    background-color: #ffffff;
    z-index: 2;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.active+li a {
    border-top: 0 none;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 li a {
    display: block;
    /*padding: 11px 0 11px 0; */
    padding: 4px 0 4px 0;
    background: transparent;
    position: relative;
    text-decoration: none;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 li:first-of-type a {
    border-top: none;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 li a .caption {
    position: absolute;
    left: -9999px;
}

/* Level 2 groups */

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.l-two-has-subgroup .group-title {
    font-size: 18px;
    margin-top: 4px;
    margin-bottom: 0;
    font-family: 'GillSansforJL', Arial, Helvetica, sans-serif;
    font-weight: 200;
    color: #000000;
    /*padding: 11px -1px 11px 0; */
    font-weight: 400;
    line-height: 22.4px;
    border-bottom: solid 1px #d8d8d8;    
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.l-two-has-subgroup a {
    display: block;
    /*padding: 11px 0 11px 0; */
    background: transparent;
    position: relative;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 {
    display: none;
    z-index: 1;
    position: absolute;
    left: 99.5%;
    left: -moz-calc(100% - 1px);
    left: -webkit-calc(100% - 1px);
    left: -o-calc(100% - 1px);
    left: calc(100% - 1px);
    width: 199%;
    top: 0;
    background: #ffffff;
    min-height: 100%;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 ul {
    padding-left: 0;
    margin-top: 0;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li {
    list-style: none;
    border-left: 0 none;
    padding-right: 0;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li a {
    border-top: 0;
    background: transparent;
    /* border-bottom: 1px solid #eaeaea; PW6 */
    /*padding: 11px 0 11px 0; */
    padding: 4px 0 4px 0;
    color: #000000;
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li a:hover {
    color: #000000;
    text-decoration: none;
}

.meganav-header .navbar-nav .nav-sub-col {
    float: left;
    width: 50%;
    padding-bottom: 18px;
}

.meganav-header .navbar-nav .nav-sub-col h4 {
    font-size: 18px;
    margin-top: 4px;
    margin-bottom: 0;
    font-family: 'GillSansforJL', Arial, Helvetica, sans-serif;
    color: #000000;
    font-weight: 400;
}

.meganav-header .navbar-nav .nav-panel {
    padding: 0 20px 0 20px;
}

.meganav-header .navbar-nav .nav-panel.first {
    margin-top: -2; /*18px; */
}

.meganav-header .navbar-nav .dropdown .sub-menu-wrapper {
    padding: 0;
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    height: 100%;
}

.meganav-header .navbar-nav .dropdown .sub-menu-wrapper li a:hover {
    color: #000000;
    text-decoration: none;
}

.meganav-header .navbar-nav .dropdown .nav-row {
    position: relative;
}

.meganav-header .navbar-nav .dropdown {
    position: static;
}

.meganav-header .navbar-nav .dropdown .sub-menu {
    display: none;
}

.meganav-header .navbar-nav .dropdown:focus>.sub-menu,
.meganav-header .navbar-nav .dropdown.open-nav>.sub-menu {
    display: block;
}

a.meganav-no-dropdown:hover{    
    text-decoration: none !important;
    color: #000000;
    position: relative;
    z-index: 51;
}

.meganav-header .navbar-nav .dropdown.open-nav>a { /* level 0 */
    text-decoration: none;
    color: #000000;
    position: relative;
    z-index: 51;
    margin-bottom: 0px;
    /* border-bottom-color: #000; */
}

.meganav-header .navbar-nav li>a:hover {
    color: #000000;
    text-decoration: none;
}

.meganav-header .navbar-nav .dropdown.open-nav>a:after,
.meganav-header .navbar-nav .dropdown.open-nav>a .after {
    color: #000000;
}

.meganav-header .overlay {
    position: absolute;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.85);
    opacity: 0;
    filter: alpha(opacity=0);
    z-index: 40;
    display: none;
    -webkit-transition: .4s opacity ease;
    transition: .4s opacity ease;
}

.meganav-header .overlay.no-breadcrumb {
    margin-top: 0;
}

.meganav-header .overlay.show {
    display: block !important;
    opacity: .85;
    filter: alpha(opacity=85);
    z-index: 100;
    top: 92px;
}

@media all and (min-width: 769px) {

    .meganav-containerOLD{
        width: 80%;
        margin-left: 10%;
        margin-right: 10%;        
    }

    .meganav-header .overlay.show {
        display: none !important;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li a {
        font-size: 18px !important
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li a:hover { /* level 2 */
        text-decoration: none;
    }
}

.meganav-header .overlay.open {
    -webkit-transition: .1s opacity ease;
    transition: .1s opacity ease;
}

.no-js .meganav-header.nav-option1 .navbar-nav .dropdown .sub-menu {
    display: block;
    left: -9999px;
}

.no-js .meganav-header.nav-option1 .navbar-nav .dropdown .sub-menu .nav-col1 {
    position: relative;
}

.no-js .meganav-header.nav-option1 .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 {
    display: block;
}

.no-js .meganav-header.need-javascript .nav-promo {
    margin-bottom: 22px;
}

.no-js .meganav-header.need-javascript .nav-promo.tiles ul li {
    float: left;
}

.no-js .meganav-header.need-javascript .dropdown.home a:before,
.no-js .meganav-header.need-javascript .dropdown.home a .before {
    border-right: 0 none;
}

.no-js .meganav-header.need-javascript .navbar-default .navbar-nav>li>a span {
    border-right: 0 none;
}

.no-js .meganav-header.need-javascript .navbar-collapse {
    max-height: none;
}

.no-js .meganav-header.need-javascript .navbar-nav {
    display: block;
}

.no-js .meganav-header.need-javascript .navbar-nav li {
    float: none;
}

.no-js .meganav-header.need-javascript .navbar-nav .dropdown:hover>.sub-menu {
    left: 0;
}

.no-js .meganav-header.need-javascript .navbar-nav .dropdown .sub-menu {
    position: relative;
    display: block;
}

.no-js .meganav-header.need-javascript .navbar-nav .dropdown .sub-menu .nav-col1 {
    margin-bottom: 0px;
    width: auto;
    position: relative;
}

.no-js .meganav-header.need-javascript .navbar-nav .dropdown .sub-menu .nav-col1>li .nav-col2 {
    display: block;
}

.no-js .meganav-header.need-javascript .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 {
    overflow: hidden;
    display: block;
    position: relative;
    width: auto;
    left: 0;
}

@media all and (max-width: 992px) {
    .no-js .meganav-header.need-javascript .navbar-nav .dropdown:hover>.sub-menu {
        left: -16px;
    }
}

@media all and (max-width: 768px) {
    .hamburger {
        display: block;
    }

    .meganav-header .overlay.show {
        display: block;
    }

    .no-js .meganav-header.need-javascript .navbar-nav .dropdown .sub-menu {
        position: relative;
        display: block;
        width: auto;
        height: auto;
        top: auto;
        left: auto;
    }

    .no-js .meganav-header.need-javascript .navbar-nav .dropdown .sub-menu li.back {
        display: none;
    }

    .no-js .meganav-header.need-javascript .navbar-nav .dropdown:hover>.sub-menu {
        left: 0;
        display: block;
    }
}

@media all and (max-width: 769px) {
    .no-js .meganav-header.nav-option1 .navbar-nav .dropdown .sub-menu {
        display: none;
        left: 0;
    }

    .no-js .meganav-header.nav-option1 .navbar-nav .dropdown .sub-menu .nav-col1 {
        position: relative;
    }

    .no-js .meganav-header.nav-option1 .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 {
        display: none;
    }
}

.no-js .meganav-header .navbar-nav .dropdown .sub-menu {
    min-height: 30em;
}

.no-js .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li:hover .nav-col3,
.no-js .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li:focus .nav-col3,
.no-js .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li:active .nav-col3,
.no-js .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li:hover .nav-col2,
.no-js .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li:focus .nav-col2,
.no-js .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li:active .nav-col2 {
    display: block;
}

.no-js .meganav-header .navbar-nav .dropdown:hover>.sub-menu,
.no-js .meganav-header .navbar-nav .dropdown:active>.sub-menu {
    display: block;
    left: 0;
}

.no-js .meganav-header .navbar-nav .dropdown:hover>.sub-menu .nav-col1 .nav-col2,
.no-js .meganav-header .navbar-nav .dropdown:active>.sub-menu .nav-col1 .nav-col2 {
    display: none;
}

.js .meganav-header .navbar-nav .dropdown .sub-menu {
    -webkit-transition: .4s height ease, .1s opacity ease;
    -webkit-backface-visibility: hidden;
    -webkit-perspective: 1000;
    transition: .4s height ease, .1s opacity ease;
    backface-visibility: hidden;
    perspective: 1000;
    height: 0;
    text-align: left;
    border-top:1px solid #d8d8d8;
}

.line1 {
    position: absolute;
    width: 1px;
    background: #000;
    height: 400px;
    top: 0;
    left: 50%;
    z-index: 100;
}

.line2 {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 1px;
    background: #000000;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    z-index: 100;
}

.meganav-header .navbar-toggle-close {
    display: none;
    border: none;
    height: 48px;
    width: 48px;
    background-color: #D7D7D7;
    position: absolute;
    bottom: 0;
    right: 24px;
    outline: 0;
    z-index: 50;
    *zoom: expression(this.runtimeStyle.zoom='1', this.appendChild(document.createElement('span')).className='before');
}

.meganav-header .navbar-toggle-close:active,
.meganav-header .navbar-toggle-close:hover {
    background-color: #000000;
}

.meganav-header .navbar-toggle-close:before,
.meganav-header .navbar-toggle-close .before {
    position: absolute;
    font-family: 'jl-icon';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.38;
    *zoom: expression(this.runtimeStyle['zoom'] '1', this.innerHTML '');
    content: "\e620";
    color: #ffffff;
    font-size: 15px;
    bottom: 16px;
    right: 17px;
}

@media all and (max-width: 769px) {
    .meganav-header .meganav-header .secondary-header .col-xs-12 {
        padding-left: 0;
        padding-right: 4px;
    }

    .meganav-header .meganav-header .secondary-header .container-fluid {
        padding-left: 0;
        padding-right: 0;
    }

    .meganav-header .meganav-header .secondary-header-row .dropdown-menu {
        display: block;
        position: relative;
        min-width: 30%;
    }

    .meganav-header .meganav-header .secondary-header-row .dropdown-menu li a {
        padding: 7px 16px;
        font-size: 1.15em;
    }

    .meganav-header .meganav-header .secondary-header-row .dropdown-menu li a:after {
        float: left;
        padding-right: 4px;
        content: none;
    }

    .meganav-header .meganav-header .navbar.navbar-default .navbar-nav {
        display: block;
        padding-left: 32px;
        margin: 0;
        background-color: #ffffff;
        padding-top: 30px;
        padding-bottom: 24px;
        *zoom: expression(this.runtimeStyle.zoom='1', this.appendChild(document.createElement('span')).className='after');
    }

    .meganav-header .meganav-header .navbar.navbar-default .navbar-nav a {
        color: #024731;
    }

    .meganav-header .meganav-header .navbar.navbar-default .navbar-nav>li>a {
        /*padding-left: 16px;
        padding-right: 16px;*/
    }

    .meganav-header .meganav-header .navbar.navbar-default .navbar-nav .dropdown {
        display: block;
        float: left;
        width: 32%;
    }

    .meganav-header .meganav-header .navbar.navbar-default .navbar-nav .dropdown>a {
        font-family: 'GillSansforJL', Arial, Helvetica, sans-serif;
        font-weight: 200;
        font-size: 1.438em;
        line-height: 1.2em;
    }

    .meganav-header .meganav-header .navbar.navbar-default .navbar-nav .dropdown.home {
        position: absolute;
        padding-left: 24px;
        *zoom: expression(this.runtimeStyle.zoom='1', this.appendChild(document.createElement('span')).className='before');
    }

    .meganav-header .meganav-header .navbar.navbar-default .navbar-nav .dropdown.home:before,
    .meganav-header .meganav-header .navbar.navbar-default .navbar-nav .dropdown.home .before {
        position: absolute;
        font-family: 'jl-icon';
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        line-height: 1.38;
        *zoom: expression(this.runtimeStyle['zoom'] '1', this.innerHTML '');
        content: "\e600";
        color: #024731;
        font-size: 13px;
        bottom: 16px;
        left: 16px;
    }

    .meganav-header .meganav-header .navbar.navbar-default .navbar-nav .dropdown .dropdown-menu {
        font-size: .85em;
        padding-top: 10px;
    }

    .meganav-header .meganav-header .navbar.navbar-default .navbar-nav .dropdown .pull-right {
        float: left !important;
    }

    .meganav-header .meganav-header .navbar.navbar-default .navbar-nav li.dropdown:nth-child(5) {
        clear: left;
    }

    .meganav-header .meganav-header .navbar.navbar-default .navbar-nav li.dropdown:nth-child(2) {
        margin-top: 54px;
    }

    .meganav-header .meganav-header .navbar.navbar-default .navbar-nav:before,
    .meganav-header .meganav-header .navbar.navbar-default .navbar-nav .before {
        position: absolute;
        font-family: 'jl-icon';
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        line-height: 1.38;
        *zoom: expression(this.runtimeStyle['zoom'] '1', this.innerHTML '');
        content: "\e60d";
        color: #ffffff;
        font-size: 15px;
        bottom: 16px;
        right: 17px;
    }

    .meganav-header .meganav-header .navbar-collapse {
        max-height: 100%;
    }
}

@media all and (max-width: 768px) {
    .meganav-header {
        margin-top: 0;
    }

    .off-canvas-content-nav.mobile-nav-active {
        position: fixed;
        /*position: -webkit-sticky;
        position: -moz-sticky;
        position: -ms-sticky;
        position: -o-sticky;*/
        top: 0;
        left: 0;
        width: 100%;
        z-index: 999;
        background-color: white;
        border-bottom: 1px solid #000000;
        padding: 0 0px;
    }

    .hamburger.active.is-open,
    .hamburger.is-fixed {
        position: fixed;
        z-index: 10000;
    }

    .meganav-header .secondary-header .container-fluid {
        padding-left: 0;
        padding-right: 0;
    }

    .meganav-header .secondary-header .container-fluid .row {
        margin-left: 0;
        margin-right: 0;
    }

    .meganav-header .secondary-header .container-fluid .row .col-xs-12 {
        padding-left: 0;
        padding-right: 0;
    }

    .meganav-header .dropdown {
        position: initial !important;
    }

    .meganav-header .navbar-nav {
        top: 0;
        left: 0;
        width: 100%;
        position: absolute;
    }

    .meganav-header .navbar-nav .dropdown.open-nav>a {
        background-color: #ffffff;
    }

    .meganav-header .dropdown .dropdown-menu {
        left: 100%;
        top: 0;
        position: absolute;
    }

    .meganav-header .secondary-header-row {
        overflow: hidden;
    }

    .meganav-header .secondary-header-row .dropdown-menu {
        width: 100%;
    }

    .meganav-header .secondary-header-row .dropdown-menu li a {
        padding-top: 10px;
        padding-bottom: 10px;
        font-size: 1.125em;
    }

    .meganav-header .submenu-show {
        display: block;
        position: relative;
    }

    .meganav-header .menu-remove {
        left: -5000px;
        position: relative;
        display: none !important;
    }

    .meganav-header .dropdown a {
        padding-left: 16px;
        font-size: 18px;
        line-height: 1.7em;
        height: 50px;
    }

    .meganav-header .dropdown.open>a {
        display: none;
    }

    .meganav-header .pull-right {
        float: left !important;
    }

    .meganav-header .navbar .navbar-nav {
        /* background-color: #ffffff; PW5 */
        /* display: block; */
        padding: 20px 0 10px 0;
         /* margin: 34px 0 0 0; JPB increased offest of dropdown from 0 to 34px */
        margin: 0 0 0px 0; /* PW reverted as the 34px was preventing all the options to show */
    }

    .meganav-header .navbar .navbar-nav li a {
        border-bottom: 1px solid #e5e5e5;
        position: relative;
    }

    .meganav-header .navbar .navbar-nav li a:after,
    .meganav-header .navbar .navbar-nav li a .after,
    .meganav-header .navbar .navbar-nav li a:before,
    .meganav-header .navbar .navbar-nav li a .before {
        position: absolute;
        top: 20px;
        font-size: 14px;
    }

    .meganav-header .navbar-default .navbar-nav>li>a.home:after {
        display: none;
    }

    .meganav-header .navbar .navbar-nav li.dropdown:not(.home)>a {
        *zoom: expression(this.runtimeStyle.zoom='1', this.appendChild(document.createElement('span')).className='after');
    }

    .meganav-header .navbar .navbar-nav li.dropdown:not(.home)>a:after,
    .meganav-header .navbar .navbar-nav li.dropdown:not(.home)>a .after {
        font-family: "jl-icon";
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        line-height: 22px;
        *zoom: expression(this.runtimeStyle['zoom'] '1', this.innerHTML '');
        content: "\e856";
        color: #000000;
        right: 16px;
    }

    .meganav-header .navbar .navbar-nav li.submenu-back a {
        text-align: center;
        font-family: 'GillSansforJL', Arial, Helvetica, sans-serif;
        font-weight: 200;
        font-size: 1.125em;
        *zoom: expression(this.runtimeStyle.zoom='1', this.appendChild(document.createElement('span')).className='before');
    }

    .meganav-header .navbar .navbar-nav li.submenu-back a:before,
    .meganav-header .navbar .navbar-nav li.submenu-back a .before {
        font-family: "jl-icon";
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        line-height: 1.38;
        *zoom: expression(this.runtimeStyle['zoom'] '1', this.innerHTML '');
        content: "\e855";
        left: 16px;
    }

    .meganav-header .navbar-toggle.active .icon-bar {
        background-color: #000000;
    }

    .meganav-header .navbar-toggle {
        margin-left: 0;
        padding-bottom: 8px;
    }

    .meganav-header .navbar-toggle p {
        margin-bottom: 8px;
        margin-top: 6px;
        font-size: 1.2em;
    }

    .meganav-header .navbar .navbar-collapse {
        width: 100%;
        max-height: 100%;
        background-color: #ffffff;
        min-height: 100px;
        text-align: left;
    }
}

@media all and (max-width: 992px) {
    .meganav-header .open-nav .navbar-toggle-close {
        display: block;
    }

}

@media all and (min-width: 769px) and (max-width: 993px) {
    /*.meganav-header .navbar-nav .dropdown .sub-menu-wrapper{
        padding: 0 15px;
    }*/

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 {
        width: 50%;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1.level-two-r {
        left: 50%;
    }

    .meganav-header .navbar-nav .nav-promo {
        width: 45%;
    }

    .meganav-header .navbar-nav .nav-promo:nth-last-of-type(2) {
        display: none;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 {
        width: 95%;
    }

    .meganav-header .navbar-nav>li>a {
        line-height: 21px;
    }

    .meganav-header .navbar-nav .nav-sub-col {
        float: none;
        width: 100%;
    }

    /* .meganav-header .navbar-nav .dropdown>a {
        font-size: .84em;
    } */

    .meganav-header .navbar-default .navbar-nav>li>a:after,
    .meganav-header .navbar-default .navbar-nav>li>a .after {
        font-size: 11px;
        right: 17px;
        bottom: 15px;
    }

    /* .meganav-header .navbar-default .navbar-nav>li>a span {
        padding-left: 15px;
        padding-right: 15px;
    } */

    .meganav-header .navbar-default .navbar-nav>li>a.home span,
    .meganav-header .navbar-default .navbar-nav>li.no-dropdown>a span {
        padding: 0 14px;
    }

    .meganav-header .nav-promo.tiles ul {
        overflow: visible;
    }

    .meganav-header .nav-promo.tiles ul li {
        width: 44%;
        height: 8em;
        margin: 0 16px 16px 0;
    }

    .meganav-header .nav-promo.tiles ul li a span {
        width: 90%;
        left: 5%;
        bottom: 15px;
    }

    .meganav-header .nav-promo.tiles ul li:last-child {
        margin-right: 16px;
    }

    .meganav-header .dropdown .nav-promo.tiles ul li a {
        font-size: 1em;
    }

}

@media all and (min-width: 994px) and (max-width: 1080px) {

    /* .meganav-header .navbar-default .navbar-nav>li>a span {
        /*PW009: 25px; /*29px;*/
        /*padding-right: 25px; /*49px;*/
    } */

    .meganav-header .navbar-default .navbar-nav>li>a:after,
    .meganav-header .navbar-default .navbar-nav>li>a .after {
        right: 29px;
    }

}

@media all and (min-width: 769px) and (max-width: 670px) {
    .meganav-header .navbar-nav .dropdown>a {
        font-size: .78em;
    }
}

@media all and (max-width: 768px) {
    .overlay {
        z-index: 999;
    }

    .meganav-header {
        margin-bottom: 0;
    }

    .meganav-header .secondary-header {
        background: transparent;
    }

    .meganav-header _:-moz-tree-row(hover) {
        padding-top: 5px;
    }

    .meganav-header .navbar-toggle:hover {
        color: #000000;
    }

    .meganav-header .navbar-toggle.active:hover {
        color: #000000;
    }

    .meganav-header .navbar-toggle {
        background-color: transparent;
    }

    .meganav-header .dropdown a {
        height: auto;
    }

    .meganav-header .dropdown .navbar-toggle-close {
        display: none;
    }

    .meganav-header .secondary-header-row {
        background: #ffffff;
    }

    .meganav-header .navbar {
        box-shadow: 0 9px 10px rgba(0, 0, 0, 0.2);
    }

    .meganav-header .navbar-nav .nav-sub-col {
        padding-bottom: 0;
    }

    .meganav-header .navbar-nav .nav-sub-col h4 {
        margin-top: 0;
        margin-bottom: 0;
        padding-top: 35px;
        padding-bottom: 17px;
        font-size: 18px;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu-wrapper {
        margin: 0;
        max-width: none;
        height: auto;
        overflow: visible;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .follow,
    .meganav-header .navbar-nav .dropdown .sub-menu .back {
        display: block;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.back a {
        border-top: 0 none;
        font-family: 'GillSansforJL';
        font-weight: 200;
        font-size: 18px !important;
        /* unfortunately I have to use important as the global a tag has importnat set to it!! */
       /* background-color: #f3f1ed !important; */
        color: #000000;
        text-transform: uppercase;
        padding-top: 26px;
        padding-bottom: 26px;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu li.back a .before,
    .meganav-header .navbar-nav .dropdown .sub-menu li.back a:before {
        left: 15px;
        right: auto;
        top: 18px;
        font-family: 'jl-icon';
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        line-height: 1.38;
        *zoom: expression(this.runtimeStyle['zoom'] '1', this.innerHTML '');
        content: "\e855";
        font-size: 14px;
        color: #000000;
    }

    .meganav-header li.back {
        text-align: center;
    }

    .meganav-header .navbar {
        position: relative;
        overflow: hidden;
        -webkit-transform: translateX(-100%);
        -moz-transform: translateX(-100%);
        -o-transform: translateX(-100%);
        transform: translateX(-100%);
        -webkit-transition: transform 350ms ease 0ms;
        -moz-transition: transform 350ms ease 0ms;
        -o-transition: transform 350ms ease 0ms;
        transition: transform 350ms ease 0ms;
    }

    .meganav-header .navbar.visible {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
        -webkit-transition: transform 350ms ease 0ms;
        -moz-transition: transform 350ms ease 0ms;
        -o-transition: transform 350ms ease 0ms;
        transition: transform 350ms ease 0ms;
        /*max-width: 85%;*/
        top: 91px;
    }

    .meganav-header .navbar-collapse {
        -webkit-transition: -webkit-transform .3s ease;
        transition: transform .3s ease;
        position: relative; /*static*/
    }

    .meganav-header .navbar-collapse.navbar-fixed-top {
        position: fixed;
        /*max-width: 85%;*/

        height: 100% !important;
        top: 92px;
    }

    .meganav-header .navbar-default .navbar-nav>li>a {
        color: black;
    }

    .meganav-header .navbar-default .navbar-nav>li>a span {
        border-right: 0 none;
    }

    .meganav-header .navbar-default .navbar-nav>li>a.home span,
    .meganav-header .navbar-default .navbar-nav>li.no-dropdown>a span {
        padding: 0 0 0 15px;
    }


    .meganav-header .nav-promo {
        display: none;
    }

    .meganav-header .navbar-nav>li>a {
        padding-top: .95em;
        padding-bottom: .95em;
    }

    .meganav-header .navbar .navbar-nav .dropdown:hover>.sub-menu,
    .meganav-header .navbar .navbar-nav .dropdown:focus>.sub-menu,
    .meganav-header .navbar .navbar-nav .dropdown:active>.sub-menu {
        display: none;
    }

    .meganav-header .navbar .navbar-nav .dropdown>a {
        line-height: 1em;
        color: #000000;
    }

    .meganav-header .navbar .navbar-nav .dropdown>a .after,
    .meganav-header .navbar .navbar-nav .dropdown>a:after {
        top: 16px;
        font-size: 11px;
    }

    .meganav-header .navbar .navbar-nav .dropdown>a span,
    .meganav-header .navbar .navbar-nav li>a span {
        padding-left: 15px;
    }

    /*
    .meganav-header .navbar .navbar-nav .dropdown>a,
    .meganav-header .navbar .navbar-nav .dropdown>a,
    .meganav-header .navbar .navbar-nav .dropdown>a,
    .meganav-header .navbar .navbar-nav .no-dropdown>a,
    .meganav-header .navbar .navbar-nav .no-dropdown>a,
    .meganav-header .navbar .navbar-nav .no-dropdown>a {
        -webkit-transition: .3s text-indent ease;
        transition: .3s text-indent ease;
    }
    */

    .meganav-header .navbar .navbar-nav .dropdown>a:hover,
    .meganav-header .navbar .navbar-nav .dropdown>a:focus,
    .meganav-header .navbar .navbar-nav .dropdown>a:active,
    .meganav-header .navbar .navbar-nav li>a:hover,
    .meganav-header .navbar .navbar-nav li>a:focus,
    .meganav-header .navbar .navbar-nav li>a:active {
        text-decoration: none;
        color: #000000;
    }

    /*
    .meganav-header .navbar .navbar-nav .dropdown>a:hover,
    .meganav-header .navbar .navbar-nav .dropdown>a:focus,
    .meganav-header .navbar .navbar-nav .dropdown>a:active,
    .meganav-header .navbar .navbar-nav .no-dropdown>a:hover,
    .meganav-header .navbar .navbar-nav .no-dropdown>a:focus,
    .meganav-header .navbar .navbar-nav .no-dropdown>a:active {
        text-indent: 10px;
        -webkit-transition: .3s text-indent ease;
        transition: .3s text-indent ease;
    }
    */

    .meganav-header .navbar .navbar-nav li.dropdown.branch-finder a span,
    .meganav-header .navbar .navbar-nav li.dropdown.contact-us a span {
        padding-left: 44px;
    }

    .meganav-header .navbar .navbar-nav li.dropdown.branch-finder a:after,
    .meganav-header .navbar .navbar-nav li.dropdown.contact-us a:after,
    .meganav-header .navbar .navbar-nav li.dropdown.branch-finder .after,
    .meganav-header .navbar .navbar-nav li.dropdown.contact-us .after {
        font-family: 'jl-icon';
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        line-height: 1.38;
        *zoom: expression(this.runtimeStyle['zoom'] '1', this.innerHTML '');
        /* content: "\e619";*/
        font-size: 22px;
        right: auto;
        left: 15px;
        top: 10px;
        color: #000000;
    }

    .meganav-header .navbar .navbar-nav li.dropdown.contact-us a:after,
    .meganav-header .navbar .navbar-nav li.dropdown.contact-us .after {
        font-family: 'jl-icon';
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        line-height: 1.38;
        *zoom: expression(this.runtimeStyle['zoom'] '1', this.innerHTML '');
        /* content: "\e609";*/
    }

    .meganav-header .navbar .navbar-nav .dropdown .sub-menu {
        width: 200%;
        height: 100%;
        top: 0;
        left: 100%;
        box-shadow: none;
        overflow: visible;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 {
        width: 50%;
        padding-top: 10px;
        top: 0;
        padding-left: 0;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1.level-two-r {
        left: 0;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li {
        padding-right: 0;
        border-left: 0 none;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.back a .before,
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.back a:before {
        right: auto;
        top: 26px;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li>a {
        padding-left: 15px;
        border-top: 0 none;
        padding-top: 20px;
        padding-bottom: 13px;
        line-height: 20px;
        background-color: #ffffff;
    }

    /* Level 2 subgroups */

    /* Level 2 groups */
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1.level-two-r {
        border-top: none;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.l-two-has-subgroup .group-title {
        margin-top: 0;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.l-two-has-subgroup>.group-title,
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.l-two-has-subgroup>ul>li>a {
        padding-left: 15px;
        border-top: 0 none;
        padding-top: 20px;
        padding-bottom: 13px;
        line-height: 20px;
        background-color: #ffffff;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.l-two-has-subgroup>.group-title {
        padding-top: 35px;
        border-bottom: 1px solid #d8d8d8;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li>a .before,
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li>a:before {
        right: 16px;
        top: 16px;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 li.active {
        border-left: 0 none;
        border-top: 0 none;
        background: transparent;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 li.active>a:after {
        display: none;
    }

    /* .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li:last-child a {
        border-bottom: 1px solid #d8d8d8;
    } */

    .meganav-header .navbar-nav .nav-sub-col {
        float: none;
        width: auto;
    }

    .meganav-header .navbar-nav .nav-sub-col.back li {
        text-align: center;
    }

    .meganav-header .navbar-nav .nav-panel {
        padding: 0;
    }

    .meganav-header .navbar-nav .nav-panel.first {
        margin-top: 0;
    }

    .meganav-header .navbar-nav .nav-panel h4 {
        padding-left: 15px;
        padding-right: 15px;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 {
        width: 100%;
        border: 0 none;
        top: 0;
        background: #ffffff;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 .nav-sub-col:first-child ul {
        margin-top: 10px;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 .back a {
        border-top: 0 none;
        border-bottom: 1px solid #d8d8d8;
        font-family: 'GillSansforJL';
        font-weight: 200;
        font-size: 18px !important;
    /*    background-color: #f3f1ed; */
        color: #000000 !important;
        text-transform: uppercase;
        padding-top: 26px;
        padding-bottom: 26px;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 .back a:before {
        top: 26px;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 .follow {
        text-align: left;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li.follow a {
        background-color: #ffffff;
        font-family: 'GillSansforJL', Arial, Helvetica, sans-serif;
        text-transform: none;
        padding-top: 20px;
        padding-bottom: 13px;
        line-height: 20px;
        font-weight: 200;
        font-size: 16px !important;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li.follow a:hover,
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li.follow a:focus,
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li.follow a:active,
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 .back li.follow a:hover,
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 .back li.follow a:focus,
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 .back li.follow a:active {
        color: #000000 !important;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li a {
        padding-left: 15px;
        padding-right: 15px;
        padding-top: 20px;
        padding-bottom: 13px;
        line-height: 20px;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li a:hover,
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li a:focus {
        color: #000000;
    }

    /* .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li:last-child a {
        border-bottom: 1px solid #000000;
    } */

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 li:active,
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li:active,
    .meganav-header .navbar .navbar-nav .dropdown:active {
        background: #ffffff;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 li:active>a,
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li:active>a,
    .meganav-header .navbar .navbar-nav .dropdown:active>a {
        color: #000000;
    }

    .meganav-header .nav1bar-nav .dropdown .sub-menu .nav-col1 li:focus,
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li:focus,
    .meganav-header .navbar .navbar-nav .dropdown:focus {
        background: #ffffff;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 li:focus>a,
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 .nav-col2 li:focus>a,
    .meganav-header .navbar .navbar-nav .dropdown:focus>a {
        color: #000000;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1 a:active:before,
    .meganav-header .navbar .navbar-nav li.dropdown:not(.home)>a:active:after {
        color: #000000;
    }

    .meganav-header .secondary-header {
        border-top: 0 none;
        position: relative;
        z-index: 110;
    }

    .no-js .meganav-header .navbar-nav {
        position: static;
    }
}

@media all and (max-width: 480px) {

    .meganav-header .navbar-nav .dropdown.contact-us,
    .meganav-header .navbar-nav .dropdown.branch-finder {
        display: block;
    }
	
}

@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
    .meganav-header .navbar-default .navbar-nav>li {
        padding-left: 5px;
        padding-right: 5px;
        line-height: 20px;
        display: block;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.active>a {
        text-decoration: underline; /* level1 with arrow */
        border: 0 none;
        color: #000000;
    }

    .meganav-container{
        width: 100%;
        margin-left:0;
        margin-right:0;
        border-left:1px solid #d8d8d8;
        border-right:1px solid #d8d8d8;
        border-bottom:1px solid #d8d8d8;
    }

    .dropdown {
        margin-top: -11px;
    }

    .no-dropdown {
        margin-top: -11px;
    }

    .meganav-header .navbar-nav .dropdown .sub-menu {
        margin-top: 0px;
    }

    .meganav-header .navbar-nav .dropdown.open-nav>a { /* level 0 */
        text-decoration: none;
        /*color: #ff00ff;*/
        position: relative;
        z-index: 51;
        margin-bottom: -1px;
        margin-top: 0px;
        /*border:none;*/
        border-bottom-color: #000; 
        /* border-bottom-color: #ffff00;  */
        
    }

    .meganav-header .overlay.show {
        display: none !important;
    }

}

.underline_text {
    border-bottom: solid 2px #000000;
    display: inline;
    padding-bottom: 3px;
}

span.underline:hover { 
    border-bottom: solid 1px #000;
    padding-bottom: 0px;
    text-decoration: none;
}

.group-title2{
    border-bottom: 1px solid #d8d8d8;
    padding-bottom: 4px;
}

.meganav-header .navbar-nav .no-dropdown>a:hover {
    text-decoration: none;
    color: #000000;
    position: relative;
    margin-bottom: -1px;
    border-bottom-color: #000;
}

/* no border on submen on small devices */
@media all and (max-width: 768px) {
	.js .meganav-header .navbar-nav .dropdown .sub-menu {
      border-top:none;
    }
}

.meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.active>a {
    text-decoration: none; /* level1 with arrow */
    border: 0 none;
    color: #000000;
}

/* .meganav-header .navbar-nav .dropdown.open-nav>span{
    border-bottom-color: 1px solid red;
} */

@media screen 
  and (min-device-width: 1200px)  { 
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.active>a {
        text-decoration: none; /* level1 with arrow */
    }

    .meganav-header .navbar .navbar-collapse {
        line-height: 0;
        padding-left: 0;
        padding-right: 40px;
        border-top: none;
        text-align: center;
    }
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.active>a {  /* level1 with arrow */
        text-decoration: none;
    }
}

 @media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 2)  and (orientation: landscape)  {
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.active>a {  /* level1 with arrow */
        text-decoration: none;
    }
  }

  @media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 2)  and (orientation: portrait)  {
    .meganav-header .navbar-nav .dropdown .sub-menu .nav-col1>li.active>a {  /* level1 with arrow */
        text-decoration: none;
    }
  }

@media all and (min-width: 992px) {
    .meganav-header .navbar-nav .dropdown.open-nav>a { /* level 0 */
        text-decoration: none;
        color: #000000;
        position: relative;
        z-index: 51;
        margin-bottom: 0px;
        border-bottom-color: #000;        
     }

    .meganav-container{
        width: 100%;
        margin-left:0;
        margin-right:0;
        border-left:1px solid #d8d8d8;
        border-right:1px solid #d8d8d8;
        border-bottom:1px solid #d8d8d8;
    }
}

@media only screen and (min-device-width: 375px) and (max-device-width: 812px) and (orientation: landscape)  {                                                                                
    .meganav-header .navbar-default .navbar-nav>li>a {
        margin-left:30px;
    }
}

/* megaNav - end */
/* component - shortcut - begin */

#shortcutModal.modal {
  z-index: 6000;
}

.modal.fade:not(.in).top .modal-dialog{ /* top-down effect*/
    -webkit-transform: translate3d(0, -25%, 0);
    transform: translate3d(0, -25%, 0);
}

body.modal-open .modal-backdrop.fade.in {
    z-index: 1040;
}

body.modal-open .modal-backdrop.in {
    opacity: .85;
}

body.modal-open #totalBox.fixto-fixed {
  position: static !important;
}

#shortcutModal .modal-content {
    background-color: #ffffff; /*#f3f1ed*/
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
    width:inherit;
    height:inherit;
    margin: 0 auto;
    pointer-events: all;
    border:0px;
}

#shortcutModal .vertical-alignment-helper {
    display:table;
    height: 100%;
    width: 100%;
    pointer-events:none; /* This makes sure that we can still click outside of the modal to close it */
}

#shortcutModal .vertical-align-center {
    /* To center vertically */
    display: table-cell;
    vertical-align: middle;
    pointer-events:none;
}

#shortcutModal .modal-title {
	text-align:center;
	padding: 0 0 40px 0;
	font-family:'GillSansforJL';
	font-size:36px;
  line-height: 1em;
	color:#000000;
}

#shortcutModal .close-wrapper{
  padding: 20px 30px 0 0;
}

#shortcutModal .close{
    color: #000000;
    opacity: 1;
}

#shortcutModal .icon-close {
	display: inline-block;
    position: relative;
    margin: 0;
    left: auto;
}

.would-like .set-font-icon {
	font-size:12px;
}


.would-like{
	text-align:center;
}

.would-like-choices {
  margin: 0 15px 60px 15px;
}

@media only screen and (min-width : 769px) {
  .would-like-choices{
    margin:0px 5px 60px 5px;
  }
}

.would-like-choices li a {
	display: block;
  height:auto;
  padding: 14px 0;
  border-bottom: 1px solid #d8d8d8;  /*#dfdbd2;*/
  font-size: 16px;
  color: #000000;
  text-decoration: none;
  position: relative;
  transition: .3s text-indent ease;
}

.would-like-choices li a:hover {
    background: #fff;
    color: #000000;
    text-indent: 10px;
    position: relative;
    z-index: 5004;
 }

.would-like-choices ul{
    list-style-type: none;
}

.would-like span{
	margin-right:10px;
}


@media only screen and (min-width : 481px) and (max-width : 768px)  {
  #shortcutModal .modal-title {
     padding:30px 0px 40px 0px;
  }

  #shortcutModal .close-wrapper{
    padding: 40px 15px 0 0;
  }
 

  .modal-open .modal {
	padding-right: 0px !important;
  }

  #shortcutModal .modal-dialog {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
  }

  #shortcutModal .modal-content {
	height: 100%;
	min-height: 100%;
	width: 100%;
	border-radius: 0;
  }
	
}

@media only screen and (min-width : 320px) and (max-width : 480px)  {
  .btn.gray {
	   width: 100%;
  }

  #shortcutModal .modal-title {
     padding: 0 0px 30px 0px; 
  }

  #shortcutModal .close-wrapper{
    padding: 20px 15px 0 0;
  }

  

  .modal-open .modal {
	 padding-right: 0px !important;
  }

  #shortcutModal .modal-dialog {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
  }

  #shortcutModal .modal-content {
	height: 100%;
	min-height: 100%;
	width: 100%;
	border-radius: 0;
  }
	
}

.title-comp h1,h2,h3,h4,h5 {
    margin: 0px;
}

.section.title {
    clear:both;
}

.title-comp h1.hub-carousel-heading {
  font-size: 60px;
  line-height: 72px;  
  padding: 0 0 7px 0;
  text-align: center;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 700;  
  margin: 0px;
}

.title-comp h1.left-hub-carousel-heading {
  font-size: 60px;
  line-height: 72px;  
  padding: 0 0 7px 0;
  text-align: left;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 700;  
  margin: 0px;
}

.title-comp h1.hub-carousel-heading .dash-bottom:after,
.title-comp h1.left-hub-carousel-heading .dash-bottom:after {
  content: ' ';
  display: block;
  width: 80px;
  border-top: 3px solid;
  margin: 15px auto 30px;
}

.title-comp h2.carousel-heading{
  font-size: 48px;  
  line-height: 58px;  
  padding: 0 0 5px 0;
  text-align: center;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 700;  
  margin: 0px;
}

.title-comp h2.left-carousel-heading {
  font-size: 48px;  
  line-height: 58px;  
  padding: 0 0 5px 0;
  text-align: left;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 700;  
  margin: 0px;
}

.title-comp h2.carousel-heading .dash-bottom:after, 
.title-comp h2.left-carousel-heading .dash-bottom:after {
  content: ' ';
  display: block;
  width: 60px;
  border-top: 3px solid;
  margin: 15px auto 25px;
}

.title-comp h2.small-carousel-heading {
  font-size: 32px;  
  line-height: 36px;  
  padding: 0 0 5px 0;
  text-align: center;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 700;  
  margin: 0px;
}

.title-comp h2.small-left-carousel-heading {
  font-size: 32px;  
  line-height: 36px;  
  padding: 0 0 5px 0;
  text-align: left;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 700;  
  margin: 0px;
}

.title-comp h1 {
    font-size: 20px; 
    line-height: 28px;
    padding: 30px 0;
    text-align: center;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 700;    
    margin: 0px;
    color:#000000;    
}

.title-comp h1.h1-left-align {
    font-size: 20px; 
    line-height: 28px;
    padding: 30px 0;
    text-align: left;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 700;    
    margin: 0px;
    color:#000000;    
}

.title-comp h1.h1-banner-title {
    font-size: 28px; 
    line-height: 28px;
    padding: 30px 0;
    text-align: left;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 700;    
    margin: 0px;
    color:#000000;    
}

.title-comp h2 {
    font-size: 24px;
    line-height: 28px;
    text-align: center;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 700;
    padding: 0px;
    margin: 0px;
    padding-bottom: 30px;
}

.title-comp h2.H2left {
    font-size: 24px;
    line-height: 28px;
    text-align: left;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 700;
    padding: 0px;
    margin: 0px;
    padding-bottom: 30px;

}

.title-comp h2 .dash-bottom {
    display: block;
    margin: 13px 0 35px 0; /* margin bottom changes 30px to 40px */
}


.title-comp h2.HaH2S {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 24px;
    line-height: 28px;
    color:#000000;
    padding-bottom:20px;
    text-align: center;
}

.title-comp h2.HaH2SL {
	font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 700;
    font-style: normal;
	font-size: 24px;
	line-height: 28px;
    color:#000000;
    padding-bottom:20px;
	text-align: left;
}

.title-comp h2.H2noDash {
    padding-bottom:20px;
}




.title-comp h2 .dash-bottom:after {
   content:' ';
   display: block;
   width: 40px;
   font-size: 20px;
   border-top: 2px solid;
   margin: 0 auto;
} /* change for JLF-605 to reduce spacing */



.title-comp h3 {
    font-size: 24px;
    line-height: 28px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 500;
    padding: 0px;
    margin-bottom: 25px;
    text-align: center;   
    color: #000000; 
}

.title-comp h3.H3left {
    font-size: 24px;
    line-height: 28px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 500;
    padding: 0px;
    margin-bottom: 25px;
    text-align: left;   
    color: #000000; 
}

.title-comp h3 .dash-bottom:after { 
    content: ' ';
    display: block;
    border-top: 1px solid;
    margin: 12px auto 21px;
}

.title-comp h3 .dash-bottom.heading-bottom-line:after { 
        border-top: 1px solid #d8d8d8;
    }

.title-comp h4 {
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 700;    
    margin-bottom: 30px;
    padding-bottom: 0px;  
    color: #000000;    
}

.title-comp h4.H4left {
    font-size: 16px;
    line-height: 22px;
    text-align: left;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 700;    
    margin-bottom: 30px;
    padding-bottom: 0px;
    color: #000000;    
}

.title-comp h4 .dash-bottom:after { 
    content: ' ';
    display: block;
    width: 30px;
    border-top: 2px solid;
    margin: 15px auto 30px;
}

.title-comp h5 {
    font-size: 32px;
    line-height: 36px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 500;    
    text-align: center;
    padding-bottom: 0px;
    margin: 0 0 24px;
    color: #000000; 
}

.title-comp h6 {
    font-size: 13px;
    line-height: 18px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 600;    
    text-align: center;
    padding-bottom: 0px;
    margin: 0 0 24px;
    color: #000000; 
}

.title-comp h2.heading {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;    
    font-size: 30px;
    line-height: 34px;
    letter-spacing: 0.5px;
    text-align: center;
    margin-bottom: 20px;
    color: #000000;
}

.title-comp h2.heading:after { 
    content: ' ';
    display: block;
    width: 40px;
    border-top: 2px solid #d8d8d8;
    margin: 20px auto 0;
} 

.title-comp .subheading {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;    
    font-size: 20px;
    line-height: 24px;
    letter-spacing: 0.05em;
    text-align: center;
    margin-bottom: 20px;
}

.title-comp .subheading a:hover, 
.title-comp .subheading a:active,
.title-comp .subheading a:focus {
    font-size: 20px;
}

/************ TABLET Styles ******************/

@media only screen and (min-width : 481px) and (max-width : 768px)  {
    .title-comp h2.carousel-heading, 
    .title-comp h2.left-carousel-heading {
        font-size: 36px;
        line-height: 43.2px;
        padding: 0 0 0px 0;  
    }

    .title-comp h2.carousel-heading .dash-bottom:after,
    .title-comp h2.left-carousel-heading .dash-bottom:after {
        width: 36px;
        margin: 15px auto 18px;
    }

    .title-comp h1.hub-carousel-heading,
    .title-comp h1.left-hub-carousel-heading {
        font-size: 44px;
        line-height: 52.8px;
    }

    .title-comp h1.hub-carousel-heading  .dash-bottom:after,
    .title-comp h1.left-hub-carousel-heading  .dash-bottom:after {
        width: 60px;
        margin: 15px auto 25px;
    }
    
    .title-comp h3 {
        font-size: 22px;
        line-height: 26.4px;
        margin-bottom: 20px;
        margin-top: 0px;
    }     
    
    .title-comp h3 .dash-bottom:after { 
        content: ' ';
        display: block;
        border-top: 1px solid;
        margin: 10px auto 0px;
    }

    .title-comp h3 .dash-bottom.heading-bottom-line:after { 
        border-top: 1px solid #d8d8d8;
    }
    
    .title-comp h4 {
        font-size: 16px;
        line-height: 22px;
        text-align: center;
        font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-weight: 700;
        margin-bottom: 28px;
    }
    
    
    .title-comp h4 .dash-bottom:after { 
        content: ' ';
        display: block;
        width: 30px;
        border-top: 2px solid;
        margin: 14px auto 28px;
    }
    
    .title-comp h5 {
        font-size: 16px;
        line-height: 19.2px;
        padding-bottom: 0px;
        margin: 0 0 22px;
    }


.remove-br br {
    display: none;
}


}

@media only screen and (min-width : 769px) and (max-width : 992px) {
    .title-comp h1.hub-carousel-heading,
    .title-comp h1.left-hub-carousel-heading {
        font-size: 44px;
        line-height:52.8px;
    }

    .title-comp h1.hub-carousel-heading  .dash-bottom:after,
    .title-comp h1.left-hub-carousel-heading  .dash-bottom:after {
        width: 60px;
        margin: 15px auto 25px;
    }

    .title-comp h2.carousel-heading,
	.title-comp h2.left-carousel-heading {
        font-size: 44px;
        line-height: 52.8px;
    }

    .title-comp h2.carousel-heading .dash-bottom:after, 
    .title-comp h2.left-carousel-heading .dash-bottom:after {
        width: 50px;
        margin: 15px auto 20px;
    }
}


@media only screen and (min-width : 601px) and (max-width : 768px) {
    .title-comp h1.hub-carousel-heading,
    .title-comp h1.left-hub-carousel-heading {
        font-size: 44px;
        line-height: 52.8px;
    }

    .title-comp h1.hub-carousel-heading  .dash-bottom:after,
    .title-comp h1.left-hub-carousel-heading  .dash-bottom:after {
        width: 50px;
        margin: 15px auto 25px;
    }

}

@media only screen and (min-width : 481px) and (max-width : 600px) {
    .title-comp h1.hub-carousel-heading,
    .title-comp h1.left-hub-carousel-heading {
        font-size: 36px;
        line-height: 43.2px;
        padding: 0;
    }

    .title-comp h1.hub-carousel-heading  .dash-bottom:after,
    .title-comp h1.left-hub-carousel-heading  .dash-bottom:after {
        width: 36px;
        margin: 15px auto 15px;
    }
}

/********** MOBILE Styles ****************/

@media only screen and (min-width : 320px) and (max-width : 480px)  {
    .title-comp h1.hub-carousel-heading,
    .title-comp h1.left-hub-carousel-heading,                                    
    .title-comp h2.carousel-heading,
    .title-comp h2.left-carousel-heading {
        font-size: 36px;
        line-height: 43.2px;
        padding: 0;
    }

    .title-comp h1.hub-carousel-heading .dash-bottom:after,
    .title-comp h1.left-hub-carousel-heading .dash-bottom:after,                            
    .title-comp h2.carousel-heading .dash-bottom:after, 
    .title-comp h2.left-carousel-heading .dash-bottom:after {
        width: 36px;
        margin: 15px auto 15px;
    } 

    .title-comp h2.small-carousel-heading,
    .title-comp h2.small-left-carousel-heading {
    	font-size: 24px;  
  	line-height: 28px;  
	}

    .title-comp h1 {
        font-size: 20px;
        line-height: 24px;
        padding: 23px 0;
        text-align: center;
    }
    
    
    .title-comp h2 .dash-bottom:after {
        content:' ';
        display: block;
        width: 30px;
        border-top: 2px solid ;
        margin: 13px auto 25px;
    }
    
    .title-comp h3 {
        font-size: 22px;
        line-height: 26.4px;
        margin-bottom: 20px;
    }
    
    .title-comp h3 .dash-bottom:after { 
        content: ' ';
        display: block;
        border-top: 1px solid;
        margin: 10px auto 20px;
    }

    .title-comp h3 .dash-bottom.heading-bottom-line:after { 
        border-top: 1px solid #d8d8d8;
    }
    
    .title-comp h4 {
        font-size: 16px;
        line-height: 22px;
        margin-bottom: 28px;
    }
    
    .title-comp h4 .dash-bottom:after { 
        content: ' ';
        display: block;
        width: 24px;
        border-top: 2px solid;
        margin: 12px auto 22px;
    }
    
    .title-comp h5 {
        font-size: 16px;
        line-height: 19.2px;
        padding-bottom: 0px;
        margin: 0 0 22px;
    }
    
    .title-comp h2.heading {
        font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-weight: 200;
        font-size: 18px;
        line-height: 21.6px;
        text-transform: capitalize;
        letter-spacing: 0.05em;
        text-align: center;
    }
    
    .title-comp h2.heading:after { 
        content: ' ';
        display: block;
        width: 30px;
        border-top: 2px solid #d8d8d8;
        margin: 13px auto 15px;
    } 
    
    .title-comp .subheading {
        font-size: 18px;
        line-height: 21.6px;
    }

	.title-comp h1.h1-left-align {
    	font-size: 20px; 
    	line-height: 24px;
    	padding: 23px 0;  
	}

	.title-comp h1.h1-banner-title {
    	font-size: 24px; 
    	line-height: 28px;
    	padding: 23px 0;  
	}

.remove-br br {
    display: none;
}

}

.bg-color-black{
    background: #000000;
}

.text-copy {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 500;    
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.text-copy p {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;  
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}

.text-copy b, 
.text-copy strong {
    font-weight: 700;
}

.text-copy a {
    color: #000000;
    /*text-decoration: underline solid #000000 1px !important;*/  /*GAD-778 - needs to be long hand for Safari*/  
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-color: #000000;
    text-decoration-thickness: 1px;   
    font-size: 16px !important;
}


.text-copy a:hover, 
.text-copy a:active {
    text-decoration: underline solid #000000 1px;
    color: #000000;
    cursor: pointer;
}

.text-copy a:visited {
    color: #000000;
    text-transform: none;
    text-decoration: underline solid #000000 1px;
}

/* Reset the styles of link if a tel: is in the href */
.text-copy a[href^="tel:"],
.text-copy a[href^="tel:"]:hover, 
.text-copy a[href^="tel:"]:active,
.text-copy a[href^="tel:"]:visited { 
    color: #000000; 
    cursor: default; 
    text-decoration: none !important;
}


.text-copy a span,
.text-copy.custom-text-white a span {
    display: inline-block;
    text-decoration: none !important;
}

.text-copy.custom-text-white a {
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-color: #ffffff;
    text-decoration-thickness: 1px;
}

.text-copy a:hover span,
.text-copy a:active span,
.text-copy a:visited span,
.text-copy.custom-text-white a:hover span,
.text-copy.custom-text-white a:active span,
.text-copy.custom-text-white a:visited span {
    display: inline-block;
    text-decoration: underline !important;
}

/* Reset the styles of link if a tel: is in the href */
.text-copy a[href^="tel:"]:hover span,
.text-copy a[href^="tel:"]:active span,
.text-copy a[href^="tel:"]:visited span,
.text-copy.custom-text-white a[href^="tel:"]:hover span,
.text-copy.custom-text-white a[href^="tel:"]:active span,
.text-copy.custom-text-white a[href^="tel:"]:visited span{
    text-decoration: none !important;
}

.text-copy a span.link-with-chevron:after,
.text-copy a span.article-header-link:after,
.text-copy.custom-text-white a span.link-with-chevron:after,
.text-copy.custom-text-white a span.article-header-link:after {
    display: inline-block;
    text-decoration: none !important;
}


.text-copy ul li,
.text-copy ul li span,
.text-copy ol li,
.text-copy ol li span {
    line-height: 22.4px;
}


.custom-text-white, 
.custom-text-white div, 
.custom-text-white ul li, 
.custom-text-white ol li, 
.custom-text-white q,
.custom-text-white a,
.custom-text-white .body-link,
.custom-text-white .article-header-link,
.custom-text-white .link-with-chevron,
.custom-text-white .article-header-link:after,
.custom-text-white .link-with-chevron:after,
.custom-text-white .bullet-list:before,
.custom-text-white .number-list:before,
.custom-text-white .indent-list:before,
.custom-text-white .chevron-list:before,
.custom-text-white .check-list:before,
.custom-text-white .check-list-alt:before,
.custom-text-white .bullet-list:before,
.custom-text-white .check-list-double:before,
.custom-text-white .check-list-alt-double:before,
.text-copy.custom-text-white ol li::before,
.text-copy.custom-text-white p,
.text-copy.custom-text-white span,
.custom-text-white .demo-icon, 
.custom-text-white .demo-icon:before, 
.custom-text-white  {
    color: #fff !important;
    border-color: #fff !important;
}

.custom-text-white .quote {
    border-top: 1px solid #d8d8d8;
    border-bottom: 1px solid #d8d8d8;
}

.text-copy.custom-text-white .article-header-link:hover, 
.text-copy.custom-text-white .article-header-link:active, 
.text-copy.custom-text-white .article-header-link:focus,
.text-copy.custom-text-white .body-link:hover, 
.text-copy.custom-text-white .body-link:active, 
.text-copy.custom-text-white .body-link:focus,
.text-copy.custom-text-white a:hover, 
.text-copy.custom-text-white a:active, 
.text-copy.custom-text-white a:focus,
.text-copy.custom-text-white .link-with-chevron:hover, 
.text-copy.custom-text-white .link-with-chevron:active, 
.text-copy.custom-text-white .link-with-chevron:focus {
    /*border-bottom: 1px solid #fff;*/
}

.text-copy.custom-text-white a:hover, 
.text-copy.custom-text-white a:active {
    /*xborder-bottom: 1px solid #fff;*/
}


.text-copy.custom-text-white b {
    color: #ffffff;
}

/* p {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-size: 20px;
    line-height: 24px;
    text-align: left;
    letter-spacing: 0.5px;
    color: #464646;
    font-weight: normal;
} */

.text-copy .standfirst {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 500;    
    font-size: 20px;
    line-height: 28px;
    text-align: left;
    color: #000000;
}

.standfirst a {
	font-size: 20px !important;
}

.text-copy .body-link,
.text-copy .body-link a,
.text-copy .link-with-chevron,
.text-copy .link-with-chevron {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 500;    
    font-size: 16px;
    line-height: 22px;
    color: #000000;
}


.text-copy .article-header-link,
.text-copy .article-header-link a {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 500;    
    font-size: 16px !important;
    line-height: 22px;
    color: #000000;
}

.text-copy .article-header-link:hover, 
.text-copy .article-header-link:active, 
.text-copy .article-header-link:focus,
.text-copy .body-link:hover,
.text-copy .body-link:active,
.text-copy .body-link:focus,
.text-copy a:hover,
.text-copy a:active,
.text-copy a:focus,
.link-with-chevron:hover, 
.link-with-chevron:active, 
.link-with-chevron:focus {
    /*cursor: pointer;
    border-bottom: 1px solid #4aa851;
    text-decoration: none;*/
}

.article-header-link:after,
.link-with-chevron:after {
    font-family: "jl-icon";
    content: "";
    font-style: normal;
    font-weight: normal;
    speak: none;
    font-size: 12px;
    padding-left: 6px;
    color: #000000;
    position: relative;
    top: -1px;
}

.bullet-list:before,
.number-list:before,
.indent-list:before,
.chevron-list:before,
.check-list:before,
.check-list-alt:before,
.bullet-list:before {
    font-family: "jl-icon";
    font-style: normal;
    font-weight: normal;
    speak: none;
    font-size: 16px;
    padding-right: 10px;
    color: #000000;
    position: relative;
    /*top:-1px;*/
    padding-left: 1px;
}

.bullet-list:before {
    content: "\2022";
    position: absolute;
    left: 0;
    top: -1px;
    color: #000000;
    font-size: 20px;
}

.number-list:before {
    content: "";
}

.indent-list {
    margin-left: 20px;
}

.indent-list:before {
    content: "\2010";
    top: 5px;
    color: #000000;
    font-size: 32px;
    padding-right: 10px;
}

.chevron-list:before {
    content: "";
}

.check-list:before {
    content: "";
    position: absolute;
    left: 0px;
}
.check-list-alt:before {
    content: "";
    position: absolute;
    left: 0px;
}

.check-list {
    display: inline-block;
    padding-left: 32px;
    position: relative;
    margin-bottom: 10px;
}

.check-list-alt{
    display: inline-block;
    padding-left: 32px;
    position: relative;
}

.check-list-double,
.check-list-alt-double {
    display: inline-block;
    padding-left: 45px;
    position: relative;
    margin-bottom: 15px;
}

.check-list-double:before {
    font-family: "jl-icon";
    content: ""; 
    font-style: normal;
    font-weight: normal;
    speak: none;
    font-size: 30px;
    color: #000000;
    padding-left: 1px;
    /*float: left;
    padding: 0px 10px 20px 0px;
    position: relative;
    top:10px;*/
    position: absolute;
    top: 10px;
    left: 0px;
}


.check-list-alt-double:before {
    font-family: "jl-icon";
    content: "";
    font-style: normal;
    font-weight: normal;
    speak: none;
    font-size: 30px;
    padding-left: 1px;
    color: #000000;
    /*float: left;
    padding: 0px 10px 20px 0px;
    position: relative;
    top:10px;*/
    position: absolute;
    top: 10px;
    left: 0px;
}

.link-with-chevron:visited {
    text-decoration: none;
    border: none;
}

.link-with-chevron .demo-icon {
    font-size: 10px;
    top: -2px;
    position: relative;
}

.extra-large-copy-text,
.extra-large-copy-text-bold {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;    
    font-size: 28px;
    line-height: 33.6px;
    display: inline-block;
    color: #000000;
}

.extra-large-copy-text a {
    font-size: 28px !important;
    font-weight: 200;
}

.extra-large-copy-text-bold,
.extra-large-copy-text-bold a {
    font-size: 28px !important;
    font-weight: 700;
}

.large-copy-text {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 500;    
    font-size: 20px;
    line-height: 28px;
    display: inline-block;
    color: #000000;    
}

.large-copy-text-bold {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 700;    
    font-size: 20px;
    line-height: 28px;
    display: inline-block;
    color: #000000;    
}

.large-copy-text a {
	font-size: 20px !important;
}

.large-copy-text-bold a {
	font-size: 20px !important;
	font-weight: 700;
}

.large-copy-text a:hover, 
.large-copy-text a:active,
.large-copy-text-bold a:hover, 
.large-copy-text-bold a:active {
    cursor: pointer;
    font-size: 20px;
}

.large-copy-text a:visited,
.large-copy-text-bold a:visited{
    text-transform: none;
    font-size: 20px;
}

.small-copy-text {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 300;    
    font-size: 14px;
    line-height: 18px;
    display: inline-block;
    color: #000000;    
}

.small-copy-text-light {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 300;    
    font-size: 14px;
    line-height: 18px;
    color: #000000;   
    display: inline-block;
}

.small-copy-text-bold {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 500;    
    font-size: 14px;
    line-height: 18px;
    color: #000000;
    display: inline-block; 
}

.small-copy-text a,
.small-copy-text-light a {    
    font-size: 14px !important; 
    font-weight: 300;        
}

.small-copy-text-bold a {    
    font-size: 14px !important;
    font-weight: 500;
}

.small-copy-text a:hover, 
.small-copy-text a:active,
.small-copy-text-light a:hover, 
.small-copy-text-light a:active,
.small-copy-text-bold a:hover, 
.small-copy-text-bold a:active {
    cursor: pointer;
    font-size: 14px;
}

.small-copy-text a:visited,
.small-copy-text-light a:visited,
.small-copy-text-bold a:visited{
    text-transform: none;
    font-size: 14px;
}

.terms-and-conditions {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 300;    
    font-size: 14px;
    line-height: 18px;
    display: inline-block;
    color: #000000;     
}

.terms-and-conditions a {    
    font-size: 14px !important; 
    font-weight: 300;
}

.terms-and-conditions a:hover, 
.terms-and-conditions a:active {
    cursor: pointer;
    font-size: 14px;
}

.terms-and-conditions a:visited {
    text-transform: none;
    font-size: 14px;
}

.terms-and-conditions-bold {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 500;    
    font-size: 14px;
    line-height: 18px;
    display: inline-block;
    color: #000000;     
}

.terms-and-conditions-bold a {    
    font-size: 14px !important; 
    font-weight: 500;
}

.terms-and-conditions-bold a:hover, 
.terms-and-conditions-bold a:active {
    cursor: pointer;
    font-size: 14px;
}

.terms-and-conditions-bold a:visited {
    text-transform: none;
    font-size: 14px;
}

.image-caption-only {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 300;    
    font-size: 14px;
    line-height: 18px;
    color: #000000;
    display: inline-block; 
}

.image-caption-only a {    
    font-size: 14px !important;
    font-weight: 300;
}

/* UL */
.text-copy ol, 
.text-copy ul {
    margin-left: 0 !important;
}

ul {
    margin: 0px;
    padding: 0px;
    list-style-position: inside;
    list-style-type: none;
}
.text-copy ul li {
    list-style: none;
    /*text-indent: -17px;*/
}

.text-copy ul .demo-icon {
    margin-right: 10px;
    margin-left: 0px !important;
    text-align: left;
    color: #000000;
} 

.text-copy ul .demo-icon:before {
    margin: 0px;
}

/*** Bullet List ***/

ul.bullet-list {
    font-size: 18px;
    line-height: 33px;
    margin: 0px;
    list-style-type: disc;
    color: #000000;
    letter-spacing 0.5px;
}

ul.bullet-list li span {
    color: #000000;
}

.bullet-list {
    position: relative;
    padding-left: 15px;
    display: inline-block;
}

/*** Number List ***/

.text-copy ol {
    list-style: none; 
    counter-reset: li;
    padding-left: 0;
}

.text-copy ol li::before {
    content: counter(li); 
    color: #000000;
    display: inline-block; 
    padding-right: 10px;
    /*margin-left: -18px;*/
} 

.text-copy ol li {
    counter-increment: li;
}

ol.number-list {
    font-size: 18px;
    line-height: 33px;
    margin: 0px;
    color: #000000;
    padding: 0px;
    list-style-position: inside;
    letter-spacing: 0.5px;
}

ol.number-list li {
    color: #000000;
}

ol.number-list li span {
    color: #000000;
}

/*** Indent List ***/

ul.indent-list li {
     padding-left: 20px;
}

ul.indent-list li .demo-icon {
    font-size: 18px;
    font-weight: bold;
}

/*** Chevron List ***/

ul.chevron-list li {
}

ul.chevron-list li .demo-icon {
     font-size: 12px;
}

/*** Check List ***/
ul.check-list li {
}

/*** Check List - Double ***/
ul.check-list-double li .demo-icon {
    font-size: 33px;
    margin-right: 20px;
    margin-left: 0px;
}

/*** Check List - ALT Double ***/
ul.check-list-alt-double .demo-icon {
    font-size: 33px;
    margin-right: 20px;
    margin-left: 0px;
}


.quote::before {
   content: open-quote;
   padding-right: 5px;
}

.quote::after {
   content: close-quote;
   padding-left: 5px;
}

.quote {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    padding: 23px 20px 29px 20px;
    font-size: 16px;
    line-height: 20px;
    text-align: left;
    clear: both;
    display: block;
    border-top: 1px solid #d8d8d8;
    border-bottom: 1px solid #d8d8d8;
    margin: 10px 0;
    quotes: "\201C""\201D""\2018""\2019";
    letter-spacing: 0.5px;
}

.quote a {
    font-weight: 200;
    font-size: 16px !important; 
}

/* Heading Styles */
.text-copy h1 {
    font-size: 20px;
    line-height: 28px;
    padding: 30px 0;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 700;     
    margin: 0px;
    text-align: center; 
    color: #000000;

}

.text-copy h2 {
    font-size: 24px;
    line-height: 28px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 700;     
    padding: 0px;
    margin: 0 0 25px 0;
    text-align: center;
    color: #000000;  
    padding-bottom: 30px;  
}

.text-copy h3 {
    font-size: 24px;
    line-height: 28px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 500; 
    padding: 0px;
    margin-bottom: 25px;
    text-align: center;   
    color: #000000; 
}


.text-copy h4 {
    font-size: 16px;
    line-height: 22px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 700;     
    margin-bottom: 30px;
    padding-bottom: 0px;
    text-align: center;   
    color: #000000;    
}

.text-copy h5 {
    font-size: 32px;
    line-height: 36px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 500;     
    padding-bottom: 0px;
    margin: 0 0 24px;
    text-align: center;   
    color: #000000;    
}

.text-copy h6 {
    font-size: 13px;
    line-height: 18px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 600;     
    padding-bottom: 0px;
    margin: 0 0 24px;
    text-align: center;   
    color: #000000;  
}

.ha-tableOLD {
	border: 5px teal dotted;
}

@media only screen and (min-width : 320px) and (max-width : 480px)  {
    .text-copy  {
        font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-size: 16px;
        line-height: 22px;
    }

    .text-copy a {
        font-size: 16px !important;
    }

    .standfirst {
        font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-size: 18px;
        line-height: 21.6px;
    }

    .standfirst a {
        font-size: 18px !important;
    }        

    .extra-large-copy-text,
    .extra-large-copy-text-bold {
        font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-weight: 200;             
        font-size: 26px;
        line-height: 31.2px;
    }

    .extra-large-copy-text a {
        font-weight: 200;             
        font-size: 26px !important;
    }

    .extra-large-copy-text-bold,
    .extra-large-copy-text-bold a {
        font-weight: 700;
        font-size: 26px !important;
    }

    .large-copy-text {
        font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-weight: 500;         
        font-size: 20px;
        line-height: 28px;
    }

    .large-copy-text a {       
        font-size: 20px !important;
    }  

    .large-copy-text-body {
        font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-weight: 400;         
        font-size: 20px;
        line-height: 24px;
    }

    .large-copy-text-bold a {
    	font-size: 20px !important; 
	font-weight: 700;
    }                

    .small-copy-text {
        font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-weight: 300;     
        font-size: 14px;
        line-height: 18px;
    }

    .small-copy-text-light {
        font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-weight: 300;     
        font-size: 14px;
        line-height: 18px;
        color: #999999;
    }

    .small-copy-text a,
    .small-copy-text-light a {
    	font-size: 14px !important;
	font-weight: 300; 
    }        

    .small-copy-text-bold {
        font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-weight: 500; 
        font-size: 14px;
        line-height: 18px;
    }

    .small-copy-text-bold a {
        font-weight: 500; 
        font-size: 14px !important;
    }        

    .terms-and-conditions {
        font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-size: 12px;
        line-height: 16.8px;
    }

    .terms-and-conditions a {
        font-size: 12px !important;
        font-weight: 300;
    }

    .terms-and-conditions-bold {
        font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-size: 12px;
        line-height: 16.8px;
    }

    .terms-and-conditions-bold a {
        font-size: 12px !important;
        font-weight: 300;
    }

    .image-caption-only {
        font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-size: 12px;
        line-height: 16.8px;
    }

    .image-caption-only a {
    	font-size: 12px !important; 
	font-weight: 300;}

}

/* summarybox CSS Start*/

.summarybox table {
    border-spacing: 0;
    max-width: none;
    width: 100%;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    font-size: 16px;
}

.summarybox table>thead {
    display: table-header-group;
    vertical-align: middle;
    background: none;
}

.summarybox  table>thead>tr>th {
    background: #f3f1ed;
    color: #000000;
}

.summarybox-title p {
    font-size: 24px;
    line-height: 28.8px;
    font-weight: 400;
    padding-left: 5px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
}

.summarybox-title-text p {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    font-size:16px;
    line-height: 22.4px;
    margin-bottom: 5px;
    padding-left: 5px;
}

.summarybox table>thead>tr {
    border: 1px solid #e6e3dd;
}

.summarybox table>tbody>tr>td {
    padding: 15px 20px 5px 15px;
    margin: 60px 0;
    border: 1px solid #e6e3dd;
    color: #000000;
    line-height: 1.3;
    background: #fff;
    font-size:16px;
}

.summarybox  table td.text {
    font-size:16px;
    color: #000000;
    font-weight: 200;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
}

.summarybox  table td.text-title {
    font-size: 16px;
    color: #000000;
    width: 200px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
}


td.text-bold p {
    margin-bottom: 5px;
}

.summarybox  table>thead>tr>th, 
.summarybox  table>tbody>tr>th, 
.summarybox  table>tfoot>tr>th, 
.summarybox  table>thead>tr>td, 
.summarybox  table>tbody>tr>td, 
.summarybox  table>tfoot>tr>td {
    vertical-align: top;
}

table>thead>tr .p-20, 
table>tbody>tr .p-20, 
table>tfoot>tr .p-20 {
    width: 20%;
}

@media only screen and (min-width : 320px) and (max-width : 768px) {
	.summarybox table {
		overflow-x: auto;
		display: block;
	}
    .summarybox-title p {
        font-size: 22px;
        line-height: 26.4px;
    }
}

/* summarybox CSS End*/

.row .row {
    margin-left: -15px !important;
    margin-right: -15px !important;
}

 .footer-container{
    /*margin-top: 40px;*/
    padding-top: 50px;
    border-top: 1px solid #d8d8d8;
 }

.footer {
    margin: 0px; 
}

.cat-title {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 700 !important;
    color: #000000;
    font-size: 20px;
    line-height: 28px;
}

.cat-title p {
    line-height: 28.8px;
}

#footer-accordion .panel-heading .panel-title p {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    line-height: 28px;
    font-size: 20px !important;
    color: #000000 !important;
    font-weight: 700;
}

.footer-master {
    color: #000000;
}

.footer-inner h4 {
    margin: 0;
}

.footer-inner h4 a {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-size: 24px !important;
    font-weight: 200;
    padding-bottom: 15px;
    display: block;
    line-height: 28px;
}

.footer-inner h4 a:hover {
    text-decoration: none;
}

.footer-inner ul {
    max-height: 620px;
    margin: 0;
    padding-top: 15px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 500;
    font-size: 16px;
    overflow: hidden;
    list-style-type: none;
}

.footer-inner ul li {
    float: left;
    width: 100%;
    padding-right: 10px;
    list-style-type: none;
    padding-bottom: 10px !important;
    font-size: 14px !important;
}

.footer-inner ul li:last-child {
    padding-bottom: 0 !important;
}

.footer-inner ul li p {
    margin-bottom: 0px;
}

.footer-inner ul li a {
    display: block;
    color: #000000;
    font-size: 16px !important;
    line-height: 22px;
}

.footer-inner ul li a:hover {
    color: #000000;
    text-decoration: none;
}

.bottom-wrap {
    padding-left: 3000px;
    margin-left: -3000px;
    margin-right: -3000px;
    padding-right: 3000px;
    margin-top: 2px;
    border-top: 1px solid #d8d8d8 !important;
}

#copy {
    padding: 25px 0;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    font-size: 14px;
    border-top:none !important;
}

#copy:before,#copy:after {
    display: table;
    content: " ";
    clear: both;
}

#copy .terms {
    float: left;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    font-size: 14px;
    color: #000000;
    letter-spacing: 0.5px;
    line-height: 18px;
}

#copy a {
    float: right;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    font-size: 14px !important;
    color: #000000;
}

#copy a:hover{
    text-decoration: underline;
}

#copy a .text {
    font-size: 14px;
    line-height: 18px;
}

#copy a .icon:hover {
    text-decoration: none;
}

#copy .icon-chveron_up:before {
    font-size: 10px;
}

#footer-accordion {
    margin-left: -15px;
    margin-right: -15px;
}

#footer-accordion .panel-default .panel-heading {
    background: #fff;
    padding: 0 0 2px 0;
}

#footer-accordion .panel-heading {
    overflow: hidden;
    width: 100%;
}

#footer-accordion .panel-heading {
    float: left;
    width: 100%;
    display: inline-block;
}

#footer-accordion .panel-heading a {
    display: block;
    padding: 22px 0;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    font-size: 22px !important;
    color: #000000;
}

#footer-accordion .panel-heading {
    float: right;
    display: inline-block;
}

#footer-accordion .panel-heading .demo-icon {
    font-size: 16px;
    color: #000000;
    font-family: "jl-icon";
    font-weight: normal;
    line-height: 30px;
    margin-right: 10px;
}

#footer-accordion a {
    display: block;
}

#footer-accordion a p {
    /*line-height: 2;*/
    margin: 2px 0;
}

#footer-accordion a:hover,#footer-accordion a:active,#footer-accordion a:focus:hover,#footer-accordion a:focus:visited {
    text-decoration: none !important;
}

#footer-accordion .panel-heading {
    border-bottom: 1px solid #d8d8d8;
    border-top: 0;
}

#footer-accordion .panel-body {
    padding: 20px 0 40px !important;
    margin-bottom: 0;
    border-bottom: 1px solid #d8d8d8;
}

#footer-accordion ul {
    margin: 20px 0;
    padding: 0;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
}

#footer-accordion ul li {
    list-style-type: none;
}

#footer-accordion li a {
    display: block;
    padding-bottom: 33px;
    font-size: 16px;
    color: #000000;
    font-weight: 500;
    line-height: 22px;
}

.footer:before,.footer:after {
    display: table;
    content: " ";
}

#footer-small {
   /* border-top: 1px solid #d8d8d8;*/
    background: #fff;
}

.footer-inner h4 a {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-size: 24px !important;
    font-weight: 200;
    padding-bottom: 15px;
    display: block;
    line-height: 28px;
}

.footer-inner h4 a:hover {
    text-decoration: none;
}

.footer-inner ul {
    max-height: 620px;
    margin: 0;
    padding-top: 15px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 500;
    font-size: 16px;
    overflow: hidden;
}

.footer-inner ul li {
    float: left;
    width: 100%;
    padding-right: 10px;
    list-style-type: none;
}

#copy {
    padding: 25px 0;
    border-top: 1px solid #d8d8d8;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    font-size: 12px;
}

#copy:before,#copy:after {
    display: table;
    content: " ";
    clear: both;
}

#copy .terms {
    float: left;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    font-size: 14px !important;
}

#copy a {
    float: right;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    font-size: 14px !important;
}


#footer-small .panel-group {
    margin-bottom: 0;
    border:0;
}

#footer-accordion .panel-default .panel-heading {
    padding: 0 0 2px 0;
}

#footer-accordion .panel-heading {
    overflow: hidden;
    width: 100%;
    float: left;
    width: 100%;
    display: inline-block;
}

#footer-accordion .panel-heading a {
    display: block;
    padding: 20px 0;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-size: 22px !important;
    color: #000000 !important;
    text-decoration: none;
    font-weight: 200;
    line-height: 20px;
}

#footer-accordion .panel-heading {
    float: right;
    display: inline-block;
}

#footer-accordion .panel-heading .demo-icon {
    font-size: 16px;
    color: #000000;
    font-family: "jl-icon";
    font-weight: normal;
    line-height: 30px;
    margin-right: 10px;
}

#footer-accordion a {
    display: block;
}

#footer-accordion a p {
    /*line-height: 2;*/
    margin: 2px 0;
}

#footer-accordion a:hover,#footer-accordion a:active,#footer-accordion a:focus:hover,#footer-accordion a:focus:visited {
    text-decoration: none !important;
}

#footer-accordion .panel-heading {
    border-bottom: 1px solid #d8d8d8;
    border-top: 0;
}

#footer-accordion .panel-body {
    padding: 20px 0 5px !important;
    margin-bottom: 0;
    border-bottom: 1px solid #d8d8d8;
}

#footer-accordion ul {
    margin: 20px -15px 0;
    padding: 0;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
}

#footer-accordion ul li {
    list-style-type: none;
}

#footer-accordion li:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
}

#footer-accordion li:last-child > a {
    margin-bottom: 0;
    padding-bottom: 0;
}

#footer-accordion li a:last-child {
    padding-bottom: 10px;
}

@media only screen and (min-width:993px) and (max-width:1200px) {
    .cat-title {
        font-size: 16px;
        line-height: 22px;
    }
}

@media only screen and (min-width:769px) and (max-width:992px) {
    .footer-inner ul {
        max-height: 680px;
    }
    .cat-title {
        font-size: 16px;
        white-space: nowrap;
    }
}

@media only screen and (min-width:481px) and (max-width:768px) {
    #footer-small {
        margin-top: 0;
        display: block!important; /* overwrite for bootstrap hidden-sm class */
    }

    #copy {
        padding: 25px 0;
        border-top: 1px solid #d8d8d8;
        font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-weight: 200;
        font-size: 12px;
        /*margin: 0 15px;*/
    }
    .footer-master {
        display: none;
    }
    #footer-small .panel-heading .text {
        float: none;
        width: auto;
        display: block;
    }

    #footer-accordion .panel-default .panel-heading {
		margin-bottom: 20px;
    }

   	#footer-accordion .panel-body ul {
		margin-top: 20px !important;
	}

	#footer-accordion li:last-child {
		padding-bottom: 0px !important;
	}

    #footer-accordion .panel-heading a {
		padding: 20px 0 !important;
    }

    #footer-accordion .panel-heading .panel-title a .cat-title p {
		padding: 0px !important;
        margin: 0 0 5px 0;
    }

    #footer-accordion .panel-default .panel-heading {
		margin: 0px; !important;
    }

    #footer-accordion .panel-heading .panel-title .cat-title {
		margin: 0px !important;

    }

    #footer-accordion .panel-title .cat-title p {
       margin-bottom: 20px;
    }

    #footer-accordion .panel-body ul {
		float:left;
        width: 50%;
        padding-left: 15px;
        padding-right: 15px;
    }

    #footer-accordion .pagination {
		display: none;
	}
	.footer-inner h4 {
	    margin: 0;
	    border-bottom: 1px solid #d8d8d8;
}

}

@media only screen and (min-width:320px) and (max-width:480px) {
    #footer-small {
        margin-top: 0;
    }

    #footer-small .panel-heading .text {
        float: none;
        width: auto;
        display: block;
    }

    .small-footer-list {
        width: 100%;
        margin-top: 0;
        margin-bottom: 0;
    }

    .small-footer-list li {
        width: 100%;
    }

    #footer-accordion li:last-child {
        padding-bottom: 0px;
    }

    #footer-accordion .small-footer-list:nth-child(odd) {
        margin-top: 20px;
        margin-bottom: 0;
    }

    #footer-accordion .small-footer-list:nth-child(even) ul {
        margin-top: 0 !important;
    }

    #footer-accordion .small-footer-list:nth-child(even) li:last-child {
        padding-bottom: 0;
    }

    #footer-accordion {
        border-top: 1px solid #d8d8d8;
    }

    #footer-small {
        border: none;
    }

    #footer-accordion .panel-heading .demo-icon {
        font-size: 16px;
        color: #000000;
        font-family: "jl-icon";
        font-weight: normal;
        line-height: 30px;
        margin-right: 10px;
    }

    #copy {
        padding: 25px 0;
        border-top: 1px solid #d8d8d8;
        font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-weight: 200;
        font-size: 14px;
        /*margin: 0 10px;*/
    }

    .footer-master {
        display: none;
    }


	#footer-accordion .pagination {
		display: none;
	}

   	#footer-accordion .panel-body ul {
    	padding-left: 15px;
    	padding-right: 15px;
    	display: block;
	}

	#footer-accordion .panel-body ul:after {
		visibility: hidden;
     	display: block;
     	font-size: 0;
     	content: " ";
     	clear: both;
     	height: 0;
	}


	#footer-accordion .panel-heading .panel-title .footer p {
    	padding: 0px !important;
    	line-height: 28px !important;
	}

	#footer-accordion .panel-heading .panel-title .footer {
    	margin: 20px 0 !important;
	}

	#footer-accordion .panel-heading .panel-title a p {
		margin: 0px !important;
   		padding: 0px !important;
    	line-height: 30px !important;
	}

	#footer-accordion .panel-heading .panel-title h4  {
		margin: 0px !important;
   		padding: 0px !important;
	}

	#footer-accordion li:last-child {
		padding-bottom: 0px !important;
	}

	#footer-accordion .panel-heading a {
		padding: 0px !important;
	}

	#footer-accordion .panel-heading .panel-title .cat-title {
		margin: 20px 0px !important;
	}

	#footer-accordion .panel-heading ul {
		padding: 0px;
        margin: 0px;
	}

    #footer-accordion .panel-heading {
        margin-bottom: 0px;
    }

    #footer-accordion ul {
        margin-top: 0px !important
    }
	.footer-inner h4 {
	    margin: 0;
	    border-bottom: 1px solid #d8d8d8;
	}
}
/** COOKIE BANNER CSS **/

.editMode{
	position: relative;
	top: -9999px !important;
	left: -9999px !important;
}

#CBinner-message {
	margin-bottom:30px;
    padding-left:19px;
    background-color:#000000; 
    font-family: 'GillSansforJL',Arial !important;
    font-weight: 200;    
    position: fixed;
    bottom: 0;
    z-index:99999;
}

.alert{
    border-radius:0px !important;
}

.CBclose-container {
    font-family: 'GillSansforJL',Arial;
    font-weight: 200;
    color:#fff;
    font-size: 14px;
    float:right;
}

.cookieBannerMsg-container{
    margin-right: 30px; 
    color:#fff;
}

.cookieBannerMsg .close{
    color: #fff;
    opacity: 1;
}

.CBclose-container .icon-close {
	left: -3px; 
    position: relative;
    top: 0px;
    font-size: 13px !important;
}

.CBclose-container .close-btn {
    float:none;
    background-color: transparent;
    border: none; 
}

.cookieBannerMsg-container .cookieBannerTitle { 
    text-align: left;
    font-size: 14px;
    letter-spacing : 0.01em;
}

.cookieBannerMsg-container .cookieBannerText{
    font-size: 14px;
    line-height: 19.6px;
    text-align: left;
    background-color:#fff;
    font-family: 'GillSansforJL',Arial;
    font-weight: 200;
}

.cookieBannerText p {
	line-height: 19.6px;
}

.cookieBannerTitle p {
	line-height: 19.6px;
    margin-bottom: 0;
}

.cookieBannerMsg-container a:visited{
    color:#fff;
    font-size: 14px !important;
    text-decoration:underline;
    font-family: 'GillSansforJL',Arial !important;
    font-weight: 200; 
}

.cookieBannerMsg-container a:link{
    color:#fff;
    font-size: 14px !important;
    text-decoration:underline;
    font-family: 'GillSansforJL',Arial !important;
    font-weight: 200; 
}

.cookieBannerMsg-container a:active{
    color:#fff;
    font-size: 14px !important;
    text-decoration:underline;
    font-family: 'GillSansforJL',Arial !important;
    font-weight: 200; 
}

.cookieBannerMsg-container a:hover {
    color:#fff;
    font-size: 14px !important;
    text-decoration:underline;
    font-family: 'GillSansforJL',Arial !important;
    font-weight: 200; 
}

@media only screen and (min-width : 993px) and (max-width : 1200px)  {
}

@media only screen and (min-width : 769px) and (max-width : 992px)  {
}

@media only screen and (min-width : 481px) and (max-width : 768px)  {

}

@media only screen and (min-width : 320px) and (max-width : 480px) {
    .CBclose-container .icon-close {
        left: -3px;
        position: relative;
        top: 0px;
        font-size: 13px !important;
    }
}
/** COOKIE BANNER CSS END **/
/** CTA CSS **/

/* alignment */
.align-center {
    text-align: center;
}

.align-left {
    text-align: left;
}

.align-right {
    text-align: right;
}

/* default-cta */
a.default-btn {
    display: inline-block;
    margin-bottom: 16px;
    height: 49px;
    font-family:'GillSansforJL';
	font-weight: 400;	/*font-weight for Gill Sans Nova for JL Medium*/
    font-size: 18px;
    text-decoration: none;
    border:0px;
    white-space: nowrap; /* fixing the issue text drop*/
}

.default-btn.fullWidthBtn {
    width: 100% !important;
    max-width: 100% !important;
}

.default-btn .cta-text {
    color: #ffffff;
}

.default-btn.link-only .cta-text { 
    color: #000000;
}

.primary-btn-white .cta-text,
.secondary-btn .cta-text{
    color: #000000;
}


/* on mobile view full width */
@media only screen and (min-width : 320px) and (max-width : 480px) {
    .default-btn {
        width:100%;
        padding: 6px 5px !important;
    }

	.btn-container .large-btn {
	    height: 49px;
	    padding-top: 13px !important;
 	    font-size:18px !important;
	}

	/* small button  */
	.btn-container .small-btn {
	    height: 34px;
	    padding-top: 4px !important;
	    font-family: 'GillSansforJL';
		font-weight: 200 !important;	/*font-weight for Gill Sans Nova for JL Light*/
		letter-spacing: 0.5px !important;
	    font-size: 16px !important;
	}

	.btn-container .fx-btn {
  	   height: 49px;
 	   padding: 11px 50px !important;
 	   font-size:16px !important;

	}
}
    
/* primary button */
.btn-container .primary-btn {
    background: #000000; /*GAD-547*/
    color: #ffffff;
    font-weight: 700;	/*font-weight for Gill Sans Nova for JL Medium*/
    transition: background 0.2s;
    transition-timing-function: ease-in;
    border-radius:2px;
}

/* primary button white */
.btn-container .primary-btn-white {
    background: #ffffff;
    color: #000000;
    font-weight: 700;	/*font-weight for Gill Sans Nova for JL Medium*/
    transition: background 0.2s;
    transition-timing-function: ease-in;
     border-radius:2px;
}

/* primary button black */
.btn-container .primary-btn-black {
    background: #000000;
    color: #ffffff;
    font-weight: 700;	/*font-weight for Gill Sans Nova for JL Medium*/
    transition: background 0.2s;
    transition-timing-function: ease-in;
    border-style: none;
    border-radius:2px;

}

/* disabled state */
.btn-container .disabled-btn {
    background: #e6e3de;
}

/* secondary button */
.btn-container .secondary-btn {
    background: transparent;
    color: #000000;
    font-weight: 700;	/*font-weight for Gill Sans Nova for JL Medium*/
    border: 2px;
    border-style: solid;
    border-color: #000000;
    transition: background 0.2s;
    transition-timing-function: ease-in;
    border-radius:2px;
}

.btn-container .secondary-btn.large-btn {
    padding-top: 11px !important;
}

.btn-container .secondary-btn.small-btn {
    padding-top: 3px !important;
}

/* tertiary button */
.btn-container .tertiary-btn {
    background: transparent;
    color: #ffffff;
    font-weight: 700;	/*font-weight for Gill Sans Nova for JL Medium*/
    border: 2px;
    border-style: solid;
    border-color: #ffffff;
    transition: background 0.2s;
    transition-timing-function: ease-in;
    border-radius:2px;
}

.btn-container .tertiary-btn.large-btn {
    padding-top: 11px !important;
}

.btn-container .tertiary-btn.small-btn {
    padding-top: 3px !important;
}

/* large button */
.btn-container .large-btn {
    height: 48px;
    padding: 13px 50px;
    font-size:16px !important;
}

/* small button */
.btn-container .small-btn {
    height: 32px;
    line-height: 21px;
    padding: 5px 50px;
    font-family: 'GillSansforJL';
	font-weight: 700 !important;	/*font-weight for Gill Sans Nova for JL Light*/
	letter-spacing: 0px;
    font-size: 16px !important;
}

/* Link only */
.btn-container .link-only {
    text-decoration: underline;
	letter-spacing: 0px;
	padding: 6px 0px !important;
}

/* Link only - Large Button */
.btn-container .link-only.large-btn {
    font-size: 20px !important;
    letter-spacing: 0px !important;
}

/* Link only - Small Button */
.btn-container .link-only.small-btn {
    font-size: 18px !important;
    font-weight: 400 !important;	/*font-weight for Gill Sans Nova for JL Medium*/
    letter-spacing: 0px !important;
}

/* FX Currency Convertor component button */
.btn-container .fx-btn {
    height: 49px;
    padding: 11px 50px;
    color: #ffffff;
    font-size: 18px !important;
    background: #000000;
    border-radius: 2px;
}



/*
.cta-text:after {
    font-family: "jl-icon";
    content: "";
    font-style: normal;
    font-weight: normal;
    speak: none;
    font-size: 11px;
    padding-left: 10px;
    position: relative;
    top: -2px;
}

.small-btn .cta-text:after {
    font-size: 10px;
}

*/

/* Hover state */

.btn-container a:hover,
a.default-btn:hover,
.btn-container a:active,
a.default-btn:active,
.btn-container a:focus,
a.default-btn:focus,
.btn-container a:visited,
a.default-btn:visited { 
    text-decoration:none !important;
}

.primary-btn:hover {
    background: #1db954; /*GAD-547*/
    text-decoration: none;
}

.primary-btn-white:hover {
    background: #1db954;
    text-decoration: none;
}

.primary-btn-black:hover {
    background: #1db954;
    text-decoration: none;
}

.secondary-btn:hover {
    color: #6b6b6b;
    border-color: #1DB954;
    text-decoration: none;
}

.tertiary-btn:hover {
   
    text-decoration: none;
} 

.nohover a:hover {
    text-decoration:none;
}

/** CTA CSS END **/

/* 
*  Flags CSS
*/
.flagicon {
    display: inline-block;
    width: 20px;
    height: 15px;
    text-align: left;
    text-indent: -999em;
    background-repeat: no-repeat;
    -webkit-background-size: 100%;
    background-size: 100%
}


.flagicon.flag-ad {
    background-image: url(clientlib-flags/images/flags/gif/ad.gif)
}

.flagicon.flag-ae {
    background-image: url(clientlib-flags/images/flags/gif/ae.gif)
}

.flagicon.flag-af {
    background-image: url(clientlib-flags/images/flags/gif/af.gif)
}

.flagicon.flag-ag {
    background-image: url(clientlib-flags/images/flags/gif/ag.gif)
}

.flagicon.flag-ai {
    background-image: url(clientlib-flags/images/flags/gif/ai.gif)
}

.flagicon.flag-al {
    background-image: url(clientlib-flags/images/flags/gif/al.gif)
}

.flagicon.flag-am {
    background-image: url(clientlib-flags/images/flags/gif/am.gif)
}

.flagicon.flag-ao {
    background-image: url(clientlib-flags/images/flags/gif/ao.gif)
}

.flagicon.flag-aq {
    background-image: url(clientlib-flags/images/flags/gif/aq.gif)
}

.flagicon.flag-ar {
    background-image: url(clientlib-flags/images/flags/gif/ar.gif)
}

.flagicon.flag-as {
    background-image: url(clientlib-flags/images/flags/gif/as.gif)
}

.flagicon.flag-at {
    background-image: url(clientlib-flags/images/flags/gif/at.gif)
}

.flagicon.flag-au {
    background-image: url(clientlib-flags/images/flags/gif/au.gif)
}

.flagicon.flag-aw {
    background-image: url(clientlib-flags/images/flags/gif/aw.gif)
}

.flagicon.flag-ax {
    background-image: url(clientlib-flags/images/flags/gif/ax.gif)
}

.flagicon.flag-az {
    background-image: url(clientlib-flags/images/flags/gif/az.gif)
}

.flagicon.flag-ba {
    background-image: url(clientlib-flags/images/flags/gif/ba.gif)
}

.flagicon.flag-bb {
    background-image: url(clientlib-flags/images/flags/gif/bb.gif)
}

.flagicon.flag-bd {
    background-image: url(clientlib-flags/images/flags/gif/bd.gif)
}

.flagicon.flag-be {
    background-image: url(clientlib-flags/images/flags/gif/be.gif)
}

.flagicon.flag-bf {
    background-image: url(clientlib-flags/images/flags/gif/bf.gif)
}

.flagicon.flag-bg {
    background-image: url(clientlib-flags/images/flags/gif/bg.gif)
}

.flagicon.flag-bh {
    background-image: url(clientlib-flags/images/flags/gif/bh.gif)
}

.flagicon.flag-bi {
    background-image: url(clientlib-flags/images/flags/gif/bi.gif)
}

.flagicon.flag-bj {
    background-image: url(clientlib-flags/images/flags/gif/bj.gif)
}

.flagicon.flag-bl {
    background-image: url(clientlib-flags/images/flags/gif/bl.gif)
}

.flagicon.flag-bm {
    background-image: url(clientlib-flags/images/flags/gif/bm.gif)
}

.flagicon.flag-bn {
    background-image: url(clientlib-flags/images/flags/gif/bn.gif)
}

.flagicon.flag-bo {
    background-image: url(clientlib-flags/images/flags/gif/bo.gif)
}

.flagicon.flag-bq {
    background-image: url(clientlib-flags/images/flags/gif/bq.gif)
}

.flagicon.flag-br {
    background-image: url(clientlib-flags/images/flags/gif/br.gif)
}

.flagicon.flag-bs {
    background-image: url(clientlib-flags/images/flags/gif/bs.gif)
}

.flagicon.flag-bt {
    background-image: url(clientlib-flags/images/flags/gif/bt.gif)
}

.flagicon.flag-bv {
    background-image: url(clientlib-flags/images/flags/gif/bv.gif)
}

.flagicon.flag-bw {
    background-image: url(clientlib-flags/images/flags/gif/bw.gif)
}

.flagicon.flag-by {
    background-image: url(clientlib-flags/images/flags/gif/by.gif)
}

.flagicon.flag-bz {
    background-image: url(clientlib-flags/images/flags/gif/bz.gif)
}

.flagicon.flag-ca {
    background-image: url(clientlib-flags/images/flags/gif/ca.gif)
}

.flagicon.flag-cc {
    background-image: url(clientlib-flags/images/flags/gif/cc.gif)
}

.flagicon.flag-cd {
    background-image: url(clientlib-flags/images/flags/gif/cd.gif)
}

.flagicon.flag-cf {
    background-image: url(clientlib-flags/images/flags/gif/cf.gif)
}

.flagicon.flag-cg {
    background-image: url(clientlib-flags/images/flags/gif/cg.gif)
}

.flagicon.flag-ch {
    background-image: url(clientlib-flags/images/flags/gif/ch.gif)
}

.flagicon.flag-ci {
    background-image: url(clientlib-flags/images/flags/gif/ci.gif)
}

.flagicon.flag-ck {
    background-image: url(clientlib-flags/images/flags/gif/ck.gif)
}

.flagicon.flag-cl {
    background-image: url(clientlib-flags/images/flags/gif/cl.gif)
}

.flagicon.flag-cm {
    background-image: url(clientlib-flags/images/flags/gif/cm.gif)
}

.flagicon.flag-cn {
    background-image: url(clientlib-flags/images/flags/gif/cn.gif)
}

.flagicon.flag-co {
    background-image: url(clientlib-flags/images/flags/gif/co.gif)
}

.flagicon.flag-cr {
    background-image: url(clientlib-flags/images/flags/gif/cr.gif)
}

.flagicon.flag-cu {
    background-image: url(clientlib-flags/images/flags/gif/cu.gif)
}

.flagicon.flag-cv {
    background-image: url(clientlib-flags/images/flags/gif/cv.gif)
}

.flagicon.flag-cw {
    background-image: url(clientlib-flags/images/flags/gif/cw.gif)
}

.flagicon.flag-cx {
    background-image: url(clientlib-flags/images/flags/gif/cx.gif)
}

.flagicon.flag-cy {
    background-image: url(clientlib-flags/images/flags/gif/cy.gif)
}

.flagicon.flag-cz {
    background-image: url(clientlib-flags/images/flags/gif/cz.gif)
}

.flagicon.flag-de {
    background-image: url(clientlib-flags/images/flags/gif/de.gif)
}

.flagicon.flag-dj {
    background-image: url(clientlib-flags/images/flags/gif/dj.gif)
}

.flagicon.flag-dk {
    background-image: url(clientlib-flags/images/flags/gif/dk.gif)
}

.flagicon.flag-dm {
    background-image: url(clientlib-flags/images/flags/gif/dm.gif)
}

.flagicon.flag-do {
    background-image: url(clientlib-flags/images/flags/gif/do.gif)
}

.flagicon.flag-dz {
    background-image: url(clientlib-flags/images/flags/gif/dz.gif)
}

.flagicon.flag-ec {
    background-image: url(clientlib-flags/images/flags/gif/ec.gif)
}

.flagicon.flag-ee {
    background-image: url(clientlib-flags/images/flags/gif/ee.gif)
}

.flagicon.flag-eg {
    background-image: url(clientlib-flags/images/flags/gif/eg.gif)
}

.flagicon.flag-eh {
    background-image: url(clientlib-flags/images/flags/gif/eh.gif)
}

.flagicon.flag-er {
    background-image: url(clientlib-flags/images/flags/gif/er.gif)
}

.flagicon.flag-es {
    background-image: url(clientlib-flags/images/flags/gif/es.gif)
}

.flagicon.flag-et {
    background-image: url(clientlib-flags/images/flags/gif/et.gif)
}

.flagicon.flag-fi {
    background-image: url(clientlib-flags/images/flags/gif/fi.gif)
}

.flagicon.flag-fj {
    background-image: url(clientlib-flags/images/flags/gif/fj.gif)
}

.flagicon.flag-fk {
    background-image: url(clientlib-flags/images/flags/gif/fk.gif)
}

.flagicon.flag-fm {
    background-image: url(clientlib-flags/images/flags/gif/fm.gif)
}

.flagicon.flag-fo {
    background-image: url(clientlib-flags/images/flags/gif/fo.gif)
}

.flagicon.flag-fr {
    background-image: url(clientlib-flags/images/flags/gif/fr.gif)
}

.flagicon.flag-ga {
    background-image: url(clientlib-flags/images/flags/gif/ga.gif)
}

.flagicon.flag-gb {
    background-image: url(clientlib-flags/images/flags/gif/gb.gif)
}

.flagicon.flag-gd {
    background-image: url(clientlib-flags/images/flags/gif/gd.gif)
}

.flagicon.flag-ge {
    background-image: url(clientlib-flags/images/flags/gif/ge.gif)
}

.flagicon.flag-gf {
    background-image: url(clientlib-flags/images/flags/gif/gf.gif)
}

.flagicon.flag-gg {
    background-image: url(clientlib-flags/images/flags/gif/gg.gif)
}

.flagicon.flag-gh {
    background-image: url(clientlib-flags/images/flags/gif/gh.gif)
}

.flagicon.flag-gi {
    background-image: url(clientlib-flags/images/flags/gif/gi.gif)
}

.flagicon.flag-gl {
    background-image: url(clientlib-flags/images/flags/gif/gl.gif)
}

.flagicon.flag-gm {
    background-image: url(clientlib-flags/images/flags/gif/gm.gif)
}

.flagicon.flag-gn {
    background-image: url(clientlib-flags/images/flags/gif/gn.gif)
}

.flagicon.flag-gp {
    background-image: url(clientlib-flags/images/flags/gif/gp.gif)
}

.flagicon.flag-gq {
    background-image: url(clientlib-flags/images/flags/gif/gq.gif)
}

.flagicon.flag-gr {
    background-image: url(clientlib-flags/images/flags/gif/gr.gif)
}

.flagicon.flag-gs {
    background-image: url(clientlib-flags/images/flags/gif/gs.gif)
}

.flagicon.flag-gt {
    background-image: url(clientlib-flags/images/flags/gif/gt.gif)
}

.flagicon.flag-gu {
    background-image: url(clientlib-flags/images/flags/gif/gu.gif)
}

.flagicon.flag-gw {
    background-image: url(clientlib-flags/images/flags/gif/gw.gif)
}

.flagicon.flag-gy {
    background-image: url(clientlib-flags/images/flags/gif/gy.gif)
}

.flagicon.flag-hk {
    background-image: url(clientlib-flags/images/flags/gif/hk.gif)
}

.flagicon.flag-hm {
    background-image: url(clientlib-flags/images/flags/gif/hm.gif)
}

.flagicon.flag-hn {
    background-image: url(clientlib-flags/images/flags/gif/hn.gif)
}

.flagicon.flag-hr {
    background-image: url(clientlib-flags/images/flags/gif/hr.gif)
}

.flagicon.flag-ht {
    background-image: url(clientlib-flags/images/flags/gif/ht.gif)
}

.flagicon.flag-hu {
    background-image: url(clientlib-flags/images/flags/gif/hu.gif)
}

.flagicon.flag-id {
    background-image: url(clientlib-flags/images/flags/gif/id.gif)
}

.flagicon.flag-ie {
    background-image: url(clientlib-flags/images/flags/gif/ie.gif)
}

.flagicon.flag-il {
    background-image: url(clientlib-flags/images/flags/gif/il.gif)
}

.flagicon.flag-im {
    background-image: url(clientlib-flags/images/flags/gif/im.gif)
}

.flagicon.flag-in {
    background-image: url(clientlib-flags/images/flags/gif/in.gif)
}

.flagicon.flag-io {
    background-image: url(clientlib-flags/images/flags/gif/io.gif)
}

.flagicon.flag-iq {
    background-image: url(clientlib-flags/images/flags/gif/iq.gif)
}

.flagicon.flag-ir {
    background-image: url(clientlib-flags/images/flags/gif/ir.gif)
}

.flagicon.flag-is {
    background-image: url(clientlib-flags/images/flags/gif/is.gif)
}

.flagicon.flag-it {
    background-image: url(clientlib-flags/images/flags/gif/it.gif)
}

.flagicon.flag-je {
    background-image: url(clientlib-flags/images/flags/gif/je.gif)
}

.flagicon.flag-jm {
    background-image: url(clientlib-flags/images/flags/gif/jm.gif)
}

.flagicon.flag-jo {
    background-image: url(clientlib-flags/images/flags/gif/jo.gif)
}

.flagicon.flag-jp {
    background-image: url(clientlib-flags/images/flags/gif/jp.gif)
}

.flagicon.flag-ke {
    background-image: url(clientlib-flags/images/flags/gif/ke.gif)
}

.flagicon.flag-kg {
    background-image: url(clientlib-flags/images/flags/gif/kg.gif)
}

.flagicon.flag-kh {
    background-image: url(clientlib-flags/images/flags/gif/kh.gif)
}

.flagicon.flag-ki {
    background-image: url(clientlib-flags/images/flags/gif/ki.gif)
}

.flagicon.flag-km {
    background-image: url(clientlib-flags/images/flags/gif/km.gif)
}

.flagicon.flag-kn {
    background-image: url(clientlib-flags/images/flags/gif/kn.gif)
}

.flagicon.flag-kp {
    background-image: url(clientlib-flags/images/flags/gif/kp.gif)
}

.flagicon.flag-kr {
    background-image: url(clientlib-flags/images/flags/gif/kr.gif)
}

.flagicon.flag-kw {
    background-image: url(clientlib-flags/images/flags/gif/kw.gif)
}

.flagicon.flag-ky {
    background-image: url(clientlib-flags/images/flags/gif/ky.gif)
}

.flagicon.flag-kz {
    background-image: url(clientlib-flags/images/flags/gif/kz.gif)
}

.flagicon.flag-la {
    background-image: url(clientlib-flags/images/flags/gif/la.gif)
}

.flagicon.flag-lb {
    background-image: url(clientlib-flags/images/flags/gif/lb.gif)
}

.flagicon.flag-lc {
    background-image: url(clientlib-flags/images/flags/gif/lc.gif)
}

.flagicon.flag-li {
    background-image: url(clientlib-flags/images/flags/gif/li.gif)
}

.flagicon.flag-lk {
    background-image: url(clientlib-flags/images/flags/gif/lk.gif)
}

.flagicon.flag-lr {
    background-image: url(clientlib-flags/images/flags/gif/lr.gif)
}

.flagicon.flag-ls {
    background-image: url(clientlib-flags/images/flags/gif/ls.gif)
}

.flagicon.flag-lt {
    background-image: url(clientlib-flags/images/flags/gif/lt.gif)
}

.flagicon.flag-lu {
    background-image: url(clientlib-flags/images/flags/gif/lu.gif)
}

.flagicon.flag-lv {
    background-image: url(clientlib-flags/images/flags/gif/lv.gif)
}

.flagicon.flag-ly {
    background-image: url(clientlib-flags/images/flags/gif/ly.gif)
}

.flagicon.flag-ma {
    background-image: url(clientlib-flags/images/flags/gif/ma.gif)
}

.flagicon.flag-mc {
    background-image: url(clientlib-flags/images/flags/gif/mc.gif)
}

.flagicon.flag-md {
    background-image: url(clientlib-flags/images/flags/gif/md.gif)
}


.flagicon.flag-me {
    background-image: url(clientlib-flags/images/flags/gif/me.gif)
}


.flagicon.flag-mf {
    background-image: url(clientlib-flags/images/flags/gif/mf.gif)
}

.flagicon.flag-mg {
    background-image: url(clientlib-flags/images/flags/gif/mg.gif)
}

.flagicon.flag-mh {
    background-image: url(clientlib-flags/images/flags/gif/mh.gif)
}

.flagicon.flag-mk {
    background-image: url(clientlib-flags/images/flags/gif/mk.gif)
}

.flagicon.flag-ml {
    background-image: url(clientlib-flags/images/flags/gif/ml.gif)
}

.flagicon.flag-mm {
    background-image: url(clientlib-flags/images/flags/gif/mm.gif)
}

.flagicon.flag-mn {
    background-image: url(clientlib-flags/images/flags/gif/mn.gif)
}

.flagicon.flag-mo {
    background-image: url(clientlib-flags/images/flags/gif/mo.gif)
}

.flagicon.flag-mp {
    background-image: url(clientlib-flags/images/flags/gif/mp.gif)
}

.flagicon.flag-mq {
    background-image: url(clientlib-flags/images/flags/gif/mq.gif)
}

.flagicon.flag-mr {
    background-image: url(clientlib-flags/images/flags/gif/mr.gif)
}

.flagicon.flag-ms {
    background-image: url(clientlib-flags/images/flags/gif/ms.gif)
}

.flagicon.flag-mt {
    background-image: url(clientlib-flags/images/flags/gif/mt.gif)
}

.flagicon.flag-mu {
    background-image: url(clientlib-flags/images/flags/gif/mu.gif)
}

.flagicon.flag-mv {
    background-image: url(clientlib-flags/images/flags/gif/mv.gif)
}

.flagicon.flag-mw {
    background-image: url(clientlib-flags/images/flags/gif/mw.gif)
}

.flagicon.flag-mx {
    background-image: url(clientlib-flags/images/flags/gif/mx.gif)
}

.flagicon.flag-my {
    background-image: url(clientlib-flags/images/flags/gif/my.gif)
}

.flagicon.flag-mz {
    background-image: url(clientlib-flags/images/flags/gif/mz.gif)
}

.flagicon.flag-na {
    background-image: url(clientlib-flags/images/flags/gif/na.gif)
}

.flagicon.flag-nc {
    background-image: url(clientlib-flags/images/flags/gif/nc.gif)
}

.flagicon.flag-ne {
    background-image: url(clientlib-flags/images/flags/gif/ne.gif)
}

.flagicon.flag-nf {
    background-image: url(clientlib-flags/images/flags/gif/nf.gif)
}

.flagicon.flag-ng {
    background-image: url(clientlib-flags/images/flags/gif/ng.gif)
}

.flagicon.flag-ni {
    background-image: url(clientlib-flags/images/flags/gif/ni.gif)
}

.flagicon.flag-nl {
    background-image: url(clientlib-flags/images/flags/gif/nl.gif)
}

.flagicon.flag-no {
    background-image: url(clientlib-flags/images/flags/gif/no.gif)
}

.flagicon.flag-np {
    background-image: url(clientlib-flags/images/flags/gif/np.gif)
}

.flagicon.flag-nr {
    background-image: url(clientlib-flags/images/flags/gif/nr.gif)
}

.flagicon.flag-nu {
    background-image: url(clientlib-flags/images/flags/gif/nu.gif)
}

.flagicon.flag-nz {
    background-image: url(clientlib-flags/images/flags/gif/nz.gif)
}

.flagicon.flag-om {
    background-image: url(clientlib-flags/images/flags/gif/om.gif)
}

.flagicon.flag-pa {
    background-image: url(clientlib-flags/images/flags/gif/pa.gif)
}

.flagicon.flag-pe {
    background-image: url(clientlib-flags/images/flags/gif/pe.gif)
}

.flagicon.flag-pf {
    background-image: url(clientlib-flags/images/flags/gif/pf.gif)
}

.flagicon.flag-pg {
    background-image: url(clientlib-flags/images/flags/gif/pg.gif)
}

.flagicon.flag-ph {
    background-image: url(clientlib-flags/images/flags/gif/ph.gif)
}

.flagicon.flag-pk {
    background-image: url(clientlib-flags/images/flags/gif/pk.gif)
}

.flagicon.flag-pl {
    background-image: url(clientlib-flags/images/flags/gif/pl.gif)
}

.flagicon.flag-pm {
    background-image: url(clientlib-flags/images/flags/gif/pm.gif)
}

.flagicon.flag-pn {
    background-image: url(clientlib-flags/images/flags/gif/pn.gif)
}

.flagicon.flag-pr {
    background-image: url(clientlib-flags/images/flags/gif/pr.gif)
}

.flagicon.flag-ps {
    background-image: url(clientlib-flags/images/flags/gif/ps.gif)
}

.flagicon.flag-pt {
    background-image: url(clientlib-flags/images/flags/gif/pt.gif)
}

.flagicon.flag-pw {
    background-image: url(clientlib-flags/images/flags/gif/pw.gif)
}

.flagicon.flag-py {
    background-image: url(clientlib-flags/images/flags/gif/py.gif)
}

.flagicon.flag-qa {
    background-image: url(clientlib-flags/images/flags/gif/qa.gif)
}

.flagicon.flag-re {
    background-image: url(clientlib-flags/images/flags/gif/re.gif)
}

.flagicon.flag-ro {
    background-image: url(clientlib-flags/images/flags/gif/ro.gif)
}

.flagicon.flag-rs {
    background-image: url(clientlib-flags/images/flags/gif/rs.gif)
}

.flagicon.flag-ru {
    background-image: url(clientlib-flags/images/flags/gif/ru.gif)
}

.flagicon.flag-rw {
    background-image: url(clientlib-flags/images/flags/gif/rw.gif)
}

.flagicon.flag-sa {
    background-image: url(clientlib-flags/images/flags/gif/sa.gif)
}

.flagicon.flag-sb {
    background-image: url(clientlib-flags/images/flags/gif/sb.gif)
}

.flagicon.flag-sc {
    background-image: url(clientlib-flags/images/flags/gif/sc.gif)
}

.flagicon.flag-sd {
    background-image: url(clientlib-flags/images/flags/gif/sd.gif)
}

.flagicon.flag-se {
    background-image: url(clientlib-flags/images/flags/gif/se.gif)
}

.flagicon.flag-sg {
    background-image: url(clientlib-flags/images/flags/gif/sg.gif)
}

.flagicon.flag-sh {
    background-image: url(clientlib-flags/images/flags/gif/sh.gif)
}

.flagicon.flag-si {
    background-image: url(clientlib-flags/images/flags/gif/si.gif)
}

.flagicon.flag-sj {
    background-image: url(clientlib-flags/images/flags/gif/sj.gif)
}

.flagicon.flag-sk {
    background-image: url(clientlib-flags/images/flags/gif/sk.gif)
}

.flagicon.flag-sl {
    background-image: url(clientlib-flags/images/flags/gif/sl.gif)
}

.flagicon.flag-sm {
    background-image: url(clientlib-flags/images/flags/gif/sm.gif)
}

.flagicon.flag-sn {
    background-image: url(clientlib-flags/images/flags/gif/sn.gif)
}

.flagicon.flag-so {
    background-image: url(clientlib-flags/images/flags/gif/so.gif)
}

.flagicon.flag-sr {
    background-image: url(clientlib-flags/images/flags/gif/sr.gif)
}

.flagicon.flag-st {
    background-image: url(clientlib-flags/images/flags/gif/st.gif)
}

.flagicon.flag-sv {
    background-image: url(clientlib-flags/images/flags/gif/sv.gif)
}

.flagicon.flag-sx {
    background-image: url(clientlib-flags/images/flags/gif/sx.gif)
}

.flagicon.flag-sy {
    background-image: url(clientlib-flags/images/flags/gif/sy.gif)
}

.flagicon.flag-sz {
    background-image: url(clientlib-flags/images/flags/gif/sz.gif)
}

.flagicon.flag-tc {
    background-image: url(clientlib-flags/images/flags/gif/tc.gif)
}

.flagicon.flag-td {
    background-image: url(clientlib-flags/images/flags/gif/td.gif)
}

.flagicon.flag-tf {
    background-image: url(clientlib-flags/images/flags/gif/tf.gif)
}

.flagicon.flag-tg {
    background-image: url(clientlib-flags/images/flags/gif/tg.gif)
}

.flagicon.flag-th {
    background-image: url(clientlib-flags/images/flags/gif/th.gif)
}

.flagicon.flag-tj {
    background-image: url(clientlib-flags/images/flags/gif/tj.gif)
}

.flagicon.flag-tk {
    background-image: url(clientlib-flags/images/flags/gif/tk.gif)
}

.flagicon.flag-tl {
    background-image: url(clientlib-flags/images/flags/gif/tl.gif)
}

.flagicon.flag-tm {
    background-image: url(clientlib-flags/images/flags/gif/tm.gif)
}

.flagicon.flag-tn {
    background-image: url(clientlib-flags/images/flags/gif/tn.gif)
}

.flagicon.flag-to {
    background-image: url(clientlib-flags/images/flags/gif/to.gif)
}

.flagicon.flag-tr {
    background-image: url(clientlib-flags/images/flags/gif/tr.gif)
}

.flagicon.flag-tt {
    background-image: url(clientlib-flags/images/flags/gif/tt.gif)
}

.flagicon.flag-tv {
    background-image: url(clientlib-flags/images/flags/gif/tv.gif)
}

.flagicon.flag-tw {
    background-image: url(clientlib-flags/images/flags/gif/tw.gif)
}

.flagicon.flag-tz {
    background-image: url(clientlib-flags/images/flags/gif/tz.gif)
}

.flagicon.flag-ua {
    background-image: url(clientlib-flags/images/flags/gif/ua.gif)
}

.flagicon.flag-ug {
    background-image: url(clientlib-flags/images/flags/gif/ug.gif)
}

.flagicon.flag-um {
    background-image: url(clientlib-flags/images/flags/gif/um.gif)
}

.flagicon.flag-us {
    background-image: url(clientlib-flags/images/flags/gif/us.gif)
}

.flagicon.flag-uy {
    background-image: url(clientlib-flags/images/flags/gif/uy.gif)
}

.flagicon.flag-uz {
    background-image: url(clientlib-flags/images/flags/gif/uz.gif)
}

.flagicon.flag-va {
    background-image: url(clientlib-flags/images/flags/gif/va.gif)
}

.flagicon.flag-vc {
    background-image: url(clientlib-flags/images/flags/gif/vc.gif)
}

.flagicon.flag-ve {
    background-image: url(clientlib-flags/images/flags/gif/ve.gif)
}

.flagicon.flag-vg {
    background-image: url(clientlib-flags/images/flags/gif/vg.gif)
}

.flagicon.flag-vi {
    background-image: url(clientlib-flags/images/flags/gif/vi.gif)
}

.flagicon.flag-vn {
    background-image: url(clientlib-flags/images/flags/gif/vn.gif)
}

.flagicon.flag-vu {
    background-image: url(clientlib-flags/images/flags/gif/vu.gif)
}

.flagicon.flag-wf {
    background-image: url(clientlib-flags/images/flags/gif/wf.gif)
}

.flagicon.flag-ws {
    background-image: url(clientlib-flags/images/flags/gif/ws.gif)
}

.flagicon.flag-ye {
    background-image: url(clientlib-flags/images/flags/gif/ye.gif)
}
.flagicon.flag-yt {
    background-image: url(clientlib-flags/images/flags/gif/yt.gif)
}

.flagicon.flag-za {
    background-image: url(clientlib-flags/images/flags/gif/za.gif)
}

.flagicon.flag-zm {
    background-image: url(clientlib-flags/images/flags/gif/zm.gif)
}

.flagicon.flag-zw {
    background-image: url(clientlib-flags/images/flags/gif/zw.gif)
}

.flagicon.flag-eu {
    background-image: url(clientlib-flags/images/flags/gif/eu.gif)
}

.flagicon.flag-xc {
    background-image: url(clientlib-flags/images/flags/gif/xc.gif)
}

.flagicon.flag-xp {
    background-image: url(clientlib-flags/images/flags/gif/xp.gif)
}
/* 
*  Flags CSS END
*/
/*Breadrcrumb styles start*/
.backlink.breadcrumb{
	padding: 0;
	margin-bottom:0;
	list-style: none;
	background-color:transparent;
	border-radius: 0;
}

.breadcrumbs-wrapper-ins{
	text-align: center;
	padding: 20px 0;
}

.breadcrumbs-wrapper-ins .back{
    top: auto;
    display: inline-block;    
    float: left;
    max-width: 20%;    
    vertical-align: middle;
    padding-top: 7px;
}

.breadcrumbs-wrapper-ins .page-title{
	display: inline-block;
    max-width: 80%;	
}

.breadcrumbs-wrapper-ins .page-title .h1-heading{
	padding-bottom: 0;
}

.breadcrumbs-wrapper-ins .chveron-container{
	display: table;
}

.breadcrumbs-wrapper-ins .icon-chveron_left{
	display: table-cell!important;
	vertical-align: middle;
	top: auto;
	left: auto;
}

.breadcrumbs-wrapper-ins .back .backTitle{
	vertical-align: middle;
	text-align: left;
	line-height: 16px;
	margin: 0 20px 0 5px;
}

.breadcrumb {
    background-color: #ffffff;

    padding: 0;
    margin-bottom: 0px;
}


}

.breadcrumbs-wrapper {
    border-color: #d8d8d8;
    border-bottom-style: solid;
    border-width: thin;
    border: none;
}


/*Breadrcrumb styles end*/
/*warning component start*/

.UNID{
    display:none;
}

.warningMsg .alert{
	padding:14px 0px 0px 0px;
	border-radius:0px;
}

.warningMsg-container{
    margin-top:-8px;
    color:#fff;
}

.warningMsg .close{
    color: #000000;
    opacity: 1;
    /*display:inline-block;
    float: none;*/
}

.close-container .icon-close { /*cross*/
	left: -15px;
    position: relative;
    top: 0px;
    font-size: 13px !important;
}

.close-container .close-label {
    margin-right: 18px;
    display: inline-block;
    top: 0px;
    width:35px;
    position: relative;
}

.warningMsg .close, .close:focus, .close:hover {
    opacity: 1.0 !important;
    text-shadow: none;
}

.close-container {
    font-family: Arial;
    color:#fff;
    font-size: 14px;
    overflow: hidden;
    margin-left:100px;
}

.close-container .close-btn {
    float:right;
    background-color: transparent;
    border: none;
}

#warningInner-message {
/*    padding: 15px 0 0 0;*/
    margin: 0 auto;
    background-color:#464646; /*#464646;*/
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    /*padding-bottom:13px;*/
    width: 100%;
}

.warningMsg-container .warningTitle{ /*comment*/
    text-align: center;
    font-size: 20px;
    line-height: 24px;
    letter-spacing : 0.01em;
    text-transform: uppercase;
    margin-top:-5px;
}

.warningMsg-container .warningText{
    padding:10px 0px 13px 0px;
    font-size: 16px;
    text-align: center;
    background-color:#464646;
    font-family: 'GillSansforJL',Arial;
    font-weight: 200;
}

.warningText p {
	line-height: 22.4px;
}

.warningMsg {
    position: fixed;
    top: 0 ;
    left: 0;
    width: 100%;
    z-index:99999; /*2147483647*/
}

.warningMsg-container a:visited{
    color:#fff;
    font-size: 16px !important;
    text-decoration:underline;
    font-family: 'GillSansforJL','Arial' !important;
    font-weight: 200;
}

.warningMsg-container a:link{
    color:#fff;
    font-size: 16px !important;
    text-decoration:underline;
    font-family: 'GillSansforJL','Arial' !important;
    font-weight: 200;
}

.warningMsg-container a:active{
    color:#fff;
    font-size: 16px !important;
	text-decoration:underline;
    font-family: 'GillSansforJL','Arial' !important;
    font-weight: 200;
}

.warningMsg-container a:hover {
	color:white;
	font-size: 16px !important;
	text-decoration:underline;
    font-family: 'GillSansforJL','Arial' !important;
    font-weight: 200;
}

@media only screen and (min-width : 768px) and (max-width : 992px)  {
    .warningMsg-container .warningTitle{
    	font-size: 18px !important;
        line-height: 21.6px;
        letter-spacing : 0.01em;
        text-transform: uppercase;
        text-align:center;
        padding-top:10px;
        padding-bottom:0px;
    }

    .warningMsg-container .warningText{
    	padding:10px 0px 16px 0px;
        font-size: 16px !important;
        text-align:center;
        font-family: 'GillSansforJL',Arial;
        font-weight: 200;
    }

    .close-container .icon-close { /*cross*/
    	left: -15px;
        position: relative;
        top: 0px;
        font-size: 13px !important;
    }

    .close-container .close-label {
        margin-right: 18px;
        display: inline-block;
        top: 0px;
        width:35px;
        position: relative;
    }

    .warningMsg-container{
        margin-top:-18px;
    }
}

@media only screen and (min-width : 481px) and (max-width : 767px)  {
    .warningMsg-container .warningTitle{
    	font-size: 18px !important;
        line-height: 21.6px;
        letter-spacing : 0.01em;
        text-transform: uppercase;
        text-align:center;
        padding-top:10px;
        padding-bottom:10px;
        width: 70%; /*300px;*/  
        margin: 0 auto;
    }

    .close-container .icon-close { /*cross*/
    	left: -15px;
        position: relative;
        top: 0px;
        font-size: 13px !important;
    }

    .close-container .close-label {
        margin-right: 18px;
        display: inline-block;
        top: 0px;
        width:35px;
        position: relative;
        padding-left:5px;
    }

    .warningMsg-container .warningText{
    	padding:4px 0px 12px 0px;
        font-size: 16px !important;
        text-align:center;
        font-family: 'GillSansforJL',Arial;
        font-weight: 200;
    }

    .warningMsg-container{
        margin-top:-30px;
    }
}

@media only screen and (min-width : 320px) and (max-width : 480px)  {
    .warningMsg-container .warningTitle{ /* 320 - 480 */
    	font-size: 18px !important;
        line-height: 21.6px;
        letter-spacing: 0.01em;
        text-transform: uppercase;
        text-align:center;
        padding-top:10px;
        padding-bottom:10px;

        width: 70%; /*250px;*/
        margin: 0 auto;
    }

    .warningMsg-container .warningText{
    	padding:0px 0px 12px 0px;
        font-size: 16px !important;
        text-align:center;
        font-family: 'GillSansforJL',Arial;
        font-weight: 200;
    }


    .close-container .icon-close { /*cross*/
    	left: -15px;
        position: relative;
        top: 0px;
        font-size: 13px !important;
    }

    .close-container .close-label {
        margin-right: 18px;
        display: inline-block;
        top: -100px; /*hide label*/
        width:35px;
        position: relative;
    }

    .warningMsg-container{
    	margin-top:-31px;
    }
}

/*warning component end*/

/*which currency component start*/

.currency-picker {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
}

.currency-picker p{
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
}

.currency-picker select.form-control {
    display: block;
    width: 100%;
    height: 60px;
    padding: 6px 12px;
    padding-left: 10px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    font-size: 18px;
    line-height: 22.4px;
    color: #000000;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border:1px solid #b4b2ae;
}

@-moz-document url-prefix() {
    select {
        -moz-appearance: none;
        text-indent: 0.01px;
        text-overflow: '';
    }
}

.currency-picker select.form-control:focus {
    outline: none;
}
.currency-picker select::-ms-expand {
    display: none;
} 

/* error and active css */

.currency-picker select.active{
    background: #edf7ec;
    border:1px solid #000000;
}

/* Select styles */
.currency-picker .select {
    position: relative;
    display: block;
    width: 100%;
    cursor: pointer;
}

.currency-picker .select-arrow {
    position: absolute;
    top: 50%;
    right: 20px;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);    
    border-left: 1px solid #d8d8d8;
    padding-top: 0;
    padding-left: 15px;
    pointer-events: none;
}
.currency-picker .select-arrow .icon-chveron_down {
    color: #5f5f5f;
    line-height: 40px;
}
.currency-picker .currency-picker-container {
    /*padding: 20px 0;*/
    margin-bottom: 50px;
}

.currency-picker .currency-picker-container .form-group {
    margin-bottom: 0;
}

.currency-picker .currency-picker-container .form-group select:hover {
    cursor: pointer;
}

.currency-picker-terms {
    padding: 40px 0;
    border-top: 1px solid #d8d8d8;
    clear: both;
}

.currency-picker-terms.results-hidden{
    margin-top: 10px;
}

.currency-picker-terms p {
    margin-bottom: 0;
    font-size: 14px;
    color: #000000;
    font-weight: bold;

}


.currency-picker-result .col{
    margin-bottom: 50px; 
}

.currency-picker-result h4 {
    padding-bottom: 10px;
    margin-bottom: 20px; 
    font-size: 24px;
    font-family: 'GillSansforJL',Arial,sans-serif;
    font-weight: 200;
    color: #000000;
    border-bottom: 1px solid #d8d8d8;
}

.currency-picker-result p {
    margin-bottom: 15px;
    font-size: 16px;
}

.currency-picker-result p.fixed-height{
    min-height: 22px;
}

@media only screen and (min-width : 320px) and (max-width : 768px) {
    .currency-picker-result h4{
        margin-bottom: 10px;
    }
    .currency-picker-terms {
        padding: 20px 0 40px 0;        
    }

}

/*which currency component end*/


/** currency converter component **/
.tiers-container-group {
  margin: 15px 0px 10px 0px;
}

.tiers-container {
  display: flex;
  margin: 3px 0 3px 0;
  height: 40px;
}

.tiers-container-child1 {
  width: 50%;
  flex: 1;
  background-color: #d8d8d8;
  font-weight: 300;
  font-size: 14px;
  line-height: 22px;
  color: #141414;
  text-align: right;
  padding-top: 8px;
}

.tiers-container-child2 {
  width: 50%;
  /* margin-left:5px; */
  background-color: #d8d8d8;
  font-weight: 700;
  font-size: 14px;
  line-height: 22px;
  color: #141414;
  margin-left: 0px;
  padding-left: 8px;
  padding-top: 8px;
}

.currency-button-col {
  flex-basis: 0;
  flex-grow: 1;
  max-width: 100%;
}

.currency-buttons {
  display: flex;
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: 400;
  height: 54px;
}

.currency-buttons button:first-child {
  border-right: 1px solid #000000;
}

.currency-buttons button:nth-child(2) {
  border-left: 0px solid #000000;
  border-right: 0px solid #000000;
}

.currency-buttons button:nth-child(3) {
  border-left: 1px solid #000000;
}

.currency-buttons button {
  background-color: transparent;
  border: 1px solid #000000;
  padding: 10px;
  width: 33.333%;
  line-height: 22px;
}

.currency-buttons button.selected {
  background-color: #7f7f7f;
  color: #ffffff;
  outline: unset;
  font-weight: 500;
  border: none;
}

div.orderQtyMsg * {
  color: #000000;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

div.tierMsgHighlight {
  background-color: #1db954;
  color: #ffffff;
}

div.tierDtlHighlight {
  background-color: #1db954;
  color: #ffffff;
  font-weight: 700;
}

div.currency-message-default {
  color: #000000;
  font-size: 14px;
  font-weight: 300;
  line-height: 25px;
  float: none;
}

@media only screen and (min-width: 769px) {
  .cc-container .cc-result {
    clear: both;
    padding-top: 15px;
  }

  .tiers-container {
    display: grid;
    grid-template-columns: 1fr;
    width: 33.3%;
    float: left;
    height: 64px;
  }

  .tiers-container-child1 {
    color: #000000;
    font-weight: 300;
    font-size: 14px;
    line-height: 25px;
    text-align: center;
    /* justify-content: center; */
    width: 100%;
  }

  .tiers-container-child2 {
    /* float:left; */
    color: #000000;
    letter-spacing: -0.02em;
    font-weight: 300;
    font-size: 16px;
    line-height: 22px;
    width: 100%;
    text-align: center;
    padding: 10px;
    /* justify-content: center; */
  }

  .currency-button-col {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
  }

  .currency-buttons {
    display: flex;
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: 400;
    height: 54px;
  }

  .currency-buttons button:first-child {
    border-right: 1px solid #000000;
  }

  .currency-buttons button:nth-child(2) {
    border-left: 0px solid #000000;
    border-right: 0px solid #000000;
  }

  .currency-buttons button:nth-child(3) {
    border-left: 1px solid #000000;
  }

  .currency-buttons button {
    background-color: transparent;
    border: 1px solid #000000;
    padding: 10px;
    width: 33.333%;
    line-height: 22px;
  }

  .currency-buttons button.selected {
    background-color: #7f7f7f;
    color: #ffffff;
    outline: unset;
    font-weight: 500;
    border: none;
  }

  .currency-message-col {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
  }

  .currency-messages {
    display: flex;
    margin-top: 24px;
    margin-bottom: 10px;
    font-size: 16px;
    font-weight: 300;
    height: 64px;
    line-height: 22px;
  }

  .currency-messages button:first-child {
    border: none;
  }

  .currency-messages button:nth-child(2) {
    border: none;
  }

  .currency-messages button:nth-child(3) {
    border: none;
  }

  .currency-messages button {
    background-color: #d8d8d8;
    border: none;
    width: 33.333%;
  }

  div.orderQtyMsg * {
    color: #000000;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
  }
}

.cc-points-left {
  margin-left: 4px;
}

.cc-points-right {
  margin-right: 4px;
}

.cc-container {
  position: relative;
  padding: 21px 20px 20px 20px;
  border: 1px solid #dedbd2;
}
.cc-container.converter-disabled {
  min-height: auto;
  border: none;
}

.cc-container .cc-header {
  font-size: 22px;
  line-height: 22px;
  font-family: "GillSansforJL", Arial, Helvetica, sans-serif;
  font-weight: 400; /* changed to 200 as per design requirement*/
  padding-bottom: 10px;
  margin-bottom: 20px;
  color: #000000;
  border-bottom: 1px solid #d8d8d8;
  text-transform: uppercase;
}

.cc-container .select-currency {
  padding-bottom: 10px;
  font-size: 16px;
  line-height: 22px;
  font-weight: 700;
}

.cc-container .cc-result {
  position: relative;
  /* min-height: 45px; */
  margin: 5px 0 5px 0;
  /* padding: 13px 0 0 0; */
}

.cc-container .cc-result .text p {
  padding-bottom: 0;
  margin: 0;
  font-family: "GillSansforJL", Arial, Helvetica, sans-serif;
  text-align: center;
  font-size: 16px;
  font-weight: 200;
  color: #000000;
  white-space: nowrap;
}

.cc-container .form-row:first-child {
  margin-bottom: 10px;
}
.cc-container .form-row .input-element {
  float: left;
  width: 100%;
}
.cc-container .form-row .select-element {
  float: left;
  width: 100%;
  position: relative;
  margin-bottom: 20px;
}

.cc-container .how-much {
  padding-bottom: 5px;
  font-size: 16px;
  line-height: 22px;
  font-weight: 700;
}

.cc-container .rate {
  padding: 10px 0px 5px 0px;
  font-size: 16px;
  line-height: 22px;
  font-weight: 700;
}

.cc-container .amount-label {
  font-family: "GillSansforJL", Arial, Helvetica, sans-serif;
  font-weight: 500;
  font-size: 16px;
  text-transform: uppercase;
  /*height: 40%;*/ /*having issue in author mode because of height*/
  line-height: 22px;
  padding: 15px 0 0 9px;
}

.cc-container .gbp-currency {
  display: inline-block;
  border: 1px solid #000000;
  width: 45%;
  float: left;
}

.cc-container .foreign-currency {
  display: inline-block;
  border: 1px solid #000000;
  width: 45%;
  float: right;
}

.cc-container .equals-sign {
  display: inline-block;
  padding-left: 21px;
  padding-top: 20px;
}

.cc-container .openBracket-sign {
  display: inline-block;
}

.cc-container .closeBracket-sign {
  display: inline-block;
}

.cc-container .additionalMessage {
  text-align: center;
  /* height: 30px; */
  font-family: "GillSansforJL", Arial, Helvetica, sans-serif;
  font-weight: 500;
  font-size: 20px;
  line-height: 28px;
  white-space: normal;
}

.cc-container .highlighted {
  /* color: #464646; dynamically use only */
}

.cc-container .amount-container {
  position: relative;
  /*height: 100%;*/
  margin-top: 0;
  padding: 0;
  min-height: 63px;
  height: 64px;
  background: rgb(255, 255, 255);
  background: rgba(255, 255, 255, 0.85);
}

.cc-container .amount {
  font-family: "GillSansforJL", Arial, Helvetica, sans-serif;
  font-weight: 500;
  color: #000000;
  font-size: 20px;
  padding: 0 0 9px 8px;
  /* height: 60%;*/ /*having issue in author mode because of height*/
  box-shadow: none;
  text-align: left;
  width: 80%;
  border: none;
  background: transparent;
  margin-top: 2px;
}

.cc-container .country-container {
  position: relative;
  /*height: 100%;*/
  cursor: pointer;
}

.cc-container .currency-code {
  color: #999;
  font-size: 16px;
  display: inline-block;
}

.cc-container .country-container .element {
  border: 1px solid #000000;
}
.cc-container .select-country-label {
  display: block;
  width: 90%;
  height: 63px;
  padding-top: 16px;
  padding-left: 10px;
  font-family: "GillSansforJL", Arial, Helvetica, sans-serif;
  font-weight: 500;
  font-size: 20px;
}

#currency-type {
  min-height: 80px;
}

.cc-container .points {
  font-weight: 700;
}

.cc-container .dropdown .dropdown-menu {
  position: absolute;
  right: 0%;
  /* xleft: -15%; */
  /*padding: 10px;*/
  padding-top: 10px;
  margin: 0;
  min-height: 220px;
  font-size: 16px;
  background-color: #fff;
  border-radius: 0px;
  border: 0;
  box-shadow: 0px 2px 1px 1px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0px 2px 1px 1px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 2px 1px 1px rgba(0, 0, 0, 0.2);
}

.cc-container .dropdown-menu:before {
  position: absolute;
  top: -13px;
  /* xleft: 51px; */
  left: 4%;
  display: inline-block;
  border-right: 12px solid transparent;
  border-bottom: 12px solid #d8d8d8;
  border-left: 12px solid transparent;
  border-bottom-color: rgba(0, 0, 0, 0.2);
  content: "";
}

.cc-container .dropdown-menu:after {
  position: absolute;
  top: -12px;
  /* xleft: 51px; */
  left: 4%;
  display: inline-block;
  border-right: 12px solid transparent;
  border-bottom: 12px solid #d8d8d8;
  border-left: 12px solid transparent;
  content: "";
}

.cc-container ul.scroll-menu {
  position: relative;
  display: inherit !important;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  -moz-overflow-scrolling: touch;
  -ms-overflow-scrolling: touch;
  -o-overflow-scrolling: touch;
  overflow-scrolling: touch;
  top: 0 !important;
  left: 0 !important;
  width: 100%;
  height: auto;
  max-height: 500px;
  margin: 0;
  border: none;
  -webkit-border-radius: 0 !important;
  -moz-border-radius: 0 !important;
  -ms-border-radius: 0 !important;
  -o-border-radius: 0 !important;
  border-radius: 0 !important;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}

.cc-container ul.scroll-menu-2x {
  max-height: 230px;
}

.cc-container ul.dropdown-menu li {
  border-bottom: 1px solid #d8d8d8;
  /*padding: 10px 2px;*/
  padding: 10px 2px 10px 10px;
  cursor: pointer;
  white-space: nowrap;
  line-height: 24px;
}

.cc-container .form-row .dropdown-menu li:hover {
  background: #e2e6e8;
}
/* common for all form elements */
.cc-container input.ctext,
.cselect {
  display: block;
  width: 100%;
  height: 65px;
  padding: 6px 12px;
  padding-left: 10px;
  font-family: "GillSansforJL", Arial, Helvetica, sans-serif;
  font-weight: 200;
  font-size: 16px;
  line-height: 22.4px;
  color: #000000;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  /* border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;*/
  border: 1px solid #958d84;
}
.cc-container input.ctext {
  font-size: 24px;
}

@-moz-document url-prefix() {
  .cc-container .cselect {
    -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: "";
  }
}

.cc-container input.ctext:focus,
.cc-container .cselect:focus,
.cc-container textarea:focus {
  outline: none;
}
.cc-container .cselect::-ms-expand {
  display: none;
}

.cc-container input::-webkit-outer-spin-button,
.cc-container input::-webkit-inner-spin-button {
  /* display: none; <- Crashes Chrome on hover */
  -webkit-appearance: none;
  margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

/* Select styles */
.cc-container .cselect {
  position: relative;
  display: inline-block;
  /*width: auto;*/
  cursor: pointer;
  /*background: #958d84;
    color: #fff;*/
}

.cc-container .cselect-arrow {
  position: absolute;
  top: 25%;
  right: 20px;
  padding-top: 8px;
  pointer-events: none;
}
.cc-container .cselect-arrow .icon-chveron_down {
  font-family: "jl-icon";
  color: #fff;
  font-size: 16px;
}

.cc-container .nohover a:hover {
  text-decoration: none;
}

.select-country-flag img {
  vertical-align: middle;
  width: 40px;
  height: 30px;
}

.select-country-details {
  display: inline-block;
}

.dynamic-height .cc-container img {
  display: inline;
}

@media only screen and (min-width: 769px) and (max-width: 992px) {
  .cc-container .additionalMessage {
    text-align: center;
    /* height: 30px; */
    font-family: "GillSansforJL", Arial, Helvetica, sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
    white-space: normal;
  }
}

@media only screen and (min-width: 481px) and (max-width: 768px) {
  .cc-container .form-row .input-element {
    width: 100%;
    float: none;
  }
  .cc-container .form-row .select-element {
    width: 100%;
    float: none;
  }

  .cc-container .cc-result p {
    font-size: 16px;
  }
  .cc-container .cselect-arrow .icon-chveron_down {
    font-size: 16px;
  }
  .cc-container select {
    padding-left: 5px;
  }

  .cc-container .additionalMessage {
    text-align: center;
    /* height: 30px; */
    font-family: "GillSansforJL", Arial, Helvetica, sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
    white-space: normal;
  }

  .cc-container .equals-sign {
    display: inline-block;
    padding-left: 10px;
    padding-top: 20px;
  }
}

/* form styles ended */
@media only screen and (min-width: 320px) and (max-width: 480px) {
  .cc-container .equals-sign {
    display: inline-block;
    padding-left: 3px;
    padding-top: 20px;
    margin-left: 3px;
  }

  .cc-container {
    position: relative;
    padding: 20px 20px 20px 20px;
    border: 1px solid #dedbd2;
  }

  .cc-container .form-row .input-element {
    width: 100%;
    float: none;
  }
  .cc-container .form-row .select-element {
    width: 100%;
    float: none;
  }

  .cc-container .cc-result .text p {
    padding-bottom: 0;
    margin: 0;
    font-family: "GillSansforJL", Arial, Helvetica, sans-serif;
    font-weight: 200;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    white-space: nowrap;
  }

  .cc-container .cc-result p {
    font-size: 16px;
  }
  .cc-container .cselect-arrow .icon-chveron_down {
    font-size: 16px;
  }
  .cc-container select {
    padding-left: 5px;
  }

  .cc-container .equals-sign {
    display: inline-block;
    padding-left: 7px;
    padding-top: 20px;
  }

  .cc-container .amount-label {
    font-family: "GillSansforJL", Arial, Helvetica, sans-serif;
    font-weight: 500;
    font-size: 16px;
    text-transform: uppercase;
    line-height: 1;
    padding: 14px 0 0 9px;
  }

  .cc-container .amount {
    font-family: "GillSansforJL", Arial, Helvetica, sans-serif;
    font-weight: 500;
    color: #000000;
    font-size: 18px;
    padding: 0 0 9px 9px;
    box-shadow: none;
    text-align: left;
    width: 100%;
    border: none;
    background: transparent;
    margin-top: 2px;
  }

  .cc-container .select-country-label {
    display: block;
    width: 90%;
    height: 63px;
    padding-top: 20px;
    padding-left: 10px;
    font-family: "GillSansforJL", Arial, Helvetica, sans-serif;
    font-weight: 500;
    font-size: 16px;
  }

  .select-country-details {
    display: inline-block;
    font-size: 16px;
  }

  .cc-container .additionalMessage {
    text-align: center;
    /* height: 30px; */
    font-family: "GillSansforJL", Arial, Helvetica, sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 28px;
    white-space: normal;
  }

  .select-country-flag img {
    display: none;
  }

  .dynamic-height .select-country-flag img {
    display: none;
  }
}

@media only screen and (min-width: 1024px) and (max-height: 1366px) and (-webkit-min-device-pixel-ratio: 1.5) {
  /*ipad pro */

  .tiers-container {
    display: flex;
    margin: 3px 0 3px 0;
    height: 40px;
    width: 100%;
    float: none;
  }

  .tiers-container-child1 {
    width: 49%;
    flex: 1;
    background-color: #d8d8d8;
    font-weight: 300;
    font-size: 14px;
    line-height: 22px;
    color: #141414;
    text-align: right;
    padding-top: 8px;
  }

  .tiers-container-child2 {
    width: 51%;
    /* margin-left:5px; */
    background-color: #d8d8d8;
    font-weight: 700;
    font-size: 14px;
    line-height: 22px;
    color: #141414;
    margin-left: 0px;
    padding-left: 10px;
    padding-top: 8px;
    text-align: left;
  }

  .currency-button-col {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
  }

  .currency-buttons {
    display: flex;
    margin-bottom: 20px;
    font-size: 18px;
    font-weight: 400;
    height: 54px;
  }

  .currency-buttons button:first-child {
    border-right: 1px solid #000000;
  }

  .currency-buttons button:nth-child(2) {
    border-left: 0px solid #000000;
    border-right: 0px solid #000000;
  }

  .currency-buttons button:nth-child(3) {
    border-left: 1px solid #000000;
  }

  .currency-buttons button {
    background-color: transparent;
    border: 1px solid #000000;
    padding: 10px;
    width: 33.333%;
    line-height: 22px;
  }

  .currency-buttons button.selected {
    background-color: #7f7f7f;
    color: #ffffff;
    outline: unset;
    font-weight: 500;
    border: none;
  }

  .cc-container .equals-sign {
    display: inline-block;
    padding-left: 9px;
    padding-top: 20px;
  }
}

@media only screen and (-webkit-min-device-pixel-ratio: 2),
                    only screen and (min--moz-device-pixel-ratio: 2),
                    only screen and (-o-min-device-pixel-ratio: 2/1),
                    only screen and (min-device-pixel-ratio: 2)
{ 
 
  .tiers-container {
    display: flex;
    margin: 3px 0 3px 0;
    height: 40px;
    width: 100%;
    float: none;
  }

  .tiers-container-child1 {
    width: 49%;
    flex: 1;
    background-color: #d8d8d8;
    font-weight: 300;
    font-size: 14px;
    line-height: 22px;
    color: #141414;
    text-align: right;
    padding-top: 8px;
  }

  .tiers-container-child2 {
    width: 51%;
    /* margin-left:5px; */
    background-color: #d8d8d8;
    font-weight: 700;
    font-size: 14px;
    line-height: 22px;
    color: #141414;
    margin-left: 0px;
    padding-left: 10px;
    padding-top: 8px;
    text-align: left;
  }

  .currency-button-col {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
  }

  .currency-buttons {
    display: flex;
    margin-bottom: 20px;
    font-size: 18px;
    font-weight: 400;
    height: 54px;
  }

  .currency-buttons button:first-child {
    border-right: 1px solid #000000;
  }

  .currency-buttons button:nth-child(2) {
    border-left: 0px solid #000000;
    border-right: 0px solid #000000;
  }

  .currency-buttons button:nth-child(3) {
    border-left: 1px solid #000000;
  }

  .currency-buttons button {
    background-color: transparent;
    border: 1px solid #000000;
    padding: 10px;
    width: 33.333%;
    line-height: 22px;
  }

  .currency-buttons button.selected {
    background-color: #7f7f7f;
    color: #ffffff;
    outline: unset;
    font-weight: 500;
    border: none;
  }

  .cc-container .equals-sign {
    display: inline-block;
    padding-left: 9px;
    padding-top: 20px;
  }

}
/** currency converter component End**/

/*currency rates component start*/

.currency-rates{
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;  
    font-weight: 200;
}

.exchange-rates-table .exchange-rates-table-container {
    background: #f3f1ed;
    border: 1px solid #d8d8d8
}

.exchange-rates-table .exchange-rates-container {
    min-height: 373px;
    padding: 0 20px 20px
}

@media (max-width: 768px) {
    .exchange-rates-table .exchange-rates-container {
        min-height:inherit!important
    }
}

.exchange-rates-table .exchange-rates-container .btn {
    position: absolute;
    bottom: 20px;
    left: 35px
}

@media (max-width: 768px) {
    .exchange-rates-table .exchange-rates-container .btn {
        position:relative!important;
        bottom: inherit!important;
        left: inherit!important
    }
}

.exchange-rates-table .exchange-rates-table td,
.exchange-rates-table .rates-table-full td,
.exchange-rates-table .exchange-rates-table th,
.exchange-rates-table .rates-table-full th {
    padding: 8px 0!important
}

.exchange-rates-table h2 {
    width: 100%;
    padding: 10px 0 5px 18px;
    margin-top: 0;
    margin-bottom: 7px;
    font-size: 30px;
    background: #fff;
    border-bottom: none!important
}

.exchange-rates-table table {
    margin-bottom: 10px;
    border-bottom: 1px solid #d8d8d8
}

.exchange-rates-table table .currency-rates {
    text-align: right
}

.exchange-rates-table table>thead>tr>th {
    padding:13px 0 13px 10px;
    font-size: 20px;	/*made to look like Style Large Copy text bold*/
    font-weight: 400;
    letter-spacing: 0.5px;
    line-height: 28px;
}

.exchange-rates-table table>thead>tr.highlight,
.exchange-rates-table table>tbody>tr.highlight {
    background-color: #f3f1ed;
}

.exchange-rates-table table>tbody>tr>td {
    border: none
}

.exchange-rates-table table i {
    display: inline-block;
    float: left;
    width: 20px;
    margin-top: 3px;
    margin-right: 10px
}

.exchange-rates-table table span {
    display: block;
    overflow: hidden;
    zoom:1}

.exchange-rates-table p {
    font-size: 12px;
}

.rates-table-full {
    margin-top: 30px;
}

.rates-table-full table {
    border: none;
}

.rates-table-full table>thead>tr>th {
    border: none;
}

.rates-table-full table>tbody>tr {
    border-bottom: 1px solid #d8d8d8;
}

.rates-table-full table>tbody>tr>td {
    border: none;
}

.rates-table-full-disable {
    padding: 40px;
    border: 1px solid #ff893e;
}

.rates-table-full-disable h2 {
    padding: 0 0 8px!important;
    font-size: 30px!important;
    border-bottom: 1px solid #d8d8d8!important;
}

.rates-table-full-disable p {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;  
    font-weight: 200;
    font-size: 25px;
}

.exchange-rates-table-body {
    position: relative
}

.exchange-rates-table-body .btn {
    position: inherit!important;
    bottom: inherit!important;
    left: inherit!important
}

@media (min-width: 1200px) {
    .exchange-rates-table-body .btn {
        margin-top:-30px
    }
}

.exchange-rates-table-body .exchange-rates-container {
    min-height: inherit!important;
    padding: 0 25px 15px!important
}

@media (max-width: 767px) {
    .exchange-rates-table-body .exchange-rates-container .btn {
        position:relative!important;
        bottom: inherit!important;
        left: inherit!important
    }
}

.exchange-rates-table-body h2 {
    padding: 15px 0 15px 25px;
    font-size: 34px
}

.currency-rates .btn-container,
.currency-rates-tiered .btn-container,
.currency-rates-tiered-bureau .btn-container {
    text-align: center;
    margin: 40px 0;
}

.currency-rates .primary-btn,
.currency-rates-tiered .primary-btn,
.currency-rates-tiered-bureau .primary-btn {
    display: inline-block;
    height: 44px;
    padding: 11px 50px;
    font-size: 18px;
    border-radius: 1px;
    -moz-border-radius:1px;
    -webkit-border-radius:1px;
    font-family: 'GillSansforJL';
    text-decoration: none;
    border:0px;
    white-space: nowrap; /* fixing the issue text drop*/
}
.currency-rates .primary-btn:hover,
.currency-rates-tiered .primary-btn:hover,
.currency-rates-tiered-bureau .primary-btn:hover {
    background: #52b65e;
    background-image: -webkit-linear-gradient(top, #52b65e, #3e9a45);
    background-image: -moz-linear-gradient(top, #52b65e, #3e9a45);
    background-image: -ms-linear-gradient(top, #52b65e, #3e9a45);
    background-image: -o-linear-gradient(top, #52b65e, #3e9a45);
    background-image: linear-gradient(to bottom, #52b65e, #3e9a45);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#52b65e, endColorstr=#3e9a45);
    text-decoration: none;
}

@media (max-width: 767px) {
    .exchange-rates-table-body .col-sm-6:first-child table {
        margin-bottom:0!important;
        border-bottom: none!important
    }

    .exchange-rates-table-body .col-sm-6:last-child table thead {
        display: none!important
    }
}

@media (max-width: 480px) {
    table.responsive-table {
        background:#fff;
        border: none
    }

    table.responsive-table thead {
        display: none
    }

    table.responsive-table tbody tr {
        min-height: 105px;
        background: #f3f1ed;
        padding: 0 10px 20px;
    }

    table.responsive-table tbody tr td {
        vertical-align: inherit;
        border: none
    }

    table.responsive-table td.first:before {
        content: ""
    }

    table.responsive-table td.second:before {
        content: "Online Sell Rate:"
    }

    table.responsive-table td.third:before {
        content: "Online Buy Rate:"
    }

 	table.responsive-table td.fourth:before {
        content: "Bureau Sell Rate:"
    }

    table.responsive-table td.fifth:before {
        content: "Bureau Buy Rate:"
    }

	.bureau-table table.responsive-table td.second:before {
        content: "Bureau Sell Rate:"
    }

	.bureau-table  table.responsive-table td.third:before {
        content: "Bureau Buy Rate:"
    }	

    table.responsive-table td.first,table.responsive-table td.second,table.responsive-table td.third, table.responsive-table td.fourth, table.responsive-table td.fifth {
        padding-left: 39%;
        font-size: 14px;
    }

    table.responsive-table td.first{
        border-bottom: 1px solid #d8d8d8;
        padding: 8px 0;
        font-size: 16px;
    }

    .exchange-rates-table table i{
        margin-top: 3px;
        margin-right: 10px;
    }

    table.responsive-table td.first:before,table.responsive-table td.second:before,table.responsive-table td.third:before,table.responsive-table td.fourth:before,table.responsive-table td.fifth:before {
        position: absolute;
        left: 10px!important;
        z-index: 10;
        display: block;
        font-weight: 700
    }


/* 
    table.responsive-table td:nth-child(2):before {
        content: "Sell Rate:"
    }

    table.responsive-table td:nth-child(3):before {
        content: "Buy Rate:"
    } */

    table.responsive-table td:nth-child(1),table.responsive-table td:nth-child(2),table.responsive-table td:nth-child(3) ,table.responsive-table td:nth-child(4),table.responsive-table td:nth-child(5){
        padding: 8px 0 0 130px;
    }

    table.responsive-table td:nth-child(1){
        padding: 8px 0;        
    }

    table.responsive-table td:nth-child(1):before,table.responsive-table td:nth-child(2):before,table.responsive-table td:nth-child(3):before,table.responsive-table td:nth-child(4):before,table.responsive-table td:nth-child(5):before {
        position: absolute;
        left: 12px;
        z-index: 10;
        display: block;
        font-weight: 700
    }

    table.responsive-table tr,table.responsive-table td {
        display: block;
        float: left;
        width: 100%;
        clear: both
    }

    table.responsive-table tr {
        position: relative;
        margin-bottom: 10px;        
    }

    table.responsive-table td {
        border-top: none
    }
}

@media (min-width: 768px) {
    .exchange-rates-table h2 {
        font-size:26px!important
    }

    .exchange-rates-table .exchange-rates-container {
        min-height: 374px!important
    }

    .exchange-rates-table .exchange-rates-container .btn {
        position: absolute!important;
        bottom: 20px!important;
        left: 30px!important
    }

    .exchange-rates-table-body .exchange-rates-container {
        min-height: inherit!important
    }

    .exchange-rates-table-body .exchange-rates-container .btn {
        position: relative!important;
        bottom: inherit!important;
        left: inherit!important
    }
}

@media (max-width: 1200px) {
    .exchange-rates-table table>tbody>tr>td {
        font-size:16px
    }

    .exchange-rates-table .exchange-rates-container {
        min-height: 374px
    }

    .exchange-rates-table .text-right {
        text-align: left
    }
}

@media (min-width: 480px) {
    .exchange-rates-table table>tbody>tr>td,
    .rates-table-full table>tbody>tr>td,
    .exchange-rates-table table>tbody>tr>th,
    .rates-table-full table>tbody>tr>th {
        padding:13px 0 13px 10px;
    }
}

@media (min-width: 768px) {
    .rates-table-full-disable {
        width:92%;
        margin-left: 40px
    }
}

@media (min-width: 480px) {
    .rates-table-full table>tbody>tr>td,
    .rates-table-full table>tbody>tr>th {
        padding:13px 0 13px 10px;
    }
}


@media (min-width: 480px) {
    #currencyRatesTiered {
        width: 100%;
        table-layout: fixed;
        margin-bottom: 22px;
    }

    .exchange-rates-table #currencyRatesTiered>thead>tr>th,
    .rates-table-full #currencyRatesTiered>thead>tr>th {
        padding: 5px 0px;
    }

    .exchange-rates-table #currencyRatesTiered>tbody>tr>td,
    .rates-table-full #currencyRatesTiered>tbody>tr>td {
        padding: 10px 0px;
    }

    .exchange-rates-table #currencyRatesTiered>thead>tr>th.first,
    .rates-table-full #currencyRatesTiered>thead>tr>th.first,
    .exchange-rates-table #currencyRatesTiered>tbody>tr>td.first,
    .rates-table-full #currencyRatesTiered>tbody>tr>td.first {
        padding: 5px 0 5px 10px;
    }

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

    /* Tiered Currency Rates Table - ONLINE */
    #currencyRatesTiered thead th.first,
    #currencyRatesTiered tbody td.first {
        width: 50%;
        text-align: left;
        vertical-align: middle;
    }

    #currencyRatesTiered thead tr th.first {
        font-weight: 400;
        font-size: 18px;
        line-height: 23px;
        letter-spacing: 0.5px;
    }

    #currencyRatesTiered thead th.second,
    #currencyRatesTiered thead th.third,
    #currencyRatesTiered thead th.fourth,
    #currencyRatesTiered tbody td.second,
    #currencyRatesTiered tbody td.third,
    #currencyRatesTiered tbody td.fourth {
        width: 16.666667%;
        text-align: center;
        vertical-align: middle;
    }

    #currencyRatesTiered thead th.second,
    #currencyRatesTiered thead th.third,
    #currencyRatesTiered thead th.fourth {
        line-height: 23px;
        letter-spacing: 0.5px;
    }

    #currencyRatesTiered thead th.second .top-line,
    #currencyRatesTiered thead th.third .top-line,
    #currencyRatesTiered thead th.fourth .top-line {
        font-weight: 200;
        font-size: 16px;
    }

    #currencyRatesTiered thead th.second .bottom-line,
    #currencyRatesTiered thead th.third .bottom-line,
    #currencyRatesTiered thead th.fourth .bottom-line {
        font-weight: 400;
        font-size: 18px;
    }

    #currencyRatesTiered tbody td.first {
        font-weight: 200;
        font-size: 18px;
    }

    #currencyRatesTiered tbody td.second,
    #currencyRatesTiered tbody td.third,
    #currencyRatesTiered tbody td.fourth {
        font-size: 18px;
        border-left: 1px solid #d8d8d8;
    }

    #currencyRatesTiered tbody td .mobile-title {
        display: none;
    }

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

    /* Tiered Currency Rates Table - BUREAU */
    #currencyRatesTieredBureau thead {
        background: #F3F1EC;
        border-bottom: 1px solid #d8d8d8;
    }

    #currencyRatesTieredBureau thead th.middle3Cols {
        padding: 10px 0px;
        border-left: 1px solid #d8d8d8;
        border-bottom: 1px solid #d8d8d8;
    }

    #currencyRatesTieredBureau thead th.fifth {
        padding-left: 30px;
        padding-right: 30px;
    }

    #currencyRatesTieredBureau thead th.middle3Cols,
    #currencyRatesTieredBureau thead th.fifth {
        text-align: center;
        font-weight: 300;
    }

    #currencyRatesTieredBureau thead th.middle3Cols .bold,
    #currencyRatesTieredBureau thead th.fifth .bold {
        font-weight: 700;
    }

    #currencyRatesTieredBureau thead th.middle3Cols div,
    #currencyRatesTieredBureau thead th.fifth div {
        display: inline-block;
        text-align: left;
        width: fit-content;
    }

    #currencyRatesTieredBureau thead th.second,
    #currencyRatesTieredBureau thead th.third,
    #currencyRatesTieredBureau thead th.fourth,
    #currencyRatesTieredBureau thead th.fifth {
        border-left: 1px solid #d8d8d8;
    }

    #currencyRatesTieredBureau thead th,
    #currencyRatesTieredBureau tbody td {
        font-size: 18px;
        line-height: 23px;
        letter-spacing: 0.5px;
        text-align: center;
        vertical-align: middle;
    }

    #currencyRatesTieredBureau thead th.first,
    #currencyRatesTieredBureau tbody td.first {
        width: 36%;
        text-align: left;
    }

    #currencyRatesTieredBureau thead th.first {
        font-weight: 400;
    }

    #currencyRatesTieredBureau thead th.second,
    #currencyRatesTieredBureau thead th.third,
    #currencyRatesTieredBureau thead th.fourth,
    #currencyRatesTieredBureau thead th.fifth,
    #currencyRatesTieredBureau tbody td.second,
    #currencyRatesTieredBureau tbody td.third,
    #currencyRatesTieredBureau tbody td.fourth,
    #currencyRatesTieredBureau tbody td.fifth {
        width: 16%;
        padding: 10px 0px;
    }

    #currencyRatesTieredBureau tbody td.second,
    #currencyRatesTieredBureau tbody td.third,
    #currencyRatesTieredBureau tbody td.fourth,
    #currencyRatesTieredBureau tbody td.fifth {
        padding: 13px 0px;
        border-left: 1px solid #d8d8d8;
    }

    #currencyRatesTieredBureau tbody td.fifth {
        background: #F3F3F3;
    }

    #currencyRatesTieredBureau tbody td .mobile-col-1,
    #currencyRatesTieredBureau tbody td .mobile-col-2,
    #currencyRatesTieredBureau tbody td .mobile-col-1-2,
    #currencyRatesTieredBureau tbody hr.mobile-hr {
        display: none;
    }

}

@media (max-width: 479px) {

    /* Tiered Currency Rates Table - ONLINE */
    #currencyRatesTiered.responsive-table {
        background:#fff;
        border: none;
    }

    #currencyRatesTiered.responsive-table thead {
        display: none;
    }

    #currencyRatesTiered.responsive-table tbody tr {
        min-height: 105px;
        background: #f3f1ed;
        padding: 0 10px 10px;
    }

    #currencyRatesTiered.responsive-table tbody tr td {
        vertical-align: inherit;
        border: none;
    }

    #currencyRatesTiered.responsive-table tr td.first:before,
    #currencyRatesTiered.responsive-table tr td.second:before,
    #currencyRatesTiered.responsive-table tr td.third:before,
    #currencyRatesTiered.responsive-table tr td.fourth:before {
        content: "";
    }

    #currencyRatesTiered.responsive-table tr td:nth-child(2),
    #currencyRatesTiered.responsive-table tr td:nth-child(3),
    #currencyRatesTiered.responsive-table tr td:nth-child(4) {
        padding: 6px 0 0 0px;
    }

    #currencyRatesTiered.responsive-table tr td.first{
        border-bottom: 1px solid #d8d8d8;
        padding: 8px 0;
        font-size: 16px;
    }

    .exchange-rates-table #currencyRatesTiered i{
        margin-top: 3px;
        margin-right: 10px;
    }

    /*Outer Flexbox*/
    #currencyRatesTiered.responsive-table tbody tr td.second,
    #currencyRatesTiered.responsive-table tbody tr td.third,
    #currencyRatesTiered.responsive-table tbody tr td.fourth {
        display: flex;
        flex-flow: row;
        align-content: flex-start;
    }

    /*Inner Flexbox*/
    #currencyRatesTiered.responsive-table tbody tr td .mobile-title {
        display: flex;
        flex-direction: row;
        flex: 1;
        min-width: 155px !important;

    }

    #currencyRatesTiered.responsive-table tbody tr td .mobile-title .mobile-title-1 {
        font-weight: 200;
        padding-right: 3px;
        flex-grow: 0;
    }

    #currencyRatesTiered.responsive-table tbody tr td .mobile-title .mobile-title-2 {
        font-weight: 700;
        flex-grow: 0;
    }

    #currencyRatesTiered.responsive-table tbody tr td .mobile-title .mobile-title-3 {
        width: fit-content;
        vertical-align: middle;
        flex-grow: 1;
    }

    #currencyRatesTiered.responsive-table tbody tr td .mobile-rate {
        flex: 1;
    }

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

    /* Tiered Currency Rates Table - BUREAU */
    #currencyRatesTieredBureau.responsive-table {
        background:#fff;
        border: none;

        border-collapse: collapse;
    }

    #currencyRatesTieredBureau.responsive-table thead {
        display: none;
    }

    #currencyRatesTieredBureau.responsive-table tbody tr {
        min-height: 105px;
        background: #f3f1ed;
        /*padding: 0 10px 10px;*/
        padding: 0px 0px 0px;
    }

    #currencyRatesTieredBureau.responsive-table tbody tr td {
        vertical-align: inherit;
        border: none;
    }

    #currencyRatesTieredBureau.responsive-table tr td.first:before,
    #currencyRatesTieredBureau.responsive-table tr td.second:before,
    #currencyRatesTieredBureau.responsive-table tr td.third:before,
    #currencyRatesTieredBureau.responsive-table tr td.fourth:before,
    #currencyRatesTieredBureau.responsive-table tr td.fifth:before {
        content: "";
    }

    #currencyRatesTieredBureau.responsive-table tr td:nth-child(2),
    #currencyRatesTieredBureau.responsive-table tr td:nth-child(3),
    #currencyRatesTieredBureau.responsive-table tr td:nth-child(4),
    #currencyRatesTieredBureau.responsive-table tr td:nth-child(5) {
        padding: 6px 0 0 0px;
    }

    #currencyRatesTieredBureau.responsive-table tr td.first {
        border-bottom: 1px solid #d8d8d8;
        padding: 8px 0;
        font-size: 16px;
        border-left: 10px solid #f3f1ed;
        border-right: 10px solid #f3f1ed;
    }

    #currencyRatesTieredBureau.responsive-table tr td.second {
        border-left: 10px solid #f3f1ed;
        border-right: 10px solid #f3f1ed;
        padding: 10px 0px 3px 0px !important;
    }

    #currencyRatesTieredBureau.responsive-table tbody tr td.third {
        padding: 3px 10px;
    }

    #currencyRatesTieredBureau.responsive-table tbody tr td.fourth {
        padding: 3px 10px 10px 10px;
    }

    #currencyRatesTieredBureau.responsive-table tbody tr td.fifth {
        padding: 10px 10px;
    }

    .exchange-rates-table #currencyRatesTieredBureau i{
        margin-top: 3px;
        margin-right: 10px;
    }

    /*Outer Flexbox*/
    #currencyRatesTieredBureau.responsive-table tbody tr td.second,
    #currencyRatesTieredBureau.responsive-table tbody tr td.third,
    #currencyRatesTieredBureau.responsive-table tbody tr td.fourth,
    #currencyRatesTieredBureau.responsive-table tbody tr td.fifth {
        display: flex;
        flex-flow: row;
        align-content: flex-start;
    }

    #currencyRatesTieredBureau.responsive-table tbody tr td.fifth {
        border-top: 1px solid #D8D8D8;
        background: #F3F3F3;
    }

    #currencyRatesTieredBureau.responsive-table tbody tr td .mobile-col-1,
    #currencyRatesTieredBureau.responsive-table tbody tr td .mobile-col-2 {
        flex: 1;
    }

    /*Inner Flexbox*/
    #currencyRatesTieredBureau.responsive-table tbody tr td .mobile-col-1 {
        display: flex;
        flex-direction: row;
        flex: 1;
        max-width: 140px !important;
    }

    #currencyRatesTieredBureau.responsive-table tbody tr td .mobile-col-2 {
        flex: 1;
        font-weight: 400;
        max-width: 95px !important;
    }

    /*Inner Flexbox*/
    #currencyRatesTieredBureau.responsive-table tbody tr td .mobile-col-1-2 {
        display: flex;
        flex-direction: row;
        flex: 1;
        max-width: 235px !important;
    }

    #currencyRatesTieredBureau.responsive-table tbody tr td .mobile-col-1 .mobile-sell-title-1,
    #currencyRatesTieredBureau.responsive-table tbody tr td .mobile-col-1 .mobile-sell-title-2,
    #currencyRatesTieredBureau.responsive-table tbody tr td .mobile-col-1 .mobile-sell-title-3,
    #currencyRatesTieredBureau.responsive-table tbody tr td .mobile-col-1-2 .mobile-buy-title-1,
    #currencyRatesTieredBureau.responsive-table tbody tr td .mobile-col-1-2 .mobile-buy-title-2,
    #currencyRatesTieredBureau.responsive-table tbody tr td .mobile-col-1-2 .mobile-buy-title-3 {
        flex: 0;
        padding-right: 3px;
        font-weight: 300;
    }

    #currencyRatesTieredBureau.responsive-table tbody tr td .mobile-col-1 .mobile-sell-title-2.bold,
    #currencyRatesTieredBureau.responsive-table tbody tr td .mobile-col-1-2 .mobile-buy-title-2.bold {
        font-weight: 700;
    }

    #currencyRatesTieredBureau.responsive-table tbody tr td .mobile-col-1 .spacing,
    #currencyRatesTieredBureau.responsive-table tbody tr td .mobile-col-1-2 .spacing  {
        width: fit-content;
        vertical-align: middle;
        flex-grow: 1;
    }


}

/*currency rates component end*/
/** REWARD CALC CSS **/

#rewardsCalc > div {
	display: block;
	clear: both;
}

#rewardsCalc p{
	color: #000000; 
}

.calc-row {
	padding: 25px 20px;
}

#calcTitle {
	margin-bottom: 0px;
	padding-bottom: 35px;
}

.calc-row {
    font-size: 30px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    padding: 25px 20px;
    margin-bottom: 0px;
    font-weight: 200;
    line-height: 34px;
    color:  #000000 ;
}
.first-row {
	border-bottom: 1px solid #d8d8d8;
	padding-right: 20px;
	padding-top: 30px;
	padding-bottom: 15px;
	color:  #000000 ;
}

#rewardsCalc .first-row input[type=text], 
#rewardsCalc .first-row input[type="text"]:disabled {
	font-size: 30px;
}

#rewardsCalc .first-row span.currency {
	font-size: 30px;
	margin-top: 5px;
}

span.currency {
	text-align: right;
	font-size: 20px;
	font-weight: 200;
	font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
	color: #000000;
}

#rewardsCalc input[type=text], 
#rewardsCalc input[type="text"]:disabled {
	border: none;
	display: none;
	visibility: hidden;
	background: #fff;
	font-size: 24px;
	font-weight: 200;
	float: right;
	padding: 0px;
	text-align: right;
	height: auto;
	font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
	margin-bottom: 0px;;
    position: relative;
    top: 0px;
    max-width: 55px;
    box-shadow: none;
    opacity: 1;
    -webkit-text-fill-color: rgba(95, 95, 95, 1);/* IOS Fix for disabled input*/
    color:  #000000 ;
}

#rewardsCalc .first-row input[type=text], 
#rewardsCalc .first-row input[type="text"]:disabled {
	max-width: 63px;
	margin-top: 5px;
}

#rewardsCalc .ui-slider-horizontal {
	height: 2px;
	display: block;
	clear: both;
}

.row-text {
	font-size: 20px;
	font-weight: 200;
}

.reg-row {
	margin-bottom: 0px;
	font-size:20px;
	text-align: left;
	font-weight: 200;
	padding-bottom: 45px;
	padding: 10px 20px 45px;
	clear: both;
}

.row-wrap {
	margin-bottom: 15px;
	display: block;
	clear: both;
}

#rewardsCalc .ui-slider-range {
	background: yellow;
	margin: 30px 20px 30px ;
	clear: both;
	display: block;
}

#rewardsCalc .annual-calc, 
#rewardsCalc .first-row span.currency,
#rewardsCalc .first-row span.amount-total {
	font-weight: 400 !important;
	margin-top: 5px;
	display: inline-block;
}

#totalBox {
	-webkit-transform: translate3d(0px,0px,0px);
	-moz-transform: translate3d(0px,0px,0px);
	-ms-transform: translate3d(0px,0px,0px);
	transform: translate3d(0px,0px,0px);		
}

#totalBox.fixto-fixed {
	z-index: 99;
	background: white;
	/*position: -webkit-sticky!important;*/
	–webkit-overflow-scrolling: touch;
	
}

#waitroseCalc span.ui-slider-handle, 
#waitroseCalc .ui-state-default, 
#waitroseCalc .ui-corner-all {
	background: url("clientlib/images/calculator/1@2x.png") no-repeat 10px top;
    background-size: contain;
}

#johnLewisCalc span.ui-slider-handle,
#johnLewisCalc .ui-state-default, 
#johnLewisCalc .ui-corner-all {
	background: url("clientlib/images/calculator/2@2x.png") no-repeat 10px top;
	background-size: contain;
}

#otherCalc span.ui-slider-handle,
#otherCalc .ui-state-default, 
#otherCalc .ui-corner-all {
	background: url("clientlib/images/calculator/3@2x.png") no-repeat 10px top;
	background-size: contain;
}

#petrolCalc span.ui-slider-handle,
#petrolCalc .ui-state-default,
#petrolCalc .ui-corner-all {
	background: url("clientlib/images/calculator/4@2x.png") no-repeat 10px top;
    background-size: contain;
}

#diningCalc span.ui-slider-handle, 
#diningCalc .ui-state-default, 
#diningCalc .ui-corner-all {
	background: url("clientlib/images/calculator/5@2x.png") no-repeat 10px top;
	background-size: contain;
}

#holidaysCalc span.ui-slider-handle,
#holidaysCalc .ui-state-default, 
#holidaysCalc .ui-corner-all {
	background: url("clientlib/images/calculator/6@2x.png") no-repeat 10px top;
    background-size: contain;
}

#rewardsCalc .ui-state-default, 
#rewardsCalc .ui-widget-content .ui-state-default {
	border: none;
	outline: none;
}

#rewardsCalc .ui-widget-content{
	border: 1px solid #ddd;    
    color: #000000;
}

#rewardsCalc .ui-slider-horizontal .ui-slider-handle {
	top: -.70em;
}

#waitroseCalc .ui-slider-horizontal .ui-slider-range-min {
	margin: 0px !important;
	background: #a3b8ba !important;
	height: 2px;
	opacity: 0.6;
}

#johnLewisCalc .ui-slider-horizontal .ui-slider-range-min {
	margin: 0px !important;
	background: #7496ae !important;
	height: 2px;
	opacity: 0.6;
}

#otherCalc .ui-slider-horizontal .ui-slider-range-min {
	margin: 0px !important;
	background: #88c089 !important;
	height: 2px;
	opacity: 0.6;
}

#petrolCalc .ui-slider-horizontal .ui-slider-range-min {
	margin: 0px !important;
	background: #73ab7e !important;
	height: 2px;
	opacity: 0.6;
}

#diningCalc .ui-slider-horizontal .ui-slider-range-min {
	margin: 0px !important;
	background: #edd06e !important;
	height: 2px;
	opacity: 0.6;
}

#holidaysCalc .ui-slider-horizontal .ui-slider-range-min {
	margin: 0px !important;
	background: #f5ac7e !important;
	height: 2px;
}

/* Mobile media query */
@media only screen and (min-width : 320px) and (max-width : 480px) {
	
	#calcTitle {
		padding-bottom: 0px;
	}
	.first-row, .row-text {
		font-size: 22px;
	}
	.calc-row {
		padding: 0 0 40px 0px;
	}
	#rewardsCalc span.currency,
	#rewardsCalc span.amount {
		font-size: 17px;
	}
	#rewardsCalc input[type=text], 
	#rewardsCalc input[type="text"]:disabled {
		background: transparent;
		font-size: 17px;
		max-width: 40px;
	}
	#rewardsCalc .first-row input[type=text],
	#rewardsCalc .first-row input[type="text"]:disabled  {
		margin-top: 0;
		font-size: 22px;
		max-width: 40px;
	}
	#rewardsCalc .first-row span.currency {
	    font-size: 22px;
	    margin-top: 0;
	}
	#rewardsCalc .row-wrap {
		margin-bottom: 15px;
	}

	#rewardsCalc span.ui-slider-handle, .ui-state-default, .ui-corner-all {
		background-position: 10px top;
    	margin-right: 10px;
	}

	/* FIx for iOS Devices to be abe to use the slider easier */
	#rewardsCalc .ui-slider .ui-slider-handle{
	    padding: 0 25px;
	    display: block;
	}
	#rewardsCalc .ui-slider {
		margin: 0 10px;
	}
	#rewardsCalc .first-row p {
		font-size: 22px;
		margin-bottom: 0px;
	}
	#rewardsCalc .calc-row {
		padding: 30px 0 15px;
	}
	#rewardsCalc .first-row {
		padding-bottom: 15px;
	}
	#rewardsCalc .cta {
		display: block;
		margin-top: 40px;
	}
	#rewardsCalc .row-text p {
		margin-bottom: 0px;
		margin-top: 5px;
		font-size: 17px;
	}
}

/* Tablet media query */
@media only screen and (min-width : 481px) and (max-width : 768px)  {
	#calcTitle {
		padding-bottom: 0px;
	}

	.first-row, .row-text {
		font-size: 32px;
	}
	.calc-row {
		padding: 0 0 40px 0px;
	}
	#rewardsCalc input[type=text] {
		background: transparent;
		font-size: 22px;
		max-width: 52px;
	}
	#rewardsCalc .first-row input[type=text] {
		top: 0px;
		font-size: 32px;
	}
	#rewardsCalc .row-wrap {
		margin-bottom: 20px;
	}
	#rewardsCalc .row-cost input[type=text] {
		top: 0;
		position: relative;
	}
	#rewardsCalc .row-cost span.currency,
	#rewardsCalc .row-cost span.amount {
		font-size: 22px;
		position: relative; 
	}
	#rewardsCalc span.ui-slider-handle,
	#rewardsCalc .ui-state-default,
	#rewardsCalc .ui-corner-all {
		background-position: 10px top;
    	margin-right: 10px;
	}
	#rewardsCalc .ui-slider {
		margin: 0 10px;
	}
	#rewardsCalc .first-row p {
		font-size: 32px;
		margin-bottom: 0px;
	}
	#rewardsCalc .calc-row {
		padding: 30px 0 15px;
	}
	#rewardsCalc .first-row {
		padding-bottom: 25px;
	}
	#rewardsCalc .first-row  span.currency  {
		font-size: 32px;
	}
	#rewardsCalc .cta {
		display: block;
		margin-top: 40px;
	}
	#rewardsCalc .row-text p {
		margin-bottom: 0px;
		font-size: 22px;
	}
}

/** REWARD CALC CSS END **/
/** Concertina CSS **/

#accordion {
    margin:0 0 0px 0;
}
#accordion .panel-default .panel-heading {
    background: #fff;
    padding: 20px 10px;
    position: relative;
}
.panel-heading {
    overflow: hidden;
    width: 100%;
}
.panel-heading .text {
    float: left;
    width: 90%;
    display: inline-block;
}
.panel-heading .icon {
    float: right;
    display: inline-block;
    position: absolute;
    right: 10px;
    top: 50%; /* to fix the concentrina temporary fix */
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}
.panel-heading .icon .glyphicon {
    font-size: 40px;
    color: #000000;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;  
    font-weight: 200;
}
#accordion .panel-heading p {
    margin: 0;
    font-size: 20px;
    line-height: 28px;
    text-align: left;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;  
    color: #000000;
    font-weight:500;
}

#accordion .panel-heading a,
#accordion .panel-heading a:hover,
#accordion .panel-heading a:focus {
   color: #000000 !important;
   text-decoration: none;
}

#accordion a:hover,
#accordion a:active,
#accordion a:focus:hover {
    text-decoration: none; 
}

#accordion .panel.first .panel-heading {
   border-top: 0;
}

#accordion .panel{
  box-shadow: none;
}


#accordion .panel-heading {
  border: none;
  border-bottom: 1px solid #d8d8d8;
}

#accordion .collapse{
  border: none;
}

#accordion .collapse.in{
  border-bottom: 1px solid #d8d8d8;
}

#accordion .panel-body {
  padding: 20px 10px 20px 10px !important;
  margin-bottom: 0;
   
}

#accordion .panel.last .panel-body {
   border-top: 0;
}

/** Concertina CSS END **/
/*related search component start*/

/* Change default bootstrap col-sm-4 brean point to 769 from 768*/

@media (max-width: 768px){
    .related-search .col-sm-4 {
        width: 100%;
    }
}
@media (min-width: 769px){
    .related-search .col-sm-4 {
        width: 33.33333333%;
    }
}

.related-search{
    padding: 30px 15px;
}

.row-eq-height {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display:         flex;
  flex-flow: row wrap;  
  align-items: stretch;
}

.row-eq-height>div{
   /* align-self: stretch;*/
}

.thumbnail{
    padding: 0;
    border-radius: o;
    background-color: transparent;
    -webkit-transition: none;
    transition: none;
    border: 1px solid #dedbd2;
    border-style: none none solid none;
}

.thumbnail img{
    margin-bottom: 20px;
}

.thumbnail .caption{
    padding: 0;
    font-size: 16px;
}

.thumbnail .caption .title{
    font-family: 'GillSansforJL';
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 10px;

}

.thumbnail .caption .title .title-link,
.thumbnail .caption .title .title-link:hover,
.thumbnail .caption .title .title-link:focus,
.thumbnail .caption .title .title-link:active,
.thumbnail .caption .title .title-link:visited{
    text-decoration: none;
    font-family: 'GillSansforJL';
    font-size: 20px !important;
    line-height: 24px;
    color: #000000;
}

.thumbnail .caption .title .title-link:hover,
.thumbnail .caption .title .title-link:focus,
.thumbnail .caption .title .title-link:active{
    color: #000000;
}



.thumbnail .caption .title .title-link:after{
    font-family: "jl-icon";
    content: "";
    font-style: normal;
    font-weight: normal;
    speak: none;
    font-size: 11px;
    padding-left: 10px;
    /*color: #fff;*/
    position: relative;
    top: -2px;
    text-decoration: none;
}
}

.thumbnail .caption .caption-text{
    font-size: 16px;
    line-height: 22.4px; 
    margin-bottom: 10px;
}

.thumbnail .caption .article-rating{
    margin-bottom: 20px;
}

.thumbnail .caption .article-rating .icon-stars_10{
    font-size: 12px;
    margin: 0;
    display: block;
    float: left;
}

.thumbnail .caption .article-rating .icon-stars_10:before{
    color: #b4b2ae;
    margin: 0;
}

.thumbnail .caption .article-rating.star-1 > i:nth-child(1):before,
.thumbnail .caption .article-rating.star-2 > i:nth-child(1):before,
.thumbnail .caption .article-rating.star-2 > i:nth-child(2):before,
.thumbnail .caption .article-rating.star-3 > i:nth-child(1):before,
.thumbnail .caption .article-rating.star-3 > i:nth-child(2):before,
.thumbnail .caption .article-rating.star-3 > i:nth-child(3):before,
.thumbnail .caption .article-rating.star-4 > i:nth-child(1):before,
.thumbnail .caption .article-rating.star-4 > i:nth-child(2):before,
.thumbnail .caption .article-rating.star-4 > i:nth-child(3):before,
.thumbnail .caption .article-rating.star-4 > i:nth-child(4):before,
.thumbnail .caption .article-rating.star-5 .icon-stars_10:before{
    color: #000000;
}

/*related search component end*/


/** Styles from Adobe Summit **/

/** HTML **/
hr {
  border-width: 0 0 1px 0;
  color: #f0f0f0;
}
input {
  outline: none;
}
a {
  color: #333333;
  text-decoration: none;
}
a:hover,
a:active {
  color: #000000;
  text-decoration: underline;
}
/** Page Structure **/
.header .component {
  height: 90px;
  border: dashed 1px #ccc;
  border-radius: 2px;
  padding: .5rem;
  -webkit-box-sizing: border-box;
  /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;
  /* Firefox, other Gecko */
  box-sizing: border-box;
  /* Opera/IE 8+ */
}
.header .component .logo {
  border: 0.83333333rem solid #ff453a;
  border-radius: 3.33333333rem;
  height: 2.5rem;
  width: 2.5rem;
  /* Structure */
  float: left;
  margin-left: 10px;
}
.footer .component {
  border: dashed 1px #ccc;
  border-radius: 2px;
  padding: .5rem;
  -webkit-box-sizing: border-box;
  /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;
  /* Firefox, other Gecko */
  box-sizing: border-box;
  /* Opera/IE 8+ */
  /* Structure */
}
.footer .component * {
  color: #ccc;
  font-size: .9rem;
  font-weight: normal;
}
.footer .component ul,
.footer .component li {
  list-style: none;
  margin: 0;
  padding: 0;
}
.footer .component ul li,
.footer .component li li {
  display: inline;
}

.search-facets {
  margin-bottom: 1rem;
  margin-top: 1rem;
  border: 1px solid #cacaca;
  min-height: 28px;
}
.search-facets dl {
  margin: 0;
  padding: 0;
  list-style: none;
  margin-bottom: 1rem;
}
.search-facets dl dt {
  margin: 1rem 0 .75rem 0;
  font-weight: bold;
}
.search-facets dl dd {
  margin: 0 .5rem 0 0;
  padding: 0;
  display: inline-block;
}
.search-facets button.search-facet-toggle {
  float: right;
  background: none;
  border: none;
}
.search-facets .coral-Icon--accordionDown {
  display: block;
}
.search-facets .coral-Icon--accordionUp {
  display: none;
}
.search-facets .search-facets--content {
  padding: 5px;
}
.search-facets input[type=checkbox] {
  display: none;
}
.search-facets label {
  border: solid 1px #999999;
  color: #999999;
  padding: .25rem .5rem;
  font-size: .9rem;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.search-facets input[type=checkbox]:checked + label {
  color: #000000;
  border-color: #000000;
}
.search-facets.open .coral-Icon--accordionDown {
  display: none;
}
.search-facets.open .coral-Icon--accordionUp {
  display: block;
}

.search-field {
  position: relative;
  width: 100%;
  /* Search Field - -Autocomplete */
}
.search-field .search-field--wrapper {
  position: relative;
}
.search-field .search-field--wrapper input[type="text"] {
  border: solid 1px #cacaca;
  font-size: 2rem;
  padding: 1rem 5rem 1rem 1rem;
  width: 100%;
  -webkit-box-sizing: border-box;
  /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;
  /* Firefox, other Gecko */
  box-sizing: border-box;
  /* Opera/IE 8+ */
}
.search-field .search-field--wrapper input[type="submit"] {
  position: absolute;
  top: .25rem;
  right: .25rem;
  padding: 0.75rem;
  border: 0;
  border-radius: 4px;
  background-color: #000000;
  color: white;
  font-size: 2rem;
  width: 4rem;
}
.search-field .quick-lists {
  background-color: #ffffff;
  border: solid 1px #cacaca;
  border-top-style: dashed;
  display: none;
  left: 0;
  margin-top: 42px;
  position: absolute;
  z-index:900;
  background:#fff;
  width: 100%;
  -webkit-box-sizing: border-box;
  /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;
  /* Firefox, other Gecko */
  box-sizing: border-box;
  /* Opera/IE 8+ */
}
.search-field .quick-lists dl,
.search-field .quick-lists dt,
.search-field .quick-lists dd {
  list-style: none;
  margin: 0;
  padding: 0;
}
.search-field .quick-lists a {
  padding: 1rem;
  text-decoration: none;
  display: block;
}
.search-field .quick-lists a:hover {
  background-color: #f0f0f0;
}
.search-field .quick-lists .quick-suggestions,
.search-field .quick-lists .quick-results {
  display: none;
}
.search-field .quick-lists .quick-suggestions dt,
.search-field .quick-lists .quick-results dt {
  padding: 1rem 0 .5rem 1rem;
  margin: 0;
  font-size: 1.1rem;
  font-weight: bold;
  font-style: italic;
}
.search-field .quick-lists .quick-suggestions {
  background-color: #f0f0f0;
  font-size: 1em;
  padding-bottom: 1rem;
}
.search-field .quick-lists .quick-suggestions dd {
  padding: .4rem 1rem;
  font-style: italic;
  cursor: pointer;
}
.search-field .quick-lists .quick-results a {
  padding: 1rem;
  text-decoration: none;
  display: block;
}
.search-field .quick-lists .quick-results a:hover {
  background-color: #f0f0f0;
}

.search-results ul,
.search-results li {
  list-style: none;
  padding: 0;
  margin: 0;
}
.search-results .search-stats {
  font-size: .9rem;
  float: right;
  font-style: normal;
  padding-right: .5rem;
}
.search-results li {
  border-bottom: solid 1px #ccc;
  clear: both;
}
.search-results li .info {
  overflow-wrap: break-word;
  word-wrap: break-word;
  -ms-word-break: break-all;
  word-break: break-word;
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;
  font-size: 1em;
  line-height: 1.5rem;
}
.search-results li .info h3 {
  font-size: 1.2em;
  font-weight: normal;
  margin: .75rem 0 .5rem 0;
  padding-top: .25rem;
}
.search-results li .info p {
  margin-top: 0;
  line-height: 1.5em;
}
.search-results li .info p strong {
  color: #000000;
}
.search-results li.thumbnail {
  padding-bottom: .75rem;
}
.search-results li.thumbnail .info {
  margin-left: 120px;
}
.search-results li.thumbnail .thumbnail {
  float: left;
  width: 100px;
  border: solid 1px #cacaca;
  border-radius: 2px;
  text-align: center;
  padding: 1rem 0;
}
.search-results li.thumbnail .thumbnail a {
  color: #808080;
}
.search-results li.thumbnail .thumbnail a:hover {
  color: #000000;
}

.search-pagination {
  margin: 1rem auto;
}
.search-pagination ul {
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: center;
}
.search-pagination ul li {
  margin: 0 .5rem 0 0;
  padding: 0;
  display: inline-block;
}
.search-pagination input[type=radio] {
  display: none;
}
.search-pagination label {
  border: solid 1px #999999;
  color: #999999;
  padding: .25rem .5rem;
  font-size: .9rem;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.search-pagination input[type=radio]:checked + label {
  color: #000000;
  border-color: #000000;
}

.display-content--main {
  float: left;
  width: 100%;
  padding: 20px;
}
.display-content--main h1 {
  color: #333333;
  border-bottom: 1px solid;
  border-color: #808080;
}
.display-content--body {
  float: left;
  width: 70%;
}
.display-content--similar {
  border: dashed 1px #ccc;
  font-size: .8rem;
  padding: 10px;
  margin: 5px;
  padding-top: 5px;
  float: left;
  width: 25%;
}
.display-content--similar ul {
  margin: 0;
  padding: 0;
  padding-left: 1rem;
}
.display-content--similar ul li {
  margin: 0 .5rem 0 0;
  padding: 0;
}
.display-content--similar ul li a {
  color: #000000;
}






/** Additional handcrafted styles **/

.search-form .input-group-search{
	padding: 20px 0; 
	margin: 0; 
/*	max-width: 65%; */
	max-width: 100%; 
	margin: 0 auto;
}


.search-form .input-group-search .btn-search {
    padding: 11px;
    background-color: #000000;
    color: #ffffff;
    border: 1px solid #b4b2ae;
    border-style: solid solid solid none;
    border-radius: 2px;
    margin: -1px 0 0 0px;

}


.search-form h3 {
	line-height: 2em;
    }        

.search-form h4 {
	line-height: 1.5em;
    }    
/* Search component CSS Start */
.header .search a {
	float: left;
	margin-top: 6px;
	color: #000000;
}

.header .search a:hover,
.header .search a:focus,
.header .search a.active {
	text-decoration: none;
	color: #000000;
}

.header .search .dropdown{
	min-height: 51px; /*fixes 1 pixel jump*/
}

.header .search .wrapper a.search-trigger{
	padding: 10px 15px;
	border: 1px solid transparent;
}

.header .search a .search-text {
	font-size: 14px;
	font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
        font-weight: 200;
}

.header .search-panel {
	background-color: #F9F8F6; 
	clear: both; 
	text-align: center;
    height: 0;
/*    visibility: hidden; */
    transition: all 0.3s ease;
/*   opacity: 0; */
    margin-bottom: 0;
/*   overflow: hidden; */
}

.header .search-panel.visible {
    height: 75px;
    visibility: visible;
    transition: all 0.3s ease;
    opacity: 1;
    margin-top: 25px;
}
.header .input-group-search{
	padding: 20px 0; 
	margin: 0; 
	max-width: 65%; 
	margin: 0 auto;
}
.header .input-group-search .btn-search{
	padding: 6px;
	background-color: #000000;
	color: #ffffff;
	border: 1px solid #b4b2ae;
	border-style: solid solid solid none; 
	border-radius: 2px;
}

.header .input-group-search .btn-search.disabled-btn {
    background-color: #e6e3de;
    border: 1px solid #b4b2ae;
    cursor: not-allowed;
}

.header .input-group-search .btn-search .icon-search{
    font-size: 20px;
    margin: 0;
    padding: 0;
    width: 26px;
    margin-right: 0;
    display: block;
}

.header .form-control.text{
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    padding-left: 10px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    font-size: 16px;
    line-height: 22.4px;
    color: #000000;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border:1px solid #b4b2ae;
    border-style: solid none solid solid;
}
.header .form-control.text:focus {
    outline: none;
    border-color: #d8d8d8; 
    -webkit-box-shadow: none;
    box-shadow: none;

}

@media only screen and (min-width : 320px) and (max-width : 768px)  {
 	.header .top-row ul li.search{
		margin: 2px 10px 0 0;
		float: left;
	}
	.header .input-group-search{
		max-width: 100%; 
	}

	.header .top-row .search .blk {
		display: block;
	}

	.header .search .wrapper a.search-trigger {
		padding: 0;
		display: block;
	}
	.header .icon-search{
		display: block;
		margin: 1px auto 5px auto;
		font-size: 14px;
		line-height: 1em;
	}
	.header .icon-search:before{
		margin: 0;
	}
	.header .search a .search-text{
		display: block;
		clear: both;
		font-size: 10px;
		line-height: 1em;
	}
}

/* Search component CSS End */
/* component - popup start */
/* alignment */
.align-center {
    text-align: center;
}

.align-left {
    text-align: left;
}

.align-right {
    text-align: right;
}

.off {
  position:absolute;
  left:-10000px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden;
} /* adding class for modal on resize window */

.popup.modal {
  z-index: 7000;
}

.modal.fade:not(.in).top .modal-dialog {
  -webkit-transform: translate3d(0, -25%, 0);
  transform: translate3d(0, -25%, 0);
}

body.modal-open .modal-backdrop.fade.in {
  z-index: 1040;
}

body.modal-open .modal-backdrop.in {
  opacity: .85;
}

body.modal-open #totalBox.fixto-fixed {
  position: static !important;
}

.popup .modal-content {
  background-color: #ffffff;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  -o-border-radius: 0px;
  border-radius: 0px;
  width: inherit;
  height: inherit;
  margin: 0 auto;
  pointer-events: all;
  border: 0px;
  padding: 30px 10px 30px 30px;
}

.popup .vertical-alignment-helper {
  display: table;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.popup .vertical-align-center {
  display: table-cell;
  vertical-align: middle;
  pointer-events: none;
}
    
.popup .modal-title {
  font-size: 24px;
  line-height: 28.8px;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 200; /* changed to 200 as per design requirement*/
  padding-bottom: 10px;
  margin-bottom: 20px;
  color: #000000;
  border-bottom: 1px solid #d8d8d8;
}

.popup .close {
  color: #000000;
  opacity: 1;
  position: relative;
  top: -10px;
  right: 4px;
}

.popup .icon-close {
  display: inline-block;
  position: relative;
  margin: 0px;
}

.padding-reset {
  padding: 0;
}

.modal-link .set-font-icon {
  font-size: 12px;
}

.modal-link {
  text-align: center;
}

.terms-list {
  width: 100%;
  margin: 0;
}

.terms-list p {
  padding: 0 10px 0 0;
}

.popup .row.row {
  margin: 0 !important;
}

.row.terms-list {
  height: 330px;
  margin-top:30px;
}

.row.close-wrapper {
  padding-right: 10px;
}


/* LINK STYLES */
 .popup-link {
  display: inline-block;
  color: #000000;
}

.popup-link:hover, 
.popup-link:active {
  text-decoration: underline;
  color: #000000;
}

.popup-link:visited {
  color: #000000;
  text-transform: none;
  text-decoration: underline;
}


.popup-link:hover,
.popup-link:active {
  cursor: pointer;
}

.popup-link span {
  display: inline-block;
  text-decoration: none;
}

.popup-link:hover span,
.popup-link:active span,
.popup-link:visited span {
  display: inline-block;
  text-decoration: underline;
}

.popup-link span.link-with-chevron:after {
  display: inline-block;
  text-decoration: none;
}

.link-with-chevron:after {
  font-family: "jl-icon";
  content: "";
  font-style: normal;
  font-weight: normal;
  speak: none;
  font-size: 12px;
  padding-left: 6px;
  color: #000000;
  position: relative;
  top: -1px;
}

/* BUTTON STYLES */

.popup-btn {
  display: inline-block;
  margin-bottom: 16px;
  height: 49px;
  padding: 11px 50px;
  font-family:'GillSansforJL';
  font-weight: 400;	/*font-weight for Gill Sans Nova for JL Medium*/
  font-size: 18px;
  text-decoration: none;
  border:0px;
  /*white-space: nowrap;*/
}

/*
.popup-btn span:after {
  font-family: "jl-icon";
  content: "";
  font-style: normal;
  font-weight: normal;
  speak: none;
  font-size: 11px;
  padding-left: 10px;
  position: relative;
  top: -2px;
}
*/

.popup-btn.primary {
  background: #000000;
  color: #ffffff;
  font-weight: 400;	/*font-weight for Gill Sans Nova for JL Medium*/
  transition: background 0.2s;
  transition-timing-function: ease-in;
}
.popup-btn.secondary {
  background: transparent;
  color: #000000;
  font-weight: 400;	/*font-weight for Gill Sans Nova for JL Medium*/
  border: 2px;
  border-style: solid;
  border-color: #000000;
  transition: background 0.2s;
  transition-timing-function: ease-in;
}
.popup-btn.tertiary {
  background: transparent;
  color: #ffffff;
  font-weight: 400;	/*font-weight for Gill Sans Nova for JL Medium*/
  border: 2px;
  border-style: solid;
  border-color: #ffffff;
  transition: background 0.2s;
  transition-timing-function: ease-in;
}

.popup-btn.primary:hover {
  background: #6b6b6b;
  text-decoration: none;
}
.popup-btn.secondary:hover {
  color: #6b6b6b;
  border-color: #6b6b6b;
  text-decoration: none;
}

.popup-btn.tertiary:hover {
  border-color: #d8d8d8;
  text-decoration: none;
}

.terms-list li a {
  display: block;
  height: auto;
  padding: 14px 0;
  border-bottom: 1px solid #d8d8d8;
  font-size: 16px;
  color: #000000;
  text-decoration: none;
  position: relative;
  transition: .3s text-indent ease;
}

.terms-list li a:hover {
  background: #fff;
  color: #000000;
  text-indent: 10px;
  position: relative;
  z-index: 5004;
}

.terms-list ul {
  list-style-type: none;
}

.modal-link span {
  margin-right: 10px;
}

@media only screen and (min-width : 481px) and (max-width : 768px) {
  
  .popup .modal-title {
    font-size: 22px;
    line-height: 26.4px;
  }

  .icon-close {
    position: relative;
    left: -3px;
  }

  .modal-dialog.dialog-fix {
    width: auto !important;
  }

  .modal-open .modal {
    padding-right: 0px !important;
    margin: 0 30px;
  }

  .row.terms-list{
    height: calc(100vh - 155px);
  }

}

@media only screen and (min-width : 320px) and (max-width : 480px) {
  .popup-btn {
    width: 100%;
    padding: 0;
  }

  .popup .modal-title {
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 20px;
  }

  .popup .close {
    color: #000000;
    opacity: 1;
  }

  .popup .icon-close {
    position: relative;
    margin: 0px; 
    top: 0px;
    left: 0;
  }

  .modal-open .modal {
    padding-right: 0px !important;
    margin: 20px 20px 20px 20px !important;
  }

  .modal-dialog.dialog-fix {
    width: auto !important;
  }

  .row.terms-list{
    height: calc(100vh - 210px);
  }

}

/*popup component end*/


/*store locator component start*/

/** FORM ELEMENT STYLES **/

.checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], .radio input[type=radio], .radio-inline input[type=radio] {
    margin-left: 0 !important; /*need to remove */
}

.store-locator-container form {
    padding:0;
    margin: 0;
}
.store-locator-container .formRow {
    clear: both;
    margin-bottom: 40px; 
}

.store-locator-container .form-title {
    font-size: 30px;
    line-height: 34px;
    font-family: 'GillSansforJL';
    font-weight: 200;
    padding-bottom: 10px;
    margin: 20px 0;
    border-bottom:1px solid #d8d8d8;
}



.store-locator-container .form-hr {
    margin-top: 40px;
    margin-bottom: 40px;
    border: none;
    border-bottom: 1px solid #d8d8d8;
}
.store-locator-container .form-hr-last {
    margin-bottom: 20px !important;
}

.store-locator-container .formRow .row {
    margin-left: -15px;
    margin-right: -15px;
}
.store-locator-container .formRow label {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    font-size:16px;
    line-height: 22.4px;
    color: #000000;
    vertical-align: middle;
    margin-bottom: 10px;
}
.store-locator-container .form-label {
    overflow: hidden;
}


.store-locator-container .form-label .icon a {
    display: inline-block;
    background: #b4b2ae;
    border-radius: 15px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    text-decoration: none;
    cursor: pointer;
}
.store-locator-container .form-label .icon .icon-question-mark {
    font-size: 13px;
    color:#fff;
    width: 18px;
    min-width:1em;
}
.store-locator-container .padding-reset {
    padding-left:0;
    padding-right: 0;
}
/* INPUT ELEMENT */

/* common for all form elements */
.store-locator-container input.text, .store-locator-container select, .store-locator-container textarea {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    padding-left: 10px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    font-size: 16px;
    line-height: 22.4px;
    color: #000000;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border:1px solid #b4b2ae;
}

@-moz-document url-prefix() {
    select {
        -moz-appearance: none;
        text-indent: 0.01px;
        text-overflow: '';
    }
}

.store-locator-container input.text:focus,
.store-locator-container select:focus,
.store-locator-container textarea:focus {
    outline: none;
}
.store-locator-container select::-ms-expand {
    display: none;
}

/** select specific styles **/
.store-locator-container select {
    color: #999999;
}

.store-locator-container .formRow.selectbox{
	margin-bottom: 20px;
}

.store-locator-container .formRow.submit {
    margin: 0;
    text-align: left;
}

/* error and active css */
.store-locator-container input.text.active,
.store-locator-container select.active,
.store-locator-container textarea.active {
    background: #edf7ec;
    border:1px solid #000000;
}

.store-locator-container .formRow .fieldErrorDesc,
.store-locator-container .form_error {
    margin-top: 5px;
}

.store-locator-container .formRow.error label,
.store-locator-container .formRow .fieldErrorDesc {
    color:#cc0000;
}
.store-locator-container .formRow.error input.text,
.store-locator-container .formRow.error textarea,
.store-locator-container .formRow.error select {
    background: #fefafb;
    border:1px solid #cc0000;
}
.store-locator-container .postcode-error {
	display:none;
}
.store-locator-container .postcode-error.fieldErrorDesc {
	color:#cc0000;
}



/* Select styles */
.store-locator-container .select {
    position: relative;
    display: inline-block;
    width: 100%;
    cursor: pointer;
}

.store-locator-container .select-arrow {
    position: absolute;
    top: 5px;
    right: 10px;
    border-left: 1px solid #d8d8d8;
    padding-top: 4px;
    pointer-events:none;
}
.store-locator-container .select-arrow .icon-chveron_down {
    color: #5f5f5f;
}



.store-locator-container .form_error{
    color: #cc0000 ;
}

.store-locator-container .form-btn.reset {
    height: 34px;
    padding: 7px 40px;
    font-size: 16px;
}

/** Buttons **/
.store-locator-container .form-btn {
    display: inline-block;
    margin-bottom: 16px;
    height: 49px;
    font-family:'GillSansforJL';
    font-weight: 400;	/*font-weight for Gill Sans Nova for JL Medium*/
    font-size: 18px;
    text-decoration: none;
    border:0px;
    white-space: nowrap; /* fixing the issue text drop*/

    /*
    color: #fff;
    height: 44px;
    padding: 11px 50px;
    font-size: 18px;
    border:0;
    -webkit-border-radius:2px;
    -moz-border-radius:2px;
    border-radius:2px;
    */
}

.store-locator-container .form-btn.primary {
    background: #000000;
    color: #ffffff;
    font-weight: 700;	
    transition: background 0.2s;
    transition-timing-function: ease-in;
    line-height:23px;
}
.store-locator-container .form-btn.secondary {
    background: transparent;
    color: #000000;
    font-weight: 400;	/*font-weight for Gill Sans Nova for JL Medium*/
    border: 2px;
    border-style: solid;
    border-color: #000000;
    transition: background 0.2s;
    transition-timing-function: ease-in;
}

.store-locator-container .form-btn.primary:hover {
    background: #1DB954;
    text-decoration: none;
}
.store-locator-container .form-btn.secondary:hover {
    color: #6b6b6b;
    border-color: #6b6b6b;
    text-decoration: none;
}


.btn-container .location-btn {
   text-align: center;
   background-color: #000000;
   color:#fff;
   /*padding: 6px 25px 6px 25px;*/
}


.btn-container .location-btn span.location-text{
    display: inline;
    
}

.btn-container .location-btn span.location-img {
    display: inline;
    width: 13px;
    height: 16px;
    margin-right: 5px;
    background: 0 0 no-repeat url("clientlib/images/icons/Loco_Pin_icon.svg");
    padding-left: 20px;
}

.btn-container .location-btn:hover {
    background-color: #1DB954;
}


input.store-locator-input{
	margin-bottom: 20px;
}

.store-locator-container .map-wrapper{
	height: 0; 
	padding-bottom: 75%; 
	position: relative;
}

.store-locator-container .map-wrapper .map{
	position: absolute; 
	width: 100%; 
	height: 100%; 
	top: 0; 
	bottom: 0; 
	left: 0; 
	right: 0;
}

.store-locator-container .fieldErrorDesc{
	display: none;
}

.store-locator-container .fieldErrorDesc.error{
	display: block;
}

.store-locator-container .results-container{
	display: none;
}


.store-locator-container .results-container.in-edit-mode,
.store-locator-container .results-container.show{
	display: block;	
}

.store-locator-container .branch-details {
    padding: 18px 0;
    border-bottom: 1px solid #d8d8d8;
}

.store-locator-container .branch-details.info-window {    
    border-bottom: none;
    padding: 5px 0; 
}

.store-locator-container .division-title{
    color: #000000;
}

.store-locator-container .division-title.johnlewis{
	margin-bottom: 5px;
	/*color: #004827;*/
}

.store-locator-container .division-title.waitrose{
	margin-bottom: 5px;	
    /*color: #5C8018;*/
}

.store-locator-container .title{
	font-size: 16px;
	font-weight: bold;
}

.store-locator-container p{
	font-size: 14px;
	line-height: 1.2em;
	margin-bottom: 0;	
}

.store-locator-container .opening-times{
	margin: 10px 0;
    font-size: 14px;
}
.store-locator-container .opening-times td{
    line-height: 1.2em;
}
.store-locator-container .opening-times td:first-of-type{
	padding-right: 20px;
}

.store-locator-container a.txt-sml:visited{
	color: #000000;
}

.store-locator-container .txt-sml{
	font-size: 12px!important; 
}

.store-locator-container .more-info-link{
	position: relative;

}

/*
.store-locator-container .more-info-link:after{
	font-family: "jl-icon";
    font-style: normal;
    font-weight: normal;
    speak: none;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    *zoom: expression(this.runtimeStyle['zoom'] '1', this.innerHTML '&#xe60e;');
    content: "\e850";
    color: #000000;
    font-size: 11px;
    position: absolute;
    margin-left: 5px; 
    bottom: 0;
    top:2px;    
}
*/

.store-locator-container .more-info-link.collapsed:after{
	transform: rotate(0deg);
	transform-origin: 50% 45%;
    transition: transform 0.3s;
}

.store-locator-container .more-info-link:after{
	transform: rotate(180deg);
    transition: transform 0.3s;
}

.store-locator-container .branch-postcode{
	margin-bottom: 15px;
}

.store-locator-container .show-more-wrapper {
    margin-top: 20px;
}

.store-locator-container button.show-more-link {
    background: none;
    border: none;
    color: #000000;
    padding: 0;
    position: relative;
}

/*
.store-locator-container button.show-more-link:after{
	font-family: "jl-icon";
    font-style: normal;
    font-weight: normal;
    speak: none;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\e850";
    color: #000000;
    font-size: 11px;
    background-color: #000000;
    color: #ffffff;
    padding: 2px 3px;
    margin-left: 10px;
}
*/

.store-locator-container .btn-container .primary-btn{
   text-align: center;
}

.store-locator-container .gm-style .gm-style-cc span, 
.store-locator-container .gm-style .gm-style-cc a, 
.store-locator-container .gm-style .gm-style-mtc div{
    font-size: 10px !important;
    line-height: 1;
}



@media only screen and (min-width : 481px) and (max-width : 768px) {

    .form-title {
        font-size: 22px;
        line-height: 26.4px;
    }

    .formRow.submit {
        margin: 40px 0 20px 0;
    }

}

@media only screen and (min-width : 320px) and (max-width : 480px)  {
    
    .form-title {
        font-size: 22px;
        line-height: 26.4px;
    }

    .form-hr {
        margin-top: 30px;
        margin-bottom: 30px;
    }

    .form-hr-last {
        margin-bottom: 15px !important;
    }


    .form-btn {
        width: 100%;
    }

    .form-element .btn-container .postcode-btn {
        width: auto;
        padding: 6px 12px;
    }

    input.text.post-code {
        width: 50%;
    }
    .formRow.submit {
        margin: 30px 0;
    }
}



@media screen and (min-width: 768px){
	input.store-locator-input{
		margin-bottom: 0;
	}

	
}

@media screen and (min-width: 851px) {
 	
	
}


/*store locator component end*/
/**** TAB NAVIGATION Start ****/

/* DESKTOP */
.tabs-wrapper .nav-tabs.nav-justified>li>a {
  background: #e6e3de;
  border:none;
  border-left: 1px solid #d8d8d8;
}

.tabs-wrapper .nav-tabs.nav-justified>li:first-child a {
	border-left: none;
}

.tabs-wrapper .nav-tabs.nav-justified>li>a {
  color:#717171;
  border: none;
  border-radius: 0 !important;
  position: relative;
  text-decoration: none;
  padding: 18px 0px;
  width:100%;
  text-align:center;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-size: 24px !important;
  font-weight: 200;
  line-height: 28.8px;
}

.tabs-wrapper .nav-tabs.nav-justified>.active>a, 
.tabs-wrapper .nav-tabs.nav-justified>.active>a:focus, 
.tabs-wrapper .nav-tabs.nav-justified>.active>a:hover {
  background: #767678;
  border: none;
  border-radius: 0;
  color:#fff;
}

.tabs-wrapper .nav-tabs.nav-justified>.active>a:after {
  content: '';
  display: block;  
  position: absolute;
  left: 50%;
  top: 100%;
  width: 0;
  height: 0;
  border-top: 10px solid #d8d8d8;
  border-bottom: 10px solid transparent;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  margin-left: -10px;
}

.tabs-wrapper .nav>li>a:focus,
.tabs-wrapper .nav>li>a:hover {
	background: none;
}

/* ARROW STYLES */
a.up-arrow {
	display: inline-block;
	position: relative;
	background: #ddd;
	color: #000000;
	text-decoration: none;
	padding: 18px 0px;
  width:100%;
  text-align:center;
}

/* MOBILE */
#tab-accordion {
  margin:0 0 0px 0;
}

#tab-accordion .panel-default .panel-heading {
  background: #fff;
  padding: 20px 10px;
  position: relative;
}

.panel-heading {
  overflow: hidden;
  width: 100%;
}

.panel-heading .text {
  float: left;
  width: 90%;
  display: inline-block;
}

.panel-heading .icon {
  float: right;
  display: inline-block;
  position: absolute;
  right: 10px;
  /*top: 20%;*/ /* right value */
  top: 50%; /* to fix the concentrina temporary fix */
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

#tab-accordion .panel>.active-heading {
	background: #767678 !important;
	border: none;
	border-radius: 0;
	color:#fff;
}

.panel-heading .icon .glyphicon {
  font-size: 40px;
  color: #000000;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight:200;
}

#tab-accordion .panel-heading p {
  margin: 0;
  font-size: 22px;
  line-height: 26.4px;
  text-align: left;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  color: #000000;
  font-weight:200;
}

#tab-accordion .panel-heading.active-heading p {
	color: #fff;
} 

#tab-accordion .panel-heading a,
#tab-accordion .panel-heading a:hover,
#tab-accordion .panel-heading a:focus {
  color: #000000;
  font-size: 20px !important;
  text-decoration: none;
}

#tab-accordion .panel-heading.active-heading a,
#tab-accordion .panel-heading.active-heading a:hover,
#tab-accordion .panel-heading.active-heading a:focus {
  color: #fff;
  text-decoration: none;
}

.tab-panel {
	overflow: hidden;
}

#tab-accordion a:hover,
#tab-accordion a:active,
#tab-accordion a:focus:hover {
  text-decoration: none; /* remove important as it was not allowing the text component styles */
}

#tab-accordion .panel.first .panel-heading {
  border-top: 0;
}

#tab-accordion .panel {
  box-shadow: none;
}

#tab-accordion .panel-heading {
  border: none;
  border-radius: 0;
  background: #e6e3de !important;
  border-bottom: 1px solid #d8d8d8;
}
#tab-accordion .panel-heading.tab-last-heading {
  border-bottom: none;
}

#tab-accordion .collapse {
  border: none;
}

#tab-accordion .collapse.in {
  border-bottom: 1px solid #d8d8d8;
}

#tab-accordion .panel-body {
  padding: 20px 0px 20px 0px !important;
  margin-bottom: 0;
   
}

#tab-accordion .panel.last .panel-body {
  border-top: 0;
}

.tabs-desktop {
  display: block;
}

.tabs-mobile {
  display: none;
}


/* Zoomed in tabs JLF-JLF-1479 */
.tabs-desktop .stand-out>li {
  transition: transform .2s ease-in-out; 
}

.tabs-desktop .stand-out .active {
  -ms-transform: scale(1.2);
  transform: scale(1.2);
  z-index: 10; 
}

.tabs-desktop  .active a:after {
  margin-top: -1px; 
}

.tabs-desktop .stand-out .active a:before {
  bottom: 100%;
  left: 50%;
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  position: absolute;
  content: '';
  height: 20px;
  width: 100%;
  color: #000000; 
  margin-bottom: 8px; 
}





@media only screen and (min-width : 769px) and (max-width : 1200px) {

  .tabs-desktop {
    display: block;
  }

  .tabs-mobile {
    display: none;
  }

}



@media only screen and (min-width : 320px) and (max-width : 768px) {

  .tabs-mobile {
    display: block;
  }

  .tabs-desktop {
    display: none;
  }
}

/* TAB NAV CSS END */


.ha-tab .tabs-wrapper .nav-tabs.nav-justified>li>a {
  background: #e6e3de;
  border:none;
  border-left: 1px solid #d8d8d8;
}

.ha-tab .tabs-wrapper .nav-tabs.nav-justified>li:first-child a {
	border-left: none;
}

.ha-tab .tabs-wrapper .nav-tabs.nav-justified>li>a {
  color:#717171;
  border: none;
  border-radius: 0 !important;
  position: relative;
  text-decoration: none;
  padding: 0px 0px;
  width:100%;
  text-align:center;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-size: 20px !important;
  font-weight: 500;
  line-height: 28.8px;
  border-bottom: 1px #e6e3de solid;
  padding-bottom: 10px;
}

.ha-tab .tabs-wrapper .nav-tabs.nav-justified>.active>a, 
.ha-tab .tabs-wrapper .nav-tabs.nav-justified>.active>a:focus, 
.ha-tab .tabs-wrapper .nav-tabs.nav-justified>.active>a:hover {
  background: #fff;
  border: none;
  border-bottom: 5px #000 solid;
  border-radius: 0;
  color:#000;
  font-weight: 700;
  padding-bottom: 7px;
}

.ha-tab .tabs-wrapper .nav-tabs.nav-justified>.active>a:after {
  content: '';
  display: block;  
  position: relative;
  left: 50%;
  top: 100%;
  width: 0;
  height: 0;
  border-top: 10px solid #d8d8d8;
  border-bottom: 10px solid transparent;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border:none;                        
  margin-left: 0px;
}


.ha-tab .tabs-wrapper .nav-tabs.nav-justified>li>a {
  background: #fff; 
  color:#000;
  border:none;
  border: none;
  border-bottom: 1px #d8d8d8 solid;
}
.ha-tab .tabs-wrapper .nav-tabs.nav-justified>.active>a,
.ha-tab .tabs-wrapper .nav-tabs.nav-justified>.active>a:focus, 
.ha-tab .tabs-wrapper .nav-tabs.nav-justified>.active>a:hover {
	background: #fff;
	color:#000;
}

.ha-tab .tabs-wrapper .nav-tabs.nav-justified>.active>a:after,
a:hover.up-arrow:after {
	border-top-color: #fff;
}

.ha-tab #tab-accordion .panel-heading {
	background: #fff;
}
.ha-tab #tab-accordion .panel-heading p {
	color: #000;;
}

.ha-tab #tab-accordion .panel>.active-heading {
	background:#fff;
}
.ha-tab #tab-accordion .panel-heading.active-heading p {
	color: #000;
   border: #000 1px solid;

}




</style>


/* CSS for Dynamic Padding */
.dynamic-height.mb-15 {
	margin-bottom: 15px;
}

/* GAD-253: fixed background */
.dynamic-height .fixed-bg {
	background-attachment: fixed;
}

@media only screen and (min-width : 769px){
	.dynamic-height.mb-15 {
		margin-bottom: 0;
	} 
}
/** Dynamic Padding CSS **/


.dynamic-banner.option1 {
	padding-bottom: 0;
	padding-top: 0;
}

.dynamic-banner.option2 {
	padding-bottom: 20px;
	padding-top: 20px;
}

.dynamic-banner.option3 {
	padding-bottom: 40px;
	padding-top: 40px;
}

.dynamic-banner.option4 {
	padding-bottom: 80px;
	padding-top: 80px;
}

.dynamic-banner.option5 {
	padding-bottom: 120px;
	padding-top: 120px;
}

.dynamic-banner.option6 {
	padding-bottom: 160px;
	padding-top: 160px;
}


.dynamic-banner .variant-7 .btn-container .small-btn {
	width: 100%;
	max-width: 212px;
	padding: 6px 12px;
}

.dynamic-banner .variant-7 .btn-container .large-btn {
	width: 100%;
	max-width: 212px;
	padding: 11px 5px;
}

.dynamic-banner .variant-14 .btn-container .small-btn {
	max-width: 100%;
}

.dynamic-banner .variant-14 .btn-container .large-btn {
	max-width: 100%;
}


.dynamic-banner .col-lg-4.col-md-4.col-sm-4.variant-15 {
    padding-left: 15px;
    padding-right: 15px;
}

.dynamic-banner .variant-15 .row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.dynamic-banner .variant-15 .row .left-cell.variant-15 .dynamicBanner .dynamic-height {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.dynamic-banner .variant-15 .row .left-cell {
    padding-left: 0px;
    padding-right: 0px;
}


.dynamic-banner .variant-15 .row .left-cell.variant-15 img {
    max-width: 100%;
    max-height: 100%;
}

.dynamic-banner .variant-15 .row .right-cell {
    padding: 0px;
}


/* GAD-253: Static background */
.dynamicBanner .fixed-bg {
	background-attachment: fixed;
	min-height: 14em; 
}




@media only screen and (min-width : 481px) {

	.dynamic-banner .left-banner.variant-16 {
    	padding-right: 0px;
	}
    .dynamic-banner .right-banner.variant-16  {
	    padding-left: 0px;
	}
	
	
	.dynamic-banner .left-banner.variant-18 {
    	padding-left: 15px;
    	padding-right: 0px;

	}
    .dynamic-banner .right-banner.variant-18  {
	    padding-left: 0px;
		padding-right: 15px;
	}
   .dynamic-banner .center-banner.variant-18  {
	    padding-left: 0px;
        padding-right: 0px;
	}


}

@media only screen and (min-width : 768px) {
.dynamic-banner .left-banner.variant-17 {
    	padding-right: 0px;
    }
    .dynamic-banner .right-banner.variant-17  {
	    padding-left: 0px;
    
	}
}

@media only screen and (max-width : 767px) and (min-width : 481px) {
.dynamic-banner .left-banner.variant-17 {
    	padding-left: 0px;
    }
    .dynamic-banner .right-banner.variant-17  {
	    padding-right: 0px;
    
	}
}

@media only screen and (max-width : 480px)  {
	.dynamic-banner .right-banner.variant-17 {
        margin-bottom: -25px;
    }
     .dynamic-banner .right-banner.variant-17 .s-image {
		margin-bottom: 25px;
  }
}



@media only screen and (min-width : 993px) and (max-width : 1050px) {
	.dynamic-banner .variant-4 .btn-container .small-btn {
		max-width: 100%;
		padding: 6px 30px;
	}

	.dynamic-banner .variant-4 .btn-container .large-btn {
		max-width: 100%;
		padding: 11px 30px;
	}

	.dynamicBanner .fixed-bg {
		background-attachment: initial;
    }    
}

@media only screen and (min-width : 769px) and (max-width : 991px) {
	.dynamic-banner .variant-11.hide-text-comp .text-copy {
		display: none;
		visibility: hidden;
	}

	.dynamic-banner .variant-12.hide-text-comp .text-copy {
		display: none;
		visibility: hidden;
	}

	.dynamicBanner .fixed-bg {
		background-attachment: initial;
    	}    
}

@media only screen and (min-width : 769px) and (max-width : 992px) {
	.dynamic-banner .variant-3 .btn-container .small-btn {
		max-width: 100%;
		padding: 6px 30px;
	}

	.dynamic-banner .variant-3 .btn-container .large-btn {
		max-width: 100%;
		padding: 11px 30px;
	}

	.dynamic-banner .variant-4 .btn-container .small-btn {
		max-width: 100%;
		padding: 6px 12px;
	}

	.dynamic-banner .variant-4 .btn-container .large-btn {
		max-width: 100%;
		padding: 11px 8px;
	}

	.dynamic-banner .variant-7 .btn-container .small-btn {
		width: 100%;
		max-width: 212px;
		padding: 6px 12px;
	}

	.dynamic-banner .variant-7 .btn-container .large-btn {
		width: 100%;
		max-width: 212px;
		padding: 11px 5px;
	}

	/* JLF-1336 - CTA Width Fix for Variant 8 */
	.dynamic-banner .variant-8 .btn-container .small-btn {
		max-width: 100%;
		padding: 6px 30px;
	}

	.dynamic-banner .variant-8 .btn-container .large-btn {
		max-width: 100%;
		padding: 11px 30px;
	}

	.dynamicBanner .fixed-bg {
		background-attachment: initial;
    	}
        .dynamic-banner .left-banner.variant-18 {
    	padding-left:  0px;
    	padding-right: 0px;

	}
    .dynamic-banner .right-banner.variant-18  {
	    padding-left: 0px;
		padding-right: 0px;
	}
   .dynamic-banner .center-banner.variant-18  {
	    padding-left: 0px;
        padding-right: 0px;
	}
    

}

@media only screen and (min-width : 481px) and (max-width : 768px) {
	.dynamic-banner.option1 {
		padding-top: 0;
		padding-bottom: 0;
	}

	.dynamic-banner.option2 {
		padding-top: 15px;
		padding-bottom: 15px;
	}

	.dynamic-banner.option3 {
		padding-top: 30px;
		padding-bottom: 30px;
	}

	.dynamic-banner.option4 {
		padding-top: 60px;
		padding-bottom: 60px;
	}

	.dynamic-banner.option5 {
		padding-top: 90px;
		padding-bottom: 90px;
	}

	.dynamic-banner.option6 {
		padding-top: 120px;
		padding-bottom: 120px;
	}

	.dynamic-banner .variant-2 .btn-container .small-btn {
		max-width: 100%;
		padding: 6px 30px;
	}

	.dynamic-banner .variant-2 .btn-container .large-btn {
		max-width: 100%;
		padding: 11px 30px;
	}

	.dynamic-banner .variant-4 .btn-container .small-btn {
		max-width: 100%;
		padding: 6px 30px;
	}

	.dynamic-banner .variant-4 .btn-container .large-btn {
		max-width: 100%;
		padding: 11px 30px;
	}

	/* JLF-1336 - CTA Width Fix for Variant 8 */
	.dynamic-banner .variant-8 .btn-container .small-btn {
		max-width: 100%;
		padding: 6px 15px;
	}

	.dynamic-banner .variant-8 .btn-container .large-btn {
		max-width: 100%;
		padding: 11px 10px;
	}

	.dynamic-banner col-lg-3.variant-14,
	.dynamic-banner col-md-3.variant-14,
	.dynamic-banner col-sm-3.variant-14,
	.dynamic-banner col-lg-6.variant-14,
	.dynamic-banner col-md-6.variant-14,
	.dynamic-banner col-sm-6.variant-14 {
	    display:block;
		max-width: 100% !important;
	}

    .dynamic-banner .variant-15 .row {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .dynamic-banner .variant-15.right-cell .dynamicBanner .dynamic-height,
    .dynamic-banner .variant-15.right-cell .dynamicBannerCell .dynamic-height {
        margin-bottom: 0px;
    }

    .dynamic-banner .variant-15.right-cell .dynamicBanner .dynamic-height .dynamicBanner,
    .dynamic-banner .variant-15.right-cell .dynamicBannerCell .dynamic-height .dynamicBannerCell {
        margin: 0 5%;
    }

    .dynamic-banner .mobile-banner.variant-15 {
        width: 100%;
    }

    .dynamic-banner .mobile-banner.variant-15 .dynamicBanner .dynamic-height .dynamicBanner .adaptiveimage img,
    .dynamic-banner .mobile-banner.variant-15 .mobile-banner.variant-15 .dynamic-height .adaptiveimage img{
        width: auto;
        margin: auto;
    }

    .dynamic-banner .mobile-banner.variant-15 .dynamicBanner .dynamic-height .dynamicBanner .title .title-comp h3.H3left ,
    .dynamic-banner .mobile-banner.variant-15 .dynamicBannerCell .dynamic-height .dynamicBannerCell .title .title-comp h3.H3left {
        text-align: center;
    }

    .dynamic-banner .left-banner.col-lg-4.col-md-4.col-sm-4.mobile-banner.variant-15 {
        margin-top: 30px;
    }

    .dynamic-banner .right-banner.col-lg-4.col-md-4.col-sm-4.mobile-banner.variant-15 {
        margin-bottom: 30px;
    }

	.dynamicBanner .fixed-bg {
		background-attachment: initial;
    }

	

}

@media only screen and (min-width : 601px) and (max-width : 768px) {
	.dynamic-banner .variant-7 .btn-container .small-btn {
		max-width: 100%;
		padding: 6px 15px;
	}

	.dynamic-banner .variant-7 .btn-container .large-btn {
		max-width: 100%;
		padding: 11px 15px;
	}

	.dynamic-banner .variant-10 .btn-container .small-btn {
		max-width: 100%;
		padding: 6px 15px;
	}

	.dynamic-banner .variant-10 .btn-container .large-btn {
		max-width: 100%;
		padding: 11px 10px;
	}

	.dynamic-banner .variant-11.hide-text-comp .text-copy {
		display: none;
		visibility: hidden;
	}

	.dynamic-banner .variant-12.hide-text-comp .text-copy {
		display: none;
		visibility: hidden;
	}

	.dynamic-banner col-lg-3.variant-14,
	.dynamic-banner col-md-3.variant-14,
	.dynamic-banner col-sm-3.variant-14,
	.dynamic-banner col-lg-6.variant-14,
	.dynamic-banner col-md-6.variant-14,
	.dynamic-banner col-sm-6.variant-14 {
	    display:block;
		max-width: 100% !important;
	}

    .dynamic-banner .variant-15 .row {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .dynamic-banner .variant-15.right-cell .dynamicBanner .dynamic-height,
    .dynamic-banner .variant-15.right-cell .dynamicBannerCell .dynamic-height {
        margin-bottom: 0px;
    }

    .dynamic-banner .variant-15.right-cell .dynamicBanner .dynamic-height .dynamicBanner,
    .dynamic-banner .variant-15.right-cell .dynamicBannerCell .dynamic-height .dynamicBannerCell {
        margin: 0 5%;
    }

    .dynamic-banner .mobile-banner.variant-15 {
        width: 100%;
    }

    .dynamic-banner .mobile-banner.variant-15 .dynamicBanner .dynamic-height .dynamicBanner .adaptiveimage img {
        width: auto;
        margin: auto;
    }

    .dynamic-banner .mobile-banner.variant-15 .dynamicBanner .dynamic-height .dynamicBanner .title .title-comp h3.H3left ,
    .dynamic-banner .mobile-banner.variant-15 .dynamicBannerCell .dynamic-height .dynamicBannerCell .title .title-comp h3.H3left {
        text-align: center;
    }

    .dynamic-banner .left-banner.col-lg-4.col-md-4.col-sm-4.mobile-banner.variant-15 {
        margin-top: 30px;
    }

    .dynamic-banner .right-banner.col-lg-4.col-md-4.col-sm-4.mobile-banner.variant-15 {
        margin-bottom: 30px;
    }

	.dynamicBanner .fixed-bg {
		background-attachment: initial;
    }
    
    .dynamic-banner .left-banner.variant-18 {
    	padding-left:  15px;
    	padding-right: 15px;

	}
    .dynamic-banner .right-banner.variant-18  {
	    padding-left: 0px;
		padding-right: 15px;
	}
   .dynamic-banner .center-banner.variant-18  {
	    padding-left: 15px;
        padding-right: 0px;
	}
    

}

@media only screen and (min-width : 320px) and (max-width : 480px) {

	.dynamic-banner.option1 {
		padding-top: 0;
		padding-bottom: 0;
	}

	.dynamic-banner.option2 {
		padding-top: 15px;
		padding-bottom: 15px;
	}

	.dynamic-banner.option3 {
		padding-top: 30px;
		padding-bottom: 30px;
	}

	.dynamic-banner.option4 {
		padding-top: 60px;
		padding-bottom: 60px;

	}

	.dynamic-banner.option5 {
		padding-top: 90px;
		padding-bottom: 90px;
	}

	.dynamic-banner.option6 {
		padding-top: 120px;
		padding-bottom: 120px;
	}

	.dynamic-banner .variant-7 .btn-container .small-btn {
		max-width: 100%;
	}

	.dynamic-banner .variant-7 .btn-container .large-btn {
		max-width: 100%;
	}

	.dynamic-banner .variant-11.hide-text-comp .text-copy {
		display: none;
		visibility: hidden;
	}

	.dynamic-banner .variant-12.hide-text-comp .text-copy {
		display: none;
		visibility: hidden;
	}

	.dynamic-banner col-lg-3.variant-14,
	.dynamic-banner col-md-3.variant-14,
	.dynamic-banner col-sm-3.variant-14,
	.dynamic-banner col-lg-6.variant-14,
	.dynamic-banner col-md-6.variant-14,
	.dynamic-banner col-sm-6.variant-14 {
	    display: block;
	    max-width: 100% !important;
	}

    .dynamic-banner .variant-15 .row {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .dynamic-banner .variant-15.right-cell .dynamicBanner .dynamic-height,
    .dynamic-banner .variant-15.right-cell .dynamicBannerCell .dynamic-height {
        margin-bottom: 0px;
    }

    .dynamic-banner .variant-15.right-cell .dynamicBanner .dynamic-height .dynamicBanner,
    .dynamic-banner .variant-15.right-cell .dynamicBannerCell .dynamic-height .dynamicBannerCell {
        margin: 0 8%;
    }

    .dynamic-banner .mobile-banner.variant-15 {
        width: 100%;
    }

    .dynamic-banner .mobile-banner.variant-15 .dynamicBanner .dynamic-height .dynamicBanner .adaptiveimage img {
        width: 65%;
        margin: auto;
    }

    .dynamic-banner .mobile-banner.variant-15 .dynamicBanner .dynamic-height .dynamicBanner .title .title-comp h3.H3left ,
    .dynamic-banner .mobile-banner.variant-15 .dynamicBannerCell .dynamic-height .dynamicBannerCell .title .title-comp h3.H3left {
        text-align: center;
    }

    .dynamic-banner .left-banner.col-lg-4.col-md-4.col-sm-4.mobile-banner.variant-15 {
        margin-top: 30px;
    }

    .dynamic-banner .right-banner.col-lg-4.col-md-4.col-sm-4.mobile-banner.variant-15 {
        margin-bottom: 30px;
    }

	.dynamicBanner .fixed-bg {
		background-attachment: initial;
    }

	.dynamic-banner .left-banner.variant-18 {
    	padding-left:  15px;
    	padding-right: 15px;

	}
    .dynamic-banner .right-banner.variant-18  {
	    padding-left: 0px;
		padding-right: 15px;
	}
   .dynamic-banner .center-banner.variant-18  {
	    padding-left: 15px;
        padding-right: 0px;
	}


    
}

@media only screen and (max-width : 359px){
	.dynamic-banner .left-banner.variant-18 {
    	padding-left:  15px;
    	padding-right: 15px;
	}
    .dynamic-banner .right-banner.variant-18  {
	    padding-left: 15px;
		padding-right: 15px;
        width:100%;
	}
   .dynamic-banner .center-banner.variant-18  {
	    padding-left: 15px;
        padding-right: 15px;
    	width:100%;
	}
}

@media only screen and (min-width : 481px) and (max-width : 600px) {

   .dynamic-banner .left-banner.variant-18 {
    	padding-left:  15px;
    	padding-right: 15px;

	}
    .dynamic-banner .right-banner.variant-18  {
	    padding-left: 0px;
		padding-right: 15px;
	}
   .dynamic-banner .center-banner.variant-18  {
	    padding-left: 15px;
        padding-right: 0px;
	}
}

/** Dynamic Padding CSS END **/
/** Adaptive Image Container CSS **/

.adaptive-image-container {
	text-align: center;
}

.adaptive-image-container img {
	max-width: 100%;
}

.adaptive-image-container.left-align {
	text-align: left;
}
.adaptive-image-container.right-align {
	text-align: right;
}
.adaptive-image-container.center-align {
	text-align: center;
}

/* Slider */
.slick-slider
{
    position: relative;

    display: block;

    -moz-box-sizing: border-box;
         box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
    max-width: 100%;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}
@charset 'UTF-8';
/* Slider */
.slick-loading .slick-list
{
    /*background: #fff url('../../../apps/jlf/website/components/carousel/clientlib/libs/ajax-loader.gif') center center no-repeat;*/
}

/* Icons */
@font-face
{
    font-family: 'slick';
    font-weight: normal;
    font-style: normal;

    src: url('../../../apps/jlf/website/components/carousel/clientlib/libs/fonts/slick.eot');
    src: url('../../../apps/jlf/website/components/carousel/clientlib/libs/fonts/slick.eot?#iefix') format('embedded-opentype'), url('../../../apps/jlf/website/components/carousel/clientlib/libs/fonts/slick.woff') format('woff'), url('../../../apps/jlf/website/components/carousel/clientlib/libs/fonts/slick.ttf') format('truetype'), url('../../../apps/jlf/website/components/carousel/clientlib/libs/fonts/slick.svg#slick') format('svg');
}
/* Arrows */
.slick-prev,
.slick-next
{
    font-size: 0;
    line-height: 0;

    position: absolute;
    top: 50%;

    display: block;

    width: 20px;
    height: 20px;
    padding: 0;
    margin-top: -10px\9; /*lte IE 8*/
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);

    cursor: pointer;

    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
    color: transparent;
    outline: none;
    background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
    opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
    opacity: .25;
}

.slick-prev:before,
.slick-next:before
{
    font-family: 'slick';
    font-size: 20px;
    line-height: 1;

    opacity: .75;
    color: white;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-prev
{
    left: -25px;
}
[dir='rtl'] .slick-prev
{
    right: -25px;
    left: auto;
}
.slick-prev:before
{
    content: '←';
}
[dir='rtl'] .slick-prev:before
{
    content: '→';
}

.slick-next
{
    right: -25px;
}
[dir='rtl'] .slick-next
{
    right: auto;
    left: -25px;
}
.slick-next:before
{
    content: '→';
}
[dir='rtl'] .slick-next:before
{
    content: '←';
}

/* Dots */
.slick-slider
{
    margin-bottom: 30px;
}

.slick-dots
{
    position: absolute;
    bottom: -45px;

    display: block;

    width: 100%;
    padding: 0;

    list-style: none;

    text-align: center;
}
.slick-dots li
{
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}
.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
.slick-dots li button:before
{
    font-family: 'slick';
    font-size: 6px;
    line-height: 20px;

    position: absolute;
    top: 0;
    left: 0;

    width: 20px;
    height: 20px;

    content: '•';
    text-align: center;

    opacity: .25;
    color: black;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
    opacity: .75;
    color: black;
}


/* CAROUSEL STYLES ONLY */

.carousel-container {
  height: 500px; /* for 500 height */
}

.jcarousel {
  width: 100%;
  max-width: 1800px;
  margin: 0 auto;
}

.jcarousel.large .slick-slider {
  height: 800px; /* for 800 height */
}
.slick-slider {
  height: 500px; /* for 500 height */
  position: relative;
  margin-bottom: 0px !important;
} 

/* Custom Slick Carousel Styles */

.jcarousel.large .slick-next,
.jcarousel.large .slick-prev {
  top: 94.5%; /* for 800 height fix */
}
.slick-next, .slick-prev {
  top: 93%; /* for 500 height */
  right: 15.1%;
  left: inherit;
  z-index: 20;
  width: 30px;
  height: 30px;
  color: #000;
  background-color: rgba(255,255,255,0.8);
  border-radius: 100%;
  display: block;
  opacity: 0;
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-transition: opacity 0.2s ease-out;
  -moz-transition: opacity 0.2s ease-out;
  -o-transition: opacity 0.2s ease-out;
  transition: opacity 0.2s ease-out;
}

.slick-slider:hover .slick-next,
.slick-slider:hover .slick-prev{
  opacity: 1;
  -webkit-transition: opacity 0.2s ease-out;
  -moz-transition: opacity 0.2s ease-out;
  -o-transition: opacity 0.2s ease-out;
  transition: opacity 0.2s ease-out;
}

.slick-prev {
  left: 15.1%;
  right: inherit;
}

.slick-prev, .slick-prev:hover {
  color: #000;
  display: block;
}

.slick-next, .slick-next:hover {
  color: #000;
  display: block;
  clear: both;
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  /*bottom: 20px; GAD-653 - removing as affecting the > arrow in the promo carousel but no affect on carousel >*/
  display: block;
}

.slick-prev:before, .slick-next:before {
  font-family: "Glyphicons Halflings", "slick", sans-serif;
  /*font-family: "jl-icon";*/
  font-size: 14px;
  color: #000000;
}

.slick-prev:before {
  content: "\e257";
}

.slick-next:before {
  content: "\e258";
}
.slick-prev:hover,
.slick-next:hover{  
  background-color: rgba(255,255,255,1);
}

.slick-prev:focus,
.slick-next:focus{  
  background-color: rgba(255,255,255,0.8);
}

.slick-dots {
  bottom: 12px;
  color: transparent !important;
  padding: 0px;
  margin-left: 0;
}

.slick-dots li {
  padding: 0 !important;
  margin: 0;
  width: 14px;
  height: 14px;
  line-height: 0px;
}

.slick-dots li button {
  padding: 0px;
  margin: 0px;
}

.slick-dots li button {
  display: inline-block;
  width: 8.5px;
  height: 8.5px;
  text-indent: -999px;
  cursor: pointer;
  background-color: #000\9;
  background-color: rgba(0,0,0,0);
  border: 1px solid #fff;
  border-radius: 10px;
  opacity: 1;
}

.slick-dots li.slick-active button {
  width: 8.5px;
  height: 8.5px;
  margin: 0;
  background-color: #fff;
}

.new-carousel {
  overflow: hidden;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 400;  
}

.new-carousel .cta-wrapper.cta-wrapper-secondary{
  margin-top: 20px;
}

.slick-dots li:after, 
.slick-dots li:before, 
.slick-dots li button:before {
  display: none; 
}

.copy-wrapper {
  font-size: 20px;
}

.text-wrapper {
  clear: both;
}


.text-wrapper .carousel-heading {
  font-size: 48px;
  line-height: 58px;
  padding: 0 0 5px 0;
  text-align: center;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 700;  
  margin: 0px;
}

.text-wrapper h2 {
  font-size: 50px;
  line-height: 66px;
  padding: 0 0 5px 0;
  text-align: center;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 400;  
  text-transform: uppercase;
  letter-spacing: 11px;
  margin: 0px;
}

.text-wrapper .dash-bottom:after {
  content: ' ';
  display: block;
  width: 60px;
  border-top: 3px solid;
  margin: 15px auto 25px;
}

.text-wrapper .caption {
  display: block;
  clear: both;
  margin: 0px 0 30px 0;
  text-align: center;
  font-size: 22px;
  line-height: 26.4px;
}

.text-wrapper .hub-carousel-heading {
  font-size: 60px;
  line-height: 72px;  /*GAD-787*/
  padding: 0 0 7px 0;
  text-align: center;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 700; /*GAD-787*/  
  /*text-transform: uppercase;*/ /*GAD-787*/
  /*letter-spacing: 13px;*/ /*GAD-787*/
  margin: 0px;
}

/* Hide the Header or Caption or Both and preserve their space - jira GAD-212 */
.text-wrapper.invisible-header .carousel-heading,
.text-wrapper.invisible-header .hub-carousel-heading,
.text-wrapper.invisible-header .dash-bottom,
.text-wrapper.invisible-caption .caption,
.text-wrapper.invisible-header-caption .carousel-heading,
.text-wrapper.invisible-header-caption .hub-carousel-heading,
.text-wrapper.invisible-header-caption .dash-bottom,
.text-wrapper.invisible-header-caption .caption {
 visibility: hidden;
}

.jcarousel.large .text-wrapper .dash-bottom:after {
  content: ' ';
  display: block;
  width: 80px;
  border-top: 3px solid;
  margin: 15px auto 30px;
}

.jcarousel.large .text-wrapper .caption {
  display: block;
  clear: both;
  margin: 0px 0 40px 0;
  text-align: center;
  font-size: 24px;
  line-height: 28.8px;
}

.text-black,
.text-black a,
.text-white p {
  color:#000000 !important;
}
.text-white,
.text-white a,
.text-white p {
  color: #fff !important;
}

.modal-backdrop {
  z-index: -1;
}

.modal-banner {
  background: #000;
  opacity: .5;
}

.modal-title {
  font-size: 24px;
}

.modal-content {
  color: #000000 !important; /*color: #333 !important;*/ /*Changing for rebrand changes for popup component*/
}

#carouselModal .modal-header {
  padding: 15px 15px 15px 15px;
  border-bottom: 1px solid #d8d8d8;
}

#carouselModal .modal-content {
  background-color: #ffffff;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  -o-border-radius: 0px;
  border-radius: 0px;
  width:inherit;
  height:inherit;
  /* To center horizontally */
  margin: 0 auto;
  pointer-events: all;
  border:0px;
}



#carouselModal .modal-body p {
  font-family: Arial,Helvetica,sans-serif;
}

#carouselModal .close {
  color: #000000;
  opacity: 1;
  position: relative;
  top: -10px;
  right: 0px;
}

#carouselModal.modal {
  z-index: 999999; /* JLF1198 - replacing 5999 to 999999 to fix this bug */
}

.h4-heading {
  font-size: 22px;
  line-height: 26.4px;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 400;
}

.cta-wrapper .btn {
  clear: both;
  display: table;
  margin: 0px auto;
  padding: 6px 40px;
}

.text-black .btn {
  color: #000000 !important;
}

.text-white .btn {
  color: #fff !important;
}

.terms-conditions {
  text-align: left;
  width: 95%;
  position: absolute;
  bottom: 40px;
  text-align: center;
  font-size: 14px;
}

.terms-conditions a:hover, 
.terms-conditions a:active,
.terms-conditions a:focus {
    font-size: 14px;
}

.terms-conditions a:visited{
    font-size: 14px;
}

.terms-conditions.apr-image-with-terms{
  padding-left: 15px; 
}

.terms-conditionsnot {
  width: 95%;
  position: absolute;
  bottom: 40px;
  text-align: center;
  font-size: 14px;
}

.terms-conditionsnot a:hover, 
.terms-conditionsnot a:active,
.terms-conditionsnot a:focus {
    font-size: 14px;
}

.terms-conditionsnot a:visited{
    font-size: 14px;
}

.terms-conditionsnot.apr-image-with-terms{
  padding-left: 15px; 
}


.terms-link a {
  color: #000000;
  text-decoration: underline;
  outline: none;
}

body.modal-open {
  padding: 0px !important;
  overflow: hidden;
  height: 100vh;
}

.logo-mobile-section {
  display: none;
}

.show-in-desktop {
  display:block; /* by default desktop is shown */
}

.show-in-tablet, 
.show-in-mobile {
  display:none; /* by default mobile and tablet are hidden */
}


.carousel-image {
  background-repeat: no-repeat;
  background-size: cover;
  height: 500px; /* for 500 height */
}

.logo-mobile-section .carousel-image {
  background-size: contain;
  height: 125px !important;
  width: 125px;
  margin: 5px auto;
  margin-top: 25px;
}

.jcarousel.large .content-section {
    top: -800px; /* for 800 height */
}
.content-section {
  top: -500px; /* for 500 height */
  position: relative;
  margin-top: 40px;
}

.top-section {
  overflow: hidden;
}

.top-left-corner {
  background-repeat: no-repeat;
}

.jcarousel.large .top-mid-section {
  height: 760px; /* for 800 height */
}
.top-mid-section {
  height: 460px; /* for 500 height */
}

.top-right-corner {
  background-repeat: no-repeat;
}

.bottom-section {
  bottom: 150px;
  position: relative;
  width: 100%;
}

.bottom-section.apr-image-with-terms{
  bottom:140px;
}


.bottom-section.four-by-three{
  bottom: 175px; 
}

.bottom-left-corner {
  background-repeat: no-repeat;
}

.bottom-right-corner {
  background-repeat: no-repeat;
}

.bottom-center {
  display: block;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

.bottom-center .adaptiveimage img {
  margin: 0 auto;
  text-align: center;
}

.pos-icon-left {
  position: relative;
  left: 12%;  
}

.pos-icon-right {
  position: relative;
  right: 11%;  
}

.pos-icon-left img,
.pos-icon-right img {
  margin: 0 auto;
}

.terms-text {
  line-height: 16px; 
  font-size: 14px;
  text-decoration: underline;
}


/* To be used for height of the carouse image on Level1, 2 and 3 */
.level1-class {
  height: 500px;
}

.level2-class {
  height: 500px;
}

.level3-class {
  height: 500px;
}

.hide {
  display: none !important;
}

.show {
  display: block !important;
}

/* THE END */

/* RESPONSIVE IMAGES */

.image-container {
  position: relative;
}

.image-container .image {
  max-width: 100%;
  background-size: cover;
  -moz-background-size: cover;  
  background-position: center;  
}

.jcarousel.large .image-container .image.height {
  height: 800px; 
}

.image-container .image.height {
  height: 500px; 
}


@media only screen and (min-width : 769px) and (max-width : 992px) {

  .image-container .image {
    padding-top: 10%;
    max-width: 100%;
    background-size: cover;
    -moz-background-size: cover;  
    background-position: center;  
  }

.jcarousel.large .image.height {		
      height: 800px;		
  }		
  .image-container .image.height {
    height: 500px; 
  }


  .show-in-desktop {
    display:block;
  }

  .show-in-tablet, 
  .show-in-mobile {
    display:none;
  }

  .slick-prev {
    left: 15px;
  }

  .slick-next {
    right: 15px;
  }


  .carousel-container {
    height: 500px;
  }

  .text-wrapper {
    width: 100%;
  }

.text-wrapper .carousel-heading {
      font-size: 36px;
      line-height: 44px;
      letter-spacing: 6px;
  }

  .text-wrapper .dash-bottom:after {
      width: 50px;
      margin: 15px auto 20px;
  }

  .text-wrapper .caption {
      font-size: 20px !important;
      line-height: 24px;
  }

  .text-wrapper .hub-carousel-heading {
      font-size: 44px;
      line-height: 52.8px;
      letter-spacing: 6px;    
  }

  .jcarousel.large .text-wrapper .dash-bottom:after {
      width: 60px;
      margin: 15px auto 25px;
  }

  .jcarousel.large .text-wrapper .caption {
      font-size: 22px !important;
      line-height: 26.4px;
  }

  .jcarousel.large .slick-slider {
    height: 800px; /* in 800 height for tablet */
  }

  .slick-slider {
    height: 500px; /* in 500 height for tablet */
  }

  .terms-conditions {
    width: 95%;
  }

  .terms-conditionsnot {
    width: 95%;
  }

  .caption {
    font-size: 20px;
  }
  .slick-slider {
    height: 500px; /* in 500 height for tablet */
  }

 

} /* 769 to 992 media query end here */

@media only screen and (min-width : 769px) and (max-width : 840px) { 

  .bottom-section {
    bottom: 125px;
  }
  .bottom-section.apr-image-with-terms{
    bottom: 125px;
  }

}

@media only screen and (min-width : 841px) and (max-width : 992px) {
  
  .bottom-section {
    bottom: 155px;
  }
  .bottom-section.apr-image-with-terms{
    bottom: 135px;
  }
}

/*@media only screen and (min-width : 993px) {
  .terms-conditions {
    padding-left: 10px;
  }
} 993 media query end here */

/* Retina desktop */
@media
  only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 769px) and (max-width : 1800px),
  only screen and (  -moz-min-device-pixel-ratio: 2)  and (min-width: 769px) and (max-width : 1800px),
  only screen and (   -o-min-device-pixel-ratio: 2/1) and (min-width: 769px) and (max-width : 1800px),
  only screen and (       min-device-pixel-ratio: 2)  and (min-width: 769px) and (max-width : 1800px),
  only screen and (           min-resolution: 192dpi) and (min-width: 769px) and (max-width : 1800px),
  only screen and (            min-resolution: 2dppx) and (min-width: 769px) and (max-width : 1800px) {

  .image-container .image {
    padding-top: 10%;
    max-width: 100%;
    background-size: cover;
    -moz-background-size: cover;  
    background-position: center;  
  }

  .jcarousel.large .image-container .image.height  {
    height: 500px; 
  }

  .image-container .show-in-desktop {
    display:block;
  }

  .image-container .show-in-tablet, 
  .image-container .show-in-mobile {
    display:none;
  }

}

/* Extra Small Devices and medium */ 
@media only screen and (min-width : 481px) and (max-width : 768px) {

 #carouselModal .full-width {
    display:table;
    height: 100%;
    width: 100%;
  }

  #carouselModal .modal-header {
    padding: 15px 0px 15px 15px;
  }

  /*#carouselModal .modal-body{
    max-height: 100vh;
  }*/

  .image-container .image {
    background-size: cover;
    -moz-background-size: cover;  
    background-position: center;  
  }

  .jcarousel.large .image-container .image.height {
    height: 710px !important;  
  }
  .image-container .image.height {
    height: 400px !important;
  }


  .show-in-tablet {
    display:block;
  }

  .show-in-desktop, 
  .show-in-mobile {
    display:none;
  }

  .jcarousel.large .content-section {
    top:-710px !important;
  }
  .content-section {
    margin-top: 25px !important;
    top:-400px !important;
  }

  .jcarousel.large .top-mid-section {
    height: 760px !important; /*for 800 height case only */
  }
  .top-mid-section {
    height: 460px !important; /*for 500 height case only */
  }

  .slick-prev {
    left: 15px;
  }

  .slick-next {
    right: 15px;
  }

 
  .carousel-container {
    height: 400px;
  }

  .text-wrapper {
    width: 100%;
  }

  .text-wrapper .carousel-heading,
  .text-wrapper h2 {
    font-size: 26px;
    line-height: 31.2px;
    padding: 0 0 0px 0;  
  }

  .text-wrapper .dash-bottom:after {
      width: 36px;
      margin: 15px auto 18px;
  }

  .text-wrapper .caption {
      margin: 0px 0 15px 0;
      font-size: 18px;
      line-height: 21.6px;
  }

  .text-wrapper .hub-carousel-heading {
      font-size: 44px;
      line-height: 52.8px;
  }

  .jcarousel.large .text-wrapper .dash-bottom:after {
      width: 60px;
      margin: 15px auto 25px;
  }

  .jcarousel.large .text-wrapper .caption {
      font-size: 22px !important;
      line-height: 26.4px;
  }

  .copy-wrapper {
    top: -17px;
    width: 100%;
  }

  .carousel-container h3 {
    line-height: 38.4px;
  }

  .cta-wrapper .btn {
    padding: 6px 50px;
  }

  .bottom-section {
    bottom: 160px !important;
  }
  .bottom-section.apr-image-with-terms{
    bottom: 210px !important;
  }


  .bottom-section.four-by-three {
    bottom: 225px !important;
  }

  .slick-dots {
    bottom: 12px;
    margin-bottom: 0px;
  }

  .jcarousel.large .slick-slider {
     height: 710px; /* in 500 height for tablet */
  }
  .slick-slider {
    height: 400px; /* in 500 height for tablet */
    position: relative;
  }

  .terms-conditions {
    width: 100%;
    bottom: 145px !important;
    text-align: center;
    left: 0;
  }

  .terms-conditionsnot {
    width: 100%;
    bottom: 145px !important;
    text-align: center;
    left: 0;
  }

  .jcarousel.large .slick-next,
  .jcarousel.large .slick-prev {
    top: 93.5%; /* in 800 height for tablet */
  }

  .slick-next, .slick-prev {
    top: 90%; /* in 500 height for tablet */
  }

  .modal-dialog {
    width: 400px;
    margin: 0 auto;
  }

  .pos-icon-right {
    right: 11%;  
  }
  .pos-icon-left {
    right: 12%;
    left: 3%;  
  }
  .col-mobile.image-container{
    width: 41.66666667%; /*col-sm-5 */
  }
  .pos-icon-right.image-container{
    right: 4%; 
  }




} /* TABLET media query */

@media only screen and (min-width : 601px) and (max-width : 768px) {

  .bottom-section {
    bottom: 205px;
  }

  .terms-conditions {
    bottom: 130px !important;
  }
  
  .terms-conditions.apr-image-with-terms{
    bottom: 100px !important;
    padding-left: 0;
    left: -15px; 
  }

  .terms-conditionsnot {
    bottom: 130px !important;
  }
  
  .terms-conditionsnot.apr-image-with-terms{
    bottom: 100px !important;
    padding-left: 0;
    left: -15px; 
  }

.text-wrapper .hub-carousel-heading {
      font-size: 36px;
      line-height: 43.2px;
  }

  .jcarousel.large .text-wrapper .dash-bottom:after {
      width: 50px;
      margin: 15px auto 25px;
  }

  .jcarousel.large .text-wrapper .caption {
      font-size: 20px !important;
      line-height: 24px;
  }

  .pos-icon-left {
    right: 12%;
    left: 6%;  
  }
  .col-mobile.image-container{
    width: 33.33333333%; /*col-sm-4 */
  }
  .pos-icon-right.image-container{
    right: 8%;
  }
}

@media only screen and (min-width : 481px) and (max-width : 600px) {

  .content-section {
    margin-top: 20px !important;
  }
  
  .text-wrapper .caption {
    margin: 0px 0 10px 0;
    font-size: 16px;
    line-height: 19.2px;
  }

  .terms-conditions {
    bottom: 118px !important;
  }
  
  .terms-conditions.apr-image-with-terms{
    bottom: 105px !important;
    padding-left: 0;    
  }

  .terms-conditionsnot {
    bottom: 118px !important;
  }
  
  .terms-conditionsnot.apr-image-with-terms{
    bottom: 105px !important;
    padding-left: 0;    
  }
  
  .terms-link a {
    font-size: 12px !important;
  }

  .text-wrapper .dash-bottom:after {
    margin: 7px auto 10px;
  }

  .bottom-section {
    bottom: 175px;
  }
.text-wrapper .hub-carousel-heading {
      font-size: 30px;
      line-height: 36.4px;
      padding: 0;
  }

  .jcarousel.large .text-wrapper .dash-bottom:after {
      width: 36px;
      margin: 15px auto 15px;
  }

  .jcarousel.large .text-wrapper .caption {
    margin: 5px 0 30px 0;
    font-size: 18px !important;
    line-height: 21.6px;
  }

  
}

/* Retina Tablet */
@media
  only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width : 481px) and (max-width : 768px),
  only screen and (  -moz-min-device-pixel-ratio: 2)  and (min-width : 481px) and (max-width : 768px),
  only screen and (   -o-min-device-pixel-ratio: 2/1) and (min-width : 481px) and (max-width : 768px),
  only screen and (       min-device-pixel-ratio: 2)  and (min-width : 481px) and (max-width : 768px),
  only screen and (           min-resolution: 192dpi) and (min-width : 481px) and (max-width : 768px),
  only screen and (            min-resolution: 2dppx) and (min-width : 481px) and (max-width : 768px) {

 .image-container .image {
    height: 400px !important;
    -webkit-background-size:cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;  
    background-position: center;  
  }

  .jcarousel.large .image-container .image.height {
    height: 710px !important;
  }

  .image-container .image.height {
    height: 400px !important; 
  }

  .image-container .show-in-tablet {
    display:block; 
 }

  .image-container .show-in-desktop, 
  .image-container .show-in-mobile {
    display:none;
  }

}

/* Mobile media query*/
@media only screen and (min-width : 320px) and (max-width : 480px) {

  #carouselModal .full-width {
      display:table;
      height: 100%;
      width: 100%;
  }
 
  #carouselModal .modal-header {
    padding: 15px 15px 15px 15px;
  }

 

  .image-container .image {
    -webkit-background-size:cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;  
    background-position: center;
  }

  .image-container .image.height {
      height: 385px !important;
  }


  .show-in-mobile {
    display:block;
  }
    
  .show-in-desktop, 
  .show-in-tablet {
      display:none;
  }


  .content-section {
    top: -385px !important;
    margin-top: 20px !important;
  }

  .top-mid-section {
    height: 465px !important;
  }

  .top-section {
    overflow: visible !important;
  }

  .hidden-mobile {
    display: none;
  }

  .logo-mobile-section {
    display: block;
  }

  .col-mobile {
    width: 100%;
  }

  .slick-prev {
    left: 15px;
  }

  .slick-next {
    right: 15px;
  }

  
  .carousel-container {
    height: 385px;
  }

  .copy-wrapper {
    top: 465px;
    width: 100%;
    clear: both;
  }

  .text-wrapper {
    width: 100%;
  }

  .text-wrapper .hub-carousel-heading,
  .text-wrapper .carousel-heading {
    font-size: 26px;
    line-height: 31.2px;
    padding: 0;
  }

  .text-wrapper .dash-bottom:after,
  .jcarousel.large .text-wrapper .dash-bottom:after {
    width: 36px;
    margin: 15px auto 15px;
  }

  .jcarousel.large .text-wrapper .caption,
  .text-wrapper .caption {
    margin: 5px 0 30px 0;
    font-size: 18px !important;
    line-height: 21.6px;
  }

  .cta-wrapper .btn {
    padding: 6px 75px;
  }

  .jcarousel.large .slick-slider {
    height: 400px;
  }
  .slick-slider {
    height: 400px;
    position: relative;
    margin-bottom: 0 !important;
  }

  .slick-dots {
    bottom: 26px;
    /*margin: 0px auto;*/
  }

  .slick-next, .slick-prev {
    top: 87%;
  }

  .terms-conditions {
    width: 100%;
    bottom: 140px;
    text-align: center;
    left: 0;
  }

  .terms-conditionsnot {
    width: 100%;
    bottom: 140px;
    text-align: center;
    left: 0;
  }

  .caption {
    font-size: 19px;
  }

  .modal-dialog {
    width: 280px;
    margin: 0 auto;
  }

  .carousel-container h3 {
    line-height: 31.2px;
  }

  .terms-link a {
    font-size: 12px !important;
  }

  .terms-text {
    font-size: 12px;
    text-decoration: underline;
  }

} /* MOBILE media query */


/*Retina mobile*/

@media 
  only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 320px) and (max-width : 480px),
  only screen and ( -moz-min-device-pixel-ratio: 2)   and (min-width: 320px) and (max-width : 480px),
  only screen and (   -o-min-device-pixel-ratio: 2/1) and (min-width: 320px) and (max-width : 480px),
  only screen and (     min-device-pixel-ratio: 2)    and (min-width: 320px) and (max-width : 480px),
  only screen and (           min-resolution: 192dpi) and (min-width: 320px) and (max-width : 480px),
  only screen and (            min-resolution: 2dppx) and (min-width: 320px) and (max-width : 480px) {

  .image-container .image {
    -webkit-background-size:cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;  
    background-position: center; 
  }
  .image-container .image.height {
      height: 385px !important;
  }

  .image-container.show-in-mobile {
    display:block;
  }

  .image-container .show-in-tablet, 
  .image-container .show-in-desktop {
    display:none;
  }

}

/* RESPONSIVE Images ends*/


/* TODO REMOVE */

/* component - popup */
/* alignment */


.popup.modal {
  z-index: 7000;
}

.modal.fade:not(.in).top .modal-dialog {
  -webkit-transform: translate3d(0, -25%, 0);
  transform: translate3d(0, -25%, 0);
}

body.modal-open .modal-backdrop.fade.in {
  z-index: 1040;
}

body.modal-open .modal-backdrop.in {
  opacity: .85;
}

body.modal-open #totalBox.fixto-fixed {
  position: static !important;
}

.popup .modal-content {
  background-color: #ffffff;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  -o-border-radius: 0px;
  border-radius: 0px;
  width: inherit;
  height: inherit;
  margin: 0 auto;
  pointer-events: all;
  border: 0px;
  padding: 30px 10px 30px 30px;
}

.popup .vertical-alignment-helper {
  display: table;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.popup .vertical-align-center {
  display: table-cell;
  vertical-align: middle;
  pointer-events: none;
}
    
.popup .modal-title {
  font-size: 24px;
  line-height: 28.8px;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 200; /* changed to 200 as per design requirement*/
  padding-bottom: 10px;
  margin-bottom: 20px;
  color: #000000;
  border-bottom: 1px solid #d8d8d8;
}

.popup .close {
  color: #000000;
  opacity: 1;
  position: relative;
  top: -10px;
  right: 4px;
}

.popup .icon-close {
  display: inline-block;
  position: relative;
  margin: 0px;
}

.padding-reset {
  padding: 0;
}



.terms-list {
  width: 100%;
  margin: 0;
}

.terms-list p {
  padding: 0 10px 0 0;
}

.popup .row.row {
  margin: 0 !important;
}

.row.terms-list {
  height: 330px;
  margin-top:30px;
}

.row.close-wrapper {
  padding-right: 10px;
}




@media only screen and (min-width : 481px) and (max-width : 768px) {
  
  .popup .modal-title {
    font-size: 22px;
    line-height: 26.4px;
  }

  .icon-close {
    position: relative;
    left: -3px;
  }

  .modal-dialog.dialog-fix {
    width: auto !important;
  }

  .modal-open .modal {
    padding-right: 0px !important;
    margin: 0 30px;
  }

  .row.terms-list{
    height: calc(100vh - 155px);
  }

}

@media only screen and (min-width : 320px) and (max-width : 480px) {
  .popup-btn {
    width: 100%;
    padding: 0;
  }

  .popup .modal-title {
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 20px;
  }

  .popup .close {
    color: #000000;
    opacity: 1;
  }

  .popup .icon-close {
    position: relative;
    margin: 0px;
    top: 0px;
    left: 0;
  }

  .modal-open .modal {
    padding-right: 0px !important;
    margin: 20px 20px 20px 20px !important;
  }

  .modal-dialog.dialog-fix {
    width: auto !important;
  }

  .row.terms-list{
    height: calc(100vh - 210px);
  }

  /* Hide the Header or Caption or Both and preserve their space on Mobile Devices - jira GAD-225 */
  .mobile-text-wrapper.mobile-invisible-header .carousel-heading,
  .mobile-text-wrapper.mobile-invisible-header .hub-carousel-heading,
  .mobile-text-wrapper.mobile-invisible-header .dash-bottom,
  .mobile-text-wrapper.mobile-invisible-caption .caption,
  .mobile-text-wrapper.mobile-invisible-header-caption .carousel-heading,
  .mobile-text-wrapper.mobile-invisible-header-caption .hub-carousel-heading,
  .mobile-text-wrapper.mobile-invisible-header-caption .dash-bottom,
  .mobile-text-wrapper.mobile-invisible-header-caption .caption{
    visibility: hidden;
  }

}

@media only screen and (max-width : 1024px) {
  .slick-next, .slick-prev{
   opacity: 1;
  }
}


/* GAD-222: center adaptive image on larger screens */
@media only screen and (min-width : 768px) {

  .bottom-center {
    display: flex;
    text-align: center;
    justify-content: center;
  }
  
  .bottom-center img {
    margin: 0 auto;
    text-align: center;
  }
  
}


/* Hide the Header or Caption or Both and preserve their space on Mobile Devices - jira GAD-225 */
@media only screen and (max-width : 321px), screen and (max-width : 481px) and (orientation: landscape) {

  .text-wrapper.mobile-invisible-header .carousel-heading,
  .text-wrapper.mobile-invisible-header .hub-carousel-heading,
  .text-wrapper.mobile-invisible-header .dash-bottom,
  .text-wrapper.mobile-invisible-caption .caption,
  .text-wrapper.mobile-invisible-header-caption .carousel-heading,
  .text-wrapper.mobile-invisible-header-caption .hub-carousel-heading,
  .text-wrapper.mobile-invisible-header-caption .dash-bottom,
  .text-wrapper.mobile-invisible-header-caption .caption {
    visibility: hidden;
  }
  
}
.login a {
  float: right;
  margin-top: 0px;
  color: #000000;
  text-decoration: none;
}

.login a:hover {
  text-decoration: none;
}

.login .dropdown {
  min-height: 51px; /*fixes 1 pixel jump*/
  margin-right: 60px;
}

.hideLabel {
  display: none !important;
}

.login .dropdown a.dropdown-trigger {
  padding: 10px 15px;
  border: 1px solid transparent;
}

.login a .signin-text,
.login .icon-signin {
  font-size: 16px;
  font-family: "GillSansforJL", Arial, Helvetica, sans-serif;
  font-weight: 200;
  letter-spacing: 0.5px;
  line-height: 22px;
  color: #000000;
}

.login a .signin-text {
  padding-right: 6px;
}

.login .dropdown-menu {
  text-align: left;
  float: none;
  clear: both;
  right: 0;
  top: 46px;
  left: auto;
  min-width: 360px;
  opacity: 0;
  visibility: hidden;
  /*-webkit-transform-origin: top;
	transform-origin: top;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-transform: scale(1, 0);
	display: block; 
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;*/
  padding: 0px;
}

.login .dropdown.open a.dropdown-trigger {
  padding: 10px 15px;
  background-color: #ffffff;
  position: relative;
  z-index: 51;
  color: #000000;
  text-decoration: none;
}

.login .dropdown a.dropdown-trigger:hover,
.login .dropdown a.dropdown-trigger:focus,
.login .dropdown a.dropdown-trigger:active,
.login .dropdown.open a.dropdown-trigger:hover,
.login .dropdown.open a.dropdown-trigger:focus,
.login .dropdown.open a.dropdown-trigger:active {
  text-decoration: none;
  color: #000000;
}

.login .dropdown.open .dropdown-menu {
  display: block;
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
  opacity: 1;
  visibility: visible;
  background-color: #ffffff;
  border-radius: 0;
  z-index: 999;
  border: 1px solid #d8d8d8;
  box-shadow: none;
  margin-top: 7px;
}

.login .dropdown.open .dropdown-menu:after,
.login .dropdown.open .dropdown-menu:before {
  bottom: 100%;
  left: 334px;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

.login .dropdown.open .dropdown-menu:after {
  border-color: rgba(136, 183, 213, 0) rgba(136, 183, 213, 0) #fff;
  border-width: 10px;
  margin-left: -10px;
}

.login .dropdown.open .dropdown-menu:before {
  border-color: rgba(194, 225, 245, 0) rgba(194, 225, 245, 0) #d8d8d8;
  border-width: 11px;
  margin-left: -11px;
}

.dropdown-menuHeader {
  display: -webkit-flex;
  display: -moz-box;
  display: flex;
  padding: 16px;
  text-align: center;
  border-bottom: 1px solid #d8d8d8;
}

.dropdown-menuHeader h3 {
  -webkit-flex: 1 1;
  -moz-box-flex: 1;
  flex: 1 1;
  margin: 0;
  color: #141414;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 1.07px;
  line-height: 32px;
  text-transform: uppercase;
}

.dropdown-menuHeader button {
  display: none;
}

@media only screen and (min-width: 1024px) {
  .dropdown-menuHeader button {
    display: block;
  }
}

@media only screen and (min-width: 1280px) {
  .dropdown-menuHeader button {
    display: block;
  }
}

.login ul.dropdown-menu li {
  display: block;
  float: none;
}

.login .dropdown-menu > li > a {
  float: none;
  display: block;
  padding: 11px 16px;
  border-bottom: 1px solid #d8d8d8;
  background: transparent;
  color: #000000;
  font-family: "GillSansforJL", Arial, Helvetica;
  font-weight: 200 !important; /*font-weight for Gill Sans Nova for JL Light*/
  font-size: 16px;
}

.login .dropdown-menu > li > a:active {
  background-color: #f2f2f2;
}

.login .dropdown-menu > li > a:hover,
.login .dropdown-menu > li > a:focus,
.login .dropdown-menu > li > a:active {
  color: #000000;
}

.login .dropdown-menu > li > a.last {
  border-bottom: none;
}

@media all and (max-width: 768px) {
  .login .dropdown a.dropdown-trigger {
    padding: 0;
    text-align: center;
  }

  .login .dropdown.open a.dropdown-trigger {
    padding: 0;
    background-color: transparent;
    border: 1px solid transparent;
    text-align: center;
  }

  .login .dropdown .dropdown-menu {
    top: 62px;
    opacity: 1;
    border-style: none none solid none;
    transform: translateX(100%);
    margin-top: 0px;
  }

  .login .dropdown.open .dropdown-menu {
    top: 91px;
    display: block;
    opacity: 1;
    visibility: visible;
    background-color: #ffffff;
    border-style: solid none solid none;
    transform: translateX(0);
    margin-top: -2px;
  }

  .login .dropdown.open .dropdown-menu:after {
    border-width: 0px;
    margin-left: 0px;
  }

  .login .dropdown.open .dropdown-menu:before {
    border-width: 0px;
    margin-left: 0px;
  }

  .login-overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    background: rgba(0, 0, 0, 0.74);
    left: 0;
    top: 200px;
    z-index: 49;
  }

  .signIn-off-canvas-content-nav.mobile-nav-active {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    background-color: white;
    border-bottom: 1px solid #000000;
    padding: 0 0px;
  }
}

@media only screen and (max-width: 359px) {
  .login .dropdown-menu {
    min-width: 0px;
  }
}

/* JB HA2 Changes here  */

@media only screen and (max-width: 768px) {
  .dropdown .blk span {
    display: block;
    clear: both;
    font-size: 14px;
  }

  .userIcon {
    margin-top: 6px;
    margin-bottom: 1px;
  }

  .header-signup-active .userIcon {
    margin-top: 6px;
    margin-bottom: 2px;
  }
  .signin-text {
    width: 39px;
  }
  .login a .signin-text {
    padding-right: 0px;
  }
}

.hdr-wide,
.dropdown .blk span.hdr-wide {
  display: none;
}
.hdr-narrow {
  display: none;
}

@media only screen and (max-width: 768px) {
  .hdr-narrow {
    display: block;
  }
}
@media only screen and (min-width: 769px) {
  .hdr-wide,
  .dropdown .blk span.hdr-wide {
    display: block;
  }

  .login .dropdown {
    margin-right: 0px;
  }
}

/** FORM ELEMENT STYLES Start**/

.checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], .radio input[type=radio], .radio-inline input[type=radio] {
    margin-left: 0 !important; /*need to remove */
}

.form_leftcolmark,
.form_leftcollabel {
    display: none !important;
}

form {
    padding:0;
    margin: 0;
}
.formRow {
    clear: both;
    margin-bottom: 0px; /*development purpose only - needs to remove after done */ 
}

.form-title {
    font-size: 24px;
    line-height: 28.8px;
    font-family: 'GillSansforJL';
    font-weight: 200;
    padding-bottom: 10px;
    margin: 20px 0;
    border-bottom:1px solid #d8d8d8;
}

#customer_service_form .text-copy {
    font-size:12px;
    line-height: 16.8px;
    color: #000000;
}

.form-hr {
    margin-top: 40px;
    margin-bottom: 40px;
    border: none;
    border-bottom: 1px solid #d8d8d8;
}
.form-hr-last {
    margin-bottom: 20px !important;
}

.formRow .row {
    margin-left: -15px;
    margin-right: -15px;
}
.formRow label {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    font-size:16px;
    line-height: 22.4px;
    color: #000000;
    vertical-align: middle;
}
.form-label {
    overflow: hidden;
}
.email {
    display: none;
}
.form-label label {
    /*float:left; as icon not required, so float left not required either */ 
}

/* icon is disabling, as not developing the functionality for now
.form-label .icon {
    float: right;
    margin-top: 1px;
}*/

.form-label .icon a {
    display: inline-block;
    background: #b4b2ae;
    border-radius: 15px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    text-decoration: none;
    cursor: pointer;
}
.form-label .icon .icon-question-mark {
    font-size: 13px;
    color:#fff;
    width: 18px;
    min-width:1em;
}
.padding-reset {
    padding-left:0;
    padding-right: 0;
}
/* INPUT ELEMENT */

/* common for all form elements */
input.text, select, textarea {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    padding-left: 10px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
    font-size: 16px;
    line-height: 22.4px;
    color: #000000;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border:1px solid #b4b2ae;
}

@-moz-document url-prefix() {
    select {
        -moz-appearance: none;
        text-indent: 0.01px;
        text-overflow: '';
    }
}

input.text:focus,
select:focus,
textarea:focus {
    outline: none;
}
select::-ms-expand {
    display: none;
}
/** postcode sepecific styles **/

input.text.post-code {
    width: auto;
    display: inline-block;
}

.postcodeBox .btn-container {
    display: inline-block;
}

a.postCodeButton, .postCodeDropdown {
    display: none;
}

/** select specific styles **/
select {
    color: #999999;
}
/** textarea specific styles **/
textarea {
    height: auto;
    resize: none;
}

.textarea .sub-text {
    margin-top: 10px;
}

.textarea .sub-text p {
    margin:0;
    font-weight: bold;
}

.textarea .sub-text p.max-char {
    font-weight: normal;
    margin-bottom: 10px;
}

.textarea .max-chars {
    margin-bottom: 10px;
}

.textarea .form-label label {
    font-weight: normal;
    border-bottom: 1px solid #d8d8d8;
    padding-bottom: 10px;
    width: 100%;
}

.formRow.submit {
    margin: 40px 0;
    text-align: center;
}

/* error and active css */
input.text.active,
select.active,
textarea.active {
    background: #edf7ec;
    border:1px solid #000000;
}

.formRow .fieldErrorDesc,
.form_error {
    margin-top: 5px;
}

.formRow.error label,
.formRow .fieldErrorDesc {
    color:#cc0000;
}
.formRow.error input.text,
.formRow.error textarea,
.formRow.error select {
    background: #fefafb;
    border:1px solid #cc0000;
}
.postcode-error {
	display:none;
}
.postcode-error.fieldErrorDesc {
	color:#cc0000;
}

.addressline-input {
    margin-bottom: 20px;
}

.renewal-text {
    margin-bottom: 30px;
}

.policy-text {
    margin-bottom: 40px;
}

.policy-text .text-copy p:first-of-type {
    margin-bottom: 20px;
}

/* Select styles */
.select {
    position: relative;
    display: inline-block;
    width: 100%;
    cursor: pointer;
}

.select-arrow {
    position: absolute;
    top: 5px;
    right: 10px;
    border-left: 1px solid #d8d8d8;
    padding-top: 4px;
    pointer-events:none;
}
.select-arrow .icon-chveron_down {
    color: #000000;
}

/** CHCECKBOX & RADIO **/

/* Base for label styling */
.checkbox-custom, .radio-custom {
    opacity: 0;
    position: absolute;   
}
.checkbox-custom-label, .radio-custom-label {
    position: relative;
}
input.checkbox-custom:not(:checked),
input.checkbox-custom:checked {
    position: absolute;
    left: -9999px;
}
input.checkbox-custom:not(:checked) + .checkbox-custom-label,
input.checkbox-custom:checked + .checkbox-custom-label {
    position: relative;
    padding-left: 25px;
    cursor: pointer;
}
/* checkbox aspect */
input.checkbox-custom:not(:checked) + .checkbox-custom-label:before,
input.checkbox-custom:checked + .checkbox-custom-label:before {
    content: '';
    position: absolute;
    left:0; 
    top: 1px;
    width: 18px;
    height: 18px;
    border: 1px solid #b4b2ae;
    -webkit-border-radius:2px;
    -moz-border-radius:2px;
    border-radius: 2px;
    background: #fff;
}
/* checked mark aspect */

input.checkbox-custom:not(:checked) + .checkbox-custom-label:after,
input.checkbox-custom:checked + .checkbox-custom-label:after {
    font-family: "jl-icon";
    content: '';
    position: absolute;
    top: -1px;
    left: 3px;
    font-size: 13px;
    color: #000000;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -ms-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s;
}

/* checked mark aspect changes */
input.checkbox-custom:not(:checked) + .checkbox-custom-label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}
input.checkbox-custom:checked + .checkbox-custom-label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}
/* disabled checkbox */
input.checkbox-custom:disabled:not(:checked) + .checkbox-custom-label:before,
input.checkbox-custom:disabled:checked + .checkbox-custom-label:before {
    background-color: #eee;
}
input.checkbox-custom:disabled:checked + .checkbox-custom-label:after {
    color: #000000;
}
input.checkbox-custom:disabled + .checkbox-custom-label {
    color: #000000;
}

/** RADIO CUSTOM ONLY **/
.radio-custom-label {
    background: #f9f8f6;
    border: 1px solid #b4b2ae;
    padding: 6px 24px 6px 8px !important;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.radio-custom-label:before {
    background: #000000;
    box-shadow: inset 0px 0px 0px 6px #fff;
}
.radio-custom:checked + .radio-custom-label:before {
    background: #000000;
    box-shadow: inset 0px 0px 0px 6px #fff;
}
.radio-custom:checked + label {
    background: #000000;
    border: 1px solid #000000;
    color: #fff !important;
}
.radio-custom:checked + .radio-custom-label:before {
    border: none !important;
}
.radio-custom + .radio-custom-label:before {
    content: '';
    background: #fff;
    border:1px solid #b4b2ae !important;
    border: none;
    display: inline-block;
    vertical-align: text-bottom;
    width: 18px;
    height: 18px;
    margin-right: 5px;
    margin
    margin-top: -1px;
    text-align: center;
}
.radio-custom + .radio-custom-label:before {
    border-radius: 50%;
}

.captcha-image-container {
    overflow: hidden;
    margin-top: 10px;
}

.form_error{
    color: #cc0000 ;
}

.form-btn.reset {
    height: 34px;
    padding: 7px 40px;
    font-size: 16px;
}

/** Buttons **/
.form-btn {
    display: inline-block;
    margin-bottom: 16px;
    height: 49px;
    padding: 11px 50px;
    font-family:'GillSansforJL';
	font-weight: 400;	/*font-weight for Gill Sans Nova for JL Medium*/
    font-size: 18px;
    text-decoration: none;
    border:0px;
    white-space: nowrap; /* fixing the issue text drop*/
}

.form-btn.primary {
    background: #000000;
    color: #ffffff;
    font-weight: 700;	/*font-weight for Gill Sans Nova for JL Medium*/
    transition: background 0.2s;
    transition-timing-function: ease-in;
    border-radius: 2px;
}
.form-btn.secondary {
    background: transparent;
    color: #000000;
    font-weight: 700;	/*font-weight for Gill Sans Nova for JL Medium*/
    border: 2px;
    border-style: solid;
    border-color: #000000;
    transition: background 0.2s;
    transition-timing-function: ease-in;
    border-radius: 2px;
}

.form-btn.primary:hover {
    background: #1DB954;
    text-decoration: none;
}
.form-btn.secondary:hover {
   /* color: #6b6b6b; */
    border-color:  #1DB954;
    text-decoration: none;
}

/*
.formRow.submit span:after {
    font-family: "jl-icon";
    content: "";
    font-style: normal;
    font-weight: normal;
    speak: none;
    font-size: 11px;
    padding-left: 10px;
    position: relative;
    top: -2px;
}
*/

.btn-container .postcode-btn {
   background: #747477;
   color:#fff;
}


@media only screen and (min-width : 481px) and (max-width : 768px) {

    .form-title {
        font-size: 22px;
        line-height: 26.4px;
    }

    .formRow.submit {
        margin: 40px 0 20px 0;
    }

}

@media only screen and (min-width : 320px) and (max-width : 480px)  {
    
    .form-title {
        font-size: 22px;
        line-height: 26.4px;
    }

    .form-hr {
        margin-top: 30px;
        margin-bottom: 30px;
    }

    .form-hr-last {
        margin-bottom: 15px !important;
    }


    .form-btn {
        width: 100%;
    }

    .form-element .btn-container .postcode-btn {
        width: auto;
        padding: 6px 12px;
    }

    input.text.post-code {
        width: 50%;
    }
    .formRow.submit {
        margin: 30px 0;
    }
}

/** FORM ELEMENT STYLES END**/

/** Separator CSS **/

	.separator.option1 { 
		margin-bottom: 0;
	}
	.separator.option2 { 
		margin-bottom: 20px;
	}
	.separator.option3 { 
		margin-bottom:  40px;
	}
	.separator.option4 { 
		margin-bottom: 80px; 
	}
	.separator.option5 { 
		margin-bottom: 120px; 
	}
	.separator.option6 { 
		margin-bottom: 160px;
	}

/* Tablet media query */
@media only screen and (min-width : 481px) and (max-width : 768px) {
	
	.separator.option1 { 
		margin-bottom:0;
	}
	.separator.option2 { 
		margin-bottom: 15px;
	}
	.separator.option3 { 
		margin-bottom: 30px; 
	}
	.separator.option4 { 
		margin-bottom: 60px;
	}
	.separator.option5 { 
		margin-bottom: 90px;
	}
	.separator.option6 { 
		margin-bottom: 120px;
	}
}

/* Mobile media query */
@media only screen and (min-width : 320px) and (max-width : 480px) {
	
	.separator.option1 { 
		margin-bottom:0;
	}
	.separator.option2 { 
		margin-bottom: 15px; 
	}
	.separator.option3 { 
		margin-bottom: 30px;
	}
	.separator.option4 { 
		margin-bottom: 60px;
	}
	.separator.option5 { 
		margin-bottom: 90px;
	}
	.separator.option6 { 
		margin-bottom: 120px;
	}
}

/** Separator CSS END **/

/* SVG Image component Start */
    .svg-image-wrapper img.svgMedium,  .svg-image-wrapper a.svgSmall img {
    	max-width: 75%;
    }
    .svg-image-wrapper img.svgSmall, .svg-image-wrapper a.svgSmall img {
    	max-width: 50%;
    }
    .svg-image-wrapper img.svgTiny,  .svg-image-wrapper a.svgTiny img {
    	max-width: 25%;
    }
/* SVG Image component End */


/* Single Article component Start */
.related-articles.sidebar .thumbnail{
    padding: 0;
    border-radius: o;
    background-color: transparent;
    -webkit-transition: none;
    transition: none;
    border: 1px solid #dedbd2;
    border-style: none none solid none;
}

.related-articles.sidebar .thumbnail img{
    margin-bottom: 20px;
    width: 100%;
}

.related-articles.sidebar .thumbnail .caption{
    padding: 0;
    font-size: 16px;
}

.related-articles.sidebar .thumbnail .caption .title{
    font-family: 'GillSansforJL';
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 10px;
}

.related-articles.sidebar .thumbnail .caption .title .title-link,
.related-articles.sidebar .thumbnail .caption .title .title-link:hover,
.related-articles.sidebar .thumbnail .caption .title .title-link:focus,
.related-articles.sidebar .thumbnail .caption .title .title-link:active,
.related-articles.sidebar .thumbnail .caption .title .title-link:visited{
    text-decoration: none;
    font-family: 'GillSansforJL';
    font-size: 20px !important;
    line-height: 24px;
}



.related-articles.sidebar .thumbnail .caption .title .title-link:after{
    font-family: "jl-icon";
    content: "";
    font-style: normal;
    font-weight: normal;
    speak: none;
    font-size: 11px;
    padding-left: 10px;
    /*color: #fff;*/
    position: relative;
    top: -2px;
    text-decoration: none;
}
}

.related-articles.sidebar  .thumbnail .caption .caption-text{
    font-size: 16px;
    line-height: 22.4px; 
    margin-bottom: 10px;
}

.thumbnail .caption .article-rating{
    margin-bottom: 20px;
}

.related-articles.sidebar .thumbnail .caption .article-rating .icon-stars_10{
    font-size: 12px;
    margin: 0;
    display: block;
    float: left;
}

.related-articles.sidebar .thumbnail .caption .article-rating .icon-stars_10:before{
    color: #b4b2ae;
    margin: 0;
}

.related-articles.sidebar .thumbnail .caption .article-rating.star-1 > i:nth-child(1):before,
.related-articles.sidebar .thumbnail .caption .article-rating.star-2 > i:nth-child(1):before,
.related-articles.sidebar .thumbnail .caption .article-rating.star-2 > i:nth-child(2):before,
.related-articles.sidebar .thumbnail .caption .article-rating.star-3 > i:nth-child(1):before,
.related-articles.sidebar .thumbnail .caption .article-rating.star-3 > i:nth-child(2):before,
.related-articles.sidebar .thumbnail .caption .article-rating.star-3 > i:nth-child(3):before,
.related-articles.sidebar .thumbnail .caption .article-rating.star-4 > i:nth-child(1):before,
.related-articles.sidebar .thumbnail .caption .article-rating.star-4 > i:nth-child(2):before,
.related-articles.sidebar .thumbnail .caption .article-rating.star-4 > i:nth-child(3):before,
.related-articles.sidebar .thumbnail .caption .article-rating.star-4 > i:nth-child(4):before,
.related-articles.sidebar .thumbnail .caption .article-rating.star-5 .icon-stars_10:before{
    color: #000000;
}

/* Single Article component End */



/* Video Component - Start */

/* unfortunatelly !impotrant had to be added to overwrite the JW Player styles added via JavaScript */
.video-container .jwplayer,
.video-container .jwplayer:focus{
    outline: none;
}

.video-container .jwclick{
    border: none!important;
}

.video-container .jwclick_item{
    display: none!important;
}

/* Play Button Styles*/
.video-container .jwplayer .jwdisplayIcon,
.video-container .jw-tab-focus .jwdisplayIcon, 
.video-container .jwplayer .jwdisplay:hover .jwdisplayIcon {
    opacity: 1;
    cursor: pointer;
    display: table;
    width: 130px!important;
    height: 130px!important;
    border-radius: 100%!important;
    padding: 0px!important;
    background-image: none!important;
    background-color: rgba(255, 255, 255, 0.3)!important;
    position: absolute!important;
    left: 50%!important;
    top: 50%!important;
    transform: translatex(-50%) translateY(-50%) !important;
}

.video-container .jwplayer .jwdisplay .jwicon {
    background-image: none!important;
    width: 0!important;
    height: 0!important;
    border-style: solid;
    border-width: 37px 0 37px 54px;
    border-color: transparent transparent transparent #ffffff!important;
    position: absolute!important;
    left: 50%!important;
    top: 50%!important;
    transform: translatex(-35%) translateY(-50%) !important;
}

@media only screen and (min-width : 320px) and (max-width : 480px) {
    .video-container .jwplayer .jwdisplayIcon,
    .video-container .jw-tab-focus .jwdisplayIcon, 
    .video-container .jwplayer .jwdisplay:hover .jwdisplayIcon {
        width: 70px!important;
        height: 70px!important;
        transform: translatex(-50%) translateY(-25%) !important;
    }

    .video-container .jwplayer .jwdisplay .jwicon {
        border-width: 17px 0 17px 34px!important;
    }
}
/* Video Component - End */
/* Footer Sign Up Form CSS BEGINS*/

.footer-sign-up-form-wrapper .outer-wrapper {
  text-align: center;
  padding: 15px 0px 20px 0px;
}


body.modal-open .email-signup-modal {
  display: block;
  z-index: 5001; /* set that height to display above the nav hamburger*/
}

.email-signup-modal.success .modal-body-content {
  text-align: center;
  width: 100%;
}

.email-signup-modal .modal-dialog {
  width: 100%;
  max-width: 768px;
}

.email-signup-modal .modal-content {
  margin: 0 auto;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.email-signup-modal .modal-header {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 88px;
  padding: 18px;
}

.email-signup-modal .modal-header .modal-title {
  font-family: 'GillSansforJL', sans-serif;
  font-size: 20px;
}

.email-signup-modal .modal-body {
  padding: 18px;
}

.email-signup-modal .modal-body-content {
  background-color: #ffffff;
}

@media only screen and (min-width: 768px) {
  .email-signup-modal .modal-body {
    padding: 0;
  }

  .email-signup-modal .modal-body.form-background{
    background: var(--bg);
    background-size: 50% 724px;
    background-position: 100% 0;
  }

  .email-signup-modal .modal-body-content {
    width: 50%;
    padding: 18px;
  }
}

.email-signup-modal .close {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 44px;
  width: 44px;
  color: #000000;
  opacity: 1;
}

.email-signup-modal .close-wrapper {
  position: absolute;
  top: 25px;
  right: 16px;
}

.email-signup-modal .close .icon-close {
  font-size: 11px;
}

.email-signup-tooltip {
  font-weight: 400;
  margin-bottom: 24px;
}

.email-signup .tooltip-trigger {
  width: auto;
  height: auto;
  text-decoration: underline;
  padding-right: 23px;
  background-image: url(https://www.johnlewisfinance.com/etc/designs/jlf/clientlib/images/help.svg);
  background-repeat: no-repeat;
  background-position: center right;
}

.is-ie .email-signup .tooltip-trigger{
  background-size: 20px 20px; 
}

.email-signup .element,
.email-signup .formRow.submit {
  margin: 0 0 24px;
}

.email-signup .formRow label {
  font-family: 'GillSansforJL', sans-serif;
  font-weight: 400;
  font-size: 18px;
}

.email-signup .formRow input {
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  padding-left: 10px;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 200;
  font-size: 16px;
  line-height: 22.4px;
  color: #000000;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  box-shadow: none;
  border-radius: 2px;
  border: 1px solid #b4b2ae;
}

.email-signup .formRow input:focus {
  outline: none;
}

.email-signup .formRow input {
  height: 44px;
}

.email-signup .form-btn.primary {
  width: 100%;
}

.email-signup .form-btn.primary[disabled] {
  opacity: 0.5;
}

.email-signup a {
  text-decoration: underline;
}

.email-signup p>a {
  font-family: inherit !important;
}

/* Footer Sign Up Form CSS ENDS*/

/* CAROUSEL STYLES ONLY */

.promo-carousel-wrapper {
  width: 100%;
  max-width: 1800px;
  margin: 0 auto;
}

.promo-carousel-wrapper.is-author-inst{
  margin-bottom: 40px;
}

.promo-carousel-wrapper .promo-carousel.controls-disabled{
  padding-bottom: 0;
}

.promo-carousel-wrapper .slick-slider{
  padding-bottom: 40px;
  border: 1px solid #dedbd2;
  border-style: solid none;
}

.promo-carousel-wrapper .slick-slider,
.promo-carousel-wrapper .slick-slide {
  height: auto;
}

.promo-carousel-wrapper a.slide-content-link,
.promo-carousel-wrapper a.slide-content-link:hover,
.promo-carousel-wrapper a.slide-content-link:active, 
.promo-carousel-wrapper a.slide-content-link:focus {
    display: block;
    text-decoration: none;
} 

/* Custom Slick Carousel Styles */

.promo-carousel-wrapper .slick-slide .center-align img{
  margin: 0 auto;
}


.promo-carousel-wrapper .slick-next, 
.promo-carousel-wrapper .slick-prev {
  top: auto; 
  bottom: 5px;
  right: 15.1%;
  left: inherit;
  z-index: 20;
  width: 30px;
  height: 30px;
  color: #000;
  background-color: rgba(255,255,255,0.8);
  border-radius: 100%;
  display: block;
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-transition: opacity 0.2s ease-out;
  -moz-transition: opacity 0.2s ease-out;
  -o-transition: opacity 0.2s ease-out;
  transition: opacity 0.2s ease-out;
}

.promo-carousel-wrapper.is-author-inst .slick-next,
.promo-carousel-wrapper.is-author-inst .slick-prev{
  bottom: -40px;
}




.promo-carousel-wrapper .slick-prev {
  left: 15.1%;
  right: inherit;
}

.promo-carousel-wrapper .slick-prev /*, .slick-prev:hover*/ { /*TODO: Remove commented out Hover state ref*/
  color: #000;
  display: block;
}

.promo-carousel-wrapper .slick-next /*, .slick-next:hover*/ { /*TODO: Remove commented out Hover state ref*/
  color: #000;
  display: block;
  clear: both;
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  bottom: 5px;
  display: block;
}

.promo-carousel-wrapper .slick-prev:before, 
.promo-carousel-wrapper .slick-next:before {
  font-family: "Glyphicons Halflings", "slick", sans-serif;
  font-size: 19px;
  color: #000;
  opacity: 1;
}

.promo-carousel-wrapper .slick-prev:before {
  content: "\e257";
}

.promo-carousel-wrapper .slick-next:before {
  content: "\e258";
}

.promo-carousel-wrapper .slick-prev:hover,
.promo-carousel-wrapper .slick-next:hover{  
  background-color: rgba(255,255,255,1);
}


.promo-carousel-wrapper .slick-prev:focus,
.promo-carousel-wrapper .slick-next:focus{  
  background-color: rgba(255,255,255,1);
}

.promo-carousel-wrapper .slick-dots {
  bottom: 12px;
  color: transparent !important;
  padding: 0px;
  margin-left: 0;
}

.promo-carousel-wrapper .slick-dots li {
  padding: 0;
  margin: 0;
  width: 14px;
  height: 14px;
  line-height: 0px;
}

.promo-carousel-wrapper .slick-dots li button {
  padding: 0;
  margin: 0;
}

.promo-carousel-wrapper .slick-dots li:first-of-type {
  margin-left: 15px;
}

.promo-carousel-wrapper .slick-dots li:last-of-type {
  margin-right: 15px;
}

.promo-carousel-wrapper .slick-dots li button {
  display: inline-block;
  width: 8.5px;
  height: 8.5px;
  text-indent: -999px;
  cursor: pointer;
  background-color: #000\9;
  background-color: rgba(0,0,0,0);
  border: 1px solid #fff;
  border-radius: 10px;
  opacity: 1;
}

.promo-carousel-wrapper .slick-dots li.slick-active button {
  width: 8.5px;
  height: 8.5px;
  margin: 0;
  background-color: #fff;
}


.promo-carousel-wrapper .slick-dots li:after, 
.promo-carousel-wrapper .slick-dots li:before, 
.promo-carousel-wrapper .slick-dots li button:before {
  display: none; 
}






.hide {
  display: none ;
}

.show {
  display: block ;
}


@media only screen and (min-width : 769px){
  /* TODO Move Height to JSP */
  .promo-carousel-wrapper .slick-slider{
    height: auto;
  }
 
}


/* Retina desktop */
/* TODO Add retina desktop if required
@media
  only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 769px) and (max-width : 1800px),
  only screen and (  -moz-min-device-pixel-ratio: 2)  and (min-width: 769px) and (max-width : 1800px),
  only screen and (   -o-min-device-pixel-ratio: 2/1) and (min-width: 769px) and (max-width : 1800px),
  only screen and (       min-device-pixel-ratio: 2)  and (min-width: 769px) and (max-width : 1800px),
  only screen and (           min-resolution: 192dpi) and (min-width: 769px) and (max-width : 1800px),
  only screen and (            min-resolution: 2dppx) and (min-width: 769px) and (max-width : 1800px) {


}*/


/* Extra Small Devices and medium */ 
@media only screen and (min-width : 481px) and (max-width : 768px) {

  .promo-carousel-wrapper .slick-prev {
    left: -5px;
  }

  .promo-carousel-wrapper .slick-next {
    right: -5px;
  }


  .promo-carousel-wrapper .slick-dots {
    bottom: 12px;
    margin-bottom: 0;
  }
} /* TABLET media query */


/* Retina Tablet */
/*@media
  only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width : 481px) and (max-width : 768px),
  only screen and (  -moz-min-device-pixel-ratio: 2)  and (min-width : 481px) and (max-width : 768px),
  only screen and (   -o-min-device-pixel-ratio: 2/1) and (min-width : 481px) and (max-width : 768px),
  only screen and (       min-device-pixel-ratio: 2)  and (min-width : 481px) and (max-width : 768px),
  only screen and (           min-resolution: 192dpi) and (min-width : 481px) and (max-width : 768px),
  only screen and (            min-resolution: 2dppx) and (min-width : 481px) and (max-width : 768px) {



}*/


/*Retina mobile*/

/* @media 
  only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 320px) and (max-width : 480px),
  only screen and ( -moz-min-device-pixel-ratio: 2)   and (min-width: 320px) and (max-width : 480px),
  only screen and (   -o-min-device-pixel-ratio: 2/1) and (min-width: 320px) and (max-width : 480px),
  only screen and (     min-device-pixel-ratio: 2)    and (min-width: 320px) and (max-width : 480px),
  only screen and (           min-resolution: 192dpi) and (min-width: 320px) and (max-width : 480px),
  only screen and (            min-resolution: 2dppx) and (min-width: 320px) and (max-width : 480px) {



} */



/* component - popupAutoMsg start */
.alertPopUp{
		position: fixed;
      	margin: 10 auto;
        border: 1px solid #464646;
    	background-color:#ffffff;
      	width: 290px;
      	font-size: 16px;
   		line-height: 28.8px;
    	font-weight: 200;   	
    	margin-bottom: 15px;
      	z-index: 2;
      	opacity: 0.9;
    	padding:10px;
}

.text-copy .popUpText {
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-size: 16px;
    line-height: 24px;
    text-align: left;
    letter-spacing: 0.03em;
    color: #000000;
    font-weight: 200;
}

.alert-success{
	color:white;
}

.title-comp h2{
	color:black;
}

.popup-InnerContainer{
	padding:10px;
	border: 1px solid black;
    margin:1px;
}

.popupClose-container .demo-icon { /*cross*/
	left: 7px;
    position: relative;
    top: -7px;
    font-size: 13px;
    color: #000000;
}

.popupClose-container .close-btn {
    float:right;
    background-color: transparent;
    border: none;
}

.popupClose-container {
    color:#fff;
    font-size: 14px;
    overflow: hidden;
    margin-left:100px;
}

.popupButtonComponent .btn-container{
    margin-bottom:10px;
}

@media only screen and (min-width : 480px)  {
 .alertPopUp{
	   width: 350px;
  }

}

/* component - popupAutoMsg end */
/** social-media-share-wrapper CSS Start**/

.social-media-share-wrapper .social-media-link {
    display: inline-block;
    width: 30px;
    margin-right: 5px;
    }

    .social-media-share-wrapper .social-media-link:last-of-type {
        margin-right: 0;  
        }

   .social-media-share-wrapper .social-media-link a {
        display:block;
        }

   .social-media-share-wrapper .social-media-link a img {
        width:100%;
        }

/** social-media-share-wrapper CSS END **/
/** Generic Accordion Content CSS **/

#accordion {
    margin:0 0 0px 0;
}
#accordion .panel-default.genericAccordionContent {
    background-color: var(--phbgc);
}
#accordion .panel-default.genericAccordionContent .panel-heading {
    background-color: var(--phbgc) !important;
    padding: var(--phpadding) !important;
    position: relative;
    border-radius: 0px;
}
#accordion .genericAccordionContent .panel-heading {
    overflow: hidden;
    width: 100%;
}
#accordion .genericAccordionContent .panel-heading .text {
    float: left;
    width: 90%;
    display: inline-block;
}
#accordion .genericAccordionContent .panel-heading .icon {
    float: right;
    display: inline-block;
    position: absolute;
    right: 10px;
    top: 50%; /* to fix the concentrina temporary fix */
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}
#accordion .genericAccordionContent .panel-heading .icon .glyphicon {
    font-size: 40px;
    color: #000000;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
}
#accordion .genericAccordionContent .panel-heading p {
    margin: 0;
    font-size: 20px;
    line-height: 28px;
    text-align: left;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    color: #000000;
    font-weight:500;
}

#accordion .genericAccordionContent .panel-heading .panel-title.removeH4Styling p {
    font-size: 16px;
}

#accordion .genericAccordionContent .panel-heading .panel-title .demo-icon.icon-plus,
#accordion .genericAccordionContent .panel-heading .panel-title .demo-icon.icon-minus {
    color: var(--symCol);
}

#accordion .genericAccordionContent .panel-heading .icon .panel-title.removeSymbolHoverState a:hover,
#accordion .genericAccordionContent .panel-heading .icon .panel-title.removeSymbolHoverState a:focus {
    font-size: 20px;
}

#accordion .genericAccordionContent .panel-heading a,
#accordion .genericAccordionContent .panel-heading a:hover,
#accordion .genericAccordionContent .panel-heading a:focus {
    color: #000000 !important;
    text-decoration: none;
}

#accordion .genericAccordionContent a:hover,
#accordion .genericAccordionContent a:active,
#accordion .genericAccordionContent a:focus:hover {
    text-decoration: none;
}

#accordion .genericAccordionContent .panel.first .panel-heading {
    border-top: 0;
}

#accordion .genericAccordionContent .panel{
    box-shadow: none;
}


#accordion .genericAccordionContent .panel-heading {
    border: none;
    border-bottom: 1px solid #d8d8d8;
}

#accordion .genericAccordionContent .panel-heading.hidePanelHeadingBorder,
#accordion .genericAccordionContent .collapse.in.hidePanelHeadingBorder {
    border-bottom: none;
}

#accordion .genericAccordionContent .collapse{
    border: none;
}

#accordion .genericAccordionContent .collapse.in{
    border-bottom: 1px solid #d8d8d8;
}

#accordion .genericAccordionContent .panel-body {
    margin-bottom: 0;
    background-color: var(--pcbgc);
}

#accordion .genericAccordionContent .panel-collapse .panel-body {
    padding: var(--pcpadding) !important;
}

#accordion .genericAccordionContent .panel.last .panel-body {
    border-top: 0;
}

/** Generic Accordion Content CSS END **/
/** Generic Accordion Wrapper CSS **/

#accordion {
    margin:0 0 0px 0;
}
#accordion .panel-default .panel-heading {
    background: #fff;
    padding: 20px 10px;
    position: relative;
}
.panel-heading {
    overflow: hidden;
    width: 100%;
}
.panel-heading .text {
    float: left;
    width: 90%;
    display: inline-block;
}
.panel-heading .icon {
    float: right;
    display: inline-block;
    position: absolute;
    right: 10px;
    top: 50%; /* to fix the concentrina temporary fix */
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}
.panel-heading .icon .glyphicon {
    font-size: 40px;
    color: #000000;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 200;
}
#accordion .panel-heading p {
    margin: 0;
    font-size: 20px;
    line-height: 28px;
    text-align: left;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    color: #000000;
    font-weight:500;
}

#accordion .panel-heading a,
#accordion .panel-heading a:hover,
#accordion .panel-heading a:focus {
   color: #000000 !important;
   text-decoration: none;
}

#accordion a:hover,
#accordion a:active,
#accordion a:focus:hover {
    text-decoration: none;
}

#accordion .panel.first .panel-heading {
   border-top: 0;
}

#accordion .panel{
  box-shadow: none;
}


#accordion .panel-heading {
  border: none;
  border-bottom: 1px solid #d8d8d8;
}

#accordion .collapse{
  border: none;
}

#accordion .collapse.in{
  border-bottom: 1px solid #d8d8d8;
}

#accordion .panel-body {
  padding: 20px 10px 20px 10px !important;
  margin-bottom: 0;

}

#accordion .panel.last .panel-body {
   border-top: 0;
}


/* Used for non-desktop version of Horizontal Accordion on screens < 1000px */
@media (min-width: 1000px) {

    #accordion.hideOnDesktop {
        display: none;
    }

    #accordion.visibleForAuthor.hideOnDesktop {
        display: block;
    }

}

/** Generic Accordion Wrapper CSS END **/
   .firstQuestions { 
        font-family: 'GillSansforJL';
        font-weight: 400;
        font-size: 20px;
        letter-spacing: 0.5px;
        line-height: 28px;
        color: #000000;
    }

    .yesbutton { 
        margin-left:40px;
     }

    .secondQuestions { 
        margin-left:40px;
        margin-top:20px;
        font-family: 'GillSansforJL';
        font-weight: 400;
        font-size: 20px;
        letter-spacing: 0.5px;
        line-height: 28px;
        color: #000000;
     }    

    .secondNoButton { 
        margin-left:40px;
     } 

    .lastMessageDetailsb { 
        margin-left:40px;
     }

    .messageb { 
        margin-left:40px;
     }

/* Mobile media query */
@media only screen and (min-width : 320px) and (max-width : 480px) {
   .yesbutton { 
        margin-left:0px;
    	margin-top: 15px;
     }


    .secondQuestions { 
        margin-left:0px;
     }    

    .secondNoButton { 
        margin-left:0px;
     } 

    .lastMessageDetailsb { 
        margin-left:0px;
     }

    .messageb { 
        margin-left:0px;
     }
	.nestedSection {
       margin: 0 15px 0 15px;
    }

}    
.DT1-hide {
  display: none;
}

.DT1-checked {
  border: 2px solid black !important;
}

.DT1-Type {
  font-size: 16px;
  width: 320px;
}

.DT1-button {
  margin-left: 13px;
  margin-top: 13px;
  font-size: 16px;
  font-weight: 500;
}

.DT1-flow {
  display: none;
  width: 100%;
}

.DT1-Hdr {
  margin-bottom: 10px;
  border: none;
  font-size: 16px;
  font-weight: 400;
}

.DT1-container {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 16px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 1px solid #d8d8d8;
  height: 50px;
  width: 50%;
}

/* Hide the browser's default radio button */
.DT1-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.DT1-checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  background-color: white;
  border-radius: 50%;
  margin-left: 13px;
  margin-top: 14px;
  border: 1px solid #d8d8d8;
  transition: 0.4s;
}

/* When the radio button is checked, add a black background */
.DT1-container input:checked ~ .DT1-checkmark {
  background-color: white;
  border: 1px solid black;
  transition: 0.4s;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.DT1-checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.DT1-container input:checked ~ .DT1-checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.DT1-container .DT1-checkmark:after {
  top: 4px;
  left: 4px;
  width: 10px;
  height: 10px;
  border-radius: 60%;
  background: black;
}

.DT1-Question {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  margin-bottom: 15px;
}

.DT1-Type label:hover {
  border: 1px solid black;
}

@media only screen and (min-width: 320px) and (max-width: 580px) {
  .DT1-Type {
    width: 300px;
  }
}

@media only screen and (min-width: 581px) and (max-width: 768px) {
  /*ipad*/
  .DT1-Type {
    width: 452px;
  }
}

@media only screen and (min-width: 769px) {
  .DT1-Type {
    width: 452px;
  }
}

@media (max-width: 320px) {
  .DT1-Type {
    width: 250px;
  }
}

/*Sticky Navigation CSS Start*/

#navbar1 {
    overflow: hidden;
    text-align: center;    
    font-size: 18px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 400;
    z-index: 1000;
    letter-spacing: 0.5px;
    line-height: 22px;  
    background: #ffffff;    
    width: 100%;
}

#navbar1 a {
    float: left;
    text-align: left; 
}

#navbar1 .btn-container {
    padding-top: 21px;
    background-color: #ffffff;    
    display: flex;
    justify-content: space-between;    
}

.sticky-nav-link-only {
    padding: 12px 0px;
}


#navbar1 .btn-container .sticky-nav-link-only:focus {
    text-decoration: underline !important;
}

.sticky-nav-large-btn {
    font-size: 18px;
    font-weight: 400;
} 
    
.underline-link {
    text-decoration: underline !important;
}

.downarrow {
    display: none;
}

a.sticky-nav-mouseover-chevron:hover .downarrow {
    display: block;
    vertical-align: sub; 
    font-size: 18px;
    color: #186D5B; 
    margin-left: auto;
    margin-right: auto;  
}

/*navbar1 start styling for when there are 6 labels displayed*/

#navbar1 .label116:hover, #navbar1 .label216:hover, #navbar1 .label316:hover, #navbar1 .label416:hover, #navbar1 .label516:hover {
    text-decoration: underline !important;
    color: #186D5B;
}

/*navbar1 end styling for when there are 6 labels displayed*/

/*navbar1 start styling for when there are 5 labels displayed*/

#navbar1 .label120:hover, #navbar1 .label220:hover, #navbar1 .label320:hover, #navbar1 .label420:hover {
    text-decoration: underline !important;
    color: #186D5B;
}   

/*navbar1 end styling for when there are 5 labels displayed*/

/*navbar1 start styling for when there are 4 labels displayed*/

#navbar1 .label125:hover, #navbar1 .label225:hover, #navbar1 .label325:hover {
    text-decoration: underline !important;
    color: #186D5B;
}

/*navbar1 end styling for when there are 4 labels displayed*/


/*navbar1 start styling for when there are 3 labels displayed*/

#navbar1 .label133:hover, #navbar1 .label233:hover {
    text-decoration: underline !important;
    color: #186D5B;
}

/*navbar1 end styling for when there are 3 labels displayed*/

/*navbar1 start styling for when there are 2 labels displayed*/

#navbar1 .label150:hover {
    text-decoration: underline !important;
    color: #186D5B;
}

/*navbar1 end styling for when there are 2 labels displayed*/

/*navbar1 start styling for when there is 1 label displayed*/

#navbar1 a {
    text-align: center; 
}

/*navbar1 end styling for when there is 1 label displayed*/                                

.addPadding {
    padding-top: 60px;
}

/* Mobile media query */


/*display up to 3 if available*/
@media only screen and (min-width : 481px) and (max-width : 750px) {

    .label314, .label414, .label514, .label614, 
    .label316, .label416, .label516, 
    .label320, .label420,
    .label325 {
    	display: none;
    } 

}

/*display only CTA*/
@media only screen and (min-width : 320px) and (max-width : 480px) {

    #navbar1 a {
        text-align: center;
        width: 100%;
    }

    .label114, .label214, .label314, .label414, .label514, .label614,
    .label116, .label216, .label316, .label416, .label516,
    .label120, .label220, .label320, .label420,
    .label125, .label225, .label325,
    .label133, .label233,
    .label150 {
        display: none;
    }

	#navbar1 .btn-container{
  		padding-top: 20px;
        height: 88px;                            
	} 

}

/*Sticky Navigation CSS End*/
/*Sticky Navigation Insert CSS Start*/

.stickyNavAnchor {
    display: block;
    position: relative;
    top: -78px;
    visibility: hidden;
}

/*Sticky Navigation Insert CSS End*/
/** haBox CSS **/

.ha-box-left {
    height: 210px;
    width: 100%;
    margin: 0 0 0 0;
    padding: 20px 20px 40px 20px;
    float:left;
    box-shadow: 0px 7px 10px 2px #DCDCDC; 
}
.ha-box-right {
    height: 210px;
    width: 100%;    
    margin: 0 0 0 0;
    padding: 20px 20px 40px 20px;
    float:left;
    box-shadow: 0px 7px 10px 2px #DCDCDC;        
}

.ha-box-img {
    width: 20%;
    float:left;
    padding-top: 20px;
    padding-right: 10px;    
}

.ha-box-img img {
    width: 100%;
    float:left;
    padding-top: 20px;
    padding-right: 10px;    
}    

.ha-box-txt {
    width: 80%;
    float:left;
    font-weight: 500;
    font-size: 16px;
}

.ha-box-txt-title {
    padding-bottom: 20px;
    font-size: 24px;
    line-height: 22px;
    font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
    font-weight: 500;
    padding: 0px;
    margin-bottom: 25px;
    color: #000000;
    text-align: left;
} 

.left-link-text {
    color: #000000; 
    text-decoration: underline;
    word-wrap: break-word;
    text-align: left;
    font-size:16px;
}

.right-link-text {
    color: #000000; 
    text-decoration: underline;
    word-wrap: break-word;
    text-align: left;
    font-size:16px; 
}

/* Tablet media query */
@media only screen and (min-width : 481px) and (max-width : 768px) {
.ha-box-left {
    margin-bottom: 15px;
    height: 100%;
    padding-left: 15px;   
    padding-top: 20px; 
    padding-bottom: 20px;           
}
	
.ha-box-right {
    margin-bottom: 15px;
    height: 100%;    
    padding-left: 15px;
    padding-top: 20px; 
    padding-bottom: 20px; 
 }

.ha-box-img {
    padding-right: 5px;    
}

.ha-box-img img {    
    width: 90%;
    padding-right: 5px; 
    padding-top: 10px;
}  

}
	
/* Mobile media query */
@media only screen and (min-width : 320px) and (max-width : 480px) {
	
.ha-box-left {
    margin-bottom: 15px;
    height: 100%; 
    padding-left: 15px;   
    padding-top: 20px; 
    padding-bottom: 20px;            
}
	
.ha-box-right {
    margin-bottom: 15px;
    height: 100%;   
    padding-left: 15px;   
    padding-top: 20px; 
    padding-bottom: 20px; 
 } 

.ha-box-img {  
    width: 25%;   
    padding-right: 0px;
}

.ha-box-img img {  
    width: 100%; 
    padding-top: 19px; 
    padding-right: 15px;
} 

.ha-box-txt {
    width: 75%;   
    float:left;
}    

}

/** haBox CSS END **/

/** HATableTerms CSS start **/
.HA-wrapper {
	position: relative;
	overflow-x: auto;
}

.HA-sticky-col {
	position: -webkit-sticky;
	position: sticky;
	background-color: white;
	left: 0px;
	background-clip: padding-box;
}

.HA-table {
	width: 620px;
	border-collapse: collapse;
}

.HA-table th,
.HA-table td {
	border: 1px solid #000000;
}

.HA-table > tbody > tr:last-child td:first-child {
	border-bottom: 0px;
}

.HA-table th.HA-Header {
	border: none;
	padding-bottom: 4px;
	text-align: center;
	font-size: 20px;
	font-weight: 500;
	line-height: 28px;
}

.HA-table th.HA-HeaderCol {
	border-top: none;
	border-bottom: none;
	border-left: none;
}

.HA-table th.HA-HeaderCol1 {
	border-top: none;
	border-bottom: none;
	border-right: none;
}

.HA-table th.HA-HeaderCol2 {
	border-top: none;
	border-bottom: none;
	border-left: none;
	border-right: none;
}

.HA-table th.HA-HeaderCol3 {
	border-top: none;
	border-bottom: none;
	border-left: none;
}

.HA-table td.HA-All-Tiers {
	line-height: 24px;
	padding-top: 20px;
	padding-bottom: 10px;
	border-right: none;
	border-left: none;
	text-align: center;
}

.HA-table td.HA-MoreDetails {
	text-align: right;
	padding: 13px 11px 0 0;
}

div.HA-All-Tiers {
	font-size: 20px;
	font-weight: 500;
}

.HA-table td.HA-type1 {
	line-height: 22px;
	height: 70px;
	font-size: 16px;
	text-align: left;
	border-left: none;
	border-top: none;
	font-weight: 500;
}

.HA-table td.HA-type2 {
	border-top: none;
	text-align: center;
	font-size: 20px;
    font-weight: 500;
    line-height: 28px;
}

.HA-table tr.HA-type3 {
	font-size: 16px;
	font-weight: 500;
	text-align: left;
	line-height: 22px;
}

.HA-table td.HA-center {
	text-align: center;
}

.HA-chevron {
	vertical-align: sub;
	font-size: 18px;
}

a.coverDetailsCollapse {
	text-decoration: none;
	font-size: 18px;
}

span.coverDetailsCollapse {
	font-family: GillSansforJL, arial !important;
	color: black;
	font-weight: 500;
	font-size: 20px;
	font-family: inherit;
	text-decoration: underline;
	line-height: 28px;
}

a.coverDetailsExpand {
	text-decoration: none;
	font-size: 18px;
}

span.coverDetailsExpand {
	font-family: GillSansforJL, arial !important;
	color: black;
	font-weight: 500;
	font-size: 20px;
	font-family: inherit;
	text-decoration: underline;
	line-height: 28px;
}

.HA-topLabel {
	font-weight: 500;
	font-size: 16px;
	line-height: 22px;
	margin-top: -16px;
}

@media only screen and (min-width : 769px) {
	.HA-wrapper {
		margin: 0 auto;
		width: 618px;
		overflow-x: initial;
	}
}

@media only screen and (min-width : 581px) and (max-width : 768px) { /*ipad*/	
	.HA-wrapper {
		margin: 0 auto;
		width: 618px;
		overflow-x: initial;
	}
}

@media only screen and (min-width : 0px) and (max-width : 580px) {
	.HA-wrapper {
		position: relative;
		overflow-x: auto;
		margin-left: 10px;
		margin-right: 5px;
		width: auto!important; /*enables scroll*/
	}

	.HA-table td.HA-MoreDetails {
		text-align: left;
		padding: 13px 0px 0 12px;
	}

	.HA-table {
		/* width: 620px; */
		border-collapse: inherit;
	}

}

.HA-help {
	display: inline-block;
	vertical-align: top;
	margin-top: 1px;
}

.tooltip-inner {
	max-width: 337px;
	background-color: #000000;
	color: white;
	width: 237px;
	font-weight: 300;
	font-size: 16px;
	border-left: 16px;
	border-right: 16px;
	line-height: 20px;
	height: auto;
	font-family: GillSansforJL, arial;
	letter-spacing: normal;
}

.tooltip-ex {
	position: relative;
	display: inline-block;
}

/** HATableTerms CSS End **/
/* Generic calculator CSS start **/
  .calc-heading:after {
    content: "\2212";
    color: #000000;
    font-weight: bold;
    font-size: 20px;
    float: right;
    margin-right: 15px;
  }
  
  .calc-hide{
      display: none;
      visibility: hidden;
  }

  .calc-active:after {
    content: '\002B';
  }

  #calc-container {
    margin: 0 10px 0 10px;      
    width: auto;
}

#calc-container .panel-default .panel-heading {
    background: #fff;
    padding: 10px 10px;
    position: relative;
}

#calc-container .panel-heading {
    overflow: hidden;
    /* width: 100%; */
}

#calc-container .panel-heading .text {
    width: 90%;
    display: inline-block;
}

#calc-container .panel-heading .icon {
    display: inline-block;
    position: absolute;
    right: 10px;
    top: 50%;
    /* to fix the concentina temporary fix */
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

#calc-container .panel-heading .icon .glyphicon {
    font-size: 40px;
    color: #000000;
    font-family: 'GillSansforJL', Arial, Helvetica, sans-serif;
    font-weight: 200;
}

#calc-container .panel-heading p {
    margin: 0;
    font-size: 20px;
    line-height: 28px;
    text-align: left;
    font-family: 'GillSansforJL', Arial, Helvetica, sans-serif;
    color: #000000;
    font-weight: 500;
}

#calc-container .panel-heading a,
#calc-container .panel-heading a:hover,
#calc-container .panel-heading a:focus {
    color: #000000 !important;
    text-decoration: none;
    font-size: 22px;
    line-height: 42px;
    font-weight: 500;
}

#calc-container a:hover,
#calc-container a:active,
#calc-container a:focus:hover {
    text-decoration: none;
}

#calc-container .panel.first .panel-heading {
    border-top: 0;
}

#calc-container .panel {
    box-shadow: none;
}

#calc-container .panel-heading {
    border: none;
}

#calc-container .collapse {
    border: none;
}

#calc-container .panel-body {
    padding: 1px 0px 8px 10px !important;  
    margin: 5px 0px 5px 0px;
    border-left: 5px solid transparent;
    border-top: transparent;
    border-bottom: transparent;
    border-right: transparent;
}

#calc-container .panel.last .panel-body {
    border-top: 0;
}

.calc-group-heading {
    border-bottom: 1px solid #000000;
    margin-bottom: 14px;
}

.calc-number {
    width: 220px;
    height: 44px;
}

.calc-heading {
    font-weight: 700;
    font-size: 20px !important;
    line-height: 28px;
}

.calc-button-parent {
    position: relative;
    background-color: #186D5B;
    padding-bottom:20px;
    /* height: 215px; */

    /* display: block; */
/* overflow: auto; */
}

.calc-button-child {
    position: relative;
    width: fit-content;
    margin: 0 auto;
    padding-top: 15px;
}

.calc-info1 {
    font-size: 18px;
    font-weight: 300;
    line-height: 28px;
    letter-spacing: 0px;
    color: #ffffff;
    text-align: center;
    padding-top: 12px;
}

.calc-info2 {
    font-size: 30px;
    font-weight: 600;
    line-height: 28px;
    letter-spacing: 0px;
    color: #ffffff;
    text-align: center;
    margin-top: -1px;
}

.calc-info3 {
    font-size: 14px;
    font-weight: 300;
    line-height: 28px;
    letter-spacing: 0px;
    color: #ffffff;
    text-align: center;
    margin: -1px 20px 0px 20px;
}

.calc-label-width {
    width: 378px;
    margin-right:10px;
    float: left;
}

.calc-label {
    letter-spacing: 0px;
    line-height: 28px;    
    font-size: 18px;
    font-weight: 300;
}

.calc-err {
    color: red;
    font-size: 12px;
    line-height: 24px;
    font-weight: 500;
}

.calc-row-err {
    border-left: 5px solid #D50032 !important;
    background-color: #FAE5EA;
}

.input-symbol-pound {
    position: relative;
    font-size: 16px;
    font-weight: 500;
}

.input-symbol-pound input {
    padding-left: 18px;
    font-size: 20px;
}

.input-symbol-pound:before {
    position: absolute;
    top: -3px;
    content: "£";
    left: 8px;
}

input[type=number] {
    -moz-appearance: textfield;
}

.tooltip-inner {
    max-width: 337px;
    background-color: #000000;
    color: white;
    /* If max-width does not work, try using width instead */
    width: 237px;
    font-weight: 300;
    font-size: 16px;
    border-left: 16px;
    border-right: 16px;
    line-height: 20px;
    height: auto;
    font-family: GillSansforJL, arial;
    letter-spacing: normal;
}

.tooltip-ex {
    /* Container for our tooltip */
    position: relative;
    display: inline-block;
}

@media only screen and (min-width: 769px)   {
    #calc-container {
        margin: auto;
        width: 621px;
    }
    #calc-container .panel-heading a,
    #calc-container .panel-heading a:hover,
    #calc-container .panel-heading a:focus {
        color: #000000 !important;
        text-decoration: none;
        font-size: 20px;
        line-height: 28px;
        font-weight: 700;
    }

    .calc-label-width {
        width: 375px;
        float: left;
    }

    .calc-label {
        letter-spacing: 0.5px;
        line-height: 28px;
        font-size: 20px;
        font-weight: 500;
    }
    .calc-box {
        margin-left: 10%;
    }
    .calc-button-parent {
        /* height: 191px; */
        margin-left: 9px;
        padding-bottom:20px;
    }
    .calc-info1 {
        font-size: 20px;
        font-weight: 500;
        line-height: 28px;
        letter-spacing: 0.5px;
        color: #ffffff;
        text-align: center;
        padding-top: 12px;
    }
    .calc-info2 {
        font-size: 24px;
        font-weight: 700;
        line-height: 28px;
        letter-spacing: 0px;
        color: #ffffff;
        text-align: center;
        margin-top: -1px;
    }
    .calc-info3 {
        font-size: 20px;
        font-weight: 500;
        line-height: 28px;
        letter-spacing: 0px;
        color: #ffffff;
        text-align: center;
        margin: -1px 10px 0px 10px;
    }
    .calc-err {
        margin-left: 380px;
    }

    #calc-container .panel-body {
        padding: 5px 0px 42px 10px !important;  
        height: 87px;
        margin: 5px 0px 5px 0px;
        border-left: 5px solid transparent;
    }
}

@media only screen and (min-width: 581px) and (max-width: 768px) {
    /*ipad*/
    #calc-container {
        margin: auto;
        width: auto;
    }
    #calc-container .panel-heading a,
    #calc-container .panel-heading a:hover,
    #calc-container .panel-heading a:focus {
        color: #000000 !important;
        text-decoration: none;
        font-size: 20px;
        line-height: 28px;
        font-weight: 700;
    }

    .calc-label-width {
        width: 300px;
        float: left;
    }

    .calc-label {
        letter-spacing: 0.5px;
        line-height: 28px;
        font-size: 20px;
        font-weight: 500;
    }
    .calc-box {
        margin-left: 10%;
    }
    .calc-button-parent {
        /* height: 191px; */
        height:100%;
        padding-bottom:20px;
    }
    .calc-info1 {
        font-size: 18px;
        font-weight: 300;
        line-height: 28px;
        letter-spacing: 0.5px;
        color: #ffffff;
        text-align: center;
        padding-top: 12px;
    }
    .calc-info2 {
        font-size: 30px;
        font-weight: 600;
        line-height: 28px;
        letter-spacing: 0px;
        color: #ffffff;
        text-align: center;
        margin-top: -1px;
    }
    .calc-info3 {
        font-size: 14px;
        font-weight: 300;
        line-height: 28px;
        letter-spacing: 0px;
        color: #ffffff;
        text-align: center;
        margin: -1px 10px 0px 10px;
    }
    .calc-err {
        margin-left: 305px;
    }

    #calc-container .panel-body {
        padding: 5px 0px 42px 10px !important;  
        height: 87px;
        margin: 5px 0px 5px 0px;
        border-left: 5px solid transparent;
    }
}

@media only screen 
and (min-device-width: 1024px) 
and (max-device-width: 1366px) 
  and (-webkit-min-device-pixel-ratio: 2){
      /* ipad pro */
    #calc-container {
        margin: 0 75px 0 75px;
        width: auto;
    }
    #calc-container .panel-heading a,
    #calc-container .panel-heading a:hover,
    #calc-container .panel-heading a:focus {
        color: #000000 !important;
        text-decoration: none;
        font-size: 20px;
        line-height: 28px;
        font-weight: 700;
    }
    .calc-label-width {
        width: 300px;
        float: left;
    }
    .calc-label {
        letter-spacing: 0.5px;
        line-height: 28px;
        font-size: 20px;
        font-weight: 500;
    }
    .calc-box {
        margin-left: 10%;
    }
    .calc-button-parent {
        /* height: 191px; */
        padding-bottom:20px;
    }
    .calc-info1 {
        font-size: 18px;
        font-weight: 300;
        line-height: 28px;
        letter-spacing: 0.5px;
        color: #ffffff;
        text-align: center;
        padding-top: 12px;
    }
    .calc-info2 {
        font-size: 30px;
        font-weight: 600;
        line-height: 28px;
        letter-spacing: 0px;
        color: #ffffff;
        text-align: center;
        margin-top: -1px;
    }
    .calc-info3 {
        font-size: 14px;
        font-weight: 300;
        line-height: 28px;
        letter-spacing: 0px;
        color: #ffffff;
        text-align: center;
        margin: -1px 10px 0px 10px;
    }
    .calc-err {
        margin-left: 305px;
    }

    #calc-container .panel-body {
        padding: 5px 0px 42px 10px !important;  
        height: 87px;
        margin: 5px 0px 5px 0px;
        border-left: 5px solid transparent;
    }
}

@media only screen 
    and (device-width : 414px) 
    and (device-height : 736px) 
    and (-webkit-device-pixel-ratio : 3) {
        #calc-container {
            margin: 0 10px 0 10px;
            width: auto;
        }
     }

     @media only screen and (-webkit-min-device-pixel-ratio: 3.5) {
         /* Samsung Galaxy */
        #calc-container {
            margin: 0 10px 0 10px;         
            width: auto;
        }
    }

    @media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px) 
  and (-webkit-min-device-pixel-ratio: 2){
    #calc-container {
        margin: 0 10px 0 10px;           
        width: auto;
    }
  }

  @media only screen and (-webkit-device-pixel-ratio: 2.5) {
    #calc-container {
        /* surface duo */
        margin: 0 75px 0 75px;              
        width: auto;
    }
}
/** Generic calculator CSS End *
/* Article Header start **/
a.ahLink{
    font-size:16px;
    text-decoration:underline;
    color: #000000;
}

.ahBox {
    display:flex;
    flex-direction:row;
    font-size:16px;
    line-height:22px;
    margin:10px 0px 6px 0px; 
  }

.ah-hideSection1{
    visibility: hidden;
}

.ah-hideSection2{
    visibility: hidden;
}

.ahBox :nth-child(1) { order: 1; }

.ahBox :nth-child(2) { order: 2; }

.ahBoxC1 {
    display:flex;
	padding:4px 0px 5px 0px;
    font-size: 16px;
    font-weight:400;
    line-height:22px;
    font-weight:500;
}

.ahBoxC2 {
    padding:8px 10px 8px 0px;
    width:100%;
    text-align:right;
    font-weight:400;
}

.ahAuthor{
    width:max-content;
    margin-left:20px;
    margin-top:4px;
}

.ahPipe{
    display:none;
}

@media only screen and (min-width: 581px) and (max-width: 768px) {
    /*ipad*/
}

@media only screen 
and (min-device-width: 1024px) 
and (max-device-width: 1366px) 
  and (-webkit-min-device-pixel-ratio: 2){
      /* ipad pro */
}

@media only screen 
    and (device-width : 414px) 
    and (device-height : 736px) 
    and (-webkit-device-pixel-ratio : 3) {
        .ahBox {
            display:flex;
            flex-direction:column;
          }
          
        .ahBox :nth-child(1) { 
            order:2;
        }
        
        .ahBox :nth-child(2) { 
            order:1; 
        }

        .ahBoxC1{
            display:-webkit-inline-box;
            width:100%;
            float:none;
        }

        .ahBoxC2{
            width:100%;
            float:none;
            text-align:center;
            padding:7px 0px 10px 0px;
        }

        .ah-hideSection1{
            display: none;
        }
        
        .ah-hideSection2{
            display: none;
        }

        .ahPipe{
            display:inline;
            margin-left:2px;
            margin-right:2px;
        }

        .ahBR{
            display:none;
        }
     }

     @media only screen and (-webkit-min-device-pixel-ratio: 3.5) {
        /* Samsung Galaxy */
        .ahBox {
            display:flex;
            flex-direction: column;
        }

        .ahBox :nth-child(1) { 
            order:2; 
        }

        .ahBox :nth-child(2) { 
            order:1; 
        }

        .ahBoxC1{
            display:-webkit-inline-box;
            width:100%;
            float:none;
        }

        .ahBoxC2{
            width:100%;
            float:none;
            text-align:center;
            padding:5px 0px 10px 0px;
        }

        .ah-hideSection1{
            display: none;
        }
        
        .ah-hideSection2{
            display: none;
        }

        .ahPipe{
            display:inline;
            margin-left:2px;
            margin-right:2px;
        }

        .ahBR{
            display:none;
        }
    }

    @media only screen 
     and (min-device-width: 320px) 
     and (max-device-width: 480px)
     and (-webkit-min-device-pixel-ratio: 2){
 
   .ahBox {
        display:flex;
        flex-direction:column;
    }

    .ahBox :nth-child(1) { 
        order:2; 
    }

    .ahBox :nth-child(2) { 
        order:1; 
    }

    .ahBoxC1{
        display:-webkit-inline-box;
        width:100%;
        float:none;
    }

    .ahBoxC2{
        width:100%;
        float:none;
        text-align:center;
        padding:10px 0px 10px 0px;
    }

    .ah-hideSection1{
        display: none;
    }
    
    .ah-hideSection2{
        display: none;
    }
    
    .ahPipe{
        display: inline;
        margin-left: 2px;
        margin-right: 2px;
    }

    .ahBR{
        display:none;
    }
  }

  @media only screen 
     and (min-device-width: 280px) 
     and (max-device-width: 320px){
    .ahBox {
        display:flex;
        flex-direction:column;
    }

    .ahBox :nth-child(1) {
          order:2; 
    }

    .ahBox :nth-child(2) {
          order:1;
    }

    .ahBoxC1{
        display:-webkit-inline-box;
        width:100%;
        float:none;
    }

    .ahBoxC2{
        width:100%;
        float:none;
        text-align:center;
        padding:5px 0px 10px 0px;
    }

    .ahPipe{
        display:inline;
        margin-left:2px;
        margin-right:2px;
    }

    .ahBR{
        display:none;
    }
  }

  @media only screen and (-webkit-device-pixel-ratio: 2.5) {
    .ahBox {
        display:flex;
        flex-direction: column;
      }

    .ahBox :nth-child(1) {
        order:2;
    }

    .ahBox :nth-child(2) {
        order:1;
    }

    .ahBoxC1{
        display:-webkit-inline-box;
        width:100%;
        float:none;
    }

    .ahBoxC2{
        width:100%;
        float:none;
        text-align:center;
        padding:5px 0px 10px 0px;
    }

    .ahPipe{
        display:inline;
        margin-left:2px;
        margin-right:2px;
    }

    .ahBR{
        display:none;
    }
}
/** Article Header CSS End *
/* Slider */
.slick-slider
{
    position: relative;

    display: block;

    -moz-box-sizing: border-box;
         box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
    max-width: 100%;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}
@charset 'UTF-8';
/* Slider */
.slick-loading .slick-list
{
    /*background: #fff url('../../../apps/jlf/website/components/carouselTwo/clientlib/libs/ajax-loader.gif') center center no-repeat;*/
}

/* Icons */
@font-face
{
    font-family: 'slick';
    font-weight: normal;
    font-style: normal;

    src: url('../../../apps/jlf/website/components/carouselTwo/clientlib/libs/fonts/slick.eot');
    src: url('../../../apps/jlf/website/components/carouselTwo/clientlib/libs/fonts/slick.eot?#iefix') format('embedded-opentype'), url('../../../apps/jlf/website/components/carouselTwo/clientlib/libs/fonts/slick.woff') format('woff'), url('../../../apps/jlf/website/components/carouselTwo/clientlib/libs/fonts/slick.ttf') format('truetype'), url('../../../apps/jlf/website/components/carouselTwo/clientlib/libs/fonts/slick.svg#slick') format('svg');
}
/* Arrows */
.slick-prev,
.slick-next
{
    font-size: 0;
    line-height: 0;

    position: absolute;
    top: 50%;

    display: block;

    width: 20px;
    height: 20px;
    padding: 0;
    margin-top: -10px\9; /*lte IE 8*/
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);

    cursor: pointer;

    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
    color: transparent;
    outline: none;
    background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
    opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
    opacity: .25;
}

.slick-prev:before,
.slick-next:before
{
    font-family: 'slick';
    font-size: 20px;
    line-height: 1;

    opacity: .75;
    color: white;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-prev
{
    left: -25px;
}
[dir='rtl'] .slick-prev
{
    right: -25px;
    left: auto;
}
.slick-prev:before
{
    content: '←';
}
[dir='rtl'] .slick-prev:before
{
    content: '→';
}

.slick-next
{
    right: -25px;
}
[dir='rtl'] .slick-next
{
    right: auto;
    left: -25px;
}
.slick-next:before
{
    content: '→';
}
[dir='rtl'] .slick-next:before
{
    content: '←';
}

/* Dots */
.slick-slider
{
    margin-bottom: 30px;
}

.slick-dots
{
    position: absolute;
    bottom: -45px;

    display: block;

    width: 100%;
    padding: 0;

    list-style: none;

    text-align: center;
}
.slick-dots li
{
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}
.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
.slick-dots li button:before
{
    font-family: 'slick';
    font-size: 6px;
    line-height: 20px;

    position: absolute;
    top: 0;
    left: 0;

    width: 20px;
    height: 20px;

    content: '•';
    text-align: center;

    opacity: .25;
    color: black;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
    opacity: .75;
    color: black;
}

/* CAROUSEL TWO STYLES ONLY */
@keyframes panningUp {
	0% {
	  background-position: 0% 0%;
	}
	25% {
	  background-position: 100% 100%;
	}
	 50% {
	  background-position: 100% 0%;
	}
	75% {
	  background-position: 0 100%;
	}
	200% {
	  background-position: 0 0;
	}
}

@keyframes panningR2L {
  1% { background-position: 0 0;}
}

@keyframes panningL2R {
	100% { background-position: 0 0;}
	0% { background-position: -300px 0;}
}

@keyframes zoomEffect1 {
	0% {
		transform:scale(1);
		-ms-transform:scale(1);
	}

	25% {
		transform:scale(1.1);
		-ms-transform:scale(1.1);
	}

	50% {
		transform:scale(1.2);
		-ms-transform:scale(1.2);
	}
	
	75% {
		transform:scale(1.3);
		-ms-transform:scale(1.3);
		}

	100% {
		transform:scale(1);
		-ms-transformm:scale(1);
		}
}

@keyframes swap {
	0% {
	  left: 0;
	}
	48% {
	  -webkit-transform: rotateY(0deg); 
	}
	50% { 
	  left: calc(100% - 100px);
	  -webkit-transform: rotateY(180deg); 
	}
	98% {
	  -webkit-transform: rotateY(180deg); 
	}
	100% {
	  left: 0;    
	   -webkit-transform: rotateY(0deg);
	}
}

.zoomEffect1 {	
	animation: zoomEffect1 20s linear infinite;
	-webkit-animation: zoomEffect1 20s linear infinite;
	-moz-animation: zoomEffect1 20s linear infinite;
	-o-animation: zoomEffect1 20s linear infinite;
	-ms-animation: zoomEffect1 20s linear infinite;
}

.panningUp {
	animation: panningUp 30s linear infinite;
	-webkit-animation: panningUp 30s linear infinite;
 	-moz-animation: panningUp 30s linear infinite;
 	-o-animation: panningUp 30s linear infinite;
 	-ms-animation: panningUp 30s linear infinite;
}

.panningR2L {	
	/* transition: transform .5s ease; */
	animation: panningR2L 20s linear infinite;
	-webkit-animation: panningR2L 20s linear infinite;
	-moz-animation: panningR2L 20s linear infinite;
  -o-animation: panningR2L 20s linear infinite;
  -ms-animation: panningR2L 20s linear infinite;
}

.panningL2R {	
	/* transition: transform .5s ease; */
	animation: panningL2R 20s linear infinite;
	-webkit-animation: panningL2R 20s linear infinite;
	-moz-animation: panningL2R 20s linear infinite;
  -o-animation: panningL2R 20s linear infinite;
  -ms-animation: panningL2R 20s linear infinite;
}

.carousel-container {
  height: 500px; /* for 500 height */
}


/*Override to make Carousel full width on Desktop*/
.carouselTwo .jcarousel{
  max-width: 1920px;
  height: auto !important;
}

.jcarousel {
  width: 100%;

  margin: 0 auto;
}

.carouselTwo .slick-slider {
  height: 500px; /* for 500 height */
  position: relative;
  margin-bottom: 0px !important;
} 


/* Custom Slick Carousel Styles */

.slick-next, .slick-prev {
  top: 93%; /* for 500 height */
  right: 15.1%;
  left: inherit;
  z-index: 20;
  width: 30px;
  height: 30px;
  color: #000;
  background-color: rgba(255,255,255,0.8);
  border-radius: 100%;
  display: block;
  opacity: 0;
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-transition: opacity 0.2s ease-out;
  -moz-transition: opacity 0.2s ease-out;
  -o-transition: opacity 0.2s ease-out;
  transition: opacity 0.2s ease-out;
}

.slick-slider:hover .slick-next,
.slick-slider:hover .slick-prev{
  opacity: 1;
  -webkit-transition: opacity 0.2s ease-out;
  -moz-transition: opacity 0.2s ease-out;
  -o-transition: opacity 0.2s ease-out;
  transition: opacity 0.2s ease-out;
}

.slick-prev {
  left: 15.1%;
  right: inherit;
}

.slick-prev, .slick-prev:hover {
  color: #000;
  display: block;
}

.slick-next, .slick-next:hover {
  color: #000;
  display: block;
  clear: both;
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  /*bottom: 20px; GAD-653 - removing as affecting the > arrow in the promo carousel but no affect on carousel two >*/
  display: block;
}

.slick-prev:before, .slick-next:before {
  font-family: "Glyphicons Halflings", "slick", sans-serif;
  /*font-family: "jl-icon";*/
  font-size: 14px;
  color: #000000;
}

.slick-prev:before {
  content: "\e257";
}

.slick-next:before {
  content: "\e258";
}
.slick-prev:hover,
.slick-next:hover{  
  background-color: rgba(255,255,255,1);
}

.slick-prev:focus,
.slick-next:focus{  
  background-color: rgba(255,255,255,0.8);
}

.slick-dots {
  bottom: 12px;
  color: transparent !important;
  padding: 0px;
  margin-left: 0;
}

.slick-dots li {
  padding: 0 !important;
  margin: 0;
  width: 14px;
  height: 14px;
  line-height: 0px;
}

.slick-dots li button {
  padding: 0px;
  margin: 0px;
}

.slick-dots li button {
  display: inline-block;
  width: 8.5px;
  height: 8.5px;
  text-indent: -999px;
  cursor: pointer;
  background-color: #000\9;
  background-color: rgba(0,0,0,0);
  border: 1px solid #fff;
  border-radius: 10px;
  opacity: 1;
}

.slick-dots li.slick-active button {
  width: 8.5px;
  height: 8.5px;
  margin: 0;
  background-color: #fff;
}

.new-carousel2 {
  overflow: hidden;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 400;  
}

.slick-dots li:after, 
.slick-dots li:before, 
.slick-dots li button:before {
  display: none; 
}

.copy-wrapper {
  font-size: 20px;
}

.text-wrapper {
  clear: both;
}

.text-wrapper .carousel-heading {
  font-size: 48px;
  line-height: 58px;
  padding: 0 0 5px 0;
  text-align: center;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 700;  
  margin: 0px;
}

.text-wrapper h2 {
  font-size: 50px;
  line-height: 66px;
  padding: 0 0 5px 0;
  text-align: center;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 400;  
  text-transform: uppercase;
  letter-spacing: 11px;
  margin: 0px;
}

.text-wrapper .dash-bottom:after {
  content: ' ';
  display: block;
  width: 60px;
  border-top: 3px solid;
  margin: 15px auto 25px;
}

.text-wrapper .caption {
  display: block;
  clear: both;
  margin: 0px 0 30px 0;
  text-align: center;
  font-size: 22px;
  line-height: 26.4px;
}

.text-wrapper .hub-carousel-heading {
  font-size: 60px;
  line-height: 72px; 
  padding: 0 0 7px 0;
  text-align: center;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 700; 
  margin: 0px;
}

.text-wrapper h2.small-carousel-heading {
  font-size: 32px;  
  line-height: 36px;  
  padding: 0 0 5px 0;
  text-align: center;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 700;  
  margin: 0px;
}

.text-wrapper h2.small-left-carousel-heading {
  font-size: 32px;  
  line-height: 36px;  
  padding: 0 0 5px 0;
  text-align: left;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 700;  
  margin: 0px;
}

/* Hide the Header or Caption or Both and preserve their space - jira GAD-212 */
.text-wrapper.invisible-header .carousel-heading,
.text-wrapper.invisible-header .hub-carousel-heading,
.text-wrapper.invisible-header .dash-bottom,
.text-wrapper.invisible-caption .caption,
.text-wrapper.invisible-header-caption .carousel-heading,
.text-wrapper.invisible-header-caption .hub-carousel-heading,
.text-wrapper.invisible-header-caption .dash-bottom,
.text-wrapper.invisible-header-caption .caption {
 visibility: hidden;
}

.text-black,
.text-black a,
.text-white p {
  color:#000000 !important;
}
.text-white,
.text-white a,
.text-white p {
  color: #fff !important;
}

.modal-backdrop {
  z-index: -1;
}

.modal-banner {
  background: #000;
  opacity: .5;
}

.modal-title {
  font-size: 24px;
}

.modal-content {
  color: #000000 !important; /*color: #333 !important;*/ /*Changing for rebrand changes for popup component*/
}

#carouselModal .modal-header {
  padding: 15px 15px 15px 15px;
  border-bottom: 1px solid #d8d8d8;
}

#carouselModal .modal-content {
  background-color: #ffffff;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  -o-border-radius: 0px;
  border-radius: 0px;
  width:inherit;
  height:inherit;
  /* To center horizontally */
  margin: 0 auto;
  pointer-events: all;
  border:0px;
}



#carouselModal .modal-body p {
  font-family: Arial,Helvetica,sans-serif;
}

#carouselModal .close {
  color: #000000;
  opacity: 1;
  position: relative;
  top: -10px;
  right: 0px;
}

#carouselModal.modal {
  z-index: 999999; /* JLF1198 - replacing 5999 to 999999 to fix this bug */
}

.h4-heading {
  font-size: 22px;
  line-height: 26.4px;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 400;
}


.text-black .btn {
  color: #000000 !important;
}

.text-white .btn {
  color: #fff !important;
}

body.modal-open {
  padding: 0px !important;
  overflow: hidden;
  height: 100vh;
}

.show-in-desktop {
  display:block; /* by default desktop is shown */
}

.show-in-tablet, 
.show-in-mobile {
  display:none; /* by default mobile and tablet are hidden */
}


.carousel-image {
  background-repeat: no-repeat;
  background-size: cover;
  height: 500px; /* for 500 height */
}


.carouselTwo .content-section {
  top: -500px; /* for 500 height */
  position: relative;
  margin-top: 0px;
  height: auto;
}


.hide {
  display: none !important;
}

.show {
  display: block !important;
}

/* THE END */


/* RESPONSIVE IMAGES */

.image-container {
  position: relative;
}

.image-container .image {
  max-width: 100%;
  background-size: cover;
  -moz-background-size: cover;  
  background-position: center;  
}


.image-container .image.height {
  height: 500px; 
}


@media only screen and (min-width : 769px) and (max-width : 992px) {

  .image-container .image {
    padding-top: 10%;
    max-width: 100%;
    background-size: cover;
    -moz-background-size: cover;  
    background-position: center;  
  }

  .image-container .image.height {
    height: 500px; 
  }


  .show-in-desktop {
    display:block;
  }

  .show-in-tablet, 
  .show-in-mobile {
    display:none;
  }

  .slick-prev {
    left: 15px;
  }

  .slick-next {
    right: 15px;
  }


  .carousel-container {
    height: 500px;
  }

  .text-wrapper {
    width: 100%;
  }

.text-wrapper .carousel-heading {
      font-size: 36px;
      line-height: 44px;
      letter-spacing: 6px;
  }

  .text-wrapper .dash-bottom:after {
      width: 50px;
      margin: 15px auto 20px;
  }

  .text-wrapper .caption {
      font-size: 20px !important;
      line-height: 24px;
  }

  .text-wrapper .hub-carousel-heading {
      font-size: 44px;
      line-height: 52.8px;
      letter-spacing: 6px;    
  }


  .caption {
    font-size: 20px;
  }
  .carouselTwo .slick-slider {
    height: 1000px;
  }

  .slick-dots li.slick-active button {
    background-color: #000;
  }

  .slick-dots li button {
    border: 1px solid #000;
  }
 

} /* 769 to 992 media query end here */


/* Retina desktop */
@media
  only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 769px) and (max-width : 1920px),
  only screen and (  -moz-min-device-pixel-ratio: 2)  and (min-width: 769px) and (max-width : 1920px),
  only screen and (   -o-min-device-pixel-ratio: 2/1) and (min-width: 769px) and (max-width : 1920px),
  only screen and (       min-device-pixel-ratio: 2)  and (min-width: 769px) and (max-width : 1920px),
  only screen and (           min-resolution: 192dpi) and (min-width: 769px) and (max-width : 1920px),
  only screen and (            min-resolution: 2dppx) and (min-width: 769px) and (max-width : 1920px) {

  .image-container .image {
    padding-top: 10%;
    max-width: 100%;
    background-size: cover;
    -moz-background-size: cover;  
    background-position: center;  
  }

  .image-container .show-in-desktop {
    display:block;
  }

  .image-container .show-in-tablet, 
  .image-container .show-in-mobile {
    display:none;
  }

}

/* Extra Small Devices and medium */ 
@media only screen and (min-width : 481px) and (max-width : 768px) {

  .carouselTwo .jcarousel.desktopOnlyCarousel {
    display: none;
  }

 #carouselModal .full-width {
    display:table;
    height: 100%;
    width: 100%;
  }

  #carouselModal .modal-header {
    padding: 15px 0px 15px 15px;
  }

  /*#carouselModal .modal-body{
    max-height: 100vh;
  }*/

  .image-container .image {
    background-size: cover;
    -moz-background-size: cover;  
    background-position: center;  
  }

  .image-container .image.height {
    height: 400px !important;
  }


  .show-in-tablet {
    display:block;
  }

  .show-in-desktop, 
  .show-in-mobile {
    display:none;
  }


  .carouselTwo .content-section {
	  position: static;
    margin-top: 0px !important;
    top:-400px !important;
  }

  .slick-prev {
    left: 15px;
  }

  .slick-next {
    right: 15px;
  }

 
  .carousel-container {
    height: 400px;
  }

  .text-wrapper {
    width: 100%;
  }

  .text-wrapper .carousel-heading,
  .text-wrapper h2 {
    font-size: 26px;
    line-height: 31.2px;
    padding: 0 0 0px 0;  
  }

  .text-wrapper .dash-bottom:after {
      width: 36px;
      margin: 15px auto 18px;
  }

  .text-wrapper .caption {
      margin: 0px 0 15px 0;
      font-size: 18px;
      line-height: 21.6px;
  }

  .text-wrapper .hub-carousel-heading {
      font-size: 44px;
      line-height: 52.8px;
  }


  .copy-wrapper {
    top: -17px;
    width: 100%;
  }

  .carousel-container h3 {
    line-height: 38.4px;
  }

  .slick-dots {
    bottom: 12px;
    margin-bottom: 0px;
  }

  .carouselTwo .slick-slider {
    height: 900px;
  }

  .slick-dots li.slick-active button {
    background-color: #000;
  }

  .slick-dots li button {
    border: 1px solid #000;
  }

  .slick-next, .slick-prev {
    top: 90%; /* in 500 height for tablet */
  }

  .modal-dialog {
    width: 400px;
    margin: 0 auto;
  }

  .pos-icon-right {
    right: 11%;  
  }
  .pos-icon-left {
    right: 12%;
    left: 3%;  
  }
  .col-mobile.image-container{
    width: 41.66666667%; /*col-sm-5 */
  }
  .pos-icon-right.image-container{
    right: 4%; 
  }




} /* TABLET media query */

@media only screen and (min-width : 601px) and (max-width : 768px) {

.text-wrapper .hub-carousel-heading {
      font-size: 36px;
      line-height: 43.2px;
  }

  .pos-icon-left {
    right: 12%;
    left: 6%;  
  }
  .col-mobile.image-container{
    width: 33.33333333%; /*col-sm-4 */
  }
  .pos-icon-right.image-container{
    right: 8%;
  }
}

@media only screen and (min-width : 481px) and (max-width : 600px) {

  .content-section {
    margin-top: 0px !important;
  }

  .text-wrapper .caption {
    margin: 0px 0 10px 0;
    font-size: 16px;
    line-height: 19.2px;
  }

  .text-wrapper .dash-bottom:after {
    margin: 7px auto 10px;
  }

  .bottom-section {
    bottom: 175px;
  }

  .text-wrapper .hub-carousel-heading {
    font-size: 30px;
    line-height: 36.4px;
    padding: 0;
  }

  
}

/* Retina Tablet */
@media
  only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width : 481px) and (max-width : 768px),
  only screen and (  -moz-min-device-pixel-ratio: 2)  and (min-width : 481px) and (max-width : 768px),
  only screen and (   -o-min-device-pixel-ratio: 2/1) and (min-width : 481px) and (max-width : 768px),
  only screen and (       min-device-pixel-ratio: 2)  and (min-width : 481px) and (max-width : 768px),
  only screen and (           min-resolution: 192dpi) and (min-width : 481px) and (max-width : 768px),
  only screen and (            min-resolution: 2dppx) and (min-width : 481px) and (max-width : 768px) {

 .image-container .image {
    height: 400px !important;
    -webkit-background-size:cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;  
    background-position: center;  
  }

  .image-container .image.height {
    height: 400px !important; 
  }

  .image-container .show-in-tablet {
    display:block; 
 }

  .image-container .show-in-desktop, 
  .image-container .show-in-mobile {
    display:none;
  }

}

/* Mobile media query*/
@media only screen and (min-width : 320px) and (max-width : 480px) {

  #carouselModal .full-width {
      display:table;
      height: 100%;
      width: 100%;
  }
 
  #carouselModal .modal-header {
    padding: 15px 15px 15px 15px;
  }

 

  .image-container .image {
    -webkit-background-size:cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;  
    background-position: center;
  }

  .image-container .image.height {
      height: 385px !important;
  }


  .show-in-mobile {
    display:block;
  }
    
  .show-in-desktop, 
  .show-in-tablet {
      display:none;
  }


  .content-section {
    top: -385px !important;
    margin-top: 0px !important;
  }

  .slick-prev {
    left: 15px;
  }

  .slick-next {
    right: 15px;
  }

  
  .carousel-container {
    height: 385px;
  }

  .copy-wrapper {
    top: 465px;
    width: 100%;
    clear: both;
  }

  .text-wrapper {
    width: 100%;
  }

  .text-wrapper .hub-carousel-heading,
  .text-wrapper .carousel-heading {
    font-size: 26px;
    line-height: 31.2px;
    padding: 0;
  }

  .text-wrapper .dash-bottom:after {
    width: 36px;
    margin: 15px auto 15px;
  }

  .text-wrapper .caption {
    margin: 5px 0 30px 0;
    font-size: 18px !important;
    line-height: 21.6px;
  }

  .carouselTwo .slick-slider {
    height: 1000px;
    position: relative;
    margin-bottom: 0 !important;
  }

  .slick-dots li.slick-active button {
    background-color: #000;
  }

  .slick-dots li button {
    border: 1px solid #000;
  }

  .slick-dots {
    bottom: 26px;
    /*margin: 0px auto;*/
  }

  .slick-next, .slick-prev {
    top: 87%;
  }

  .caption {
    font-size: 19px;
  }

  .modal-dialog {
    width: 280px;
    margin: 0 auto;
  }

  .carousel-container h3 {
    line-height: 31.2px;
  }

} /* MOBILE media query */


/*Retina mobile*/

@media 
  only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 320px) and (max-width : 480px),
  only screen and ( -moz-min-device-pixel-ratio: 2)   and (min-width: 320px) and (max-width : 480px),
  only screen and (   -o-min-device-pixel-ratio: 2/1) and (min-width: 320px) and (max-width : 480px),
  only screen and (     min-device-pixel-ratio: 2)    and (min-width: 320px) and (max-width : 480px),
  only screen and (           min-resolution: 192dpi) and (min-width: 320px) and (max-width : 480px),
  only screen and (            min-resolution: 2dppx) and (min-width: 320px) and (max-width : 480px) {

  .image-container .image {
    -webkit-background-size:cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;  
    background-position: center; 
  }
  .image-container .image.height {
      height: 385px !important;
  }

  .image-container.show-in-mobile {
    display:block;
  }

  .image-container .show-in-tablet, 
  .image-container .show-in-desktop {
    display:none;
  }

}

/* RESPONSIVE Images ends*/


/* TODO REMOVE */

/* component - popup */
/* alignment */


.popup.modal {
  z-index: 7000;
}

.modal.fade:not(.in).top .modal-dialog {
  -webkit-transform: translate3d(0, -25%, 0);
  transform: translate3d(0, -25%, 0);
}

body.modal-open .modal-backdrop.fade.in {
  z-index: 1040;
}

body.modal-open .modal-backdrop.in {
  opacity: .85;
}

body.modal-open #totalBox.fixto-fixed {
  position: static !important;
}

.popup .modal-content {
  background-color: #ffffff;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  -o-border-radius: 0px;
  border-radius: 0px;
  width: inherit;
  height: inherit;
  margin: 0 auto;
  pointer-events: all;
  border: 0px;
  padding: 30px 10px 30px 30px;
}

.popup .vertical-alignment-helper {
  display: table;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.popup .vertical-align-center {
  display: table-cell;
  vertical-align: middle;
  pointer-events: none;
}
    
.popup .modal-title {
  font-size: 24px;
  line-height: 28.8px;
  font-family: 'GillSansforJL',Arial,Helvetica,sans-serif;
  font-weight: 200; /* changed to 200 as per design requirement*/
  padding-bottom: 10px;
  margin-bottom: 20px;
  color: #000000;
  border-bottom: 1px solid #d8d8d8;
}

.popup .close {
  color: #000000;
  opacity: 1;
  position: relative;
  top: -10px;
  right: 4px;
}

.popup .icon-close {
  display: inline-block;
  position: relative;
  margin: 0px;
}

.padding-reset {
  padding: 0;
}



.terms-list {
  width: 100%;
  margin: 0;
}

.terms-list p {
  padding: 0 10px 0 0;
}

.popup .row.row {
  margin: 0 !important;
}

.row.terms-list {
  height: 330px;
  margin-top:30px;
}

.row.close-wrapper {
  padding-right: 10px;
}




@media only screen and (min-width : 481px) and (max-width : 768px) {
  
  .popup .modal-title {
    font-size: 22px;
    line-height: 26.4px;
  }

  .icon-close {
    position: relative;
    left: -3px;
  }

  .modal-dialog.dialog-fix {
    width: auto !important;
  }

  .modal-open .modal {
    padding-right: 0px !important;
    margin: 0 30px;
  }

  .row.terms-list{
    height: calc(100vh - 155px);
  }

}

@media only screen and (min-width : 320px) and (max-width : 480px) {
  .popup-btn {
    width: 100%;
    padding: 0;
  }

  .popup .modal-title {
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 20px;
  }

  .popup .close {
    color: #000000;
    opacity: 1;
  }

  .popup .icon-close {
    position: relative;
    margin: 0px;
    top: 0px;
    left: 0;
  }

  .modal-open .modal {
    padding-right: 0px !important;
    margin: 20px 20px 20px 20px !important;
  }

  .modal-dialog.dialog-fix {
    width: auto !important;
  }

  .row.terms-list{
    height: calc(100vh - 210px);
  }

  /* Hide the Header or Caption or Both and preserve their space on Mobile Devices - jira GAD-225 */
  .mobile-text-wrapper.mobile-invisible-header .carousel-heading,
  .mobile-text-wrapper.mobile-invisible-header .hub-carousel-heading,
  .mobile-text-wrapper.mobile-invisible-header .dash-bottom,
  .mobile-text-wrapper.mobile-invisible-caption .caption,
  .mobile-text-wrapper.mobile-invisible-header-caption .carousel-heading,
  .mobile-text-wrapper.mobile-invisible-header-caption .hub-carousel-heading,
  .mobile-text-wrapper.mobile-invisible-header-caption .dash-bottom,
  .mobile-text-wrapper.mobile-invisible-header-caption .caption{
    visibility: hidden;
  }

}

@media only screen and (max-width : 1024px) {
  .slick-next, .slick-prev{
   opacity: 1;
  }
}


/* GAD-222: center adaptive image on larger screens */
@media only screen and (min-width : 768px) {

  .bottom-center {
    display: flex;
    text-align: center;
    justify-content: center;
  }
  
  .bottom-center img {
    margin: 0 auto;
    text-align: center;
  }
  
}


/* Hide the Header or Caption or Both and preserve their space on Mobile Devices - jira GAD-225 */
@media only screen and (max-width : 321px), screen and (max-width : 481px) and (orientation: landscape) {

  .text-wrapper.mobile-invisible-header .carousel-heading,
  .text-wrapper.mobile-invisible-header .hub-carousel-heading,
  .text-wrapper.mobile-invisible-header .dash-bottom,
  .text-wrapper.mobile-invisible-caption .caption,
  .text-wrapper.mobile-invisible-header-caption .carousel-heading,
  .text-wrapper.mobile-invisible-header-caption .hub-carousel-heading,
  .text-wrapper.mobile-invisible-header-caption .dash-bottom,
  .text-wrapper.mobile-invisible-header-caption .caption {
    visibility: hidden;
  }

}

/* Show both Desktop & Mobile Content ParSys in Author (Edit/Design) */
.container.content-section.visibleForAuthor {
    display: initial;
}



@media only screen and (max-width : 991px) {

  /* Hide Desktop Content ParSys content on Mobile & Tablet */
  .jcarousel .hideCarouselDesktopPar {
    display: none;
  }

  .carouselTwo .content-section {
    position: static;
  }

  .carouselTwo .container {
    padding: 0px !important;
  }

}


@media only screen and (min-width : 992px) {

  /* Hide Mobile Content ParSy content on Laptop & Desktop */
  .jcarousel .hideCarouselMobilePar {
    display: none;
  }

}

/*Override per CarouselTwo Design Doc*/
.carouselTwo .container {
  padding: 0px 20px 40px 20px;
} 

/*Override to make CarouselTwo Content utilise full width on Desktop*/
.carouselTwo .container.content-section {
  width: auto;
}
/* JLF Container Cell CSS Begins */

.containercell {
	max-width: 100%;
}

/*Spacing for Text*/
.carouselTwo .containercell p {
	margin-bottom: 40px
}

/*Spacing for Buttons*/
.carouselTwo .containercell .default-btn {
	margin-bottom: 15px;
}

.carouselTwo .containercell .link-only {
	padding: 5px;
}

/*Spacing for Images*/
.carouselTwo .containercell .dynamic-height img {
    width: auto;
    margin-left: auto;
    margin-right: auto;                    
}

/*Desktop*/
@media only screen and (min-width : 992px) {

  .containercell.hiddenOnDesktop {
    display: none;
  }

  /*Padding Top adjusted to accommodate the extra 8px padding top from text copy <p> at top of #left25*/
  .carouselTwo .containercell .dynamic-height {
    padding: 34px 0px 40px 0px;
  }

  .carouselTwo .containercell .dynamic-height .containerPar {
    max-height: 500px;
  }

  .carouselTwo .containercell .dynamic-height .containerPar .section {
    max-height: 500px;
  }

  .carouselTwo #middle50 .containercell .dynamic-height {
    height: 500px !important;
    padding: 0px !important;
  }

  /*Vertical & Horizontal Centre Alignment of Title*/
  .carouselTwo #middle50 .containercell .dynamic-height .title-comp h1.hub-carousel-heading,
  .carouselTwo #middle50 .containercell .dynamic-height .title-comp h2.carousel-heading,
  .carouselTwo #middle50 .containercell .dynamic-height .title-comp h2.small-carousel-heading {
    position: absolute;
    top: 46.5%;
    left: var(--desktopHeaderAdjustment, 50.0%);
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 85%;
    padding-bottom: 0px;
  }

  .carouselTwo .col-xs-12.col-md-3 .containercell .default-btn {
	width: 80%;
    padding-left: 0px !important;
    padding-right: 0px !important;
    text-align: center;
  }

  /*Background Image for Desktop*/
  .carouselTwo .inner-wrapper.containercellBG,
  .carouselTwo .inner-wrapper .containercell .dynamic-height.containercellBG {
    background-image: var(--desktopBackgroundImage,"");
  }

}


/*Tablet*/
@media only screen and (min-width : 769px) and (max-width : 991px) {

  .jcarousel.large .containercell .dynamic-height {
    max-height: 800px !important;
  }

  .carouselTwo .containercell .dynamic-height {
    max-height: 500px !important; 
  }

  .carouselTwo #middle50 .containercell .containerPar {
	margin-top: 22.5px;
  }

  /*Centre 50% of full width container for Tablet*/
  .carouselTwo #middle50 .containercell .dynamic-height {
    padding-left: 25% !important;
	padding-right: 25% !important;
    height: 500px !important;
  }

  /*Vertical & Horizontal Centre Alignment of Title*/
  .carouselTwo #middle50 .containercell .dynamic-height .title-comp h1.hub-carousel-heading,
  .carouselTwo #middle50 .containercell .dynamic-height .title-comp h2.carousel-heading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding-bottom: 0px;
  }

  .carouselTwo #middle50 .containercell .dynamic-height .title-comp.remove-br br {
    display: block;
  }

  .carouselTwo .col-xs-12.col-md-3 .containercell .default-btn {
	width: 370px;
    padding-left: 0px !important;
    padding-right: 0px !important;
    text-align: center;
  }

  .containercell.hiddenOnTablet {
    display: none;
  }

  /*Background Image for Tablet*/
  .carouselTwo .inner-wrapper.containercellBG,
  .carouselTwo .inner-wrapper .containercell .dynamic-height.containercellBG {
    background-image: var(--tabletBackgroundImage,"");
  }

}


/*Mobile - Large*/
@media only screen and (min-width : 481px) and (max-width : 768px) {

  .jcarousel.large .containercell .dynamic-height {
    max-height: 640px !important;
  }

  .carouselTwo .containercell .dynamic-height {
    max-height: 400px !important; 
  }

  .carouselTwo #middle50 .containercell .containerPar {
	margin-top: 22.5px;
  }

  .carouselTwo #middle50 .containercell .dynamic-height {
    height: 400px !important;
  }

  /*Vertical & Horizontal Centre Alignment of Title*/
  .carouselTwo #middle50 .containercell .dynamic-height .title-comp h1.hub-carousel-heading,
  .carouselTwo #middle50 .containercell .dynamic-height .title-comp h2.carousel-heading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding-bottom: 0px;
  }

  .carouselTwo #middle50 .containercell .dynamic-height .title-comp.remove-br br {
    display: block;
  }

  .carouselTwo .col-xs-12.col-md-3 .containercell .default-btn {
	width: 370px;
    padding-left: 0px !important;
    padding-right: 0px !important;
    text-align: center;
  }

  .containercell.hiddenOnMobile {
    display: none;
  }

  /*Background Image for Mobile - Large*/
  .carouselTwo .inner-wrapper.containercellBG,
  .carouselTwo .inner-wrapper .containercell .dynamic-height.containercellBG {
    background-image: var(--mobileBackgroundImage,"");
  }

}

/*Mobile - Small*/
@media only screen and (min-width : 320px) and (max-width : 480px) {

  .carouselTwo .containercell .dynamic-height {
    max-height: 385px !important;
  }

  .carouselTwo #middle50 .containercell .containerPar {
	margin-top: 22.5px;
  }

  .carouselTwo #middle50 .containercell .dynamic-height {
    height: 385px !important;
  }

  /*Vertical & Horizontal Centre Alignment of Title*/
  .carouselTwo #middle50 .containercell .dynamic-height .title-comp h1.hub-carousel-heading,
  .carouselTwo #middle50 .containercell .dynamic-height .title-comp h2.carousel-heading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding-bottom: 0px;
  }

  .carouselTwo #middle50 .containercell .dynamic-height .title-comp.remove-br br {
    display: block;
  }

  .carouselTwo .col-xs-12.col-md-3 .containercell .default-btn {
	width: 100%;
    padding-left: 0px !important;
    padding-right: 0px !important;
    text-align: center;
  }

  .containercell.hiddenOnMobile {
    display: none;
  }

  /*Background Image for Mobile - Small*/
  .carouselTwo .inner-wrapper.containercellBG,
  .carouselTwo .inner-wrapper .containercell .dynamic-height.containercellBG {
    background-image: var(--mobileBackgroundImage,"");
  }

}

/* JLF Container Cell CSS Ends */
/* JLF Column Control CSS Begins */

.columncontrol {
	max-height: auto;
}

@media only screen and (min-width : 992px) {

    .columncontrol #left25 {
        padding: 0px 0px 0px 36px !important;
    }

    .columncontrol #middle50 {
        padding: 0px 40px 0px 40px !important;
    }

    .columncontrol #right25 {
        padding: 0px 36px 0px 0px !important;
    }

}

@media only screen and (max-width : 991px) {

	.columncontrol #left25,
	.columncontrol #right25,
	.columncontrol #middle50 {
  		padding: 0px !important;
  	}

}

/* JLF Column Control CSS Ends */
/* JLF Video Banner CSS Begins */

.videoBanner {
  min-width: 100%;
  max-width: 1920px;
  max-height: 6000px;
}

#videoBackground {
  position: relative;
  width: 100% !important;
  z-index: -1;
}

.aspectRatio16By9 .#videoBackground {
  min-height: 558px;
}

.aspectRatio3By1 .#videoBackground {
  min-height: 330.67px;
}

.carouselTwo #videoBackground {
  min-height: auto;
}

.videoBannerContent.videoBannerPar {
  position: absolute;
  top: 254px;
  width: 100%;
}

/*Desktop*/
@media only screen and (min-width : 992px) {

  .videoBanner .dynamic-height.videoBannerBG  {
    padding: 0px;
  }

  .videoBanner .containercell .dynamic-height {
    padding: 40px 0px 40px 0px;
  }

  .carouselTwo .videoBanner .dynamic-height {
    padding: 0px;
  }

  .aspectRatio16By9 .videoBannerContent.videoBannerPar,
  .aspectRatio16By9 .videoBannerContent.videoBannerPar .videoBannerPar {
    aspect-ratio: 16 / 9;
    min-height: 558px;
    width: 100%;
  }

  .aspectRatio3By1 .videoBannerContent.videoBannerPar,
  .aspectRatio3By1 .videoBannerContent.videoBannerPar .videoBannerPar {
    aspect-ratio: 3 / 1;
    min-height: 330.67px;
    width: 100%;
  }


  .videoBanner .columncontrol #middle50 {
    padding: 0px 40px 0px 40px !important;
  }



  .aspectRatio16By9 .videoBannerContent.videoBannerPar .videoBannerPar .columncontrol .column-ctrl-row {
    aspect-ratio: 16 / 9;
    min-height: 558px;
    margin: 0px;
  }

  .aspectRatio3By1 .videoBannerContent.videoBannerPar .videoBannerPar .columncontrol .column-ctrl-row {
    aspect-ratio: 3 / 1;
    min-height: 300.67px;
    margin: 0px;
  }

  .aspectRatio16By9 .videoBannerContent.videoBannerPar .videoBannerPar .columncontrol .column-ctrl-row #middle50{
    aspect-ratio: 950.5 / 1069;
    min-height: 558px;
    z-index: 2;
    position: relative;
  }

  .aspectRatio3By1 .videoBannerContent.videoBannerPar .videoBannerPar .columncontrol .column-ctrl-row #middle50{
    aspect-ratio: 950.5 / 633.48;
    min-height: 330.67px;
    z-index: 2;
    position: relative;
  }

  .videoBanner .dynamic-height.aspectRatio16By9 .videoBannerContent.videoBannerPar #middle50 .col-3-3-2b {
    position: absolute;
    top: 50.0%;
    left: 50.0%;
    transform: translate(-50%, -50%);
    width: 100%;
    padding-bottom: 0px;
  }

  .videoBanner .dynamic-height.aspectRatio3By1 .videoBannerContent.videoBannerPar #middle50 .col-3-3-2b {
    position: absolute;
    top: 50.0%;
    left: 50.0%;
    transform: translate(-50%, -50%);
    width: 100%;
    padding-bottom: 0px;
  }


}

/*iPad Pro 12.9" (Landscape) - Safari & Chrome*/
@media only screen
  and (min-width: 1365px)
  and (max-width: 1366px)
  and (orientation: landscape)
  and (-webkit-min-device-pixel-ratio: 2) {

  .videoBanner .dynamic-height.aspectRatio16By9 .videoBannerContent.videoBannerPar {
    height: 768.375px;
    top: 251px;
  }

  .videoBanner .dynamic-height.aspectRatio3By1 .videoBannerContent.videoBannerPar {
    height: 455.333px;
    top: 251px;
  }

  .videoBanner .dynamic-height .videoBannerContent.videoBannerPar .videoBannerPar {
    height: 100%;
  }

  .videoBannerContent.videoBannerPar .videoBannerPar .columncontrol.section {
    height: 100%;
  }

  .videoBannerContent.videoBannerPar .videoBannerPar .columncontrol .column-ctrl-row {
    height: 100%;
  }

  .videoBannerContent.videoBannerPar .videoBannerPar .columncontrol .column-ctrl-row #middle50 {
    height: 100%;
  }

}

/*iPad Pro 10.5" (Landscape) - Safari & Chrome*/
@media only screen
  and (min-width: 1112px)
  and (max-width: 1194px)
  and (orientation: landscape)
  and (-webkit-min-device-pixel-ratio: 2) {

  .videoBanner .dynamic-height.aspectRatio16By9 .videoBannerContent.videoBannerPar {
    height: 671.625px;
    top: 251px;
  }

  .videoBanner .dynamic-height.aspectRatio3By1 .videoBannerContent.videoBannerPar {
    height: 398px;
    top: 251px;
  }

  .videoBanner .dynamic-height .videoBannerContent.videoBannerPar .videoBannerPar {
    height: 100%;
  }

  .videoBannerContent.videoBannerPar .videoBannerPar .columncontrol.section {
    height: 100%;
  }

  .videoBannerContent.videoBannerPar .videoBannerPar .columncontrol .column-ctrl-row {
    height: 100%;
  }

  .videoBannerContent.videoBannerPar .videoBannerPar .columncontrol .column-ctrl-row #middle50 {
    height: 100%;
  }

}



/*Tablet*/
@media only screen and (min-width : 769px) and (max-width : 991px) {

  #videoBackground {
    display: none;
  }

  /* Hide Desktop Content ParSys content on Mobile & Tablet */
  .videoBanner.hideVideoBanner {
    display: none;
  }

}


/*Mobile - Large*/
@media only screen and (min-width : 481px) and (max-width : 768px) {

  #videoBackground {
    display: none;
  }

  /* Hide Desktop Content ParSys content on Mobile & Tablet */
  .videoBanner.hideVideoBanner {
      display: none;
  }

}

/*Mobile - Small*/
@media only screen and (min-width : 320px) and (max-width : 480px) {

  #videoBackground {
    display: none;
  }

  /* Hide Desktop Content ParSys content on Mobile & Tablet */
  .videoBanner.hideVideoBanner {
      display: none;
  }

}

/* JLF Video Banner CSS Ends */
/* JLF CTA Inline CSS Begins */

.ctaInline {
    width: 100%;
    height: 75px;
    position: relative;
}

.ctaInlineWrapper {
    width: 100%;
    text-align: center;
    display: flex;
    justify-content: center;
}

/*Desktop*/
@media only screen and (min-width : 992px) {

    .sideBySide {
        flex: 1;
        width: 100%;
        min-width: 190px;
        max-width: 325px;
        box-sizing: border-box;
    }

    #leftCTA.sideBySide {
        margin-right: 40px;
        flex-shrink: 0 !important;
    }

    #rightCTA.sideBySide {
        width: auto;
     }

    .ctaInlineWrapper .btn-container .default-btn.small-btn,
    .ctaInlineWrapper .btn-container .default-btn.large-btn {
        width: 100%;
	    padding-left: 0;
	    padding-right: 0;
    }

}

/* JLF CTA Inline CSS Ends */
/** Video Lightbox CSS START **/

.video-lightbox {
    width: 100%;
	padding-top: 20px;
    padding-bottom: 20px;  
    position: relative;
    text-align: center;
}

.video-lightbox a {
    font-weight:400;
    text-decoration: underline;
    cursor: pointer;
}

.video-lightbox img {
    width: 35px;
}

.carouselTwo .containercell .dynamic-height .video-lightbox img {
  	width: 35px;
  	display: inline !important;
}

.dynamic-height .video-lightbox img {
  	width: 35px;
  	display: inline !important;
}

.videoBanner .columncontrol .containercell .dynamic-height .video-lightbox img {
  	width: 35px;
  	display: inline !important;
} 

#videoLightboxModal  {
  	z-index: 2063 !important;
  	position: fixed;
  	padding-top: 20px;
  	padding-right: 50px;
  	padding-bottom: 50px;
  	padding-left: 50px;      
}

#videoLightboxModal .modal-dialog {
  	width: 100%;
  	max-width: 1200px;
}

#videoLightboxModal .modal-header {
  	border-bottom: none;
  	padding-top: 20px;
  	padding-right: 20px;  
  	padding-left: 0;
  	padding-bottom: 0;     
}

#videoLightboxModal .modal-content {
  margin: 0 auto;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#videoLightboxModal .modal-body {
  	padding-top: 20px;
  	padding-right: 20px;
  	padding-left: 20px;
  	padding-bottom: 20px;
}


#videoLightboxModal .btn-container .small-btn {
    float: right;
    font-size: 20px !important;
    height: 36px;
    /*width: 140px;*/
}

#videoLightboxModal .modal-dialog .modal-content .modal-body {
  	z-index: 2060 !important;
}

#videoLightboxModal .modal-dialog .modal-content  {
  	z-index: 2061 !important;
}

#videoLightboxModal .modal-dialog  {
  	z-index: 2062 !important;
}

#videoLightboxModal .close-mobile {
    display: none;
}

body.modal-open #videoLightboxModal.modal {
    z-index: 5002 !important;
}


/* Tablet media query - specifically for ipad*/
@media all and (min-width : 1024px) and (max-width : 1024px)  and (orientation: landscape) {
    #videoLightboxModal .modal-dialog {
        margin-left: 25px;
    }
}

/* Tablet media query */
@media only screen and (min-width : 481px) and (max-width : 768px) {

.video-lightbox {
    	width: 100%;
	padding-top: 5px;
    	padding-bottom: 5px;
}

	#videoLightboxModal  {
  		z-index: 2063 !important;
  		position: fixed;
  		padding-bottom: 50px;  
        padding-right: 0;
	padding-left: 0;
}    

	#videoLightboxModal .modal-header {
  		border-bottom: none;
  		padding-top: 10px;
  		padding-right: 10px; 
  		padding-left: 0;  
  		padding-bottom: 0;     
	} 

	#videoLightboxModal .modal-body {
  		padding-top: 10px;
  		padding-right: 20px;
  		padding-left: 20px;
  		padding-bottom: 20px;
	}                                

.video-lightbox img {
	width: 35px;
}

    #videoLightboxModal .modal-header .close-desktop {
		display: none;
	} 

    body.modal-open #videoLightboxModal.modal {
        margin: 0 0 0 0 !important;
	} 

    #videoLightboxModal .close-mobile {
    	display: block;
        float: right;
	}  

	#videoLightboxModal .close-mobile .close {
    	font-weight: 200px !important;
    	opacity: 1;
        text-shadow: none;
	}    

    #videoLightboxModal .close-desktop {
		display: none;
	} 
}
	
/* Mobile media query */
@media only screen and (min-width : 320px) and (max-width : 480px) {

.video-lightbox {
    width: 100%;
	padding-top: 5px;
    padding-bottom: 5px;
}

.video-lightbox img {
  	width: 35px;
}


	#videoLightboxModal  {
  		z-index: 2063 !important;
  		position: fixed;
  		padding-bottom: 50px;  
        padding-right: 0;
        padding-left: 0;  
	}

	#videoLightboxModal .modal-header {
  		border-bottom: none;
  		padding-top: 10px;
  		padding-right: 10px; 
  		padding-left: 0;  
  		padding-bottom: 0;                                   
	}  

	#videoLightboxModal .modal-body {
  		padding-top: 10px;
  		padding-right: 20px;
  		padding-left: 20px;
  		padding-bottom: 20px;
	}                                


    #videoLightboxModal .modal-header .close-desktop {
		display: none;
	} 

	#videoLightboxModal .modal-body {
  		padding-top: 0px;
  		padding-right: 0px;
  		padding-left: 0px;  
  		padding-bottom: 0px;
        	margin: 0 0 0 0;
	} 

    body.modal-open #videoLightboxModal.modal {
        margin: 0 0 0 0 !important;
	} 

	#videoLightboxModal .close-mobile {
    	display: block;
        float: right;
	}  

	#videoLightboxModal .close-mobile .close {
    	font-weight: 200px !important;
    	opacity: 1;
        text-shadow: none;
        margin-bottom: 10px;
	} 

	#videoLightboxModal .close-desktop {
		display: none;
	} 
}

/** Video Lightbox CSS END **/

/*Sticky Navigation Container CSS Start*/


	#stickyContainer {
	  background: #ffffff;    
	}

    .sticky-nav-box-shadow {
      height: 88px;    
      z-index: 1000;
      box-shadow: 0 7px 10px 2px #dcdcdc;         
    }

    .sticky {
      position: fixed;
      top: -10px; 
      width: 100%; 
      left: 0;  
      margin-top: 10px;
      height: 88px;    
      z-index: 1000;
    }
    
    .sticky + .content { 
      padding-top: 60px; 
    }


/*Sticky Navigation Container CSS End*/
/* Horizontal Accordion CSS BEGINS*/

.container .horizontalAccordionContainer {
    margin: auto;
    position: relative;
}

.horizontalAccordionContainer .horizontalAccordionAuthorLabel {
    display: block;
}

.horizontalAccordionContainer {
    display: flex;
    justify-content: center;
    max-width: 1000px;
}

.horizontalAccordionContainer ul {
    display: flex;
    min-height: 430px;
    max-height: 430px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    list-style-type: none;
    max-width: 1000px;
}

.horizontalAccordionContainer li {
    flex: 1;
    display: flex;
    cursor: pointer;
    transition: all .5s ease;
    max-width: 400px;
}

.horizontalAccordionContainer li .section-title {
    flex: 1;
    color: white;
    display: block;
    margin: 0px;
    padding: 0px;
    transition: width .25s ease-in-out .1s ;

}

.horizontalAccordionContainer li .section-content {
    flex: 1;
    display: block;
    margin: 0px;
    padding: 0px;
    opacity: 0;
    transition: width .25s ease-in-out .1s ;
}



/* ACTIVE STATE*/

.horizontalAccordionContainer li.active {
    width: 400px;
}

.horizontalAccordionContainer li.active {
    flex: 5;
    cursor: pointer;
}

.horizontalAccordionContainer li.active .section-title {
    width: 0px;
    display: none;
}


.horizontalAccordionContainer li.active .section-content {
    flex: 4;
    opacity: 1;
    transform: scaleX(1);
    color: #E74C3C;

    width: 400px;
}

.horizontalAccordionContainer li.active #sc1.section-content {
    background-color: var(--sc1bgc);
    padding: var(--sc1Padding);
}
.horizontalAccordionContainer li.active #sc2.section-content {
    background-color: var(--sc2bgc);
    padding: var(--sc2Padding);
}
.horizontalAccordionContainer li.active #sc3.section-content {
    background-color: var(--sc3bgc);
    padding: var(--sc3Padding);
}
.horizontalAccordionContainer li.active #sc4.section-content {
    background-color: var(--sc4bgc);
    padding: var(--sc4Padding);
}



/* COLLAPSED STATE */

.horizontalAccordionContainer li.collapsed {
    width: 200px;
}

.horizontalAccordionContainer li.collapsed .section-content {
    width: 0px;
    display: none;
}

.horizontalAccordionContainer li.collapsed.visibleForAuthor .section-title .plusContainer,
.horizontalAccordionContainer li.collapsed.visibleForAuthor .section-content .minusContainer {
    display: none;
}

.horizontalAccordionContainer li.collapsed.visibleForAuthor .section-title,
.horizontalAccordionContainer li.collapsed.visibleForAuthor .section-title .text-copy,
.horizontalAccordionContainer li.collapsed.visibleForAuthor .section-content,
.horizontalAccordionContainer li.collapsed.visibleForAuthor .section-content .text-copy {
    display: contents;
}

.horizontalAccordionContainer li.collapsed #st1.section-title,
.horizontalAccordionContainer li.collapsed.visibleForAuthor #st1.section-title .text.parbase {
    background-color: var(--st1bgc);
    padding: var(--st1Padding);
}
.horizontalAccordionContainer li.collapsed #st2.section-title,
.horizontalAccordionContainer li.collapsed.visibleForAuthor #st2.section-title .text.parbase {
    background-color: var(--st2bgc);
    padding: var(--st2Padding);
}
.horizontalAccordionContainer li.collapsed #st3.section-title,
.horizontalAccordionContainer li.collapsed.visibleForAuthor #st3.section-title .text.parbase {
    background-color: var(--st3bgc);
    padding: var(--st3Padding);
}
.horizontalAccordionContainer li.collapsed #st4.section-title,
.horizontalAccordionContainer li.collapsed.visibleForAuthor #st4.section-title .text.parbase {
    background-color: var(--st4bgc);
    padding: var(--st4Padding);
}

.horizontalAccordionContainer li.collapsed.visibleForAuthor #sc1.section-content .text.parbase {
    background-color: var(--sc1bgc);
    padding: 0px;
}

.horizontalAccordionContainer li.collapsed.visibleForAuthor #sc2.section-content .text.parbase {
    background-color: var(--sc2bgc);
    padding: 0px;
}

.horizontalAccordionContainer li.collapsed.visibleForAuthor #sc3.section-content .text.parbase {
    background-color: var(--sc3bgc);
    padding: 0px;
}

.horizontalAccordionContainer li.collapsed.visibleForAuthor #sc4.section-content .text.parbase {
    background-color: var(--sc4bgc);
    padding: 0px;
}



/* PLUS SYMBOL */
.horizontalAccordionContainer li .section-title .plusContainer {
    display: flex;
    justify-content: center;
}

.horizontalAccordionContainer li .section-title .plusContainer .plus {
    position: absolute;
    bottom: 98px;
    margin: 0 auto;
    width: 40px;
    height: 40px;
}

.horizontalAccordionContainer li .section-title .plusContainer .plus:before,
.horizontalAccordionContainer li .section-title .plusContainer .plus:after {
    content: "";
    position: absolute;
    background: #fff;
}

/* The Vertical Line */
.horizontalAccordionContainer li .section-title .plusContainer .plus:before {
    left: 50%;
    top: 0px;
    bottom: 0px;
    width: 1px;
    transform:translateX(-50%);
}

/* The Horizontal Line */
.horizontalAccordionContainer li .section-title .plusContainer .plus:after {
    top: 50%;
    left: 0px;
    right: 0px;
    height: 1px;
    transform: translateY(-50%);
}



/* MINUS SYMBOL */
.horizontalAccordionContainer li .section-content .minusContainer {
    display: flex;
    justify-content: center;
}

.horizontalAccordionContainer li .section-content .minusContainer .minus {
    position: absolute;
    margin: 0 auto;
    width: 31.67px;
    height: 40px;
}

/* The Horizontal Line */
.horizontalAccordionContainer li .section-content .minusContainer .minus:after {
    content: "";
    position: absolute;
    background: #fff;
    top: 50%;
    left: 0px;
    right: 0px;
    height: 1.67px;
    transform: translateY(-50%);
}

/* To hide Horizontal Accordion on screen less than component's max width of 1000px */
@media (max-width: 999px) {

    .horizontalAccordionContainer.hideForMobileAndTablets {
        display: none;
    }

}


/* Horizontal Accordion CSS ENDS*/

/* ExpertLib CSS BEGINS*/
.article-teaser { 
    margin-top:10px;
    padding:20px;
}
.article-teaser .title-comp h4 {
    margin-bottom:0;

}
.article-teaser img {
     width: 100%;
    display: block;
    margin-bottom: 25px;
    }
.title-margin {
    margin-bottom:20px;
} 
.teaser-link {
    color: #000000
    font-size 18px;
    font-weight: 400;
    letter-spacing: 0px;
    line-height: 21px;
    font-family: "GillSansForJL";
    text-align: center;
    text-decoration: underline;
    
}

/* ExpertLib CSS ENDS*/