/*PAGE*/
            html {
            color: #222;
            font-size: 1em;
            line-height: 1.4;
            font-family: "Dosis";
            overflow:auto;
            }

            body {

            overflow:hidden;
            }

            a {
            font-size: 1em; /* Set a font size */
            text-decoration: none;
            }

            a:link {
            color: #000000; text-decoration: none
            }


            input {
                text-align:center;
            }

            * {
              box-sizing: border-box;
            }


            ul {
                text-align: center;
                list-style-position: inside;
            }

          //*  object {max-height:100%;} *//


/*TEXT*/

            p   {
                text-align: center;
                font-size: 16px;
                }

            h1  {
                font-size: 22px;
                color: black;
                vertical-align: bottom;
                }

            h2  {
                font-size: 22px;
                color: beige;
                vertical-align: bottom;
                }

            h3  {
                font-size: 20px;
                }

            @import url('https://fonts.googleapis.com/css2?family=Dosis:wght@800&display=swap');


            .fontface {
                    font-family: 'Dosis', sans-serif;
                    font-weight: Normal; /*  This is just so when ever you call use this class, it uses the normal font weight by default */
                    }

            .ff-300 { /* you can also name this rbt-light or whatever you like*/
                    font-weight:300;
                    }

            .ff-400 {
                    font-weight:400;
                    }

            .ff-800 {
                    font-weight:800;
                    }

            .font2 {
                    font-family: 'Dosis', sans-serif;
                    font-weight: 900; /* Or any of the font weight values you included via the Google font url  */
                    font-size: 30px;
                    color:White;
                    }

            .textarea {
                    line-height: 45px;
                    text-align:center;
                    }


/*HEADER*/

header {
    background-color: #d09b49;
            color:            black;
            font-size:        18px;
            font-family:      "Dosis";
            height:           auto;
            line-height:      15px;
            padding:          10px;
            text-align:       center;
            }
}

.header {
    background-color: #d09b49;
            color:            black;
            font-size:        18px;
            font-family:      "Dosis";
            height:           auto;
            line-height:      15px;
            padding:          10px;
            text-align:       center;
            }

    /*LOGO*/

            .logo-img {
                    display: none;
                    width: auto;
                    height:auto;
                    position: relative;
                    left: 50%;
                    top:50px;
                    transform: translate(-50%, -50%);
                    }

            @media (min-width: 1025px) {
                    .logo-img-desktop { display: block;}
                    .nav-img-desktop { display: block; }
                    }

            @media (min-width: 768px) and (max-width: 1024px) {
                    .logo-img-tablet { display: block;}
                    .nav-img-tablet { display: block;}
                    }

            @media (min-width: 10px) and (max-width: 767px) {
                    .logo-img-mobile { display: block;}
                    .nav-img-mobile { display: block;}
                    }

    /*SEARCH*/

            .divTableCellSearch{
                    border-top: 2px solid #000000;
                    border-bottom: 1px solid #000000;
                    background-color: #f0eadf;
                  	height:auto;
                  	display: table-cell;
                    text-align:center;
                    margin: auto;
                    width: 100%;
                    color: black;
                    }


    /*NAVIGATION*/

            .divTableCellMain{
                      border: 0px solid #000000;
                      background-color: #d09b49;
                      height:70px;
                      display: table-cell;
                      text-align:center;
                      line-height: 58px;
                      margin: auto;
                      width: 100%;
                      color: black;
                      }

            .divTableCellN1 {
                    border: 1px solid #000000;
                    background-color: #d09b49;
                    height:30px;
                    display: table-cell;
                    padding: 3px 20px;
                    text-align:center;
                    margin: auto;
                    width: 100%;
                    color: black;
                    }

            .divTableCellN2 {
                    border-top: 1px solid #000000;
                    border-bottom: 2px solid #000000;
                    background-color: #f0eadf;
                    height:54px;
                    display: table-cell;
                    padding: 3px 5px;
                    text-align:center;
                    margin: auto;
                    width: 100%;
                    color: black;
                    }



/* NAVIGATION BAR */

          .alignleft {
                  float: left;
                  width:40%;
                  text-align:right;
                  padding:10px;

                  }

          .aligncenter {
                  float: left;
                  width:20%;
                  text-align:center;
                  padding:10px;

                  }

          .alignright {
                  float: left;
                  width:40%;
                  text-align:left;
                  padding:10px;

                  }​



            .nav-img {
                    display: none; text-align: center;
                    width: auto;
                    height:auto;
                    position: relative;
                    left: 50%;
                    top:5px;
                    transform: translate(-50%, -50%);
                    }

            @media (min-width: 1025px) {
                    .nav-img-desktop { display: block; }
                    }

            @media (min-width: 768px) and (max-width: 1024px) {
                    .nav-img-tablet { display: block;}
                    }

            @media (min-width: 10px) and (max-width: 767px) {
                    .nav-img-mobile { display: block;}
                    }


/*BODY*/

            .divTableCellB{
                    border-top: 0px solid #000000;
                    border-bottom: 0px solid #000000;
                    background-color: #f0eadf;
                  	height:768px;
                  	display: table-cell;
                  	padding: 3px 5px;
                    text-align:center;
                    margin: auto;
                    width: 100%;
                    color: black;}

            .promo {
                    flex: 1 0 0%;
                    padding: 25px 0px;
                    }

/*FOOTER*/

            .divTableCellF{
                    border: 0px solid #000000;
                    background-color: #d09b49;
                  	height:50px;
                    display: table-cell;
                    padding: 3px 20px;
                    text-align:center;
                    text-decoration:none;
                    margin: auto;
                    width: 100%;
                    color: black;
                    }

            .footer {
                    padding: 10px;
                    line-height: 10px;

                    text-align: center;
                    background: #d09b49;
                    color: black;
                    font-size: 12px;
                    font-family: "Dosis";
                    }

            .alignleft1 {
                    float: left;
                    width:50%;
                    text-align:left;
                    }

            .alignright1 {
                    float: left;
                    width:50%;
                    text-align:right;
                    }​


/* MISC */

            .container1 {
                    background-color: #ddd;
                    padding: 10px;
                    margin: 0 auto;
                    width:500px;
                    max-width: 600px;
                    display: table;
                    }

            .bottom2 > * {
                    vertical-align: bottom;
                    }

            .text-bottom > * {
                    vertical-align: text-bottom;
                    }


/* BUTTONS */


            .loadmorebtn {
                    background-color: #edb879;
                    display: table-cell;
                    margin: 10px 0;
                    padding: 10px;
                    width: 100%;
                    min-width:100%;
                    flex-grow:1;
                }

/* WEBSITE BUTTONS */

          .mainbtn {
                  background-color: #d09b49; /* background */
                  border: none; /* Remove borders */
                  color: black; /* White text */
                  padding: 15px 20px 0px 20px; /* Some padding */
                  font-size: 16px; /* Set a font size */
                  cursor: pointer; /* Mouse pointer on hover */
                  float: auto;
                  min-width: 50px;
                  }

          .mainbtn1 {
                  background-color: #d09b49; /* background */
                  border: none; /* Remove borders */
                  color: black; /* White text */
                  padding: 12px 16px; /* Some padding */
                  font-size: 16px; /* Set a font size */
                  cursor: pointer; /* Mouse pointer on hover */
                  }

          .mainbtn:hover {
                  background-color: RoyalBlue;
                  color: white; /* White text */
                  border-radius: 5px;
                  }

          .clickabovebtn {
                  background-color: #d09b49; /* background */
                  border: none; /* Remove borders */
                  color: black; /* White text */
                  padding: 12px 16px; /* Some padding */
                  font-size: 16px; /* Set a font size */
                  cursor: pointer; /* Mouse pointer on hover */
                  border-radius: 10px;
                  }

          .btn {
                  background-color: #f0eadf; /* background */
                  border: none; /* Remove borders */
                  color: black; /* White text */
                  padding: 12px 16px; /* Some padding */
                  font-size: 16px; /* Set a font size */
                  cursor: pointer; /* Mouse pointer on hover */
                  }

          .subbtn {
                  background-color: #d09b49; /* background */
                  border: none; /* Remove borders */
                  padding: 0px 0px; /* Some padding */
                  cursor: pointer; /* Mouse pointer on hover */
                  }

          .btn:hover {
                  background-color: RoyalBlue;
                  color: white; /* White text */
                  border-radius: 5px;
                  }

          .subbtn:hover {
                  background-color: none;
                  color: white;
                  border-radius: 5px;
                  }

.buttons {
  width: 100%;
  table-layout: fixed;
}

.buttons button {
  width: 100%;
}

.nav-img { display: none; text-align: center;
  width: auto;
  height:auto;
  position: relative;
  left: 50%;
  top:5px;
  transform: translate(-50%, -50%);

}

@media (min-width: 1025px){
    .nav-img-desktop { display: block; }
}

@media (min-width: 768px) and (max-width: 1024px){
    .nav-img-tablet { display: block;}
}

@media (min-width: 10px) and (max-width: 767px){
    .nav-img-mobile { display: block;}
}


.m_br {display:none}


@media (min-width: 320px) and (max-width: 767px){

  body {
     font-size: 0.9em;
  }

  a {
    font-size: .8em; /* Set a font size */
    text-decoration: none;
  }

    img {/* transform: scale(0.5, 0.5);
-ms-transform: scale(0.5, 0.5);
-webkit-transform: scale(0.5, 0.5); */
max-width: 95%;
padding:0px;
object-fit: scale-down;}

  img#hide {
    display: none;
        visibility: hidden;

  }

.hide {
          visibility: hidden;
    display: none;
max-height: 0;
  }

          .mainbtn {
            min-width: 70px;
      padding: 15px 10px 15px 10px;
                  }

}


@media (min-width: 1px) and (max-width: 319px){

  body {
     font-size: .9em;
  }

  a {
    font-size: .75em; /* Set a font size */
    text-decoration: none;
  }

  img {/* transform: scale(0.5, 0.5);
-ms-transform: scale(0.5, 0.5);
-webkit-transform: scale(0.5, 0.5); */
max-width: 100%;
padding:0px;
object-fit: scale-down;}

  img#hide {          visibility: hidden;

    display: none;
  }

.hide {
            visibility: hidden;
display:none; max-height: 0;}


.btn {font-size:12px;}


          .mainbtn {
                  min-width: 70px;
                  padding: 15px 10px 15px 10px;
                  }


    .m_br {
        display:block
    }


          .alignleft {
                  float: left;
                  width:20%;
                  text-align:right;
                  padding:0px;
                  }

          .aligncenter {
                  float: left;
                  width:60%;
                  text-align:center;
                  padding:0px;
                  }

          .alignright {
                  float: left;
                  width:20%;
                  text-align:left;
                  padding:0px;
                  }​

}


/* Create three equal columns that floats next to each other */
          .column {
                    display: none; /* Hide all elements by default */
                    padding: 10px;
                    min-width: 33%;
                  }


          /* The "show" class is added to the filtered elements */
          .show {
                    display: block;
                }

/* DivTable.com */
          .divTable {
                	display: table;
                	width: 100%;
                  text-decoration:none;
                  }

          .divTableRow {
                  display: table-row;
                  }

          .divTableHeading {
                  background-color: #EEE;
                  display: table-header-group;
                  }

          .divTableCell, .divTableHead {
                  border: 0px solid white;
                  display: table-cell;
                  padding: 3px 10px;
                  }

          .divTableCellSearch{
                  border-top: 2px solid #000000;
                  border-bottom: 1px solid #000000;
                  background-color: #f0eadf;
                  height:30px;
                  display: table-cell;
                  text-align:center;
                  margin: auto;
                  width: 100%;
                  color: black;
                  }

          .divTableCellMain{
                  border: 0px solid #000000;
                  background-color: #d09b49;
                  height:90px;
                  display: table-cell;
                  padding: 23px 20px;
                  text-align:center;
                  line-height: 58px;
                  margin: auto;
                  width: 100%;
                  color: black;
                  }

          .divTableCellN1{
                  border: 0px solid #000000;
                  background-color: #d09b49;
                  height:70px;
                  display: table-cell;
                /*  padding: 23px 20px; */
                  text-align:center;
                  margin: auto;
                  width: 100%;
                  color: black;
                  }

          .divTableCellN2{
                  border-top: 2px solid #000000;
                  border-bottom: 2px solid #000000;
                  background-color: #f0eadf;
                  height:54px;
                  display: table-cell;
                  padding: 3px 5px;
                  text-align:center;
                  margin: auto;
                  width: 100%;
                  color: black;}

          .divTableCellB{
                  border-top: 0px solid #000000;
                  border-bottom: 0px solid #000000;
                  background-color: #f0eadf;
                	height:768px;
                	display: table-cell;
                	padding: 3px 5px;
                  text-align:center;
                  margin: auto;
                  width: 100%;
                  color: black;}

          .divTableCellF{
                  border: 0px solid #000000;
                  background-color: #d09b49;
                	height:50px;
                  display: table-cell;
                  padding: 3px 10px;
                  text-align:center;
                  text-decoration:none;
                  margin: auto;
                  width: 100%;
                  color: black;
                  }

          .divTableHeading {
                	background-color: #EEE;
                	display: table-header-group;
                	font-weight: bold;
                  }

          .divTableFoot {
                  background-color: #EEE;
                  display: table-footer-group;
                  font-weight: bold;
                  }

          .divTableBody {
                  display: table-row-group;
                  }

          .textarea {
                  line-height: 45px;
                  text-align:center;
                  }




  1/*        .alignleft {
                  float: left;
                  width:30%;
                  text-align:right;
                  }

          .aligncenter {
                  float: center;
                  width:15%;
                  text-align:center;
                  }

          .alignright {
                  float: left;
                  width:30%;
                  text-align:left;
                  }​

/* FOOTER BAR */

          .alignleft1 {
                  float: left;
                  width:50%;
                  text-align:left;
                  }

          .alignright1 {
                  float: left;
                  width:50%;
                  text-align:right;
                  }​


/* PRODUCT SECTION */

          .card {
                  display: flex;
                  flex-direction: column;
                  border: 0px solid #CAD0D2;
                  border-radius: 0px;
                  overflow: hidden;
                  }

          .card__description {
                  display: flex;
                  flex-direction: column;
                  justify-content: center;
                  align-items: center;
                  padding: 20px 45px;
                  }

          .cardpic {
                  display: flex;
                  flex-direction: column;
                  justify-content: center;
                  align-items: center;
                  padding: 0px 0px;
                  }

          .card__descriptionIcon {
                  font-size: 32px;
                  margin-bottom: 10px;
                  }

          .card__descriptionText {
                  color: #57727C;
                  font-size: 12px;
                  text-align: center;
                  max-width: calc(100% - 30px);
                  padding-top: 30px;
                  }

          .cardtext {
                  color: #57727C;
                  font-size: 12px;
                  text-align: center;
                  max-width: calc(100% - 30px);
                  padding-top: 30px;
                  }

          .card__price {
                  text-align: center;
                  color: #57727C;
                  font-size: 12px;
                  font-weight: 700;
                  padding: 10px 0px;
                  }

          .card--fixedWidth {
                  max-width: 120px;
                  }


/* PRODUCT LIST USING FLEXBOX */

          .cardGroup {
                  display: flex;
                  flex-wrap: wrap;
                  justify-content: center;
                  margin: 0px auto;
                  max-width: 1100px;
                  }

          .cardGroup1 {
                  padding:20px;
                  margin: 20px auto;
                  border: 3px solid #d09b49;
                  border-radius: 15px;
                  text-align: center;
                  background-color: #F3E0A5;
                  overflow: hidden;
                  justify-content: center;

                  max-height: 100%;
                  max-width: 1000px;
                  }

          .cardGroup__card {
                  flex: 1 0 0%;
                  padding: 25px 0px;}

          .promo {
                  flex: 1 0 0%;
                  padding: 25px 0px;
                  }

          .cardGroup__card + .cardGroup__card {
                  border-left: 1px solid #D7DBDD;
                  }

          .cardGroup__cardDescription {
                  flex: 1 0 auto;
                  }