/* Overrides and base styles */
 body {
     background-color: #373737;
     padding-top: 50px;
}
 @font-face {
     font-family: "Gotham Bold";
     src: url("./assets/fonts/Gotham-Bold.woff2") format("woff2"), url("../assets/fonts/Gotham-Bold.woff") format("woff");
     font-weight: bold;
     font-style: normal;
     font-display: swap;
}
 @font-face {
     font-family: "Gotham Black";
     src: url("./assets/fonts/Gotham-Black.woff2") format("woff2"), url("../assets/fonts/Gotham-Black.woff") format("woff");
     font-weight: 500;
     font-style: normal;
     font-display: swap;
}
 @font-face {
     font-family: "Gotham Book";
     src: url("./assets/fonts/Gotham-Book.woff") format("woff"), url("../assets/fonts/Gotham-Book.woff2") format("woff2"), url("../assets/fonts/Gotham-Book.ttf") format("truetype");
     font-weight: normal;
     font-style: normal;
     font-display: swap;
}
 .title-lines {
     border-top: 1px solid #c0c0c0 
}
 .nowrap {
     white-space: nowrap;
}
 .navbar-inverse-sfcc {
     background-color: #253948;
}
 .navbar-inverse {
     background-color: #000000;
}
 .navbar-inverse .dropdown-menu {
     background-color: rgba(37, 37, 37, 0.90);
}
 .navbar-inverse .dropdown-menu>li>a {
     color: #9d9d9d;
}
 .navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover, .navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:hover, .navbar-inverse .navbar-nav>.active>a:focus, .navbar-inverse .dropdown-menu>li>a, .navbar-inverse .dropdown-menu>li>a:hover, .navbar-inverse .dropdown-menu>li>a:focus {
     background-color: transparent;
}
 .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover, .navbar-inverse .navbar-nav>.active>a:hover, .navbar-inverse .navbar-nav>.active>a:focus, .navbar-inverse .dropdown-menu>li>a:hover, .navbar-inverse .dropdown-menu>li>a:focus {
     color: #fff;
}
 .carousel-inner {
     min-height: 250px;
}
 .carousel-caption {
     right: auto;
     left: 0;
     top: 0;
     bottom: 0;
     padding-left: 25px;
     padding-right: 25px;
     background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 100%);
     background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 100%);
     background: linear-gradient(to bottom, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 100%);
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#66000000', GradientType=0);
}
 .carousel-caption>div {
     position: absolute;
     top: 50%;
     left: 50%;
     -webkit-transform: translate(-50%, -50%);
     -moz-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     -o-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
}
 .carousel-caption>div>img {
     max-width: 175px;
     margin: auto;
}
 .carousel-indicators {
     bottom: 10px;
}
 .carousel-inner>.item>img {
     margin-left: auto;
     margin-right: auto;
     min-height: 250px;
}
 @media ( min-width : 768px ) {
     .carousel-caption {
         width: 300px;
    }
}
 @media ( max-width : 767px ) {
     .carousel-caption {
         width: 100%;
    }
     .carousel-indicators {
         bottom: -10px;
    }
     .carousel-caption>div>h3 {
         font-size: 1.1em;
    }
}
 .container {
     padding-left: 10px;
     padding-right: 10px;
}
 .row {
     margin-left: -10px;
     margin-right: -10px;
}
 .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
     padding-right: 10px;
     padding-left: 10px;
}
/* End Overrides*/
/* Background Colors */
 .bg-1 {
     background-color: #948260;
}
 .bg-2 {
     background-color: #fff;
}
 .bg-3 {
     background-color: #cdcdcd;
}
 .bg-4 {
     background-color: #202020;
}
 .bg-5 {
     background-color: #253948 !important;
}
.bg-6 {
color: #253948 !important;
}
 .logo-bar {
     padding: 15px 0;
     white-space: nowrap;
     overflow-x: auto;
}
/* Disabled unless they dislike the visible scrollbar .logo-bar::-webkit-scrollbar {
     display:none;
}
 */
 .logo-bar span {
     padding: 0px;
}
 .logo-bar span a img {
     max-width: 125px;
     max-height: 80px;
}
 .main-container {
     margin-top: 200px;
     background-color: #ebebeb;
}
 .main-container-sfcc {
     margin-top: 0px;
     background-color: #F1F9FA;
     padding: 10px;
}
 .title-font {
     font-family: "Muli", serif;
}
/* Product Tiles for the Homepage */
 .product-tile {
     position: relative;
}
 .product-tile:hover {
}
 .product-tile-image {
}
 .product-tile-image>img {
     min-width: 100%;
}
 .product-tile-caption-wrapper {
     position: absolute;
     top: 0;
     bottom: 0;
     left: 0;
     right: 0;
     width: 100%;
     z-index: 8;
     background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 100%);
     background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 100%);
     background: linear-gradient(to bottom, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 100%);
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#66000000', GradientType=0);
}
 .product-tile-caption-wrapper.bottom {
     top: auto;
     display: flex;
}
 .product-tile-caption-wrapper.right, .product-tile-caption-wrapper.left {
     display: flex;
     align-items: center;
     width: 40%;
}
 .product-tile-caption-wrapper.right {
     left: auto;
}
 .product-tile-caption-wrapper.left {
     right: auto;
}
 .product-tile-caption {
     color: #fff;
     display: inline-block;
     margin: auto;
     padding-left: 10px;
     padding-right: 10px;
}
 .product-tile-caption-wrapper.bottom .product-tile-caption {
     padding-top: 10px;
     padding-bottom: 10px;
     width: 100%;
     display: -webkit-box;
     display: -moz-flex;
     display: -ms-flexbox;
     display: -o-flex;
     display: -webkit-flex;
     display: flex;
     flex: 1 1 100%;
     align-items: center;
     flex-direction: row;
}
 .product-tile-caption-wrapper.bottom .product-tile-caption-logo {
     width: 33%;
     flex: 1 1 auto;
}
 .product-tile-caption-wrapper.bottom .product-tile-caption-text {
     width: 66%;
     flex: 1 1 auto;
}
 .product-tile-caption-logo-wrapper {
     position: absolute;
     top: 0;
     bottom: 0;
     left: 0;
     right: auto;
     width: 50%;
}
 .product-tile-caption-logo-wrapper .product-tile-caption-logo {
     position: relative;
     height: 100%;
     padding: 10px;
}
 .product-tile-caption-logo-wrapper .product-tile-caption-logo>img {
     height: 100%;
     margin: auto;
}
 .product-tile-caption h3 {
     font-family: "Muli", serif;
     margin: 0;
     font-weight: 400;
     font-size: 1em;
}
 .product-tile-caption button {
     margin-top: 10px;
}
 .product-tile-solo-button {
     position: absolute;
     top: 0;
     bottom: 0;
     left: 0;
     right: 0;
     width: 100%;
     display: flex;
     align-items: center;
}
 .product-tile-solo-button button, .product-tile__button {
     background-color: transparent;
     border: 2px solid #fff;
     color: #fff;
     margin: auto;
}
 .product-tile-solo-button button {
     width: 90%;
}
 @media ( max-width : 480px ) {
     .product-tile-caption h3 {
         font-size: 1em;
    }
     .product-tile-caption-wrapper.right {
         left: auto;
         width: 50%;
    }
     .product-tile-caption-wrapper.left {
         right: auto;
         width: 50%;
    }
     .product-tile-caption-wrapper.bottom {
    }
    
    .viewport-height {
    
    height:100% !important;
    }
    
    .contact-block-sfcc {
    width : 100% !important;
    }
    
    .contact-card-sfcc{
     height: 100% !important;
    }
}
 @media ( min-width : 479px ) and (max-width: 767px) {
     .product-tile-caption h3 {
         font-size: 1em;
    }
     .product-tile-caption-wrapper.right {
    }
     .product-tile-caption-wrapper.left {
    }
     .product-tile-caption-wrapper.bottom {
    }
}
 @media ( min-width : 767px) {
     .product-tile-caption-wrapper.bottom {
         height: 120px;
    }
}
 .pre-footer {
     min-height: 10px;
     background-color: #131313;
}
 .footer {
     color: #fff;
}
 .footer .nav>li>a, .footer .nav>li>a:visited {
     padding: 4px 10px;
     color: #cecece;
     transition: box-shadow 0.35s ease, background-color 0.35s ease;
     box-shadow: 0 0 2px rgba(32, 32, 32, 1);
}
 .footer .nav>li>a:focus, .footer .nav>li>a:hover {
     color: #cecece;
     background-color: rgba(20, 20, 20, 1);
     box-shadow: 0 0 2px 2px rgba(20, 20, 20, 1);
}
/* Product Tiles for Garment Display and Product Display */
 .product-card {
     background: #fff;
     border-radius: 2px;
     display: block;
     margin: 0.5rem;
     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
     transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
}
 .product-card h3 {
     font-size: 1.1em;
     font-weight: bold;
}
 .product-card:hover {
     box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}
 .product-card:hover .tooltiptext {
     visibility: visible;
     opacity: 1;
}
 .tooltiptext {
     visibility: hidden;
     width: 120px;
     background-color: black;
     color: #fff;
     text-align: center;
     border-radius: 6px;
     padding: 5px 0;
     position: absolute;
     z-index: 1;
     bottom: 100%;
     left: 50%;
     margin-left: -60px;
}
 .product-card__image-wrapper {
     padding: 65px 0 120px 0;
}
 .product-card__info {
     padding: 2px 30px;
     border: black 1px solid;
     width: 90%;
     position: absolute;
     top: 250px;
     left: 50%;
     transform: translateX(-50%);
}
 .product-card__name {
     color: black;
}
 .breadcrumb {
     margin-bottom: 0;
     background-color: transparent;
}
 .table-trans-borders, .table-trans-borders tr, .table-trans-borders td, .table-trans-borders table {
     border-color: transparent;
}
 .btn {
     border-radius: 0;
}
 .btn-default {
     background-color: #948260;
     color: white;
     border: 1px solid transparent;
}
 .btn-default:hover, .btn-default:focus {
     background-color: #826c43;
     color: white;
     border-color: transparent;
}
 .btn-default:active, .btn-default:active:focus {
     background-color: #826c43;
     color: white;
     border-color: transparent;
}
 .btn-primary {
     background-color: #293847;
     color: white;
     border: 1px solid transparent;
}
 .btn-primary:hover, .btn-primary:focus {
     background-color: #1f2e3d;
     border-color: transparent;
}
 .btn-primary:active, .btn-primary:active:focus {
     background-color: #1f2e3d;
     border-color: transparent;
}
 .btn-secondary {
     background-color: #636363;
     color: white;
     border: 1px solid transparent;
}
 .btn-secondary:hover, .btn-secondary:focus {
     background-color: #373737;
     border-color: transparent;
     color: white;
}
 .btn-secondary:active, .btn-secondary:active:focus {
     background-color: #373737;
     border-color: transparent;
     color: white;
}
 .reqLabel {
     color: #f00;
}
 .panel {
     margin-bottom: 0px;
}
/* * Begin Product UI */
 .product-title {
     border-bottom: black solid 1px;
}
 .product-order {
     background-color: floralwhite;
     padding: 0 10px;
}
 .product-order__heading {
     font-weight: bold;
}
 .product-order__section {
     padding: 20px 5px 0 5px;
}
 .ProductUI-card {
     background-color: #fff;
     margin-bottom: 5px;
     padding: 10px;
}
 .product-thumbnail__swatch {
     width: 30px;
     height: 30px;
     display: inline-block;
}
 .product-thumbnail__swatch.selected {
     -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16), 0 2px 4px rgba(0, 0, 0, 0.23);
     -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16), 0 2px 4px rgba(0, 0, 0, 0.23);
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16), 0 2px 4px rgba(0, 0, 0, 0.23);
}
/* * End Product UI */
/* * Carrier Preferences middle buttons */
 @media only screen and (min-width:767px) {
     .middle-buttons {
         margin-top: 90px;
    }
}
/** * Carrier Preferences middle buttons */
/** * vf-nav-tabs */
 ul.vf-nav-tabs {
     background-color: #636363;
}
 ul.vf-nav-tabs li a {
     border: none;
     color: white;
     margin-right: 0;
}
 ul.vf-nav-tabs li a:hover, ul.vf-nav-tabs li a:focus {
     background-color: #ebebeb;
     color: black;
     border: 0;
     border-radius: 0;
}
 ul.vf-nav-tabs li.active {
     background-color: #ebebeb;
     color: black;
}
 ul.vf-nav-tabs li.active a {
     background-color: #ebebeb;
     border: none;
     text-decoration: underline;
     font-weight: bold;
}
 ul.vf-nav-tabs li.active a:hover, ul.vf-nav-tabs li.active a:focus {
     background-color: #ebebeb;
     border: none;
}
/** * QuickOrder */
 .quick-order-table-body a {
     background-color: #202020;
     color: white !important;
}
 ul.quickorder-tabs {
     background-color: #636363;
}
 ul.quickorder-tabs li a {
     border: none;
     color: white;
     margin-right: 0;
}
 ul.quickorder-tabs li a:hover, ul.quickorder-tabs li a:focus {
     background-color: #ebebeb;
     color: black;
     border: none;
     border-radius: 0;
}
 ul.quickorder-tabs li.active {
     background-color: #ebebeb;
     color: black;
}
 ul.quickorder-tabs li.active a {
     background-color: #ebebeb;
     border: none;
     text-decoration: underline;
     font-weight: bold;
}
 ul.quickorder-tabs li.active a:hover, ul.quickorder-tabs li.active a:focus {
     background-color: #ebebeb;
     border: none;
}
 a.example-links {
     color: #363636;
     text-decoration: underline;
}
 .btn-file {
     position: relative;
     overflow: hidden;
}
 .btn-file input[type=file] {
     position: absolute;
     top: 0;
     right: 0;
     min-width: 100%;
     min-height: 100%;
     font-size: 100px;
     text-align: right;
     filter: alpha(opacity = 0);
     opacity: 0;
     outline: none;
     background: white;
     cursor: inherit;
     display: block;
}
/* * End QuickOrder */
 @media only screen and (max-width: 767px) {
     .table-responsive thead {
         display: none;
    }
     .table-responsive tr {
         display: block;
    }
     .table-responsive tr, .table-responsive td {
         float: left;
         clear: both;
         width: 100%;
    }
     .table-responsive th, .table-responsive td {
         display: block;
         text-align: right;
         padding: 10px;
         margin: 0;
    }
     .table-responsive.right-align th, .table-responsive.right-align td {
         text-align: right;
    }
     .table-responsive td:before {
         content: attr(data-label);
         float: left;
         text-transform: uppercase;
         font-weight: bold;
         padding-right: 10px;
    }
}
 @media ( min-width : 480px) {
}
 @media ( min-width : 768px) {
}
 @media ( min-width : 991px) {
}
 @media ( min-height : 800px) {
 .sfcc-height {
 }
 .sfcc-login-logo-container{
 height:90vh !important;
 }
 .sfcc-login-contact-wrapper{
   top: 250px !important;
 }
 .logo-item img{
 height:85px !important;
 }
}
/* ShoppingCart and Unsent Orders dropdown styles */
 .unsent-orders-notification--dropdown-toggle, .ShoppingCart--dropdown-toggle {
     text-decoration: none !important;
     font-size: 1.65rem;
}
/**/
/* Drop Shadow Utility Classes */
 .ds-1 {
     box-shadow: 0 1px 2px rgba(0, 0, 0, 0.13), 0 1px 2px rgba(0, 0, 0, 0.23);
     -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.13), 0 1px 2px rgba(0, 0, 0, 0.23);
     -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.13), 0 1px 2px rgba(0, 0, 0, 0.23);
     -o-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.13), 0 1px 2px rgba(0, 0, 0, 0.23);
}
 .ds-2 {
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.13), 0 2px 4px rgba(0, 0, 0, 0.23);
     -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.13), 0 2px 4px rgba(0, 0, 0, 0.23);
     -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.13), 0 2px 4px rgba(0, 0, 0, 0.23);
     -o-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.13), 0 2px 4px rgba(0, 0, 0, 0.23);
}
/* Padding Utility Classes */
 .pad-none {
     padding: 0;
}
 .pad-all {
     padding: 30px !important;
}
 .viewport-height {
     height: 90vh;
}
 .pad-bottom {
     padding-bottom: 20px;
}
 .pad-top {
     padding-top: 20px;
}
 .pad-sides {
     padding-left: 20px;
     padding-right: 20px;
}
 .pad-half {
     padding-left: 10px;
     padding-right: 10px;
}
 .pad-half-all {
     padding: 10px;
}
 @media ( max-width :767px ) {
     .sm-pad-none {
         padding: 0;
    }
     .sm-pad-top-20 {
         padding-top: 20px;
    }
}
 .no-round {
     border-radius: 0 !important;
}
 .tiny-margin {
     margin: 0.5rem;
}
 .tiny-margin-no-bottom {
     margin: 0.5rem 0.5rem 0 0.5rem;
}
/* START - Brand Page */
 .brand-page__left-bar {
     background-color: #3D3B3E;
}
 .brand-page__right-bar {
     background-color: #282828;
}
 .brand-page__left-content {
     background-color: #FFF;
     padding: 25px;
}
 .brand-page__right-content {
     width: auto;
     background-color: #CCC;
     padding: 25px;
}
 @media ( min-width :767px ) {
     .brand-page__left-bar, .brand-page__right-bar {
         text-align: left;
    }
     .brand-page__left-bar, .brand-page__left-content {
         width: 66.66666667%;
    }
     .brand-page__right-bar, .brand-page__right-content {
         width: 33.33333%;
    }
}
/* z-nav-pills */
 .z-nav-pills>li>a {
     -webkit-border-radius: 0;
     -moz-border-radius: 0;
     border-radius: 0;
     padding-top: 15px;
     padding-bottom: 15px;
     font-weight: bold !important;
     color: #BFBFBF;
}
 .z-nav-pills>li>a:focus, .z-nav-pills>li>a:active, .z-nav-pills>li>a:active:focus, .z-nav-pills>li>a:hover {
     color: #333;
     background-color: #fff;
}
/* End z-nav-pills */
/* Same-height-columns */
 .same-height-columns {
     display: block;
}
 .same-height-columns .col {
     display: block;
}
 @media ( min-width :767px ) {
     .same-height-columns {
         display: table;
         width: 100%;
    }
     .same-height-columns .col {
         display: table-cell;
         vertical-align: top;
    }
     .three-btn-group .btn {
         width: 50% !important;
    }
}
/* End Same-height-columns*/
 .brand-page__social-links {
     display: table;
}
 .social-links__link {
     display: table-cell;
}
 .social-links__image {
     height: 50px;
     padding: 10px;
     -webkit-box-shadow: inset -1px 0 0 #eee;
     -moz-box-shadow: inset -1px 0 0 #eee;
     box-shadow: inset -1px 0 0 #eee;
}
 @media ( max-width :767px ) {
     .brand-page__social-links {
         margin: auto;
    }
}
 .overflow-hide {
     overflow: hidden;
}
/* END - Brand Page */
 .form-horizontal .form-group {
     padding-left: 10px;
     padding-right: 10px;
}
 @media screen and (max-width: 468px) {
     .horizontal-sub-tab {
         white-space: nowrap;
         overflow-x: auto;
    }
}
 .horizontal-sub-tab a {
     border: 1px solid #F1F9FA;
     border-bottom: none;
     padding: 17px 20px;
     display: inline-block;
     background: #F1F9FA;
     color: #559EBB;
     cursor: pointer;
     border-radius: 10px 10px 0 0;
     font-size: 15px;
     text-decoration: none;
}
 .horizontal-sub-tab a:hover, .horizontal-sub-tab a.active {
     background: #FFFFFF;
     color: #253948;
     position: relative;
     top: 1px;
     font-family: "Gotham Bold";
     font-weight: bold;
}
 .horizontal-sub-tabcontent {
     border: 1px solid #a5a3a3;
     box-shadow: 0 48px 80px -32px rgba(0, 0, 0, 0.3);
     border-top: transparent;
     padding: 10px;
}
 .bg-grey {
     background: #e4e4e4;
}
 .bg-white {
     background: #FFFFFF;
}
 .accnt-pay-form {
     padding: 20px;
}
 .font-botham {
     font-family: "Gotham Bold" !important;
     color: #253948 !important;
     font-size: 24px;
}
 .accnt-pay-form .searchLabel {
     color: #253948;
     font-family: "Gotham Book";
     font-size: 15px;
     text-align: right;
     padding-right: 30px;
     padding-top: 18px;
}
 .accnt-pay-form .form-control {
     display: block;
     width: 100%;
     padding: 0 30px;
     font-family: "Gotham Book";
     font-size: 20px;
     font-weight: 400;
     height: 40px;
     border: unset;
     border-radius: 20px;
     outline: none;
     background-color: #DBECF2;
     border: 1px solid #d4d4d4;
}
 .accnt-pay-form .form-control::placeholder {
     color: #3982A1;
    /* Change to your desired color */
     font-size: 15px;
    /* Ensures consistent opacity across browsers */
}
 .accnt-pay-form .mb-0 {
     margin-bottom: 5px !important;
}
 .three-btn-group {
     text-align: center !important;
     padding-top: 35px;
     display: flex;
     justify-content: center;
}
 .three-btn-group .btn {
     width: 250px !important;
     height: 40px;
     width: 100%;
     border: unset;
     border-radius: 20px;
     font-size: 16px;
     font-weight: 800;
     font-family: "Gotham Black";
     padding: 0px;
     margin: 10px;
     text-transform: capitalize;
     letter-spacing: 0;
     cursor: pointer;
     text-transform: capitalize;
}
 .three-btn-group .btn-secondary {
     color: #253948;
     background: #FFFFFF;
     border: 1px solid #BBDBE6;
}
 .three-btn-group .btn-primary {
     color: #253948;
     background: #BBDBE6;
}
 .align-center {
     text-align: center !important;
}
 .searchfilterblock {
     margin-top: 50px;
     display: none;
}
 .searchfilterblock .container {
     width: 120px;
}
 .searchfilterblock .radio-group {
     display: flex;
}
 .searchfilterblock .container-box {
     font-size: 18px;
     font-family: "Gotham Book";
     display: flex;
     display: flex;
     align-items: center;
     justify-content: space-evenly;
     color: #0D4433;
}
 .searchfilterblock .container-box input {
     height: 26px;
     width: 26px;
     margin: 0px;
     accent-color: #0D4433;
}
 .modal-container, .custom-modal {
 
     display: none;
     position: fixed;
     top: 0;
     left: 0;
     height: 100%;
     width: 100%;
     background: #000;
     background-color: rgba(0, 0, 0, 0.7);
     z-index: 11111;
     .modal {
         display: block;
         opacity: 1;
         margin: 0 auto;
         padding: 30px;
         width: 80%;
         border-radius: 30px;
         background-color: #F7F7F7;
         box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.3);
         position: absolute;
         top: 70px;
         bottom: unset;
         max-height: calc(100vh - 100px);
         overflow-y: auto;
         scrollbar-width: thin;
         }
         .modal-title-text {
             color: #222222;
             font-family: "Gotham Black";
             font-size: 24px;
             text-align: center;
        }
         .modal-body-text {
             font-size: 18px;
             padding-top: 20px;
        }
         .btn-ok {
             height: 60px;
             width: 190px;
             margin-top: 20px;
             position: relative;
             padding: 2px;
        }
         @media screen and (max-width:767px) {
             height: 320px;
             width: 320px;
             padding: 10px !important;
             overflow-y: auto;
             #chooseCityState .custom-radio-container {
                 display: inline;
            }
             .modal-body-container {
                 padding: 20px;
                 max-width: 380px;
            }
             .modal-body-text {
                 font-size: 16px;
                 text-align: justify;
                 padding: 30px 20px;
            }
             .btn-ok {
                 margin-top: unset;
                 height: 48px;
                 width: 100% 
            }
        }
    }
     body.modal--is-active {
         overflow: hidden;
    }
     .modal__close {
         position: absolute;
         top: 0;
         right: 0;
         padding: 20px;
         border: none;
         background: #f7f7f7;
    }
     .modal__close .icon {
         font-size: 1.25em;
    }
     #message-body {
         padding: 20px 0;
    }
}
 .modal-container.modal--is-active {
     display: block;
     opacity: 1;
}
 .zoom-modal-view {
     .modal {
         width: 800px;
         top: 10px;
         #chooseCityState {
             height: 500px;
        }
    }
     @media screen and (max-width:799px) {
         .modal {
             width: 320px;
             #chooseCityState {
                 height: 255px;
            }
        }
    }
}
 .table-payable {
     border-color: transparent;
     border: 1px solid #ccc;
     font-family: "Gotham Book";
     font-size: 17px;
}
 .table-payable thead th {
     position: sticky;
     top: 0;
     z-index: 2;
     background-color: #559EBB;
     color: #fff;
}
 .table-payable input[type=checkbox] {
     height: 20px;
     width: 20px;
}
 .table-row {
     background-color: #c7c7c7;
     height: 40px;
}
 .table-row {
     vertical-align: middle;
}
 .data-row {
     color: #253948;
     height: 40px;
}
 .pay-table-section {
     max-height: 800px;
     position: relative;
     overflow-y: auto;
}
 .container-lg {
     overflow-x: auto;
}
 .pay-date-block .ui-datepicker-trigger {
     position: absolute;
     top: 7px;
     right: 15px;
}
 .date-block {
     position: relative;
}
 .date-block .ui-datepicker-trigger {
     position: absolute;
     width: 18px;
     height: 18px;
     left: 200px;
     top: 12px;
     display: none;
}
 .table-width {
     width: 100%;
}
 .no-scroll {
     overflow-x: hidden !important;
}
 .no-scroll-v1 {
     overflow-y: hidden !important;
}
 .name-edit-block {
     display: flex;
     align-items: center;
}
 .program-title {
     font-family: "Gotham Bold";
     font-size: 18px;
     letter-spacing: 0;
     line-height: 20px;
}
 .pay-confirm-row td {
     padding: 10px 0px;
}
 .pay-confirm-row td:nth-of-type(3) {
     font-family: "Gotham Book";
     font-size: 16px;
     letter-spacing: 0;
     line-height: 20px;
}
 .table-body tr:nth-of-type(odd) {
     background: #F1F9FA !important;
}
 .table-body tr:nth-of-type(even) {
     background: #DBECF2 !important;
}
 .table-sfcc-striped>tbody>tr:nth-of-type(odd) {
     background: #F1F9FA !important;
}
 .table-sfcc-striped>tbody>tr:nth-of-type(even) {
     background: #DBECF2 !important;
}
 .table-sfcc-striped thead th {
     position: sticky;
     top: 0;
     z-index: 2;
     background-color: #8BC0D5;
     color: #fff;
}
 .pay-confirm-row strong {
     font-family: "Gotham Bold";
     font-size: 18px;
     letter-spacing: 0;
     line-height: 20px;
}
 .confirm-checkbox {
     margin-top: 20px;
}
 .confirm-checkbox span {
     font-family: "Gotham Book";
     font-size: 16px;
     letter-spacing: 0;
     line-height: 20px;
}
 .confirm-checkbox input[type=checkbox] {
     height: 20px;
     width: 20px;
}
 .radio input[type=radio] {
     height: 20px;
     width: 20px;
}
 .radio-v1 input[type=radio] {
     height: 20px;
     width: 20px;
}
 .confirm-button-group {
     padding: 0px !important;
}
 .font-book {
     font-family: "Gotham Book";
     font-size: 16px;
     letter-spacing: 0;
     line-height: 20px;
     padding: 10px 0px;
}
 .btn-v1 {
     width: 100px !important;
     height: 40px;
     width: 100%;
     border: unset;
     border-radius: 32px;
     font-size: 18px;
     font-weight: 800;
     font-family: "Gotham Black";
     padding: 0px;
     margin: 10px;
     text-transform: capitalize;
     letter-spacing: 0;
     cursor: pointer;
     text-transform: capitalize;
}
 .btn-v2 {
     width: 300px !important;
     color: #253948;
     background: #BBDBE6;
     height: 40px;
     width: 100%;
     border: unset;
     border-radius: 32px;
     font-size: 18px;
     font-weight: 800;
     font-family: "Gotham Black";
     padding: 0px;
     text-transform: capitalize;
     letter-spacing: 0;
     cursor: pointer;
     text-transform: capitalize;
}
 .padding-y {
     padding: 10px 0px;
}
 .pad-10 {
     padding: 10px;
}
 .padding-x {
     padding: 0px 10px;
}
 .pad-left-20 {
     padding-left: 20px;
}
 .pad-left-10 {
     padding-left: 10px;
}
 .pad-left-0 {
     padding-left: 0px;
}
 .pad-top-0 {
     padding-top: 0px !important;
}
 .pad-top-10 {
     padding-top: 10px !important;
}
 .padtop-10 {
     padding-top: 10px;
}
 .two-btn-group .btn-secondary {
     color: #253948;
     background: #FFFFFF;
     border: 1px solid #BBDBE6;
}
 .two-btn-group .btn-primary {
     color: #253948;
     background: #BBDBE6;
}
 .delete-icon {
     height: 20px;
     width: 20px;
     cursor: pointer;
}
 .date-form {
     position: relative;
}
 .date-form .ui-datepicker-trigger {
     position: absolute;
     top: 53px;
     right: 35px;
}
 .custom-input-v1 {
     display: block;
     width: 50%;
     padding: 0 30px;
     font-family: "Gotham Book";
     font-size: 18px;
     font-weight: 400;
     height: 40px;
     border: unset;
     border-radius: 10px;
     outline: none;
     margin: 10px;
     background-color: #DBECF2;
     border: 1px solid #d4d4d4;
}
 .custom-textarea {
     display: block;
     width: 70%;
     padding: 0 30px;
     font-family: "Gotham Book";
     font-size: 18px;
     font-weight: 400;
     border: unset;
     border-radius: 10px;
     outline: none;
     background-color: #DBECF2;
     border: 1px solid #d4d4d4;
     margin: 10px;
}
 .notify-container {
     position: fixed;
     top: 20px;
     right: 400px;
     left: 400px;
     display: flex;
     flex-direction: column;
     gap: 10px;
     z-index: 11111;
}
 .notify {
     position: relative;
     min-width: 400px;
     padding: 20px 12px;
     border-radius: 8px;
     font-size: 14px;
     font-family: "Gotham Book";
     box-shaodw: 0 4px 8px rgba(0, 0, 0, 0.15);
     opacity: 1;
     transform: translateY(0);
     transition: opacity 0.3s ease, transform 0.3s ease;
}
 .notify-text {
     font-size: 18px;
}
 .notify .fade-out {
     opacity: 0;
     transform: translateY(-10px);
}
 .notify-close {
     position: absolute;
     top: 12px;
     right: 10px;
     background: transparent;
     border: none;
     font-size: 30px;
     font-weight: bold;
     cursor: pointer;
     opacity: 0.8;
     transition: opacity 0.2s;
}
 .notify-close:hover {
     opacity: 1;
}
 .notify--success {
     background-color: #2ecc71;
}
 .notify--error {
     color: #a94442;
     background-color: #f2dede;
     border-color: #ebccd1;
}
 .notify--info {
     color: #31708F;
     background-color: #D9EDF7;
     border: 1px solid #253948;
}
 .notify--warning {
     background-color: #f39c12;
}
 .confirm-overlay {
     position: fixed;
     inset: 0;
     background: rgba(0, 0, 0, 0.6);
     display: none;
     align-items: center;
     justify-content: center;
     z-index: 11111;
     pointer-events: none;
     transition: opacity 0.25s ease;
}
 .confirm-overlay.active {
     opacity: 1;
     pointer-events: auto;
     display: flex;
}
 .confirm-box {
     background: #fff;
     border-radius: 12px;
     padding: 25px 30px;
     width: 50%;
     text-align: center;
     box-shadow: 0 8px 30px right(0, 0, 0, 2);
     position: relative;
     animation: scaleIn 0.25s ease;
}
 @ keyframes scaleIn {
     from {
        transform: scale(0.9);
         opacity: 0;
    }
     to {
         transform: scale(1);
         opacity: 1;
    }
}
 .confirm-close {
     position: absolute;
     top: 0px;
     right: 12px;
     font-size: 25px;
     color: #555;
     cursor: pointer;
}
 .confirm-message {
     display: flex;
     justify-content: center;
     gap: 12px;
     font-family: 'GOTHAM BOLD';
     font-size: 20px;
}
 .confirm-btn {
     padding: 8px 20px;
     width: 150px;
     border: none;
     cursor: pointer;
     font-weight: 600;
     font-size: 14px;
     transition: 0.2s;
     border-radius: 32px;
     font-family: "Gotham Book";
}
 .confirm-buttons {
     padding-top: 30px;
     display: flex;
     justify-content: space-evenly;
     align-items: center;
}
 .confirm-yes {
     color: #253948;
     background: #BBDBE6;
}
 .confirm-no {
     color: #253948;
     background: #FFFFFF;
     border: 1px solid #BBDBE6;
}
 .form-control-v1 {
     display: block;
     width: 50%;
     padding: 0 30px;
     font-family: "Gotham Book";
     font-size: 20px;
     font-weight: 400;
     height: 40px;
     border: unset;
     border-radius: 20px;
     outline: none;
     background-color: #DBECF2;
     border: 1px solid #d4d4d4;
     margin-left: 10px;
}
 .viewport-height-v1 {
     height: 100vh !important;
}

.contact-block-sfcc {
    width: 50%;
    margin: 0 auto;
    border-radius: 20px;
    border: 8px solid #f1f9fa;
}
.contact-header-sfcc {
font-size: 25px;
    font-weight: bold;
    color: #336699;
    padding: 10px;
}

.phone-container-sfcc {

display: flex;
    justify-content: center;
    align-items: center;
    }
    
.phone-icon-sfcc {
background-color: #e4e4e4;
    height: 48px;
    width: 48px;
    border-radius: 50%;
    text-align: center;
    padding-top: 10px;
    margin-right:10px;
    }    
.phone-icon-sfcc g{
stroke:#05578b;
 }
 
 .phone-container-sfcc a {
 color: #1251a2;
    text-decoration: none;
    font-weight:bold;
  }
  
  .phone-container-sfcc a:focus,a:hover {
 color: #1251a2;
    text-decoration: none !important;
    font-weight:bold;
  }
  .contact-card-sfcc{
  padding:5px 40px 15px 40px;
   height: 75vh;
  }
  
 .main-container-login-sfcc {
            margin-top: 0px;
            background-color: #ffff;
            padding: 30px;
            padding-bottom: 0px !important;
            overflow:hidden;
            height:100vh;
        }

        .sfcc-login-hr {
            transform: rotate(180deg);
            height: 1px;
            border: 1px solid black;
            background-color: black;
        }
        
        .sfcc-login-logo-container {
          background: #000000;
    width: 283px;
    height: 82vh;
    margin-left: 10px;
    padding:0px;
        }

        .sfcc-login-logo-container img {
            width: 220px;
            padding:10px;
        }
         .sfcc-login-logo-wrapper{
         background: #3f4e5d;
         padding:20px;
         display:flex;
         justify-content:center;
         }
         
         .sfcc-login-hr-small{
         height: 20px;
    width: 283px;
    background: #000;
    position: absolute;
    top: 53px;
    left: 30px;}
         
         .sfcc-login-contact-wrapper{
             color: #fff;
    margin-top: 260px;
    position:fixed;
    top:100px;
    padding: 20px;}

        .sfcc-login-title {
            display: flex;
            justify-content: center;
            font-size: 40px !important;
        }

        .sfcc-login-left-section {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            margin-top: 50px;
            margin-bottom: 10px;
        }

        .sfcc-login-input-block {
            display: flex;
            padding: 20px;
            justify-content: space-evenly;
            width: 100%;
        }

        .sfcc-login-input-block input {
            width: 60%;
            padding: 10px;
            font-size: 16px;
            margin-top: 5px;
            border: 1px solid black;
            background-color: #f2f2f2;
            height: 50px;
            border-radius: 10px;
            outline: none;
        }

        .sfcc-login-label {
            font-size: 18px;
            margin-top: 15px;
            color: #253948;
            font-family: "Gotham Bold";
            width: 20%;
        }

        .sfcc-login-reset {
            font-family: "Gotham Book";
            font-size: 15px;
            margin-top: 10px;
            cursor:pointer;
        }

        .sfcc-login-right-section {
            display: flex;
            flex-direction: column;
            text-align: end;

        }

        .sfcc-login-right-section img {
            height: 50px;
            filter: brightness(0.5);
            width: 50%;
        }

        .sfcc-login-btn-block {
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .sfcc-login-submit-btn {
            margin-top: 20px;
            padding: 12px;
            width: 100%;
            background-color: #263947;
            color: white;
            font-size: 18px;
            border: none;
            cursor: pointer;
            align-items: center;
            border-radius: 15px;
        }

        .sfcc-login-submit-btn:hover {
            background-color: #163a5c;
        }

        .sfcc-login-footer {
            position: absolute;
            bottom:0px;
            padding-right:30px;
        }

        .sfcc-login-tag {
            background-color: #c3ad7d;
    font-size: 25px;
    font-weight: bold;
    padding: 12px;
    border-bottom-right-radius: 20px;
    position: absolute;
    bottom: 17px;
    font-family: "Gotham Bold" !important;
    z-index: 999;
    padding-bottom: 5px;
        }

        .sfcc-login-contact-us {
            display: flex;
            justify-content: end;
            font-family: "Gotham Book";
            font-size: 15px;
            margin-top: 10px;
            padding: 10px;
            font-weight: bolder;
            text-decoration:underline;
            cursor:pointer;
        }

        .sfcc-login-footer-hr-1 {

            transform: rotate(180deg);
            height: 2px;
            border: 2px solid #94c2da;
            background-color: #94c2da;
        }

        .sfcc-login-footer-hr-2 {

            transform: rotate(180deg);
            height: 20px;
            border: 20px solid #263947;
            background-color: #263947;
        }
          .navbar-sfcc-btn-block{position:fixed;top:0px;right:30px;}
       .navbar-sfcc-btn-block button {color: #253948;
    background: #BBDBE6;width: 140px !important;
    height: 35px;
    width: 100%;
    border: unset;
    border-radius: 20px;
    font-size: 16px;
    font-weight: 800;
    font-family: "Gotham Black";
    padding: 0px;
    margin: 10px;}
    
   .sfcc-forgot-password-block{
   padding: 0px 0px 0px 50px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    font-family: "Gotham Book";
     font-size: 15px;
     color:#253948 !important;
}
   }