.boximgspan,
.boximgspan2,
.boximgspan3 {
	position:absolute;
	top: 0;
	bottom:0;
	left: 0;
	right:0;
	width: 102%;
	height: 101%;
	z-index: 100;
	background-position:center;    
}

.boximgspan{background: linear-gradient( to top, rgb(0, 0, 0), rgba(0, 0, 0, 0) );}
.boximgspan2{background: linear-gradient( to bottom, rgb(0, 0, 0), rgba(0, 0, 0, 0) );}
.boximgspan3{background: linear-gradient( to top, rgb(0, 0, 0), rgba(5, 27, 39, 0) );}


.textarea,
.textarea2,
.textarea3{
    height: 25%;
    width: 100%;
    /* padding-top: 100%; */
    /* background-color:black; */
    position: absolute;    
}

.textarea{bottom: 0;left: 0;}
.textarea2{top: 0;left: 0;}
.textarea3{height: 50%; top: 0; left: 0; bottom: 0; right: 0; position: absolute; margin: auto; padding:20px;}

.textareatext,
.textareatext2{
    position: absolute;
    font-family: 'blacker_pro_textbook', serif;
    letter-spacing: 1px;
    color:white;
    font-size: 2.2vh;
    padding:20px 20px;
    line-height: 120%;
}

.textareatext{bottom: 0;left: 0;}
.textareatext2{top: 0;left: 0;}

.textareatext span,
.textareatext2 span{
    font-family: 'blacker_pro_displayheavy', serif;
    color:bisque;
    font-size: 1.3vh;
}

.textarea3_halfheight{
    /* background-color: blue; */
    height:50%;
    width:100%;
    float:left;
}

.textareadivided{
    /* background-color: blue; */
    height:100%;
    width:25%;
    float:left;
}

.textareadivided svg{
    height:100%;
    width:100%;
    padding:30px;
    opacity:0.5;
    color:white;
}

.textareadivided svg:hover{opacity:1;cursor:pointer}

.textarea3text{
    height:100%;
    width:100%;
    padding:30px;
    opacity:0.5;
    color:white;
    letter-spacing: 1px;
    font-size: 3.2vh;
    line-height: 120%;
    font-family: 'blacker_pro_textbook', serif;
    text-align: center;
}