/*css*/

h4{
    font-size: 38px;
}
img{
    width:100%;
    position: center;
}
.select{
    display:flex;   
    justify-content: center;
    padding-bottom:45px;  
}
.container{
    position:relative;     
    flex:1;
}
.overlay{
   position: absolute;
   top:0;
   bottom:0;
   right:0;
   left:0;
   height:100%;
   width:100%;
   opacity:0%;
   transition: .5s ease;
   background-color:rgb(19, 19, 29);
}
.container:hover .overlay{
    opacity: 1;
}
.text{
    color:white;
    font-size:50px;
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align:center;
}
.footer{
    align-self:center;
    font-family: "Okine";
    color:grey;
    font-size:14px;
    padding:20px;
}
@media screen and (max-width: 855px) {
.select {
    height: auto;
    flex-flow:column wrap;
    align-items: center;
}
.container {
    align-items: center;
    flex-direction: column;
    gap: 30px;
}
.media {
    margin: 20px 0;
}
}