{"version":3,"sources":["dist/css/checkboxes.css","src/scss/checkboxes.scss","src/scss/_config.scss","src/scss/_keyframes.scss","src/scss/_toggles.scss","src/scss/_circles.scss","src/scss/_squares.scss","src/scss/_sizes.scss","src/scss/_circle-square.scss"],"names":[],"mappings":"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","file":"checkboxes.9213cc98.css","sourceRoot":"..","sourcesContent":["[class^=\"ckbx-\"] {\n  font-size: 24px;\n}\n\n[class^=\"ckbx-\"] label {\n  position: relative;\n  cursor: pointer;\n  display: block;\n}\n\n[class^=\"ckbx-\"] label:before, [class^=\"ckbx-\"] label:after {\n  content: \"\";\n  position: absolute;\n}\n\n[class^=\"ckbx-\"] label:before {\n  transition: background 0.1s 0.1s ease;\n}\n\n[class^=\"ckbx-\"] label:after {\n  width: 0.6em;\n  height: 0.6em;\n  transition: all 0.2s ease;\n}\n\n[class^=\"ckbx-\"] input[type=\"checkbox\"] {\n  position: absolute;\n  opacity: 0;\n}\n\n[class^=\"ckbx-circle-\"] label,\n[class^=\"ckbx-square-\"] label {\n  width: 1em;\n  height: 1em;\n}\n\n[class^=\"ckbx-circle-\"] label:before,\n[class^=\"ckbx-square-\"] label:before {\n  width: 1em;\n  height: 1em;\n  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3);\n}\n\n[class^=\"ckbx-circle-\"] input[type=\"checkbox\"]:checked + label:after,\n[class^=\"ckbx-square-\"] input[type=\"checkbox\"]:checked + label:after {\n  background: #70c1b3;\n}\n\n@-webkit-keyframes switch-on {\n  50% {\n    transform: scaleX(1.3);\n  }\n}\n\n@keyframes switch-on {\n  50% {\n    transform: scaleX(1.3);\n  }\n}\n\n@-webkit-keyframes switch-off {\n  50% {\n    transform: scaleX(1.3);\n  }\n}\n\n@keyframes switch-off {\n  50% {\n    transform: scaleX(1.3);\n  }\n}\n\n@-webkit-keyframes switch-on-circle {\n  50% {\n    transform: scale(1.3);\n  }\n}\n\n@keyframes switch-on-circle {\n  50% {\n    transform: scale(1.3);\n  }\n}\n\n@-webkit-keyframes switch-off-circle {\n  50% {\n    transform: scale(0.3);\n  }\n}\n\n@keyframes switch-off-circle {\n  50% {\n    transform: scale(0.3);\n  }\n}\n\n@-webkit-keyframes stretch {\n  50% {\n    transform: scaleX(0.3);\n  }\n  100% {\n    transform: scaleX(1.3);\n  }\n}\n\n@keyframes stretch {\n  50% {\n    transform: scaleX(0.3);\n  }\n  100% {\n    transform: scaleX(1.3);\n  }\n}\n\n@-webkit-keyframes stretchback {\n  50% {\n    transform: scaleX(0.3);\n  }\n  100% {\n    transform: scaleX(1.3);\n  }\n}\n\n@keyframes stretchback {\n  50% {\n    transform: scaleX(0.3);\n  }\n  100% {\n    transform: scaleX(1.3);\n  }\n}\n\n[class^=\"ckbx-style-\"] label {\n  width: 2em;\n  height: 1em;\n}\n\n[class^=\"ckbx-style-\"] label:before {\n  width: 2em;\n  height: 1em;\n  background: #4d4d4d;\n  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.2);\n}\n\n[class^=\"ckbx-style-\"] label:after {\n  z-index: 2;\n  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3);\n  background: #fcfff4;\n}\n\n[class^=\"ckbx-style-\"] input[type=\"checkbox\"]:checked + label:before {\n  background: #333;\n}\n\n[class^=\"ckbx-style-\"] input[type=\"checkbox\"]:checked + label:after {\n  left: 1.1em;\n}\n\n.ckbx-style-1 label:after, .ckbx-style-2 label:after, .ckbx-style-5 label:after, .ckbx-style-6 label:after, .ckbx-style-8 label:after, .ckbx-style-10 label:after, .ckbx-style-11 label:after, .ckbx-style-12 label:after, .ckbx-style-15 label:after {\n  width: 1em;\n  height: 1em;\n  left: 0;\n}\n\n.ckbx-style-3 label:after, .ckbx-style-4 label:after, .ckbx-style-16 label:after, .ckbx-style-17 label:after {\n  left: 0.2em;\n  top: 0.2em;\n  border-radius: 4px;\n}\n\n.ckbx-style-1 label:before {\n  left: 0.1em;\n  border-radius: 50px;\n}\n\n.ckbx-style-1 label:after {\n  border-radius: 50px;\n}\n\n.ckbx-style-3 label:before {\n  border-radius: 4px;\n}\n\n.ckbx-style-4 label:before {\n  border-radius: 4px;\n}\n\n.ckbx-style-4 label:after {\n  border-radius: 100%;\n}\n\n.ckbx-style-5 label:before {\n  height: 0.5em;\n  left: 0.1em;\n  top: 0.25em;\n  border-radius: 50px;\n}\n\n.ckbx-style-5 label:after {\n  border-radius: 50px;\n}\n\n.ckbx-style-6 label:before {\n  left: 0.1em;\n  border-radius: 50px;\n}\n\n.ckbx-style-6 label:after {\n  border-radius: 50px;\n  left: -0.1em;\n  box-shadow: 0 0 0 5px #fcfff4 inset;\n  background: #4d4d4d;\n}\n\n.ckbx-style-6 input[type=\"checkbox\"]:checked + label:after {\n  background: #333;\n}\n\n.ckbx-style-7 label:before {\n  left: 0.1em;\n  border-radius: 50px;\n}\n\n.ckbx-style-7 label:after {\n  width: 0.8em;\n  height: 0.8em;\n  border-radius: 100%;\n  left: 0.2em;\n  top: 0.1em;\n  box-shadow: 0 0 0 5px #fcfff4 inset;\n  background: #4d4d4d;\n  -webkit-animation: switch-off 0.3s ease-out;\n          animation: switch-off 0.3s ease-out;\n}\n\n.ckbx-style-7 input[type=\"checkbox\"]:checked + label:after {\n  left: 1.2em;\n  background: #333;\n  -webkit-animation: switch-on 0.3s ease-out;\n          animation: switch-on 0.3s ease-out;\n}\n\n.ckbx-style-8 label:before {\n  left: 0.1em;\n  transition: background 0.1s ease;\n  background: #f25f5c;\n  border-radius: 50px;\n  box-shadow: inset 0 1px 1px rgba(171, 66, 63, 0.5);\n}\n\n.ckbx-style-8 label:after {\n  border-radius: 50px;\n  -webkit-animation: switch-off 0.2s ease-out;\n          animation: switch-off 0.2s ease-out;\n}\n\n.ckbx-style-8 input[type=\"checkbox\"]:checked + label:before {\n  background: #70c1b3;\n  box-shadow: inset 0 1px 1px rgba(84, 152, 140, 0.5);\n}\n\n.ckbx-style-8 input[type=\"checkbox\"]:checked + label:after {\n  -webkit-animation: switch-on 0.2s ease-out;\n          animation: switch-on 0.2s ease-out;\n}\n\n.ckbx-style-9 {\n  width: 3em !important;\n  position: relative;\n}\n\n.ckbx-style-9:before, .ckbx-style-9:after {\n  position: absolute;\n  font-size: 0.6em;\n  color: #fff;\n  font-weight: bold;\n  text-align: center;\n}\n\n.ckbx-style-9:before {\n  content: \"ON\";\n  z-index: 1;\n  left: 0.4em;\n  top: 0.2em;\n}\n\n.ckbx-style-9:after {\n  content: \"OFF\";\n  right: 0.4em;\n  top: 0.2em;\n}\n\n.ckbx-style-9 label:before {\n  width: 3em;\n  transition: background 0.1s ease;\n  background: #f25f5c;\n  box-shadow: inset 0 1px 1px rgba(171, 66, 63, 0.5);\n}\n\n.ckbx-style-9 label:after {\n  width: 1.5em;\n  height: 1em;\n  left: 0;\n}\n\n.ckbx-style-9 input[type=\"checkbox\"]:checked + label:before {\n  background: #70c1b3;\n  box-shadow: inset 0 1px 1px rgba(84, 152, 140, 0.5);\n}\n\n.ckbx-style-9 input[type=\"checkbox\"]:checked + label:after {\n  left: 1.5em;\n}\n\n.ckbx-style-10 label:before {\n  height: 0.5em;\n  left: 0.1em;\n  top: 0.25em;\n}\n\n.ckbx-style-11 label:before {\n  height: 0.5em;\n  left: 0.1em;\n  top: 0.25em;\n  background: #f25f5c;\n  border-radius: 50px;\n}\n\n.ckbx-style-11 label:after {\n  background: #f25f5c;\n  border-radius: 100%;\n  -webkit-animation: switch-off 0.4s ease-out forwards;\n          animation: switch-off 0.4s ease-out forwards;\n}\n\n.ckbx-style-11 input[type=\"checkbox\"]:checked + label:before {\n  background: #70c1b3;\n}\n\n.ckbx-style-11 input[type=\"checkbox\"]:checked + label:after {\n  background: #70c1b3;\n  -webkit-animation: switch-on 0.4s ease-out forwards;\n          animation: switch-on 0.4s ease-out forwards;\n}\n\n.ckbx-style-12 label:before {\n  height: 0.5em;\n  left: 0.1em;\n  top: 0.25em;\n  background: #f25f5c;\n  box-shadow: unset;\n}\n\n.ckbx-style-12 label:after {\n  background: #f25f5c;\n  -webkit-animation: switch-off 0.4s ease-out forwards;\n          animation: switch-off 0.4s ease-out forwards;\n}\n\n.ckbx-style-12 input[type=\"checkbox\"]:checked + label:before {\n  background: #70c1b3;\n}\n\n.ckbx-style-12 input[type=\"checkbox\"]:checked + label:after {\n  background: #70c1b3;\n  -webkit-animation: switch-on 0.4s ease-out forwards;\n          animation: switch-on 0.4s ease-out forwards;\n}\n\n.ckbx-style-13 label:before {\n  left: 0.1em;\n  background: #f25f5c;\n  border-radius: 50px;\n  box-shadow: inset 0 1px 1px rgba(171, 66, 63, 0.5);\n}\n\n.ckbx-style-13 label:after {\n  width: 0.8em;\n  height: 0.8em;\n  border-radius: 100%;\n  left: 0.2em;\n  top: 0.1em;\n  box-shadow: 0 0 0 5px #fcfff4 inset;\n  background: #f25f5c;\n  -webkit-animation: switch-off 0.3s ease-out;\n          animation: switch-off 0.3s ease-out;\n}\n\n.ckbx-style-13 input[type=\"checkbox\"]:checked + label:before {\n  background: #70c1b3;\n  box-shadow: inset 0 1px 1px rgba(84, 152, 140, 0.5);\n}\n\n.ckbx-style-13 input[type=\"checkbox\"]:checked + label:after {\n  left: 1.2em;\n  background: #70c1b3;\n  -webkit-animation: switch-on 0.3s ease-out;\n          animation: switch-on 0.3s ease-out;\n}\n\n.ckbx-style-14 {\n  position: relative;\n  padding: 3px;\n  background: #333;\n  border-radius: 4px;\n}\n\n.ckbx-style-14 label {\n  width: 4em;\n  height: 1em;\n  background: #333;\n}\n\n.ckbx-style-14 label:before {\n  content: \"OFF\";\n  width: 50%;\n  text-align: center;\n  color: #fff;\n  font-weight: bold;\n  font-size: 0.6em;\n  line-height: 1.6;\n  transition: all 0.2s ease;\n  background: #f25f5c;\n  left: 50%;\n  bottom: 0;\n  top: 0;\n  border-radius: 4px;\n  height: unset;\n  box-shadow: unset;\n}\n\n.ckbx-style-14 label:after {\n  content: \"ON\";\n  width: 50%;\n  text-align: center;\n  color: rgba(255, 255, 255, 0.5);\n  line-height: 1.6;\n  top: 0;\n  bottom: 0;\n  font-weight: bold;\n  font-size: 0.6em;\n  border-radius: 4px;\n  background: #333;\n  height: unset;\n  box-shadow: unset;\n  z-index: unset;\n}\n\n.ckbx-style-14 input[type=\"checkbox\"]:checked + label:before {\n  background: #333;\n  color: rgba(255, 255, 255, 0.5);\n}\n\n.ckbx-style-14 input[type=\"checkbox\"]:checked + label:after {\n  background: #70c1b3;\n  color: #fff;\n  left: unset;\n}\n\n.ckbx-style-15 label:before {\n  content: \"\\2714\\2718\";\n  color: #fff;\n  font-size: 0.8em;\n  top: 0;\n  bottom: 0;\n  padding-left: 0.25em;\n  padding-right: 0.25em;\n  left: 0.1em;\n  background: #f25f5c;\n  border-radius: 50px;\n  box-shadow: inset 0 1px 1px rgba(171, 66, 63, 0.5);\n  letter-spacing: -1px;\n  height: unset;\n}\n\n@media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) {\n  .ckbx-style-15 label:before {\n    letter-spacing: 6px;\n  }\n}\n\n@-moz-document url-prefix() {\n  .ckbx-style-15 label:before {\n    letter-spacing: 6px;\n  }\n}\n\n.ckbx-style-15 label:after {\n  border-radius: 50px;\n  -webkit-animation: switch-off 0.2s ease-out;\n          animation: switch-off 0.2s ease-out;\n}\n\n@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n  .ckbx-style-15 label:before {\n    letter-spacing: -2px;\n  }\n  .ckbx-style-15 label:after {\n    left: 0.05em;\n  }\n}\n\n.ckbx-style-15 input[type=\"checkbox\"]:checked + label:before {\n  background: #70c1b3;\n  box-shadow: inset 0 1px 1px rgba(84, 152, 140, 0.5);\n}\n\n.ckbx-style-15 input[type=\"checkbox\"]:checked + label:after {\n  -webkit-animation: switch-on 0.2s ease-out;\n          animation: switch-on 0.2s ease-out;\n}\n\n.ckbx-style-16 label:before {\n  border-radius: 4px;\n  background: #f25f5c;\n  box-shadow: unset;\n}\n\n.ckbx-style-16 input[type=\"checkbox\"]:checked + label:before {\n  background: #70c1b3;\n}\n\n.ckbx-style-17 label:before {\n  border-radius: 4px;\n}\n\n.ckbx-style-17 label:after {\n  background: #f25f5c;\n}\n\n.ckbx-style-17 input[type=\"checkbox\"]:checked + label:after {\n  background: #70c1b3;\n}\n\n[class^=\"ckbx-circle-\"] label:before {\n  border-radius: 100%;\n}\n\n[class^=\"ckbx-circle-\"] label:after {\n  border-radius: 100%;\n  left: 0.2em;\n  top: 0.2em;\n  background: #f25f5c;\n  z-index: 2;\n}\n\n.ckbx-circle-2 label:after {\n  z-index: unset;\n}\n\n.ckbx-circle-4 label:after {\n  left: unset;\n  top: unset;\n  z-index: unset;\n}\n\n.ckbx-square-1 label:after {\n  left: 0.2em;\n  top: 0.2em;\n  background: #f25f5c;\n  z-index: 2;\n}\n\n.ckbx-square-2 label:after {\n  left: 0.2em;\n  top: 0.2em;\n  background: #f25f5c;\n}\n\n.ckbx-square-3 label:after {\n  background: #f25f5c;\n  z-index: 2;\n}\n\n[class^=\"ckbx\"].ckbx-small {\n  font-size: 0.5em;\n}\n\n[class^=\"ckbx\"].ckbx-large {\n  font-size: 1.5em;\n}\n\n[class^=\"ckbx\"].ckbx-xlarge {\n  font-size: 2.5em;\n}\n\n.ckbx-circle-1 label:before, .ckbx-square-1 label:before {\n  background: #333;\n}\n\n.ckbx-circle-2 label:before, .ckbx-square-2 label:before {\n  width: 1em;\n  height: 1em;\n  background: #333;\n}\n\n.ckbx-circle-2 label:after, .ckbx-square-2 label:after {\n  -webkit-animation: switch-off-circle 0.2s ease-out;\n          animation: switch-off-circle 0.2s ease-out;\n}\n\n.ckbx-circle-2 input[type=\"checkbox\"]:checked + label:after, .ckbx-square-2 input[type=\"checkbox\"]:checked + label:after {\n  width: 1em;\n  height: 1em;\n  top: 0;\n  left: 0;\n  -webkit-animation: switch-on-circle 0.2s ease-out;\n          animation: switch-on-circle 0.2s ease-out;\n}\n\n.ckbx-circle-3 label:before, .ckbx-square-3 label:before {\n  background: #fcfff4;\n}\n\n.ckbx-circle-3 label:after, .ckbx-square-3 label:after {\n  left: 0.1em;\n  top: 0.1em;\n  border: 0.1em solid #fcfff4;\n}\n\n.ckbx-circle-4 label:before, .ckbx-square-4 label:before {\n  box-shadow: unset;\n}\n\n.ckbx-circle-4 label:after, .ckbx-square-4 label:after {\n  background: transparent;\n  border: 0.2em solid #f25f5c;\n  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3);\n  -webkit-animation: stretchback 0.2s ease-out;\n          animation: stretchback 0.2s ease-out;\n}\n\n.ckbx-circle-4 input[type=\"checkbox\"]:checked + label:after, .ckbx-square-4 input[type=\"checkbox\"]:checked + label:after {\n  border-color: #70c1b3;\n  -webkit-animation: stretch 0.2s ease-out;\n          animation: stretch 0.2s ease-out;\n  background: unset;\n}\n/*# sourceMappingURL=checkboxes.css.map */","@import \"config\";\r\n\r\n[class^=\"#{$checkbox}-\"] {\r\n  font-size: $base-font-size;\r\n\r\n  label {\r\n    position: relative;\r\n    cursor: pointer;\r\n    display: block;\r\n\r\n    &:before,\r\n    &:after {\r\n      content: \"\";\r\n      position: absolute;\r\n    }\r\n\r\n    &:before {\r\n      transition: background $base-easing-speed 0.1s $base-easeing;\r\n    }\r\n\r\n    &:after {\r\n      width: 0.6em;\r\n      height: 0.6em;\r\n      transition: all $base-easing-speed * 2 $base-easeing;\r\n    }\r\n  }\r\n\r\n  input[type=\"checkbox\"] {\r\n    position: absolute;\r\n    opacity: 0;\r\n  }\r\n}\r\n\r\n[class^=\"#{$checkbox}-circle-\"],\r\n[class^=\"#{$checkbox}-square-\"] {\r\n  label {\r\n    width: $circle-style-width;\r\n    height: $circle-style-height;\r\n\r\n    &:before {\r\n      width: 1em;\r\n      height: 1em;\r\n      box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3);\r\n    }\r\n  }\r\n\r\n  input[type=\"checkbox\"] {\r\n    &:checked {\r\n      + label {\r\n        &:after {\r\n          background: $green;\r\n        }\r\n      }\r\n    }\r\n  }\r\n}\r\n\r\n@import \"keyframes\";\r\n@import \"toggles\";\r\n@import \"circles\";\r\n@import \"squares\";\r\n@import \"sizes\";\r\n@import \"circle-square\";\r\n","$brown: #50514f !default;\r\n$yellow: #ffe066 !default;\r\n$green: #70c1b3 !default;\r\n$turquoise: #247ba0 !default;\r\n$blue: #247ba0 !default;\r\n$red: #f25f5c !default;\r\n$light: #ffffff !default;\r\n\r\n$base-font-size: 24px;\r\n$base-easeing: ease;\r\n$base-easing-speed: 0.1s;\r\n\r\n$base-color: #333;\r\n$base-contrast: #fcfff4;\r\n\r\n$border-radius-full: 100%;\r\n$border-radius-medium: 4px;\r\n$border-radius-low: 50px;\r\n\r\n$toggle-style-width: 2em;\r\n$toggle-style-height: 1em;\r\n\r\n$circle-style-width: 1em;\r\n$circle-style-height: 1em;\r\n\r\n$checkbox: \"ckbx\" !default;\r\n","@keyframes switch-on {\n  50% {\n    transform: scaleX(1.3);\n  }\n}\n\n@keyframes switch-off {\n  50% {\n    transform: scaleX(1.3);\n  }\n}\n\n@keyframes switch-on-circle {\n  50% {\n    transform: scale(1.3);\n  }\n}\n\n@keyframes switch-off-circle {\n  50% {\n    transform: scale(0.3);\n  }\n}\n\n@keyframes stretch {\n  50% {\n    transform: scaleX(0.3);\n  }\n  100% {\n    transform: scaleX(1.3);\n  }\n}\n@keyframes stretchback {\n  50% {\n    transform: scaleX(0.3);\n  }\n  100% {\n    transform: scaleX(1.3);\n  }\n}","[class^=\"#{$checkbox}-style-\"] {\r\n  label {\r\n    width: $toggle-style-width;\r\n    height: $toggle-style-height;\r\n\r\n    &:before {\r\n      width: 2em;\r\n      height: 1em;\r\n      background: lighten($base-color, 10%);\r\n      box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5),\r\n        0 1px 0 rgba(255, 255, 255, 0.2);\r\n    }\r\n\r\n    &:after {\r\n      z-index: 2;\r\n      box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3);\r\n      background: $base-contrast;\r\n    }\r\n  }\r\n\r\n  input[type=\"checkbox\"] {\r\n    &:checked {\r\n      + label {\r\n        &:before {\r\n          background: $base-color;\r\n        }\r\n\r\n        &:after {\r\n          left: 1.1em;\r\n        }\r\n      }\r\n    }\r\n  }\r\n}\r\n\r\n.#{$checkbox}-style {\r\n  &-1,\r\n  &-2,\r\n  &-5,\r\n  &-6,\r\n  &-8,\r\n  &-10,\r\n  &-11,\r\n  &-12,\r\n  &-15 {\r\n    label {\r\n      &:after {\r\n        width: 1em;\r\n        height: 1em;\r\n        left: 0;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-3,\r\n  &-4,\r\n  &-16,\r\n  &-17 {\r\n    label {\r\n      &:after {\r\n        left: 0.2em;\r\n        top: 0.2em;\r\n        border-radius: $border-radius-medium;\r\n      }\r\n    }\r\n  }\r\n  &-1 {\r\n    label {\r\n      &:before {\r\n        left: 0.1em;\r\n        border-radius: $border-radius-low;\r\n      }\r\n\r\n      &:after {\r\n        border-radius: $border-radius-low;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-2 {\r\n    label {\r\n      &:before {\r\n      }\r\n\r\n      &:after {\r\n      }\r\n    }\r\n  }\r\n\r\n  &-3 {\r\n    label {\r\n      &:before {\r\n        border-radius: $border-radius-medium;\r\n      }\r\n\r\n      &:after {\r\n      }\r\n    }\r\n  }\r\n\r\n  &-4 {\r\n    label {\r\n      &:before {\r\n        border-radius: $border-radius-medium;\r\n      }\r\n\r\n      &:after {\r\n        border-radius: $border-radius-full;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-5 {\r\n    label {\r\n      &:before {\r\n        height: 0.5em;\r\n        left: 0.1em;\r\n        top: 0.25em;\r\n        border-radius: $border-radius-low;\r\n      }\r\n\r\n      &:after {\r\n        border-radius: $border-radius-low;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-6 {\r\n    label {\r\n      &:before {\r\n        left: 0.1em;\r\n        border-radius: $border-radius-low;\r\n      }\r\n\r\n      &:after {\r\n        border-radius: $border-radius-low;\r\n        left: -0.1em;\r\n        box-shadow: 0 0 0 5px $base-contrast inset;\r\n        background: lighten($base-color, 10%);\r\n      }\r\n    }\r\n\r\n    input[type=\"checkbox\"]:checked + label {\r\n      &:after {\r\n        background: $base-color;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-7 {\r\n    label {\r\n      &:before {\r\n        left: 0.1em;\r\n        border-radius: $border-radius-low;\r\n      }\r\n\r\n      &:after {\r\n        width: 0.8em;\r\n        height: 0.8em;\r\n        border-radius: $border-radius-full;\r\n        left: 0.2em;\r\n        top: 0.1em;\r\n        box-shadow: 0 0 0 5px $base-contrast inset;\r\n        background: lighten($base-color, 10%);\r\n        animation: switch-off 0.3s ease-out;\r\n      }\r\n    }\r\n\r\n    input[type=\"checkbox\"]:checked + label {\r\n      &:after {\r\n        left: 1.2em;\r\n        background: $base-color;\r\n        animation: switch-on 0.3s ease-out;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-8 {\r\n    label {\r\n      &:before {\r\n        left: 0.1em;\r\n        transition: background $base-easing-speed $base-easeing;\r\n        background: $red;\r\n        border-radius: $border-radius-low;\r\n        box-shadow: inset 0 1px 1px rgba(171, 66, 63, 0.5);\r\n      }\r\n\r\n      &:after {\r\n        border-radius: $border-radius-low;\r\n        animation: switch-off 0.2s ease-out;\r\n      }\r\n    }\r\n\r\n    input[type=\"checkbox\"]:checked + label {\r\n      &:before {\r\n        background: $green;\r\n        box-shadow: inset 0 1px 1px rgba(84, 152, 140, 0.5);\r\n      }\r\n\r\n      &:after {\r\n        animation: switch-on 0.2s ease-out;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-9 {\r\n    width: 3em !important;\r\n    position: relative;\r\n\r\n    &:before,\r\n    &:after {\r\n      position: absolute;\r\n      font-size: 0.6em;\r\n      color: #fff;\r\n      font-weight: bold;\r\n      text-align: center;\r\n    }\r\n\r\n    &:before {\r\n      content: \"ON\";\r\n      z-index: 1;\r\n      left: 0.4em;\r\n      top: 0.2em;\r\n    }\r\n\r\n    &:after {\r\n      content: \"OFF\";\r\n      right: 0.4em;\r\n      top: 0.2em;\r\n    }\r\n\r\n    label {\r\n      &:before {\r\n        width: 3em;\r\n        transition: background $base-easing-speed $base-easeing;\r\n        background: $red;\r\n        box-shadow: inset 0 1px 1px rgba(171, 66, 63, 0.5);\r\n      }\r\n\r\n      &:after {\r\n        width: 1.5em;\r\n        height: 1em;\r\n        left: 0;\r\n      }\r\n    }\r\n\r\n    input[type=\"checkbox\"]:checked + label {\r\n      &:before {\r\n        background: $green;\r\n        box-shadow: inset 0 1px 1px rgba(84, 152, 140, 0.5);\r\n      }\r\n\r\n      &:after {\r\n        left: 1.5em;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-10 {\r\n    label {\r\n      &:before {\r\n        height: 0.5em;\r\n        left: 0.1em;\r\n        top: 0.25em;\r\n      }\r\n\r\n      &:after {\r\n      }\r\n    }\r\n  }\r\n\r\n  &-11 {\r\n    label {\r\n      &:before {\r\n        height: 0.5em;\r\n        left: 0.1em;\r\n        top: 0.25em;\r\n        background: $red;\r\n        border-radius: $border-radius-low;\r\n      }\r\n\r\n      &:after {\r\n        background: $red;\r\n        border-radius: $border-radius-full;\r\n        animation: switch-off 0.4s ease-out forwards;\r\n      }\r\n    }\r\n\r\n    input[type=\"checkbox\"]:checked + label {\r\n      &:before {\r\n        background: $green;\r\n      }\r\n\r\n      &:after {\r\n        background: $green;\r\n        animation: switch-on 0.4s ease-out forwards;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-12 {\r\n    label {\r\n      &:before {\r\n        height: 0.5em;\r\n        left: 0.1em;\r\n        top: 0.25em;\r\n        background: $red;\r\n        box-shadow: unset;\r\n      }\r\n\r\n      &:after {\r\n        background: $red;\r\n        animation: switch-off 0.4s ease-out forwards;\r\n      }\r\n    }\r\n\r\n    input[type=\"checkbox\"]:checked + label {\r\n      &:before {\r\n        background: $green;\r\n      }\r\n\r\n      &:after {\r\n        background: $green;\r\n        animation: switch-on 0.4s ease-out forwards;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-13 {\r\n    label {\r\n      &:before {\r\n        left: 0.1em;\r\n        background: $red;\r\n        border-radius: $border-radius-low;\r\n        box-shadow: inset 0 1px 1px rgba(171, 66, 63, 0.5);\r\n      }\r\n\r\n      &:after {\r\n        width: 0.8em;\r\n        height: 0.8em;\r\n        border-radius: $border-radius-full;\r\n        left: 0.2em;\r\n        top: 0.1em;\r\n        box-shadow: 0 0 0 5px $base-contrast inset;\r\n        background: $red;\r\n        animation: switch-off 0.3s ease-out;\r\n      }\r\n    }\r\n\r\n    input[type=\"checkbox\"]:checked + label {\r\n      &:before {\r\n        background: $green;\r\n        box-shadow: inset 0 1px 1px rgba(84, 152, 140, 0.5);\r\n      }\r\n\r\n      &:after {\r\n        left: 1.2em;\r\n        background: $green;\r\n        animation: switch-on 0.3s ease-out;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-14 {\r\n    position: relative;\r\n    padding: 3px;\r\n    background: $base-color;\r\n    border-radius: $border-radius-medium;\r\n\r\n    label {\r\n      width: 4em;\r\n      height: 1em;\r\n      background: $base-color;\r\n\r\n      &:before {\r\n        content: \"OFF\";\r\n        width: 50%;\r\n        text-align: center;\r\n        color: #fff;\r\n        font-weight: bold;\r\n        font-size: 0.6em;\r\n        line-height: 1.6;\r\n        transition: all $base-easing-speed * 2 $base-easeing;\r\n        background: $red;\r\n        left: 50%;\r\n        bottom: 0;\r\n        top: 0;\r\n        border-radius: $border-radius-medium;\r\n        height: unset;\r\n        box-shadow: unset;\r\n      }\r\n\r\n      &:after {\r\n        content: \"ON\";\r\n        width: 50%;\r\n        text-align: center;\r\n        color: rgba(255, 255, 255, 0.5);\r\n        line-height: 1.6;\r\n        top: 0;\r\n        bottom: 0;\r\n        font-weight: bold;\r\n        font-size: 0.6em;\r\n        border-radius: $border-radius-medium;\r\n        background: $base-color;\r\n        height: unset;\r\n        box-shadow: unset;\r\n        z-index: unset;\r\n      }\r\n    }\r\n\r\n    input[type=\"checkbox\"]:checked + label {\r\n      &:before {\r\n        background: $base-color;\r\n        color: rgba(255, 255, 255, 0.5);\r\n      }\r\n\r\n      &:after {\r\n        background: $green;\r\n        color: #fff;\r\n        left: unset;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-15 {\r\n    label {\r\n      &:before {\r\n        content: \"\\2714\\2718\";\r\n        color: #fff;\r\n        font-size: 0.8em;\r\n        top: 0;\r\n        bottom: 0;\r\n        padding-left: 0.25em;\r\n        padding-right: 0.25em;\r\n        left: 0.1em;\r\n        background: $red;\r\n        border-radius: $border-radius-low;\r\n        box-shadow: inset 0 1px 1px rgba(171, 66, 63, 0.5);\r\n        letter-spacing: -1px;\r\n        height: unset;\r\n        @media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) {\r\n          letter-spacing: 6px;\r\n        }\r\n\r\n        @-moz-document url-prefix() {\r\n          letter-spacing: 6px;\r\n        }\r\n      }\r\n\r\n      &:after {\r\n        border-radius: $border-radius-low;\r\n        animation: switch-off 0.2s ease-out;\r\n      }\r\n\r\n      @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\r\n        &:before {\r\n          letter-spacing: -2px;\r\n        }\r\n\r\n        &:after {\r\n          left: 0.05em;\r\n        }\r\n      }\r\n    }\r\n\r\n    input[type=\"checkbox\"]:checked + label {\r\n      &:before {\r\n        background: $green;\r\n        box-shadow: inset 0 1px 1px rgba(84, 152, 140, 0.5);\r\n      }\r\n\r\n      &:after {\r\n        animation: switch-on 0.2s ease-out;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-16 {\r\n    label {\r\n      &:before {\r\n        border-radius: $border-radius-medium;\r\n        background: $red;\r\n        box-shadow: unset;\r\n      }\r\n\r\n      &:after {\r\n      }\r\n    }\r\n\r\n    input[type=\"checkbox\"]:checked + label {\r\n      &:before {\r\n        background: $green;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-17 {\r\n    label {\r\n      &:before {\r\n        border-radius: $border-radius-medium;\r\n      }\r\n\r\n      &:after {\r\n        background: $red;\r\n      }\r\n    }\r\n\r\n    input[type=\"checkbox\"]:checked + label {\r\n      &:after {\r\n        background: $green;\r\n      }\r\n    }\r\n  }\r\n}\r\n","[class^=\"#{$checkbox}-circle-\"] {\r\n  label {\r\n    &:before {\r\n      border-radius: $border-radius-full;\r\n    }\r\n\r\n    &:after {\r\n      border-radius: $border-radius-full;\r\n      left: 0.2em;\r\n      top: 0.2em;\r\n      background: $red;\r\n      z-index: 2;\r\n    }\r\n  }\r\n}\r\n\r\n.#{$checkbox} {\r\n  &-circle-2 {\r\n    label {\r\n      &:after {\r\n        z-index: unset;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-circle-4 {\r\n    label {\r\n      &:after {\r\n        left: unset;\r\n        top: unset;\r\n        z-index: unset;\r\n      }\r\n    }\r\n  }\r\n}\r\n","[class^=\"#{$checkbox}-square-\"] {\r\n  label {\r\n    &:before {\r\n    }\r\n\r\n    &:after {\r\n    }\r\n  }\r\n}\r\n\r\n.#{$checkbox} {\r\n  &-square-1 {\r\n    label {\r\n      &:after {\r\n        left: 0.2em;\r\n        top: 0.2em;\r\n        background: $red;\r\n        z-index: 2;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-square-2 {\r\n    label {\r\n      &:after {\r\n        left: 0.2em;\r\n        top: 0.2em;\r\n        background: $red;\r\n      }\r\n    }\r\n  }\r\n\r\n  &-square-3 {\r\n    label {\r\n      &:after {\r\n        background: $red;\r\n        z-index: 2;\r\n      }\r\n    }\r\n  }\r\n}\r\n","[class^=\"#{$checkbox}\"] {\r\n  &.#{$checkbox}-small {\r\n    font-size: 0.5em;\r\n  }\r\n\r\n  &.#{$checkbox}-large {\r\n    font-size: 1.5em;\r\n  }\r\n\r\n  &.#{$checkbox}-xlarge {\r\n    font-size: 2.5em;\r\n  }\r\n}\r\n",".#{$checkbox} {\n  &-circle-1,\n  &-square-1 {\n    label {\n      &:before {\n        background: $base-color;\n      }\n    }\n  }\n\n  &-circle-2,\n  &-square-2 {\n    label {\n      &:before {\n        width: $circle-style-width;\n        height: $circle-style-height;\n        background: $base-color;\n      }\n\n      &:after {\n        animation: switch-off-circle 0.2s ease-out;\n      }\n    }\n\n    input[type=\"checkbox\"]:checked + label {\n      &:after {\n        width: 1em;\n        height: 1em;\n        top: 0;\n        left: 0;\n        animation: switch-on-circle 0.2s ease-out;\n      }\n    }\n  }\n\n  &-circle-3,\n  &-square-3 {\n    label {\n      &:before {\n        background: $base-contrast;\n      }\n\n      &:after {\n        left: 0.1em;\n        top: 0.1em;\n        border: 0.1em solid $base-contrast;\n      }\n    }\n  }\n\n  &-circle-4,\n  &-square-4 {\n    label {\n      &:before {\n        box-shadow: unset;\n      }\n\n      &:after {\n        background: transparent;\n        border: 0.2em solid $red;\n        box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3);\n        animation: stretchback 0.2s ease-out;\n      }\n    }\n\n    input[type=\"checkbox\"]:checked + label {\n      &:after {\n        border-color: $green;\n        animation: stretch 0.2s ease-out;\n        background: unset;\n      }\n    }\n  }\n}\n"]}