body {
    width: 100%;
    height: 100%;
    margin: 0;
    font-family: 'Open Sans', sans-serif
}

@font-face {
    font-family: 'CFR';
    src: url('fonts/Comfortaa/Comfortaa-Regular.ttf');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'CFL';
    src: url('fonts/Comfortaa/Comfortaa-Light.ttf');
    font-weight: normal;
    font-style: normal;
}

.inline-block {
    display: inline-block;
}

.align-vertical {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.width10 {
    width: calc(10% - 9px);
}

.width15 {
    width: calc(15% - 9px);
}

.width20 {
    width: calc(20% - 2px);
}

.width25 {
    width: calc(25% - 2px);
}

.width30 {
    width: calc(30% - 2px);
}

.width50 {
    width: calc(50% - 3px);
}

.alink, .alink:hover {
    color: white;
    text-decoration: underline;
    cursor: pointer;
}

button:focus, input[type='text'] {
    /* outline: none; */
    outline-width: 0;
    border-width: 0;
}

.desktop-image {
    display: block;
}

.mobile-image {
    display: none;
}

.mobile-ios-btn {
    padding: 16px;
    cursor: pointer;
    border: 1px solid rgb(177, 177, 177);
    border-radius: 16px;
    display: inline-block;
}

.mobile-android-btn {
    padding: 16px;
    cursor: pointer;
    border: 1px solid rgb(177, 177, 177);
    color: 'black';
    border-radius: 16px;
    display: inline-block;
}

/* my swiper image */

.desktop-swiper {
    width: 100%;
}

.swiper-container {
    /* width: 100%; */
    height: 500px;
}

.my-swiper-image {
    /* width: 50%; */
    /* margin-left: 49%; */
    background-position: center right;
    background-repeat: no-repeat;
    background-size: 559px;
    height: 500px;
}

#trapezoid {
    border-bottom: 25px solid #5fd2af;
    border-left: 35px solid transparent;
    border-right: 18px solid transparent;
    height: 0;
    width: 146px;
    transform: rotate(35deg);
    position: absolute;
    right: -21px;
    top: 19px;
    text-align: center;
}

#trapezoid>span {
    font-size: 10px
}

.hexagon {
    position: relative;
    width: 100px;
    height: 57.74px;
    background-color: #ffffff;
    margin: 28.87px 0;
    box-shadow: 0 0 20px rgba(199, 199, 199, 0.8);
}

.hexagon:before, .hexagon:after {
    content: "";
    position: absolute;
    z-index: 1;
    width: 70.71px;
    height: 70.71px;
    -webkit-transform: scaleY(0.5774) rotate(-45deg);
    -ms-transform: scaleY(0.5774) rotate(-45deg);
    transform: scaleY(0.5774) rotate(-45deg);
    background-color: inherit;
    left: 14.6447px;
}

.hexagon:before {
    top: -35.3553px;
}

.hexagon:after {
    bottom: -35.3553px;
    webkit-box-shadow: -12px 12px 11px 3px rgba(194, 194, 194, 0.3);
    -moz-box-shadow: -12px 12px 11px 3px rgba(194, 194, 194, 0.3);
    box-shadow: -12px 12px 11px 3px rgba(194, 194, 194, 0.3);
}

/* SMALL HEADER */

.small-header {
    height: 50px;
    /* width: 100%; */
    background-color: #4f565e;
}

.small-header-content {
    width: 90%;
    max-width: 1100px;
    margin: auto;
    /* background: red; */
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    color: white;
    font-size: 13px;
}

.small-header-left-section, .small-header-right-section {
    display: inline-block;
}

.small-header-left-section span {
    margin-right: 20px;
}

.small-header-right-section span {
    margin-left: 19px;
}

.small-header-right-section {
    text-align: right;
}

/* END SMALL HEADER */

/*cover up extra shadows*/

.blue-button {
    background-color: #04bff4;
    padding: 10px 20px 10px 20px;
    border-radius: 30px;
    color: white;
    border: none;
    font-size: 14px;
    text-transform: uppercase;
    cursor: pointer;
    min-width: 230px;
}

.orange-button {
    background-color: #ff9600;
    padding: 10px 20px 10px 20px;
    border-radius: 30px;
    color: white;
    border: none;
    font-size: 14px;
    text-transform: uppercase;
    cursor: pointer;
    min-width: 230px;
}

#container {}

.section-title {
    font-size: 23px;
    font-family: 'CFL';
    color: #7b94a6;
    margin-bottom: 25px;
}

.section-image {
    width: 100%
}

.section2-image {
    width: 40px;
    position: relative;
    /* top: 50%;
    transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -o-transform: translateY(-50%); */
}

.section2-image-container {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: white;
    margin: auto;
    margin-bottom: 10px;
    padding: 30px;
    box-sizing: content-box;
}

.section-text {
    font-size: 14px;
}

.bottom-gradient {
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: 1000;
    background-image: linear-gradient(to top right, rgb(233, 233, 231) 16%, rgba(228, 228, 226, 0) 90%);
}

.gradient-left {
    background-image: linear-gradient(to left, rgb(233, 233, 231) 4%, rgba(228, 228, 226, 0) 90%);
}

.gradient-right {
    background-image: linear-gradient(to right, rgb(233, 233, 231) 4%, rgba(228, 228, 226, 0) 90%);
}

.outline-button {
    padding: 5px 40px 5px 40px;
    border-radius: 30px;
    color: #5c5c5c;
    border: 1px solid #3e3e3e;
    font-size: 14px;
    text-transform: uppercase;
    cursor: pointer;
    background-color: white;
}

.warning-text {
    color: #d088d4;
    font-weight: 600;
    margin: 0;
    font-size: 12px;
    text-transform: uppercase;
}

.section1-buttons-container {
    margin-top: 20px;
}

.section3-buttons-container {
    margin-top: 20px;
    text-align: center;
}

.section5-buttons-container {
    position: absolute;
    bottom: -15px;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
}

.section5-container-title {
    text-align: center;
    margin-top: 80px;
    font-weight: 600;
    font-size: 18px;
}

.section5-container-subtitle {
    text-align: center;
    font-size: 14px;
}

.green-bullet-icon {
    font-size: 15px !important;
    color: rgb(84 199 159);
    margin-right: 10px;
    vertical-align: sub;
}

.blue-bullet-icon {
    font-size: 15px !important;
    color: #4c8bd2;
    margin-right: 10px;
    vertical-align: sub;
}

.done-icon {
    font-size: 20px;
    color: rgb(84 199 159);
    margin-right: 10px;
    vertical-align: sub;
}

.remove-icon {
    font-size: 20px;
    color: red;
    margin-right: 10px;
    vertical-align: sub;
}

.justify-text-center {
    text-align: justify;
    max-width: 200px;
    margin: auto;
}

.section-text-container {
    display: block;
}

.plus-label {
    display: block;
    margin: auto;
    text-align: center;
    font-size: 24px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.functii-label {
    display: block;
    text-align: center;
    color: orange;
    font-weight: 600;
}

.nav-alege-button {
    background-color: orange;
    padding: 5px 60px 5px 60px;
    border-radius: 30px;
    color: white;
    border: none;
    font-size: 14px;
    text-transform: uppercase;
    cursor: pointer;
}

.hexagon-container {
    position: absolute;
    top: -50px;
    left: 0;
    right: 0;
    margin: auto;
    width: fit-content
}

.price-container {
    position: absolute;
    z-index: 2000;
    display: flex;
    justify-content: center;
    width: 100%;
    top: 5px;
}

.price-number-label {
    font-size: 33px;
    line-height: 50px;
    font-weight: 400;
    display: block;
}

.prince-number-container {
    margin-right: 5px;
    font-family: 'CFL';
}

.currency-label {
    display: block;
    font-size: 16px;
    line-height: 25px;
    margin: 0;
}

.currency-second-label {
    font-size: 10px;
    line-height: 7px;
}

.month-label {
    font-size: 14px;
    line-height: 4px;
    display: block;
}

.section2-title-img {
    font-size: 15px;
    font-weight: 600;
}

.optimize-image {
    width: 80%;
    display: block;
    margin-left: 20%;
}

.section2-col {
    padding: 0 20px 0 20px;
    margin-bottom: 15px;
    margin-top: 60px;
}

#section1 {
    position: relative;
    background-color: #e9e9e9;
    width: 100%;
    padding-top: 100px;
    height: 600px;
}

#section-container1 {
    width: 80%;
    max-width: 1100px;
    margin: auto;
    display: flex;
}

#section1-cell1 {
    padding: 150px 20px 150px 0;
    width: 40%;
    min-width: 310px;
}

#section1-cell2 {
    width: 60%;
    position: relative;
    /* min-width: 400px; */
}

#section2 {
    background-color: #fafafa;
    width: 100%;
    padding: 80px 20px 80px 20px;
}

#section2 p {
    margin: 25px auto 0 auto;
    width: 90%;
}

#section-container2 {
    width: 80%;
    max-width: 1000px;
    margin: auto;
    display: flex;
    padding-top: 40px
}

#section2-cell1 {
    margin-right: 20px;
    width: 40%;
    /* min-width: 300px; */
}

#section2-cell2 {
    padding: 70px 20px 70px 0;
}

#section2-top-row {
    text-align: center;
    padding-top: 40px;
    max-width: 1000px;
    margin: auto
}

#section3 {
    background-color: white;
    width: 100%;
    padding: 70px 0 0 0
}

#section-container3 {
    width: 80%;
    max-width: 1000px;
    margin: auto;
    display: flex;
    margin-top: 40px
}

.section3-cells {
    text-align: center;
    padding: 20px
}

#section4 {
    background-color: #f1f1f1;
    width: 100%;
    padding: 70px 0 0 0;
    box-sizing: border-box;
}

#section-container4 {
    width: 80%;
    max-width: 1000px;
    margin: auto;
    display: flex;
}

#section4-cell1 {
    padding: 80px 20px 80px 0;
}

#section4-cell2 {
    width: 80%;
    position: relative;
    /* min-width: 400px; */
}

#section5 {
    background-color: white;
    width: 100%;
    padding: 80px 0 140px 0;
}

.gdpr-section {
    position: relative;
}

.screw, .lock {
    position: absolute;
}

.screw {
    top: 50px;
    left: 50px;
    background-image: url('Pictures/screw.png');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    width: 119px;
    height: 94px;
}

.lock {
    bottom: 50px;
    right: 50px;
    background-image: url('Pictures/lock.png');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    width: 228px;
    height: 165px;
}

#section5-top-row {
    text-align: center;
    padding-top: 70px;
    max-width: 1000px;
    margin: auto
}

#section-container5 {
    width: 100%;
    display: flex;
    margin-top: 100px;
    white-space: nowrap;
    text-align: center;
    position: relative;
    min-width: 1750px;
    align-items: flex-start;
    padding: 20px 0;
    justify-content: center;
}

#section5-cell1 {
    display: inline-block;
    background-color: white;
    border-radius: 30px;
    position: relative;
    margin-right: 20px;
    padding: 0 20px 40px 20px;
    height: fit-content;
    /* border: 1px solid gray; */
    border: 1px solid #5fd2af;
    width: 300px;
    white-space: normal;
    text-align: left;
    height: 300px;
}

#section5-cell2 {
    display: inline-block;
    background-color: white;
    border-radius: 30px;
    position: relative;
    margin-right: 20px;
    padding: 0 20px 40px 20px;
    height: fit-content;
    border: 1px solid #5fd2af;
    width: 300px;
    white-space: normal;
    text-align: left;
    height: 300px;
}

#section5-cell3 {
    display: inline-block;
    background-color: white;
    border-radius: 30px;
    position: relative;
    padding: 0 20px 40px 20px;
    height: fit-content;
    /* border: 1px solid gray; */
    border: 1px solid #5fd2af;
    width: 300px;
    white-space: normal;
    text-align: left;
    height: 300px;
}

#section-container51 {
    width: 80%;
    max-width: 1200px;
    margin: auto;
    display: flex;
    margin-top: 100px;
    justify-content: center;
}

#section5-cell4 {
    display: inline-block;
    background-color: white;
    border-radius: 30px;
    position: relative;
    margin-right: 20px;
    padding: 0 20px 40px 20px;
    height: fit-content;
    border: 1px solid #5fd2af;
    width: 300px;
    white-space: normal;
    text-align: left;
    height: 300px;
}

#section5-cell5 {
    display: inline-block;
    background-color: white;
    border-radius: 30px;
    position: relative;
    margin-right: 20px;
    padding: 0 20px 40px 20px;
    border: 1px solid #5fd2af;
    height: fit-content;
    width: 300px;
    white-space: normal;
    text-align: left;
    height: 300px;
}

#section6 {
    background-color: #f0f0f0;
    background-image: url('Pictures/reports.png');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center left;
    width: 100%;
    /* padding: 80px 0 0 0 */
}

#section7 {
    background-color: white;
    width: 100%;
    padding: 80px 0 80px 0;
    position: relative;
}

#section7-top-row {
    text-align: center;
    padding-top: 10px;
    max-width: 1000px;
    margin: auto
}

#section8 {
    background-color: #f1f1f1;
    padding-bottom: 70px;
}

#section8 .section-text {
    line-height: 20px;
    font-size: 12px;
}

#section8 .section-text-container .section-text {
    display: inline-block;
    line-height: 14px;
    width: 210px;
    margin-bottom: 10px;
}

#section8 .section-text-container {
    margin-bottom: -5px;
}

#section8 .done-icon {
    vertical-align: top;
}

.plus-icon {
    font-size: 20px;
    color: orange;
    margin-right: 10px;
    vertical-align: sub;
}

.previous-package {
    text-align: center;
    margin: 0;
    font-weight: bold;
}

#carousel-button-left {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto
}

#section-container5-container {
    overflow: scroll;
    width: 100%;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

#section-container5-container::-webkit-scrollbar {
    display: none;
}

.section-container-2-mobile {
    display: none;
}

#nav-links-mobile {
    display: none;
}

.ask-offer-text {
    line-height: 21px;
    text-transform: uppercase;
    text-align: center;
    color: #05a9aa;
    cursor: pointer;
    margin-top: 7px;
}

/* START CUM FUNCTIONEAZA PAGE */

#section-cum-functioneaza {
    background-color: white;
    width: 100%;
    padding: 80px 0 80px 0;
}

#section-intreaba-orice {
    background-color: #f1f1f1;
    padding: 50px 0;
}

.cum-func-bg {
    background-image: url('./Pictures/postit-guy.jpg');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center right;
    height: 400px;
}

/* END CUM FUNCTIONEAZA PAGE */

/* START CONTACT PAGE */

.contact-bg {
    background-image: url('./Pictures/contact-girl.jpg');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center right;
}

#contact-form p {
    margin: 0;
    padding: 0;
}

.form-container {
    padding: 30px 0 10px 0;
}

.input-label {
    font-size: 9px;
}

.form-container input {
    margin-bottom: 20px;
    border: 0px;
    border-bottom: 1px solid gray;
    width: 90%;
}

/* END CONTACT PAGE */

/* -------------------- FOOTER -------------------- */

.footer {
    background-color: #373737;
    padding: 50px 0;
}

.footer-cum-functioneaza {
    /* position: fixed; */
    bottom: 0;
    width: 100%;
}

.footer-content {
    width: 1100px;
    margin: auto;
}

.dark-logo {}

.footer p {
    color: white;
    margin: 0;
    padding: 0;
    font-size: 14px;
}

.footer-links1, .footer-links2, .footer-links3 {
    vertical-align: top;
    text-align: center;
}

.footer-links1 p:first-of-type, .footer-links2 p:first-of-type, .footer-links3 p:first-of-type, .footer-social-media p:first-of-type {
    font-weight: bolder;
    font-size: 16px;
}

.footer-social-media {
    vertical-align: top;
}

.footer-secondary-links-section {
    margin-top: 50px;
}

.footer-secondary-links-section span {
    margin-right: 10px;
    text-decoration: underline;
    font-size: 16px;
}

.social-media-content {
    margin-top: 40px;
}

.social-media-content img {
    margin-right: 10px;
    margin-left: 10px
}

/* -------------------- END FOOTER -------------------- */

/* -------------------- START DELETE ACCOUNT FORM -------------------- */

.form-wrapper {
    width: 500px;
    background-color: white;
    margin: auto;
    position: relative;
    top: 50%;
    /* transform: translateY(-50%); */
    padding: 30px 20px 20px 20px;
    border-radius: 5px;
}

.form-wrapper input {
    display: block;
    width: 90%;
    margin: auto;
    border: 1px solid #f75957;
    height: 42px;
    padding: 0 1rem;
    background: #fff;
    border-radius: 30px;
}

.form-wrapper>p {
    text-align: center;
    font-size: 15px;
}

.form-wrapper>p:nth-of-type(2) {
    font-size: 20px;
    width: 60%;
    margin: 20px auto;
}

.form-wrapper>div {
    margin-bottom: 10px;
}

.send-button {
    width: 90%;
    margin: auto;
    background: gray;
    border-radius: 30px;
    text-align: center;
    height: 42px;
    cursor: pointer;
    background-color: #f75957;
}

.send-button p {
    color: white;
    letter-spacing: 1px;
    padding-top: 12px;
}

.close-popup-btn {
    width: 30px;
    height: 30px;
    background: url('./images/close_btn.png') center no-repeat;
    background-size: contain;
    right: 10px;
    position: absolute;
    top: 10px;
    cursor: pointer;
}

/* -------------------- END DELETE ACCOUNT FORM -------------------- */

@media only screen and (min-width:1900px) {
    .gradient-left {
        display: none;
    }
    .gradient-right {
        display: none;
    }
}

@media only screen and (max-width:1100px) {
    /* HEADER */
    .small-header-left-section {
        width: 30%;
    }
    .small-header-right-section {
        width: 69%;
    }
    .small-header-left-section .telephone {
        display: none;
    }
    /* FOOTER */
    .dark-logo {
        text-align: center;
        margin-bottom: 50px;
    }
    .footer-content {
        width: 90%;
    }
}

@media only screen and (max-width: 900px) {
    .desktop-image {
        display: none;
    }
    .mobile-image {
        display: block;
    }
    .section-text {
        font-size: 12px;
        color: #232323;
    }
    .warning-text {
        text-align: center;
        font-size: 10px;
        margin-top: 0 !important;
    }
    .section-title {
        text-align: center;
    }
    #section1 .section-title {
        text-align: left;
        width: 50%;
    }
    #nav-links {
        display: none;
    }
    #nav-links-mobile {
        display: flex;
        width: 50%
    }
    #nav-links-mobile a {
        font-size: 12px;
        font-weight: bolder;
    }
    #nav-links-mobile button {
        height: 30px;
        margin-top: 8px;
    }
    #logo {
        margin-top: 6px;
        cursor: pointer;
    }
    button {
        font-size: 13px !important;
    }
    .nav-buy-button {
        padding: 8px 20px 8px 20px;
    }
    .outline-button {
        padding: 5px 20px 5px 20px;
    }
    .nav-blue-buy-button {
        padding: 5px 20px 5px 20px;
    }
    .dropdown-menu {
        border-width: 0px;
        background-color: #fafafa;
        padding: 20px;
    }
    #section2 {
        padding-top: 40px;
    }
    #section2 .section-text {
        width: 100% !important;
        margin-bottom: 0px !important;
    }
    .section2-title-img {
        font-size: 14px;
    }
    .section2-image-container {
        width: 30px;
        height: 30px;
    }
    .section2-image {
        width: 30px;
    }
    .section2-col {
        padding: 0 10px 0 10px;
        margin-top: 40px;
    }
    #section4 .section-image {
        margin: auto;
        display: block;
    }
    /* Optimizat pentru mobil*/
    #section5 .section-title {
        margin-left: auto;
        margin-right: auto;
        width: 95% !important;
    }
    #section5 {
        padding: 60px 0 0px 0;
    }
    #section5 button {
        margin-top: 40px;
        margin-bottom: 40px;
    }
    #section6 {
        background-image: none;
    }
    #section6 .container {
        /* padding-left: 0;
        padding-right: 0; */
    }
    #section6 .section-text {
        text-align: center;
    }
    .screw, .lock {
        display: none;
    }
}

@media only screen and (max-width: 800px) {
    .small-header-content {
        width: 94%;
    }
    .small-header span {
        font-size: 10px;
    }
    .small-header-right-section span {
        margin-left: 6px;
    }
    #section1-cell1 {
        width: 80%;
    }
    #section-container3 {
        width: 80%;
        max-width: 1000px;
        margin: auto;
        display: inline-block;
        margin-top: 40px;
    }
    #section4-cell2 {
        min-width: 0;
    }
    #section-container2 {
        display: none !important;
    }
    .section-container-2-mobile {
        display: block;
    }
    .section-container-2-mobile img {
        /* margin-bottom: 40px; */
        width: 100%;
        display: block;
        margin: auto;
    }
    .section1-buttons-container {
        text-align: center;
        margin-bottom: 40px;
    }
    #section6 {
        padding: 70px 0 0 0;
    }
    #section5 .section-image {
        display: block;
        margin: 0 auto 30px auto;
    }
    .footer-address {
        width: 100%;
        text-align: center;
        margin-bottom: 50px;
        ;
    }
    .footer-address p {
        width: 250px;
        margin: auto;
    }
    .footer p {
        font-size: 12px;
    }
    .footer-links1, .footer-links2, .footer-links3 {
        width: 32%;
        text-align: center;
        vertical-align: top;
    }
    .footer-links1 p, .footer-links2 p, .footer-links3 p {
        display: none;
    }
    .footer-links1 p:first-of-type, .footer-links2 p:first-of-type, .footer-links3 p:first-of-type {
        display: block;
    }
    .footer-social-media {
        width: 100%;
        margin: 20px 0;
    }
    .footer-social-media p {
        display: none;
    }
    .social-media-content {
        width: 100%;
        text-align: center;
    }
    .footer-secondary-links-section {
        text-align: center;
    }
    .footer-secondary-links-section span {
        font-size: 13px;
    }
    .footer-links1 p:first-of-type, .footer-links2 p:first-of-type, .footer-links3 p:first-of-type, .footer-social-media p:first-of-type {
        font-size: 14px;
    }
    .social-media-content {
        margin-top: 0;
    }
    .my-swiper-image {
        background-position: center right -380px;
        opacity: 0.4;
    }
    .contact-bg {
        background-image: none;
    }
    .cum-func-bg {
        background-image: none;
        height: 200px;
    }
    #contact-form {
        padding-bottom: 30px;
    }
    #contact-form .optimize-image {
        display: block;
        margin: auto;
    }
    .form-sent-btn {
        text-align: center;
    }
    #section-cum-functioneaza {
        padding: 20px 0;
    }
    #section-cum-functioneaza .section-image {
        margin: auto;
    }
    #section-intreaba-orice .section-image {
        display: none;
    }
    #section-intreaba-orice {
        padding: 20px 0;
    }
}

@media only screen and (max-width:600px) {
    .footer-cum-functioneaza {
        position: static;
        bottom: 0;
        width: 100%;
    }
    .section1-buttons-container1 {
        display: flex;
    }
    #section1-cell2 {
        display: none;
    }
    .small-header-right-section span {
        display: none;
    }
    /* #section1 {
        background-image: url(Pictures/1.png);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    } */
    #section-container5 {
        min-width: 1650px;
        justify-content: normal;
        padding: 20px 0 20px 38px;
    }
    .desktop-swiper {
        /* display: none; */
    }
}