/*This formatd the 2 collumns to sit side by side*/


.background-img {
	overflow: hidden;
	background-image: url('Cool Line.png');
    background-size: cover;
	position: absolute;
	z-index: -1;
}

.Overlap1 {
	position: relative;
	top: 0px;
	left: 0px;
	z-index: -1;
  }
  .overlapper {
	position: absolute;
	top: 0px;
	left: 0px;
	
  }
  .overlapper2 {
	position: absolute;
	top: 0px;
	left: 0px;
  }


.extra_stuff {
	position: absolute;
	color: white;
	z-index: -1;
}

/* so to have the lcoation image onto top of the slash image um basically put them in the saem container the image intialization in the same thingy and then just change the line from absoloute to like nothing and put the aboloute on the maps image! got it? cool! */



.column { 
	flex: 1;
	padding: 20px;
	border: 1px solid #ccc; /* this can be changed to change all the colums colour */
	margin: 10px;
}

.text-block {
	position: absolute;
	bottom: -160px;
	right: 620px;
	color: black;
	padding-left: 20px;
	font-size: 27px;
	padding-right: 20px;
	font-weight: bold;
}

.text-block-two {
	position: absolute;
	bottom: 480px;
	right: 350px;
	color: black;
	padding-left: 27px;
	padding-right: 20px;
	font-size: 37px;
}

.text-block-three {
	position: absolute; 
	bottom: 100px;
	right: 560px;
	color: black;
	padding-left: 27px;
	padding-right: 20px;
	font-size: 47px; 
	font-weight: bold; 
}

.Logo_Pos {
	position: absolute;
	top: 0px;
	right: 75px;
	color: white;
	padding-left: 27px;  
	padding-right: 20px;
	z-index: 1;
}

.footerthing {
	position: absolute; 
	bottom: -450px; 
	left: 0px;
	color: white;
	padding-left: 27px;
	padding-right: 20px;
	z-index: 1;
}

body {
	margin: 0;
	font-family: Arial,Helvetica, sans-serif;
	background-color: black;
}

.topnav {
	overflow: hidden;
	background-color: #F2F2F2;
}

.topnav a {
	float: left;
	display: block;
	color: #212121;
	text-align: center;
	padding: 14px 16px;
	text-decoration: none;
	font-size: 17px;
 }

 .topnav a:hover {
 	background-color: #ddd;
 	color: black;
 }

.topnav a:hover {
	background-color: #04AA6D;
	color: white;
}

.topnav .icon {
	display: none;
}

@media screen and (max-width: 600px) {
	.topnav a:not(:first-child) {display: none}
	.topnav a.icon {
		float: right;
		display: block;
	}
}
@media screen and (max-width: 600px) {
	.topnav.responsive {position: relative;}
	.topnav.responsive .icon {
		position: absolute;
		right: 0px;
		top: 0px;
	}
	.topnav.responsive a {
		float: none;
		display: block;
		text-align: left;
	}
	.text-block.responsive {position: relative;}

}