@font-face {
    font-family: "DIN";
    src: url("fonts/DINCondensedC.ttf");
}


.toggle_switch_label {
    cursor: pointer;
    width: 68px;
    height: 48px;
    background: transparent;
    display: inline-block;
    position: relative;
    border: 1px solid #2B3242;
    box-sizing: border-box;
}

.toggle_switch_label span {
    color: #fff;

}

.toggle_switch_label:before {
    content: '';
    position: absolute;
    top: 8px;
    left: 8px;
    width: 32px;
    height: 32px;
    background: #2B3242;
    transition: 0.3s;
}

.toggle_switch_label:after {
    content: '›';
    position: absolute;
    top: 8px;
    left: 8px;
    width: 32px;
    height: 32px;
    text-align: center;
    line-height: 27px;
    color: #00B8C5;
    transition: 0.3s;
}

#is_bet:checked + label {
    border: 1px solid #00B8C5;
}

#is_bet:checked + label:before {
    left: calc(100% - 8px);
    transform: translateX(-100%);
    background: #00B8C5;
}

#is_bet:checked + label:after {
    left: calc(100% - 8px);
    transform: translateX(-100%) rotateY(180deg);
    color: #fff;
}

#is_bet:active:before {
    width: 130px;
}

.toggle_switch_desc {
    //margin-top: 10px;
    font-family: DIN;
    color: #fff;
	position: relative;
	top: 1px;
}

.toggle_switch_desc .grey-white {
    opacity: 0.4;
}

.toggle_switch_desc.checked .grey-white {
    opacity: 1;
}

.toggle_switch_desc.checked .white-cyan {
    color: #00B8C5;
}


@media screen and (max-width: 768px) {}