.showreel-buttons{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100px;
    background-color: #2c292d;
    z-index: 50;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    transition: all 0.35s ease;
    transform: translateY(0%);
}

.down{
    transition: all 0.45s ease;
    transform: translateY(120%);
}

.showreel-play-pause{
    display: grid;
    align-items: center;
    justify-content: center;
}


.showreel-btn{
    text-align: center;
    color: #00beb2;
}

.full-screen{
    transform: none !important;
    width: 100vw !important;
    height: calc(100vh - 100px) !important; 
    height: calc(100vh - 100px) !important;
    max-height: -webkit-fill-available !important;
}

.showreel-play, .showreel-pause {
    border: 0;
    background: transparent;
    box-sizing: border-box;
    width: 0;
    height: 75px;
    border-color: transparent transparent transparent #00beb2;
    transition: 100ms all ease;
    cursor: pointer;
   
}

.showreel-pause {
    border-color: transparent transparent transparent #e0e70b;
}

.showreel-play{
    border-style: solid;
    border-width: 37px 0 37px 60px;
}
.showreel-pause {
    border-style: double;
    border-width: 0px 0 0px 60px;
}

.showreel-full, .showreel-back{
    height: 75px;
}

.showreel-buttons img{
    height: 100%;
    max-height: 100%;
    object-fit: contain;
}

.showreel-buttons:hover{
    cursor: pointer;
}

@media(max-width: 800px) {

    .showreel-buttons{
        height: 75px;
        justify-content: center;
    }

    .showreel-btn{
        padding: 0 5px;
    }

    .full-screen{
        height: calc(100vh - 75px) !important; 
        height: calc(100vh - 75px) !important;
        max-height: -webkit-fill-available !important;
    }

    .showreel-play, .showreel-pause {
        margin-left: 15px;
        height: 50px;
       
    }

    .mobile-dead{
        display: none;
    }
    
    .showreel-play{
        border-width: 25px 0 25px 40px;
    }
    .showreel-pause {
        border-width: 0px 0 0px 40px;
    }
    
    .showreel-full, .showreel-back{
        height: 50px;
    }
    
}
