/*кнопки вызова "задавать вопросы на почту или telegram", из go_feedback*/
.btn_send_voprosi {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    width: 52px;
}

.btn_send_voprosi button
 {  display: flex;
    flex-wrap: nowrap;
    justify-content: space-around;
    align-items: center;/*  */
    border:2px solid #78788c;
    border-radius:5px;
    width: 170px;
    height: 45px;
    background: #D8D8E4;
    color: #0054a8;
    font-weight: bold;
}


.btn_send_voprosi button, .btn_send_voprosi button span:hover
{
    /*background:#78788c;*/
    color:#fff;
    border-radius:8px;
    font-weight: bold;
    }

.btn_send_voprosi button span
 {  color: #0054a8;
    font-weight: bold;


}
@media screen and (min-width:200px) and (max-width:430px) {
.btn_send_voprosi {
    display: flex;
    flex-direction: column;

}
}

@media screen and (min-width:200px) and (max-width:380px) {
#modal-form-voprosi p, .form-control,
#modal-form-voprosi input[type="text"],
#modal-form-voprosi input[type="email"],
{  width:195px;
}

}

/*End кнопки вызова "задавать вопросы на почту или telegram", из go_feedback*/

/*Стили формы Акция с 15 по 15*/

/*кнопка вызова формы для оформления акционного заказа*/
.btn_zacaz_form {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 170px;
    height: 39px;
}
.btn_zacaz
 {  border:2px solid #78788c;
    border-radius:5px;
    width: 170px;
    height: 39px;
    background: #D8D8E4;
    color: #0054a8;
    font-weight: bold;
}
.btn_zacaz:hover
 { border-radius:8px;
}
/* END кнопка кнопка вызова формы для оформления акционного заказа*/
/* ------------------------------------------------------------------------------------------ */

#modal_form h2{
    margin:10px 0;
    padding-bottom:10px;
    width:320px;
    color:#78788c;
    border-bottom:3px solid #78788c;
    text-align: center
}

/* Окно */
#modal_form {
    box-shadow:0 0 40px -10px #000;
    font-family:'Montserrat',sans-serif;
    width: 340px;
    height: 440px; /* Размеры должны быть фиксированы */
    border-radius: 8px;
    /*background:#e6e6e6;*/
    background-color: #ebf3f3;
    position: fixed; /* чтобы окно было в видимой зоне в любом месте */
    top: 35%; /* отступаем сверху 45%, остальные 5% подвинет скрипт */
    left: 50%; /* половина экрана слева */
    margin-top: -220px;
    margin-left: -170px; /* тут вся магия центровки css, отступаем влево и вверх минус половину ширины и высоты соответственно =) */
    display: none; /* в обычном состоянии окна не должно быть */
    opacity: 0; /* полностью прозрачно для анимирования */
    z-index: 5; /* окно должно быть наиболее большем слое */
    padding: 20px 30px
}
#modal_form input,
#modal_form select
{
    width:95%;
    padding:10px;
    box-sizing:border-box;
    background:#F9FBFB;
    outline:none;
    font-family:'Montserrat', sans-serif;
    border: 5px solid #e2eded;
    border-radius: 5px;
}
#modal_form select{
   -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none; /*height: 49px;*/
    padding-right: 1.2em;
    background-repeat: no-repeat;
    background-position: calc(100% - 0.25em) 0.35em;
    background-size: 1.0em auto;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='https://www.w3.org/2000/svg' viewBox='0 0 320 512'%3e%3cpath fill='%23000000' d='M143 352.3L7 216.3c-9.4-9.4-9.4-24.6 0-33.9l22.6-22.6c9.4-9.4 24.6-9.4 33.9 0l96.4 96.4 96.4-96.4c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9l-136 136c-9.2 9.4-24.4 9.4-33.8 0z'/%3e%3c/svg%3e");
}
/* скроет иконку стрелки в IE */
#modal_form select::-ms-expand {
  display: none;
}

#modal_form input:focus{
    border-bottom:2px solid #78788c}
#modal_form p{
    text-align: left
}
#modal_form p:before{
    content:attr(type);
    display:block;
    margin:28px 0 0;
    font-size:14px;
    color:#5a5a5a
}
#poluchatel{
    content:'Hi';
    position:absolute;
    bottom:5px;   /*-15*/
    right:-20px;
    width:439px;
    background:#50505a;
    color:#fff;
    padding:4px 4px 16px 0;
    border-radius:6px;
    font-size:13px;
    box-shadow:10px 10px 40px -14px #000
}
#poluchatel span{margin:5px 15px}


.btn_send_zacaz{
    border:2px solid #78788c;
    border-radius:5px;
    width: 170px;
    height: 39px;
    background: #D8D8E4;
    color: #0054a8;
    font-weight: bold;
    padding:8px 12px;
    margin:8px 0 0;
    font-family:'Montserrat',sans-serif;
    cursor:pointer;
    transition:all .3s
}
.btn_send_zacaz:hover
{ border-radius:8px;

}


/* Кнопка закрыть для тех кто в танке) */
#modal_form #modal_close {
    width: 21px;
    height: 21px;
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    display: block;
     color: #78788c;
}

#modal_form #modal_close:hover {
    color: #5a5a6e
}
/* Подложка */
#overlay {
    z-index: 3; /* подложка должна быть выше слоев элементов сайта, но ниже слоя модального окна */
    position: fixed; /* всегда перекрывает весь сайт */
    background-color: #78788c; /* серая */
    opacity: 0.8; /* но немного прозрачна */
    width: 100%;
    height: 100%; /* размером во весь экран */
    top: 0;
    left: 0; /* сверху и слева 0, обязательные свойства! */
    cursor: pointer;
    display: none; /* в обычном состоянии её нет) */
}
button{
    float:right;
    padding:8px 12px;
    margin:8px 0 0;
    font-family:'Montserrat',sans-serif;
    border:2px solid #78788c;
    background:0;
    color:#5a5a6e;
    cursor:pointer;
    transition:all .3s}
button:hover{
    background:#78788c;
    color:#fff
}


@media screen and (min-width:280px) and (max-width:500px) {
#modal_form, #modal_form h2,
#modal_form select, #poluchatel{
    width:280px;

}
#poluchatel{
    width: 380px;
}
}
/*END Стили формы Акция с 15 по 15*/

/* ************************************************************************************************ */
 /* Стили формы вопросы с сайта на почту */
/* Окно */
 #modal-form-voprosi
 {  place-items: center;
    position: fixed;    /* чтобы окно было в видимой зоне в любом месте */
    height:500px;   /* Размеры должны быть фиксированы */
    width:640px;
    margin-top: -250px;
    margin-left: -320px; /* тут вся магия центровки css, отступаем влево и вверх минус половину ширины и высоты соответственно =) */
    top: 45%; /* отступаем сверху 45%, остальные 5% подвинет скрипт */
    left: 50%; /* половина экрана слева */
    background:#CCE4FC;           /* #e6e6e6 */
    border-radius:12px;
    box-sizing:border-box;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size:13px;
    display: none; /* в обычном состоянии окна не должно быть */
    opacity: 0; /* полностью прозрачно для анимирования */
    z-index: 5;   /* окно должно быть наиболее большем слое */
    box-shadow:10px 10px 40px -14px #000
}

.e-name {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
    width:100%;
    height:30px;
    padding: 10px;
}

.e-name input[type="text"],
.e-name input[type="email"] {
    font-family:'Montserrat',sans-serif;
    font-weight: bold;
    font-size:16px;
    width:44%;
    height:33px;
    background-color:#F7F7F8;
    color:#78788c;
    border:3px solid #4DA1F5;
    border-radius:8px;
    padding-left:10px ;
    resize: none;
}

#modal-form-voprosi textarea {
    display: block;
    width:94%;
    height:150px;
    color:#78788c;
    border:3px solid #4DA1F5;
    border-radius:8px;
    font-family:'Montserrat',sans-serif;
    font-weight: bold;
    padding-left:10px ;
    font-size:16px;
    resize: none;
}

#modal-form-voprosi h3
{   width:270px;
    color:#78788c;
    border-bottom:3px solid #78788c;
}

section {
    flex-grow: 1;
        background: linear-gradient(to right, #4568dc, #b06ab3);
    color: #D7D7EF;
}

.file-drop-area {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 88%;
    max-width: 88%;
    height:15%;
    padding: 25px;
    border:3px dashed #4DA1F5;
    border-radius:8px;
    transition: 0.2s;
    background:#90C4F9;
    color: #131316;
    font-family:'Montserrat',sans-serif;

}

.fake-btn img  {
    max-width: 100%;
    height: auto;
}

.file-msg {
    font-size: 16px;
    font-weight: 300;
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.file-input {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    cursor: pointer;
    opacity: 0;
    }

/*кнопка отправки формы с вопросами*/
.btn-modal-form-voprosi {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 170px;
    height: 39px;
}
.btn-submit-voprosi
 {  border:2px solid #78788c;
    border-radius:5px;
    width: 170px;
    height: 39px;
    background: #D8D8E4;
    color: #0054a8;
    font-weight: bold;
}

.btn-submit-voprosi:hover {
    background:#78788c;
    color:#fff;
    border-radius:8px;
    font-weight: bold;
}
/* END кнопка кнопка вызова формы для оформления акционного заказа*/

#poluchat {
    background:#78788c;
    color:#FFFFFF;
    width:80%;
    height: 20px;
    padding: 10px 0px 10px 0;
    border-radius:6px;
    font-size:13px;
    box-shadow:10px 10px 40px -14px #000;
    text-align: center;
    }
#modal-form-voprosi span{margin:0 5px 0 15px}

/* Кнопка закрыть для тех кто в танке) */
span#modal-close.fa.fa-times-circle-o
    {width: 41px;
    height: 41px;
    position: absolute;
    top: 20px;
    left: 580px;
    cursor: pointer;
    display: block;
    color: #4D4D5B;      /*#bebed2*/
    }
span#modal-close.fa.fa-times-circle-o:hover {color: #78788c;}
/* Подложка */
#over-lay{
    z-index: 3; /* подложка должна быть выше слоев элементов сайта, но ниже слоя модального окна */
    position: fixed; /* всегда перекрывает весь сайт */
    background-color: #e6e6e6; /* черная */
    opacity: 0.8; /* но немного прозрачна */
    width: 100%;
    height: 100%; /* размером во весь экран */
    top: 0;
    left: 0; /* сверху и слева 0, обязательные свойства! */
    cursor: pointer;
    display: none; /* в обычном состоянии её нет) */
    margin: 0;
    padding: o;
}

 .button_submit:hover
{   background:#e6e6e6;
    border-radius:8px;
}


/* pop-up окно отправки сообщения */
.n-success/*,
.n-danger,
.n-warning,
.n-info */{
    /*margin: 0 auto;
    width: 300px;
    height: 75px;
    padding: 12px 12px 12px 37px;
    color: #333;
    border-radius: 12px;
    background: #fff;
    position: relative;
    font-weight: bold;
    font-family: Verdana, sans-serif;
    box-sizing: border-box;*/
width:340px;
height:80px;
background:#e6e6e6;
border-radius:8px;
box-shadow:0 0 40px -10px #000;
/*margin:calc(0vh - 15px) auto; */
top: calc(5vh);
right:calc(5vh);
padding:15px 50px;
max-width:calc(100vw - 40px);
box-sizing:border-box;
font-family:'Montserrat',sans-serif;
font-weight: bold;
position:fixed;
text-align:center;
display: none;  /*none;*/   /* block; */
    opacity: 1;
    z-index : 6;
}
.n-success:before,
.n-warning:before,
.n-danger:before,
.n-info:before {
    content: "";
    background: inherit;
    color: inherit;
    border: inherit;
    display: block;
    text-align: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    line-height: 48px;
    position: absolute;
    left: -25px;
    box-sizing: border-box;
    font-family: "FontAwesome";
    font-size: 22px;

}
.n-success {
    border: 2px solid #32a846;
    color: #32a846;
}
.n-success:before {
    content: "\f00c";
}
.n-warning {
    border: 2px solid #f08d3c;
    color: #f08d3c;
}
.n-warning:before  {
    content: "\f12a";
}
.n-danger {
    border: 2px solid #d9534f;
    color: #d9534f;
}
.n-danger:before  {
    content: "\f057";
}
.n-info {
    border: 2px solid #3d98e3;
    color: #3d98e3;
}
.n-info:before  {
    content: "\f129";
}
/* ---------------------------------------------------------------------------------------------*/

@media screen and (max-width:620px) and (min-width:480px) {
#modal-form-voprosi{
    width:500px;
    margin-left: -250px;
}

#modal-form-voprosi textarea {
    width:443px;
    font-size:14px;
}
.e-name input[type="text"],
.e-name input[type="email"]{
    font-size:14px;
    width:200px;
}
.file-drop-area {
    width: 80%;
}
.fake-btn, .file-msg {
    font-size: 13px;

}
#over-lay{
    width: 500px;
    height: 100%; /* размером во весь экран */
}

}

@media screen and (max-width:479px){
#modal-form-voprosi{
    width:320px;
    margin-left: -160px;
    justify-content: center;
}

.e-name{
      flex-direction: column;
      justify-content: space-between;
      align-items: center;
      width:320px;
      height: 100px;
      margin: 10px;

}
#modal-form-voprosi textarea {
    width:280px;
    font-size:18px;
    height: 80px;
}
.e-name input[type="text"],
.e-name input[type="email"]{
    font-size:18px;
    width:280px;
}
.file-drop-area {
    width:280px;
    height: 30px;
   justify-content: flex-start;
}
#modal-form-voprosi span {
    display:flex;
    align-items: center;
    justify-content: flex-start;
    width: 220px;
    height: 0px;

}

.fake-btn, .file-msg {
    font-size: 14px;
    height: 0px;
    width: 94px;
    padding: 25px;
}

#poluchat {
    width:320px;
    height: 33px
    }

#over-lay{
    width: 100%;
    height: 100%; /* размером во весь экран */
}

}
/* END Стили формы вопросы с сайта на почту */