body {
	background-image:url(../images/bkgrd.jpg);
	line-height: 1.2; 
	font-family: Arial, Helvetica, FreeSans, sans-serif; 
	background-color:rgb(102, 102, 102);
	font-size:16px;
	text-align:center;
	margin:0em 0em 0em 0em;
	padding:0em 0em 0em 0em;
}
  /* opacity: 0.4;
    filter: alpha(opacity=40);  For IE8 and earlier */
#section {
    width:90%;
	margin:0em 0em 0em 0em;
	padding:0em 0em 0em 1em;
}  
#msgBox {
	background-color: lightgrey;
	width: 60%;
	border: 2px solid red;
	margin: 5% 0% 5% 16%;
	padding:1em 1em 1em 1em;
    text-align:center;
}
textarea {
  width: 100%;
  height: 150px;
}
input[type=text], select {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;
}
input[type=submit] {
margin:2px 2px 4px 2px;
-moz-box-shadow:3px 4px 0px 0px #899599;
-webkit-box-shadow:3px 4px 0px 0px #899599;
box-shadow:3px 4px 0px 0px #899599;
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #00b300));
background:-moz-linear-gradient(top, #ededed 5%, #00b300 100%);
background:-webkit-linear-gradient(top, #ededed 5%, #00b300 100%);
background:-o-linear-gradient(top, #ededed 5%, #00b300 100%);
background:-ms-linear-gradient(top, #ededed 5%, #00b300 100%);
background:linear-gradient(to bottom, #ededed 5%, #00b300 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#00b300',GradientType=0);
background-color:#ededed;background-color:#00b300
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
border:1px solid #d6bcd6;
display:inline-block;
cursor:pointer;
color:#000000;
font-family:Arial;
font-size:14px;
font-weight:bold;
padding:4px 16px;
text-decoration:none;
text-shadow:0px 1px 0px #e1e2ed;
}
input[type=submit]:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #bab1ba), color-stop(1, #ededed));
background:-moz-linear-gradient(top, #bab1ba 5%, #ededed 100%);
background:-webkit-linear-gradient(top, #bab1ba 5%, #ededed 100%);
background:-o-linear-gradient(top, #bab1ba 5%, #ededed 100%);
background:-ms-linear-gradient(top, #bab1ba 5%, #ededed 100%);
background:linear-gradient(to bottom, #bab1ba 5%, #ededed 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bab1ba', endColorstr='#ededed',GradientType=0);
background-color:#bab1ba;
}
input[type=reset]:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #bab1ba), color-stop(1, #ededed));
background:-moz-linear-gradient(top, #bab1ba 5%, #ededed 100%);
background:-webkit-linear-gradient(top, #bab1ba 5%, #ededed 100%);
background:-o-linear-gradient(top, #bab1ba 5%, #ededed 100%);
background:-ms-linear-gradient(top, #bab1ba 5%, #ededed 100%);
background:linear-gradient(to bottom, #bab1ba 5%, #ededed 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bab1ba', endColorstr='#ededed',GradientType=0);
background-color:#bab1ba;
}
input[type=reset] {
margin:2px 2px 4px 2px;
-moz-box-shadow:3px 4px 0px 0px #899599;
-webkit-box-shadow:3px 4px 0px 0px #899599;
box-shadow:3px 4px 0px 0px #899599;
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #00b300));
background:-moz-linear-gradient(top, #ededed 5%, #00b300 100%);
background:-webkit-linear-gradient(top, #ededed 5%, #00b300 100%);
background:-o-linear-gradient(top, #ededed 5%, #00b300 100%);
background:-ms-linear-gradient(top, #ededed 5%, #00b300 100%);
background:linear-gradient(to bottom, #ededed 5%, #00b300 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#00b300',GradientType=0);
background-color:#ededed;background-color:#00b300
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
border:1px solid #d6bcd6;
display:inline-block;
cursor:pointer;
color:#000000;
font-family:Arial;
font-size:14px;
font-weight:bold;
padding:4px 16px;
text-decoration:none;
text-shadow:0px 1px 0px #e1e2ed;
}
.btn4 {
	border:0.1em solid #001a00;
	box-shadow: .4em .25em .2em #003300;
	background-color: #006600;
    color: white;
    text-align: center;
    text-decoration: none;
	font-size:75%;
	font-weight:bold;
	font-style:normal;
    cursor: pointer;
	margin:0em 0em 0em 4em;
	padding:0em .5em .1em .5em;
}
/*
#001a00;
#003300;
#006600;
#00b300;
#00ff00;
#66ff66;
*/
.btn4:hover {
	background-color: #66ff66;
	color: black;
}
h1 {
font-size:150%;
text-align: center;	
margin:0em 0em 0em 0em;
padding:0em 0em 0.1em 0em;
}
h2 {
text-align: center;	
color:#000f00;
font-family:Arial;
margin:.5em 0em .5em 0em;
padding:0em 0em 0em 0em;
font-family:Berkshire Swash;
font-family: Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia;
font-size:26px;
line-height: 1.1;
}
h3 {
text-align:left;
color:#002070;color:#660000;color:blue;
font-weight:bold;
font-size:22px;
font-family:Berkshire Swash;
font-family: Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia;
margin:0em 0em .5em 0em;
padding:0em 0em 0em 0em;
}
h4 {
text-align: center;
width:60%;
color:#660000;color:#002070;color:#001070;color:#101010;color:#660000;
font-weight:bold;
margin:0em 0em 0em 0em;
padding:0em 0em 0em 0em;
font-family:Georgia, Times, serif;
	font-size:20px;
	font-style: italic;
}
h5 {
	text-align: center;	
	color:#00000F;		
	margin:.01em 0em .1em 0em;
	padding:.07em 0em .08em 0em;
	font-family: Verdana, Geneva, sans-serif;
	font-size:20px;
}
h6 {
	text-align:center;
	color:white;
	font-weight:bold;
	line-height: 2;
	font-size:80%;
	font-family:Arial;
}
p {
	text-align:left;
	margin:.5em 0em .5em 0em;
	padding:0em 0em 0em 0em;	
}
p.caption {
	font-size:90%;
	width:90%;
	line-height: 1.0;
	color: white;
	background-color: black;
	margin: 0%;
    margin-left: 4%;
	border:0.1em solid blue;	
	padding:0.8em;
}
.caption {
    float: center;
 	width:100%;
	margin: 0em;
	padding:0em;
	margin-bottom: 0.6em ;
}
.line {
	width:498;
	height:25;
	display: block;
	margin:0em 0em 0em 0em;
}
#header {
	background-color:#000073;
	color:white;
	text-align:center;
	padding:0px;
	width:100%;
	font-family:Georgia, Times, serif; 
}
.headimage {
    float: left;
 	width:99.5%;
    margin-top: 0em ;
    margin-right: 0.5em ;
    margin-bottom: 0.1em ;
    margin-left: 0em ;
	border: 2px solid brown;
	border-radius: 12px;
}
#footer {
    background-color:#000073;
    width:100%;
	margin:0em 0em 0em 0em;
	padding:0em 0em 0em 0em;
    text-align:center;
    clear:both;
}
/* Begin Navigation Bar Styling */
.btn1 {
	height: auto;
	-moz-box-shadow:inset 0px 1px 3px 0px #276873;
	-webkit-box-shadow:inset 0px 1px 3px 0px #276873;
	box-shadow:inset 0px 1px 3px 0px #276873;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #599bb3), color-stop(1, #408c99));
	background:-moz-linear-gradient(top, #2f4f4f 5%, #408c99 100%);
	background:-webkit-linear-gradient(top, #2f4f4f 5%, #408c99 100%);
	background:-o-linear-gradient(top, #2f4f4f 5%, #408c99 100%);
	background:-ms-linear-gradient(top, #2f4f4f 5%, #408c99 100%);
	background:linear-gradient(to bottom, #2f4f4f 5%, #408c99 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#2f4f4f', endColorstr='#408c99',GradientType=0);
	background-color:#599bb3;background-color:#2f4f4f;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	border:1px solid #29668f;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;color:#fffafa;
	font-family:Arial;
	font-size:16px;
	font-weight:bold;
	font-style:italic;
	padding:6px 16px;
   margin: 2px;
	text-decoration:none;
	text-shadow:0px -1px 0px #3d768a;
}
.btn1:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #408c99), color-stop(1, #2f4f4f));
	background:-moz-linear-gradient(top, #408c99 5%, #2f4f4f 100%);
	background:-webkit-linear-gradient(top, #408c99 5%, #2f4f4f 100%);
	background:-o-linear-gradient(top, #408c99 5%, #2f4f4f 100%);
	background:-ms-linear-gradient(top, #408c99 5%, #2f4f4f 100%);
	background:linear-gradient(to bottom, #408c99 5%, #2f4f4f 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#408c99', endColorstr='#599bb3',GradientType=0);
	background-color:#599bb3;color:#fffafa;
}
.btn1:active {
	position:relative;
	top:1px;color:#fffafa;
}
.btn2 {
margin:2px 2px 4px 2px;
-moz-box-shadow:3px 4px 0px 0px #899599;
-webkit-box-shadow:3px 4px 0px 0px #899599;
box-shadow:3px 4px 0px 0px #899599;
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #00b300));
background:-moz-linear-gradient(top, #ededed 5%, #00b300 100%);
background:-webkit-linear-gradient(top, #ededed 5%, #00b300 100%);
background:-o-linear-gradient(top, #ededed 5%, #00b300 100%);
background:-ms-linear-gradient(top, #ededed 5%, #00b300 100%);
background:linear-gradient(to bottom, #ededed 5%, #00b300 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#00b300',GradientType=0);
background-color:#ededed;background-color:#00b300
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
border:1px solid #d6bcd6;
display:inline-block;
cursor:pointer;
color:#000000;
font-family:Arial;
font-size:14px;
font-weight:bold;
padding:4px 16px;
text-decoration:none;
text-shadow:0px 1px 0px #e1e2ed;
}
.btn2:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #bab1ba), color-stop(1, #ededed));
background:-moz-linear-gradient(top, #bab1ba 5%, #ededed 100%);
background:-webkit-linear-gradient(top, #bab1ba 5%, #ededed 100%);
background:-o-linear-gradient(top, #bab1ba 5%, #ededed 100%);
background:-ms-linear-gradient(top, #bab1ba 5%, #ededed 100%);
background:linear-gradient(to bottom, #bab1ba 5%, #ededed 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bab1ba', endColorstr='#ededed',GradientType=0);
background-color:#bab1ba;
}
.btn2:active {
position:relative;
top:1px;
}
.btn2:visited {
position:relative;
font-style:normal;
top:1px;
}
img {
	width: 100%;
	margin:0em 0em 0em 0em;
	border: 0px;
	border-top-left-radius:12px;
	border-top-right-radius:12px;
	border-bottom-left-radius:0px;
	border-bottom-right-radius:0px;
}
img.rad {
	border-radius:12px;
}
.imgC {
	float: left;
	margin-left: 20px ;
	width: 800px;
	margin-right: 600px ;
    margin-top: 0.1em ;
    margin-bottom: 1em ;
	border: 2px solid brown;
	border-radius: 12px;
	clear: both;
}
.imgR4 {
    float: right;
    width: 400px;
    margin-top: 0.1em ;
    margin-right: 0em ;
    margin-bottom: 0.1em ;
    margin-left: 0.6em ;
	border: 2px solid brown;
	border-radius: 12px;
}
.imgR3 {
    float: right;
    width: 300px;
    margin-top: 0.1em ;
    margin-right: 0em ;
    margin-bottom: 0.1em ;
    margin-left: 0.6em ;
	border: 2px solid brown;
	border-radius: 12px;
}
.imgR2 {
    float: right;
    width: 150px;
    margin-top: 0.1em ;
    margin-right: 0em ;
    margin-bottom: 0.1em ;
    margin-left: 0.6em ;
	border: 2px solid brown;
	border-radius: 12px;
}
.imgL4 {
    float: left;
    width: 400px;
    margin-top: 0.1em ;
    margin-right: 0.6em ;
    margin-bottom: 0.1em ;
    margin-left: 0em ;
	border: 2px solid brown;
	border-radius: 12px;
}
.imgL3 {
    float: left;
    width: 300px;
    margin-top: 0.1em ;
    margin-right: 0.6em ;
    margin-bottom: 0.1em ;
    margin-left: 0em ;
	border: 2px solid brown;
	border-radius: 12px;
}
.imgL2 {
    float: left;
    width: 150px;
    margin-top: 0.1em ;
    margin-right: 0.6em ;
    margin-bottom: 0.1em ;
    margin-left: 0em ;
	border: 2px solid brown;
	border-radius: 12px;
}
.pic {
	width: 290px;
	background-color: white;
	border: 2px solid brown;
	border-radius: 12px;
	cursor: pointer;
	margin: 4px;
	display: inline-block;
}

.picR4 {
	width: 400px;
	background-color: white;
	border: 2px solid brown;
	border-radius: 12px;
	cursor: pointer;
	margin: 4px;
	display: inline-block;
	float:right;
}
.picR4:hover {

	background-color: #4CAFA0;
	border: 2px solid #4CAFA0;
	width: 95%
}
a{
    text-decoration: none;
}
.both {
	background-size: 100%;
	border: 2px solid brown;
	border-radius: 12px;
	margin:.1em 0em .1em 0em;
	padding:.1em .4em .1em .4em; /* top, right, bottom, left - 1em(10px) */	
	padding:12vw 0vw 20vw 9vw;
	display: inline-block;
	text-align:left;
	width:55%;	
	font-family: Verdana, Geneva, sans-serif;
	font-size: 3.5vw;
	text-shadow: 1px 1px blue;
}
div.txt {
    margin-top: .1em ;
    margin-right: 0% ;
    margin-bottom: 0.1em ;
    margin-left: 0% ;
	margin:.1em 0em .1em 0em;
	padding:.1em .4em .1em .4em; /* top, right, bottom, left - 1em(10px) */	
	border: 2px solid brown;
	border-radius: 12px;
	display: inline-block;
	text-align:left;
	width:100%;
	font-family: Verdana, Geneva, sans-serif;
	font-size:16px;
}
.logo {
	position:absolute;				
	margin: 0px 0px 0px 0px;    
	padding: 0px 0px 0px 0px;
	top: 43vw;top: 29.5vw;top: 11vw;  /* 523, 394, 217 */
	left:.5vw;
	width:16%;
}
#nfo{	
	position: absolute;	
	margin: 0px 0px 0px 0px;    
	padding: 0px 0px 0px 0px;
	font-family: Arial, Helvetica, FreeSans, sans-serif; 
	text-shadow: 1px 1px blue;
}
#tnm {
	position: absolute;	
	margin: 0px 0px 0px 0px;    
	padding: 0px 0px 0px 0px;
	top:5vw;
	font-family: Verdana, Geneva, sans-serif;
	font-family: Times New Roman;
	font-family: Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia;
	font-size: 7.5vw;
	text-shadow: 1px 1px blue;
	left:9vw;
}	
/*
left:9vw; at length of 19
left:22vw; at lenght of 14
left = 58.4 -2.6 length

$x =strlen($beName);
$x =58.4 -  2.6 * $x;

font-family: 'Great Vibes', cursive;	
font-family: 'Arizonia', cursive; 
*/
@media screen and (max-width: 900px) {
	.imgC {
		float: left;
		width: 95%;
		margin-right: 2.5% ;
		margin-left: 2.5% ;
	}
}
@media screen and (max-width: 600px) {
	.imgC {
		float: left;
		width: 95%;
		margin-right: 2.5% ;
		margin-left: 2.5% ;
	}
	.imgR3 {
		float: left;
		margin-right: 400px ;
		margin-left: 10px ;
	}
	.imgL3 {
		margin-right: 400px ;
		margin-left: 10px ;
	}
	.imgR4 {
		float: left;
		margin-right: 200px ;
		margin-left: 20px ;
	}
	.picR4 {
		float: left;
		margin-right: 200px ;
		margin-left: 20px ;
	}
}
@media screen and (max-width: 500px) {
	.picR4 {
		float: left;
		width: 95%;
		margin-right: 2.5% ;
		margin-left: 2.5% ;
	}
	.imgR4 {
		float: left;
		width: 95%;
		margin-right: 2.5% ;
		margin-left: 2.5% ;
	}
	.both {
	width:95%;	
}
@media screen and (max-width: 350px) {
	.imgR3 {
		float: left;
		width: 95%;
		margin-right: 2.5% ;
		margin-left: 2.5% ;
	}
	.imgL3 {
		width: 95%;
		margin-right: 2.5% ;
		margin-left: 2.5% ;
	}
}