.custom-checkbox {
  .icon {
    cursor: pointer;
  }

  .icon:before {
    content: '';
    display: inline-block;
    height: 15px;
    width: 15px;
    border: 1px solid #bbb;
  }

  input[type="checkbox"] { 
	text-align: left !important;  
    display: none;

    &:checked ~ .icon:before {
      background: lightgreen;
    }
  }
}

label.error {
  color: red;
}

input {
position: relative;
width: 100%;
height: 40px;
border-bottom: 1px solid #000;
border-left: none;
border-right: none;
border-top: none;
padding: 5px 5px;
background: none;
margin: 10px 0 10px 0;
font-family: 'Raleway', sans-serif;
font-size: 13px;
line-height: 1.5;
font-style: normal;
font-weight: normal;
text-align: center;
color: #000;
-webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
    -ms-transition: all 0.5s linear;
     -o-transition: all 0.5s linear;
        transition: all 0.5s linear;
}

input[type="checkbox"]{
margin:0;
width:10%;	
} 

::-webkit-input-placeholder { font-size: 12px; color: #000; }
     :-ms-input-placeholder { font-size: 12px; color: #000; }
         ::-moz-placeholder { font-size: 12px; color: #000; }
     input:-moz-placeholder { font-size: 12px; color: #000; }

input:focus::-webkit-input-placeholder { color: transparent; }
     input:focus:-ms-input-placeholder { color: transparent; }
         input:focus::-moz-placeholder { color: transparent; }
          input:focus:-moz-placeholder { color: transparent; }

form input:hover,
form textarea:hover {
border-color: rgba(219, 0, 24, .5);
-webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
    -ms-transition: all 0.5s linear;
     -o-transition: all 0.5s linear;
        transition: all 0.5s linear;
}


form input:focus,
form textarea:focus {
-webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
    -ms-transition: all 0.5s linear;
     -o-transition: all 0.5s linear;
        transition: all 0.5s linear;
}