

*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
.call{
    /* border: 10px solid red; */
   /* height: 10px; */
    display: flex;
    justify-content: end;
    /* height: 100vh; */
    align-items: center;
   
   position: fixed;
   right: 80px;
   top: 500px;
   height: 50px;
   width: 50px;
   background-color: white;
   border-radius: 50%;
   padding: 10px 15px 10px 10px;
   border: 1px solid black;
}



nav{

    display: flex;
    justify-content:space-between;
    align-items: center;
    width: 1300px;
    height: 90px;
    border-bottom: 2px solid white;
    margin-left: 80px;
    }
#max1{
    
    width: 700px;
    height: 90px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    color: white;
 }
    
#max2{
        width: 200px;
        height: 90px;
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        color: white;
}

.icon{
color: white;
width: 50px;
 height: 90px;
 display: flex;
 align-items: center;
 justify-content: space-around;
}

.icon:hover{
            border-bottom: 3px solid blue;
        }
        
.max{
            height: 90px;
            display: flex;
            justify-content: center;
            align-items: center; 
        }
        
        .max:hover{
            border-bottom: 3px solid blue;
        }
        
        #max3{
            width: 150px;
        }


        #ved{
            position: absolute;
            width: 100%;
        }


.Page1{
   
    background-size: cover;
    height: 100vh;
    width: 100%;
    position: relative;
    margin-bottom: 40px;
}

.Box{

 position: relative;
 top: 250px;
 left: 100px;
 width: 300px;
 height: 250px;
 font-size: 200px;
 font-weight: 100;
 font-family:  Arial, Helvetica, Roboto, sans-serif;
 color: white;
}

.name
{ 
    margin-top: 20px;
    margin-left: 80px;
    color: white;
    font-size: 20px;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}

.ever{
    position: relative;
    top: 8px;
    left: 100px;
    color: white;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    letter-spacing: 2px;
}

.electr
{
    position: relative;
    top: 180px;
    left: 100px;
    color: white;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    letter-spacing: 2px;
}

.disc{
    position: relative;
    top: 190px;
    left: 100px;
    color: white;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    letter-spacing: 2px;
}


button{
    width: 170px;
    height: 50px;
    background-color: rgb(21, 152, 233);
    color: white;
    border-style: none;
}

.page2{
    margin-top: 160px;
    background-color: gray;
    height: 95vh;
    background-image: url(images/Banner-desktop.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    
    
}

.Box1
{
    position: relative;
    top: 220px;
    left: 100px;
     letter-spacing: 2px;
    font-family:  Arial, Helvetica, Roboto, sans-serif;
    color: white;
}

.xdrive{
    position: relative;
    top: 240px;
    left: 100px;
    color: white;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    letter-spacing: 2px;
    font-size: 60px;
 font-weight: 100;
}

.curve{
    position: relative;
    top: 260px;
    left: 100px;
    color: white;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    letter-spacing: 2px;
    font-size: 26px;
    font-weight: 100;
}

.disc2{
    position: relative;
    top: 280px;
    left: 100px;
    color: white;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    letter-spacing: 2px; 
}



.page3{
    background-color: gray;
    height: 100vh;
    margin-top: 40px;
    
}

.section1{
    background-color: white;
    height: 55vh;
}

.shop{
    letter-spacing: 2px;
    color: gray;
    font-family:  Arial, Helvetica, Roboto, sans-serif;
}

.find{
    letter-spacing: 1px;
    font-size: 40px;
    
    font-family:  Arial, Helvetica, Roboto, sans-serif;
}

/* .car{
    position: relative;
    top: 160px;
    left: 240px;
    color: black;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    letter-spacing: 2px; 
} */


body{
    width: 100%;
}

.main{
    display: flex;
justify-content:space-around;
align-items: center;
width: 100%;
height: 280px;
font-size: 20px;
margin-left: 80px;
font-family:  Arial, Helvetica, Roboto, sans-serif;
}
.new{

    margin-left: 40px;
}
.drive{
    margin-left: 10px;
}

.Test{
    margin-left: 40px;
}

.img
{
    margin-left: 20px;
}


#but1{
    background-color: white;
    color:  rgb(38, 38, 38);
    height: 50px;
    width: 130px;
    font-weight: 700;
    font-size: 15px;
    font-family: Arial, Helvetica, Roboto, sans-serif;
    margin-left: 35px;
    border-radius: 5%;
    border: 1px solid black;
    
}

#but2{
    background-color: white;
    height: 50px;
    width: 200px;
    margin-left: 32px;
    font-weight: 700;
    font-size: 15px;
    font-family: Arial, Helvetica, Roboto, sans-serif;
    border-radius: 5%;
    border: 1px solid black;
}

#but3{
    background-color: white;
    height: 50px;
    width: 150px;
    margin-left: 35px;
    font-weight: 700;
    font-size: 15px;
    font-family: Arial, Helvetica, Roboto, sans-serif;
    border-radius: 5%;
    
}

.section2{
    /* background-color: gray; */
    height: 60vh;
    margin-bottom: 50px;
    background-image: url(images/WhatsApp\ Image\ 2024-06-03\ at\ 6.51.17\ PM.jpeg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: fixed;
    width: 100%;
}
.sectiona{
    position: relative;
    top: 160px;
    left: 100px;
     letter-spacing: 2px;
    font-family:  Arial, Helvetica, Roboto, sans-serif;
    color: white;
    font-size: 30px;
}


.sectionb{
    position: relative;
    top: 180px;
    left: 100px;
    color: white;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    letter-spacing: 2px;
    font-size: 20px;
}


#but4{
background-color: transparent;
    position: relative;
    top: 200px;
    left: 100px;
    color: white;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    letter-spacing: 2px;
    font-size: 20px;
border: 1px solid white;
    width: 200px;
    
}


.page4{
    background-color:gray;
    height: 75vh;
    margin-top: 150px;
    background-image: url(images/bmw-i7-&-7-series-desktop.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: fixed;
    width: 100%;
   
}

.sect1{
    position: relative;
    top: 160px;
    left: 100px;
     letter-spacing: 2px;
    font-family:  Arial, Helvetica, Roboto, sans-serif;
    color: white;
    font-size: 45px;
}

.sect2{
    position: relative;
    top: 180px;
    left: 100px;
    color: white;
    font-family:  Arial, Helvetica, Roboto, sans-serif;
    letter-spacing: 2px;
    font-size: 45px;
}

#but5{
    background-color: transparent;
    position: relative;
    top: 220px;
    left: 100px;
    color: white;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    letter-spacing: 2px;
    font-size: 20px;
  border: 1px solid white;
    width: 300px;
}

.page5{
    background-color: white;
    height: 50vh;
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
 
    width: 1300px;
    margin-left: 80px;
}

#imagecar1{
    margin-left: 10px;
    width: 650px;
    height: 350px;
}



/* .imagecar1{
    margin-left: 10px;
    width: 650px;
    height: 400px;
} */

.content1{
    margin-left: 22px;
    margin-top: 55px
}

#elec{
    font-family:  Arial, Helvetica, Roboto, sans-serif;
    color: gray;
}

#joy{
 font-size: 50px;
 font-family:  Arial, Helvetica, Roboto, sans-serif;
}

#exp{
    font-size: 20px;
    font-family:  Arial, Helvetica, Roboto, sans-serif;
}

#but6{
    background-color: white;
    color: black;
    border: 1px solid black;
}


/* .page6{
    background-color: gray;
    height: 100vh;
    margin-top: 500px;
} */

.page6{
    background-color: white;
    height: 60vh;
    margin-top: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 1300px;
    margin-left: 80px;
}

.content2{
    margin-left: 22px;
    margin-top: 55px
}

#imagecar2{
    margin-top: 1px;
    margin-left: 10px;
    width: 650px;
    height: 350px;
}

#elec1{
    font-family:  Arial, Helvetica, Roboto, sans-serif;
    color: gray;
}

#joy1{
 font-size: 50px;
 font-family:  Arial, Helvetica, Roboto, sans-serif;
}

#exp1{
    font-size: 20px;
    font-family:  Arial, Helvetica, Roboto, sans-serif;
}

#but7{
    background-color: white;
    color: black;
    border: 1px solid black;
}

footer{
    
    height: 70vh;
}

.navfooter{
    display: flex;
    justify-content:space-between;
    align-items: center;
    /* width: 1300px;
    height: 90px; */
    position: relative;
    left: 52px;


}

.ww{

    position: relative;
    left: 52px;
    margin-top: 10px;
    width: 200px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
   
}

.container{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    margin-top: 40px;
    position: relative;
    right: 50px;

}

.hi{
    display: inline-block;
    color: rgb(77, 77, 77);
    font-size: 10px;
    font-weight: 300;
    letter-spacing: 1px;
    font-family: Arial, Helvetica, sans-serif;
}

.heading{
    color: rgb(77, 77, 77);
    font-size: 10px;
    font-weight: 300;
    letter-spacing: 1px;
    font-family: Arial, Helvetica, sans-serif;
}

.all{
    color:  rgb(38, 38, 38);
    font-size: 16px;
    font-weight: 300;
    font-family: Arial, Helvetica, Roboto, sans-serif;
    position: relative;
    left: 25px;
}

.cont{
    color:  rgb(38, 38, 38);
    font-size: 14px;
   font-weight: 700;
   font-family: Arial, Helvetica, sans-serif; 
   
}
.icons{
    position: relative;
    top: 50px;
    left: 120px;
    color: black;
    width: 200px;
     height: 80px;
     display: flex;
     justify-content: space-around;
     align-items: center;
 
}


.end{
    position: relative;
    top: 60px;
    left: 30x;
    color: black;
    width: 100%;
     height: 70px;
     display: flex;
     justify-content: space-between;
     align-items: center;
    

}

.end1{
    width: 700px;
    height: 40px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    color: rgb(38, 38, 38);
    position: relative;
    right:  200px;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-family: Arial, Helvetica, Roboto, sans-serif;
}

.end2{
    position: relative;
    right: 50px;
        width: 500px;
        height: 40px;
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        color:  rgb(38, 38, 38);
        font-size: 14px;
        font-weight: 300;
      font-family:  Arial, Helvetica, Roboto, sans-serif;
    font-style: normal;
}

.end21:hover{
    font-weight: 700;
    font-size: 12px;
    color: rgb(28, 105, 212);
    font-style: normal;
}
.end22:hover{
    font-weight: 700;
    font-size: 12px;
    color: rgb(28, 105, 212);
    font-style: normal;
}

.end23:hover{
    font-weight: 700;
    font-size: 12px;
    color: rgb(28, 105, 212);
    font-style: normal;
}



