@import url("https://use.typekit.net/ddr7xoc.css");
h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
}
.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}
.flex-between-center {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.flex-around-center {
  display: flex;
  justify-content: space-around;
  align-items: center;
}
* {
  font-family: "itc-avant-garde-gothic-pro", sans-serif;
  font-style: normal;
}
body {
  background: #f9f9f9;
  color: #000;
}
body.login {
  background: url(/Images/login-bg.jpg) no-repeat center / cover;
}
body.login .login-container {
  display: flex;
  min-height: 100vh;
  justify-content: center;
  align-items: center;
}
body.login h1 {
  color: #FFF;
  font-size: 1.25rem;
}
body.login .wrap {
  max-width: 450px;
}
body.login .login-footer {
  font-size: 0.8rem;
  display: flex;
  flex-wrap: wrap;
}
body.login .login-footer p,
body.login .login-footer a {
  color: #FFF;
}
.form.login {
  background: #fff;
  border-top: 10px solid #71CBF6;
  padding: 1rem 1.9rem 2.25rem 1.9rem;
}
.form.login h2 {
  color: #003760;
  font-size: 1.2rem;
  margin-bottom: 1.25rem;
  font-weight: 500;
}
.form.login label {
  font-size: 0.85rem;
}
.form.login input:not([type=checkbox]) {
  background: #f1f1f1;
  border: 0;
  padding: 0.75rem 1rem;
  border-radius: 1.5rem;
  font-size: 0.9rem;
}
.form.login .toggle-pass {
  position: absolute;
  background: none;
  border: none;
  padding: 0.75rem;
  color: #000;
  right: 0.5rem;
}
.form.login button[type=submit] {
  background: #0055AD;
  color: #FFF;
  font-weight: 500;
  font-size: 0.9rem;
  width: 100%;
  border: 0;
  border-radius: 2rem;
  padding: 0.8rem;
}
.form-check {
  display: flex;
  align-items: center;
  padding-left: 1.75rem;
}
.form-check .form-check-input {
  background: #f1f1f1;
  border: 0;
  border-radius: 0.25rem;
  width: 1.5em;
  height: 1.5em;
}
.form-check .form-check-input:checked[type="checkbox"] {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%230055AD' stroke-linecap='square' stroke-linejoin='round' stroke-width='1.5' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
}
.form-check .form-check-input:checked {
  border-color: #0d6efd;
}
.form-check label {
  padding: 0.4rem 0 0 0.75rem;
  margin: 0;
  width: 100%;
  flex-basis: unset;
}
.form-check label .bxs-info-circle {
  color: #0055AD;
}
#dialog-DemoFilter.modal .modal-header h2 {
  font-size: 1.1rem;
  font-weight: 700;
}
#dialog-DemoFilter.modal .modal-body h4 {
  font-weight: 500;
  font-size: 1rem;
  margin-bottom: 1rem;
}
#dialog-DemoFilter.modal .modal-body #Options {
  overflow-y: auto;
  display: block;
  height: 186px;
}
#dialog-DemoFilter.modal .modal-footer button {
  border: none;
  padding: 0.5rem 1.5rem;
}
#dialog-DemoFilter.modal .modal-footer button.btn1 {
  background: #F0F0F0;
  color: #000;
}
#dialog-DemoFilter.modal .modal-footer button.btn2 {
  background: #0055AD;
  color: #fff;
}
.wrap {
  width: 100%;
  max-width: 1068px;
  margin: auto;
}
.navigation {
  margin-bottom: 0.75rem;
}
.navigation nav ul {
  margin: 0;
  padding: 0;
  display: flex;
  list-style: none;
}
.navigation nav ul li a {
  text-decoration: none;
  display: flex;
  align-items: center;
  color: #000;
  padding: 0.6rem 1.5rem;
  font-size: 1rem;
  font-weight: 500;
}
.navigation nav ul li a.active {
  background: #fff;
  color: #0055AD;
}
.navigation .account {
  color: #F0F0F0;
}
.navigation .account a {
  font-size: 0.8rem;
  font-weight: 500;
  color: #003760;
}
.navigation .account a.logoff {
  background: #fff;
  color: #0055AD;
  text-decoration: none;
  padding: 0.5rem 1.25rem;
  text-transform: uppercase;
}
h1 {
  font-size: 1.45rem;
  font-weight: 500;
  color: #003760;
}
.filter-section {
  background: #F0F0F0;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}
.filter-section h2 {
  font-size: 1.1rem;
  font-weight: 700;
}
.filter-section .sample-size {
  flex-basis: 40%;
  padding-right: 3rem;
}
.filter-section .generate-report {
  padding-left: 3rem;
  flex-basis: 60%;
}
.filter-section .report-name .label {
  flex-basis: 32%;
}
.filter-section .report-name .label label {
  display: block;
  margin: 0;
}
.filter-section .report-name .label span {
  font-size: 0.7rem;
  font-weight: 300;
  color: #666;
}
.filter-section .report-name input {
  border: 0;
  border-radius: 0;
  padding: 0.75rem;
  font-size: 0.9rem;
}
.filter-section .generate-report-btns {
  display: flex;
  justify-content: space-between;
}
.filter-section .generate-report-btns button {
  border: 0;
  background: #0055AD;
  color: #FFF;
  font-size: 0.95rem;
/*  padding: 0.7rem 1.5rem;*/
padding:10px
}
.filter-section .generate-report-btns button:hover {
  opacity: 0.9;
}
.reset-filters {
  color: #0055AD;
  font-weight: 500;
  font-size: 0.8rem;
  border: 1px solid #0055AD;
  border-radius: 1rem;
  background: #FFF;
  justify-content: space-around;
  padding: 0.25rem 0.75rem;
}
.reset-filters i {
  font-size: 1.2rem;
}
.filter-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}
.filter-row:not(:last-of-type) {
  margin-bottom: 1.5rem;
}
.filter-row .filter {
  display: flex;
  align-items: flex-start;
  margin-top: 5px;
}
.filter-row .filter.dropdown {
  width: 49%;
  position: relative;
  /*   &::after {
                content: url(/Images/Icons/chevron-down-white.png);
                position: absolute;
                width: 36px;
                height: 36px;
                background: @Clicks_blue;
                right: 0;
                z-index: 999;
                display: block;
                pointer-events: none;
                padding: 0.4rem;
            }*/
}
.filter-row .filter.dropdown > label {
  width: 39%;
  font-weight: 500;
  font-size: 1rem;
  padding-top: 6px;
}
.filter-row .filter.dropdown .form-select,
.filter-row .filter.dropdown .select {
  border: none;
  border-radius: 0;
  background-image: none;
  background: #FFF;
  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
  width: auto;
  flex: 1 1 auto;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.filter-row .filter.dropdown .form-select::after,
.filter-row .filter.dropdown .select::after {
  content: attr(data-content);
}
.filter-row .filter.dropdown .select-container {
  width: 60%;
  /*max-width: 275px;*/
  min-width: 0;
}
.filter-row .filter.dropdown .select-container .selectionbox {
  width: 36px;
  height: 36px;
  background: #0055AD;
  color: white;
  padding: 0.4rem;
  border: none;
}
.filter-row .filter.dropdown .select-container .collapsing {
  transition: none;
  display: none;
}
.filter-row .filter.dropdown .select-container .collapse {
  position: absolute;
  background: #FFF;
  width: calc(62% - 1rem);
  padding: 0;
  border: 1px solid #BFBFBF;
}
.filter-row .filter.dropdown .select-container .collapse .options {
  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
  max-height: 340px;
  overflow-y: scroll;
}
.filter-row .filter.dropdown .select-container .collapse .options label {
  font-size: 0.9rem;
}
.filter-row .filter.dropdown .select-container .collapse.show {
  z-index: 9999;
  box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1);
}
.filter-row .filter.dropdown .select-container .collapse .buttons {
  display: flex;
  border-top: 1px solid #BFBFBF;
}
.filter-row .filter.dropdown .select-container .collapse .buttons button {
  flex-basis: 100%;
  padding: 1rem;
  border: 0;
  /*&:nth-of-type(1) {
                                background: #FFF;
                                color: #666;
                            }*/
}
.filter-row .filter.dropdown .select-container .collapse .buttons button:nth-of-type(1) {
  background: #0055AD;
  color: #fff;
}
.filter-row .filter.dropdown .select-container .collapse .buttons button:nth-of-type(1):disabled {
  opacity: 0.5;
}
.filter-row .filter.checkbox {
  flex-basis: 25%;
}
.filter-row .filter.checkbox .form-check {
  display: flex;
  align-items: center;
}
.filter-row .filter.checkbox .form-check .form-check-input {
  border: 0;
  border-radius: 0.25rem;
  width: 2.25em;
  height: 2.25em;
  background: #fff;
}
.filter-row .filter.checkbox .form-check .form-check-input:checked[type="checkbox"] {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%230055AD' stroke-linecap='square' stroke-linejoin='round' stroke-width='1.5' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
}
.filter-row .filter.checkbox .form-check .form-check-input:checked {
  background-color: #fff;
  border-color: #0d6efd;
}
.filter-row .filter.checkbox .form-check label {
  width: auto;
}
.filter-row .filter.checkbox .form-check label .bxs-info-circle {
  color: #0055AD;
}
.reload-page {
  border: 0;
  color: #FFF;
  font-size: 0.85rem;
  background: #0055AD;
  padding: 0.35rem 1.2rem;
  float: right;
  margin-bottom: -2rem;
  position: relative;
  z-index: 999;
  border-radius: 0.25rem;
}
.reload-page i {
  font-size: 1.25rem;
  margin-bottom: 3px;
}
#orderedReports_length {
  font-size: 0.8rem;
  color: #666;
  text-align: left;
  padding: 0;
  display: flex;
  align-items: center;
  margin: 0 0 0.5rem 0;
  height: 2rem;
}
#orderedReports_length select {
  border: 0;
  background: #FFF;
  height: 2rem;
  margin: 0 0.25rem;
}
#orderedReports_length:after {
  content: "|";
  margin: 0 1.25rem;
  font-size: 1.2rem;
  font-weight: 300;
  display: inline-block;
  opacity: 0.5;
}
#orderedReports_filter {
  font-size: 0.8rem;
  color: #666;
  float: left;
  text-align: left;
}
#orderedReports_filter input {
  border-radius: 0;
  background: #FFF;
  border: 1px solid #f0f0f0;
  margin-left: 0.5rem;
  padding: 0.3rem 0.5rem;
}
table#orderedReports {
  background: #FFF;
  border-bottom: 3px solid #f1f1f1;
}
table#orderedReports thead th {
  font-size: 0.95rem;
  border-bottom: 3px solid #f1f1f1;
}
table#orderedReports thead th.sorting_desc::after,
table#orderedReports thead th.sorting_asc::before {
  color: #7FB543;
  opacity: 1;
}
table#orderedReports thead th::after,
table#orderedReports thead th::before {
  opacity: 1;
  color: #BFBFBF;
}
table#orderedReports thead th.date {
  width: 25%;
}
table#orderedReports thead th.report-name {
  width: 40%;
}
table#orderedReports thead th.type {
  width: 20%;
}
table#orderedReports thead th.action {
  width: 15%;
}
table#orderedReports tbody {
  font-size: 0.9rem;
}
table#orderedReports tbody td {
  border-bottom: 2px solid #f9f9f9;
}
table#orderedReports tbody td.action {
  padding: 0;
}
table#orderedReports tbody td.action button {
  border: none;
  color: #7FB543;
  background: none;
  width: 100%;
  padding: 0.75rem 1.75rem;
}
table#orderedReports tbody td.action button:hover {
  background: #f9f9f9;
}
table#orderedReports button {
  border: none;
  color: #7FB543;
  background: none;
}
table#orderedReports button:hover {
  background: #f9f9f9;
}
#orderedReports_info {
  margin-top: 2rem;
  padding: 0;
  color: #666666;
  font-size: 0.8rem;
}
#orderedReports_paginate {
  margin-top: 1.5rem;
  padding: 0;
  font-size: 0.8rem;
  color: #666666;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  color: #000 !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:active {
  box-shadow: none !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
  background: #0055AD !important;
  color: #FFF !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  color: #fff !important;
  opacity: 0.9;
}
#page-container {
  position: relative;
  min-height: 100vh;
}
.wrap {
  padding-bottom: 80px;
}
footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 80px;
  font-size: 0.9rem;
  padding: 1rem;
  color: #63666b;
  font-weight: 300;
}
footer img {
  max-width: 150px;
}


.overlay {
    position: fixed;
    z-index: 98;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-color: #aaa;
    filter: alpha(opacity=80);
    opacity: 0.8;
    text-align: center;
}

.overlayContent {
    z-index: 99;
    margin: 250px auto;
    text-align: center;
}

    .overlayContent h2 {
        font-size: 18px;
        font-weight: bold;
        color: #000;
    }