
	body
		{background-color:whitesmoke;
 		color:black;
 		font-size:12pt;
 		margin:0px;
		}
a {text-decoration:none}

/* BODY CONTAINER */

	.body-container
	 	{
		border:green 0px solid;
	 	box-shadow: 0 0 0px grey;
	 	}

		
		
		
/************************** END OF BODY GLOBAL **********************/




/***************************** HEADER ********************************/	 		

/* HEADER */

	.header
		{
		z-index: 9999 !important;
		position:fixed;
 		top:0px;
 		left:0px;
		 right:0px;
		 background:black;
		border:RED 0px solid;
 		border-bottom:orange 0px solid;
 		border-top:black 0px solid;
 		border-left:0px;
 		border-right:0px;
		 border-bottom-left-radius:2px;
		 border-bottom-right-radius:2px;
 		height:85px;
 		box-shadow: 0px 0px 0px whitesmoke;
 		}
 		
 		
/* LOGO */

	.logo
		{
		position:absolute;
		top:5px;
		left:10px;
		height:auto;
 		width:100px;
		}

/* MENU */

	.menu
		{
		position: absolute;
		right:95px;
		padding-top:25px;
		} 	
		
	a.menu-nav:link
		{
		color:white;
		text-decoration:none;
		font-family: 'Roboto', sans-serif;
		font-size:20px;
		font-stretch:condensed;
		}

.link-container
	{
	    border:solid white 0px;
	    background-color:RGBA(220,230,255,0.95);
	    border-radius:10px;
	    text-align:;
	}

	
	/******** Drop Down Menu ********/
/* Dropdown Button */
.dropbtn 
   {
    position:fixed;
    right:10px;
    width:30px;
    height:30px;
   }
   

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: fixed;
  left:0px;
  padding-top:5px;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: fixed;
  top:85px;
  background-color:orange;
  width: 100%;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #ddd}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {display:block;}

/****End of Dropdown Menu******/
	

/***************************** END OF HEADER **************************/


 
 .apply-finance
 {
   height:50px;
   width:250px;
   background-color:teal;
   border: solid 1px orange;
   border-radius:10px;
   color:white;
 }
 
 .car-info-contact
 {
   border: solid 1px orange;
   height: 60px;
   width:180px;
   margin:0px;
   padding-top:10px;
   background-color:teal;
   border-radius:10px;
   color:white;
   font:18px;
 }
 
 /*********** SlideShow ************/
* {box-sizing:border-box}

/* Slideshow container */
.slideshow-container {
  max-width: 400px;
  margin: auto;
  background-color: grey;
}

/* Hide the images by default */
.mySlides {
  display:block;
  height:0px;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position:absolute;
  z-index: 9999;
  top: -200%;
  width: auto;
  margin-top: 10px;
  padding: 16px;
  padding-top:10px;
  color: black;
  font-weight: bold;
  font-size: 18px;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot-circle-container
 {
   padding-top:265px;
 }

.dot {
  cursor: pointer;
  height: 10px;
  width: 10px;
  margin: 20px;
  background-color: #bbb;
  padding-top:1px;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 1.5s;
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}







.vehicle_gallery
 {
  border:1px solid orange;
  border-radius:15px;
  background-color:white;
  box-shadow: 2px 4px 8px 0px rgba(0,0,0,0.2);
  width:350px;
  height:auto;
  margin:30px;
  padding:30px
 }
 
 
 .vehicle-price
  {
    border: solid 1px orangered ;
    background-color:orange;
    border-radius:7px;
    width:300px;
    color:white;
    font-size: 35px;
  }
  
  .vehicle-details
   {
     color:black;
   }
   
   .vehicle_details_container
     {
       border:solid 1px silver;
       border-radius:10px;
       background:white;
       width:414px;
       margin:3px;
       padding:0px;
       box-shadow: 0px 0px 0px 0px orange;
     }
   
   
  .vehicle-model-font
    {
      font-size:20px;
    }
    
 .call_whatsapp_container
    {
    display:flex;
    padding:20px;
    gap:60px;
    }
    
  .call
   {
     border: solid 1px red;
     background:red;
     border-radius:10px;
     color:white;
     width: 150px;
     height: 50px;
     text-align: center;
   }
   
    .whatsapp
   {
     border: solid 1px green;
     background:green;
     border-radius:10px;
     color:white;
     width: 150px;
     height: 50px;
     text-align: center;
   }
   
   /* Lime inside vehicle specification */
  hr {
  border: none;
  height: 1px;
  background:#EBEBEB;
  margin: 10px 0;
     }
     
  .vehicle_images
   {
     display:block;
   }
   
   .spefication_container
     {
       display:flex;
       flex-wrap: wrap;
       padding-left:30px;
       gap:16px;
     }
 
   .item
     {
       flex: 0 0 50%;
       font-size: 15px;
     }
     
    .item_2
     {
       color:grey;
       font-size:15px;
     }
 .car_price_spec
   {
     padding-left:40px;
     background:#FFEFD2;
     color:black;
     font-size: 18px;
   }
 
 
 /********** End Of SlideShow ******/

/* PRIVACY POLICY */

.privacy-policy-container
	{
	padding-left:10px;
	border:solid 10px color #F7FDFF;
	background:#F7FDFF;
	border-radius:2px;
	}

.privacy-policy
	{
	padding-top:60px;
	}


.terms-container
	{
	padding:10px;
	border:solid 10px color #F7FDFF;
	background:#F7FDFF;
	border-radius:2px;
	}

.terms
	{
	padding:5px;
	padding-top:60px;
	}


.cars-preview-container
  {
    background-color: whitesmoke;
    border-radius: 20px;
  }

.car-info-text-1
 {
   padding-left:70px;
 }
 
.car-info-text-2
 {
   padding-left:50px;
 }
  
.car-info-text-3
 {
   padding-left:40px;
 }
 
 
.car-info-text-4
 {
   padding-left:15px;
 }
 
 
.car-info-text-5
 {
   padding-left:80px;
 }


.car-info-text-6
 {
   padding-left:25px;
 }
 
 
/* About */

	.about-text
		{
			text-align:center;
			font-size:14px;
		}



/*Vehicle Sell */
.gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 20px;
}


.ad-banner {
    grid-column: 1 / -1; /* makes it full width */
    background: #f0f0f0;
    padding: 30px;
    text-align: center;
    border-radius: 8px;
    margin: 20px 0;
}

.ad-banner img {
    max-width: 100%;
    height: auto;
}



.form_input
 {
   width:350px;
   height:35px;
   border: solid silver 1px;
   border-radius:7px;
 }

.image_upload_area
{
  background:#FFF9EF;
  width:350px;
  height:65px;
  border:solid silver 1px;
  border-radius:5px;
}

.image_submit
 {
   border: solid 0px orangered;
   background:orange;
   color:white;
   width:200px;
   border-radius:30px;
   height:50px;
 }


.form_container
  {
    border: solid 1px silver;
    background:#EDEDED;
    width:380px;
    height:1000px;
    border-radius:10px;
    padding-top:25px;
  }

.upload_text
  {
    color:orangered;
    font-size:11px;
  }

.textarea_input
  {
    border:solid 1px silver;
    border-radius:10px;
    width:350px;
    height:100px;
  }

.login_form
 {
    border: solid 0px silver;
    background:#EDEDED;
    width:380px;
    height:375px;
    border-radius:15px;
    padding-top:50px;
 }



.login_form_container
 {
  padding-top:100px;
  margin:20px;
  padding-bottom:100px;
 }



.login_form_input
 {
   margin:15px;
   width:350px;
   height:40px;
   border: solid silver 1px;
   border-radius:7px;
 }


.login_button
 {
   border:solid 1px orangered;
   background:orange;
   border-radius:60px;
   color:white;
   width:200px;
   height:50px;
   margin:25px;
   align-content:center;
 }


.finance_submit
 {
  border:solid 1px orangered;
   background:orange;
   border-radius:60px;
   color:white;
   width:200px;
   height:50px;
   margin:25px;
   align-content:center;
 }

.finance_container
 {
   border: solid 0px silver;
    background:#EDEDED;
    width:380px;
    height:650px;
    border-radius:15px;
    padding-top:5px;
 }



.signup_form_container
  {
    margin:10px;
    padding-top:50px;
    border-radius:10px;
    background:#EDEDED;
    width:400px;
    height:400px;
  }

.dashboard_container
 {
   background:#EDEDED;
 }

.dashboard_nav_container
 {
   display:flex;
   background:#EDEDED;
   gap:50px;
 }


.dashboard_nav1
 {
   background:orange;
   color:white;
   border:solid 1px white;
   padding:5px;
   width:200px;
   border-radius:5px;
 }


.dashboard_nav2
 {
   background:#FFF0C3;
   color:white;
   border:solid 1px white;
   padding:5px;
   width:250px;
   border-radius:5px;
 }




/*********************************** FOOTER ***************************/

	.footer
		{
		position:static;
 		padding-left:10px;
 		padding-top:10px;
 		background-color:#040720;
 		border:orange 0px solid;
 		border-bottom:orange 0px solid;
 		border-top:grey 0px solid;
 		border-left:0px;
 		border-right:0px;
 		height:200px;
 		width:100vw;
		}
		
/* FOOTER MENU */
 
	.footer-menu 
		{
		padding:5px;
		color:grey;
		font-size:15px;
		}
		
		
		
		
/* FOOTER MENU LINKS COLOR */
		
	a.footer-menu:link 
		{
		text-decoration:none;
		color:whitesmoke;
		}	
		
	a.footer-menu:hover
		{
 		color:#0071E3;
		}

	a.footer-menu:visited{color:black;}
	
			 	
		
/* COPYRIGHT TEXT */

	.copyright-text
		{
		color:black;
		font-size:10px;
		padding:5px;
		}		

.dashboard_copyright_text
   {
   font-size:11px;
   color:grey;
  text-align:center;
   }


/******************* END of FOOTER ****************************************************/













