/*---------------------------------Імпорт шрифтів--------------------------------------*/
  @import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;700;800&display=swap');
/*---------------------------------Імпорт шрифтів--------------------------------------*/

/*---------------------------------Кнопка1--------------------------------------*/
        #button1 {
            cursor: pointer;
            text-transform: uppercase;
            font-size: calc(18px + 10 * (100vw / 1600));
            line-height: calc(36px + 36 * (100vw / 1600));
            font-weight: 700;
            letter-spacing: 3;
            border-radius: 10px;
            background-color: #78b964;
            color: #ffffff;
            border: none;
        }
        #button1:hover {
            box-shadow: 0px -5px 10px 0px rgba(0, 0, 0, 0.5);
            transition: all 0.25s ease-in;
        }
        #button1:active {
            transform: scale(0.9);
        }
/*---------------------------------Кнопка1--------------------------------------*/

/*---------------------------------Кнопка2--------------------------------------*/
        #button2 {
            cursor: pointer;
            text-transform: uppercase;
            font-size: calc(18px + 10 * (100vw / 1600));
            line-height: calc(36px + 36 * (100vw / 1600));
            font-weight: 700;
            letter-spacing: 3;
            color:#dad600;
            background-image: linear-gradient(to left,transparent,transparent 50%,#dad600 50%,#dad600);
            background-position: 100% 0;
            background-size: 200% 100%;
            transition: all .25s ease-in;
            border: 1px solid #dad600;
        }
        #button2:hover {
            background-position: 0 0;
            color:#fff;
        }
        #button2:active {
            transform: scale(0.9);
        }
/*---------------------------------Кнопка2--------------------------------------*/

/*---------------------------------Кнопка3--------------------------------------*/
        #button3 {
            cursor: pointer;
            text-transform: uppercase;
            font-size: calc(18px + 10 * (100vw / 1600));
            line-height: calc(36px + 36 * (100vw / 1600));
            font-weight: 700;
            letter-spacing: 3;
            border-radius: 84px;
            background: #f1f1f1;
            color: #474747;
            transition: all 0.3s ease 0s;
            border: 2px solid #4691cf;
        }
        #button3:hover {
            background: #4691cf;
            color: #fff;
        }
        #button3:active {
            transform: scale(0.9);
        }
/*---------------------------------Кнопка3--------------------------------------*/

/*---------------------------------Кнопка4--------------------------------------*/
        #button4 {
            cursor: pointer;
            text-transform: uppercase;
            font-size: calc(18px + 10 * (100vw / 1600));
            line-height: calc(36px + 36 * (100vw / 1600));
            font-weight: 700;
            letter-spacing: 3;
            padding-left: 25%;
            display: inline-block;
            position: relative;
            -webkit-transition: all 0.3s;
            -moz-transition: all 0.3s;
            transition: all 0.3s;
            background: #e74c3c;
            color: #fff;
            border-radius: 0 0 10px 10px;
            border: none;
        }
        #button4::before {
            content: '✉';
            font-size: calc(18px + 10 * (100vw / 1600));
            line-height: calc(36px + 36 * (100vw / 1600));
            font-weight: 400;
            position: absolute;
            height: 100%;
            left: 0;
            top: 0;
            width: 25%;
            background: rgba(0,0,0,0.15);
            border-radius: 0 0 0 10px;
        }
        #button4:hover {
            background: #c0392b;
        }
        #button4:active {
            background: #c0392b;
            top: 2px;
        }
/*---------------------------------Кнопка4--------------------------------------*/

/*---------------------------------Кнопка5--------------------------------------*/
        #button5 {
            cursor: pointer;
            text-transform: uppercase;
            font-size: calc(18px + 10 * (100vw / 1600));
            line-height: calc(36px + 36 * (100vw / 1600));
            font-weight: 700;
            letter-spacing: 3;
            padding-left: 25%;
            display: inline-block;
            position: relative;
            -webkit-transition: all 0.3s;
            -moz-transition: all 0.3s;
            transition: all 0.3s;
            background-color: #52ACFF;
            background-image: linear-gradient(180deg, #52ACFF 25%, #FFE32C 100%);
            color: #fff;
            border: none;
        }
        #button5::before {
            content: '❤';
            font-size: calc(18px + 10 * (100vw / 1600));
            line-height: calc(36px + 36 * (100vw / 1600));
            font-weight: 400;
            position: absolute;
            height: 100%;
            left: 0;
            top: 0;
            width: 25%;
            background: rgba(0,0,0,0.15);
        }
        #button5:hover {
            background-color: #52ACFF;
            background-image: linear-gradient(0deg, #52ACFF 25%, #FFE32C 100%);
        }
        #button5:active {
            background: rgba(0,0,0,0.5);
            top: 2px;
        }
/*---------------------------------Кнопка5--------------------------------------*/

/*---------------------------------Кнопка6--------------------------------------*/
#button6 {
    cursor: pointer;
    text-transform: uppercase;
    font-size: 12px;
    line-height: 34px;
    font-weight: 700;
    letter-spacing: 3;
    border-radius: 3px;
    background: #4691cf;
    color: #ffffff;
    border: none;
}
#button6:hover {
    background: #3075ad;
    transition: all 0.25s ease-in;
}
#button6:active {
    transform: scale(0.9);
}
/*---------------------------------Кнопка6--------------------------------------*/

/*---------------------------------Стилізація Блоку (Перший екран)--------------------------------------*/
.block-1-st1 { 
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    max-width: 1280px;
    margin: 0 auto;
    background: url('https://budnavigator.com.ua/image/baner5.jpg') 50% 50% / cover no-repeat; 
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.header-1-st1 {
    text-align: center;
    margin: 10px 10px;
    padding: 10px 25px 0 25px;
}
.title-1-st1  {
    font-weight: 800;
}
.subtitle-1-st1 {
    font-weight: 500;
}

.inform-1-st1 {
    padding: 10px;
    margin-left: 39%;
    margin-bottom: 50px;
}

.inform-1-st1 li {
    font-weight: 800;
    font-size: 16px;
    margin-bottom: 10px;
}
.inform-1-st1 li span {
    font-weight: 400;
    font-size: 14px;
}

.text-1-st1 {
    padding: 10px;
    background-color: #666666;
}
.text-1-st1 p {
    color: #ffffff;
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 0;
}
.item-descript-1-st1 {
    margin-top: 1%;
    text-align: center;
}
.text-1-st1 p span {
    color: #ffff17;
}
/*---------------------------------Кастомізація Контатної форми 1--------------------------------------*/
#ocdw_form_builder-block-1, #ocdw_form_builder-block-1 .inner-header, #ocdw_form_builder-block-1 .inner-center, #ocdw_form_builder-block-1 .inner-footer {
    background: #666666;
}
#ocdw_form_builder-block-1 {
    display: flex;
    justify-content: space-between;
    border: none;
    min-height: 0;
    color: #ebc700;
    font-weight: 700;
    text-align: center;
}
#ocdw_form_builder-block-1 .inner-header {
    display: none;
}
#ocdw_form_builder-block-1 .inner-center {
    flex: 1 0 50%;
}
#ocdw_form_builder-block-1 .inner-center label {
    display: none;
}
#ocdw_form_builder-block-1 .inner-footer {
    padding: 20px;
    border: none;
}
#ocdw_form_builder-block-1 .inner-footer button {
    width: 100%;
}

/*---------------------------------Кастомізація Контатної форми 1--------------------------------------*/

/*---------------------------------Адаптив--------------------------------------*/
@media (max-width: 991px) {}
@media (max-width: 767px) {.inform-1-st1 {margin-left: 30%;}}
@media (max-width: 480px) {.inform-1-st1 {margin-left: 8%;}.header-1-st1{padding: 10px;}#ocdw_form_builder-block-1{flex-wrap: wrap;}}
/*---------------------------------Адаптив--------------------------------------*/

/*---------------------------------Стилізація Блоку (Перший екран)--------------------------------------*/


/*---------------------------------Стилізація Блоку (Інформаційний блок 1)--------------------------------------*/
.block-2-st1 { 
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    text-align: justify;
    max-width: 1280px;
    margin: 0 auto;
    padding: 10px;
    /*background: url('https://budnavigator.com.ua/image/background/body-bkg.png') 0 0 / cover no-repeat; */
}

.inform-2-st1 {
    padding: 10px;
    background: url('https://budnavigator.com.ua/image/background/body-bkg2.png') 0 0 / cover no-repeat; 
    backdrop-filter: blur(5px);
    -webkit-box-shadow: 2px 3px 5px 0px #757575; 
    box-shadow: 2px 3px 5px 0px #757575;
    border-radius: 10px;
}
    
/*---------------------------------Адаптив--------------------------------------*/
@media (max-width: 991px) {}
@media (max-width: 767px) {}
@media (max-width: 480px) {.block-2-st1{padding: 10px;}}
/*---------------------------------Адаптив--------------------------------------*/

/*---------------------------------Стилізація Блоку (Інформаційний блок 1)--------------------------------------*/

/*---------------------------------Стилізація Блоку (Слайдер блок)--------------------------------------*/

.block-3-st1 { 
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    max-width: 1280px;
    margin: 0 auto;
    padding: 10px 10px;
    text-align: center;
    /* border-bottom: 1px solid rgba(70, 145, 207, 0.5); */
    /*background: url('https://budnavigator.com.ua/image/background/body-bkg.png') 0 0 / cover no-repeat;*/ 
    
}

.header-3-st1 {
    text-align: left;
    text-transform: uppercase;
    border: 1px solid rgba(70, 145, 207, 0.5);
    border-radius: 15px 15px 0 0;
    background-color: rgba(255, 255, 240, 1);
    /*background: linear-gradient(to right, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5);*/
    margin: 10px 10px;
    padding: 10px 10px 0 10px;
    transform: scaleX(1.08);
}

.media-3-st1 {

}
.media-3-st1 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.itc-slider__item {
    aspect-ratio: 1;
}

.btn-block-3-st1 {
    display: inline-block;
    margin: 20px auto;
    padding: 10px;
}
.btn-block-3-st1 button {
    width: 100%;
    padding: 0 15px;
}
/*---------------------------------Адаптив--------------------------------------*/
@media (max-width: 991px) {}
@media (max-width: 767px) {}
@media (max-width: 480px) {.block-3-st1{padding: 10px 20px;}.header-3-st1{margin: 20px 10px;}}
/*---------------------------------Адаптив--------------------------------------*/

/*---------------------------------Стилізація Блоку (Слайдер блок)--------------------------------------*/

/*---------------------------------Стилізація Блоку (Інформаційний блок 2)--------------------------------------*/
.block-4-st1 { 
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    max-width: 1280px;
    margin: 0 auto;
    padding: 10px;
    /*background: url('https://budnavigator.com.ua/image/background/body-bkg.png') 0 0 / cover no-repeat; */
    
}

.inform-4-st1 {
    padding: 20px;
    background: url('https://budnavigator.com.ua/image/background/body-bkg2.png') 0 0 / cover no-repeat; 
    backdrop-filter: blur(5px);
    -webkit-box-shadow: 1px 2px 5px 0px #757575; 
    box-shadow: 1px 2px 5px 0px #757575;
    border-radius: 8px;
}
/*---------------------------------Адаптив--------------------------------------*/
@media (max-width: 991px) {}
@media (max-width: 767px) {}
@media (max-width: 480px) {.block-4-st1{padding: 10px;}}
/*---------------------------------Адаптив--------------------------------------*/

/*---------------------------------Стилізація Блоку (Інформаційний блок 2)--------------------------------------*/

/*---------------------------------Стилізація Блоку (Безіменний блок)--------------------------------------*/
.block-5-st1 { 
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    max-width: 1280px;
    margin: 0 auto;
    padding: 20px 0;
    /*background: url('https://budnavigator.com.ua/image/background/body-bkg.png') 0 0 / cover no-repeat; */
}

.header-5-st1 {
    text-align: left;
    text-transform: uppercase;
    border: 1px solid rgb(255, 174, 88, 0.5);
    margin: 0 40px 20px;
    padding: 25px 25px 0 25px;
    background-color: rgba(255, 255, 255, 0.5);
}

.inform-5-st1 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 40px;
}
.card-5-st1 {
    flex: 0 0 30%;
    display: flex;
    flex-direction: column;
    margin: 20px 0;
}
.card-doc-5-st1 {
    flex: 0 0 30%;
    position: relative;
    margin: 25px 0;
}
.foto-5-st1 {
    overflow: hidden;
}
.foto-5-st1 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
    transition: transform 0.25s;
}
.foto-5-st1:hover img {
    transform: scale(1.5) rotate(15deg);
}
.foto-doc-5-st1 {
    overflow: hidden;
    height: 100%;
    background-color: #EDEDED;
    border: 1px solid #ddd;
    border-radius: 20px;
}
.foto-doc-5-st1 img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 20px;
    transition: transform 1.5s, filter 0.5s ease-in-out;
    transform-origin: center center;
    /* filter: brightness(50%); */
}
.foto-doc-5-st1:hover img {
    /* filter: brightness(100%); */
    transform: scale(1.15);
}
.holder-5-st1 {
    margin-top: 10px;
    
}
.item-5-st1 {
    padding: 10px;
    background-color: rgba(255, 255, 255, 0.5);
}
.pdf-doc-5-st1 {
    position: absolute;
    bottom: 15%;
    left: 15%;
    text-align: center;
    font-weight: bold;
    color: #292929;

}
.pdf-doc-5-st1 a {
    color: #292929;
}
/*---------------------------------Адаптив--------------------------------------*/
@media (max-width: 991px) {.card-5-st1{flex: 0 0 30%;}}
@media (max-width: 767px) {.inform-5-st1{flex-wrap: wrap;}.card-5-st1, .card-doc-5-st1{flex: 0 0 48%;margin-top: 20px;}}
@media (max-width: 480px) {.card-5-st1, .card-doc-5-st1{flex: 0 0 100%;}.header-5-st1{margin: 0 10px 20px;}.inform-5-st1{margin: 0 10px;}}
/*---------------------------------Адаптив--------------------------------------*/

/*---------------------------------Стилізація Блоку (Безіменний блок)--------------------------------------*/

/*---------------------------------Стилізація Блоку (Про нас)--------------------------------------*/
.block-6-st1 { 
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    max-width: 1280px;
    margin: 0 auto;
    padding: 40px 0;
    /*background: url('https://budnavigator.com.ua/image/background/body-bkg.png') 0 0 / cover no-repeat; */
    background-color: #f5f5f5; /* Світло-світло-сірий */
}

.header-6-st1 {
    text-align: left;
    /*text-transform: uppercase;*/
    border: 1px solid #e6e6e6;
    border-radius: 15px;
    margin: 0 40px 20px;
    padding: 25px 25px 0 25px;
    background-color: rgba(255, 255, 255, 0.5);
}

.inform-6-st1 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 20px;
}
.card-6-st1 {
    flex: 0 0 30%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transform:
        perspective(950px)
        translate3d(0px, 0px, -100px)
        rotateX(7deg)
        scale(1, 1);
    border-radius: 20px;
    border: 5px solid #e6e6e6;
    box-shadow: 0 70px 40px -20px rgba(0, 0, 0, 0.2);
    transition: 0.4s ease-in-out transform;
    &:hover {
       transform: translate3d(0px, 0px, -100px);
    }
}
.foto-6-st1 {
    overflow: hidden;
}

.foto-6-st1 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
    transition: transform 0.25s;
}
.foto-6-st1:hover img {

}
.foto-doc-6-st1 {
    overflow: hidden;
    position: relative;
    background-color: #EDEDED;
    border: 1px solid #ddd;
    border-radius: 20px;
    transition: transform 1.5s, filter 0.5s ease-in-out;
    /* filter: brightness(50%); */
}
.foto-doc-6-st1 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
    transition: transform 1.5s, filter 0.5s ease-in-out;
    transform-origin: center center;
}
.foto-doc-6-st1:hover {
    /* filter: brightness(100%); */
}
.holder-6-st1 {
    margin-top: 10px;
}
.item-6-st1 {
    text-align: center;
    padding: 10px;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 15px;
    min-height: 90px;
}
.item-6-st1 p {
    margin: 0;
}
.pdf-doc-6-st1 {
    position: absolute;
    bottom: 0;
    left: 0;
    text-align: center;
    font-weight: bold;
    color: #292929;
    margin: 10px;
}
.pdf-doc-6-st1 a {
    color: #292929;
}

/*---------------------------------Адаптив--------------------------------------*/
@media (max-width: 991px) {.card-6-st1{flex: 0 0 30%;}}
@media (max-width: 767px) {.inform-6-st1{flex-wrap: wrap;}.card-6-st1{flex: 0 0 48%;margin-top: 20px;}}
@media (max-width: 480px) {.card-6-st1{flex: 0 0 100%;transform: none;}.header-6-st1{margin: 0 10px 20px;}.inform-6-st1{margin: 0 10px;}}
/*---------------------------------Адаптив--------------------------------------*/

/*---------------------------------Стилізація Блоку (Про нас)--------------------------------------*/

/*---------------------------------Стилізація Блоку (Як замовити)--------------------------------------*/
.block-7-st1 { 
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    max-width: 1280px;
    margin: 0 auto;
    padding: 20px 0;
    /*background: url('https://budnavigator.com.ua/image/background/body-bkg.png') 0 0 / cover no-repeat; */
     background-color: #f5f5f5; /* Світло-світло-сірий */
}
.header-7-st1 {
    text-align: center;
    text-transform: uppercase;
    border: 1px solid #e6e6e6;
    border-radius: 15px;
    margin: 0 40px 20px;
    padding: 25px 25px 0 25px;
    background-color: rgba(255, 255, 255, 0.5);
}

.inform-7-st1 {
    display: flex;
    justify-content: space-between;
    margin: 0 40px;
}
.inform-7-st1 p {
    margin: 0;
}
.card-7-st1 {
    flex: 0 0 47%;
    display: flex;
    flex-direction: column;
    margin-top: 20px;
}
.foto-7-st1 {
    overflow: hidden;
    margin-bottom: 20px;
    border-radius: 15px;
}
.foto-7-st1 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.holder-7-st1 {

}
.plug-7-st1 {
    flex: 1 1 auto;
    padding: 40px;
    background: linear-gradient(to right, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5) ), url('https://budnavigator.com.ua/image/catalog/STATTI/posadkova/pokupka.PNG') 0 0 / contain no-repeat; 
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
   }
.item-7-st1 {
    padding: 15px 20px;
    background-color: #EDEDED;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border: 1px solid #ddd;
}
.item-7-st1 p {
    font-size: 20px;
}
.choice-7-st1 {
    flex: 0 0 10%;
    display: flex;
    justify-content: center;
    text-align: center;
    font-size: 26px;
    font-weight: bold;
    align-items: center;
}
.btn-block-7-st1 {
    padding: 15px 20px;
    background-color: #EDEDED;
    border: 1px solid #ddd;
}
.btn-block-7-st1 button {
    width: 100%;
    padding: 0 15px;
    font-weight: normal !important;
    background-color: #47c843 !important;
}
.btn-block-7-st1:hover button {
    background-color: #3cb736 !important;
}
#ocdw_form_builder-block-3 .inner-footer button {
    width: 100%;
}

/*---------------------------------Адаптив--------------------------------------*/
@media (max-width: 991px) {}
@media (max-width: 767px) {.inform-7-st1{margin: 0 10px;}.choice-7-st1{display: none;}.card-7-st1{flex: 0 0 48%;}}
@media (max-width: 480px) {.inform-7-st1{flex-wrap: wrap;}.choice-7-st1{display: flex; flex: 1 1 100%; margin: 20px;}.card-7-st1{flex: 0 0 100%;}}
/*---------------------------------Адаптив--------------------------------------*/

/*---------------------------------Стилізація Блоку (Як замовити)--------------------------------------*/

/*---------------------------------Стилізація Блоку (Контакти)--------------------------------------*/
.block-8-st1 { 
    font-family: 'Open Sans', sans-serif;
    font-size: 20px;
    font-weight: 400;
    max-width: 1280px;
    margin: 0 auto;
    padding: 40px;
    background: #f1f1f1;
    display: flex;
    justify-content: space-between;
    background: url('https://budnavigator.com.ua/image/background/body-bkg.png') 0 0 / cover no-repeat; 
}
.inform-8-st1 {
    flex: 0 0 37%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    order: 1; /* Міняємо блоки місцями */
}
.text-8-st1 {
    height: 100%;
    padding: 20px 10px;
    border: 1px solid rgb(255, 255, 255, 1);
    background-color: rgba(255, 255, 255, 0.5);
    font-weight: 700;
    color: #292929;
    font-size: 14px;
}
.map-8-st1 {
    flex: 0 1 60%;
    min-height: 250px;
    border: 1px solid rgb(255, 255, 255, 1);
    order: 2; /* Міняємо блоки місцями */
}
.adress-8-st1, .adress-8-st1, .telephone-8-st1, .email-8-st1, .worktime-8-st1, .social-8-st1 {
    margin-bottom: 20px;
}
.inline-8-st1 {
    margin-left: 25px;
    margin-top: 10px;
    font-weight: 400;
}
.inline-8-st1 a {
    color: #292929;
}
.inbox-8-st1 {
    margin: 10px 10px 10px 0;
}

/*---------------------------------Адаптив--------------------------------------*/
@media (max-width: 991px) {}
@media (max-width: 767px) {.block-8-st1{flex-wrap: wrap;}.inform-8-st1{flex: 1 1 100%}.map-8-st1{flex: 1 1 100%; margin-top: 30px}}
@media (max-width: 480px) {.block-8-st1{padding: 10px;}}
/*---------------------------------Адаптив--------------------------------------*/

/*---------------------------------Стилізація Блоку (Контакти)--------------------------------------*/