#TinyWhiteSpace {
    width: 100%;
    background-color: white;
    color: white;
    height: 0.1em;
    text-align: center;
    font-size: 18px;
    padding: 0px;
}

.avatar {
    vertical-align: middle;
    width: 50px;
    height: 50px;
    border-radius: 50%;
}

.avatar2 {
    vertical-align: middle;
    width: 75px;
    height: 75px;
    border-radius: 150%;
}

.avatar3 {
    vertical-align: middle;
    width: 100px;
    height: 100px;
    border-radius: 150%;
}

.ImageGallery {
    max-width: 67px;
    max-height: 72px;
}

.ImageSmall {
    max-width: 120px;
    max-height: 120px;
}

.ImageIcon16 {
    max-width: 16px;
    max-height: 16px;
}

.ImageIcon20 {
    max-width: 20px;
    max-height: 20px;
}

.ImageIcon20b {
    vertical-align: middle;
    max-width: 20px;
    max-height: 20px;
    border-radius: 60%;
}

.ImageIcon32 {
    max-width: 32px;
    max-height: 32px;
}

.ImageIcon48 {
    max-width: 48px;
    max-height: 48px;
}

.ImageIcon96 {
    max-width: 96px;
    max-height: 96px;
}

.ImageIcon120 {
    max-width: 120px;
    max-height: 120px;
}

.img.user {
    vertical-align: middle;
    max-width: 20px;
    max-height: 20px;
    border-radius: 60%;
    content: url();
    /*src:url(Images/1.jpg)*/
}

.hfSubMenu {
    overflow: hidden;
    background-color: white; /*#f2f2f2; black*/
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-size: xx-small;
    text-align: center;
}

    .hfSubMenu a {
        color: black;
        text-align: center;
        padding: 10px 12px;
        text-decoration: none;
        font-size: 15px;
        transition: 0.3s;
        display: inline-block;
    }

        .hfSubMenu a:hover {
            background-color: black; /*white;*/
            color: #fdbb00;
        }

        .hfSubMenu a.active {
            background-color: #4CAF50; /*Green*/
            color: white;
        }

.hfMenuSep {
    color: #f8b600;
    text-align: center;
    text-decoration: none;
    font-size: 15px;
    font-weight: bold;
    transition: 0.3s;
    height: 100px;
}

img.shaker:hover {
    /* Start the shake animation and make the animation last for 0.5 seconds */
    animation: shake 0.5s;
    /* When the animation is finished, start again */
    animation-iteration-count: infinite;
}

img.flipper:hover {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}


.hfBadge {
    border-radius: 50%;
    padding: 5px;
    width: 100px;
    height: 100px;
    color: white;
    font-size: small;
}

.hf-bg-primary {
    background: #7460ee;
}

.hf-bg-secondary {
    background: #6c757d;
}

.hf-bg-success {
    background: #28b779;
}

.hf-bg-info {
    background: #2255a4;
}

.hf-bg-danger {
    background: #da542e;
}

.hf-bg-warning {
    background: #ffb848;
}

.hf-bg-light {
    background: #f8f9fa;
    color: black;
}

.hf-bg-dark {
    background: #343a40;
}

.tb-black {
    border: 1px solid black;
    border-left: 4px solid black;
    /*margin-top:2px;*/
}

.tb-border-img {
    border-bottom: 1px solid black;
    border-left: 4px solid black;
    border-top: 1px solid black;
}

.tb-border-img-success {
    border-bottom: 1px solid #28b779;
    border-left: 4px solid #28b779;
    border-top: 1px solid #28b779;
}

.tb-border-img-danger {
    border-bottom: 1px solid #da542e;
    border-left: 4px solid #da542e;
    border-top: 1px solid #da542e;
}

.tb-border-img-info {
    border-bottom: 1px solid #2255a4;
    border-left: 4px solid #2255a4;
    border-top: 1px solid #2255a4;
}

.tb-border-img-primary {
    border-bottom: 1px solid #7460ee;
    border-left: 4px solid #7460ee;
    border-top: 1px solid #7460ee;
}

.tb-border-img-secondary {
    border-bottom: 1px solid #6c757d;
    border-left: 4px solid #6c757d;
    border-top: 1px solid #6c757d;
}

.tb-border-img-warning {
    border-bottom: 1px solid #ffb848;
    border-left: 4px solid #ffb848;
    border-top: 1px solid #ffb848;
}

.tb-border-img-purple {
    border-bottom: 1px solid purple;
    border-left: 4px solid purple;
    border-top: 1px solid purple;
}

.tb-border-inputs {
    border-bottom: 1px solid black;
    border-right: 1px solid black;
    border-top: 1px solid black;
}

.tb-success {
    border: 1px solid #28b779;
    border-left: 4px solid #28b779;
}

.tb-danger {
    border: 1px solid #da542e;
    border-left: 4px solid #da542e; /*#28b779*/
}

.tb-info {
    border: 1px solid #2255a4;
    border-left: 4px solid #2255a4;
}

.tb-primary {
    border: 1px solid #7460ee;
    border-left: 4px solid #7460ee;
}

.tb-secondary {
    border: 1px solid #6c757d;
    border-left: 4px solid #6c757d;
}

.tb-warning {
    border: 1px solid #ffb848;
    border-left: 4px solid #ffb848;
}

.tb-light {
    border: 1px solid #f8f9fa;
    border-left: 4px solid #f8f9fa;
}

.tb-dark {
    border: 1px solid #343a40;
    border-left: 4px solid #343a40;
}

.tb-purple {
    border: 1px solid purple;
    border-left: 4px solid purple;
}

.text-black {
    color: black;
}

.text-red {
    color: red;
}

.asterix {
    color: red;
    font: bolder;
    /*background-color: red;*/
}

table, th, td {
    background-color: #fff;
    border: 1px solid #ddd;
    border-collapse: collapse;
    table-layout: fixed;
    width: 100%;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-size: small;
    
    /*font-size:13px;*/
}

th {
    text-align: left;
    padding: 8px;
    background-color: Black;
    color: white;
    font-size: small;
    
}

td {
    /*text-align: left;
    padding: 3px;*/
}

table tr:nth-child(odd) td {
    background-color: #f2f2f2; /*#28b779;*/ /*#f2f2f2*/
    color: orangered;
}

table tr:hover td {
    background-color: #f2f2f2;
    font-weight: 900;
}

.table-bordered th,
.table-bordered td {
    border: 1px solid #ddd !important;
}

.table-bordered {
    border: 1px solid #ddd;
}

/*dl-horizontal*/
@media (min-width: 768px) {
    .dl-horizontal dt {
        float: left;
        width: 160px;
        overflow: hidden;
        clear: left;
        text-align: right;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dl-horizontal dd {
        margin-left: 155px;
    }

        .dl-horizontal dd:before,
        .dl-horizontal dd:after {
            display: table;
            content: " ";
        }

        .dl-horizontal dd:after {
            clear: both;
        }

        .dl-horizontal dd:before,
        .dl-horizontal dd:after {
            display: table;
            content: " ";
        }

        .dl-horizontal dd:after {
            clear: both;
        }
}




.yalert {
    padding: 20px;
    color: white;
}

.yalert-danger {
    background-color: #f44336;
}

.yalert-success {
    background-color: #28b779;
}

.yalert-info {
    background-color: #2962FF;
}


.closebtn {
    margin-left: 15px;
    color: white;
    font-weight: bold;
    float: right;
    font-size: 22px;
    line-height: 20px;
    cursor: pointer;
    transition: 0.3s;
}

    .closebtn:hover {
        color: black;
    }

/*.form-control {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #4F5467;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #e9ecef;
    border-radius: 2px;
    transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   
}*/
.text-sm .content-header {
    padding: 10px .5rem;
}

    .text-sm .content-header h1 {
        font-size: 1.5rem;
    }

.text-sm .form-control {
    font-size: .875rem;
}

.input-sm {
    height: calc(1.875rem + 2px);
}

.skin-1 {
    background-image: url("img/skin/skin1.jpg");
    background-color: #cccccc;
    /* height: 550px;*/
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}

.skin-2 {
    background-image: url("img/skin/skin2.jpg");
    background-color: #cccccc;
    /* height: 550px;*/
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}

.skin-3 {
    background-image: url("img/skin/skin3.jpg");
    background-color: #cccccc;
    /*height: 550px;*/
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}

.skin-4 {
    background-image: url("img/skin/skin4.jpg");
    background-color: #cccccc;
    /*height: 550px;*/
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}


.ytables {
    table-layout: fixed;
    width: 100%;
    white-space: nowrap;
}

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

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



td-background-success {
    background-color: green;
    color: white;
}

#customers {
    font-family: Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

    #customers td, #customers th {
        /*border: 1px solid #ddd;*/
        /*padding: 8px;*/
    }

    /*#customers tr:nth-child(even) {
        background-color: #f2f2f2;
    }*/

    /*#customers tr:hover {
        background-color: red;*//* #ddd;*/
        /*font-weight:900;
    }*/

    #customers tr:hover td {
       /* background-color: white;*/
        color:black;
        font-weight: 900;
    }

    #customers th {
       /* padding-top: 12px;
        padding-bottom: 12px;*/
        text-align: left;
        background-color:#4CAF50; /*#4CAF50;*/
        color: white;
    }

.hf-color-primary {
    color: #7460ee;
}

.hf-color-secondary {
    color: #6c757d;
}

.hf-color-success {
    color: #28b779;
}

.hf-color-info {
    color: #2255a4;
}

.hf-color-danger {
    color: #da542e;
}

.hf-color-warning {
    color: #ffb848;
}

.hf-color-light {
    background: #f8f9fa;
    color: black;
}