/*
 *
 *
 *
 * Bootstrap 4 Component - Custom switch
 * Version: 1.0.6
 * Copyright (c) 2017 Martin Haubek
 *
 *
 *
 */
.custom-switch .custom-switch-input {
  display: none; }
  .custom-switch .custom-switch-input, .custom-switch .custom-switch-input:after, .custom-switch .custom-switch-input:before,
  .custom-switch .custom-switch-input *,
  .custom-switch .custom-switch-input *:after,
  .custom-switch .custom-switch-input *:before,
  .custom-switch .custom-switch-input + .custom-switch-btn {
    box-sizing: border-box; }
    .custom-switch .custom-switch-input:selection, .custom-switch .custom-switch-input:after:selection, .custom-switch .custom-switch-input:before:selection,
    .custom-switch .custom-switch-input *:selection,
    .custom-switch .custom-switch-input *:after:selection,
    .custom-switch .custom-switch-input *:before:selection,
    .custom-switch .custom-switch-input + .custom-switch-btn:selection {
      background: none; }
  .custom-switch .custom-switch-input + .custom-switch-btn {
    outline: 0;
    display: inline-block;
    position: relative;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    cursor: pointer;
    width: 68px;
    height: 38px;
    margin: 0;
    padding: 4px;
    background: #333;
    border-radius: 76px;
    transition: all 300ms ease; }
    .custom-switch .custom-switch-input + .custom-switch-btn:after, .custom-switch .custom-switch-input + .custom-switch-btn:before {
      position: relative;
      display: block;
      content: "";
      width: 30px;
      height: 30px; }
    .custom-switch .custom-switch-input + .custom-switch-btn:after {
      left: 2px;
      border-radius: 50%;
      background: white;
      transition: all 300ms ease; }
    .custom-switch .custom-switch-input + .custom-switch-btn:before {
      display: none; }
  .custom-switch .custom-switch-input:checked + .custom-switch-btn {
    background: #3c65f6; }
    .custom-switch .custom-switch-input:checked + .custom-switch-btn:after {
      left: 30px; }
    .custom-switch .custom-switch-input:checked + .custom-switch-btn ~ .custom-switch-content-checked {
      opacity: 1;
      height: auto; }
    .custom-switch .custom-switch-input:checked + .custom-switch-btn ~ .custom-switch-content-unchecked {
      display: none;
      opacity: 0;
      height: 0; }
  .custom-switch .custom-switch-input:not(:checked) + .custom-switch-btn ~ .custom-switch-content-checked {
    display: none;
    opacity: 0;
    height: 0; }
  .custom-switch .custom-switch-input:not(:checked) + .custom-switch-btn ~ .custom-switch-content-unchecked {
    opacity: 1;
    height: auto; }

.custom-switch.custom-switch-label-io .custom-switch-input + .custom-switch-btn {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='68' height='38'%3E%3Ctext x='42.5' y='23.75' font-size='12px' font-family='-apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif' fill='%23fff'%3EO%3C/text%3E%3C/svg%3E"); }

.custom-switch.custom-switch-label-io .custom-switch-input:checked + .custom-switch-btn {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='68' height='38'%3E%3Ctext x='18.13333' y='23.75' font-size='12px' font-family='-apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif' fill='%23fff'%3EI%3C/text%3E%3C/svg%3E"); }

.custom-switch.custom-switch-label-onoff .custom-switch-input + .custom-switch-btn {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='68' height='38'%3E%3Ctext x='38.85714' y='23.75' font-size='12px' font-family='-apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif' fill='%23fff'%3EOff%3C/text%3E%3C/svg%3E"); }

.custom-switch.custom-switch-label-onoff .custom-switch-input:checked + .custom-switch-btn {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='68' height='38'%3E%3Ctext x='9.71429' y='23.75' font-size='12px' font-family='-apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif' fill='%23fff'%3EOn%3C/text%3E%3C/svg%3E"); }

.custom-switch.custom-switch-label-yesno .custom-switch-input + .custom-switch-btn {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='68' height='38'%3E%3Ctext x='38.85714' y='23.75' font-size='12px' font-family='-apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif' fill='%23fff'%3ENo%3C/text%3E%3C/svg%3E"); }

.custom-switch.custom-switch-label-yesno .custom-switch-input:checked + .custom-switch-btn {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='68' height='38'%3E%3Ctext x='9.71429' y='23.75' font-size='12px' font-family='-apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif' fill='%23fff'%3ESi%3C/text%3E%3C/svg%3E"); }

.custom-switch.custom-switch-label-status .custom-switch-input + .custom-switch-btn {
  width: 88px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='38'%3E%3Ctext x='38.85714' y='23.75' font-size='12px' font-family='-apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif' fill='%23fff'%3EDisabled%3C/text%3E%3C/svg%3E"); }

.custom-switch.custom-switch-label-status .custom-switch-input:checked + .custom-switch-btn {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='38'%3E%3Ctext x='9.71429' y='23.75' font-size='12px' font-family='-apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif' fill='%23fff'%3EEnabled%3C/text%3E%3C/svg%3E"); }
  .custom-switch.custom-switch-label-status .custom-switch-input:checked + .custom-switch-btn:after {
    left: 50px; }
