.C2BoxyElementMain {
    position: fixed;
    right: -200px !important;
    bottom: calc(50vh - 50px);
}

.C2BoxyElement {
    padding: 0;
    height: 100px;
    background-color: rgb(var(--burger-menu-bg-color));
    border-radius: 10px;
}

.C2BoxyElement span.sp_icon.img {
    align-self: anchor-center;
}

.C2BoxyElement img.sp_icon_img {
    width: 100px;
    height: 100px;
    padding: 0;
    content: var(--boxy-icon);
}

.C2BoxyElement.setright .sp_icon {
    left: 0px;
}

.C2BoxyElement.setright .sp_label {
    right: -120px;
}

.C2BoxyElement p, .C2BoxyElement p a {
    color: rgb(var(--text-color));
}

#C2BoxyElement_1.setright:hover,
#C2BoxyElement_2.setright:hover,
#C2BoxyElement_3.setright:hover {
    margin-left: -330px;
}

@media (max-width: 768px) {
	.C2BoxyElementMain {
        /*background-color: transparent;*/
        position: fixed;
        top: unset;
        bottom: 0px;
        z-index: 99;
        padding: 0 0 0 0px;
        left: 0;
        width: 100%;
        right: unset;
        max-width: 100%;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: unset;
        flex-direction: unset;
    }

    .C2BoxyElement {
        display: none;
    }

    .C2BoxyElement p,
    .C2BoxyElement p a {
        color: white;
    }

    .C2BoxyElement p{
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: column;
        flex-direction: column;
        -webkit-justify-content: center;
        justify-content: center;
        position: relative;
        margin: 0;
    }

    /* --- LABEL --- */
    .C2BoxyElement .sp_label,
    .C2BoxyElement .sp_label a {
        font-size: 1rem;
    }

    .C2BoxyElement.setleft .sp_label{
        padding-left: 5px;
    }

    .C2BoxyElement.setright .sp_label{
        display: inline-block;
        width: auto;
        position: relative;
        right: -70px;
        left: unset;
    }

    /* --- ICON --- */
    .C2BoxyElement span.sp_icon.img {
        z-index: 99;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: column;
        flex-direction: column;
        top: 4px;
    }

    .C2BoxyElement img.sp_icon_img {
        height: 25px;
        padding: 5px 0;
    }

    .C2BoxyElement.setleft .sp_icon{
        position: absolute;
        right: 5px;
        font-size: 1rem;
    }

    .C2BoxyElement.setright .sp_icon{
        position: absolute;
        left: 18px;
        font-size: 1rem;
    }

    /* --- HOVER --- */
    #C2BoxyElement_1.setright:hover,
    #C2BoxyElement_2.setright:hover,
    #C2BoxyElement_3.setright:hover{
        margin-left: -250px;
        /*right: 250px;*/
    }

    #C2BoxyElement_1.setleft:hover,
    #C2BoxyElement_2.setleft:hover,
    #C2BoxyElement_3.setleft:hover{
        margin-right: -250px;
        margin-left: 250px;
        /*left: 250px;*/
    }

    /* --- BOXY MOBILE ELEMENT --- */
    .C2BoxyElement_mob{
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: row;
        flex-direction: row;
        justify-content: center;
        width: 100%;
        padding: 20px 10px;
    }

    .C2BoxyElement_mob img.sp_icon_img {
        height: 45px;
        content: var(--boxy-icon);
    }	
}