.umsl-secondary-text{
	 color:#fff 
}

 .image-overlay {
     background: rgba(0, 0, 0, 0.4);
	 position: absolute;
	 top: 0;
	 left: 0;
	 bottom: 0;
	 right: 0;
	 pointer-events: none;
}

.image-hero--content {
	 text-align: center;
	 color: #FFF;
	 text-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
}

.image-hero--content h1 {
    font-size: 80px;
    margin: 0 0 10px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    /* width: 50%; */
    height: 50%;
    margin: auto;
    text-align: center;
}

 .cf:before, .cf:after {
	 content: " ";
	 display: table;
}
 .cf:after {
	 clear: both;
}


.banner-image-wrapper {
	 position: relative;
	 overflow: hidden;
	 height: 300px;
	 clear: both;
}

 .banner-image {
	 position: absolute;
	 min-width: 100%;
	 min-height: 100px;
}

 .image-js {
	 color: #fff;
}

 @media screen and (max-width: 1199px) {
	 .image-hero--content h1{
		 font-size:4rem;
	}
	.banner-image-wrapper {
        height: 200px;
    }
	
}
@media screen and (max-width: 767px){
    
    .image-hero--content h1{
	font-size:3rem;
	}
    
}


 @media only screen and (max-width: 764px) and (min-width: 582px){
	 .banner-image{
		 max-width:118%;
	}
}

 @media screen and (max-width: 991px) and (min-width: 768px){
	 .banner-image-wrapper{
		height: 200px;
        min-height: 200px;
	}
}

@media screen and (max-width: 767px) and (min-width: 582px) {
	.banner-image-wrapper{
	    height: 170px;
        min-height: 170px;
	}
	 .image-hero--content h1 {
		 bottom: 0;
	}
}

 @media screen and (max-width: 581px) and (min-width: 375px){
	 .banner-image-wrapper{
		height: 120px;
        min-height: 120px;
	}
}

@media screen and (max-width: 374px){
	 .banner-image-wrapper{
		height: 80px;
        min-height: 80px;
	}
}

 @media screen and (max-width: 580px) {
	 .image-hero--content{
		 margin:10px;
	}
}


 @media only screen and (max-width:580px){
	 .image-hero--content h1{
		 font-size:2.5rem;
		 bottom:35px;
	}
	.banner-image-wrapper{
	    height: 100px;
        min-height: 100px;
	}
}
 @media only screen and (max-width: 480px) {
	
	.image-hero--content h1{
		 font-size:1.8rem;
	}
	

}


@media print {
     .banner-image{display:none;}
     	.image-hero--content h1{font-size:18px;color:#000;text-align:left;}
     img {
        max-width: 300px!important;
        height:auto;
        }
        .banner-image{display:none}
        .image-overlay{display:none}
        .banner-image-wrapper{height:100px;}
}



.umsl-secondary-text{
	 color:#fff;
	 font-family:'Roboto Condensed', sans-serif;
	 font-weight:700;
}

 .image-overlay {
     background: rgba(0, 0, 0, 0.4);
	 position: absolute;
	 z-index:1;
	 top: 0;
	 left: 0;
	 bottom: 0;
	 right: 0;
	 pointer-events: none;
}

.image-hero--content {
	 text-align: center;
	 color: #FFF;
	 text-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
	 position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0px auto;
      display: flex;
  align-items: center;
  z-index:3;
}

.image-hero--content h1 {
    /*font-size: 80px;*/
    font-size:calc(2vw + 45px);
   /* margin: 0 0 10px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 50%; */
    position:relative;
    margin: auto;
    text-align: center;
    height:auto;
}

 .cf:before, .cf:after {
	 content: " ";
	 display: table;
}
 .cf:after {
	 clear: both;
}


.banner-image-wrapper {
	 position: relative;
	 overflow: hidden;
	min-height:400px;
	 clear: both;
	 z-index:-1;
}

 .banner-image {
	position:initial!important;
	min-width: 100%;
    min-height:100%;
    max-width: 100%;
    /* font-family: "object-fit:cover;object-position:center"; */
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}

 .image-js {
	 color: #fff;
}

 @media screen and (max-width: 1199px) {
	 .image-hero--content h1{
		 /*font-size:4rem;*/
	}
	.banner-image-wrapper {
     /*   height: 200px; */
    }
	
}
@media screen and (max-width: 767px){
    
    .image-hero--content h1{
	/*font-size:3rem;*/
	}
    
}


@media only screen and (max-width : 1200px) {
		.image-hero--content{
	    padding:130px 0px 130px 0px;
	}
}


@media only screen and (max-width : 992px) {
    .banner-image-wrapper{
        min-height:250px;
    }
		.image-hero--content{
	    padding:90px 0px 90px 0px;
	}
	.image-hero--content h1{
	font-size:calc(2vw + 30px)
	}
}


@media only screen and (max-width : 768px) {
	 .image-hero--content h1{
		/* font-size:2.5rem;*/
		 bottom:35px;
	}
		.image-hero--content{
	    padding:60px 0px 60px 0px;
	}
	img.banner-image{
	    max-width:100%;
	}
	
}


@media only screen and (max-width : 480px) {
/*	.image-hero--content h1{
		 font-size:1.8rem;
	}*/
	
	img.banner-image{
	    max-width:100%;
	}
	.image-hero--content{
	    margin:0px;
	     padding:40px 0px 40px 0px!important;
	}
	
}


@media only screen and (max-width : 320px) {
		.image-hero--content{
	    padding:25px 0px 25px 0px!important;
	}
}

@media print {
     .banner-image{display:none;}
     	.image-hero--content h1{font-size:18px;color:#000;text-align:left;}
     img {
        max-width: 300px!important;
        height:auto;
        }
        .banner-image{display:none}
        .image-overlay{display:none}
        .banner-image-wrapper{height:100px;}
}


.umsl-secondary-text{
	 color:#fff;
	 font-family:'Roboto Condensed', sans-serif;
	 font-weight:700;
}

 .image-overlay {
     background: rgba(0, 0, 0, 0.4);
	 position: absolute;
	 z-index:1;
	 top: 0;
	 left: 0;
	 bottom: 0;
	 right: 0;
	 pointer-events: none;
}

.image-hero--content {
	 text-align: center;
	 color: #FFF;
	 text-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
	 position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0px auto;
      display: flex;
  align-items: center;
  z-index:3;
}

.image-hero--content h1 {
    /*font-size: 80px;*/
    font-size:calc(2vw + 45px);
   /* margin: 0 0 10px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 50%; */
    position:relative;
    margin: auto;
    text-align: center;
    height:auto;
}

 .cf:before, .cf:after {
	 content: " ";
	 display: table;
}
 .cf:after {
	 clear: both;
}


.banner-image-wrapper {
	 position: relative;
	 overflow: hidden;
	min-height:400px;
	 clear: both;
	 z-index:-1;
}

 .banner-image {
	position:initial!important;
	min-width: 100%;
    min-height:100%;
    max-width: 100%;
    /* font-family: "object-fit:cover;object-position:center"; */
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}

 .image-js {
	 color: #fff;
}

 @media screen and (max-width: 1199px) {
	 .image-hero--content h1{
		 /*font-size:4rem;*/
	}
	.banner-image-wrapper {
     /*   height: 200px; */
    }
	
}
@media screen and (max-width: 767px){
    
    .image-hero--content h1{
	/*font-size:3rem;*/
	}
    
}


@media only screen and (max-width : 1200px) {
		.image-hero--content{
	    padding:130px 0px 130px 0px;
	}
}


@media only screen and (max-width : 992px) {
    .banner-image-wrapper{
        min-height:250px;
    }
		.image-hero--content{
	    padding:90px 0px 90px 0px;
	}
	.image-hero--content h1{
	font-size:calc(2vw + 30px)
	}
}


@media only screen and (max-width : 768px) {
	 .image-hero--content h1{
		/* font-size:2.5rem;*/
		 bottom:35px;
	}
		.image-hero--content{
	    padding:60px 0px 60px 0px;
	}
	img.banner-image{
	    max-width:100%;
	}
	
}


@media only screen and (max-width : 480px) {
/*	.image-hero--content h1{
		 font-size:1.8rem;
	}*/
	
	img.banner-image{
	    max-width:100%;
	}
	.image-hero--content{
	    margin:0px;
	     padding:40px 0px 40px 0px!important;
	}
	
}


@media only screen and (max-width : 320px) {
		.image-hero--content{
	    padding:25px 0px 25px 0px!important;
	}
}

@media print {
     .banner-image{display:none;}
     	.image-hero--content h1{font-size:18px;color:#000;text-align:left;}
     img {
        max-width: 300px!important;
        height:auto;
        }
        .banner-image{display:none}
        .image-overlay{display:none}
        .banner-image-wrapper{height:100px;}
}