@charset "utf-8";
/* CSS Document for NIU Marketing Pages*/

/*TOC*/

/*Main Content/
/*button styles*/
/*Footer Styles*/

/*new fonts deployed in June 2023, replacing Gotham family */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,500;0,700;0,800;0,900;1,300;1,500;1,700;1,800;1,900&display=swap');

 
	.affix {
      top: 0;
      width: 100%;
      z-index: 9999 !important;
  	}

	.affix + .container-fluid {
      padding-top: 70px;
  	}
	
	.navbar {
		margin-bottom: 0;
	}
		
	.navbar-inverse{
		background-color:#000;
		border-radius:0px;
	}
	
/*branding typography styles*/
 .navbar-brand {
    background-image: url(https://niu.edu/masterto/themes/Theme_3_0/css/theme-images/niu-shield.png);
    background-repeat: no-repeat;
    background-position: 30px top;
    background-size: 12%;
    float: left;
    height: auto;
    padding: 0px 0px 30px 43px;
    margin-top: 1em;
}
 
  .navbar.navbar-inverse.affix-top > .navbar-brand .tagline_holder {
    color: #ffffff;
    font-size: 23px;
    margin: 21px 0 0 50px;
    font-family: 'LucidaBri-Dem', serif;
    line-height: 1.25;
}


 .navbar.navbar-inverse.affix > .navbar-brand .tagline_holder {
    color: #ffffff;
    font-size: 21px;
    margin: 10px 0 10px 66px;
    font-family: 'LucidaBri-Dem', serif;
    line-height: 1.25;
}
 span.tagline {
	 font-size: 16px;
	 font-family: 'LucidaBri-DemIta', serif;
	 font-weight: 300;
	 color: #c8102e;
	 display: block;
}

 .navbar.navbar-inverse.affix > .navbar-brand .tagline_holder span.tagline {
        font-size: 14px;
}
 .navbar.navbar-inverse .navbar-brand span.tagline, .navbar.navbar-home .navbar-brand span.tagline, .navbar.navbar-inverse .navbar-brand h1, .navbar.navbar-home .navbar-brand h1, .navbar.navbar-inverse .navbar-brand span.niu-text, .navbar.navbar-home .navbar-brand span.niu-text{
	 color:#fff;
}



 .navbar.navbar-inverse .navbar-brand span.tagline, .navbar.navbar-home .navbar-brand span.tagline, .navbar.navbar-inverse .navbar-brand h1, .navbar.navbar-home, .navbar-brand h1,
 .navbar.navbar-inverse .navbar-brand span.niu-text, .navbar.navbar-home .navbar-brand span.niu-text, .navbar.navbar-inverse .navbar-brand .tagline_holder, .navbar.navbar-home .navbar-brand .tagline_holder {
	 color:#fff;
}

.affix > .navbar-brand {
    background-position: 30px top;
    background-size: 11%;
    padding: 5px 0px 20px 18px;
}

.affix > .navbar-brand h1 {
margin: 10px 0 0 60px;
    font-size: 18px;
}
.affix > .navbar-brand h1 span.tagline {
	 font-size: 12px;
}



@media (max-width:767px){
.navbar-brand,
.affix > .navbar-brand{
    background-position: 15px 10px;
    background-size: 11%;
    padding: 5px 0px 20px 18px;
}

/*.navbar-brand h1,*/
/*.affix > .navbar-brand h1,*/
/*.navbar-brand .tagline_holder,*/
/*.affix > .navbar-brand .tagline_holder{*/
/*margin: 15px 0 0 40px;*/
/*    font-size: 16px;*/
/*}*/
/*.navbar-brand h1 span.tagline,*/
/*.affix > .navbar-brand h1 span.tagline,*/
/*.navbar-brand .tagline_holder span.tagline,*/
/*.affix > .navbar-brand .tagline_holder span.tagline{*/
/*	 font-size: 12px;*/
/*}*/
.navbar.navbar-inverse.affix-top > .navbar-brand .tagline_holder {
    color: #ffffff;
    font-size: 18px;
    margin: 16px 0 0 44px;
    font-family: 'LucidaBri-Dem', serif;
    line-height: 1.25;
}
.navbar.navbar-inverse.affix > .navbar-brand .tagline_holder {
    color: #ffffff;
    font-size: 18px;
    margin: 16px 0 0 44px;
    font-family: 'LucidaBri-Dem', serif;
    line-height: 1.25;
}

span.tagline {
    font-size: 12px;
}
 .navbar.navbar-inverse.affix > .navbar-brand .tagline_holder span.tagline {
        font-size: 12px;
}
}
/*Main Content*/

	body{
	font-family:'Montserrat', Arial, sans-serif;
	font-size:15px;
	 color:#58595a;
	 font-weight:500;
	}

	.container .jumbotron, .container-fluid .jumbotron {
		position: relative;
		top:0;
		background-color: #c8102e;
		background-color: rgba(200,16,46,.8);
		color: #fff;
		border-radius:0px;
		margin-top:-132px;
		margin-bottom:0px;
	}
	.jumbotron .headline {
		font-size: 36px;
		line-height: 36px;
		margin: 0 ;
		padding: 0 ;
		font-family: Georgia, Times, 'Times New Roman', serif;
		font-style: normal;
		font-weight: 400;
		color:#fff;
	}
	
    .deck {
    	background-color:#f2f2f2;
    }
    
     h1, h2  {
    	font-family: Georgia, Times, 'Times New Roman', serif;
    	 font-style: normal;
    	 /*font-weight: 400;*/
    	 color:#c8102e;
    }
     h1 {
    	 font-size: 37.5px;
    }
     h2 {
    	 font-size: 32px;
    }
     h3 {
    	 font-size: 22px;
    }
     h4, h5, h6{
    	 font-family:'Montserrat', Arial, sans-serif;
    	 font-style: normal;
    	 font-weight: 700;
    }
	h4 {
		font-size:18px;
		color:#c8102e;
	}

	h5{
		font-size:15px;
		color:#c8102e;
		text-transform: uppercase;
	}

	h6{
		font-size:14px;
		color:#58595a;
		text-transform: uppercase;
	}

    main {
        border-top:4px solid #d2d3d3;
        padding-bottom:50px;
    }


	p, li{
 
		font-style: normal;
		font-weight: 400;
		font-size:15px;
		}
	li{
	   line-height:1.5;
	}

	p a, li a {
		color:#555;
		text-decoration:none;
		border-bottom: 1px dotted #c8102e;
		padding-bottom:0px;
	}

	p a:hover, p a:focus, p a:active,
	li a:hover, li a:focus, li a:active{
		color:#444;
		text-decoration:none;
		border-bottom: 1px dotted #a5a7a8;
	}

	p strong, li strong {
		font-weight: 700;
		color:inherit;
	}

	p.lead{
		font-family:'Montserrat', Arial, sans-serif;
		font-style: normal;
		font-weight: 300;
		color:#000;
		font-size:24px;
	}

	p.lead-red-serif{
		font-family: Georgia, Times, 'Times New Roman', serif;
		font-style: normal;
		/*font-weight: 400;*/
		color:#c8102e;
		font-size:24px;
	}

	h5.nav-header {
		border-top: 4px solid #d1d2d2;
		border-bottom: 1px solid #d1d2d2;
		padding:16px 0 10px;
	}

	ul.nav.nav-stacked li.active a,
	ul.nav.nav-stacked li a:focus, .ul.nav.nav-stacked li a:hover{
		text-decoration: none;
		background-color: #f0f1f1;
		color: #222;
		border-left: 4px #c8102e solid;
	}

	ul.nav.nav-stacked li a {
		position: relative;
		display: block;
		padding: 10px 15px;
		color: #222;
		font-size: 15px;
		font-weight: 600;
		border-left: 0px #fff solid;
	}
	ul.nav.nav-stacked li:last-child {
		padding-bottom:10px;
		border-bottom:1px solid #d1d2d2;
	}

	ul.nav.nav-stacked li ul.list-group{
		margin-bottom:0;   
	}

	ul.nav.nav-stacked:after{
		margin-bottom:40px;
	}

	ul.nav.nav-stacked li.list-group-item{
		border:0px solid #fff;
	}

	ul.nav.nav-stacked li.list-group-item a{
		padding: 3px 2px;
		color: #222;
		font-size: 15px;
		font-weight: 300;
		border: 0px solid #fff;
	}

	ul.nav.nav-stacked li.list-group-item a::before{
		display:inline-block;
		content:"\2192";
		padding-right:5px;
	} 

	ul.nav.nav-stacked li.list-group-item.active a,
	ul.nav.nav-stacked li.list-group-item a:focus, ul.nav.nav-stacked li.list-group-item a:hover{
		text-decoration: none;
		background-color: #c8102e;
		color: #fff;
	}
	
	    div.panel.panel-default h3.panel-title a.collapsed::before {
        float: right;
        content: "\f107";
        font-family: FontAwesome;
        color: #c8102e;
        padding-right: 0px;
        font-size: 22px;
        margin-top: -5px;
    }
    	div.panel.panel-default h3.panel-title a::before {
         float: right;
         content: "\f106";
         font-family: FontAwesome;
        color: #c8102e;
        padding-right: 0px;
        font-size: 22px;
        margin-top: -5px;
        transition: all 1s ease-in-out;
    }

    div.panel.panel-default h4.panel-title a.collapsed::before {
        float: right;
        content: "\f107";
        font-family: FontAwesome;
        color: #c8102e;
        padding-right: 0px;
        font-size: 22px;
        margin-top: -5px;
    }
    	div.panel.panel-default h4.panel-title a::before {
         float: right;
         content: "\f106";
         font-family: FontAwesome;
        color: #c8102e;
        padding-right: 0px;
        font-size: 22px;
        margin-top: -5px;
        transition: all 1s ease-in-out;
    }
    
    blockquote footer, blockquote small, blockquote .small {
    display: block;
    font-size: 80%;
    line-height: 1.42857143;
    color: #5a5758;
    background-color: white;
    margin-top: 5px;
    }
    
	.panel img.image-bg {
		position: relative;
		text-align: left;
		color: white;
		font-family:'Montserrat', Arial, sans-serif;
	}

	.panel .bottom-right {
		position: absolute;
		bottom: 0px;
		right: 0px;
		background-color:#c8102e;
		padding:1em;
	}
    #headerMainImage {
    display: block;
    margin-right: auto;
    margin-left: auto;
    max-width: 100%;
    height: auto;
    background-color: #a5a7a8;
    margin-bottom: 1.5em;
    width: 1536px;
    }
    
    
    .imageleft {
        float: left!important;
        margin-right: 20px;
        margin-bottom: 1em;
    }
    .imageright {
        float: right!important;
        margin-left: 20px;
        margin-bottom: 1em;
    }
    
    .well {
       padding:20px;
       border-radius: 0;}
    
    .well h3 {
      margin-top:0;}
    
    .well p {
      color:#333;}
      
    .nav-tabs>li>a {
        margin-right: 2px;
        line-height: 1.42857143;
        border: 1px solid transparent;
        border-radius: 4px 4px 0 0;
        font-size:12px;
        background-color: #eee;
    }
    .nav-tabs>li>a:hover,
    .nav-tabs>li>a:focus {
        border-bottom: 0px dotted #a5a7a8;
        text-decoration: none;
        background-color: #ddd;
    }
    
    .breadcrumb>li {
        display: inline-block;
        font-size: 12px;
    }
    
    .panel-group .panel {
        margin-bottom: 0;
        border-radius: 0px;
    }
    .panel-heading {
        padding: 10px 15px;
        border-bottom: 1px solid transparent;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
    }




/*button styles*/
	.btn {
		display: inline-block;
		padding: 10px 15px;
		margin-bottom: 0;
		font-size: 12px;
		font-weight: 400;
		line-height: 1.42857143;
		text-align: center;
		white-space: normal;
		vertical-align: middle;
		-ms-touch-action: manipulation;
		touch-action: manipulation;
		cursor: pointer;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		background-image: none;
		border: 1px solid transparent;
		border-radius: 0px;
		text-transform: uppercase;
	}


	.btn-default {
		color: #fff;
		background-color: #000;
		border-color: #000;
		text-transform:uppercase;
	}

	.btn-default:hover {
		color: #fff;
		background-color: #333;
		border-color: #000;
	}
	
	.btn-default.focus, .btn-defualt:focus {
    color: #fff;
    background-color: #333;
    border-color:#000;
    }
    
    .btn-default.active, .btn-default:active, .open>.dropdown-toggle.btn-default{
    color: #fff;
    background-color: #333;
    border-color: #000;
    }
    

	.btn-primary {
		color: #fff;
		background-color: #c8102e;
		border-color: #c8102e;
		text-transform:uppercase;
	}

	.btn-primary:hover {
		background-color: #8f0c21;
		border-color:#8f0c21;
	}
	
	.btn-primary.focus, .btn-primary:focus {
        color: #fff;
		background-color: #8f0c21!important;
		border-color:#8f0c21!important;
    }
    
    .btn-primary.active, .btn-primary:active, .open>.dropdown-toggle.btn-primary {
        color: #fff;
		background-color: #8f0c21!important;
		border-color:#8f0c21!important;
    }

	.btn-white {
		color: #c8102e;
		background-color:#ffffff;
		border-color: #ffffff;
		text-transform:uppercase;
	}

	.btn-white:hover {
		color: #c8102e;
		background-color: #a5a7a8;
		border-color:  #a5a7a8;
	}
    .btn-white.focus, .btn-white:focus {
		color: #c8102e;
		background-color: #a5a7a8!important;
		border-color:  #a5a7a8!important;
    }
    .btn-white.active, .btn-white:active, .open>.dropdown-toggle.btn-white {
		color: #c8102e;
		background-color: #a5a7a8!important;
		border-color:  #a5a7a8!important;
    }

	/*Page Navigation Features*/
	.back-to-top {
		cursor: pointer;
		position: fixed;
		bottom: 60px;
		right: 20px;
		display: none;
	}

	a.back-to-top.btn.btn-primary {
		padding: 13px 15px;
    	border-radius: 25px;
		background-color: #ffffff;
		border: 1px solid #c8102e;
		color: #c8012e;
	}
	a.back-to-top.btn.btn-primary:hover {
		padding: 13px 15px;
    	border-radius: 25px;
		background-color: #c8102e;
		border: 1px solid #ffffff;
		color: #ffffff;
	}

/* Footer Styles */
	 footer {
		 background-color:#000;
		 margin-top:0px;
	}
	 footer .niu-home {
		 position: relative;
		 top: -34px;
	}
	footer a {
		 border-bottom: 0px;
	}
	 footer li {
		 font-size:12px;
	}
	 footer .nav>li>a {
		 text-decoration: none;
		 background-color: #000;
		 color: #a5a7a8;
		 border-top: 4px #000 solid;
		 padding:10px 5px;
		 border-bottom:0px;
	}
	 footer .nav>li>a:hover {
		 text-decoration: none;
		 background-color: #f0f1f1;
		 color: #000;
		 border-top: 4px #c8102e solid;
	}

	 footer .nav.nav-mobile a {
		 text-decoration: none;
		 color: #a5a7a8;
		 padding: 5px 5px;
		 border-bottom:0px;
	}
	 footer .nav.nav-mobile a:hover {
		 text-decoration: none;
		 color: #ffffff;
	}
	 div.copyright-address {
		 float: left;
		 width:100%;
		 background-color:#222;
		 color:#fff;
		 font-size: 11px;
		 padding:6px 0;
		 font-weight: 300;
	}
	 div.copyright-address a {
		 color: #a5a7a8;
		 text-decoration: dotted;
	}
	 div.copyright-address a {
		 color:#fff;
		 text-decoration: none;
	}

@media (max-width:767px){
    
    .container .jumbotron, .container-fluid .jumbotron {
        background-color: rgba(200,16,46,1);
        margin-top: 0px;
    }
    
    .jumbotron .headline {
    font-size: 21px;
    line-height: 1;
	}
	
	.panel-body p.lead {
		color: #000;
		font-size: 18px;
	}

/** Text Over Image **/
	.image-bg {
		position: relative;
		text-align: left;
		color: white;
	}


	.image-bg .headline {
	font-family: Georgia, Times, 'Times New Roman', serif;
		/*font-weight: 400;*/
		font-size:48px;
		font-size: 3.5vw;
		text-shadow: 0px 0px 0px #000;
		text-transform: none;
		line-height: 1;
		color:#000000;
		margin-bottom:1em;
	}

	/* Bottom left text */
	.bottom-left {
		position: absolute;
		bottom: 0px;
		left: 16px;
		max-width: 60%;
	}

	.bottom-left-100 {
		position: absolute;
		bottom: 0px;
		right: 0px;
		width:100%;
	}

	/* Top left text */
	.top-left {
		position: absolute;
		top: 70px;
		left: 20px;
		max-width: 60%;
	}
	.top-left-80 {
		position: absolute;
		top: 16px;
		left: 16px;
		max-width: 80%;
	}
	/* Top right text */
	.top-right {
		position: absolute;
		top: 16px;
		right: 16px;
		width:50%;

	}
	.top-right-20 {
		position: absolute;
		top: 16px;
		right: 16px;
		width:20%;

	}
	/* Bottom right text */
	.bottom-right {
		position: absolute;
		bottom: 0px;
		right: 0px;
		width:50%;
	}

	/* Bottom right text */
	.arrow-read-more {
		position: absolute;
		bottom: 0px;
		right: 0px;
		width:auto;
		background-color:#c8102e;
		padding:.5em 1em;
	}

	/* Centered text */
	.centered {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}


        h2 {
            font-size: 27px;
        }


		.image-bg p{
		color:#fff;
		}
		
	}
	
	@media (max-width:767px){
		.image-bg h1, 
		.image-bg h2 {
			font-family:'Montserrat', Arial, sans-serif;
			font-weight: 800;
			font-size:16px;
			font-size:8vw;
			text-shadow: 0px 0px 0px #000;
			text-transform: none;
			line-height: 1;
			color:#fff;
		}

		.top-left {
			position: absolute;
			top: 10px;
			left: 10px;
			max-width: 60%;
		}

	}


	@media only screen and (min-width: 768px) and (max-width: 991px) {
			.image-bg h1, 
		    .image-bg h2 {
			font-family:'Montserrat', Arial, sans-serif;
			font-weight: 800;
			font-size:24px;
			font-size:3vw;
			text-shadow: 0px 0px 0px #000;
			text-transform: none;
			line-height: 1;
			color:#fff;
		}
	}

	@media (min-width:992px){
			.image-bg h1, 
		    .image-bg h2 {
			font-family:'Montserrat', Arial, sans-serif;
			font-weight: 800;
			font-size:32px;
			font-size:3vw;
			text-shadow: 0px 0px 0px #000;
			text-transform: none;
			line-height: 1;
			color:#fff;
		}

	}
	
	@media (min-width: 1600px) {
	 .container {
		 width: 1570px;
	}
	 .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 {
		 float: left;
	}
	 .col-xl-12 {
		 width: 100%;
	}
	 .col-xl-11 {
		 width: 91.66666667%;
	}
	 .col-xl-10 {
		 width: 83.33333333%;
	}
	 .col-xl-9 {
		 width: 75%;
	}
	 .col-xl-8 {
		 width: 66.66666667%;
	}
	 .col-xl-7 {
		 width: 58.33333333%;
	}
	 .col-xl-6 {
		 width: 50%;
	}
	 .col-xl-5 {
		 width: 41.66666667%;
	}
	 .col-xl-4 {
		 width: 33.33333333%;
	}
	 .col-xl-3 {
		 width: 25%;
	}
	 .col-xl-2 {
		 width: 16.66666667%;
	}
	 .col-xl-1 {
		 width: 8.33333333%;
	}
	 .col-xl-pull-12 {
		 right: 100%;
	}
	 .col-xl-pull-11 {
		 right: 91.66666667%;
	}
	 .col-xl-pull-10 {
		 right: 83.33333333%;
	}
	 .col-xl-pull-9 {
		 right: 75%;
	}
	 .col-xl-pull-8 {
		 right: 66.66666667%;
	}
	 .col-xl-pull-7 {
		 right: 58.33333333%;
	}
	 .col-xl-pull-6 {
		 right: 50%;
	}
	 .col-xl-pull-5 {
		 right: 41.66666667%;
	}
	 .col-xl-pull-4 {
		 right: 33.33333333%;
	}
	 .col-xl-pull-3 {
		 right: 25%;
	}
	 .col-xl-pull-2 {
		 right: 16.66666667%;
	}
	 .col-xl-pull-1 {
		 right: 8.33333333%;
	}
	 .col-xl-pull-0 {
		 right: auto;
	}
	 .col-xl-push-12 {
		 left: 100%;
	}
	 .col-xl-push-11 {
		 left: 91.66666667%;
	}
	 .col-xl-push-10 {
		 left: 83.33333333%;
	}
	 .col-xl-push-9 {
		 left: 75%;
	}
	 .col-xl-push-8 {
		 left: 66.66666667%;
	}
	 .col-xl-push-7 {
		 left: 58.33333333%;
	}
	 .col-xl-push-6 {
		 left: 50%;
	}
	 .col-xl-push-5 {
		 left: 41.66666667%;
	}
	 .col-xl-push-4 {
		 left: 33.33333333%;
	}
	 .col-xl-push-3 {
		 left: 25%;
	}
	 .col-xl-push-2 {
		 left: 16.66666667%;
	}
	 .col-xl-push-1 {
		 left: 8.33333333%;
	}
	 .col-xl-push-0 {
		 left: auto;
	}
	 .col-xl-offset-12 {
		 margin-left: 100%;
	}
	 .col-xl-offset-11 {
		 margin-left: 91.66666667%;
	}
	 .col-xl-offset-10 {
		 margin-left: 83.33333333%;
	}
	 .col-xl-offset-9 {
		 margin-left: 75%;
	}
	 .col-xl-offset-8 {
		 margin-left: 66.66666667%;
	}
	 .col-xl-offset-7 {
		 margin-left: 58.33333333%;
	}
	 .col-xl-offset-6 {
		 margin-left: 50%;
	}
	 .col-xl-offset-5 {
		 margin-left: 41.66666667%;
	}
	 .col-xl-offset-4 {
		 margin-left: 33.33333333%;
	}
	 .col-xl-offset-3 {
		 margin-left: 25%;
	}
	 .col-xl-offset-2 {
		 margin-left: 16.66666667%;
	}
	 .col-xl-offset-1 {
		 margin-left: 8.33333333%;
	}
	 .col-xl-offset-0 {
		 margin-left: 0;
	}
	 .visible-xl {
		 display: block !important;
	}
	 table.visible-xl {
		 display: table;
	}
	 tr.visible-xl {
		 display: table-row !important;
	}
	 th.visible-xl, td.visible-xl {
		 display: table-cell !important;
	}
	 .visible-xl-block {
		 display: block !important;
	}
	 .visible-xl-inline {
		 display: inline !important;
	}
	 .visible-xl-inline-block {
		 display: inline-block !important;
	}
	 .hidden-xl {
		 display: none !important;
	}
}

