body {
	background: url(images/bgblur.png) center center fixed no-repeat;
	background-color: rgba( 255, 255, 255, 1.0);
	-moz-background-size: cover;
	background-size: cover;
	max-width: 100%; 
	margin: 15px 0%; /**/
	font-size: 100%;
}

#container {
width: 100%;
}

#header {
	background: url(images/barpattern2.png) repeat-x; 
	background-color: rgba( 153, 204, 204, 1.0);
	height: 100px; 
	margin: auto;
	width: 100%;
	float: left;
	font-size: 100%;
	/*max-width: 2000px; this HAS to be pixels*/
	/* background-size: cover; */
}


#logo {

	float: left;	
}

#logo img {
max-width: 100%; 
}

nav {
	font-family: 'nunitolight';
	/* width: 50%;  512/1024 
	float: right; margin-top: 75px; ...from other file for ref*/
	float: left;	
	background: rgba( 30, 100, 113, .5);
	width: 17%; /*175/1024*/
	color: rgba( 255, 240, 227, 1.0); 
	text-decoration: none;	
	text-align: center;
	font-size: 100%;	
}

nav ul {
	height: 150px;
	font-family: 'nunitolight';
	color: rgba( 255, 240, 227, 1.0);
	text-decoration: none;
	font-size: 100%;
	margin-top: 20px;
}

nav ul li {
	height: 25px; 
	margin: 5px; 
	text-align: center;
	padding-top: 5px;
	font-family: 'nunitolight';
	color: rgba( 255, 240, 227, 1.0);
	text-decoration: none;
	font-size: 100%;
}
	
nav a {
	font-family: 'nunitolight';
	color: rgba( 255, 240, 227, 1.0);
	font-size: 16px;
	text-decoration: none;
	font-size: 100%;
	}
	
nav a:hover{
	font-family: 'nunitoregular';
	text-decoration: none;
	color: rgba( 255, 255, 255, 1.0);
	font-size: 100%;
	}

#info {
	display: block;
	text-align:center;
	max-width: 60%;
	background: rgba( 30, 100, 113, .75);
	color: rgba( 255, 240, 227, 1.0);
	font-family: 'quicksandregular';
	margin-left: 30px;
	margin-right: 30px;
	margin-top: 100px;
	float:left;
	padding: 20px;	
}

#info img {
display: inline-block;
max-width: 75%;	
}

/*#menu {
max-width: 100%;
display: block; 
text-align:center;
font-family: 'quicksandregular';
padding-top: 200px;
background: rgba( 30, 100, 113, .9);
margin-left: 225px;
margin-right:225px;	
	
}

#menucontent {
margin-top: 100px;
max-width: 100%;
display: block;
text-align:center;
font-family: 'quicksandregular';
margin-left: 50px;
margin-left: 250px;
margin-right: 250px;	

}*/

#menu {
margin:auto auto;
text-align:center;
background: rgba( 30, 100, 113, .75);	
font-size: 90%;
}

#m1 {
float:left;
background: rgba( 30, 100, 113, .75);
width: 30%;
height: 500px;
margin: 10px 0 0 2%;
}

#m2 {
float:left;
background: rgba( 30, 100, 113, .75);
width: 30%;
height: 500px;
margin: 10px 0 0 3%;
}

#m3 {
float:left;
background: rgba( 30, 100, 113, .75);
width: 30%;
height: 500px;	
margin: 10px 0 0 3%;
}

h2 {
font-family: 'quicksandbold';
}

h1 {
	font-family: 'quicksandregular';
	width: 25%;
	text-align:center;
	float: left;
	margin-top: 50px;
	color: rgba( 23, 32, 51, 1.0);
	font-size: 100%;
}

h3 {
	font-family: 'quicksandlight';

	font-size: 100%;
}

h4 {
	display: none;
}

#mobiletexttitle {
display: none;
}

#mobiletext2 {
display: none;
}

p {	
	font-family: 'nunitolight';
/* display: block;
	font-family: 'quicksandregular';	
	max-width: 100%;
	color: rgba( 23, 32, 51, 1.0);	
	line-height: 100%;
	font-size: 110%; */	
}

#content {
}

footer {
	font-family: 'quicksandregular';
	width: 100%;
	background: url(images/barpattern1.png) repeat-x; 
	background-color: rgba( 153, 204, 204, 1.0);
	height: 50px; 
	position: fixed;
	bottom: 10px;
	font-size: 100%;
}


#foot {
	text-align: center;
	color: rgba( 23, 32, 51, 1.0);
	font-size: 100%;
}

#pic {
		display: none; 
		}	


/* media queries */

@media screen and (max-width: 1088px) /**/ {

nav {font-size: 90%;}

}

@media screen and (max-width: 988px) /*size*/ {

nav {font-size: 80%;}

}

@media screen and (max-width: 911px) /*size*/ {

nav {font-size: 70%;}

}

@media screen and (max-width: 876px) /*size*/ {

nav {font-size: 70%;}

}

@media screen and (max-width: 828px) /*ipad size*/ {
	body{
	font-size: 80%;	
	
	}
	
	header {
	width: 80%;
	}
		
	#logo {
	/* float: none;
	margin: auto; */
	width: 35%; 
	/*background: red; */
		
	}
	
	nav {
	 width: 20%;
	 /*margin: auto;
	 float: none;
	 padding: 10px 10%; */
	 font-size: 90%;
	}
	
	nav ul li {
	 /*width: 24%;
	 text-align: center;
	 margin: 0;
	 font-size: 14px;*/
	 
	}
	
	h1 {
	width: 20%;
	}

#info {
	display: block;
	text-align:center;
	max-width: 50%;
	background: rgba( 30, 100, 113, .75);
	color: rgba( 255, 240, 227, 1.0);
	font-family: 'quicksandregular';
	margin-left: 30px;
	margin-right: 30px;
	margin-top: 75px;
	float:left;
	
}

#info img {
display: inline-block;
max-width: 50%;	
}

p {	
	font-family: 'nunitolight';
	font-size: 110%;
	margin-bottom: 20px;
/* display: block;
	font-family: 'quicksandregular';	
	max-width: 100%;
	color: rgba( 23, 32, 51, 1.0);	
	line-height: 100%;
	font-size: 110%; */	
}
	h2 {
font-family: 'quicksandbold';
}


h4 {
	font-family: 'quicksandregular';
	font-size: 300%;
}
#info {
width: 100%;
	}


#menu {
width: 100%;
font-size: 100%;
}
	
#m1 {

width: 50%;
float: left;
margin: auto;
height: 300px;
}

#m2 {

width: 50%;
float: left;
margin: auto;
height: 300px;
}

#m3 {
width: 100%;
display: inline-block;
margin-left: auto;
margin-right: auto;
height: 400px;
}

}

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

#menu {
font-size: 80%;	
}
}
@media screen and (max-width: 450px) {

#menu {
font-size: 70%;	
}

}

@media screen and (max-width: 480px) /*iphone size*/ {
		
	#content {
		background: rgba( 255, 255, 255, 1);
		}
		
 	#pic {	
 	width: 100%;
 	display: block;
 	margin-left: auto;
 	margin-right: auto;
 	/*display: none;*/
 	
 	}
	
	body {
		background-color: rgba( 255, 255, 255, 1);
		background-image: none;
		}
		
 		
	#logo {
	/* float: none;
	margin: auto; */
	width: 50%; 	
	display: inline-block;
	}
	
	nav {
	height: 150px;
	float: none;	
	background: rgba( 30, 100, 113, .5);
	width: 100%; /*175/1024*/
	text-decoration: none;	
	text-align: center;
	font-size: 150%;
	}
	
	nav ul {
	height: 250px;
	
	}
	
	nav ul li {
		padding-top: 10px;
		display: inline-block
	}
	
h3 {
	display: none;
	/*font-family: 'quicksandregular';
	height: 20px;
	margin-top: 75px;
	padding: 15px;
	font-size: 100%;*/
}
	
	footer {
	padding-top: 40px;
	font-size: 90%;
	height: 30px;
	}
	


#mobileinfo {
max-width: 100%;
text-align: center;
padding-bottom: 100px;
	}
	
#mobilemenu {

}
	
#mobilem1 {

}

#mobilem2 {

}
#mobilem3 {

}

#info {
display:none;
	}
	
#menu {
display:none;
}
	
#m1 {
display:none;
}

#m2 {
display:none;
}
#m3 {
display:none;
}
	
#mobiletexttitle {
	display: block;
	text-align:center;
	max-width: 100%;
	background: rgba( 30, 100, 113, .75);
	color: rgba( 255, 240, 227, 1.0);
	margin-top: 0px;
	font-family: 'quicksandregular';
	font-size: 100%;
	color: rgba( 255, 240, 227, 1.0);
	height: 25px;
	padding-left: 30px;
	padding-right: 30px;
	font-size: 150%;
}
	
	
	#mobiletext2 {
	display: block;
	max-width: 100%;	
	padding-top: 25px;
	padding-bottom: 25px;
	font-family: 'quicksandregular';
	padding-left: 20px;
	padding-right: 20px;
	font-size: 150%;	
	background: rgba( 30, 100, 113, .5);
	}

	
	
	p{
	display: block;
	font-family: 'quicksandregular';	
	max-width: 100%;
	color: rgba( 23, 32, 51, 1.0);	
	line-height: 100%;
	font-size: 110%;	
	} 
	
h1 {
display: none;
}

h2 {
display:inline-block;
}
	
}