.box input[type=checkbox] {
    display: none !important;
}

.box input[type=checkbox] + label {
    width: 60px !important;
    height: 32px !important;
    display: block !important;
    border-radius: 35px !important;
    background-color: #231f20 !important;
    padding: 10px 10px 10px 7px !important;
    box-shadow: inset 0 0 10px rgba(0,0,0,0.2) !important;
    cursor: pointer !important;
    cursor: hand !important;
}
.box input[type=checkbox]:checked + label
{
    background-color: #ff374d !important;
}
.box #bb8_body {
    transform: rotate(-360deg) !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 100% !important;
    background: rgba(240, 240, 240, 1) !important;
    background: -moz-radial-gradient(center, ellipse cover, rgba(240, 240, 240, 1) 0%, rgba(235, 235, 235, 1) 72%, rgba(191, 191, 191, 1) 100%) !important;
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(240, 240, 240, 1)), color-stop(72%, rgba(235, 235, 235, 1)), color-stop(100%, rgba(191, 191, 191, 1))) !important;
    background: -webkit-radial-gradient(center, ellipse cover, rgba(240, 240, 240, 1) 0%, rgba(235, 235, 235, 1) 72%, rgba(191, 191, 191, 1) 100%) !important;
    background: -o-radial-gradient(center, ellipse cover, rgba(240, 240, 240, 1) 0%, rgba(235, 235, 235, 1) 72%, rgba(191, 191, 191, 1) 100%) !important;
    background: -ms-radial-gradient(center, ellipse cover, rgba(240, 240, 240, 1) 0%, rgba(235, 235, 235, 1) 72%, rgba(191, 191, 191, 1) 100%) !important;
    background: radial-gradient(ellipse at center, rgba(240, 240, 240, 1) 0%, rgba(235, 235, 235, 1) 72%, rgba(191, 191, 191, 1) 100%) !important;
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f0f0f0', endColorstr='#bfbfbf', GradientType=1) !important;
}

.box #c1,
.box #c2,
.box #c3 {
    width: 7px !important;
    height: 7px !important;
    border-radius: 100% !important;
    border: 2px solid #fac562 !important;
    position: relative !important;
}

.box .s1 {
    background: #fac562 !important;
    /* Old browsers */
    background: -moz-linear-gradient(top, #fac562 0%, #fac562 24%, #f0f0f0 27%, #f0f0f0 76%, #fac562 79%, #fac562 100%) !important;
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #fac562 0%, #fac562 24%, #f0f0f0 27%, #f0f0f0 76%, #fac562 79%, #fac562 100%) !important;
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #fac562 0%, #fac562 24%, #f0f0f0 27%, #f0f0f0 76%, #fac562 79%, #fac562 100%) !important;
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#fac562', endColorstr='#fac562', GradientType=0) !important;
    /* IE6-9 */
    width: 3px !important;
    height: 3px !important;
    position: relative !important;
    left: 0px !important;
}

.box .s2 {
    background: #fac562 !important;
    /* Old browsers */
    background: -moz-linear-gradient(left, #fac562 0%, #fac562 24%, #f0f0f0 27%, #f0f0f0 76%, #fac562 79%, #fac562 100%) !important;
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #fac562 0%, #fac562 24%, #f0f0f0 27%, #f0f0f0 76%, #fac562 79%, #fac562 100%) !important;
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #fac562 0%, #fac562 24%, #f0f0f0 27%, #f0f0f0 76%, #fac562 79%, #fac562 100%) !important;
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#fac562', endColorstr='#fac562', GradientType=1) !important;
    /* IE6-9 */
    width: 3px !important;
    height: 3px !important;
    position: relative !important;
    top: -3px !important;
    left: 0px;
}

.box #c1 {
    left: 10px !important;
    top: 1px !important;
}

.box #c2 {
    left: 5px !important;
    top: 7px !important;
}

.box #c3 {
    left: 15px !important;
    top: 0px !important;
}

.box #half_circle {
    height: 10px !important;
    width: 15px !important;
    border-radius: 30px 30px 0 0 !important;
    background: #f0f0f0 !important;
}

.box #lens1 {
    background-color: #262626 !important;
    width: 4px !important;
    height: 4px !important;
    border-radius: 100% !important;
    position: relative !important;
    left: 2px !important;
    top: 3px !important;
}

.box #lens2 {
    background-color: #262626 !important;
    width: 2px !important;
    height: 2px !important;
    border-radius: 100% !important;
    position: relative !important;
    left: 10px !important;
    top: 0px !important;
}

.box #or0 {
    background-color: #fac562 !important;
    height: 1px !important;
    width: 6px !important;
    border-radius: 1px !important;
    position: relative !important;
    top: 2px !important;
    left: 5px !important;
}

.box #or1 {
    background-color: #fac562 !important;
    height: 2px !important;
    width: 15px !important;
    border-radius: 1px !important;
    position: relative !important;
    top: 1px !important;
}

.box #dg1 {
    background-color: #666666 !important;
    height: 4px !important;
    width: 15px !important;
}

.box #lg1 {
    border-top: 3px solid #9f9f9f !important;
    border-left: 5px solid transparent !important;
    border-right: 5px solid transparent !important;
    height: 0 !important;
    width: 15px !important;
}

.box #lg2 {
    background-color: #e0e0e0 !important;
    height: 2px !important;
    width: 28px !important;
    position: relative !important;
    top: 12px !important;
}

.box #bb8_head {
    margin-left: 6px !important;
    margin-top: -25px !important;
}

.box input[type=checkbox]:checked + label #bb8_body {
    margin-left: 18px !important;
    transform: rotate(360deg) !important;
}

.box input[type=checkbox]:checked + label #bb8_head {
    margin-left: 25px !important;
}

.box input[type=checkbox]:checked + label ~ section {
    background-color: #3384a8 !important;
}
.box * {
    transition: 1s all !important;
}
.box .section {
    position: absolute !important;
    top:0 !important;
    left:0 !important;
    height: 100% !important;
    width:100% !important;
    background: #79d6ff !important;
    z-index: -10 !important;
}