/*=========================================================================== */
/*		!Brand Custom Styles		============================================= */
/*=========================================================================== */


/* ===== Variables ==================== */

:root {
  --color-grey: #6C6863;
  --color-red: #93575E;
  --color-beige: #F1EFEC;

  --font-book: "BodoniTwelveITCW01-Book_731162", serif;
  --font-ital: "BodoniTwelveITCW01-Book_731165", serif;
}


/* ===== Global ==================== */

html,
body {
   color: var(--color-grey);
   background-color: var(--color-beige);
	font-size: 62.5%; /* equivalent to 10px, easier math */
   font-family: var(--font-book);
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
}

h1,
h2 {
  font-family: var(--font-book);
  letter-spacing: 0.3rem;
  text-transform: uppercase;
}

h1,
h2 {
  font-size: 2rem;
  color: var(--color-red);
  line-height: 3.1rem;
  margin-bottom: 1.5rem;
}

body {
  font-size: 1.7rem;
  letter-spacing: 0.01rem;
}

a {
  color: var(--color-grey);
}

/* ===== Footer ==================== */

footer {
	background-color: transparent;
}

.layoutcontent {
	border-bottom: 1px solid #ccc;
  padding-bottom: 6rem;
}

.footer-inner ul.nav {
	display: none;
}

.site-address {
  font-size: 0.9rem;
  color: var(--color-grey) !important;
  letter-spacing: 0.3rem;
  text-transform: uppercase;
  line-height: 1rem !important;
}


/* ===== Header ==================== */

.logo {
  width: 30rem;
  height: auto;
  margin-top: 30px;
}

header, 
.navbar {
	background-color: transparent;
}

ul.navbar-nav li a {/* Main menu */
  color: var(--color-grey) !important;
  font-size: 1.26rem;
  text-transform: uppercase;
  letter-spacing: 0.3rem !important;
  font-weight: 400;
}

ul.navbar-nav li a:link, a:visited, a:hover, a:active { /* Main menu */
  color: var(--color-grey) !important;
  text-decoration: none !important;
}


/* Super nav, upper right */
.custom-cart a,
.custom-cart a:visited,
.custom-cart li::before {
  color: var(--color-grey) !important;
  font-size: 1.2rem;
  text-transform: uppercase;
  letter-spacing: 0.3rem !important;
  display: none;
}


/* ===== Sidebar ==================== */

ul.subnav {
  padding-top: 3px;
}

ul.subnav li a { /* Left side sub nav */
  color: var(--color-grey) !important;
  font-size: 1.4rem;
  text-transform: uppercase;
  letter-spacing: 0.15rem !important;
}

ul.subnav li a:link, a:visited, a:hover, a:active {
  color: var(--color-grey) !important;
  text-decoration: none !important;
}


/* ===== Button ==================== */

.button,
.button:hover,
.btn,
.btn:hover {
  font-size: 1.8rem;
  font-family: var(--font-ital);
  color: var(--color-red) !important;
  text-transform: uppercase;
  letter-spacing: 0.3rem;
  border: 1px solid var(--color-red);
  padding: 6px 10px; /* GT note there is some weird extra padding I am having to counter */
  background-color: transparent;
  text-decoration: none;
    margin: 0 !important;
      border-radius: 0 !important;
}

.members .page-content { /* GT - this is for extra spacing on Login page above username field. Watch as it may impact other areas */
  margin-bottom: 0;
}

/* Main Menu - Note the left and right sides are flush to each side w extra space in the center around the logo, per design specs */

ul.navbar-nav {
    display: grid;
  grid-template-columns: 35% 30% 35%;
  width: 1020px;
  margin: -45px auto 0 auto;
  position: relative;
}

#block-mainmenuleft {
   grid-column-start: 1;
}

#block-mainmenuleft li {
  float: left;
  padding-right: 18px;
}


#block-mainmenuright {
   grid-column-start: 3;
}

#block-mainmenuright li {
float: right;
  padding-left: 18px;
  text-align: right;
}



/* GT new stuff 04/09/20 */

.form-group label, 
.col-sm-3.control-label, 
.col-sm-3.control-label strong {
  font-weight: normal !important;
  text-transform: uppercase !important;
  font-size: 1.4rem;
    letter-spacing: 0.15rem !important;
}

.navbar.navbar-inverse.navbar-fixed-top {
    background-color: var(--color-beige) !important;
    height: 1200px; /* GT remove height */
}

ul.nav.navmenu-nav.menu-top {
  font-size: 1.4rem;
  text-align: center;
}


/* MOBILE NAV */

/* hamburger GT added 04-16-20, copied some lines from sites.css starting w line 274 */
/* Changing color of hamburger 3 bars and the X to gray */

.mobile-nav-toggle-label .top-bar, .mobile-nav-toggle-label .middle-bar, .mobile-nav-toggle-label .bottom-bar {
    background-color: var(--color-grey);
}

.active .mobile-nav-toggle-label .top-bar {
    background-color: var(--color-grey);
}

.active .mobile-nav-toggle-label .bottom-bar {
    background-color: var(--color-grey);
}


/* PBMQ on Mailing List page */
.preferences.mb-2 h3 {
  display: none;
}

.preferences.mb-2 .h4 {
  font-size: 17px;
  border: none;
}

/* GT new stuff 04/09/20 */

.panel-body {
  background-color: transparent !important;
}

.panel-default > .panel-heading {
  background-color: transparent !important;
  border: 1px solid rgba(128,128,128,0.5) !important; 
  padding: 3px 0px 0px !important;
}

.cart-wrapper {
  border: 1px solid rgba(128,128,128,0.5) !important; 
}

.store .cart-price {
  padding-top: 14px;
}

.showcart .panel-heading.heading-bar h2 {
  margin-bottom: 12px !important;
}

.login-link {
  padding-top: 12px;
}

.store .btn-default.continue-shopping {
    border: 0;
    background: transparent;
    box-shadow: none;
    padding: 0;
    margin: 0;
    letter-spacing: 0.1em;
    color: var(--color-grey);
    font-family: var(--font-book);
    font-size: 1.6rem;
}

.btn-default.continue-shopping .fa {
    padding-right: 0.4em;
}

.login-link a:link {
    color: var(--color-red) !important;
}

#active-checkout .panel-heading.heading-bar h2 { /* Payment Info H2 needs fixing*/
padding-left: 15px;
}

.btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary:active.focus, .btn-primary:active:focus, .btn-primary:active:hover, .open > .dropdown-toggle.btn-primary.focus, .open > .dropdown-toggle.btn-primary:focus, .open > .dropdown-toggle.btn-primary:hover {
    background-color: transparent;
    border-color: var(--color-red);
}
#giftCertificateForm, #orderNotesForm, .image.img-responsive {
    display: none;
}

