<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">


{
	margin:0;
	padding:0;
}
body{

/*background-color:#311b92;*/
    /*background-color: #004d40*/
    /*background-color: gray;*/

    /*background-color:#FFFFFF;*/
    /*background-color:#f4f4f4;*/
    /*background-color:#311b92;*/
    /*font-family: sans-serif;*/
    /*color:white;
}

a{
	/*text-decoration: none;*/
}

/*	INDEX STYLE	3B4E57*/
header{
    /*width: 100%;*/
    /*background-color:black;*/
    /*box-shadow: 1px 2px 4px black;*/
    /*z-index: 100;*/

}
 

/*
.Price_Rate

{

font-family: sans-serif;
    width:100%;
    margin-top: 20px;
    float: left;
    font-size: 30px;
    font-weight:20px;
    margin-top: 1px;
    text-align: center;
     
}*/


/*.Price_Rate2
{
    
    float: left;
    font-size: 14px;
    font-weight: 12px;
    width:45%;
    margin-top: 20px; 
    margin-left: 40px;
}
*/
/*.Price_Rate3
{
    
    float: left;
    font-size: 20px;
    font-weight:40px;
    margin-left:100px;   
margin-top: 20px;

}
*/
/*
.Price_Rate4
{

    float: left;
    font-size: 14px;
    font-weight: 12px;
    margin-left: 200px;     
     margin-top: 20px;

}

.Price_Rate5
{
    float: right;
    margin-left: 450px;     
    background-color:Dodgergreen;
       color: #fff;
    font-family: serif; 
width:100%;
text-align: center;
font-size: 16px;
padding: 3px;

}*/

header nav{
    height:40px;


}
header nav ul{
    float: right;
    margin-right:30px;

}
header nav ul li{
    display: inline-block;
    margin: 15px 5px;
    text-transform: capitalize;
margin-top: 10px;



}
header nav ul li a{
    font-size: 12px;
    padding: 10px;
    color: #fff;
    
}
header nav ul li a:hover,.active{
    color:#3B4E57;
    background-color: #fff;
   
    
}

.case{
    width: 80vw;
    margin: 0 auto;
    height: 60vh;
  
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    display: flex;
}
.case-container{

    width: 90%;
    margin:auto;
}

.case-container h1{
    font-family:sans-serif; 
    font-size: 20px;
  
    text-align:center;
    padding: 20px 10px 10px 10px;
    font-weight: 600;
    margin: auto;
    color: black;
    text-shadow: 8px 4px 5px #304269;
    text-transform: uppercase;
}

.case-container p{
    text-align: center;
    font-style: italic;
    font-size: 30px;
    font-weight: 900;
    color: #fff;
    text-shadow: 8px 4px 5px #304269;
    
}




.do-wrapper{
	width: 80vw;
	height: 60vh;
	margin: 0 auto;
}

.do-wrapper p{
	font-size: 50px;
	color:#2c81ba;
	text-align: center;
	font-weight: 900;
	padding: 20px;
	font-style: italic;
	text-shadow: 5px 5px 5px black;
	text-transform: uppercase;
}
.do-container{
	background-color: red;
	width: 80%;
	height: 350px;
	margin: 0 auto;
	display: flex;
}
.do-column{
	flex:1;

}

/*
	Styles for appointment Page
*/
 
.date-container{
	/*width:100%;*/
	/*margin:  auto; */

	 
}
#datePicker{
	padding: 20px;
	
display: inline-flex;
		margin-left: 0%;
	/*font-size: 100%;*/
/*background-color:rgb(red);*/
/*background-color: red;*/

}


.time-container{
	/*width: 90%;*/
	margin: 0 auto;
    margin-left: 0%;
  

}

/*.available-time{
	margin: 5px 50px;
	font-size: 12px;
	padding: 0px;
	margin-top: 20px;
	padding-bottom: 0px;
	
}
*/
.time-container form div{
	padding: 12px;
    /*margin-left: 240px;*/
    
}

 
.time-container form div span{
	font-size: 16px;
	padding: 10px;
    /*background-color: black;*/
    margin-left: 4px;
    color: white;
}
 
.time-container-carent{
    /*width: 90%;*/
    margin: 0 auto;
    margin-left: 0%;
}


.time-container-carent form div{
    /*padding: 10px;*/
    /*margin-left: 100px;*/
    /*display: inline;*/
    /*display: inline-block;*/
    /*display: inline-table;*/
    display: block;



    
}


.time-container-carent form div span{
    font-size: 16px;
    /*padding: 10px;*/
    /*background-color: black;*/
    margin-left: 4px;
    color: white;

    margin-top: 40px;

    
}

    


 


#mtro{

 


}

#app{



font-size:18px;
    padding: 5px;
    border-radius: 6px;
    /* background-color:green;   */
    clear: both;
    margin-left: 50px; 
    width: 15%;
    color: white;   
}

#creditCardInfoBtn{


font-size:25px;
    padding: 5px;
    border-radius: 8px;
    background-color: #2c81ba;  
    clear: both;
    margin-left: 550px;  


}



.form-container{
	margin: 0 auto;
	width: 100%;
    

}
.form-container form div{
	/*width: 45%;*/
    display: inline-block;
    margin: 20px
    padding:0px;
    /*margin-left: -30%;*/
}
.form-container form div div{
    width: 100%;
}
.form-container form div label{
	display: block;
	padding: 10px;
	/* font color: green; */
}

.form-container form div input{
	width: 50%;
	display:inline-block;
	outline:none;
	margin: 5px;
	padding: 8px;
	font-size: 16px;
	border:1px solid black;
	border-radius: 2px;
}
.form-container form div button{
	/* margin: 5px auto; */
	/* font-size: 15px; */
	/* padding: 13px 41px; */
	/* border-radius: 10px; */
	/* color:white; */
	/* background-color: #2c81ba; */
    /* margin-left: 90%; */
}

.form-container form div button:hover{
	cursor: pointer;
}



.form-container-cash{
    margin: 0 auto;
    width: 100%;
    

}

 
 .form-container-cash form div{

width: 15%;
    display: inline;
    margin:10px;
    /*margin-left: 15%;*/
    /*margin-top:-1%;*/



 }

.form-container-cash form label{
    display: inline-block
    
}

.form-container-cash form input{
width: 20%;
    display:inline-block;
    /*outline:none;*/
    margin: 2px;
    padding: 8px;
    font-size: 16px;
    border:8px solid black;
    border-radius: 2px;


}
.form-container-cash button{

    margin: 5px auto;
    font-size: 15px;
    padding: 13px 41px;
    border-radius: 10px;
    color:white;
    background-color: #2c81ba;
    margin-left: 45%;

}
.form-container-cash button:hover{
 
    cursor: pointer;
}



#nextrenter{

   /*width: 5%;*/
    /* display:inline-block; */
    /*outline:none;*/
    /*margin: 25px;*/
    /*padding: 4px;*/
    /*font-size: 15px;*/
    /*border:1px solid black;*/
    /*border-radius: 2px;*/
    /*margin-left: 70%;*/
    /*margin-top: 0px;*/



}



#nextrenter{

    /*margin: 5px auto;
    /*font-size: 15px;*/
    /*padding: 1px 4px;*/
    /*border-radius:15px;*/
    /*color:white;*/
    /* background-color:green; */
    /*margin-left: 850px;*/
    /*text-align: center;*/



}

    #nextrenter :hover{
    cursor: pointer;

}

 


#date-sample{
	width: 50vw;
	margin: 0 auto;
}
.error{
	border:1px solid red;
	box-shadow: 1px 1px 5px red;
}

.metroStationContainer{
  /*  width:50%;
     margin: 0 auto;
     min-height: 70vh;
*/
}


.metroStationContainer option{


/* background-color: green; */
/*color: white;
font-size: 20px;
font-family:serif;
border-style: ridge;
border border-collapse ;
width: 60%
*/
}



.metroStationContainerCash option{


 /*background-color: black; 
color: white;
font-size: 20px;
font-family:serif;
*//*border-style: ridge;*/
/*border border-collapse ;*/
/*width: 100%*/

}

#metroStation{
	width: 80%;
	text-align: center;
}

.metroStationContainer{
    width: 40%;
    float: left;
    margin-left: 80px;

}
.meetingInfoContainer{
    /*
    float:right;
    margin-left: 0px;
    width: 100%;
*/
}
.meetingInfo{
    text-indent: 50px;
    color: black;
    margin-top: -260px;
}
 

/*for the menu bar*/
body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
}

.topnav {
  overflow: hidden;
  background-color: black;
}

.topnav a {
  float: left;
  color: #f2f2f2;
  text-align: center;
  padding: 10px 12px;
  text-decoration: none;
  font-size: 17px;
}

.topnav a:hover {
  background-color: #ddd;
  color: black;
}

.topnav a.active {
  /* background-color: green; */
  color: black;
}





================================================================