html {
    scroll-behavior: smooth;
}

#navbarmaindiv {
    position: sticky;
    z-index: 10000;
}

.main-bannerheader {
    background: url(../NewDesign/images/myfitment/banner-img.png) no-repeat center center !important;
    background-size: cover !important;
}


.banner_text_area {
    display: flex;
    flex-direction: column;
    text-align: center;
}

.font-weight-800 {
    font-weight: 800;
}

.next-header-text {
    color: rgba(232, 29, 37, 1);
    font-weight: 800;
    font-size: 45px !important;
}

.banner-p-f {
    font-size: 20px !important;
    font-weight: 700;
    border-bottom: 2px solid rgba(232, 29, 37, 1);
}

.red-span {
    color: rgba(232, 29, 37, 1);
    font-weight: 700;
}

.banner-p-s {
    font-size: 20px !important;
}

.btn-white {
    color: black;
    background-color: #fff;
    border: 1px solid rgba(33, 37, 41, 1);
    box-shadow: 4px 6px 20px 0px rgba(232, 29, 37, 0.16);
    font-weight: 700;
}

    .btn-white:hover {
        color: black;
        background-color: #fff;
        border: 1px solid rgba(33, 37, 41, 1);
        box-shadow: 4px 6px 20px 0px rgba(232, 29, 37, 0.16);
        font-weight: 700;
    }

.btn-danger {
    font-weight: 700;
}

.gap-10 {
    gap: 10px;
}

.gap-20 {
    gap: 20px;
}

.gap-30 {
    gap: 30px;
}

.gap-5 {
    gap: 5px;
}

.font-weight-500 {
    font-weight: 500;
}

.font-weight-600 {
    font-weight: 600;
}

.font-weight-700 {
    font-weight: 700;
}

.Heading-15px {
    font-size: 15px;
}

.Heading-19px {
    font-size: 19px;
}

.Heading-16px {
    font-size: 16px;
}

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

.Heading-28px {
    font-size: 28px;
}

.Heading-14px {
    font-size: 14px;
}

.banner-feature {
    margin-top: 75px;
    gap: 20px;
}

.retiring-header-text-s {
    color: rgba(232, 29, 37, 1);
    font-weight: 800;
}

.retiring-header-text-f {
    font-weight: 800;
}

.retiring-text-f {
    font-weight: 500;
    font-size: 20px;
}

.retiring-sub-box {
    background: rgba(242, 242, 242, 1);
    border-left: 5px solid rgba(232, 29, 37, 1);
    box-shadow: 0px 4px 18px 0px rgba(232, 29, 37, 0.25);
    border-bottom-right-radius: 8px;
    padding: 20px 15px;
    margin: 25px 0px 25px 15px;
}

.retiring-sub-box-header {
    color: rgba(232, 29, 37, 1);
    font-size: 14px;
    font-weight: 700;
}

.alternative-label {
    background: rgba(255, 255, 255, 1);
    border: 1px solid rgba(130, 130, 130, 0.2);
    box-shadow: 2px 4px 20px 0px rgba(232, 29, 37, 0.12);
    padding: 8px 20px;
    border-radius: 40px;
    font-weight: 700;
    font-size: 14px;
}

.alternative-main-subbox {
    position: relative;
}

.pc-log-img {
    position: absolute;
    top: 175px;
    left: 535px;
}

.alternative-box-f {
    padding: 60px;
    background: linear-gradient(270deg, rgba(232, 29, 37, 0.1) -95.34%, rgba(232, 29, 37, 0) 100%);
}

.alternative-box-s {
    padding: 60px;
}

.alternative-box-t {
    padding: 60px;
}

.alternative-box-fo {
    padding: 60px;
    background: linear-gradient(270deg, rgba(232, 29, 37, 0) 0%, rgba(232, 29, 37, 0.1) 199.32%);
}

.alternative-footer-text {
    border: 1px solid rgba(232, 29, 37, 0.5);
    padding: 20px 10px;
    margin: 0px;
    border-radius: 12px;
}

.migration-box-f {
    border: 2px solid rgba(232, 29, 37, 1);
    box-shadow: 0px 4px 18px 0px rgba(0, 0, 0, 0.25);
    padding: 10px;
    border-radius: 12px;
    height: stretch;
}

.download-img {
    position: absolute;
    top: -12px;
    left: 130px;
}

.Heading-17px {
    font-size: 17px;
}

.Heading-15px {
    font-size: 15px;
}

.red-circle-img-f {
    position: absolute;
    top: 100px;
    left: 186.5px;
    z-index: 9999;
}

.red-circle-img-s {
    position: absolute;
    top: 100px;
    left: 433px;
    z-index: 9999;
}

.red-circle-img-t {
    position: absolute;
    top: 100px;
    left: 679px;
    z-index: 9999;
}

.red-circle-img-fo {
    position: absolute;
    top: 100px;
    left: 925px;
    z-index: 9999;
}

.amazon-seller {
    background: url(../NewDesign/images/myfitment/seller-background.png) no-repeat center center !important;
    background-size: cover !important;
}

.automotive-seller-box-f {
    background: url(../NewDesign/images/myfitment/data-organization.png) no-repeat center center !important;
    background-size: cover !important;
    padding: 70px 30px 15px;
    border: 1px solid rgba(130, 130, 130, 1);
    box-shadow: 0px 4px 18px 0px rgba(130, 130, 130, 0.25);
    border-radius: 12px;
}

.automotive-seller-box-s {
    background: rgba(255, 255, 255, 1);
    border: 1px solid rgba(130, 130, 130, 1);
    box-shadow: 0px 4px 18px 0px rgba(130, 130, 130, 0.25);
    border-radius: 12px;
    padding: 30px 25px;
    height: stretch;
}

.imp-box {
    background: linear-gradient( 270deg, rgba(232, 29, 37, 0) 0%, rgba(232, 29, 37, 0.1) 100% );
    border-left: 10px solid rgba(232, 29, 37, 1);
    box-shadow: 0px 4px 18px 0px rgba(232, 29, 37, 0.25);
    padding: 20px;
}

.migration-box-section-area {
    padding: 0;
}

.bottom-img {
    position: absolute;
    top: 250px;
    width:100%;
}
.right-line-img {
    position: absolute;
    top: 0;
    right: 0px;
}

.bottom-img-fo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
.right-line-img-fo {
    position: absolute;
    top: 25px;
    left: 0;
}
.bottom-img-t {
    display: none;
}


@media only screen and (max-width: 1286px) {
    .banner-feature {
        gap: 0px;
    }
}

@media only screen and (max-width: 1236px) {
    .red-circle-img-f {
        top: 100px;
        left: 177px;
    }

    .red-circle-img-s {
        top: 100px;
        left: 424px;
    }

    .red-circle-img-t {
        top: 100px;
        left: 670px;
    }

    .red-circle-img-fo {
        top: 100px;
        left: 910px;
    }

    .banner-feature {
        gap: 0px;
    }
}

@media only screen and (max-width: 1220px) {
    .red-circle-img-f {
        top: 100px;
        left: 177px;
    }

    .red-circle-img-s {
        top: 100px;
        left: 424px;
    }

    .red-circle-img-t {
        top: 100px;
        left: 665px;
    }

    .red-circle-img-fo {
        top: 100px;
        left: 905px;
    }
}

@media only screen and (max-width: 1210px) {
    .pc-log-img {
        top: 175px;
        left: 505px;
    }

    .red-circle-img-f {
        top: 100px;
        left: 170px;
    }

    .red-circle-img-s {
        top: 100px;
        left: 414px;
    }

    .red-circle-img-t {
        top: 100px;
        left: 655px;
    }

    .red-circle-img-fo {
        top: 100px;
        left: 890px;
    }
}

@media only screen and (max-width: 1195px) {
    .red-circle-img-f {
        top: 100px;
        left: 170px;
    }

    .red-circle-img-s {
        top: 100px;
        left: 404px;
    }

    .red-circle-img-t {
        top: 100px;
        left: 645px;
    }

    .red-circle-img-fo {
        top: 100px;
        left: 880px;
    }
}

@media only screen and (max-width: 1180px) {
    .red-circle-img-f {
        top: 100px;
        left: 170px;
    }

    .red-circle-img-s {
        top: 100px;
        left: 400px;
    }

    .red-circle-img-t {
        top: 100px;
        left: 635px;
    }

    .red-circle-img-fo {
        top: 100px;
        left: 865px;
    }
}

@media only screen and (max-width: 1164px) {
    .red-circle-img-f {
        top: 110px;
        left: 180px;
    }

    .red-circle-img-s {
        top: 110px;
        left: 411px;
    }

    .red-circle-img-t {
        top: 110px;
        left: 641px;
    }

    .red-circle-img-fo {
        top: 110px;
        left: 870px;
    }

    .red-arrow-img {
        width: 50px;
    }

    .download-img {
        top: -7px;
        left: 115px;
    }
}

@media only screen and (max-width: 1155px) {
    .red-circle-img-f {
        top: 110px;
        left: 178px;
    }

    .red-circle-img-s {
        top: 110px;
        left: 406px;
    }

    .red-circle-img-t {
        top: 110px;
        left: 630px;
    }

    .red-circle-img-fo {
        top: 110px;
        left: 860px;
    }
}

@media only screen and (max-width: 1145px) {
    .pc-log-img {
        top: 175px;
        left: 480px;
    }

    .red-circle-img-f {
        top: 115px;
        left: 175px;
    }

    .red-circle-img-s {
        top: 115px;
        left: 403px;
    }

    .red-circle-img-t {
        top: 115px;
        left: 628px;
    }

    .red-circle-img-fo {
        top: 115px;
        left: 855px;
    }
    .retiring {
        padding-top: 0px !important;
    }
}

@media only screen and (max-width: 1130px) {
    .red-circle-img-f {
        top: 115px;
        left: 172px;
    }

    .red-circle-img-s {
        top: 115px;
        left: 398px;
    }

    .red-circle-img-t {
        top: 115px;
        left: 620px;
    }

    .red-circle-img-fo {
        top: 115px;
        left: 840px;
    }
}

@media only screen and (max-width:1115px) {
    .red-circle-img-f {
        top: 115px;
        left: 170px;
    }

    .red-circle-img-s {
        top: 115px;
        left: 393px;
    }

    .red-circle-img-t {
        top: 115px;
        left: 610px;
    }

    .red-circle-img-fo {
        top: 115px;
        left: 830px;
    }
}

@media only screen and (max-width: 1100px) {
    .pc-log-img {
        top: 175px;
        left: 455px;
    }

    .red-circle-img-f {
        top: 115px;
        left: 168px;
    }

    .red-circle-img-s {
        top: 115px;
        left: 388px;
    }

    .red-circle-img-t {
        top: 115px;
        left: 600px;
    }

    .red-circle-img-fo {
        top: 115px;
        left: 820px;
    }
}

@media only screen and (max-width: 1088px) {
    .pc-log-img {
        top: 175px;
        left: 455px;
    }

    .red-circle-img-f {
        top: 115px;
        left: 170px;
    }

    .red-circle-img-s {
        top: 115px;
        left: 386px;
    }

    .red-circle-img-t {
        top: 115px;
        left: 601px;
    }

    .red-circle-img-fo {
        top: 115px;
        left: 815px;
    }

    .red-arrow-img {
        width: 40px;
    }

    .download-img {
        top: -7px;
        left: 105px;
    }
}

@media only screen and (max-width:1072px) {
    .red-circle-img-f {
        top: 115px;
        left: 170px;
    }

    .red-circle-img-s {
        top: 115px;
        left: 380px;
    }

    .red-circle-img-t {
        top: 115px;
        left: 591px;
    }

    .red-circle-img-fo {
        top: 115px;
        left: 800px;
    }
}

@media only screen and (max-width: 1055px) {
    .pc-log-img {
        top: 175px;
        left: 435px;
    }

    .red-circle-img-f {
        top: 115px;
        left: 167px;
    }

    .red-circle-img-s {
        top: 115px;
        left: 375px;
    }

    .red-circle-img-t {
        top: 115px;
        left: 584px;
    }

    .red-circle-img-fo {
        top: 115px;
        left: 790px;
    }
}

@media only screen and (max-width: 1040px) {
    .red-circle-img-f {
        top: 115px;
        left: 162px;
    }

    .red-circle-img-s {
        top: 115px;
        left: 367px;
    }

    .red-circle-img-t {
        top: 115px;
        left: 572px;
    }

    .red-circle-img-fo {
        top: 115px;
        left: 776px;
    }
}

@media only screen and (max-width: 1024px) {
    .pc-log-img {
        top: 175px;
        left: 425px;
    }

    .red-circle-img-f {
        top: 115px;
        left: 161px;
    }

    .red-circle-img-s {
        top: 115px;
        left: 361px;
    }

    .red-circle-img-t {
        top: 115px;
        left: 563px;
    }

    .red-circle-img-fo {
        top: 115px;
        left: 763px;
    }
}

@media only screen and (max-width: 1010px) {
    .red-circle-img-f {
        top: 115px;
        left: 155px;
    }

    .red-circle-img-s {
        top: 115px;
        left: 355px;
    }

    .red-circle-img-t {
        top: 115px;
        left: 552px;
    }

    .red-circle-img-fo {
        top: 115px;
        left: 746px;
    }

    .download-img {
        top: -5px;
        left: 100px;
    }
}

@media only screen and (max-width: 991px) {
    .pc-log-img {
        display: none;
    }

    .migration-box-section {
        justify-content: start !important;
    }

    .red-circle-img-f, .red-circle-img-s, .red-circle-img-t, .red-circle-img-fo {
        display: none;
    }

    .migration-box-section-area {
        padding: 10px;
    }

    .download-img {
        top: -5px;
        left: 210px;
    }

    .automotive-seller-box-s {
        margin-top: 10px;
    }

    .alternative-box-s {
        background: linear-gradient(270deg, rgba(232, 29, 37, 0) 0%, rgba(232, 29, 37, 0.1) 199.32%);
    }

    .alternative-box-t {
        background: linear-gradient(270deg, rgba(232, 29, 37, 0.1) -95.34%, rgba(232, 29, 37, 0) 100%);
    }
    .right-line-img{
        display: none;
    }
    .right-line-img-fo{
        display: none;
    }
    .bottom-img-t{
        display: block;
        position: absolute;
        top: 0;
        width: 100%;
    }
}

@media only screen and (max-width: 920px) {
    .download-img {
        top: -5px;
        left: 190px;
    }
}

@media only screen and (max-width: 860px) {
    .download-img {
        top: -5px;
        left: 170px;
    }
}

@media only screen and (max-width: 810px) {
    .download-img {
        top: -5px;
        left: 150px;
    }
}

@media only screen and (max-width: 767px) {
    .migration-box-section-area {
        padding: 10px 0px;
    }

    .download-img {
        top: -5px;
        left: 600px;
    }

    .migration-box-f, .migration-box-s, .migration-box-t, .migration-box-fo {
        padding: 20px;
    }
}

@media only screen and (max-width: 735px) {
    .download-img {
        top: -5px;
        left: 550px;
    }
}

@media only screen and (max-width: 680px) {
    .download-img {
        top: -5px;
        left: 500px;
    }
}

@media only screen and (max-width: 635px) {
    .download-img {
        top: -5px;
        left: 450px;
    }

    .banner-feature {
        flex-direction : column;
        gap: 10px;
        margin: 25px;
    }
}

@media only screen and (max-width: 585px) {
    .download-img {
        top: -5px;
        left: 400px;
    }
}

@media only screen and (max-width: 575px) {
    .img-box-header {
        flex-direction: column;
        gap: 10px;
    }
}

@media only screen and (max-width: 535px) {
    .alternative-footer-text-b {
        flex-direction: column;
        gap: 15px;
    }
    .download-img {
        top: -5px;
        left: 350px;
    }
}

@media only screen and (max-width: 485px) {
    .download-img {
        top: -5px;
        left: 300px;
    }
}

@media only screen and (max-width: 430px) {
    .download-img {
        top: -5px;
        left: 250px;
    }
}


@media only screen and (max-width: 385px) {
    .download-img {
        top: -5px;
        left: 210px;
    }
}

@media only screen and (max-width: 340px) {
    .download-img {
        top: -5px;
        left: 170px;
    }
    .imp-box{
        padding: 10px;
    }
}