html { min-height: 100%; 
	position: relative; 
	letter-spacing: 0.5px;} 

body { 
	margin: 0; 
	height: 10%; 
	margin-right: 2em;  } 

/* The closex is the background cancel or close icon*/
.closex{
	position: absolute;
	top: 5px;
	right:5px;
	height:28px;
	width:28px;
	background-image: url(../images/small/closex.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	cursor: pointer;
	z-index:103;
}

.closex:hover{
	background-image: url(../images/small/closex.png);
	background-repeat: no-repeat;
	background-position: -28px 0px;
	
}
/* The float container is the area of the thing in the container plus its margin*/
#regions .floatcon{
	max-width:380px;
	max-height:167px;
	display:block; 
	left:-10px;
	/*margin-left: 35%;*/
	top: 0%; 
    position: absolute; 
} 

#roles .floatcon2 {
	max-width:380px;
	max-height:167px;
	left:-10px;
	display:block; 
	top: 40%; 
    position: absolute; 
} 


#regions .floatfront {
	max-width:380px;
	max-height:261px;
	display:block; 
	position: absolute;
} 

.hideit{ 
	display:block; 
	-moz-opacity:0;
	opacity:0;
	filter:alpha(opacity=0);
	-webkit-transition: .5s all linear;
	transition: .5s all linear;
}

.showit{ 
	-moz-opacity:1;
	opacity:1;
	filter:alpha(opacity=100);
	-webkit-transition: .5s all linear;
	transition: .5s all linear;
	
}

.glass-holderm
{	width:380px;
	height:167px;
	margin-left:auto;
	margin-right:auto;
	margin-top:2%;
	border-radius:7px;
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	padding:20px;
	border-style:outset;
	border-color:rgb(225,255,255);
}	

.glass-holderm2
{	width:380px;
	height:167px;
	margin-left:0px;
	margin-top:2%;
	border-radius:7px;
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	padding:20px;
	border-style:outset;
	border-color:rgb(225,255,255);
}	
	
	
.floatcon img{ 
	width:380px;
	height:167px;
	position: absolute; 
	z-index:102;
	margin: 2px ;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
} 

.floatfront img{ 
	width:380px;
	height:261px;
	z-index:102;
	margin: 2px ;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
} 

.floatfront .closex {
	top:-5px;
	right:-5px;
	
}



.floatcon2 img{ 
	width:380px;
	height:167px;
	position: absolute; 
	z-index:102;
	margin: 2px ;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
} 

.wrapperfloatcon{
	background-color:rgb(255,255,255);
	margin: auto;
	width:97.5%;
	height:97.5%;
	position:relative;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	opacity:1;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	border-style:outset;
	border-color:rgb(255,255,255);
	z-index:10;
	/*-webkit-box-shadow: 5px 5px  #888888;
	-moz-box-shadow: 5px 5px  #888888;
	box-shadow: 5px 5px  #888888;*/
}
  
.floatcon img:hover, .floatcon2 img:hover, .floatfront img:hover{
	-webkit-box-shadow: 1px 1px 1px rgba(5,5,5,0.8);
    box-shadow: 1px 1px 1px rgba(5,5,5,0.8);
}


/* floathd is a floating header over the charts */
.floathd{ 
	font-size:13px;
	display: block;  
	background: rgb(0,0,255);
	color: white; 
	position: absolute; 
	z-index:102;
	top: 5px; 
	left: 5px; 
	padding: 5px; 
} 

.floathdl{ 
	font-size:13px;
	display: block;  
	background: rgb(0,0,255);
	color: white; 
	position: absolute; 
	z-index:102;
	top: -10px; 
	left: 10px; 
	padding: 5px; 
	text-align:center;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
} 

.floathdrb{ 
	font-size:13px;
	display: block;  
	background: rgb(0,0,255);
	color: white; 
	position: absolute; 
	z-index:102;
	top: -10px; 
	padding: 5px;
	width:120px;
	text-align:center;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	
	}

.floathdrg{ 
	font-size:13px;
	display: block;  
	background: rgb(0,128,0);
	color: white; 
	position: absolute; 
	z-index:102;
	top: 5px; 
	left: 5px; 
	padding: 5px;
	}
	
.floathdrr{ 
	font-size:13px;
	display: block;  
	background: rgb(204,0,0);
	color: white; 
	position: absolute; 
	z-index:102;
	top: 5px; 
	left: 5px; 
	padding: 5px;
	}	

.floathdro{ 
	font-size:13px;
	display: block;  
	background: rgb(255,125,0);
	color: white; 
	position: absolute; 
	z-index:102;
	top: 5px; 
	left: 5px; 
	padding: 5px;
	}		
	
.floathdfront{ 
	font-size:14px;
	display: block;  
	background: rgb(0,0,255);
	color: white; 
	position: absolute; 
	z-index:102;
	top: 20px; 
	left: 5px; 
	padding: 5px; 
	z-index:102;
}


.floathdmap{ 
	display: block;  
	background: rgb(0,0,0);
	color: white; 
	position: absolute; top: 400px; left: 400px; 
	padding: 10px; 
	opacity: 0; 
	filter:alpha(opacity=0);
} 

dt:hover .floathdmap { 
	opacity: 1;
	filter:alpha(opacity=100);  } 


.floathd:before, .floathdrg:before, .floathdro:before, .floathdrr:before,  .floathdfront:before,.floathdmap:before {content:attr(title);}


#salrvwright  .floathdrg, #salrvwright  .floathdro, #salrvwright  .floathdrr{
	position: relative; 
	top: 5px; 
	margin-bottom:10px;
	text-align:center;
	width:85%;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
}

#salrvwright .hd {
	margin-left:auto;
	margin:5px 0px 10px;
}

#salrvwright img{
	cursor:pointer;
}

#credits{
	display: inline;  
	background: rgb(0,0,255);
	color: white; 
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	padding:5px;
	cursor:pointer;
}

.hd:hover{
	cursor:pointer;
	color:blue;
}

.hd{ 
	font-size:13px;
	display: block;  
	background: rgb(255,255,255);
	color: black; 
	padding: 5px;
	width:85%;
	margin-bottom:0px;	
} 

#salrvwright .imgStdTn:hover, .hd:hover{
	-webkit-box-shadow: 1px 1px 1px rgba(5,5,5,0.8);
    box-shadow: 1px 1px 1px rgba(5,5,5,0.8);
}

#mapthree{ 
   	margin-top:10px !important;
	margin-left:5px;
	width:100%;
	min-width:820px;
	height:600px;
	min-height:400px;
	position:relative;
	
	/*border-style:solid;
	border-color:blue;*/
}

#imgmapuk{
	margin-top:20px;
}
#mapframe{
	width:700px;
	position:relative;
	margin-left:0px;
}

#mapframe img{
	position:relative;
	left:-100px;
}


#salrvwleft {
    float:left;
	width:330px;
	height:90%;
	min-height: 400px;
    margin: auto;
    padding:10px;
	
}

#salrvwmid { 
	left:37.5%;
	position:absolute;
	top: 0px;
	width:40%;
	max-width:380px;
    height: 90%;
	min-height: 400px;
    padding:10px;
	z-index:1;
}


#salrvwright{
   float:right;
	min-height: 400px;
	height:90%;
	width:140px;
	margin:auto;
    padding:10px;
}

div.scroll30{  
	height:30%;
	overflow-y:scroll;
}

div.scroll100{  
	height:100%;
	overflow-y:scroll;
}
div.floatcon_scroll{  
	height:130px;
	overflow-y:scroll;
}

div.brd{
	padding-left:4px;
	border-style:solid;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	margin-top:0px;	
}

.bgreen{
	border-color:rgb(0,128,0);
}

.borange{
	border-color:rgb(255,128,0);
}

.bred{
	border-color:rgb(204,0,0);
}

#nim:hover, #walesm:hover, #seeam:hover, #lndnm:hover, #wmnwm:hover,#emnem:hover, #scotm:hover {
	cursor:pointer;
}