@media (max-width:425px){
    .title-29px{
        text-align: center;
    }
}

.button1 {
    background: #0064A3;
}
.button1:hover {
    background: #004570;
}

#mainid .imgcontainer,
#mainid p{
    margin-top: 10px;
}


#mainid .titlehead{
    display: inline !important;
    text-transform: capitalize !important;
    
}

#mainid img.img-responsive {
    width: 100%;
}

#mainid .container-fluid {
    padding: 0;
}

#mainid .row {
    max-width: 1200px;
    margin: auto;
}

#mainid .row.row1 {
    max-width: unset !important;
}

a.button1{
    cursor: pointer;
    margin-top: 5%;
}

.button1:visited {
        color: white;
    }

/* global 1 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    /* outline: 1px solid lightgreen; */
}

.textwhite {
    color: #ffffff;
}

.textdark {
    color: #000000;
}

.w700{
    font-weight: 700 !important;
}

.w600{
    font-weight: 600 !important;
}

.w500{
    font-weight: 500 !important;
}

.w400{
    font-weight: 400 !important;
}

/* global 2 */

/* images animation */
#mainid img.img-responsive:hover {
    transform: scale(1.1);
}

#mainid img.img-responsive {
    transition: all 0.5s;
}

/* image parents is figure with class name .imgcontainer  */
#mainid figure.imgcontainer {
    position: relative;
    padding: 0px;
    overflow: hidden;
}

#background-image-1{
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(https://di-uploads-pod34.dealerinspire.com/modernhyundaiofconcord/uploads/2024/06/The-2024-Hyundai-KONA-Electric-At.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#background-image-4 > div:nth-child(1){
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(https://di-uploads-pod34.dealerinspire.com/modernhyundaiofconcord/uploads/2024/06/Power-Meets-Sustainability.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#background-image-5 > div:nth-child(1){
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(https://di-uploads-pod34.dealerinspire.com/modernhyundaiofconcord/uploads/2024/06/2024-Hyundai-KONA-Electric-In-2.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#background-image-6 > div:nth-child(1){
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(https://di-uploads-pod34.dealerinspire.com/modernhyundaiofconcord/uploads/2024/05/2024-Hyundai-Elantra-Technology.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#background-image-7 > div:nth-child(1){
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(https://di-uploads-pod34.dealerinspire.com/modernhyundaiofconcord/uploads/2024/05/2024-Hyundai-Elantra-Safety-Features.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#background-image-8 > div:nth-child(1){
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(https://di-uploads-pod34.dealerinspire.com/modernhyundaiofconcord/uploads/2024/05/A-hub-of-innovation-and-Connectivity.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#background-image-9{
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(https://di-uploads-pod34.dealerinspire.com/modernhyundaiofconcord/uploads/2024/06/2024-Hyundai-KONA-Trims.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#background-image-8 > div:nth-child(2) > div:nth-child(2),
#background-image-8 > div:nth-child(2) > div:nth-child(1),
#background-image-7 > div:nth-child(2) > div:nth-child(2),
#background-image-7 > div:nth-child(2) > div:nth-child(1),
#background-image-6 > div:nth-child(2) > div:nth-child(2),
#background-image-6 > div:nth-child(2) > div:nth-child(1),
#background-image-5 > div:nth-child(2) > div:nth-child(1),
#background-image-5 > div:nth-child(3) > div:nth-child(1),
#background-image-4 > div:nth-child(3) > div.col-sm-6.col-sm-push-6.colcenter,
#background-image-3 > div:nth-child(3) > div:nth-child(1),
#background-image-3 > div:nth-child(2) > div:nth-child(1){
    max-width: 700px unset;
    margin: auto;
}

/* section 1 */

/* SSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSS */
/* Extra Small */
@media(max-width:767px) {

    .height200{
        height: 320px;
    }

    #mainid p,
    #mainid ul {
        font-size: 18px;
        font-weight: 300;
        line-height: 1.3em;
    }

    #mainid ul > li{
        margin-left: 36px;
    }

    #mainid .title-48px{
        font-size: 38px;
        font-weight: 600;
        line-height: 1.3em;
    }

    #mainid .title-29px{
        font-size: 29px;
        font-weight: 600;
        line-height: 1.3em;
    }

    #mainid .title-30px{
        font-size: 24px;
        font-weight: 700;
        line-height: 1.3em;
    }

    #mainid .title2830{
        font-size: 28px;
        font-weight: 700;
        line-height: 1.3em;
    }

    #mainid .title-19px{
        font-size: 19px;
        font-weight: 600;
        line-height: 1.3em;
    }

    #mainid .titlebold {
        font-weight: 700;
    }

    #mainid .button1 {
        font-size: 15px;
        font-weight: 700;
        line-height: 1em;
        padding: 16px 0px;
        display: inline-block;
        width: 100%;
        /* width: 100%; */
        color: #ffffff;
        text-align: center;
        margin-bottom: 10px;
    }

    #mainid .button1:hover {
        text-decoration: none;
    }

    #mainid img.img-responsive {
        object-fit: cover;
        object-position: center;
    }

    /* #background-image-8{
    height: 300px;
    } */

    /* section 1 */
}

@media all and (min-width: 768px) and (max-width: 1024px) { 
    #background-image-1 > div > div > h2,
    #background-image-1 > div > div > h1{
        width: 563px;
    }

}



/* SSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSS */
/* Small */
/* LLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLL */
@media(min-width:768px) {
    .height200{
        height: 520px;
    }

    .row.rowcenter{
    display: flex;
    flex-wrap: nowrap;
}

    .row .colcenter{
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    #mainid p,
    #mainid ul {
        font-size: 22px;
        font-weight: 300;
        line-height: 1.3em;
    }

    #mainid ul > li{
        margin-left: 44px;
    }

    #mainid .title-48px{
        font-size: 48px;
        font-weight: 600;
        line-height: 1.3em;
    }

    #mainid .title-29px{
        font-size: 36px;
        font-weight: 600;
        line-height: 1.3em;
    }

    #mainid .title-30px{
        font-size: 30px;
        font-weight: 700;
        line-height: 1.3em;
    }

    #mainid .title2830{
        font-size: 30px;
        font-weight: 700;
        line-height: 1.3em;
    }

    #mainid .title-19px{
        font-size: 24px;
        font-weight: 600;
        line-height: 1.3em;
    }

    #mainid .titlebold {
        font-weight: 700;
    }

    #mainid .button1 {
        font-size: 15px;
        font-weight: 700;
        line-height: 1em;
        padding: 16px 0px;
        display: inline-block;
        width: 100%;
        max-width: 222px;
        color: #ffffff;
        text-align: center;
    }

    #mainid .button1:hover {
        text-decoration: none;
    }

    #mainid figure>img.img-responsive {
        object-fit: cover;
        object-position: center;
    }

    .row.rowcenter{
        display: flex;
        flex-wrap: nowrap;
    }

    .row .colcenter{
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

}