 /* Responsive CSS */

 @media screen and (min-width:1500px) and (max-width:1920px) {

     html {
         font-size: 18px;
     }

     .container {
         max-width: 90%;
     }

     .property-image img,
     .card-item .card-image img {
         height: 350px;
     }

     .login-left-wrap h2 {
         font-size: 3.4rem;
     }

     .login-left-wrap p {
         padding: 0px 10%;
     }

     .login-left-wrap,
     .login-form-wrap {
         padding: 50px;
     }

     .login-form-wrap .login-image-box {
  max-width: 320px;
}

.login-left-wrap p {
  font-size: 18px; 
}
     

 }

 @media screen and (max-width:1200px) {
     .middle-content-area footer .footer-nav li a {
         font-size: .75rem;
     }

     .middle-content-area footer .footer-nav ul {
         gap: 12px !important;
     }

 }

 @media screen and (min-width:1100px) {
     .sidebar {
         left: 0px !important;
     }
 }

 @media screen and (max-width:1100px) {

     .container {
         max-width: 100% !important;
     }

     .custom-navbar .navbar-brand img {
         max-width: 160px;
     }

     header,
     .middle-content-area header {
         padding-top: 55px;
         padding-bottom: 16px;
     }

     .custom-navbar li .nav-link {
         padding: 4px 8px !important;
     }

     .search-container {
         padding-left: 10px;
     }

     .search-container input.nav-search {
         width: 130px;
     }

     .profile-contact-info {
         padding-left: 0px !important;
         padding-right: 0px !important;
     }

     .footer-nav ul {
         gap: 16px !important;
     }

     .pt-150 {
         padding-top: 140px !important;
     }

     .sidebar {
         display: block;
         left: -250px;
     }

     .sidebar-open::before {
         display: flex;
     }

     .middle-content-area {
         margin-left: 0px;
     }

     .middle-content-area,
     .middle-content-area .header-top,
     .middle-content-area header {
         width: 100%;
     }

     .middle-content-area header .navbar-brand {
         display: block !important;
     }

     .middle-content-area footer .footer-top {
         gap: 20px !important;
     }

     .middle-content-area footer .footer-nav ul {
         gap: 12px !important;
     }

     .sidebar-button {
         display: flex;
     }

     .sidebar-toggle {
         background-color: #07579F1F;
         border: 1px solid #07579F1F;
         color: var(--clr-primary);
     }

     .sidebar-toggle:hover,
     .sidebar-toggle:focus {
         background-color: var(--clr-primary);
         border-color: var(--clr-primary);
         color: var(--clr-white);
     }

     .close-toggle {
         position: absolute;
         right: 10px;
         top: 10px;
         background: transparent;
         border: none;
         font-size: 18px;
         display: inline-flex;
     }

     .sidebar-logo {
         padding-top: 34px;
     }

     .filter-left-box {
         flex-direction: column;
     }

 }

 @media screen and (max-width:991px) {

     .main-wrapper.pt-200 {
         padding-top: 150px !important;
     }

     .search-container {
         display: none !important;
     }

     .navbar-expand-md .navbar-nav {
         flex-direction: row;
         flex-wrap: wrap;
     }

     .profile-card {
         padding-left: 16px !important;
         padding-right: 16px !important;
     }

     .social-media-list,
     .footer-other.mb-4 {
         justify-content: center !important;
         margin-bottom: 0px !important;
     }

     .footer-nav ul {
         flex-wrap: wrap;
         gap: 10px !important;
     }

     .footer-nav li a {
         padding: 0px 4px;
         font-size: .875rem;
     }

     .footer-right {
         flex-direction: row !important;
         align-items: center !important;
         padding-top: 16px;
     }

     .footer-social-media {
         min-height: 60px;
     }

     .more-links ul {
         margin-bottom: auto;
     }

     .edit-profile-left .social-media-list {
         justify-content: flex-start !important;
     }

     /* .middle-content-area .container {
         padding-left: calc(var(--bs-gutter-x) * .5);
         padding-right: calc(var(--bs-gutter-x) * .5);
     } */

     .middle-content-area .container {
         padding-left: 16px;
         padding-right: 16px;
     }

     .card-table {
         min-height: auto;
     }

     .custom-modal {
         max-width: 80%;
         margin: 0px auto;
     }

     .more-filter {
         width: 100%;
     }

     .more-filter .d-flex {
         flex-wrap: wrap;
     }

     .filter-item {
         min-width: 130px;
     }

     .filter-item .form-select {
         max-width: 100%;
     }

     .video-wrapper {
         width: 100%;
         height: auto;
         aspect-ratio: 16 / 9;
         overflow: hidden;
     }

     .lineup-modal {
         max-width: 450px;
     }

     .course-curriculum-wrapper {
         max-height: 100%;
         padding-right: 0px;
     }

     .help-content {
         width: 40% !important;
     }

     .contact-form-box {
         width: 60% !important;
         padding-left: 24px;
     }

     .dash-profile-left {
         padding-left: 0px !important;
     }

     .calendar-wrap {
         margin-top: 1rem !important;
     }

     .dash-calendar .flatpickr-calendar {
         margin: 0px 0px 30px;
     }

     /* Admin Header Starts */

     #impersonation-banner {
         font-size: 12px !important;
     }

     /* Admin Header Ends */

     .login-form-wrap .px-5 {
         padding-left: 24px !important;
         padding-right: 24px !important;
     }

     .login-left-wrap h2 {
         font-size: 1.5rem;
     }

 }

 @media screen and (max-width:767px) {

     .login-left-wrap {
         display: none;
     }

     .login-form {
         max-width: 450px;
     }

     .login-left-wrap p {
         padding: 0px 0;
     }


     html {
         font-size: 14px;
     }

     .main-wrapper.pt-200 {
         padding-top: 110px;
     }

     .pt-150,
     .pt-130 {
         padding-top: 90px !important;
     }

     .heading-button-box {
         flex-direction: column;
         margin-bottom: 8px;
         justify-content: flex-start !important;
         align-items: flex-start !important;
         gap: 0px !important
     }

     .btn {
         height: 44px;
         min-width: 150px;
         padding: 8px 16px;
     }

     .btn-sm {
         min-width: 100px;
         height: 40px;
         padding: 6px 16px;
     }

     .confirmation-modal {
         max-width: 85%;
         margin: 0px auto;
     }

     .header-top,
     header,
     .middle-content-area header {
         padding: 0px;
         box-shadow: var(--shadow-1);
         height: auto;
     }

     .custom-navbar {
         padding: 8px 0px !important;
     }

     header .search-container {
         display: none !important;
     }

     .custom-navbar .navbar-brand img,
     .footer-logo img {
         max-width: 160px;
         width: auto;
     }

     .header-top .header-left-info {
         display: none !important;
     }

     .navbar-expand-md .navbar-nav {
         flex-direction: column !important;
         text-align: center;
         padding-top: 16px;
     }

     .profile-dropdown,
     .notification {
         position: absolute !important;
         z-index: 999;
         top: 19px;
         right: 60px;
         margin: 0px !important;
     }

     .profile-dropdown .dropdown-toggle {
         border: 1px solid var(--clr-primary);
         padding: 2px;
         border-radius: 50%;
     }

     .dropdown-toggle::after {
         display: none;
     }

     .profile-dropdown .dropdown-toggle .dropdwon-profile-icon img {
         max-height: 30px;
         max-width: 30px;
     }

     .profile-dropdown .dropdwon-profile-text {
         display: none;
     }

     .notification .notification-icon {
         border-color: #C4C4C4;
         color: var(--clr-black);
         width: 34px;
         height: 34px;
         background-color: var(--clr-white);
     }

     .notification {
         right: 105px !important;
     }

     .notification-list {
         top: 42px;
         right: -95px;
         width: 296px;
     }

     .notification-list::before {
         right: 105px;
     }

     .navbar-toggler,
     .navbar-toggler:hover,
     .navbar-toggler:focus {
         border: 1px solid #ccc;
         margin-right: 0px;
         box-shadow: none;
         outline: 0;
         padding: 2px 5px;
         border-radius: 4px;
     }

     .col-md-7.col-lg-8.mt-100 {
         margin-top: 0px !important;
     }

     .profile-contact-info,
     .profile-card {
         padding-left: 1.5rem !important;
         padding-right: 1.5rem !important;
     }

     .main-wrapper.pt-200 {
         padding-top: 100px !important;
     }

     .footer-nav ul {
         gap: 8px !important;
     }

     .footer-right {
         padding-top: 50px;
         position: relative;
     }

     .more-links {
         width: 100%;
         display: flex;
         position: absolute;
         top: 10px;
         left: 0px;
         padding-right: calc(var(--bs-gutter-x) * .5);
         padding-left: calc(var(--bs-gutter-x) * .5);
     }

     .search-fliter {
         margin-top: 8px;
     }

     .middle-content-area header li:first-child .nav-link {
         padding-left: 8px !important;
     }

     .event-right-info {
         align-items: flex-start !important;
     }

     .filter-item {
         min-width: 32%;
     }

     .episode-card .episode-card-image {
         max-width: 150px;
         max-height: 170px;
     }

     .event-top-wrapper {
         margin-bottom: 24px;
     }

     .event-slider img {
         max-width: 100%;
         margin: 0px auto -8px;
     }

     .event-top-wrapper .custom-slider-wrapper .slick-dots {
         position: absolute;
         bottom: -24px;
         width: 100%;
     }

     .help-content,
     .contact-form-box {
         width: 100% !important;
         border: 0px !important;
         padding: 0px !important;
     }

     .help-content ul li+li {
         margin-top: 8px;
     }

     .contact-form-box {
         margin-top: 24px !important;
     }

     .dash-card-image {
         width: 74px;
         height: auto;
     }

     /* Admin Header Starts */

     #impersonation-banner {
         top: auto !important;
         bottom: 0px;
     }

     #impersonation-banner~footer,
     #impersonation-banner~.middle-content-area footer {
         padding-bottom: 100px;
     }

     #impersonation-banner+.header-top,
     #impersonation-banner~header,
     #impersonation-banner~.sidebar,
     #impersonation-banner~.middle-content-area .header-top,
     #impersonation-banner~.middle-content-area header {
         top: 0px;
     }

     #impersonation-banner~.main-wrapper.pt-200 {
         padding-top: 100px !important;
     }

     #impersonation-banner~.middle-content-area .main-content.pt-130 {
         padding-top: 90px !important;
     }

     /* Admin Header Ends */

     .property-details {
         padding: 16px !important;
     }

     .property-info li {
         padding: 4px;
     }

 }

 @media screen and (max-width:576px) {

     .custom-navbar .navbar-brand img,
     .footer-logo img {
         max-width: 130px;
     }

     .profile-dropdown,
     .notification {
         top: 14px;
     }

     .footer-top {
         flex-direction: column;
         align-items: flex-start !important;
         gap: 24px !important;
     }

     .footer-nav ul {
         flex-direction: column;
         gap: 16px !important;
         align-items: flex-start !important;
     }

     .pt-150 {
         padding-top: 80px !important;
     }

     .property-details h3 {
         height: auto;
         margin-bottom: 10px !important;
     }

     .filter-wrap .btn,
     .custom-form .form-select,
     .custom-form .form-select:focus {
         max-width: 100%;
     }

     .card-item .card-body h3 {
         display: block;
     }

     .custom-modal,
     .lineup-modal {
         max-width: 94%;
     }

     .filter-item {
         min-width: 100%;
     }

     .episode-card {
         flex-direction: column;
     }

     .dash-card,
     .dash-event-button,
     .dash-progress,
     .dash-profile-card {
         flex-direction: column;
     }

     .dash-podcast {
         flex-direction: row;
     }

     .dash-card-content .course-progress {
         width: 100%;
     }

     .dash-card-content h3 {
         padding-right: 0px !important;
     }

     .dash-profile-card {
         gap: 24px;
     }

     .dash-profile-left,
     .dash-profile-right {
         width: 100% !important;
         border: 0px !important;
         padding: 0px !important;
     }

     /* Admin Header Starts */
     #impersonation-banner {
         flex-direction: column;
         text-align: center;
         gap: 6px;
     }

     /* Admin Header Ends */

     .login-form-wrap .login-image-box {
         max-width: 200px;
         position: relative;
         top: 0px;
         left: 0px;
     }

     .login-form {
         max-width: 100%;
     }

     .login-form {
         padding-top: 20%;
     }



 }

 @media screen and (max-width:350px) {}