/* ************************************************ Embeded fonts ***************************************************************** */
@font-face { font-family: embedBart; font-style:  normal; font-weight: 700; src: url(../fonts/BART.eot) }

/* ******************************************** Positional Stuff *********************************************************** */


/* A fix for Firefox - it's actually more complient with the W3C spec regarding
   borders - it's just that it's not what we want or expect.  Internet Explorer
   by default produces the desired effect, so we copy its behavior.  Specifically,
   if a block element has a border, Firefox will put the border on the outside of
   the element, thereby increasing its height and width. */
* {
    -moz-box-sizing: border-box;
} 

body {
	padding:5px;			/* Remove paddings and margins to extend the DIVs to the edge of the page. */
	margin:0;
	background-color:#c0e3f6;
}

#header{
	position:absolute;			/* Set an absolute position at the top left of the page. */
	top:5px;
	right:5px;
	left:5px;
	height:100px;
	border:2px solid black;
	background-color:#aabbee;
	font-family:Bart, embedBart;
	font-size:18pt;
	font-weight:bold;
	color:#000000;
}

#headerImage{
	position:absolute;
	top:0; left:0; width:100%;
	height:75px;	/* Set this to #header's height - #bookmarkMenuBar's height*/
	
}

#pageTitleHeading { 
	font-family:Bart, embedBart; font-size:18pt; font-weight:bold; color:#000000;
	border-style:2px solid black; border-bottom:none;
}

#factAlertTable{
	position:absolute;
	top:105px;
	left:260px;		/* Set this to the menuCont's width + the width of both margins (10) */
	right:5px;
	height:55;
	width: expression(document.body.clientWidth - (5 + 250 + 5 + 5) + "px");
	border:2px solid black;
	border-top:none;
	border-color:#000000;
	background-color:#dfdfee
}

#mainWindowContainer{
	position:absolute;		/* Set an absolute position */
	top:165px;				/* Set the top = the bottom of the header */
	left:260px;				/* Set this to the menuCont's width + the width of both margins (10) */
	right:5px;
	/* Only IE recognizes the next statement.  Sets the height = the height of the page - the heights of the header and footer.
	   This is because IE does not recognize setting both a top and bottom position.  It will ignore the one you set second. */
	height: expression(document.body.clientHeight - (165 + 5) + "px");
	min-height:465px;
	width: expression(document.body.clientWidth - (5 + 250 + 5 + 5) + "px");
	bottom:5px;	/* IE ignores this.  Set the bottom = the top of the footer. */
	background-color:#b1cfe7;
	border:2px solid black;
}

#mainWindow {
	height:100%; width:100%; 
}

.mainWindow2 { padding-left:15; padding-right:10 }

#bookmarkMenuBar{
	position:absolute;
	height:15px; line-height:15px; width:100%;
	bottom:0px; right:0px;
	background-color:#008899;
	margin:0; padding:0;
}

.bookmark{
	height:15%; line-height:15px; 
	margin:0;
	padding-top:0; padding-right:0; padding-left:5px; padding-right:10px; 
	background-color:#008899;
}


/* ******************************************************** Menu *********************************************************** */
#leftMenuContainer{
	position:absolute;
	top:110px; left:5px; width:250px; bottom:5px;  /* left = margin between the tabs and the browser window + the width of the tab */
	height: expression(document.body.clientHeight - (110 + 5) + "px");
	min-height:514px;
	background-color:#c0e3f6;
}
#menuCont{
	height:100%;
	background-color:#c0e3f6;
	border:2px solid black; border-left:none;
	overflow:auto;
	padding-left:4px;
}


/* ********************************************************* Menu Tabs ******************************************************* */

#tabBar {
	float:left;
	height:100%;
	width:26;
	background:#c0e3f6 url("labels/tabBackground.jpg");  /* Make sure the width of the background = the width of this element */
	line-height:normal;
	font-family:Courier New; font-size:8pt; font-weight:bold;
}
* html #tabBar {margin-right:-3px}	/* To fix IE's 3 pixel jog on floated elements */
#tabBar ul {
	margin:0;
	padding-left:0; padding-bottom: 0; padding-right:0; padding-top:0px;
	list-style:none;
}
#tabBar li {
	float:left;
	margin:0;
	width:24px;		/* Set this to #tabBar's width - 2 */
	padding-top:0px; padding-bottom:6px;
	background:url("labels/bottom.gif") no-repeat left bottom;
}
* html #tabBar li{margin-right:-3px}	/* To fix IE's 3 pixel jog on floated elements */

#tabBar a {
	display:block;
	background:url("labels/top.gif") no-repeat left top;
	padding-left:px; padding-bottom:5px; padding-right:5px; padding-top:10px;
	text-decoration:none;
}
#tabBar .selectedTab {
    background-image:url("labels/bottom_on.gif");
	width:26px;		/* Set this to the width of #tabBar */
}
#tabBar .selectedTab a {
	background-image:url("labels/top_on.gif");
	padding-right:5px
}

/* ********************************************************* Link stuff ******************************************************* */
.lmLinkUL{
	margin:0;
	padding-left:0; padding-bottom:0; padding-right:0; padding-top:0;
	list-style:none;
}

.lmLinkLI {
	border:solid 1px #9dd5f3; margin-top:0px; margin-bottom:2px; filter:glow(color=0000FF,strength=3);
}
	
a.lmLink:link,a.lmLink:visited {

	background-color:#9dd5f3; padding:0px; margin:0px; display:block;
	font-family:Verdana; font-size:8pt; line-height:8pt; text-decoration:none; color:#0033FF
}
a.lmLink:hover { background-color:#a3f9db; color:#000000 }

/* ********************************************************* Style stuff ******************************************************* */


.factOfTheDayHeading { font-family:Tahoma; font-size:8pt; padding-left:10; border:none; background-color:#dfdfee }
.wildlifeAlertHeadingStandby { font-family:Tahoma; font-size:8pt; padding-left:10; border:none; background-color:#dfdfee }
.wildlifeAlertHeading { font-family:Verdana; font-size:8pt; font-weight:bold; color:#ff0000; padding-left:10; border:none; background-color:#dfdfee }
.factOfTheDay { font-family:Arial; font-size:8pt; border:none; border-style:inset; border-width:2px; background-color:#dfdfee }
.wildlifeAlert { font-family:Arial; font-size:8pt; border:none; border-style:inset; border-width:2px; background-color:#dfdfee }

a.titleBarMenuItem:link, a.titleBarMenuItem:visited { 
	font-family:Arial;
	font-weight:bold;
	font-size:8pt;
	text-decoration:none;
	color:#00ffff
}
a.titleBarMenuItem:hover {
	font-family:Arial;
	font-weight:bold;
	font-size:8pt;
	text-decoration:none;
	color:#000000
}
.inactiveTitleBarMenuItem { font-family:Arial; font-weight:bold; font-size:8pt; color:#a0a0a0; padding:0; margin:0 }

.mainContentTitle { font-family:Georgia, Times New Roman; font-weight:bold; font-size:14pt; color:#000000 }

/* Menu */
.menuSubHeading { font-family:Verdana; font-weight:600; font-size:8pt; text-decoration:underline; color:#000000; padding-bottom:2px }
.linkTable { font-family:Arial; font-size:8pt; text-decoration:none }
.menuActive { padding-left:30px; padding-right:10px; padding-top:10px; padding-bottom:10px }
.menuInactive { padding-left:30px; padding-right:10px; padding-top:10px; padding-bottom:10px; display:none }
.linkTitleFrame { 
	font-family:Arial; font-weight:bold; font-size:10pt;
	border-style:solid; border-color:#000000; border-width:1px; border-right:none; border-left:none
}



H1 { font-family: Signet Roundhand; font-size: 25pt; color: #000000 }
P { font-family: Comic Sans MS; font-size: 11pt; text-align:justify; text-indent:25; color:#000000 }
P.news { font-family:Times New Roman; font-size: 11pt; text-align:justify; text-indent:25; color:#000000 }
P.newsHeadline { font-family:Times New Roman; font-size: 11pt; font-weight:bold; text-align:justify; text-indent:25; color:#000000 }
.paraHead { font-family:Times New Roman; font-weight:bold; font-size: 11pt; color:#000000 }