/* checkbox type 1*/
.check1{padding:8px 0;overflow:hidden;user-select:none;;}
.check1 input{padding:0;margin:0;position:absolute;z-index:-1;width:0;height:0;opacity:0}
.check1 label{position:relative;cursor:pointer;padding:0;display:inline-block;line-height: 20px;}
.check1 label::before{content:'';margin-right:10px;display:inline-block;vertical-align:middle;width:20px;height:20px;transition:0.3s;border-radius:3px;border:1px solid rgba(0,0,0,0.1);}
.msg .check1 label::before{border-color: #333}
.check1 label::after{content:'';position:absolute;left:6px;top:10px;background-color:#fff;width:2px;height:2px;box-shadow:2px 0 0 white,4px 0 0 white,4px -2px 0 white,4px -4px 0 white,4px -6px 0 white,4px -8px 0 #fff;-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0;transition:0.1s}
.check1 label:hover::before{border-color:rgba(0, 0, 0, 0.2)}
.check1 input:checked+label::after{opacity:1}
.check1 input:checked+label::before{background-color:#4090d0;border-color:transparent;}
.check1 input:focus+label::before{border-color:rgba(128, 192, 208, 0.9)}
.check1 input:checked:focus+label::before{background-color:#105090;border-color:transparent;}
.check1 input:disabled+label{color:#bbb;cursor:auto}
.check1 input:disabled+label::before{background-color:#ddd}
[dir="rtl"] .check1 label::before{margin-right:0;margin-left:10px;}
[dir="rtl"] .check1 label::after{left:0;right:14px;}

.check1.red input:checked+label::before{background-color:#da4041}
.check1.green input:checked+label::before{background-color:#2ecc71}


/* checkbox type icon*/
.checkIcon{
	position: relative;
	overflow:hidden;
  font-size: 18px;
  width: 36px;
  height: 36px;
  line-height: 36px;
	padding:0;
  display: block;
  text-align: center;
	user-select:none;;
}
.checkIcon input{
	padding:0;
	margin:0;
	position:absolute;
	z-index:-1;
	width:0;
	height:0;
	opacity:0
}
.checkIcon label{
	position:relative;
	cursor:pointer;
	padding:0;
	display:block;
	line-height: 36px;
	height: 36px;
  font-size: 18px;
  transition: 0.3s;
  overflow: hidden;
  border-radius: 5px;
  background-color: #f9f9f9;
  color: #37474f;
}
.checkIcon label svg{
	padding: 7px;
	width: 36px;
	height: 36px;
}
.checkIcon input:checked+label::after{
	content:'';
	position:absolute;
	width: 80%;
	height: 3px;
	background-color: #d32f2f;
	transform:rotate(-45deg);
	top: 47%;
	left: 10%;
}
.checkIcon:hover label{
  background-color: #f1f1f1;
  border-radius: 50%;
}
.checkIcon input:focus+label{
	color: #000;
}
.checkIcon input:focus + label{
	color: #000;
  background-color: #eee;
  border-radius: 50%;
}
.checkIcon:active label{
  background-color: #e7e7e7;
  border-radius: 50%;
}
.checkIcon input:active label{
  background-color: #e7e7e7;
}
.checkIcon input:disabled+label{
	color:#bbb;
	cursor:auto
}
.checkIcon input:disabled+label::before{
	background-color:#ddd
}