@charset "UTF-8";
/*
* CSS TOGGLE SWITCH
*
* Ionuț Colceriu - ghinda.net
* https://github.com/ghinda/css-toggle-switch
*
*/
/* supported values are px, rem-calc, em-calc
 */
/* imports
 */
/* Functions
 */
/* Shared
 */
/* Hide by default
 */
.switch-toggle a{
  display: none;
}


/* We can't test for a specific feature,
 * so we only target browsers with support for media queries.
 */

@media only screen {
  /* don't hide the input from screen-readers and keyboard access
  /* Radio Switch
 */
  .switch-toggle {
    position: relative;
    display: block;
    /* simulate default browser focus outlines on the switch,
   * when the inputs are focused.
   */
    /* For callout panels in foundation
  */
    padding: 1 !important;
    /* 2 items
   */
    /* 3 items
   */
    /* 4 items
   */
    /* 5 items
   */
    /* 6 items
   */
  }
  .switch-toggle::after {
    clear: both;
    content: '';
    display: table;
  }
  .switch-toggle *,
  .switch-toggle *:before,
  .switch-toggle *:after {
    box-sizing: border-box;
  }
  .switch-toggle a {
    display: block;
    transition: all 0.2s ease-out;
  }
  .switch-toggle label,
  .switch-toggle>span {
    /* breathing room for bootstrap/foundation classes.
     */
    line-height: 2em;
  }
  .switch-toggle input:focus~span a,
  .switch-toggle input:focus+label {
    outline-width: 2px;
    outline-style: solid;
    outline-color: Highlight;
    /* Chrome/Opera gets its native focus styles.
     */
  }
}

@media only screen and (-webkit-min-device-pixel-ratio: 0) {
  .switch-toggle input:focus~span a,
  .switch-toggle input:focus+label {
    outline-color: -webkit-focus-ring-color;
    outline-style: auto;
  }
}

@media only screen {
  .switch-toggle input {
    position: absolute;
    left: 0;
    opacity: 0;
  }
  .switch-toggle input+label {
    position: relative;
    z-index: 2;
    display: block;
    float: left;
    padding: 0 0.5em;
    margin: 0;
    text-align: center;
  }
  .switch-toggle a {
    position: absolute;
    top: 0;
    left: 0;
    padding: 0;
    z-index: 1;
    width: 10px;
    height: 100%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(4),
  .switch-toggle label:nth-child(2):nth-last-child(4)~label,
  .switch-toggle label:nth-child(2):nth-last-child(4)~a {
    width: 50%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(4)~input:checked:nth-child(3)+label~a {
    left: 50%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(6),
  .switch-toggle label:nth-child(2):nth-last-child(6)~label,
  .switch-toggle label:nth-child(2):nth-last-child(6)~a {
    width: 33.33%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(6)~input:checked:nth-child(3)+label~a {
    left: 33.33%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(6)~input:checked:nth-child(5)+label~a {
    left: 66.66%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(8),
  .switch-toggle label:nth-child(2):nth-last-child(8)~label,
  .switch-toggle label:nth-child(2):nth-last-child(8)~a {
    width: 25%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(8)~input:checked:nth-child(3)+label~a {
    left: 25%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(8)~input:checked:nth-child(5)+label~a {
    left: 50%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(8)~input:checked:nth-child(7)+label~a {
    left: 75%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(10),
  .switch-toggle label:nth-child(2):nth-last-child(10)~label,
  .switch-toggle label:nth-child(2):nth-last-child(10)~a {
    width: 20%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(10)~input:checked:nth-child(3)+label~a {
    left: 20%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(10)~input:checked:nth-child(5)+label~a {
    left: 40%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(10)~input:checked:nth-child(7)+label~a {
    left: 60%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(10)~input:checked:nth-child(9)+label~a {
    left: 80%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(12),
  .switch-toggle label:nth-child(2):nth-last-child(12)~label,
  .switch-toggle label:nth-child(2):nth-last-child(12)~a {
    width: 16.6%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(12)~input:checked:nth-child(3)+label~a {
    left: 16.6%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(12)~input:checked:nth-child(5)+label~a {
    left: 33.2%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(12)~input:checked:nth-child(7)+label~a {
    left: 49.8%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(12)~input:checked:nth-child(9)+label~a {
    left: 66.4%;
  }
  .switch-toggle label:nth-child(2):nth-last-child(12)~input:checked:nth-child(11)+label~a {
    left: 83%;
  }
  /* Candy Theme
 * Based on the "Sort Switches / Toggles (PSD)" by Ormal Clarck
 * http://www.premiumpixels.com/freebies/sort-switches-toggles-psd/
 */
  .switch-toggle.switch-candy,
  .switch-candy>span {
    background-color: #fff;
    background-color: var(--toggleswitch-other-color);
    /* PB: pointing to theme */
    border-radius: 3px;
    border-color: #78909C;
    border-color: var(--toggleswitch-selected-color);
    /* PB: pointing to theme */
    border: 1px solid #78909C;
    border: 1px solid var(--toggleswitch-selected-color);
    border-right:none;
    /* PB: pointing to theme */
  }
  .switch-candy span span,
  .switch-candy input:checked~span span:first-child,
  .switch-toggle.switch-candy label {
    border: 1px solid #78909C;
    border: 1px solid var(--toggleswitch-selected-color);
    border-top:none;
    border-bottom:none;
    border-left:none;
    color: #000;
    color: var(--toggleswitch-other-text-color);
    font-weight: bold;
    text-align: center;
  }
  .switch-candy input~span span:first-child,
  .switch-candy input:checked~span span:nth-child(2),
  .switch-candy input:checked+label {
    color: #fff;
    color: var(--toggleswitch-selected-text-color);
    /* PB: pointing to theme */
    background-color: #78909C;
    background-color: var(--toggleswitch-selected-color);
    /* PB: pointing to theme */
  }
  .switch-candy a {
    border: 1px solid #78909C;
    border: 1px solid var(--toggleswitch-selected-color);
    /* PB: pointing to theme */
    border-radius: 3px;
    background-color: #78909C;
    background-color: var(--toggleswitch-selected-color);
    /* PB : Modifed color */
  }
  .switch-candy-blue a {
    background-color: #38a3d4;
  }
  .switch-candy-yellow a {
    background-color: #f5e560;
  }
}


/* Bugfix for older Webkit, including mobile Webkit. Adapted from
 * http://css-tricks.com/webkit-sibling-bug/
 */

@media only screen and (-webkit-max-device-pixel-ratio: 2) and (max-device-width: 80em) {
  .switch-toggle {
    -webkit-animation: webkitSiblingBugfix infinite 1s;
  }
}

@-webkit-keyframes webkitSiblingBugfix {
  from {
    -webkit-transform: translate3d(0, 0, 0);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
  }
}
