/* 
#1f1f1f  dark font
#424242  light font
#ba3e00  red link

#57442e  darker brown
#7e7466  brown
#685237  lighter
#917859  lighter
#d3bea4  lightest
#7f0000  opt link
#b1987a  base
*/

html, body {
   padding: 0px;
   margin: 0 auto;
   width: 100%;
   font-family: 'Trebuchet MS', Tahoma, Verdana, Arial, Helvetica, sans-serif;
   font-size: 1rem;
   font-weight: 500;
   line-height: 1.4;
   text-align: left;
   color: #424242;
   background-image: none;
   background-color: #fff;
}

h1, h2, h3 { 
   font-family: Georgia, Palatino, 'Times New Roman', Times, serif; 
   font-size: 2rem; 
   line-height: 1.3; 
   color: #262626; 
   font-style: normal; 
   font-weight: normal; 
   text-transform: none; 
   letter-spacing: 0px;
}
h2 { font-size: 1.5rem;}
h3 { font-size: 1.3rem;}

p { font-family: 'Trebuchet MS', Tahoma, Verdana, Arial, Helvetica, sans-serif; font-size: 1rem; color: #424242; line-height: 1.4; font-weight: 500;}
ul, li, ol { list-style-type: square;}

a:active, a:link, a:visited {color: #ba3e00; text-decoration: none; font-weight: 500;}
a:hover {color: #ba3e00; text-decoration: none;}

strong {
  color: #444;
}

.row {
   display: flex;
   flex-wrap: wrap;
}
.column {
   flex: 50%;
   min-width: 250px;
}

div > * {
   box-sizing: border-box;
}
#divTop {
   width: 100%;
   height: 110px;
   margin: 0 auto;
   background-color: #e9eaea;
   background-image: url('/assets/images/bg_top.jpg?lastModified=1jrshg6');
   background-repeat: repeat-x;
   overflow: hidden;
}
#divTop div {
   max-width: 900px;
   height: 110px;
   padding: 0px 10px;
   margin-left: auto;
   margin-right: auto;
   box-sizing: border-box;
}
.logo { 
   max-width: 200px;
   max-height: 65px;
   margin: 20px 0px 0px 0px;
}
.tagline {
   display: none;
   max-width: 139px;
   max-height: 73px;
   margin: 20px 0px 0px 5px;
}
.column-logo {
   width: 65%;
}
.column-login {
   width: 35%;
}
a.login:active, a.login:link, a.login:visited {line-height: 1.5; color: #1f1f1f; text-decoration: none; font-weight: 700;}
a.login:hover {color: #ba3e00;}
.spacer {
   margin: 0px 12px;
   border: 0.5px solid #aeadad;
}
.tabs {
   display: none;
   position: absolute; right: 20px; bottom: 0;
}
.navTop {
   display: none;
   text-align: right; margin: 10px 10px 0px 0px;
}


/* begin main */
#divMain {
   max-width: 900px;
   min-height: 600px;
   margin: 0 auto;
   padding: 20px;
   box-sizing: border-box;
}
.today-offer {
   width: 100%; margin-bottom: 30px; display: flex; flex-wrap: wrap;
}
.today-offer-description {
   flex: 1 1 auto; width: 60%; padding-right: 10px;
}
.today-offer-image {
   display: none;
   flex: 1 1 250px; width: 30%;
}
.today-image {
   display: none;
   border: 1px solid #d8cbbc; padding: 10px; max-width: 250px; margin-top: 20px; margin-right: 0px; margin-left: 30px; float: right;
}
h1.today {
   font-family: Georgia, Palatino, 'Times New Roman', Times, serif; 
   font-size: 1.3rem; 
   letter-spacing: 0px;
}
h2.today  {
   margin: 10px 0px 20px 0px; color: #1f1f1f; text-transform: none; letter-spacing: 0px; line-height: 1;
}
.shortdesc {
   margin: 30px 0px;
}
/* end main */


/* begin bottom and footer */

#divBottom {
   width: 100%;
   min-height: 650px;
   margin: 0 auto;
   padding: 20px 0px;
   background-color: #e9eaea;
   background-image: url('/assets/images/bg_bottom.jpg?lastModified=1jrsi25');
   background-repeat: repeat-x;
   overflow: hidden;
}
#divBottom div {
   max-width: 900px;
   margin: 0 auto;
   padding: 20px 0px 20px 20px;
   box-sizing: border-box;
}
.year {
   color: #1f1f1f;
   text-align: left;
   font-weight: 500;
}
.footer {
   color: #f0ede1;
   text-align: left;
   font-size: 1.2rem;
   line-height: 1.6;
   font-weight: 300;
}

a.footer:active, a.footer:link, a.footer:visited {color: #1f1f1f; text-decoration: none; font-weight: 700;}
a.footer:hover {color: #ba3e00;}

.hr-footer {
   width: 50%;
   margin: 20px 0;
   background-color: #9b9a95;
   text-align: left;
}
 
.mailing-list {
   padding: 0em 1em 1em 1em;
   margin: auto 0;
   max-width: 850px;
   background-color: #fff;
   background-image: linear-gradient(-45deg, rgba(255, 255, 255,0) 30%, rgba(255, 255, 255,.95) 30%),  url('/assets/images/signup.jpg?lastModified=1equ896'); 
   background-repeat: no-repeat;
   background-position: 0% 40%;
   border: 1px solid #d1cfca;
   border-radius: 0px;
   color: #1f1f1f;
   overflow: hidden;
}
.mailing-list-about {
   padding: 1em 1em 1.5em 1em;
   margin: auto 0;
   margin-top: 2em;
   margin-bottom: 2em;
   max-width: 850px;
   background-color: #fff;
   background-image: linear-gradient(-45deg, rgba(255, 255, 255,0) 40%, rgba(255, 255, 255,.85) 40%),  url('/assets/images/signup.jpg?lastModified=1equ896'); 
   background-repeat: no-repeat;
   background-position: 40% 60%;
   border: 1px solid #d1cfca;
   border-radius: 0px;
   color: #1f1f1f;
   overflow: hidden;
}
.mailing-list h2 {
   padding: 0;
   margin-top: 10px;
   color: #1f1f1f;
}
.mailing-list p {
   color: #000;
   max-width: 70%;
   margin-right: 1em;
   text-align: left;
}
.mailing-list p:nth-child(4) {
  margin: 30px 0 30px 0;
  max-width: 700px;
}

a.sign-up {
   padding: .75em 2em .75em 2em;
   margin: 0;
   cursor: pointer;
   font-family: Arial, Helvetica, sans-serif;
   text-transform: uppercase;
   color: #1f1f1f;
   font-size: .95rem;
   font-weight: 700;
   font-style: normal;
   letter-spacing: .5px;
   text-align: center;
   background-color: #f2f2f2;
   background-image: linear-gradient(rgb(255, 255, 255), rgb(225, 225, 225));
   background-repeat: no-repeat;
   border: 1px solid #ccc;
   border-bottom: 1px solid #c0c0c0;
   border-radius: 2px;
   box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.3);
}
a.sign-up:hover {
  background-image: linear-gradient(rgb(255, 255, 255), rgb(225, 225, 225));
  background-repeat: no-repeat;
  box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.5);
}
.sign-up-man {
   width: 100%;
   max-height: 50px;
   max-width: 50px;
   margin-left: 10px;
   margin-bottom: -20px;
}

/* end bottom and footer */

.error-page {
   min-height: 300px;
}
.error { 
    line-height: 1.4;
    color: #1f1f1f; 
    border: 1px solid #dcdcdc;
    background-color: #ffffd6;
    padding: 10px;
    margin-top: 20px;
    margin-bottom: 20px;
}
div.error { 
   line-height: 1.4;
   padding: 10px;
   margin: 0 auto;
   margin-bottom: 1.5em;
   color: #1f1f1f;
   border: 1px solid #dcdcdc;
   background-color: #ffffd6;
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
   text-align: center;
}
div.error-account { 
   line-height: 1.4;
   padding: 10px;
   margin: 0;
   margin-bottom: 1.5em;
   max-width: 350px;
   color: #1f1f1f;
   border: 1px solid #dcdcdc;
   background-color: #ffffd6;
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
   text-align: left;
}
div.modal-msg { 
   line-height: 1.4;
   color: #1f1f1f;
   margin: 0 auto;
   max-width: 90%;
   padding: 10px;
   margin-bottom: 20px;
}

hr {
    width: 100%; 
    color: #dcdcdc;
    background-color: #ccc; 
    border: 0 none; 
    height: 1px;
    margin: 20px 0px;
}   

#checkout {
	background-color: #ffffff;
	padding: 20px;
}

/* The Modals */

.btn-modal {
  cursor: pointer;
}
.btn-modal:hover, .btn-modal:focus {
  cursor: pointer;
}


.modal {
  display: none;
  position: fixed;
  z-index: 8888;
  top: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(51, 51, 51, 0.9);
  transition-duration: 250ms;
  transition-property: width;
  transition-property: width, transform;
  transition-timing-function: ease-in-out;
  transition-delay: 0ms;
}

.modal-area {
   margin: 5vh auto;
   width: 95%;
   background-image: linear-gradient(-5deg, #e9eaea, #fff);
   background-repeat: no-repeat;
   padding: 0 0 1em 0;
   max-width: 500px;
   text-align: center;
}

.modal-banner {
   padding: 1.5em 0 1em 0;
   margin: 0 0 0 0;
}

/* Modal Close */

p.close-btn {
  text-align: right;
  padding: 0;
  margin: -1em 0 1em 0;
  height: 1px;
}
.close {
  color: #9b9a95;
  text-align: right;
  font-weight: bold;
  font-size: 2rem;
  padding: .25rem 1rem .5rem 1rem;
  margin: -.5em 0 0 0;
}
.close:hover,
.close:focus {
  color: #1f1f1f;
  text-decoration: none;
  cursor: pointer;
}

/* Modal Content */

h1.modal-title {
   margin: 0rem 0 .5rem 0;
}

p.modal-content {
   margin: 0 0 0 0;
}

.modal-form, .form-login, .form-register, .form-forgot, .form-shipping, .form-billing {
   padding: 2em 5% 1em 5%;
   margin: 0 auto;
   margin-bottom: 1.5em;
   max-width: 90%;
   background-color: white;
   border: 1px solid #dcdcdc;
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
   text-align: center;
}

.modal-link, a.modal-link, a.modal-close {
   padding: 1.5rem 0rem;
   margin: 0;
   font-size: 1rem;
   font-weight: 500;
   color: #ba3e00;
   text-decoration: none;
   line-height: 2;
   text-align: center;
   cursor: pointer;
}
.modal-link:hover, .modal-link:focus, 
a.modal-link:hover, a.modal-link:focus, 
a.modal-close:hover, a.modal-close:focus {
   color: #ba3e00;
}
.create {
   font-size: 1.2rem;
}

.form-delivery {
   color: #424242;
   margin-bottom: 1.5em;
}

/* forms */
    
form, label, input, select, textarea {
  padding: 0px;
  margin: 0px;
  color: #2b2b2b;
  font-size: 1rem;
}
textarea {
   background-color: white;
   border: 1px solid #dcdcdc;
}
fieldset {
  padding: 0 .5rem .25rem 0;
  margin: 0 0 .25rem 0;
  box-sizing: border-box;
  border: 1px solid #dcdcdc;
  background-color: white;
  font-weight: 700;
}
fieldset:focus-within {
  border: 1px solid #666;
}

legend {
  padding: 0 .5rem 0 .5rem;
  margin: 0px 1rem 0px .5rem;
  background-color: white;
  font-family: 'Trebuchet MS', Tahoma, Verdana, Arial, Helvetica, sans-serif;
  font-weight: 700;
  color: #999999;
  font-size: .7rem;
  text-transform: uppercase;
  text-align: left;
  letter-spacing: 1px;
}

.label-select-item {
   color: #fff;
   font-size: .1rem;
}

input[type=text], input[type=email], input[type=password], input[type=text]:focus, input[type=email]:focus, input[type=password]:focus, textarea {
  filter: none;
  background-color: #fff;
  transition-delay: 99999s;
  box-shadow: 0 0 0 100px white inset;
  display: block;
  font-family: 'Trebuchet MS', Tahoma, Verdana, Arial, Helvetica, sans-serif;
  font-weight: 700;
  color: #2b2b2b;
  height: 2rem;
  width: 100%;
  padding: .5rem 1rem;
  margin: 0 0 0 0;
  outline-width: 0px;
  outline-style: solid;
  outline-color: #fff;
  box-sizing: border-box;
  border: 0px solid rgba(255, 255, 255, 0.1);
  border-radius: 0px;
}

input[type=button], input[type=submit], input[type=reset] {
   padding: .5rem 1rem .5rem 1rem;
   margin: 0;
   height: 2.8rem;
   cursor: pointer;
   font-family: Arial, Helvetica, sans-serif;
   text-transform: uppercase;
   color: #000;
   font-size: 1rem;
   font-weight: 500;
   font-style: normal;
   letter-spacing: .5px;
   text-align: center;
   background-color: #f2f2f2;
   background-image: linear-gradient(-5deg, #c4c5c0, #fff);
   background-repeat: no-repeat;
   border: 1px solid #e0dfdb;
   border-right: 1px solid #c5c4bf;
   border-bottom: 1px solid #c5c4bf;
   border-radius: 2px;
   box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0);
}


input[type=button]:hover, input[type=submit]:hover {
   background-image: linear-gradient(#fff, #c4c5c0);
   background-repeat: no-repeat;
   border-bottom: 1px solid #b0afa9;
   box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.2);
}
input[type=button]:active, input[type=submit]:active {
  transform: translate(2px,2px);
}

input.input-m {
   margin: 1em 0px 0px 10px;
}
input.input-shop {
   margin: 1em 0px 0px 0px;
}
input.input-checkout {
   padding: .5rem 2rem;
   margin: 1.5rem auto;
}


::placeholder {
  font-family: 'Trebuchet MS', Tahoma, Verdana, Arial, Helvetica, sans-serif;
  font-weight: 300;
  color: #cccccc;
  opacity: 1;
}

select {
  font-family: 'Trebuchet MS', Tahoma, Verdana, Arial, Helvetica, sans-serif;
  font-weight: 700;
  height: 2.8rem;
  vertical-align: middle;
  min-width: 3rem;
  border: 1px solid #dcdcdc;
  background-color: #fff;
}

select:focus {
  outline-width: 0px;
  outline-style: solid;
  outline-color: #fff;
}


select.select-birthday {
   padding: 0 10px 0 10px;
   text-align: left;
}
select.item-qty {
   padding: 0px 0px 0px 3px;
   margin: -2px auto 0px auto;
}
select:focus-within {
  border: 1px solid #666;
}

.col-2 {
  display: flex;
  flex-direction: row;
}
.exp {
  text-align: left;
  width: 70%;
}
.exp fieldset {
  border-color: white;
  border-width: 0;
  padding: 0;
  margin: 0;
}
.exp legend {
  padding: 0 0 0 1.5em;
  margin: 0;
}
.exp select {
  text-align: left;
  padding-left: .75rem; 
  width: 45%;
  margin-top: 5px;
}
.exp select option {
  text-align: left;
  padding-left: .75rem; 
}
.cvc {
  width: 30%;
  padding-top: 13px;
}
.validate {
   text-align: left;
   background-color: #ffffd6;
   color: #424242;
}
div .state {
  text-align: left;
}
div .state select {
  padding: 0 0 3px 12px;
  margin: 5px 0 5px 0;
}
.form-simple-w {
   padding: 2em 5% 2em 5%;
   margin: 0;
   margin-bottom: 1.5em;
   max-width: 350px;
   background-color: white;
   border: 1px solid #dcdcdc;
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}
.account, .pages {
   max-width: 600px;
   margin-bottom: 3rem;
}
a.toggle {
   color: #262626;
   text-decoration: none;
}
a.toggle:hover {
   color: #262626;
}
 /* history hover */
.initial { background-color: transparent;}
.normal { background-color: transparent;}
.highlight { background-color: #E6E6E6;}

.forgot {
   padding: 20px 0px 0px 10px;
}