#hero .text-container{
	height: 110vh;
}
.filled-text-top{
	position: absolute;
	top: calc(50% - 36px) ;
    transform: translateY(-50%);
	left: 100px ;
	z-index: 1 ;
	font-size: 72px ;
	font-weight: 400 ;
    color: #43525A;
	text-wrap: nowrap;
}
.filled-text-bottom{
	position: absolute;
	top: calc(50% + 36px) ;
    transform: translateY(-50%);
	right: 100px ;
	z-index: 1 ;
	font-size: 72px ;
	font-weight: 400 ;
    color: #43525A;
	text-wrap: nowrap;
}
.filled-text-center{
	position: absolute;
	top: calc(50% + 72px) ;
    transform: translateY(-50%);
	left: 100px ;
	z-index: 1 ;
	font-size: 72px ;
	font-weight: 400 ;
    color: #43525A;
	text-wrap: nowrap;
}

.outline-text-top {
	position: absolute;
	top: calc(50% - 36px) ;
    transform: translateY(-50%);
	left: 100px ;
	z-index: 3 ;
	font-size: 72px ;
	font-weight: 400 ;
    color: #fff;
	text-wrap: nowrap;

}
.outline-text-bottom {
	position: absolute;
	top: calc(50% + 36px) ;
    transform: translateY(-50%);
	right: 100px ;
	z-index: 3 ;
	font-size: 72px ;
	font-weight: 400 ;
    color: #fff;
	text-wrap: nowrap;
}
.outline-text-center {
	position: absolute;
	top: 50% ;
    transform: translateY(-50%);
	left: 100px ;
	z-index: 3 ;
	font-size: 72px ;
	font-weight: 400 ;
    color: #fff;
	text-wrap: nowrap;
}
.img-between {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    clip-path: inset(0% 0%);
}

@media (max-width: 1440px) {
    .filled-text-top, .outline-text-top {
        font-size: 54px;
        top: calc(50% - 24px);
        left: 50px;
    }
    .filled-text-bottom, .outline-text-bottom {
        font-size: 54px;
        top: calc(50% + 27px);
        right: 50px;
    }
    .filled-text-center, .outline-text-center {
        font-size: 54px;
        top: calc(50% + 54px);
        left: 50px;
    }
}
@media (max-width: 1023px) {
    #hero .text-container {
        height: 60vh;
    }
    #hero .img-between img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .filled-text-top, .outline-text-top {
        font-size: 48px;
        top: calc(50% - 24px);
        left: -20px;
    }
    .filled-text-bottom, .outline-text-bottom {
        font-size: 48px;
        top: calc(50% + 24px);
        right: -60px;
    }
    .filled-text-center, .outline-text-center {
        font-size: 48px;
        top: calc(50% + 48px);
        left: 0;
    }
}
@media (max-width: 768px) {
    #hero .text-container {
        height: 50vh;
    }
    .filled-text-top, .outline-text-top {
        font-size: 22px;
        top: calc(50% - 11px);
        left: -20px;
    }
    .filled-text-bottom, .outline-text-bottom {
        font-size: 22px;
        top: calc(50% + 11px);
        right: -30px;
    }
    .filled-text-center, .outline-text-center {
        font-size: 22px;
        top: calc(50% + 22px);
        left: -20px;
    }
    .img-between {
        top: 14%;
    }
}
#hero h2{
    background-color: rgba(14, 88, 107, 0.01);
}
