/*  Styles unique to content pages (load after style.css) */

/* ========== Set up the look for the new site ================ */

/* FOOTER PROMOTIONS */

/*#footerPromotionImage1 { background-image: url("http://msdh.ms.gov/msdhsite/theme/slides/WestNileVirusRed2.gif"); }*/

/* LAYOUT */

#nav { height: auto; margin-right: 10px; } /* to add white space for legibility, double the right margin .  Ordinarily, should be 10px */
#assetNow_homeMenu { display: none }
#assetNow_mobileMenu { display: none }
#assetNow_mobileMenuButton { display: none }
#assetNow_navMenuItems { display: block }
#pageContent { margin: 5px 10px 10px 10px; overflow: hidden; position: relative } /*  overflow:hidden or overflow:auto in pageContent prevents cleared floats within a page from breaking the outer navigation layout */
#footer { clear: left } /* prevents collision between footer and long navigation menues */
div.msdh { width: auto; } /* indicates msdh content (as opposed to ems) */
#article { margin: 10px 0 0 0; } /* encloses all page content below the title/teaser. Left margin can be added for readability of text, even though it makes for a less consistent look. */
div.firstBox { margin-left: 10px; }
#azDropdown { top: 5px; } /* move up to visually join the gray header background */
h1 { padding: 0; margin: 0; }


/* COLORS */

/* #nav ul { background-color: #e9f4de; } */
#nav a, #nav a:visited { color: #666 }
#nav div#assetNow_homeMenu ul, #nav div#assetNow_mobileMenu ul { background-color: #f0f0f0; }
#nav div#assetNow_homeMenu li:hover, #nav div#assetNow_mobileMenu li:hover { background-color: #f6f6f6; }
ul#assetNow_menuButton li, ul#assetNow_menuButton li:hover {background-color: #4c83a9; }
ul#assetNow_menuButton a, ul#assetNow_menuButton a:visited, ul#assetNow_menuButton a:hover, #assetNow_mobileMenuButton a, #assetNow_mobileMenuButton a:visited, #assetNow_mobileMenuButton a:hover { color: #fff; }
ul#assetNow_homeButton li a, ul#assetNow_homeButton li a:visited { color: #367; } /* 839d68 */
#assetNow_mobileMenuButton li, #assetNow_mobileMenuButton li:hover { background-color: #4c83a9}
#nav ul.assetNow_groupChosenActive { background-color: #d0ecf1; } /* e9f4de */
/*#nav ul.categories { background-color: #eff6ee; }*/ /* #f0f0f0 e9f4de */
#nav ul.categories li { border-bottom: 1px solid #e0d0e8; }

#nav li.assetNow_categoryChosenActive { background-color: #fff; } /* e9f4de was darker e0edd0 */
#nav ul.categories li.assetNow_categoryChosenActive { border-bottom: none } /* e9f4de was darker e0edd0 */
#nav ul.assetNow_groupChosenActive a, #nav li.assetNow_categoryChosenActive a, #nav #subcategoryChosen a { color: #046; }
#nav li.subcategory a { color: #505066 }
#nav #subcategoryChosen { background-color: #fff; border-bottom: none }
#nav li:hover { background-image: none } /* the right-pointing arrow image leads to a menu on the home page, but not on inner pages, so drop it */
#article { background-color: White }
div.msdh { background-color: White; } /* really only to help preview pages outside of AssetNow */

/* h1 { color: #006baa; background-color: #f0f0f0; } */
/* h1 { color: #555; background-color: #e9f4de; } */
/* dark blue = h1 { color: #355670; } */

#pageContent a:hover { color: #00aacc; text-decoration: underline; }
div, p, li { color: #000; }

#contact #requestUpdateLink:hover { color: #fff }
#contact #requestUpdateLink, #contact #requestUpdateLink:visited { color: #4d6 }


/* FONTS */

#nav ul.categories { font-size: 15px }
#nav li.subcategory { font-size: 12px; }

h1 { font-family: Georgia, Cambria, "Palatino Linotype", serif; font-weight: normal; font-size: 18px; color: #ffffff;}
/* #pageContent p, div.boxBody, #pageContent li { font-family:  "PT Serif", Georgia, Cambria, "PT Serif", Georgia; } */
/* #pageContent p, #pageContent ul li, div.boxBody, div.shadedBox. .sidebar { line-height: 200%; } */
#pageContent { line-height: 160%; }

/* FINISHING TOUCHES */

#nav ul.categories a { padding-left: 7px; }
#nav li.subcategory a { padding-left: 10px; }
#article p a, #article li a { border-bottom: 1px dotted #ccc; }
#article ul.links a { border-bottom-width: 0}

#navFiller {
   margin-top: 10px; background-color: #f0f0f0; background-image: url(../theme/TextureGrainGray.gif);
   font-family: "Noto Sans", "Source Sans Pro", "Open Sans", Verdana, "Helvetica Neue", Helvetica, Arial, "Trebuchet MS", Sans-Serif; font-size: 14px;
  }
#navFiller p { color: #036 }
#navFiller ul.navListNotMenu { background-color: transparent; list-style-type: disc; margin-left: 1.5em; padding-bottom: 10px}
#navFiller ul.navListNotMenu li, #navFiller ul.navListNotMenu li:hover { font-size: 14px; margin-bottom: 1em; color: #510; background-color: transparent;  }
#navFiller ul.navListNotMenu a { display: inline; padding: 0; margin: 0; border: none; color: #057 }

.box { height: auto; margin: 0 0 10px 0; background-color: Transparent; line-height: normal; }
.box > p:first-child { color: #068; width: 90%; padding-bottom: 2px}
.box a.moreLink { color: #068 }

.clearFloats { clear: both; height: 0; font-size: 0; line-height: 0; margin: 0; overflow: hidden; }

.clearLeft { clear: left }
.clearRight { clear: right }
.noFloat:after { content: ""; display: table; clear: both} /* works nicely when applied to with <br> as the last item in a floated element. */

a.moreLink { font-style: italic; color: #068 }

#contact #requestUpdateLink { float: left }

abbr { border-bottom: 1px dotted #c9d4be }

#carousel {
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}

.carouselFade { opacity: 0; }

/* EXISTING PAGE STYLES */

img.leadImage { float: left; margin: 0 1em 0.5em 0; border: none; } /* stops floating on small screens to make more room for text */
img.leadImageFixed { float: left; margin: 0 1em 0.5em 0; border: none } /* Just like leadImage, but always floats -- assumed to be small enough (100 px or less) to fit well on small screens */
img.letterGraphic { float: left; margin: 0 0.25em 0.25em 0; border: none }

span.leadLetter { float: left; color: #369; font-size: 400%; line-height: 50%; padding: 10px 5px 5px 0; font-family: "Palatino Linotype", Constantia, Georgia, Cambria, serif;}

p.leadParagraph {
/*	font-family: Georgia, Cambria, "Palatino Linotype", Palatino, serif; font-size: 13pt; */
	font-size: 17px;
   margin-top: 0;
   color: #777;
   line-height: 150%;
   }

h2, h3, h4, .contactBox_header, p.boxHeading, p.specialBox, p.heading, p.headline, ul.menuBar a {
	font-family: Georgia, Cambria, "Palatino Linotype", Palatino, serif;
	margin-bottom: 0.75em; margin-top: 2em;
	font-weight: normal;
      color: black;
      line-height: 120%;
   }

h2 { font-size: 26px; margin-bottom: 10px; padding: 1em 0 0 0; border-top: 1px solid #ddd; margin-top: 2em }
.msdh h2:first-child, .rightColumn h2:first-child, .leftColumn h2:first-child, .rightColumn h2:first-child { border-top: 0; padding-top: 0; margin-top: 1em }
h3, p.boxHeading, p.specialBox, p.heading, p.headline, ul.menuBar a {font-size: 20px; color: #333 }
h4 { font-size: 16px; font-weight: normal; font-style: italic; margin-bottom: 0.5em; color: #555 }

.contactBox_header { color: #347034; } /* 4b7b4b 668b55 444 8faa74 006baa #dd6633 #007744 */

.column-secondary h2 { font-size: 18px; color: #666 }

/*
p.boxHeading, p.specialBox, h2 {
   padding: 5px;
	background-color: #f5f5f5;
	}
*/

.aside_header { color: #555; margin: 2em 0 0 0; font-weight: bold; font-size: 120% }

.bright, h1.bright, h2.bright, h3.bright, h4.bright, p.bright, div.bright, .plainSidebar h3:first-child.bright, .plainSidebar .sidebar_header:first-child.bright, .sidebar h4.bright, li.bright, a.bright, strong.bright, span.bright { color: #dc6700; }

.sidebar h3:first-child.bright, .sidebar_header:first-child.bright { color: #dc6700}

.highlighted { background-color: #ffee99; padding: 2px 4px; }

.boxed { border: 1px solid #aaa; padding: 5px; }

.attention { border-left: 6px solid #6c6; padding-left: 1em; background-color: #f8fbf8 }

div.boxBody { margin-left: 10px; }
.boxBody > p:first-child, .shadedBlue > p:first-child, .shadedBox > p:first-child { margin-top: 0.25em }
div.highlighted > h3:first-child { margin-top: 1em }

.floatLeft { float: left; margin-right: 1em; margin-bottom: 1em }
.floatRight { float: right; margin-left: 1em; margin-bottom: 1em }
.floatBordered { border-right: 1px solid #e8e8e8; border-bottom: 1px solid #dddddd; padding: 0px 5px 5px 5px;}

.msdh aside {
   background-color: #f4f4f4;
   border-top: 6px solid #ddd;
   border-bottom: 1px solid #dddddd;
   padding: 1em 1em 1em 1em;
   margin: 1em 10% 1em 10%;
  }

.msdh aside p:first-child { margin-top: 0 }

.sidebar {
    width: 32%;
    float: right;
    background-color: #f4f4f4;
    border-right: 1px solid #e8e8e8;
    border-bottom: 1px solid #dddddd;
    padding: 0px 10px 10px 10px;
    margin: 0 0 1em 1.5em;
    font-size: 13px;
    line-height: 135%;
    overflow: hidden; }

.sidebar h2 { font-size: 18px; margin-top: 1.5em } /* A little smaller than main content size */
.sidebar h3 { font-size: 18px }
.sidebar_header { font-size: 18px; }

/* .sidebar h3:first-child, .sidebar p.heading { background-color: #519fd7; padding: 7px; color: white; margin: 0 -10px 0 -10px; border: none} */
.sidebar h3:first-child, .sidebar p.heading, .sidebar_header { padding: 7px; margin: 0 -10px 0 -10px; border-bottom: 1px solid #ccc; color: #666 } 
.sidebar h4:first-child { margin-top: 10px }
.sidebar img:first-child { margin-top: 10px; } /* since sidebar lacks any top padding of its own, and images don't carry any themsleves */
.sidebar ul:last-child {margin-bottom: 0} /* since the padding in the sidebar itself is sufficient. */

.greenHeading { background-color: #f6faf7 }
.greenHeading h3:first-child { background-color: #d4efd6; color: #476749 }

.blueHeading { background-color: #f6faf9 }
.blueHeading h3:first-child { background-color: #cdecec; color: #4c6767 }

.violetHeading { background-color: #f7f7f9 }
.violetHeading h3:first-child { background-color: #cfcdec; color: #464276 }

.orangeHeading { background-color: #fbd585 }
.orangeHeading h3:first-child { background-color: #d88000; color: white }
/*
.orangeHeading { background-color: #faf8e8 }
.orangeHeading h3:first-child { background-color: #ffe69f; color: #8d6634 }
*/

.pinkHeading { background-color: #fef4f3 }
.pinkHeading h3:first-child { background-color: #f6d6e0; color: #7a5762 }


.plainSidebar { background-color: #f8f8f8; padding-top: 10px }
.plainSidebar > p:first-child { margin-top: 0 }
.plainSidebar > h3:first-child, .plainSidebar .sidebar_heading { margin-top: 0; background-color: transparent }
.plainSidebar > h4:first-child { margin-top: 0 }

.shadedBox > h3:first-child, .shadedBox > h4:first-child { margin-top: 0 }
.shadedBlue > h3:first-child, .shadedBlue > h4:first-child { margin-top: 0 }

.contactBox { border-top: 1px solid #ccc; padding: 0.5em; margin-top: 2em; background-color: #fafafa }
.contactBox_header, .aside_header { font-size: 120%; padding-top: 0; margin-top: 0 }

.leftColumn { float: left; width: 46%;  }
.rightColumn { float: right; width: 46%; }
.leftColumnNarrow, .leftColumnWide { float: left; }
.rightColumnNarrow, .rightColumnWide { float: right; }
.leftColumnNarrow, .rightColumnNarrow { width: 33%; }
.rightColumnWide, .leftColumnWide { width: 61%; }
.threeColumnLeft { float: left; width: 31%;  }
.threeColumnCenter { float: left; width: 31%; margin-left: 3.5%}
.threeColumnRight { float: right; width: 31%; }

/* .rightColumn:before, .rightColumnWide:before, .rightColumnNarrow:before { content: ""; display: table; line-height: 0; } */
.rightColumn:after, .rightColumnWide:after, .rightColumnNarrow:after, .threeColumnRight:after  { content: ""; display: table; line-height: 0; clear: both; }
.rightColumn + p, .rightColumn + ul, .rightColumn + div, .rightColumn + img, .rightColumn + h2, .rightColumn + h3 { clear: both; } /* for browsers that don't support after? maybe */
.rightColumnWide + p, .rightColumnWide + ul, .rightColumnWide + div, .rightColumnWide + img, .rightColumnWide + h2, .rightColumnWide + h3 { clear: both }
.rightColumnNarrow+ p, .rightColumnNarrow+ ul, .rightColumnNarrow+ div, .rightColumnNarrow+ img, .rightColumnNarrow+ h2, .rightColumnNarrow+ h3 { clear: both }
.threeColumnRight + p, .threeColumnRight + ul, .threeColumnRight + div, .threeColumnRight + img, .threeColumnRight + h2, .threeColumnRight + h3 { clear: both }

.leftColumn h3:first-child, .rightColumn h3:first-child { margin-top: 0 }

ul.menuBar { list-style-type: none; margin: 0 0 1em 0; padding: 0; }
ul.menuBar:after { content: "."; visibility: hidden; clear: left }

ul.menuBar li {
   float: left;
   font-size: 13px;  text-transform: uppercase; text-align: center;
   padding: 5px 10px 5px 10px;
   background-color:  #e4f0d8;
   margin-right: 5px;
   }

ul.menuBar li a { font-size: 13px; color: #555; }

table.menuBar { width: 100%; margin: 10px 0 10px 0}

table.menuBar td, td.menuButton, td.menuButtonLeft
{
   font-size: 13px;
   text-transform: uppercase;
    text-align: center;
    padding: 4px 0 4px 0;
    background-color: #e9f4de;
    border-right: 5px solid white;
}

.fullWidth { width: 100% } /* really for responsive card images, but useful in many places for screen responsiveness */

.card { width: 100%;  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); border-radius: 5px; background-color: #f9f9f9}
.card h3 { color: white; background-color: #2d6087; font-size: 20px; padding: 20px 20px 20px 20px; margin: 0 } /* background was 4c83a9 */
.card h3 a { color: white;  }
.card h3 a span::after { margin-left: 0.25em; color: orange; content: "\2192" } /* add an arrow after links in card titles   \279c  */
.card h3 a.noCardLinkArrow span::after { content: none } /* when it needs to be suppressed */
.card h3 span, .card h3 a span { color: #ccc; font-size: 14px; }
.cardHeader { color: white; background-color: #2d6087; font-size: 20px; padding: 20px; margin: 0; font-family: Georgia, Cambria, "Palatino Linotype", Palatino, serif; }
.cardHeader a { color: white;  }
.cardHeader a span::after { margin-left: 0.25em; color: orange; content: "\2192" } /* add an arrow after links in card titles   \279c  */
.cardHeader a.noCardLinkArrow span::after { content: none } /* when it needs to be suppressed */
.cardHeader span, .card h3 a span { color: #ccc; font-size: 14px; }
.cardContent { margin: 10px; padding-bottom: 5px; }
.cardContent p { line-height: 150%}
.cardFooter { border-top: 1px solid #ccc; padding-top: 10px }
a.cardLink { color: #e80; text-transform: uppercase }
a.cardLink2 { font-size:80%; float: right; text-align: right }

details { margin-bottom: 1.5em; margin-left: 1em }
details.p { margin-left: 1.5em }
summary { font-weight: bold; margin-left: -1em; margin-bottom: 0.5em; color: #006677; cursor: help }


table.menuBar a,a .menuButton, a.menuButton:visited { color: #067;  text-decoration: none; }
table.menuBar a:hover, a.menuButton:hover { color: #4c88b6; }

#feedbackBox { margin-top: 1em; border: 1px solid #ccc }
#feedbackBox ul { margin-bottom: 0 }


#FBLikePlaceholder { float: right; display: none }
#FBLikeButton { border: none; overflow: hidden; width: 130px; max-height: 33px; float: right; }


.formFieldsPadded input, .formFieldsPadded textarea, .formFieldsPadded select { margin-bottom: 1em }
.formLabelsPadded label { margin-top: 1em }

.modernStyleForm label { display: block; color: #666; }
.modernStyleForm label.inline { display: inline; }
.modernStyleForm input, .modernStyleForm textarea, .modernStyleForm select { background-color: #f4f4f4;  max-width: 75% }

.buttonLink { padding: 0.25em 0.5em 0.25em 0.5em; background-color: #eee; border-right: 1px solid #ccc; border-bottom: 1px solid #bbb; }
.buttonLinkGreen { padding: 0.25em 0.5em 0.25em 0.5em; background-color: #deb; border-right: 1px solid #ccc; border-bottom: 1px solid #bbb; }
.buttonBright { padding: 0.25em 0.5em 0.25em 0.5em; background-color: #fd6; border-bottom: 1px solid #db4;  border-right: 1px solid #db4; border-top: 1px solid #fea }
.arrowLink { background-image:  url(/msdhsite/images/ArrowLink.gif); background-repeat: no-repeat; padding-left: 12px; margin-left: 0.5em; }

#popupBox {
    display: none;
    margin-left: 5%;
    margin-top: 15%;
    width:90%;
    text-align:center;
    z-index: 1000;
    background-color: #777;
    color: white;
    padding: 10px;
 }
 #popupBox p { color: white; font-size: 120%; line-height: 130% }
 #popupBox h3 { color: #CCFFCC; font-size: 150% }

.dynamicNote { color: #cc2e01; font-weight: bold}

#siteAlert { color: white; background-color: #a00; padding: 2px 5px 2px 5px; }

.footerPromotion { margin-top: 10px; border-top: 1px solid #ccc; width: 100% }

.mobileOnly { display: none}
.desktopOnly { display: block}

/* ======= NEW AssetNow styles ================= */

#assetNow_pageTitle { margin-top: 5px; margin-bottom: 0; padding: 9px 5px 9px 10px; background-color: #4c83a9; } /* 4881a8 was light blue d8ebf8 or med blue ddeefb or dark blue 5991bf */
#assetNow_fileViewers { border-top: 1px dotted #ccc; font-size: 13px; padding-top: 1em; color: #888 }
#assetNow_subcategoryList {  list-style-image: url(/msdhsite/images/ArrowGrayBullet.gif); }
#assetNow_subcategoryList li { padding-bottom: 0.25em; }
#assetNow_subcategoryListHeading, #assetNow_additionalPagesListHeading, #assetNow_archiveSubcategoriesListHeading { font-style: italic }
#assetNow_teaserTop { font-size: 13px; font-style: italic; background-color: #eee; color: #808080; padding: 10px; margin: 0 }
img.assetNow_fileViewerIcon {  }
div.assetNow_itemEditButton {  }

ul.assetNow_pageAndFileList { list-style-image: url(/msdhsite/images/ArrowGrayBullet.gif); }
ul.assetNow_pageAndFileList li { margin-bottom: 0.75em; }
li.assetNow_appListing {  }
li.assetNow_pageListing { font-weight: bold; }
li.assetNow_fileListing { clear: right; font-weight: bold; margin-bottom: 0.5em; }
div.assetNow_fileListingDetails { float: right; width: 10%; font-size: 11px; vertical-align: middle;  }
div.assetNow_listItemSubtitle { font-weight: normal; color: #777; width: 90%; font-size: 13px; margin-top: 0.2em; line-height: 100% }
span.assetNow_fileSize { font-weight: normal; color: #666; padding-left: 4px }
span.assetNow_fileInfoLink {  }
div.assetNow_pageAndFileLabel {  }

#assetNow_pageOptions { background-color: #e0ecf2; font-size: 12px; clear: both;  padding-left: 10px; height: 2em; margin-top: 10px; } /* clear any floats left over from the page content */
#assetNow_pageOptionsButtons  { float: right;}
#assetNow_pageOptionsButtons a  { float: left; border-left: 10px solid white; color: white; background-color: #4c83a9;  padding: 0px 1.5em 0px 1.5em; height: 2em} /* was 8da94c 4c83a9 */
#assetNow_pageOptionsButtons a:hover  { background-color: #2c5389; color: white; text-decoration: none }
#assetNow_pageOptions #reviewDate { line-height: 2em; float: left; color: #87957d;  }

li.assetNow_recentFile { background-color: #eef4ff; padding: 3px; }
span.assetNow_requestFile { font-size: 12px; font-style: italic;  }
span.assetNow_untitled {  }

#google_translate_element { text-align: right;  display: none; clear: both; padding-top: 5px; }
#google_translator { float: right; margin: 0 }


/* .mapMark { position: absolute; background-color: #ff72c1; height: 5px ; width: 5px} */
   .mapMark { position: absolute; color: #ff72c1; font-family: Arial,sans-serif ; font-size: 24px; line-height: 9px;}
.markableMap { position: relative; }

.divider { border-top: 1px solid #ccc; margin-top: 1em; margin-bottom: 1em }

/* Page-specific styles */

.newsRelease p:first-child {font-size: 120%; color: #888; line-height: 150%}

.leftColumnConnect {  float: left; width: 15%; }
.leftColumnConnect img { margin-top: 2em;  }
.rightColumnConnect { float: right;  width:83%; margin-left: 2%; }

table.MDHC thead td { background-color: #d8f1f1; border: 1px solid #999; font-weight: bold }
table.MDHC td { padding: 3px 10px; background-color: #edfaf7; border-top: 1px solid #ddd; border-right: 1px solid #ddd; border-left: 1px solid #ddd; vertical-align: middle; font-size: 85% }
table.MDHC td.location { background-color: #d8f1f1; font-weight: bold; border: 1px solid #999 }
table.MDHC tr.singleRow td { border-top: 1px solid #999; border-bottom: 1px solid #999 }
table.MDHC tr.firstRowInGroup td { border-top: 1px solid #999;}
table.MDHC tr.lastRow td { border-bottom: 1px solid #999;}

table.MDHC.municipalities thead td { border: 1px solid #999 }
table.MDHC.municipalities tbody tr>td:first-child { font-weight: bold; background-color: #d8f1f1; border: 1px solid #999 }
table.MDHC.municipalities tbody td { border: 1px solid #ddd;  }

table.topAlignedTable td { vertical-align: top; }

table.muTable { width: 100%; margin-top: 1em }
table.muTable thead td { color: white; background-color: #70966d; }
table.muTable td { padding: 10px; vertical-align: top; border: 1px solid #a8c0b0 }
table.muTable tbody tr td:first-child { font-weight: bold }
table.muTable tbody tr:nth-child(odd) {background: #d0e5cb}
table.muTable tbody tr:nth-child(even) {background: white}

.perinatalPanel {  background-color: white; padding: 10px; border-top: 1px solid #eee; border-left: 1px solid #eee; border-right: 1px solid #ddd; border-bottom: 1px solid #ccc }
.perinatalPanel h3 { color: #555; margin-top: 0}
.perinatalPanel h2 { margin-top: 0}
.perinatalPanel .status { font-size: 110%; color: #579 }
.perinatalPanel .bar { background-color: #ddd;  height: 100px; text-align: center }
.perinatalPanel .leftColumn .bar { margin-right: 20px; margin-left: 10px}
.perinatalPanel .rightColumn .bar { ; margin-right: 20px; background-color: #ddd; }
.perinatalPanel .pastValue { font-size: 30px; padding-top: 30px; color: #999 }
.perinatalPanel .currentValue { font-size: 30px; font-weight: bold; }
.perinatalPanel .year { font-size: 12px; color: #888; text-align: center; margin-top: 5px; margin-bottom: 10px }
.perinatalPanel .rightColumn .noProgress {  }
.perinatalPanel .rightColumn .goodProgress { background-color: #cddccd; }
.perinatalPanel .rightColumn .goodProgress .currentValue{ color: #505850; }
.perinatalPanel .rightColumn .poorProgress { background-color: #ec9 }

.perinatalPanel .target { display: block; text-align: right; float: right; }
.perinatalPanel .targetTitle { font-size: 65%;color: #888 }
.perinatalPanel .targetValue { font-size: 85%; font-weight: bold }
.perinatalPanel .targetTable { width: 100% }
.perinatalPanel .targetTable td { vertical-align: top; padding-bottom: 0.5em}
.perinatalPanel .targetTable tr.lastRow td { padding-bottom: 0; }
.perinatalPanel .targetTable tr > td { width: 55% }
.perinatalPanel .dataNote { font-size: 90%; color: #999 }
.perinatalPanel .chartTitle { font-size: 90%; text-align: center; color: #555 }

.FamilyPlanningWaiverIncomeBlocks span { background-color: #e0f0e4; padding: 2px 4px; margin-right: 1em }

 .adminPage .indentOne { margin-left:1em;  }
 .adminPage .indentTwo { margin-left:2em;  }
 .adminPage .indentThree {  margin-left:3em;  }
 .adminPage span { text-transform: uppercase; color: #666;  }

.boilWaterGraphicHeader { text-align: center }
.boilWaterGraphicHeader_released { display: none }

/* some generic table classes */

table.simpleTable td { padding: 0.5em; border: 1px solid #ccc;  }
table.simpleTable thead td { background-color: #f4f4f4; padding: 0 0.5em 0 0.5em; font-weight: bold }
table.simpleTable thead td { background-color: #f4f4f4; padding: 0 0.5em 0 0.5em; font-weight: bold }
table.simpleTableSmaller { font-size: 80% }

/* ========== Styles from the old site  (some may have become unused by now ================ */

h2 + h3, h3 + h4 { margin-top: 1.5em }
h3 + h4 { margin-top: 1em}
h2 + .sidebar { margin-top: 1em }

p.heading+p, h3+p, h4+p { margin-top: 0.5em }

p.subheading { font-weight: bold; color: #222222; margin-left: 1em; margin-bottom: 0.75em; }

p.afterHeading, ul.afterHeading, div.afterHeading {
    padding-top: 0;
    margin-top: 0.5em; }


div.ems { background-color: White }

div.narrow { width: 695px }

#WNV td.borderSides { border-right: 1px solid #ddd; border-left: 1px solid #ddd; }

tr.even { background-color: #f4f8fb }

td.neg {
    text-align: center;
    color: #bbbbbb; }

td.pos {
    text-align: center;
    font-weight: bold; }

td.formLabel {
    background-color: #ccddee;
    border-top: 1px solid #aabbcc;
    color: #555566; }

td.formSection {
    background-color: white;
    font-weight: bold;
    padding-top: 1em; }

ul.flushleft {
    margin-left: 0;
    padding-left: 0; }

ul.bulletleft {
    margin-left: 0;
    padding-left: 16px; }

/*
ul.bullets { list-style-type: none; padding: 0; margin-left: 1.25em;  line-height: 125% }
ul.bullets li { background-image: url(/msdhsite/images/BulletBlue.gif); padding-bottom: 0.5em; background-repeat: no-repeat; background-position: 0px 0.45em; padding-left: 1em; }
*/

ul.bullets, ul.bulletsShaded  { line-height: 140%; list-style-image : url(/msdhsite/images/BulletBlueUp.gif); }
ul.bullets li, ul.bulletsShaded  li { padding-bottom: 0.5em;  background-image: none; }

/*
ul.bullets ul { list-style-type: none; padding: 0; margin-left: 1em; margin-top: 0.5em; }
ul.bullets ul li { background-image: url(/msdhsite/images/BulletGrayInner.gif); background-repeat: no-repeat }
*/

.msdh li { padding-bottom: 0.25em }
ul.bullets ul, ul.bullets ul.normal { list-style-image:  none; list-style-type: disc }
ul.bullets ul.bullets { list-style-image:  url(/msdhsite/images/BulletGrayInner.gif); }

ol.spaced li, ul.spaced li { margin-bottom: 0.5em; line-height: 140% }
ol.spacedWide li, ul.spacedWide li { margin-bottom: 0.75em }

ul.horizontal { list-style-type: none; margin: 0; padding: 0; }
ul.horizontal li { display: inline; margin: 0 2em 0 0; }
ul.horizontal li:before { content: url(/msdhsite/images/ArrowGrayBullet.gif) "\0020"; }

ul.links { line-height: 140%; list-style-image: url(/msdhsite/images/ArrowGrayBullet.gif); }
ul.links li { padding-bottom: 0.5em;  background-image: none; }

div.ems ul.links a { font-weight: bold }

ul.linksShaded { line-height: 140% }
ul.linksShaded { list-style-image: url(/msdhsite/images/ArrowGrayBullet.gif) }
ul.linksShaded li { padding-bottom: 0.5em }

div.ems ul.linksShaded a { font-weight: bold }

dl.horizontal dt {
   clear: both;
    float: left;
    margin-right: 0;
}
dl.horizontal dd {
   float: right;
   margin-left: 1em;
   font-weight: bold;
}

.centered { text-align: center }

div.boxBody a.red { color: #bb4444; }

div.boxBody a.textLink { color: #333333 }
div.boxBody a:hover.TextLink { color: #00aacc }

.shadedBox, .shadedBlue {
    background-color: #F3F3F3;
    padding: 0.7em;
    border-bottom: 1px solid #e8e8e8;
    border-right: 1px solid #e8e8e8;
    overflow: hidden;
}

.shadedBlue { background-color: #eef4fe }

/* ----- mobile newsletter signup ----- */

#newsletterSignup { display: none; }


/* inherited from AssetNow */

.appNote {
    font-size : 11px;
    font-family : Arial, Helvetica, Verdana, Geneva, sans-serif;
    color : #696969;
    margin-top : 4px;
    margin-bottom : 2px;
    margin-left : 2px;
    margin-right : 2px; }

.pageTableTitle {
    font-weight: bold;
    color : #666666; }

.pageDateStyle {
    font-size : 11px;
    font-family : Arial, Helvetica, Verdana, Geneva, sans-serif;
    color : #888888;
    text-align: right; }

.fileDate {
    font-size : 11px;
    font-family : Arial, Helvetica, Verdana, Geneva, sans-serif;
    color : #888888; }

.textField {
    font-size : 13px;
    font-family : Arial, Helvetica, Verdana, Geneva, sans-serif; }

.tableTitle {
    font-size : 15px;
    font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-weight : normal;
    color : #666666; }

.printContentTitle {
    font-weight: bold;
    font-size: 12pt;
    color: #002d62; }

.summary { color: #606060 }

p.headingBold {
    font-weight: bold;
    padding-bottom: 0;
    margin-bottom: 0; }

p.section {
    font-weight: bold;
    color: #4b7b4b;
    margin-top: 2em;
    padding-bottom: 0em;
    border-bottom: 1px solid #dddddd; }

.note {
    font-size: 10px;
    color: #999999; }

.black { color: #000000 }

.menuTextLight {
    font-size : 10px;
    font-family : Arial, Helvetica, Verdana, Geneva, sans-serif;
    color : #888888; }

.releaseMessage {
    font-weight: bold;
    color: #66AA66; }

.categoryDescriptionText {
    font-family : Arial, Helvetica, Verdana, Geneva, sans-serif;
    font-size : 9pt;
    color : #606060;
    margin-left: 20px;
    padding-top: 4px; }

.menuItemDescription { color : #777 }

.fileSizeStyle { color: #999999 }

td.fileListItem { color: #222222 }

td.fileListItemRecent {
    color: #222222;
    background-color: #f4f8fb;
    padding: 4px; }

span.fileListTitle { font-weight: bold }

/* fileContentList is obsolete, but still embedded in some web pages */

.fileContentList {
    font-weight: bold;
    color: #444444; }

.headingDark {
    font-size: 12pt;
    font-weight: bold;
    color: #002d62; }

.headingDarkSmall {
    font-size: 11pt;
    font-weight: bold;
    color: #002d62; }

.wideHeading {
    font-weight: bold;
    color: #002d62; }

/* styles for imported RSS Feed */

ul.rss-items { }
p.rss-title { }
.rss-title { }
.rss-item { }

.rss-date {
    font-size: 85%;
    color: #888888; }

/* an add-in class for boxHeading to provide a distinguishing look */

.whiteHeading1 {
    font-size: 10pt;
    font-weight: bold;
    color: #384e70;
    background-color: #daeaf8;
    border-bottom: 1px solid #e8e8e8;
    padding-left: 0.5em; }

.whiteHeading2 {
    font-size: 10pt;
    font-weight: bold;
    background-color: #e9f4de;
   color: #4A6598;
    border-bottom: 1px solid #d8d8d8;
    padding-left: 0.5em; }

.whiteHeading3 {
    font-family: Arial, Helvetica, Tahoma, sans-serif;
    font-size: 10pt;
    font-weight: bold;
    color: #596A92;
    background-color: #EFF0E0;
    background-image: url(/msdhsite/images/graphics/BoxTitleBGLined.gif);
    border-bottom: 1px solid #d8d8d8;
    padding-left: 0.5em; }

.textShading1 {
    background-color: #F8F8F4;
    color: #444444;
    border-bottom: none;
    border-right: none; }

.textShading2 {
    background-color: #F8F8F4;
    color: #303030; }

.outlined { background-color: #dddddd }

.outlined td { background-color: #ffffff }

.shaded {
    margin-top: 1em;
    padding: 8px 8px 8px 8px;
    background-color: #F3F3F3;
    border: 1px solid #dddddd; }

.bordered {
    border-right: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
    margin: 0 0 4px 8px; }

p.bold, span.bold {
    font-weight: bold;
    color: #333; }

p.bold { margin-bottom: 0.5em; }

.grayBold {
    font-weight: bold;
    color: #666; }

.lightGrayBold {
    font-weight: bold;
    color: #888; }

.grayText { color: #888 }

.lightGrayText { color: #999999 }

td.gray { color: #444444 }

#pageMenu ul {
    margin: 0 0 1em 0;
    padding: 0; }

#pageMenu ul li {
    list-style-type: none;
    margin: 0 1px 0 0;
    /*   display: block;*/
    float: left;
    text-align: center;
    padding: 4px 6px 4px 6px;
    background-image: url(/msdhsite/images/graphics/MenuButtonBGLined.gif);
    border-bottom: 1px solid #999999; }

#pageMenu #pageMenuDivider {
    clear: both;
    margin: 0 0 0.5em 0; }

#pageMenu a {
    color: #e3f0f4;
    text-decoration: none;
    font-weight: normal; }

#pageMenu a:hover {
    color: #224466;
    text-decoration: underline; }

.pageCount {
    font-size : 11px;
    font-family : Arial, Helvetica, Verdana, Geneva, sans-serif;
    color : #BDBDBD; }


/* ------------------------- */

li.rss-item { margin-bottom: 0.5em }

.rss-date {
    color: #999999;
    font-size: 9pt; }



A.red { color: #bb4444 }

A:visited.red {
    color: #bb4444;
    text-decoration: none; }

A:hover.red {
    color: #dd4444;
    text-decoration: underline; }


A.gray { color: #404040 }

A:visited.gray {
    color: #404040;
    text-decoration: none; }

A:hover.gray {
    color: #0000ff;
    text-decoration: none; }

A.lightGray { color: #777777 }

A:visited.lightGray {
    color: #777777;
    text-decoration: none; }

A:hover.lightGray {
    color: #0000ff;
    text-decoration: none; }

A.textLink, boxBody a.textLink, .textLinkContainer a { color: #333333 }

A:visited.textLink, .textLinkContainer a:visited {
    color: #222222;
    text-decoration: none; }

A:hover.textLink, .textLinkContainer a:hover {
    color: #00aacc;
    text-decoration: underline; }

A.titleLink { color: #444477 }

A:visited.titleLink {
    color: #444477;
    text-decoration: none; }

A:hover.titleLink {
    color: #a83012;
    text-decoration: underline; }

A.boldGray {
    color: #555555;
    font-weight: bold; }

A:visited.boldGray {
    color: #555555;
    text-decoration: none;
    font-weight: bold; }

A:hover.boldGray {
    color: #0000ff;
    text-decoration: none;
    font-weight: bold; }

A.menuLink {
    color: #ffffff;
    font-size: 10pt; }

A:visited.menuLink {
    color: #ddddff;
    text-decoration: none;
    font-size: 10pt; }

A:hover.menuLink {
    color: #222266;
    text-decoration: none;
    font-size: 10pt; }


A.bottomLink {
    color: #335588;
    font-weight: bold; }

A:visited.bottomLink {
    color: #4466aa;
    text-decoration: none;
    font-weight: bold; }

A:hover.bottomLink {
    color: #3333ff;
    text-decoration: none;
    font-weight: bold; }

A.Picks { color: #666699 }

A:visited.Picks {
    color: #777788;
    text-decoration: none; }

A:hover.Picks {
    color: #0000ff;
    text-decoration: none; }

table.menuBarTop td {
    padding: 6px 0 6px 0; }

td.bodyFooter table.menuBarTop td {
    padding: 4px 0 4px 0; }

A.pageBottom {
    color: #ddeeee;
    font-size: 11pt; }

A:visited.pageBottom {
    color: #ddeeee;
    text-decoration: none;
    font-size: 11pt; }

A:hover.pageBottom {
    color: #ffffff;
    text-decoration: underline;
    font-size: 11pt; }

/* a hidden link for quick access to the dynamic page from static ones */

#toDynamicPage { height: 4px; width: 4px; }

#toReviewer { height: 3px; width: 3px; float: right; }
#toAssetNow { height: 0px; width: 0px; } /* remove soon */

/* For content syndicated from the CDC via XHTML (not javascript) */

.syndicate .righty { float: right; margin: 0 0 1em 1em }

/* Public Services menu */

div.PublicServices ul { margin-left: 60px; }


/* Hotlines and toll-free numbers */

table#hotlinesTable td {
    padding: 0.25em;
    vertical-align: top;
}

/* STD-HIV Resource entries */

#HIVResourceForm label { display: block; color: #666;}
#HIVResourceForm input, #HIVResourceForm textarea, #HIVResourceForm select { background-color: #f4f4f4;  }
#HIVResourceForm div.formFieldsPadded input, #HIVResourceForm div.formFieldsPadded textarea, #HIVResourceForm div.formFieldsPadded select { margin-bottom: 1em }
#HIVResourceForm div.formLabelsPadded label { margin-top: 1em }
div.HIVResource { width: 660px }
div.HIVResource table { border-collapse: collapse;  }
div.HIVResource td { padding: 4px;  border: 1px solid #ccc}
div.HIVResource th { padding: 4px;  border: 1px solid #ccc; font-weight: normal }
div.HIVResource td.serviceType { font-weight: bold }
div.HIVResource p.serviceTableHeading { font-style: italic }

/* Farm-to-School lists */

#FarmForm input[type=text], #SchoolForm input[type=text] { width: 65%; min-width: 300px; }

.farmToSchool { background-color: #f8f8f8; padding: 10px; margin-bottom: 10px }
.farmCounty { background-color: white; float: right; margin: 0 0 1em 1em; padding: 0.25em}
.farmName { font-size: 16px; font-weight: bold; margin : 0 }
.daycareName { font-size: 16px; font-weight: bold; margin : 0 }
.farmLocation { margin-top: 0.5em; margin-bottom: 0 }
.farmContact { margin-top: 0.25em; margin-bottom: 0 }
.farmNotes { margin-top: 1em; margin-left: 1em }


/* County Offices */

ul.wicDistributionCenters { font-size: 90%; line-height: 150% }
ul.wicDistributionCenters li:first-line { font-weight: bold; font-size: 110%; }
.wicDistributionCenters span { color: #e80 }

/* Topics A-Z */

.topicsPageLetterSection { background-color: White; padding: 5px; margin-bottom: 10px }
.topicsPageLetterSection a { line-height: 200% }
.topicsPagePopularSection a { font-weight: bold }

p.topicLetter {
    float: right;
    font-size: 36px;
    font-weight: bold;
    color: #ddd;
    margin: 0.5em 0.5em 0 0; }

.letterLinks { background-color: #ccc }
.letterLinks a { padding: 2px 2px }
.letterLinks a:hover { background-color: #f4f4f4 }
.letterLinks td { border: 1px solid #ccc; background-color: white; text-align: center }
.letterLinks td:hover {background-color: #f4f4f4;  }

.letterLinksLarge  { text-align: center; background-color: white; border-bottom: 10px solid #f3f3f3 }
.letterLinksLarge a {
   background-color: white;
   font-weight: bold;
   font-size: 120%;
   width: 2em;
   height: 2em;
   border: 1px solid #ccc;
   float: left;
   padding-top: 0.5em
 }
.letterLinksLarge a:hover { background-color: #eee }

.searchTop { text-align: right; clear: both }

/* Admin page */

#AdminTable { border-width: 0; width: 100%; background-color: #f4f4f4 }
#AdminTable td { padding: 2px 1px 2px 1px; margin: 0 0 0 0; vertical-align: top }
#AdminTable td table { width: 100% }
#AdminTable td table td { padding: 0; margin: 0 }

/* ========= Just the Preconception Data page ============== */

/***********************************************************************************************************************
DOCUMENT: style/format.css
DEVELOPED BY: Ryan Stemkoski
COMPANY: Zipline Interactive
EMAIL: ryan@gozipline.com
PHONE: 509-321-2849
DATE: 2/26/2009
DESCRIPTION: This document contains the structural formatting files for the accordion style menu.
************************************************************************************************************************/

div.accordionButton {
	width: 100%;
	float: left;
	_float: none;  /* Float works in all browsers but IE6 */
	background-color: #f4f4f4;
	border-bottom: 2px solid #FFFFFF;
	cursor: pointer;
	font-weight:bold;
	height:30px;
	}

.accordionContent {
	width: 100%;
	float: left;
	_float: none; /* Float works in all browsers but IE6 */
	background-color: #f4f4f4;
	}


div.accordionContent div.accordionButton2 {
	width: 100%;
	float: left;
	_float: none;  /* Float works in all browsers but IE6 */
	background-color: #ebebeb;
	border-bottom: 2px solid #FFFFFF;
	cursor: pointer;
	}


div.accordionContent div.accordionContent2 {
	width: 100%;
	float: left;
	_float: none; /* Float works in all browsers but IE6 */
	background: #ebebeb;
	}



div.accordionContent div.accordionButton3 {
	width: 100%;
	float: left;
	_float: none;  /* Float works in all browsers but IE6 */
	background-color: #f4f4f4;
	border-bottom: 2px solid #FFFFFF;
	cursor: pointer;
	}

div.accordionContent div.accordionContent3 {
	width: 100%;
	float: left;
	_float: none; /* Float works in all browsers but IE6 */
	background-color: #e7f0f7;
	}

div.accordionButton div.level1 {
margin: 5px 0 5px 0.5em;
}


div.accordionContent div.level2  {
 margin: 5px 0 5px 2em;
 }

div.accordionContent div.level3 {
margin: 5px 5px 5px 3.5em;
}

div.accordionContent div.notAvailable { color: #999 }

div.accordionContent div.level4 { margin: 5px 0 5px 5em; }




/***********************************************************************************************************************
 EXTRA STYLES ADDED FOR MOUSEOVER / ACTIVE EVENTS
************************************************************************************************************************/

div.on {  }
div.over { color: #068; }
div.accordionContent div.on2 {  }
div.accordionContent div.over2 { color: #068; }
div.accordionContent div.on3 { background-color: #e7f0f7; }
div.accordionContent div.over3 { color: #068; }


/* ============= */

#mobileMenuSymbol {
   background-image: url(../theme/mobileMenuIcon.png);
   width: 27px;
   height: 23px;
   display: block;
   float: right;
   margin-top: -1px;
}

/* ============= */


@media only screen and (max-width: 950px)
{
   div.narrowScreenBreak { clear: both; }
   iframe.flexibleFrame { max-width: 380px }
   img { max-width: 100% }
}

@media screen and (max-width: 700px)
{
   #footer .box {width : 47% }
   #footer .thirdBox { clear: left; margin-left: 10px; width: 47%}
   #assetNow_pageOptionsButtons { float:right; margin-top: 10px; }
   #asetNow_pageOptions #reviewDate { float: none; }

   .threeColumnLeft , .threeColumnCenter , .threeColumnRight { float: none; width: 100%; margin-left: 0; margin-right: 0; margin-bottom: 1em}
   .modernStyleForm input, .modernStyleForm textarea, .modernStyleForm select { background-color: #f4f4f4;  max-width: 90% }

}

/* Drop the side navigation in favor of mobile-style accordion on the top */
@media screen and (max-width: 680px)
{
    #nav { float: none; width: auto; margin-right: 10px; }
    #navFiller { display: none; }
    #assetNow_mobileMenu { display: block }
    #assetNow_navMenuItems { display: none }
    #assetNow_menuButton { display: none }
    #assetNow_mobileMenuButton { display: block }
/*    .leftColumn, .leftColumnNarrow, .leftColumnWide, .rightColumn, .rightColumnNarrow, .rightColumnWide, .threeColumnLeft , .threeColumnCenter , .threeColumnRight, div.infoDeskColumn, div.boxBody, .sidebar, div.msdh .sidebar, div.ems .sidebar { float: none; width: 100%; margin-left: 0; margin-right: 0; } */
    div.infoDeskColumn { padding-left: 0 }
    td.menuButton, td.menuButtonLeft { display: block; width: auto; margin-bottom: 1px; }

    div.PublicServices ul { margin-left: 1em; padding-left: 0 }
    div.PublicServices img { float: none; }

    iframe.flexibleFrame, textarea, input { max-width: 400px }

   .toolkitButton { float: none; margin: 0 0 0.5em 0; width: 35% }

    #popupBox p { color: white; font-size: 200%; line-height: 130% }
    #popupBox h3 { color: #CCFFCC; font-size: 250% }

   #scopedByScopedPolyfill_1 { display: none} /* DIV enclsoing GovDelivery slide-up newsletter prompt */

   #newsletterSignup {
      font-family: "Futura", "Avenir","Century Gothic", sans-serif;
      font-size: 22px;
      margin-left: 3%;
      margin-top: 10px;
      display: block;
    }

   #newsletterSignup p, #newsletterSignup span { color: #789b58; margin-top: 0; margin-bottom: 8px; line-height: 120%}
   #newsletterSignup .light { color: #777777; }
   #newsletterSignup .smaller { font-size: 18px }
   #newsletterSignup .colored { color: #789b58; }
   #newsletterSignup .emphasized { color: #a80; font-weight: 600 } /* #688b88;  */
   #newsletterSignup button  {  color: white;  background-color: #789b58;  font-weight: bold; border-style: none;  padding: 4px 7px 5px 7px; line-height : 18px; vertical-align: middle; margin-top: 4px}
   #newsletterSignup input { color: #888; border: solid 1px #ddd; font-size: 14px; width: 75%; }
   #newsletterSignup select { color: #888; font-size: 14px; border-color: #ddd; margin-bottom: 10px }

   .mobileOnly { display: block }
   .desktopOnly { display: none}

   #assetNow_pageSubtitle { clear: both }
}

/* collapse columns and sidebars */
@media screen and (max-width: 550px)
{
   .leftColumn, .leftColumnNarrow, .leftColumnWide, .rightColumn, .rightColumnNarrow, .rightColumnWide, div.infoDeskColumn, div.boxBody, .sidebar, div.msdh .sidebar, div.ems .sidebar, input, textarea { float: none; width: 100%; margin-left: 0; margin-right: 0; margin-bottom: 1em}
   .sidebar, div.msdh .sidebar, div.ems .sidebar { margin-top: 10px }
   .disappearing { display: none }
   .floatRight { float: none; margin-left: 0 }
   h2 { font-size: 24px }
   .msdh aside { margin-left: 5% }
 }

@media screen and (max-width: 410px)
{
    img.leadImage { float: none; margin-right: 0; max-width: 300px }
    iframe.flexibleFrame, textarea, input { max-width: 300px }
   .toolkitButton { width: 75% }
   dl.horizontal dt,  dl.horizontal dd { float: none; display: block}
   table.simpleTableMobileSmaller { font-size: 80% }
   
   /* Hotlines and toll-free numbers */
      table#hotlinesTable td {
       padding: 0.4em 0.25em 0.4em 0.25em;
       vertical-align: top;
       }
}