﻿body {
    padding-top: 60px;
    padding-bottom: 20px;
    color: #181D27;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

.text-grey {
    color: rgba(129, 119, 119, 0.9);
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea,
.bootstrap-select {
    max-width: 280px;
}

/*media query mixin*/
.disclaimer {
    font-style: italic;
    font-size: 14px !important;
}

.navbar-maintenance {
    background-color: #444444;
}

.toggle {
    display: block;
}

/* hide when using bootstrap-toggle */
input[data-toggle=toggle] {
    display: none;
}

#logo {
    float: right;
    padding: 10px;
}

h1 {
    margin-top: -15px;
}

.modal-title {
    display: inline;
}

.dataTables_wrapper.container-fluid.dt-bootstrap4 {
    padding-left: 0px;
    padding-right: 0px;
}

.form-helptext .input-group-text {
    background: none;
    border: none;
}

.form-helptext .fa {
    font-size: large;
    font: normal normal normal 20px/1 FontAwesome;
}

.dataTables_length {
    float: left;
}

div.dataTables_wrapper div.dataTables_paginate {
    float: right;
}

.btn-group-justified {
    min-width: 280px;
}

@media only screen and (max-width: 320px) {
    .btn-group-justified {
        min-width: 249px;
    }
}

.upload-img-form .btn-group-justified {
    max-width: 100%;
    margin-bottom: 24px;
}

@media only screen and (max-width: 567px) {
    .upload-img-form .btn-group-justified {
        max-width: 100%;
        flex: 1 1 auto;
    }
}

@media only screen and (max-width: 320px) {
    a.btn.tile img {
        width: 44px !important;
    }
}

@media only screen and (max-width: 834px) {
    a.btn.tile img {
        width: 49px;
    }
}

.modal-title {
    display: inline;
}

.dataTables_wrapper.container-fluid.dt-bootstrap4 {
    padding-left: 0px;
    padding-right: 0px;
}

.form-helptext .input-group-text {
    background: none;
    border: none;
}

.dataTables_length {
    float: left;
}

div.dataTables_wrapper div.dataTables_paginate {
    float: right;
}

.no-authorized {
    height: 80vh;
}

.DTFC_LeftHeadWrapper, .DTFC_LeftBodyWrapper, .DTFC_LeftFootWrapper {
    background-color: #fff !important;
}

table.dataTable {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

.btn-light {
    color: #212529;
    background-color: #f8f9fa;
    border-color: #ced4da;
}

@media only screen and (min-width: 1199px) {
    .dataTables_wrapper {
        width: 1111px;
    }
}

.helptext {
    display: inline-block;
}

    .helptext [disabled] {
        pointer-events: none;
    }

img {
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

.modal-details {
    font-size: 8pt;
}

#EventLogTabel.dataTable th {
    background-color: #FBF7F7;
}
#EventLogTabel.dataTable td {
    border: 4px solid #ffffff;
}
#EventLogTabel.dataTable tr:nth-child(odd) {
    background-color: #E5E5E5;
}

#EventLogTabel.dataTable tr:nth-child(even) {
    background-color: #FBF7F7;
}
.table thead th {
    vertical-align: bottom;
    border: 2px solid #dee2e6;
}
.dateTimeDiv{
    margin-bottom: -50px;
}
.cursor-pointer{
    cursor: pointer;
}

.frontpage-menu-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: 8px;
    grid-row-gap: 8px;
}

.frontpage-menu-wrapper-wide {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: 8px;
    grid-row-gap: 8px;
}

.frontpage-buttons-container {

}

.frontpage-button {
    height: 240px;
    cursor: pointer;
    color: #212529 !important;
    text-decoration-line: none !important;
}

    .frontpage-button:hover h4 {
        text-decoration-line: underline;
    }

    .frontpage-button:hover .frontpage-button-wrapper {
        box-shadow: 0px 2px 10px 1px rgb(72 106 226 / 25%);
        border: 0.7px solid #486AE2;
        border-radius: 5px;
    }

.frontpage-button-wrapper {
    width: 100%;
    height: 100%;
    background: rgba(210, 232, 223, 0.4);
    box-shadow: 0px 2px 10px 1px rgba(0, 0, 0, 0.15);
    transition: box-shadow 100ms ease-in-out, border 100ms ease-in-out;
    border-radius: 5px;
    border: 0.7px solid transparent;
    position: relative;
}

.frontpage-button-icon {
    position: absolute;
    font-size: 30px;
    margin-left: 20px;
    margin-top: 20px;
}

.frontpage-button-context {
    padding: 60px 15%;
}

@media only screen and (max-width: 780px) {
    .frontpage-menu-wrapper {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: repeat(2, 1fr);
        grid-column-gap: 8px;
        grid-row-gap: 8px;
    }

    .search-button {
        grid-area: 2 / 1 / 3 / 2;
    }

    .import-button {
        grid-area: 1 / 1 / 2 / 2;
    }
}

.download-button {
    box-shadow: 0px 2px 3px 1px rgba(0, 0, 0, 0.15);
    border-radius: 5px;
}

    .apk-intructions .corner-logo {
        position: absolute;
        top: 0%;
        right: 0px;
    }


.center {
    text-align: center;
}

    .center .img-fluid.ptr-2 {
        padding-top: 2rem;
    }

img.small-logo-symbol {
    max-height: 3rem;
}

.bg-dark {
    background-color: #252B37 !important;
}

a {
    color: #004EEB;
}

.domainType {
    max-height: 55px;
    transition: filter 0.2s ease, opacity 0.2s ease;
}

.domainType.unselected {
    filter: grayscale(100%);
    opacity: 0.55;
}

.domainType.selected {
    filter: none;
    opacity: 1;
}