@charset "UTF-8";
body {
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 100%;
	width: 100%;
}

img,
object,
video {
	max-width: 100%;
}

header {
	width: 100%;
	height: 200px;
}

#logo {
	position:relative;
	float: left;
	margin: 0 0 0 19.5%;
	border: orange;
}

/* CSS for navigation links */
nav {
	float: right;
	min-width: 35%;
	height: 2em;
	margin: 8em 2em .25em 0;
	text-align: center;
}

 nav ul {
	float: right;
	clear: both;
	list-style: none;

}
 	
 	
 nav ul li {
	display: block;
	float: left;
	padding: 0 .5em;
	font-style: italic;
}
 	   
 	   
 nav li ul {
	display: none;
}
 	   
 	   
nav ul li a {
	display: block;
	height: 1.4375em;
	padding: .25em 1em;
	margin-left: .0625em;
}
	    
	    
nav ul li a:hover {
}
		  
		  
nav li:hover ul {
	display: block;
	position: absolute;
	margin: 0 0 0 -2.5em;
}
		
		
nav li:hover li {
	float: none;
}
		
		
nav li:hover a {
	display: block;
}
		
		
nav li:hover li a:hover {
	background: rgba(255, 255, 255, 0.75);
}

nav li:active li a:active {
	background: rgba(255, 255, 255, 0.75);
}

.mainnav a:link {
	color: #000;
	text-decoration: none;
 }
   
.mainnav a:visited { 
	color: #000;
	text-decoration: none;
 }
   
   
.mainnav a:hover {
	color: #a3030a;
	text-decoration: underline overline;
}
   
   
.mainnav a:active { 
	color: #00a9ac;
	text-decoration: none;

 }
 .currentLink {
 	background-color: #00a9ac;
 }

 .currentLink a:visited {
 	color: #a3030a;
 }

/* End of CSS for navigation links */

/* CSS for Index Page */
#mainart {
	min-height: 300px;
	float: left;
	clear: both;
	width: 100%;
	margin: 0 0 0 -8px;
	background-image: radial-gradient(#fff100, #fff100, #00a9ac);
	/*background-image: radial-gradient(rgba(255,242,0,1), rgba(0,170,173,.85), rgba(0,0,0,.5)) repeat top left;*/
	border-bottom: outset 5px black;
	color: #000000;
}

#subartmain {
	float: left;
	margin: 0 0 0 15%;
	font-style: italic;
}

#subartmain img {
	margin-top: 1em;
}

#subartmain h1 {
	margin: 40% 0 2% 0;
}

#mainartHead {
	float: left;
	width: 31.25em; /*  500px / 16px  */
	margin: .5em 0 0 .75em;
	font-weight: 400;
	font-style: italic;
}

#mainartHead h1 {
	font-size: 220%;
	text-align: left;
}

#details {
	position: relative;
	float: left;
	width: 8em;
	height: 2em;
	font-family: 'PT Serif', serif, Verdana, Helvetica, sans-serif;
	font-size: 110%;
	font-weight: 400;
	font-style: italic;
}


#subartHead {
	clear: both;
	width: 70%;
	font-style: italic;
	margin: 0 auto;
}

.subfeat {
	position: relative;
	float: left;
	clear: both;
	width: 80%;
	margin: 1em 3em 0 0;
}

.subfeat img {
	float: left;
	margin: 0 .5em 0 0;
}

.subfeat h2 {
	font-style: italic;
	color: #00a9ac;
	margin: -5px 0 -15px 0;
}

.subfeat p {
	font-family: Helvetica, sans-serif;
	font-size: 1em;
	line-height: 1.35em;
}

#profile {
	float: left;
	width: 60%;
	margin-top: 1em;
}
#subart1, #subart2, #subart3, #subart4 {
	margin: 0 auto;
	width: 90%;
	font-size: .9em;
	line-height: 1.35em;
	text-align: justify;
	font-style: italic;
}
#logorow {
	float: left;
	width: 35%;
}

.linkLogo {
	float: left;
	margin: 1em 2em 0 2em;
}

.linkLogoSm {
	float: right;
	margin: 1em 2em 0 0;
}


#features {
	width: 90%;
	margin: 0 auto;
}

#service1,
#service2,
#service3,
#service4 {
	float: left;
	width: 100%;
	padding: 1em 0;
}

#service4 img {
	margin: 0 2em .5em 0;
}

.testimonial {
	float: left;
	margin: 1em auto;
	width: 100%;
	font-size: .9em;
	line-height: 1.35em;
	text-align: justify;
	font-style: italic;
	text-align: justify;
}

.testimonial img {
	float: left;
	margin: 0 2em 0 0;
}

.testimonial h5 {
	margin-top: -1em;
}

 #connect {
  	width: 90%;
  	margin: 0 auto;
  	padding: 10em 0;
 }


/*/////////// CSS for Footer ///////////*/ 
footer {
	float: left;
	clear: both;
	color: #fff;
	width: 100%;
	padding: 0 0 1em 0;
	margin: 0 0 0 -8px;
	background-color: black;
	border-top: outset 5px #00a9ac;
	text-align: center;
}

footer h2 {
	font-style: italic;
}
       
       
.footernav a:link {
	color: #fff;
	text-decoration: none;
 }
   
.footernav a:visited { 
	color: #a3030a;
	text-decoration: none;
 }
   
   
.footernav a:hover {
	color: #a3030a;
	text-decoration: underline overline;
   		    }
   
   
.footernav a:active { 
	color: #a3030a;
	text-decoration: none;
 }

 #location {
 	float: left;
 	clear: both;
 	width: 35%;
 	margin: 0 2em 0 2em;
 }

 #contact {
 	float: left;
 	width: 80%;
 	text-align: center;
 	margin: 0 2em 0 0;
 }



#footNav {
	float: left;
	clear: both;
	width: 100%;
	margin: 1em 0 0 0;
}

 #creator {
 	float: left;
 	clear: both;
 	background-color: #404040;
 	width: 100%;
 	margin: 0 0 0 -8px;
 	text-align: center;
 }

.readmore {
	position: relative;
	float: right;
	margin: .625em;
	width: 8em;
	height: 3em;
}




/*-------------This is the start of resize formating----------------------*/

@media screen and (max-width: 1024px) {
	nav {
		margin: 5em 1em .25em 0;
	}

	nav ul li {
		padding: 0 .25em;
	}

	#subartmain {
		margin: 0 0 0 10%
	}
	.subfeat {
		width: 40%;
	}
}/*/mediaquery*/


@media screen and (max-width: 768px) {
	nav {
		margin: .25em .15em 1em 0;
		width: 25%;
		min-height: 180px;
	}

	nav ul li {
		float: right;
		clear: both;
	}


	nav li:hover ul {
		display: none;
	}

	#mainartHead {
		width: 30%; /*  500px / 16px  */
		margin: 0 0 0 .75em;
	}

	#subartHead {
		
	}

	.subfeat {
		width: 90%;
	}

	.logo {
		width: 35%;
	}

	#features {
		width: 94%;
		padding: 0 1em 0 0;
	}

	#errorMsg3 {
		float: none;
		top: 0;
		margin: 0 auto;
		padding-left: 0;
		width: 80%;
	}

	
}/*/mediaquery*/

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

	header {
		height: 13.75em;  /* 220 / 16px */
	}

	#logo {
		margin: 0 0 0 1em;
	}

	#location, #contact, #logorow {
		width: 90%;
		margin: 0 1.5em; 
	}

	#profile {
		width: 98%;
	}

	#features img {
		float: none;
		margin: 0 2em;
	}



}/*/mediaquery*/

@media screen and (max-width: 480px) {
	
	#logo {
		width: 60%;
	}

	nav {
	float: right;
	clear: both;
	margin-top: : -1em;
	}

	 nav ul li {
	display: inline;
	}

	#subartmain {
		margin: 0 0 0 15%;
	}

	#mainartHead {
		float: left;
		width: 100%;
		margin: 0 10% 1em 2%;
	}

	.logo {
		width: 50%;
	}

	#features img {
		margin: 0 .25em;
	}
}/*/mediaquery*/

@media screen and (max-width: 400px) {
	#logo {
		width: 85%;
		margin: 1em 0 1em 2.5em;
	}

	nav {
	}

	#features img {
		margin: 0;
	}

	.formLabel {
		width: 8em;
		padding: .25em;
	}

	#subartmain {
		margin: 0 0 0 3%;
	}

	#mainartHead {
		width: 90%;
		margin: 0 0 1em 5%;
	}

	.subfeat {
		width: 80%;
	}

	#subartHead {
		;
	}


}/*/mediaquery*/

@media screen and (min-width: 1210px) {


	header {
		width: 75%;
	}


	nav {
		
		clear: right;
	}

	.subfeat {
		margin-bottom: 1em;
	}

	.logo {
		width: 45%;
	}

	#features {
		width: 55%;
	}


	#location, #contact {
		margin-left: 10em;
	}


}/*/mediaquery*/