/* Globle Css */
.style_4 .wheelspoke-main .wheelspoke-wrap{width: 380px; height: 380px; margin: 180px auto; border-radius: 380px;position: relative;}
/* Center Box */
.style_4 .wheelspoke-main .center-box{width: 160px; height: 160px; border-radius: 50%; top: 50%; left: 50%; transform: translate(-50%, -50%); position: absolute; display: flex; align-items: center; justify-content: center; padding: 10px; text-align: center; z-index: 11; outline-offset: 5px; animation: center-anim infinite linear 3s;}
.style_4 .wheelspoke-main .center-box .content-one .title{font-size: 16px; margin: 0;}

/* Around Box */
.style_4 .wheelspoke-main .around-boxes{position: absolute; left: 0; top: 0; height: 100%; width: 100%; background: transparent;}
.style_4 .wheelspoke-main .around-boxes .box{width: 100px; height: 100px; border-radius: 50%; display: flex; align-items: center; justify-content: center; position: absolute; left: 50%; top: 0; transform-origin: 0 calc(380px / 2); cursor: pointer; transition: 0.5s;}
.style_4 .wheelspoke-main .around-boxes .box:after { content: ''; height: 52px; width: 5px; top: 100px; position: absolute;}

.style_4 .wheelspoke-main .around-boxes .box .content-one { height: 80%; width: 80%; border-radius: 100%; background: #fff; display: flex; align-items: center; flex-direction: column; justify-content: center; transition: 0.5s;}
.style_4 .wheelspoke-main .around-boxes .box .content-one .icon{transition: 0.5s;}
.style_4 .wheelspoke-main .around-boxes .box .content-one .icon img{max-width: 40px; width: 100%;}
.style_4 .wheelspoke-main .around-boxes .box .title { font-size: 14px; font-weight: 400; position: absolute; left: -50px; top: -80px; width: 240px; height: 85px; transition: 0.5s; display: flex; flex-direction: column; justify-content: center;}
.style_4 .wheelspoke-main .around-boxes .box .title .heading{font-size: 18px; margin-bottom: 4px;}


/* 4 Item Content */
.style_4.total-items4 .wheelspoke-main .around-boxes .box:nth-child(1) .title { text-align: center; top: -96px; left: -68px; }
.style_4.total-items4 .wheelspoke-main .around-boxes .box:nth-child(2) .title { left: -66px; top: -174px; }
.style_4.total-items4 .wheelspoke-main .around-boxes .box:nth-child(3) .title { left: -75px; top: -96px; text-align: center; }
.style_4.total-items4 .wheelspoke-main .around-boxes .box:nth-child(4) .title { text-align: right; left: -73px; top: -174px; }

/* 5 Item Content */
.style_4.total-items5 .wheelspoke-main .around-boxes .box:nth-child(1) .title { text-align: center; top: -96px; left: -68px; }
.style_4.total-items5 .wheelspoke-main .around-boxes .box:nth-child(2) .title { left: -13px; top: -165px; }
.style_4.total-items5 .wheelspoke-main .around-boxes .box:nth-child(3) .title { left: -211px; top: -105px; }
.style_4.total-items5 .wheelspoke-main .around-boxes .box:nth-child(4) .title { text-align: right; left: 77px; top: -98px; }
.style_4.total-items5 .wheelspoke-main .around-boxes .box:nth-child(5) .title { left: -122px; top: -165px; text-align: right; }

/* 6 Item Content */
.style_4.total-items6 .wheelspoke-main .around-boxes .box:nth-child(1) .title { text-align: center; top: -96px; left: -68px; }
.style_4.total-items6 .wheelspoke-main .around-boxes .box:nth-child(2) .title { left: 26px; top: -153px; }
.style_4.total-items6 .wheelspoke-main .around-boxes .box:nth-child(3) .title { left: -156px; top: -156px; }
.style_4.total-items6 .wheelspoke-main .around-boxes .box:nth-child(4) .title { text-align: center; left: -70px; top: -96px; }
.style_4.total-items6 .wheelspoke-main .around-boxes .box:nth-child(5) .title { left: 24px; top: -152px; text-align: right; }
.style_4.total-items6 .wheelspoke-main .around-boxes .box:nth-child(6) .title { top: -150px; left: -159px; text-align: right; } 

/* 7 Item Content */
.style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(1) .title { text-align: center; top: -96px; left: -66px; }
.style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(2) .title { left: 43px; top: -134px; }
.style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(3) .title { left: -105px; top: -169px; }
.style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(4) .title { left: -230px; top: -76px; }
.style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(5) .title { text-align: center; left: -110px; top: -83px; }
.style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(6) .title { top: -167px; left: -25px; text-align: right; }
.style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(7) .title { top: -139px; left: -174px; text-align: right; }

/* 8 Item Content */
.style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(1) .title { text-align: center; top: -96px; left: -66px; }
.style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(2) .title { left: 61px; top: -123px; }
.style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(3) .title { left: -72px; top: -175px; }
.style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(4) .title { left: -192px; top: -130px; }
.style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(5) .title {text-align: center; left: -68px; top: -96px;}
.style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(6) .title { top: -123px; left: 58px; text-align: right; }
.style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(7) .title { top: -173px; left: -66px; text-align: right; }
.style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(8) .title { top: -123px; left: -199px; text-align: right; }


/* Effect CSS */
.style_4 .wheelspoke-main .around-boxes .box:hover .content-one{background: transparent;}
.style_4 .wheelspoke-main .around-boxes .box:hover .content-one .icon{transform: scale(1.1); filter: invert(1);}

@keyframes center-anim{
    0%{
        box-shadow: inset 0 0 70px -20px #333;
    }
    50%{
        box-shadow: inset 0 0 0 0px #333;
    }
    100%{
        box-shadow: inset 0 0 70px -20px #333;
    }
}

/* Responsive */
@media (max-width:999px) {
    .style_4 .wheelspoke-main .wheelspoke-wrap { width: 300px; height: 300px; }
    .style_4 .wheelspoke-main .center-box{height: 130px; width: 130px; outline-offset: 3px; outline-width: 3px !important;}
    .style_4 .wheelspoke-main .center-box .content-one .title{font-size: 14px;}
    .style_4 .wheelspoke-main .around-boxes .box { width: 90px; height: 90px; transform-origin: 0 calc(300px / 2); }
    .style_4 .wheelspoke-main .around-boxes .box:after{top: 87px; width: 4px; height: 39px;}
    .style_4 .wheelspoke-main .around-boxes .box .title{font-size: 12px; width: 170px; line-height: 1.2;}
    .style_4 .wheelspoke-main .around-boxes .box .title .heading{font-size: 14px;}
    .style_4 .wheelspoke-main .around-boxes .box .content-one .icon img{max-width: 35px;}

    /* 4 Item Content */
    .style_4.total-items4 .wheelspoke-main .around-boxes .box:nth-child(1) .title { top: -88px; left: -40px; }
    .style_4.total-items4 .wheelspoke-main .around-boxes .box:nth-child(2) .title { left: -37px; top: -138px; }
    .style_4.total-items4 .wheelspoke-main .around-boxes .box:nth-child(3) .title { left: -40px; top: -88px; }
    .style_4.total-items4 .wheelspoke-main .around-boxes .box:nth-child(4) .title { left: -43px; top: -137px; }

    /* 5 Item Content */
    .style_4.total-items5 .wheelspoke-main .around-boxes .box:nth-child(1) .title {top: -89px; left: -41px; }
    .style_4.total-items5 .wheelspoke-main .around-boxes .box:nth-child(2) .title { left: 4px; top: -132px; }
    .style_4.total-items5 .wheelspoke-main .around-boxes .box:nth-child(3) .title { left: -151px; top: -85px; }
    .style_4.total-items5 .wheelspoke-main .around-boxes .box:nth-child(4) .title { text-align: right; left: 72px; top: -80px; }
    .style_4.total-items5 .wheelspoke-main .around-boxes .box:nth-child(5) .title { left: -82px; top: -133px; text-align: right; }

    /* 6 Item Content */
    .style_4.total-items6 .wheelspoke-main .around-boxes .box:nth-child(1) .title { top: -88px; left: -38px; }
    .style_4.total-items6 .wheelspoke-main .around-boxes .box:nth-child(2) .title { left: 33px; top: -118px; }
    .style_4.total-items6 .wheelspoke-main .around-boxes .box:nth-child(3) .title { left: -106px; top: -121px; }
    .style_4.total-items6 .wheelspoke-main .around-boxes .box:nth-child(4) .title { left: -38px; top: -88px; }
    .style_4.total-items6 .wheelspoke-main .around-boxes .box:nth-child(5) .title { left: 29px; top: -119px; }
    .style_4.total-items6 .wheelspoke-main .around-boxes .box:nth-child(6) .title { top: -122px; left: -106px; }

    /* 7 Item Content */
    .style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(1) .title { top: -89px; left: -39px; }
    .style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(2) .title { left: 49px; top: -110px; }
    .style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(3) .title { left: -64px; top: -135px; }
    .style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(4) .title { left: -163px; top: -68px; }
    .style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(5) .title { left: -75px; top: -81px; }
    .style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(6) .title { top: -133px; left: -10px; }
    .style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(7) .title { top: -109px; left: -125px; }

    /* 8 Item Content */
    .style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(1) .title { top: -87px; left: -39px; }
    .style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(2) .title { left: 55px; top: -101px; }
    .style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(3) .title { left: -44px; top: -135px; }
    .style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(4) .title { left: -133px; top: -103px; }
    .style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(5) .title { left: -39px; top: -87px; }
    .style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(6) .title { top: -100px; left: 55px; }
    .style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(7) .title { top: -135px; left: -35px; }
    .style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(8) .title { top: -102px; left: -132px; }
}
@media (max-width:767px) {
    .style_4 .wheelspoke-main .wheelspoke-wrap{margin: 90px auto;}
    .style_4 .wheelspoke-main .around-boxes .box .title{width: 100px;}
    .style_4 .wheelspoke-main .around-boxes .box .title .heading{font-size: 12px;}
    .style_4 .wheelspoke-main .around-boxes .box .title .subtext{display: none;}

    /* All Content */
    .style_4 .wheelspoke-main .around-boxes .box .title { width: 82px; height: auto; left: 0px !important; top: -23px !important; transform: none !important; text-align: center !important; }
    .style_4.total-items4 .wheelspoke-main .around-boxes .box:nth-child(3) .title{transform: rotate(calc(-90deg * 2)) !important; margin-top: -6px;}
    .style_4.total-items5 .wheelspoke-main .around-boxes .box:nth-child(3) .title, .style_4.total-items5 .wheelspoke-main .around-boxes .box:nth-child(4) .title{transform: rotate(calc(-90deg * 2)) !important; margin-top: -5px;}
    .style_4.total-items6 .wheelspoke-main .around-boxes .box:nth-child(3) .title, .style_4.total-items6 .wheelspoke-main .around-boxes .box:nth-child(4) .title, .style_4.total-items6 .wheelspoke-main .around-boxes .box:nth-child(5) .title{transform: rotate(calc(-90deg * 2)) !important; margin-top: -5px;}
    .style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(3) .title, .style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(4) .title, .style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(5) .title, .style_4.total-items7 .wheelspoke-main .around-boxes .box:nth-child(6) .title{transform: rotate(calc(-90deg * 2)) !important; margin-top: -5px;}
    .style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(4) .title, .style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(5) .title, .style_4.total-items8 .wheelspoke-main .around-boxes .box:nth-child(6) .title{transform: rotate(calc(-90deg * 2)) !important; margin-top: -5px;}
}
@media (max-width:480px) {
    .style_4 .wheelspoke-main .wheelspoke-wrap{ width: 210px; height: 210px; margin: 70px auto;}
    .style_4 .wheelspoke-main .center-box { height: 100px; width: 100px; }
    .style_4 .wheelspoke-main .center-box .content-one .title{font-size: 11px;}
    .style_4 .wheelspoke-main .around-boxes .box{height: 70px; width: 70px; transform-origin: 0 calc(210px / 2);}
    .style_4 .wheelspoke-main .around-boxes .box:after { top: 67px; width: 3px; height: 19px; }
    .style_4 .wheelspoke-main .around-boxes .box .title .heading{font-size: 10px;}
    .style_4 .wheelspoke-main .around-boxes .box .content-one .icon img { max-width: 27px; }
    .style_4 .wheelspoke-main .around-boxes .box .title { width: 72px; top: -14px !important; }
}