*{
font-family: 'SegoeUIRegular';
font-size:16px;
}

.wnd{
position:fixed;
left:50%;
top:50%;
transform:translateX(-50%) translateY(-50%);
background:#fff;
border-radius:5px;
min-width:350px;
padding:20px;
z-index:1001;
}

.shad{
position:fixed;
left:0;
top:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.5);
z-index:1000;
}

.clsBtn{
position:absolute;
right:10px;
top:10px;
width:30px;
height:30px;
cursor:pointer;
z-index:10;
}

.clsBtn::before,.clsBtn::after{
content:'';
position:absolute;
width:60%;
height:1px;
left:50%;
top:50%;
background:#000;
transform:translateX(-50%) translateY(-50%) rotate(45deg);
}

.clsBtn::after{
transform:translateX(-50%) translateY(-50%) rotate(-45deg);
}


@keyframes catWndIn{
from {transform:translateX(-50%) translateY(-50%) scale(0.8);opacity:0;}
to {transform:translateX(-50%) translateY(-50%) scale(1);opacity:1;}
}
@-moz-keyframes catWndIn{
from {transform:translateX(-50%) translateY(-50%) scale(0.8);opacity:0;}
to {transform:translateX(-50%) translateY(-50%) scale(1);opacity:1;}
}
@-webkit-keyframes catWndIn{
from {transform:translateX(-50%) translateY(-50%) scale(0.8);opacity:0;}
to {transform:translateX(-50%) translateY(-50%) scale(1);opacity:1;}
}

@keyframes catWndOut{
from {transform:translateX(-50%) translateY(-50%) scale(1);opacity:1;}
to {transform:translateX(-50%) translateY(-50%) scale(0.8);opacity:0;}
}
@-moz-keyframes catWndOut{
from {transform:translateX(-50%) translateY(-50%) scale(1);opacity:1;}
to {transform:translateX(-50%) translateY(-50%) scale(0.8);opacity:0;}
}
@-webkit-keyframes catWndOut{
from {transform:translateX(-50%) translateY(-50%) scale(1);opacity:1;}
to {transform:translateX(-50%) translateY(-50%) scale(0.8);opacity:0;}
}


@keyframes catShadIn{
from {opacity:0;}
to {opacity:1;}
}
@-moz-keyframes catShadIn{
from {opacity:0;}
to {opacity:1;}
}
@-webkit-keyframes catShadIn{
from {opacity:0;}
to {opacity:1;}
}

@keyframes catShadOut{
from {opacity:1;}
to {opacity:0;}
}
@-moz-keyframes catShadOut{
from {opacity:1;}
to {opacity:0;}
}
@-webkit-keyframes catShadOut{
from {opacity:1;}
to {opacity:0;}
}

.chbTxt{
font-size:14px;
padding:0 0 0 10px;
}

.scrlFld{
height:600px;
width:500px;
overflow-y:auto;
margin-bottom:20px;
}

.dpWnd{
position:fixed;
left:50%;
top:50%;
transform:translateX(-50%) translateY(-50%);
padding:20px;
background:#fff;
z-index:102;
border-radius:15px;
min-width:300px;
}

.dpShad{
position:fixed;
z-index:101;
left:0;
top:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.4);
}

.scrlFldOpt{
width:460px;
padding:5px;
cursor:pointer;
height:45px;
}

.mn,.pl,.dpCount{
position:relative;
border:1px solid #a2a2a2;
width:35px;
margin:0 2px;
text-align:center;
border-radius:4px;
}

.dpCount{
padding:5px 0 0 0;
}

.mn::before,.pl::before{
position:absolute;
content:'';
height:2px;
width:40%;
top:50%;
left:50%;
transform:translateX(-50%) translateY(-50%);
background:#d00;
}

.pl::after{
position:absolute;
content:'';
height:2px;
width:40%;
top:50%;
left:50%;
transform:translateX(-50%) translateY(-50%) rotate(90deg);
background:#d00;
}

.flxLn{
display:flex;
justify-content:space-between;
margin-bottom:20px;
}

.selectorOpt{
padding:10px;
}

.selector{
margin-bottom:20px;
}

.selectorLn{
display:flex;
align-items:center;
margin:0 20px;
cursor:pointer;
transition:0.5s;
}

.selectorLn:hover{
color:#d00;
}

.selectorChb{
position:relative;
width:20px;
height:20px;
border-radius:50%;
border:1px solid #a2a2a2;
margin-right:20px;
}

.sChbIn{
position:absolute;
width:70%;
height:70%;
border-radius:50%;
background:#d00;
left:50%;
top:50%;
transform:translateX(-50%) translateY(-50%);
}

.dpWndHdr{
text-align:left;
}