@font-face {
    font-family: 'icomoon';
    src:  url('fonts/icomoon.eot?b0jxdk');
    src:  url('fonts/icomoon.eot?b0jxdk#iefix') format('embedded-opentype'),
        url('fonts/icomoon.ttf?b0jxdk') format('truetype'),
        url('fonts/icomoon.woff?b0jxdk') format('woff'),
        url('fonts/icomoon.svg?b0jxdk#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

/*  data-icon="&#x{icon code}" */
[data-icon]:before {
    font-family: 'icomoon' !important;
    content: attr(data-icon);
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
[data-title]{
    position: relative;
    overflow: visible !important;
    line-height: 16px !important;
    display: inline-block !important;
}
[data-title]:hover:after{
    display: inline-block !important;
    position: absolute !important;
    z-index: 2 !important;
    padding: 8px !important;
    left: 0px !important;
    top: -30px !important;
    border-radius: 4px !important;
    background-color: #3F3F3F !important;
    text-shadow: 0px 1px 0px #000 !important;
    color: #FFF !important;
    speak: none !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    font-size: 14px !important;
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    -o-user-select: none !important;
    user-select: none !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    content: attr(data-title);
    transition: all 0.2s ease !important;
    -moz-transition: all 0.2s ease !important;
    -o-transition: all 0.2s ease !important;
    -webkit-transition: all 0.2s ease !important;
}
/* End Icon */

html,body{padding: 0px; margin: 0px;}
.clearfix{clear: both !important; display: table !important; width: 100% !important;}
.dir-ltr{direction:ltr !important}
.dir-rtl{direction:rtl !important}
.bold{font-weight:bold!important}
.size10{font-size:10px !important; line-height: 15px;}
.size12{font-size:12px !important; line-height: 18px;}
.size14{font-size:14px !important; line-height: 21px;}
.size16{font-size:16px !important; line-height: 24px;}
.size18{font-size:18px !important; line-height: 28px;}
.size20{font-size:20px !important; line-height: 30px;}
.size22{font-size:22px !important; line-height: 33px;}
.image-32{width:32px !important;height:32px !important}
.image-40{width:40px !important;height:40px !important}
.image-50{width:50px !important;height:50px !important}
.image-60{width:60px !important;height:60px !important}
.image-70{width:70px !important;height:70px !important}
.image-80{width:80px !important;height:80px !important}
.image-90{width:90px !important;height:90px !important}
.image-120-100{width:120px !important;height:100px !important}
.height-100{height: 100px;}
.height-120{height: 120px;}
.height-150{height: 150px;}
.height-200{height: 200px;}
.max-height-100{max-height: 100px;}
.max-height-120{max-height: 120px;}
.max-height-150{max-height: 150px;}
.width-100{min-width: 100px !important;}
.width-120{min-width: 120px !important;}
.width-150{min-width: 150px !important;}
.width-200{min-width: 200px !important;}
.max-width-100{max-width: 100px !important;}
.max-width-120{max-width: 120px !important;}
.max-width-150{max-width: 150px !important;}
/* Margin Size */
.margin-4{margin: 4px !important;}
.margin-0-4{margin: 0px 4px !important;}
.margin-4-0{margin: 4px 0px !important;}
.margin-8{margin: 8px !important;}
.margin-0-8{margin: 0px 8px !important;}
.margin-8-0{margin: 8px 0px !important;}
.margin-10{margin: 10px !important;}
.margin-0-10{margin: 0px 10px !important;}
.margin-10-0{margin: 10px 0px !important;}
.margin-15{margin: 15px!important;}
.margin-15-0{margin: 15px 0px !important;}
.margin-0-15{margin: 0px 15px !important;}
.image-view-list{padding: 2px;}

/* Padding Size */
.padding-4{padding: 4px !important;}
.padding-0-4{padding: 0px 4px !important;}
.padding-4-0{padding: 4px 0px !important;}
.padding-8{padding: 8px !important;}
.padding-0-8{padding: 0px 8px !important;}
.padding-8-0{padding: 8px 0px !important;}
.padding-10{padding: 10px !important;}
.padding-0-10{padding: 0px 10px !important;}
.padding-10-0{padding: 10px 0px !important;}
.padding-15{padding: 15px !important;}
.padding-15-0{padding: 15px 0px !important;}
.padding-0-15{padding: 0px 15px !important;}


/* Border Radius Size */
.radius-4{border-radius:4px!important}
.radius-8{border-radius:8px!important}
.radius-15{border-radius:15px!important}
.radius-20{border-radius:20px!important}
.radius-25{border-radius:25px!important}

/* Clear border radius */
.noradius{border-radius: 0px 0px 0px 0px !important;}
.noradius-top{border-top-left-radius: 0px !important; border-top-right-radius: 0px !important;}
.noradius-right{border-top-right-radius: 0px !important; border-bottom-right-radius: 0px !important;}
.noradius-bottom{border-bottom-right-radius: 0px !important; border-bottom-left-radius: 0px !important;}
.noradius-left{border-top-left-radius: 0px !important; border-bottom-left-radius: 0px !important;}


/* Clear padding */
.nopadding{padding: 0px !important;}
.nopadding-top{padding-top: 0px !important;}
.nopadding-right{padding-right: 0px !important;}
.nopadding-bottom{padding-bottom: 0px !important;}
.nopadding-left{padding-left: 0px !important;}

/* Clear margin */
.automargin{margin: auto !important;}
.nomargin{margin: 0px !important;}
.nomargin-top{margin-top: 0px !important;}
.nomargin-right{margin-right: 0px !important;}
.nomargin-bottom{margin-bottom: 0px !important;}
.nomargin-left{margin-left: 0px !important;}

/* Clear border */
.noborder{border: 0px !important;}
.noborder-top{border-top: 0px !important;}
.noborder-right{border-right: 0px !important;}
.noborder-bottom{border-bottom: 0px !important;}
.noborder-left{border-left: 0px !important;}

/* Clear Float */
.nofloat{float:none!important}
/* Clear back*/
.transparent-background{background-color: transparent !important}

.noshadow{text-shadow:none!important;box-shadow:none!important}
.cursor, .cursor:after, .cursor:before{cursor:pointer;}
.inline-block{display:inline-block!important}
.inline-table{display:table!important;width:100%}
.display-table{display:table;}
.displayblock{display:block !important;}

/* Start Switcher */
.switcher{width:50px;height:20px;position:relative;display:inline-block;margin:6px 0;padding:0 2px;font-size:12px;font-family:tahoma;background-color:#5cb85c;border-radius:25px !important;}
.switcher, .switcher *{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none;cursor:pointer; transition:all 0.2s ease-in-out !important;-moz-transition:all 0.2s ease-in-out !important;-o-transition:all 0.3s ease-in-out !important;-webkit-transition:all 0.3s ease-in-out !important}
.switcher .switch-text{text-align:left;display:block;padding:1px 2px;color:#FFF}
.switcher .switch-handle{width:18px;height:18px;background-color:#fff;display:block;border-radius:25px !important;position:absolute;top:1px; left:0%; right:1px;transition:all 0.2s ease-in-out !important;-moz-transition:all 0.2s ease-in-out !important;-o-transition:all 0.3s ease-in-out !important;-webkit-transition:all 0.3s ease-in-out !important}
.switcher.toggle{background-color:#da4453;transition:all 0.2s ease-in-out !important;-moz-transition:all 0.2s ease-in-out !important;-o-transition:all 0.3s ease-in-out !important;-webkit-transition:all 0.3s ease-in-out !important}
.switcher .switch-text.toggle{text-align:right;transition:all 0.2s ease-in-out !important;-moz-transition:all 0.2s ease-in-out !important;-o-transition:all 0.3s ease-in-out !important;-webkit-transition:all 0.3s ease-in-out !important}
.switcher .switch-handle.toggle{left:1px; right:31px;transition:all 0.2s ease-in-out !important;-moz-transition:all 0.2s ease-in-out !important;-o-transition:all 0.3s ease-in-out !important;-webkit-transition:all 0.3s ease-in-out !important}
/* End Switcher */


/* Start icon-checkbox */
.input-checkbox{
    font-family: 'icomoon' !important;
    font-size: 14px !important;
    padding: 4px 4px 4px 0px;
    margin: 0px;
    display: inline-block;
    line-height: 20px;
    color: #b10980;
    cursor: pointer;
}
.label-checkbox{line-height: 30px;}
.input-checkbox.checkbox-checked:before{content: "\ea52";}
.input-checkbox.checkbox-unchecked:before{content: "\ea53" !important;}
.input-checkbox input{display: none;}
/* End icon-checkbox */
.alerts{float:none;margin:auto;line-height:21px}

/* Start Loading */
.loading{-webkit-animation:rotate .8s linear infinite;-moz-animation:rotate .8s linear infinite;-o-animation:rotate .8s linear infinite;animation:rotate .8s linear infinite;display:block;height:30px;width:30px;margin:auto}
.loading:before{font-size:22px;line-height:30px}
.maskupload{position:fixed;background-color: rgba(0, 0, 0, 0.06);width:100%;height:100%;bottom:0;top:0;right:0;left:0;z-index:9999;}
.maskupload .loading{position:absolute;top:40%;width:100%;text-align:center;color: #000000;text-shadow: 0px 0px 1px #fff;}
.mask{position:absolute;top:0;right:0;left:0;bottom:0;height:100%;width:100%;vertical-align:middle;background-color:rgba(0, 0, 0, 0.13);z-index:9999;padding-top:30px}
.mask .success{position:absolute;top:30%;text-align:center;width:100%;background-color:rgba(45,255,0,0.16);padding:15px}
.mask .error{position:absolute;top:30%;text-align:center;width:100%;background-color:rgba(255,0,0,0.16);padding:15px}
.mask .loading{position:absolute;top:30%;width:100%;text-align:center}
@-webkit-keyframes rotate {
    from{
        transform: rotate(-1deg);
        -webkit-transform: rotate(-1deg);
        -moz-transform: rotate(-1deg);
        -o-transform: rotate(-1deg);
        -ms-transform: rotate(-1deg);
    }
    to{
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
    }
}
@-moz-keyframes rotate {
    from{
        transform: rotate(-1deg);
        -webkit-transform: rotate(-1deg);
        -moz-transform: rotate(-1deg);
        -o-transform: rotate(-1deg);
        -ms-transform: rotate(-1deg);
    }
    to{
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
    }
}
@-o-keyframes rotate {
    from{
        transform: rotate(-1deg);
        -webkit-transform: rotate(-1deg);
        -moz-transform: rotate(-1deg);
        -o-transform: rotate(-1deg);
        -ms-transform: rotate(-1deg);
    }
    to{
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
    }
}
@keyframes rotate {
    from{
        transform: rotate(-1deg);
        -webkit-transform: rotate(-1deg);
        -moz-transform: rotate(-1deg);
        -o-transform: rotate(-1deg);
        -ms-transform: rotate(-1deg);
    }
    to{
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
    }
}

.get_upload_img{position:relative;padding:8px}
.get_upload_img,.get_upload_img *{-webkit-transition:all ease-in-out0.3s!important;-o-transition:all ease-in-out0.3s!important;transition:all ease-in-out0.3s!important}
.get_upload_img img{clear:both;display:block;margin:auto;height:100%;width: 100%;}
.get_upload_img .img_list{display:inline-block;border:1px #e7e7e7 solid;border-radius:4px;overflow:hidden;position:relative;text-align:center;margin:4px;width:19%;height:150px}
.get_upload_img .img_list .buttons{display:none;position:absolute;top:0;bottom:0;width:100%;clear:both;text-align:center;background-color:rgba(0,0,0,0.48)}
.get_upload_img .img_list:hover .buttons{display:block}
.get_upload_img .img_list .buttons span{display:inline-block;color:#FFF;font-size:22px!important;margin:0 4px;border-radius:4px;cursor:pointer;margin-top:30%;background-color:#d9534f;border:1px #d43f3a solid;padding:4px;padding-top:0}
.get_upload_img .img_list .buttons span:hover{background-color:#d43e3a}
.get_upload_img .features-image img{width:42px!important;height:42px!important}
.get_upload_img .features-image .img_list{width:42px!important;height:42px!important}
.get_upload_img  .features-image .img_list .buttons span{display:inline-block;color:#FFF;border-radius:4px;cursor:pointer;font-size:inherit!important;margin:0;margin-top:18%;background-color:#d9534f;padding:1px 0}

.images_upload *{-webkit-transition:all ease-in-out 0.2s!important;-o-transition:all ease-in-out 0.2s!important;transition:all ease-in-out 0.2s!important}
.images_upload{
    position: relative;
    overflow: hidden;
    display: inline-block;
    width: 130px;
    padding: 0px;
    height: 120px;
    margin: 4px;
    border: 1px #513266 solid;
    border-radius: 2px !important;
}
.images_upload img{clear:both;display:block;margin:auto;height:100%;width: 100%;background-color: #3c8dbc;}
.images_upload .button{
    display: block;
    position: relative;
    top: 5%;
    text-align: center;
    width: 100%;
}
.images_upload:hover {
    overflow: visible;
}
.images_upload:hover > .button{
    bottom: 100%;
    top: auto;
    background-color: #00000082;
    padding: 48px 10px;
}
.images_upload .button span{
    width: 22px;
    height: 22px;
    line-height: 20px !important;
    display: inline-block !important;
}
@-webkit-keyframes bounceIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(.3);
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1.05);
    }

    70% {
        -webkit-transform: scale(.9);
    }

    100% {
        -webkit-transform: scale(1);
    }
}

@-moz-keyframes bounceIn {
    0% {
        opacity: 0;
        -moz-transform: scale(.3);
    }

    50% {
        opacity: 1;
        -moz-transform: scale(1.05);
    }

    70% {
        -moz-transform: scale(.9);
    }

    100% {
        -moz-transform: scale(1);
    }
}

@-o-keyframes bounceIn {
    0% {
        opacity: 0;
        -o-transform: scale(.3);
    }

    50% {
        opacity: 1;
        -o-transform: scale(1.05);
    }

    70% {
        -o-transform: scale(.9);
    }

    100% {
        -o-transform: scale(1);
    }
}

@keyframes bounceIn {
    0% {
        opacity: 0;
        transform: scale(.3);
    }

    50% {
        opacity: 1;
        transform: scale(1.05);
    }

    70% {
        transform: scale(.9);
    }

    100% {
        transform: scale(1);
    }
}


@-webkit-keyframes bounceOut {
    0% {
        -webkit-transform: scale(1);
    }

    25% {
        -webkit-transform: scale(.95);
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1.1);
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(.3);
    }
}

@-moz-keyframes bounceOut {
    0% {
        -moz-transform: scale(1);
    }

    25% {
        -moz-transform: scale(.95);
    }

    50% {
        opacity: 1;
        -moz-transform: scale(1.1);
    }

    100% {
        opacity: 0;
        -moz-transform: scale(.3);
    }
}

@-o-keyframes bounceOut {
    0% {
        -o-transform: scale(1);
    }

    25% {
        -o-transform: scale(.95);
    }

    50% {
        opacity: 1;
        -o-transform: scale(1.1);
    }

    100% {
        opacity: 0;
        -o-transform: scale(.3);
    }
}

@keyframes bounceOut {
    0% {
        transform: scale(1);
    }

    25% {
        transform: scale(.95);
    }

    50% {
        opacity: 1;
        transform: scale(1.1);
    }

    100% {
        opacity: 0;
        transform: scale(.3);
    }
}


.commend_menu{
    position: fixed;
    display: block;
    background-color: #dddddd;
    z-index: 999;
    overflow: hidden;
    padding: 1px;
    padding-bottom: 0px;
    color: #FFF;
    border-bottom: none;
    border-radius: 2px;
    min-width: 100px;
    -webkit-animation-duration: 0.2s;
    -moz-animation-duration: 0.2s;
    -o-animation-duration: 0.2s;
    animation-duration: 0.2s;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: bounceIn;
    -moz-animation-name: bounceIn;
    -o-animation-name: bounceIn;
    animation-name: bounceIn;
}

.commend_menu.out{
    -webkit-animation-name: bounceOut !important;
    -moz-animation-name: bounceOut !important;
    -o-animation-name: bounceOut !important;
    animation-name: bounceOut !important;
}
.commend_menu a {
    display: block;
    text-align: center;
    background-color: #f0f0f0;
    color: #5d5d5d;
    padding: 4px 8px;
    margin-bottom: 1px;
}
.commend_menu a:hover{
    color: #000;
    background-color: #f5f5f5;
}

.ui-selectable-helper {
    position: absolute;
    z-index: 100;
    border: 1px dotted black;
}
.ui-selecting{
    background-color: #d9edf7;
}
