.basic-hero{height: 35vw;display: flex;align-items: center;justify-content: center;flex-wrap: wrap;position: relative; background-size: cover; background-repeat: no-repeat; background-position: center;}
.basic-hero.reduce-top-margin, .resource-hero.reduce-margin-top{margin-top: -100px;}
.basic-hero .title-area{text-align: center;width: 100%;}
.basic-hero .image-wrap{height: 6vw; width: 100%;}
.basic-hero .title{color: white;}
.basic-hero .breadcrumb-wrap{position: absolute;left: 0px;bottom: 0px;padding: 30px;background: rgba(0,0,0,.2);width: 100%;color: white;}
.basic-hero #breadcrumbs{margin: 0px;}
.basic-hero #breadcrumbs, .basic-hero #breadcrumbs a{color: white;}

.resource-hero{height: 375px; padding-top: 50px; background-repeat: no-repeat; background-position: center; background-size: cover; display: flex; align-items: center; justify-content: center; flex-wrap: wrap;}
.resource-hero .title-area{max-width: 90%; text-transform: capitalize;}
.resource-hero .title{color: white; width: 100%; text-align: center;}
.resource-hero .title.h2{margin-bottom: 0px;}
.resource-hero h4{font-weight: 700;}

.mini-hero .title{margin-top: 0px;}

@media(max-width: 1920px){
	.resource-hero{height: 275px;}
}

@media(max-width: 1440px){
	.basic-hero{height: 50vw; max-height: 500px;}
	.basic-hero .title{margin-top: 10px;}
	.basic-hero .breadcrumb-wrap{padding: 10px 30px;}
}

@media(max-width: 768px){
	.basic-hero.reduce-top-margin, .resource-hero.reduce-margin-top{height: auto;padding-top: 130px;padding-bottom: 30px;}
	.basic-hero .image-wrap{height: 60px;}
	.basic-hero .title{max-width: 300px;margin-left: auto;margin-right: auto;}
	.basic-hero .breadcrumb-wrap{display: none;}
}