/* Form Field Inputs */
.utv-formfield{
  margin: 12px 0;

  label{
    display: block;
    margin: 10px 0 7px;
  }

  input[type=text],
  input[type=number],
  input[type=url],
  select{
    width: 100%;
    height: 30px;
    /*padding: 6px;*/
  }

  textarea{
    width: 100%;
    padding: 6px;
    resize: vertical;
    min-height: 70px;
  }

  .utv-hint{
    display: block;
    font-style: italic;
    margin-top: 5px;
    color: #666;
  }

  .utv-invalid-feedback{
    color: #dc3545;
  }

  &.utv-formfield-action{
    margin-top: 25px;
  }
}

form.was-validated{
  input[type=text],
  input[type=number],
  input[type=url]{
    &:invalid{
      border: 1px solid #dc3545;
    }
  }
}

/* Buttons */
button.utv-cancel{
  cursor: pointer;
  text-decoration: none;
  margin: 0;
  font-size: 13px;
  border-radius: 3px;
  display: inline-block;
  border: 1px solid transparent;
  font-weight: normal;
  color: #fff;
  height: 28px;
  line-height: 26px;
  padding: 0 10px;
  background: #ca0000;
  border-color: #c10000 #a80000 #a80000;
  box-shadow: 0 1px 0 #a80000;
  text-shadow: 0 -1px 1px #a80000,1px 0 1px #a80000,0 1px 1px #a80000,-1px 0 1px #a80000;
}

button.utv-cancel:hover{
  background-color: #df0000;
  color: #fff!important;
  text-decoration: none;
  border-color: #800000;
}

/* Checkbox Toggle */
.ui.checkbox {
  position: relative;
  display: inline-block;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  outline: 0;
  vertical-align: baseline;
  font-style: normal;
  min-height: 17px;
  font-size: 1rem;
  line-height: 17px;
  min-width: 17px
}

.ui.checkbox input[type=checkbox],
.ui.checkbox input[type=radio] {
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0!important;
  outline: 0;
  z-index: 3;
  width: 17px;
  height: 17px
}

.ui.checkbox .box,
.ui.checkbox label {
  cursor: auto;
  position: relative;
  display: block;
  padding-left: 1.85714em;
  outline: 0;
  font-size: 1em
}

.ui.checkbox .box::before,
.ui.checkbox label::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 17px;
  height: 17px;
  content: '';
  background: #fff;
  border-radius: .21428571rem;
  -webkit-transition: border .1s ease, opacity .1s ease, box-shadow .1s ease, -webkit-transform .1s ease;
  transition: border .1s ease, opacity .1s ease, box-shadow .1s ease, -webkit-transform .1s ease;
  transition: border .1s ease, opacity .1s ease, transform .1s ease, box-shadow .1s ease;
  transition: border .1s ease, opacity .1s ease, transform .1s ease, box-shadow .1s ease, -webkit-transform .1s ease;
  border: 1px solid #d4d4d5
}

.ui.checkbox .box:after,
.ui.checkbox label:after {
  position: absolute;
  font-size: 14px;
  top: 0;
  left: 0;
  width: 17px;
  height: 17px;
  text-align: center;
  opacity: 0;
  color: rgba(0, 0, 0, .87);
  -webkit-transition: border .1s ease, opacity .1s ease, box-shadow .1s ease, -webkit-transform .1s ease;
  transition: border .1s ease, opacity .1s ease, box-shadow .1s ease, -webkit-transform .1s ease;
  transition: border .1s ease, opacity .1s ease, transform .1s ease, box-shadow .1s ease;
  transition: border .1s ease, opacity .1s ease, transform .1s ease, box-shadow .1s ease, -webkit-transform .1s ease
}

.ui.checkbox label,
.ui.checkbox+label {
  color: rgba(0, 0, 0, .87);
  -webkit-transition: color .1s ease;
  transition: color .1s ease
}

.ui.checkbox+label {
  vertical-align: middle
}

.ui.checkbox .box:hover::before,
.ui.checkbox label:hover::before {
  background: #fff;
  border-color: rgba(34, 36, 38, .35)
}

.ui.checkbox label:hover,
.ui.checkbox+label:hover {
  color: rgba(0, 0, 0, .8)
}

.ui.checkbox .box:active::before,
.ui.checkbox label:active::before {
  background: #f9fafb;
  border-color: rgba(34, 36, 38, .35)
}

.ui.checkbox .box:active::after,
.ui.checkbox label:active::after {
  color: rgba(0, 0, 0, .95)
}

.ui.checkbox input:active~label {
  color: rgba(0, 0, 0, .95)
}

.ui.checkbox input:focus~.box::before,
.ui.checkbox input:focus~label::before {
  background: #fff;
  border-color: #96c8da
}

.ui.checkbox input:focus~.box:after,
.ui.checkbox input:focus~label:after {
  color: rgba(0, 0, 0, .95)
}

.ui.checkbox input:focus~label {
  color: rgba(0, 0, 0, .95)
}

.ui.checkbox input:checked~.box::before,
.ui.checkbox input:checked~label::before {
  background: #fff;
  border-color: rgba(34, 36, 38, .35)
}

.ui.checkbox input:checked~.box:after,
.ui.checkbox input:checked~label:after {
  opacity: 1;
  color: rgba(0, 0, 0, .95)
}

.ui.checkbox input:checked:focus~.box::before,
.ui.checkbox input:checked:focus~label::before{
  background: #fff;
  border-color: #96c8da
}

.ui.checkbox input:checked:focus~.box:after,
.ui.checkbox input:checked:focus~label:after{
  color: rgba(0, 0, 0, .95)
}

.ui.read-only.checkbox,
.ui.read-only.checkbox label {
  cursor: default
}

.ui.checkbox input[disabled]~.box:after,
.ui.checkbox input[disabled]~label,
.ui.disabled.checkbox .box:after,
.ui.disabled.checkbox label {
  cursor: default!important;
  opacity: .5;
  color: #000
}

.ui.checkbox input.hidden {
  z-index: -1
}

.ui.checkbox input.hidden+label {
  cursor: pointer;
  user-select: none
}

.ui.toggle.checkbox {
  min-height: 1.5rem
}

.ui.toggle.checkbox input[type=checkbox] {
  width: 100%;
  height: 100%;
  margin: 0;
  border: 0;
}

.ui.toggle.checkbox .box,
.ui.toggle.checkbox label {
  min-height: 1.5rem;
  padding-left: 4.5rem;
  color: rgba(0, 0, 0, .87)
}

.ui.toggle.checkbox label {
  padding-top: .15em;
  margin: 0;
}

.ui.toggle.checkbox .box::before,
.ui.toggle.checkbox label::before {
  display: block;
  position: absolute;
  content: '';
  z-index: 1;
  transform: none;
  border: none;
  top: 0;
  background: rgba(0, 0, 0, .05);
  box-shadow: none;
  width: 3.5rem;
  height: 1.5rem;
  border-radius: 500rem
}

.ui.toggle.checkbox .box:after,
.ui.toggle.checkbox label:after {
  background: #fff -webkit-linear-gradient(transparent, rgba(0, 0, 0, .05));
  background: #fff linear-gradient(transparent, rgba(0, 0, 0, .05));
  position: absolute;
  content: ''!important;
  opacity: 1;
  z-index: 2;
  border: none;
  box-shadow: 0 1px 2px 0 rgba(34, 36, 38, .15), 0 0 0 1px rgba(34, 36, 38, .15) inset;
  width: 1.5rem;
  height: 1.5rem;
  top: 0;
  left: 0;
  border-radius: 500rem;
  transition: background .3s ease, left .3s ease
}

.ui.toggle.checkbox input~.box:after,
.ui.toggle.checkbox input~label:after {
  left: -.05rem;
  box-shadow: none
}

.ui.toggle.checkbox input:focus~.box::before,
.ui.toggle.checkbox input:focus~label::before {
  background-color: rgba(0, 0, 0, .15);
  border: none
}

.ui.toggle.checkbox .box:hover::before,
.ui.toggle.checkbox label:hover::before {
  background-color: rgba(0, 0, 0, .15);
  border: none
}

.ui.toggle.checkbox input:checked~.box,
.ui.toggle.checkbox input:checked~label {
  color: rgba(0, 0, 0, .95)!important
}

.ui.toggle.checkbox input:checked~.box::before,
.ui.toggle.checkbox input:checked~label::before {
  background-color: #2185d0!important
}

.ui.toggle.checkbox input:checked~.box:after,
.ui.toggle.checkbox input:checked~label:after {
  left: 2.15rem;
  box-shadow: none
}

.ui.toggle.checkbox input:focus:checked~.box,
.ui.toggle.checkbox input:focus:checked~label {
  color: rgba(0, 0, 0, .95)!important
}

.ui.toggle.checkbox input:focus:checked~.box::before,
.ui.toggle.checkbox input:focus:checked~label::before {
  background-color: #0d71bb!important
}

@font-face {
  font-family: Checkbox;
  src: url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg8SBD8AAAC8AAAAYGNtYXAYVtCJAAABHAAAAFRnYXNwAAAAEAAAAXAAAAAIZ2x5Zn4huwUAAAF4AAABYGhlYWQGPe1ZAAAC2AAAADZoaGVhB30DyAAAAxAAAAAkaG10eBBKAEUAAAM0AAAAHGxvY2EAmgESAAADUAAAABBtYXhwAAkALwAAA2AAAAAgbmFtZSC8IugAAAOAAAABknBvc3QAAwAAAAAFFAAAACAAAwMTAZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADoAgPA/8AAQAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAOAAAAAoACAACAAIAAQAg6AL//f//AAAAAAAg6AD//f//AAH/4xgEAAMAAQAAAAAAAAAAAAAAAQAB//8ADwABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAABAEUAUQO7AvgAGgAAARQHAQYjIicBJjU0PwE2MzIfAQE2MzIfARYVA7sQ/hQQFhcQ/uMQEE4QFxcQqAF2EBcXEE4QAnMWEP4UEBABHRAXFhBOEBCoAXcQEE4QFwAAAAABAAABbgMlAkkAFAAAARUUBwYjISInJj0BNDc2MyEyFxYVAyUQEBf9SRcQEBAQFwK3FxAQAhJtFxAQEBAXbRcQEBAQFwAAAAABAAAASQMlA24ALAAAARUUBwYrARUUBwYrASInJj0BIyInJj0BNDc2OwE1NDc2OwEyFxYdATMyFxYVAyUQEBfuEBAXbhYQEO4XEBAQEBfuEBAWbhcQEO4XEBACEm0XEBDuFxAQEBAX7hAQF20XEBDuFxAQEBAX7hAQFwAAAQAAAAIAAHRSzT9fDzz1AAsEAAAAAADRsdR3AAAAANGx1HcAAAAAA7sDbgAAAAgAAgAAAAAAAAABAAADwP/AAAAEAAAAAAADuwABAAAAAAAAAAAAAAAAAAAABwQAAAAAAAAAAAAAAAIAAAAEAABFAyUAAAMlAAAAAAAAAAoAFAAeAE4AcgCwAAEAAAAHAC0AAQAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQAIAAAAAQAAAAAAAgAHAGkAAQAAAAAAAwAIADkAAQAAAAAABAAIAH4AAQAAAAAABQALABgAAQAAAAAABgAIAFEAAQAAAAAACgAaAJYAAwABBAkAAQAQAAgAAwABBAkAAgAOAHAAAwABBAkAAwAQAEEAAwABBAkABAAQAIYAAwABBAkABQAWACMAAwABBAkABgAQAFkAAwABBAkACgA0ALBDaGVja2JveABDAGgAZQBjAGsAYgBvAHhWZXJzaW9uIDIuMABWAGUAcgBzAGkAbwBuACAAMgAuADBDaGVja2JveABDAGgAZQBjAGsAYgBvAHhDaGVja2JveABDAGgAZQBjAGsAYgBvAHhSZWd1bGFyAFIAZQBnAHUAbABhAHJDaGVja2JveABDAGgAZQBjAGsAYgBvAHhGb250IGdlbmVyYXRlZCBieSBJY29Nb29uLgBGAG8AbgB0ACAAZwBlAG4AZQByAGEAdABlAGQAIABiAHkAIABJAGMAbwBNAG8AbwBuAC4AAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('truetype')
}

.ui.checkbox .box:after,
.ui.checkbox label:after {
  font-family: Checkbox
}

.ui.checkbox input:checked~.box:after,
.ui.checkbox input:checked~label:after {
  content: '\e800'
}