SemanSemantic-UItic-UI/build/uncompressed/definitions/modules/checkbox.css

/*
 * # Semantic - Checkbox
 * http://github.com/semantic-org/semantic-ui/
 *
 *
 * Copyright 2014 Contributor
 * Released under the MIT license
 * http://opensource.org/licenses/MIT
 *
 */
/*******************************
            Theme
*******************************/
/*

███████╗███████╗███╗   ███╗ █████╗ ███╗   ██╗████████╗██╗ ██████╗    ██╗   ██╗██╗
██╔════╝██╔════╝████╗ ████║██╔══██╗████╗  ██║╚══██╔══╝██║██╔════╝    ██║   ██║██║
███████╗█████╗  ██╔████╔██║███████║██╔██╗ ██║   ██║   ██║██║         ██║   ██║██║
╚════██║██╔══╝  ██║╚██╔╝██║██╔══██║██║╚██╗██║   ██║   ██║██║         ██║   ██║██║
███████║███████╗██║ ╚═╝ ██║██║  ██║██║ ╚████║   ██║   ██║╚██████╗    ╚██████╔╝██║
╚══════╝╚══════╝╚═╝     ╚═╝╚═╝  ╚═╝╚═╝  ╚═══╝   ╚═╝   ╚═╝ ╚═════╝     ╚═════╝ ╚═╝

*/
/*******************************
           Folders
*******************************/
/* Path to theme packages */
/* Path to site override folder */
/*******************************
            Themes
*******************************/
/* To override a theme for an individual element
   specify theme name below

   Be sure to update the user folder name (see README)
*/
/* Global */
/* Elements */
/* Collections */
/* Modules */
/* Views */
/*******************************
        Import Directives
*******************************/
/*------------------
     Load Default
-------------------*/
/*******************************
         Site Settings
*******************************/
/*-------------------
        Paths
--------------------*/
/*-------------------
       Fonts
--------------------*/
/*-------------------
      Site Colors
--------------------*/
/*---  Colors  ---*/
/*-------------------
        Page
--------------------*/
/*-------------------
  Background Colors
--------------------*/
/* Used for differentiating neutrals */
/* Used for differentiating layers */
/*-------------------
        Grid
--------------------*/
/*-------------------
     Breakpoints
--------------------*/
/*******************************
           Power-User
*******************************/
/*-------------------
       Icons
--------------------*/
/* Max Width of Icon */
/*-------------------
       Easing
--------------------*/
/*---  Light Variations  ---*/
/*---   Neutrals  ---*/
/*--- Colored Backgrounds ---*/
/*--- Colored Text ---*/
/*--- Colored Headers ---*/
/*-------------------
    Emotive Colors
--------------------*/
/* Mood */
/* Solid Background Color */
/* Status */
/* Darkened Headers */
/*-------------------
     Neutral Text
--------------------*/
/*-------------------
     Brand Colors
--------------------*/
/*-------------------
    Grid Columns
--------------------*/
/*-------------------
      Borders
--------------------*/
/*-------------------
        Sizes
--------------------*/
/*-------------------
     Transitions
--------------------*/
/*******************************
           States
*******************************/
/*-------------------
      Disabled
--------------------*/
/*-------------------
        Hover
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Neutrals  ---*/
/*-------------------
    Down (:active)
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Neutrals  ---*/
/*-------------------
        Active
--------------------*/
/*---  Standard  ---*/
/*---  Emotive  ---*/
/*---  Neutrals  ---*/
/*******************************
            Checkbox
*******************************/
/* Label */
/* Checkbox */
/* Checkmark */
/*-------------------
      Coupling
--------------------*/
/*-------------------
        States
--------------------*/
/* Disabled */
/*-------------------
        Types
--------------------*/
/* Radio */
/* Slider & Toggle Handle */
/* Slider */
/* Toggle */
/*-------------------
      Variations
--------------------*/
/*------------------
     Load Theme
-------------------*/
/*------------------
     Load Site
-------------------*/
/*******************************
     User Global Variables
*******************************/
/*******************************
    User Variable Overrides
*******************************/
/*------------------
 Override Mix-in
-------------------*/
/*******************************
           Checkbox
*******************************/
/*--------------
    Content
---------------*/
.ui.checkbox {
  position: relative;
  display: inline-block;
  height: 17px;
  font-size: 1rem;
  line-height: 15px;
  min-width: 17px;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  outline: none;
  vertical-align: middle;
}
.ui.checkbox input {
  position: absolute;
  top: 0px;
  left: 0px;
  opacity: 0;
  outline: none;
  z-index: -1;
}
/*--------------
      Box
---------------*/
.ui.checkbox .box,
.ui.checkbox label {
  cursor: pointer;
  padding-left: 1.75em;
  outline: none;
}
.ui.checkbox label {
  font-size: 1em;
}
.ui.checkbox .box:before,
.ui.checkbox label:before {
  position: absolute;
  line-height: 1;
  width: 17px;
  height: 17px;
  top: 0em;
  left: 0em;
  content: '';
  background: #ffffff;
  border-radius: 0.25em;
  -webkit-transition: background-color 0.3s ease, border 0.3s ease, box-shadow 0.3s ease;
          transition: background-color 0.3s ease, border 0.3s ease, box-shadow 0.3s ease;
  border: 1px solid rgba(0, 0, 0, 0.1);
}
/*--------------
    Checkmark
---------------*/
.ui.checkbox .box:after,
.ui.checkbox label:after {
  position: absolute;
  top: 0px;
  left: 0px;
  line-height: 17px;
  width: 17px;
  height: 17px;
  text-align: center;
  opacity: 0;
  color: rgba(0, 0, 0, 0.8);
  -webkit-transition: all 0.1s ease;
          transition: all 0.1s ease;
}
/*--------------
      Label
---------------*/
/* Inside */
.ui.checkbox label,
.ui.checkbox + label {
  cursor: pointer;
  color: rgba(0, 0, 0, 0.8);
  -webkit-transition: color 0.2s ease;
          transition: color 0.2s ease;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
/* Outside */
.ui.checkbox + label {
  vertical-align: middle;
}
/*******************************
           States
*******************************/
/*--------------
      Hover
---------------*/
.ui.checkbox .box:hover::before,
.ui.checkbox label:hover::before {
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.2);
}
.ui.checkbox label:hover,
.ui.checkbox + label:hover {
  color: rgba(0, 0, 0, 0.8);
}
/*--------------
      Down
---------------*/
.ui.checkbox .box:active::before,
.ui.checkbox label:active::before {
  background: #f5f5f5;
  border: 1px solid 1px solid rgba(0, 0, 0, 0.2);
}
.ui.checkbox input:active ~ label {
  color: rgba(0, 0, 0, 0.8);
}
/*--------------
      Focus
---------------*/
.ui.checkbox input:focus ~ .box:before,
.ui.checkbox input:focus ~ label:before {
  background: #f5f5f5;
  border: 1px solid 1px solid rgba(0, 0, 0, 0.2);
}
.ui.checkbox input:focus ~ label {
  color: rgba(0, 0, 0, 0.8);
}
/*--------------
     Active
---------------*/
.ui.checkbox input:checked ~ .box:after,
.ui.checkbox input:checked ~ label:after {
  opacity: 1;
}
/*--------------
     Disabled
---------------*/
.ui.disabled.checkbox .box:after,
.ui.disabled.checkbox label,
.ui.checkbox input[disabled] ~ .box:after,
.ui.checkbox input[disabled] ~ label {
  opacity: 0.3;
  color: rgba(0, 0, 0, 0.3);
}
/*******************************
             Types
*******************************/
/*--------------
     Radio
---------------*/
.ui.radio.checkbox {
  height: 16px;
}
/* Box */
.ui.radio.checkbox .box:before,
.ui.radio.checkbox label:before {
  width: 16px;
  height: 16px;
  border-radius: 500rem;
  -webkit-transform: none;
      -ms-transform: none;
          transform: none;
}
/* Circle */
.ui.radio.checkbox .box:after,
.ui.radio.checkbox label:after {
  border: none;
  width: 16px;
  height: 16px;
  line-height: 16px;
  top: 0px;
  left: 0px;
  font-size: 9px;
}
/*--------------
     Slider
---------------*/
.ui.slider.checkbox {
  cursor: pointer;
  height: 1.5rem;
}
.ui.slider.checkbox .box,
.ui.slider.checkbox label {
  padding-left: 4.5rem;
  line-height: 1rem;
  color: rgba(0, 0, 0, 0.4);
}
/* Line */
.ui.slider.checkbox .box:before,
.ui.slider.checkbox label:before {
  cursor: pointer;
  display: block;
  position: absolute;
  content: '';
  top: 0.4rem;
  left: 0em;
  z-index: 1;
  border: none !important;
  background-color: rgba(0, 0, 0, 0.05);
  width: 3.5rem;
  height: 0.25rem;
  -webkit-transform: none;
      -ms-transform: none;
          transform: none;
  border-radius: 500rem;
  -webkit-transition: background 0.3s ease
  ;
          transition: background 0.3s ease
  ;
}
/* Handle */
.ui.slider.checkbox .box:after,
.ui.slider.checkbox label:after {
  background: #ffffff -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05));
  background: #ffffff linear-gradient(transparent, rgba(0, 0, 0, 0.05));
  position: absolute;
  content: '';
  opacity: 1;
  z-index: 2;
  border: none;
  box-shadow: 0px 1px 2px 0 rgba(0, 0, 0, 0.05), 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
  width: 1.5rem;
  height: 1.5rem;
  top: -0.25rem;
  left: 0em;
  -webkit-transform: none;
      -ms-transform: none;
          transform: none;
  border-radius: 500rem;
  -webkit-transition: left 0.3s ease 0s
  ;
          transition: left 0.3s ease 0s
  ;
}
/* Focus */
.ui.slider.checkbox input:focus ~ .box:before,
.ui.slider.checkbox input:focus ~ label:before {
  background-color: rgba(0, 0, 0, 0.1);
  border: none;
}
/* Hover */
.ui.slider.checkbox .box:hover,
.ui.slider.checkbox label:hover {
  color: rgba(0, 0, 0, 0.8);
}
.ui.slider.checkbox .box:hover::before,
.ui.slider.checkbox label:hover::before {
  background: rgba(0, 0, 0, 0.1);
}
/* Active */
.ui.slider.checkbox input:checked ~ .box,
.ui.slider.checkbox input:checked ~ label {
  color: rgba(0, 0, 0, 0.8);
}
.ui.slider.checkbox input:checked ~ .box:before,
.ui.slider.checkbox input:checked ~ label:before {
  background-color: rgba(0, 0, 0, 0.1);
}
.ui.slider.checkbox input:checked ~ .box:after,
.ui.slider.checkbox input:checked ~ label:after {
  left: 2rem;
}
/*--------------
     Toggle
---------------*/
.ui.toggle.checkbox {
  cursor: pointer;
  height: 1.5rem;
}
.ui.toggle.checkbox .box,
.ui.toggle.checkbox label {
  height: 1.5rem;
  padding-left: 4.5rem;
  line-height: 1.5rem;
  color: rgba(0, 0, 0, 0.8);
}
/* Switch */
.ui.toggle.checkbox .box:before,
.ui.toggle.checkbox label:before {
  cursor: pointer;
  display: block;
  position: absolute;
  content: '';
  top: 0rem;
  z-index: 1;
  border: none;
  background-color: rgba(0, 0, 0, 0.05);
  width: 3.5rem;
  height: 1.5rem;
  border-radius: 500rem;
}
/* Handle */
.ui.toggle.checkbox .box:after,
.ui.toggle.checkbox label:after {
  background: #ffffff -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05));
  background: #ffffff linear-gradient(transparent, rgba(0, 0, 0, 0.05));
  position: absolute;
  content: '';
  opacity: 1;
  z-index: 2;
  border: none;
  box-shadow: 0px 1px 2px 0 rgba(0, 0, 0, 0.05), 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
  width: 1.5rem;
  height: 1.5rem;
  top: 0rem;
  left: 0em;
  border-radius: 500rem;
  -webkit-transition: background 0.3s ease 0s,
    left 0.3s ease 0s
  ;
          transition: background 0.3s ease 0s,
    left 0.3s ease 0s
  ;
}
.ui.toggle.checkbox input ~ .box:after,
.ui.toggle.checkbox input ~ label:after {
  left: -0.05rem;
}
/* Focus */
.ui.toggle.checkbox input:focus ~ .box:before,
.ui.toggle.checkbox input:focus ~ label:before {
  background-color: rgba(0, 0, 0, 0.1);
  border: none;
}
/* Hover */
.ui.toggle.checkbox .box:hover::before,
.ui.toggle.checkbox label:hover::before {
  background-color: rgba(0, 0, 0, 0.1);
  border: none;
}
/* Active */
.ui.toggle.checkbox input:checked ~ .box,
.ui.toggle.checkbox input:checked ~ label {
  color: #2ecc40;
}
.ui.toggle.checkbox input:checked ~ .box:before,
.ui.toggle.checkbox input:checked ~ label:before {
  background-color: #2ecc40;
}
.ui.toggle.checkbox input:checked ~ .box:after,
.ui.toggle.checkbox input:checked ~ label:after {
  left: 2.05rem;
}
/*******************************
           Overrides
*******************************/
@font-face {
  font-family: 'Checkbox';
  src: url('data:application/octet-stream;base64,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') format('woff'), url('data:application/octet-stream;base64,AAEAAAAOAIAAAwBgT1MvMj3hSQEAAADsAAAAVmNtYXDQEhm3AAABRAAAAUpjdnQgBkn/lAAABuwAAAAcZnBnbYoKeDsAAAcIAAAJkWdhc3AAAAAQAAAG5AAAAAhnbHlm32cEdgAAApAAAAC2aGVhZAErPHsAAANIAAAANmhoZWEHUwNNAAADgAAAACRobXR4CykAAAAAA6QAAAAMbG9jYQA4AFsAAAOwAAAACG1heHAApgm8AAADuAAAACBuYW1lzJ0aHAAAA9gAAALNcG9zdK69QJgAAAaoAAAAO3ByZXCSoZr/AAAQnAAAAFYAAQO4AZAABQAIAnoCvAAAAIwCegK8AAAB4AAxAQIAAAIABQMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAUGZFZABA6ADoAQNS/2oAWgMLAE8AAAABAAAAAAAAAAAAAwAAAAMAAAAcAAEAAAAAAEQAAwABAAAAHAAEACgAAAAGAAQAAQACAADoAf//AAAAAOgA//8AABgBAAEAAAAAAAAAAAEGAAAAAAAAAAAAAAAAA
}
.ui.checkbox label:before,
.ui.checkbox .box:before,
.ui.checkbox label:after,
.ui.checkbox .box:after {
  font-family: 'Checkbox';
}
.ui.checkbox label:after,
.ui.checkbox .box:after {
  content: '\e800';
  /* '' */
}
/* Radio Checkbox */
.ui.radio.checkbox .box:after,
.ui.radio.checkbox label:after {
  content: '';
  /* '' */
  -webkit-transform: scale(0.5);
      -ms-transform: scale(0.5);
          transform: scale(0.5);
  width: 16px;
  height: 16px;
  border-radius: 500rem;
  background-color: rgba(0, 0, 0, 0.8);
}
.icon-check:before {
  content: '\e800';
}
.icon-circle:before {
  content: '\e801';
}
/* '' */
.icon-ok-circled:before {
  content: '\e806';
}
/* '' */
.icon-ok-circle:before {
  content: '\e805';
}
/* '' */
.icon-cancel-circle:before {
  content: '\e807';
}
/* '' */
.icon-cancel-circle-1:before {
  content: '\e804';
}
/* '' */
.icon-empty-circle:before {
  content: '\e802';
}
/* '' */
.icon-radio:before {
  content: '\e803';
}
/* '' */
/*******************************
           Overrides
*******************************/