@media only screen and (max-width: 768px) {
  #desktop-content{
    display: none;
    visibility: hidden;
  }
  #mobile-content{
    position:fixed;
    left:0px;
    top:0px;
    overflow:scroll;
    width:100%;
    height:100%;
    z-index:1005;
  }
  #header{
    position: absolute;
    top:0px;
    left:0px;
    height:11%;
    width:100%;
    border-bottom: 2px solid #686868;
  }
  #logo{
    position: absolute;
    top:50%;
    left:5%;
    transform: translate(0%, -50%);
    height:90%;
  }
  #quote-label{
    position:absolute;
    top:50%;
    right:5%;
    transform: translate(0%, -50%);
    border-radius:1000px;
    padding:2vh;
    padding-left:6vw;
    padding-right:6vw;
    font-family: 'Varela Round', sans-serif;
    font-size:2.8vw;
    color: white;
    background:linear-gradient(90deg,#FF5500,#EBD510);
    font-weight: bold;
  }
  .label-icon{
    vertical-align: middle;
    width:3vw;
    height:3vw;
  }
  #main-menu{
    position:absolute;
    top:calc(11% + 2px);
    left:0px;
    width:100%;
    text-align: center;
  }
  .menu-item{
    font-size: 6vw;
    color:#FF5500;
    font-family: 'Montserrat', sans-serif;
    margin-top: 8vh;
  }
  .menu-item:hover{
    cursor: pointer;
    color: #FFAA00;
  }
  #sub-menu{
    position: fixed;
    right:0px;
    top:0px;
    z-index:1006;
    height:100%;
    width:100%;
    visibility: hidden;
    background:#DEDEDE;
    text-align: center;
  }
  #list-item{
    font-size: 6vw;
    color:#FF5500;
    font-family: 'Montserrat', sans-serif;
    margin-top:5vh;

  }
  #list-item:hover{
    cursor: pointer;
  }
  .x-button{
    position: absolute;
    top:4vw;
    right:4vw;
    width:7vw;
    height:7vw;
  }
  .x-button:hover{
    cursor: pointer;
  }
  #product-display-container-M{
    position: fixed;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    z-index:1008;
    visibility: hidden;
    background: white;
    overflow-y:scroll;
  }
  .main-images-container{
    margin-top: 4vh;
    left:4vw;
    width:calc(100% - 8vw);
    text-align: center;
  }
  .product-image{
    border-radius: 16px;
    box-shadow:0px 0px 10px 3px #BCBCBC;
    height:24vh;
    margin-right:2vw;
    margin-left: 2vw;
    margin-top:4vh;
  }
  .product-image:hover{
    cursor: pointer;
    box-shadow:0px 0px 16px 3px #787878;
  }
  .productHeader{
    width:100%;
    font-family:'Montserrat', sans-serif;
    font-size:5.4vh;
    color:#686868;
    margin-top:4vh;
    text-align: center;
    font-weight: bold;
  }
  .finishes-header{
    width:100%;
    font-family:'Montserrat', sans-serif;
    font-size:4vh;
    color:#464646;
    margin-top:6vh;
    text-align: center;
    border-bottom: 2px solid #D5D5D5;
    padding-bottom:2vh;
  }
  .finish-box{
    display: inline-block;
    margin-top:4vh;
    color:#686868;
    font-family:'Montserrat', sans-serif;
    font-size:2vw;
    text-align: center;
    width:16vw;
  }
  .finish-image{
    border-radius:1000px;
    width:8vw;
    height:8vw;
    box-shadow:0px 0px 7px 3px #BCBCBC;
  }
  .finish-image:hover{
    cursor:pointer;
    box-shadow:0px 0px 14px 3px #787878;
  }
  .technical-header{
    width:100%;
    font-family:'Montserrat', sans-serif;
    font-size:4vh;
    color:#484848;
    margin-top:6vh;
    text-align: center;
    border-bottom: 2px solid #D5D5D5;
    padding-bottom:2vh;
  }
  .technical-text{
    width:100%;
    font-family:'Montserrat', sans-serif;
    font-size:3vh;
    color:#484848;
    margin-top:2vh;
    text-align: center;
  }
  .dimensions-header{
    width:100%;
    font-family:'Montserrat', sans-serif;
    font-size:4vh;
    color:#484848;
    margin-top:6vh;
    text-align: center;
    border-bottom: 2px solid #D5D5D5;
    padding-bottom:2vh;
  }
  .dimension-images-container{
    padding-bottom:6vh;
    text-align: center;
  }
  .dimension-image{
    border-radius: 16px;
    box-shadow:0px 0px 10px 3px #BCBCBC;
    height:24vh;
    margin-right:2vw;
    margin-left: 2vw;
    margin-top:4vh;
  }
  .dimension-image:hover{
    cursor: pointer;
    box-shadow:0px 0px 16px 3px #787878;
  }
  a{
    text-decoration: none;
    color:inherit;
  }

}
@media only screen and (min-width: 768px) {
#mobile-content{
  display: none;
}
#header{
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:14%;
  background:white;
  overflow: hidden;
  z-index:4;
  border-bottom: 2px solid #989898;
}
#header-corner-gradient{
  position:absolute;
  top:0px;
  left:0px;
  height:calc(14% + 52px);
  z-index:3;
}
#logo{
  position:absolute;
  left:6%;
  top:4%;
  height:92%;
}
#label-container{
  position:absolute;
  top:50%;
  right:20px;
  transform: translate(0%, -50%);
}
#social-media-icons{

}
.social_media_footer_icons{
  width:32px;
  height:32px;
  margin-right:10px;
  vertical-align: middle;
}
#email-contact-label{
  border-radius:1000px;
  padding:10px;
  padding-left:20px;
  padding-right:20px;
  font-family: 'Varela Round', sans-serif;
  font-size:1.2vw;
  margin-right:120px;
  color: #989898;
  background:white;
  border:2px solid #989898;
}
#email-contact-label:hover{
  cursor:pointer;
  box-shadow: 0px 0px 10px 2px #ABABAB;
}
#phone-contact-label{
  border-radius:1000px;
  padding:10px;
  padding-left:20px;
  padding-right:20px;
  font-family: 'Varela Round', sans-serif;
  font-size:1.2vw;
  color: white;
  margin-right:42px;
  color: #989898;
  background:white;
  border:2px solid #989898;
}
#phone-contact-label:hover{
  cursor:pointer;
  box-shadow: 0px 0px 10px 2px #ABABAB;
}
#quote-label{
  border-radius:1000px;
  padding:10px;
  padding-left:20px;
  padding-right:20px;
  font-family: 'Varela Round', sans-serif;
  font-size:1.2vw;
  color: white;
  margin-right:42px;
  background:linear-gradient(90deg,#FF5500,#EBD510);
  font-weight: bold;
}
.label-icon{
  vertical-align: middle;
  width:22px;
  height:22px;
  margin-right:6px;
}
#range-container{
  position:absolute;
  top:calc(14% + 2px);
  height:calc(100% - 14% - 2px);
  border-right:2px solid #686868;
  width:20%;
  left:0px;
}
#range-header{
  width:100%;
  margin-top:4vh;
  text-align: center;
  font-family: 'Montserrat', sans-serif;
  font-size:4vh;
  color:#686868;
  font-weight: bold;
}
.range-item{
  margin-top:2vh;
  padding-top:2vh;
  padding-bottom:2vh;
  width:100%;
  text-align: center;
  font-family: 'Montserrat', sans-serif;
  font-size:2.5vh;
  color:#989898;
  background: white;
}
.range-item:hover{
  cursor: pointer;
  background:#F1F1F1;
}
#products-menu{
  position: absolute;
  top:50%;
  width:100%;
  left:0px;
  transform: translate(0%, -50%);
  text-align: center;
}
#list-item{
  margin-top:3vh;
  font-family: 'Montserrat', sans-serif;
  font-size:2.6vh;
  color:#FF5500;
  font-weight: bold;
}
#list-item:hover{
  cursor: pointer;
  opacity:0.6;
}
.range-item-selected{
  margin-top:2vh;
  padding-top:2vh;
  padding-bottom:2vh;
  width:100%;
  text-align: center;
  font-family: 'Montserrat', sans-serif;
  font-size:2.5vh;
  color:white;
  background: linear-gradient(90deg,#FF5500,#EBD510);
}
.range-item-selected:hover{
  cursor:pointer;
}
#products-container{
  position: absolute;
  top:calc(14% + 2px);
  left:calc(20% + 2px);
  height:calc(100% - 14% - 2px);
  background:#F1F1F1;
  width:20%;
  overflow-y:scroll;
  overflow-x: hidden;
}
#product-display-container{
  position:absolute;
  top:calc(14% + 2px);
  height:calc(100% - 14% - 2px);
  width:calc(100% - 40% - 2px);
  right:0px;
  overflow-y:scroll;
  overflow-x:hidden;
  text-align:center;
}


.main-images-container{
  margin-top: 4vh;
  left:4vw;
  width:calc(100% - 8vw);

}
.product-image{
  border-radius: 16px;
  box-shadow:0px 0px 10px 3px #BCBCBC;
  height:24vh;
  margin-right:2vw;
  margin-left: 2vw;
  margin-top:4vh;
}
.product-image:hover{
  cursor: pointer;
  box-shadow:0px 0px 16px 3px #787878;
}
.productHeader{
  width:100%;
  font-family:'Montserrat', sans-serif;
  font-size:5.4vh;
  color:#686868;
  margin-top:4vh;
  text-align: center;
  font-weight: bold;
}
.finishes-header{
  width:100%;
  font-family:'Montserrat', sans-serif;
  font-size:4vh;
  color:#464646;
  margin-top:6vh;
  text-align: center;
  border-bottom: 2px solid #D5D5D5;
  padding-bottom:2vh;
}
.finish-box{
  display: inline-block;
  margin-top:4vh;
  color:#686868;
  font-family:'Montserrat', sans-serif;
  font-size:0.8vw;
  text-align: center;
  width:7.5vw;
}
.finish-image{
  border-radius:1000px;
  width:4.4vw;
  height:4.4vw;
  box-shadow:0px 0px 7px 3px #BCBCBC;
}
.finish-image:hover{
  cursor:pointer;
  box-shadow:0px 0px 14px 3px #787878;
}
.technical-header{
  width:100%;
  font-family:'Montserrat', sans-serif;
  font-size:4vh;
  color:#484848;
  margin-top:6vh;
  text-align: center;
  border-bottom: 2px solid #D5D5D5;
  padding-bottom:2vh;
}
.technical-text{
  width:100%;
  font-family:'Montserrat', sans-serif;
  font-size:3vh;
  color:#484848;
  margin-top:2vh;
  text-align: center;
}
.dimensions-header{
  width:100%;
  font-family:'Montserrat', sans-serif;
  font-size:4vh;
  color:#484848;
  margin-top:6vh;
  text-align: center;
  border-bottom: 2px solid #D5D5D5;
  padding-bottom:2vh;
}
.dimension-images-container{
  padding-bottom:6vh;
}
.dimension-image{
  border-radius: 16px;
  box-shadow:0px 0px 10px 3px #BCBCBC;
  height:24vh;
  margin-right:2vw;
  margin-left: 2vw;
  margin-top:4vh;
}
.dimension-image:hover{
  cursor: pointer;
  box-shadow:0px 0px 16px 3px #787878;
}
#cover-bg{
  opacity:0.8;
  background: #484848;
  position: fixed;
  left:0px;
  top:0px;
  width:100%;
  height:100%;
  visibility:hidden;
  z-index:2000;
}
#large-image-container{
  position:absolute;
  top:50%;
  left:50%;
  background: white;
  transform: translate(-50%, -50%);
  border-radius:18px;
}
#large-image{
  position:absolute;
  top:50%;
  left:50%;
  background: white;
  transform: translate(-50%, -50%);
  border-radius: 18px;
  opacity:1.0;
  z-index: 2001;
}
a{
  text-decoration: none;
  color: inherit;
}
#no-product-container{
  position: absolute;
  top:50%;
  left:50%;
  text-align: center;
  transform: translate(-50%, -50%);
}
#no-product-image{
  border:3px solid #686868;
  border-radius:1000px;
  width:7vw;
  height:7vw;
  padding:1vw;
}
#no-product-text{
  font-family:'Montserrat', sans-serif;
  font-size:5vh;
  color:#686868;
  text-align: center;
  margin-top:3vh;
}
}