
.download-wrapper > .r1{
    background: url('https://nextlevelracing.com/wp-content/uploads/2024/09/software_download_banner-optimized.webp');
    background-size: cover;
    background-repeat: no-repeat;
    color: #fff;
    padding: 54px 10px 0;
    background-color: #000;
}
.download-wrapper p {
    display: none;
}
.download-wrapper > .r1 > .inner{
    width: 1328px;
    margin: auto;
    max-width: 100%;    
}
.r1 > .inner > .s2 {
    background: linear-gradient(180deg, #141414, #161616);
    padding: 33px 40px;
    margin-top: 77px;
}

.r1 > .inner > .s2 > .password-form {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-column-gap: 14px;
    grid-row-gap: 16px;
}

.sub-heading {
    padding-bottom: 13px;
    position: relative;
    margin-bottom: 8px;
}
.sub-heading:after {
    content: '';
    display: inline-block;
    height: 1px;
    width: 62px;
    position: absolute;
    background: #BBBBBB;
    left: 0;
    bottom: 0;
    opacity: 0.5;    
}
.heading-title {
    font-family: 'Exo';
    font-size: 42px;
    font-weight: 900;
    text-transform: uppercase;
    line-height: 56px;
    margin-bottom: 6px;
}
.ppt {
    font-size: 16px;
    line-height: 22px;
}
.password-form .field label{
    display: flex; 
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 20px;
    align-items: flex-end;
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 10px;
    color: #fff;
}
.password-form .field label a {
    font-size: 14px;
    line-height: 22px;
    color: #707070;
    text-decoration: none;
}
.password-form .field label a:after {
    content: '\f129';
    font-family: 'fontAwesome';
    line-height: 1;
    font-size: 10px;
    border-radius: 50%;
    color: #000;
    margin-left: 5px;
    display: inline-grid;
    place-content: center;
    background: #707070;
    height: 12px;
    width: 12px;
}

.sn-wrapper {
    background: #3E3E3E;
    position: relative;
    border-radius: 5px;
    overflow: hidden;
}

.sn-wrapper #serial_number {
    color: rgb(255 255 255 / 41%);
    background: transparent;
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
    /* -webkit-box-shadow: 0 0 0 30px #3e3e3e inset !important; */
    padding: 8px 117px 8px 20px;
    font-size: 16px;
    line-height: 1;
    min-height: 39px;
    width: 100%;
    display: block;
}
.sn-wrapper #serial_number::placeholder {
    opacity: 1;
    color: inherit;
}
.sn-wrapper button {
    font-family: 'Roboto';
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 1.6px;
    padding: 8px;
    display: inline-grid;
    width: 117px;
    max-width: 100%;
    height: 100%;
    place-content: center;
    position: absolute;
    border-width: 0;
    border-radius: 0;
    background: #FF0000;
    right: 0;
    top: 0;
}
.sn-wrapper button:after {
    content: none;
}

.password-form .buttons {
    position: relative;
}
.password-form .buttons .selected-text {
    padding: 8px 43px 8px 24px;
    display: flex;
    column-gap: 10px;
    align-items: center;
    justify-content: space-between;
    background: #3E3E3E;
    color: rgb(255 255 255 / 41%);
    border-radius: 5px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    min-height: 39px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.password-form .buttons .selected-text:after {
    content: "\f0d7";
    font-family: 'fontAwesome' !important;
    font-size: 12px;
    position: absolute;
    right: 0;
    width: 39px;
    height: 100%;
    display: inline-grid;
    place-content: center;
    background: #A7A7A7;
}


.password-form .buttons ul {
    display: block;
    width: 100%;
    list-style: none;
    margin: 5px 0 0;
    position: absolute;
    background: #3E3E3E;
    color: #fff;
    border-radius: 5px;
    line-height: 1.7;
    padding: 5px 0;
    z-index: 1;
    top: 100%;
    left: 0;
}

.password-form .buttons ul li a {
    padding: 5px 20px;
    display: block;
    text-decoration: none;
}

.password-form .buttons ul li a.selected, .password-form .buttons ul li a:hover {
    opacity: 0.5;
}

.password-form .buttons ul {
    display: none;
}

.password-form .buttons ul.show{
    display: block;
}


.sf_error_msg {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
    color: red;
    margin: 6px 0;
}
 .desc {
    font-size: 12px;
    line-height: 18px;
    width: 838px;
    max-width: 100%;
    margin-top: 20px;
}
.desc a {
    color: #FF0033;
    text-decoration: none;
}
.desc a:hover {
    text-decoration: underline;;
}
.download-wrapper > .r2 {
    padding: 65px 10px 70px;
}
.download-wrapper > .r2 > .inner{
    width: 872px;
    max-width: 100%;
    margin: auto;
}
.download-wrapper > .r2 > .inner .heading {
    font: normal normal 900 26px/1 Exo;
    text-transform: uppercase;
    color: #000;
    text-align: center;
    margin-bottom: 16px;
}

/* .pro-result-con {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
} */
.pro-result-con .prod-name {
    font: bold 22px/22px Exo;
    text-align: center;
    color: #000;
    background: #F0F0F0;
    padding: 12.5px 10px;
}
.pro-result-con .img-con {
    text-align: center;
    padding: 40px; 
}
.pro-result-con .c2 {
    padding: 28px 0 0;
}

.prod-motion {
    text-align: center;
    font: 500 14px/22px Exo;
    position: relative;
    margin-bottom: 6px;
}
.prod-motion .selected-text {
    cursor: pointer;
}
.prod-motion .selected-text span {
    position: relative;
}
.prod-motion .selected-text span:after {
    content: "\f0d7";
    font-family: 'fontAwesome' !important;
    font-size: 12px;
    margin-left: 15px;
    position: absolute;
    right: -15px;
    top: -1px;;
    
}
.prod-motion ul {
    display: none;
    list-style: none;
    margin: 0;
    padding: 0;
    background: #fff;
    width: 100%;
    position: absolute;
    top: calc(100%);
    padding: 8px 0;
}
.prod-motion ul.show{
    display: block;
}
.prod-motion ul li{
    padding: 7px 10px;
    line-height: 1;
    cursor: pointer;
    transition: opacity 0.3s ease;
}
.prod-motion ul li.selected,
.prod-motion ul li:hover {
    opacity: 0.5;
}
#append-product-result.loading {
    opacity: 0.5;
}

@media (max-width: 767px) {
    .r1 .s1 {
        text-align: center;
    }
    .r1 > .inner > .s2 {
        padding: 33px 20px;
    }    
    .heading-title {
        font-size: 22px;
    }    
    .sub-heading:after {
        left: 50%;
        translate: -50% 0;
    }  
    .sn-wrapper button {
        width: 90px;
    }      
    .r1 > .inner > .s2 > .password-form,
    .pro-result-con{
        grid-template-columns: 1fr;
    }
    .pro-result-con .c1 {
        order: 2;
    }
    .download-wrapper > .r2 > .inner .heading {
        font: normal normal 900 24px/1.2 Exo;
    }    
    .download-wrapper > .r1{
         background: url('https://nextlevelracing.com/wp-content/uploads/2024/05/software_download_banner_mobile.webp');
    }
    .download-wrapper > .r1{
        padding: 54px 36px 0;
    }
    .download-wrapper > .r2 {
        padding: 65px 36px 70px;
    }
    .pro-result-con .img-con {
        padding: 0px;
        margin-top: 50px;
    }
}



#reseller_cta #gallery-1 img {
    border: none;
}
@media(max-width:767px){
    #reseller_cta .gallery {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        gap: 0px;
        margin-left: 10px !important;
    }
    
    #reseller_cta .gallery-item {
        padding: 10px 10px 0px 0;
        width: fit-content !important;
        margin: 0 !important;
    }
}