/* CSS Document */


  /*------ Info Boxes ----*/
.modal-body a:link {text-decoration:underline;}
.bgdark {background-color:#000;margin-top:0;padding-bottom:0}
.bggray{background-color:#acacac;}

.blue-box0{background-color:#2f4995;color:#white}
.blue-box1{	background-color: #00289c;color:#white}
.blue-box2{background-color:#1a2966; color:#white}
.blue-box3{background-color:#255a87; color:#white}

  .btn-blue-revert:hover {border: none; color: #2f4995; font-weight: 700; margin-left:0; padding-left:0;  text-transform: uppercase; font-size: 97%; background-color:#fff;}
   .btn-blue{border: 1px solid transparent; color: #fff; font-weight: 500; margin-left:0; padding-left:1.5em; padding-right:1.5em; text-transform: uppercase; font-size: 97%; background-color:#2f4995;}
     .btn-blue:hover {border-color: #2f4995; color: #2f4995!important; font-weight: 500; margin-left:0; padding-left:1.5em; padding-right:1.5em;   text-transform: uppercase; font-size: 97%; background-color:#ffffff;;}
.btn-blue-revert {border: #fff solid 1px; color: #fff!important; font-weight: 700; margin-left:0; padding-left:0;  text-transform: uppercase; font-size: 97%; background-color:#2f4995;}
  .btn-blue-link {color: #2f4995; font-weight: 600;border: #fff; background-color:#fff; }

h3.card-title-info {color:#fff!important}
.card-title a:link{text-decoration:underline;}
h4.card-title a:link{text-decoration:underline;color:#255a87!Important}

.card-title-white{color:#fff;}
.card-title-dark {color:#000; min-height: 3.5em;}
a.card-title-white,a.card-title-white:hover{color:#fff;}
.h100{  min-height: 3em;}

#homePage ul.list-group li.list-group-item {
  position: relative;
  display: block;
  padding: 10px 15px;
  margin-bottom: -1px;
  background-color: #fff;
  border: 1px solid #fff;
}

/*Key Initiaitive Boxes*/

h3.key-initiatives{
	margin: 0 auto;
	/*background-color:#000;*/
	color:#000;
	padding: 0.5em  auto 0  auto;
font-size: 2em;
    font-weight: 500;
    text-transform: uppercase;
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    position: relative;
   

}
   
h3.key-initiatives {
    overflow: hidden;
    text-align: center;
}
h3.key-initiatives:before,
h3.key-initiatives:after {
    background-color: #2f4995;
    content: "";
    display: inline-block;
    height: 2px;
    position: relative;
    vertical-align: middle;
    width: 15%;
}
h3.key-initiatives:before {
    right: 0.7em;
    margin-left: -50%;
}
h3.key-initiatives:after {
    left: 0.7em;
    margin-right: -50%;
}                
                  /*reopen*/
    .reopen{   
      padding top:3em;
      padding-bottom:3em;

 background: url('/governor/assets/images/bg-blue-white.jpg ') no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  
    color: white;
    text-align: center;
    }
.logo-reopen {max-width:425px;margin-top:2em}
.reopen h2{font-size:3em}
.reopen h3.sub-title{  text-transform: uppercase;margin-top: 0; padding-top:0;}
.reopen a.btn {
  border: 2px solid #fff;
 background-color:#1a80c8;
text-transform: uppercase;
  font-size: 1rem;
  cursor: pointer;
  color:#fff;}
/**Carousel**/
.borderless  {
  border-left:0 none;
    border-right:0 none;
     border-bottom:0 none;
 margin-bottom: 0px!important;
}
  .list-group li a.card-title-dark:link {
    text-decoration:underline;


  }
#photo-carousel{
	margin: 2px 0px 0em 0px;
}

#photo-carousel img{
 /*   margin: 0px auto;
	width: 100%;
}
           .carousel-inner > .item > img,
.carousel-inner > .item > a > img {   */
  display: block;
width: 100%;
  height: auto;
}
.sonj-alert{}

.alert{
	border: 0px;
	color: #000 !important;
	border-radius: 0px;
	margin:0px;
}

.alert .red{
	color: #E62139;
}

.alert h4{
	font-size: 1.25rem;
	margin-bottom: 0px;
}
.sonj-alert /*SoNJ Alert*/
.sonj-alert{}

.sonj-alert.alert{
	border: 0px;
	color: #000;
	border-radius: 0px;
	margin:0px;
}

.sonj-alert.alert .red{
	color: #E62139;
}

.sonj-alert.alert h1{
	font-size: 1.25rem;
	margin-bottom: 0px;
}
.sonj-alert .alert-close{
	font-size: .875rem;
	color: #000;
}
           
 /*stay connected*/
div.stay-connected{
	background-color:#000;
    padding-bottom:1rem;
}

form.subscribe_form label h3.stay-connected{
	color: #fff;
	margin: 0em;
	padding: 1em 1em .5em 1em;
}
div.stay-connected form.subscribe_form{
	padding-right: 2em;
}
form.subscribe_form .form_text{

   border: 3px solid #ffffff;
}
form.subscribe_form button,
button.gov-default-btn,
a.gov-default-btn{
 border: 2px solid #fff;
 background-color:#000;

  text-transform: uppercase;
  font-size: 1rem;
  cursor: pointer;
  color:#fff;
		
}
form.subscribe_form button:hover {
  background: #666;
  color: white;
}
.florish.stars{
	width: 100%;
	height: 70px;
	background-image: url(../images/stars.png);
	display: inline-block;
	background-position: center;
}          
           
           
hr.message-inner-separator
{
    clear: both;
    margin-top: 10px;
    margin-bottom: 13px;
    border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient(left,rgba(0, 0, 0, 0),rgba(0, 0, 0, 0.15),rgba(0, 0, 0, 0));
    background-image: -moz-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));
    background-image: -ms-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));
    background-image: -o-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));
}
.alert {color: #000;}
 .carousel-item {
bottom: 0px;
  	background-size: cover;
  	background-position: center center; 
 
   width:100%;
   
 }
        .carousel .nj {margin-bottom:0}
/*.carousel-item-card {
bottom: 0px;
  	background-size: cover;
  	background-position: center center; 
   height:100%;
   width:100%;
   margin-bottom:0;
   
 }*/

 .carousel.nj .carousel-control-next-icon,
.carousel.nj .carousel-control-prev-icon{
	background-color: rgba(0,0,0,.5);
	background-size: 50% 50%;
	border-radius: 1rem;
}

ol.carousel-indicators {
  padding:0;

  position: absolute;bottom: 1rem;
  margin-bottom:0;
  padding-bottom:0;
}

.carousel.nj .carousel-indicators li {
	width: 10px;
	height: 10px;
	margin-right: 3px;
	margin-left: 3px;
	border-radius: 100%;
    margin-bottom:0;
  padding-bottom:0;

	
}
.carousel.nj .carousel-indicators li.active {
	background-color: rgba(0,0,0,.8);
	border: 2px solid white;
}


.carousel.nj .carousel-caption,

 .carousel.nj .carousel-caption.left{
background: rgba(47, 73,149, 0.99);
	position: absolute;
	bottom: 25px;
	left: 29px;
		right: auto;
	text-align:left;
  width:53%;
background-image: url("/governor/library/home/caption_bg.png");
    background-repeat: no-repeat;

background-size: contain;
   padding-top:1rem;
    background-position: right top;
	
    border-bottom-right-radius: 12px;
    border-top-right-radius: 12px;
    text-shadow: none;
   margin-bottom:0;

}
.carousel-caption .card-body{margin-left: 2rem;
margin-right: 3em;
padding-top: 1rem;
padding-bottom: 0em;}
        
.carousel-captionx {
max-width:580px;
z-index:10;
color:#fff;
text-align:left;
top: 40% !important;
transform: translateY(-50%);
text-align: left;
bottom: initial;
-webkit-transform:translate(0, -50%);
-ms-transform:translate(0, -50%);
transform:translate(0, -50%);
          left: 15%;
}

.carousel-caption h2.card-title { color:#ffcc33;font weight:900; text-transform: uppercase;font-family: "Knockout31",Roboto; font-size:3rem}
.carousel-caption ul {
  list-style: none; /* Remove default bullets */
  font-family: "Knockout31",Roboto;
  margin-top:1.9rem;
    margin-bottom:1rem;
  
}

.carousel-caption ul li::before {
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: #ffcc33; /* Change the color */
  font-size:2rem;
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1.2em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
}
                                                                 
                                                                 
 .carousel-caption ul {margin-left:0; margin-top:1.5rem;padding-left: 2.2rem;}
  .row second  ul {margin-left:0; margin-top:1rem;}                             
  .carousel-caption ul li{padding-top:0;padding-bottom:1rem;font-size:1.6rem;margin-left:0;}
  .carousel-caption ul li a:link{color:#ffffff; font-size:1.6rem; text-transform:uppercase;}
  .carousel-caption ul li a:visited, .carousel-caption ul li a:visited {color:#ffffff; font-size:1.6rem; text-transform:uppercase;}
  
    .carousel-caption ul li a:hover, .carousel-caption ul li a:active {color:#ffffff; font-size:1.6rem; text-transform:uppercase; text-decoration:underline!important;}


    .carousel-captionxxx .leftxxxx{
     position: absolute;
    bottom:-20px;
	transform: translateY(-50%);
	right: auto;
	left: 5%;

	padding-bottom: 1.4rem;
   background-color:#ccc;
  background-image: url("/governor/library/home/caption_bg.png");
    background-repeat: no-repeat;
    background-position: right top;
  min-height:300px;
}
.carousel.nj .carousel-caption.rightx {
	width: 25%;
	top: 50%;
	transform: translateY(-50%);
	right: 10%;
	left: auto;
	bottom: auto;
	padding-bottom: 20px;
}
 .carousel .btn-cust  {text-transform:uppercase; width: auto; background-color:# 3366ff; border: 1px solid #fff; color:#fff; margin-top:0rem; marging-right: 1re; }

 .carousel .btn-cust:hover  {text-transform:uppercase; width: auto; background-color:# 3366ff; border: 1px solid #0066ff; color:#0066ff; margin-top:0rem; marging-right: 1rem; }
.img-responsive {
    display: block;
    max-width: 100%;
    width: 100%;
    height: auto;
}
/* md */
@media (min-width: 992px) and (max-width: 1199px) {
	body .carousel-caption {
		font-size: 1.5em;
		right: 10%;
		top: 10%;

	}
      .carousel.nj .carousel-caption,

 #photo-carousel .carousel.nj .carousel-caption.left{
	background: rgba(47, 73,149, 0.99);
	position: absolute;
	top: -15px;
	/* bottom: 20px; */
	/* right: 29px; */
	left: auto;
	text-align:left;
  	width:59%;
 }
      h3.key-initiatives{
		margin: 0 0 0.5em; 0;
		background-color:#000;
		color:white;
		padding: 0.5em;
        font-size: 1.2rem;

}
	#photo-carousel .carousel-caption ul li a {
		font-size: 1.375rem !important;
	}
	#photo-carousel .carousel-caption ul li {
		padding-bottom: 0 !important;
	}
}

/* sm */
@media (min-width: 768px) and (max-width: 991px) {
	body .carousel-caption {
		font-size: 1.3em;
		right: 15%;
		top: 50%
	}
}

/* XS*/
@media only screen and (max-width: 767px) {
	body .carousel-caption {
		font-size: 1em;
		right: 10%;
		top: 50%
	}
}



/*
.guadagno .carousel-caption  .line01{}
.guadagno .carousel-caption  .line02{background-color: #4c008e;}

.murphy .carousel-caption  .line01{background-color: #0059bb;}
.murphy .carousel-caption  .line02{background-color: #6aa530;}
*/

.row.first .box{margin: 1em 0;}
.row.second {margin: 1em 0; background-color:#f8f9fa;}
.second .card {border: 1px solid #ccc;}
.box{
	position: relative;
}

.box img{
	border: 1px solid #9c9c9c;
}
.card {margin: 1em 0; border:none!important;
  .cardbg {background-color:#fff; }
.cardbg > .h3, .cardbg > h4 {color:#255a87;}
.card-shadow {
  border: none;
  border-width: 0;
  box-shadow: 0 0.375rem 1.7rem 0 rgb(140 152 164 / 5%);
}
                            
                             
                             
.card-title a {text-decoration:underline;color:#255a87!Important}
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.10);}
               
#policies .flcard {border-bottom: 1px solid #eef0f1!important; border-right: 1px solid #eef0f1 !important; border-radius: 3px;box-shadow: var(--newtab-card-shadow);}


/*
.guadagno .box img.murphy{display:none;}
.guadagno .box span.murphy{display:none;}
.murphy .box img.guadagno{display:none;}
.murphy .box span.guadagno{display:none;}
*/
.box span.overlay{
	position: absolute;
	top: 1em;
	left: 1em;
	color: #fff;
	font-size: 2em
}

/* md */
@media (min-width: 992px) and (max-width: 1199px) {
	body .box span.overlay{
		font-size: 1.5em
	}
   .hidden-sm, .hidden-xs {

}
}

/* sm */
@media (min-width: 768px) and (max-width: 991px) {
	body .box span.overlay{
		font-size: 1.4em
	}

}


/* XS Portrait */
@media (min-width: 616px) and (max-width: 767px) {
	body .box span.overlay{
		font-size: 2.5em
	}

}
@media (min-width: 525px) and (max-width: 615px) {
	body .box span.overlay{
		font-size: 2em
	}
}

@media (min-width: 435px) and (max-width: 524px) {
	body .box span.overlay{
		font-size: 1.5em
	}
}

@media (min-width: 400px) and (max-width: 434px) {
	body .box span.overlay{
		font-size: 1.35em
	}
    h3.h2 {font-size:1.8rem}
}

@media (max-width: 399px) {
	body .box span.overlay{
		font-size: 1em
	}
  h3.h2 {font-size:1.8rem}
}

.box span.overlay.right{
	right: 1em;
	left: auto;
}

.box span.overlay p{
	margin: 0px;
	line-height: 1em;
}

.box span.overlay p+p{
	padding-left: .5em;
}

.box .content{
	padding: 1em;
	margin: 2px 4px;
	overflow: auto;
}
/*
.guadagno .box .content{
	border-color: #4c008e;
}
.murphy .box .content{
	border-color: #6aa530;
}
*/

.content h2{
	margin-top: 0em;
	font-size: 1.5em;
}

.content a.learn-more{
	color: #fff;
	background-color: #00289c;
	padding: .25em .5em;
	float: right;
	border-radius: 4px;
}


/*about governor*/
.about-governor{
	position:relative;
}

.about-governor h3{
	font-size: 3em;
}

.about-governor .text{
	position: absolute;
	color: white;
	text-shadow: 1px 1px 1px #000;
	padding: 5% 50% 5% 5%;
}

@media only screen and (max-width: 767px) {/*XS*/
	body .about-governor h3{
		font-size: 2em;
	}
	body .about-governor .text{
		padding: 0% 45% 1.5% 1.5%;
	}
  .reopen{   
      padding top:2em;
      padding-bottom:2em;
  }
  .logo-reopen {max-width:270px;margin-top:1em}
  .reopen h2{font-size:2em}
  .reopen h3.sub-title{font-size:2em}
   .reopen a.btn {
  border: 2px solid #fff;
 background-color:#1a80c8;
text-transform: uppercase;
  font-size: 1rem;
  cursor: pointer;
  color:#fff;} 
}

        
.about-governor  a.learn-more{
	color: #fff;
	background-color: #00289c;
	padding: .25em .5em;
	float: left;
	border-radius: 4px;
	clear:left;
}



.social-{
	/*text-align: center;*/
}
.social-box{
	margin: 0em 0em 2em 0em;
	/*max-width: 530px; Facebook widget will only dislpay at max 500px width so to avoid deadspace we stop these from exceeding 500px*/
	/*float: none;
	display: inline-block;
	*/
}
.social-box > h4{
	color:white;
	margin: 0 ;
	padding: .7em 1em;
	font-weight: bold;
	text-align:left;
  font-size:1.5rem;
}
.news-box > h4{
	/*background-color:#3a5efa;*/
  background-color:#f8f9fa
  color:#333;
}
.facebook-box > h4{
	background-color:#3b5998;
    
}
.facebook-box .{text-align:center;}
.twitter-box > h4{
	background-color:#3399ff;
}


.social-box  > .wrapper{
	border: 1px solid #fff;
	/*max-height: 400px;
	height: 400px;*/
	overflow: hidden;
  padding-bttom:2em;
  background-color:#fff;
  border-radius: 6px; 
}
.social-box.news-box  > .wrapper{
	overflow-y:hidden;
}

/*News Include*/
ul#news-include{
	list-style: none;
	padding:0em 2em;
	margin: 0px;
}
ul#news-include li{
	list-style: none;
	border-bottom: 1px dotted #111;
	padding-top: 1.4em;
                       padding-bottom: 1.0em;
}

ul#news-include li i{
	font-size: 5em;
	color: #9c9c9c;
}
ul#news-include li span.content{
	display: block;
	padding: 0;
}

ul#news-include li a{
	color: #333;
}

ul#news-include li a h4 {
	color: #2f4995;
	font-size: 1.3em;
	margin: 0px 0 0.5em 0;
font-weight:500;
  text-decoration:underline;
}
ul#news-include li a h4:hover {
	color: #111;
}
ul#news-include li p.date{
	font-size:95%;
   margin:0.5em 0 0 0;
color:#666;

}
.back-to-top{
	margin: 1em;
	display: inline-block;
}

/* -------- Card Grid (spotlight) and info box Updates ------------------*/

.card-grid {
	display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.card-grid div.col-md-6 {
	float: none;
	display: flex;
}

.card-grid .card {
	min-height: 23.3em;
}

.dflex {
	display: flex;
}

.no-borad {
	border-radius: 0;
}

.even-grid {
	display: grid;
    width: 100%;
    grid-template-columns: auto 1fr;
}

.even-grid .card {
	box-shadow: none;
	height: 100%;
}

.even-grid .card > a {
	height: 100%;
	padding: 1.5em 0 3.5em;
	display: flex;
}

.even-grid img {
	object-fit: contain;
	aspect-ratio: 1 / 1;
}

@media only screen and (max-width: 1300px) {
	.even-grid { grid-template-columns: 25% 1fr; }
	.even-grid img { object-position: top; }
}

@media only screen and (max-width: 1200px) {
	.even-grid { grid-template-columns: auto; }
	.dflex { flex-wrap: wrap; }
}

@media only screen and (max-width: 990px) {
	.dflex .card { width: 100%; }
}

