@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap');

* {
    margin: 0;
    padding: 0;
    text-decoration: none;
    list-style: none;
}

body {
    font-family: "Inter", sans-serif;
}

/*========================  Navbar start ================================*/

ul.navbar {
    width: 100%;
    height: 70px;
    background-color: #1068FE;
    border-bottom: 2px solid #ddd;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

ul.navbar img.starter__img {
    /*height: 5vh;*/
    max-width: 140px;
    width: 100%;
    cursor: pointer;
    display: block;
    margin: 0 auto;
    object-fit: contain;
}

ul.navbar li.svg {
    position: absolute;
    top: 22px;
    left: 40px;
}

.arrow-icon {
    fill: #E9E9E9 !important;
}

.arrow-icon:hover {
    fill: white !important;
}

@media (max-width: 480px) {
    ul.navbar {
        height: 60px;
    }
}

@media (max-width: 768px) {
    ul.navbar {
        height: 70px;
    }

    ul.navbar img.starter__img {
        height: 15vh !important;
    }

    ul.navbar li.svg svg {
        max-width: 30px;
        max-height: 30px;
    }
}

/*========================  Starter start ================================*/

.starter-section {
    background-color: #f8f9fa;
    min-height: 90vh;
    padding-top: 52px;
    text-align: center;
}

/*========================  Steps start ================================*/
.stepper {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    width: 100%;
    max-width: 600px;
    gap: 16px;
    box-sizing: border-box;
    gap: 0;
    margin: 0 auto;
    margin-bottom: 60px;
}

.step {
    width: clamp(18px, 5vw, 22px);
    height: clamp(18px, 5vw, 22px);
    border-radius: 50%;
    background: #E9E9E9;
    color: black;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: clamp(12px, 2vw, 16px);
    flex-shrink: 0;
    z-index: 1;
}

.step.done {
    background-color: #0061fe !important;
    color: white;
}

.step.active {
    background-color: #999;
    color: white;
}

.line {
    height: clamp(3px, 3vw, 7px);
    background-color: #E9E9E9;
    flex: 1;
    margin: 0;
}

.line.done {
    background-color: #0061fe !important;
}

@media (max-width: 768px) {

    .starter-section {
        padding-right: 20px;
        padding-left: 20px;
    }

    .step {
        width: clamp(11px, 5vw, 15px) !important;
        height: clamp(11px, 5vw, 15px) !important;
        font-weight: bold;
        font-size: clamp(12px, 2vw, 16px);
        flex-shrink: 0;
        z-index: 1;
    }

    .stepper {
        margin-bottom: 32px;
    }

    .line {
        height: clamp(3px, 2.6vw, 5px);
        /*height: clamp(3px, 4.5vw, 5px);*/
        background-color: #E9E9E9;
        flex: 1;
        margin: 0;
    }
}

/*========================  Steps finish ================================*/

.icon {
    width: 50px
}

.starter-section .starter__title {
    font-weight: 900;
    font-size: clamp(24px, 10vw, 56px);
    font-family: "Nunito Sans", sans-serif;
    color: black;
    margin: 14px auto;
    max-width: 64%;
}

.starter-section .starter__desc {
    font-weight: 500;
    font-size: clamp(16px, 4vw, 22px);
    color: black;
    max-width: 60%;
    margin: 0 auto 20px auto;
    line-height: 1.4;
}

.starter-section .started__btn {
    position: relative;
    overflow: hidden;

    display: flex;
    align-items: center;
    justify-content: center;

    background-color: #0061fe;
    border-radius: 15px;

    padding: clamp(10px, 1vw, 20px) clamp(40px, 5vw, 60px);
    font-weight: 700;
    font-size: clamp(14px, 2vw, 34px);
    color: white;

    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
    border: none;

    width: fit-content;
    max-width: 100%;
    margin: 30px auto 0;
    gap: 12px;

    white-space: nowrap;
    text-align: center;
    box-sizing: border-box;

    overflow: hidden;
    text-overflow: ellipsis;
}

.starter-section .started__btn svg {
    width: 40px;
    height: 35px;
    animation: flyArrow 1s infinite;
}

.starter-section .starter__btn svg {
    width: 40px;
    height: 35px;
    animation: flyArrow 1s infinite;
}


@keyframes flyArrow {
    0% {
        transform: translateX(0);
        opacity: 1;
    }
    70% {
        transform: translateX(15px); /* arrow moves to the right */
        opacity: 0; /* fades out while moving */
    }
    71% {
        transform: translateX(-15px); /* jump back to the left side (hidden) */
        opacity: 0;
    }
    100% {
        transform: translateX(0); /* return to center */
        opacity: 1; /* fade in again */
    }
}

.started__btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(
            120deg,
            transparent,
            rgba(255, 255, 255, 0.4),
            transparent
    );
    transform: skewX(-20deg);
    transition: left 0.8s ease;
    z-index: 1;
}

.started__btn:hover::before {
    left: 125%;
}

.starter-section .started__title {
    font-weight: 700;
    font-size: clamp(20px, 6vw, 50px) !important;
    color: black;
    margin: 0 auto;
    max-width: 90%;
    text-align: center;
    line-height: 1.2;
}

@media (max-width: 1200px) {
}

@media (min-width: 480px) {
    /*.starter-section .starter__desc .br_mobile {*/
    /*    display: none;*/
    /*}*/
}

@media (max-width: 479px) {

    .icon {
        width: 40px
    }

    .starter-section {
        padding-top: 30px;
    }

    .starter-section .starter__title {
        font-weight: 900;
        font-size: clamp(16px, 10vw, 24px);
        color: black;
        margin-top: 70px !important;
        max-width: 100%;
    }

    .starter-section .starter__desc {
        font-weight: 500;
        font-size: clamp(12px, 12vw, 13px);
        color: black;
        max-width: 100%;
        margin: 10px auto 20px auto;
        line-height: 1.4;
    }

    /*.starter-section .starter__desc .br_mobile {*/
    /*    display: block;*/
    /*}*/
    .starter-section .started__btn {
        white-space: normal;
        font-size: clamp(16px, 2vw, 34px);
        width: 100%;
    }

    .starter-section .started__btn svg {
        width: 32px;
        height: 28px;
        animation: flyArrow 1s infinite;
    }

    .starter-section .success__btn {
        /*font-size: clamp(28px, 2vw, 34px) !important;*/
        font-size: 22px !important;
        padding: 10px 22px;
    }
}

/*========================  Register start ================================*/

.starter-section .starter__btn {
    position: relative;
    overflow: hidden;

    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #0061fe;
    border-radius: 12px;
    padding: 20px;
    font-weight: 700;
    font-size: clamp(16px, 4vw, 27px);
    color: white;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
    border: none;
    width: 100%;
    max-width: 400px;
    height: clamp(50px, 10vw, 60px);
    margin: 40px auto 20px auto;
    gap: 12px;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.starter__btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(
            120deg,
            transparent,
            rgba(255, 255, 255, 0.4),
            transparent
    );
    transform: skewX(-20deg);
    transition: left 0.8s ease;
    z-index: 1;
}

.starter__btn:hover::before {
    left: 125%;
}

.starter__btn:disabled {
    background-color: #e1e1e1; /* gray */
    color: #2b2a2a; /* lighter text */
    cursor: not-allowed; /* show blocked cursor */
    opacity: 0.7; /* slightly transparent */
}

.register__log {
    display: flex;
    flex-direction: column;
    gap: 0px;
    align-items: center;
    margin: 10px 0;
    padding: 0 16px;
    box-sizing: border-box;
}

.register__input {
    width: 100%;
    max-width: 600px;
    height: clamp(50px, 10vw, 60px);
    padding: 12px 16px;
    font-size: clamp(16px, 4vw, 26px);
    border: 1.2px solid #a3a3a3;
    border-radius: 6px;
    box-sizing: border-box;
    margin-bottom: 10px;
    font-weight: 400;
    font-family: "Nunito Sans", sans-serif;
}

.register__input:focus {
    outline: none;
    border-color: #1068FE;
}

.register__input::placeholder {
    font-size: 20px;
    font-weight: 300;
    font-family: "Nunito Sans", sans-serif;
}

.register__title {
    font-weight: 700;
    font-family: "Nunito Sans", sans-serif;
    font-size: clamp(24px, 6vw, 36px);
    color: black;
    margin: 0 auto;
    margin-bottom: 20px;
    width: 100%;
    max-width: 64%;
    text-align: center;
}

.register__success {
    font-weight: 700;
    font-family: "Nunito Sans", sans-serif;
    font-size: clamp(18px, 6vw, 24px);
    color: black;
    margin: 0 auto;
    margin-bottom: 20px;
    padding-top: 20px;
    width: 100%;
    max-width: 64%;
    text-align: center;
}

.register_paragraph {
    font-weight: 500;
    font-family: "Nunito Sans", sans-serif;
    font-size: clamp(16px, 1vw, 18px);
    color: black;
    margin: 0 auto;
    margin-bottom: 40px;
    width: 100%;
    max-width: 64%;
    text-align: center;
}

.register__dec {
    font-weight: 600;
    font-size: clamp(14px, 3.5vw, 22px);
    color: gray;
    margin: 30px auto;
    max-width: 600px;
    text-align: center;
    line-height: 1.5;
    padding: 0 12px;
}

.platform__title {
    font-weight: 500;
    font-size: clamp(15px, 3.5vw, 24px);
    color: gray;
    margin: 40px auto;
    max-width: 800px;
    width: 100%;
    padding: 0 16px;
    text-align: center;
    line-height: 1.4;
    box-sizing: border-box;
}

.platform-two__title {
    font-weight: 500;
    font-size: clamp(22px, 3.5vw, 24px);
    color: gray;
    margin: 0 auto;
    max-width: 800px;
    width: 100%;
    padding: 0 16px;
    text-align: center;
    line-height: 1.4;
    box-sizing: border-box;
}

.media__title {
    font-weight: 300;
    font-size: clamp(15px, 3.5vw, 22px);
    color: gray;
    margin: 10px auto;
    max-width: 800px;
    width: 100%;
    padding: 0 16px;
    text-align: center;
    line-height: 1.4;
    box-sizing: border-box;
}

@media (max-width: 768px) {
    .register__title {
        font-size: clamp(16px, 5vw, 30px);
        margin: 40px auto;
        width: 100%;
        max-width: 90%;
        text-align: center;
    }

    .register__success {
        font-size: 18px;
        margin: 0;
        max-width: 100%;
        padding-top: 10px;
        text-align: start;
    }

    .register__addition {
        text-align: center !important;
        padding-top: 0;
    }

    .register_paragraph {
        font-size: clamp(14px, 3vw, 18px);
        margin: 40px auto;
        width: 100%;
        max-width: 90%;
        text-align: center;
    }
}


@media (max-width: 500px) {
    .register__log {
        row-gap: 4.56px;
    }

    .register__input {
        margin-bottom: 2px;
    }
}

.icon-box {
    border: 2px solid #ECECEC !important;
    border-radius: 16px;
    padding: 15px;
    background-color: white;
    transition: all 0.3s ease;
    position: relative;
    cursor: pointer;
    width: 80px;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.icon-box.selected {
    border-color: #0061fe !important;
}

.icon-img {
    max-width: 50px;
    max-height: 50px;
}

.check-icon {
    position: absolute;
    top: 6px;
    right: 6px;
    color: #0061fe;
    font-size: 20px;
    display: none;
}

.icon-box.selected .check-icon {
    display: block;
}

.custom-label {
    text-decoration: none;
    user-select: none;
    cursor: pointer;
}

/*========================  Register finish ================================*/

/*========================  Select start ================================*/

.select-wrapper {
    position: relative;
    max-width: 630px;
    width: 100%;
    margin: 10px auto;
    /*padding: 0px;*/
    box-sizing: border-box;
}

.custom-select {
    width: 100%;
    max-width: 600px;
    height: clamp(50px, 10vw, 60px);
    padding: 10px 20px 10px 20px;
    font-size: clamp(16px, 4vw, 26px);
    font-weight: 600;
    border: 1.2px solid #a3a3a3;
    border-radius: 6px;
    font-family: "Nunito Sans", sans-serif;

    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: white;
}

.custom-chevron {
    position: absolute;
    top: 50%;
    right: 36px;
    transform: translateY(-50%);
    font-size: clamp(12px, 2vw, 16px);
    pointer-events: none;
    color: #555;
}

@media (max-width: 500px) {
    .custom-chevron {
        right: 20px !important;
    }
}

/*========================  Select finish ================================*/

/*========================  Range start ================================*/

.range__title {
    font-weight: 400;
    font-family: "Nunito Sans", sans-serif;
    font-size: clamp(20px, 5vw, 30px);
    background-color: rgb(232, 232, 232);
    padding: 10px clamp(10px, 2vw, 20px);
    border-radius: 8px;
    text-align: center;
    width: 100%;
    max-width: 180px;
    margin: 0 auto 20px;
}

.starter-section .started__btn {
    width: fit-content;
    max-width: 100%;
    margin: 30px auto 0;
    gap: 12px;

}

.styled-range {
    -webkit-appearance: none;
    appearance: none;

    width: 100%;
    min-width: 600px;

    height: 20px;
    background: linear-gradient(to right, #0061fe 50%, #dee2e6 50%);
    border-radius: 20px;
    outline: none;
    display: block;
    position: relative;
    margin: 50px 0 50px 0;
}

.styled-range::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;

    width: 30px;
    height: 30px;

    background: white;
    border: 2px solid #ddd;
    border-radius: 50%;
    cursor: pointer;

    margin-top: -1px;

    position: relative;
    z-index: 2;
}

.styled-range::-moz-range-thumb {
    width: 40px;
    height: 40px;
    background: #0061fe;
    border: 2px solid #0061fe;
    border-radius: 50%;
    cursor: pointer;
}

.styled-range::-moz-range-track {
    height: 20px;
    background: transparent;
}

@media (min-width: 480px) and (max-width: 767px) {
    .styled-range {
        min-width: 420px;
        margin: 40px 0;
    }
}

@media (max-width: 479px) {
    .styled-range {
        min-width: 320px;
        margin: 30px 0 15px 0;
    }
}


/*========================  Range finish ================================*/
/*========================  Selling start ================================*/
.selling__card {
    display: flex;
    justify-content: center;
    gap: 30px;
    margin: 30px auto;
    max-width: 1000px;
    padding: 10px;
}

.selling__card a {
    text-decoration: none;
}

.selling__child {
    width: 250px;
    height: 360px;
    background-color: #fff;
    border-radius: 16px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12), 0 6px 6px rgba(0, 0, 0, 0.1);
    border: none;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    text-align: center;
    padding: 20px;
    box-sizing: border-box;
}

.selling__child:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2), 0 6px 12px rgba(0, 0, 0, 0.12);
}

.selling__img {
    width: 200px;
    height: 200px;
    object-fit: contain;
    margin-bottom: 15px;
}

.selling__img2 {
    width: 500px;
    height: 280px;
    object-fit: contain;
}

.selling__child p {
    font-size: 26px;
    font-weight: 600;
    color: #333;
}

@media (max-width: 600px) {
    .selling__img2 {
        width: 300px;
        height: 150px;
        margin: 15px;
    }

    .selling__card {
        display: flex;
    }

    .selling__child {
        width: 160px;
        height: 160px;
        padding: 12px;
    }

    .selling__img {
        width: 80px;
        height: 80px;
    }

    .selling__child p {
        font-size: 18px;
    }
}

/*========================  Selling finish ================================*/
/*========================  TextArea start ================================*/
.auto-expand {
    overflow: hidden;
    resize: none;
}

.auto-grow-textarea {
    width: 100%;
    max-width: 600px;
    height: clamp(150px, 30vw, 250px);
    border: 1.2px solid #a3a3a3;
    border-radius: 6px;
    padding: clamp(10px, 2vw, 16px);
    font-size: 20px;
    font-weight: 400;
    font-family: "Nunito Sans", sans-serif;
    resize: none;
    overflow: hidden;
    box-sizing: border-box;
    transition: border-color 0.3s;
}

.auto-grow-textarea::placeholder {
    font-size: 20px;
    font-weight: 300;
    font-family: "Nunito Sans", sans-serif;
}

.auto-grow-textarea:focus {
    border-color: #0061fe;
    outline: none;
}

@media (max-width: 480px) {
    .auto-grow-textarea::placeholder {
        font-size: 14px;
    }
}

/*========================  TextArea finish ================================*/

.budget-options {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px 40px;
    max-width: 1000px;
    margin: 0 auto;
}

.budget-option {
    display: flex;
    align-items: center;
    padding: 10px 200px 10px 10px;
    border: 1px solid #e3e3e3;
    background-color: #EFEFEF !important;
    border-radius: 42px;
    cursor: pointer;
    font-size: 16px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.budget-option:hover {
    border-color: #3b82f6;
}

.budget-option input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: #e3e3e3;
    cursor: pointer;
    position: relative;
}

/* checked state */
.budget-option input[type="radio"]:checked {
    border-color: #3b82f6;
    background-color: #3b82f6;
}

.budget-option:has(input[type="radio"]:checked) {
    border-color: #3b82f6;
    background-color: #eef5ff;
}


.budget-option span {
    flex: 1;
    text-align: start;
    max-width: 180px;
    padding-left: 10px;
    font-size: 16px;
    font-weight: 400;
    font-family: "Nunito Sans", sans-serif;
    color: #747474;
}

.budget-option {
    position: relative;
}

.budget-option .checkmark {
    position: absolute;
    left: 14px; /* align on top of the radio */
    width: 16px;
    height: 16px;
    display: none; /* hidden by default */
    pointer-events: none;
}

/* show only when radio checked */
.budget-option input[type="radio"]:checked + .checkmark {
    display: block;
}

@media (max-width: 768px) {

    .register__log {
        padding-bottom: 40px;
        margin-bottom: 0;
    }

    .budget-options {
        display: grid;
        grid-template-columns: 1fr;
        margin: 0;
    }

    .budget-option {
        padding: 10px 50px 10px 10px;
    }

    .budget-option span {
        min-width: 240px;
    }
}


/*========================  Budjet check finish ================================*/
/*========================  Region start ================================*/
#region-select {
    width: 100%;
    max-width: 400px;
    padding: 12px 16px;
    font-size: 16px;
    font-family: "Arial", sans-serif;
    border: 2px solid gray;
    border-radius: 8px;
    background-color: #fff;
    color: #181818;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg fill='gray' height='20' viewBox='0 0 24 24' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 16px 16px;
    cursor: pointer;
    transition: border-color 0.3s, box-shadow 0.3s;
}

#region-select:focus {
    border-color: gray;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.2);
    outline: none;
}

#region-select option {
    padding: 10px;
}

/*========================  Region finish ================================*/
.icon-box {
    position: relative;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: 2px solid transparent;
    transition: all 0.2s ease;
}

.icon-box:hover {
    border: 2px solid #0061fe !important;
    background-color: white;
}

/*.icon-box.active {*/
/*    border: 5px solid #0061fe;*/
/*    background-color: white;*/
/*}*/

.icon-box i.icon {
    font-size: 50px;
    pointer-events: none;
}

.check-icon {
    position: absolute;
    top: -6px;
    right: -2px;
    color: #0061fe;
    font-size: 25px;
    display: none;
    align-items: center;
    justify-content: center;
}

.icon-box.active .check-icon {
    display: flex;
}

.icon-text {
    margin-top: 10px;
    font-size: 16px;
    font-weight: 500;
    font-family: "Nunito Sans", sans-serif;
    color: #313131;
    pointer-events: none;
    text-align: center;
}

.red {
    color: #0061fe;
}

.blue {
    color: #1877f2;
}

.pink {
    color: #e1306c;
}

.orange {
    color: #0061fe;
}

.purple {
    color: #6f42c1;
}

.teal {
    color: #20c997;
}

.gold {
    color: #f0ad4e;
}

.cyan {
    color: #00bcd4;
}

.brown {
    color: #8d6e63;
}

.gray {
    color: #6c757d;
}

@media (min-width: 400px) and (max-width: 575px) {
    .starter__title {
        font-size: 26px !important;
        max-width: 400px !important;
        margin-top: 40px !important;
    }

    .starter__desc {
        font-size: 15px !important;
        max-width: 380px !important;
    }
}

@media (min-width: 576px) and (max-width: 767px) {
    /*.starter-section {*/
    /*    padding: 200px 40px;*/
    /*}*/
    .starter__title {
        font-size: 30px !important;
        max-width: 500px !important;
        margin-top: 50px !important;
    }

    .starter__desc {
        font-size: 16px !important;
        max-width: 420px !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    /*.starter-section {*/
    /*    padding: 200px 40px;*/
    /*}*/
    .starter__title {
        font-size: 36px !important;
        max-width: 600px !important;
    }

    .starter__desc {
        font-size: 17px !important;
        max-width: 450px !important;
    }

    .starter__img {
        width: 140px;
        height: 140px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    /*.starter-section {*/
    /*    padding: 200px 40px;*/
    /*}*/
    .starter__title {
        font-size: 40px !important;
        max-width: 700px !important;
    }

    .starter__desc {
        font-size: 19px !important;
        max-width: 500px !important;
    }

    .starter__btn {
        font-size: 22px;
        max-width: 500px;
    }
}

@media (min-width: 1200px) and (max-width: 1399px) {
    /*.starter-section {*/
    /*    padding: 200px 40px;*/
    /*}*/
    .starter__title {
        font-size: 48px !important;
        max-width: 800px !important;
        @import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap');

        * {
            margin: 0;
            padding: 0;
            text-decoration: none;
            list-style: none;
        }

        body {
            font-family: "Inter", sans-serif;
        }

        /*========================  Navbar start ================================*/

        ul.navbar {
            width: 100%;
            height: 70px;
            background-color: #1068FE;
            border-bottom: 2px solid #ddd;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
        }

        @media (max-width: 768px) {
            ul.navbar {
                height: 90px;
            }

            ul.navbar img.starter__img {
                height: 15vh !important;
            }

            ul.navbar li.svg svg {
                width: 26px;
                height: 26px;
            }
        }

        @media (max-width: 480px) {
            nav.navbar {
                height: 70px;
            }

            ul.navbar img.starter__img {
                height: 5vh;
                max-width: 110px;
                width: 100%;
                cursor: pointer;
                display: block;
                margin: 0 auto;
                object-fit: contain;
            }

            ul.navbar li.svg {
                position: absolute;
                top: 12px !important;
                left: 40px;
            }

            .arrow-icon {
                fill: #E9E9E9 !important;
            }

            .arrow-icon:hover {
                fill: white !important;
            }

        }

        /*========================  Starter start ================================*/

        .starter-section {
            background-color: #f8f9fa;
            min-height: 90vh;
            padding-top: 52px;
            text-align: center;
        }

        /*========================  Steps start ================================*/

        .step {
            width: clamp(18px, 5vw, 22px);
            height: clamp(18px, 5vw, 22px);
            border-radius: 50%;
            background: #E9E9E9;
            color: black;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: bold;
            font-size: clamp(12px, 2vw, 16px);
            flex-shrink: 0;
            z-index: 1;
        }

        .step.done {
            background-color: #0061fe !important;
            color: white;
        }

        .step.active {
            background-color: #999;
            color: white;
        }

        .line.done {
            background-color: #0061fe !important;
        }

        @media (max-width: 768px) {

            .starter-section {
                padding-right: 20px;
                padding-left: 20px;
            }

            .step {
                width: clamp(11px, 5vw, 15px) !important;
                height: clamp(11px, 5vw, 15px) !important;
                font-weight: bold;
                font-size: clamp(12px, 2vw, 16px);
                flex-shrink: 0;
                z-index: 1;
            }

            .stepper {
                margin-bottom: 32px;
                width: 100%;
                max-width: 600px;
            }
        }

        /*========================  Steps finish ================================*/

        .icon {
            width: 50px
        }

        .starter-section .starter__title {
            font-weight: 900;
            font-size: clamp(24px, 10vw, 56px);
            font-family: "Nunito Sans", sans-serif;
            color: black;
            margin: 14px auto;
            max-width: 64%;
        }

        .starter-section .starter__desc {
            font-weight: 500;
            font-size: clamp(16px, 4vw, 22px);
            color: black;
            max-width: 60%;
            margin: 0 auto 20px auto;
            line-height: 1.4;
        }

        .starter-section .started__btn {
            position: relative;
            overflow: hidden;

            display: flex;
            align-items: center;
            justify-content: center;

            background-color: #0061fe;
            border-radius: 15px;

            padding: clamp(10px, 2vw, 20px) clamp(20px, 5vw, 40px);
            font-weight: 700;
            font-size: clamp(14px, 2vw, 34px);
            color: white;

            text-decoration: none;
            transition: all 0.3s ease;
            cursor: pointer;
            border: none;

            width: fit-content;
            max-width: 100%;
            margin: 30px auto 0;
            gap: 12px;

            white-space: nowrap;
            text-align: center;
            box-sizing: border-box;

            overflow: hidden;
            text-overflow: ellipsis;
        }

        .started__btn::before {
            content: "";
            position: absolute;
            top: 0;
            left: -75%;
            width: 50%;
            height: 100%;
            background: linear-gradient(
                    120deg,
                    transparent,
                    rgba(255, 255, 255, 0.4),
                    transparent
            );
            transform: skewX(-20deg);
            transition: left 0.8s ease;
            z-index: 1;
        }

        .started__btn:hover::before {
            left: 125%;
        }

        .starter-section .started__title {
            font-weight: 700;
            font-size: clamp(20px, 6vw, 50px) !important;
            color: black;
            margin: 0 auto;
            max-width: 90%;
            text-align: center;
            line-height: 1.2;
        }

        @media (max-width: 1200px) {
        }

        @media (min-width: 480px) and (max-width: 768px) {

        }

        @media (max-width: 480px) {

            .icon {
                width: 40px
            }

            .starter-section {
                padding-top: 30px;
            }

            .starter-section .starter__title {
                font-weight: 900;
                font-size: clamp(16px, 10vw, 24px);
                color: black;
                /*margin: 10px 0px 5px 0px;*/
                max-width: 100%;
            }

            .starter-section .starter__desc {
                font-weight: 300;
                font-size: clamp(14px, 4vw, 20px);
                color: black;
                max-width: 100%;
                margin: 10px auto 20px auto;
                line-height: 1.4;
            }

            .starter-section .started__btn {
                white-space: normal;
                font-size: clamp(16px, 2vw, 34px);
                width: 100%;
            }

            .starter-section .success__btn {
                font-size: 24px !important;
            }
        }

        /*========================  Register start ================================*/

        .register__log {
            display: flex;
            flex-direction: column;
            gap: 0px;
            align-items: center;
            margin: 10px 0;
            padding: 0 16px;
            box-sizing: border-box;
        }

        .register__input {
            width: 100%;
            max-width: 600px;
            height: clamp(50px, 10vw, 60px);
            padding: 12px 16px;
            font-size: clamp(16px, 4vw, 26px);
            border: 2px solid gray;
            border-radius: 14px;
            box-sizing: border-box;
            margin-bottom: 10px;
        }

        .register__input:focus {
            outline: none;
            border-color: #ff4d4f;
        }

        .register__dec {
            font-weight: 600;
            font-size: clamp(14px, 3.5vw, 22px);
            color: gray;
            margin: 30px auto;
            max-width: 600px;
            text-align: center;
            line-height: 1.5;
            padding: 0 12px;
        }

        .platform__title {
            font-weight: 500;
            font-size: clamp(15px, 3.5vw, 24px);
            color: gray;
            margin: 40px auto;
            max-width: 800px;
            width: 100%;
            padding: 0 16px;
            text-align: center;
            line-height: 1.4;
            box-sizing: border-box;
        }

        .platform-two__title {
            font-weight: 500;
            font-size: clamp(22px, 3.5vw, 24px);
            color: gray;
            margin: 0 auto;
            max-width: 800px;
            width: 100%;
            padding: 0 16px;
            text-align: center;
            line-height: 1.4;
            box-sizing: border-box;
        }

        .media__title {
            font-weight: 300;
            font-size: clamp(15px, 3.5vw, 22px);
            color: gray;
            margin: 10px auto;
            max-width: 800px;
            width: 100%;
            padding: 0 16px;
            text-align: center;
            line-height: 1.4;
            box-sizing: border-box;
        }

        @media (max-width: 500px) {
            .register__log {
                row-gap: 4.56px;
            }

            .register__input {
                margin-bottom: 2px;
            }

            .icon-box {
                width: 40px;
                height: 40px;
            }

            .icon-box.selected {
                border-color: #0061fe;
            }

            .icon-img {
                max-width: 30px;
                max-height: 30px;
            }

            .check-icon {
                position: absolute;
                top: 6px;
                right: 3px;
                color: #0061fe;
                font-size: 20px;
                display: none;
            }

            .icon-box.selected .check-icon {
                display: block;
            }

            .custom-label {
                text-decoration: none;
                user-select: none;
                cursor: pointer;
            }

            /*========================  Register finish ================================*/
            /*========================  Select start ================================*/
            .select-wrapper {
                position: relative;
                max-width: 630px;
                width: 100%;
                margin: 10px auto;
                /*padding: 0px;*/
                box-sizing: border-box;
            }

            .custom-select {
                width: 100%;
                max-width: 600px;
                height: clamp(50px, 10vw, 60px);
                padding: 10px 50px 10px 20px;
                font-size: clamp(16px, 4vw, 26px);
                font-weight: 600;
                border: 1.2px solid #a3a3a3;
                border-radius: 6px;
                font-family: "Nunito Sans", sans-serif;

                appearance: none;
                -webkit-appearance: none;
                -moz-appearance: none;
                background-color: white;
            }

            /*========================  Select finish ================================*/
            /*========================  Range start ================================*/
            .range__title {
                font-weight: 400;
                font-size: clamp(20px, 5vw, 40px);
                background-color: rgb(232, 232, 232);
                padding: 10px clamp(20px, 5vw, 35px);
                border-radius: 40px;
                text-align: center;
                width: 100%;
                max-width: 180px;
                margin: 0 auto 20px;
            }

            .starter-section .started__btn {
                width: fit-content;
                max-width: 100%;
                margin: 30px auto 0;
                gap: 12px;

            }

            .styled-range {
                -webkit-appearance: none;
                appearance: none;

                width: 100%;
                min-width: 600px;

                height: 20px;
                background: linear-gradient(to right, #0061fe 50%, #dee2e6 50%);
                border-radius: 20px;
                outline: none;
                display: block;
                position: relative;
                margin: 50px 0 50px 0;
            }

            .styled-range::-webkit-slider-thumb {
                -webkit-appearance: none;
                appearance: none;

                width: 30px;
                height: 30px;

                background: white;
                border: 2px solid #ddd;
                border-radius: 50%;
                cursor: pointer;

                margin-top: -1px;

                position: relative;
                z-index: 2;
            }

            .styled-range::-moz-range-thumb {
                width: 40px;
                height: 40px;
                background: #0061fe;
                border: 2px solid #0061fe;
                border-radius: 50%;
                cursor: pointer;
            }

            .styled-range::-moz-range-track {
                height: 20px;
                background: transparent;
            }
        }

        @media (min-width: 480px) and (max-width: 767px) {
            .styled-range {
                min-width: 420px;
                margin: 40px 0;
            }
        }

        @media (max-width: 479px) {
            .styled-range {
                min-width: 320px;
                margin: 30px 0 15px 0;
            }
        }


        /*========================  Range finish ================================*/

        /*========================  TextArea start ================================*/

        .auto-expand {
            overflow: hidden;
            resize: none;
        }

        .auto-grow-textarea {
            width: 100%;
            max-width: 600px;
            height: clamp(150px, 30vw, 250px);
            border: 2px solid gray;
            border-radius: 8px;
            padding: clamp(10px, 2vw, 16px);
            font-size: clamp(16px, 4vw, 27px);
            resize: none;
            overflow: hidden;
            box-sizing: border-box;
            transition: border-color 0.3s;
        }

        .auto-grow-textarea:focus {
            border-color: gray;
            outline: none;
        }

        /*========================  TextArea finish ================================*/

        .icon-box {
            position: relative;
            width: clamp(70px, 10vw, 110px);
            height: clamp(70px, 10vw, 110px);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            border: 2px solid transparent;
            transition: all 0.2s ease;
        }

        .icon-box:hover,
        .icon-box.active {
            border: 1px solid #0061fe;
            background-color: white;
        }

        .check-icon {
            position: absolute;
            top: -6px;
            right: -2px;
            color: #0061fe;
            font-size: clamp(16px, 3vw, 25px);
            display: none;
        }

        .icon-box.active .check-icon {
            display: flex;
        }

        .icon-text {
            margin-top: 10px;
            font-size: clamp(12px, 2.5vw, 18px);
            font-weight: 500;
            color: #474747;
            text-align: center;
        }


        .red {
            color: #0061fe;
        }

        .blue {
            color: #1877f2;
        }

        .pink {
            color: #e1306c;
        }

        .orange {
            color: #0061fe;
        }

        .purple {
            color: #6f42c1;
        }

        .teal {
            color: #20c997;
        }

        .gold {
            color: #f0ad4e;
        }

        .cyan {
            color: #00bcd4;
        }

        .brown {
            color: #8d6e63;
        }

        .gray {
            color: #6c757d;
        }

        @media (min-width: 400px) and (max-width: 575px) {
            .starter__title {
                font-size: 26px !important;
                max-width: 400px !important;
            }
        }

        @media (min-width: 576px) and (max-width: 767px) {
            /*.starter-section {*/
            /*    padding: 200px 40px;*/
            /*}*/
            .starter__title {
                font-size: 30px !important;
                max-width: 500px !important;
            }

            .starter__desc {
                font-size: 20px;
            }
        }

        @media (min-width: 768px) and (max-width: 991px) {
            /*.starter-section {*/
            /*    padding: 200px 40px;*/
            /*}*/
            .starter__title {
                font-size: 36px !important;
                max-width: 600px !important;
            }

            .starter__desc {
                font-size: 21px;
            }

            .starter__img {
                width: 140px;
                height: 140px;
            }
        }

        @media (min-width: 992px) and (max-width: 1199px) {
            /*.starter-section {*/
            /*    padding: 200px 40px;*/
            /*}*/
            .starter__title {
                font-size: 40px !important;
                max-width: 700px !important;
            }

            .starter__desc {
                font-size: 22px;
            }

            /*.starter__btn {*/
            /*    font-size: 22px;*/
            /*    max-width: 500px;*/
            /*}*/
        }

        @media (min-width: 1200px) and (max-width: 1399px) {
            /*.starter-section {*/
            /*    padding: 200px 40px;*/
            /*}*/
            .starter__title {
                font-size: 48px !important;
                max-width: 800px !important;
            }

            .starter__desc {
                font-size: 23px;
            }

            .starter__img {
                width: 180px;
                height: 180px;
            }
        }

        /*========================  Option start ================================*/

        .option__wrapper {
            padding: 40px 20px;
            border-radius: 20px;
            display: flex;
            gap: 100px;
            justify-content: center;
        }

        .option__card {
            background-color: #ffffff;
            padding: 30px;
            text-decoration: none;
            border-radius: 20px;
            border: none;
            width: 100%;
            max-width: 250px;
            height: auto;
            background: linear-gradient(135deg, #000000, #c3c1c1);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        .option__card:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
            border: none;
        }

        .option__card h3 {
            margin-bottom: 20px;
            font-weight: 500;
            font-size: 30px;
            color: white;
        }

        .option__card p {
            font-weight: 400;
            font-size: 20px;
            line-height: 1.5;
            color: rgb(223, 219, 219);
        }

        @media (max-width: 600px) {
            .option__wrapper {
                gap: 10px;
            }

            .option__card {
                max-width: 200px;
                padding: 15px 10px;

                h3 {
                    font-size: 20px;
                }

                p {
                    font-size: 15px;
                }
            }
        }

        /*========================  Option finish ================================*/
        /*========================  Situation start ================================*/

        .radio-wrapper {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            justify-content: center;
            padding: 10px;
        }

        .circle-card {
            width: clamp(50px, 10vw, 70px);
            height: clamp(50px, 10vw, 70px);
            border-radius: 50%;
            background-color: rgb(196, 196, 196);
            display: flex;
            align-items: center;
            justify-content: center;
            border: 2px solid transparent;
            transition: 0.3s;
            cursor: pointer;
            font-weight: bold;
            font-size: clamp(14px, 3vw, 18px);
            margin-top: 10px;
        }

        .circle-card:hover {
            background-color: #0061fe;
            color: white;
        }

        .radio-wrapper input[type="radio"] {
            display: none;
        }

        .radio-wrapper input[type="radio"]:checked + label {
            border-color: #0061fe;
            background-color: #0061fe;
            color: #fff;
        }

        /*========================  Situation finish ================================*/
        /*========================  Last start ================================*/

        .last__wrapper {
            display: flex;
            gap: 50px;
            padding-top: 30px;
            justify-content: center;
        }

        .last__card {
            background-color: #bdbcbc;
            padding: 24px 10px;
            text-align: center;
            border-radius: 30px;
            border: none;
            text-decoration: none;
            color: #000;
            flex: 1 1 200px;
            max-width: 200px;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
        }

        .last__card:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 18px rgba(0, 0, 0, 0.15);
            border: none;
        }

        .last__card h3 {
            font-size: 70px;
            font-weight: 700;
            margin-bottom: 15px;
        }

        .last__card p {
            font-weight: 500;
            font-size: 20px;
        }

        @media (max-width: 480px) {
            .last__wrapper {
                gap: 15px;
            }

            .last__card {
                max-width: 100%;
                flex: 1 1 100%;
            }
        }

        /*========================  Last finish ================================*/

    }

    .starter__desc {
        font-size: 23px;
    }

    .starter__img {
        width: 180px;
        height: 180px;
    }
}

/*========================  Option start ================================*/
.option__wrapper {
    padding: 40px 20px;
    border-radius: 20px;
    display: flex;
    gap: 100px;
    justify-content: center;
}

.option__card {
    background-color: #ffffff;
    padding: 30px;
    text-decoration: none;
    border-radius: 20px;
    border: none;
    width: 100%;
    max-width: 250px;
    height: auto;
    background: linear-gradient(135deg, #000000, #c3c1c1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.option__card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
    border: none;
}

.option__card h3 {
    margin-bottom: 20px;
    font-weight: 500;
    font-size: 30px;
    color: white;
}

.option__card p {
    font-weight: 400;
    font-size: 20px;
    line-height: 1.5;
    color: rgb(223, 219, 219);
}

@media (max-width: 600px) {
    .option__wrapper {
        gap: 10px;
    }

    .option__card {
        max-width: 200px;
        padding: 15px 10px;

        h3 {
            font-size: 20px;
        }

        p {
            font-size: 15px;
        }
    }
}

/*========================  Option finish ================================*/
/*========================  Situation start ================================*/
.radio-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    padding: 10px;
}

.circle-card {
    width: clamp(50px, 10vw, 70px);
    height: clamp(50px, 10vw, 70px);
    border-radius: 50%;
    background-color: rgb(196, 196, 196);
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid transparent;
    transition: 0.3s;
    cursor: pointer;
    font-weight: bold;
    font-size: clamp(14px, 3vw, 18px);
    margin-top: 10px;
}

.circle-card:hover {
    background-color: #0061fe;
    color: white;
}

.radio-wrapper input[type="radio"] {
    display: none;
}

.radio-wrapper input[type="radio"]:checked + label {
    border-color: #0061fe;
    background-color: #0061fe;
    color: #fff;
}

/*========================  Situation finish ================================*/
/*========================  Last start ================================*/
.last__wrapper {
    display: flex;
    gap: 50px;
    padding-top: 30px;
    justify-content: center;
}

.last__card {
    background-color: #bdbcbc;
    padding: 24px 10px;
    text-align: center;
    border-radius: 30px;
    border: none;
    text-decoration: none;
    color: #000;
    flex: 1 1 200px;
    max-width: 200px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}

.last__card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.15);
    border: none;
}

.last__card h3 {
    font-size: 70px;
    font-weight: 700;
    margin-bottom: 15px;
}

.last__card p {
    font-weight: 500;
    font-size: 20px;
}

@media (max-width: 480px) {
    .last__wrapper {
        gap: 15px;
    }

    .last__card {
        max-width: 100%;
        flex: 1 1 100%;
    }
}

/*========================  Last finish ================================*/

/* Phone number */

.phone-input-wrapper {
    display: flex;
    align-items: center;
    gap: 8px;
    max-width: 380px;
    margin: 0 auto;
}

.country-select select {
    height: 50px;
    min-width: 120px;
    border: 2px solid #ccc;
    border-radius: 8px;
    padding: 0 8px;
    font-size: 16px;
    cursor: pointer;
    background: #fff;
}

.number-input input {
    flex: 1;
    height: 50px;
    border: 2px solid #ccc;
    border-radius: 8px;
    padding: 0 12px;
    font-size: 16px;
}

.country-select select:focus,
.number-input input:focus {
    border-color: #7CAEFF;
    box-shadow: 0 0 6px rgba(124, 174, 255, 0.5);
}

/* Phone number */

/* Choices section */

.hidden-radio {
    display: none;
}

.choices-grid {
    display: flex;
    gap: 2rem;
    justify-content: center;
    margin-top: 2rem;
}

.choice-card {
    max-width: 200px;
    max-height: 200px;
    cursor: pointer;
    border-radius: 12px;
    padding: 20px;
    width: 150px;
    text-align: center;
    background-color: white;
    border: 2px solid #b9d6fd;
    transition: 0.3s;
}

.choice-card:hover {
    border: 2px solid #007bff;
    background-color: #b9d6fd;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.choice-card:has(input:checked) {
    border: 2px solid #007bff;
    background-color: #b9d6fd;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.choice-card > span {
    display: block;
    font-size: 16px;
    font-weight: 600;
    font-family: "Nunito Sans", sans-serif;
    padding-top: 20px;
}

.card-content {
    display: grid;
    justify-content: center;
}

.card-content img {
    display: block;
    width: 80px;
    height: 80px;
    /*margin-bottom: 10px;*/
}

@media (max-width: 480px) {
    .choice-card {
        max-width: 100px;
        max-height: 100px;
    }

    .choice-card > span {
        font-size: 12px;
        padding-top: 10px;
    }
}

/* Choices section */

/* Web site */

/* Web site */

/* Hold reason */

@media (max-width: 480px) {

    .hold_reason.register_paragraph {
        text-align: start;
    }

}

/* Hold reason */

/* Present condition */

.phone_form {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

/* Make input wider (desktop) */
.phone-input-wrapper {
    display: flex;
    justify-content: center;
    width: 100%;
    margin: 20px 0;
}

.phone-input-wrapper .register__input {
    width: 600px;
    max-width: 100%;
    padding: 12px;
    font-size: 18px;
    border-radius: 8px;
    border: 1px solid #ccc;
    text-align: left;
}

/* Mobile responsive: input same width as button */
@media (max-width: 768px) {
    .phone-input-wrapper .register__input,
    .starter__btn {
        width: 100%;
    }
}

.number-wrapper {
    display: flex;
    gap: 12px;
    justify-content: center;
    margin: 20px 0;
    flex-wrap: wrap;
}

.number-option {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.number-option input[type="radio"] {
    display: none;
}

.number-option span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: #E0E6FE;
    color: #0061FE;
    font-size: 24px;
    font-weight: 500;
    font-family: "Nunito Sans", sans-serif;
    transition: all 0.2s ease;
}

.number-option span:hover {
    background: #0061FE;
    color: #fff;
}

.number-option input[type="radio"]:checked + span {
    background: #0061FE;
    color: #fff;
    transform: scale(1.1);
}

/* mobile style */
@media (max-width: 768px) {
    .number-wrapper {
        display: grid;
        grid-template-columns: repeat(5, 1fr); /* 5 per row */
        gap: 12px;
    }

    .number-option {
        width: 100%; /* auto-fill grid cell */
    }
}

/* Desktop: wider input */
.phone-input-wrapper .register__input {
    width: 500px;
    max-width: 100%;
    padding: 12px;
    font-size: 18px;
    border-radius: 8px;
    border: 1px solid #ccc;
    text-align: left;
    display: block;
    /*margin: 0 auto;*/
}

/* Mobile: same as button (full width) */
@media (max-width: 768px) {
    .phone-input-wrapper .register__input,
    .starter__btn {
        width: 100%;
    }
}


/* Present condition */

/* Success */

.success_link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 180px;
    margin: 0 auto;
    padding-bottom: 30px;
}

.success_link a {
    width: 72px;
    height: 72px;
    background-color: #d4e7fd;
    border-radius: 16px;
    fill: #0061FE;
    border: 2px solid transparent;
}

.success_link a:hover {
    border-color: #0061FE;
}

.br_mobile {
    display: none;
}

@media (max-width: 768px) {

    .br_mobile {
        display: block;
    }

}

/* Success */

/* Starter page */

.main_starter {
    background-size: cover;
    background-position: left;
    background-repeat: no-repeat;
}

/* Starter page */