/* ============ CONNECT FONTS ============ */
@font-face {
    font-family: "Rubik";
    src: url("/fonts/Rubik/Rubik-Regular.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
}
@font-face {
    font-family: "Rubik";
    src: url("/fonts/Rubik/Rubik-Medium.ttf") format("truetype");
    font-style: normal;
    font-weight: 500;
}
@font-face {
    font-family: "Rubik";
    src: url("/fonts/Rubik/Rubik-Bold.ttf") format("truetype");
    font-style: normal;
    font-weight: 700;
}
@font-face {
    font-family: "Rubik";
    src: url("/fonts/Rubik/Rubik-Black.ttf") format("truetype");
    font-style: normal;
    font-weight: 900;
}

/*============ VARIABLES CSS ============*/
:root{
    --main-red-color: #E24A42;
    --main-black-color:  #000000;
    --main-dark-gray-color: #676767;
    --main-gray-color: #acacac;
    --main-light-gray-color: #FAFAFA;
    --main-white-color: #FFFFFF;
}

/*============ GENERAL STYLE (START) ============*/
*{
    font-family: "Rubik", Sans-serif;
    font-style: normal;
    color: var(--main-gray-color);
    letter-spacing: 0.02em;
    line-height: 120%;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    font-size: 1em;
    font-weight: 400;
}
html{
    scroll-behavior: smooth;
}
body{
    background-color: var(--main-white-color);
}
h1, h2, h3, h4, h5, h6, p{
    margin-bottom: 0px;
}
/*Margin (start)*/
.banana-m-10px{
    margin: 10px;
}
/*Margin top*/
.banana-mt-10px{
    margin-top: 10px;
}
.banana-mt-15px{
    margin-top: 15px;
}
.banana-mt-20px{
    margin-top: 20px;
}
.banana-mt-30px{
    margin-top: 30px;
}
.banana-mt-40px{
    margin-top: 40px;
}
/*Margin right*/
.banana-mr-10px{
    margin-right: 10px;
}
.banana-mr-15px{
    margin-right: 15px;
}
.banana-mr-20px{
    margin-right: 20px;
}
.banana-mr-30px{
    margin-right: 30px;
}
.banana-mr-40px{
    margin-right: 40px;
}
/*Margin bottom*/
.banana-mb-10px{
    margin-bottom: 10px;
}
.banana-mb-15px{
    margin-bottom: 15px;
}
.banana-mb-20px{
    margin-bottom: 20px;
}
.banana-mb-30px{
    margin-bottom: 30px;
}
.banana-mb-40px{
    margin-bottom: 40px;
}
.banana-mb-50px{
    margin-bottom: 50px;
}
/*Margin left*/
.banana-ml-10px{
    margin-left: 10px;
}
.banana-ml-15px{
    margin-left: 15px;
}
.banana-ml-20px{
    margin-left: 20px;
}
.banana-ml-30px{
    margin-left: 30px;
}
.banana-ml-40px{
    margin-left: 40px;
}
/*Margin (end)*/

/*Padding (start)*/
.banana-p-10px{
    padding: 10px;
}
.banana-p-20px{
    padding: 20px;
}
.banana-p-30px{
    padding: 30px;
}
.banana-p-40px{
    padding: 40px;
}
/*Padding (end)*/
h1.banana-h1-title{
    font-weight: 900;
    font-size: 4rem;
    line-height: 130%;
    text-transform: uppercase;
    color: var(--main-black-color);
}
h2.banana-h2-title{
    font-weight: 900;
    font-size: 3rem;
    line-height: 130%;
    text-transform: uppercase;
    color: var(--main-black-color);
}
h3.banana-h3-title{
    font-weight: 700;
    font-size: 2rem;
    line-height: 120%;
    color: var(--main-black-color);
}
h4.banana-h4-title{
    font-weight: 700;
    font-size: 26px;
    line-height: 130%;
    text-transform: uppercase;
    color: var(--main-black-color);
}
h5.banana-h5-title{
    font-weight: 700;
    font-size: 20px;
    line-height: 115%;
    text-transform: uppercase;
    color: var(--main-black-color);
}
.banana-subtitle{
    font-size: 20px;
    line-height: 150%;
    font-weight: 400;
    color: var(--main-dark-gray-color);
}
p.banana-description{
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--main-dark-gray-color);
}
a{
    text-decoration: none;
}
.banana-section{
    width: 100%;
    position: relative;
    z-index: 50;
    overflow: hidden;
}
.banana-section-container{
    padding: 50px;
    z-index: 100;
    position: relative;
}
input{
    appearance: none;
    -webkit-appearance: none;
    border-radius: 0px;
}
textarea{
    appearance: none;
    -webkit-appearance: none;
    box-shadow: none !important;
}
.banana-svg-messenger-icon{
    width: 30px;
    height: 30px;
}
/*============ GENERAL STYLE (END) ============*/

/*============ MAIN STYLE (START) ============*/
/*Header (start)*/
.banana-header{
    display: block;
    position: absolute;
    top: 40px;
    width: 100%;
    z-index: 999;
    padding: 10px 0px;
}
.banana-header.sticky {
    position: fixed;
    top: 0;
    transition: background-color 0.5s;
    background-color: #f9f9f9;
}
.banana-header .banana-logo-container{
    font-weight: 900;
    font-size: 18px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--main-dark-gray-color);
}
.banana-header .banana-button-container{
    background-color: var(--main-white-color);
    border-radius: 100px;
    padding: 10px 25px;
    color: var(--main-red-color);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.08);
    border: 2px solid var(--main-white-color);
    transition: all 0.5s;
}
.banana-header .banana-button-container:hover,
.banana-header .banana-button-container:active,
.banana-header .banana-button-container:focus{
    border: 2px solid var(--main-red-color);
    transition: all 0.5s;
}
.banana-header .banana-desctop-menu .nav-link{
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--main-black-color);
    margin: 10px 20px;
    padding: 0px 0px 2px 0px;
    position: relative;
}
.banana-header .banana-desctop-menu a.nav-link::after{
    content: "";
    position: absolute;
    bottom: 2px;
    left: 0;
    width: 0;
    height: 2px;
    background-color: var(--main-red-color);
    transition: all 0.5s;
}
.banana-header .banana-desctop-menu a.nav-link:hover::after,
.banana-header .banana-desctop-menu a.nav-link:active::after,
.banana-header .banana-desctop-menu a.nav-link:focus::after{
    width: 100%;
}
.banana-gamburger-link{
    display: none;
    outline: none;
    cursor: pointer;
}
.banana-gamburger-link:focus {
    outline: 0;
    box-shadow: none;
}
.banana-header .banana-mobile-menu-section{
    height: 100%;
    width: 100%;
    position: fixed;
    z-index: 100;
    left: -100%;
    top: 0;
    background-color: var(--main-black-color);
    overflow-x: hidden;
    transition: 0.5s; 
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    align-content: center;
}  
.banana-header .banana-mobile-menu-container{
    position: relative;
    width: 100%;
    text-align: center; 
}
.banana-header .banana-mobile-menu-section a.nav-link{
    padding: 8px;
    font-size: 2rem;
    color: #efefef;
    display: block;
    transition: 0.5s;
}
.banana-header .banana-mobile-menu-section a.nav-link:hover, 
.banana-header .banana-mobile-menu-section a.nav-link:focus,
.banana-header .banana-mobile-menu-contact-block .banana-phone-container a.banana-phone-link:hover,
.banana-header .banana-mobile-menu-contact-block .banana-phone-container a.banana-phone-link:focus,
.banana-header .banana-mobile-menu-contact-block .banana-messenger-container a.banana-icon-link:hover svg path,
.banana-header .banana-mobile-menu-contact-block .banana-messenger-container a.banana-icon-link:focus svg path,
.banana-header .banana-mobile-menu-section a.banana-close-btn:hover,
.banana-header .banana-mobile-menu-section a.banana-close-btn:focus{
    color: var(--main-white-color);
    fill: var(--main-white-color);
}
@media screen and (max-height: 450px) {
    .banana-header .banana-mobile-menu-section a.nav-link {
        font-size: 1.4rem;
    }
}
.banana-header .banana-mobile-menu-section .banana-close-btn{
    font-size: 40px;
    color: var(--main-gray-color);
    width: 40px;
    height: 40px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    align-content: center;
}
.banana-header .banana-close-button-container{
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    position: relative;
    width: 100%;
    padding: 10px;
}
.banana-header .banana-mobile-menu-contact-block{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    position: relative;
    padding-bottom: 30px;
    padding-top: 30px;
}
.banana-header .banana-mobile-menu-contact-block .banana-phone-container{
    margin-bottom: 20px;
}
.banana-header .banana-mobile-menu-contact-block .banana-phone-container a.banana-phone-link{
    color: #efefef;
}
.banana-header .banana-mobile-menu-contact-block .banana-messenger-container .banana-icon-link{
    position: relative;
    display: inline-block;
}
.banana-header .banana-mobile-menu-contact-block .banana-messenger-container .banana-icon-link:not(:last-child){
    margin-right: 20px;
}
.banana-header .banana-mobile-menu-contact-block .banana-messenger-container .banana-icon-link svg path{
    fill: #efefef;
}
/*Header (end)*/

/*First screen section (start)*/
.first-screen-section{
    height: 100vh;
    min-height: 800px;
}
.first-screen-section:before{
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 55;
    width: 50%;
    height: 80%;
    background-image: url(/images/background-left-bottom-figure.svg);
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: contain;
}
.first-screen-section:after{
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    z-index: 55;
    width: 45%;
    height: 75%;
    background-image: url(/images/background-first-screen-right-top-figure.svg);
    background-position: top right;
    background-repeat: no-repeat;
    background-size: contain;
}
.first-screen-section .banana-subtitle{
    max-width: 400px;
}
.first-screen-section .banana-form-container{
    padding: 50px;
    background: #FFFFFF;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.08);
    border-radius: 16px;
}
/* Contact form (start)*/
.banana-contact-form .banana-contact-form-item input{
    margin-bottom: 40px;
    padding: 10px 5px 10px 5px;
    width: 100%;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 2px solid #e24a42;
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    color: var(--main-gray-color);
}
.banana-contact-form .banana-contact-form-item input::placeholder{
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    color: var(--main-gray-color);
}
.banana-contact-form .banana-contact-form-item input:focus-visible,
.banana-contact-form .banana-contact-form-item .banana-button:focus-visible{
    outline-color: var(--main-gray-color);
}
.banana-contact-form .banana-contact-form-item .banana-button,
.banana-button{
    background-color: var(--main-red-color);
    width: 100%;
    padding: 20px;
    border: none;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
    color: var(--main-white-color);
    text-transform: uppercase;
    border-radius: 12px;
    transition: all 0.5s;
    filter: drop-shadow(0px 6px 20px rgba(226, 74, 66, 0.16));
    border: 2px solid var(--main-red-color);
}
.banana-contact-form .banana-contact-form-item .banana-button:hover,
.banana-button:hover,
.banana-contact-form .banana-contact-form-item .banana-button:active,
.banana-button:active,
.banana-contact-form .banana-contact-form-item .banana-button:focus,
.banana-button:focus{
    transition: all 0.5s;
    border: 2px solid var(--main-red-color);
    background-color: var(--main-white-color);
    color: var(--main-red-color);
}
/* Contact form (end)*/
/*First screen section (end)*/

/*About me (start)*/

/*About me (end)*/

/* Advertising benefits section (start) */
.advertising-benefits-section .banana-section-container{
    padding-top: 80px;
    padding-bottom: 120px;
}
.advertising-benefits-section h2.banana-h2-title{
    max-width: 900px;
}
.advertising-benefits-section .benefits-container{
    margin-top: 70px;
    width: 45%;
}
.advertising-benefits-section .benefits-container .benefits-item:not(:last-child){
    margin-bottom: 40px;
}
.advertising-benefits-section .benefits-container .benefits-item{
    margin-left: 30px;
}
.advertising-benefits-section .benefits-container .benefits-item .banana-h4-title{
    position: relative;
}
.advertising-benefits-section .benefits-container .benefits-item .banana-h4-title:before{
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 100%;
    background-color: var(--main-red-color);
    display: block;
    position: absolute;
    left: -30px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}
.advertising-benefits-section:after{
    content: '';
    position: absolute;
    top: 30%;
    right: -1px;
    z-index: 55;
    width: 60%;
    height: 70%;
    background-image: url(/images/benefits-background-notebook.png);
    background-position: top right;
    background-repeat: no-repeat;
    background-size: contain;
}
.advertising-benefits-section .banana-benefits-mibile-phone{
    display: none;
}
/* Advertising benefits section (end)*/

/* Tariffs section (start)*/
.tariffs-section{
    background: #F1F1F1;
}
.tariffs-section .banana-section-container{
    padding-top: 80px;
    padding-bottom: 120px;
}
.tariffs-section .tariffs-container{
    margin-top: 75px;
}
.tariffs-section .tariffs-item-container{
    padding-left: 0px;
    padding-right: 0px;
}
.tariffs-section .tariffs-item-container:first-child{
    padding-right: 16px;
}
.tariffs-section .tariffs-item-container:nth-child(2){
    padding-left: 16px;
    padding-right: 16px;
}
.tariffs-section .tariffs-item-container:nth-child(3){
    padding-left: 16px;
}
.tariffs-section .tariffs-item-container:nth-child(2) .tariffs-item{
    border: 2px solid var(--main-red-color);
}
.tariffs-section .tariffs-item-container:nth-child(1) .tariffs-item,
.tariffs-section .tariffs-item-container:nth-child(3) .tariffs-item{
    border: 2px solid var(--main-white-color);
}
.tariffs-section .tariffs-item{
    background-color: var(--main-white-color);
    padding: 40px 32px 45px 32px;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.04);
    border-radius: 16px;
}
.tariffs-section .tariffs-item .banana-benefits-price,
.tariffs-section .tariffs-item .banana-benefits-price >*{
    color: var(--main-red-color);
    margin-top: 14px;
    font-weight: 700;
    font-size: 20px;
    line-height: 120%;
    text-transform: uppercase;
}
.tariffs-section .tariffs-item .banana-benefits-price span{
    font-size: 1rem;
}
.tariffs-section .tariffs-item .banana-description{
    margin-top: 12px;
    color: var(--main-gray-color);
}
.tariffs-section .tariffs-item .banana-divider{
    position: relative;
    display: block;
    width: 100%;
    height: 1px;
    background-color: #E3E2E2;
    margin-top: 22px;
    margin-bottom: 24px;
}
.tariffs-section .tariffs-item .banana-tariffs-benefits-item{
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: var(--main-black-color);
    padding-left: 30px;
    position: relative;
}
.tariffs-section .tariffs-item .banana-tariffs-benefits-item:not(:last-child){
    margin-bottom: 20px;
}
.banana-tariffs-benefits-item:before{
    content: '';
    width: 16px;
    height: 16px;
    display: block;
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
}
.banana-tariffs-benefits-item.true:before{
    background-image: url(/icons/green-check-mark.svg);
}
.banana-tariffs-benefits-item.false:before{
    background-image: url(/icons/gray-minus-mark.svg);
}
.tariffs-section .tariffs-item .banana-button-container{
    background-color: var(--main-red-color);
    margin-top: 32px;
    padding: 20px;
    text-align: center;
    border-radius: 12px;
    color: var(--main-white-color);
    text-transform: uppercase;
    font-weight: 400;
    font-size: 1rem;
    line-height: 150%;
    transition: all 0.5s;
    border: 2px solid var(--main-red-color);
}
.tariffs-section .tariffs-item .banana-button-container:hover,
.tariffs-section .tariffs-item .banana-button-container:active,
.tariffs-section .tariffs-item .banana-button-container:focus{
    transition: all 0.5s;
    border: 2px solid var(--main-red-color);
    background-color: var(--main-white-color);
    color: var(--main-red-color);
}
.tariffs-section .tariffs-item .banana-button-container:focus-visible{
    outline-color: var(--main-gray-color);
}
.tariffs-section .tariffs-item .banana-button-container:focus{
    box-shadow: none;
}
/* Tariffs section (end)*/

/*Our works section (start)*/
.our-works-section:before{
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 55;
    width: 50%;
    height: 70%;
    background-image: url(/images/background-left-bottom-figure.svg);
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: contain;
}
.our-works-section .banana-section-container{
    padding-top: 90px;
    padding-bottom: 145px;
}
.our-works-section .banana-subtitle{
    max-width: 480px;
}
.our-works-section .banana-our-works-container{
    margin-top: 90px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.our-works-section .banana-work-container{
    width: 50%;
}
.our-works-section .banana-work-container:nth-child(odd){
    padding-right: 16px;
    padding-bottom: 32px;
}
.our-works-section .banana-work-container:nth-child(even){
    padding-left: 16px;
    padding-bottom: 32px;
}
.our-works-section .banana-work-container .banana-work-item{
    background: var(--main-white-color);
    box-shadow: 0px 1px 12px rgba(0, 0, 0, 0.08);
    border-radius: 16px;
    padding: 30px 30px 50px 30px;
}
.our-works-section .banana-title-container{
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: center;
}
.our-works-section .banana-title-container .banana-icon-container{
    margin-right: 40px;
    width: 40px;
    height: 40px;
}
.our-works-section .banana-work-item .banana-site-name{
    font-weight: 500;
    font-size: 1.5rem;
    line-height: 120%;
    color: var(--main-black-color);
    margin-top: 45px;
}
.our-works-section .banana-site-link{
    margin-top: 15px;
    display: inline-block;
    font-weight: 400;
    font-size: 0.875rem;
    line-height: 120%;
    color: var(--main-red-color);
    margin-left: 25px;
    position: relative;
}
.our-works-section .banana-site-link:before{
    content: '';
    width: 15px;
    height: 15px;
    display: block;
    position: absolute;
    left: -25px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(/icons/www-icon.svg);
}
.our-works-section .banana-site-link::after{
    content: "";
    position: absolute;
    bottom: -3px;
    left: 0;
    width: 0;
    height: 2px;
    background-color: var(--main-red-color);
    transition: all 0.7s;
}
.our-works-section .banana-site-link:hover::after,
.our-works-section .banana-site-link:active::after,
.our-works-section .banana-site-link:focus::after{
    width: 100%;
}
.our-works-section .banana-description{
    margin-top: 25px;
}
.our-works-section .banana-parametrs-container{
    margin-top: 25px;
}
.our-works-section .banana-parametrs-item{
    font-weight: 500;
    font-size: 1rem;
    line-height: 120%;
    color: var(--main-black-color);
    margin-left: 25px;
    position: relative;
}
.our-works-section .banana-parametrs-item:before{
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 100%;
    background-color: var(--main-red-color);
    display: block;
    position: absolute;
    left: -25px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}
.our-works-section .banana-parametrs-item:not(:last-child){
    margin-bottom: 12px;
}
.our-works-section .banana-parametrs-value{
    color: #888888;
    margin-left: 10px;
}
/*Our works section (end)*/

/*Answers section (start)*/
.answers-section .banana-section-container{
    padding-top: 90px;
    padding-bottom: 60px;
}
.answers-section .banana-accordion{
    margin-top: 100px;
    width: 85%;
}
.answers-section .banana-accordion .accordion-item{
    border: 0;
}
.answers-section .banana-accordion .accordion-button:not(.collapsed) {
    color: var(--main-black-color);
    background-color: #ffffff;
    box-shadow: none;
}
.answers-section .banana-accordion .accordion-button:focus {
    border-color: #ffffff;
    box-shadow: none;
}
.answers-section .banana-accordion .accordion-item{
    background: var(--main-white-color);
    box-shadow: 0px 1px 12px rgba(0, 0, 0, 0.08);
    border-radius: 16px;
}
.answers-section .banana-accordion .accordion-item:not(:last-child){
    margin-bottom: 32px;
}
.answers-section .banana-accordion .accordion-button{
    padding: 24px 28px 24px 32px;
    font-weight: 500;
    font-size: 1.5rem;
    line-height: 120%;
    color: var(--main-black-color);
    border-radius: 16px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-content: center;
    align-items: center;
    position: relative;

}
.answers-section .banana-accordion .accordion-button::after{
    background-image: url(/icons/red-plus.svg);
    background-size: 1.5rem;
    width: 1.5rem;
    height: 1.5rem;
    background-position: center center;
    transform: rotate(0deg);

    margin-left: 25px;
}
.answers-section .banana-accordion .accordion-button:not(.collapsed)::after {
    background-image: url(/icons/red-minus.svg);
    background-position: center center;
}
.answers-section .banana-accordion .accordion-body{
    padding: 4px 28px 40px 32px;
    max-width: 800px;
    font-weight: 400;
    font-size: 1rem;
    line-height: 150%;
    color: #888888;
}
.answers-section:before{
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 55;
    width: 50%;
    height: 670px;
    background-image: url(/images/background-left-bottom-figure.svg);
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: contain;
}
.answers-section:after{
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    z-index: 55;
    width: 50%;
    height: 670px;
    background-image: url(/images/background-right-top-figure.svg);
    background-position: top right;
    background-repeat: no-repeat;
    background-size: contain;
}
/*Answers section (end)*/

/*Algorithm section (start)*/
.algorithm-section .banana-section-container{
    padding-top: 90px;
    padding-bottom: 200px;
}
.algorithm-section .banana-algorithm-container{
    margin-top: 180px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    position: relative;
}
.algorithm-section .banana-algorithm-container .banana-algorithm-item{
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 80px;
    text-align: center;
    font-weight: 500;
    font-size: 1.5rem;
    line-height: 120%;
    color: var(--main-black-color);
    position: relative;
    max-width: 250px;
}
.algorithm-section .banana-algorithm-container .banana-algorithm-item:after{
    content: '';
    width: 40px;
    height: 40px;
    border-radius: 100%;
    background-image: url(/icons/white-arrow-in-red-circle.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    display: block;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    z-index: 100;
}
.algorithm-section .banana-algorithm-container:after{
    content: '';
    width: 100%;
    height: 1px;
    background-color: #888888;
    position: absolute;
    bottom: 20px;
}
/*Algorithm section (end)*/

/*Promotion form section (start)*/
.promotion-form-section{
    background-color: var(--main-light-gray-color);
}
.promotion-form-section .banana-section-container{
    padding-top: 90px;
    padding-bottom: 160px;
}
/*Multi Step form (start)*/
.promotion-form-section .promotion-form-container{
    margin-top: 90px;
    background-color: var(--main-white-color);
    box-shadow: 0px 1px 12px rgba(0, 0, 0, 0.08);
    border-radius: 16px;
    max-width: 1050px;
    margin-left: auto;
    margin-right: auto;
    padding: 60px 70px;
}
.promotion-form-section .banana-steps-indicator-container{
    display: flex;
    flex-direction: row;
    justify-content: start;
    flex-wrap: wrap;
    margin-bottom: 45px;
}
.promotion-form-section .banana-steps-indicator-container .banana-step{
    display: block;
    position: relative;
    padding: 0px 40px 25px 40px;
    border-bottom: 2px solid #E5E5E5;
    font-weight: 500;
    font-size: 1rem;
    line-height: 130%;
    color: var(--main-black-color);
    text-transform: uppercase;
    width: 20%;
}
/* Mark the active step: */
.promotion-form-section .banana-steps-indicator-container .banana-step.active {
    border-bottom: 3px solid var(--main-red-color);
}
/* Hide all steps by default: */
.promotion-form-section .promotion-form-container .banana-tab {
    display: none;
}
.promotion-form-section .promotion-form-container .banana-tab .banana-tab-title{
    font-weight: 500;
    font-size: 1.2rem;
    line-height: 150%;
    color: var(--main-black-color);
    padding-bottom: 12px; 
}
.promotion-form-section .promotion-form-container .banana-tab textarea{
    width: 100%;
    min-height: 175px;
    border-radius: 8px;
    background: var(--main-light-gray-color);
    border: 2px solid #E5E5E5;
    box-sizing: border-box;
    padding: 10px;
    font-weight: 400;
    font-size: 1rem;
    line-height: 150%;
}
.promotion-form-section .promotion-form-container .banana-tab textarea::placeholder{
    font-weight: 400;
    font-size: 1rem;
    line-height: 150%;
    color: var(--main-gray-color);
}
.promotion-form-section .promotion-form-container .banana-tab textarea:focus-visible,
.promotion-form-section .promotion-form-container button.banana-promotion-form-button:focus-visible,
.promotion-form-section .promotion-form-container .banana-tab-input .banana-input-item input{
    outline-color: var(--main-gray-color);
}
.promotion-form-section .promotion-form-container .banana-button-container{
    margin-top: 30px;
    display: flex;
}
.promotion-form-section .promotion-form-container .banana-button-container .banana-next-button{
    margin-left: auto;
}
.promotion-form-section .promotion-form-container button.banana-promotion-form-button{
    background: var(--main-red-color);
    border-radius: 12px;
    min-width: 320px;
    padding: 18px;
    border: none;
    font-weight: 400;
    font-size: 1rem;
    line-height: 150%;
    color: var(--main-white-color);
    border: 2px solid var(--main-red-color);
    transition: all 0.5s;
}
.promotion-form-section .promotion-form-container button.banana-promotion-form-button:hover{
    transition: all 0.5s;
    border: 2px solid var(--main-red-color);
    background-color: var(--main-white-color);
    color: var(--main-red-color);
}
.promotion-form-section .promotion-form-container .banana-tab-input .banana-radio-item:not(:last-child){
    margin-bottom: 16px;
}
.promotion-form-section .promotion-form-container .banana-tab-input .banana-radio-item input[type=radio]{
    margin-right: 18px;
}
.promotion-form-section .promotion-form-container .banana-tab-input .banana-radio-item label{
    font-weight: 400;
    font-size: 1rem;
    line-height: 150%;
    color: #888888;
} 
/* для элемента input c type="radio" */
.promotion-form-section .promotion-form-container .banana-tab-input .banana-radio-item .custom-radio {
    position: absolute;
    z-index: -1;
    opacity: 0;
}
/* для элемента label связанного с .custom-radio */
.promotion-form-section .promotion-form-container .banana-tab-input .banana-radio-item .custom-radio+label {
    display: flex;
    align-items: center;
    user-select: none;
}
/* создание в label псевдоэлемента  before со следующими стилями */
.promotion-form-section .promotion-form-container .banana-tab-input .banana-radio-item .custom-radio+label::before {
    content: '';
    display: inline-block;
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
    flex-grow: 0;
    border: 1px solid var(--main-red-color);
    border-radius: 50%;
    margin-right: 1rem;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 70% 70%;
}
/* стили при наведении курсора на радио */
.promotion-form-section .promotion-form-container .banana-tab-input .banana-radio-item .custom-radio:not(:disabled):not(:checked)+label:hover::before {
    border-color: var(--main-gray-color);
}
/* стили для радиокнопки, находящейся в фокусе */
.promotion-form-section .promotion-form-container .banana-tab-input .banana-radio-item .custom-radio:focus+label::before {
    box-shadow: 0 0 0 0.2rem rgba(255, 0, 0, 0.25);
}
/* стили для радиокнопки, находящейся в фокусе и не находящейся в состоянии checked */
.promotion-form-section .promotion-form-container .banana-tab-input .banana-radio-item .custom-radio:focus:not(:checked)+label::before {
    border-color: var(--main-gray-color);
}
/* стили для радиокнопки, находящейся в состоянии checked */
.promotion-form-section .promotion-form-container .banana-tab-input .banana-radio-item .custom-radio:checked+label::before {
    border-color: var(--main-red-color);
    background-color: var(--main-white-color);
    background-image: url(/icons/red-circle-for-radio-button.svg);
}
/* стили для радиокнопки, находящейся в состоянии disabled */
.promotion-form-section .promotion-form-container .banana-tab-input .banana-radio-item .custom-radio:disabled+label::before {
    background-color: #e9ecef;
}
.promotion-form-section .promotion-form-container .banana-tab-input .banana-input-item input.promotion-form-contact-input{
    width: 50%;
    padding: 10px;
    border-radius: 8px;
    border: 2px solid #E5E5E5;
    background: var(--main-light-gray-color);
    font-weight: 400;
    font-size: 1rem;
    line-height: 150%;
    color: #888888;
}
.promotion-form-section .promotion-form-container .banana-tab-input.promotion-contact-block .banana-input-item:not(:last-child){
    margin-bottom: 16px;
}  
/* Mark input boxes that gets an error on validation: */
.promotion-form-section .promotion-form-container .banana-tab-input .banana-input-item input.promotion-form-contact-input.invalid,
.promotion-form-section .promotion-form-container .banana-tab textarea.invalid {
background-color: #ffdddd;
}
/*Multi Step form (end)*/
/*Promotion form section (end)*/

/*Contact section (start)*/
.contact-section .banana-section-container{
    padding-top: 90px;
    padding-bottom: 150px;
}
.contact-section .banana-section-container .banana-form-block{
    margin-top: 70px;
}
.contact-section .banana-form-block .banana-form-container{
    background: var(--main-white-color);
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.08);
    border-radius: 16px;
    padding: 50px 40px 40px 40px;
}
.contact-section .banana-form-block .banana-form-container .banana-contact-form-textarea span{
    display: block;
    position: relative;
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    color: var(--main-gray-color);
    padding: 0px 5px;
    margin-bottom: 16px;
}
.contact-section .banana-form-block .banana-form-container .banana-contact-form-textarea textarea{
    padding: 10px 5px 10px 5px;
    width: 100%;
    min-height: 100px;
    background: #FAFAFA;
    border: 2px solid #F1F1F1;
    box-sizing: border-box;
    border-radius: 8px;
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    color: var(--main-gray-color);
    margin-bottom: 40px;
}
.contact-section .banana-form-block .banana-form-container .banana-contact-form-textarea textarea:focus-visible{
    outline-color: var(--main-gray-color);
}
.contact-section .banana-form-block .banana-form-container .banana-contact-detail-container{
    margin-top: 50px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    align-content: center;
}
.contact-section .banana-form-block .banana-form-container .banana-contact-detail-container .hours-of-work,
.contact-section .banana-form-block .banana-form-container .banana-contact-detail-container .banana-text-link{
    font-weight: 400;
    font-size: 16px;
    line-height: 130%;
    color: var(--main-black-color);
}
a.banana-text-link{
    padding: 0px 0px 2px 0px;
    position: relative;
}
a.banana-text-link::after{
    content: "";
    position: absolute;
    bottom: 0px;
    left: 0;
    width: 0;
    height: 2px;
    background-color: var(--main-red-color);
    transition: all 0.5s;
}
a.banana-text-link:hover::after,
a.banana-text-link:active::after,
a.banana-text-link:focus::after{
    width: 100%;
}
.contact-section .banana-form-block .banana-form-container .banana-contact-detail-container .banana-messenger-container a.banana-icon-link{
    display: inline-block;
    position: relative;
    width: 30px;
    height: 30px;
}
.contact-section .banana-form-block .banana-form-container .banana-contact-detail-container .banana-messenger-container a.banana-icon-link:not(:last-child){
    margin-right: 16px;
}
.contact-section .banana-form-block .banana-form-container .banana-contact-detail-container .banana-messenger-container a.banana-icon-link svg path{
    transition: all 0.5s;
}
.contact-section .banana-form-block .banana-form-container .banana-contact-detail-container .banana-messenger-container a.banana-icon-link:hover svg path,
.contact-section .banana-form-block .banana-form-container .banana-contact-detail-container .banana-messenger-container a.banana-icon-link:active svg path,
.contact-section .banana-form-block .banana-form-container .banana-contact-detail-container .banana-messenger-container a.banana-icon-link:focus svg path{
    fill: var(--main-red-color);
    transition: all 0.5s;
}
.contact-section .banana-form-block .banana-form-container .banana-contact-detail-container .hours-of-work{
    margin-right: 10px;
}
.contact-section .banana-form-block .banana-form-container .banana-contact-detail-container .banana-messenger-container{
    margin-right: 10px;
    margin-left: 10px;
}
.contact-section .banana-form-block .banana-form-container .banana-contact-detail-container .banana-text-link{
    margin-left: 10px;
}
.contact-section .banana-image-column{
    justify-content: flex-end;
}
/*Contact section (end)*/

/*Footer (start)*/
.banana-footer{
    background-color: var(--main-black-color);
    padding: 60px 0px 0px 0px;
}
.banana-footer .banana-logo-container{
    font-weight: 900;
    font-size: 18px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--main-white-color);
}
.banana-footer .banana-desctop-menu .nav-link{
    font-weight: 400;
    font-size: 1rem;
    line-height: 150%;
    color: var(--main-white-color);
    margin: 10px 30px;
    padding: 0px 0px 2px 0px;
    position: relative;
}
.banana-footer .banana-desctop-menu a.nav-link::after,
.banana-footer .banana-footer-contact-block a.banana-text-link::after,
.banana-footer .banana-author-container .container .banana-author-block a::after{
    content: "";
    position: absolute;
    bottom: 2px;
    left: 0;
    width: 0;
    height: 2px;
    background-color: var(--main-red-color);
    transition: all 0.5s;
}
.banana-footer .banana-desctop-menu a.nav-link:hover::after,
.banana-footer .banana-desctop-menu a.nav-link:active::after,
.banana-footer .banana-desctop-menu a.nav-link:focus::after,
.banana-footer .banana-footer-contact-block a.banana-text-link:hover::after,
.banana-footer .banana-footer-contact-block a.banana-text-link:active::after,
.banana-footer .banana-footer-contact-block a.banana-text-link:focus::after,
.banana-footer .banana-author-container .container .banana-author-block a:hover::after,
.banana-footer .banana-author-container .container .banana-author-block a:active::after,
.banana-footer .banana-author-container .container .banana-author-block a:focus::after{
    width: 100%;
}
.banana-footer .banana-footer-contact-block a:not(:last-child){
    margin-right: 40px;
}
.banana-footer .banana-footer-contact-block a.banana-text-link{
    font-weight: 400;
    font-size: 1rem;
    line-height: 150%;
    color: var(--main-white-color);
    padding: 0px 0px 5px 0px;
    position: relative;
}
.banana-footer .banana-footer-contact-block .banana-icon-link svg path{
    transition: all 0.5s;
}
.banana-footer .banana-footer-contact-block .banana-icon-link{
    position: relative;
    display: inline-block;
}
.banana-footer .banana-footer-contact-block .banana-icon-link:hover svg path{
    fill: var(--main-red-color);
    transition: all 0.5s;
}
.banana-footer .banana-author-container{
    margin-top: 60px;
    border-top: 1px solid #ffffff;
}
.banana-footer .banana-author-container .container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-content: center;
    align-items: center;
    padding-top: 20px;
    padding-bottom: 20px;
}
.banana-footer .banana-author-container .banana-rights-block, .banana-author-container .banana-author-block{
    display: block;
}
.banana-footer .banana-author-container p, .banana-author-container a{
    color: #ffffff;
    margin: 0px;
    padding: 0px;
    text-align: center;
}
.banana-footer .banana-author-container .container .banana-author-block a{
    position: relative;
    padding-bottom: 5px;
}
/*Footer (end)*/

/*Modal window (start)*/
.banana-modal-contact-form .modal-content,
.banana-achievement-modal .modal-content{
    border-radius: 16px;
}
.banana-modal-contact-form .modal-content .modal-header,
.banana-achievement-modal .modal-content .modal-header{
    border: 0;
}
.banana-modal-contact-form .modal-content .modal-body,
.banana-achievement-modal .modal-content .modal-body{
    padding: 10px 50px 50px 50px;
}
.btn-close:focus,
.banana-button:focus{
    outline: 0;
    box-shadow: none;
    
}
/*Modal window (end)*/
.banana-sending-error,
.banana-sending-modal-error,
.banana-tab-sending-error{
    font-size: 0.8rem;
    font-weight: 400;
    padding: 10px;
    margin-top: 20px;
    border: 2px solid red;
    border-radius: 8px;
    color: red;
    display: none;
}
/*============ MAIN STYLE (END) ============*/

/*============ ADAPTIVE STYLE (START) ============*/
/*Max width - 1199px*/
@media (max-width: 1199px){
    .first-screen-section {
        min-height: 700px;
    }
    .first-screen-section .banana-section-container{
        padding-top: 90px;
    }
    h1.banana-h1-title {
        font-size: 3rem;
    }
    .first-screen-section .banana-form-container {
        padding: 35px;
    }
    .advertising-benefits-section .benefits-container {
        width: 55%;
    }
    .advertising-benefits-section:after {
        width: 55%;
    }
    .tariffs-section .tariffs-item {
        padding: 40px 20px 40px 20px;
    }
    .tariffs-section .tariffs-item-container:first-child{
        padding-right: 8px;
    }
    .tariffs-section .tariffs-item-container:nth-child(2){
        padding-left: 8px;
        padding-right: 8px;
    }
    .tariffs-section .tariffs-item-container:nth-child(3){
        padding-left: 8px;
    }
    .answers-section .banana-accordion {
        width: 100%;
    }
    .contact-section .banana-image-column{
        justify-content: center;
    }
    .banana-footer .banana-desctop-menu .nav-link {
        margin: 10px 15px;
    }
    .banana-footer .banana-footer-contact-block a:not(:last-child) {
        margin-right: 30px;
    }
}
/*Max width - 991px*/
@media (max-width: 991px){
    .banana-header .banana-desctop-menu{
        display: none;
    }
    .banana-gamburger-link{
        display: block;
    }
    .first-screen-section .banana-section-container {
        padding-top: 150px;
    }
    .first-screen-section .banana-form-column{
        margin-top: 50px;
    }
    .first-screen-section {
        min-height: 1000px;
    }
    .banana-section-container {
        padding: 30px;
    }
    .about-agency-section .feature-container {
        margin-left: 0px;
    }
    .about-agency-section .feature-container .feature-item{
        padding-right: 25px;
    }
    .tariffs-section .tariffs-item-container:first-child{
        padding-right: 0px;
    }
    .tariffs-section .tariffs-item-container:nth-child(2){
        padding-left: 0px;
        padding-right: 0px;
    }
    .tariffs-section .tariffs-item-container:nth-child(3){
        padding-left: 0px;
    }
    .tariffs-section .tariffs-container .tariffs-item-container:not(:last-child){
        margin-bottom: 40px;
    }
    .tariffs-section .tariffs-item-container:nth-child(2) .tariffs-item {
        border: 2px solid var(--main-white-color);
    }
    .our-works-section .banana-work-container{
        width: 100%;
    }
    .our-works-section .banana-work-container:nth-child(odd){
        padding-right: 0px;
        padding-bottom: 40px;
    }
    .our-works-section .banana-work-container:nth-child(even){
        padding-left: 0px;
        padding-bottom: 40px;
    }
    .algorithm-section .banana-algorithm-container .banana-algorithm-item {
        font-size: 1.3rem;
    }
    .promotion-form-section .promotion-form-container button.banana-promotion-form-button{
        width: 45%;
        min-width: auto;
    }
    .promotion-form-section .banana-steps-indicator-container .banana-step{
        padding: 0px 25px 25px 25px;
    }
    .contact-section .banana-section-container {
        padding-bottom: 100px;
    }
    .banana-footer .container{
        flex-wrap: wrap;
    }
    .banana-footer .banana-desctop-menu{
        width: 100%;
        order: 1;
        justify-content: center;
        margin-bottom: 40px;
    }
    .banana-footer .banana-logo-link{
        order: 2;
    }
    .banana-footer .banana-footer-contact-block{
        order: 3;
    }
}
/*Max width - 767px*/
@media (max-width: 767px){
    h1.banana-h1-title{
        font-size: 3rem;
    }
    h2.banana-h2-title{
        font-size: 2rem;
    }
    h3.banana-h3-title{
        font-size: 2rem;
    }
    h4.banana-h4-title {
        font-size: 1.75rem;
    }
    h5.banana-h5-title {
        font-size: 1rem;
    }
    p.banana-subtitle{
        font-size: 1.125rem;
    }
    .first-screen-section {
        min-height: 900px;
    }
    .first-screen-section:after {
        width: 80%;
    }
    .about-agency-section .feature-container .feature-item .feature-image{
        width: 50px;
        height: 50px;
        position: relative;
        display: block;
    }
    .about-agency-section .feature-container .feature-item .feature-image img{
        height: 100%;
        max-width: 80px;
        max-height: 80px;
    }
    .about-agency-section .feature-container .feature-item .feature-descr {
        margin-left: 20px;
    }
    .about-agency-section .feature-container .feature-item{
        width: 100%;
        padding-right: 0px;
        align-items: center;
    }
    .about-agency-section:after {
        width: 70%;
    }
    .about-agency-section:before {
        width: 70%;
    }
    .advertising-benefits-section .benefits-container {
        width: 100%;
    }
    .advertising-benefits-section:after{
        display: none;
    }
    .advertising-benefits-section .banana-section-container {
        padding-bottom: 0px;
    }
    .advertising-benefits-section .banana-benefits-mibile-phone{
        display: block;
    }
    .answers-section .banana-accordion {
        margin-top: 30px;
    }
    .algorithm-section .banana-section-container {
        padding-bottom: 120px;
    }
    .algorithm-section .banana-algorithm-container {
        margin-top: 60px;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .algorithm-section .banana-algorithm-container .banana-algorithm-item{
        display: flex;
        flex-direction: row;
        padding-left: 55px;
        padding-right: 0px;
        padding-bottom: 0px;
        text-align: left;
        max-width: 100%;
    }
    .algorithm-section .banana-algorithm-container .banana-algorithm-item:not(:last-child){
        margin-bottom: 70px
    }
    .algorithm-section .banana-algorithm-container .banana-algorithm-item:after {
        left: 0;
        bottom: 0;
        top: 50%;
        transform: translateY(-50%) rotate(90deg);
        -webkit-transform: translateY(-50%) rotate(90deg);
        -ms-transform: translateY(-50%) rotate(90deg);
    }
    .algorithm-section .banana-algorithm-container:after {
        content: '';
        width: 1px;
        height: 100%;
        background-color: #888888;
        position: absolute;
        bottom: 0px;
        left: 19px;
    }
    .promotion-form-section .promotion-form-container {
        padding: 60px 20px;
    }
    .promotion-form-section .banana-steps-indicator-container .banana-step {
        padding: 0px 15px 15px 15px;
    }
    .contact-section .banana-image-column {
        margin-top: 50px;
    }
    .banana-footer .container{
        flex-direction: column;
    }
    .banana-footer .container .banana-logo-link{
        order: 1;
    }
    .banana-footer .container .banana-desctop-menu{
        order: 2;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin-top: 50px;
        margin-bottom: 60px;
    }
    .banana-footer .container .banana-footer-contact-block{
        order: 3;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }
    .banana-footer .container .banana-footer-contact-block .banana-text-link{
        margin-right: 0px;
        width: 100%;
        text-align: center;
        margin-bottom: 20px;
    }
    .banana-footer .banana-desctop-menu .nav-link {
        margin: 8px;
    }
    .banana-footer .banana-author-container .container{
        flex-direction: column;
    }
    .banana-footer .banana-author-container .container .banana-author-block{
        margin-top: 20px;
    }
    .our-works-section:before,
    .answers-section:before,
    .answers-section:after{
        display: none;
    }
}
/*Max width - 575px*/
@media (max-width: 575px){
    .banana-section-container {
        padding: 15px;
    }
    h4.banana-h4-title{
        font-size: 1.4rem;
    }
    .about-agency-section .feature-container .feature-item .feature-descr{
        font-size: 1rem;
    }
    .our-works-section .banana-section-container {
        padding-bottom: 50px;
    }
    .answers-section .banana-accordion .accordion-button {
        font-size: 1.125rem;
    }
    .promotion-form-section .banana-steps-indicator-container .banana-step {
        font-size: 0.6rem;
    }
    .promotion-form-section .banana-section-container {
        padding-bottom: 120px;
    }
    .contact-section .banana-form-block .banana-form-container .banana-contact-detail-container{
        flex-direction: column;
        justify-content: center;
    }
    .contact-section .banana-form-block .banana-form-container .banana-contact-detail-container .hours-of-work{
        margin: 0px;
    }
    .contact-section .banana-form-block .banana-form-container .banana-contact-detail-container .banana-messenger-container{
        margin: 25px 0px 25px 0px;
    }
    .contact-section .banana-form-block .banana-form-container .banana-contact-detail-container .banana-text-link{
        margin: 0px;
    }
    .banana-header .banana-header-button{
        display: none;
    }
    .banana-header{
        padding-left: 15px;
        padding-right: 15px;
    }
    .promotion-form-section .promotion-form-container .banana-tab-input .banana-input-item input.promotion-form-contact-input {
        width: 100%;
    }
}
@media (max-width: 399px){
    h1.banana-h1-title {
        font-size: 1.75rem;
    }
    h2.banana-h2-title{
        font-size: 1.5rem;
    }
    .first-screen-section .banana-form-container {
        padding-left: 20px;
        padding-right: 20px;
    }
    .banana-contact-form .banana-contact-form-item .banana-button,
    .tariffs-section .tariffs-item .banana-button-container,
    .promotion-form-section .promotion-form-container button.banana-promotion-form-button{
        font-size: 12px;
    }
    .our-works-section .banana-title-container .banana-icon-container {
        margin-right: 20px;
        width: 30px;
        height: 30px;
    }
    .our-works-section .banana-work-container .banana-work-item {
        padding-left: 20px;
        padding-right: 20px;
    }
    h3.banana-h3-title {
        font-size: 1.25rem;
    }
    .our-works-section .banana-work-item .banana-site-name {
        font-size: 1.25rem;
    }
    .answers-section .banana-accordion .accordion-button {
        padding: 20px 15px 20px 15px;
    }
    .answers-section .banana-accordion .accordion-body {
        padding: 5px 15px 20px 15px;
    }
    .promotion-form-section .banana-steps-indicator-container .banana-step {
        padding: 0px 7px 10px 7px;
    }
    .contact-section .banana-form-block .banana-form-container {
        padding: 40px 20px 40px 20px;
    }
    .banana-modal-contact-form .modal-content .modal-body,
    .banana-achievement-modal .modal-content .modal-body{
        padding: 10px 20px 50px 20px;
    }
}
/*============ ADAPTIVE STYLE (END) ============*/