/* nano
   font sizes set to px: p is 15px 
   id = #; class = .
*/
  
/**********************************
 misc and layout*******************/ 

.red {color: red;}

.clear { clear:both; }

.thin_clear { clear: both; height: 1px; overflow: hidden; }

.thick_clear { clear: both; height: 10px; }

.right { float: right; }

.left { float: left; }

.centred { text-align: center; }

/**********************************
 set up document*******************/ 

body { 
	padding: 0; 
	margin: 0; 
	font: 15px Verdana, sans-serif; 
	line-height: 1.4em;
	background: #ffffff; 
	color: #000; 
}

#container { 
	width: 960px;
	margin-left:auto;
	margin-right:auto;
	background: #E7E6F0;
}

#main { padding: 0 10px 0 10px; }

/**********************************
 Typography   s********************/ 

a { color: #404973; background: inherit; outline: none; border: none; text-decoration: none;}
a:hover { color: #6C757A; background: inherit; }
a.info {
        position: relative;
        z-index: 24;
        text-decoration: none;
}
a.info:hover {
        z-index: 25;
}
a.info span { display: none; }
a.info:hover span.info {
        display: block;
        position: absolute;
        width: 650px;
        padding: 2px; border: 1px solid #333;
        text-align: left;
        color: #000; background: #E7E6F0;
}
h1, h2, h3 { 
  font-size: 24px; 
  font-weight: bold; 
  color: #000;
  padding: 7px 0 7px 0;
  margin: 0;
}
  
/*h1 a, h2 a { text-decoration: none; }
h1 a:hover, h2 a:hover { color: #6C757A; background: inherit; }*/
h2 { font-size: 18px;  padding: 7px 0 7px 0;}
h3 { font-size: 16px;  padding: 14px 0 7px 0;}

h2.report {
  font-size: 16px; 
  font-weight: bold; 
  color: #404973;
  background: #CECCE0;
  padding: 1px 0 1px 5px;
  margin: 5px 0 10px 0;
}
h2.report:hover {  background: #A0A0D0 !important; }

p { margin: 0 0 10px 0; }
p a {font-weight: bold;}

ul { margin: 0 0 5px 20px; padding: 0; }

#nav_header p {font-size: 16px; }
#nav_footer p {font-size: 16px; }

.dark  { color: #737373; background: inherit; font-weight: bold; }

/**********************************
 Header ***********************/
 
#header { background: #fff; padding-top: 10px; margin-bottom: 0px; height: 140px; }

#logo { display: inline; float: left; border: none; }

#newmenu{ margin-top: 20px; height: 140px; width: 400px; float: right; }

.button{ margin-top: 20px; border: none; float: right}

.image_borderless{ border: none; }

/**********************************
 Nav footer and header ************/
#nav_footer { 
  font-size: 12px;
  clear: both;
  text-align: center;
  height: 25px;
  padding: 5px 10px 0px 10px;
  margin: 30px 0 30px 0;
  background: #cecce0;
  font-weight: bold;
}

#nav_footer .home, .links, .about, .news, .training {
  width: 20%;
  float: left;
  text-align: center;
  border: 0px; 
  margin: 0;
}

#nav_header { 
  font-size: 12px;
  clear: both;
  text-align: center;
  height: 25px;
  padding: 5px 10px 0px 10px;
  margin: 0px 0 20px 0;
  background: #cecce0;
  font-weight: bold;
}

#nav_header .home, .links, .about, .news, .training{
  width: 20%;
  float: left;
  text-align: center;
  border: 0px; 
  margin: 0;
}

/**********************************
 Login div  ***********************/
#login_box{
  margin: 0;
  margin-left: 280px;
  margin-right: 280px;
  margin-top: 50px;
  margin-bottom: 50px;
  padding: 10px; 
  width: 440px; 
  height: 180px; 
  background: #F0F0F0; 
  border: solid #000000 1px; 
}

/**********************************
 Report divs  ***********************/
#report_form{
  margin: 5px;
  padding: 5px;
  background: #CECCE0; /*#A0A0D0;*/
  border: solid #000000 1px;
}

.section_container{
  padding: 5px;
  border: dashed #fff 1px;
}

.radio_area{
  padding: 1px 1px 1px 10px;
  border: solid #FFFFFF 1px;
  float: left;
  width: 650px;
}

.radio_label{
  width: 200px;
  float: left;
}
.radio_button{
  width: 100px;
  float: left;
}

#report_description_area{
  padding: 1px;
  border: none;
  float: right;
  width: 696px;
}

.moving_map{ }

#report_filter {margin-top: 5px; margin-bottom: 5px;}

/**********************************
 Link page  ***********************/
.link { margin: 5px 0 25px 0; }

/**********************************
 Welcome page ***********************/
#right_container{ width: 300px; float: right; }

#welcome_note{ width: 600px; }

#welcome_pictures{ margin: 20px 0px 0px 70px; }

#welcome_pictures p{ line-height: 1.2em; margin: 10px 0 0 0; text-align: right; width: 100%; }

#welcome_news {
	margin-top: 10px; 
	padding: 0 5px 0 5px; 
	height: 500px; 
	width: 930px; 
	overflow-y: scroll;}
	
#welcome_news p { margin-bottom: 50px;}

#welcome_news h2 { font-size: 15px; font-weight: bold; padding: 7px 0 0 0;}

#welcome_image { width: 600px; margin-bottom: 5px; padding: 5px; float:left; }

#slideshow {
  /*display:none;*/
  height: 300px;
  width: 300px;
}

.slide {
  position: relative;
  display: block;
  width: 100%;
  height: 300px;
  border: black 1px solid;
}

#slide1 {
}

#slide2 {
  top: -300px;
}
#slide3 {
  top: -600px;
}


/**********************************
 Comment divs  ***********************/
#comments_container{
  margin: 5px;
  padding: 5px;
  border: solid #000 1px;
}

.comment{
  margin-bottom: 5px;
  padding-left: 10px;
  border: dashed #000 1px;
}

.comment_description{
    padding: 1px;
    border: none;
    float: right;
    width: 684px;
}

/**********************************
 Analysis divs  ***********************/
#analysis_container{
    margin: 5px;
    padding: 5px;
    border: solid #000 1px;
}

/**********************************
 Forms and buttons ****************/

form { margin: 0; }

label { 
  font-weight: bold;
  float: left;
  width: 220px;
}

input.task {
	padding: 0px 5px 0px 5px;
	margin: 0;
	text-align: right;
    border: 0;
}
/**********************************
 Flash messages *******************/
 
.fieldWithErrors {
  padding: 2px;
  border: solid 2px red;
  /* display: table; */
}

#errorExplanation {
  border: 2px solid red;
  background-color: #ffbfbf;
  padding: 7px;
  margin-top: 20px;
  margin-bottom: 20px;
}

#errorExplanation h2 {
  text-align: left;
  font-weight: bold;
  font-size: 14px;
}

#errorExplanation ul li {
  font-size: 12px;
  list-style: square;
  margin-left: 20px;   
}

#notice {
  border: 2px solid green;
  background-color: #d9ffd9; /* 15% saturation */
  padding: 7px;
  margin-bottom: 20px;
}
#warning {
  border: 2px solid orange; /* orange */
  background-color: #ffedcc; /* 20% saturation */
  padding: 7px;
  margin-bottom: 20px;
}

/**********************************
 Tables ***************************/

table {
    margin: 5px 0px 5px 0px;
    border-collapse: collapse;
    border: 1px solid #000000;
    font-size: 12px;
}

thead, tfoot, th {
    font-weight: bold;
    padding: 2px 10px 2px 10px;
    background-color: #ddd;
    border: 1px solid #000000;
    text-align: center; /* default */
}

td {
    padding: 2px 10px 2px 10px;
    border: 1px solid #000000;
    width: 200px;
    text-align: left;
    font-weight: normal;
}

.notes { padding-left: 200px; }

/**********************************
 Search results *******************/

#search_results {
  margin-left: 50px;
}

#search_results h2 {
  font-size: 14px;
  padding: 7px 0 0 0;
}

#search_results p {
	margin: 0 0 0 0; 
}



/* tabbed menu from www.homelesspixel.de */

#newmenu{ background: #fff; height: 60px; clear: both; border: none; outline: none;}

#menu{
	background: #fff;
	clear: both;
}

ul#topnav {
	height: 33px;
	margin:0 0 0 0;
	padding: 0 0 0 0;
	list-style: none;
	border: none;
} 

#topnav li {
	display: block;
	margin: 0 50px 0 0;
	padding: 0;
	float:left;
}

#topnav a {
	display:block;
	color:#444;
	text-decoration:none;
	background: #ddd;
	margin:0;
	padding: 0.2em 1.4em 0.2em 1.4em;
	position: relative;
	font-weight: bold;
}
#topnav a#a0 { left: 0px;}
#topnav a#a1 { left: -30px;}
#topnav a#a2 { left: -60px;}
#topnav a#a3 { left: -90px;}
#topnav a#a4 { left: -120px;}
#topnav a#a5 { left: -150px;}
#topnav a#a6 { left: -180px;}
#topnav a#a10{ background:#fff; position: absolute; left: 87.9%; font-weight: normal;}
	
#topnav a:hover {
	color:#ff43ff;
	background: #636f9f;
}

#topnav a.here {
	color:#fff;
	position:relative;
	z-index:102;
	background: #129db2;
	margin: 0 0 0 0; /* was 0 4px 0 0*/
}

ul#subnav {
	position:absolute;
	z-index:101;
	margin: -1px 0 0;
	left: 0px;
	padding: 1px 0px 3px 20px;
	background: #129db2;
	border-top: 1px solid #fff;
	border-bottom: 2px solid #999;
	width: 979px;
}

#subnav li {
	position:relative;
	z-index:102;
	display: inline;
	margin: 0;
	padding: 0;
	float:left;
}

#subnav a {
	color:#fff;
	display:block;
	text-decoration:none;
	margin:0;
	padding: 2px 12px 2px 10px;
	background: transparent;
	background-image: none;
	border: 0 none;
}

#subnav a:hover {
	color:#ffcc00;
	background: transparent;
	background-image: none;
	border: 0 none;
}

#subnav a.here {
	color:#e0691a;
	background: transparent;
	background-image: none;
	border: 0 none;
	margin:0;
	padding: 2px 12px 2px 10px;
}

/**********************************
 Search box  **********************/
#search_box {
	margin-top: 3px;
	margin-right: 5px;
	display: inline;
	float :right;
}
