/* defaultLayout2FINAL2REVERSE.css */

/* RESET STYLESHEET:
 *      Replaces the one above  */
 /* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
} /* /end reset stylesheets */

body {
    text-align: left;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%;  /* 1em  or 16px */
    color: #000;
    font-style: normal;
    line-height: normal;
    margin-left: auto;
    margin-right: auto;
	margin-bottom: 0;
    background-image: -webkit-linear-gradient(to right, #FFFFFF, #FAF700 15%, #FAF700 85%, #FFFFFF);
    background-image: -ms-linear-gradient(to right, #FFFFFF, #FAF700 15%, #FAF700 85%, #FFFFFF);
    background-image: -o-linear-gradient(to right, #FFFFFF, #FAF700 15%, #FAF700 85%, #FFFFFF);
    filter: progid:DXImageTransform.Microsoft.gradient
            (startColorstr=#FFFFFF, endColorstr=#FAF700);
    background-image: linear-gradient(to right, #FFFFFF, #FAF700 15%, #FAF700 85%, #FFFFFF);
}

/* GENERAL ELEMENTS - USED AND UNUSED */
h1, h2, h3 {
}

h1 {
}

h2 {
	font-size: 1em;
}

h3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%; /* 1em */
	color: #000;
	font-weight: bold;
	padding: .5em;

}

p, blockquote, ul, ol {
	margin-bottom: 1.25em;  /* 20px */
	line-height: normal;
}

blockquote {
}

ul, ol, li {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

a {
	font-weight: bold;
	text-decoration: underline;
	color: #b00404;
}

a:hover {
	text-decoration: none;
	color: #00B;
}

img {
	max-width: 100%;
	height: auto;
}
/***************************************/

/* contains gradient for top of page */
body .bgtop {
        text-align: center;
        margin: 0 auto;
        padding-top: 0;
        height: auto;
        background-image: -webkit-linear-gradient(#FFFFFF, #FAF700);
        background-image: -ms-linear-gradient(#FFFFFF, #FAF700);
        background-image: -o-linear-gradient(#FFFFFF, #FAF700);
        filter: progid:DXImageTransform.Microsoft.gradient
            (startColorstr=#FFFFFF, endColorstr=#FAF700);
        background-image: linear-gradient(#FFFFFF, #FAF700);
}

.topBox {
	margin: 0 auto;
	width: 100%;
	max-width: 960px;
	/*border: 1px solid #000;*/
	height: auto;
	padding-top: 2.8125em;
	padding-bottom: .25em;
	background: none;
}

.skipbox2 {
	float: left;
	margin-left: 0;
	height: 1.5em;
	width: 16em;
	display: block;
	text-align: left;
	margin-left: 1.5%;
	
}

.skipbox2 a {
	color: #003300;
    text-decoration: none;
    font-size: 1em;
}

/* Skipbox */
.skipbox {
    display: block;
    height: 1.5em;
    width: 32.92181070%;  /*  320px / 960px */
    width: 16em; 
    border-right: none;
    margin-bottom: 0;
    margin-left: 4.5em;  /* 72px / 16px   option2 */
    margin-left: 7.5%;  /* 960px * 0.075 == 72px */
    margin-right: auto;
    /* IMPORTANT:  To increase size of page-top, simply increase this value.
     * 	The padding-top value controls the page-top size.  The original size was
     * 		90px or 5.625em. */
    padding-top: 2.8125em;  /*45px / 16px */
}

.skipbox a {
    color: #003300;
    text-decoration: none;
    font-size: 1em;
}

/* nav **********************************************/
nav {
    width: 75%; /* 960px / 1280px */
    max-width: 960px;
    height: auto;
    max-height: 4em;   /*68px / 16px */
    margin: 0 auto;
    background-color: #4B4A48;
    background-image: -webkit-linear-gradient(#4B4A48, #242322);
    background-image: -ms-linear-gradient(#4B4A48, #242322);
    background-image: -o-linear-gradient(#4B4A48, #242322);
    filter: progid:DXImageTransform.Microsoft.gradient
            (startColorstr=#4B4A48, endColorstr=#242322);
    background-image: linear-gradient(#4B4A48, #242322);
	
}
nav:after {
    content: '';
    display: inline-block;
    width: 100%;
}
nav ul {
	width: 100%;
	max-width: 960px;
    list-style-type: none;
    margin: 0;
    padding: 0;
    line-height: normal;
    display: inline;
    height: 4em;
    max-height: 4em;
}

nav li {
	float: left;
	width: 11.2%;
    text-align: justified;
    margin: 0 .0875em 0 .0625em;
    height: 100%;
    height: 2.65em;
    height: 4em;
    vertical-align: text-top;
    display: inline;
    
}

nav .wider {
	width: 15%;
}
nav a {
    display: block;
    height: 100%;
    height: 2em;
    min-height: 2em;
    max-height: 3.25em;
   /* max-height:3em;*/
    vertical-align: text-top;
    margin-right: 0;  /*  2px / 16px  */
    margin-bottom: 0;
    text-decoration: none;
    text-align: justified;
    text-transform: uppercase;
    font-size: 65%;
    font-weight: 700;
    color: #FFF;
    font-style: normal;
    line-height: normal;
    /* change padding-left & padding-right to add
             more items to nav.*/
    padding: 1.339285em .0625em 0.6696425em .0625em;   /*  15px / 11.2px */
    padding: 1.75em .0625em;
}

nav a:focus {
        border: 2px dashed #FFFFFF;  /*   */
}
nav a:hover {
        text-decoration: underline;
        background: #000000;
        color: #FFFFFF;
}

nav a:active {
    background: #000000;
    color: #FFFFFF;
} 

nav #active {
	background: #000000;
}

/************************************************************************************************/



/* header ********************************************************************************************/

header {
	height: auto;
    /*max-height: 15.875em;*/
    margin: 0 auto;
    text-decoration: none;
    background-color: #000000;
    font-size: 100%;
}

header img {
	width: 100%;
	height: auto;
	margin: 0 auto;
	display: block;
}



/* Wrapper */
#wrapper {
    margin: 0 auto;
    margin-bottom: 0;
    padding-top: .3125em;  /* 5px / 16px  */
    background-color: #FFFFFF;
    width: 75%;  /*  960px / 1280px */
    max-width: 960px;
}

/* zoomInfo */
#zoomInfo {
    font-size: 1em;  /*  16px */
    height: 1.75em;   /*  32px */
    line-height: 1.75em;
    color: #003300;
    font-weight: bold;
    padding-bottom: .3125em;  /* 5px / 16px  */
    margin-left: 1.25%;
    margin-right: auto;
    margin-top: 0;
    margin-bottom: 0;
    background-color: #FFFFFF;
}

#zoomInfo img {
    padding-left: 0.20576132%;  /*  2px / 972px */
    margin-left: 0;
    margin-top: 0;
    margin-bottom:0;
    margin-right: 0.20576132%;  /*  2px / 972px */
    vertical-align: middle;
}

#zoomInfo a {
    font-size: 1em;  /*  16px */
    color: #003300;
    vertical-align: middle;
    font-weight: bold;
    padding-right: 0.20576132%;  /*  2px / 972px */
    /* padding-right: .125em; */  /* 2px / 16px = .125 */
    margin-bottom: 0;
}

/* Container */
/* container class is simply a positioned container that holds
 * 	the side menu and main content elements - it is used to allow
 * 	the side menu color to extend the length of the page 
 *      .container holds background gradient for sidebar. */
#container {
	/*position: relative;*/
	width: 100%;  /* 960px / 960px */
	margin-right: auto;
	margin-left: auto;
    margin-bottom:0;
    background: #FFFFFF;
    padding-left: 0.9375em;  /* 15px / 16px */
    padding-right: 0.9375em;  /* 15px / 16px */
    font-size: 100%;
}

/************************************************************************/
/************************************************************************/
/* section - former .post class */
section {
	margin: 0 0 1.25em 0;   /*   */
	border-bottom: 1px solid #CCCCCC;  /*   */
}

section .currDate {
	padding-top: 0.416666667em;   /* 10px / 24px */
	padding-left: 1.76366843%;  /* 4px / 680.4px  */
	padding-bottom: 0.416666667em;  /* 10px / 24px */
	padding-right: 9.55320400%;  /*  65px / 680.4px */
	background: #FFFFFF;
	text-decoration: none;
	font-size: .5em;  /*  24px */
	font-weight: bold;
	color: #990000;
}
section .title {
	padding-top: 0.416666667em;   /* 10px / 24px */
	padding-left: 1.76366843%;  /* 4px / 680.4px  */
	padding-bottom: 0.416666667em;  /* 10px / 24px */
	padding-right: 9.55320400%;  /*  65px / 680.4px */
	background: #000000;
	text-decoration: none;
	font-size: 1.5em;  /*  24px */
	font-weight: bold;
	color: #FFFFFF;
}

section .title a {
	color: #FFFFFF;
	text-decoration: none;
}

section .title a:focus {
        outline: 2px dashed #FFFFFF;  /*   */
}

section .title a:hover {
	text-decoration: underline;
}

section .centerTitle {
	padding: 0.416666667em 0;   /* 10px / 24px */
	margin: 0.520833% 1.041666%;  /* 5px/960px and 10px/960px */
	text-align: center;
	background: #000000;
	text-decoration: none;
	font-size: 1.5em;  /*  24px */
	font-weight: bold;
	color: #FFFFFF;
}

section .centerTitle a {
	color: #FFFFFF;
	text-decoration: none;
}

section .centerTitle a:focus {
        outline: 2px dashed #FFFFFF;  /*   */
}

section .centerTitle a:hover {
	text-decoration: underline;
}

section h3{
	padding-top: 0.3125em;   /* 5px / 16px */
	padding-left: 1.48809523%;  /* 10px / 672px  */
	padding-bottom: 0.3125em;   /* 5px / 16px */
	padding-right: 9.55320400%;  /*  65px / 680.4px */
	background: #000000;
	text-decoration: none;
	font-size: 100%;  /*  16px */
	font-weight: bold;
	color: #FFFFFF;
}

section .entry {
	padding-top: 1em;
	padding-bottom: 1em;
	padding-left: 2.93944738%;  /*  20px / 680.4px*/
	padding-right: 2.93944738%;  /*  20px / 680.4px*/
}

section .entryTaller {
	padding-top: .25em;
	padding-bottom: .25em;
	padding-left: 2%; /*  13.4px / 672px */
	padding-right: 2%; /*  13.4px / 672px */
}

section .entryWider {
	padding-top: .25em;
	padding-bottom: .25em;
	padding-left: 1.48809523%; /* 10px / 672px */
	padding-right: 1.48809523%; /* 10px / 672px */
}
section #bground {
	background-color: #FFFFEA;
	padding-bottom: .1em;
	margin-top: .5em;
	margin-bottom: .75em;
}

section hr {
	width: 75%;
}
/* THE FOLLOWING CLASSES CONFIGURE TEXT:
 * 	1. bold text - .boldText
 * 		(when using font-weight: 100 thru 900, the <em></em> and
 * 			<b></b> tags do not work.  USE this class).
 * 	2. bold AND underlined text - .boldULText
 * 		(see explanation above). 
 * 	3. centered text - .centerText
 * 	4. bold, centered text - .emphCenterText
 * 	5. large, bold, centered text - .emphCenterTextLarge
 * 	6. bold, green, centered text - .emphCenterGreen
 * 	7. large, bold, green, centered text - .emphCenterGreenLarge
 *   */
  .boldText {
	font-weight: 600;
	display: inline;
 }
 
 .ulText {
	text-decoration: underline;
	display: inline;
 }
 .boldULText {
	font-weight: 600;
	text-decoration: underline;
	display: inline;
 }
 
  .boldItalicText {
	font-weight: 600;
	font-style: italic; 
	display: inline;
 }
 
 .green {
	color: #004400;
	font-weight: 500;
 }
 
 .centerText {
	font-size: 100%;
	text-align: center;
 }
 
 .centerGreen {
	font-weight: 500;
	text-align: center;
	color: #003300;
 }
 .emphCenterText  {
	font-family: "Times New Roman", serif;
    font-size: 1.2em;  /*   */
    font-weight: 700;
    text-align: center;
 }
 
  .emphCenterTextLarge  {
	font-family: "Times New Roman", serif;
    font-size: 1.4em;  /*   */
    font-weight: 700;
    text-align: center;
 }
 
 .emphCenterGreen {
	font-family: "Times New Roman", serif;
    font-size: 1.2em;  /*   */
    font-weight: 700;
    text-align: center;
    color: #004400;
 }
 
 .emphCenterGreenLarge {
	font-family: "Times New Roman", serif;
    font-size: 1.4em;  /*   */
    font-weight: 700;
    text-align: center;
    color: #003300;
 }
 
 .emphCenterGreen a {
	font-weight: 700;
	text-decoration: underline;
	color: #003300;
 }
 
 .emphCenterGreenLarge a {
	font-weight: 700;
	text-decoration: underline;
	color: #003300;
 }
 
 .emphCenterText a {
	font-weight: 700;
	text-decoration: underline;
	color: #b00404; 
 }
 
 .emphCenterTextLarge a {
	font-weight: 700;
	text-decoration: underline;
	color: #b00404; 
 }
 
 .emphText {
	font-family: "Times New Roman", serif;
    font-size: 1.2em;  /*   */
    font-weight: 700;
    text-align: left;
 }
 
 .emphTextBlock {
	font-size: 1em;
	font-weight: 600;
	text-align: left;
	display: block;
}
 
 .emphTextLarge {
	font-family: "Times New Roman", serif;
    font-size: 1.4em;  /*   */
    font-weight: 700;
    text-align: left;
 }
 
 .emphGreen {
	font-family: "Times New Roman", serif;
    font-size: 1.2em;  /*   */
    font-weight: 700;
    text-align: left;
    color: #004400;
 }
 
 .emphGreenLarge {
	font-family: "Times New Roman", serif;
    font-size: 1.4em;  /*   */
    font-weight: 700;
    text-align: left;
    color: #003300;
 }
 
 .emphGreen a {
	font-weight: 700;
	text-decoration: underline;
	color: #004400;
 }
 
 .emphGreenLarge a {
	font-weight: 700;
	text-decoration: underline;
	color: #004400;
 }
 
 .emphText a {
	font-weight: 700;
	text-decoration: underline;
	color: #b00404; 
 }
 
 .emphTextLarge a {
	font-weight: 700;
	text-decoration: underline;
	color: #b00404; 
 }
 /**********************************************************************************************************/

 /* PARAGRAPH - pad right side approximately .5em ******************************************/
 .paragraphPad {
	padding-right: 1.190476%;
 }
 
 .hangingIndent {
	padding-left: 5em;
 }
 
 .smHangingIndent {
	padding-left: 1em;
  }
/* Solo Images outside Posts */
/* soloImage classes align images that are not
 *   contained in a .post class. */
.soloImageRight {
    float: right;
	margin-top: 1em;  /*   */
	margin-right: .5em;  /*   */
	margin-bottom: 1em;  /*   */
	margin-left: 1em;  /*   */
	border: 0;
}

.soloImageLeft {
    float: left;
	margin-top: 1em;  /*   */
	margin-right: 1em;  /*   */
	margin-bottom: 1em;  /*   */
	margin-left: .5em;  /*   */
	border: 0;
}

.soloImageCenter {
    border: 0;
    margin-left: auto;
    margin-right: auto;
    max-width:40%;
    height: auto;
}
/*******************************ITEMS FOR MNCilListing Page ************************************************/
.cilMapAndLegendContainer {
	/*display: none; */
	width: 100%;
	margin: 0 auto;
}

.cilMapAndLegendContainerMobile {
	
	width: 100%;
	margin: 0 auto;
}
.cilMapAndLegendContainerMobile320 {
	width: 100%;
	margin: 0 auto;
}
.cilMapImageContainer {
	float: left;
	border: 0;
	width: 55%;
	height: auto;
	min-height: 34.0625em;
	margin-left: .125em;
	margin-top: .125em;
}

.cilMapImageContainerMobile {
	float: left;
	border: 0;
	width: 56.25%;
	max-width: 270px;
	border: 0;
	height: auto;
	margin: .125em;
}
.cilMapImageContainerMobile320 {
	margin: .5em auto;
	border: none;
	width: 100%;
	max-width: 239px;
	height: auto
}
/* CIL MAP LEGEND *******************************************/
#legend {
	/*display: none; */
	float: right;
	margin-right: 3.125%;  /* 30px / 960px */
	margin-top: 15%;
	width: 36.45833%;    /*  350px / 960px  */
	height: auto;
	border: 3px #CCCCCC solid;
	
}

#legend .Lname {
	width: 100%;
	margin-top: 0;  /*  5px / 16px  */
	padding-top: .5em;
	margin-bottom: 1.25em;  /* 10px / 16px  */
	text-align: center;
	font-size: 1.25em;  /*   */
	font-weight: 800;
}
#legend table {
	width: 100%;  /*  350px / 350px */
	border: none;
}

#legend tr {
	border: none;
}

#legend .imageCell {
	width: 20%;
	height: auto;
	margin-right: 0;
	padding-bottom: 1.428571%;  /* 5px / 350px  */
	padding-top: 1.428571%;   /* 5px / 350px  */
	
}
#legend td {
	border: none;
	vertical-align: middle;
	text-align: left;
	padding-left:.5em;  /*   */
}
#legend a {
	font-size: 1em;  /*   */
	/*text-decoration: none;
	color: #000000; */
}

#legend img {
	width: 17.142857142%;  /*  60px / 350px */
	width: 100%;
	height: auto;
	padding: 0.57142857%;  /*  2px / 350px */
	padding: 0;
	margin-right: 0;
	
}
/*  #legendMobile changes floats and the image used
 * 	for the image map to a smaller version.  It will not display 
 * 	until the correct media queries invoke it. */
#legendMobile {
	float: right;
	margin-right: 3.125%;  /* 30px / 960px */
	width: 36.45833%;    /*  350px / 960px  */
	height: auto;
	border: 3px #CCCCCC solid; 
}

#legendMobile .LnameMobile {
	width: 100%;
	margin-top: 0;  
	padding-top: .5em;
	margin-bottom: 1.25em;  /* 10px / 16px  */
	text-align: center;
	font-size: 1.1em;  /*   */
	font-weight: 800;
}

#legendMobile .tableMobile {
	width: 100%;  /*  350px / 350px */
	border: none;
}

#legendMobile .trMobile {
	border: none;
}

#legendMobile .imageCellMobile {
	width: 20%;
	height: auto;
	margin-right: 0;
	padding: 1.428571%;
	padding-bottom: 1.428571%;  /* 5px / 350px  */
	padding-top: 1.428571%;   /* 5px / 350px  */
}

#legendMobile .tdMobile {
	border: none;
	vertical-align: middle;
	text-align: left;
	padding-left:.5em;  /*   */
}

#legendMobile .imgMobile {
	width: 17.142857142%;  /*  60px / 350px */
	width: 100%;
	height: auto;
	padding: 0.57142857%;  /*  2px / 350px */
	padding: 0;
	margin-right: 0;
}

#legendMobile .aMobile {
	font-size: 1.1em;  /*   */
}
/*************************** END ITEMS FOR MNCilListing Page ************************************************/

/******************************ITEMS FOR NEWSLETTERS PAGE**************************************************************/
.twoColumnContainer {
	width: 100%;
	margin: .5em 0;
	border: none;
}

.leftColumn {
	width: 48%;
	margin: 0 1% 0 0;
	float: left;
	border: none;
}

.rightColumn {
	width: 48%;
	margin: 0 0 0 1%;
	float: right;
	border: none;
}



.featureBox {
	width: 70%;
	margin: 1em 15% 1em 11%;
	padding: 1.1em;
	height: auto;
	border: #002200 10px ridge;
	background-image: url("newsletters/newslettersImages/newsletterFeature600x209.png");
	/*background-color: #FDFDE4;*/
}

.featureArea {
	float: left;
	margin-top: .25em;
	margin-left: .25em;
	margin-bottom: .25em;
	width: 65%;
	height: auto;
    max-width: 480px;
    background-color: #dddddd;
    background-image: url("../newsletters/newslettersImages/newsletterFeature312x109.png");
    background-position: cover;
    background-size: 100% 100%;
    margin: 0 auto;
}

.featureArea p{
	text-align: center;
	padding-top: 7.5%;
	padding-bottom: 5%;
}

.featureArea a {
	text-align: center;
	font-size: 1.6em;
	font-weight: 700;
	color: #004400;
}
.subfeature {
	text-align: center;
	float: right;
	margin-top: .125em;
	margin-right: .125em;
	margin-bottom: .125em;
	padding-top: 1.6em;
	padding-bottom: 1.6em;
	background-color: #dddddd;
	background-image: url("../newsletters/newslettersImages/newsletterBGI240x136Opacity38.jpg");
    background-size: 100% 100%;
    background-position: cover;
	width: 33%;
	height: auto;
}

.subfeature a {
	font-size: 1.6em;
	color: #004400;
	font-family: "Times New Roman";
}
/*****************************END NEWSLETTERS PAGE*****************************************************/

/******************************ITEMS FOR LINKS PAGES*****************************************************/

.linkListBoldDisc {
	margin-left: 4.85%; /* 30px / 620px*/
	margin-left: 25%;
	display: block;
}

.linkListBoldDisc ul {
	list-style-type: disc;
	margin-top: 1.2em;
	margin-bottom: 1.2em;
}

.linkListBoldDisc ul li {
	list-style-type: disc;
	margin-top: 1em;
	margin-bottom: 1em;
	margin-left: 2em;
}

.linkListBoldDisc ul li a {
	font-family: "Times Roman", serif;
	font-weight: 600;
	font-size: 1.2em;
	color: #003300;
	text-decoration: underline;
}

.linkListBoldDisc ul li p{
	font-weight: 400;
	font-size: 1em;
	color: #000000;
	padding-left: .5em;
	margin-top: .5em;
}

.linkListBoldDisc ul li p a {
	font-weight: 600;
	font-size: 1.05em;
	color: #b00404;
	text-decoration: underline;
}


.linkBoxContainer {
	margin: 0;
	padding: 0;
	width: 100%;
	height: auto;
	
}

.linkBoxLead4 {
	width: 20%;
	background-image: -webkit-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    background-image: -ms-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    background-image: -o-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    filter: progid:DXImageTransform.Microsoft.gradient
            (startColorstr=#C6C6C6, endColorstr=#FFFFFF);
    background-image: linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    display: inline-block;
    margin: .5em 0.520833% .5em 7%;  /* 5px / 960px*/
    padding-right: .25em;
    padding-left: .25em;
    float: left;
    min-height: 14em;
   
}

.linkBoxLead3 {
	width: 20%;
	background-image: -webkit-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    background-image: -ms-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    background-image: -o-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    filter: progid:DXImageTransform.Microsoft.gradient
            (startColorstr=#C6C6C6, endColorstr=#FFFFFF);
    background-image: linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    display: inline-block;
    margin: .5em 0.520833% .5em 17%;  /* 5px / 960px*/
    padding-right: .25em;
    padding-left: .25em;
    float: left;
    min-height: 14em;
   
}

.linkBoxLead2 {
	width: 20%;
	background-image: -webkit-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    background-image: -ms-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    background-image: -o-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    filter: progid:DXImageTransform.Microsoft.gradient
            (startColorstr=#C6C6C6, endColorstr=#FFFFFF);
    background-image: linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    display: inline-block;
    margin: .5em 0.520833% .5em 28%;  /* 5px / 960px*/
    padding-right: .25em;
    padding-left: .25em;
    float: left;
    min-height: 14em;
    
}

.linkBoxLead1 {
	width: 20%;
	background-image: -webkit-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    background-image: -ms-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    background-image: -o-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    filter: progid:DXImageTransform.Microsoft.gradient
            (startColorstr=#C6C6C6, endColorstr=#FFFFFF);
    background-image: linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    display: inline-block;
    margin: .5em 0.520833% .5em 40%;  /* 5px / 960px*/
    padding-right: .25em;
    padding-left: .25em;
    float: left;
    min-height: 14em;
   
}

.linkBoxFollow {
	width: 20%;
	background-image: -webkit-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    background-image: -ms-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    background-image: -o-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    filter: progid:DXImageTransform.Microsoft.gradient
            (startColorstr=#C6C6C6, endColorstr=#FFFFFF);
    background-image: linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    display: inline-block;
    padding-left: .25em;
    padding-right: .25em;
    margin: .5em 0.520833%; /* 5px / 960px*/
    float: left;
    min-height: 14em;
    
}

/*  Duplicate of 2 preceding classes.
 * 	Used to ID the last linkBox when there
 * 		is an odd number of boxes.
 */
.linkBoxExtra {
	width: 20%;
	background-image: -webkit-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    background-image: -ms-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    background-image: -o-linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    filter: progid:DXImageTransform.Microsoft.gradient
            (startColorstr=#C6C6C6, endColorstr=#FFFFFF);
    background-image: linear-gradient(to bottom, #C6C6C6,  #FFFFFF);
    display: inline-block;
    padding-left: .25em;
    padding-right: .25em;
    margin: .5em 0.520833%; /* 5px / 960px*/
    float: left;
    min-height: 14em;
    
}

.noLinkName {
	font-size: 120%;
	text-align: center;
	color: #003300;
	margin-top:1em;
	margin-bottom:1em;
	font-weight: 600;
	display: block;
}

.linkName {
	font-size: 120%;
	text-align: center;
	color: #b00404;
	margin-top:1em;
	margin-bottom:1em;
	font-weight: 600;
	text-decoration: underline;
	display: block;
}

a:hover {
	color: #003300;
	text-decoration: none;
}

.byline1 {
	font-size: 80%;
	font-style: italic;
	color: #000000;
	text-align:center;
	font-weight:  500;
	font-family: Verdana,sans-serif;
	display: block;
	margin-top: .625em;
}

.byline2 {
	font-size: 70%;
	font-style: italic;
	color: #004400;
	text-align:center;
	font-family: Verdana, sans-serif;
	font-weight: 500;
	margin-bottom: .5em;
	display: block;
	margin-top: .5em;
}

.clearFloat {
	clear: both;
	line-height: .001%;
}

/*	This class will be used when using media queries.
 * 	The class above will NOT clear so that ALL links will be
 * 		displayed inline-block.  This class WILL clear at the end of each 
 * 		<section>.
 */
.clearFloatFinal {
	clear: both;
	line-height: .001%;
}
 .disclaimer {
	text-align: center;
	font-style: italic;
	font-weight: 600;
	color:#003300;
	margin-top: 1em;
	padding-bottom: 1em;
 }
/**************************END ITEMS FOR LINKS PAGES*****************************************************/
a:focus {
	outline: 2px dashed #004400;  /*   */
}

/* Footer */

footer {
	clear: both;
	text-align: center;
	margin: -1.4em auto 0 auto;
	padding: 1.25em 0; 
	background: #000000;
	color: #FFFFFF;
}

footer .links ul {
	text-align: center;
	margin-right: 1em;
	margin-left: 1em;
	display: inline-block;
}

footer .links  li{
	display: inline;
}

footer .links .pageLink {
	font-weight: 600;
	font-size: 70%;
	color: #FFFFFF;
	text-decoration: none;
	margin: 0 .25em;
}

footer .links .activeF {
	font-weight: 600;
	font-size: 70%;
	color: #A1A1A1;
	text-decoration: underline;
	margin: 0 .25em;
}

footer .links a:hover {
	color: #FFFFFF;
	text-decoration: underline;
}	

footer p {
	margin: 0;
	text-align: center;
	font-size: 77%;
}

footer a {
	text-decoration: underline;
	color: #A1A1A1;
}

footer a:focus {
	outline: 2px dashed #FFFFFF;  /*   */
}

footer a:hover {
	text-decoration: none;
}

footer a:visited {
    color: #C3C3C3;
    }

.subfooter {
	width: 100%;
	margin: 0 auto;
	height: auto;
	min-height: 10em;
	background-color: #FFFFFF;
	display: none;
}
/******************* IMAGE CLASSES FOR <figure> ELEMENT **************************************/
section  img {
    max-width: 100%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}
.imgRight {
	float: right;
	margin-top: 1em;  /*   */
	margin-right: .5em;  /*   */
	margin-left: 1em;   /*   */
	margin-bottom: 1em;  /*   */
	border: none;
}

.imgLeft {
	float: left;
	margin-top: 1em;  /*   */
	margin-right: 1em;  /*   */
	margin-left: .5em;   /*   */
	margin-bottom: 1em;  /*   */
	border: none;
}


/* TWO IDs NOT USED:
 *   #header
 *   #page
 ****************************/
/* Header */

#header {
	width: 880px;
	height: 107px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}

/* Page */

#page {
	width: 972px;
	margin: 0 auto;
	padding-top: 2px;
}

/* IMAGE and IMAGE CONTAINER CLASSES  ******************/
.specsIcon {
	width: 6.6666667%;  /* 64px / 960px */
	height: auto;
}
/***************************************************************MEDIA QUERIES**********************************************************************************************/
/*************************WIDE screens - page size limited to 960px *************************************/
 /*  WIDE screens - page size limited to 960px */
  @media screen and (min-width: 961px)  {
	header .aNorthLogo {
		display: block;
		width: 75%;
		max-width: 960px;
		height: auto;
	}
	
	header .mobileLogo320 {
		display: none;
	}
	
	.skipbox {
		margin-left: 7.5%;
	}
	
 }
@media screen and (min-width: 1049px) {
	body {
		font-size: 100%;
	}
	
	header {
		font-size: 100%;
	}
	
	header .aNorthLogo {
		width: 75%;
		max-width: 960px;
		height: auto;
		display: block;
	}
	
	header .mobileLogo320 {
		display: none;
	}
	
	.topBox {
		width: 75%;
		max-width: 960px;
	}
	
	nav {
		width: 75%;
		max-width: 960px;
	}
	
	nav a {
		font-size: 70%;
	}
	
	#wrapper {
		width: 75%;
		max-width: 960px;
	}
	
	.cilMapAndLegendContainer {
		display: block;
	}
	
	#legend {
		display: block;
	}
	
	.cilMapAndLegendContainerMobile {
		display: none;
	}
	
	#legendMobile {
		display: none;
	}
}
/*  design breaks at 1157px - nav bar too wide */


/**************************************  WIDTH:  1048px *****************************************************/
@media screen and (max-width: 1048px) {
	
	body {
		background-image: -webkit-linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
		background-image: -ms-linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
		background-image: -o-linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
		filter: progid:DXImageTransform.Microsoft.gradient
            (startColorstr=#FFFFFF, endColorstr=#FAF700);
		background-image: linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
	}
	
	
	header .aNorthLogo {
		width: 93%;
		max-width: 960px; 
		display: block;
	}
	
	header .mobileLogo320 {
		display: none;
	}
	
	.topBox {
		max-width: 960px;
	}
	
	nav {
		width: 93%;
		max-width: 960px;
	}
	
	nav a {
		font-size: 65%;
	}
	
	#wrapper {
		width: 93%;
		max-width: 960px;
	}
	
	.cilMapAndLegendContainer {
		display: block;
	}
	#legend {
		display: block;
	}
	
	.cilMapAndLegendContainerMobile {
		display: none;
	}
	
	.cilMapImageContainerMobile320 {
		display: none;
	}
	
	#legendMobile {
		display: none;
	}
	
	footer {
		padding-bottom: 6.5em;
	}
	
}

/**************************************  WIDTH:  1024px *****************************************************/
 @media screen and (max-width: 1024px){
	body {
		overflow: auto;
	}
	
	header .aNorthLogo {
		width: 93.75%;
		max-width: 944px;
		height: auto;
		display: block;
	}
	
	header .mobileLogo320 {
		display: none;
	}
	
	
	.topBox {
		max-width: 931px;
		max-width: 944px;
	}
	
	nav {
		width: 93.75%;
		max-width: 944px;
	}

	#wrapper {
		width: 93.75%;
		max-width: 960px;
	}
	
	.cilMapAndLegendContainer {
		display: block;
	}
	#legend {
		display: block;
	}
	
	.cilMapAndLegendContainerMobile {
		display: none;
	}
	
	.cilMapImageContainerMobile320 {
		display: none;
	}
	
	#legendMobile {
		display: none;
	}
 }
 
/**************************************  WIDTH:  800px *********************************************************/
 @media screen and (max-width: 800px) and (orientation: landscape) {
	body {
		font-size: 80%;
		overflow: auto;
	}
	
	body .bgtop {
        text-align: center;
        margin: 0 auto;
        padding-top: 0;
        background-image: -webkit-linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
		background-image: -ms-linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
		background-image: -o-linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
		filter: progid:DXImageTransform.Microsoft.gradient
            (startColorstr=#FFFFFF, endColorstr=#FAF700);
		background-image: linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
        }
        
	header .aNorthLogo {
		width: 96%;
		max-width: 768px;
		display: block;
	}
	
	header .mobileLogo320 {
		display: none;
	}
	
	.topBox {
		max-width: 730px;
	}
	
	.skipbox2 a {
		display: none;
	}
   
	nav {
		font-size: 98%;
		font-weight: 800;
		margin-top: 2.5%;
		width: 96%;
		max-width: 768px;
	}
	
	nav li {
		width: 11.2%;
	}
	
	nav a {
		font-size: 65%;
		font-weight: 800;
	}
	
	#wrapper {
		width: 96%;
		max-width: 768px;
	}
	
	
	#zoomInfo {
		display: none;
	}
	
	.cilMapAndLegendContainer {
		display: none;
	}
	
	.cilMapAndLegendContainerMobile {
		display: block;
	}
	
	.cilMapImageContainerMobile320 {
		display: none;
	}
	
	#legend {
		display: none;
	}
	
	#legendMobile {
		display: block;
	}
	
}

@media screen and (max-width: 800px)  and (orientation: portrait) {
	body {
		font-size: 80%;
		overflow: auto;
	}
	
	body .bgtop {
        text-align: center;
        margin: 0 auto;
        padding-top: 0;
        background-image: -webkit-linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
		background-image: -ms-linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
		background-image: -o-linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
		filter: progid:DXImageTransform.Microsoft.gradient
            (startColorstr=#FFFFFF, endColorstr=#FAF700);
		background-image: linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
        }
        
	header .aNorthLogo {
		width: 96%;
		max-width: 768px;
		display: block;
	}
	
	header .mobileLogo320 {
		display: none;
	}

	.topBox {
		max-width: 730px;
	}
	
	.skipbox2 a {
		display: none;
	}
	
	nav {
		font-size: 80%;
		font-weight: 800;
		margin-top: 2.5%;
		width: 96%;
		max-width: 768px;
	}
	
	nav li {
		width: 11.2%;
	}
	
	nav a {
		font-size: 70%;
		font-weight: 800;
	}
	
	#wrapper {
		width: 96%;
		max-width: 768px;
	}
	.skipbox {
		display: none;
	}
	
	#zoomInfo {
		display: none;
	}
	
	.cilMapAndLegendContainer {
		display: none;
	}
	
	.cilMapAndLegendContainerMobile {
		display: block;
	}
	
	.cilMapImageContainerMobile320 {
		display: none;
	}
	
	#legend {
		display: none;
	}
	
	#legendMobile {
		display: block;
	}
	
}
/**************************************  WIDTH:  768px ************************************************************/

@media screen and (max-width: 768px)  {
	body {
		font-size: 80%;
	}
	
	.bgtop {
		text-align: center;
        margin: 0 auto;
        padding-top: 0;
        background-image: -webkit-linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
		background-image: -ms-linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
		background-image: -o-linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
		filter: progid:DXImageTransform.Microsoft.gradient
            (startColorstr=#FFFFFF, endColorstr=#FAF700);
		background-image: linear-gradient(to right, #FFFFFF, #FAF700 5%, #FAF700 95%, #FFFFFF);
	}
	
	
	header {
		height: auto;
	}
	
	header .aNorthLogo {
		width: 96%;
		max-width: 768px;
		max-width: 700px;
		display: block;
	}
	
	header .mobileLogo320 {
		display: none;
	}
	
	.topBox {
		max-width: 700px;
	}
	
	nav {
		width: 95%;
		min-height: 8em;
		padding-bottom: .5em;
		margin-top: 2em;
		max-width: 700px;
	}
	
	nav ul {
		display: normal;
		width: 95%;
		max-height: 2.2em;
	}
	
	nav li {
		width: 22%;
	}
	
	nav .wider {
		width: 27%;
	}
	nav a {
		font-size: 85%;
		font-weight: 700;
	}
	
   
	#wrapper {
		width: 95%;
	}
	
	
	.cilMapAndLegendContainer {
		display: none;
	}
	
	.cilMapAndLegendContainerMobile {
		display: block;
	}
	
	.cilMapImageContainerMobile320 {
		display: none;
	}
	
	#legend {
		display: none;
	}
	
	#legendMobile {
		display: block;
	}
	
	footer {
		padding-bottom: 28em;
	}
}

/**********************************************   WIDTH:  600px   ****************************************************/

/**************************************  WIDTH:  600px ************************************************************/
@media screen and (max-width: 600px) {
	
	body {
		font-size: 80%;
		overflow: auto;
	}
	
	header {
		font-size: 70%;
	}
	header .aNorthLogo {
		width: 96%;
		max-width: 576px;
		display: block;
	}
	
	header .mobileLogo320 {
		display: none;
	}

	.topBox {
		max-width: 576px;
	}
	
	nav {
		width: 96%;
		max-width: 576px;
		margin-top: 2em;
	}
	
	nav ul {
		width: 100%;
		max-width: 576px;
		margin: 0;
		/*min-height: 3.125em;  */
	}
	
	nav li {
		margin: 0 .25em;
	}
	
	nav a {
		font-size: 80%;
	}
	
	nav .wider {
		width: 20%;
	}
	
	#wrapper {
		width: 96%;
		max-width: 576px;
	}
	
	#container {
		width: 96%;
		max-width: 576px;
		background-image: none;
		margin: 0 auto;
		padding-bottom: 0;
		
	}
	
	.cilMapAndLegendContainer {
		display: none;
	}
	
	.cilMapAndLegendContainerMobile {
		display: block;
	}
	
	.cilMapImageContainerMobile320 {
		display: none;
	}
	
	#legend {
		display: none;
	}
	
	#legendMobile {
		display: block;
	}
	/* ### */
	/*****************************************************************************************************************************************************************/
	.cilMapAndLegendContainerMobile {
		display: normal;
		font-size: .85em;
	}
	
	footer {
		padding-bottom: 10em;
	}
}

/**************************************  WIDTH:  480px ***********************************************************************/
@media screen and (max-width: 480px) {
	body {
		font-size: 62.5%;
	}
	
	header {
		font-size: 75%;
		height: auto;
	}
	
	header .aNorthLogo {
		width: 93.4306569%;
		min-width: 384px;
		max-width: 384px;
		height: auto;
		/*max-height: 15.6em;*/
		display: block;
	}
	
   header .mobileLogo320 {
		display: none;
	}
	
	.topBox {
		max-width: 384px;
		margin-top: 1em;
	}
	
	nav {
		width: 93.4306569%;
		max-width: 384px;
		margin-top: 0;
	}
	
	nav .wider {
		width: 25%;
	}
	
	nav a {
		font-size: 67%;
		font-weight: 800;
	}
	
	#wrapper {
		width: 93.4306569%;
		max-width: 384px;
	}
	
	#container {
		width: 93.4306569%;
		max-width: 384px;
		background-image: none;
		margin: 0 auto;
		padding-bottom: 0;
		
	}
	
	.cilMapAndLegendContainer {
		display: none;
	}
	
	.cilMapAndLegendContainerMobile {
		display: block;
		width: 100%;
		margin: 0 auto;
	}
	
	.cilMapImageContainerMobile320 {
		display: none;
	}
	
	.cilMapImageContainerMobile {
		float: none;
		width: 100%;
		max-width: 270px;
		margin: .125em auto;
		border: 0;
	}
	
	#legend {
		display: none;
	}
	
	#legendMobile {
		display: block;
		float: none;
		width: 100%;
		max-width: 270px;
		margin: 0 auto;
	}
	
	.entryTaller {
		padding-left: 0;
		padding-right: 0;
	}
	
	.subfooter {
		display: block;
		max-height: 5em;
	}
	
	.linkBoxContainer {
		width: 85%;
		margin-left: 7.5%;
		padding-left: 7.5%;
	}
	
	.clearFloat {
		clear: none;
	}
	
	.linkBoxLead4,
	.linkBoxLead3,
	.linkBoxLead2,
	.linkBoxLead1 {
		width: 40%;
		margin: .5em 0.520833%; 
	}
	
	.linkBoxFollow {
		width: 40%;
	}
	
	.linkBoxExtra {
		width: 40%;
		margin-left: 25%;
	}
	
	.noLinkName,
	.linkName {
		font-size: 110%;
	}
	
	footer {
		padding-bottom: 2em;
	}
}


/**************************************  WIDTH:  400px *****************************************************************/
@media screen and (max-width: 400px) {
	
	body {
		
		width: 100%;
		max-width: 384px; 
		font-size: 67.5%;
		
	}
	
	header {
		/*font-size: 61%; */
		/*min-height: 81px; */
		height: auto;
	}

	
	header .aNorthLogo {
		/*width: 93.4306569%;
		width: 100%;
		width: 364px;
		max-width: 364px;
		width: 364px;*/
		width: 93.4306569%;
		width: 364px;
		max-width: 364px;
		height: auto;
		max-height: 15.6em;
		max-height: 91px;
		display: none;
	}
	
	header .mobileLogo320 {
		display: block;
		max-width: 364px;
		width: 354px;
		height: auto;
		display: block;
		
	}
	
	.topBox {
		max-width: 384px;
	}
   

	nav {
		width: 100%;
		max-width: 354px;
	}
	
	nav .wider {
		width: 25%;
	}
	
	nav a {
		font-size: 65%;
		margin-bottom: .5em;
		margin-top: 1em;
		padding-bottom: .5em;
	}
	
	#wrapper {
	/*	width: 93.4306569%; */
		width: 95%;
		max-width: 384px;
		font-size: 75%;
	}
	
	#container {
		width: 93.4306569%;
		max-width: 384px;
		background-image: none;
		margin: 0 auto;
		padding-bottom: 0;
		
	}
	
	.cilMapAndLegendContainer {
		display: none;
	}
	
	.cilMapAndLegendContainerMobile {
		display: block;
		width: 100%;
		margin: 0 auto;
	}
	
	.cilMapImageContainerMobile {
		float: none;
		width: 100%;
		max-width: 270px;
		margin: .125em auto;
		border: 0;
	}
	
	.cilMapImageContainerMobile320 {
		display: none;
	}
	
	#legend {
		display: none;
	}
	
	#legendMobile {
		display: block;
		float: none;
		width: 100%;
		max-width: 270px;
		margin: 0 auto;
	}
	
	
	

}

/**************************************  WIDTH:  320px *********************************************************************/
@media screen and (max-width: 320px) {
	
	body {
		font-size: 62.5%;
	}
	
	
	header {
		font-size: 40%;
		min-height: 69px;
		height: auto;
	}
	
	header .aNorthLogo {
		width: 81.25%;
		max-width: 260px;
		height: auto;
		max-height: 69px;
		display: none;
	}
	
	header .mobileLogo320 {
		width: 81.25%;
		width: 100%;
		max-width: 260px;
		height: auto;
		max-height: 69px;
		display: block; 
	}
	
	.topBox {
		width: 260px;
	}
	

	
	nav {
		width: 96.75%;
		max-width: 260px;
		font-size: 100%;
	}
	
	nav a {
		font-size: 55%;
		margin-bottom: .5em;
		margin-top: 1em;
		padding-bottom: .5em;
	}
	
	#wrapper {
		width: 96.75%;
		max-width: 260px;
	}
	.cilMapAndLegendContainer {
		display: none;
	}
	
	.cilMapAndLegendContainerMobile {
		display: block;
		width: 100%;
		margin: 0 auto;
	}
	
	.cilMapImageContainerMobile {
		float: none;
		width: 100%;
		max-width: 270px;
		margin: .125em auto;
		border: 1px solid black;
		display: none;
	}
	
	.cilMapImageContainerMobile320 {
		display: block;
	}
	
	#legend {
		display: none;
	}
	
	#legendMobile {
		display: block;
		float: none;
		width: 100%;
		max-width: 270px;
		margin: 0 auto;
	}
	
	.cilMapAndLegendContainerMobile320 {
		display: block;
		width: 100%;
		margin: 0 auto;
	}
	
	.cilMapImageContainerMobile320 {
		float: none;
		width: 100%;
		max-width: 270px;
		margin: .125em auto;
		border: 1px solid black;
	}
}