﻿.input-validation-error {
    border: 1px solid red;
}

.field-validation-error {
    color: red;
    font-size: 13px;
}

/* MarPre Added | DropZone style */
.dz-box {
    border: 2px dashed rgba(0, 0, 0, 0.125);
    border-radius: 0.25rem;
    margin: 0 auto;
}

/*clear the style that the dropzone apply to the form*/
form.dropzone {
    border: 0;
    border-radius: 0;
    margin: 0;
    padding: 0;
    background: none;
}

#dropzoneForm {
    border: 1px dashed #bababa;
}

/*Gantt*/
.gantt {
    display: grid;
    border: 0;
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
}

    .gantt.is-scrollable {
        overflow-y: auto;
        max-height: 350px;
    }

.d-none {
    display: none !important;
}

.gantt__row {
    display: grid;
    grid-template-columns: 150px 1fr;
    background-color: #fff;
}

    .gantt__row:nth-child(odd) {
        background-color: #f5f5f5;
    }

        .gantt__row:nth-child(odd) .gantt__row-first {
            background-color: #f5f5f5;
        }

    .gantt__row:nth-child(3) .gantt__row-bars {
        border-top: 0;
    }

    .gantt__row:nth-child(3) .gantt__row-first {
        border-top: 0;
    }

.gantt__row--empty {
    background-color: #ffd6d2 !important;
    z-index: 1;
}

    .gantt__row--empty .gantt__row-first {
        border-width: 1px 1px 0 0;
    }

.gantt__row--lines {
    position: absolute;
    height: 100vh;
    width: 100%;
    background-color: transparent;
    /*grid-template-columns: 150px repeat(6, 1fr);*/
}

    .gantt__row--lines span {
        display: block;
        border-right: 1px solid rgba(0, 0, 0, 0.1);
    }

        .gantt__row--lines span.marker {
            background-color: rgba(10, 52, 68, 0.13);
            z-index: 2;
        }

    .gantt__row--lines:after {
        grid-row: 1;
        grid-column: 0;
        background-color: #1688b345;
        z-index: 2;
        height: 100%;
    }

.gantt__row--months {
    color: #fff;
    background-color: #2C333E !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    /*grid-template-columns: 150px repeat(6, 1fr);*/
}

    .gantt__row--months .gantt__row-first {
        border-top: 0 !important;
        background-color: #2C333E !important;
    }

    .gantt__row--months span {
        text-align: center;
        font-size: 13px;
        align-self: center;
        font-weight: bold;
        padding: 20px 0;
    }

.gantt__row-first {
    background-color: #fff;
    border-width: 1px 0 0 0;
    border-color: rgba(0, 0, 0, 0.1);
    border-style: solid;
    padding: 15px 0;
    font-size: 13px;
    font-weight: bold;
    text-align: center;
}

.gantt__row-bars {
    list-style: none;
    display: grid;
    padding: 9px 0;
    margin: 0;
    /*grid-template-columns: repeat(6, 1fr);*/
    grid-gap: 8px 0;
    border-top: 1px solid rgba(221, 221, 221, 0.8);
}

    .gantt__row-bars li {
        font-weight: 500;
        text-align: left;
        font-size: 14px;
        min-height: 15px;
        background-color: #55de84;
        padding: 5px 12px;
        color: #fff;
        overflow: hidden;
        position: relative;
        cursor: pointer;
        border-radius: 20px;
    }

        .gantt__row-bars li.stripes {
            background-image: repeating-linear-gradient( 45deg, transparent, transparent 5px, rgba(255, 255, 255, 0.1) 5px, rgba(255, 255, 255, 0.1) 12px );
        }

        .gantt__row-bars li:before,
        .gantt__row-bars li:after {
            content: "";
            height: 100%;
            top: 0;
            z-index: 4;
            position: absolute;
            background-color: rgba(0, 0, 0, 0.3);
        }

        .gantt__row-bars li:before {
            left: 0;
        }

        .gantt__row-bars li:after {
            right: 0;
        }


.numberCircle {
    border-radius: 0%;
    width: 12px;
    height: 12px;
    padding: 4px;
    background: #fff;
    border: 1px solid #f5f5f5;
    color: #666;
    text-align: center;
    font: 12px Arial, sans-serif;
    font-weight: bold;
}

    .numberCircle.success {
        background: #28C33B;
    }

    .numberCircle.warning {
        background: #FFBE2E;
    }

    .numberCircle.danger {
        background: #FF635B;
    }

.videocardhome {
    padding: 15px !important;
    max-height: 330px;
    text-align: center;
}

    .videocardhome img {
        max-height: 260px;
        display: inline;
    }

.boxhome {
    min-height: 393px;
    max-height: 393px;
}


.table.dtGrouped.has--actions tr th:last-child, .table.dtGrouped.has--actions tr td:last-child {
    text-align: right;
}

.table.dtGrouped thead {
    background: #EFF3F7;
    font-size: 13px;
    font-weight: 600;
    color: #3B4453;
}

.table.dtGrouped tbody tr td {
    padding: 12px;
    vertical-align: middle;
    position: relative;
}

    .table.dtGrouped thead tr th:focus, .table.dtGrouped tbody tr td:focus {
        outline: none;
    }

.table.dtGrouped tbody > tr > td {
    text-transform: none;
    font-size: 15px;
    color: #3B4453;
}

.table.dtGrouped > thead > tr > th {
    border-bottom: 1px solid #EFF3F7;
    vertical-align: middle;
    padding: 12px;
    font-size: 13px;
    font-weight: 600;
    position: relative;
}

.table.dtGrouped .btn-primary {
    box-shadow: none;
}

.table.dtGrouped.collapsed tbody tr:not(.child) td:first-child:after {
    content: "+";
    position: absolute;
    background: #3B4453;
    left: -20px;
    top: 50%;
    transform: translate(0,-50%);
    transform: translate(0,-50%);
    padding: 0 5px;
    border-radius: 100%;
    color: #ffffff;
    width: 19px;
    height: 20px;
    font-weight: bold;
}

.table.dtGrouped td.child {
    text-align: left !important;
    padding: 10px 0 30px;
}

    .table.dtGrouped td.child .btn-primary {
        padding: 8px 20px;
    }

.table.dtGrouped .dtr-title {
    font-weight: bold;
    display: inline-block;
    width: 100%;
    margin-top: 10px;
}

.table.dtGrouped td:last-child a + a {
    margin-left: 10px;
}

.table.dtGrouped .sorting_asc:before {
    position: absolute;
    content: "";
    width: 10px;
    height: 10px;
    background-image: url(/assets/icons/icon-sorting-asc.svg);
    background-repeat: no-repeat;
    background-size: 7px;
    right: 0;
    top: 50%;
    transform: translate(0,-50%);
}

.table.dtGrouped .sorting_desc:before {
    position: absolute;
    content: "";
    width: 10px;
    height: 10px;
    background-image: url(/assets/icons/icon-sorting-asc.svg);
    background-repeat: no-repeat;
    background-size: 7px;
    right: 0;
    top: 50%;
    transform: translate(0,-50%);
}

.table.dtGrouped .control__indicator {
    position: relative;
}

.table.dtGrouped label.control--checkbox {
    padding: 0;
    margin: 0;
}

.table.dtGrouped-simple {
    border: 1px solid transparent;
    margin: 20px 0 0;
}

    .table.dtGrouped-simple thead {
        background: #EFF3F7;
        font-size: 13px;
        font-weight: 600;
        color: #3B4453;
    }

    .table.dtGrouped-simple tbody tr td {
        padding: 12px;
        vertical-align: middle;
        position: relative;
    }

        .table.dtGrouped-simple thead tr th:focus, .table.dtGrouped-simple tbody tr td:focus {
            outline: none;
        }

    .table.dtGrouped-simple tbody > tr > td {
        text-transform: none;
        font-size: 15px;
        color: #3B4453;
    }

    .table.dtGrouped-simple > thead > tr > th {
        border-bottom: 1px solid #EFF3F7;
        vertical-align: middle;
        padding: 12px;
        font-size: 13px;
        font-weight: 600;
        position: relative;
    }

    .table.dtGrouped-simple .btn-primary {
        box-shadow: none;
    }

    .table.dtGrouped-simple.collapsed tbody tr:not(.child) td:first-child:after {
        content: "+";
        position: absolute;
        background: #3B4453;
        left: -20px;
        top: 50%;
        transform: translate(0,-50%);
        transform: translate(0,-50%);
        padding: 0 5px;
        border-radius: 100%;
        color: #ffffff;
        width: 19px;
        height: 20px;
        font-weight: bold;
    }

    .table.dtGrouped-simple td.child {
        text-align: left !important;
        padding: 10px 0 30px;
    }

        .table.dtGrouped-simple td.child .btn-primary {
            padding: 8px 20px;
        }

    .table.dtGrouped-simple .dtr-title {
        font-weight: bold;
        display: inline-block;
        width: 100%;
        margin-top: 10px;
    }

    .table.dtGrouped-simple td:last-child a + a {
        margin-left: 10px;
    }

    .table.dtGrouped-simple .sorting_asc:before {
        position: absolute;
        content: "";
        width: 10px;
        height: 10px;
        background-image: url(/assets/icons/icon-sorting-asc.svg);
        background-repeat: no-repeat;
        background-size: 7px;
        right: 0;
        top: 50%;
        transform: translate(0,-50%);
    }

    .table.dtGrouped-simple .sorting_desc:before {
        position: absolute;
        content: "";
        width: 10px;
        height: 10px;
        background-image: url(/assets/icons/icon-sorting-asc.svg);
        background-repeat: no-repeat;
        background-size: 7px;
        right: 0;
        top: 50%;
        transform: translate(0,-50%);
    }

    .table.dtGrouped-simple .control__indicator {
        position: relative;
    }

    .table.dtGrouped-simple label.control--checkbox {
        padding: 0;
        margin: 0;
    }

    .table.dtGrouped td.child, .table.dtGrouped-simple td.child {
        padding: 10px;
        background: #f5f5f5;
    }

.table.dtdocument.has--actions tr th:last-child, .table.dtdocument.has--actions tr td:last-child {
    text-align: right;
}

.table.dtdocument thead {
    background: #EFF3F7;
    font-size: 13px;
    font-weight: 600;
    color: #3B4453;
}

.table.dtdocument tbody tr td {
    padding: 12px;
    vertical-align: middle;
    position: relative;
}

    .table.dtdocument thead tr th:focus, .table.dtdocument tbody tr td:focus {
        outline: none;
    }

.table.dtdocument tbody > tr > td {
    text-transform: none;
    font-size: 15px;
    color: #3B4453;
}

.table.dtdocument > thead > tr > th {
    border-bottom: 1px solid #EFF3F7;
    vertical-align: middle;
    padding: 12px;
    font-size: 13px;
    font-weight: 600;
    position: relative;
}

.table.dtdocument .btn-primary {
    box-shadow: none;
}

.table.dtdocument.collapsed tbody tr:not(.child) td:first-child:after {
    content: "+";
    position: absolute;
    background: #3B4453;
    left: -20px;
    top: 50%;
    transform: translate(0,-50%);
    transform: translate(0,-50%);
    padding: 0 5px;
    border-radius: 100%;
    color: #ffffff;
    width: 19px;
    height: 20px;
    font-weight: bold;
}

.table.dtdocument td.child {
    text-align: left !important;
    padding: 10px 0 30px;
}

    .table.dtdocument td.child .btn-primary {
        padding: 8px 20px;
    }

.table.dtdocument .dtr-title {
    font-weight: bold;
    display: inline-block;
    width: 100%;
    margin-top: 10px;
}

.table.dtdocument td:last-child a + a {
    margin-left: 10px;
}

.table.dtdocument .sorting_asc:before {
    position: absolute;
    content: "";
    width: 10px;
    height: 10px;
    background-image: url(/assets/icons/icon-sorting-asc.svg);
    background-repeat: no-repeat;
    background-size: 7px;
    right: 0;
    top: 50%;
    transform: translate(0,-50%);
}

.table.dtdocument .sorting_desc:before {
    position: absolute;
    content: "";
    width: 10px;
    height: 10px;
    background-image: url(/assets/icons/icon-sorting-asc.svg);
    background-repeat: no-repeat;
    background-size: 7px;
    right: 0;
    top: 50%;
    transform: translate(0,-50%);
}

.table.dtdocument .control__indicator {
    position: relative;
}

.table.dtdocument label.control--checkbox {
    padding: 0;
    margin: 0;
}

.table.dtdocument-simple {
    border: 1px solid transparent;
    margin: 20px 0 0;
}

    .table.dtdocument-simple thead {
        background: #EFF3F7;
        font-size: 13px;
        font-weight: 600;
        color: #3B4453;
    }

    .table.dtdocument-simple tbody tr td {
        padding: 12px;
        vertical-align: middle;
        position: relative;
    }

        .table.dtdocument-simple thead tr th:focus, .table.dtdocument-simple tbody tr td:focus {
            outline: none;
        }

    .table.dtdocument-simple tbody > tr > td {
        text-transform: none;
        font-size: 15px;
        color: #3B4453;
    }

    .table.dtdocument-simple > thead > tr > th {
        border-bottom: 1px solid #EFF3F7;
        vertical-align: middle;
        padding: 12px;
        font-size: 13px;
        font-weight: 600;
        position: relative;
    }

    .table.dtdocument-simple .btn-primary {
        box-shadow: none;
    }

    .table.dtdocument-simple.collapsed tbody tr:not(.child) td:first-child:after {
        content: "+";
        position: absolute;
        background: #3B4453;
        left: -20px;
        top: 50%;
        transform: translate(0,-50%);
        transform: translate(0,-50%);
        padding: 0 5px;
        border-radius: 100%;
        color: #ffffff;
        width: 19px;
        height: 20px;
        font-weight: bold;
    }

    .table.dtdocument-simple td.child {
        text-align: left !important;
        padding: 10px 0 30px;
    }

        .table.dtdocument-simple td.child .btn-primary {
            padding: 8px 20px;
        }

    .table.dtdocument-simple .dtr-title {
        font-weight: bold;
        display: inline-block;
        width: 100%;
        margin-top: 10px;
    }

    .table.dtdocument-simple td:last-child a + a {
        margin-left: 10px;
    }

    .table.dtdocument-simple .sorting_asc:before {
        position: absolute;
        content: "";
        width: 10px;
        height: 10px;
        background-image: url(/assets/icons/icon-sorting-asc.svg);
        background-repeat: no-repeat;
        background-size: 7px;
        right: 0;
        top: 50%;
        transform: translate(0,-50%);
    }

    .table.dtdocument-simple .sorting_desc:before {
        position: absolute;
        content: "";
        width: 10px;
        height: 10px;
        background-image: url(/assets/icons/icon-sorting-asc.svg);
        background-repeat: no-repeat;
        background-size: 7px;
        right: 0;
        top: 50%;
        transform: translate(0,-50%);
    }

    .table.dtdocument-simple .control__indicator {
        position: relative;
    }

    .table.dtdocument-simple label.control--checkbox {
        padding: 0;
        margin: 0;
    }

    .table.dtdocument td.child, .table.dtdocument-simple td.child {
        padding: 10px;
        background: #f5f5f5;
    }

.dtrg-group {
    background-color: #bfbfbf;
    text-align: left !important;
}

    .dtrg-group > td {
        background-color: #bfbfbf;
        text-align: left !important;
    }

.dataTables_filter {
    width: 40%;
    float: right;
    text-align: right;
    margin-top: 10px;
}

    .dataTables_filter input {
        margin-left: 10px;
        height: 20px;
        width: 194px !important;
    }

.badge-success {
    background-color: #28C33B !important;
}

.badge-warning {
    background-color: #FFBE2E !important;
}

.badge-danger {
    background-color: #FF635B !important;
}

.navbar.navbar.navbar-subnav .navbar-left .liWithImg > a {
    padding-left: 80px;
    position: relative;
}

    .liWithImg > a > img {
        position: absolute;
        top: 55%;
        left: 30px;
        transform: translate(0,-50%);
        height: 35px;
        width:35px;
        object-position:center center;
        object-fit:contain;
    }