<div class="search_on">
<div class="select_item">
<input type="checkbox" class="checkbox check" id="on_PHOTO" name="NOT_PHOTO">
<label class="label_checkbox" for="on_PHOTO">
<span class="checkbox_square"></span>
<span class="checkbox_label">С фото</span>
</label>
</div>
</div>
.search_on {
display: -ms-flex;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.search_on .select_item {
margin-bottom: 0;
}
.search_on .select_item .checkbox {
display: none;
}
input {
border: none;
}
.search_on .select_item .label_checkbox {
height: 20px;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
vertical-align: middle;
font-size: 0;
cursor: pointer;
}
.filter .options label {
margin-right: 10px;
}
.filter .options .search_on .select_item .label_checkbox span {
vertical-align: middle;
font-size: 16px;
font-family: museo_sans_cyrl300;
font-weight: normal;
}
.search_on .select_item .checkbox+label>.checkbox_square {
display: inline-block;
cursor: pointer;
margin-right: 10px;
width: 20px;
height: 20px;
border: 2px solid #aa2b2b;
-webkit-box-sizing: border-box;
box-sizing: border-box;
vertical-align: middle;
position: relative;
}
.animate_background, .search_on .select_item .checkbox+label>.checkbox_square {
-webkit-transition: background-color 0.3s ease;
-o-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.search_on .select_item .label_checkbox span {
vertical-align: middle;
font-size: 16px;
font-family: museo_sans_cyrl700;
font-weight: bold;
line-height: 20px;
}
.filter .options .search_on .select_item .label_checkbox span {
vertical-align: middle;
font-size: 16px;
font-family: museo_sans_cyrl300;
font-weight: normal;
}
.search_on .select_item .label_checkbox span {
vertical-align: middle;
font-size: 16px;
font-family: museo_sans_cyrl700;
font-weight: bold;
line-height: 20px;
}
.search_on .select_item .checkbox:checked+label>.checkbox_square {
border: none;
}
.filter .options .search_on .select_item .label_checkbox span {
vertical-align: middle;
font-size: 16px;
font-family: museo_sans_cyrl300;
font-weight: normal;
}
.search_on .select_item .checkbox+label>.checkbox_square {
display: inline-block;
cursor: pointer;
margin-right: 10px;
width: 20px;
height: 20px;
border: 2px solid #aa2b2b;
-webkit-box-sizing: border-box;
box-sizing: border-box;
vertical-align: middle;
position: relative;
}
.animate_background, .search_on .select_item .checkbox+label>.checkbox_square {
-webkit-transition: background-color 0.3s ease;
-o-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.search_on .select_item .label_checkbox span {
vertical-align: middle;
font-size: 16px;
font-family: museo_sans_cyrl700;
font-weight: bold;
line-height: 20px;
}
.search_on .select_item .checkbox:checked+label>.checkbox_square:before {
content: "";
width: 20px;
height: 20px;
background: -o-linear-gradient(45deg, #791717, #aa2b2b);
background: linear-gradient(45deg, #791717, #aa2b2b);
display: inline-block;
position: absolute;
top: 0;
left: 0;
}
.search_on .select_item .checkbox:checked+label>.checkbox_square:after {
content: "";
width: 14px;
height: 12px;
display: inline-block;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
z-index: 58;
}
Скажите, пожалуйста , label по вертикали расположен по центру относительно чебокса?