﻿/*

Blue
hex code: #0C4B8C
rgb code (red, green, blue): 12, 75, 140

Light Blue
hex code: #D6EAFF
rgb code: 214, 234, 255

Gold
hex code: #e7a817
rgb code: 231, 168, 23

Warning Amber
hex code: #f2dc96;
rgb code: 242, 220, 150

Light Warning Color

*/

* {
  --nhaPrimCol: #0c4bbc; /*blue*/
  --nhaSecCol: #e7a817; /*gold*/
  --nhaWarnCol: #f2dc96; /*amber*/
  --nhaLightWarnCol: #fff5d8; /*light amber*/
}

a:link {
  text-decoration: none !important;
}

iframe {
  max-width: 100%;
}

/*  This code removes the google translate bar from the top of the screen since it's redundant   */
.goog-te-banner-frame.skiptranslate {
  display: none !important;
}

#google_translate_element * {
  font-size: 18px;
}

.gtButton {
  font-size: 18px;
  margin: 4px 0;
  border: 1px solid #e5e7e9;
  border-radius: 20px;
  outline: none;
  padding: 5px;
}

.featured-box .featured-box-text-left {
  display: none !important;
}

body {
  top: 0px !important;
}

/*    End google translate fix                                                                   */

.featured-box {
  display: none !important;
}

.portraitWarning {
  display: none;
  text-align: center;
  background-color: Var(--nhaWarnCol);
}

.portraitWarning img {
  width: 200px;
}

.portraitWarning h1 {
  color: var(--nhaPrimCol);
  font-size: 20px;
}

/*                                                      Home Page CSS Fixes                                           */
body {
  margin-left: 4px;
  margin-right: 4px;
  /*background-color: #d6eaff; /*               This is so we know this is the test page                          */
}

.nhaFourth {
  width: 22%;
  float: left;
  margin-left: 1.5%;
  margin-bottom: 10px;
  min-height: 125px;
}

.nhaThird {
  width: 31%;
  float: left;
  margin-left: 1.5%;
  margin-bottom: 10px;
  min-height: 125px;
}

.nhaHalf {
  width: 48%;
  float: left;
  margin-left: 1.5%;
  margin-bottom: 10px;
  min-height: 125px;
}

.nhaCenter {
  margin: 0 auto;
}

.indent {
  padding-left: 40px;
}

.btn-warning {
  float: left;
  text-align: center;
  margin: 10px 5px 0 5px;
}

.heading-primary {
  display: none;
}

.middleTiles {
  height: 250px;
}

.call-to-action.middleTilesSide {
  border: 1px solid black;
  //box-shadow: 0 2px 1px 0 rgba(0,0,0,.04);
  -moz-box-shadow: inset 0 0 5px #0c4b8c;
  -webkit-box-shadow: inset 0 0 5px #0c4b8c;
  box-shadow: inset 0 0 5px #0c4b8c;
}

#LiveSlider447 {
  border: 2px solid #0c4b8c;
  border-radius: 5px;
}

/*=====================================================================================================================*/

/*                                                      IMPORTANT NOTICES AND HOUSING NEWS                            */
/*
#notices {
    height: 250px;
    max-width: 30%;
    background-color: lightgray;
    float: left;
    overflow-y: scroll;
    margin-bottom: 30px;
    padding-top: 5px;
}
*/
#homeMainContainer {
  display: flex;
  justify-content: space-around;
}

/*                                                         Hidden facebook settings                               */
#facebook-div-mobile {
  display: none;
  width: 49%;
  height: 500px;
  float: left;
}

.fbPage {
  height: 100%;
  width: 100%;
}

.expandBadge {
  font-weight: bolder;
  font-size: 100%;
  color: #0c4b8c;
  background-color: #999;
}

.highlights {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  flex-wrap: wrap;
  color: white;
}

.highlightBox {
  border: 1px solid silver;
  border-radius: 5px;
  width: 47%;
  height: auto;
  float: left;
  min-height: 10rem;
  text-align: center;
  min-width: unset;
  margin: 10px 0;
  color: white;
  overflow: hidden;
  max-height: 200px;
}

.highlightBox h4 {
  color: white;
}

.highlightBox p {
  color: white;
}

.highlightBox:hover {
  border: 1px solid #e7a817;
  color: #e7a817;
}

.highlightBox:hover h4 {
  color: #e7a817;
  transition: 1s;
}

.col-md-8 .impMenu .menuHeader {
  font-size: 1.3rem;
}

.col-md-4 .impMenu .menuHeader {
  font-size: 1.3rem;
}

.col-sm-8 .impMenu .menuHeader {
  font-size: 1.3rem;
}

.col-sm-4 .impMenu .menuHeader {
  font-size: 1.3rem;
}

/*=====================================================================================================================*/
/*                                                              NEWS ITEMS                                            */

#highlightBox1 {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url("/portals/0/vcirilo.png");
  background-size: cover;
}

#highlightBox2 {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url("/portals/0/Images/home/Meet%20the%20Board.jpg?ver=2018-03-08-172636-503&timestamp=1520865815146");
  background-size: cover;
}

#highlightBox3 {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url("/portals/0/Images/home/security 2.jpg?ver=2018-03-08-173011-730");
  background-size: cover;
}

#highlightBox4 {
  background-color: #4171af;
  position: relative;
}

#highlightBox5 {
  display: none;
  background-image: url("/Portals/0/Images/NHASF/Front Cover.jpg");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #c8bb2e;
}

.highlights .highlightBox a {
  color: white;
}

/*                                                              NEWS SETTINGS                                         */
#news {
  width: 49%;
  min-width: 180px;
  min-height: 520px;
  margin-left: 1.5%;
  float: left;
  background-color: #cfc;
  display: flex;
  justify-content: space-around;
  flex-flow: row wrap;
  text-align: center;
  background-color: #eee;
  border-radius: 10px;
  overflow: hidden;
  text-align: center;
  align-items: center;
  align-content: center;
  padding: 0;
  border: 1px solid silver;
}

.newsHeader {
  border-radius: 5px;
  background-color: #0c4b8c;
  color: #e7a817;
  width: 100%;
  height: 40px;
  text-align: center;
  padding-top: 10px;
}

.newsHeader h3 {
  color: white;
}

#newsContainer {
  width: 100%;
  min-height: 480px;
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  color: #000;
  padding: 0 5px 0 5px;
}

.newsItem {
  border: 1px solid silver;
  display: block;
  border-radius: 5px;
  width: 46%; /*235px*/
  height: 215px;
  margin-top: 10px;
  float: left;
  text-align: center;
  min-width: 180px;
}

.newsItem h4 {
  color: white;
}

.newsItem p {
  color: white;
}

.newsItem:hover {
  border: 1px solid #e7a817;
  color: #e7a817;
}

.newsItem:hover h4 {
  color: #e7a817;
  transition: 1s;
}

/*=====================================================================================================================*/
/*                                                              NEWS ITEMS                                            */

#newsItem1 {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url("/portals/0/vcirilo.png");
  background-size: cover;
}

#newsItem2 {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url("/portals/0/Images/home/Meet%20the%20Board.jpg?ver=2018-03-08-172636-503&timestamp=1520865815146");
  background-size: cover;
}

#newsItem3 {
  /*background: linear-gradient( rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4) ), url("/portals/0/Images/home/security 2.jpg?ver=2018-03-08-173011-730");
      background-size: cover;
    */
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url("/Portals/1/nhasf images/Golf icon.png?ver=2019-05-22-173821-787");
  background-size: contain;
}

#newsItem4 {
  /*background: linear-gradient( rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4) ), url("/portals/0/Images/rad/SUN.jpg?ver=2018-07-20-155522-307");
    background-size: cover;
        */
  background-color: #4171af;
  position: relative;
}

#newsItem5 {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url("http://media.nj.com/njv_mark_diionno/photo/10409023-large.jpg");
  background-size: cover;
}

#newsItem6 {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url("http://media.nj.com/essex_impact/photo/2017/02/06/queen1%20ga0130barcol%20REMNICK.JPG");
  background-size: cover;
}

/*                                                          DIRECTORS MESSAGE SECTION                                 */
#messageHeader {
  background-color: #0c4bbc;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  margin-bottom: 3px;
  border: 1px solid silver;
}

#messageHeader h2 {
  margin: 0 auto;
}

#innerMessage {
  background-color: #d6eaff;
  border: 1px solid silver;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  padding: 30px;
}

#message h2 {
  color: #e7a817;
}

.legalIcon {
  height: 50px;
  margin-left: 10px;
}

/*=====================================================================================================================*/

/*                                                          important links settings                                 */
.vertical-menu a.active {
  background-color: #0c4b8c;
  -moz-border-radius-topleft: 10px;
  -moz-border-radius-topright: 10px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

#sideMenu {
  width: 24%;
  min-width: 200px;
  min-height: 520px;
  float: left;
  border-radius: 5px;
  border: 1px solid silver;
  padding: 0;
  background-color: #eee;
  margin-bottom: 20px;
}

/*=====================================================================================================================*/

/*                                                          Portfolio settings                                      */
.tabs-vertical {
  display: block;
  padding: 5px;
  border-radius: 5px;
  background-color: var(--nhaWarnCol);
}

/*  This line below is like my greatest achievement!  
    Thats what I had to select just to get the tab thats currently selected*/
.nav.nav-tabs.col-sm-3 li.active a {
  background-color: #0c4b8c;
  color: #e7a817;
}

.vertical-menu {
  min-width: 250px; /* Set a width if you like */
  width: 20%;
}

.nhaTabPane {
  max-width: 100%;
  text-align: center;
}

.nhaTabPane * {
  max-width: 99%;
}

.nhaTabContent {
  width: 70%;
}

.nhaTabContent p {
  color: black;
}

.nhaTabContent img {
  width: 50%;
}

.nhaTabContent h4 {
  background-color: lightgray;
  color: black;
  border: 1px solid #333;
  border-radius: 5px;
  margin: 5px 0 5px 0;
}

.nhaTabContent h3 {
  background-color: #aaa;
  padding: 5px;
  color: var(--nhaPrimCol);
  border-radius: 5px;
  border: 2px solid #667;
  margin-bottom: 10px;
}

.nhaOffice {
  display: table-cell;
  border: 1px solid #ccc;
  min-height: 175px;
  float: left;
  background-color: lightgray;
  color: #333;
}

.nhaOffice h3 {
  font-size: 20px;
  background-color: #333;
  margin-bottom: 10px;
  padding: 0;
  color: lightgray;
}

.nhaOffice p {
  float: left;
  width: 50%;
  line-height: 1px;
}

hr.office {
  background-image: none;
  background-color: gray;
  height: 1px;
  margin-left: 15px;
  margin-right: 15px;
}

.nhaOfficeWrap {
  display: inline-block;
  text-align: center;
}

.unitChart {
  background-color: lightgray;
  float: left;
  min-height: 175px;
}

.unitChart h3 {
  background-color: #333;
  color: lightgray;
  margin-bottom: 10px;
  font-size: 20px;
  padding: 0;
}

.unitChart p {
  float: left;
  width: 50%;
  line-height: 1px;
}

.nhaVerticalTabs {
  min-width: 250px;
}

.vertical-menu a {
  background-color: #eee; /* Grey background color */
  color: black; /* Black text color */
  display: block; /* Make the links appear below each other */
  padding: 12px; /* Add some padding */
  text-decoration: none; /* Remove underline from links */
}

.vertical-menu a:hover {
  background-color: #ccc; /* Dark grey background on mouse-over */
}

.vertical-menu a.active {
  //background-color: #4c67af; /* Add a green color to the "active/current" link */
  color: white;
}

.nhaPortfolioDiv {
  background-color: #ccc;
  color: black;
  padding: 5px 0;
  overflow: hidden;
  width: 100%;
}

/*=====================================================================================================================*/

/*                                                          Nycha Boxes settings                                     */

.nychaBoxContainer {
  width: 100%;
  height: 430px;
  border: 1px solid silver;
  border-radius: 5px;
  display: block;
  float: left;
  padding: 5px;
  position: relative;
  margin-bottom: 2rem;
}

.nychaBoxTop {
  width: 90%;
  height: 200px;
  float: left;
  display: block;
  margin-left: auto;
  margin-right: auto;
  position: absolute;
  left: 0;
  right: 0;
  border: 1px solid #eee;
  margin-top: 5px;
  margin-bottom: 5px;
  border-radius: 10px;
  -webkit-box-shadow: inset 0px 0px 5px 0px rgba(51, 51, 51, 1);
  -moz-box-shadow: inset 0px 0px 5px 0px rgba(51, 51, 51, 1);
  box-shadow: inset 0px 0px 5px 0px rgba(51, 51, 51, 1);
}

.nychaBoxBottom {
  width: 90%;
  height: 200px;
  margin-left: auto;
  margin-right: auto;
  position: absolute;
  bottom: 10px;
  left: 0;
  right: 0;
  float: left;
  background-color: #eee;
  display: block;
  vertical-align: middle;
  padding: 5px 10px 10px 10px;
  color: #0c4bbc;
  text-align: center;
  border: 1px solid silver;
}

.nychaBoxBottom p {
  color: #0c4bbc;
  font-size: 20px;
}

.nychaBoxContainer:hover {
  border: 1px solid #e7a817;
  -webkit-box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
  -moz-box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
  box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
  transition: 0.3s;
}

.nychaBoxContainer:hover p {
  color: #e7a817;
}

#nychaImg1 {
  background-image: url("/portals/0/Images/home/landlordTenant.jpg");
  background-size: cover;
}

#nychaImg2 {
  background-image: url("/portals/0/Images/home/scholarhip.jpg");
  background-size: cover;
}

#nychaImg3 {
  background-image: url("/portals/0/Images/home/Customer%20Service.jpg?ver=2018-03-08-172602-313&timestamp=1520867462885");
  background-size: cover;
}

#nychaImg4 {
  background-image: url("/portals/0/Images/home/Check%20your%20Status.jpg?ver=2018-03-08-172701-737&timestamp=1520865929650");
  background-size: cover;
}

.nychaBoxButton {
  position: absolute;
  bottom: 15px;
  margin-left: 15%;
  margin-right: 15%;
  right: 0;
  left: 0;
}

#dnn_ctr487_ContentPane {
  border: 1px solid silver;
  height: 430px;
  border-radius: 10px;
  margin: 0 auto;
}

#shortcutBox {
  display: block;
  /*justify-content: space-between;*/
}

#footerIconsContainer {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.footerIcons {
  float: left;
  margin-right: 15px;
  height: 40px;
  width: auto;
}

.splitBox {
  width: 50%;
  float: left;
}

.impLinks {
  color: white;
  font-size: 23px;
  text-align: center;
  margin: 0;
  padding: 0px;
}

.impLinksDiv {
  float: left;
  width: 100%;
  margin: 0;
}

.impLinks.active {
  background-color: #0c4bbc;
}

.impMenu {
  width: 100%;
  height: 100%;
  border: 1px solid silver;
  border-radius: 10px;
  overflow: hidden;
  display: flex !important;
  flex-flow: column;
}

.impMenu ul li a:visited {
  color: black;
}

.newsItem a {
  color: white;
  text-decoration: none;
}

.newsItem h4 a {
  color: white;
  text-decoration: none;
}

.newsItem p a {
  color: white;
  text-decoration: none;
}

.DnnModule-LiveSlider {
  border: 2px solid #0c4bbc;
  border-radius: 10px;
  padding: 0;
  margin-bottom: 10px;
}

#dnn_ContentPaneFull .clearfix {
  display: none;
}

#login {
  display: none;
}

.menuHeader {
  min-height: 3rem;
  text-align: center;
  width: 100%;
  background-color: #0c4b8c;
  color: white;
  font-size: 1.6rem;
  padding: 1rem;
}

.menuBody {
  width: 100%;
  background-color: #eee;
  color: black;
  font-size: 1rem;
  flex: 1 1 auto;
}

.menuBody ul {
  list-style: none;
  padding: 0;
}

.menuBody ul li {
  padding: 0.5rem;
  text-decoration: none;
  float: left;
  width: 100%;
  display: flex;
}

.menuBody ul li:hover > ul {
  display: block;
  -webkit-transition: left 200ms ease-in;
  -moz-transition: left 200ms ease-in;
  -ms-transition: left 200ms ease-in;
  transition: left 200ms ease-in;
}

.menuBody ul li > ul {
  position: absolute;
  left: 100%;
  background-color: #eee;
  display: none;
  min-width: 100%;
  z-index: 1000;
  margin-top: -0.5rem;
  margin-left: -1rem;
  -webkit-box-shadow: 5px 10px 30px 2px rgba(0, 0, 0, 0.5);
  box-shadow: 5px 10px 30px 2px rgba(0, 0, 0, 0.5);
}

.menuBody a {
  color: black;
  text-decoration: none;
}

.menuBody ul li:hover {
  background-color: #ddd;
}

.badge {
  margin-right: 0.5rem;
}

.badgeIcon {
}

.ui-dialog > .ui-widget-header {
  background: #0c4bbc;
  color: #fff;
}

.ui-widget-overlay.custom-overlay {
  background-color: black;
  background-image: none;
  opacity: 0.9;
}

/*                                Director pages css ID Card stuff                                */
.rowFix {
  margin-left: 0px;
  text-align: center;
}

.idCard {
  //float: left;
  justify-content: center;
  display: inline-block;
  width: 260px;
  //margin: 15px 45px 15px 45px;
  margin: 15px 10px 15px 5px;
  text-align: center;
  overflow: hidden;
  text-decoration: none;
  border-radius: 10px;
  border: 1px solid white;
}

.idCard:hover {
  //border: 1px solid #e7a817;
  -webkit-box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
  -moz-box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
  box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
  transition: 0.1s;
}

a:hover {
  text-decoration: none;
}

.idCard img {
  width: 100%;
}

.idCardText {
  background-color: #a9a9a9;
  height: 105px;
  margin-top: 5px;
  border-top: #fff;
}

.idCardText h3 {
  margin: 0;
  height: 30%;
  padding-top: 5px;
  color: #0c4bbc;
  font-size: 20px;
}

.idCardText h4 {
  margin-top: 10px;
  background-color: #333333;
  width: 100%;
  height: 60%;
  padding-top: 5px;
  color: darkgray;
}

.nhaConatiner {
  display: flex;
  justify-content: space-around;
  align-items: center;
  text-align: center;
}

.directorPage {
  margin-top: 30px;
  font-size: 17px;
  display: block;
  padding: 3% 10% 3% 5%;
  border: 1px solid #e7a817;
  min-height: 535px;
  height: 100%;
  border-radius: 5px;
  //background-color: #eeeeee;
  background-color: #eeedd6;
}

.directorPage p {
  font-size: 17px;
  padding: 10px 0 10px 295px;
  color: black;
  text-indent: 50px;
}

.idCardText a {
  color: inherit;
}

.idCardText a:visited {
  color: inherit;
}

.directorPage h4 {
  font-size: 20px;
}

#dialog-message {
  width: 40%;
  min-width: 300px;
}

/*                                  Board of commissioners code                                  */

.comishContainerTop {
  height: 700px;
}

.comishContainer {
  background-color: #eeedd6;
  border: 1px solid gold;
  padding: 15px;
  border-radius: 5px;
  margin: 10px;
  width: 48%;
  min-width: 471px;
  float: left;
  min-height: 635px;
  text-align: center;
}

.comishContainer h4 {
  background-color: #333;
  color: silver;
  margin-top: 5px;
  padding-left: 10px;
}

.comishContainer:hover h4 {
  background: linear-gradient(to right, #333, #f2dc96);
  color: white;
}

.comishContainer:hover {
  -webkit-box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
  -moz-box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
  box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
  transition: 0.5s;
}

.comishContainer p {
  text-align: justify;
}

.comishImg {
  height: 300px;
  width: auto;
  border: 1px solid gold;
  border-radius: 5px;
}

comishContainer:hover comishImg {
  //border: 1px solid #e7a817;
}

.longComishContainer {
  height: 734px;
}
/*                              end of board of commissioners code                            */

/*    =================================Blog Post Code=========================================*/

.nhaLogo {
  height: 80px;
  border: 2px solid var(--nhaPrimCol);
  border-radius: 5px;
  padding: 8px;
  margin: 0 25px;
  background-color: #ffffff;
}

.nhaBlogPost {
  width: 100%;
  min-height: 400px;
  padding: 5px;
}

.nhaBlogPostTop {
  height: 100px;
  border-radius: 5px;
  background-color: #ccc;
  margin-bottom: 10px;
  padding: 10px 15px;
  color: white;
}

.nhaBlogPostTop * {
  float: left;
}

.nhaBlogPostTop h3 {
  color: var(--nhaPrimCol);
  font-size: 25px;
  font-weight: bold;
  text-shadow: 2px 2px darkgray;
  margin: 5px 15px;
  float: none;
}

.nhaBlogPostTop h4 {
  display: block;
  float: none;
  color: #333;
  font-size: 15px;
  font-weight: bold;
  margin: 0 auto;
  line-height: 17px;
}

.nhaBlogPostBottom {
  margin-bottom: 5px;
  border-radius: 5px;
  min-height: 285px;
  background-color: var(--nhaWarnCol);
  padding: 10px 15px;
}

.nhaBlogPostBottom p {
  color: #333;
  font-size: 16px;
}

.nhaBlogImg {
  width: 50%;
  margin: 15px 25% 15px 25%;
}

/*    ==================================End of Blog Post Code=================================*/
/*                              extra css to add responsive design to middle stuff               */
#facebook-div {
  width: 24%;
  margin-left: 1%;
  min-height: 520px;
  float: right;
  //background-color: #ccf;
  background-image: url("/home/portals/0/Images/nhaLoading.gif");
  background-repeat: no-repeat;
  background-position: center;
}

.impNoticeTop {
  border: 2px solid #0c4bbc;
  border-radius: 10px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  width: 100%;
  height: auto;
  text-align: center;
  background-color: #f2dc96;
  overflow: hidden;
}
.impNoticeHeading {
  background-color: #ccc;
  border: 1px solid #0c4bbc;
  border-radius: 5px;
  color: #0c4bbc;
  font-weight: bold;
}

.impNoticeHead {
  background-color: #ccc;
  border: 1px solid #0c4bbc;
  border-radius: 7px 0 0 0;
  color: #0c4bbc;
  font-weight: bold;
  float: left;
  height: 30px;
  overflow: hidden;
  width: calc(100% - 50px);
}

.impNoticeHead h4 {
  color: #0c4bbc;
  font-weight: bold;
}

.impNoticeHeadClose {
  background-color: #333;
  border: 1px solid #0c4bbc;
  border-radius: 0 5px 0 0;
  color: #0c4bbc;
  float: left;
  width: 50px;
  height: 30px;
  display: block;
  line-height: 30px;
  color: #0c4bbc;
  font-size: 20px;
}

.impNoticeHeadClose:hover {
  background-color: #595858;
  line-height: 27px;
  font-size: 22px;
}

.impNoticeHead:hover + .impNoticeHeadClose {
  background-color: #595858;
  line-height: 27px;
  font-size: 22px;
}

.impNoticeP {
  color: black;
  padding: 20px;
}

.impNoticeContent {
  color: black;
  border: 2px solid #0c4bbc;
  width: 100%;
  height: auto;
  min-height: 150px;
  text-align: center;
  border-radius: 10px;
  border-top: 0;
  background-color: #f2dc96;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  margin-bottom: 20px;
}

.impNoticeContent img {
  width: 100%;
}

.white {
  background-color: white;
}

/*  ---------------------=========================================== RAD Landing Page and stuff   ==========================-----------------------------------------------------*/
#nhaWrapper {
  width: 100%;
  height: 100%;
  display: block;
}

#nhaHeader {
  width: 100%;
  height: 200px;
  background-color: #4171af;
  text-align: center;
}

#nhaFooter {
  width: 100%;
  height: 50px;
  background-color: #000;
  text-align: center;
  color: white;
}

#nhaBody {
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
}

.nhaColumn {
  float: left;
  min-height: 1000px;
  border-radius: 10px;
  text-align: center;
  margin: 5px;
  margin-top: 20px;
  display: flex;
  flex-direction: column;
}

.nhaCenterCol {
  width: 70%;
}

.nhaSide {
  width: 20%;
}

.nhaSideRight {
  width: 10%;
}

/* Parent container for important links*/
#nhaLeft {
  height: auto;
  width: 100%;
  border: 1px solid silver;
  background-color: #eee;
  border-radius: 10px;
  margin-bottom: 20px;
}

/* UL immediately inside important links div*/
#nhaLeft ul {
  padding: 0;
  margin: 0;
}
/* Menu items inside ul*/
#nhaLeft ul li {
  padding: 12px;
  text-decoration: none;
  font-size: 20px;
  font-size: 17px;
  width: 100%;
  position: relative;
  height: 55px;
}

/* When hovering over a menu item with sub ul, show it*/
#nhaLeft ul li:hover ul {
  display: block;
}

/* Sub-menu items ul*/
#nhaLeft ul li ul {
  display: none;
  -moz-border-radius-topright: 5px;
  -moz-border-radius-bottomright: 5px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  width: 100%;
  padding: 0;
  float: left;
  position: absolute;
  top: 0;
  right: -100%;
  background-color: rgba(238, 238, 238, 0.9);
  border: 1px solid silver;
  overflow: hidden;
}

/* Sub-menu item itself */
#nhaLeft ul li ul li {
  position: relative;
  padding: 12px;
  float: left;
  text-decoration: none;
  font-size: 20px;
  font-size: 17px;
  width: 100%;
  height: 55px;
}

/* Links inside sub-menu li*/
#nhaLeft ul li a {
  width: 100%;
  height: 100%;
  text-decoration: none;
  position: absolute;
  top: 0;
  left: 0;
  line-height: 20px;
  padding-top: 15px;
}

/* Stye any links inside div all the way down to child elements */
#nhaLeft a:hover {
  background-color: #ccc;
  color: #0c4bbc;
}

.nhaCenterContent {
  min-height: 200px;
  width: 100%;
  background-color: #eee;
  display: block;
  border-radius: 10px;
  border: 1px solid silver;
  overflow: hidden;
  margin-bottom: 20px;
}

.nhaHeading {
  background-color: #0c4b8c;
  color: white;
  height: 35px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  font-size: 25px;
  padding-top: 0.5%;
  text-align: center;
  font-weight: 600;
}

.nhaCenterContentBody {
  color: black;
  background-color: white;
  min-height: 165px;
  display: block;
  padding: 10px;
  padding-bottom: 1px;
}

.nhaRightLink {
  background-color: #fcfcfc;
  border: 2px solid silver;
  border-radius: 10px;
  padding: 10px;
  width: 100%;
  min-height: 120px;
  margin-bottom: 20px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  font-size: 25px;
  color: #0c4bbc;
}

.nhaRightLink img {
  height: 100px;
}

.nhaRightLink:hover {
  transition: 0.3s;
  -webkit-box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
  -moz-box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
  box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
}

.newsListing {
  border: 1px solid silver;
  border-radius: 5px;
  padding: 5px;
  width: 100%;
  display: block;
  overflow: hidden;
  margin-bottom: 20px;
  background-color: #eee;
}

.newsListingThumbnail {
  float: left;
  width: 25%;
  border: 1px;
  overflow: hidden;
  border-radius: 5px;
  margin-top: 10px;
}

.newsListingThumbnail:hover {
  transition: 0.3s;
  -webkit-box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
  -moz-box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
  box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
}

.newsListingThumbnail img {
  max-width: 100%;
  border: 1px solid silver;
}

.newsListingArticle {
  float: left;
  width: 75%;
  text-align: left;
  padding: 10px;
}

.newsListingArticle h4 {
  padding: 5px;
  border-radius: 5px;
  background-color: #ccc;
  border: 1px solid silver;
}

.newsListingArticle h4:hover {
  border-color: #0c4bbc;
}

/*=--------------------------------------------------------========================== RAD Landing Page end   -===================================----------------*/

/*===============--------------------Photo Gallery CSS   ---------------------=====*/
.nhaFlexDiv {
  display: flex;
  height: auto;
  text-align: center;
  flex-wrap: wrap;
  overflow: hidden;
  justify-content: center;
}

.nhaFlexDiv h3 {
  font-family: Open Sans;
  color: #0a3f75;
  width: 100%;
  font-weight: 600;
}

.galleryBox {
  height: 200px;
  width: 300px;
  border: 3px solid #0c4bbc;
  border-radius: 10px;
  position: relative;
  background-color: #fff;
  text-align: center;
  padding: 5px;
  margin: 10px;
  float: left;
  overflow: hidden;
}

.galleryBox img {
  height: 100%;
  margin: 0 auto;
}

.galleryBoxCover {
  height: 100%;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.3);
  position: absolute;
  top: 0;
  left: 0;
}

.galleryBoxCover h3 {
  padding-top: 10px;
  color: #fff;
  font-weight: normal;
}

.galleryBoxCover h4 {
  padding-top: 10px;
  color: #fff;
  font-weight: normal;
}

.galleryBox:hover {
  transition: 0.3s;
  padding: 0;
  border-color: #fff;
  height: 250px;
  width: 350px;
  -webkit-box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
  -moz-box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
  box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 1);
}

/*===============--------------------End Photo Gallery CSS   ---------------------=====*/

/*======================------------------RAD Original Page CSS --------------------=================*/
.nhaFAQContent {
  padding: 30px;
}

.nhaIndent {
  margin-left: 30px;
}

.nhaFAQContent h2 {
  text-align: center;
  font-weight: bold;
  color: var(--nhaPrimCol);
}

.nhaFAQContent p {
  color: black;
}

.divParagraph {
  display: block;
}

.divParagraph p {
  color: black;
}

.nhaFAQContent h4 {
  font-weight: bold;
  color: black;
}

.imgWCaption {
  width: 300px;
  text-align: center;
  margin: 5px 10px 0 5px;
}

.imgWCaption img {
  height: 200px;
  max-width: 100%;
}

.caption {
  color: black;
  font-size: 12px;
  width: 100%;
  line-height: 13px;
  margin-top: 5px;
  font-style: italic;
}

.slimCaption {
  width: 185px;
  margin: 0 auto;
}
/*==========================----------------------------End RAD Old page code -------------==============*/

/*==========================----------------------------Facebook Live Feed Code -------------==============*/
.impNoticeContent {
  padding: 1rem;
}
.posterBox {
  margin: 5rem;
}

.impNoticeContent .row {
  margin-right: 0 !important;
}

.impNoticeContent .col-xs-12 {
  margin: 0.5rem 0;
}

.impNoticeContent .row .col p {
  color: black;
}

#embed_iframe {
  width: 500px;
  height: 275px;
  overflow: hidden;
  border: none;
}

#iframe_container {
  display: block;
  margin: 0 auto;
  text-align: center;
}

/*==========================----------------------------Facebook Live Feed Code -------------==============*/
@media only screen and (max-width: 1200px) {
  .idCard {
    width: 305px;
  }
}

@media only screen and (max-width: 1180px) {
  #facebook-div {
    display: none;
  }

  #sideMenu {
    width: 24%;
  }

  #news {
    width: 75%;
  }

  .comishContainer {
    width: 75%;
    float: none;
    margin: 0 auto;
    margin-bottom: 20px;
  }
}

@media only screen and (max-width: 995px) {
  #facebook-div {
    display: none;
  }

  #sideMenu {
    width: 25%;
  }

  #news {
    width: 70%;
    min-width: 100px;
  }

  .comishContainer {
    width: 75%;
    float: none;
    margin: 0 auto;
    margin-bottom: 20px;
  }
}

@media only screen and (max-width: 820px) {
  #google_translate_element {
    overflow: hidden;
    width: 150px;
    font-size: 15px;
  }
  .nhaThird {
    font-size: 11px;
    width: 100%;
  }

  .nhaThird p {
    font-size: 11px;
  }

  .nhaThird h3 {
    font-size: 10px;
  }

  .nhaTabContent h3 {
    font-size: 13px;
    padding: 0;
  }

  .nhaTabContent p {
    font-size: 12px;
  }

  .nhaTabContent h4 {
    font-size: 12px;
  }

  .nhaTabTabPane h3 {
    font-size: 12px;
    padding: 0;
  }

  .nhaHalf h3 {
    font-size: 12px;
  }

  .vertical-menu {
    min-width: 100px;
  }

  #facebook-div {
    display: none;
  }

  #facebook-div-mobile {
    margin: 0 auto;
    width: 49%;
    display: block;
  }

  #sideMenu {
    width: 100%;
    min-height: 100%;
    margin: 0 auto;
    margin-bottom: 20px;
    text-align: center;
  }

  #news {
    width: 100%;
    min-width: 180px;
    margin: 0 auto;
    margin: 0 auto;
  }

  .comishContainer {
    float: none;
    margin: 0 auto;
    margin-bottom: 20px;
  }
}

@media only screen and (max-width: 600px) {
  #facebook-div {
    display: none;
  }

  #facebook-div-mobile {
    width: 100%;
    display: block;
    margin: 0 auto;
  }

  #embed_iframe {
    width: 400px;
    height: 225px;
  }

  #news {
    width: 100%;
    margin: 0 auto;
  }

  .DnnModule-LiveSlider {
    display: none;
  }

  .idCard {
    width: 100%;
  }

  .comishContainer {
    min-width: 300px;
    width: 100%;
    height: auto;
    min-height: 300px;
    overflow: auto;
  }

  .menuBody ul li {
    padding: 0.5rem 0.1rem;
    display: flex;
    flex-direction: column;
    position: relative;
  }

  .menuBody ul li > ul {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 0;
    margin: 0;
    position: relative;
    left: 0;
    -webkit-box-shadow: inset 0px 0px 26px 2px rgba(0, 0, 0, 0.5);
    box-shadow: inset 0px 0px 26px 2px rgba(0, 0, 0, 0.5);
    overflow: hidden;
  }

  .menuBody ul li:hover > ul {
    height: auto;
  }
}

@media only screen and (max-width: 500px) {
  /*   phones in landscape mode*/
  .gtButton {
    font-size: small;
  }
  .impNoticeHead h4 {
    font-size: small;
  }

  .nhaTabsVertical {
    display: none;
  }

  .portraitWarning {
    display: block;
  }

  .docPosterOuterContainer {
    flex-direction: column;
  }

  .docPosterContainer {
    width: 100% !important;
    margin: 0 auto !important;
  }

  .docPoster {
    height: unset;
    width: 100%;
    text-align: center;
    margin: 0 auto !important;
    margin-bottom: 1rem !important;
  }
}

@media only screen and (max-width: 360px) {
  #facebook-div {
    display: none;
  }

  #facebook-div-mobile {
    width: 100%;
    display: block;
    margin: 0 auto;
  }
  /*
    #sideMenu {
        width: 100%;
        margin: 0 auto;
        margin-bottom: 20px;
        text-align: center;
        min-height: 100%;
    }
        */

  #news {
    width: 100%;
    margin: 0 auto;
  }

  .DnnModule-LiveSlider {
    display: none;
  }

  .idCard {
    width: 100%;
  }
}
