/* $Id: enf.css,v 1.35 2008/02/04 15:15:01 wendell Exp $
   Copyright (C) enflight.com; All rights reserved. */

/* 00c -> 0e0 */

/* Current Release */
body {  background: #FFF; 
	font-family: san-serif,arial,"Microsoft Sans Serif"; font-size: 12px;
	margin-left:0px; margin-right:0px; margin-top:0px; margin-bottom:5px;
}

.stdBody { border: 2px solid LightGrey; margin:0 auto; padding-bottom: 3px; max-width:1024px }

p { margin-left:6px; margin-right:6px; 
}

.txt { margin-left:6px; margin-right:6px; }

/* Prior Release
body {  background: #FFF; 
	font: normal 12px "Trebuchet MS", Arial, Helvetica, sans-serif;
}
*/

/* The -8px here is correcting for a long-standing problem where there
was whitespace to the left of the leftStack.  On iPad, it didn't seem
to happen quite as much, so this value needs to be reduced */

#leftStack
{
    float: left;
    width: 415px;
    margin-left: -4px;
    /* border-right: 2px solid #888888; */
    /* overflow: auto; */
    overflow: hidden;    /* Because I don't want to re-write doResize() */
}

/* Nick wonders if this is what really sets the size of the LeftStack */
#EnfMapPanel
{
    margin-left: 415px;
}

/* Original

body {
	color: #88888A;
	background: #E3E3E6 url(../images/img01.gif) repeat-x; 
	font-family: sans-serif; font-size: small;
}
*/

tt	{ font-size: medium }
pre	{ font-size: small }
td	{ vertical-align: top }
th	{ vertical-align: top }
dl	{ margin-top: 0; margin-bottom: 4px }
label { cursor:pointer;}

a:link, a:active, a:hover, a:visited	{ color: blue }

.small		{ font-size: x-small } 
td.small	{ font-size: x-small } 
p.small		{ font-size: x-small } 

/* copyright */
.cr	{ text-align: center; font-size: x-small; border: solid black;
	  border-width: thin 0 0 0; margin: 2px 0 0 0; padding: 2px 0 0 0;clear:both; }

/* @media print {
th		{ font-size: 10pt }
tr		{ font-size: 10pt }
td		{ font-size: 10pt }
ol		{ font-size: 10pt }
ul		{ font-size: 10pt }
li		{ font-size: 10pt }
p		{ font-size: 10pt }
dt		{ font-size: 10pt }
dd		{ font-size: 10pt }
h1		{ font-size: 20pt; color: #00c } 
h2		{ font-size: 16pt; color: #00c }

} */

p.status	{ background: #fff none; color: #00f; font-size: medium } 
.error		{ background: #fff none; color: #c00 }
.info		{ background: #fff none; color: #00a; text-align: center }
.center		{ text-align: center }

/* pagetop logo bar (ptlb) see ios.css for overrides */
.ptlb         	{ background-image: url(img/enflogobar.gif) !important; 
		  background-repeat:repeat-x !important; 
		  background-color: #deeeff !important }

.enflogo	{ height:90px; margin:3px }

.ptfnt          { text-align:center; font-size:1.8em; }
.ptsf           { font-size:tiny; }

/*  .m0					{ background: none; font-size: 16px; height:28px; } */
.m0					{ background: none; margin-top:6px; }
a.m0:link,a.m0:active, a.m0:visited	{ background: #00c none; text-decoration:none; }
a.m0:hover				{ background: #00c none; color: White; }
.m0h					{ background: none; color: #ff0; }
a.m0h:link, a.m0h:active, a.m0h:hover, a.m0h:visited { background: #00c; color:#99FFFF;   /*#ff0;*/ }

/* first menu bar */
/*  .m1					{ background: none; color: #dadada; font-size: 16px; height:28px; } */
.m1					{ background: none; color: #dadada; width:device-width; font-size:110%; }
a.m1:link,a.m1:active, a.m1:visited	{ background: #00c none; color: #dadada; text-decoration:none; }
a.m1:hover				{ background: #00c none; color: White; }
.m1h					{ background: none; color: #ff0; }
a.m1h:link, a.m1h:active, a.m1h:hover, a.m1h:visited { background: #00c; color:#99FFFF;   /*#ff0;*/ }

/* second menu bar */
.m2					{ background: #9cf none; color: #3c5492; text-decoration:none; 
					  padding-top: 3px; padding-bottom: 1px; font-size:small; }
a.m2:link, a.m2:active, a.m2:visited	{ background: #9cf none; color: #0054AA; }
a.m2:hover, a.m2h:hover			{ background: #9cf none; color: White; }
a.m2h:link, a.m2h:active, a.m2h:visited { background: #9cf none; color: #555; }
.m2b					{ background: #deeeff none; color: #222;
					  vertical-align: bottom;
					  text-align: right; }

/* third (!) menu bar */
.m3					{ background: #DEEEFF; color: #004; text-decoration:none; font-size:x-small; }
a.m3:link, a.m3:active, a.m3:visited	{ background: #DEEEFF none; font-size:x-small; color: #004; }
a.m3:hover, a.m3h:hover			{ background: #DEEEFF none; font-size:x-small; color: #000070; }
a.m3h:link, a.m3h:active, a.m3h:visited { background: #DEEEFF; font-size:x-small; color: #b00; }

/* third (!) menu bar */
.m3Map					{ color: #004; margin-left:6px; text-decoration:none; font-size:x-small; }
.m3Map UIButton				{ color: #004; margin-left:6px; text-decoration:none; font-size:x-small; }
a.m3Map:link, a.m3Map:active, 
a.m3Map:visited				{ color: #004; margin-left:6px; text-decoration:none; font-size:x-small}
a.m3Map:hover				{ color: Black; margin-left:6px; font-size:x-small}
a.m3Map:link, a.m3Map:active, 
a.m3Map:visited         		{  color: #b00; margin-left:6px; text-decoration:none; font-size:x-small;}

/* highlighted item */
.highlight		{ background: #fff none; color: #ff0; }
a.highlight:link, a.highlight:active, a.highlight:hover, a.highlight:visited
			{ background: #fff none; color: #f70; }

.myLink .mylink:link { text-decoration:none; }

/* obsolete?    -webkit-border-radius: 12px;
   -moz-border-radius: 12px;
*/

.brbr { -moz-background-clip: border;
	-moz-border-radius-bottomright: 20px; 
	overflow: hidden;
}
.brbl { -moz-background-clip: border;
	-moz-border-radius-bottomleft: 20px; 
	overflow: hidden;
}
.brtr { -moz-background-clip: border;
	-moz-border-radius-topright: 20px; 
	overflow: hidden;
}
.brtl { -moz-background-clip: border;
	-moz-border-radius-topleft: 20px; 
	overflow: hidden;
}

/* Safari will not take a 0xFF style number (inside the parens) for the color. */
/* Safari clips to the outside of the border (which can make it seem that */
/* its not clipping at all), but FF clips to the inside (correctly). */
/* By specing a box-shadow all the way around with no spread, you can */
/* get a border that looks the same in both. */
.bigBtnImg {
    cursor:pointer;
    text-decoration:none;
    overflow: hidden;

    /* Border-related */
    -webkit-border-radius: 20px;
    -moz-background-clip: border;
    -moz-border-radius: 20px;
    border-radius: 20px;
    /* Box      inset hoffs voffs blur spread color r g b opa */
    box-shadow: 0px   0px   2px   3px LightGrey;

    margin: 0 0 10px 10px;
    margin-top: 16px;
    margin-left: 16px;
   
    /* Otherwise the image appears to move down and right when you mouseover; the extra space */
    border: 2px solid LightGrey;         /* for the new border starts at the upper left ... */
    background-clip: border-box;
/*    background-color: LightGrey; */
}

.bigBtnTS {
    text-shadow:#aaa 0px 1px 0, #000 0 -1px 0;
   /* text-shadow:#e80 0px 1px 0, #000 0 -1px 0; */
}

.bigBtnImg:hover {
    border: 2px solid DimGrey;
}

.bigBtnImgBlue {
    text-decoration:none;
    overflow: hidden;

    /* Border-related */
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-background-clip: padding;
    -moz-border-radius: 20px;
    /* Box      inset hoffs voffs blur spread color r g b opa */
    box-shadow: 0px   0px   2px   3px LightGrey;
    background-clip: border-box;

/* margin: 12px 0 0 0; */
    margin: 16px; 
    padding:10px;
/*    text-shadow:#e80 0px 1px 0, #000 0 -1px 0; */
    text-shadow:#aaa 0px 1px 0, #000 0 -1px 0;

    /* Otherwise the image appears to move down and right when you mouseover; the extra space */
    border: 2px solid LightGrey;         /* for the new border starts at the upper left ... */
    /*  border-top:1px solid black; border-bottom:1px solid black;  */

    background-color: #2e70cb; background-image:url(img/enfsub1web.gif); background-repeat:repeat-x; color: #fff;
    text-align:center;
    font-style:italic; font-size:x-large; font-weight:lighter; 
}

.bigBtnImgBlue:hover {
    border: 2px solid DimGrey;
}

#ipadhandsimg {

    height: 234px;;
    width: 100%; 
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;

    border: 2px solid transparent;         

    margin: 0 0 10px 10px;
    margin-top: 12px;
    margin-left: 16px;

}

#ipadhandsimg:hover {
    border: 2px solid DimGrey;
}

fieldset {
    border-color: LightGrey;
    padding: 10px;
    margin: 10px 0px 10px 0px;
    border-style: solid;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}

fieldset legend { 
    margin-left: 12px;
    font-size:1.2em; font-weight:bold; 
}

/*
 * a.darkbg	{font-size: 10pt; color: #fff } 
 * a.lightbg	{font-size: 10pt; color: #000 } 
 * a.highlight	{font-size: 10pt; color: #ff0 }
 */

/* .darkbar	{ font-weight: bold; background: #00c none; color: #fff }  */

/* h1	{ background: #ccffff none } */
/* h2	{ color: #c00 } */
/* table	{ border-style: solid; border-color: black } */
/* table	{border-style: solid } */

/* <table> for separator (title) bar: dark blue with bold white text */

#tafSample.nynob { width:'5%'; } /* nobreak='nobreak' } */
#tafSample.nynow { width:'5%'; } /* nowrap='nowrap' } */
#tafSample.nynow2 { } /* nowrap='nowrap' } */

/* Something was overriding the background on 't' class in notam and taf samples. Adding an additional class
   with this was the only way I could find to fix it. */
.tb { background-color: #2e70cb; background-image:url(img/enfsub1web.gif); background-repeat:repeat-x; color: #fff; }

.t   { background-color: #2e70cb; background-image:url(img/enfsub1web.gif); background-repeat:repeat-x; color: #fff;
/*       border-top:1px solid black; border-bottom:1px solid black;  */
       padding:5px; 
       font-weight:bold;font-size:14px; margin: 12px 0 0 0 }

.t a { background:none; border:0; color:white;}

a.t:link, a.t:active, a.t:visited	{ color: #fff; border:0; }
a.t:hover				{ color: #ffc; text-decoration:none; border:0; }

table.t { padding:1px; }

/* <table> for [wn]xpert elements */
.x	{ border-width: 0 0 6px 0; border-color: #fff;
	  background: #fff none; color: #000; vertical-align: top }

/* <tr> tags in [wn]xpert (ok in <td> elsewhere) */
/* anchor with class 'y' in link state */
a.y:link    { background: #bef none; color: #00f } /* nx yes:      BLUE */
a.y:active  { background: #bef none; color: #f00 } /* nx yes:      BLUE */
a.y:visited { background: #bef none; color: #909 } /* nx yes:      BLUE */
.y	{ background: #bef none; color: #000 }	/* nx yes:      BLUE */
.u	{ background: #ffc none; color: #000 }	/* nx unknown:  YELLOW */
.n	{ background: #fff none; color: #999 }	/* nx no:       GRAY or suppress */
.g	{ background: #cfc none; color: #000 }	/* wx good:     GREEN or suppress */
.m	{ background: #ffc none; color: #000 }	/* wx marginal: YELLOW */
.b	{ background: #fcc none; color: #000 }	/* wx below:    RED */

.w	{ background: #fff none; color: #000 }	/*              #fff */

.h	{ background: #eee none; color: #000 }	/* gray bg for taf headers */

/*
p.y, p.u, p.n, p.g, p.m, p.b {
        text-indent: -1em; margin-left: 1em;
        margin-top: 1px; border-top-width: 0; padding-top: 0;
	margin-bottom: 1px; border-bottom-width: 0; padding-bottom: 0 }
 */

/* testimonial */
.tmo { font-size:120% }
.two > h1 { font-weight:bold }
.red { color:#b00 }

/* use in <td> tags */
.v	{ font-family: sans-serif } /*variable*/
.f	{ font-family: monospace;  } /* fixed  */
.s	{ font-family: sans-serif; font-size: x-small }

/* see if we can co-opt the <hN> tags */
/* original: h1   { text-align: center; background: #fff none; color: #00c } */

h1    { text-align: center;  color: #00c;font-size:150%; }
.m2b h1 { color:#222; font-size:150%; }

/* wt put this in to make kneeboard printout take up less real estate on page */


h2	{ text-align: center; background: #fff none; color: #00c }

/* border-top:1px solid black; border-bottom:1px solid black; */
h3, .h3     {
    background-color: #2e70cb; background-image:url(img/enfsub1web.gif); background-repeat:repeat-x; color: #fff;
    padding:5px; font-weight:bold;font-size:14px; margin: 12px 0 0 0;
}

/****
h3      { background: #00c none; color: #fff; font-weight: bold;
	  border-color: black; border-width: 2px; margin-left:0;
	  text-indent: 0; margin-top: 1em; margin-bottom: 0.5em;
	  font-size: small }
*/
h4      { background: #9cf none; color: #000; font-weight: bold;
	  border-color: black; border-width: 2px; margin-left:0;
	  text-indent: 0; margin-top: 1em; margin-bottom: 0.5em;
	  font-size: small }

/* h5 is for illustration label beneath */
/*  may need this for IE to inherit colors. a { color: expression(this.parentNode.currentStyle.color); } */
.nodec, .nodec:link, .nodec:visited { text-decoration:none; color:inherit; }
.nodec:hover, h6:hover,h7:hover,h5:hover { color: DimGrey; }

h5	{ font-size: 16pt; text-align:left; font-weight: normal; font-style: italic; margin: 0.4em 0 0 15px; color: #014CA5}
h7	{ font-size: 14pt; text-align:left; font-weight: normal; font-style: italic; margin: 0.4em 0 0 15px; }
h6	{ font-size: 10pt; text-align:left; font-weight: normal; font-style: italic; margin: 0.4em 0 0 15px;}

/*
h3	{ color: #009; border-bottom: 2px solid #009; font-size: small;
	  text-indent: 0; margin-top: 1em; margin-bottom: 0.25em }
 */



/* yellow (debug) banner */
p.z1	{ background: #ff0 none; color: #000; font-weight: bold; border-color: black; border-width: 2px; margin-left:0; text-indent: 0; margin-top: 1em; margin-bottom: 0.5em }

/* forms-table caption styles: left-bold, (right-)bold*/
.ftlbc	{ font-weight: bold; vertical-align: top; white-space: nowrap }
.ftbc	{ font-weight: bold; vertical-align: top; white-space: nowrap;
	  text-align: right }

/* new login page stuff    ******************************************/

.smallit	{ font-size: x-small; font-style: italic }

/* wt is making a 'did you know' tip box here: */
.tip	{ background: #ccffcc;
          padding: 5px;     }
.tiphdr	{ font-style: italic }
.tipnum	{ float: right }

#loginPage	{ width: 720px;
                }

.blurb	{ width: 100%;
          padding: 0px;
        }
.blurb a:link, .blurb a:active,.blurb a:hover,.blurb a:visited { background: none; color: blue }
.b1		{ width: 100%;		/* was 350px */
                  padding: 3px;
		  color:#222;
                  font-size: 1.7em;	/* was 1.6 */
                  font-weight: bold ;
                  text-align: left;
		  border-bottom:1px solid #DDDDDD;
		 
		  margin-bottom:5px;
                }
.bbold { font-size:1.2em; font-weight:bold; }

.bnotbold a:link, 
.bnotbold a:visited,
.bnotbold a:active { font-size:1.2em; font-weight:normal; color: black; text-decoration: none;}

.b2		{ 
                  padding: 5px 0px 0px 5px;
                  font-size: 1.1em;	/* was 1.3 */
                  font-weight: normal ;
		  margin-bottom:10px;
                }
.b3		{ width: 100%;
                  padding: 0px;
                  font-size: 1.0em;
                  font-weight: normal ;
                }
.b4		{ 
                  padding: 5px 5px 5px 5px;
                  font-size: 1.1em;	/* Was 1.2 */
                  font-weight: normal ;
                }

.b5		{ width: 100%;
                  padding: 5px 5px 5px 5px;
                  font-size: 1.0em;	/* Was 1.3 */
                  font-weight: normal ;
                }

.loginBox	{ width: 220px;
                  padding: 0px;

		  /* Center the loginBox within it's container, which must have position:relative: */
		  left: 0;                  /* set left and right to the same value! */
		  right: 0;
		  margin-left: auto;        /* adding auto-margins left and right will
					       center the element horizontally!*/
		  margin-right: auto;
                }

.about		{ width: 430px;
                  font: normal 18px "Trebuchet MS", Arial, Helvetica, sans-serif;
                  padding: 10px;
                }
.printonly
{
    display:none;
}


/* the quick chart and areabriefing buttons on the home page */
/* http://www.dynamicdrive.com/style/csslibrary/item/3d-css-buttons/ */
/* Took out input from input.quickchart so this would apply outside of forms. */
.quickchart {
  background-color: #c9e3ff;
  /* border: 1px #ff66ff outset; */
  margin-left: 1px;
  margin-top: 4px;
  margin-bottom: 4px;
  /* color: black; */
  text-decoration: none;
  cursor:pointer;
  /* font: bold 14px Verdana; */
 }

.quickchart:visited, .quickchart:hover, .quickchart:active {
  color: blue;
 }

/* The next three are to give nice rounded corners */
input.quickchart {
    background-color: white;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

button.quickchart {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

label.quickchart {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

/* http://www.dynamicdrive.com/dynamicindex5/dhtmltooltip.htm */
#dhtmltooltip{
  position: absolute;
  width: 150px;
  border: 2px solid black;
  padding: 2px;
  background-color: lightyellow;
  visibility: hidden;
  z-index: 100;
  /*Remove below line to remove shadow. Below line should always appear last within this CSS*/
  filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135);
}

.blueFlavor{
    color: rgb(0, 0, 102); 
    font-family: Verdana,Geneva,Arial,Helvetica,sans-serif; 
    font-size: 10pt; 
    margin: 50px;
}

.blueFlavorCtr{
    color: rgb(0, 0, 102); 
    font-family: Verdana,Geneva,Arial,Helvetica,sans-serif; 
    font-size: 10pt; 
    margin: 50px;
padding-right: 10%; 
padding-left: 10%;
}

.blackFlavor{
    color: rgb(0, 0, 0); 
    font-family: san-serif,arial,"Microsoft Sans Serif";
    font-size: 16px; 
    margin: 50px;
}

.blackFlavorCtr{
    color: rgb(0, 0, 0); 
    font-family: san-serif,arial,"Microsoft Sans Serif";
    font-size: 16px; 
    margin: 50px;
padding-right: 10%; 
padding-left: 10%;
}

/* wt is styling the Guest Account, Free Trial, Subscriber table
 * the table colors were (almost) randomly picked from here:
 *   http://www.theodora.com/html_colors.html
 */

table.gafts {
    padding:       2px;
    text-align:    center;
    border-style:  double;
}

/* Column Heading */
th.gaftsch {
    padding:        4px;
    background:     #D5E8FF;   
    text-align:     center;
    vertical-align: middle;
}

/* Row Heading */
td.gaftsrh {
    padding:        4px;
    background:     #D5E8FF;   
    text-align:     left;
    vertical-align: middle;
}

/* Cell */
td.gaftsc {
    padding:        4px;
    background:     #DADADA;
    text-align:     center;
    vertical-align: middle;
}

.pbfBlock p
{
    margin-top:12px;
}

.pbfBlock
{
  text-shadow:#e80 0px 1px 0, #000 0 -1px 0;
  position:absolute;
  font-style:italic;
  text-align:center;
  color:White;
  font-size:2em;
  width:15%;
  height:100%;

/*
  -webkit-border-radius: 20px;
  -moz-background-clip: border;
  -moz-border-radius: 20px;
  border-radius: 20px;
*/
  border: solid 3px #365a8a;
  background-color:#4d7dbc;
}

.pbfArr
{
  top:20%;
  color:#2E70BC;
  font-size:300%;
  position:absolute;
  margin-top:-5px;
  vertical-align:top;
  text-align:center;
  font-size:3em;
  width:10%;
}