#SumoSelect p {margin: 0;}
#SumoSelect{width: 100%;}

#SumoSelect .SelectBox {padding: 13px 20px;}

#SumoSelect .sumoStopScroll{overflow:hidden;}

/* Filtering style */
#SumoSelect .hidden { display:none; }
#SumoSelect .search-txt{display:none;outline:none;}
#SumoSelect .no-match{display:none;padding: 6px;}
#SumoSelect.open .search-txt{display: inline-block;position: absolute;top: 0;left: 0;width: 100%;margin: 0; padding: 5px 8px;border: none;  height: auto; float: none;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; }
#SumoSelect.open>.search>span, #SumoSelect.open>.search>label{visibility:hidden;}

/*this is applied on that hidden select. DO NOT USE display:none; or visiblity:hidden; and Do not override any of these properties. */
.SelectClass,.SumoUnder {position: absolute; top: 0; left: 0; right: 0; height: 100%; width: 100%; border: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; }
.SelectClass{z-index: 1;}

#SumoSelect > .optWrapper > .options  li.opt label, #SumoSelect > .CaptionCont,#SumoSelect .select-all > label { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; }
#SumoSelect { display: inline-block; position: relative;outline:none; font-family: 'NotoKrL'; font-size: 15px; color:#555;}
/*focus*/
#SumoSelect:focus > .CaptionCont,#SumoSelect:hover > .CaptionCont, #SumoSelect.open > .CaptionCont {/*box-shadow: 0 0 2px #7799D0; border-color: #7799D0;*/}

#SumoSelect > .CaptionCont { position: relative; border: 1px solid #ededed; height:50px; background-color: #fff; margin:0; font-size:15px; box-sizing:border-box;}
#SumoSelect > .CaptionCont > span { display: block; padding-right: 30px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;cursor:default; float: none; margin: 0; line-height: normal;}
           
/*placeholder style*/
#SumoSelect > .CaptionCont > span.placeholder {color: #555; }

/*arrow*/
/*#SumoSelect > .CaptionCont > label { position: absolute; top: 0; right: 0; bottom: 0; width: 30px;}
#SumoSelect > .CaptionCont > label > i {background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAYAAABy6+R8AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3wMdBhAJ/fwnjwAAAGFJREFUKM9jYBh+gBFKuzEwMKQwMDB8xaOWlYGB4T4DA0MrsuapDAwM//HgNwwMDDbYTJuGQ8MHBgYGJ1xOYGNgYJiBpuEpAwODHSF/siDZ+ISBgcGClEDqZ2Bg8B6CkQsAPRga0cpRtDEAAAAASUVORK5CYII=');
    background-position: center center; width: 16px; height: 16px; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto;background-repeat: no-repeat;opacity: 0.8;}*/

#SumoSelect > .optWrapper {display:none; z-index: 1000; top: 30px; width: 100%; position: absolute; left: 0; border: 1px solid #ddd; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.4); overflow: hidden;}
#SumoSelect.open > .optWrapper {top:35px; display:block;}
#SumoSelect.open > .optWrapper.up {top: auto;bottom: 100%;margin-bottom: 5px;}
#SumoSelect > .optWrapper ul {list-style: none; display: block; padding: 0; margin: 0; overflow: auto;}
#SumoSelect > .optWrapper > .options {position:relative; /*Set the height of pop up here (only for desktop mode)*/ max-height: 250px; /*height*/ background:#fff;}

/*#SumoSelect > .optWrapper.okCancelInMulti > .options {}
#SumoSelect > .optWrapper.selall > .options {}
#SumoSelect > .optWrapper.selall.okCancelInMulti > .options {}*/
#SumoSelect > .optWrapper > .options li.group.disabled > label{opacity:0.5;}
#SumoSelect > .optWrapper > .options li ul li.opt{padding-left: 22px;}
#SumoSelect > .optWrapper.multiple > .options li ul li.opt{padding-left: 50px;}
#SumoSelect > .optWrapper.isFloating > .options {/*max-height: 100%;*/ max-height:321px;}
#SumoSelect > .optWrapper > .options  li.opt { padding: 6px 6px; position: relative; border-bottom: 1px solid #ededed;}
/*#SumoSelect > .optWrapper > .options > li.opt:first-child {}
#SumoSelect > .optWrapper.selall > .options > li.opt:first-child {}*/
#SumoSelect > .optWrapper > .options > li.opt:last-child {border-bottom: none;}
/*#SumoSelect > .optWrapper.okCancelInMulti > .options > li.opt:last-child {}*/
#SumoSelect > .optWrapper > .options li.opt:hover {background-color: #f5f5f5; }
#SumoSelect > .optWrapper > .options li.opt.sel, #SumoSelect .select-all.sel{background-color: #a1c0e4;}

#SumoSelect > .optWrapper > .options li label { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block;cursor: pointer;}
#SumoSelect > .optWrapper > .options li span { display: none; }
#SumoSelect > .optWrapper > .options li.group > label {cursor: default;padding: 8px 6px;font-weight: bold;}

/*Floating styles*/
#SumoSelect > .optWrapper.isFloating { position: fixed; top: 0; left: 0; right: 0; width: 90%; bottom: 0; margin: auto; max-height: 90%; }

/*disabled state*/
#SumoSelect > .optWrapper > .options li.opt.disabled { background-color: inherit; pointer-events: none;}
#SumoSelect > .optWrapper > .options li.opt.disabled * { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";  filter: alpha(opacity=50);  -moz-opacity: 0.5;  -khtml-opacity: 0.5; opacity: 0.5; }


/*styling for multiple select*/
#SumoSelect > .optWrapper.multiple > .options li.opt { padding-left: 35px;cursor: pointer;}
#SumoSelect > .optWrapper.multiple > .options li.opt span,
#SumoSelect .select-all > span{position:absolute;display:block;width:45px; top:0; bottom:0; left:0;}
#SumoSelect > .optWrapper.multiple > .options li.opt span i,
#SumoSelect .select-all > span i{position: absolute;margin: auto;left: 0;right: 0;top: 0;bottom: 0;width: 14px;height: 14px;border: 1px solid #AEAEAE; background-color: #fff;}
#SumoSelect > .optWrapper > .MultiControls {display: none; border-top: 1px solid #ddd; background: #fff;}
#SumoSelect > .optWrapper.multiple.isFloating > .MultiControls { display: block; /*position: absolute; width:100%; bottom:0;*/}

#SumoSelect > .optWrapper.multiple.okCancelInMulti > .MultiControls { display: block; }
#SumoSelect > .optWrapper.multiple.okCancelInMulti > .MultiControls > p {padding: 6px;}
#SumoSelect > .optWrapper.multiple.okCancelInMulti > .MultiControls > p:focus {box-shadow: 0 0 2px #a1c0e4; border-color: #a1c0e4;outline: none; background-color: #a1c0e4;}

#SumoSelect > .optWrapper.multiple > .MultiControls > p { display: inline-block; cursor: pointer; padding:20px 15px; width: 50%; box-sizing: border-box; text-align: center; font-size:15px;}
#SumoSelect > .optWrapper.multiple > .MultiControls > p:hover { background: #6199d2; color:#fff;}
#SumoSelect > .optWrapper.multiple > .MultiControls > p.btnOk { border-right: 1px solid #ddd;}
/*#SumoSelect > .optWrapper.multiple > .MultiControls > p.btnCancel {}*/

/*styling for select on popup mode*/
#SumoSelect > .optWrapper.isFloating > .options li.opt { padding:15px 10px; }

/*styling for only multiple select on popup mode*/
#SumoSelect > .optWrapper.multiple.isFloating > .options li.opt { padding-left: 45px; }
#SumoSelect > .optWrapper.multiple.isFloating { padding-bottom:54px; }

#SumoSelect > .optWrapper.multiple > .options li.opt.selected span i,
#SumoSelect .select-all.selected > span i,
#SumoSelect .select-all.partial > span i{box-shadow: none; border-color: transparent; background:#40494e url('/image/check.png') center 49% no-repeat;}

/*disabled state*/
#SumoSelect.disabled { opacity: 0.7;cursor: not-allowed;}
#SumoSelect.disabled > .CaptionCont{border-color:#ccc;box-shadow:none;}

/**Select all button**/
#SumoSelect .select-all{position: relative; border-bottom: 1px solid #ededed; background: #f5f2f1; padding:15px 45px; cursor: pointer; font-size:15px;}
#SumoSelect .select-all > label, #SumoSelect .select-all > span i{cursor: pointer;}
#SumoSelect .select-all.partial > span i{background-color:#ccc;}

/*styling for optgroups*/
#SumoSelect > .optWrapper > .options li.optGroup { padding-left: 5px; text-decoration: underline; }

/*height*/
.Sel_Multi_all #SumoSelect > .optWrapper.multiple.isFloating{padding-bottom:56px;}

/*placehloder disabled*/
.Select_area #SumoSelect > .optWrapper > .options li.opt.disabled{display:none;}
.Select_subject #SumoSelect > .optWrapper > .options li.opt.disabled{display:none;}


@media screen and (min-width:1025px){ 
	#SumoSelect > .optWrapper.isFloating{max-width:800px;}
}

@media screen and (max-width:410px){ 
	#SumoSelect > .CaptionCont{font-size:13px;}
	#SumoSelect .SelectBox {padding: 13px 10px;}
}