/*NF Red: #98002e*/
/*NF Blue: #015f88*/

body {
  background-color: #FCFCFC;
}

.header {
    height:120px;
    /*border-bottom: #98002E solid;*/
}

.navbar-blue {
    background-color: #015F88;
    border-radius:0px;
    border-top: #98002e solid;
}


.navbar-blue .nav-item .nav-link {
  color: white;
}


.img-border {
    margin-top: 2px;
    margin-right: 2%;
    padding: 5px;
    border: 1px solid #eee;
    line-height: 1em;
}


.slick-prev:before, .slick-next:before, .slick-prev:after, .slick-next:after{
    color:#136188;
}

.card {
      box-shadow: 0 0 6px rgba(0,0,0,.16),0 6px 12px rgba(0,0,0,.32);
}

.social-header li a {
  color: #015f88;
  padding-left:5px;
  padding-right:5px;
  font-size:36px;
  transition: color .50s;
  -webkit-transition: color .50s;
}

.social-header li a:hover {
  color: #98002e;
}



.social-footer li .icon {
  /*color: #015f88;*/
  padding-left:10px;
  padding-right:10px;

  /*border-bottom: solid 3px #F7F7F9;
  transition: color .50s;
  -webkit-transition: color .50s;*/
}

.social-footer li a:hover {
  /*color: #98002e;
  border-bottom: solid 3px #98002e;
	*/
}

.footer-list {
  list-style: none;
  padding:0;

}
.footer-list li a {
  color: black;
  text-decoration: none;
}

.mobile-nav {
  list-style: none;
  padding-left:0;
}

.mobile-nav li {
    padding:5px 0;
}
.mobile-nav li a {
  text-decoration: none;
  color: white;
}

.top-scroll {
  position: fixed;
  right:15%;
  bottom:30%;
}

.underline {
  border-bottom: #98002e solid;
}

.state-content {
  min-height: 265px;
}


.nf-content {
  min-height: 700px;
}

.nf-content h2 {
  color: #015f88;
}
.nf-content .tab-pane hr {
  border-top-color: #98002e;
}

.nf-header {
  color: #015f88;
  border-bottom: 2px solid #98002e;
}

/* News-Manager Style Override*/

.nm_post_title a {
  text-decoration: none;
  color: #015f88;

}
/*.nm_post_title a:hover {
  text-decoration: none;
}*/

.nm_post_content {
  /*float: right;*/
}

.nm_post_image {
  /*float: left;*/
}
.menu {

    background:#428bca;
    color:#fff;
    height:50px;
    line-height:30px;
    letter-spacing:1px;
    width:100%;
}
#content {
    margin-top:35px;
}
.menu-padding {
    padding-top:75px;
}

.sticky {
    position:fixed;
    top:0;
    z-index:1000;
    padding-left:0;
    width:100%;
    border-top: #98002E 2px solid;
	  padding-top: 5;
}

.sticky-2 {
    position:fixed;
    top:64px;
    z-index:999;
    padding-left:0;
	  padding-top: 5;
}

.walk-card {
	min-height: 225px;
}


/* The side navigation menu */
#mobileNavBox {
    height: 100%; /* 100% Full-height */
    width: 0; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 1; /* Stay on top */
    top: 0;
    left: 0;
    background-color: #015f88; /* Black*/
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 60px; /* Place content 60px from the top */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

#mobileNavBox .panel-title a, #mobileNavBox .closebtn {
  color:white;
  text-decoration: none;
}

/* The navigation menu links */
/*#mobileNavBox a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    color: white;
    display: block;
}*/

/* When you mouse over the navigation links, change their color */


/* Position and style the close button (top right corner) */
.closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 52px !important;
    margin-left: 50px;
}

.bg-image {
background-image: url(http://cms.twiggystudios.com/data/uploads/site-images/summer-sun-yellow-photography.jpg);

}

/*.mobile-nav {
  padding-left:20px;
}*/


/* Calendar Icon Style */

.date {
	display: block;
	width: 100px;
	height: 110px;
	/* margin: 30px auto; */
	margin-top: 1em;
	margin-bottom:1em;
	margin-right: 20px;
	background: #fff;
	text-align: center;
	font-family: 'Helvetica', sans-serif;
	position: relative;
}

.date .binds {
	position: absolute;
	height: 15px;
	width: 60px;
	background: transparent;
	border: 2px solid #999;
	border-width: 0 5px;
	top: -6px;
	left: 0;
	right: 0;
	margin: auto;
}

.date .month {
	background: #015f88;
	display: block;
	padding: 8px 0;
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	border-bottom: 2px solid #98002e;
	box-shadow: inset 0 -1px 0 0 #666;
}

.date .day {
	display: block;
	margin: 0;
	padding: 10px 0;
	font-size: 48px;
	box-shadow: 0 0 3px #ccc;
	position: relative;
}

.date .day::after {
	content: '';
	display: block;
	height: 100%;
	width: 96%;
	position: absolute;
	top: 3px;
	left: 2%;
	z-index: -1;
	//box-shadow: 0 0 3px #ccc;
}

.date .day::before {
	content: '';
	display: block;
	height: 100%;
	width: 90%;
	position: absolute;
	top: 6px;
	left: 5%;
	z-index: -1;
	//box-shadow: 0 0 3px #ccc;
}


.btn-nf-red {
	background-color: #98002e;
	border-color: #98002e;
	color: white;
	text-decoration: none;
}

.btn-nf-red:hover {
	background-color: #7f0026;
	color: white;
}

.btn-nf-blue {
	background-color: #015f88;
	border-color: #015f88;
	color: white;
	text-decoration: none;
}

.btn-nf-blue:hover {
	background-color: #004C6C;
	color: white;
}

.fb-page, .fb-page iframe[style], .fb-page span {
    width: 100% !important;
}

.owl-theme .owl-controls .owl-buttons div {
  padding: 5px 9px;
}

.owl-theme .owl-buttons i{
  margin-top: 2px;
}

/*//To move navigation buttons outside use these settings:*/

.owl-theme .owl-controls .owl-buttons div {
  position: absolute;
}

.owl-theme .owl-controls .owl-buttons .owl-prev{
  left: -45px;
  top: 45%;
  /*font-size: 20px;*/
}

.owl-theme .owl-controls .owl-buttons .owl-next{
  right: -45px;
  top: 45%;
  /*font-size: 20px;*/
}

.box-callout {
  box-shadow: 0 0 6px rgba(0,0,0,.16),0 6px 12px rgba(0,0,0,.32);
  transition: all 0.1s ease-in-out
}

.box-callout:hover {
	transform: scale(1.02, 1.02);
	filter: grayscale(50%);
}

.dropdown-menu {

	border: 1px solid #015F88;
}
.dropdown-item {
color:navy;
}

.video-container {
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	height:0;
	overflow:hidden;
}

.video-container iframe, .video-container object, .video-container embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

.staff-fig {
  position: relative;

}

.staff-fig img {
  margin: 0 auto;
}

.caption-left {
  position:absolute;
  left:0;
  top:45%;
  background-color: #015f88;
  opacity: 1;
  z-index: 100;
  border: 3px solid white;
}
.caption-left p {
  color: white;
  padding:10px 10px;
  margin:0;
}

.test {
  border: 1px solid;
    border-top-color: rgb(229, 230, 233);
    border-right-color: rgb(223, 224, 228);
    border-bottom-color: rgb(208, 209, 213);
    border-left-color: rgb(223, 224, 228);
    border-radius:0;
    background-color:#015F88;
}

.navbar-clear {
	background-color: rgba(0,0,0,0);
	color: #015f88;
	margin: 5px 0 5px 0;
}

.navbar-clear .nav-item .nav-link {
  color: #015f88;
  font-weight: 600;
}

.navbar-clear .nav-item .nav-link.btn {
  color: white;
  font-weight: 600;
}

.embed-responsive-itemtable {
	width:100% !important;
}

#area1:hover, #area2:hover {
    opacity:0.2;
}

.news-fig {
  width: 100%;
    position: absolute;
    bottom: 0%;
    left: 0%;
	max-height: 35%;
    text-align: left;
    background: rgba(38, 49, 59, 0.54);
    padding: 0.5em 1.5em;
}

.minor-news-fig {
   
    position: absolute;
    top: 0;
    left: 0;
    text-align: left;
    background: rgba(38, 49, 59, 0.80);
    padding: 0.5em 1.5em;
    color: white;
	transition: all 1s
}

.minor-news-fig p {
   margin-bottom: 0px !important
}

.minor-news-fig:hover {
   background-color: #1DA1F2;
}

.minor-news-fig a {
	color: white;
	text-decoration: none;
}

.catalist {
  list-style: none;
  padding-left:.25rem;
}
.catalist li {
  margin-bottom: 20px;
  border-bottom: 1px dashed black;
}

.catalabel {
  background-color: #015f88;
  color: white;
  padding: 10px 20px;
  border-radius: 5px 15px
}

.w {
	color: white;
}

.nav-red {
	color: white;
	background-color: #98002E;
}


img[style*="left"]  {margin-right:20px}
img[style*="right"] {margin-left:20px}


.embed-responsive {
	-webkit-overflow-scrolling: touch;
  	overflow-y: scroll;
}

.event-card {
  min-height: 350px;
  position: relative; 
  background-size: cover;
  box-shadow: 0 1px 4px 0 rgba(0,0,0,0.7); 
}

.title-overlay {
  position: absolute; 
  bottom:0; left: 0; 
  color: white; 
  background: transparent;
  width: 100%;
  transition: all .5s;
}

.date-overlay {
  position: absolute; 
  top: 5%; right:5%; 
  color: white; 
  background-color: rgba(38, 49, 59, 0.74);
}

.event-card:hover .title-overlay {
  background-color: rgba(38, 49, 59, 1); 
  transform: translate(0,-10px);
  -webkit-transform: translate(0,-10px);
  -o-transform: translate(0,-10px); 
  -moz-transform: translate(0,-10px);
}

.champ-card:hover .title-overlay {
  background-color: rgba(38, 49, 59, 1); 
  transform: translate(0,-10px);
  -webkit-transform: translate(0,-10px);
  -o-transform: translate(0,-10px); 
  -moz-transform: translate(0,-10px);
}

.title-overlay a {
  color: white;
  text-decoration: none;
}



.event-card {
  min-height: 350px;
  position: relative;
  background-size: cover;
}

.title-overlay {
  position: absolute;
  bottom:0; left: 0;
  color: white;
  background: transparent;
  width: 100%;
  transition: all .5s;
  text-shadow: 2px 2px 2px #000;
}

.date-overlay {
  position: absolute;
  top: 5%; right:5%;
  color: white;
  background-color: rgba(38, 49, 59, 0.74);
}


.hero-text-container {
    position: absolute;
    width: 650px;
    text-align: center;
    margin: 550px 0px 0px 35%;
}

.hero-text-container .text {
    font-style: normal;
    font-weight: 700;
    font-style: italic;
    color: #ffffff;
    font-size: 50pt;
    text-transform: uppercase;
    text-align: center;
    position: absolute;
    z-index: 902;
    margin: 0px 0px 0px -300px;
    text-shadow: 3px 2px black;
}



.hero-text-container .subtext {
    font-style: normal;
    font-weight: 700;
    color: #98002e;
    font-size: 25pt;
    text-transform: uppercase;
    text-align: center;
    position: absolute;
    z-index: 902;
    margin: 70px 0px 0px -200px;
    text-shadow: 2px 1px black;
}

.row-light-blue {
    background-color: #cce5ff;
    min-height: 350px;
}

.stylish {
    font-style: italic;
    font-weight: 700;
    font-size: 20pt;
}

#event-header {
    overflow: hidden;
    position: relative;
    min-height: 750px;
    background-image: url("https://upload.wikimedia.org/wikipedia/commons/6/63/Coplay_Cement_Company_Kilns_in_Saylor_Park.jpg");*/
    background-color: black;
    background-size: cover;
    background-position: center;
}

#event-header .container {
    position: relative;
    z-index: 2;
    margin-top: 150px;
    
}

.header-event-date {
    font-size: 34px;
    text-transform: uppercase;
    background-color: transparent;
    color: white;
}

.header-event-location {
    font-size: 50px;
    text-shadow: 3px 2px black;
    color: white;
}

.header-event-venue {
    font-size: 20px;
    color: white;
}

.header-call-out {
    font-size: 25px;
    text-transform: uppercase;
    color: white;
}

.promo {
    text-align: center;
    font-size: 20px;
}
.promo .discount {
    font-size: 40px;
}



.event-name {
    font-size: 70px;
}

.desc-block {
    font-size: 18px;
}

.informed {
    min-height: 500px;
    background-image: url("https://nfnetwork.org/data/uploads/site-images/notebookpencils.jpeg");
    background-size: cover;
    background-position: center;
}

.sponsors {
    min-height: 500px;
}

.panel-grid-cell {
	width: calc(100%);
}

.banner-box {
     margin: 20px 0px 0px 0px;
     background-color: #98002e;
     box-shadow: 0 1px 4px 0 rgba(0,0,0,0.5);
     /*border-radius: 10px;*/
}

.banner-box h4 {
    color: white;
    font-size: 44px;
    line-height: 5rem;
    font-weight: 100 !important;
    text-shadow: 2px 2px 2px #000;
}

.gallery-image {
    position: relative;
    height: 250px; 
    background-size: cover; 
    background-position: center;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,0.9);
}

.gallery-title {
    position: relative;   
    width: 85%;
    margin-left: 2rem;
    text-align: right;
    bottom: 45px;
    color: white;
    text-shadow: 2px 2px 2px #000;
    text-decoration: none;
}

.date-float {
    color: white;
    text-shadow: 2px 2px 2px #000;
    position: relative;
    width: 100%;
    text-align: center;
    
}

#photos {
   /* Prevent vertical gaps */
   line-height: 0;
   
   -webkit-column-count: 5;
   -webkit-column-gap:   0px;
   -moz-column-count:    5;
   -moz-column-gap:      0px;
   column-count:         5;
   column-gap:           0px;
}

#photos img {
  /* Just in case there are inline attributes */
  width: 100% !important;
  height: auto !important;
}

@media (max-width: 1200px) {
  #photos {
  -moz-column-count:    4;
  -webkit-column-count: 4;
  column-count:         4;
  }
}
@media (max-width: 1000px) {
  #photos {
  -moz-column-count:    3;
  -webkit-column-count: 3;
  column-count:         3;
  }
}
@media (max-width: 800px) {
  #photos {
  -moz-column-count:    2;
  -webkit-column-count: 2;
  column-count:         2;
  }
  .mobile-embed-extension {
	height: 5500px;
  }
}
@media (max-width: 400px) {
  #photos {
  -moz-column-count:    1;
  -webkit-column-count: 1;
  column-count:         1;
  }

  .mobile-embed-extension {
	height: 5500px;
  }
}

.nf-hope-header {
    height: 550px;
    width: 100%;
    background-image: url('https://nfnetwork.org/data/uploads/carousel-images/nf-hope-chicago-metropolis-sent-by-jeff-2018-01-08.png');
    background-size: cover;
    background-position: center;
}

.row-nf-blue {
    background-color: #015f88;
    color: white;
    text-align: center;
}

.hero-text-container-sm {
	position: absolute; 
	bottom: 100px; 
	width: 90%;
}

.hero-text-container-sm .text {
	font-weight: 700; 
	font-style: italic; 
	color: #ffffff; 
	font-size: 23pt; 
	text-transform: uppercase; 
	text-align: center; 
	text-shadow: 3px 2px black;
}

.hero-text-container-sm .subtext {
	font-style: normal; 
	font-weight: 700; 
	color: #98002e; 
	font-size: 15pt; 
	text-transform: uppercase;
	text-align: center; 
	text-shadow: 2px 1px black;
}