@font-face {
    font-family: 'D-DIN Condensed';
    src: url('../fonts/D-DINCondensed-Bold.woff2') format('woff2'),
        url('../fonts/D-DINCondensed-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'D-DIN Exp';
    src: url('../fonts/D-DINExp-Bold.woff2') format('woff2'),
        url('../fonts/D-DINExp-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'D-DIN';
    src: url('../fonts/D-DIN.woff2') format('woff2'),
        url('../fonts/D-DIN.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'D-DIN';
    src: url('../fonts/D-DIN-Bold.woff2') format('woff2'),
        url('../fonts/D-DIN-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'D-DIN Condensed';
    src: url('../fonts/D-DINCondensed.woff2') format('woff2'),
        url('../fonts/D-DINCondensed.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'D-DIN Exp';
    src: url('../fonts/D-DINExp-Italic.woff2') format('woff2'),
        url('../fonts/D-DINExp-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'D-DIN Exp';
    src: url('../fonts/D-DINExp.woff2') format('woff2'),
        url('../fonts/D-DINExp.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'D-DIN';
    src: url('../fonts/D-DIN-Italic.woff2') format('woff2'),
        url('../fonts/D-DIN-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'DIN';
    src: url('../fonts/DIN-Medium.woff2') format('woff2'),
        url('../fonts/DIN-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

*{margin: 0;padding: 0;}
a,a:hover{text-decoration:none;}
ul{margin-bottom: 0;}
body{font-family: 'D-DIN';background: #f4f4f1;font-size: 16px;}
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6{font-family: 'D-DIN';}
header{background: #3C4F60;padding: 0.625rem 0 0.938rem 0;background-image: url(../images/header-bg-new.jpg);position: relative;z-index:0;background-size: cover;background-position: center;}
/*header:before{position: absolute;content: '';width: 100%;height: 100%;background: rgb(255,255,255);background: linear-gradient(90deg, rgba(255,255,255,0.1) 0%, rgba(60,79,96,1) 48%, rgba(60,79,96,1) 100%);top: 0;z-index: 0;z-index: -1;}*/
.top-list{margin-bottom: 0.938rem;}
.mb-0{margin-bottom: 0;}
.pb-10{padding-bottom: 0.625rem;}
.top-list ul{display: flex;margin-bottom: 0;justify-content: flex-end;}
.top-list ul li{list-style: none;}
.top-list ul li a{font-size: 0.875rem;line-height: 1;color: #C5CFD8;border-right: 0.063rem solid #C5CFD8;padding: 0 0.75rem;}
.top-list ul li:last-child a{border: 0;padding-right: 0;}
.pos-top-link{padding-top: 0.938rem;}
.pos-top-link ul{display: flex;margin-bottom: 0;justify-content: flex-end;}
.pos-top-link ul li{list-style: none;}
.pos-top-link ul li{font-size: 0.875rem;line-height: 1;color: #A8BAC8;border-right: 0.063rem solid #C5CFD8;padding: 0 0.75rem;}
.pos-top-link ul li:last-child{border: 0;padding-right: 0;}

.navbar-brand a{font-size: 2.25rem;color: #fff;letter-spacing: 0.094rem;line-height: 1;display: flex;align-items: center;}
.navbar-brand a img{width: 10.938rem;}
.navbar-brand a span{color: #A8BAC8;margin-left: 0.625rem;}

.search-area{display: flex;justify-content: flex-end;align-items: center;}
.search-form{display: flex;align-items: center;}
.search-title p{font-size: 1.063rem;line-height: 1.313rem;color: #fff;margin-bottom: 0;}
.form-control{background: #A8BAC8;border-radius: 0.188rem;border: 0.063rem solid #212A31;color: #212A31;margin-bottom: 0;height: 2.438rem;width: 7.813rem;margin: 0 0.25rem;}
::placeholder{color: #212A31;}
.search-title p span{margin-bottom: 0;font-size: 1.063rem;color: #A8BAC8;line-height: 1.313rem; cursor: pointer; }
.btn-white{background: #fff;border: 0;line-height: 1.313rem;color: #445463;width: 8.125rem;height: 2.438rem;margin: 0 0.25rem;text-transform: uppercase;margin-right: 0;cursor: pointer;}
.btn-white:hover{background: #A8BAC8;border: 0.063rem solid #212A31;color: #212A31;}
.search-form form{display: flex;}

/* MENU WAS HERE */

.active a{background: #fff;}
.active a img{background: #fff !important;}

.form-select{height: auto;}

/* END MENU WAS HERE */

.dashboard-main-title h2{font-size:2.625rem;line-height: 3.125rem;color: #415364;text-transform: uppercase;margin-bottom: 0.313rem;}
.dashboard-padding{padding-left: 3.125rem;transition: 0.6s;padding-top: 1.875rem;}
.sales-1{background: #fff;box-shadow: 0 0.063rem 0.063rem #00000066;padding: 1.25rem 0.938rem;margin-bottom: 1.25rem;}
.sales-top{display: flex;justify-content: space-around;}
.sales-top-1 h5,.sales-top-1 p{font-size: 1.125rem;line-height: 1.313rem;margin-bottom: 0;color: #415364;}
.sales-top-3 p{margin-bottom: 0;color: #0071BC;font-weight: bold;font-size: 1.063rem;line-height: 1.313rem;padding-top:0.938rem;}
.sales-top-2 .form-select{width: 8.813rem;height: 1.875rem;border: 0.063rem solid #415364;background-color: #F2F2F2;border-radius: 0;font-size: 0.875rem;color: #415364;padding: 0.313rem 1.25rem 0.313rem 0.625rem;}
.sales-chart{text-align: center;}
.sales-chart img{width: 100%;}
.board-main{background: #F4F4F1;min-height: 100vh;position: relative;}
.dashboard-main .cell{padding-left: 0.938rem;padding-right: 0.938rem;}

.dashboard-footer h2{font-size: 1.75rem;letter-spacing: 1.0.313rem;color: #3C4F60;line-height: 1;}
.dashboard-footer p{font-size: 0.75rem;line-height: 1.313rem;letter-spacing: 0.006rem;}
.dashboard-footer img{width: 10rem;margin-bottom: 0.313rem;}
.play-img img{width: 100%;}
.dashboard-footer{ margin-top: 4rem; }
.dashboard-footer p a{color: #0071BC;font-weight: 600;}

/* END NEW */

.status-1{background: #fff;box-shadow: 0 0..63rem 0..63rem #00000066;padding: 1.25rem 0.938rem;height: 100%;}
.status-head h4{font-size: 1.125rem;line-height: 1.313rem;color: #415364;text-transform: uppercase;}
.ship-list ul{display: flex;flex-wrap: wrap;}
.ship-list ul li{list-style: none;font-size: 1.063rem;color: #727F8B;width: 50%;}
.ship-list ul li p{font-size: 1.063rem;color: #0071BC;margin-bottom: 0;}

.m-btm-20{margin-bottom: 1.25rem;}

.result-date-time{text-align: right;}
.result-date-time p{margin-bottom: 0;}

/* renamed from order-top */
.result-top-nav-main,
.reports-top-nav-main {margin-bottom: 1.875rem;}
.result-top-nav,
.reports-top-nav{background: #415364;box-shadow: 0 0.063rem 0.063rem #00000066;padding: 0.438rem 0;}

.result-display{display: flex;align-items: center;padding-top: 0.188rem;}
.result-display p{font-size: 1.063rem;line-height: 1.313rem;color: #fff;margin-bottom: 0; }
.result-nav ul{display: flex;align-items: center;}
.result-nav ul li{list-style: none;padding: 0 0.313rem;}
.result-nav ul li a i{font-size: 1.063rem;color: #fff;}
.result-nav ul li a{display: inline-flex;}
.result-nav ul li a img{width: 0.813rem;}

.result-show { display: flex; justify-content: center; align-items: center; }
.result-show-1 { display: flex; align-items: center; } /* TODO_SKIN: carry this through the media queries */
.result-show p { color: #fff; font-size:1.063rem; line-height: 1.313rem; margin-bottom: 0; margin: 0 0.5rem; }
.result-show select,
.result-show-1 select,
.result-show input[type=text],
.result-show-1 input[type=text] { background-color: #fff; border-radius: 0; border: 0.063rem solid #415364; height: 1.875rem; margin: 0; }

.order-head-1 p,
.customer-head-1 p, /* TODO: figure out something generic (customer-* names are reused in acp_CampaignList, to keep this list from getting crazier) */
.payments-head-1 p,
.memberships-head-1 p,
.reservations-head-1 p,
.order-head-2 p,
.customer-head-2 p,
.payments-head-2 p,
.memberships-head-2 p,
.reservations-head-2 p {font-size: 1.063rem;line-height: 1.313rem;color: #415364;margin-bottom: 0;}

.order-head-1 p span,
.customer-head-1 p span,
.payments-head-1 p span,
.memberships-head-1 p span,
.reservations-head-1 p span,
.order-head-2 p span,
.customer-head-2 p span,
.payments-head-2 p span,
.memberships-head-2 p span,
.reservations-head-2 p span {color: #0071BC; cursor: pointer; }

/* TODO_SKIN: use more generic names for these */
.order-table-head{margin-bottom: 1.125rem;}
.order-table-head input[type=checkbox] { margin: 0; }

.order-table-data{background: #fff;padding-top: 0.625rem;padding-bottom: 0.625rem;margin-bottom: 1.125rem;box-shadow: 0 0.125rem 0.188rem #00000066;}
.order-table-data .dropdown-pane { padding: 0.5rem; }
.order-table-data input[type=checkbox] { margin: 0; }

.order-data-1 ul,
.customer-data-1 ul,
.payments-data-1 ul,
.memberships-data-1 ul,
.reservations-data-1 ul {display: flex;flex-wrap: wrap; margin:0;}

.order-data-1 ul li {list-style: none;font-size: 1.063rem;color: #415364;line-height: 1.313rem;}
.order-data-1 ul li:nth-child(odd) {width: 40%;}
.order-data-1 ul li:nth-child(even) {width: 60%;}

.payments-data-1 ul li {list-style: none;font-size: 1.063rem;color: #415364;line-height: 1.313rem;}
.payments-data-1 ul li:nth-child(odd) {width: 40%;}
.payments-data-1 ul li:nth-child(even) {width: 60%;}

.memberships-data-1 ul li {list-style: none;font-size: 1.063rem;color: #415364;line-height: 1.313rem;}
.memberships-data-1 ul li:nth-child(odd) {width: 30%;}
.memberships-data-1 ul li:nth-child(even) {width: 70%;}

.reservations-data-1 ul li {list-style: none;font-size: 1.063rem;color: #415364;line-height: 1.313rem;}
.reservations-data-1 ul li:nth-child(odd) {width: 40%;}
.reservations-data-1 ul li:nth-child(even) {width: 60%;}

.customer-data-1 ul li {list-style: none;font-size: 1.063rem;color: #415364;line-height: 1.313rem;}
.customer-data-1 ul li:nth-child(odd) {width: 30%;}
.customer-data-1 ul li:nth-child(even) {width: 70%;}

.order-data-1 ul li span,
.customer-data-1 ul li span,
.payments-data-1 ul li span,
.memberships-data-1 ul li span,
.reservations-data-1 ul li span {color: #0071BC;}

.customer-data-icons,
.payment-data-icons,
.order-data-icons { color: #415364; cursor: pointer; right: 0; position: absolute; top: 0; }
.customer-data-icons i,
.payment-data-icons i,
.order-data-icons i { margin-left: .25rem; }

.order-comment-wrapper { margin-bottom: 1rem; }
.order-comment-wrapper:last-child { margin-bottom: 0; }

.eye-icon img{width: 1.25rem;height: 1.25rem;object-fit: contain;cursor: pointer;margin: 0.125rem;}
.report-caterg1 .eye-icon{display: flex;}
.report-caterg1 .eye-icon img{width: 1.125rem;height: 0.938rem;object-fit: contain;margin: 0 0.188rem;}

.order-data-2 ul,
.customer-data-2 ul,
.payments-data-2 ul,
.memberships-data-2 ul,
.reservations-data-2 ul { margin:0; }
.order-data-2 ul li,
.customer-data-2 ul li,
.payments-data-2 ul li,
.memberships-data-2 ul li,
.reservations-data-2 ul li {font-size: 1.063rem;color: #415364;line-height: 1.313rem;list-style: none;}
.order-data-2 p,
.customer-data-2 p,
.payments-data-2 p,
.memberships-data-2 p,
.reservations-data-2 p {font-size: 1.063rem;color: #415364;line-height: 1.313rem;margin-bottom: 0;}

.report-category{display: flex;justify-content: flex-end;align-items: center;}
.report-category p{margin-bottom: 0;font-size: 1.063rem;color: #415364;line-height: 1.313rem;margin-right: 0.5rem;}
.categ-form .form-select{background-color: #fff;border: 0.063rem solid #415364;border-radius: 0;height: 2.063rem;}

.result-list ul{margin-bottom: 0;display: flex;justify-content: flex-end;align-items: center;padding-top: 0.188rem;}
.result-list ul li{list-style: none;}
.result-list ul li a{color: #fff;font-size: 1.063rem;line-height: 1.313rem;padding: 0 0.625rem;border-right: 0.063rem solid #fff;}
.result-list ul li:last-child a{border-right: 0;padding-right: 0;}

.report-variety-list ul{display: flex;flex-wrap: wrap;justify-content: center;}
.report-variety-list ul li{list-style: none;}
.report-variety-list ul li a{background: #F4F4F1;box-shadow: 0 0.188rem 0.313rem #00000066;line-height: 1.25rem;color: #8A8D8E;letter-spacing: 0.006rem;text-transform: uppercase;padding: 0.625rem 1.25rem;display: inline-block;margin:0 0.313rem;margin-bottom: 0.938rem;}
.report-variety-list ul li a:hover{background: #fff;color: #415364;}
.report-variety-list ul li a.active{background: #fff;color: #415364;} /* TODO_SKIN: maybe improve on this (it's the same as hover) */
.revenue-area{background: #fff;padding: 0.938rem 0;box-shadow: 0 0.125rem 0.313rem #00000066;}

thead, tbody, tfoot{border: 0;}
thead{background: #415364;color: #fff;font-size: 1.125rem;line-height: 1.313rem;}
thead th, thead td, tfoot th, tfoot td{font-weight: normal;}
tbody td{color: #415364;font-size: 1.063rem;line-height: 1.313rem;}
table.unstriped tbody tr{border-bottom: 0..63rem solid #cfd0d0;  }
table{border-bottom: 1.875rem solid #c5cfd8;box-shadow: 0 0.125rem 0.313rem #00000066;}

ul[data-pie-id] li:nth-child(1) {
  color: #A8BAC8;
}

ul[data-pie-id] li:nth-child(2) {
  color: #445463;
}

ul[data-pie-id] li:nth-child(3) {
  color: #8A8D8E;
}
ul[data-pie-id] li:nth-child(4) {
  color: #D7CDC2;
}
ul[data-pie-id] li:nth-child(5) {
  color: #BB9A9C;
}




.chart-data{display: none;}
#my-cool-bar-chart{height: 16.25rem;}
#my-cool-bar-chart svg{height: 100%;}
#my-cool-bar-chart svg rect:nth-child(odd){fill: #A8BAC8;}
#my-cool-bar-chart svg rect:nth-child(even){fill: #445463;}

#my-cool-bar-chart2{height: 16.25rem;}
#my-cool-bar-chart2 svg{height: 100%;}
#my-cool-bar-chart2 svg rect:nth-child(odd){fill: #A8BAC8;}
#my-cool-bar-chart2 svg rect:nth-child(even){fill: #445463;}

#my-cool-bar-chart3{height: 16.25rem;}
#my-cool-bar-chart3 svg{height: 100%;}
#my-cool-bar-chart3 svg rect:nth-child(odd){fill: #A8BAC8;}
#my-cool-bar-chart3 svg rect:nth-child(even){fill: #445463;}

#my-cool-bar-chart4{height: 16.25rem;}
#my-cool-bar-chart4 svg{height: 100%;}
#my-cool-bar-chart4 svg rect:nth-child(odd){fill: #A8BAC8;}
#my-cool-bar-chart4 svg rect:nth-child(even){fill: #445463;}

#my-cool-bar-chart5{height: 16.25rem;}
#my-cool-bar-chart5 svg{height: 100%;}
#my-cool-bar-chart5 svg rect:nth-child(odd){fill: #A8BAC8;}
#my-cool-bar-chart5 svg rect:nth-child(even){fill: #445463;}

#my-cool-bar-chart6{height: 16.25rem;}
#my-cool-bar-chart6 svg{height: 100%;}
#my-cool-bar-chart6 svg rect:nth-child(odd){fill: #A8BAC8;}
#my-cool-bar-chart6 svg rect:nth-child(even){fill: #445463;}


#my-cool-pie-chart{height: 9.063rem;width: 14.375rem;}
#my-cool-pie-chart svg{height: 100%;}
#my-cool-pie-chart svg g:nth-child(1){fill: #A8BAC8;}
#my-cool-pie-chart svg g:nth-child(2){fill: #445463;}
#my-cool-pie-chart svg g:nth-child(3){fill: #A8B9C7;}
#my-cool-pie-chart svg g:nth-child(4){fill: #445463;}

#my-cool-pie-chart1{height: 9.063rem;}
#my-cool-pie-chart1 svg{height: 100%;width: 14.375rem;}

#my-cool-pie-chart2{height: 9.063rem;width: 14.375rem;}
#my-cool-pie-chart2 svg{height: 100%;}

.status-img{display: flex;align-items: center;justify-content: flex-start;}
ul[data-pie-id]{padding: 0 !important;}
ul[data-pie-id] li{font-size: 0.938rem;line-height: 1.3;}

.report-caterg1,.report-caterg2{display: flex;align-items: center;}
.play-img{display: none;position: absolute;right: 0;width: 85%;}

/* renamed from .result-date-time */
.result-links ul{display: flex;justify-content: flex-start;margin: 0.625rem 0 1.25rem 0;}
.result-links ul li{list-style: none;border-right: 0.125rem solid #415364;line-height: 1;padding: 0 0.5rem;}
.result-links ul li:last-child{border-right: 0;padding-right: 0;}
.result-links ul li a{color: #0071BC;font-size: 1.125rem;}

@media only screen and (max-width:1280px){
    .dashboard-main-title h2{font-size: 2.438rem;}
}

@media only screen and (max-width:1024px){
    /* renamed from .result-date-time */
    .result-links ul{flex-wrap: wrap;}
    .result-links ul li{margin-bottom: 0.625rem;}
}

@media only screen and (max-width:992px){
    header{background-position: right;background-size: cover;}
}

@media only screen and (max-width:992px){
/*  .search-form p{display: none;}*/
    .form-control{width: 6.25rem;height: 2.25rem;}
    .btn-white{height: 2.25rem;width: 6.875rem;font-size: 0.875rem;}
    .navbar-brand{position: absolute;top: 0.625rem;}
    .dashboard-padding{padding-left: 2.5rem;}
    .sales-top-2 .form-control{width: 100%;}
    .result-nav ul li{padding: 0 0.188rem;}
    .result-display p{font-size: 0.875rem;margin-right: 0.625rem;}
    .result-show p{font-size: 0.875rem;}
    .result-show .form-control{height: 1.75rem;}
    .result-show{padding-top: 0.063rem;}
    .dashboard-main-title h2{margin-bottom: 0.313rem;}
    .report-category{margin-bottom: 0.938rem;justify-content: flex-start;}
    .result-list ul li a{font-size: 0.813rem;padding: 0 0.625rem;}
    .result-date-time{text-align: left;}
    /* renamed from .result-date-time */
    .result-links ul{justify-content: flex-start;}
}

@media screen and (max-width: 992px) {
    .responsive-card-table thead tr {position: absolute;top: -9999em;left: -9999em;}
	 .responsive-card-table tr {display: block;}
	 .responsive-card-table tr + tr {margin-top: 1.5rem;}
	 .responsive-card-table td {border: none;display: flex;justify-content: flex-start;align-items: center;padding-left: 50%;position: relative;
         border-bottom: 0.063rem solid #cfd0d0;}
	 .responsive-card-table td:before {content: attr(data-label);display: inline-block;line-height: 1.5;margin-left: -100%;width: 100%;position: relative;z-index: 1;color: #fff;}
	 .responsive-card-table td:after {content: '';position: absolute;background: #415364;width: 45%;height: 100%;left: 0;top: 0;z-index: 0;}
     table.unstriped tbody tr{border: 0;}
    table.unstriped tbody{background-color: transparent;}
    table{border-bottom: 0.625rem solid #c5cfd8;}
}


@media only screen and (max-width:767px){
    .search-area{display: block;}
    .search-title{margin-bottom: 0.625rem;}
    .search-title p{font-size: 1rem;}
    .form-control{width: 5.625rem;margin: 0 0;margin-right: 0.313rem;font-size: 0.875rem;}
    .btn-white{width: 5.625rem;margin: 0;padding-left: 0.313rem;padding-right: 0.313rem;font-size: 0.813rem;}
    .top-list ul li a{font-size: 0.813rem;}
    .top-list ul li a{padding: 0 0.625rem;}
    .dashboard-main-title h2{font-size: 2.375rem;line-height: 2.625rem;}
    .result-date-time p{padding-top: 0.313rem;padding-bottom: 0.625rem;}
    .result-display{padding-top: 0;padding-bottom: 0.313rem;justify-content: space-between;}
    .result-display p{font-size: 1.063rem;margin-right: 1.25rem;}
    .result-show{padding-top: 0;padding-bottom: 0.313rem;}
    .result-show p{font-size: 1.063rem;margin-right: 0.313rem;}
    .result-show /*.form-select*/ select,
    .result-show /*.form-select*/ input{width: 100%;}
    .eye-icon img{width: 1.563rem;height: 1.563rem;}
    .report-category p{font-size: 0.75rem;}
    .categ-form .form-select{width: 5rem;height: 1.875rem;}
    /*.report-form .form-select{width: 100%;}*/
    .result-list ul{justify-content: flex-start;}
    .report-variety-list ul li{width: 100%;}
    .report-variety-list ul li a{display: block;text-align: center;}
    /*
    .revenue-date{margin-bottom: 0.938rem;}
    .revenue-type{text-align: center;}
    */
    header{background-position: center;}

    .order-data-2,
    .customer-data-2,
    .payments-data-2,
    .memberships-data-2,
    .reservations-data-2 {margin-bottom: 0.313rem;}

    .result-date-time{text-align: left;}
}


@media only screen and (max-width:375px){
   .form-control{width: 5rem;margin-right: 0.25rem;font-size: 0.813rem;}
    .btn-white{font-size: 0.75rem;}
    .dashboard-padding{padding-left: 2.188rem;}
    .dashboard-main-title h2{font-size: 2.25rem;}
    .sales-top-1 h5, .sales-top-1 p{font-size: 1rem;line-height: 1.25rem;}
    .sales-top-2 .form-control{font-size: 0.813rem;}
    .sales-top-3 p{font-size: 0.938rem;padding-top: 0.75rem;}
    .sales-1{padding: 1.25rem 0.625rem;}
    .status-head h4{font-size: 1rem;}
    .ship-list ul li{font-size: 0.938rem;line-height: 1.4;}
    .ship-list ul li p{font-size: 0.938rem;line-height: 1;}
    .dashboard-footer p{line-height: 1.125rem;}
    .categ-form .form-control{width: 4.5rem;font-size: 0.75rem;padding: 0.313rem 0.375rem;}
    .report-category{margin-top: 0.625rem;}
    .report-category p{font-size: 0.688rem;}
    .report-category .eye-icon img{width:1.25rem;height: 1.25rem;}
    .result-list ul li a{font-size: 0.75rem;padding: 0 0.5rem;}
    .report-category{display: block;}
    .report-caterg1{margin-bottom: 0.625rem;}
    .report-caterg2 p span{display: none;}
    .top-list{margin-top: 2.188rem;margin-bottom: 0;}
    .top-list ul{justify-content: flex-start;}
    .top-list ul li:first-child a{padding-left: 0;}
    .eye-icon img{width: 1.375rem;height:1.375rem;}
    .result-date-time{text-align: left;}
    #my-cool-pie-chart1 svg{width: auto;}
}

@media only screen and (max-width:320px){
    .search-form form{flex-wrap: wrap;}
    .search-form form .form-group{width: 32.3%;margin-right: 0.188rem;}
    .search-form form .form-group:last-child{width: 100%;}
    .btn-white{width: 100%;margin-top: 0.625rem;}
    .top-list ul li a{font-size: 0.75rem;padding: 0 0.438rem;}
    .top-list ul li{line-height: 1.2;}
    .search-form .form-control{width: 100%;margin: 0;}
    .result-display p{font-size: 0.938rem;margin-right: 0.625rem;}
    .result-show p{font-size: 0.938rem;}
    
    .order-head-1 p, 
    .customer-head-1 p, 
    .payments-head-1 p, 
    .memberships-head-1 p, 
    .reservations-head-1 p, 
    .order-head-2 p,
    .customer-head-2 p,
    .payments-head-2 p,
    .memberships-head-2 p,
    .reservations-head-2 p,
    .order-data-1 ul li,
    .customer-data-1 ul li,
    .payments-data-1 ul li,
    .memberships-data-1 ul li,
    .reservations-data-1 ul li,
    .order-data-2 ul li,
    .customer-data-2 ul li,
    .payments-data-2 ul li,
    .memberships-data-2 ul li,
    .reservations-data-2 ul li,
    .order-data-2 p,
    .customer-data-2 p,
    .payments-data-2 p,
    .memberships-data-2 p,
    .reservations-data-2 p {font-size: 1rem;}
    
    .responsive-card-table{width: 100%;}
    .responsive-card-table td:before{font-size: 0.938rem;}
    .responsive-card-table td{font-size: 0.938rem;}
    .dashboard-main-title h2{font-size: 2rem;line-height: 2.188rem;}
    .result-list ul{display: block;}
    .result-list ul li{text-align: center;}
    .result-list ul li a{border-right: 0;}
    .report-category{display: block;}
    .report-caterg2 span{display: none;}
    .pso-table-1 .qty-form, .pso-table-1 .qty-price, .pso-table-1 .qty-discount{width: 100%;}
    .pso-table-1 tbody tr td, .pso-table-2 tbody tr td{font-size: 0.875rem;word-break: break-all;}
    .pso-table-2 table.unstriped tbody tr{display: block;}
    .navbar-brand a img{margin-top: 0;}
    .top-list{margin-bottom: 0.313rem;} 
}

/* MENU WRESTLING */

#nav-menu-wrapper { position: relative; z-index: 10000; }

#nav-menu.dropdown.menu { background: #C5CFD8; position: absolute; }

#nav-menu.dropdown.menu li { font-size: 1.125rem; }

#nav-menu.dropdown.menu li a {
    color: #212A31;
    display: flex;
    font-family: 'D-DIN Exp';
    line-height: 1;
    align-items: center;
}

#nav-menu.dropdown.menu li a:hover,
#nav-menu.dropdown.menu li a:hover img,
#nav-menu.dropdown.menu .is-active > a,
#nav-menu.dropdown.menu .is-active > a img { background: #fff; }

#nav-menu.dropdown.menu li a img {
    min-width: 2.5rem;
    height: 2.5rem;
    object-fit: contain;
    background: #B8C4CF;
    margin-right: 0.625rem;
    padding: 0.438rem 0.375rem;
    max-width: 2.5rem;
}

#nav-menu.dropdown.menu > li > a { padding: 0; }
#nav-menu.dropdown.menu > li.is-dropdown-submenu-parent > a { padding-right: 2rem; }

#nav-menu.dropdown.menu .is-dropdown-submenu {
    background-color: #d9e0e6;
    border: 1px solid #cacaca;
}

#nav-menu.dropdown.menu.vertical > li.opens-right > a::after {
    border-color: transparent transparent transparent #212A31;
}

#nav-menu.dropdown.menu > li.is-dropdown-submenu-parent > a::after {
    margin-top: -6px;
}

#nav-menu.dropdown.menu .is-dropdown-submenu .is-dropdown-submenu-parent.opens-right > a::after {
    border-color: transparent transparent transparent #212A31;
}

#nav-menu label { padding-left: 0.625rem; } /* used for Super Users labels */

#nav-menu.dropdown.menu.vertical.acp-nav-shrunk { width: 2.5rem; }

#nav-menu.dropdown.menu.vertical.acp-nav-shrunk > li > a > span { display: none; }

#nav-menu.dropdown.menu.vertical.acp-nav-shrunk > li.opens-right > a::after {
    content: none;
}

#nav-menu.dropdown.menu.vertical.acp-nav-shrunk li a img:hover { background: #fff; }

#nav-menu .toogler img {
    width: 1.75rem;
    height: 1.75rem !important;
    background: #fff !important;
    height: 1.75rem;
    background: #fff;
    border-radius: 1.875rem;
    font-size: 1.125rem;
    line-height: 1.75rem;
    text-align: center;
    color: #536473;
    margin: 0.375rem !important;
    padding: 0.438rem !important;
    min-width: auto !important;
}
#nav-menu .toogler a:hover { background: #b8c4cf !important; }