/* Стили для подложки */

.overlay {
   
   /* Скрываем подложку  */
   opacity: 0;
   visibility: hidden;
   
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, .5);
   z-index: 20;
   transition: .3s all;
}


/* Стили для модальных окон */

.modal {
   
   /* Скрываем окна  */
   opacity: 0;
   visibility: hidden;
   
   
   /*  Установаем ширину окна  */
   width: 100%;
   max-width: 420px;
   
   /*  Центрируем и задаем z-index */
   position: fixed;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   z-index: 99999; /* Должен быть выше чем у подложки*/
   
   /*  Побочные стили   */
   box-shadow: 0 3px 10px -.5px rgba(0, 0, 0, .2); 
   text-align: center;
   padding: 35px 15px;
   border-radius: 3px;
   background-color: #fff;
   transition: 0.3s all;
}


/* Стили для активных классов подложки и окна */

.modal.active,
.overlay.active{
   opacity: 1;
   visibility: visible;
}


/* Стили для кнопки закрытия */

.modal__cross {
   width: 35px;
   height: 35px;
   position: absolute;
   top: 20px;
   right: 10px;
   fill: #e10000;
   cursor: pointer;
}


/* Стили для кнопок. Мы ведь порядочные разработчики, негоже простые ссылки оставлять */

.js-open-modal {

}



.xyeguzedioltsz {
display: block;
margin: 0 auto 10px;
padding: 0 20px 0 62px;
width: 90%;
height: 62px;
border: 2px solid #d2d2d2;
border-radius: 5px;
font-family: 'Montserrat', sans-serif;
font-weight: 400;
font-size: 16px;
color: #555;
}
.xyeguzedioltsz[name="name"] {
    background: #f0f0f0 url("offer__name_icon77466.png") 22px center no-repeat;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.35);
    border-radius: 10px;
    font-size: 18px;
}
.xyeguzedioltsz[name="phone"] {
    margin: 0 auto 15px;
    background: #f0f0f0 url("offer__phone_icon9a33f.png") 20px center no-repeat;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.35);
    border-radius: 10px;
    font-size: 18px;
}