
#bg {
width: 100%;
position: absolute;
top: 0;
text-align: center;
z-index: -5;  
}

body {
background-color: #000000;
overflow-x: hidden; 
}

#maincontent {
box-sizing:border-box;
border:5px solid transparent;
border-radius: .5em .5em 0 0; 
}
#topspace {
height: 57px;
}
#logo {
position: absolute;
top: 24px;
left: 50px;
text-align: left;
margin: 7px;
display: block;
background: transparent;
background-color: transparent;
}

#slogo {
position: absolute;
top: 15px;
text-align: center;
margin: 1px;
display: none;
background: transparent;
background-color: transparent;
}

#banner {
height: 67px;
}

#wrapper-test {
box-sizing:border-box;
border:25px solid transparent;
border-image:url(../images/border.png) 30 30 stretch; 
}
#topmenu {
position: absolute;
top: 25px;
font-size: 1.4em;
display: block;
height: 36px;
text-align: right;
vertical-align:middle;
left: -47px;
}
#bottommenu {
font-size: 1.2em;
display: block;
height: 2em;
text-align: center;
vertical-align:middle;
}
#stopmenu {
position: relative;
top: 1.3em;
font-size: 1.2em;
display: none;
}
#sbottommenu {
font-size: 1.3em;
display: none;
}

#what_box, #where_box, #contact_box {
background-color: #d4d1ca;
position: fixed;
color: #3f3f3f;
top: 10%;
left: 10%;
height: 80%;
width: 80%;
margin-top: 5px; 
max-height: 500px;
clear: both;
border-width: 1px;
border-style: solid;
border-color: #8f8f8f;
font-family: MuseoSansRounded-500; 
font-size: 1.08em;
display: none;
overflow: hidden;
z-index: 500;
}	

#subpara {
color: #000000;
border-top: none;
font-size: 1.4em;
font-family:  MuseoSansRounded-300;
line-height: 140%;
}	

#subpara, a:link {
color: #000000;

}

a.subtitle {
text-decoration: none;
color: #000000;
padding: 3px;
cursor: default;
font-size: 1.8em;
}

a.subtitleH {
text-decoration: none;
color: #000000;
padding: 3px;
cursor: hand;
font-size: 1.8em;
}

a.subtitle:hover {
color: #000000;
}

#lefttitle {
color: #000000;
border-top: none;
font-size: 1.4em;
font-family:  MuseoSansRounded-300;
line-height: 140%;
text-align: left;
}

#leftcontent {
color: #000000;
border-top: none;
font-size: 1.2em;
font-family:  MuseoSansRounded-300;
line-height: 140%;
text-align: left;
}

#map-canvas {
height: 440px; 
width: 99.8%; 
border-style: solid; 
border-width: 1px; 
border-color: #999;"
}


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

	#topspace {
	height: 35px;
	}
	#logo {
	position: absolute;
	top:2px;
	left: 15px;
	display: none;
	}	
	#slogo {
	position: absolute;
	top:8px;
	text-align: center;
	display: block;
	}	
	#map-canvas {
	left: 4%;
	height: 25em;
	width: 92%; 
	}
	#subpara {
	color: #000000;
	border-top: none;
	font-size: 1.2em;
	word-wrap: normal;
	padding: 10px;
	font-family:  MuseoSansRounded-300;
	line-height: 140%;
	}	
	a.subtitle {
	font-size: 1.4em;
	}

	#banner {
	height: 50px;
	}
	#topmenu {
		display: none;			
	}
	#bottommenu {
		display: none;
	}
	#stopmenu {
		top: 50px;
		font-size: .95em;
		display: block;			
		text-align: center;
		width: 100%;
	}
	#sbottommenu {
		font-size: .95em;
		display: block;
		text-align: center;
		width: 100%;		
	}

	#what_box, #where_box, #contact_box {
		top: 10%;
		left: 10%;
		height: 80%;
		width: 80%;
		font-size: .9em;
	}

}


a.box {
position: absolute; 
top: 0px; right: 0px; 
cursor: pointer; 
cursor: hand;	
background-image: url('../images/xxxb.png');
height: 21px;
width: 21px;
}

a.box:hover{
background-image: url('../images/xxxr.png');
}

a.fover {
text-decoration: none;
color: #000000;
cursor: pointer; 
cursor: hand;
border-width: 0 0 1px; 
border-style: solid; 
padding: 3px;
}

a.fover:hover{
opacity: .7;
}

a.over:link, .over, a:visited { 
background: transparent;
border: 0.1em solid transparent;
-moz-border-radius: .2em .2em .2em .2em; 
-webkit-border-radius: .2em .2em .2em .2em; 
-o-border-radius: .2em .2em .2em .2em; 
-ms-border-radius: .2em .2em .2em .2em; 
-khtml-border-radius: .2em .2em .2em .2em; 
border-radius: .2em .2em .2em .2em; 
line-height: 30px;
height: 20px; 
vertical-align:middle; 
color: #585858; 
text-decoration: none; 
padding: 10px;
opacity: 1;
}

a.over:hover{
border: 0.1em solid rgba(0, 0, 0, 1);
color: #0198DE;
opacity: 1;
}

a.current {
border: 0.1em solid rgba(24, 8, 34, 1);
-moz-border-radius: .2em .2em .2em .2em; 
-webkit-border-radius: .2em .2em .2em .2em; 
-o-border-radius: .2em .2em .2em .2em; 
-ms-border-radius: .2em .2em .2em .2em; 
-khtml-border-radius: .2em .2em .2em .2em; 
border-radius: .2em .2em .2em .2em; 		
line-height: 30px;
height: 20px; 
vertical-align:middle; 
color: #0198DE;
padding: 10px;
opacity: 1;
}
a.current:hover {
border-radius: .2em .2em .2em .2em; 
}

form ol {
list-style-type: none;
padding-top: 10px;
}
form li {
padding: 10px 0; /* ie7.css */
margin: 0;
}
form label {
font-weight: bold;
display: block;
color: #333;
}
form label span {
font-weight: normal;
font-size: 90%;
}
form label em {
font-style: normal;
color: #cc0000;
}

.textField:focus {
border: 1px solid #333;
}
.long {
width: 280px;
}


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

	/* Changing font sizes on the device */

	.long {
	width: 200px;
	}

	#fit35 {
		font : 100%/1.4 'MuseoSansRounded-500', 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif; 	
		font-size: 3.5em;
		line-height:1em;
		margin: .6% 0 0 1.6%;
		overflow:hidden; 
	}
	@media only screen and (max-width: 600px) {
		#fit35{
		font-size : 1.75em;
		line-height:1em;
	}
	}

	#fit30 {
		font : 100%/1.4 'MuseoSansRounded-500', 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif; 	
		font-size: 3.0em;
		line-height:1em;
		margin: .6% 0 0 1.6%;
		overflow:hidden; 
	}
	@media only screen and (max-width: 600px) {
		#fit30{
		font-size : 2.0em;
		line-height:1em;
	}
	}

	#fit25 {
		font : 100%/1.4 'MuseoSansRounded-500', 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif; 	
		font-size: 2.5em;
		line-height:1em;
		margin: .6% 0 0 1.6%;
		overflow:hidden; 
	}
	@media only screen and (max-width: 600px) {
		#fit25{
		font-size : 1.25em;
		line-height:1em;
	}
}



