.archive-hero {
    position: relative;
    height: 520px;
}
.archive-hero__wrapper {
    position: absolute;
	left: 0;
	right: 0;
	height: 100%;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

.caption__bg {
    background-color: rgba(255,255,255,0.4);
}
.for-desktop {
    display: block;
}
.for-mobile {
    display: none;
}

@media(max-width: 880px) {
    .for-desktop {
        display: none;
    }
    .for-mobile {
        display: block;
    }
    .archive-hero {
        height: 680px;
    }
}
@media(max-width: 768px) {
    .archive-hero {
        margin-bottom: 35px;
    }
    .archive-hero__wrapper {
        background-size: contain;
    }
}
@media only screen and (max-width: 800px) {
  .mobileheader {
    display: block;
  }
}