/** lavender skin **/
[data-current-skin="lavender"] {
    background-color: #79b5ff
}
[data-current-skin="lavender"] .ha-menu > ul > li.active > *:not(ul) {
    box-shadow: inset 0px -3px 0 0px #0274ea;
}

/** coral skin **/
[data-current-skin="coral"] {
    background-color: #CC4E46;
}
[data-current-skin="yellow"] {
    background-color: #ffc107;
}
[data-current-skin="light-green"] {
    background-color: #32c787;
}
[data-current-skin="gray"] {
    background-color: #808080;
}
/*[data-current-skin="lavender"] .logo a {  }*/
/*[data-current-skin="lavender"] .ha-menu > ul > li:not(.active) > *:not(ul) {}*/
.ha-menu > ul > li.active > *:not(ul) {
    box-shadow: inset 0px -3px 0 0px #fff;
}
.form-control[readonly], fieldset[readonly] .form-control {
    pointer-events: none;
}
.fixed-inline-input .form-group{
    margin-top:0;
}

html .page-loader {
    background: #fff;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1000;
}
html .page-loader .preloader {
    width: 50px;
    position: absolute;
    left: 50%;
    margin-left: -25px;
    top: 50%;
    margin-top: -55px;
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
    -webkit-animation-duration: 3000ms;
    animation-duration: 3000ms;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
html .page-loader .preloader p {
    white-space: nowrap;
    position: relative;
    left: -9px;
    top: 22px;
    color: #CCC;
}
html.page-loader {
    display: none;
}

h1, h2, h3, h4, legend {
    font-family: 'Kanit','Raleway', sans-serif !important;
}



.mainmenu{
    font-family: 'Kanit','Raleway', sans-serif !important;
}

/*#header-2 .header-inner {*/
/*padding: 0px 0 15px;*/
/*}*/
.card.less-bottom{
    margin-bottom: 10px;
}



.input-group.fg-float{
    margin-bottom: 0;
    margin-top: 0;
}

.alert button.close {
    color: #fff;
}

/** global */

.hint-block{
    color: #f78e1e;
}
.help-block-error{
    font-size: 11px;
    text-align: left;
}
.fg-float, .fg-padding {
    /*margin-bottom: 30px;*/
    margin-bottom: 25px;
    margin-top: 10px;
}
.fg-padding .fg-label{
    font-size: 11px;
    color: #959595;
}
.fg-padding-dropdown{
    margin-top: -12px;
}

.has-success .input-group-addon {
    color: #000;
    border-color: #fff;
    background-color: #fff;
}
.has-error .input-group-addon {
    color: #000;
    border-color: #fff;
    background-color: #fff;
}

.dl-horizontal .form-group {
    margin-bottom: 0;
}
.dl-horizontal .help-block{
    margin-bottom: 0;
}
/** side menu */
.sub-menu ul > li.active > a, .sub-menu ul > li.active > a:hover{
    color: #000;
}
/** end side menu */
/** social media auth */
ul.social-auth{
    list-style: none;
    padding: 0;
}
ul.social-auth li{
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16), 0 2px 10px rgba(0, 0, 0, 0.12);
    border-radius: 2px;
}
ul.social-auth li.facebook{
    background-color: #4968AC;
}
.btn-icon-small{
    width: 35px;
    line-height: 35px;
    height: 35px;
}
/** end social media auth */


/** login **/
.login-content .lc-block h2{
    margin: 0 0 34px;
    font-size: 20px;
    border-bottom: dashed 1px #ccc;
    padding-bottom: 11px;
    color: #333;
}
.lc-block:not(.lcb-alt) {
    padding: 25px 55px 35px;
}
.lc-block{
    margin-top: 82px;
}
body.login-content::before {
    height: 100%;
    background: #119ed4;
}
/** end login **/

/** layout **/

body.blank{
    background: transparent;
    height: auto !important;
    min-height: 0;
}

body.no-container{
    background: transparent;
}
body.no-container #main{
    background: transparent;
    padding-top:70px;
}
/** end layout **/



/** ui grid */
.core-grid{}
.core-grid tr td img{
    width: 200px;
}
.core-grid tr .checkbox, .core-grid tr .radio{
    margin:2px;
}
.sortable-widget-handler{
    cursor: move;
    /*margin-top: 10px;*/
}
.action-column-row{
    text-align: right;
}
.btn-action-view, .btn-action-view:hover, .btn-action-view:focus{
    color: #666;
    background: #fff;
}
.btn-action-update, .btn-action-update:hover, .btn-action-update:focus{
    color: #666;
    background: #fff;
}
.btn-action-delete, .btn-action-delete:hover, .btn-action-delete:focus,
.btn-action-delete-selected, .btn-action-delete-selected:hover, .btn-action-delete-selected:focus{
    color: #fff;
    background-color: #f6675d;
}
a.btn-action-publish,
a.btn-action-publish:hover,
a.btn-action-publish:focus,
a.btn-action-publish-selected,
a.btn-action-publish-selected:hover,
a.btn-action-publish-selected:focus{
    color: #26660c;
    background: #fff;
}
a.btn-action-unpublish,
a.btn-action-unpublish:hover,
a.btn-action-unpublish:focus,
a.btn-action-unpublish-selected,
a.btn-action-unpublish-selected:hover,
a.btn-action-unpublish-selected:focus{
    color: #f6675d;
    background: #fff;
}


.table > thead > tr > td.danger, .table > tbody > tr > td.danger, .table > tfoot > tr > td.danger, .table > thead > tr > th.danger, .table > tbody > tr > th.danger, .table > tfoot > tr > th.danger, .table > thead > tr.danger > td, .table > tbody > tr.danger > td, .table > tfoot > tr.danger > td, .table > thead > tr.danger > th, .table > tbody > tr.danger > th, .table > tfoot > tr.danger > th{
    background-color: rgba(255, 17, 0, 0.15) !important;
}
.core-grid-action-header{
    text-align: right;
    min-width: 165px;
}
.core-grid-status-publish{
    color: #24a524;
}
.core-grid-status-unpublish{
    color: #ec000c;
}
.core-filter{margin: 7px 7px 0;}
.core-filter .form-group.action{
    margin-left: 10px;
}
.table > thead > tr > th{
    background-color: #f7f7f7;
    /*border-top: 1px solid #e0d5d5 !important;*/
}
.summary{
    text-align:right;
    margin: 20px 10px 0;
}

/** end ui grid */

/** form **/
.fileinput .fileinput-preview {
    width: 280px;
    min-height: 150px;
    height: auto;
}
.fileinput .fileinput-preview img{
    margin-top: 0;
}
/** end form */

/** warning row */
.table > thead > tr > td.warning, .table > tbody > tr > td.warning, .table > tfoot > tr > td.warning, .table > thead > tr > th.warning, .table > tbody > tr > th.warning, .table > tfoot > tr > th.warning, .table > thead > tr.warning > td, .table > tbody > tr.warning > td, .table > tfoot > tr.warning > td, .table > thead > tr.warning > th, .table > tbody > tr.warning > th, .table > tfoot > tr.warning > th {
    background-color: #ffedbb !important;
}


/** banner */
.field-banner-image .fileinput-preview{
    width: 400px;
    min-height: 170px;
}
.banner-index .core-grid tr td img{
    width: 400px;
}
/** gallery */
.field-gallery-image .fileinput-preview{
    width: 400px;
    min-height: 250px;
}
.gallery-index .core-grid tr td img{
    width: 400px;
}

.gallerybox .gallerybox-item > img {
    width: 100%;
    border-radius: 2px;
}
@media (min-width: 768px) {
    .gallerybox .gallerybox-item {
        position: relative;
    }
    .gallerybox .gallerybox-item:before {
        left: 0;
        top: 0;
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        -webkit-transform: scale3d(0, 0, 0);
        -moz-transform: scale3d(0, 0, 0);
        -ms-transform: scale3d(0, 0, 0);
        -o-transform: scale3d(0, 0, 0);
        transform: scale3d(0, 0, 0);
        -webkit-transition: all;
        -o-transition: all;
        transition: all;
        -webkit-transition-duration: 250ms;
        transition-duration: 250ms;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        backface-visibility: hidden;
        background-color: rgba(0, 0, 0, 0.1);
        z-index: 0;
        border-radius: 0;
        opacity: 0;
        filter: alpha(opacity=0);
    }
    .gallerybox .gallerybox-item:hover:before,
    .gallerybox .gallerybox-item.open:before {
        -webkit-transform: scale3d(1, 1, 1);
        -moz-transform: scale3d(1, 1, 1);
        -ms-transform: scale3d(1, 1, 1);
        -o-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
        opacity: 1;
        filter: alpha(opacity=100);
    }
}
.gallerybox .gallerybox-item:hover {
    cursor: pointer;
}
.gallerybox [data-src]:before,
.gallerybox [data-src]:after {
    content: " ";
    display: table;
}
.gallerybox [data-src]:after {
    clear: both;
}
.gallerybox [data-src]:before,
.gallerybox [data-src]:after {
    content: " ";
    display: table;
}
.gallerybox [data-src]:after {
    clear: both;
}
.gallerybox .gallerybox-item:not(.p-item) {
    position: relative;
}

/** datepicker */
.datepicker table tr td.active:active, .datepicker table tr td.active.highlighted:active, .datepicker table tr td.active.active, .datepicker table tr td.active.highlighted.active{
    background-color: #fff;
}
.datepicker-days table thead tr th.datepicker-switch, .datepicker-days table thead tr th.prev, .datepicker-days table thead tr th.next{
    color:grey;
}

.datepicker .datepicker-switch:hover,
.datepicker .prev:hover,
.datepicker .next:hover,
.datepicker tfoot tr th:hover {
    background:none !important;
}

.datepicker table tr td.active:active:hover,
.datepicker table tr td.active.highlighted:active:hover,
.datepicker table tr td.active.active:hover,
.datepicker table tr td.active.highlighted.active:hover,
.datepicker table tr td.active:active:focus,
.datepicker table tr td.active.highlighted:active:focus,
.datepicker table tr td.active.active:focus,
.datepicker table tr td.active.highlighted.active:focus,
.datepicker table tr td.active:active.focus,
.datepicker table tr td.active.highlighted:active.focus,
.datepicker table tr td.active.active.focus,
.datepicker table tr td.active.highlighted.active.focus {
    background-color: transparent;
    border-color: transparent;
}
.datepicker table tr td.day:hover,
.datepicker table tr td.focused {
    background: transparent;
}

.datepicker table tr td span.active:active,
.datepicker table tr td span.active:hover:active,
.datepicker table tr td span.active.disabled:active,
.datepicker table tr td span.active.disabled:hover:active,
.datepicker table tr td span.active.active,
.datepicker table tr td span.active:hover.active,
.datepicker table tr td span.active.disabled.active,
.datepicker table tr td span.active.disabled:hover.active {
    background-color: transparent;
}
.datepicker table tr td span.active:hover,
.datepicker table tr td span.active:hover:hover,
.datepicker table tr td span.active.disabled:hover,
.datepicker table tr td span.active.disabled:hover:hover {
    background-color: transparent;
}

.datepicker table tr td span {
    height: 42px;
    line-height: 42px;
}

.datepicker table tr td span.active:active:hover,
.datepicker table tr td span.active:hover:active:hover,
.datepicker table tr td span.active.disabled:active:hover,
.datepicker table tr td span.active.disabled:hover:active:hover,
.datepicker table tr td span.active.active:hover,
.datepicker table tr td span.active:hover.active:hover,
.datepicker table tr td span.active.disabled.active:hover,
.datepicker table tr td span.active.disabled:hover.active:hover,
.datepicker table tr td span.active:active:focus,
.datepicker table tr td span.active:hover:active:focus,
.datepicker table tr td span.active.disabled:active:focus,
.datepicker table tr td span.active.disabled:hover:active:focus,
.datepicker table tr td span.active.active:focus,
.datepicker table tr td span.active:hover.active:focus,
.datepicker table tr td span.active.disabled.active:focus,
.datepicker table tr td span.active.disabled:hover.active:focus,
.datepicker table tr td span.active:active.focus,
.datepicker table tr td span.active:hover:active.focus,
.datepicker table tr td span.active.disabled:active.focus,
.datepicker table tr td span.active.disabled:hover:active.focus,
.datepicker table tr td span.active.active.focus,
.datepicker table tr td span.active:hover.active.focus,
.datepicker table tr td span.active.disabled.active.focus,
.datepicker table tr td span.active.disabled:hover.active.focus {
    /*background-color: transparent;*/
}

.datepicker table td.active:before {
    background-color: #2196f3;
}
.datepicker table thead tr:last-child:not(:only-child) {
    background-color: #2196f3;
}
.datepicker table thead tr:first-child th {
    background-color: #2196f3;
}
.datepicker table tr td span.active:active, .datepicker table tr td span.active:hover:active, .datepicker table tr td span.active.disabled:active, .datepicker table tr td span.active.disabled:hover:active, .datepicker table tr td span.active.active, .datepicker table tr td span.active:hover.active, .datepicker table tr td span.active.disabled.active, .datepicker table tr td span.active.disabled:hover.active{
    background-color: #2196f3;
}
/** end */

/** modal **/
.modal-header h2{
    font-size: 18px;
    margin-top: 0;
}
/** end modal **/

.summary{
    border: 1px solid #EEE;
    display: inline-block;
    float: right;
    padding: 7px 30px;
    font-size: 12px;
    margin-top: 5px;
    margin-bottom: 5px;
}
.datetimepicker-widget{
    /*margin-top: -22px;*/
}
.form-inline .datetimepicker-widget{
    margin-top: 0;
}
.daterangepicker_input input.input-mini{
    padding-left: 26px;
}
.datepicker table tr td.disabled, .datepicker table tr td.disabled:hover {
    background: none;
    color: #CDCDCD;
    cursor: not-allowed;
}

.tm-with-label .tm-lb{
    display: inline-block;
    margin-left: 8px;
    vertical-align: top;
    margin-top: 10px;
}
.tm-with-label{
    padding: 0 10px;
}
a.disabled {
    color: #ccc !important;
    /*cursor: not-allowed;*/
    pointer-events: none;
}

.text-ellipsis{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.auto-height{
    height: auto !important;
    min-height: auto !important;
}

.control-label.readonly
{
    text-align: left !important;
}
.datetime-line{
    margin-top: -10px;
}
.bootstrap-tagsinput{
    width: 100%;
    margin-bottom: 0;
}

/** blog */
.blog-view{
    font-size: 15px;
    font-family: 'Kanit';
}
.blog-view .feature-image{
    margin: 15px 0;
}
.blog-view h1{
    font-size: 30px;
    margin-bottom: 17px;
}
.blog-view h2{
    font-size: 25px;
    margin-bottom: 17px;
}
.blog-view h3{
    font-size: 21px;
    margin-bottom: 17px;
}
.blog-view h4{
    font-size: 18px;
    margin-bottom: 17px;
}
.blog-view h5{
    font-size: 15px;
    margin-bottom: 17px;
}
.blog-view .date-text{
    font-size: 15px;
}

.wall-comment-list .media{
    margin-bottom: 15px;
}


/** end blog */

/** sweet alert new version */
.sweet-alert h2{
    font-size: 18px !important;
}
.sweet-alert button {
    font-size: 12px !important;
    padding: 8px 40px !important;
}

.growl-close {
    position: absolute;
    top: 0;
    right: 0;
    background: transparent;
    border: none;
    font-size: 31px;
    padding: 0;
    margin: 0 10px;
    line-height: 27px;
}

.empty-translate{
    font-size: 15px;
    color: #f1a836;
    padding: 0 2px;
    position: absolute;
    right: 10px;
    background: transparent;
}

@media(min-width:768px){
    .form-inline select.form-group {
        display: block;
    }
    .form-inline select.form-control {
        display: block;
        width: 100%;
    }
}