.active-color-2 input[type=email]:focus:not([readonly]),
.active-color-2 input[type=text]:focus:not([readonly]),
.color-textarea textarea.md-textarea:focus:not([readonly]) {
 border-bottom: 2px solid #000;
 box-shadow: 0 1px 0 0 #000;
}
.active-color input[type=email],
.active-color input[type=text],
.active-color-textarea-2 textarea.md-textarea {
 border-bottom: 1px solid #000;
 box-shadow: 0 1px 0 0 #000;
}

/* checkbox */
input[type="checkbox"] {
 border:0;
 clip:rect(0 0 0 0);
 height:1px;
 margin:-1px;
 overflow:hidden;
 padding:0;
 position:absolute;
 width:1px;
}

input[type="checkbox"]:focus + label:before, 
input[type="checkbox"]:hover + label:before {
  border-color:#000;
}

input[type="checkbox"]:active + label:before {
  -webkit-transition-duration: 0;
          transition-duration: 0;
  -webkit-filter: brightness(0.2);
          filter: brightness(0.2);
}

input[type="checkbox"] + label {
  position: relative;
  padding: 5px;
  padding-left: 30px;
  vertical-align: middle;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

input[type="checkbox"] + label:before {
  box-sizing: content-box;
  content: '';
  background-color: transparent; 
  position: absolute;
  top: 50%;
  left: 0;
  width: 14px;
  height: 14px;
  margin-top: -9px;
  border: 2px solid #000;
  text-align: center;
}

input[type="checkbox"] + label:after {
  box-sizing: content-box;
  content: '';
  background-color: transparent; 
  position: absolute;
  top: 50%;
  left: 4px;
  width: 10px;
  height: 10px;
  margin-top: -5px;
  -webkit-transform: scale(0);
          transform: scale(0);
  -webkit-transform-origin: 50%;
          transform-origin: 50%;
  -webkit-transition: -webkit-transform 200ms ease-out;
  transition: -webkit-transform 200ms ease-out;
  transition: transform 200ms ease-out;
  transition: transform 200ms ease-out, -webkit-transform 200ms ease-out;
}

input[type="checkbox"] + label:after {
  background-color: transparent;
  top: 50%;
  left: 4px;
  width: 8px;
  height: 3px;
  margin-top: -4px;
  border-style: solid;
  border-color: #000;
  border-width: 0 0 3px 3px;
  -webkit-border-image: none;
       -o-border-image: none;
          border-image: none;
  -webkit-transform: rotate(-45deg) scale(0);
          transform: rotate(-45deg) scale(0);
  -webkit-transition: none;
  transition: none;
}

input[type="checkbox"]:checked + label:after {
  content: '';
  -webkit-transform: rotate(-45deg) scale(1);
          transform: rotate(-45deg) scale(1);
  -webkit-transition: -webkit-transform 200ms ease-out;
  transition: -webkit-transform 200ms ease-out;
  transition: transform 200ms ease-out;
  transition: transform 200ms ease-out, -webkit-transform 200ms ease-out;
}

input[type="checkbox"]:checked + label:before {
  -webkit-animation: borderscale 200ms ease-in;
          animation: borderscale 200ms ease-in;
}
input[type="checkbox"]:checked + label:after {
  -webkit-transform: rotate(-45deg) scale(1);
          transform: rotate(-45deg) scale(1);
}

@-webkit-keyframes borderscale {
  50% {
    box-shadow: 0 0 0 2px #000;
  }
}

@keyframes borderscale {
  50% {
    box-shadow: 0 0 0 2px #000;
  }
}
/* checkbox ENDE */
