/*#pbuttonu42154, #pbuttonu42130 {
    box-sizing: border-box;
    padding: 0 32px;
    width: 100%;
}*/

.container {
    perspective: 2800px;
    /*float: left;
    margin-right: unset !important;
    left: unset !important;
    margin-right: 2.2%;*/
}

.front,
.back {
    transform-origin: center;
    backface-visibility: hidden;
    overflow: hidden;
}

.front {
    transform: rotateY(0deg);
}

.back {
    transform: rotateY(-180deg);
    display: none;
}

.flipped {
    transform: rotateY(180deg);
}

.card1,
.card2,
.card3,
.card4,
.card5,
.card6 {
    transform-origin: center;
    transition: transform 1s;
    transform-style: preserve-3d;
}

.flip1,
.flip2,
.flip3,
.flip4,
.flip5,
.flip6 {
    cursor: pointer;
}

@media only screen and (min-width: 1100px) {

    .front:hover .flip1,
    .front:hover .flip2,
    .front:hover .flip3,
    .front:hover .flip4,
    .front:hover .flip5,
    .front:hover .flip6 {
        transform: translateY(0);
        opacity: 1 !important;
    }

    .front .flip1,
    .front .flip2,
    .front .flip3,
    .front .flip4,
    .front .flip5,
    .front .flip6 {
        transition: 0.3s;
        transform: translateY(-44px);
        opacity: 0;
    }
}

.flip1 .svg,
.flip2 .svg,
.flip3 .svg,
.flip4 .svg,
.flip5 .svg,
.flip6 .svg {
    transition: 0.3s;
    opacity: 0.3;
}

.flip1:hover .svg,
.flip2:hover .svg,
.flip3:hover .svg,
.flip4:hover .svg,
.flip5:hover .svg,
.flip6:hover .svg {
    opacity: 1;
}
