.bee3D--parent {
    -webkit-perspective: 600px;
    perspective: 600px
}
.bee3D--slide {
    position: absolute;
    -webkit-transform: none;
    transform: none;
    opacity: 0;
    transition: opacity 0.7s ease, -webkit-transform .7s ease;
    transition: opacity 0.7s ease, transform .7s ease;
    transition: opacity 0.7s ease, transform .7s ease, -webkit-transform .7s ease
}
.bee3D--slide__inactive {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none
}
.bee3D--slide__active {
    opacity: 1;
    z-index: 1
}
.bee3D--inner {
    position: relative;
    width: 100%;
    height: 100%
}
.draggable {
    cursor: move;
    cursor: grab;
    cursor: -webkit-grab
}
.draggable:active {
    cursor: grabbing;
    cursor: -webkit-grabbing
}
.bee3D--parallax {
    position: relative !important
}
.bee3D--shadow-wrapper {
    position: absolute;
    z-index: -1;
    left: 0;
    width: 100%;
    height: 100px
}
.bee3D--shadow > span {
    display: block;
    content: '';
    left: 0;
    width: 100%;
    height: 200px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.45);
    box-shadow: 0 0 200px 50px rgba(0, 0, 0, 0.7);
    transition: opacity 1.5s;
    opacity: .15;
    -webkit-transform: rotateX(95deg) translateZ(30px) scale(0.55);
    transform: rotateX(95deg) translateZ(30px) scale(0.55)
}
.bee3D--nav {
    position: absolute;
    cursor: pointer;
    top: 50%;
    font-size: 8em;
    color: rgba(0, 0, 0, 0.45);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transition: color 0.7s ease;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background-color: transparent;
    background-repeat: no-repeat;
    background-size: contain;
    width: 20px;
    height: 40px
}
.bee3D--nav__prev {
    background-image: url("/img/angle-left.svg");
    left: 3%
}
.bee3D--nav__next {
    background-image: url("/img/angle-right.svg");
    right: 3%
}
.bee3D--effect__arc .bee3D--before {
    -webkit-transform: translate(-146.5%, 63%) rotateZ(-17deg) scale(0.5);
    transform: translate(-146.5%, 63%) rotateZ(-17deg) scale(0.5);
    opacity: 0
}
.bee3D--effect__arc .bee3D--before-2 {
    -webkit-transform: translate(-109.5%, 42.3%) rotateZ(-14deg) scale(0.6);
    transform: translate(-109.5%, 42.3%) rotateZ(-14deg) scale(0.6);
    opacity: 0.3
}
.bee3D--effect__arc .bee3D--before-1 {
    -webkit-transform: translate(-67.5%, 19.5%) rotateZ(-8deg) scale(0.8);
    transform: translate(-67.5%, 19.5%) rotateZ(-8deg) scale(0.8);
    opacity: 0.5
}
.bee3D--effect__arc .bee3D--after {
    -webkit-transform: translate(146.5%, 63%) rotateZ(17deg) scale(0.5);
    transform: translate(146.5%, 63%) rotateZ(17deg) scale(0.5);
    opacity: 0
}
.bee3D--effect__arc .bee3D--after-1 {
    -webkit-transform: translate(67.5%, 19.5%) rotateZ(8deg) scale(0.8);
    transform: translate(67.5%, 19.5%) rotateZ(8deg) scale(0.8);
    opacity: 0.5
}
.bee3D--effect__arc .bee3D--after-2 {
    -webkit-transform: translate(109.5%, 42.3%) rotateZ(14deg) scale(0.6);
    transform: translate(109.5%, 42.3%) rotateZ(14deg) scale(0.6);
    opacity: 0.3
}
.broarc{position:relative; height:400px; width:100%;}
.dark{background:#434343!important; margin-bottom:15px;}
.bee3D--parent {
    position: relative;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0
}
.broarc img{width:128px; height:180px; margin:0;}
.bee3D--slide {
    width: 25%;
    height: 128px;
    top: 50%;
    left: 50%;
    margin-left: -65px;
    margin-top: -100px;
}
@media (min-width: 768px) {
.broarc img{width:184px; height:260px; margin:0 0 0 13%;}
.bee3D--slide {
    width: 30%;
    height: 260px;
    top: 50%;
    left: 50%;
    margin-left: -125px;
    margin-top: -180px;
}   
}
@media (min-width: 992px) {
.broarc img{width:212px; height:300px; margin:0 0 0 17%;}
.bee3D--slide {
    width: 30%;
    height: 300px;
    top: 50%;
    left: 50%;
    margin-left: -155px;
    margin-top: -200px;
}
}
@media only screen and (min-width: 1366px){
.broarc img{width:212px; height:300px; margin:0 0 0 22%;}
.bee3D--slide {
    width: 33%;
    height: 300px;
    top: 50%;
    left: 50%;
    margin-left: -195px;
    margin-top: -200px;
}
}
.bee3D--effect__arc .bee3D--inner {
   
}
.bee3D--effect__arc a {
    color: #FFAB07
}
.bee3D--nav__prev {
    background-image: url("../img/angle-left-dark.svg");
    left: 0%;	
}
.bee3D--nav__next {
    background-image: url("../img/angle-right-dark.svg");
    right: 0%;
}
