.holderCircle{width:500px;height:500px;border-radius:100%;margin:60px auto;position:relative}.dotCircle{width:100%;height:100%;position:absolute;margin:auto;top:0;left:0;right:0;bottom:0;border-radius:100%;z-index:20}.dotCircle .itemDot{display:block;width:80px;height:80px;position:absolute;background:#fff;color:#7eba00;border-radius:20px;text-align:center;line-height:80px;font-size:30px;z-index:3;cursor:pointer;border:2px solid #e6e6e6}.dotCircle .itemDot .forActive{width:56px;height:56px;position:absolute;top:0;left:0;right:0;bottom:0;display:none}.dotCircle .itemDot .forActive:after{content:"";width:5px;height:5px;border:3px solid #7eba00;bottom:-31px;left:-14px;filter:blur(1px);position:absolute;border-radius:100%}.dotCircle .itemDot .forActive:before{content:"";width:6px;height:6px;filter:blur(5px);top:-15px;position:absolute;transform:rotate(-45deg);border:6px solid #31287c;right:-39px}.dotCircle .itemDot.active .forActive{display:block}.round{position:absolute;left:40px;top:45px;width:410px;height:410px;border:2px dotted #31287c;border-radius:100%;-webkit-animation:rotation 100s linear infinite}.dotCircle .itemDot{font-size:40px}.dotCircle .itemDot.active,.dotCircle .itemDot:hover{color:#fff;transition:.5s;background:#7eba00;background:linear-gradient(90deg,#009fe3 0,#009fe3 50%,#31287c);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="$color-primary-shade-1",endColorstr="$color-primary",GradientType=1);border:2px solid #fff;box-shadow:0 30px 30px 0 rgba(0,0,0,.13)}.contentCircle{width:250px;border-radius:100%;color:#222;position:relative;top:150px;left:50%;transform:translate(-50%,-50%)}.contentCircle .CirItem{border-radius:100%;color:#222;position:absolute;text-align:center;bottom:0;left:0;opacity:0;transform:scale(0);transition:.5s;font-size:15px;width:100%;height:100%;top:0;right:0;margin:auto;line-height:250px}.CirItem.active{z-index:1;opacity:1;transform:scale(1);transition:.5s}.contentCircle .CirItem i{font-size:180px;position:absolute;top:0;left:50%;margin-left:-90px;color:#000;opacity:.1}@media only screen and (min-width:300px) and (max-width:599px){.holderCircle{width:300px;height:300px;margin:110px auto}.dotCircle,.holderCircle:after{width:100%;height:100%}.dotCircle{top:0;right:0;bottom:0;left:0;margin:auto}}