/*

	BlueBlog - FREE Template 
	by David Herreman
	http://www.free-css-templates.com
	
*/

@font-face {
  font-family: 'LCD';
  src: url('../fonts/LCD14.otf'); /* IE9 Compat Modes */
  src: url('../fonts/LCD14.otf')  format('truetype') /* Safari, Android, iOS */
}

body {
	margin:0px 0;
	padding:0;
	color:#404040;
	background: #FFF;
	line-height: 1.4em;
	font-family: Arial, Sans-Serif;
	font-size: 74%;
}


.content { 
	/*background: #FFF url(../images/mainbg1000edge.jpg) repeat-y center;
	color: #ccc; 
	margin: 0 auto; 
	padding: 0; 
	width: 1000px;*/
}

.img {
	padding: 0 8px 8px 0;
	float: left;
}

.img2 {
	padding: 0 0 3px 3px;
	float: right;
}



/* HEADER 
---------------------------------------------------------------------------------------------------------------------------------------------------
*/
#top {
	padding: 0;
	margin: 0;
}

#top .padding { 
	float: right;
	color: #808080;
	padding: 20px 25px 0 0;
	font-size: 90%;
}

#top a { color: #E0F5FF; }


#header { 
	margin: 0; 
	/*background: #036EB4 url(../images/header1000edge.jpg) no-repeat center top;*/  
    background: #FFF;
	height: 149px; 
	color: #186F4D; 
}

#header .f_search { float: right; padding: 70px 50px 0 0; }
#header .title {	padding: 45px 0 0 50px; }
#header .titlebar {	padding: 30px 0 0 20px; }
#header h1 {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 36px;
	font-weight: bold;
	margin: 0;
	padding: 0;
}

#header h2 {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 18px;
	background-image: none;
	color: #186F4D;
	margin: 0;
	padding: 0 0 0 2px;
}


/* SUBHEADER 
---------------------------------------------------------------------------------------------------------------------------------------------------*/
#subheader { 
	/*background: #000 repeat-y center;*/
	background: #186F4D repeat-y center;
	/*width: 970px;*/
	height: 35px;
	color: #FFF;
	/*margin-left: 15px;*/
	
}
#subheader .padding { padding: 10px 15px 10px 15px; }
#subheader h2 { color: #FEAB06; }
#subheader a {color: #FECF5F; }





#main-nav {
	/*background: #000 url(../images/menu.jpg) no-repeat center bottom;*/
	background: #186F4D;
	width: 960px;
	height: 35px;
	margin: 0;
}

#main-nav ul { margin:0; list-style:none; padding: 0px 0 0px; }
#main-nav a, #nav strong, #nav span { float:left; display:block; color:#fff; padding: 8px 8px 4px 8px; font-size: 130%; text-decoration:none;  }
#main-nav a { float:none; }
#main-nav li { float:left; color: #FFF; background: #186F4D; margin:0; padding:0 0 0 0px; }
#main-nav a:hover { text-decoration:underline;}  
#main-nav .padding { padding: 5px 0 0 10px; font-weight: bold; }

/*

  #main-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
*/
#main-nav ul li {
 /* display: inline-block;*/
  margin: 0;
 /* padding: 5px 0 0 20px;*/
  /*border-radius: 0.5em;*/ 
}

#main-nav ul li.active { background: #999; }

#main-nav ul li.active a {
  color: #fff;
  text-decoration: none;
}

/* A single menu */

.dropotron {
  background: #444;
  border-radius: 0.5em;
  list-style: none;
  margin: 0;
  min-width: 10em;
  padding: 0.75em 1em 0.75em 1em;
}

.dropotron > li {
  border-top: solid 1px #555;
  margin: 0;
  padding: 0;
}

.dropotron > li:first-child { border-top: 0; }

.dropotron > li > a {
  color: #ccc;
  display: block;
  padding: 0.5em 0 0.5em 0;
  text-decoration: none;
}

.dropotron > li.active > a,
.dropotron > li:hover > a { color: #fff; }

/* Only applies to top level ("level-0") menus */

.dropotron.level-0 { margin-top: 1.25em; }

.dropotron.level-0:before {
  content: '';
  position: absolute;
  border-bottom: solid 0.5em #444;
  border-left: solid 0.5em transparent;
  border-right: solid 0.5em transparent;
  top: -0.5em;
}


/* NAVIGATION
---------------------------------------------------------------------------------------------------------------------------------------------------*/
.nav { text-align: left; color: 	#7D8085; padding: 2% 0 0 0px;  }
.nav li { 
	margin: 5px 0 5px 0px; 
	padding: 0px 0 0 0px; 
	border-bottom: 1px dotted #ccc; 
	
	list-style: none;
}
.nav li a { color: #546078; text-decoration: none;  padding: 5px 0 0 0px; display: block; margin-bottom: 2px;}
.nav li a:hover { color: #186F4D; text-decoration: none; background: #E5F6FF; display: block; margin-bottom: 2px;}


/* MAIN
---------------------------------------------------------------------------------------------------------------------------------------------------*/
#main { background: #FFF; width: 100%; color: #000000; 
	line-height: 1.6em;
	font-family: Arial, Sans-Serif;
	font-size: 130%;}
	
#main .right_side { float: right;
	padding:0px 0 0 10px; margin:0;
	background-color: #FFF;
	width: 20%; 
}

#main .right_side .hitems { margin: 0; 	padding: 0; }
#main .right_side .hitems ul { 
	margin: 5px 0 5px 0; 
	padding : 0; 
	color: #a90000;
	list-style-image: url(arrow.gif);
}
	
#main .right_side .hitems li { 
	margin: 0 0 2px 20px;
	padding: 0 0 0 0px;
	color: #555;
	 
}

#main .left_side { float: left; width: 75%; background: #FFF; padding:15px 15px 0 20px; margin:0; }
#main h3 {  font: 100% Arial, Sans-Serif; margin: 0 0 10px 0px; padding: 0;  color: #5f5f5f; background: inherit; 
			border-bottom: 1px solid #186F4D; ;
}

#main td { 
	text-align: center;}

#main .leftA {
    text-align:left;
}
#main .centA {
    text-align: center;
}
#main .bg_1 {
    background-color: #9cff9c;
    color: #000;
    text-align: center;
}
#main .bg_2 {
    background-color: #31ff00;
    color: #000;
    text-align: center;
}
#main .bg_3{background-color:#31cf00;color:#000;text-align: center;}
#main .bg_4{background-color:#ff0;color:#000;text-align: center;}
#main .bg_5{background-color:#ffcf00;color:#000;text-align: center;}
#main .bg_6{background-color:#ff9a00;color:#222;text-align: center;}
#main .bg_7{background-color:#ff6464;color:#000;text-align: center;}
#main .bg_8{background-color:red;color:#fff;text-align: center;}
#main .bg_9{background-color:#900;color:#fff;text-align: center;}
#main .bg_10{background-color:#ce30ff;color:#fff;text-align: center;}

#main .box  {	background: #efefef; padding: 5px; border: 1px solid #ccc;}

#main .right_side ul { 
	margin: 5px 0 5px 0; 
	padding : 0; 
	list-style : none; 
	border-bottom: 0px solid #eee; 
	list-style-type: square;
	color: #a90000;
}
	
#main .right_side li { 
	margin: 0 0 2px 15px;
	padding: 0 0 0 0px;
	color: #555;
}

#main .right_side  .padding {
/*margin: 0 0 20px 15px;*/
	padding: 0 0 0 0px;
	color: #555;
}


#main .right_side td { 
	text-align: left;
}

#main .right_side .bg_1 {background-color: #9cff9c;color: #000;text-align: center;}
#main .right_side .bg_2 {background-color: #31ff00;color: #000;text-align: center;}
#main .right_side .bg_3{background-color:#31cf00;color:#000;text-align: center;}
#main .right_side .bg_4{background-color:#ff0;color:#000;text-align: center;}
#main .right_side .bg_5{background-color:#ffcf00;color:#000;text-align: center;}
#main .right_side .bg_6{background-color:#ff9a00;color:#222;text-align: center;}
#main .right_side .bg_7{background-color:#ff6464;color:#000;text-align: center;}
#main .right_side .bg_8{background-color:red;color:#fff;text-align: center;}
#main .right_side .bg_9{background-color:#900;color:#fff;text-align: center;}
#main .right_side .bg_10{background-color:#ce30ff;color:#fff;text-align: center;}
/* FOOTER
---------------------------------------------------------------------------------------------------------------------------------------------------*/
#footer { 
	clear:both;
	height: 43px;
	color:#ccc;  
	background: #000 url(../images/footer1000edge.jpg) top no-repeat; 
	font-size:40%; 
	padding: 0; 
	text-align:center; 
}

#footer .padding { padding: 10px 0px 0px 0px; }
#footer .right { 
	float:right; 
	clear:right; 
	text-align:right; 
}

#footer a { color: #E0F5FF; }

/*  Top Menu */
#menu {
	/*background: #000 url(../images/menu.jpg) no-repeat center bottom;*/
	background: #000;
	width: 960px;
	height: 35px;
	margin: 0;
	padding: 0;
}

#menu ul { margin:0; list-style:none; padding: 5px 0 0 20px; }
#menu a, #nav strong, #nav span { float:left; display:block; color:#fff; padding: 5px; text-decoration:none;  }
#menu a { float:none; }
#menu li { float:left; color: #FFF; background: #000; margin:0; padding:0 0 0 0px; }
#menu a:hover { text-decoration:underline;}  
#menu .padding { padding: 5px 0 0 10px; font-weight: bold; }




/* ---------------------------------------------------------------------------------------------------------------------------------------------------*/

input.search { width: 150px; border: 1px solid #186F4D; color: #666; }
input.submit { 
	background: none; 
	color: #186F4D;
	font: bold 1.1em Arial, Verdana, Helvetica, sans-serif; 
	border: 0;
}

input.search:hover {	background: #FFFFF4; }

ul { margin-left: 0; padding-left: 5px; list-style : square; }
li { 	margin: 0 0 2px 15px; padding: 0 0 0 0px;	color: #555; }
.sub  {margin: 0 0 2px 30px; padding: 0 0 0 0px;  color: #888; }

p { margin: 0 0 5px 0; padding: 0; color: #000000; background: inherit; }
a {
	color: #088a16;
	color: #205828 background: inherit;
	text-decoration: none;
}
a:hover { background: inherit; text-decoration:underline; }

h1 { 
	padding:0; 
	margin:0; 
	color: #186F4D; 
	background: inherit;
	font: bold 1.8em Arial, Sans-Serif; 
	letter-spacing: -1px;
}

h1 a { color: #FFF; background: inherit; }

h2 { 
	/*background: url(../images/h.gif) no-repeat left;
	color:#075181;*/
    color:#186F4D;
	font-size:140%; 
	font-weight:bold; 
	margin: 5px 0 5px 0px; 
	/*padding:0 0 0 30px; */
}

h2 a { background: #FFF; color: #00D736; }  
h2 a:hover { background: #FFF; color: #00D736; text-decoration:none;  }

fieldset {	border: 1px solid #186F4D; }
textarea.text { 
	height: 150px; 
	width: 90%; 
	border: 1px solid #A90000; 
	background: #FFF; 
	color: #354D5F;
}

textarea.text:hover { 
	border: 1px solid #A70000; 
	background: #FFFFF4; 
	color: #000;
}

input.field { 
	border: 1px solid #186F4D; 
	background-color: #FFFFFF; 
	width: 283px; 
	color: #000;
}

input.field:hover { 
	border: 1px solid #68ADD5; 
	background: #FFFFF4; 
	color: #000;
}

input.text { 
    border: 1px solid #A70000; 
	margin: 0; 
	width: 150px;
	background: inherit;
	color: #000; 
	padding: 4px;
	
}


input.text:hover { 
	border: 0px solid #68ADD5; 
}

.date { 
	color: #808080; 
	background: #FFFFFF;
	text-align: right; 
	margin: 4px 0 5px 0; 
	padding: 0.4em 0 0 0; 
	border-top: 1px solid #eee;
}

.comments { 
	padding: 10px 10px 8px 10px; 
	margin: 0 0 7px 0; 
	background: #f8f8f8; 
	color: #000;
}

.commentsbox { 
	padding: 8px 0 10px 10px; 
	margin: 0 0 10px 0; 
	background: #f4f4f4; 
	color: #000;
}

.error {
	color: #990000;
	background-color: #FFF0F0;
	padding: 7px;
	margin-top: 5px;
	margin-bottom: 10px;
	border: 1px dashed #990000;
}
.error h2 {
	color: #990000;
	background: inherit;
}

.success {
	color: #000000;
	background: #F5FBE1;
	padding: 7px;
	margin-top: 5px;
	margin-bottom: 5px;
	border: 1px dashed #7BA813;
}
.success h2 {
	color: #7BA813;
	background: inherit;
}



#N1 {
position: relative;
top: -170px;
left: 910px;
width:0px; 
height:0px; 
} 
#N2 {
position: relative;
top: -50px;
left: 910px;
width:0px; 
height:0px; 
} 
#E {
position: relative;
top: -80px;
left: 910px;
width:0px; 
height:0px; 
} 
#S {
position: relative;
top: -110px;
left: 910px;
width:0px; 
height:0px; 
} 
#W {
position: relative;
top: -140px;
left: 910px;
width:0px; 
height:0px; 
} 



#N1y {
position: relative;
top: -170px;
left: 870px;
width:0px; 
height:0px; 
} 
#N2y {
position: relative;
top: -50px;
left: 870px;
width:0px; 
height:0px; 
} 
#Ey {
position: relative;
top: -80px;
left: 870px;
width:0px; 
height:0px; 
} 
#Sy {
position: relative;
top: -110px;
left: 870px;
width:0px; 
height:0px; 
} 
#Wy {
position: relative;
top: -140px;
left: 870px;
width:0px; 
height:0px; 
} 


.fg-dial {
            font-size: 200%;
            font-weight: bold;
            left: 0;
            position: relative;
            text-align: center;
            top: -100px;
            width: 200px;
        }
        .fg-dial-label {
            font-size: 120%;
            font-weight: bold;
            left: 15px;
            position: relative;
            text-align: center;
            top: -140px;
            width: 200px;
        }
 
#meterscaleL {
position: relative;
top: -120px;
left: 20px;
width:0px; 
height:0px; 
}      
 
#meterscaleR {
position: relative;
top: -120px;
left: 178px;
width:0px; 
height:0px; 
}          
 
#meterscaleC {
position: relative;
top: -140px;
left: 67px;
width:100px; 
height:0px; 
font-size: 120%;
font-weight: bold;
text-align: center;
}   

#meterTime {
position: relative;
top: -82px;
left: 17px;
            text-align: center;
width:198px; 
height:0px; 
} 

#meterLegend {
            font-size: 110%;
            font-weight: bold;
position: relative;
top: -59px;
left: 18px;
            text-align: center;
width:198px; 
height:0px; 
	background-color: #FFF;
	border: 1px solid #ccc;
	padding-top: 8px;
	padding-bottom: 26px;
	padding-left: 0px;
	padding-right: 0px;
} 


canvas {
    -webkit-box-shadow: 0 0 3px 5px #f5f5f5;
    -moz-box-shadow: 0 0 3px 5px #f5f5f5;
    box-shadow: 0 0 3px 5px #f5f5f5;
    border: 1px solid #ccc;
    display: block;
    margin: 25px auto 0;
	top: -20px;
	background: #FFFFE0 url(images/meterbg.jpg) repeat-x;
}

table.curdat 
{
    width:958px;
	padding-top: 0px;
	padding-bottom: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
}
tr.curdat
{
    height: 200px;
	padding-top: 0px;
	padding-bottom: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
}
td.curdat
{
    height: 200px;
	padding-top: 0px;
	padding-bottom: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
}

#lcd{
  font-family: 'LCD', Fallback, sans-serif;
}

#nograph
{
    background: #f1f8e9;
}
    

TABLE.gauges
  { 
  }
TD.gauges
  { 
      padding: 10px 10px 10px 10px;
     border-style:outset;
    border: 1px solid #ccc;
  }   
  
 
table.bats
{
    align-self:center;
}
tr.bats
{
   
}
th.bats
{
    border-bottom: 1px solid black; 
    border-right: 1px solid black; 
}
th.bats-r
{
    border-bottom: 1px solid black; 
}
td.bats
{
    border-right: 1px solid black; 
}
 /* Popup container */
.popup1 {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

/* The actual popup (appears on top) */
.popup1 .popuptext {
    visibility: hidden;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.popup1 .show {
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s
}


.popup2 {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

/* The actual popup (appears on top) */
.popup2 .popuptext {
    visibility: hidden;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.popup2 .show {
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s
}


.popup3 {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

/* The actual popup (appears on top) */
.popup3 .popuptext {
    visibility: hidden;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.popup3 .show {
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s
}


.popup4 {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

/* The actual popup (appears on top) */
.popup4 .popuptext {
    visibility: hidden;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.popup4 .show {
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s
}
.popup5 {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

/* The actual popup (appears on top) */
.popup5 .popuptext {
    visibility: hidden;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.popup5 .show {
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s
}


.popup6 {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

/* The actual popup (appears on top) */
.popup6 .popuptext {
    visibility: hidden;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.popup6 .show {
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s
}
.popup7 {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

/* The actual popup (appears on top) */
.popup7 .popuptext {
    visibility: hidden;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.popup7 .show {
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s
}

/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
    from {opacity: 0;} 
    to {opacity: 1;}
}

@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity:1 ;}
}

/* Modal Content */
.modal-content {
    background-color: #fefefe;
    margin: auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
}

/* The Close Button */
.close {
    color: #404040;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}
