* {-webkit-font-smoothing: antialiased;}

@font-face {
    font-family: 'Montserrat-Regular';
    src: url("./fonts/montserrat/Montserrat-Regular.ttf") format("truetype");
}

@font-face {
    font-family: 'Montserrat-Bold';
    src: url("./fonts/montserratbold/Montserrat-Bold.ttf") format("truetype");
    
}

@font-face {
    font-family: 'Montserrat-ExtraLight';
    src: url("./fonts/montserratextralight/Montserrat-ExtraLight.ttf") format("truetype");
}

@font-face {
    font-family: 'Montserrat-Light';
    src: url("./fonts/montserratlight/Montserrat-Light.ttf") format("truetype");
}

.container-feature-products{
    width: 100%; 
    padding-top: 50px; 
    padding-bottom: 50px; 
    padding-right: 0; 
    padding-left: 85px;
}

.select-perry{
    margin-right: 20px;
    height: 45px;
    width: 30vw;
    padding: 10px;
    border-radius: 5px;
    border-color: #CCCCCC;
    border: 1px solid;
    font-family: 'Georgia';
    -webkit-appearance: none;
    -moz-appearance: none;
    background: transparent;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABmJLR0QA/wD/AP+gvaeTAAABoElEQVRIie2SP2gTYRiHn/fjQrF2EmlLAkU6F0QqOOQscVDB6/UPIRGEjB1dOzhlKA7qpmNBKA4BRTTSTh36Hx1KlyxZC70kIpZCwdLG73W5M6c1rS0ODnmW777fve/z4+CgQ4f/HokeAv9mVtD7Ro4e9pU/Nc4ja4zd6LOaeK5WS8n59bcAJnpp0DsoObWJzeBe+vqZ5aPuVfvd+YiSM0butrwhamkCKKTEyHLNT+f/Vl7z03kLG4hcAVDl6FgBCecpUAlv3aiU6p47o8XYzG9oEVP33BlUSkB3GFdwnGfRjMQXPucyPfZbc05hspXKQtdB14NLi4t755n9pQBAQeqeO43wOPaFVWt0PFVerwI0PHfQCu+BoZ9rwpP+4bVHUsTGfccKImqem0N4CVwMo6+C5K3aQxF5A/SG+YGqTCXnV1/9ydO2AGBnbOSasfYdMBBGzfB0wnPbGjORKq9stXOcWAAQ+JnLos3XQCaeK2w41sn2LizVT9pv+4dEJD8sfenfd26DvGjJdXb3wu6t0+RnJvDdQuC7hX8q7dDhVH4ACEaQrVsngWoAAAAASUVORK5CYII=);
    background-repeat: no-repeat;
    background-position-x: 96%;
    background-position-y: 50%;
    background-size: 15px;
    border: 1px solid #dfdfdf;
    border-radius: 2px;
    padding: 0px 15px;
    font-size: 18px;
}

.div-info-products{
    padding-top: 10px;
    padding-bottom: 30px;
    height: 100px;
}

.gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]){
    border-radius: 5px;
}

.ginput_container_select select{
    border: solid 1px #ccc;
    font-size: inherit;
    font-family: inherit;
    letter-spacing: normal;
    padding: 9px;
    border-radius: 4px;
}

.address_city label, .address_line_2 label, .address_line_1 label, .address_zip label{
    font-family: 'Montserrat-Regular', sans-serif;
}

.gform_wrapper .top_label .gfield_label{
	font-size: 12px;
    font-family: 'Montserrat-Regular', sans-serif;
}

.gallery-slider{
    border-radius: 0!important;
}

.product-img{
    box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.08);
}

.slider-img{
    box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.08);
}

.container-img-product:hover {
    border-bottom: 4px solid #ff5454;
}

.product-title{
    font-family: 'Georgia'; 
    font-size: 16px; 
    line-height: 24px; 
    color:black;
}

.product-category{
    font-family: 'Montserrat-Regular';
    font-size: 12px;
    color: #B4B4B4;
}



h1{
    font-family: 'Montserrat-ExtraLight' !important;
    font-size: 48px !important;
    line-height: 60px !important;
        font-weight: normal;
    color: black !important;
    margin-bottom: 40px !important;
}

h2{
    font-family: 'Montserrat-ExtraLight' !important;
    font-size: 36px !important;
    line-height: 48px !important;
        font-weight: normal;
    color: black !important;
    margin-bottom: 40px !important;
}

h3{
    font-family: 'Montserrat-Light' !important;
    font-size: 24px !important;
    line-height: 36px !important;
        font-weight: normal;
    color: black !important;
    font-weight: normal;
    margin-bottom: 40px !important;
}

h4{
    font-family: 'Montserrat-Light'!important;
    font-size: 20px !important;
    line-height: 36px !important;
        font-weight: normal;
    color: black !important;
    margin-bottom: 40px !important;
}

h5{
    font-family: 'Montserrat-Regular' !important;
    font-size: 14px !important;
    line-height: 24px !important;
    letter-spacing: 2px !important;
        font-weight: normal;
    color: black !important;
    margin-bottom: 20px !important;
}

h6{
    font-family: 'Montserrat-Regular' !important;
    font-size: 12px !important;
    line-height: 20px !important;
    letter-spacing: 2px !important;
    font-weight: 500;
    color: black !important;
    margin-bottom: 20px !important;
}
p{
    font-family: 'Georgia' !important;
    font-size: 16px !important;
    line-height: 30px !important;
    color: #666666;
}

.info-product{
    color:#666666;
    font-family: "Georgia", Sans-serif;
    font-size: 16px;
    font-weight: normal;
}

.category-product{
    font-family: 'Montserrat-Regular' !important;
    text-transform: uppercase;
    color: #CCCCCC;
    font-size: 12px;
    font-weight: 500;
}

.link-perry{
    color: #000000 !important;
    font-family: "Montserrat-Regular", Sans-serif;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    line-height: 0em;
    letter-spacing: 1px;
    border-style: solid;
    border-width: 0px 0px 2px 0px;
    border-color: #FF3333; 
    padding-bottom: 6px;
}

.link-perry:hover{
    text-decoration: none;
    color: black !important;
}

.container-links{
    padding-top: 30px;
}

.container-product-detail{
    box-shadow: 0px 4px 12px 0px rgba(0,0,0, 0.08);
}
.swiper-scrollbar-drag {
background: #FF5454 !important;
}

.finish-name{
    font-size: 16px;
    font-family: 'Georgia';
    font-weight: 600;
}

.finish-category{
    font-weight: 600;
    font-family: 'Montserrat-Regular';
    font-size: 13px;
}

.container-info-finish{
    padding-top: 20px;
    padding-bottom: 30px;
}

 .swiper-container {
      width: 100%;
      height: 100%;
    }

    .swiper-slide {
      max-width:100%;
    height:auto;
    position: relative;
    display:block;
    margin:0 auto;
    padding-right: 15px;
    padding-left: 15px;
    }
    
.row-gallery {
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -ms-flex-wrap: wrap; /* IE10 */
  flex-wrap: wrap;
  padding: 0 4px;
}

/* Create four equal columns that sits next to each other */
.column-gallery {
  -ms-flex: 25%; /* IE10 */
  flex: 50%;
  max-width: 50%;
  padding: 0 4px;
}

.column-gallery img {
  margin-top: 8px;
  vertical-align: middle;
  width: 100%;
  cursor: pointer;
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
  .column-gallery {
    -ms-flex: 50%;
    flex: 50%;
    max-width: 50%;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .column-gallery {
    -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
  }
}

<!-- Modal -->
.img-gallery:hover {
    opacity: 0.7;
    
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 200; /* Sit on top */
  padding-top: 50px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

/* Modal Content (image) */
.modal-content {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 250px;
}

/* Caption of Modal Image */
#caption {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
  text-align: center;
  padding: 5px 0;
}

/* Add Animation */
.modal-content, #caption {  
  -webkit-animation-name: zoom;
  -webkit-animation-duration: 0.6s;
  animation-name: zoom;
  animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
  from {-webkit-transform:scale(0)} 
  to {-webkit-transform:scale(1)}
}

@keyframes zoom {
  from {transform:scale(0)} 
  to {transform:scale(1)}
}

/* The Close Button */
.close {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s;
}

.close:hover,
.close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
  .modal-content {
    width: 100%;
  }
}

.title-gallery-product{
    color: gray;
}

.field-gallery-product{
    font-family: 'Georgia';
    font-size: 15px;
    color: white !important;
}

    .menu-footer-two{
       margin: 0;
       list-style-type: none;
    }
    
    .menu-footer{
       margin: 0;
       list-style-type: none;
    }
    .sub-menu{
        list-style-type: none;
        padding: 0;
    }
    .menu-item a:hover{
        text-decoration: none;
        border-bottom: 1px solid red;
    }
    .sub-menu-item a:hover{
        text-decoration: none;
        border-bottom: 1px solid red;
    }
    
    .form-newsletter {
  /* This bit sets up the horizontal layout */
  display:flex;
  flex-direction:row;
  
  /* This bit draws the box around it */
  border:1px solid grey;

  /* I've used padding so you can see the edges of the elements. */
      border: 1px solid #dcd7ca;
    box-shadow: 0px 2px 5px 0px rgba(232,227,232,1);
    background-color: white;
}


#input-newsletter:focus {
  /* removing the input focus blue box. Put this on the form if you like. */
  outline: none !important;
}

#input-newsletter{
    background: #fff;
    border-radius: 0;
    border-style: solid;
    border-width: 0.1rem;
    box-shadow: none;
    display: block;
    font-size: 1.6rem;
    letter-spacing: -0.015em;
    margin: 0;
    max-width: 100%;
    padding: 14px 1.8rem;
    
}

.btn-newsletter {
  border-bottom: 2px solid #ff5454 !important;
  cursor: pointer;
  display: block;
  margin: auto;
  margin-right: 15px;
  font-size: 15px;
  font-family: 'Montserrat-Regular';
  font-weight: 600;
}

.container-info-news{
    height: 500px; 
    box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.08);
}

.container-img-news{
    height: 500px; 
}

.category-post{
    text-transform: uppercase; 
    font-weight: 600; 
    letter-spacing: 1px !important; 
    margin-bottom: 10px !important;
}

.img-article{
    max-width: 100%; 
    max-height: 100%;
    height: 100%;
    width: 100%;
}

.copyrigth-text{
    font-size: 12px;
    line-height: 20px;
    color: #999;
}

#um-submit-btn{
	background-color: #ff5454;
	width: 100% !important;
}

#um-submit-btn:hover{
	background-color: #ff5454;
}

.um {
    margin-top: 60px;
}

a{
    color: #FF3333 !important;
}
a:hover{
    color: #ff3333 !important;
}

.contact-form .row{
    background: white;
    box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.08);
}

.showroominfo{
    margin:auto !important;
    max-width: 800px;
}

.gform_wrapper form {
    font-family: 'Georgia';
}

.gform_button{
    color: #FF3333;
}

.privacy-text{
    font-size: 12px;
    color: #999;
    line-height: 20px;
}

.width-slider{
    width: 310px !important;
}

.details-mobile{
      display: none;
  }
  
 .um-left .um-button {
     background-color: #ff5454 !important;
}

.showroom-img{
    width: auto;
    height: 250px;
    margin-bottom: 10px;
}
  
@media (max-width: 985px) {  
  .megamenu-container{
      display: none !important;
  }
  
  .menu-movil{
      display:block;
  }
  
   .icon-login{
      display: none;
  }
  
  .icon-menu-movil{
      display:block !important;
      cursor: pointer;
  }
}

@media (max-width: 768px) {
    
    .container-selects-showrooms{
      padding-left: 20px;
      padding-right: 20px;  
    }
    
    .teaser-mobil{
      display:block !important;
    }
    
    .teaser-desktop{
      display: none;
    }
    
    .clear-search{
            margin-right: 10px;
    }
    
    .container-select-catalog{
        padding-right: 6px;
        padding-left: 15px;
    }
    
    .row-products{
        margin: 0 !important;
    }
    
    .container-feature-products{
        padding-left: 0px;
    }
    
    .select-perry{
       display: block;
       width: 100%;
       margin-bottom: 20px;
    }
    
    .container-privacy{
        text-align: center;
    }
    
    .container-newslettter{
        margin-top: 50px;
        text-align: center;

    }
    .menu-footer-two{
        padding: 0;
        text-align: center;
    }
    
    .menu-footer{
        padding: 0;
        text-align: center;
        margin-bottom: 60px !important;
    }
    
  .contact-footer, .follow-footer{
      text-align: center;
      margin-bottom: 60px;
  }
  
  .div-info-products{
      text-align: center;
  }
  
  .showroominfo{
    padding-left: 20px;
    padding-right: 20px; 
}

  .product-img{
    width:150px !important;
    height: 150px !important;
}

h1{
    font-size: 36px !important;
    line-height: 48px !important;
}

h2{
    font-size: 36px !important;
    line-height: 48px !important;
}

h3{
    font-size: 20px !important;
    line-height: 30px !important;
}

h4{
    font-size: 20px !important;
    line-height: 36px !important;
}

h5{
    font-size: 14px !important;
    line-height: 24px !important;
    letter-spacing: 2px !important;
}

h6{
    font-family: 'Montserrat-Regular' !important;
    font-size: 12px !important;
    line-height: 20px !important;
    letter-spacing: 2px !important;
}

p{
    font-family: 'Georgia' !important;
    font-size: 16px !important;
    line-height: 30px !important;
    color: #666666;
}
  
}

@media (max-width: 330px) {
  .member-title{
      width:330px !important;
  }
  
}

@media (max-width: 1024px) {
    
  .clear-search{
      margin-right: 20px;
  }
  
  .details-desktop{
      display:none;
  }
  
  .details-mobile{
      display: block;
  }
  
  .container-newslettter{
      text-align:center;
      margin-bottom: 20px !important;
  }
  .contact-footer{
      text-align:center;
      margin-bottom: 20px;
  }
  .follow-footer{
      text-align:center;
  }
  .container-privacy{
      text-align:center;
  }
  .menu-footer{
      text-align:center;
  }
  .menu-footer-two{
      text-align:center;
  }
  .form-newsletter{
    max-width: 600px;
    margin: auto;
    margin-bottom: 20px;
  }
}