/*INDEX:
1. Color Palette
2. Font Families
3. Global Styles
4. Forms
5. Buttons
6. Icons
7. Tables
8. Breadcrumbs
9. Modals
10. Sidenav Bar (Header)
11. Sidenav Bar (Navigation)
12. Page Header
13. Special Message Bar (OBSOLETE FOR THIS SITE)
14. Support CTA Bar
15. Footer
16. Default.aspx
17. Welcome.aspx
18. Tracking.aspx
19. CatItem.aspx
20. ProductInfo.aspx
21. Checkout1.aspx
22. Contactus.aspx
23. UCLeftStore.aspx
24. Style.aspx
25. Terms.aspx
26. Search.aspx
27. Cart.aspx
28. NewReg.aspx
29. StoreHome.aspx
*/

/*==========================================================
*     1. COLOR PALETTE USED THROUGHOUT
* ==========================================================*/
/*MIDNIGHT = #114B59
MINT = #52C0AA
LIGHT MINT (HOVER) = #A2DBD0
POWDER BLUE = #b9e0e4
LIGHT GREY 1 = #e7e7e7
LIGHT GREY 2 (HOVER) = #d7d7d7
DARK GREY = #3F4A51

BLUE = #2186ca
BLUE (HOVER) = #0c4d82

RED = #d75747
RED(HOVER) = #8b2c20

YELLOW = #E2D666
YELLOW (HOVER) = #e1cd20

FONT COLOR = #333333*/

/*==========================================================
*     2. FONT FAMILIES USED THROUGHOUT
* ==========================================================*/
/*font-family: 'Lato', 'Open Sans', sans-serif;
font-family: 'Lato', sans-serif;
font-family: 'Open Sans', sans-serif;*/

/*==========================================================
*     3. GLOBAL STYLES
* ==========================================================*/
body {
  font-family: 'Arial';
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: .5px;
  color: #333333;
}
form {
    position: relative;
}
.page {
  width: calc(100% - 320px);
  background-color: #ffffff;
  padding-bottom: 0;
  z-index: 0;
}
@media (max-width: 991px) {
    .page {
        width: 100%;
    }
    /*.page.active-sm {
        width: calc(100% - 250px);
    }*/
}
a {
  color: #333333;
  text-decoration: none;
}
a:focus, a:hover, a:active {
    text-decoration: underline;
    color: #333333;
}
@media (max-width: 991px) {
    p {
        font-size: 1rem;
    }
}
p.warning {
  color: #d75747;
}
.border {
	border: 1px solid #e7e7e7 !important;
}
.small, small {
    font-weight: 300;
}
.section-padding {
    padding: 3rem 1rem;
}

.fa, .fas {
    font-size: 0.875rem;
}
label {
    font-size: 1rem;
}

/*just a little animation to hover over buttons*/
.trans_200 {
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.trans_300 {
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}
.trans_400 {
	-webkit-transition: all 400ms ease;
	-moz-transition: all 400ms ease;
	-ms-transition: all 400ms ease;
	-o-transition: all 400ms ease;
	transition: all 400ms ease;
}
.trans_500 {
	-webkit-transition: all 500ms ease;
	-moz-transition: all 500ms ease;
	-ms-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
}

/*==========================================================
*     4. FORMS
* ==========================================================*/
label {
    margin-top: 0.5rem;
}
.form-control {
    color: #333333;
    background-color: #ffffff;
    background-clip: padding-box;
    border: 1px solid #d7d7d7;
    border-radius: 0rem;
    font-family: 'Arial';
    letter-spacing: .5px;
}
.form-control::placeholder {
	font-size: 0.875rem;
    font-weight: 300;
	color: #7b8389;
    font-family: 'Aeial';
}
.form-control::-moz-placeholder,
.input-material::-moz-placeholder {
	font-size: 0.875rem;
    color: #7b8389;
    font-family: 'Arial';
}
.form-control::-webkit-input-placeholder,
.input-material::-webkit-input-placeholder {
	font-size: 0.875rem;
    color: #7b8389;
    font-family: 'Arial';
}
.form-control:-ms-input-placeholder,
.input-material:-ms-input-placeholder {
	font-size: 0.875rem;
    color: #7b8389;
    font-family: 'Arial';
}
.form-control-label-message {
    color: #d75747;
    font-weight: normal;
    font-style: italic;
}
.form-control:focus {
    color: #333333;
    background-color: #fff;
    border-color: #52C0AA;
    box-shadow: 0 0 0 .25rem rgba(82,192,170,.25);
    }
.form-text {
    color: #333333;
}
input::placeholder {
    color: #7b8389 !important;
    font-size: 0.875rem;
}
input::-webkit-input-placeholder {
    color: #7b8389!important;
    font-size: 0.5rem;
}
input:-moz-placeholder {
    color: #7b8389 !important;
    font-size: 0.5rem;
}

/*----------- style option select dropdown box and content*/
select.form-control {
    font-size: 1rem;
    font-weight: normal;
}
select.form-control option {
	font-weight: 300;
    color: #7b8389;
    font-size: .875rem;
    letter-spacing: 0.5px;
    font-weight: normal;
}
.bootstrap-select > .dropdown-menu li a {
    color: #333333;
    font-size: 0.875rem;
}
.bootstrap-select > .dropdown-menu li a:hover {
    color: #2186ca;
}
.bootstrap-select > .dropdown-toggle.bs-placeholder {
    color: #333333;
    font-size: 0.875rem;
}
.bootstrap-select > .dropdown-toggle.bs-placeholder:hover {
    color: #333333;
}
.bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
    width: 100%;
}
.bootstrap-select .dropdown-toggle .filter-option {
    letter-spacing: 1px;
}
input.form-control {
    border: 1px solid #d7d7d7;
    height: 40px;
    color: #333333;
    letter-spacing: .5px;
}
input.form-control:focus {
    color: #333333;
    background-color: #ffffff;
    outline: none;
    box-shadow: none;
    border-color: inherit;
    -webkit-box-shadow: none;
}
.chosen-container {
    /*margin-left: 40px;*/
    font-size: 0.875rem;
    color: #333333;
}
@media screen and (max-width: 991px) { 
    .chosen-container {
      margin-top: 20px;
      margin-left: 0;
    }
}
.chosen-container .chosen-drop {
    border: 1px solid #d7d7d7;
    box-shadow: 0;
}
.chosen-container-single .chosen-default {
    color: #333333;
}
.chosen-container-single .chosen-single {
    height: 40px;
    border: 1px solid #d7d7d7;
    border-radius: 0;
    background: #ffffff;
    box-shadow: 0 0 3px #fff inset, 0 1px 1px rgb(0 0 0 / 0%);
    color: #333333;
}
.chosen-container-single .chosen-single span {
    margin: 8px 5px;
    font-size: 1rem;
}
.chosen-container-single .chosen-default {
    color: #333333;
}
.chosen-container-single .chosen-single abbr {
    background: url('../images/chosen-sprite.png') -42px 1px no-repeat;
}
.chosen-container-single .chosen-single div b {
    display: block;
    width: 100%;
    height: 100%;
    background: url('../images/chosen-sprite.png') no-repeat 2px 10px;
}
.chosen-container-active.chosen-with-drop .chosen-single div b {
    background-position: -14px 10px;
}
.chosen-container-single .chosen-search input[type="text"] {
    border: 1px solid #d7d7d7;
    background: white url('../images/chosen-sprite.png') no-repeat 100% -20px;
    background: url('../images/chosen-sprite.png') no-repeat 100% -20px;
}
.chosen-container-single .chosen-drop {
    border-radius: 0;
}
.chosen-container .chosen-results li.disabled-result {
    color: #9d958c;
}
.chosen-container .chosen-results li.highlighted {
    background-color: #2186ca;
    background-image: none;
}
.chosen-container .chosen-results li.no-results {
    background: #f2f1ef;
}
.chosen-container-multi .chosen-choices {
    border: 1px solid #d7d7d7;
    background-image: none;
}
.chosen-container-multi .chosen-choices li.search-field input[type="text"] {
    color: #333333;
}
.chosen-container-multi .chosen-choices li.search-field .default {
    color: #333333;
}
.chosen-container-multi .chosen-choices li.search-choice {
    border: 1px solid #d7d7d7;
    background-color: #f2f1ef;
    background-image: none;
    box-shadow: 0;
    color: #333333;
}
.chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
    background: url('../images/chosen-sprite.png') -42px 1px no-repeat;
}
.chosen-container-multi .chosen-choices li.search-choice-disabled {
    border: 1px solid #d7d7d7;
    background-color: #f2f1ef;
    background-image: none;
    color: #333333;
}
.chosen-container-multi .chosen-choices li.search-choice-focus {
    background: #f2f1ef;
}
.chosen-container-multi .chosen-drop .result-selected {
    color: #c4beb6;
}
.chosen-container-active .chosen-single {
    border: 1px solid #2186ca;
    box-shadow: 0;
}
.chosen-container-active.chosen-with-drop .chosen-single {
    border: 1px solid #d7d7d7;
    background-image: none;
    box-shadow: 0;
}
.chosen-container-active .chosen-choices {
    border: 1px solid #2186ca;
    box-shadow: 0;
}
.chosen-container-active .chosen-choices li.search-field input[type="text"] {
    color: #333333 !important;
}
.chosen-rtl .chosen-search input[type="text"] {
    background: white url('../images/chosen-sprite.png') no-repeat -30px -20px;
    background: url('../images/chosen-sprite.png') no-repeat -30px -20px;
}
/* @group Retina compatibility */
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-resolution: 144dpi) {
    .chosen-rtl .chosen-search input[type="text"],
    .chosen-container-single .chosen-single abbr,
    .chosen-container-single .chosen-single div b,
    .chosen-container-single .chosen-search input[type="text"],
    .chosen-container-multi .chosen-choices .search-choice .search-choice-close,
    .chosen-container .chosen-results-scroll-down span,
    .chosen-container .chosen-results-scroll-up span {
      background-image: url('../images/chosen-sprite@2x.png') !important;
  
    }
}
/* @end */
  
.text-muted {
    color: #3F4A51 !important;
}
/*input.form-control-custom + label {
    color: #333333;
    font-size: 0.875rem;
}
input.form-control-custom + label::before {
    background: #ffffff;
    border: 1px solid #e7e7e7;
    color: #ffffff;
}
input.form-control-custom:checked + label::before {
    background: #2186ca !important;
}*/
.line {
    width: 100%;
    height: 1px;
    border-bottom: 1px solid #e7e7e7;
    margin: 3rem 0;
}


/* ==========================================================
*     5. BUTTONS
* ==========================================================*/
.btn-primary {
    color: #fff;
    background-color: #6d8fb5;
    border: 1px solid #6d8fb5;
    text-transform: uppercase;
    padding: 0.5rem 0.75rem;
    letter-spacing: 1px;
}
.btn-primary:hover {
    background-color: #a4b9cc;
    border: 1px solid #a4b9cc;
    text-decoration: none;
}
.btn-primary:not([disabled]):not(.disabled):active,
.btn-primary:not([disabled]):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
    color: color-yiq(#ffffff);
    background-color: #a2dbd0;
    border-color: #a2dbd0;
    /*-webkit-box-shadow: 0 0 0 0.02rem rgba(255, 0, 0, 0.5);
    box-shadow: 0 0 0 0.002rem rgba(255, 0, 0, 0.5);*/
}
.btn-primary:focus, .btn-primary.focus,
.btn-primary:active, .btn-primary.active {
    color: #fff;
    background-color: #A2DBD0;
    border-color: #A2DBD0;
    box-shadow: 0 0 0 .25rem rgba(82,192,170,.25);
}
.btn-secondary {
    color: #114B59;
    background-color: transparent;
    border-color: #114B59;
    text-transform: uppercase;
    /*padding: 0.5rem 2.5rem;*/
}
.btn-secondary:hover {
    color: #ffffff;
    background-color: #114B59;
    border: 1px solid #114B59;
    text-decoration: none;
}
.btn-secondary:not([disabled]):not(.disabled):active,
.btn-secondary:not([disabled]):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
    color: color-yiq(#ffffff);
    background-color: #114B59;
    border-color: #114B59;
   /* -webkit-box-shadow: 0 0 0 0.02rem rgba(157, 149, 140, 0.5);
    box-shadow: 0 0 0 0.02rem rgba(157, 149, 140, 0.5);*/
}
.btn-outline-dark {
    color: #114B59;
    border: 1px solid #114B59;
    background: #ffffff;
}
.btn-outline-dark:hover {
    color: #ffffff;
    background-color: #114B59;
    border: 1px solid #114B59;
    text-decoration: none;
}
.btn-outline-dark:focus,
.btn-outline-dark.focus  {
    color: #333333;
    /*-webkit-box-shadow: 0 0 0 0.02rem rgba(157, 149, 140, 0.5);
    box-shadow: 0 0 0 0.02rem rgba(157, 149, 140, 0.5);*/
}
.btn-outline-dark.disabled, .btn-outline-dark:disabled {
    color: #333333;
    background-color: transparent;
}
.btn-outline-dark:not([disabled]):not(.disabled):active,
.btn-outline-dark:not([disabled]):not(.disabled).active,
.show > .btn-outline-dark.dropdown-toggle {
    background-color: #114B59;
    border-color: #114B59;
  /*  -webkit-box-shadow: 0 0 0 0.02rem rgba(157, 149, 140, 0.5);
    box-shadow: 0 0 0 0.02rem rgba(157, 149, 140, 0.5);*/
}
.balance-btn {
    padding-top: 2rem;
}
@media screen and (max-width: 768px) {
    .center-btn {
      text-align: center;
    }
}
  
/*==========================================================
*     6. ICONS
* ==========================================================*/
#toggle-btn{
    background: #ffffff;
    position: relative;
}
.menu-btn {
      color: #333333;
}
@media (min-width: 1199px) {
    .menu-btn {
      display: none;
    }
}
#toggle-btn:hover {
    background: transparent;
}
  
 
/*==========================================================
*     7. TABLES
* ==========================================================*/
table {
    font-size: 0.875em;
    color: #333333;
}
table.table a, #account-links a {
    text-decoration: underline;
}
.table th, .table td {
    font-size: 0.875rem;
      color: #333333;
}
.table-bordered td, .table-bordered th {
    border: 1px solid #d7d7d7;
}
.table-striped tbody tr:nth-of-type(2n+1) {
      background-color: #F8F7F6;
}
.table th {
    background: #d7d7d7;
}
 
/* ==========================================================
*     8. BREADCRUMBS
* ==========================================================*/
.breadcrumbs {
    font-size: 0.81rem;
    margin: 0.5rem 0 0 0.5rem;
}

  
/* ==========================================================
*     9. MODALS
* ==========================================================*/
.modal-header {
    border-bottom:none;
}
.modal-body {
    padding: 3rem;
}
.modal-footer {
    border-top: none;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

/*==========================================================
*     10. SIDENAV (HEADER)
* ==========================================================*/
.ucAuthHeader nav.navbar {
	background: unset !important;
}
.ucAuthHeader nav.navbar .dropdown-menu {
    right: unset !important; 
    margin-top: unset !important; 
    margin-bottom: unset !important;
    padding: unset !important; 
}
.ucAuthHeader nav.navbar a {
	font-size: 1rem;
}
.ucAuthHeader nav.navbar .dropdown-menu {
    border-radius: 0;
}
.ucAuthHeader nav.navbar .dropdown-menu .dropdown-item {
    color: #333333;
    padding: 15px 20px;
}
.ucAuthHeader nav.navbar .dropdown-menu .dropdown-item span {
    color: #333333;
}
.ucAuthHeader nav.navbar .dropdown-toggle::after {
    font-family: "Font Awesome 5 Free";
    content: "\f078";
    font-size: 0.875rem;
    font-weight: 900;
  }
.ucAuthHeader.dropdown-item:focus, .dropdown-item:hover {
    background-color: #52C0AA;
}
.ucAuthHeader .dropdown-item.active, .dropdown-item:active {
    background-color: #A2DBD0;
}


/* ==========================================================
*     11. SIDENAV (Navigation)
* ==========================================================*/
/*only display the grey sidebar on devices with a min width of 992px, otherwise display WebSlide Menu mobile version*/
.sidebar {
    position: fixed;
    top: 0;
    left: 0;
    width: 320px;
    height: 100vh;
    background: #3F4A51;
    z-index: 100;
}
@media screen and (max-width: 991px) {
    .sidebar {
        left: -320px;
    }
}
.welcome-message {
    margin-top: 120px;
    padding: 0 1.56rem;

}
@media screen and (min-width: 992px) {
    .welcome-message {
        margin-top: 0;
    }
}
.welcome-message a {
    cursor: pointer;
}
.welcome-message p {
    margin-top: 2rem;
    color: #ffffff;
}
.welcome-message ul {
    padding-left: 0!important;
    list-style: none;
    color: #ffffff;
    line-height: 1.75;
    text-transform: none;
    font-size: 0.875rem;
}
.wsmobileheader {
    display: none;
    background-color: #3f4a51;
    height: 120px;
}
/*STYLING Web Slide Mega Menu MOBILE*/
@media screen and (max-width: 991px) {
.wsmobileheader {
	width: 100%;
	display: block;
	position: fixed;
	top: 20;
	left: 0;
	z-index: 10002;
    }
.wsmobileheader > .smllogo {
    display: inline-block;
    width: 200px;
}
    .wsanimated-arrow {
        cursor: pointer;
        padding: 16px 35px 16px 0px;
        margin: 12px 0 0 15px;
            position: absolute;
            left: 0;
            top: 0;
            z-index: 102;
            -webkit-transition: all 0.4s ease-in-out;
            -moz-transition: all 0.4s ease-in-out;
            -o-transition: all 0.4s ease-in-out;
            -ms-transition: all 0.4s ease-in-out;
            transition: all 0.4s ease-in-out;
        }
}
@media only screen and (max-width: 991px) {
    .wsactive .wsmobileheader {
        margin-left: 0;
    }
    .wsmenu>.wsmenu-list>li>.wsmenu-click>i:before {
        border-color: #ffffff;
    }
    /*.wsmenu>.wsmenu-list>li>.wsmenu-click {
        height: 65px;
    }*/
    .wsmenu>.wsmenu-list>li>a {
        border-bottom: 0;
    }
    .wsmenu>.wsmenu-list>li>.wsmenu-click {
        border-left: 0;
    }
    .wsmenu>.wsmenu-list>li>.wsmenu-click>i {
        margin: 5px 21px 0px 0px;
    }
    .wsmenu>.wsmenu-list>li>.wsmenu-click.ws-activearrow>i {
        margin-top: 5px;
    }
    .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>a {
        font-size: 1rem;
        font-weight: 300;
    }   
    .wsmenu .wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>.wsmenu-click02 {
        background-color: unset !important;
        border-left: 0;
        /*height: 60px;*/
    }
    .wsmenu .wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>.wsmenu-click02 i {
        margin: 5px 21px 0px 0px;
    }
    .wsmenu .wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>.wsmenu-click02.ws-activearrow02>i {
        margin-top: 5px;
    }
    .wsmenu>.wsmenu-list>li>.wsmenu-click>i:before,
    .wsmenu .wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>.wsmenu-click02 i:before {
        border-color: #ffffff;
    }
        .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem {
            background-color: #3F4A51;        
    }
    .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>a {
        width: 100%;
    }
    .wsanimated-arrow span,
    .wsanimated-arrow span:before,
    .wsanimated-arrow span:after {
        background: #ffffff;
        background-color: #ffffff;
    }
}

/*STYLING Web Slide Mega Menu*/
.wsmenu {
    font-family: 'Arial';
	color: #ffffff;
	font-size: 1rem;
    line-height: 2;
    text-transform: uppercase;
    width: 100%;
    background: #3F4A51;
}
.wsmenu>.wsmenu-list {
    height: auto;
    min-height: 100%;
    background: #3F4A51;
}
.wsmenu>.wsmenu-list>li {
    float: unset !important;
}
.wsmenu>.wsmenu-list>li>.wsshoptabing.wtsdepartmentmenu {
    background-color: #3F4A51;
    border-bottom: solid 1px #3F4A51;
}
@media screen and (min-width:1200px) {
    .wsmenu>.wsmenu-list>li>.wtsdepartmentmenu {
        width: 1140px;
        left: 320px;
        top: -216px;
        background-color: #eeeeee;
        -webkit-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.2); 
        box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.2);
    }
}
.wsmenu > .wsmenu-list > li > .navtext {
  color: #ffffff;
  text-align: left;
  padding: 5px 20px;
  font-size: 1rem;
  font-weight: normal;
}
/*this one is important, don't remove*/
.wsmenu>.wsmenu-list>li:hover>a {
    background-color: #a4b9cc;
}
/*.wsmenu>.wsmenu-list>li>.wsshoptabing > .wsshopwp {
    background-image: url(../vendor/webslidemenu/images/wsshopwp-bkg.jpg);
    background-position: top right;
    background-repeat: no-repeat;
    background-color: #3F4A51;
    /*background-size: cover;
}*/
.wsmenu>.wsmenu-list>li .wstheading,
.wsmenu>.wsmenu-list>li .wsttitle {
    padding: .25rem 0px .5rem .5rem;
    color: #ffffff;
    font-weight: 300;
}
.wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>a {
    color: #ffffff;
    border-bottom: 0;
    /*width: 25%;*/
    border-left: 3px solid #a4b9cc;
    background-color: #3F4A51;
}
.wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li.wsshoplink-active>a {
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: #a4b9cc;
    color: #ffffff;
    border-left: 3px solid #a2dbd0;
    line-height: 1.5;
}
.wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>.wstitemright {
    color: #ffffff;
    /*width: 75%;*/
    min-height: 100%;
    background-color: #3F4A51;
}

/*position the button on the flyout mega menu*/
/*.wsmenu>.wsmenu-list>li .wstliststy04 {
    margin: 34rem 2rem 0 2rem;
}*/

.wsmenu>.wsmenu-list>li .wstliststy04 li a {
    margin-left: 2rem;
}
.wsmenu>.wsmenu-list>li .wstliststy05 li a {
    padding: .25rem .5rem;
    color: #ffffff;
    font-weight: 300;
}
.wsmenu>.wsmenu-list>li .wstliststy05 li a:hover {
    text-decoration: underline;
    background: none !important;
}
/*Remove the extra padding in the mega menu right side area, on desktop. This style originates from style.default.premium.css*/
@media (min-width: 768px) {
    .container-fluid {
        padding: 0;
    }
}
.wsmenu>.wsmenu-list>li .seasonalmenuimg {
    background-image: url(../vendor/webslidemenu/images/110.jpg);
    background-position: center right;
    background-repeat: no-repeat;
    background-size: cover;
}
.wsmenu>.wsmenu-list>li .shipsnowmenuimg {
    background-image: url(../vendor/webslidemenu/images/100.jpg);
    background-position: center right;
    background-repeat: no-repeat;
    background-size: cover;
}
.wsmenu>.wsmenu-list>li .giftcardsmenuimg {
    background-image: url(../vendor/webslidemenu/images/90.jpg);
    background-position: center right;
    background-repeat: no-repeat;
    background-size: cover;
}

/* ==========================================================
*     12. PAGE HEADER
* ==========================================================*/
.page-header {
  border-top: none;
  border-bottom: none;
  display: flex;
  align-items: center;
  height: 60px;
  min-height: 60px;
  background: url(../images/bamboo_bg3.gif);
  margin-top: 120px;
  margin-bottom: 4rem;
}
@media screen and (min-width: 992px) {
    .page-header {
        margin-top: 0;
    }
}
.page-header .page-header-title {
    text-align: center;
    display: block;
    margin-top: 60px;
    text-transform: uppercase;
    position: relative;
    padding: 1rem 0;
}
.page-header h1.page-title {
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 2rem;
    color: #134b59;
    position: relative;
    z-index: 3;
}
.page-header .page-header-title span.box {
    background: #fff;
    padding: 1rem 2rem;
    display: inline-block;
}
.page-header .page-header-title .green-text {
    color: #6393ce;
}

/* ==========================================================
*     13. SPECIAL MESSAGE BAR
* ==========================================================*/
.dashboard-special-message {
  font-style: italic;
  color: #ffffff;
  padding: 0.5rem;  
  font-size: 0.875em;
}

/*==========================================================
*     14. SUPPORT CTA BAR
* ==========================================================*/
.support-ctabar-wrapper {
    position: relative; 
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #000000;
    margin-top: 6rem;
    padding: 7rem 0;
    overflow: hidden;
}
.support-ctabar-wrapper::before {    
    content: "";
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 1;
    background:url(../images/background1.jpg) no-repeat center center;
    background-size: cover;
    opacity: 0.66;
}
.support-ctabar h3,
.support-ctabar h2,
.support-ctabar .btn-primary,
.support-ctabar .btn-primary:hover,
.support-ctabar .btn-chat {
    position: relative;
    z-index:2;
    color: #ffffff;
}
.support-ctabar h2 {
    font-size: 2rem;
    font-weight: 300;
    padding-bottom:3rem;
}
.support-ctabar h3 {
    font-size: 1rem;
    font-weight: normal;
}
.support-ctabar .support-btns {
    flex-direction: column;
    justify-content: center;
}
.support-ctabar .support-btns a.btn {
    margin-bottom:20px;
}
@media screen and (min-width: 576px) {
    .support-ctabar .support-btns {
        flex-direction: row;
        /*justify-content: space-between;*/
    }
    .support-ctabar .support-btns a.btn {
        margin-right:20px;
    }
}
.support-ctabar .btn-chat {
    background: #6d8fb5;
    border: 1px solid #6d8fb5;
    color: #e8f4ff;
    text-transform: uppercase;
    padding: 0.5rem 0.75rem;
    opacity: 1;
    cursor: pointer;
}
    .support-ctabar .btn-chat:hover {
        background: #a4b9cc;
        border: 1px solid #a4b9cc;
        opacity: 1;
        text-decoration: none;
    }

/* ==========================================================
*     15. FOOTER
* ==========================================================*/
 .footer {
     width: 100%;
     background: #DEDCDD;
 }
 .footer_content {
     padding-top: 84px;
     padding-bottom: 20px;
 } 
 .footer_about_text {
     /*padding-right: 50px;*/
     margin-top: 57px;
 }
 .footer_questions {
     margin-top: 8px;
     padding-right: 50px;
 }
 .footer_title {
     font-size: 18px;
     font-weight: 600;
     color: #333333;
     text-transform: uppercase;
 }
 .footer_list {
     margin-top: 70px;
 }
 .footer_list ul {
     padding-left: 0;
 }
 .footer_list ul li {
     list-style: none;
     position: relative;
 }
 .footer_list ul li a {
     -webkit-transition: all 200ms ease;
     -moz-transition: all 200ms ease;
     -ms-transition: all 200ms ease;
     -o-transition: all 200ms ease;
     transition: all 200ms ease;
     line-height: 2;
 }
 .footer_list ul li a:hover {
    text-decoration: underline;
 }
 .footer_contact {
	margin-top: 8px;
	padding-right: 50px;
}
.footer_contact_list {
	margin-top: 70px;
	padding-right: 20px;
}
.footer_contact_list ul {
    padding-left: 0;
}
.footer_contact_list ul li:not(:last-child) {
	margin-bottom: 19px;
}
.footer_contact_list ul li span {
	font-weight: 700;
	color: #2186ca;
}
.footer_contact_list ul li div {
	padding-left: 14px;
	font-weight: 400;
	line-height: 1.75;
	margin-top: -1px;
}
.footer_about .copyright {
    color: #333333;
    font-size: 0.66rem;
}
.site-footer
{
  background-color:#DEDCDD;
  padding:45px 0 20px;
  font-size:15px;
  line-height:24px;
  color:#181818;
}
.site-footer hr
{
  border-top-color:#ffffff;
  opacity:0.5
}
.site-footer hr.small
{
  margin:20px 0
}
.site-footer h6
{
  color:#181818;
  font-size:16px;
  text-transform:uppercase;
  margin-top:5px;
  letter-spacing:2px
}
.site-footer a
{
  color:#181818;
}
.site-footer a:hover
{
  color:#747070;
  text-decoration:none;
}
.footer-links
{
  padding-left:0;
  list-style:none
}
.footer-links li
{
  display:block
}
.footer-links a
{
  color:#737373
}
.footer-links a:active,.footer-links a:focus,.footer-links a:hover
{
  color:#3366cc;
  text-decoration:none;
}
.footer-links.inline li
{
  display:inline-block
}
.site-footer .social-icons
{
  text-align:right
}
.site-footer .social-icons a
{
  width:40px;
  height:40px;
  line-height:40px;
  margin-left:6px;
  margin-right:0;
  border-radius:100%;
  background-color:#ffffff
}
.copyright-text
{
  margin:0
}
@media (max-width:991px)
{
  .site-footer [class^=col-]
  {
    margin-bottom:30px
  }
}
@media (max-width:767px)
{
  .site-footer
  {
    padding-bottom:0
  }
  .site-footer .copyright-text,.site-footer .social-icons
  {
    text-align:center
  }
}
.social-icons
{
  padding-left:0;
  margin-bottom:0;
  list-style:none
}
.social-icons li
{
  display:inline-block;
  margin-bottom:4px
}
.social-icons li.title
{
  margin-right:15px;
  text-transform:uppercase;
  color:#96a2b2;
  font-weight:700;
  font-size:13px
}
.social-icons a{
  background-color:#eceeef;
  color:#818a91;
  font-size:16px;
  display:inline-block;
  line-height:44px;
  width:44px;
  height:44px;
  text-align:center;
  margin-right:8px;
  border-radius:100%;
  -webkit-transition:all .2s linear;
  -o-transition:all .2s linear;
  transition:all .2s linear
}
.social-icons a:active,.social-icons a:focus,.social-icons a:hover
{
  color:#fff;
  background-color:#29aafe
}
.social-icons.size-sm a
{
  line-height:34px;
  height:34px;
  width:34px;
  font-size:14px
}
.social-icons a.facebook:hover
{
  background-color:#3b5998
}
.social-icons a.twitter:hover
{
  background-color:#00aced
}
.social-icons a.linkedin:hover
{
  background-color:#007bb6
}
.social-icons a.dribbble:hover
{
  background-color:#ea4c89
}
@media (max-width:767px)
{
  .social-icons li.title
  {
    display:block;
    margin-right:0;
    font-weight:600
  }
}
/* ==========================================================
*     16. DEFAULT.ASPX - login page
* ==========================================================*/
@media screen and (max-width: 767px) {
    #login-form .logo-wrapper,
    #login-form .login-wrapper {
        margin: 5vh 0;
    }
}
@media screen and (min-width: 768px) {
    #login-form .logo-wrapper,
    #login-form .login-wrapper {
        min-height: 60vh;
    }
}
#login-form .logo-wrapper {
    background-color: #114b59;
}
#login-form .footer-nav {
    float: none;
    margin:0 auto;
    display: inline;
    text-align: center;
    list-style: none;
}
@media screen and (min-width: 768px) {
    #login-form .footer-nav {
        display: block;
    }
}
#login-form .footer-nav li {
    display: inline;
    float: none;
}
@media screen and (min-width: 768px) {
    #login-form .footer-nav li {
        display: inline-block;
    }   
}
#login-form .footer-nav a {
    font-size: 0.81rem;
    color: #333333;
}
    #login-form a:hover {
        text-decoration: underline;
    }
@media screen and (max-width: 767px) {
    #login-form .footer-nav .nav-link {
        padding-bottom: 0;
    }
}
#login-form .copyright {
    color: #333333;
    text-align: center;
    font-size: 0.66rem;
}

/* ==========================================================
*    17. WELCOME.ASPX - home page
* ==========================================================*/
#welcome .page-header-title {
    margin-top: 100px;
}
/*ID identifier NOT added (#welcome), since I use this on error.aspx as well*/
.site-title h2 {
    font-size: 4rem;
    padding: 1rem 0 0 0;
    font-weight: 100;
}
@media screen and (min-width: 992px) {
    .site-title h2 {
        font-size: 5rem;
    }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
    .site-title h2 {
        font-size: 4rem;
    }
}
.boxes {
	width: 100%;
	background: #FFFFFF;
	z-index: 1;
}
.box {
	width: 100%;
    position: relative;
}
/*@media only screen and (max-width: 991px) {
    .box_col:not(:last-child) {
        margin-bottom: 70px;
    }
}*/
.box_image {
	width: 100%;
}
.box_image img {
	max-width: 100%;
}
.box_title {
	position: absolute;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	bottom: -26px;
	width: 237px;
	height: 67px;
	background: #FFFFFF;
	text-align: center;
}
.box_title:hover {
	background: #a4b9cc;
    text-decoration: none;
}
.box_title a {
	display: block;
	line-height: 67px;
	font-weight: normal;
	text-transform: uppercase;
}
    .box_title a:hover {
        color: #ffffff;
        text-decoration: none;
    }
    .box-title a:focus,
    .box-title a.focus,
    .box-title a:active,
    .box-title a.active {
        background: #52c0aa;
        text-decoration: none;
    }
/*hide the image boxes on phone & tablet*/
@media only screen and (max-width: 991px) {
    .box_image {
        display: none;
    }
    .box_title {
        position: relative;
        bottom: 0;
        border: 1px solid #333333;
        margin-bottom: 1rem;
    }
    .box-title:focus,
    .box-title.focus,
    .box-title:active,
    .box-title.active {
        background: #52c0aa;
        text-decoration: none;
    }
}

.intro h2 {
    font-size: 2rem;
    padding: 2rem 0;
    font-weight: 300;
}
.intro p {
    font-size: 1rem;
}
@media screen and (min-width: 576px) {
    .intro p {
        font-size: 1.5rem;
    }
}


/*==========================================================
*     18. TRACKING.ASPX
* ==========================================================*/
.tracking .card-body {
    padding-top: 2rem;
    background-color: #e7e7e7;
}
.tracking .intro-boxes {
    font-size: 3.5rem;
    color: #134b59;
    text-align: center;
    margin: 3rem 0;
}
.tracking .intro-boxes h3 {
    font-family: 'Lato', sans-serif;
    font-weight: 300;
}
.tracking .intro-boxes i {
    font-size: 6rem;
}
#pnlTrk {
  margin: 1rem;
}
/*add spacing between two input fields on mobile*/
#ddlStyle-wrapper {
  margin-top: 1rem;
}
@media screen and (min-width: 1199px) {
  #ddlStyle-wrapper {
    margin-top: 0;
  }
}


/*==========================================================
*     19. CATITEM.ASPX
* ==========================================================*/
.card-catItem {
  /*border: 1px solid #e7e7e7;*/
  background: #ffffff;
  border-radius: 0;
  background-clip: border-box;
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100vh;
  flex-shrink: 0;
  min-width: 0;
  word-wrap: break-word;
  height: 100%;
}
.card-img-top {
    border: 0;
    max-width: 66%;
    margin: 1rem auto 0;
}
@media screen and (max-width: 767px) {
    .img-thumnail {
        height: 100%;
    }
}
/*fixing the height-issue in IE*/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .card-catItem-ie {
    display: block;
  }
  .h-100-ie {
   height: 100%!important;
  }
}
.catItem-input > input.form-control {
  text-align: center;
}
.catlink img {
  cursor: pointer;
}
.card-title {
  width:100%;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0 1rem;
  margin-bottom: .5rem;
}
.card-footer-catItem {
    padding: 0 1rem;
}

/* ==========================================================
*    20. PRODUCTINFO.ASPX
* ==========================================================*/

.prodInfo .zoom:after {
    content: "";
    display: block;
    width: 33px;
    height: 33px;
    position: absolute;
    top: 0;
    right: 0;
    background: url(../vendor/zoom-master/icon.png);
}
.prodInfo .zoom img {
    display: block;
}
/*@media screen and (min-width: 1200px) {
    .prodInfo .zoom img {
        margin: 0 0 0 auto;
        width: 75%;
    }
}*/
.prodInfo .zoom img::selection {
    background-color: transparent;
}
.prodInfo h2 {
    font-size: 2rem;
}
.prodInfo label {
    font-size: 1rem;
}
.itemImage-thumb {
    display: inline-block;
    text-align: center;
    padding: 1rem;
    font-size: 0.875rem;
}
.prodInfo  .product_attr_single li {
    float: left;
    padding: 0 .5rem;
}
.prodInfo .product_attr_single span.color_attr {
    width: 25px;
    height: 25px;
    border-radius: 0;
    border: 1px solid #e6e6e6;
}
.prodInfo .product_attr_single span.size_attr:hover {
    text-decoration: underline;
}
.litSelected {
    color: #d75747;
    font-weight: 300;
    text-transform: uppercase;
}
.pnlMsg {
    font-size: 1rem;
    margin-bottom: 1rem;
}
.pnlMsgsuccess {
   color: #2186ca;
    padding: 0.5rem;
    border:1px solid #2186ca;
}
.pnlMsgerror {
    color: #d75747;
    padding: 0.5rem;
    border:1px solid #d75747;
}
.rownoborder {
  border-color:none;
  border-style:none;
  border-width: 0;
}
/*==========================================================
*     21. CHECKOUT1.ASPX
* ==========================================================*/
input[type="radio"] {
	margin: 0 1rem;
}

.pnlItem {
  text-align: right;
} 
@media (max-width: 1199px) {
  .pnlItem {
    text-align: center;
  }
}

/*==========================================================
*     21.5 CHECKOUT2.ASPX
* ==========================================================*/

.pricealignright {
  padding-right: 0px;
}

/*==========================================================
*     22. CONTACTUS.ASPX
* ==========================================================*/
.contact p a:hover {
  text-decoration: underline; 
}
.contact h2 {
    line-height: 1.5;
}

/*==========================================================
*     23. UCLEFTSTORE.ASCX
* ==========================================================*/
.ucleftstore {
    padding: 1.56rem;
}
.ucleftstore1_btnSearch {
    font-family: "Font Awesome 5 Free";
    content: "\f002";
    color: #d75747;
    font-weight: 900;
    font-size: 1.25rem;
    text-align: center !important;
}
.ucleftstore .cart-info {
    color: #ffffff;
    line-height: 1.75;
}
.ucleftstore .cart-info p {
    margin-bottom: 0;
}
.ucleftstore .cart-info .fas {
    font-size: 1.75rem;
    color: #a4b9cc;
    margin-left: 10px;
}
.ucleftstore .cart-info a {
    color: #a4b9cc;
    font-size: 1.5rem;
    font-weight: bold;
    text-decoration: none;
}
.ucleftstore .cart-info a:hover,
.ucleftstore .cart-info .fas:hover {
    text-decoration: none;
    color: #A2DBD0;
}
.ucleftstore .ucleftstore-search .fas {
    font-size: 1.5rem;
    color: #ffffff;
}
.ucleftstore .ucleftstore-search .fas:hover {
    color: #a4b9cc;
}



/*==========================================================
*     24. STYLE.ASPX
* ==========================================================*/
.style .download-text h3,
.style .download-text h2,
.style .download-text h4 {
    font-family: 'Lato', sans-serif;
}
.style .download-text h3 {
    font-size: 3rem;
    font-weight: 300;
    line-height: 1;
    color: #52c0aa;
}   

.style .download-text h2 {
    font-size: 4rem;
    font-weight: bold;
    line-height: 1;
    color: #134b59;
}
.style .download-text h4 {
    font-size: 3rem;
    font-weight: 300;
    line-height: 1;
    color: #134b59;
}
.style .download-box {
    background: #134b59;
    padding: 6rem;
    text-align: center;
}
@media screen and (min-width: 1200px ) {
    .style .download-text h2 {
        font-size: 5rem;
    }
}
@media screen and (max-width: 767px ) {
    .style .download-box {
        margin: 3rem 0;
    }
}

.style .download-box a {
    text-decoration: none;
}
.style .download-box .btn-outline-light {
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 1.25rem;
    color: #ffffff;
}
.style .download-box .btn-outline-light:hover {
    background-color: #52c0aa;
    border: 1px solid #52c0aa
}

/*==========================================================
*     25. TERMS.ASPX
* ==========================================================*/
.terms h2 {
    margin-bottom: 2rem;
}

/*==========================================================
*     26. SEARCH.ASPX
* ==========================================================*/
.search .card-body {
    padding: 2rem;
    background-color: #e7e7e7;
}
.search p.search-text {
    font-size: 1.5rem;
}

/*==========================================================
*     27. CART.ASPX
* ==========================================================*/
.cart .card-body {
    padding: 2rem;
    background-color: #e7e7e7;
}
.cart .table tbody tr th {
    font-family: 'Lato', sans-serif;
    border: 1px solid #fff;
    text-align: center;
    color: #333333;
    background: #d7d7d7;
    letter-spacing: 0.75px;
    font-size: 1rem;
  }
.cart .table tbody tr td {
    outline: none;
    border: 1px solid #f1f2f2 !important;
    border-bottom: 1px solid #f1f2f2 !important;
    text-align: center !important;
    font-size: 1rem;
    font-family: 'Lato', sans-serif;
}
.cart .table tbody tr td input {
    text-align: center;
    outline: none;
    box-shadow: none;
    border: 1px solid #d7d7d7;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -ms-border-radius: 0px;
    border-radius: 0px;
}
.cart .table tbody tr td .cart-tmbnail{
    height: 80px;
}
.cart .table tbody tr td .qty {
    height: 40px;
    width: 80px;
}
.cart table.table a {
    text-decoration: none !important;
}
.cart table.table a:hover {
    text-decoration: underline !important;
}
.cart p {
    margin-bottom: 0;
}
a.remove-icon {
    text-decoration: none !important;
}
a.remove-icon::before {
    font-family: "Font Awesome 5 Free";
    content: "\f00d";
    color: #d75747;
    font-weight: 900;
    font-size: 1.25rem;
    text-align: center !important;
}
a.remove-icon:hover {
    text-decoration: none;
}

/*==========================================================
*     28. NEWREG.ASPX
* ==========================================================
@media screen and (min-width: 992px) {
    .newreg.logo-wrapper img {
        margin-top: 150px;
    }
}

==========================================================
*     29. STOREHOME.ASPX
* ==========================================================*/
.storehome h2,
.category h2 {
    line-height: 1.5;
}

.storehome .cat-rp:hover,
.category .cat-rp:hover {
    text-decoration: underline;
}
.storehome h3.title,
.category h3.title {
    padding-top: .5rem;
}
