body{
	background-color: #fff;
	font-family: Helvetica;
	padding:0px;
	margin:0px;
	overflow:auto;
}
.header{
	z-index: -1;
}
/*navigation bar style and buttons on top, with profile and logout*/
.nav-bar-container{
	display:grid;
	grid-template-columns: 1fr;
	margin: 0;
	padding: 0;


}
.nav-bar{
	display: flex;
	justify-content: space-between;
	margin: 0;
	padding: 0;

}

.nav-bar>.nav-item-left>div{
	margin-right:20px;
	font-size:1em;

}

.nav-item{
	margin-right: 10px;
	font-size: 15px;
	display:flex;
	float:left;



}
.nav-item a{
	text-decoration: none;
	color: black;
	transition: color 0.5s;
	padding: 18.5px;

}

.nav-item a:hover{
	color: #fff ;

}
.nav-item-left ul{
	list-style: none;
	padding-left: 0;
	margin:0px;
	padding: 0px;
}
.nav-item-left ul li{
	float: left;
	width:150px;
	height: 50px;
	background-color: white;
	text-align: center;
}

.nav-item-left ul li a{
	text-decoration:none;
	color:#0E4A92;
	display: block;
}
.nav-item-left a:hover{
	background-color: #0E4A92;
}
.nav-item-left ul li ul li{
	display:none;

	height: 60px;
	text-align: center;
	align-items: center;
}
.nav-item-left ul li:hover ul li{
	display:block;
}


.active-nav-link{
	/*border-bottom:1px solid black;*/
	font-weight: bolder;
	color: #0E4A92;
}


/*assign full width inputs*/ 
input[type=text], 
input[type=password] { 
    width: 100%; 
    padding: 12px 20px; 
    margin: 8px 0; 
    display: inline-block; 
    border: 1px solid #ccc; 
    box-sizing: border-box; 
} 

/*set a style for the buttons*/ 
button { 
    background-color: #0E4A92; 
    color: white; 
    padding: 14px 20px; 
    border: none; 
    cursor: pointer; 
    width: 100%; 
    margin: 5px;

} 

/* set a hover effect for the button*/ 
button:hover { 
    opacity: 0.8; 
} 

/*set extra style for the cancel button*/ 
.cancelbtn { 
    width: auto; 
    padding: 10px 18px; 
    background-color: #f44336; 
} 

/*centre the display image inside the container*/ 
.imgcontainer { 
    text-align: center; 
    margin: 24px 0 12px 0; 
    position: relative; 
} 
.color-overlay1{
	width:100%;
	height:100%;
	background: #3c1f41 ;
	opacity: .4;
	position: absolute;
}

/*set padding to the container*/ 
.container { 
    padding: 16px; 
} 
  
/*set the forgot password text*/ 
span.psw { 
    float: right; 
    padding-top: 16px; 
} 

/*set the Modal background*/ 
.modal { 
    display: none; 
    position: fixed; 
    z-index: 1; 
    left: 0; 
    top: 0; 
    width: 100%; 
    height: 100%; 
    overflow: auto; 
    background-color: rgb(0, 0, 0); 
    background-color: rgba(0, 0, 0, 0.4); 
    padding-top: 60px; 
} 

/*style the model content box*/ 
.modal-content { 
    background-color: #fefefe; 
    margin: 5% auto 15% auto; 
    border: 1px solid #888; 
    width: 80%; 
} 

/*style the close button*/ 
.close { 
    position: absolute; 
    right: 25px; 
    top: 0; 
    color: #000; 
    font-size: 35px; 
    font-weight: bold; 
} 
  
.close:hover, 
.close:focus { 
    color: red; 
    cursor: pointer; 
} 

/* add zoom animation*/ 
.animate { 
    -webkit-animation: animatezoom 0.6s; 
    animation: animatezoom 0.6s 
} 
  
@-webkit-keyframes animatezoom { 
    from { 
        -webkit-transform: scale(0) 
    } 
    to { 
        -webkit-transform: scale(1) 
    } 
} 
  
@keyframes animatezoom { 
    from { 
        transform: scale(0) 
    } 
    to { 
        transform: scale(1) 
    } 
} 
  
@media screen and (max-width: 300px) { 
    span.psw { 
        display: block; 
        float: none; 
    } 
    .cancelbtn { 
        width: 100%; 
    } 
}


.img1-background{
	background:url(../Images/autonomousvehiclescover.png);	
	height: 430px;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	z-index: -1;

}

.text-container{
	position: relative;
	text-align: center;
}
.text-container h1{
	font-family: Helvetica;
	font-size:60px;
	color: white;
	z-index: 1;
	
	margin:0;
	padding: 0;
}

.text-container h2{
	color:white;
	
	margin:0;
	padding:0;
}


.content1{
	background:url(../Images/cont1.png);
	height:180px;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	font-weight: bolder;


}
.content1 a, .content2 a, .content3 a{
	
	text-decoration: none;
	font-weight: 600;
	text-align: center;
	font-family: Helvetica;
	font-size:30px;
	color: white;

}

.content1:hover, .content2:hover, .content3:hover{
	opacity: 8;
	transition: 1s;
	filter: brightness(50%);
}

.content2{
	background:url(../Images/cont2.png);
	height:180px;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.content3{
	background:url(../Images/cont3.png);
	height:180px;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;


}



.img-darken{
	transition:1s;
	filter: brightness(10%);
}
.content-wrapper{

	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	z-index: -2;

}

.two-column-wrapper{
	display:grid;
	grid-template-columns: 1fr 1fr;
	z-index: -1;

}




.doc-list{
	vertical-align: middle;
	
}

#footer{
	position:relative;
	background-color: #fff;
	color: white;
	text-align: right;
	bottom:0;
	width:100%;
	z-index: -1;


}
#footer-text{
	margin-right:20px;
	margin-top: 10px;
	margin-bottom:10px;
	color: #718FB3;

}

.Apps-list-wrapper a{
	font-size: 50em;
	
}

.Apps-list{
	font-size: 50em;
}


.end{
	text-align: center;
}

@media(max-width: 944px){
	.step-wrapper{
		width: 100%;
	}
	.step-content-wrapper{
		
		width: 100%;
	}
}