/*
* ==========================================================
*     GLOBAL STYLES
* ==========================================================
*/
body {
  font-family: avenir-lt-pro, sans-serif;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: .5px;
  color: #000000;
}
.page-body {
  padding: 2rem 1rem 0.5rem .5rem;
}
.page {
  width: calc(100% - 320px);
  background-color: #ffffff;
}

/* MEDIAQUERIES ------------------------------ */
@media (max-width: 1199px) {
  .page {
    width: 100%;
  }
  .page.active-sm {
	width: calc(100% - 250px);
  }
}

h2 {
  font-weight: normal;
}
a {
  color: #000000;
  text-decoration: none;
}
a:focus, a:hover, a:active {
  color: #007ac2;
  text-decoration: none;
}
address {
  padding-left: 3.5rem;
}
p.warning {
  color: #b34035;
}

.border {
	border: 1px solid #e1ddd9 !important;
}
/*
* ==========================================================
*     SIDE NAVBAR
* ==========================================================
*/
.side-navbar {
  width: 320px;
  background: #000000;
}
.side-navbar.hide {
  left: -100px;
}
.sidenav-header {
  border-bottom: 1px solid #ffffff;
}
.side-navbar .sidenav-header {
  margin-bottom: 0!important;
  background: #ffffff;
  /*padding: 0;*/
}
.side-navbar .sidenav-header img {
  width: 100%;
  height: 100%;
  }
.side-navbar h2 {
  padding: 2rem 0 0 0;
  font-size: 1rem;
  text-transform: uppercase;
}

.side-navbar li {
  font-size: 0.875rem;
}
.side-navbar li a {
  font-size: 0.875rem;
  padding: 1rem 0 1rem 2rem;
}

@media (max-width: 1199px) {
  .side-navbar {
    left: -250px;
    width: 250px;
    text-align: left;
  }
  .side-navbar li a {
    font-size: 0.875rem;
    padding: 1rem 0 1rem 2rem;
  }
  .side-navbar ul li a {
    font-size: 0.875rem;
    padding: 1rem 0 1rem 2rem;
  }
  .side-navbar ul li ul a {
    font-size: 0.875rem;
  }
  /*hide arrow icon from original template design */
  .side-navbar ul li a[data-toggle="collapse"]::before {
      content: none;
  }
}

@media (max-width: 1199px) {
.side-navbar .sidenav-header-inner {
    display: inherit
}
}
.header-inner-welcome-message {
  color: #000000;
  padding: 2rem 1rem 0 1rem;
  font-size: 0.875rem;
  text-align: left;
}
.header-inner-welcome-message ul {
  padding: 0;
}
.header-inner-welcome-message li {
  text-align: left;
  list-style-type: none;
}





/* SIDE NAVBAR MEDIAQUERIES ------------------------------ */
@media (min-width: 1199px) {
  .side-navbar h2 {
    font-size: 1.25rem;
  }
}

/*LEVEL 1*/
.main-menu {
  background-color: #E0E0E0;
  padding: 1.5rem 0;
}
.side-navbar li ul a {
  font-size: .875rem;
}

/*background for all li's in sidenav, not only storehome admin menu :: don't change*/
.side-navbar li a:focus,
.side-navbar li a:hover,
.side-navbar li a[aria-expanded="false"] a:focus {
  background: #000000;
}

.side-navbar li a[data-toggle="collapse"],
.side-navbar li a[data-toggle="collapse"]:before {
    content: '';
    background: url(../images/angle-right-solid-black.svg) center right no-repeat;
    background-size: 3%;
    background-position-x: 90%;
}
.side-navbar li a[data-toggle="collapse"]:hover, 
.side-navbar li a[data-toggle="collapse"]:hover:before {
  content: '';
  background: url(../images/angle-right-solid-white.svg) center right no-repeat;
  background-color: #000000;
  background-size: 3%;
  background-position-x: 90%;
}

.side-navbar li a[aria-expanded="true"],
.side-navbar li a[aria-expanded="true"]:before {
  content: '';
  background: url(../images/angle-down-solid-black.svg) center right no-repeat;
  background-color: #000000;
  background-size: 3%;
  background-position-x: 90%;
  padding-left: 1rem;
}
  .side-navbar li a[aria-expanded="true"]:hover,
  .side-navbar li a[aria-expanded="true"]:hover:before {
    content: '';
    background: url(../images/angle-down-solid-white.svg) center right no-repeat;
    background-color: #000000;
    background-size: 3%;
    background-position-x: 90%;
    padding-left: 1rem;
  }


 /*LEVEL 2*/
.side-navbar .level2 {
  background: #E0E0E0;
  padding-left: 1rem;
}
.side-navbar li ul.collapse a {
  border-color: #007ac2;
}
  .side-navbar li ul.collapse a:hover {
    background-color: #E0E0E0;
  }

.side-navbar li ul.collapse a[data-toggle="collapse"],
.side-navbar li ul.collapse a[data-toggle="collapse"]:before {
    content: '';
    background: url(../images/angle-right-solid-black.svg) center right no-repeat;
    background-size: 3%;
    background-position-x: 90%;
}
  .side-navbar li ul.collapse a[data-toggle="collapse"]:hover,
  .side-navbar li ul.collapse a[data-toggle="collapse"]:hover:before {
    content: '';
    background: url(../images/angle-right-solid-white.svg) center right no-repeat;
    background-color: #E0E0E0;
    background-size: 3%;
    background-position-x: 90%;
  }

  .side-navbar li ul.collapse a[aria-expanded="true"],
  .side-navbar li ul.collapse a[aria-expanded="true"]:before {
    content: '';
    background: url(../images/angle-down-solid-black.svg) center right no-repeat;
    background-color: #E0E0E0;
    background-size: 3%;
    background-position-x: 90%;
    padding-left: 1rem;
  }
    .side-navbar li ul.collapse a[aria-expanded="true"]:hover,
    .side-navbar li ul.collapse a[aria-expanded="true"]:hover:before {
      content: '';
      background: url(../images/angle-down-solid-white.svg) center right no-repeat;
      background-color: #E0E0E0;
      background-size: 3%;
      background-position-x: 90%;
      padding-left: 1rem;
    }


/*LEVEL 3*/
.side-navbar .level3 {
  background: #584e3c;
  padding-left: 1rem;
}

/*LEVEL 4*/
.side-navbar .level4 {
  background: #584e3c;
  padding-left: 1rem;
}

/*LEVEL 5*/
.side-navbar .level5 {
  background: #584e3c;
  padding-left: 1rem;
}

/* Malihu Custom Scroll */
.mCSB_scrollTools {
  width: 1px;
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #695e4a;
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar:hover {
  background-color: #695e4a;
}

/* UCLEFTSTORE side menu */
.admin-menu > ul.side-menu {
  font-size: 0.875rem;
  letter-spacing: 1px;
  margin-bottom: 0;
}
.cart-body {
  padding-left: 2rem;
}

.responsive-textbox {
  width: 100%;
}

.searchbox {
  padding: 0 2rem 0 2rem;
}

.categories > h2 {
  padding-left: 2rem;
}



/*Chat Available button*/
.chat > ul {
  margin-bottom: 0;
}
li.chat {
  width: 100%;
}
.chat-btn {
  display: inline-block;
  width: 100%;
  background: #000000;
  color: #ffffff;
  text-transform: uppercase;
  text-decoration: none;
  font-size: 0.875rem;
  padding: 1rem 4rem;
  border-color: #ffffff;
}
  .chat-btn:hover {
    background: #ffffff;
    color: #000000;
    border-color: #000000;
  }

/*
* ==========================================================
*     TOP MENU (blue bar)
* ==========================================================
*/
nav.navbar {
  font-size: .875rem;
  background: #000000;
  padding: .65rem 0;
}

nav.navbar a.menu-btn {
  width: 1.5rem;
  height: 1.5rem;
  line-height: 1.5rem;
}
 
.nav-item > img {
  width: 100%;
  height: auto;
  padding: 0 1rem 0 0;
}

.nav-item > a:hover, .nav-link > span:hover {
  text-decoration: underline;
  color: #ffffff;
}

.icon-header-menu > img {
  height: 20px;
 }

/*
* ==========================================================
*     PAGE HEADER
* ==========================================================
*/

.page-header {
  border-top: none;
  border-bottom: none;
  display: flex;
  align-items: center;
}
.page-header-welcome {
  background: url(../images/ModernAmenities_722.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  display: flex;
  align-items: center;
}
.page-header-newreg {
  background: url(../images/newReg-header-bkg.jpg) fixed top no-repeat;
  background-size: auto;
}
@media screen and (min-width: 1199px) {
  .page-header-newreg {
    background-size: contain;
  }
}
 .page-header-myaccount {
   background: url(../images/myaccount-header-bkg.jpg) fixed top no-repeat;
   background-size: auto;
 }
 @media screen and (min-width: 1199px) {
  .page-header-myaccount {
    background-size: contain;
  }
}
 .page-header-trackinvoice {
  background: url(../images/trackinvoice-header-bkg.jpg) fixed top no-repeat;
  background-size: auto;
}
@media screen and (min-width: 1199px) {
  .page-header-trackinvoice {
    background-size: contain;
  }
}
.page-header-statement {
  background: url(../images/statement-header-bkg.jpg) fixed top no-repeat;
  background-size: auto;
}
@media screen and (min-width: 1199px) {
  .page-header-statement {
    background-size: contain;
  }
}
.page-header-storeHome {
  background: url(../images/storeHome-header-bkg.jpg) fixed top no-repeat;
  background-size: auto;
}
@media screen and (min-width: 1199px) {
  .page-header-storeHome {
    background-size: contain;
  }
}
.page-header-styles {
  background: url(../images/styles-header-bkg.jpg) fixed top no-repeat;
  background-size: auto;
}
@media screen and (min-width: 1199px) {
  .page-header-styles {
    background-size: contain;
  }
}
.page-header-training {
  background: url(../images/training-header-bkg.jpg) fixed top no-repeat;
  background-size: auto;
}
@media screen and (min-width: 1199px) {
  .page-header-styles {
    background-size: contain;
  }
}
.page-header-style {
  background: url(../images/style-header-bkg.jpg) fixed top no-repeat;
  background-size: auto;
}
@media screen and (min-width: 1199px) {
  .page-header-styles {
    background-size: contain;
  }
}
.page-header-contactus {
  background: url(../images/contactus-header-bkg.jpg) fixed top no-repeat;
  background-size: auto;
}
.page-header-video-link {
  background: url(../images/sfnopen2022.jpg) fixed top no-repeat;
  background-size: auto;
}
@media screen and (min-width: 1199px) {
  .page-header-styles {
    background-size: contain;
  }
}
.page-header-title {
  color: #fff;
  padding: 20px;
  margin-top: 5%;
}
.page-header-title h1 {
  font-size: 2.5rem;
  padding: 1rem 0;
}

/*
* ==========================================================
*     SPECIAL MESSAGE BAR
* ==========================================================
*/
.dashboard-special-message {
  /*background-color: #695e4a;*/
  font-style: italic;
  color: #ffffff;
  padding: 0.5rem;
  font-size: 0.875em;
}

/*
* ==========================================================
*     CARD - the boxes containing content
* ==========================================================
*/
.card {
  background-color: #f2f1ef;
}
.card-header {
  padding: 1rem 0;
  background-color: #000000;
  border-bottom: none;
}
.card-header h2, .card-header h5 {
  color: #ffffff;
  font-weight: 400;
}
.card:not([class*="text"]) p {
  color: #695e4a;
}
.card-header a {
  color: #ffffff;
  text-decoration: none;
}
.card-header a:hover {
  color: #ffffff;
}
@media screen and (min-width: 1199px) {
  .card-no-invoice {
    padding-bottom: 12.25rem;
  }
}

/*Cards for catItem.aspx - Category Item List*/
.card-catItem {
  border: 1px solid #e1ddd9;
  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%;
}

.img-thumbnail {
    height: 167px;
}
@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;
  }
}

.card-img-top {
  border: 0;
  max-width: 100%;
} 

/*.card-footer-catItem {
  border-radius: 0 0 0 0;
  border-top: 0;
  background-color: #ffffff;
  padding: 1rem;
}*/
@media screen and (max-width: 991px) { 
  p {
    font-size: 0.875rem;
  }
}
.catItem-input > input.form-control {
  text-align: center;
}

.catlink img {
  cursor: pointer;
}


.card-title {
  width:100%;
  /*white-space:nowrap;*/
  overflow: hidden;
  text-overflow: ellipsis;
}






/*
* ==========================================================
*     FOOTER
* ==========================================================
*/
/*----------- styles for default.aspx footer*/
.footer-nav-link {
  color: #ffffff;
  padding-right: 1rem;
}
  .footer-nav-link:hover {
    color: #ffffff;
    text-decoration:underline;
  }
.default-copyright {
   color: #f8f7f6;
   text-align: center;
   font-size: 0.66rem;
 }

/*----------- styles for all other internal pages*/
footer.main-footer {
	background: transparent;
}
 .copyright {
  color: #000000;
  text-align: center;
  font-size: 0.66rem;
 }

/*
* ==========================================================
*     FORMS
* ==========================================================
*/
label {
  margin-top: 0.5rem;
}

.form-control {
  font-size: 0.875rem;
  color: #695e4a;
  background-color: #ffffff;
  background-clip: padding-box;
  border: 1px solid #e1ddd9;
  border-radius: 0rem;
  font-family: avenir-lt-pro, sans-serif;
  letter-spacing: 1px;
}
.form-control::-moz-placeholder,
.input-material::-moz-placeholder {
  font-size: 0.875rem;
  color: #695e4a;
  font-family: avenir-lt-pro, sans-serif;
}
.form-control::-webkit-input-placeholder,
.input-material::-webkit-input-placeholder {
  font-size: 0.875rem;
  color: #695e4a;
  font-family: avenir-lt-pro, sans-serif;
}
.form-control:-ms-input-placeholder,
.input-material:-ms-input-placeholder {
  font-size: 0.875rem;
  color: #695e4a;
  font-family: avenir-lt-pro, sans-serif;
}
.form-control-label-message {
  color: #b73d25;
  font-weight: bold;
  font-style: italic;
}

input::placeholder {
  color: #9d958c !important;
  font-size: 0.5rem;
}
input::-webkit-input-placeholder {
  color: #9d958c!important;
  font-size: 0.5rem;
}
input:-moz-placeholder {
  color: #9d958c !important;
  font-size: 0.5rem;
}

/*----------- style option select dropdown box and content*/
select.form-control option {
  color: #695e4a;
  font-size: .875rem;
}
.bootstrap-select > .dropdown-menu li a {
  color: #695e4a;
  font-size: 0.875rem;
}
.bootstrap-select > .dropdown-menu li a:hover {
  color: #007ac2;
}
.bootstrap-select > .dropdown-toggle.bs-placeholder {
  color: #695e4a;
  font-size: 0.875rem;
}
.bootstrap-select > .dropdown-toggle.bs-placeholder:hover {
  color: #695e4a;
}
.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 #695e4a;
  height: 40px;
  color: #695e4a;
  font-size: 0.875rem;
  letter-spacing: 1px;
}
input.form-control:focus {
  color: #695e4a;
  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: #695e4a;
}

@media screen and (max-width: 991px) { 
  .chosen-container {
    margin-top: 20px;
    margin-left: 0;
  }
}

.chosen-container .chosen-drop {
  border: 1px solid #e1ddd9;
  box-shadow: 0;
}
.chosen-container-single .chosen-default {
	color: #695e4a;
}
.chosen-container-single .chosen-single {
	border: 1px solid #e1ddd9;
  border-radius: 0;
  background: #ffffff;
  box-shadow: 0;
  color: #695e4a;
}
.chosen-container-single .chosen-default {
  color: #695e4a;
}
.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 #e1ddd9;
  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: #007ac2;
  background-image: none;
}
.chosen-container .chosen-results li.no-results {
  background: #f2f1ef;
}
.chosen-container-multi .chosen-choices {
  border: 1px solid #e1ddd9;
  background-image: none;
}
.chosen-container-multi .chosen-choices li.search-field input[type="text"] {
  color: #695e4a;
}
.chosen-container-multi .chosen-choices li.search-field .default {
  color: #695e4a;
}
.chosen-container-multi .chosen-choices li.search-choice {
  border: 1px solid #e1ddd9;
  background-color: #f2f1ef;
  background-image: none;
  box-shadow: 0;
  color: #695E4A;
}
.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 #e1ddd9;
  background-color: #f2f1ef;
  background-image: none;
  color: #695E4A;
}
.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 #007ac2;
  box-shadow: 0;
}
.chosen-container-active.chosen-with-drop .chosen-single {
  border: 1px solid #e1ddd9;
  background-image: none;
  box-shadow: 0;
}
.chosen-container-active .chosen-choices {
  border: 1px solid #007ac2;
  box-shadow: 0;
}
.chosen-container-active .chosen-choices li.search-field input[type="text"] {
  color: #695E4A !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 */

/*----------- small text below dynamic field*/
.text-muted {
  color: #695e4a !important;
}

/*----------- change font color on checkbox label*/
input.form-control-custom + label {
  color: #695e4a;
  font-size: 0.875rem;
}
/*----------- change unchecked checkbox bkg color and border*/
input.form-control-custom + label::before {
  background: #ffffff;
  border: 1px solid #e1ddd9;
  color: #ffffff;
}
/*----------- change checked checkbox bkg color from green to blue*/
input.form-control-custom:checked + label::before {
  background: #007ac2 !important;
}

/*----------- style horizontal divider line*/
.line {
  width: 100%;
  height: 1px;
  border-bottom: 1px solid #e1ddd9;
  margin: 20px 0 30px;
}

/*
* ==========================================================
*     BUTTONS
* ==========================================================
*/
.btn-primary {
  color: #ffffff;
  font-size: 0.875rem;
  background-color: #000000;
  border: 1px solid #000000;
  text-transform: uppercase;
  padding: 0.5rem 0.75rem;
  letter-spacing: 1px;
 }
.btn-primary:hover {
  background-color: #9d958c;
  border: 1px solid #9d958c;
}
.btn-primary:not([disabled]):not(.disabled):active,
.btn-primary:not([disabled]):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
  color: color-yiq(#9d958c);
  background-color: #9d958c;
  border-color: #9d958c;
  -webkit-box-shadow: 0 0 0 0.02rem rgba(157, 149, 140, 0.5);
  box-shadow: 0 0 0 0.002rem rgba(157, 149, 140, 0.5);
}
  
.btn-secondary {
  color: #695e4a;
  background-color: transparent;
  border-color: #695e4a;
  text-transform: uppercase;
  /*padding: 0.5rem 2.5rem;*/
}
.btn-secondary:hover {
  color: #ffffff;
  background-color: #9d958c;
  border: 1px solid #9d958c;
}
.btn-secondary:not([disabled]):not(.disabled):active,
.btn-secondary:not([disabled]):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
  color: color-yiq(#9d958c);
  background-color: #9d958c;
  border-color: #9d958c;
  -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: #695e4a;
  border: 1px solid #e1ddd9;
  background: #ffffff;
  }
    .cookies-modal .btn-outline-dark {
        background: none;
        color: #ffffff;
        border: 1px solid #e1ddd9;
    }

.btn-outline-dark:hover {
  color: #ffffff;
  background-color: #9d958c;
  border: 1px solid #e1ddd9;
}
    .cookies-modal .btn-outline-dark:hover {
        border: 1px solid #9d958c;
    }

.btn-outline-dark:focus,
.btn-outline-dark.focus
 {
  color: #695e4a;
  -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: #695e4a;
  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: #9d958c;
  border-color: #9d958c;
  -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-light, .btn-light:hover {
  color: #695e4a;
}
.btn-light {
  background-color: #c4beb6;
  border-color: #c4beb6;
}
.btn-light:hover {
  background-color: #9d958c;
  border-color: #9d958c;
}

.balance-btn {
  padding-top: 2rem;
}
@media screen and (max-width: 768px) {
  .center-btn {
    text-align: center;
  }
}

/*
* ==========================================================
*     ICONS
* ==========================================================
*/
/*----------- checkbox checkmark*/
input.form-control-custom + label::after {
  display: block;
  content: ' ';
  background-image: url('data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3C%21--%20Generator%3A%20Adobe%20Illustrator%2023.0.1%2C%20SVG%20Export%20Plug-In%20.%20SVG%20Version%3A%206.00%20Build%200%29%20%20--%3E%0A%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20x%3D%220px%22%20y%3D%220px%22%0A%09%20viewBox%3D%220%200%20512%20512%22%20style%3D%22enable-background%3Anew%200%200%20512%20512%3B%22%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cstyle%20type%3D%22text/css%22%3E%0A%09.st0%7Bfill%3A%23FFFFFF%3B%7D%0A%3C/style%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M173.9%2C439.4L7.5%2C273c-10-10-10-26.2%2C0-36.2l36.2-36.2c10-10%2C26.2-10%2C36.2%2C0L192%2C312.7L432.1%2C72.6%0A%09c10-10%2C26.2-10%2C36.2%2C0l36.2%2C36.2c10%2C10%2C10%2C26.2%2C0%2C36.2L210.1%2C439.4C200.1%2C449.4%2C183.9%2C449.4%2C173.9%2C439.4L173.9%2C439.4z%22/%3E%0A%3C/svg%3E%0A');
  background-repeat: no-repeat;
  background-size: 10px 10px;
  height: 10px;
  width: 10px;
}
  
/*----------- hamburger icon in top menu bar*/
#toggle-btn{
  background: #007ac2;
  position: relative;
}
@media (min-width: 1199px) {
  .menu-btn {
    display: none;
  }
}
#toggle-btn:hover {
  background: transparent;
 }
#toggle-btn::before {
  font-family: avenir-lt-pro, sans-serif;
  display: block;
  content: ' ';
  background-image: url('data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3C%21--%20Generator%3A%20Adobe%20Illustrator%2023.0.1%2C%20SVG%20Export%20Plug-In%20.%20SVG%20Version%3A%206.00%20Build%200%29%20%20--%3E%0A%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20x%3D%220px%22%20y%3D%220px%22%0A%09%20viewBox%3D%220%200%20448%20512%22%20style%3D%22enable-background%3Anew%200%200%20448%20512%3B%22%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cstyle%20type%3D%22text/css%22%3E%0A%09.st0%7Bfill%3A%23FFFFFF%3B%7D%0A%3C/style%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M16%2C132h416c8.8%2C0%2C16-7.2%2C16-16V76c0-8.8-7.2-16-16-16H16C7.2%2C60%2C0%2C67.2%2C0%2C76v40C0%2C124.8%2C7.2%2C132%2C16%2C132z%0A%09%20M16%2C292h416c8.8%2C0%2C16-7.2%2C16-16v-40c0-8.8-7.2-16-16-16H16c-8.8%2C0-16%2C7.2-16%2C16v40C0%2C284.8%2C7.2%2C292%2C16%2C292z%20M16%2C452h416%0A%09c8.8%2C0%2C16-7.2%2C16-16v-40c0-8.8-7.2-16-16-16H16c-8.8%2C0-16%2C7.2-16%2C16v40C0%2C444.8%2C7.2%2C452%2C16%2C452z%22/%3E%0A%3C/svg%3E%0A');
  background-repeat: no-repeat;
  background-size: 20px 20px;
  height: 20px;
  width: 20px;
  position: absolute;
}
/*icons in main menu*/
.icon-main-menu {
  color: #000000;
}
.icon-main-menu img {
  filter: brightness(0) saturate(100%);
  width: 15%;
  padding: 0 1rem 0 0;
}
  .icon-main-menu:hover img,
  .icon-main-menu:active img {
    filter: brightness(0) invert(1);
  }
.icon-main-menu-sm img {
  filter: brightness(0) saturate(100%);
  width: 15%;
  padding: 0 1.25rem 0 0;
}
.icon-main-menu-sm:hover img,
.icon-main-menu-sm:active img {
  filter: brightness(0) invert(1);
}
/*
* ==========================================================
*     TABLES
* ==========================================================
*/
table {
  font-size: 0.875em;
  color: #000000;
}
table.table a, #account-links a {
  text-decoration: underline;
}
.table th, .table td {
  font-size: 0.875rem;
	color: #000000;
}
.table-bordered td, .table-bordered th {
  border: 1px solid #e1ddd9;
}
.table-striped tbody tr:nth-of-type(2n+1) {
	background-color: #F8F7F6;
}
.table th {
  background: #e1ddd9;
}

/*
* ==========================================================
*     BREADCRUMBS
* ==========================================================
*/
.breadcrumbs {
  font-size: 0.75rem;
}
p.bread {
  margin: 0.5rem 0 0 0.5rem;
}

/*
* ==========================================================
*     DEFAULT.ASPX - login page
* ==========================================================
*/

body#login-form {
  background: url(../images/loginbg.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.login-logo img {
  margin-left: auto;
	margin-right: auto;
  display: block;
  padding-top: 60px;
  padding-bottom: 40px;
} 
@media only screen and (min-width: 1281px) {
  .login-logo img {
    padding-top: 90px;
  }
}

.main-div {
  background: #ffffff none repeat scroll 0 0;
  margin: 30px auto 30px;
  max-width: 100%;
  padding-top:2rem;
}
@media only screen and (min-width: 1281px) {
  .main-div {
    padding: 3rem 5rem 2rem 5rem;
  }
}

.remember {
text-align: left;
}

.flex-center {
display: flex;
justify-content: center;
}

.forgot-register-wrapper {
padding: 0;
}
.forgot, .register {
padding: 10px 0;
}
.forgot {
  text-align: center;
}
.register {
  text-align: center;
}
@media only screen and (min-width: 1281px) {
.forgot {
  text-align: left
}
.register {
  text-align: right;
}
}
.forgot a, .register a {
  color: #000000;
  font-size: 0.875rem;
}
/*
* ==========================================================
*     MODAL
* ==========================================================
*/
.modal-header {
  border-bottom:none;
}
.modal-body {
  padding: 3rem;
}
.modal-footer {
  border-top: none;
  -ms-flex-pack: start;
  justify-content: flex-start;
}
.close {
  color: #695e4a;
}

/*
* ==========================================================
*     WELCOME.ASPX - home page
* ==========================================================
*/
.welcome {
  background: url(../images/TimberGrove_II_00572_00400_CMYK_80.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


/*Promo Slider*/
.promoslider-wrapper {
  margin-top: 3rem;
  padding: 0;
  /*background-color: rgba(0, 0, 0, 0.25); /* semi-transparent black */
}
/*.promoslider-wrapper div[class*='col-'] .card-body {
  padding: 0;
  margin-bottom: 0;
  /*height: 100%;
  /*height: 380px;
 }*/
 .promoslider-wrapper div[class*='col-'] .card {
  background-color: rgba(157, 149, 140, 0.5);
 }

.welcome-dashboard-card .container-fluid {
	padding: 0 1rem;
}

#myCarousel {
  position:relative;
  z-index:1;
  height: 100%;
}
#myCarousel .container {
  max-width: 860px;
}
  #myCarousel .carousel-item {
    height: 100%;
    min-height: 380px;
  }

    #myCarousel .carousel-item .mask {
      position: absolute;
      top: 0;
      left: 0;
      height: 100%;
      width: 100%;
      background-attachment: fixed;
    }

.carousel-inner {
  overflow: visible;
}

.carousel-item h4 {
  font-size:50px;
  margin-bottom:15px;
  line-height:100%;
  letter-spacing:0.5px;
  font-weight:600;
}

/*changing font color on headline in slider*/
.carousel-item h4.sltext,
.carousel-item p.sltext {
    color: #fff;
}
.carousel-item h4.sltext1,
.carousel-item p.sltext1 {
    color: #231f20;
}
.carousel-item h4.sltext2,
.carousel-item p.sltext2 {
    color: #63666b;
}
.carousel-item h4.sltext3,
.carousel-item h5.sltext3,
.carousel-item p.sltext3 {
    color: #000000;
}
.carousel-item h4.sltext4,
.carousel-item p.sltext4 {
    color: #000000;
}

@media (max-width: 852px) {
  .carousel-item h4 {
    font-size: 2rem;
  }
}
.carousel-item p {
  font-size:24px;
  margin-bottom:15px;
  /*color:#000000;*/
}
@media (max-width: 852px) {
  .carousel-item p {
    font-size: 1rem;
  }
}
#myCarousel .carousel-item a {
  background: #000000;
  font-size:14px;
  color:#ffffff; 
  padding:13px 32px; 
  display:inline-block;
  border: none;
}
#myCarousel .carousel-item a:hover{
  background: #9d958c;
  text-decoration:none;
  border: none;
}

.carousel-item h4 {
  -webkit-animation-name:fadeInLeft;
  animation-name:fadeInLeft;
} 
.carousel-item h5 {
    -webkit-animation-name:fadeInLeft;
    animation-name:fadeInLeft;
  } 
.carousel-item p {
  -webkit-animation-name:slideInRight; 
  animation-name:slideInRight;
} 
.carousel-item a {
  -webkit-animation-name:fadeInUp; 
  animation-name:fadeInUp;
}
.carousel-item .mask img {
  -webkit-animation-name:slideInRight; 
  animation-name:slideInRight; 
  display:block; 
  height:auto; 
  max-width:100%;
}
.carousel-item h4,
.carousel-item h5,
.carousel-item p,
.carousel-item a,
.carousel-item .mask img {
  -webkit-animation-duration: 1s;
  animation-duration: 1.2s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

/*UPDATE SLIDES BACKGROUND HERE, NOT IN MS ACCESS*/
.slide1, .slide2, .slide3, .slide4, .slide5, .slide6 {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  display: flex;
  align-items: center;
}

.slide1 {
  background: url(../images/bkg-slide1.jpg) center center no-repeat; }


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

.carousel-control-next,
.carousel-control-prev {
  height:40px; 
  width:40px; 
  padding:12px; 
  top:50%; 
  bottom:auto; 
  transform:translateY(-50%); 
  background-color: #695e4a;
}

.carousel-item {
  position: relative;
  display: none;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  transition: -webkit-transform .6s ease;
  transition: transform .6s ease;
  transition: transform .6s ease,-webkit-transform .6s ease;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-perspective: 1000px;
  perspective: 1000px;
}
.carousel-fade .carousel-item {
opacity: 0;
-webkit-transition-duration: .6s;
transition-duration: .6s;
-webkit-transition-property: opacity;
transition-property: opacity
}
.carousel-fade .carousel-item-next.carousel-item-left,
.carousel-fade .carousel-item-prev.carousel-item-right,
.carousel-fade .carousel-item.active {
opacity: 1
}
.carousel-fade .carousel-item-left.active,
.carousel-fade .carousel-item-right.active {
opacity: 0
}
.carousel-fade .carousel-item-left.active,
.carousel-fade .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item-prev.active,
.carousel-fade .carousel-item.active {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0)
}
@supports (transform-style:preserve-3d) {
.carousel-fade .carousel-item-left.active,
.carousel-fade .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item-prev.active,
.carousel-fade .carousel-item.active {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
}
.carousel-fade .carousel-item-left.active,
.carousel-fade .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item-prev.active,
.carousel-fade .carousel-item.active {
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

@-webkit-keyframes fadeInLeft {
from {
  opacity: 0;
  -webkit-transform: translate3d(-100%, 0, 0);
  transform: translate3d(-100%, 0, 0);
}

to {
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
}

@keyframes fadeInLeft {
from {
  opacity: 0;
  -webkit-transform: translate3d(-100%, 0, 0);
  transform: translate3d(-100%, 0, 0);
}

to {
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
}

.fadeInLeft {
-webkit-animation-name: fadeInLeft;
animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInUp {
from {
  opacity: 0;
  -webkit-transform: translate3d(0, 100%, 0);
  transform: translate3d(0, 100%, 0);
}

to {
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
}

@keyframes fadeInUp {
from {
  opacity: 0;
  -webkit-transform: translate3d(0, 100%, 0);
  transform: translate3d(0, 100%, 0);
}

to {
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
}

.fadeInUp {
-webkit-animation-name: fadeInUp;
animation-name: fadeInUp;
}

@-webkit-keyframes slideInRight {
from {
  -webkit-transform: translate3d(100%, 0, 0);
  transform: translate3d(100%, 0, 0);
  visibility: visible;
}

to {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
}

@keyframes slideInRight {
from {
  -webkit-transform: translate3d(100%, 0, 0);
  transform: translate3d(100%, 0, 0);
  visibility: visible;
}

to {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
}

.slideInRight {
-webkit-animation-name: slideInRight;
animation-name: slideInRight;
}

/* other cards on welcome page-styles*/
.welcome-redeempoints {
  background: url(../images/home-card-redeempoints.jpg) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  display: flex;
  align-items: center;
}

.welcome-redeempoints h4 {
  font-size: 2rem;
  margin-bottom: 1rem;
  color: #ffffff;
  line-height: 110%;
  letter-spacing: 1px;
  font-weight: 600;
  padding: 2rem 0;
}

.welcome-brandstyles {
  background: url(../images/home-card-brandstyles.jpg) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  display: flex;
  align-items: center;
}

.welcome-brandstyles h4 {
  font-size: 2rem;
  margin-bottom: 1rem;
  color: #ffffff;
  line-height: 110%;
  letter-spacing: 1px;
  font-weight: 600;
  padding: 2rem 0;
}

/*
* ==========================================================
*     TRACKING.ASPX
* ==========================================================
*/
#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;
  }
}


/*
* ==========================================================
*     PRODUCTINFO.ASPX
* ==========================================================
*/
.itemImage-thumb {
  display: inline-block;
  text-align: center;
  padding-top: 1rem;
  font-size: 0.75rem;
}

.pnlPoints #unitPrice {
  font-style: italic;
}

.litSelected {
  color: #007ac2
}

.pnlMsg {
  font-size: 0.875rem;
  margin-bottom: 1rem;
}
.pnlMsgsuccess {
  color: #638c1c;
  padding: 0.5rem;
  border:1px solid #638c1c;
}
.pnlMsgerror {
  color: #b73d25;
  padding: 0.5rem;
  border:1px solid #b73d25;
}

/*
* ==========================================================
*     CHECKOUT1.ASPX
* ==========================================================
*/
input[type="radio"] {
	margin: 0 1rem;
}

.pnlItem {
  text-align: right;
} 
@media (max-width: 1199px) {
  .pnlItem {
    text-align: center;
  }
}


/*
* ==========================================================
*     TRAINING.ASPX
* ==========================================================
*/
.training-listitem {
  border: 1px solid #c4beb6;
  padding: 1rem;
  }
 .admin-menu > h2, .admin-menu > p {
    padding-left: 2rem;
  }
 .training-listitem > a {
  width: 100%
}



/*
* ==========================================================
*     TAKEQUIZ.ASPX
* ==========================================================
*/
.quizResultsSuccessMsg > h3 {
  color: #638c1c;
}
.quizText {
  font-size: 0.875rem;
  color: #695e4a;
}
.videoimglink > img {
  max-width: 66%;
  height: auto;
  display: block;
  margin: auto;
}
.pnlNextCoursebtns li {
  display: inline-block;
}


/*
* ==========================================================
*     CONTACTUS.ASPX
* ==========================================================
*/
.contactinfo > p > a {
  text-decoration: underline; 
}
.contactinfo > p {
  padding-left: 1rem;
}


/*
* ==========================================================
*     CONTACTUS.ASPX
* ==========================================================
*/
.ucleftstore1_btnSearch {
  padding-left: 4rem;
  padding-right: 4rem;
}
.gap-0 {
  gap: 0 !important;
}

.gap-1 {
  gap: 0.25rem !important; /* 4px if base font-size is 16px */
}

.gap-2 {
  gap: 0.5rem !important; /* 8px */
}

.gap-3 {
  gap: 1rem !important; /* 16px */
}

.gap-4 {
  gap: 1.5rem !important; /* 24px */
}

.gap-5 {
  gap: 3rem !important; /* 48px */
}
#Rowmenu .dropdown-menu {
  position: absolute;
  top: 100%; /* Aligns the top of the dropdown menu with the bottom of the menu button */
  left: 0;
  transform: translateY(0); /* Adjust this value if necessary, negative values to move it up */
  z-index: 1000; /* Ensure it's on top of other elements */
  background-color: lightgrey; /* Use a specific grey shade if preferred, like #f8f9fa or #d6d8db */
}
.rpt-hdr {
  background: #e1ddd9;
  font-size: 0.875rem;
  color: #695e4a;
  border-color: #dee2e6;
  padding: 0.3rem;
  vertical-align: top;
  border-top: 1px solid #dee2e6;
  font-weight: bold;
  display: table-cell;
  text-indent: initial;
  border-spacing: 2px;
  border-right: 1px solid #ffffff !important;
}
.rpt-line {
  font-size: 0.875rem;
  color: #695e4a;
  border-color: #dee2e6;
  padding: 0.3rem;
  vertical-align: top;
  border-top: 1px solid #dee2e6;
  text-indent: initial;
  border-spacing: 2px;
}
.repeater-container {
  max-height: 500px;
  overflow-y: scroll;
  border: none; /* Hides borders */
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}

  .repeater-container::-webkit-scrollbar {
    display: none; /* Chrome, Safari, and Opera */
  }

/* For hiding borders, if any */
.repeater-container {
  border: none;
  border-bottom: 2px solid #33b35a;
}
.narrow-textbox {
  width: 100px; /* Adjust the width as needed */
}
.tall-border {
  border-top: 5px solid black; /* Adjust '5px' to increase or decrease the border height */
}
.checkbox-spacing input[type="checkbox"] + label {
  margin-left: 5px;
  white-space: nowrap;
  margin-top: 0px;
  margin-bottom: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
}
.chosen-container {
  margin-left: 0px;
 
}
.modal-body {
  padding: 1.5rem;
}
.chosen-container-single .chosen-single {
  height: 40px;
  line-height: 40px;
}