img, svg {
    vertical-align: middle;
}

h1, h2, h3, p {
    margin-top: 0;
    margin-bottom: 0;
}

main {
    margin-top: 0 !important;
    color: #FFF;
    font-family: Inter;
}

/* block 1 */
.block1 {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), var(--bbe-business-bg, url('../images/block1.webp'));
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 850px;
}

.block1 .wrapper {
    backdrop-filter: brightness(53%);
    -webkit-backdrop-filter: brightness(53%);
    height: inherit;
}

.block1 .title {
    width: 970px;
    text-align: center;
    font-size: 62px;
    font-style: normal;
    font-weight: 800;
    line-height: 64px; /* 103.226% */
    text-transform: uppercase;
    padding-top: 235px;
}

.block1 .dest {
    width: 900px;
    margin-top: 20px;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 30px; /* 125% */
}

.block1 .dest .highlights {
    color: #6DFFBC;
    font-size: 24px;
    font-style: normal;
    font-weight: 900;
    line-height: 30px;
    text-transform: uppercase;
    text-wrap: nowrap;
}

.dest2 {
    width: 487px;
    margin-top: 167px;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 26px; /* 162.5% */
}

.dest2 span {
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
}

.inputBox {
    width: 972px;
    height: 84px;
    background-color: #6DFFBC;
    padding: 6px;
    margin-top: 30px;
    transition: background-color .4s ease-out;
}

.inputBox:hover,
.inputBox:hover .wrapper button,
.btnCompare:hover {
    background-color: #8ca2f5;
    transition: background-color 0.4s ease-out;
}

.inputBox .wrapper {
    width: 100%;
    height: 100%;
    background-color: #FFF;
}

.inputBox .wrapper .home-pin {
    width: 32px;
    height: 32px;
    margin: 20px 18px;
}


.inputBox .wrapper input {
    border: 0;
    outline: none;
    font-size: 16px;
    font-weight: 700;
}

.inputBox .wrapper button, .btnCompare {
    width: 304px;
    height: 60px;
    background-color: #6DFFBC;
    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px; /* 150% */
    text-transform: uppercase;
    padding: 14px 20px;
    border: 0;
    margin-top: 6px;
    margin-right: 6px;
    cursor: pointer;
}
/* end block 1 */
/* block 2 */
.block2 {
    background-color: #F2F4F9;
    padding-top: 100px;
    padding-bottom: 60px;
    color: #0A0A0A;
}
.block2 .title {
    width: 605px;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 40px; /* 125% */
}

.block2 .title {
    margin-bottom: 40px;
}

.block2 .suppliers {
    display: flex;
    max-width: 800px;
    gap: 24px;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
/* end block 2 */
/* block 3 */
.block3 {
    background-color: #FFF;
    color: #0A0A0A;
}

.block3 .box {
    background-color: #f2f4f8;
    padding: 30px;
}

.block3 .box h3 {
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 32px;
    text-align: left;
    margin-bottom: 8px;
}

.block3 .box p {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    max-width: 251.6px;
    text-align: left;
    margin-bottom: 0;
}

.block3 .box .polygon {
    margin-right: 20px;
}

.block3 .box .polygon span {
    position: absolute;
    font-size: 25.6px;
    font-style: normal;
    font-weight: 700;
    color: #FFF;
    margin-left: 26px;
    margin-top: 20px;
}

.block3 .box-price {
    width: 413px;
    background-color: #f2f4f8;
    padding: 30px 40px 40px 40px;
    margin-top: 60px;
    margin-bottom: 120px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    cursor: pointer;
}

.block3 .image-wrapper {
    position: relative;
}

.block3 .box-price .icon {
    position: absolute;
    top: 25%;
    left: 25%;
    display: block;
}

.block3 .image-wrapper img {
    max-width: 340px;
}

.block3 .image-hover {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity .5s ease-out;
}

.block3 .electricity:hover .image-hover, .block3 .gas:hover .image-hover, .block3 .energy:hover .image-hover {
    opacity: 1;
}

.block3 .title {
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 40px;
    margin-bottom: 40px;
}

.block3 .sm-title {
    margin-top: 60px;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px; /* 150% */
    text-transform: uppercase;
}

.block3 .title2 {
    max-width: 733px;
    margin-top: 120px;
    font-size: 60px;
    font-style: normal;
    font-weight: 700;
    line-height: 68px;
    margin-bottom: 8px;
}

.block3 .box-price h3 {
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 40px;
    margin-top: 20px;
    margin-bottom: 10px;
    transition: text-decoration 0.5s ease;
    text-decoration: underline solid transparent;
    text-underline-offset: 7px;
    text-decoration-thickness: 2px;
}

.block3 .box-price:hover h3 {
    text-decoration: underline;
    text-decoration-thickness: 2px;
}

.block3 .box-price p {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin-bottom: 16px;
}

.block3 .box-price button {
    height: 60px;
    background-color: #6DFFBC;
    border: 0;
    outline: none;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px; /* 150% */
    text-transform: uppercase;
    color: #000;
    transition: background-color 0.4s ease-out;
    cursor: pointer;
}

.block3 .box-price button:hover {
    background-color: #8ca2f5;
}
/* end block 3 */
/* block 4 */
.block4 {
    background-image: url('../images/block4.webp');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding: 120px 70px;
}
.block4 .box {
    background-color: #ffffff;
    color: #000000;
    padding: 37px 60px;
}
.block4 .box .title {
    font-size: 60px;
    font-style: normal;
    font-weight: 700;
    line-height: 68px;
    margin-bottom: 20px;
}
.block4 .box p {
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 36px;
}

.block4 .box .image4 {
    max-width: 478.77px;
}

.block4 .box button {
    background-color: rgba(0, 0, 0, 0.08);
    border: 0;
    padding: 20px 24px;
    color: #0A0A0A;
    font-size: 26px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px; /* 123.077% */
    text-transform: uppercase;
    margin-bottom: 20px;
    transition: background-color 0.4s ease-out;
}

.block4 .box button:hover {
    background-color: rgba(0, 0, 0, 0.15);
}

.block4 .box .email {
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
}

.block4 .box .email a {
    color: #5A75DD;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
}

.block4 .box .email a:hover {
    text-decoration: underline;
}

.block4.contact-us .btnComparePrices {
    width: 183px;
}

.block4.contact-us {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../images/block4.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 850px;
    padding-top: 150px;
}

.block4.contact-us .box .email {
    line-height: 24px;
}

.contact-us .extraBlock {
    margin-top: 30px;
}

.contact-us .extraBlock .extra-title {
    color: var(--3, #0A0A0A);
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px; /* 155.556% */
}

.block4.contact-us .box .email .write {
    font-weight: 400;
}

/* end block 4 */
/* block 5 */
.block5 {
    color: #0A0A0A;
}

.block5 h2 {
    width: 840px;
    font-size: 60px;
    font-style: normal;
    font-weight: 700;
    line-height: 68px; /* 113.333% */
    margin-top: 120px;
    margin-bottom: 60px;
}

.block5 .box {
    color: #FFF;
    width: 415px;
    background: url('../images/business-cards.webp');
    background-position: center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    margin-bottom: 120px;
    cursor: pointer;
}

.block5 .box .wrapper {
    width: 100%;
    height: 100%;
    padding: 30px;
    backdrop-filter: brightness(100%);
    -webkit-backdrop-filter: brightness(100%);
    transition: all 1s ease;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.block5 .box:hover .wrapper {
    backdrop-filter: brightness(53%);
    -webkit-backdrop-filter: brightness(53%);
}

.block5 .box2 {
    background: url('../images/business-cards2.webp');
}

.block5 .box3 {
    background: url('../images/business-cards3.webp');
}

.block5 .box:hover h3 {
    color: #6DFFBC;
    text-decoration: underline;
    text-decoration-thickness: 4px;
}

.block5 .box h3 {
    font-size: 60px;
    font-style: normal;
    font-weight: 700;
    line-height: 68px;
    margin-top: 250px;
    text-transform: capitalize;
    transition: text-decoration 0.5s ease;
    text-decoration: underline solid transparent;
    text-decoration-thickness: 4px;
    text-underline-offset: 13px;
    margin-bottom: 8px;
}

.block5 .box p {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin-bottom: 16px;
}

.block5 .box button {
    height: 60px;
   background-color: #6DFFBC;
   border: 0;
   padding: 14px 20px;
   font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px; /* 150% */
    text-transform: uppercase;
    transition: background-color 0.4s ease-out;
    color: #000;
    cursor: pointer;
}

.block5 .box button:hover {
    background-color: #8ca2f5;
}
/* end block 5 */
/* block 6 */
.block6 {
    background-color: #000;
    padding-bottom: 120px;
}
.block6 h2 {
    width: 865px;
    font-size: 60px;
    font-style: normal;
    font-weight: 700;
    line-height: 68px;
    padding-top: 120px;
    margin-bottom: 30px;
}
.block6 p {
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 32px;
    transition: text-decoration 0.5s ease;
    text-decoration: underline solid transparent;
    text-decoration-thickness: 1.5px;
    text-underline-offset: 5px;
    margin-bottom: 16px;
}
.block6 .box:hover p {
    color: #6DFFBC;
    text-decoration: underline;
    text-decoration-thickness: 1.5px;
}
.block6 button {
    height: 60px;
    border: 0;
    padding: 14px 20px;
    background-color: #6DFFBC;
    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px; /* 150% */
    text-transform: uppercase;
    transition: background-color 0.4s ease-out;
    cursor: pointer;
}
.block6 button:hover {
    background-color: #8ca2f5;
}
.block6 .box {
    width: 413px;
    margin: 60px 0px;
}
.block6 .box img {
    width: 413px;
    height: 413px;
}
/* end block 6 */
/* block 7 */
.block7 {
    color: #0A0A0A;
    padding: 120px 0px;
    background-color: #F2F4F9;
}
.block7 h2 {
    font-size: 60px;
    font-style: normal;
    font-weight: 700;
    line-height: 68px;
    margin-bottom: 60px;
    width: 865px;
}

.block7 h2.has-dest {
    margin-bottom: 20px;
}

.block7 .dest {
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 32px; /* 133.333% */
    margin-bottom: 60px;
}

.block7 .accordion {
    width: 865px;
}
.accordion .accordion-item {
    margin-bottom: 10px;
    border: 0;
    padding: 30px 40px;
    cursor: pointer;
}

.accordion .accordion-button {
    box-shadow: none;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 32px;
    padding-right: 40px !important;
    cursor: pointer;
}

.accordion .accordion-button:not(.collapsed) {
    background-color: transparent;
    border: 0;
    box-shadow: none;
    color: #0A0A0A;
    padding-bottom: 12px !important;
}

.accordion .accordion-button::after {
    content: none;
}

.accordion .accordion-body {
    color: #0A0A0A;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    padding-right: 40px !important;
}

.accordion .accordion-body p {
    margin: 16px 0px;
}

.accordion .caret {
    padding: 18px;
    background: rgba(0, 0, 0, 0.08);
}
.caret .iconPlus, .caret .iconMulti {
    transition: 0.5s;
    width: 24px;
}

.caret:is(.collapsed) .iconPlus {
    transform: rotate(0deg);
    visibility: visible;
    opacity: 1;
}

.caret:not(.collapsed) .iconPlus {
    transform: rotate(90deg);
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s, opacity 1s linear;
}

.caret:is(.collapsed) .iconMulti {
    transform: rotate(-90deg);
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s, opacity 1s linear;
}

.caret:not(.collapsed) .iconMulti {
    transform: rotate(0deg);
    visibility: visible;
    opacity: 1;
}
/* end block 7 */
/* block 8 */
.block8 {
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), url('../images/block1.webp') lightgray 50% / cover no-repeat;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding: 80px 70px 50px 70px;
}
.block8 h2 {
    margin-top: 130px;
    font-size: 62px;
    font-style: normal;
    font-weight: 800;
    line-height: 64px; /* 103.226% */
    text-transform: uppercase;
}
.block8 p {
    margin-top: 20px;
    margin-bottom: 40px;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 32px;
}
.block8 p span {
    color: #6DFFBC;
    font-size: 24px;
    font-style: normal;
    font-weight: 800;
    line-height: 32px;
    text-transform: uppercase;
}
.block8 .inputBox {
    margin-bottom: 190px;
    width: 976px;
}
.block8 .phone {
    width: 460px;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 26px; /* 162.5% */
}
.block8 .phone span {
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px;
}
/* end block 8 */

#modalBBE, #modalBBE .modal-dialog {
    margin: 0;
}

#modalBBE .modal-dialog {
    max-width: 100%;
    height: 100vh;
}

#modalBBE .modal-dialog .modal-content {
    height: 100%;
}

#modalBBE .modal-dialog .modal-content .textBlock {
    background: #fff;
    color: #0A0A0A;
}

#modalBBE .modal-dialog .modal-content .textBlock .logoBlock {
    display: none;
}

#modalBBE .modal-dialog .modal-content .imageBlock {
    position: relative;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    display: flex;
    justify-content: flex-end;
}

#modalBBE .modal-dialog .modal-content .step1 .imageBlock {
    background: url('../images/bbe-modal/step1.webp');
}

#modalBBE .modal-dialog .modal-content .step2 .imageBlock {
    background: url('../images/bbe-modal/step2.webp');
}

#modalBBE .modal-dialog .modal-content .step3 .imageBlock {
    background: url('../images/bbe-modal/step3.webp');
}

#modalBBE .modal-dialog .modal-content .step4 .imageBlock {
    background: url('../images/bbe-modal/step4.webp');
}

#modalBBE .modal-dialog .modal-content .step {
    transition: opacity .2s linear 0s;
}

#modalBBE .modal-dialog .modal-content .step.opacity-0 {
    width: 100% !important;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}

#modalBBE .modal-dialog .modal-content .imageBlock .logoBlock {
    margin-top: 33px;
}

#modalBBE .modal-dialog .modal-content .wrapper {
    width: 650px;
}

#modalBBE .modal-dialog .modal-content .textBlock .wrapper {
    padding-top: 40px;
    padding-left: 70px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

#modalBBE .modal-dialog .modal-content .textBlock .wrapper .title {
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 40px; /* 125% */
    margin-top: 9px;
}

#modalBBE .step {
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px; /* 150% */
}

#modalBBE .step .link {
    color: #244AD7;
    text-decoration: underline;
    text-underline-offset: 4px;
}

#modalBBE .step .highlight {
    color: #244AD7;
}

#modalBBE .modal-dialog .modal-content .textBlock .btn-close {
    background-color: #f0f0f0;
    width: auto;
    height: auto;
    padding: 0;
    border-radius: 0;
    outline: none !important;
    box-shadow: none !important;
    margin-left: auto;
    margin-right: 0;
    display: block;
    margin-bottom: 20px;
}

#modalBBE .btnActions {
    padding-bottom: 60px;
}

#modalBBE .btnActions button {
    height: 60px;
    background: #6DFFBC;
    border: 0;

    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px; /* 150% */
    text-transform: uppercase;
    padding-left: 20px;
    padding-right: 20px;
    color: #000;
}

#modalBBE .btnActions button:hover {
    background: rgb(140, 162, 245);
}

#modalBBE .label {
    margin-bottom: 10px;
    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px; /* 150% */
}

#modalBBE .dropdown .btn {
    border: 1px solid #C3C3C3;
    height: 60px;
    border-radius: 0;

    overflow: hidden;
    color: #000;
    text-overflow: ellipsis;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px; /* 150% */
    transition: all .2s ease-in-out;
}

#modalBBE .dropdown .btn:hover,
#modalBBE .dropdown .btn:focus,
#modalBBE .dropdown .btn:active {
    border: 2px solid #000;
    box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.20);
}

#modalBBE .dropdown .btn span {
    max-width: 95%;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

#modalBBE .dropdown .dropdown-item {
    font-size: 15px;
    font-weight: 600;
}

#modalBBE .dropdown .dropdown-menu.show {
    display: block;
    border: 2px solid #000;
    border-radius: 0;
    box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.20);
    margin-top: 3px !important;
}

#modalBBE .dropdown .dropdown-toggle::after {
    border-top: 0.45em solid;
    border-right: 0.45em solid transparent;
    border-left: 0.45em solid transparent;
}

#modalBBE input {
    height: 60px;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    color: #000;
    padding: 24px 20px;
    border-radius: 0;
    border: 1px solid #C3C3C3;
    transition: all .2s ease-in-out;
    outline: none !important;
}

#modalBBE input:hover,
#modalBBE input:focus,
#modalBBE input:focus-visible,
#modalBBE input:active {
    border: 1px solid #000 !important;
    outline: 2px solid #000 !important;
    box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.20);
}

#modalBBE input.datepicker {
    text-transform: uppercase !important;
}

#modalBBE .form-check-input {
    background: url(../images/checkmark-gray2.svg);
    background-size: auto;
    background-position: center;
    background-repeat: no-repeat;
}

#modalBBE input.form-check-input:focus {
    outline: none !important;
    border: 1px solid #C3C3C3 !important;
    box-shadow:none !important
}

#modalBBE input.form-check-input:hover {
    background: url(../images/checkmark-black2.svg);
    background-size: auto;
    background-position: center;
    background-repeat: no-repeat;
    outline: 2px solid #000 !important;
    border: 1px solid #000 !important;
    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.30) !important;
}

#modalBBE input.form-check-input:checked[type=checkbox] {
    background: url(../images/checkmark-white2.svg) !important;
    background-size: auto !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-color: #000 !important;
    outline: 2px solid #000 !important;
    border: 1px solid #000 !important;
    box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.20) !important;
}

.input-2 {
    gap: 30px;
}

#modalBBE .input-icon {
    position: relative;
}

#modalBBE .input-icon .icon {
    position: absolute;
    top: 17px;
    right: 20px;
}

#modalBBE .box {
    display: flex;
    padding: 24px 30px;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    align-self: stretch;
    background: #F2F4F9;
    margin-top: 32px;
}

#modalBBE .textBlock .title {
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 40px; /* 125% */
}

#modalBBE .textBlock p {
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px; /* 155.556% */
}

#modalBBE .textBlock .box .title {
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 600 !important;
    line-height: 28px !important; /* 155.556% */
    margin-bottom: 10px;
}

#modalBBE .textBlock .box p {
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 24px !important; /* 150% */
}

.form-check-input {
    width: 32px !important;
    height: 32px !important;
    padding: 20px !important;
}

.form-check-input:checked {
    background-color: #000;
    border-color: #000;
    border: 2px solid #000 !important;
}

#modalBBE .errBorder {
    border: 1px solid #FF2B2B !important;
    outline: 2px solid #FF2B2B !important;
    box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.20);
}

#modalBBE .errBorder::placeholder {
    color: #FF2B2B;
    opacity: 1; /* Firefox */
}

#modalBBE .errBorder::-ms-input-placeholder { /* Edge 12-18 */
    color: #FF2B2B;
}

#modalBBE .errText, #modalBBE .errText > * {
    color: #FF2B2B !important;
}

#modalBBE .errBlock {
    display: flex;
    align-items: center;
    margin-top: 16px;
    color: #FF2B2B;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
}

#modalBBE .choose-price {
    gap: 20px;
}

#modalBBE .choose-price img {
    width: 150px;
    height: 150px;
}

#modalBBE .choose-price .price-wrapper {
    gap: 16px;
}

#modalBBE .choose-price .price-wrapper .btn {
    padding: 30px;
    border: 1px solid #C3C3C3;
    border-radius: 0;
    transition: all .2s ease-in-out;
}

#modalBBE .choose-price .price-wrapper span {
    color: #000;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    text-transform: uppercase;
}

#modalBBE .choose-price .price-wrapper .btn:hover {
    border: 3px solid #000;
    box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.20);
}

#modalBBE .choose-price .price-wrapper .btn.active {
    border: 5px solid #000;
    box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.20);
}

#modalBBE .step-label {
    text-transform: uppercase;
}

@media (max-width: 1440px) {
    .bbe-content {
        max-width: 1240px;
        min-width: 1240px;
    }
    .block3 .box-price, .block5 .box {
        width: 31.7%;
    }

    .block3 .box-price {
        padding: 30px;
    }

    .block3 .box-price .image-wrapper img {
        width: 100%;
    }

    .block3 .box-price .icon {
        width: 50%;
    }

    .block3 .box .d-flex .ms-2 {
        margin-left: 0 !important;
    }
    .block6 .box img {
        width: 370px;
        height: 370px;
    }
}

@media (max-width: 1380px) {
    .bbe-content {
        max-width: 1200px;
        min-width: 1200px;
    }
}

@media (max-width: 1360px) {
    .bbe-content {
        max-width: 1180px;
        min-width: 1180px;
    }
}

@media (max-width: 1340px) {
    .bbe-content {
        max-width: 1160px;
        min-width: 1160px;
    }

    /* .block5 .box {
        width: 350px;
    } */

    .block6 .box img {
        width: 350px;
        height: 350px;
    }

    #modalBBE .modal-dialog .modal-content .wrapper {
        width: 95%;
        padding-left: 0px !important;
    }

    #modalBBE .modal-dialog .modal-content .textBlock .wrapper {
        padding-left: 30px !important;
    }
}

@media (max-width: 1320px) {
    .bbe-content {
        max-width: 1140px;
        min-width: 1140px;
    }
}

@media (max-width: 1280px) {
    .bbe-content {
        max-width: 1100px;
        min-width: 1100px;
    }
    .block3 .box-price, .block5 .box {
        width: 32%;
    }
}

@media (max-width: 1230px) {
    .bbe-content {
        max-width: 97%;
        min-width: 97%;
    }

    .block3 .box {
        width: auto !important;
    }

    .block6 .box {
        width: 32%;
    }

    .block6 .box img {
        width: 100%;
        height: auto;
    }

}

@media (max-width: 1170px) {
    .block4 {
        padding-left: 5px;
        padding-right: 5px;
    }
}

@media (max-width: 1120px) {
    .block4 {
        padding-left: 5px;
        padding-right: 5px;
    }

    .block8 {
        padding-left: 5px;
        padding-right: 5px;
    }
}

@media (max-width: 1060px) {
    .block3 .box-price {
        padding: 20px;
    }
    .block5 .box h3 {
        font-size: 40px;
    }
    .block6 p {
        font-size: 20px;
    }
}

@media (max-width: 1040px) {
    .block3 .box {
        padding: 15px;
    }
    .block4 .box {
        padding: 20px;
    }
    .block4 .box .title {
        font-size: 45px;
    }
}


@media (max-width: 1020px) {
    .block1 .title, .block8 h2 {
        font-size: 52px;
    }

    .block3 .title2, .block5 h2, .block6 h2, .block7 h2 {
        font-size: 50px;
    }
    .inputBox, .block8 .inputBox {
        width: 100%;
    }

    .inputBox .wrapper button {
        width: 312px;
    }

    #modalBBE .btnActions {
        padding-bottom: 10px;
    }
}

@media (max-width: 992px) {
    .block1 .title, .block1 .dest {
        width: 100%;
    }

    .block5 .box .wrapper {
        padding: 20px;
    }
    .block5 .box h3 {
        margin-top: 80px;
        line-height: 50px;
    }
}

@media (max-width: 940px) {
    .block1 .title, .block8 h2 {
        font-size: 42px;
    }
    .block3 .title2, .block5 h2, .block6 h2, .block7 h2 {
        font-size: 40px;
    }
    .block3 .box {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 12px;
    }
    .block3 .box h3 {
        font-size: 20px;
    }
    .block3 .box-price h3 {
        font-size: 24px;
    }
    .block4 .box .title {
        font-size: 40px;
    }
    .block6 p {
        font-size: 18px;
        text-align: center;
    }
    .accordion .accordion-button {
        font-size: 20px;
    }
    .inputBox .wrapper button {
        width: 325px;
    }
}

@media (max-width: 910px) {
    .block7 h2, .block5 h2 {
        width: 100%;
    }
    .block7 .accordion {
        width: 90%;
    }
    .accordion .accordion-item {
        padding: 20px;
    }
}

@media (max-width: 882px) {
    .block6 h2, .block7 h2 {
        width: 100%;
    }
}

@media (max-width: 860px) {
    .inputBox .wrapper button {
        min-width: 230px;
    }
    .block3 .box-price, .block5 .box .wrapper {
        padding: 10px;
    }

    #modalBBE .modal-dialog .modal-content .textBlock {
        width: 100% !important;
    }

    #modalBBE .modal-dialog .modal-content .imageBlock {
        display: none !important;
    }

    #modalBBE .modal-dialog .modal-content .textBlock .wrapper {
        padding-left: 0px !important;
        width: 96% !important;
        margin-left: auto;
        margin-right: auto;
        padding-top: 15px;
    }

    #modalBBE .modal-dialog .modal-content .textBlock .logoBlock {
        display: block !important;
    }

    #modalBBE .modal-dialog .modal-content .mb-header {
        display: flex;
        margin-bottom: 24px;
    }

    #modalBBE .modal-dialog .modal-content .textBlock .wrapper .title {
        font-size: 28px;
        font-style: normal;
        font-weight: 700;
        line-height: 36px; /* 128.571% */
    }

    #modalBBE .modal-dialog {
        max-width: 100%;
        height: 100vh;
    }
}


@media (max-width: 820px) {
    .block4 .image4 {
        width: 380px;
    }
}

@media (max-width: 780px) {
    .block5 .box button {
        padding: 14px 5px;
    }
}

@media (max-width: 768px) {
    .block3 .box {
        padding: 20px;
    }
    .block3 .box p {
        max-width: 100%;
    }
    .block3 .box-price {
        width: 413px;
        background-color: #f2f4f8;
        padding: 30px 40px 40px 40px;
        margin-top: 15px;
        margin-bottom: 15px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    .block3 .box-price h3 {
        font-size: 32px;
    }
    .block3 .d-flex.flex-column.flex-md-row,
    .block5 .d-flex.flex-column.flex-md-row,
    .block6 .d-flex.flex-column.flex-md-row {
        align-items: center;
    }
    .block4 .box {
        text-align: center;
    }
    .block4.contact-us {
        height: auto;
    }
    .block4.contact-us .box .email, .contact-us .extraBlock .extra-title {
        text-align: left;
    }
    .block5 .box {
        width: 415px;
        margin-bottom: 30px;
    }
    .block5 .box .wrapper {
        padding: 40px;
    }
    .block5 .box h3 {
        font-size: 60px;
        line-height: 68px;
        margin-top: 152px;
    }
    .block6 .box {
        width: 413px;
        margin: 30px 0px;
    }
    .block6 p {
        font-size: 24px;
    }
}

@media (max-width: 650px) {
    .block1 .title {
        padding-top: 130px;
    }
}

@media (max-width: 640px) {
    .block2 .title {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .inputBox {
        height: 60px;
        padding: 4px;
    }
    .inputBox .wrapper {
        flex-direction: column;
    }
    .inputBox .wrapper input {
        height: 51px;
        text-align: center;
    }
    .inputBox .wrapper .home-pin {
        width: 24px;
        height: 24px;
        margin: 14px;
        position: absolute;
    }
    .inputBox .wrapper button {
        display: none !important;
    }
    .block8 .inputBox {
        margin-bottom: 8px;
    }
    .block8 .btnCompare {
        margin-bottom: 102px;
    }
    .btnCompare {
        display: flex !important;
        width: 100%;
        margin: 0;
        margin-top: 8px;
    }

    #modalBBE .choose-price img {
        width: 100px;
        height: 100px;
    }

    #modalBBE .choose-price .price-wrapper .btn {
        padding: 20px;
    }
}

@media (max-width: 512px) {
    .bbe-content {
        max-width: 94.6%;
        min-width: 94.6%;
    }

    .inputBox .wrapper input {
        text-align: center;
        padding-bottom: 1px;
    }
    .block1 {
        height: auto;
        padding-bottom: 25px;
    }
    .block1 .title {
        font-size: 52px;
        font-weight: 800;
        line-height: 52px;
        padding-top: 130px;
    }
    .block1 .dest {
        font-size: 20px;
        line-height: 28px;
    }
    .block1 .dest .highlights {
        background-color: transparent;
    }
    .block1 .dest2 {
        margin-top: 100px;
        width: 100%;
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 18px;
    }
    .block1 .dest2 span {
        font-size: 14px;
        font-style: normal;
        font-weight: 700;
        line-height: 18px;
        text-decoration-line: underline;
        text-underline-offset: 3px;
        display: block;
    }
    .block1 .dest2 span a {
        text-underline-offset: 3px;
    }
    .block2 {
        padding: 40px 0px;
    }
    .block2 .title {
        font-size: 28px;
        font-style: normal;
        font-weight: 700;
        line-height: 36px;
    }
    .block2 .title {
        margin-bottom: 30px;
    }

    .block2 .suppliers img {
        width: 110px;
        height: 130px;
    }
    .block3 {
        padding-bottom: 30px;
    }
    .block3 .sm-title {
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
    }
    .block3 .title {
        margin-top: 8px;
        font-size: 28px;
        font-style: normal;
        font-weight: 700;
        line-height: 36px;
        margin-bottom: 30px;
    }
    .block3 .box h3 {
        font-style: normal;
        font-weight: 600;
        line-height: 30px;
        margin-bottom: 4px;
    }
    .block3 .box p {
        font-size: 15px;
        font-weight: 400;
        line-height: 22px;
    }
    .block3 .polygon img {
        width: 60px;
        height: 70px;
    }
    .block3 .box .polygon span {
        font-size: 19.2px;
        font-style: normal;
        font-weight: 700;
        line-height: 19.2px;
        margin-left: 24px;
        margin-top: 24px;
    }

    .block3 .title2 {
        margin-top: 80px;
        margin-bottom: 30px;
        line-height: 48px;
    }
    .block3 .box-price {
        padding: 20px;
        width: 100%;
    }
    .block3 .box-price h3 {
        font-size: 28px;
        line-height: 36px;
    }
    .block3 .box-price p {
        font-size: 15px;
        line-height: 22px;
    }
    .block3 .box-price .image-wrapper
    {
        display: flex;
        justify-content: center;
    }
    .block3 .box-price .image-wrapper img {
        width: 340px;
        height: 340px;
    }
    .block3 .image-hover {
        left: auto;
    }
    .block4 {
        padding: 40px 0px;
    }
    .block4 .box {
        padding: 24px 20px;
    }
    .block4 .box .title {
        font-size: 40px;
        line-height: 48px;
        margin-top: 20px;
        margin-bottom: 16px;
    }
    .block4 .box p {
        font-size: 18px;
        line-height: 24px;
        margin-bottom: 24px;
    }
    .block4 .image4 {
        width: 315px;
    }
    .block4 .box button {
        margin-bottom: 24px;
    }
    .block4 .box .email {
        line-height: 24px;
    }
    .block4 .box .email a {
        font-size: 16px;
        line-height: 24px;
        text-decoration: underline solid #5A75DD;
        text-underline-offset: 3px;
        display: block;
    }
    .block5 {
        padding-bottom: 40px;
    }
    .block5 h2 {
        margin-top: 60px;
        margin-bottom: 40px;
        font-size: 40px;
        line-height: 48px;
    }
    .block5 .box {
        width: 100%;
    }
    .block5 .box .wrapper {
        padding: 20px;
        text-align: center;
    }
    .block5 .box h3 {
        font-size: 40px;
        line-height: 50px;
        margin-top: 300px;
        margin-bottom: 10px;
    }
    .block5 .box p {
        margin-bottom: 20px;
    }
    .block6 {
        padding-bottom: 60px;
    }
    .block6 h2 {
        padding-top: 60px;
        margin-bottom: 20px;
        font-size: 40px;
        line-height: 48px;
    }
    .block6 p {
        font-size: 20px;
        line-height: 30px;
        margin-bottom: 20px;
    }
    .block6 button {
        width: 100%;
    }
    .block7 {
        padding: 60px 0px;
    }
    .block7 h2 {
        font-size: 40px;
        line-height: 48px;
        margin-bottom: 40px;
    }
    .block7 .accordion {
        width: 100%;
    }
    .accordion .accordion-button {
        font-size: 20px;
        line-height: 28px;
    }
    .accordion .accordion-button:not(.collapsed) {
        padding-right: 20px !important;
    }
    .accordion .accordion-body {
        font-size: 15px;
        line-height: 22px;
        padding-right: 20px !important;
    }
    .accordion-header {
        padding-right: 20px !important;
    }
    .accordion .caret {
        padding: 12px;
    }
    .block8 {
        padding: 80px 0px 30px;
    }
    .block8 h2 {
        margin-top: 0;
        font-size: 52px;
        line-height: 52px;
    }
    .block8 p {
        font-size: 20px;
        line-height: 30px;
    }

    .block8 .phone {
        font-size: 14px;
        line-height: 18px;
        width: 100%;
    }
    .block8 .phone span {
        font-size: 14px;
        line-height: 18px;
        text-decoration-line: underline;
        display: block;
        text-underline-offset: 3px;
    }
    .block8 .phone span a {
        text-underline-offset: 3px;
    }

    #modalBBE .input-2 {
        flex-direction: column;
        gap: 24px;
    }

    #modalBBE .input-2 .w-50 {
        width: 100% !important;
    }

    #modalBBE .modal-dialog .modal-content .textBlock .logoBlock img {
        width: 100px;
    }

    #modalBBE .homeBlock {
        flex-direction: column;
        align-items: flex-start !important;
    }

    #modalBBE .homeBlock img {
        margin-bottom: 20px;
        width: 80px;
    }

    #modalBBE .box {
        padding: 20px;
    }

    #modalBBE .homeBlock .ms-4 {
        margin-left: 0 !important;
    }

    #modalBBE .step1 .btnActions button {
        width: 100%;
    }

    #modalBBE .modal-dialog {
        height: calc(100%) !important;
    }

    #modalBBE .modal-dialog .modal-content .step.opacity-0 {
        display: none !important;
    }

    #modalBBE .btnActions {
        margin-top: 30px;
    }

    #modalBBE .dropdown .dropdown-item {
        display: inline-block;
        width: 98%;
        white-space: nowrap;
        overflow: hidden !important;
        text-overflow: ellipsis;
    }
}

@media (max-width: 440px) {
    .block6 .box {
        width: 100%;
    }
}

@media (max-width: 400px) {
    .block2 .suppliers img {
        width: 100px;
        height: 120px;
    }
}

@media (max-width: 382px) {
    .block6 .box {
        width: 100%;
    }
}

@media (max-width: 378px) {
    .block3 .box-price .image-wrapper img {
        width: 100%;
        height: auto;
    }
}

@media (max-width: 368px) {
    .block2 .suppliers img {
        width: 97px;
        height: 113px;
    }
}



