.box-icons .box-child{
    position: fixed;
    right: 0;
    top: 30vh;
    z-index: 1000 !important;
}

svg{
    height:30px;
}

.text {
    margin-right: 20px;
    position: relative;
    display: none ;
    white-space: nowrap;
}

.box-icon:hover > .text {
    display: block;
    animation-fill-mode: forwards;
    animation-name: textToggle ;
    animation-duration: 300ms;
}

@keyframes textToggle {
    from {right: -300px;}
    to {right: 0px;}
}

.box-link a {
    text-decoration: none;
    color: black;
    
}

.box-icon {
    min-width:60px;
    max-width:0px;
    height: 65px !important;
    padding: 0px 20px;
    display: flex;
    align-items: center;
    justify-content: right;
}

.box-icon:hover { 
    animation-fill-mode: forwards;
    animation-name: bgToggle ;
    animation-duration: 300ms; 
}

@keyframes bgToggle {
    from {max-width:0px;}
    to {max-width: 400px;}
}