.custom-input-group {
    width: -webkit-fill-available;
    width: -moz-available;
    display:inline-flex;
}

.custom-input-group .input-group-addon {
padding:0px;    
}

.custom-input-group .input-group-addon input[type=checkbox] {
    width: 26px;
    height:23px;
}

.chartToSort {
    margin: 10px;
    /* text-decoration: none; */
    list-style-type: none;
    /* border: 1px solid gray; */
    /* width: auto; */
    cursor: move;
}

.chartToSort img
{
    border: 1px solid gray;
}

.sortable-chart {
    padding: 0;
    text-align: center;
}


.white {
    color: #fff;
}

/*Show table body on table hover (settings)*/
.autohidetable {
    display: none;
}

.tableContent {
    min-height: 10px;
}

/*End Show table body on table hover (settings)*/
#tableContent .for_quantity button.btn.full_width {
    width: 100%;
    max-width: 100%;
}
/* Start login text color */
.login .content .form-control {
    color: #364150 !important;
}
/* End login text color */

/* Start header button */
.tabletitle {
    display: inline-block;
}

    .tabletitle i.icon-pencil, .tabletitle i.icon-trash {
        color: white;
    }

.bulk_button .page-header.navbar .top-menu .navbar-nav > li.dropdown {
    padding: 7px 5px;
    height: auto;
}

.page-header.navbar .top-menu .navbar-nav > li.dropdown-user:last-child {
    padding: 0px;
}

.page-header.navbar .top-menu .navbar-nav > li.dropdown > .dropdown-toggle:last-child {
    background: #5b8bc6;
    padding: 0px 10px;
    height: 31px;
    line-height: 31px;
}

    .page-header.navbar .top-menu .navbar-nav > li.dropdown > .dropdown-toggle:last-child:hover {
        background: #3f70ab;
    }

.page-header.navbar .top-menu .navbar-nav > li.dropdown-user > .dropdown-toggle > .username, .page-header.navbar .top-menu .navbar-nav > li.dropdown-user > .dropdown-toggle > i {
    color: #fff;
}
/* End header button */

/* add new table and create group */
#image_spliter .portlet {
    margin-bottom: 5px;
}

.portlet.light > .portlet-title > .actions .btn-default {
    color: #fff;
    background: #67809f;
    border: transparent;
}

    .portlet.light > .portlet-title > .actions .btn-default:hover {
        background: #2b3643;
    }

.portlet.box.blue-hoki > .portlet-title > .actions .btn-default {
    min-width: 80px;
    background: #28acb8 !important;
    color: #fff;
    border: transparent;
}

    .portlet.box.blue-hoki > .portlet-title > .actions .btn-default:hover {
        background: #138f9a !important;
        border: transparent;
    }

    .portlet.box.blue-hoki > .portlet-title > .actions .btn-default i {
        color: #fff;
    }
/* End add new table and create new group */
.portlet-body.flip-scroll {
    overflow-x: auto;
}

/* Start column boxes */
.board_wrapper {
    background: #fff;
    overflow-x: auto;
}

    .board_wrapper .board_scroll {
        padding: 10px 10px;
    }

#tableContent {
    display: table;
    table-layout: fixed;
    width: 100%;
}
/* Bulk upload buttons */
.bulk_button {
    display: inline-block;
    width: 100%;
    padding-bottom: 5px;
}

    .bulk_button > div {
        float: left;
        width: 16%;
        margin-bottom: 5px;
        margin-right: 5px;
    }
/* for small boxes */
.board_wrapper .list_wrapper {
    display: table-cell;
    background: #fbfcfd;
    /*border: 1px solid #e7ecf1;*/
    /*padding: 5px;*/
    padding: 0px;
    vertical-align: top;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
}

    .board_wrapper .list_wrapper .list {
        background: #fff;
        /*margin-bottom: 5px;*/
    }

        .board_wrapper .list_wrapper .list .action_btn {
            visibility: hidden;
            display: none;
        }

    .board_wrapper .list_wrapper .list_header {
        margin-bottom: 5px;
    }

        .board_wrapper .list_wrapper .list_header .dropzone {
            border: none;
            padding: 0px;
            white-space: normal;
        }

        .board_wrapper .list_wrapper .list_header .title {
            padding: 0px 0px;
            max-width: 100%;
            /*overflow: hidden;*/
            height: 37px;
        }

            .board_wrapper .list_wrapper .list_header .title h2 {
                margin: 0px;
                font-size: 13px;
                line-height: 15px;
                font-weight: 500;
                padding: 0px 5px;
                min-height: 25px;
                line-height: 12px;
                text-align: center;
                top: 2px !important;
                position: relative;
            }

        .board_wrapper .list_wrapper .list_header .select_image {
            border: 1px solid rgba(103, 128, 159, 0.55);
            /*min-width: 25px;*/
        }

            .board_wrapper .list_wrapper .list_header .select_image .dz-default.dz-message {
                /*padding: 20px 0px;*/
            }

    .board_wrapper .list_wrapper .list_card {
        /*padding: 1px 4px;*/
        padding: 0px;
    }

        .board_wrapper .list_wrapper .list_card .action_btn {
            padding: 3px 13px;
            /* margin-left: 5px; */
            position: absolute;
            background-color: #8e44ad;
            border: 1px solid #333;
            /* border-radius: 2px; */
            /* display: none; */
            float: left;
            z-index: 111111111;
        }

        .board_wrapper .list_wrapper .list_header .title:hover .action_btn, .board_wrapper .list_wrapper .list_card:hover .action_btn {
            visibility: visible;
            margin-top: -35px;
            display: inline-flex;
        }

    .board_wrapper .list_wrapper .list_header .title:hover .action_btn {
        position: absolute;
        background: #fff;
        padding: 5px;
        border-radius: 2px !important;
        margin-left: -80px;
        margin-top: 14px;
        width: 115px;
    }

input.checked_img[type="checkbox"] {
    vertical-align: middle;
    margin: 0px;
}

.activeList {
    background: red !important;
}

.select_image .dz-default.dz-message:before {
    content: '';
    background: url(../../../global/img/upload_icon.png) no-repeat;
    display: block;
    max-width: 30px;
    height: 30px;
    background-size: 40%;
    background-position: center 50%;
    margin: 0 auto;
}

.select_image2 .dz-default.dz-message:before {
    content: '';
    background: url(../../../global/img/upload_icon_multi.png) no-repeat;
    display: block;
    max-width: 30px;
    height: 30px;
    background-size: 40%;
    background-position: center 50%;
    margin: 0 auto;
}

.select_image .dz-message span {
    display: none;
}

.select_image2 .dropzone {
    background-color: #e2e9f9 !important;
}

.img_reorder {
    margin: -2px 4px 0px 0px;
    width: 16px;
    height: 16px;
}

.btn.btn-outline.dark, button.btn.btn-info.uppercase {
    /* max-width: 97%; */
    padding: 3px;
    font-size: 13px;
    width: 100%;
    overflow: hidden;
    text-align: left;
    font-weight: bold !important;
}

/* Start sweet alert popup */
.sweet-alert.showSweetAlert.visible, .showSweetAlert[data-animation=none] {
    border: 1px solid #67809f;
}
/* End sweet alert popup    */

.login .content .register-form .form-actions {
    /*background: #6c7a8d; 
    padding: 0px 30px 30px 30px;
    margin-bottom: -30px;*/
    padding: 0px 30px 30px 30px;
    margin-bottom: -30px;
}

.login .content .form-actions .btn-default {
    background-color: #364150;
    color: #fff;
}

    .login .content .form-actions .btn-default:hover {
        background-color: #242b34;
        color: #fff;
    }
/* End column boxes */

/* 
 Start group images 
========================== */
.group_images {
    margin-top: 15px;
}

    .group_images .expand_image {
        padding: 0px 8px;
        transition: width 0.1s;
        -webkit-transition: width 0.1s;
        -o-transition: width 0.1s;
        -moz-transition: width 0.1s;
    }

.group_images {
}

    .group_images .image_outer {
    }

#pinBoot {
    position: relative;
    max-width: 100%;
    width: 100%;
}

.white-panel img {
    width: 100%;
    max-width: 100%;
    height: auto;
}

.white-panel {
    position: absolute;
}

.group_images .img {
    /*column-gap: 15px;*/
}

.group_images .chart {
    margin-bottom: 15px !important;
    display: inline-block;
    /*column-break-inside: avoid;*/
}
/* 
 Start group image popup
========================== */
.expanded_img {
    padding: 0px 8px;
}

    .expanded_img .image_outer {
        padding-top: 15px;
    }

        .expanded_img .image_outer .cancle_btn {
            background: transparent !important;
            color: #333;
            font-size: 15px !important;
            line-height: 21px !important;
            border: none;
            margin: 0px !important;
            text-align: center;
            max-width: 20px;
            float: right;
            right: 17px;
        }

        .expanded_img .image_outer .right_side {
            margin-top: 24px;
        }
/* End group image popup */
/* 
 End group images 
========================== */


/* Start use input both image and group page*/
.row.labels {
    margin: 0px;
}

.chart {

}
    .chart img {
        margin: 5px 0px !important;
        border: 2px solid #cbcbcb;
    }
.expanded_img img {
    width: 100%;
    height: 90%;
}

.border_layout {
    width: 100%;
    border: 1px solid #cccccc;
    display: inline-block;
    margin: 10px 0px;
}

    .border_layout .labelvalue {
        margin: 0px;
        font-size: 16px;
        font-weight: 300;
        line-height: 20px;
        color: #333;
    }

        .border_layout .labelvalue label {
            margin: 4px 0px;
        }

            .border_layout .labelvalue label.val {
                font-weight: 300;
                margin-left: 5px;
            }

._label {
    margin: 0px;
}

    ._label label {
        margin: 3px 0px;
        font-size: 12px;
        font-weight: bold;
        line-height: 16px;
        color: #333;
    }

    ._label input {
        height: 25px;
        padding: 6px;
        font-size: 12px;
        line-height: 15px;
        color: #333;
        border-radius: 2px;
    }

    ._label button {
        width: 100px;
        height: 25px;
        padding: 0px;
        background: #ebebeb;
        margin: 15px 0px;
        font-size: 12px;
        line-height: 16px;
        border: 1px solid #adadad;
        border-radius: 4px;
    }

        ._label button:hover {
            background: #d7d7d7;
        }
/* End use input both image and group page*/

/* Start single image popup */
.single_image {
}

.table_property {
    display: table !important;
}

    .table_property._label .form-group {
        display: inline-block;
    }

    .table_property._label input {
        max-width: 100%;
        width: 100% !important;
    }
/* End single image popup */

/* right side color palet and text box */
.col-sm-3 .form-inline .input-group span input#txtColor {
    border-bottom-right-radius: 3px;
    border-top-right-radius: 3px;
    padding: 0px;
    width: 50px;
}

.colorbtnpanel {
    margin-bottom: 10px;
    display: inline-block;
}

    .colorbtnpanel .colorbtn {
        overflow: hidden;
        height: auto;
        max-width: 80px;
        min-height: 23px;
        float: left;
        display: block;
        margin: 10px 10px 0px 0px;
        border: 1px solid #869ab3;
    }

        .colorbtnpanel .colorbtn .pull-right {
            background: rgba(255, 255, 255, 0.59);
            border: none;
            color: #333;
        }

        .colorbtnpanel .colorbtn h3 {
            font-size: 15px;
            line-height: 15px;
            margin: 4px;
            text-align: left;
            white-space: normal;
            word-wrap: break-word;
            /* text-shadow: 1px 1px 0px #fff; */
            font-weight: bold;
        }
/**** Start homepage iframe ***/
#frame {
    height: 92%;
    width: 100%;
    border: 0px;
    border-right: 1px solid #e7ecf1;
    margin-top: 8px;
}
/* dropzone box*/
#dropzoneBulkUpload {
    display: inline-table;
    width: 100%;
}
/**** End homepage iframe ***/

/*table {float: left; margin: 20px; font-size: 14px; font-family: tahoma, arial, sans-serif;}*/
/*table.sorting-table {cursor: ns-resize; box-shadow: 0 0 16px rgba(0, 0, 0, 0.2);}*/
/*table thead th {background-color: #ccc; padding: 5px 8px;}*/
/*table td {background-color: #ddd; padding: 5px 8px;}*/
table tr.sorting-row td {
    background-color: #ccc;
}

table td.sorter {
    background-color: #f80;
    width: 10px;
    cursor: ns-resize;
}

.sort-handler {
    float: right;
    background-color: #f80;
    width: 14px;
    height: 14px;
    margin: 2px 0 0 6px;
    cursor: ns-resize;
}

table.sorting-table tbody tr:not(.sorting-row) td {
    opacity: 0.2;
}

/* some styling for table1 */
/*table#table1 tr.sorting-row td {background-color: #ccc;}
    table#table1.sorting-table {cursor: ns-resize; box-shadow: none; outline: 1px solid #333;}
    table#table1.sorting-table tbody tr:not(.sorting-row) td {opacity: 1; color: #bbb; text-shadow: 0 1px 0 rgba(255, 255, 255, 1);}*/


.portlet.box.blue-hoki > .portlet-title {
    background: #2b1b17;
}

body .portletImage:first-child button {
    border-top: 1px solid #abb9ca;
}

body .portletImage button {
    text-align: center !important;
    border-top: none;
    border-color: #abb9ca !important;
}

@media (min-width: 992px) {
    .page-sidebar-closed .page-content-wrapper .page-content {
        margin-left: 0px !important;
    }
}

@media (max-width: 1320px) {
    /*.board_wrapper .board_scroll .btn.btn-outline.dark, button.btn.btn-info.uppercase {
        width: 75%;
    }*/
    .board_wrapper .board_scroll .btn.btn-outline.dark, button.btn.btn-info.uppercase {
        width: 100%;
    }
}
/*@media (max-width: 991px){
    .group_images .chart img {
        height: 300px;
    }
}*/
@media (max-width: 992px) {
    /*group page*/
    .expanded_img .image_outer .form-inline {
        margin-top: 15px;
        width: 34%;
    }

    .form-inline button {
        margin-top: 10px;
    }
}

@media (max-width: 767px) and (min-width: 580px) {
    .single_image .col-sm-3 .form-inline .input-group {
        width: 80%;
        float: left;
    }
}

@media (max-width: 767px) {
    .single_image .col-sm-3 .form-inline {
        margin: 10px 0px;
        display: inline-block;
        width: 100%;
    }

    .page-header-inner .logo {
        font-size: 12px !important;
    }

    .page-header-inner .header_txt {
        font-size: 10px;
        padding: 3px 0px;
    }
}

@media (max-width: 580px) {
    /*group page*/
    .expanded_img .image_outer .form-inline {
        width: 60%;
    }
}
/*@media (min-width: 920px){
   .expanded_img .chart img,
   .single_image .chart img {
       width: auto !important;
   }
}*/
@media (min-width: 640px) {
    .expanded_img .chart img,
    .single_image .chart img {
        max-height: 3000px;
    }

    .single_image_window {
        /*height: 90vh !important;*/
    }
}
/*@media screen and (min-height: 568px){
    .expanded_img .chart img,
   .single_image .chart img {
       height: 60vh;
       width: auto !important;
   }
}*/

@media (max-width: 480px) {
    .board_wrapper .list_wrapper .list_card:hover .action_btn {
        margin-left: -50px;
    }
}

@media (min-width: 320px) {
    .single_image_window {
        /*height: 90vh !important;*/
    }
}

#coltitle {
    font-size: 9pt !important;
}

#forScroll {
    min-height: 0px !important;
    margin-bottom: 0px !important;
}

    #forScroll:empty {
        display: none;
    }

.portlet.light > .portlet-title > .actions {
    padding: 0px 0 6px !important;
}

.portlet.light {
    padding: 5px 20px 15px !important;
}

.spacer {
    margin-top: 17px;
    display: block;
    margin-bottom: 13px;
    height: 5px;
    background-color: #c9c9c9;
}

.imageTitle {
    text-align: center;
    font-size: 13pt;
    font-weight: 500;
    text-decoration: underline;
}