/*RESPONSIVENESS==========================================================*/



@media screen and (min-width: 1600px) {


.container {
  margin-left: max(20px, 18%);
  margin-right: max(20px, 18%);
}

.content {
    min-width: 1000px;
    max-width: 1800px;
}

#productDiv img {
/*  max-width: 800px;*/
}

.product_display {
   min-width: 480px;
   max-width: 900px;
}


}



@media screen and (min-height: 1080px) {
  .intro_content {
    min-height: 800px;
  }


  #productDiv {
  min-height: 600px;
}

}



@media screen and (min-height: 1000px) {
  .intro_content {
    min-height: 780px;
  }

#productDiv {
/*  min-height: 560px;*/
}



}


@media screen and (min-width: 1400px) and (max-width: 1599px) {


.container {
  margin-left: max(20px, 17%);
  margin-right: max(20px, 17%);
}

#productDiv img {
/*  max-width: 660px;*/
  object-fit: fill;
}

}

@media screen and (min-width: 1200px) and (max-width: 1399px) {

.content {
/*    min-width: 1000px;*/
    min-width: 940px;
}

.container {
  margin-left: max(20px, 15%);
  margin-right: max(20px, 15%);
}


#productDiv {
}

#productDiv img {
 /* max-width: 600px;*/
  object-fit: fill;
}

.product_display {
   /*min-width: 480px;*/
   max-width: 700px;
}


}



@media screen and (min-width: 1100px) and (max-width: 1199px) {


.content {
    min-width: 900px;
}


.container {
  margin-left: 10%;
  margin-right: 10%;
}

.productItem, .productItem img {
  --product_thumb_width: calc(var(--product_base_width) - 4px);
}


}



@media screen and (min-width: 1000px) and (max-width: 1099px) {


.content {
    min-width: 870px;
}


.container {
  margin-left: 9%;
  margin-right: 9%;
}



.productItem, .productItem img {
  --product_thumb_width: calc(var(--product_base_width) - 6px);
}

}




@media screen and (max-width: 1199px) {

.body {
  /*background-color: red;*/
  min-width: 660px;
/*max-width: 800px !important;*/
}


.intro_content {
    min-width: 560px;
}



}


@media screen and (max-width: 1100px) {

          .body {
            /*background-color: red;*/
            /*min-width: 700px;*/
          /*max-width: 800px !important;*/
          }

          .content {
            /*
              min-width: 850px;*/
          }

          .intro_content {
              min-width: 500px;
          }


          #productDiv img {
/*            max-width: 440px;*/
            object-fit: fill;
          }


          .product_display {
             /*min-width: 400px;*/
          }




          }


    @media screen and (min-height: 900px) {
            .intro_content {
              min-height: 700px;
            }

      }


    @media screen and (min-height: 800px) {
          .intro_content {
              min-height: 650px;
            }

}



@media screen and (min-width: 900px) and (max-width: 999px) {

.container {
  margin-left: 7%;
  margin-right: 7%;
}

  .content {
/*min-width: 720px;*/
}


.productItem, .productItem img {
  --product_thumb_width: calc(var(--product_base_width) - 12px);
}


}


@media screen and (min-width: 800px) and (max-width: 899px) {


.container {
  margin-left: 6%;
  margin-right: 6%;
}


  .content {
min-width: 680px;
}


.productItem, .productItem img {
  --product_thumb_width: calc(var(--product_base_width) - 14px);
}



}



@media screen and (max-width: 1000px) {
/*800px to 1000px*/


.productItem {
  padding-left: 0px;
}

.product_feature {
  margin-right: calc(var(--padding_std) + 4px);
}


}


@media screen and (max-width: 860px) and (min-width: 801px) {


.product_display, .intro_content {
/*   min-width: 400px;*/
    --padding_std: 9px;
}


/*#productDiv {
  padding-right: calc(var(--padding_std) - 5px);
}
*/

.productItem, .productItem img {
  --product_thumb_width: calc(var(--product_base_width) - 15px);
}


aside {
/*    --padding_std: 9px;*/
      padding-left: 3px !important;
}

.nav li a {
margin-inline: 4px;
padding-inline: 24px;
font-size: 0.85em;
}

#productDiv img {
   max-width: 390px;
  object-fit: fill;
}


}


@media screen and (max-width: 800px) and (min-width: 761px) {


  .intro_content {
  --padding_std: 8px;
/*    max-width: 640px;*/
/*    max-width: 680px;*/
}


.productItem, .productItem img {
  --product_thumb_width: calc(var(--product_base_width) - 18px);
  border-left: 0px !important;
}

#productDiv img {
   max-width: 370px;
  object-fit: fill;
}

}


@media screen and (max-width: 760px) {


.intro_content {
    max-width: 600px;
  --padding_std: 8px;
}

.product_display {
   min-width: 370px;
}




#productDiv img {
/*  max-width: 520px;*/
  object-fit: fill;
}


.productItem, .productItem img {
  --product_thumb_width: max(16vw, calc(var(--product_base_width) - 30px));
/*  --product_thumb_width: calc(var(--product_base_width) - 8px);*/
  --padding_std: 9px;
  padding-bottom: 0px !important;
  position: relative;
  top: -20px;
  z-index: -2;
/*--product_thumb_width: 160px;*/
}

p.productPreviewText {
  margin-block-start: 0.2em !important;
  position: relative;
  top: -20px;
  z-index: -1;
}


.innerProductCol {
  /*display: inline-block;*/
  grid-template-columns: 3fr .2fr;
  /*grid-template-columns: 1.4fr .2fr .2fr;*/
  grid-template-areas:
      "main rs"
      "main rs2"
   ;
   column-gap: 0.1em;
   /*column-gap: 1em 0.5em;*/
  /*grid-template-columns: 200px 1fr 200px;*/
  /*padding-right: 6%;*/
  /*      "ls2 main2 rs2"*/
}


aside {
    --padding_std: 8px;
      padding-left: 0px !important;
}


aside:first-of-type {
   grid-area: rs;
   /*display:inline-block;*/
}

aside:last-of-type {
   grid-area: rs2;
  position: relative;
  top: -40px;
  z-index: -3;
   /*display:inline-block;*/
}


}



@media screen and (max-width: 720px) {


  .productItem, .productItem img {
/*    --product_thumb_width: max(16vw, calc(var(--product_base_width) - 30px));*/
  /*--product_thumb_width: calc(var(--product_base_width) - 10px);*/
}

}



@media screen and (max-width: 640px) {

.body {
  /*background-color: red;*/
  min-width: 400px;
/*max-width: 800px !important;*/
}

p {
  max-width: 480px;
}


.intro_content {
    max-width: 520px;
padding-inline:18px;
  --padding_std: 5px;
}

.nav li a {
margin-inline: 3px;
padding-inline: 20px;
font-size: 0.84em;
}

.logo img {
  width: 560px;
  height: auto;
}


.productItem, .productItem img {
  --product_thumb_width: calc(var(--product_base_width) - 15px);
}

}



@media screen and (max-width: 600px) {

.body {
  min-width: 340px;
  max-width: 580px;
}

p {
  max-width: 440px;
}


.intro_content {
    max-width: 460px;
padding-inline:20px;
  --padding_std: 4px;
}

.nav li a {
margin-inline: 2px;
padding-inline: 16px;
font-size: 0.8em;
}

.logo img {
  width: 520px;
  height: auto;
    padding-bottom: 0px;
}

.innerProductCol {
  grid-template-areas:
      "ls rs"
   ;
  }

aside:last-of-type {
   grid-area: rs;
}


.productItem, .productItem img {
  --product_thumb_width: calc(var(--product_base_width) - 12px);
}


}


@media screen and (max-width: 560px) {

.body {
  min-width: 320px;
  max-width: 540px;
}

p {
  max-width: 400px;
}


.intro_content {
    max-width: 400px;
padding-inline:22px;
}

.logo img {
  width: 440px;
  height: auto;
    padding-bottom: 0px;
}

.nav li a {
margin-inline: 1px;
padding-inline: 8px;
font-size: 0.75em;
}

.productItem, .productItem img {
  --product_thumb_width: calc(var(--product_base_width) - 14px);
}



}



@media screen and (max-width: 520px) {

.body {
  min-width: 300px;
  max-width: 480px;
}

p {
  max-width: 360px;
}


.intro_content {
    max-width: 400px;
padding-inline:22px;
}

.logo img {
  width: 440px;
  height: auto;
    padding-bottom: 0px;
}

.nav li a {
margin-inline: 1px;
padding-inline: 6px;
font-size: 0.75em;
}


}




@media screen and (max-width: 480px) {

body {
     font-size: 11pt !important;
  }

.body {
  min-width: 260px;
     font-size: 11pt !important;
}

p {
  max-width: 340px;
       font-size: 11pt !important;
}


.intro_content {
    max-width: 380px;
padding-inline: 8px;
}


.logo img {
  width: 400px;
  height: auto;
  padding-bottom: 0px;
}

.nav li a {
margin-inline: 1px;
padding-inline: 8px;
font-size: 0.74em;
}



}


@media screen and (max-width: 400px) {

.body {
  min-width: 220px;
}

p {
  max-width: 320px;
}


.intro_content {
    max-width: 340px;
padding-inline: 4px;
}


.logo img {
  width: 360px;
  height: auto;
  padding-bottom: 0px;
}

.nav li a {
margin-inline: 1px;
padding-inline: 6px;
font-size: 0.72em;
}



}

@media screen and (max-width: 360px) {


  body {
         font-size: 10pt !important;
  }


.body {
  min-width: 200px;
     font-size: 10pt !important;
}

p {
  max-width: 280px;
}


.intro_content {
    max-width: 300px;
padding-inline: 4px;
}


.logo img {
  width: 330px;
  height: auto;
  padding-bottom: 0px;
}

.nav li a {
margin-inline: 1px;
padding-inline: 5px;
/*font-size: 0.66em;*/
}



}