/*******************
 * Reset style
 * *****************
 */

 @import url("https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,400;0,800;0,900;1,800&display=swap");
 /*@import "responsive.css";*/
 @import "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css";
 
 @font-face {
     font-family: "Poppins-Medium";
     src: url("fonts/Poppins-Medium.eot");
     src: url("fonts/Poppins-Medium.eot?#iefix") format("embedded-opentype"),
         url("fonts/Poppins-Medium.woff2") format("woff2"),
         url("fonts/Poppins-Medium.woff") format("woff"),
         url("fonts/Poppins-Medium.ttf") format("truetype"),
         url("fonts/Poppins-Medium.svg#Poppins-Medium") format("svg");
     font-weight: 500;
     font-style: normal;
     font-display: swap;
 }
 @font-face {
     font-family: "Poppins-SemiBold";
     src: url("fonts/Poppins-SemiBold.eot");
     src: url("fonts/Poppins-SemiBold.eot?#iefix") format("embedded-opentype"),
         url("fonts/Poppins-SemiBold.woff2") format("woff2"),
         url("fonts/Poppins-SemiBold.woff") format("woff"),
         url("fonts/Poppins-SemiBold.ttf") format("truetype"),
         url("fonts/Poppins-SemiBold.svg#Poppins-SemiBold") format("svg");
     font-weight: 600;
     font-style: normal;
     font-display: swap;
 }
 @font-face {
     font-family: "Poppins-Regular";
     src: url("fonts/Poppins-Regular.eot");
     src: url("fonts/Poppins-Regular.eot?#iefix") format("embedded-opentype"),
         url("fonts/Poppins-Regular.woff2") format("woff2"),
         url("fonts/Poppins-Regular.woff") format("woff"),
         url("fonts/Poppins-Regular.ttf") format("truetype"),
         url("fonts/Poppins-Regular.svg#Poppins-Regular") format("svg");
     font-weight: normal;
     font-style: normal;
     font-display: swap;
 }
 @font-face {
     font-family: "Poppins-Bold";
     src: url("fonts/Poppins-Bold.eot");
     src: url("fonts/Poppins-Bold.eot?#iefix") format("embedded-opentype"),
         url("fonts/Poppins-Bold.woff2") format("woff2"),
         url("fonts/Poppins-Bold.woff") format("woff"),
         url("fonts/Poppins-Bold.ttf") format("truetype"),
         url("fonts/Poppins-Bold.svg#Poppins-Bold") format("svg");
     font-weight: bold;
     font-style: normal;
     font-display: swap;
 }
 @font-face {
     font-family: "Poppins-Black";
     src: url("fonts/Poppins-Black.eot");
     src: url("fonts/Poppins-Black.eot?#iefix") format("embedded-opentype"),
         url("fonts/Poppins-Black.woff2") format("woff2"),
         url("fonts/Poppins-Black.woff") format("woff"),
         url("fonts/Poppins-Black.ttf") format("truetype"),
         url("fonts/Poppins-Black.svg#Poppins-Black") format("svg");
     font-weight: 900;
     font-style: normal;
     font-display: swap;
 }
 
 /* manrope-regular - latin */
 @font-face {
     font-family: "Manrope";
     font-style: normal;
     font-weight: 400;
     src: url("fonts/manrope/manrope-v13-latin-regular.eot"); /* IE9 Compat Modes */
     src: local(""),
         url("fonts/manrope/manrope-v13-latin-regular.eot?#iefix")
             format("embedded-opentype"),
         /* IE6-IE8 */ url("fonts/manrope/manrope-v13-latin-regular.woff2")
             format("woff2"),
         /* Super Modern Browsers */
             url("fonts/manrope/manrope-v13-latin-regular.woff") format("woff"),
         /* Modern Browsers */ url("fonts/manrope/manrope-v13-latin-regular.ttf")
             format("truetype"),
         /* Safari, Android, iOS */
             url("fonts/manrope/manrope-v13-latin-regular.svg#Manrope")
             format("svg"); /* Legacy iOS */
 }
 /* amethysta-regular - latin */
 @font-face {
     font-family: "Amethysta";
     font-style: normal;
     font-weight: 400;
     src: url("fonts/amethysta/amethysta-v16-latin-regular.eot"); /* IE9 Compat Modes */
     src: local(""),
         url("fonts/amethysta/amethysta-v16-latin-regular.eot?#iefix")
             format("embedded-opentype"),
         /* IE6-IE8 */ url("fonts/amethysta/amethysta-v16-latin-regular.woff2")
             format("woff2"),
         /* Super Modern Browsers */
             url("fonts/amethysta/amethysta-v16-latin-regular.woff")
             format("woff"),
         /* Modern Browsers */
             url("fonts/amethysta/amethysta-v16-latin-regular.ttf")
             format("truetype"),
         /* Safari, Android, iOS */
             url("fonts/amethysta/amethysta-v16-latin-regular.svg#Amethysta")
             format("svg"); /* Legacy iOS */
 }
 /* gfs-didot-regular - greek */
 @font-face {
     font-family: "GFS Didot";
     font-style: normal;
     font-weight: 400;
     src: url("fonts/didot/gfs-didot-v15-greek-regular.eot"); /* IE9 Compat Modes */
     src: local(""),
         url("fonts/didot/gfs-didot-v15-greek-regular.eot?#iefix")
             format("embedded-opentype"),
         /* IE6-IE8 */ url("fonts/didot/gfs-didot-v15-greek-regular.woff2")
             format("woff2"),
         /* Super Modern Browsers */
             url("fonts/didot/gfs-didot-v15-greek-regular.woff") format("woff"),
         /* Modern Browsers */ url("fonts/didot/gfs-didot-v15-greek-regular.ttf")
             format("truetype"),
         /* Safari, Android, iOS */
             url("fonts/didot/gfs-didot-v15-greek-regular.svg#GFSDidot")
             format("svg"); /* Legacy iOS */
 }
 
 /* beau-rivage-regular - latin */
 @font-face {
     font-family: "Beau Rivage";
     font-style: normal;
     font-weight: normal;
     src: url("fonts/beau-rivage/beau-rivage-v2-latin-regular.eot"); /* IE9 Compat Modes */
     src: local(""),
         url("fonts/beau-rivage/beau-rivage-v2-latin-regular.eot?#iefix")
             format("embedded-opentype"),
         /* IE6-IE8 */
             url("fonts/beau-rivage/beau-rivage-v2-latin-regular.woff2")
             format("woff2"),
         /* Super Modern Browsers */
             url("fonts/beau-rivage/beau-rivage-v2-latin-regular.woff")
             format("woff"),
         /* Modern Browsers */
             url("fonts/beau-rivage/beau-rivage-v2-latin-regular.ttf")
             format("truetype"),
         /* Safari, Android, iOS */
             url("fonts/beau-rivage/beau-rivage-v2-latin-regular.svg#BeauRivage")
             format("svg"); /* Legacy iOS */
 }
 
 *:not(
         .far,
         .fa,
         .fab,
         .fas,
         .fa-brands,
         .feather,
         .iconmoon,
         .bi,
         #rich-text-editor *
     ) {
     font-family: Manrope;
 }
 
 html,
 body {
     height: 100%;
     background: #0f0f12 !important;
 }
 li:not(#rich-text-editor li) {
     list-style: none;
 }
 input,
 button,
 textarea {
     outline: none;
     border: none;
 }
 select,
 button:focus,
 button:active,
 input,
 .page-link:focus {
     outline: none;
     box-shadow: none !important;
 }
 textarea {
     resize: none;
     box-shadow: none !important;
 }
 
 .btn:not(:disabled):not(.disabled):active,
 .btn:not(:disabled):not(.disabled).active,
 .btn.focus,
 .btn:focus {
     box-shadow: none !important;
 }
 
 a {
     outline: none;
 }
 
 body {
     font-family: "Barlow", Helvetica, Arial, sans-serif;
     color: #5f5f5f;
 }
 
 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
     font-weight: 800 !important;
 }
 
 .navbar-absolute {
     position: absolute;
     z-index: 1010;
     width: 100%;
 }
 
 iframe {
     border: 0;
     outline: 0;
     width: 100% !important;
 }
 [type="search"] {
     outline-offset: -2px;
     -webkit-appearance: none;
 }
 .btn:hover:not(.e-none) {
     transform: translateY(-1px);
     box-shadow: 0 7px 14px rgba(50, 50, 93, 0.1), 0 3px 6px rgba(0, 0, 0, 0.08);
 }
 input[type="file"] {
     opacity: 0;
     position: absolute;
     top: 0;
     right: 0;
     min-width: 100%;
     min-height: 100%;
     outline: none;
     cursor: inherit;
     font-size: 100px;
 }
 
 /* Carousel base class */
 .carousel {
     margin-bottom: 4rem;
 }
 /* Since positioning the image, we need to help out the caption */
 .carousel-caption {
     bottom: 7rem;
     z-index: 10;
 }
 /* Declare heights because of positioning of img element */
 .carousel-item {
     height: 38rem;
     background-color: #777;
 }
 .carousel-item > img {
     position: absolute;
     top: 0;
     left: 0;
     min-width: 100%;
     height: 32rem;
 }
 @media (min-width: 40em) {
     /* Bump up size of carousel content */
     .carousel-caption p {
         margin-bottom: 1.25rem;
         font-size: 1.25rem;
         line-height: 1.4;
     }
 }
 .card {
     border: 1px solid rgba(111, 111, 111, 0.125);
 }
 .noscroll {
     overflow-x: hidden;
     overflow-y: hidden;
 }
 .progress-xs {
     height: 8px;
 }
 
 /** NEW **/
 .lh-inherit {
     line-height: inherit !important;
 }
 input[type="file"] {
     opacity: 0;
     position: absolute;
     top: 0;
     right: 0;
     min-width: 100%;
     min-height: 100%;
     outline: none;
     cursor: inherit;
     font-size: 100px;
 }
 .text-featured {
     color: #ffc107 !important;
 }
 .popout {
     cursor: pointer;
     display: none;
     padding: 14px 10px;
     background: #000;
     color: rgb(255, 255, 255);
     font-size: 16px;
     position: fixed;
     z-index: 1100;
     overflow: hidden;
     width: 100%;
     text-align: center;
     left: 0;
     top: 0;
 }
 .popout-error {
     background: #f00 !important;
 }
 .fa-spin {
     -webkit-animation: fa-spin 1s infinite linear !important;
     animation: fa-spin 1s infinite linear !important;
 }
 
 .wrap-full-image {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     z-index: 1000000;
     /*background: #2C2C2C;*/
     width: 100%;
     height: 100%;
     text-align: center;
     display: none;
     padding: 10px 20px 20px 20px;
     overflow: auto;
 }
 
 img.imageFull {
     -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
     -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
     box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
     cursor: zoom-in;
     margin: 0 auto;
     position: relative;
 }
 .details-full-image {
     padding: 10px 0;
     color: #fff;
     text-align: right;
     margin-bottom: 30px;
     font-size: 25px;
 }
 .icon-close {
     font-size: 40px;
     line-height: 17px;
     width: 1.25rem;
     height: 1.25rem;
     transition: all 0.15s ease;
     color: #fff;
     border-radius: 50%;
     background-color: transparent;
     cursor: pointer;
     position: relative;
 }
 .viewFull {
     cursor: zoom-in;
 }
 .container-image {
     left: 0;
     position: fixed;
     width: 100%;
     height: 100%;
     top: 0;
     background: #252525a6;
 }
 .content-locked {
     background: #ececec;
 }
 .showBanner {
     position: fixed;
     z-index: 9999;
     background: rgba(0, 0, 0, 0.9);
     color: #fff;
     bottom: 0;
     padding: 10px;
 }
 .icon-equis {
     font-size: 25px;
     line-height: normal;
     width: 1.25rem;
     height: 1.25rem;
     transition: all 0.15s ease;
     border-radius: 50%;
     background-color: transparent;
     vertical-align: middle;
     margin-right: 5px;
 }
 .readmore-js-collapsed:after {
     content: "";
     position: absolute;
     bottom: 0;
     left: 0;
     width: 100%;
     height: 100px;
     background-color: hsla(0, 0%, 100%, 0);
     background-image: linear-gradient(hsla(0, 0%, 100%, 0), #fff 95%);
     z-index: 40;
 }
 .text-word-break {
     word-break: break-word;
 }
 .counterLike {
     font-size: 14px;
 }
 .post-options {
     font-size: 7px;
     margin-top: 15px;
 }
 .actionDelete {
     cursor: pointer;
 }
 a.active > i.fas.fa-heart {
     color: #f00;
 }
 
 .li-group {
     border-top: 1px solid rgba(0, 0, 0, 0.05);
 }
 .container-media .li-group:last-child {
     padding-bottom: 0 !important;
 }
 .notify {
     z-index: 10;
     top: 0;
     right: 0;
     position: absolute;
     padding: 3px 8px;
     background: var(--theme-dark-cta);
     color: #fff;
     line-height: normal;
     font-weight: bold;
     border-radius: 100px;
     -webkit-border-radius: 100px;
     border-bottom: 1px solid #dadada;
     font-size: 11px;
 }
 #noti_notifications,
 #noti_msg {
     display: none;
 }
 .c-pointer {
     cursor: pointer !important;
 }
 
 .animated-ellipsis-container {
     display: inline-block;
     height: 16px;
     width: 16px;
     transform: translateZ(0);
 }
 
 .animated-ellipsis {
     animation: ellipsis 1s infinite;
     display: inline-block;
     overflow: hidden;
     vertical-align: bottom;
 }
 
 @keyframes ellipsis {
     0% {
         width: 2px;
     }
     to {
         width: 16px;
     }
 }
 .cover-user:before {
     content: "";
     position: absolute;
     width: 100%;
     height: 100%;
     background: rgba(5, 5, 5, 0.4);
     left: 0;
     top: 0;
 }
 .video-responsive {
     position: relative;
     height: 0;
     overflow: hidden;
 }
 
 .video-responsive iframe,
 .video-responsive object,
 .video-responsive embed {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
 }
 .readmore-js-toggle {
     text-align: center;
 }
 .verify-notice {
     display: block;
     padding: 14px 10px;
     background: #f00;
     color: rgb(255, 255, 255);
     font-size: 16px;
     z-index: 1100;
     overflow: hidden;
     width: 100%;
     text-align: center;
     left: 0;
     bottom: 0;
 }
 .verified {
     color: #3897f0;
 }
 .border-dashed {
     border-style: dashed !important;
 }
 .video-js {
     width: 100%;
 }
 .StripeElement {
     box-sizing: border-box;
     height: calc(2.75rem + 2px);
     padding: 14px 18px;
     background-color: white;
     transition: box-shadow 0.15s ease;
     border: 1px solid #ced4da;
     margin-bottom: 10px;
     border-radius: 0.25rem;
 }
 
 .StripeElement--focus {
     border-color: #3c8dbc;
 }
 
 .StripeElement--invalid {
     border-color: #fa755a;
 }
 
 .StripeElement--webkit-autofill {
     background-color: #fefde5 !important;
 }
 .avatar-modal {
     border: 3px solid #fff;
     background-color: #fff;
 }
 .modal-offset {
     margin-top: -90px;
 }
 .display-none {
     display: none;
 }
 .display-block {
     display: block;
 }
 .blocked {
     position: absolute;
     width: 100%;
     height: 100%;
     background-color: rgba(255, 255, 255, 0.6);
     z-index: 300;
 }
 .blocked span {
     display: flex;
     justify-content: center;
     align-items: center;
 }
 .button-search {
     color: #ddd;
     background: none;
     position: absolute;
     right: 0;
     cursor: pointer;
     outline: none;
     border: none;
 }
 button:hover.button-search,
 button:focus.button-search,
 button:active.button-search {
     box-shadow: none !important;
     background: none !important;
     color: inherit !important;
     transform: none;
 }
 .input-search {
     border-radius: 60px;
     padding: 12px 20px !important;
     height: 40px !important;
 }
 
 .carousel-cover:before {
     content: "";
     position: absolute;
     width: 100%;
     height: 100%;
     background: rgba(5, 5, 5, 0.2);
     left: 0;
     top: 0;
 }
 .dropdown-toggle::after {
     margin-left: 0.1em;
     -webkit-transition: all 200ms linear;
     -moz-transition: all 200ms linear;
     -o-transition: all 200ms linear;
     -ms-transition: all 200ms linear;
     transition: all 200ms linear;
 }
 .dropdown-toggle[aria-expanded="true"]:after {
     filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
     -webkit-transform: rotate(180deg);
     -ms-transform: rotate(180deg);
     transform: rotate(180deg);
 }
 .p-nav a.nav-link:not(.btn) {
     color: #fff;
     -webkit-transition: all 200ms linear;
     -moz-transition: all 200ms linear;
     -o-transition: all 200ms linear;
     -ms-transition: all 200ms linear;
     transition: all 200ms linear;
 }
 .nav-link:hover:not(.search):not(.btn):not(.link-nav),
 .nav-link:active:not(.search):not(.btn):not(.link-nav),
 .nav-link:focus:not(.search):not(.btn):not(.link-nav) {
     color: #fff;
 }
 .link-scroll a.nav-link:not(.btn) {
     color: #3a3a3a;
 }
 .link-scroll a.nav-link:hover:not(.search):not(.btn),
 .link-scroll a.nav-link:active:not(.search):not(.btn),
 .link-scroll a.nav-link:focus:not(.search):not(.btn) {
     color: #969696;
 }
 
 .nav-link.search:hover,
 .nav-link.search:active,
 .nav-link.search:focus {
     color: #8f8f8f;
 }
 .dropdown-menu {
     padding-top: 0.5rem;
     padding-bottom: 0.5rem;
     border: 0;
     /*box-shadow: 0px 5px 50px 0px rgba(0, 0, 0, 0.15);*/
     border-radius: 0.125rem;
     -webkit-transition: all 150ms linear;
     -moz-transition: all 150ms linear;
     -o-transition: all 150ms linear;
     -ms-transition: all 150ms linear;
     transition: all 150ms linear;
     font-size: 13px;
     line-height: 18px;
 }
 .dd-menu:before {
     display: inline-block;
     position: absolute;
     width: 0;
     height: 0;
     vertical-align: middle;
     content: "";
     top: -5px;
     left: 10px;
     right: auto;
     color: #ffffff;
     border-bottom: 0.4em solid;
     border-right: 0.4em solid transparent;
     border-left: 0.4em solid transparent;
 }
 .dd-menu-user:before {
     display: inline-block;
     position: absolute;
     width: 0;
     height: 0;
     vertical-align: middle;
     content: "";
     top: -5px;
     right: 10px;
     left: auto;
     color: #ffffff;
     border-bottom: 0.4em solid;
     border-right: 0.4em solid transparent;
     border-left: 0.4em solid transparent;
 }
 .dropdown .dropdown-menu {
     /*-webkit-transform: translate3d(0, -25px, 0);*/
     /*-moz-transform: translate3d(0, -25px, 0);*/
     /*-o-transform: translate3d(0, -25px, 0);*/
     /*-ms-transform: translate3d(0, -25px, 0);*/
     /*transform: translate3d(0, -25px, 0);*/
     /*visibility: hidden;*/
     /*opacity: 0;*/
     /*filter: alpha(opacity=0);*/
     /*display: block;*/
 }
 .dropdown.show .dropdown-menu,
 .dropdown-menu.open {
     /*opacity: 1;*/
     /*filter: alpha(opacity=100);*/
     /*visibility: visible;*/
     /*-webkit-transform: translate3d(0, 0px, 0);*/
     /*-moz-transform: translate3d(0, 0px, 0);*/
     /*-o-transform: translate3d(0, 0px, 0);*/
     /*-ms-transform: translate3d(0, 0px, 0);*/
     /*transform: translate3d(0, 0px, 0);*/
 }
 .dropdown.show .dropdown-menu {
     /*-webkit-transform: translate3d(0, 7px, 0);*/
     /*-moz-transform: translate3d(0, 7px, 0);*/
     /*-o-transform: translate3d(0, 7px, 0);*/
     /*-ms-transform: translate3d(0, 7px, 0);*/
     /*transform: translate3d(0, 7px, 0);*/
 }
 .dropdown-toggle::after {
     /*margin-left: 0.1em;*/
     /*-webkit-transition: all 200ms linear;*/
     /*-moz-transition: all 200ms linear;*/
     /*-o-transition: all 200ms linear;*/
     /*-ms-transition: all 200ms linear;*/
     /*transition: all 200ms linear;*/
     display: none;
 }
 .dropdown-toggle[aria-expanded="true"]:after {
     /*filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);*/
     /*-webkit-transform: rotate(180deg);*/
     /*-ms-transform: rotate(180deg);*/
     /*transform: rotate(180deg);*/
     display: none;
 }
 .dropdown-toggle::after,
 .dropup .dropdown-toggle::after {
     /*font-weight: 400;*/
     /*font-style: normal;*/
     /*font-family: "Font Awesome 5 Free";*/
     /*font-weight: 900;*/
     /*border: none;*/
     /*content: "\f107";*/
     /*font-size: 14px;*/
     /*top: 50%;*/
     /*right: 24px;*/
     /*margin-top: -5px;*/
     /*vertical-align: baseline;*/
     display: none;
 }
 /* _button-group.scss:80 */
 .dropup,
 .dropright {
     margin-left: 0;
 }
 
 /* _dropdown.scss:43 */
 .dropup,
 .dropdown-menu {
     top: auto;
     bottom: 100%;
     margin-top: 0;
     margin-bottom: 5px;
 }
 
 .text-shadow-trans {
     text-shadow: 0 1px 4px #333333b3;
 }
 .navbar .nav-item {
     margin-left: 2px;
     margin-right: 2px;
 }
 .navbar .navbar-nav.cta-menu .nav-item:not(:first-of-type) {
     margin-left: 16px;
 }
 
 .sidebar-overlay .navbar .navbar-collapse {
     z-index: 100;
 }
 @media (min-width: 768px) {
     .py-large {
         padding-top: 6rem !important;
     }
     .py-large {
         padding-bottom: 6rem !important;
     }
 }
 /*** max-width 991 ***/
 @media (max-width: 991px) {
     .navbar .navbar-collapse {
         position: fixed;
         right: -100%;
         width: 100%;
         top: 0;
         height: 100%;
         background: #fff;
         z-index: 999999;
         overflow-y: scroll;
         -webkit-transition: all 0.25s ease-out;
         -o-transition: all 0.25s ease-out;
         transition: all 0.25s ease-out;
         padding: 15px;
     }
     .navbar .navbar-collapse .close-menu {
         color: #000;
         padding: 2px 4px;
         background: transparent;
         display: inline-block;
         cursor: pointer;
         font-size: 25px;
         text-align: center;
         font-weight: 100;
         text-decoration: none;
     }
     .dd-menu:before,
     .dd-menu-user:before {
         border: none;
     }
     .carousel-caption .display-4 {
         font-size: 3.1rem;
     }
     .item h5 {
         line-height: 1.2 !important;
     }
     .social-links {
         text-align: center !important;
         margin-top: 10px;
     }
     .list-social {
         float: none !important;
     }
     .copyright {
         text-align: center;
     }
     .btn-create {
         margin-top: 10px;
     }
     .navbar .navbar-collapse.show {
         right: 0;
     }
     .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:not(.btn) {
         color: #000000;
     }
     .input-search {
         border: 1px solid #c1c1c1 !important;
     }
     .navbar .navbar-nav .nav-item {
         display: block;
         width: 100%;
         margin-right: 0;
         margin-bottom: 0.25rem;
     }
     .navbar .navbar-nav .nav-item .nav-link {
         display: block;
         padding: 0.625rem;
     }
     .dropdown .dropdown-menu {
         display: none;
     }
     .dropdown.show .dropdown-menu,
     .dropdown-menu.open {
         display: block;
         box-shadow: none;
     }
     .home,
     .homepage {
         padding-bottom: 50px !important;
     }
     .homepage {
         padding-top: 100px !important;
     }
     .img-post {
         height: 250px !important;
     }
     .btn-w {
         width: 100%;
     }
     .btn-w-mb {
         width: 100%;
         margin-bottom: 10px;
     }
     .first {
         order: 1;
     }
     .second {
         order: 2;
     }
     .link-border {
         float: none !important;
     }
     .btn-profile {
         margin-bottom: 0.5rem !important;
     }
     .btn-profile,
     .w-small-100 {
         width: 100%;
     }
     .d-flex-user {
         display: inherit !important;
     }
     .navbar-collapse .navbar-toggler {
         position: relative;
         display: inline-block;
         width: 20px;
         height: 20px;
         padding: 0;
         cursor: pointer;
     }
     .navbar-collapse .navbar-toggler span {
         position: absolute;
         display: block;
         width: 100%;
         height: 2px;
         opacity: 1;
         border-radius: 2px;
         background: #283448;
     }
     .navbar-collapse .navbar-toggler :nth-child(1) {
         transform: rotate(135deg);
     }
     .navbar-collapse .navbar-toggler :nth-child(2) {
         transform: rotate(-135deg);
     }
     .section-sm {
         padding-bottom: 48px !important;
     }
     .avatar-chat {
         width: 25px;
         height: 25px;
     }
     .loading-name {
         width: 60% !important;
     }
     .loading-time {
         width: 40% !important;
     }
 }
 /* End 991px */
 .navbar-collapse {
     flex-basis: 100%;
     flex-grow: 1;
     align-items: center;
 }
 .navbar .navbar-nav .nav-item .nav-link:not(.btn).active {
     background: rgba(0, 0, 0, 0.2);
     border-radius: 50px;
 }
 
 [class^="ribbon-"] {
     position: absolute;
     margin-bottom: 80px;
 }
 [class^="ribbon-"]:before,
 [class^="ribbon-"]:after {
     content: "";
     position: absolute;
 }
 
 .ribbon-1 {
     width: 30px;
     height: 40px;
     background: #ff9800;
     top: -6px;
     left: 25px;
 }
 .ribbon-1:before {
     height: 0;
     width: 0;
     border-bottom: 6px solid #d07e05;
     border-right: 6px solid transparent;
     right: -6px;
 }
 .ribbon-1:after {
     height: 0;
     width: 0;
     border-left: 15px solid #ff9800;
     border-right: 15px solid #ff9800;
     border-bottom: 10px solid transparent;
     bottom: -10px;
 }
 .ribbon-1 i {
     position: absolute;
     top: 40%;
     left: 30%;
     color: #fff;
 }
 .item > a::after {
     content: "";
     display: block;
     background: rgba(0, 0, 0, 0.3);
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
 }
 .item h5 {
     line-height: 3;
     text-align: center;
     position: absolute;
     left: 0;
     width: 100%;
     top: 50%;
     margin-top: -30px;
     color: #fff;
     z-index: 5;
 }
 .owl-theme .owl-dots .owl-dot.active span,
 .owl-theme .owl-dots .owl-dot:hover span {
     background-color: transparent !important;
     transform: scale(0.9);
 }
 .owl-theme .owl-dots .owl-dot span {
     display: inline-block;
     width: 0.9375rem;
     height: 0.9375rem;
     box-sizing: border-box;
     border: 3px solid transparent;
     border-radius: 50%;
     transform: scale(0.6);
     transition: all 0.3s ease-in-out;
     opacity: 0.7;
 
     -webkit-transition: all 300ms linear;
     -moz-transition: all 300ms linear;
     -o-transition: all 300ms linear;
     -ms-transition: all 300ms linear;
     transition: all 300ms linear;
 }
 
 .bg-dark-2 {
     background-color: #1b1b1b;
 }
 .bg-dark-3 {
     background-color: #212121;
 }
 .link-footer,
 .ico-social {
     color: var(--theme-muted-text);
 }
 .btn-main:hover i {
     -webkit-transform: translateX(6px);
     transform: translateX(6px);
 }
 .btn-main i {
     -webkit-transform: translateX(0);
     transform: translateX(0);
     transition: -webkit-transform 0.3s ease;
     transition: transform 0.3s ease;
     transition: transform 0.3s ease, -webkit-transform 0.3s ease;
 }
 .btn {
     padding: 0.625rem 1.25rem;
 }
 .btn-sm,
 .btn-group-sm > .btn {
     font-size: 0.875rem;
     line-height: 1.5;
     padding: 0.25rem 0.5rem;
     border-radius: 0.25rem;
 }
 .jumbotron-cover:before {
     content: "";
     position: absolute;
     width: 100%;
     height: 100%;
     background: rgba(5, 5, 5, 0.3);
     left: 0;
     top: 0;
 }
 .custom-select {
     background: #fff
         url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23a5a5a5' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e")
         no-repeat right 0.75rem center/8px 10px;
 }
 main > div.section:nth-child(odd) {
     background-color: white;
 }
 main > div.section:nth-child(even) {
     background-color: #fbfafd !important;
 }
 .fixed-top {
     -webkit-transition: all 0.3s ease-out;
     -moz-transition: all 0.3s ease-out;
     -o-transition: all 0.3s ease-out;
     transition: all 0.3s ease-out;
 }
 .home {
     padding: 150px 0;
 }
 .homepage {
     padding: 180px 0;
 }
 .p-nav {
     padding: 1rem;
 }
 .p-nav-scroll {
     padding: 0.7rem !important;
 }
 .jumbotron {
     border-radius: 0 !important;
 }
 .img-user {
     width: auto !important;
     border-radius: 50%;
     margin: 0 auto;
     border: 5px solid #fff;
 }
 .ico-social {
     font-size: 20px;
 }
 a:hover.link-border {
     text-decoration: none;
 }
 a.link-border {
     border-bottom: 1px solid;
 }
 .card-cover {
     border-top-left-radius: 0.25rem;
     border-top-right-radius: 0.25rem;
     height: 135px;
     padding: 1rem;
 }
 .card-avatar {
     left: 50%;
     margin-left: -45px;
     position: absolute;
     top: 80px;
     background-color: #fff;
     border-radius: 50%;
 }
 .section-sm {
     padding: 78px 0;
 }
 .facebook-btn {
     color: #3e5c9b !important;
 }
 .twitter-btn {
     color: #1da1f2 !important;
 }
 .alert-success {
     background-color: #00a65a;
     border-color: #00a65a;
     color: #fff;
 }
 .alert-danger {
     color: #fff;
     background-color: #ff0000;
     border-color: #ff012a;
 }
 .alert-primary {
     color: #fff;
     border-color: #7889e8;
     background-color: #7889e8;
 }
 .alert-warning {
     color: #1f2d3d;
     background: #ffc107;
     border-color: #edb100;
 }
 .alert-dismissible .close {
     color: #fff;
     text-shadow: none;
 }
 .close {
     float: right;
     font-size: 15px;
     font-weight: 700;
     line-height: 1.5;
     color: #fff;
     text-shadow: none;
     opacity: 0.9;
 }
 .page-link:hover {
     color: #fff;
 }
 .page-link {
     border-radius: 35px !important;
     border: none;
     margin-right: 2px;
     -webkit-transition: all 0.2s linear;
     -moz-transition: all 0.2s linear;
     -o-transition: all 0.2s linear;
     -ms-transition: all 0.2s linear;
     transition: all 0.2s linear;
     height: 35px;
     min-width: 35px;
     text-align: center;
 }
 .nav-scroller {
     position: relative;
     z-index: 2;
     height: 3.5rem;
     overflow-y: hidden;
 }
 .nav-scroller .nav {
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: nowrap;
     flex-wrap: nowrap;
     padding-bottom: 1rem;
     margin-top: -1px;
     overflow-x: auto;
     text-align: center;
     white-space: nowrap;
     -webkit-overflow-scrolling: touch;
 }
 .nav-scroller-2::before {
     content: "";
     position: absolute;
     bottom: 0;
     left: 0;
     width: 2%;
     height: 100px;
     background-color: hsla(0, 0%, 100%, 0);
     background-image: linear-gradient(90deg, white, transparent);
     z-index: 40;
 }
 .nav-scroller-2::after {
     content: "";
     position: absolute;
     bottom: 0;
     right: 0;
     width: 2%;
     height: 100px;
     background-color: hsla(0, 0%, 100%, 0);
     background-image: linear-gradient(-90deg, white, transparent);
     z-index: 40;
 }
 .btn-category {
     -webkit-transition: all 0.2s linear;
     -moz-transition: all 0.2s linear;
     -o-transition: all 0.2s linear;
     -ms-transition: all 0.2s linear;
     transition: all 0.2s linear;
 }
 .btn-category:hover,
 .active-category {
     border-color: #333 !important;
 }
 .input-group-text {
     font-size: 1rem;
     font-weight: 400;
     line-height: 1.5;
     display: flex;
     margin-bottom: 0;
     padding: 0.625rem 0.75rem;
     text-align: center;
     white-space: nowrap;
     color: #adb5bd;
     border: 1px solid #cad1d7;
     border-radius: 10px;
     background-color: #fff;
     align-items: center;
 }
 .input-group-alternative .form-control,
 .input-group-alternative .input-group-text {
     border: 0;
     box-shadow: none;
 }
 .input-group-alternative {
     transition: box-shadow 0.15s ease;
     border: 0;
     box-shadow: 0 1px 3px rgba(50, 50, 93, 0.15), 0 1px 0 rgba(0, 0, 0, 0.02);
 }
 .form-control {
     height: calc(2.75rem + 2px);
     padding: 0.625rem 0.75rem;
 }
 .custom-control-input:not(:disabled):focus ~ .custom-control-label::before {
     box-shadow: none;
 }
 .custom-checkbox .custom-control-input ~ .custom-control-label,
 .custom-control-label {
     font-size: 0.875rem;
     cursor: pointer;
 }
 .custom-control-label:not(.switch)::before {
     position: absolute;
     top: 0.125rem;
     left: -1.75rem;
     display: block;
     width: 1.25rem;
     height: 1.25rem;
     content: "";
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
     pointer-events: none;
     background-color: #fff;
     box-shadow: none;
 }
 .custom-control-label::after {
     position: absolute;
     top: 0.125rem;
     left: -1.75rem;
     display: block;
     width: 1.25rem;
     height: 1.25rem;
     content: "";
     background-repeat: no-repeat;
     background-position: center center;
     background-size: 50% 50%;
 }
 .custom-control-label::before {
     box-shadow: 0 1px 3px rgba(50, 50, 93, 0.15), 0 1px 0 rgba(0, 0, 0, 0.02);
 }
 .input-group .form-control:not(:first-child) {
     padding-left: 0;
     border-left: 0;
 }
 .form-control:focus,
 .custom-select:focus {
     border-color: #ced4da !important;
     outline: 0;
     box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075),
         0 0 0 0 rgba(50, 151, 211, 0.5);
 }
 .btn-facebook,
 .btn-facebook:hover,
 .btn-facebook:active,
 .btn-facebook:focus {
     background: #3b579d;
     color: #ffffff;
 }
 .btn-google,
 .btn-google:hover,
 .btn-google:active,
 .btn-google:focus {
     background: #fff;
     border-color: #ccc;
     color: #333;
 }
 .shadow-custom {
     box-shadow: 0 5px 16px rgba(0, 9, 128, 0.05);
 }
 .btn-danger {
     color: #fff;
     border-color: #f5365c;
     background-color: #f5365c;
 }
 .nav-wrapper {
     padding: 1rem 0;
     border-top-left-radius: 0.25rem;
     border-top-right-radius: 0.25rem;
 }
 .nav-pills .nav-link {
     font-size: 0.875rem;
     font-weight: 500;
     padding: 0.75rem 1rem;
     transition: all 0.15s ease;
     color: #5e72e4;
     background-color: #fff;
     box-shadow: 0 4px 6px rgba(50, 50, 93, 0.11), 0 1px 3px rgba(0, 0, 0, 0.08);
 }
 .nav-pills .nav-item:not(:last-child) {
     padding-right: 1rem;
 }
 .dropdown-item.balance:hover {
     background: #fff !important;
     color: #212529;
 }
 .page-item.disabled .page-link {
     color: #9daebd;
 }
 .img-profile-user {
     margin-top: -100px !important;
 }
 .modal-danger .modal-content {
     color: #fff;
     background-color: #f5365c;
 }
 .modal-danger .modal-header,
 .modal-danger .modal-footer {
     border-color: rgba(255, 255, 255, 0.075);
 }
 .focused .form-control {
     border-color: rgba(50, 151, 211, 0.25);
 }
 .btn-white {
     color: #212529;
     border-color: #fff;
     background-color: #fff;
     box-shadow: 0 4px 6px rgba(50, 50, 93, 0.11), 0 1px 3px rgba(0, 0, 0, 0.08);
 }
 .btn-white:hover {
     color: #212529;
     border-color: white;
     background-color: white;
 }
 .text-muted {
     color: var(--theme-muted-text) !important;
 }
 .btn-sm,
 .btn-group-sm > .btn {
     font-size: 0.875rem;
     line-height: 1.5;
     padding: 0.5rem 1.8rem;
     border-radius: 0.25rem;
 }
 .btnLike:hover {
     text-decoration: none !important;
 }
 .bg-success {
     background-color: #2dce89 !important;
 }
 .nav-profile {
     border-bottom: 3px solid rgba(159, 163, 177, 0.07);
 }
 .nav-profile a,
 .nav-profile li.active a:hover,
 .nav-profile li.active a:active,
 .nav-profile li.active a:focus {
     color: #333;
 }
 .nav-profile a:hover {
     text-decoration: none;
 }
 .sm-btn-size {
     color: #333;
     font-weight: bold;
     font-size: 17px !important;
     line-height: 15px;
     text-align: center;
 }
 .font-icon-lg {
     font-size: 120px;
 }
 .d-flex-user {
     display: flex;
 }
 .link-share {
     font-size: 16px;
 }
 @media (min-width: 576px) {
     .modal-sm {
         max-width: 380px;
     }
 }
 .pb-lg,
 .py-lg {
     padding-bottom: 6rem !important;
 }
 .pt-lg,
 .py-lg {
     padding-top: 6rem !important;
 }
 .ico-no-result {
     color: #c5c5c5;
     border: 3px solid #c5c5c5;
     -webkit-border-radius: 50%;
     -webkit-background-clip: padding-box;
     -moz-border-radius: 50%;
     -moz-background-clip: padding;
     border-radius: 50%;
     font-size: 60px;
     width: 150px;
     height: 150px;
     display: block;
     line-height: 150px !important;
     margin: 0 auto;
 }
 .popout-success {
     background-color: #2dce89 !important;
 }
 .headerModalOverlay:before {
     content: "";
     position: absolute;
     width: 100%;
     background: rgba(5, 5, 5, 0.4);
     left: 0;
     top: 0;
     display: block;
     bottom: 0;
     border-top-left-radius: 3px;
     border-top-right-radius: 3px;
 }
 .avatar-wrap {
     width: 150px;
     height: 150px;
     overflow: hidden;
     border-radius: 50%;
     margin: 0 auto;
     background-color: #fff;
 }
 .progress-upload {
     position: absolute;
     top: 0;
     background: rgba(0, 0, 0, 0.7);
     border-radius: 50%;
     width: 100%;
     height: 100%;
     z-index: 2;
     color: #fff;
     line-height: 150px;
     display: none;
 }
 .btn-cover-upload {
     position: absolute;
     color: #fff;
     padding: 8px 25px;
     background: rgba(0, 0, 0, 0.5);
     left: 10px;
     bottom: 10px;
     z-index: 100;
 }
 .btn-cover-upload:hover,
 .btn-cover-upload:disabled {
     color: #fff;
     background: rgba(0, 0, 0, 0.8) !important;
 }
 
 .progress-upload-cover {
     position: absolute;
     bottom: 0;
     left: 0;
     height: 4px;
     background-color: #28a745;
     transition: width 0.6s ease;
 }
 .avatar-user-home {
     margin-top: -25px;
     border: 2px solid #fff;
     background-color: #fff;
 }
 .btn-upload {
     padding: 10px 12px;
     -webkit-transition: all 200ms linear;
     -moz-transition: all 200ms linear;
     -o-transition: all 200ms linear;
     -ms-transition: all 200ms linear;
     transition: all 200ms linear;
 }
 .btn-upload:hover {
     background-color: #171820;
 }
 .share-btn-user {
     font-size: 18px;
 }
 .user-online::before {
     background: #4caf50;
     position: absolute;
     border: 3px solid #fff;
     display: block;
     bottom: -3px;
     right: 0;
     content: "";
     border-radius: 50%;
     height: 30%;
     min-height: 30%;
     width: 30%;
     min-width: 30%;
 }
 .user-offline::before {
     background: #adadad;
     position: absolute;
     border: 3px solid #fff;
     display: block;
     bottom: -3px;
     right: 0;
     content: "";
     border-radius: 50%;
     height: 30%;
     min-height: 30%;
     width: 30%;
     min-width: 30%;
 }
 .user-online-profile::before {
     background: #4caf50;
     position: absolute;
     border: 3px solid #fff;
     display: block;
     bottom: 10px;
     right: 15px;
     content: "";
     border-radius: 50%;
     height: 12%;
     width: 12%;
 }
 .user-offline-profile::before {
     background: #adadad;
     position: absolute;
     border: 3px solid #fff;
     display: block;
     bottom: 10px;
     right: 15px;
     content: "";
     border-radius: 50%;
     height: 12%;
     width: 12%;
 }
 .overflow-visible {
     overflow: visible !important;
 }
 .message {
     padding: 6px 14px 7px !important;
     border-radius: 25px !important;
 }
 .message.media-container {
     padding-left: 0 !important;
     padding-right: 0 !important;
 }
 .message.bg-primary > a {
     color: #fff !important;
     text-decoration: underline !important;
 }
 .content::-webkit-scrollbar {
     display: none;
 }
 .d-scrollbars {
     scrollbar-width: none; /* Firefox */
     -ms-overflow-style: none; /* IE 10+ */
 }
 .input-new-msg {
     padding: 8px 34px !important;
     height: 40px !important;
 }
 .btn-new-msg {
     color: #ddd;
     background: none;
     position: absolute;
     outline: none;
     border: none;
     padding: 8px 0 8px 10px;
     left: 0;
 }
 .btn-cancel-msg {
     cursor: pointer;
     position: absolute;
     top: 4px;
     right: 0;
 }
 .rounded-bottom-left-0 {
     border-bottom-left-radius: 0 !important;
 }
 .rounded-bottom-right-0 {
     border-bottom-right-radius: 0 !important;
 }
 .btn-removeMsg {
     position: absolute;
     top: 20%;
     right: -18px;
     z-index: 3;
 }
 .container-media-img {
     background-position: center center;
     background-size: cover;
     max-width: 250px;
     max-height: 280px;
     width: 280px;
     height: 280px;
     border-radius: 6px;
 }
 .container-media-music {
     width: 100%;
     max-width: 400px;
     height: auto;
     border: 1px solid #ddd;
     border-radius: 6px;
 }
 .container-media-msg {
     width: 100%;
     max-width: 400px;
     max-height: 280px;
     height: 280px;
 }
 .img-user-small {
     width: auto !important;
     border-radius: 50%;
     margin: 0 auto;
     border: 3px solid #fff;
 }
 .icon-notifications {
     font-size: 19px;
     color: #c3c3c3;
 }
 .table thead th {
     vertical-align: bottom;
     border: none;
     padding-right: 1.5rem;
     padding-left: 1.5rem;
     color: #afafaf;
     font-size: 14px;
 }
 .table td,
 .table th {
     padding: 0.75rem;
     vertical-align: top;
     border: none;
     padding-right: 1.5rem;
     padding-left: 1.5rem;
     font-size: 14px;
 }
 .error-page h1 {
     font-size: 10rem;
     line-height: 9rem;
     font-weight: 700;
     color: #ec2522;
 }
 .wrap-center {
     position: absolute;
     width: 100%;
     top: 50%;
     left: 0;
     z-index: 20;
     -webkit-transform: translateY(-50%);
     -moz-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     -o-transform: translateY(-50%);
     transform: translateY(-50%);
 }
 .error-link {
     color: #ec2522;
 }
 .wrap-container {
     max-width: 550px;
     margin: 0 auto;
 }
 .wrap-container-lg {
     width: 650px;
     margin: 0 auto;
 }
 .font-tiny {
     font-size: 65% !important;
 }
 .item-loading::before {
     background-color: #f5f6f7;
     background-image: url("../img/loadpost.gif");
     background-repeat: repeat-y;
     background-size: 100% 1px;
     content: " ";
     display: block;
     height: 100%;
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     border-radius: 50%;
 }
 .loading-avatar {
     width: 60px;
     height: 60px;
     display: block;
     background-color: #f5f6f7;
     border-radius: 50%;
 }
 .loading-name {
     width: 25%;
     height: 10px;
     display: block;
     background-color: #f5f6f7;
 }
 .loading-time {
     width: 15%;
     height: 10px;
     display: block;
     margin-top: 8px;
     background-color: #f5f6f7;
 }
 .loading-text-1 {
     width: 85%;
     height: 10px;
     display: block;
     margin-top: 8px;
     background-color: #f5f6f7;
 }
 .loading-text-2 {
     width: 75%;
     height: 10px;
     display: block;
     margin-top: 8px;
     background-color: #f5f6f7;
 }
 .loading-text-3 {
     width: 55%;
     height: 10px;
     display: block;
     margin-top: 8px;
     background-color: #f5f6f7;
 }
 /* Large toggl switches */
 .custom-switch-lg .custom-control-label::before {
     left: -2.25rem;
     width: 3rem;
     border-radius: 1.5rem;
 }
 .custom-switch-lg .custom-control-label::after {
     top: calc(0.25rem + 3px);
     left: calc(-2.25rem + 4px);
     width: calc(1.5rem - 6px);
     height: calc(1.5rem - 6px);
     border-radius: 1.5rem;
 }
 .custom-switch-lg .custom-control-input:checked ~ .custom-control-label::after {
     transform: translateX(1.4rem);
 }
 .custom-switch-lg .custom-control-label::before {
     height: 1.5rem;
 }
 .custom-switch-lg .custom-control-label {
     padding-left: 1.5rem;
     line-height: 1.7rem;
 }
 .content-p img {
     max-width: 100% !important;
     height: auto !important;
 }
 .content-p li {
     list-style: inherit;
 }
 .content-p ol,
 .content-p ul {
     margin-top: 1rem;
     margin-bottom: 1rem;
 }
 .img-post {
     height: 430px;
 }
 .max-w-100 {
     max-width: 100px;
 }
 .max-w-125 {
     max-width: 125px;
 }
 .visibility-hidden {
     visibility: hidden;
 }
 .f-size-25 {
     font-size: 25px;
 }
 .f-size-20 {
     font-size: 20px;
 }
 
 .btn-primary:not(.btn-primary:disabled) {
     background-color: var(--theme-dark-cta) !important;
 }
 .menu-left-home li > a {
     font-size: 16px !important;
 }
 
 .font-50 {
     font-size: 50px !important;
 }
 .font-40 {
     font-size: 40px !important;
 }
 .font-30 {
     font-size: 30px !important;
 }
 .font-22 {
     font-size: 22px !important;
 }
 .font-25 {
     font-size: 25px !important;
 }
 .font-16 {
     font-size: 16px !important;
 }
 .font-15 {
     font-size: 15px !important;
 }
 .font-14 {
     font-size: 14px !important;
 }
 .font-13 {
     font-size: 13px !important;
 }
 .font-12 {
     font-size: 12px !important;
 }
 .font-11 {
     font-size: 11px !important;
 }
 .font-10 {
     font-size: 10px !important;
 }
 .font-18 {
     font-size: 18px !important;
 }
 .font-20 {
     font-size: 20px !important;
 }
 
 .w-10px {
     width: 10px;
 }
 .w-20px {
     width: 20px;
 }
 .w-25px {
     width: 25px;
 }
 .w-30px {
     width: 30px;
 }
 .w-50px {
     width: 50px;
 }
 .w-60px {
     width: 60px;
 }
 .w-80px {
     width: 80px;
 }
 .w-100px {
     width: 100px;
 }
 .w-150px {
     width: 150px;
 }
 .w-200px {
     width: 200px;
 }
 .w-250px {
     width: 250px;
 }
 .w-300px {
     width: 300px;
 }
 .w-350px {
     width: 350px;
 }
 .w-400px {
     width: 400px;
 }
 .h-10px {
     height: 10px;
 }
 .h-20px {
     height: 20px;
 }
 .h-25px {
     height: 25px;
 }
 .h-30px {
     height: 30px;
 }
 .h-50px {
     height: 50px;
 }
 .h-60px {
     height: 60px;
 }
 .h-75px {
     height: 75px;
 }
 .h-80px {
     height: 80px;
 }
 .h-100px {
     height: 100px;
 }
 .h-150px {
     height: 150px;
 }
 .h-200px {
     height: 200px;
 }
 .h-250px {
     height: 250px;
 }
 .h-300px {
     height: 300px;
 }
 .h-350px {
     height: 350px;
 }
 .h-400px {
     height: 400px;
 }
 .h-500px {
     height: 500px;
 }
 .h-600px {
     height: 600px;
 }
 .h-700px {
     height: 700px;
 }
 .mxw-20px {
     max-width: 20px;
 }
 .mnw-20px {
     min-width: 20px !important;
 }
 .mxw-25px {
     max-width: 25px;
 }
 .mnw-25px {
     min-width: 25px !important;
 }
 .mxw-40px {
     max-width: 40px;
 }
 .mnw-40px {
     min-width: 40px;
 }
 .mxw-200px {
     max-width: 200px;
 }
 .mnw-200px {
     min-width: 200px;
 }
 .mxw-300px {
     max-width: 300px;
 }
 .mnw-300px {
     min-width: 300px;
 }
 .mxw-400px {
     max-width: 400px;
 }
 .mnw-400px {
     min-width: 400px;
 }
 .mxw-500px {
     max-width: 500px;
 }
 .mnw-500px {
     min-width: 500px;
 }
 .mxw-600px {
     max-width: 600px;
 }
 .mnw-600px {
     min-width: 600px;
 }
 .mxw-150px {
     max-width: 150px;
 }
 .mnw-150px {
     min-width: 150px;
 }
 .mxw-100px {
     max-width: 100px;
 }
 .mnw-100px {
     min-width: 100px;
 }
 .mxw-75px {
     max-width: 75px;
 }
 .mnw-75px {
     min-width: 75px;
 }
 .mxw-50px {
     max-width: 50px;
 }
 .mnw-50px {
     min-width: 50px;
 }
 .mxw-100 {
     max-width: 100%;
 }
 .mnw-100 {
     min-width: 100%;
 }
 .mxw-75 {
     max-width: 75%;
 }
 .mnw-75 {
     min-width: 75%;
 }
 
 .mxh-200px {
     max-height: 200px;
 }
 .mnh-200px {
     min-height: 200px;
 }
 .mxh-250px {
     max-height: 250px;
 }
 .mnh-250px {
     min-height: 250px;
 }
 .mxh-300px {
     max-height: 300px;
 }
 .mnh-300px {
     min-height: 300px;
 }
 .mxh-400px {
     max-height: 400px;
 }
 .mnh-400px {
     min-height: 400px;
 }
 .mxh-450px {
     max-height: 450px;
 }
 .mnh-450px {
     min-height: 450px;
 }
 .mxh-500px {
     max-height: 500px;
 }
 .mnh-500px {
     min-height: 500px;
 }
 .mxh-600px {
     max-height: 600px;
 }
 .mnh-600px {
     min-height: 600px;
 }
 .mxh-700px {
     max-height: 700px;
 }
 .mnh-700px {
     min-height: 700px;
 }
 .mxh-800px {
     max-height: 800px;
 }
 .mnh-800px {
     min-height: 800px;
 }
 .mxh-100px {
     max-height: 100px;
 }
 .mnh-100px {
     min-height: 100px;
 }
 .mxh-75px {
     max-height: 75px;
 }
 .mnh-75px {
     min-height: 75px;
 }
 .mxh-50px {
     max-height: 50px;
 }
 .mnh-50px {
     min-height: 50px;
 }
 .mxh-40px {
     max-height: 40px;
 }
 .mnh-40px {
     min-height: 40px;
 }
 .mxh-100 {
     max-height: 100%;
 }
 .mnh-100 {
     min-height: 100%;
 }
 .mxh-100vh {
     max-height: 100vh;
 }
 .mnh-100vh {
     min-height: 100vh;
 }
 
 .mxh-100px {
     max-height: 100px;
 }
 .mnh-100px {
     min-height: 100px;
 }
 .mxh-150px {
     max-height: 150px;
 }
 .mnh-150px {
     min-height: 150px;
 }
 .mxh-200px {
     max-height: 200px;
 }
 .mnh-200px {
     min-height: 200px;
 }
 .mxh-300px {
     max-height: 300px;
 }
 .mnh-300px {
     min-height: 300px;
 }
 .mxh-100px {
     max-height: 100px;
 }
 .mnh-100px {
     min-height: 100px;
 }
 .mxh-75px {
     max-height: 75px;
 }
 .mnh-75px {
     min-height: 75px;
 }
 .mxh-50px {
     max-height: 50px;
 }
 .mnh-50px {
     min-height: 50px;
 }
 
 .square-150 {
     height: 150px;
     width: 150px;
     box-sizing: border-box;
 }
 .square-125 {
     height: 125px;
     width: 125px;
     box-sizing: border-box;
 }
 .square-100 {
     height: 100px;
     width: 100px;
     box-sizing: border-box;
 }
 .square-90 {
     height: 90px;
     width: 90px;
     box-sizing: border-box;
 }
 .square-75 {
     height: 75px;
     width: 75px;
     box-sizing: border-box;
 }
 .square-60 {
     height: 60px;
     width: 60px;
     box-sizing: border-box;
 }
 .square-50 {
     height: 50px;
     width: 50px;
     box-sizing: border-box;
 }
 .square-40 {
     height: 40px;
     width: 40px;
     box-sizing: border-box;
 }
 .square-30 {
     height: 30px;
     width: 30px;
     box-sizing: border-box;
 }
 .square-25 {
     height: 25px;
     width: 25px;
     box-sizing: border-box;
 }
 .square-15 {
     height: 15px;
     width: 15px;
     box-sizing: border-box;
 }
 .square-20 {
     height: 20px;
     width: 20px;
     box-sizing: border-box;
 }
 .square-10 {
     height: 10px;
     width: 10px;
     box-sizing: border-box;
 }
 
 .border-radius-50 {
     border-radius: 50% !important;
 }
 .border-radius-20px {
     border-radius: 20px !important;
 }
 .border-radius-15px {
     border-radius: 15px !important;
 }
 .border-radius-10px {
     border-radius: 10px !important;
 }
 .border-radius-5px {
     border-radius: 5px !important;
 }
 .border-radius-none {
     border-radius: 0 !important;
 }
 .border-radius-tl-bl-20px {
     border-radius: 20px 0 0 20px !important;
 }
 .border-radius-tr-br-20px {
     border-radius: 0 20px 20px 0 !important;
 }
 .border-radius-tl-tr-20px {
     border-radius: 20px 20px 0 0 !important;
 }
 
 .z-100 {
     z-index: 100;
 }
 .z-1000 {
     z-index: 1000;
 }
 
 .abs-bl-10-10 {
     position: absolute;
     bottom: 10px;
     left: 10px;
 }
 .abs-br-10-10 {
     position: absolute;
     bottom: 10px;
     right: 10px;
 }
 
 .noSelect {
     -webkit-touch-callout: none; /* iOS Safari */
     -webkit-user-select: none; /* Safari */
     -moz-user-select: none; /* Old versions of Firefox */
     -ms-user-select: none; /* Internet Explorer/Edge */
     user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
 }
 
 .inactiveMixin {
     content: "";
     position: absolute;
     display: block;
 }
 
 .beforeAnimation {
     transition: 0.2s cubic-bezier(0.24, 0, 0.5, 1);
 }
 
 .afterAnimation {
     box-shadow: 0 0 0 1px hsla(0, 0%, 0%, 0.1),
         0 4px 0px 0 hsla(0, 0%, 0%, 0.04), 0 4px 9px hsla(0, 0%, 0%, 0.13),
         0 3px 3px hsla(0, 0%, 0%, 0.05);
     transition: 0.35s cubic-bezier(0.54, 1.6, 0.5, 1);
 }
 
 .mobile-menu-box-container {
     width: 75%;
     margin: 1rem auto;
 }
 
 .mobile-menu-box-container *.mobile-menu-box-item {
     display: flex;
     flex-direction: row;
     flex-wrap: nowrap;
     justify-content: center;
     align-items: center;
 
     color: var(--white);
     border: 1px solid var(--white);
     font-size: 20px !important;
     width: 100%;
     padding: 0.75rem 0.25rem;
     margin: 1.5rem auto;
 }
 
 .mobile-menu-box-container *.mobile-menu-box-item:hover,
 .mobile-menu-box-container *.mobile-menu-box-item:active,
 .mobile-menu-box-container *.mobile-menu-box-item.active {
     background: var(--white) !important;
     border-color: var(--white) !important;
     color: var(--theme-dark-bg) !important;
 }
 
 .ctaLogin {
     border: 1px solid #fff;
     background-color: transparent;
 }
 .ctaLogin:hover,
 .ctaSignup:hover {
     background-color: #fff !important;
     color: #111111 !important;
 }
 
 .diploma-wrapper {
     width: 100%;
     padding: 10px;
     position: relative;
     background: url("images/white.jpg") repeat;
 }
 .diploma-horizontal-bg-line {
     width: 100%;
     padding: 0;
     height: 8px;
     position: relative;
     background: url("images/white.jpg") repeat center top;
 }
 
 .diploma-center-image-wrapper {
     background-image: url("../img/diploma-icon.png");
     background-size: contain; /* <------ */
     background-repeat: no-repeat;
     background-position: center center; /* optional, center the image */
 
     position: absolute;
     top: 0;
     bottom: 0;
     left: 0;
     right: 0;
     /*z-index: 0;*/
 }
 #course-text-content {
     z-index: 9999;
     position: relative;
     margin: 2rem 0;
 }
 
 #diploma-content-wrapper {
     width: 100%;
     color: var(--white);
     background: var(--theme-dark-bg);
     padding: 5rem 3rem 3rem 3rem;
 }
 
 .diploma-course-title {
     font-family: "GFS Didot" !important;
     font-size: 50px !important;
     text-transform: uppercase;
     white-space: nowrap !important;
 }
 .diploma-course-name {
     font-family: "Beau Rivage" !important;
     font-size: 50px !important;
     margin-bottom: 0;
 }
 
 .diploma-course-text {
     font-family: "Amethysta" !important;
     text-transform: uppercase;
     letter-spacing: 8px;
 }
 
 .diploma-course-bottom-text {
     font-family: "Manrope" !important;
     text-transform: uppercase;
     text-align: center;
     margin-top: 2rem;
 }
 
 .theme-btn {
     background: var(--white);
     color: var(--theme-dark-bg);
     padding: 0.25rem 0.75rem;
     cursor: pointer;
     border: 2px solid transparent;
 }
 .theme-btn:hover {
     opacity: 0.9;
     color: var(--theme-dark-bg) !important;
 }
 .theme-btn:active,
 .theme-btn-reversed:active {
     background: var(--white) !important;
     color: var(--theme-dark-bg) !important;
     border-color: transparent !important;
 
     box-shadow: inset 0 0 5px 1px var(--dark) !important;
     -webkit-box-shadow: inset 0 0 5px 1px var(--dark) !important;
 }
 .theme-btn.selected,
 .theme-btn-reversed.selected {
     background: var(--primary) !important;
     color: var(--white) !important;
     border-color: transparent !important;
 
     box-shadow: inset 0 0 5px 1px var(--dark) !important;
     -webkit-box-shadow: inset 0 0 5px 1px var(--dark) !important;
 }
 
 .theme-btn-reversed {
     background: var(--theme-dark-bg) !important;
     color: var(--white) !important;
     padding: 0.25rem 0.75rem;
     cursor: pointer;
     border: 2px solid var(--white) !important;
 }
 .theme-btn-reversed:hover {
     border-color: transparent !important;
     color: var(--theme-dark-bg) !important;
     background: var(--white) !important;
 }
 a.theme-btn,
 a.theme-btn-reversed {
     text-decoration: none !important;
 }
 .menu-display-lesson {
     /* border-left: 3px solid var(--white) !important; */
     margin-left: 0.3rem;
 }
 
 .menu-display-lesson .dummy-icon {
     color: transparent;
     user-select: none;
 }
 
 .menu-display-lesson .media-type-icon {
     margin-left: 0.7rem;
 }
 
 .text-primary-cta {
     color: var(--theme-dark-cta) !important;
 }
 
 .btn-chose-plan {
     width: 100%;
     border: 1px solid var(--gray);
     color: var(--dark);
     padding: 0.25rem 1rem;
 
     -webkit-box-shadow: 0 0 5px var(--gray);
     -moz-box-shadow: 0 0 5px var(--gray);
     box-shadow: 0 0 5px var(--gray);
 }
 
 .optional-plan.active {
     border-color: var(--theme-dark-cta) !important;
 }
 .optional-plan.active .choose-btn {
     border-color: var(--theme-dark-cta) !important;
     color: var(--theme-dark-cta) !important;
 }
 
 /*---------------------------------------------------------------------------------*/
 
 :root {
     /* --dark: #000; */
     --dark: #fff;
     --light: #8f8f8f;
     --lightest-gray: #20222c;
     --lightest-gray-old: #f9f9f9;
     --light-gray: #8f8f8f;
     --med-light-gray: #171820;
     --gray: #888;
     --dark-gray: #303135;
     --dark-theme: #171820;
     --dark-theme-second: #20222c;
 }
 .text-word-break.message {
     background-color: #20222c !important;
 }
 
 body {
     background: var(--dark-theme) !important;
     padding: 0;
 }
 *:not(#rich-text-editor *, font[color]) {
     color: var(--dark) !important;
 }
 * {
     color: var(--light);
 }
 
 .page-wrapper {
     /*overflow-x: hidden;*/
     /*min-height: 200vh;*/
     width: 100% !important;
 }
 
 a.menu-link-item * {
     color: var(--light-gray) !important;
 }
 a.menu-link-item:hover *,
 a.menu-link-item:active *,
 a.menu-link-item.active * {
     color: var(--dark-gray) !important;
 }
 
 .light-btn,
 .sweet-alert button.cancel {
     /* background: var(--light) !important; */
     background: var(--dark-theme-second) !important;
     color: var(--dark) !important;
     border-color: var(--dark) !important;
     border-width: 2px !important;
     text-align: center !important;
 }
 .dark-btn,
 .dark-btn-mobile-light {
     background: var(--dark-theme-second) !important;
     color: var(--light) !important;
     border-color: transparent !important;
     border-width: 2px !important;
     text-align: center !important;
 }
 .dark-btn *,
 .dark-btn-mobile-light * {
     color: var(--light) !important;
 }
 .lightest-gray-btn {
     /* background: var(--lightest-gray) !important; */
     background: var(--dark-theme-second) !important;
     color: var(--dark) !important;
     border-color: transparent !important;
     text-align: center !important;
 }
 .light-gray-btn {
     background: var(--light-gray) !important;
     color: var(--dark) !important;
     border-color: transparent !important;
     text-align: center !important;
 }
 .gray-btn {
     background: var(--gray) !important;
     color: var(--dark) !important;
     border-color: transparent !important;
     text-align: center !important;
 }
 
 input.theme,
 .input-group.input-theme,
 .input-group.input-theme * {
     /* background: var(--light) !important; */
     color: var(--light-gray) !important;
     border-color: var(--med-light-gray) !important;
 }
 
 .color-light {
     color: var(--light) !important;
 }
 /* .color-dark {color: var(--dark) !important;} */
 .color-dark {
     color: var(--light) !important;
 }
 .color-light-gray {
     color: var(--light-gray) !important;
 }
 .color-med-light-gray {
     color: var(--med-light-gray) !important;
 }
 .color-lightest-gray {
     color: var(--lightest-gray) !important;
 }
 .color-gray {
     color: var(--gray) !important;
 }
 .color-dark-gray {
     color: var(--dark-gray) !important;
 }
 
 /* .bg-light {background: var(--light) !important;} */
 .bg-light {
     background: var(--dark-theme) !important;
 }
 .bg-dark {
     background: var(--dark) !important;
 }
 /* .bg-light-gray {background: var(--light-gray) !important;} */
 .bg-light-gray {
     background: var(--dark-theme-second) !important;
 }
 /* .bg-med-light-gray {background: var(--med-light-gray) !important;} */
 .bg-med-light-gray {
     background: var(--dark-theme-second) !important;
 }
 /* .bg-lightest-gray {background: var(--lightest-gray) !important;} */
 .bg-lightest-gray {
     background: var(--dark-theme-second) !important;
 }
 .bg-gray {
     background: var(--gray) !important;
 }
 .bg-dark-gray {
     background: var(--dark-gray) !important;
 }
 
 .border-light {
     border-color: var(--light) !important;
 }
 .border-dark {
     border-color: var(--dark) !important;
 }
 .border-lightest-gray {
     border-color: var(--lightest-gray) !important;
 }
 .border-light-gray {
     border-color: var(--light-gray) !important;
 }
 .border-med-light-gray {
     border-color: var(--med-light-gray) !important;
 }
 .border-gray {
     border-color: var(--gray) !important;
 }
 .border-dark-gray {
     border-color: var(--dark-gray) !important;
 }
 
 .light-btn.selected {
     background: var(--dark) !important;
     color: var(--light) !important;
     border-color: transparent !important;
 }
 .light-btn.selected * {
     color: var(--light) !important;
 }
 
 .light-btn,
 .dark-btn,
 .light-gray-btn,
 .gray-btn,
 .lightest-gray-btn,
 .item-container-box,
 input:not(.input-group input),
 .sweet-alert button.cancel,
 .dark-btn-mobile-light {
     border-radius: 10px;
     border: 1px solid var(--med-light-gray);
     padding: 0.75rem;
 }
 .item-container-box {
     padding: 0.75rem 1rem;
     border: 1px solid var(--med-light-gray);
 }
 
 .light-btn,
 .dark-btn,
 .dark-btn-mobile-light,
 .light-gray-btn,
 .lightest-gray-btn,
 .gray-btn,
 .sweet-alert button.cancel {
     cursor: pointer;
 }
 .light-btn:hover,
 .light-btn:hover *,
 .dark-btn:hover,
 .dark-btn-mobile-light:hover,
 .dark-btn:hover *,
 .light-gray-btn:hover,
 .light-gray-btn:hover *,
 .gray-btn:hover,
 .gray-btn:hover *,
 .sweet-alert button.cancel:hover * {
     opacity: 0.9;
     text-decoration: none !important;
 }
 .lightest-gray-btn:hover,
 .lightest-gray-btn:hover * {
     opacity: 0.7;
     text-decoration: none !important;
 }
 .input-group input {
     border-radius: 0 10px 10px 0 !important;
     border: 1px solid currentColor;
     padding: 0.5rem;
 }
 
 .hideScrollBar::-webkit-scrollbar {
     display: none;
 }
 .hideScrollBar {
     -ms-overflow-style: none; /* IE and Edge */
     scrollbar-width: none; /* Firefox */
 }
 
 #max-size-image-container {
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     overflow: hidden;
     padding: 0;
 }
 
 #max-size-image-container {
     background-image: url(https://app.eduvo.io/public/img/Login.jpg);
     background-repeat: no-repeat;
     background-size: cover;
     background-position: bottom;
 }
 
 #max-size-image-container-plans {
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     overflow: hidden;
     padding: 0;
 }
 
 #max-size-image-container-plans {
     background-image: url(https://app.eduvo.io/public/img/advert/creator_1.jpg);
     background-repeat: no-repeat;
     background-size: cover;
     background-position: top;
 }
 
 #max-size-image-container-signup {
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     overflow: hidden;
     padding: 0;
 }
 
 #max-size-image-container-signup {
     background-image: url(https://app.eduvo.io/public/img/advert/pexels.jpg);
     background-repeat: no-repeat;
     background-size: cover;
     background-position: bottom;
 }
 
 .session-main-wrapper {
     width: 100%;
     min-height: 100vh;
     /*overflow-x: hidden;*/
     padding: 0;
     margin: 0;
 }
 
 .session-main-left-menu {
     width: 274px;
     height: 100%;
     position: fixed;
     border-right: 1px solid #444348 !important;
     /*padding: .75rem 1.5rem;*/
     background: #16171d;
     z-index: 1000;
 }
 
 .session-main-page-wrapper:not(.session-main-page-wrapper.visiting) {
     margin-left: 242px;
     width: calc(100% - 212px);
     padding: 0px 2rem;
     position: relative;
 }
 .session-main-page-wrapper.visiting {
     padding: 0 2rem;
     position: relative;
 }
 .session-main-mobile-footer {
     position: fixed;
     bottom: 0;
     left: 0;
     right: 0;
     height: 75px !important;
     margin: 0;
     padding: 0.25rem 0.5rem;
     background: linear-gradient(178.67deg, #1D1F27 -37.09%, #8034E0 392.09%);
     z-index: 999;     
 }

 
 #sidebar-top-nav {
     display: none;
 }
 .header-top-sizing {
     min-height: 75px;
     width: 100%;
     padding-top: 0.75rem;
 }
 header.main-creator-nav {
     border-bottom: 2px solid gray;
 }
 .session-main-left-menu #sidebar-logo #leftSidebarCloseBtn {
     display: none;
 }
 #leftSidebarCloseBtn {
     cursor: pointer;
     opacity: 0.7;
 }
 #leftSidebarCloseBtn:hover {
     opacity: 1;
 }
 
 .session-main-content-wrapper {
     width: 97%;
 
     padding-bottom: 6rem;
     margin-left: 20px;
     padding-top: 20px;
 }
 
 .input-group input,
 .input-group select {
     padding-left: 10px !important;
 }
 
 .menu-link-item {
     display: flex;
     flex-direction: row;
     flex-wrap: nowrap;
     justify-content: center;
     align-items: center;
     margin-left: 10%;
     margin-right: 10%;
     margin-bottom: 1.3rem;
     cursor: pointer;
 }
 .submenu-link-item {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: left;
    align-items: center;
    margin-left: 10%;
    margin-right: 10%;
    margin-bottom: 1.3rem;
    cursor: pointer;
    /* background: transparent !important;
    border: none !important; */
}
 .menu-link-item i {
     width: 25px;
 }
 .submenu-link-item i {
    width: 25px;
}
 .menu-link-item span {
     width: calc(100% - 25px - 0.5rem);
     font-size: 20px;
     margin-left: 0.8rem;
 }
 .submenu-link-item span {
    width: calc(100% - 100px - 0.5rem);
    font-size: 20px;
    margin-left: 0.8rem;
}
 
 .button-avatar-upload {
     color: #fff;
     width: 100%;
     padding: 8px;
     background: transparent !important;
     bottom: 0;
 }
 a:hover.button-avatar-upload {
     color: #fff;
     background: rgba(255, 255, 255, 0.6);
 }
 
 .tooltip-inner {
     color: var(--light) !important;
 }
 
 .modal-content,
 .modal-danger .modal-content,
 .custom-select,
 .form-control,
 .card,
 .card-footer,
 .list-group-item,
 .dropdown-menu,
 .input-group-text,
 .form-control:disabled,
 .input-group-text[disabled] {
     /* background-color: var(--light) !important; */
     background-color: var(--dark-theme-second) !important;
     color: var(--light-gray) !important;
 }
 .modal-content,
 .modal-danger .modal-content,
 .custom-select,
 .form-control,
 .form-control:disabled,
 .card,
 .list-group-item,
 .dropdown-menu,
 .input-group-text,
 .input-group-text[disabled] {
     border: 1px solid var(--med-light-gray);
 }
 .table-striped tbody tr:nth-of-type(odd) {
     background-color: transparent !important;
 }
 .table-striped tbody tr {
     border-top: 1px dashed var(--med-light-gray) !important;
 }
 
 .custom-select,
 .form-control:not(.form-control.border-0),
 .card-footer:not(.card-footer.border-top) .card,
 .dropdown-menu,
 .input-group-text {
     border: 1px solid var(--med-light-gray) !important;
 }
 .list-group-item:hover {
     background: var(--lightest-gray) !important;
 }
 /*.custom-select, .form-control:not(.form-control.border-0), .card-footer:not(.card-footer.border-top) .card, .list-group-item, .dropdown-menu, .input-group-text  {*/
 /*    border: 1px solid var(--med-light-gray) !important;*/
 /*}*/
 .card-footer.border-top {
     border-color: var(--med-light-gray) !important;
 }
 
 .hover-opacity-9:hover {
     opacity: 0.9;
 }
 .hover-opacity-8:hover {
     opacity: 0.8;
 }
 .hover-opacity-7:hover {
     opacity: 0.7;
 }
 .hover-bg-lighest-gray:hover {
     background: var(--lightest-gray) !important;
 }
 
 .course-menu-submodule,
 .course-menu-submodule * {
     color: var(--light-gray) !important;
     cursor: pointer;
 }
 .course-menu-submodule,
 .course-menu-submodule *,
 .course-menu-module,
 .course-menu-module * {
     color: var(--light-gray) !important;
 }
 
 .course-menu-module:hover:not(
         .course-module-add-more
     ).course-menu-module:hover:not(.course-module-add-more)
     *,
 .course-menu-submodule:hover:not(.course-module-add-more),
 .course-menu-submodule:hover:not(.course-module-add-more) * {
     color: var(--dark) !important;
 }
 
 .course-btn-element,
 .course-btn-element *,
 .openModuleMobileView,
 .openModuleMobileView * {
     color: var(--light-gray) !important;
 }
 .course-btn-element.course-btn-active,
 .course-btn-element.course-btn-active *,
 .openModuleMobileView.course-btn-active,
 .openModuleMobileView.course-btn-active * {
     color: var(--dark) !important;
 }
 
 .settings-menu-container,
 .settings-menu-container *:not(p:first-of-type) {
     color: var(--light-gray) !important;
 }
 .settings-menu-container .link-item a {
     cursor: pointer;
 }
 .settings-menu-container .link-item:hover *,
 .settings-menu-container .link-item.active * {
     color: var(--dark) !important;
 }
 
 #mediaItemBox {
     margin-left: 0 !important;
     opacity: 0;
     width: 0;
     max-width: 120px;
     transition: all 400ms ease;
     -webkit-transition: all 400ms ease;
     -moz-transition: all 400ms ease;
     pointer-events: none;
 }
 
 #mediaItemBox.itemBoxActive {
     width: auto;
     margin-left: 1rem !important;
     opacity: 1;
     pointer-events: auto;
 }
 
 /*#search-creators-form #searchCreatorNavbar {*/
 /*    background-color: transparent !important;*/
 /*    width: 0;*/
 /*    max-width: 230px;*/
 /*    transition: width 400ms ease;*/
 /*    -webkit-transition: width 400ms ease;*/
 /*    -moz-transition: width 400ms ease;*/
 /*}*/
 
 /*#search-creators-form.form-active #searchCreatorNavbar {*/
 /*    background-color: #474747 !important;*/
 /*    width: 230px;*/
 /*}*/
 
 /*@media (max-width: 350px) {*/
 /*    #search-creators-form.form-active #searchCreatorNavbar {*/
 /*        background-color: #474747 !important;*/
 /*        width: 180px;*/
 /*    }*/
 /*}*/
 /*@media (max-width: 450px) {*/
 /*    #search-creators-form.form-active #searchCreatorNavbar {*/
 /*        background-color: #474747 !important;*/
 /*        width: 200px;*/
 /*    }*/
 /*}*/
 
 #search-creators-form {
     position: relative;
 }
 
 #search-creators-form #searchCreatorNavbar {
     width: 230px;
 }
 #messageFilterInput,
 #search-creators-form #searchCreatorNavbar {
     background: #20222c !important;
     color: var(--light) !important;
     border: none !important;
 }
 
 .container-msg {
     overflow: hidden;
 }
 #contentDIV {
     overflow-y: auto;
 }
 
 .form-switch {
     display: inline-block;
     cursor: pointer;
     -webkit-tap-highlight-color: transparent;
 }
 .form-switch i {
     position: relative;
     display: inline-block;
     /*margin-right: .5rem;*/
     width: 40px;
     height: 17px;
     background-color: #cecece;
     border-radius: 20px;
     vertical-align: text-bottom;
     transition: all 0.3s linear;
 }
 .form-switch i::before {
     content: "";
     position: absolute;
     left: 0;
     width: 40px;
     height: 17px;
     background-color: transparent;
     border-radius: 20px;
     transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
     transition: all 0.25s linear;
 }
 .form-switch i::after {
     content: "";
     position: absolute;
     left: 0;
     width: 13px;
     height: 13px;
     background-color: #fff;
     border-radius: 8px;
     box-shadow: 0 2px 2px rgba(0, 0, 0, 0.24);
     transform: translate3d(2px, 2px, 0);
     transition: all 0.2s ease-in-out;
 }
 .form-switch:active i::after {
     width: 13px;
     transform: translate3d(2px, 2px, 0);
 }
 .form-switch:active input:checked + i::after {
     transform: translate3d(1px, 2px, 0);
 }
 .form-switch input {
     display: none;
 }
 .form-switch input:checked + i {
     background-color: #b1edd1;
 }
 .form-switch input:checked + i::before {
     transform: translate3d(15px, 2px, 0) scale3d(0, 0, 0);
 }
 .form-switch input:checked + i::after {
     transform: translate3d(25px, 2px, 0);
 }
 
 #course-content-menu > div,
 #course-content-menu .lesson-container > div {
     width: 100%;
 }
 .course-menu-module {
     padding: 0.5rem;
 }
 .course-menu-module:not(:first-of-type) {
     border-top: 1px solid #3e3d3d !important;
 }
 .course-menu-module *,
 .course-menu-submodule * {
     margin-bottom: 0 !important;
 }
 #course-content-menu .item-container-box {
     background-color: #20222c;
 }
 
 #course-content-menu .course-module-add-more {
     cursor: pointer;
     /*color: var(--theme-dark-cta);*/
 }
 #course-content-menu .lesson-container {
     margin-bottom: 1rem !important;
 }
 
 .courses-cover-thumb,
 .lesson-thumb {
     width: 100%;
     border: 2px dashed var(--med-light-gray);
     font-size: 18px;
     text-align: center;
     cursor: pointer;
     user-select: none;
     -webkit-transition: all 0.2s ease;
     transition: all 0.2s ease;
     min-height: 300px;
 }
 .courses-cover-thumb i,
 .courses-cover-thumb p {
     color: var(--dark);
 }
 
 .cursor-pointer {
     cursor: pointer;
 }
 
 .course-post-link-bar:hover {
     /* background: rgba(255,255,255, .1); */
 }
 
 .hover-underline:hover {
     text-decoration: underline;
 }
 .hover-cta-color:hover {
     color: var(--theme-dark-cta) !important;
 }
 .next-lesson-button:not(.disabled):hover,
 .previous-lesson-button:not(.disabled):hover {
     color: var(--dark);
     box-shadow: inset 0 0 5px 1px var(--dark);
     -webkit-box-shadow: inset 0 0 5px 1px var(--dark);
 }
 
 .next-lesson-button:not(.disabled):active,
 .previous-lesson-button:not(.disabled):active {
     color: var(--dark);
     box-shadow: inset 0 0 5px 1px var(--dark);
     -webkit-box-shadow: inset 0 0 5px 1px var(--dark);
 }
 
 .next-lesson-button.disabled,
 .previous-lesson-button.disabled {
     color: var(--theme-muted-text);
 }
 .next-lesson-button:not(.disabled),
 .previous-lesson-button:not(.disabled) {
     cursor: pointer;
 }
 
 .dropdown-item:focus,
 .dropdown-item:hover,
 .dropdown-item:hover * {
     color: var(--light) !important;
     background-color: var(--dark);
 }
 
 .select2-container--default
     .select2-selection--multiple
     .select2-selection__choice,
 .select2-container--default
     .select2-selection--multiple
     .select2-selection__choice__remove {
     /* background-color: var(--dark) !important; */
     background-color: #171820 !important;
     border: 1px solid transparent !important;
     color: #000 !important;
 }
 .select2-container--default
     .select2-selection--multiple
     .select2-selection__choice
     *,
 .select2-container--default
     .select2-selection--multiple
     .select2-selection__choice__remove
     * {
     color: var(--light) !important;
 }
 .select2-container--default,
 .select2-container--default .selection,
 .select2-container--default
     .selection
     .select2-selection
     .select2-selection--multiple,
 .select2-container--default
     .selection
     .select2-selection
     .select2-selection--multiple
     .select2-search,
 .select2-container--default
     .selection
     .select2-selection
     .select2-selection--multiple
     .select2-search
     * {
     background: var(--light) !important;
 }
 
 .table-hover tr:hover {
     background: var(--lightest-gray) !important;
 }
 
 .sweet-alert .sa-icon,
 .sweet-alert .sa-icon.sa-error,
 .sweet-alert .sa-line.sa-tip,
 .sweet-alert .sa-line.sa-long {
     border-color: var(--dark) !important;
 }
 .sweet-alert .sa-icon {
     border: 4px solid var(--dark) !important;
 }
 .sweet-alert .sa-icon.sa-error {
     border-color: #f27474 !important;
 }
 /* .sweet-alert .sa-icon.sa-error .sa-line {
     background-color: var(--dark) !important;
 } */
 .sweet-alert button.confirm {
     color: var(--light) !important;
 }
 
 #showErrorsLogin li {
     color: var(--light) !important;
 }
 
 .menu-options a {
     cursor: pointer;
 }
 .dropdown-divider {
     border-top: 1px solid var(--med-light-gray) !important;
 }
 #live-video-options a:hover * {
     color: var(--light) !important;
 }
 
 #live-chat-container {
     width: 100%;
     height: 100%;
     display: flex;
     flex-direction: column;
     flex-wrap: nowrap;
     justify-content: space-between;
 }
 #live-chat-msg-container {
     width: 96%;
     border-top: 1px solid var(--med-light-gray);
 }
 .button-like-live,
 .button-like-live *,
 #counterLiveLikes {
     color: var(--dark);
     font-size: 18px;
 }
 
 [data-href] {
     cursor: pointer;
 }
 
 #dropdownCreators {
     display: none;
     border: 1px solid var(--med-light-gray);
     border-radius: 3px;
     top: calc(100% + 2px);
     left: 0;
     right: 0;
     padding: 3px;
     position: absolute;
     z-index: 50;
     background: var(--light);
 }
 #dropdownCreators.show-custom-dropdown {
     display: block;
 }
 
 #course-completion-page #svg_curve text {
     width: 100%;
     fill: var(--dark);
     font-size: 59px;
     font-weight: bold;
     letter-spacing: 5px;
 }
 #course-completion-page #svg_curve path {
     fill: transparent;
 }
 
 #diploma,
 #diploma * {
     color: var(--light) !important;
 }
 .content-locked,
 .content-locked * {
     color: var(--light) !important;
 }
 
 .circular-progress {
     position: relative;
     height: 200px;
     width: 200px;
     border-radius: 50%;
     background: conic-gradient(var(--dark) 3.6deg, var(--light-gray) 0deg);
     display: flex;
     align-items: center;
     justify-content: center;
 
     /*box-shadow: inset 0 0 1px rgba(0,0,0, 0.7);*/
 }
 .circular-progress::before {
     content: "";
     position: absolute;
     height: 150px;
     width: 150px;
     border-radius: 50%;
     background: var(--light);
 }
 
 .circular-progress > .progress-value {
     position: relative;
     font-size: 30px;
     font-weight: 600;
     color: var(--dark);
 }
 
 .circular-progress.xl {
     width: 200px;
     height: 200px;
 }
 .circular-progress.xl::before {
     width: 150px;
     height: 150px;
 }
 .circular-progress.xl > .progress-value {
     font-size: 30px;
 }
 .circular-progress.lg {
     width: 150px;
     height: 150px;
 }
 .circular-progress.lg::before {
     width: 125px;
     height: 125px;
 }
 .circular-progress.lg > .progress-value {
     font-size: 22px;
 }
 
 .circular-progress.md {
     width: 100px;
     height: 100px;
 }
 .circular-progress.md::before {
     width: 75px;
     height: 75px;
 }
 .circular-progress.md > .progress-value {
     font-size: 17px;
 }
 
 .circular-progress.sm {
     width: 3rem;
     height: 3rem;
 }
 .circular-progress.sm::before {
     width: 2.5rem;
     height: 2.5rem;
 }
 .circular-progress.sm > .progress-value {
     font-size: 14px;
 }
 .nowrap {
     white-space: nowrap;
 }
 
 #rich-text-editor {
     background: var(--light);
     -webkit-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.25);
     box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.25);
     width: 100%;
     padding: 1rem;
     border: none;
     border-radius: 10px;
 }
 #rich-text-editor #rte-options {
     display: flex;
     flex-wrap: wrap;
     align-items: center;
     gap: 15px;
 }
 #rte-options button {
     height: 28px;
     width: 28px;
     display: grid;
     place-items: center;
     border-radius: 5px;
     border: none;
     background: var(--light);
     color: var(--dark);
     outline: none;
 }
 #rte-options select {
     padding: 7px;
     border: 1px solid var(--dark);
     border-radius: 5px;
 }
 #rte-options select,
 #rte-options label {
     font-family: "Poppins", Sans-Serif;
 }
 #rte-options label {
     margin-bottom: 0;
 }
 #rte-options .input-wrapper {
     display: flex;
     justify-content: center;
     flex-direction: row;
     align-items: center;
     gap: 8px;
 }
 #rte-options input[type="color"] {
     -webkit-appearance: none;
     -moz-appearance: none;
     appearance: none;
     background: transparent;
     width: 40px;
     height: 28px;
     border: none;
     cursor: pointer;
     padding: 0 !important;
 }
 #rte-options input[type="color"]::-webkit-color-swatch {
     border-radius: 15px !important;
     box-shadow: 0 0 0 2px var(--med-light-gray), 0 0 0 3px var(--dark) !important;
 }
 #rte-options input[type="color"]::-moz-color-swatch {
     border-radius: 15px !important;
     box-shadow: 0 0 0 2px var(--med-light-gray), 0 0 0 3px var(--dark) !important;
 }
 #rich-text-editor #text-input {
     margin-top: 10px;
     border: 1px solid var(--med-light-gray);
     padding: 20px;
     min-height: 40vh;
     max-height: 80vh;
     width: 100%;
 }
 #rte-options button.active {
     background: var(--med-light-gray);
 }
 
 /*no verify dashboard*/
 .dashboard-top {
     width: 100%;
     margin: 30px 0;
 }
 .timeline {
     width: 100%;
 }
 .timeline h6 {
     font-size: 24px;
     color: #000 !important;
     margin-bottom: 20px;
     font-family: "Poppins-SemiBold" !important;
     text-transform: capitalize;
 }
 .timeline h2 {
     font-size: 64px;
     color: #000 !important;
     margin-bottom: 20px;
     font-family: "Poppins-SemiBold" !important;
     line-height: 1;
 }
 .timeline p {
     font-size: 14px;
     line-height: 18px;
     color: #000 !important;
     margin-bottom: 20px;
     font-family: "Poppins-Regular" !important;
 }
 .timeline-chart {
     width: 100%;
     border: 1px solid #d2d2d2;
     padding: 10px;
     border-radius: 10px;
 }
 .timeline-chart img {
     width: 100%;
     height: 160px;
     object-fit: contain;
 }
 .timeline-chart a {
     width: 100%;
     min-height: 55px;
     background-color: #000;
     padding: 15px 60px;
     border-radius: 5px;
     text-decoration: none;
     color: #fff !important;
     font-size: 15px;
     font-family: "Poppins-SemiBold" !important;
     display: flex;
     flex-wrap: wrap;
     align-items: center;
     justify-content: center;
     line-height: 1;
     /* border: 1px solid #000; */
 }
 .timeline-chart a:hover {
     text-decoration: none;
     color: #000 !important;
     background-color: transparent;
 }
 .member-table {
     width: 100%;
     /* border: 1px solid #f9f9f9; */
     /* border-radius:10px; */
 }
 .member-table table {
     width: 100%;
 }
 .member-table table tr td {
     padding: 10px 8px 15px;
     vertical-align: middle;
     font-size: 12px;
     font-family: "Poppins-Regular" !important;
     /* color: #000 !important; */
 }
 .member-table table tr td img {
     width: 40px;
     height: 40px;
     border-radius: 50%;
     object-fit: cover;
 }
 .member-btn {
     width: auto;
     padding: 9px 14px;
     text-decoration: none;
     border-radius: 7px;
     /* border: 1px solid #8f8f8f; */
     font-size: 12px;
     font-family: "Poppins-Regular" !important;
     color: #8f8f8f !important;
     background-color: transparent;
     float: right;
 }
 
 .notification-badge {
     background-color: #d8bdf2;
     top: -6px;
     right: -16px;
     padding: 0.5em 0.6em;
 }
 
 .timeline-chart a.member-btn {
     min-height: auto;
     width: auto;
     padding: 9px 14px;
     text-decoration: none;
     border-radius: 7px;
     /* border: 1px solid #000; */
     font-size: 8px;
     font-family: "Poppins-Regular" !important;
     color: #8f8f8f !important;
     background-color: #171820 !important;
     line-height: 1;
     float: right;
 }
 
 .member-btn.green {
     background-color: #b1edd1;
     border-color: #b1edd1;
 }
 .member-btn.perple {
     background-color: #e4c9fe;
     border-color: #e4c9fe;
 }
 .member-btn:hover {
     text-decoration: none;
     background-color: #000;
     color: #fff !important;
 }
 .member-btn.green:hover,
 .member-btn.perple:hover {
     border-color: #000;
 }
 .title-main {
     width: 100%;
     display: flex;
     flex-wrap: wrap;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 10px;
 }
 .title-main h4 {
     color: #000 !important;
     font-size: 24px;
     font-family: "Poppins-SemiBold" !important;
 }
 .title-main a {
     color: #000 !important;
     font-size: 12px;
     font-family: "Poppins-Regular" !important;
     text-decoration: none;
 }
 .member-table table tr td:nth-child(3) {
     text-align: right;
 }
 .member-table table tr td:last-child {
     font-family: "Poppins-SemiBold" !important;
 }
 .available-table {
     margin: 25px 0;
 }
 .available-table .member-table table tr td {
     padding: 13px 30px 18px;
 }
 .available-table .member-table table tr td:first-child {
     width: 70px;
     padding-right: 0;
 }
 
 #chart2 .apexcharts-toolbar,
 #chart3 .apexcharts-toolbar,
 #chart4 .apexcharts-toolbar {
     display: none;
 }
 #chart2 .apexcharts-yaxis,
 #chart2 .apexcharts-xaxis,
 #chart3 .apexcharts-yaxis,
 #chart3 .apexcharts-xaxis,
 #chart4 .apexcharts-yaxis,
 #chart4 .apexcharts-xaxis {
     display: none;
 }
 .member-table table tr {
     /* background-color:#f9f9f9 !important; */
 }
 .member-table table tr:hover {
     /* background-color:#fff !important; */
 }
 .timeline-chart
     .apexcharts-tooltip.apexcharts-theme-light
     .apexcharts-tooltip-title {
     display: none;
 }
 .timeline-chart .apexcharts-tooltip-marker {
     display: none;
 }
 .timeline-chart .apexcharts-tooltip-y-group span {
     color: #fff !important;
 }
 .timeline-chart .apexcharts-tooltip.apexcharts-theme-light {
     background-color: #000;
     border: 1px solid #000;
 }
 .timeline-chart .apexcharts-xaxistooltip,
 #chart3 .apexcharts-xaxistooltip,
 #chart4 .apexcharts-xaxistooltip {
     display: none;
 }
 .timeline-chart .apexcharts-inner,
 #chart4 .apexcharts-inner {
     transform: scale(1.2);
 }
 .timeline-chart .apexcharts-yaxistooltip,
 #chart3 .apexcharts-yaxistooltip,
 #chart4 .apexcharts-yaxistooltip {
     display: none;
 }
 .member-table table tr:first-child {
     border: none !important;
 }
 .member-table table tr:first-child td:first-child {
     border-radius: 10px 0 0 0;
 }
 .member-table table tr:first-child td:last-child {
     border-radius: 0px 10px 0 0;
 }
 .member-table table tr:last-child td:first-child {
     border-radius: 0 0 0 10px;
 }
 .member-table table tr:last-child td:last-child {
     border-radius: 0 0 10px 0;
 }
 .member-two .member-table table tr td {
     padding: 9px 15px 18px;
 }
 .timeline-chart .chart {
     width: 100%;
 }
 .member-one.member-two .member-table {
     max-height: 330px;
     overflow-y: scroll;
 }
 .member-one.member-two .member-table::-webkit-scrollbar-track {
     -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
     background-color: #f5f5f5;
 }
 
 .gradient-color {
     background: linear-gradient(
         179.85deg,
         #1d1f27 0.13%,
         #8034e0 248.51%
     ) !important;
 }
 
 .member-one.member-two .member-table::-webkit-scrollbar {
     width: 5px;
     background-color: #f5f5f5;
 }
 
 .member-one.member-two .member-table::-webkit-scrollbar-thumb {
     background-color: #000000;
     border: 1px solid #555555;
 }
 
 .timeline-chart .chart {
     height: 230px;
 }
 .recent-table.member-table table tr td:last-child {
     width: 130px;
 }
 .member-table table tr td:first-child {
     width: 60px;
 }
 .navbar-bg-black-color-white {
     background-color: #20222c !important;
     display: flex;
     justify-content: center;
     align-items: center;
     color: #8f8f8f;
 }
 .icon-center-color-white {
     display: flex;
     justify-content: center;
     align-items: center;
     color: #8f8f8f !important;
 }
 .select2-container--default .select2-selection--multiple {
     background-color: #20222c !important;
     border: 1px solid #171820 !important;
 }
 #courseContent div .content-parent .coureseVideo {
     border-radius: 25px !important;
 }
 #courseContent div .content-parent .coureseVideo {
     border-radius: 25px !important;
 }
 .color-white-custom {
     color: #8f8f8f !important;
 }
 .session-main-left-menu .li-side-bar-selected {
     padding: 10px;
 }
 .session-main-left-menu .menu-link-item.active.li-side-bar-selected * {
     color: #000000;
 }
 .session-main-left-menu a.active {
     background-color: #303135;
 }
 a.menu-link-item.active.w-100.li-side-bar-selected:hover {
     text-decoration: none;
 }
 .session-main-left-menu a:hover {
     background-color: #303135;
     color: #fff !important;
     text-decoration: none;
     /* width: 100%; */
 }
 .session-main-left-menu a:hover span,
 .session-main-left-menu a:hover i,
 .session-main-left-menu a.active span,
 .session-main-left-menu a.active i {
     color: #fff !important;
 }
 
 .session-main-left-menu .menu-link-item {
     padding: 20px 38px;
     margin: 0;
     border-radius: 10px;
     /* background-color: #F9F9F9; */
     width: 250px !important;
     /* background-color: #F9F9F9; */
 }
 /* a.submenu-link-item::before{
    position: absolute;
    content: "";
    border-left: 1px solid #fff;
    left: 70px;
    background: transparent;
    color: transparent;
 } */
 div#education-submenu {
    max-width: 300px;
    width: 300px;
}
 .session-main-left-menu .submenu-link-item {
    padding: 10px;
    margin: 0;
    border-radius: 5px;
    /* background-color: #F9F9F9; */
    width: 190px !important;
    /* background-color: #F9F9F9; */
    position: relative;
    left: 60px;
}
 .rounded-15 {
     border-radius: 15px;
 }
 .session-main-left-menu .header-top-sizing {
     padding: 0.75rem 1.5rem;
 }
 #sidebar-body {
     margin: 0 25% 0 0;
 }
 
 #Educators {
     /*background-color: #F9F9F9;*/
     /*padding: 12px;*/
     border-radius: 10px;
     min-height: 310px;
 }
 .table-background-color {
     padding: 10px 5px;
     background-color: #e3e3e3;
 }
 #Educators .member-table.table-background-color tr {
     background-color: #e3e3e3 !important;
 }
 #Educators .member-table.table-background-color td {
     padding: 10px 8px 5px;
 }
 .background-light-gray {
     background-color: #f6f7f8 !important;
 }
 .border-radius-25 {
     border-radius: 25px;
 }
 .border-gray {
     border: 2px solid #dfdfe0;
 }
 #audiance-modal * {
     /* color: #8898aa; */
 }
 /*#audiance-modal * button{*/
 /*    color: #ffffff  !important ;*/
 /*}*/
 .coureses-modal-btn {
     background-color: #171820;
     color: #fff !important;
     /* border: 1px solid black; */
 }
 .custom-multiselect-button {
     background-color: #f0f0f0;
     border: 1px solid #ccc;
     color: #333;
     padding: 8px 12px;
     border-radius: 4px;
     cursor: pointer;
     width: 392px;
 }
 .custom-multiselect-button + .multiselect-container {
     border: 1px solid #ccc;
     border-top: none;
     border-radius: 0 0 4px 4px;
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
     width: 392px;
 }
 #myTable * {
     white-space: nowrap;
     color: #8898aa;
 }
 .custom-bg-gray-color {
     background-color: #20222c;
 }
 .border-rounded-15px {
     border-radius: 15px;
 }
 
 div.swal2-icon.swal2-warning {
     border-color: #fff !important;
 }
 
 .select2-container {
     background: #20222c !important;
 }
 span#select2-country-select-container {
     background: #20222c;
     line-height: 30px;
 }
 span.select2-selection.select2-selection--single {
     border: 0;
 }
 .select2-container--default .select2-results__option,
 .select2-container--default .select2-search--dropdown .select2-search__field,
 span.select2-search.select2-search--dropdown {
     background-color: #20222c;
 }
 .select2-container {
     border: 1px solid #171820;
     border-radius: 3px;
 }
 .swal2-popup {
     background: #171820;
 }



 /* START Inline CSS */

 .settings-menu-container{
    background: #8034e01a
 }

 /* END Inline CSS */