* {
	padding: 0px;
	margin: 0px;
	scroll-behavior: smooth;
}
header {
	
	display: grid;
	grid-template-columns: 10% 10% 10% 10% 10% 10% 10% 10% 10% 10%;
	grid-template-rows: 33.33% 33.33% 33.33%;
	
	height: 155px;
	width: 100%;
	
	background-color: #bee5fb;
	
	margin-left: auto;
	margin-right: auto;
	max-width: 2150px;



		
}

#phonebar {
	display: none;
}

#mobilenav {
	display: none;
}
h1 {
	
	grid-column: 1/3;
	grid-row: 1/4;
	
	font-size: 23px;
	font-family: 'Roboto', sans-serif;
	
	margin-top: 0.2%;
	margin-left: 1%;
	text-align: left;
	
}

h1 a{
	color: black;
	text-decoration: none;
	
}

#subtitle {
    grid-column: 4/8;
    grid-row: 1;
    
    font-size: 23px;
	font-family: 'Roboto', sans-serif;
	
	margin-top: 0.2%;

	text-align: center;
}


#main_navigation {
	
	grid-column: 1/11;
	grid-row: 3;
	
	background-color: #7FCCF7;
	
	text-align: center;
	font-size: 14px;
	font-family: 'Roboto', sans-serif;
	
}


#main_navigation ul{
	
	height: 100%;
	width: 100%;

	
}


#main_navigation ul li{
	
	display: inline-block;
	
	margin-left: 4%;
	margin-right: 4%;
	margin-top: 1%;
	
	
}

#main_navigation ul li:hover a{
	color: white;
	
	
	
}


#main_navigation ul li a{
	
	color: #414141;
	text-decoration: none;
	
	
}

	
}

@media screen and (max-width: 1564px) {
	
	#main_navigation ul li{

		margin-left: 2%;
		margin-right: 2%;
	
	
	}
	
}

@media screen and (max-width: 1376px) {
    #main_navigation ul li {
        margin-top: 1.3%;
    }
    
    h1 {
        font-size: 20px;
    }
    #subtitle {
        font-size: 20px;
    }
}

@media screen and (max-width: 1069px) {
	
	#main_navigation{
		
		font-size: 14px;


	
	
	}
	
	#main_navigation ul li{

		margin-left: 2%;
		margin-right: 2%;
		margin-top: 1.7%;
	
	
	}
	
}


@media screen and (max-width: 809px) {

	header {
	
		display: grid;
		grid-template-columns: 100%;
		grid-template-rows: 100%;
		
		height: 70px;
		width: 100%;
		
		background-color: #bee5fb;
		
		margin-left: auto;
		margin-right: auto;
		max-width: 2150px;


		
	}
	
	#mobilenav h2 {
	    font-size: 18px;
	    margin-top: 1%;
	    margin-left: 3%;
	}

	#phonebar {
		display: block;
		font-size: 35px;
		color: black;
		position: absolute;
		top: 0px;
		right: 5px;
		z-index: 98;
		width: auto;
		height: auto;
		text-align: center;

	}

	#phonebar a {
		text-decoration: none;
		color: black;
	
	}
	
	
	
	h1 {
		margin-top: 20px;
		text-align: left;
		font-size: 17px;
		
	}
	
	#subtitle {
		text-align: left;
 		position: absolute;
 		top: 0px;
        font-size: 18px;
        width: 100%;
    	font-family: 'Roboto', sans-serif;
    	
    	margin-top: 0%;
    
    }
	
	#main_navigation{
		
		display: none;


	
	
	}



	
	
}