/* ============ APPLIED TO ALL ============ */

img { max-width: 100%; border: 0; } 

body { margin: 0;
		background-color: #FFFFFF;
		font-family: Calibri, Tahoma, Sans-serif;
		font-size: 18px;
		color: #FFFFFF; }

a:link { color: #00CCCC; text-decoration: none; } 
a:visited { color: #00CCCC; text-decoration: none; } 
a:active { color: #00CCCC; text-decoration: none; } 
a:hover { color: #F6CB41; text-decoration: none; }

.mobile { display: none; }
.desktop { display: inline; } 
.clear { clear: both; }

h1 { margin: 20px 0px 10px 0px; /* top right bottom left */
		font-size: 28px;
		color: #FFFFFF; }
h2 { margin: 30px 120px 8px 0px; /* top right bottom left */
		padding: 4px 0px 4px 10px; /* top right bottom left */
		background-color: #303030;
		color: #F4F4F4;
		border-bottom: 2px solid #F4F4F4;
		border-top: 2px solid #F4F4F4;
		font-size: 20px;
		font-style: italic; }
h3 { margin: 0px 0px 10px 0px; /* top right bottom left */
		color: #F4F4F4;
		font-size: 20px; }

#comms { background-color: #DEDFE0;
			padding: 5px;
			border-bottom: 10px solid #FFFFFF; }
#comms img { vertical-align: middle; }
#commsaddy { color: #303030;
				padding-right: 80px;
				text-align: right;
				font-weight: bold;
				font-size: 20px; }
#commsph { color: #303030;
			padding-left: 80px;
			font-weight: bold;
			font-size: 22px;
			float: left; }

#header { background-color: #303030;
			border-bottom: 10px solid #FFFFFF;
			/* height: 220px; */
			text-align: center;
			margin: 0;
			overflow: hidden; }
#header img { display: block; }

#nav { background-color: #A0A3AA; }
			
#main { border-top: 10px solid #FFFFFF;
			border-bottom: 10px solid #FFFFFF;
			background-color: #74797F;
			background-image: url(images/contentback.jpg);
			background-attachment: scroll;
			background-repeat: repeat-x;
			background-position: left top;
			min-height: 550px;
			padding-bottom: 30px; }
.content { padding: 30px 30px 30px 30px; /* top right bottom left */ }

#footer { background-color: #303030;
			color: #CDCED1;
			margin: 0px; }

.threethirty1 { float: left; width: 30%;
					padding: 0px 0px 0px 20px; /* top right bottom left */ }
/* .threethirty2 { float: left; width: 33%; margin-left: 33%; }
.threethirty3 { margin-left: 66%; width: 33%; } */
.contentcols { padding: 20px 20px 20px 20px; /* top right bottom left */ }
.contentcols ul { list-style-type: none; margin: 0px 0px 0px -40px; /* top right bottom left */ }
.contentcols img { padding: 5px 0px 5px 0px; }

.copyright {  font-size: 14px; 
				/* clear: left; */
				/* text-align: center; */
				color: #74797F;
				padding: 40px 0px 0px 0px; /* top right bottom left */
				font-style: italic; }

.obsidian { font-weight: bold;
				font-size: 14px;
				padding: 5px 65px 0px 0px; /* top right bottom left */
				text-align: right;
				color: #C2E0B8; }
.obsidian a { color: #C2E0B8; }
.obsidian a:hover { text-shadow: 0 0 12px #00CC66;
					transition: 0.3s; }
.smalltext { font-size: 10px;
			vertical-align: text-top;
			color: #F4F4F4; }

.PICmain { border-bottom: 50px solid #FFFFFF;
			border-top: 10px solid #FFFFFF;
			border-right: 10px solid #FFFFFF;
			border-left: 10px solid #FFFFFF;
			margin: 20px 30px 20px 80px; /* top right bottom left */
			float: right; }

.fiftyfifty1 { float: left; width: 45%;
					padding: 0px 20px 0px 20px; /* top right bottom left */ }
.fiftyfifty2 { width: 45%; margin-left: 50%; 
					padding: 0px 20px 0px 20px; /* top right bottom left */ }
.fiftyfifty2 p { width: 85%; }
.fiftyfifty3 { width: 45%; margin-left: 50%; 
					padding: 0px 20px 0px 20px; /* top right bottom left */
					background-color: #303030;
					border: 2px solid #F4F4F4;
					-webkit-border-radius: 15px;
					-moz-border-radius: 15px;
					border-radius: 15px }
.fiftyfifty3 p { width: 100%; }					
.phone { background-image: url(images/cphone.png);
			background-attachment: scroll;
			background-repeat: no-repeat;
			background-position: left center;
			vertical-align: text-top;
			padding: 2px 0px 2px 40px; /* top right bottom left */
			line-height: 30px;
			margin-left: 10px; }
.email { background-image: url(images/cemail.png);
			background-attachment: scroll;
			background-repeat: no-repeat;
			background-position: left center;
			vertical-align: text-top;
			padding: 2px 0px 2px 40px; /* top right bottom left */
			line-height: 30px;
			margin-left: 10px; }
.email a { color: #F4F4F4; }
.email a:hover { color: #F6CB41; }

.ftremail a { color: #CDCED1; }
.ftremail a:hover { color: #F6CB41; }

form { margin: 40px 0px 40px 0px; /* top right bottom left */ }
label { float: left;
      	display: block;
	  	text-align: left;
	 	width: 150px;
	  	padding-right: 10px; }

input, textarea { display: block;
              		margin-bottom: 20px;
					margin-top: 15px;
					color: #00CCCC;
					border: none; 
					background-color: #FFFFFF;
					padding: 4px 5px 6px 5px; /* top right bottom left */
					-webkit-border-radius: 5px;
					-moz-border-radius: 5px;
					border-radius: 5px;
					line-height: 22px; }

#submit { margin: 20px 0px 20px 160px; /* top right bottom left */ 
				padding: 4px 12px 4px 12px; /* top right bottom left */
				background-color: #00CCCC;
				color: #303030; }








/* LIQUID NAVIGATION BEHAVIOR BELOW */
ul.liquidnav { list-style-type: none;
				  margin: 0;
				  padding: 0;
				  overflow: hidden;
				  background-color: #A0A3AA; }

ul.liquidnav li { display: inline-block; } /* Was float: left by default - changed to inline block for center alignment on full */

ul.liquidnav li a { display: inline-block;
					  color: #FFFFFF; /* Navigation links color - including menu icon */
					  font-weight: bold;
					  text-align: center;
					  padding: 10px 20px; /* first top and bottom pad (14px default) - second left and right pad (16px default) */
					  text-decoration: none;
					  transition: 0.3s;
					  font-size: 20px; }

ul.liquidnav li a:hover { background-color: #00CCCC;
							color: #303030; }

ul.liquidnav li a:active { background-color: #00CCCC;
							color: #303030; }

.activenav { background-color: #00CCCC; color: #303030 !important; }

ul.liquidnav li.liquidicon { display: none; }




/* ========================================= MOBILE ============================================================= */

@media screen and (max-width: 480px) {

/* img { max-width: 100%; border: 0; } */

.liqshell { min-width: 320px;
			width: 100%;
			padding: 0;
			margin: 0; }

#comms { background-color: #DEDFE0;
			padding: 5px;
			border-bottom: 10px solid #FFFFFF; }
#commsaddy { color: #303030;
				padding-right: 0px;
				text-align: center;
				font-weight: bold;
			font-size: 18px; }
#commsph { color: #303030;
			padding-left: 0px;
			font-weight: bold;
			font-size: 18px;
			float: none;
			text-align: center; }

#header { /*background-color: #303030;
			border-bottom: 10px solid #FFFFFF;
			 height: 170px;
			text-align: center;
			margin-left: auto;
			margin-right: auto;
			margin: 0; */
			display: none; }
#headerm { background-color: #303030;
			border-bottom: 10px solid #FFFFFF;
			text-align: center;
			margin-left: auto;
			margin-right: auto;
			margin: 0; }

/* .mobile { display: inline; }
.desktop { display: none; } */

#nav { background-color: #A0A3AA; }
				
#main { border-top: 10px solid #FFFFFF;
			border-bottom: 10px solid #FFFFFF;
			background-color: #74797F;
			background-image: url(images/contentback.jpg);
			background-attachment: scroll;
			background-repeat: repeat-x;
			background-position: left top;
			min-height: 250px; }
.content { padding: 10px 20px 10px 20px; /* top right bottom left */ }
.content img { display: none; }

.threethirty1 { float: none; width: 100%; }
.contentcols { padding: 20px 10px 20px 10px; /* top right bottom left */ }
.fiftyfifty1 { float: none; width: 100%;
					padding: 0px 0px 0px 0px; /* top right bottom left */
					margin: 0; }
.fiftyfifty2 { width: 100%;  
					padding: 0px 0px 0px 0px; /* top right bottom left */
					margin: 0; }
.fiftyfifty2 p { width: 100%; }
.fiftyfifty3 { width: 90%; margin: 0;
					padding: 0px 15px 0px 15px; /* top right bottom left */
					background-color: #303030;
					border: 2px solid #F4F4F4;
					-webkit-border-radius: 15px;
					-moz-border-radius: 15px;
					border-radius: 15px }
.fiftyfifty3 p { width: 100%; }

.copyright {  font-size: 14px; 
				/* clear: left; */
				text-align: center; 
				color: #74797F;
				padding: 30px 0px 0px 0px; /* top right bottom left */
				font-style: italic; }

.obsidian { font-weight: bold;
				font-size: 14px;
				padding: 5px 0px 0px 0px; /* top right bottom left */
				text-align: center;
				color: #C2E0B8; }
				
h2 { margin: 20px 0px 8px 0px; /* top right bottom left */
		padding: 4px 10px 4px 10px; /* top right bottom left */
		background-color: #303030;
		color: #F4F4F4;
		border-bottom: 2px solid #F4F4F4;
		border-top: 2px solid #F4F4F4;
		font-size: 20px;
		font-style: italic;
		width: 100%; }
		
form { margin: 40px 0px 0px 0px; /* top right bottom left */  }
label { float: left;
      	display: block;
	  	text-align: left;
	 	width: 140px;
	  	padding-right: 8px; }

input, textarea { display: block; 
              		margin-bottom: 20px;
					margin-top: 15px;
					color: #00CCCC;
					border: none; 
					background-color: #FFFFFF;
					padding: 4px 5px 6px 5px; /* top right bottom left */
					-webkit-border-radius: 5px;
					-moz-border-radius: 5px;
					border-radius: 5px;
					line-height: 22px; }

#submit { margin: 20px 0px 0px 0px; /* top right bottom left */ 
				padding: 4px 12px 4px 12px; /* top right bottom left */
				background-color: #00CCCC;
				color: #303030; }
				
				
				
						
						




/* LIQUID NAVIGATION BEHAVIOR BELOW */	
  ul.liquidnav li:not(:first-child) { display: none; }
  ul.liquidnav li.liquidicon { float: right; 
  								margin: 0px 5px 0px 0px; /* top right bottom left */
  								/*border: 1px solid #FFFFFF;  creates an inset look when combined with the ul.liquidnav.responsive li a bottom border */
    							display: inline-block; }

  ul.liquidnav.responsive { position: relative; }
  ul.liquidnav.responsive li.liquidicon { position: absolute;
											right: 0;
											top: 0; }
  ul.liquidnav.responsive li { float: none;
    							display: inline; }
  ul.liquidnav.responsive li a { display: block; 
  									border-bottom: 1px solid #FFFFFF; /* adds bottom line between 480px (mobile) screen vertical menu - includes stacked nav button */
    								text-align: left; }

  ul.liquidnav.responsive li.liquidicon a { border-bottom: none; }
																		
	/* ul.liquidnav li img { display: none; } */
									

}
/* ======================================= FULL SCREEN MODE =============================================================== */

@media screen and (min-width: 769px) {

img { max-width: 100%; border: 0; }

.liqshell { min-width: 750px; 
			width: 80%;
			margin-left: auto;
			margin-right: auto;
			margin-top: 0;
			margin-bottom: 0;
			padding: 0; }
	
#navposition { text-align: center;
				margin-left: auto;
				margin-right: auto; }


#headerm { display: none; }



}
/* ========================================= FLIP LANDSCAPE MOBILE ============================================================= */

 @media screen and (max-width: 768px) {

#liqshell { min-width: 640px; }
img { max-width: 50%; border: 0; }

#header { display: none; }
#headerm { background-color: #303030;
			border-bottom: 10px solid #FFFFFF;
			text-align: center;
			margin-left: auto;
			margin-right: auto;
			margin: 0; }
/* .mobile { display: inline; }
.desktop { display: none; } */

#comms { background-color: #DEDFE0;
			padding: 5px;
			border-bottom: 10px solid #FFFFFF; }
#commsaddy { color: #303030;
				padding-right: 0px;
				text-align: center;
				font-weight: bold;
				font-size: 18px; }
#commsph { color: #303030;
			padding-left: 0px;
			font-weight: bold;
			font-size: 18px;
			float: none;
			text-align: center; }

#main { border-top: 10px solid #FFFFFF;
			border-bottom: 10px solid #FFFFFF;
			background-color: #74797F;
			background-image: url(images/contentback.jpg);
			background-attachment: scroll;
			background-repeat: repeat-x;
			background-position: left top;
			min-height: 250px; }

.threethirty1 { float: none; width: 80%; }

h2 { margin: 20px 0px 8px 0px; /* top right bottom left */
		padding: 4px 10px 4px 10px; /* top right bottom left */
		background-color: #303030;
		color: #F4F4F4;
		border-bottom: 2px solid #F4F4F4;
		border-top: 2px solid #F4F4F4;
		font-size: 20px;
		font-style: italic;
		width: 100%; }

.fiftyfifty1 { float: none; width: 90%;
					padding: 0px 0px 0px 0px; /* top right bottom left */
					margin: 0; }
.fiftyfifty2 { width: 90%;  
					padding: 0px 0px 0px 0px; /* top right bottom left */
					margin: 0; }
.fiftyfifty2 p { width: 90%; }
.fiftyfifty3 { width: 90%; margin: 0;
					padding: 0px 15px 0px 15px; /* top right bottom left */
					background-color: #303030;
					border: 2px solid #F4F4F4;
					-webkit-border-radius: 15px;
					-moz-border-radius: 15px;
					border-radius: 15px }
.fiftyfifty3 p { width: 90%; }
.copyright {  font-size: 14px; 
				/* clear: left; */
				text-align: center; 
				color: #74797F;
				padding: 30px 0px 0px 0px; /* top right bottom left */
				font-style: italic; }

.obsidian { font-weight: bold;
				font-size: 14px;
				padding: 5px 0px 0px 0px; /* top right bottom left */
				text-align: center;
				color: #C2E0B8; }


} 

/* ====================================================================================================== */

/*@media screen and (min-width: 1024px) {
	.test { background-color: green;
			color: yellow; }
	#liqshell { min-width: 1020px; }
}*/

/* ====================================================================================================== */
