.testimonial-item * {
     transition: all 0.3s ease-in-out;
 }



 [dir="rtl"] {


     .custom_radio .checkmark:after {
         transform: translate(50%, -50%);
     }

     .main-nav>li .submenu>li.has-submenu>a::after {
         transform: translateY(-50%) scale(-1);
     }

     .owl-nav button.owl-next,
     .owl-nav button.owl-prev,
     .owl-carousel .owl-nav button.owl-next,
     .owl-carousel .owl-nav button.owl-prev {
         transform: scale(-1);
     }

     .status-toggle .check:checked+.checktoggle:after {
         transform: translate(calc(100% - -3px), -50%);
     }

     .status-toggle .checktoggle:after {
         transform: translate(3px, -50%);
         -webkit-transform: translate(-3px, -50%);
     }

     .custom_check .checkmark:after {
         transform: translateX(50%);
     }
 }

 :root {
     --primary: #eb7019;
     --secondary: #fd9238a3;
     --box-shadow: 0px 1px 2px #00000020;
     --success-color: #10b981;
     --warning-color: #f59e0b;
     --danger-color: #ef4444;
     --main-bg: #fbfbfb;
     /* menueer */
     --muneer-color: #eb7019 !important;
     --muneer-color-accent: #ffc69d !important;
     --muneer-color-transparent: #ffecdf !important;
     --muneer-text: #464646 !important;
     --muneer-btn-bg: #eb7019 !important;
     --muneer-btn-color-hover: #eb7019 !important;
     --muneer-color-dark: #f5712e;
 }

 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
     color: #1d1d1d;
 }

 h1 {
     font-size: 36px;
     font-weight: 700;
 }

 h2 {
     font-size: 30px;
     font-weight: 700;
 }

 h3 {
     font-size: 22px;
     font-weight: 600;
 }

 h4 {
     font-size: 20px;
     font-weight: 500;
 }

 h5 {
     font-size: 14px;
     font-weight: 500;
 }

 h6 {
     font-size: 13px;
     font-weight: 500;
 }

 a {
     color: #414141;
     text-decoration: none;
     font-weight: 500;
     transition: ease all 0.5s;
     -webkit-transition: ease all 0.5s;
     -ms-transition: ease all 0.5s;
 }

 p {
     font-weight: 400;
     color: #5d5d5d;
 }



 a:hover,
 a:focus {
     color: var(--primary);
     text-decoration: none;
     outline: none;
     transition: ease all 0.5s;
     -webkit-transition: ease all 0.5s;
     -ms-transition: ease all 0.5s;
 }

 button:focus {
     outline: 0;
 }

 ul {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 /*-----------------
    2. Bootstrap Classes
-----------------------*/

 .btn.focus,
 .btn:focus {
     box-shadow: none;
 }

 .btn.btn-white {
     background: #fff;
     border: 1px solid #fff;
     color: #1c0828;
     box-shadow: var(--box-shadow);
     border-radius: 10px;
     font-weight: 600;
     font-size: 13px;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 .btn-primary {
     background: linear-gradient(to top, #ffa153 0%, #fa6336 100%);
     border-radius: 10px;
     border: 1px solid var(--primary);
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
     padding: 8px 18px;
     color: #ffffff;
     font-weight: 600;
     font-size: 14px;
     display: inline-flex;
     align-items: center;
     justify-content: center;
 }

 .btn-primary:hover,
 .btn-primary.active,
 .btn-primary:active,
 .open>.dropdown-toggle.btn-primary {
     background: var(--secondary);
     border: 1px solid var(--secondary);
     color: #fff;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 input::-webkit-outer-spin-button,
 input::-webkit-inner-spin-button {
     -webkit-appearance: none;
     margin: 0;
 }

 /* Firefox */
 input[type="number"] {
     -moz-appearance: textfield;
     color: var(--bs-gray-700);
     appearance: none;
     padding: 0.75rem 1rem;
     border: 1px solid var(--bs-gray-300);
     border-radius: 0.65rem;
     transition:
         border-color 0.15s ease-in-out,
         box-shadow 0.15s ease-in-out;
     height: 48px;
     line-height: 32px;
     width: 100%;
 }

 .btn-primary.active.focus,
 .btn-primary.active:focus,
 .btn-primary.active:hover,
 .btn-primary.focus:active,
 .btn-primary:active:focus,
 .btn-primary:active:hover,
 .btn-primary:focus,
 .open>.dropdown-toggle.btn-primary.focus,
 .open>.dropdown-toggle.btn-primary:focus,
 .open>.dropdown-toggle.btn-primary:hover {
     background-color: var(--secondary);
     border: 1px solid var(--secondary);
     box-shadow: var(--box-shadow);
     color: #fff !important;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 .btn-primary.active:not(:disabled):not(.disabled),
 .btn-primary:active:not(:disabled):not(.disabled),
 .show>.btn-primary.dropdown-toggle {
     background-color: var(--primary);
     border: 1px solid var(--primary);
     box-shadow: var(--box-shadow);
     color: #fff;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 .btn-primary.active:focus:not(:disabled):not(.disabled),
 .btn-primary:active:focus:not(:disabled):not(.disabled),
 .show>.btn-primary.dropdown-toggle:focus {
     box-shadow: unset;
 }

 .btn-primary.disabled,
 .btn-primary:disabled {
     background-color: var(--primary);
     border: 1px solid var(--primary);
     box-shadow: var(--box-shadow);
     color: #fff;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 .btn-outline-primary {
     background-color: #fff;
     border: 1px solid var(--primary);
     color: var(--primary);
     box-shadow: var(--box-shadow);
     border-radius: 5px;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 .btn-outline-primary:hover,
 .btn-outline-primary:focus,
 .btn-outline-primary.active,
 .btn-outline-primary:active,
 .open>.dropdown-toggle.btn-primary {
     background-color: var(--primary);
     border: 1px solid var(--primary);
     box-shadow: var(--box-shadow);
     color: #fff;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 .btn-outline-primary.active.focus,
 .btn-outline-primary.active:focus,
 .btn-outline-primary.active:hover,
 .btn-outline-primary.focus:active,
 .btn-outline-primary:active:focus,
 .btn-outline-primary:active:hover,
 .open>.dropdown-toggle.btn-outline-primary.focus,
 .open>.dropdown-toggle.btn-outline-primary:focus,
 .open>.dropdown-toggle.btn-outline-primary:hover {
     background-color: var(--primary);
     border: 1px solid var(--primary);
     box-shadow: var(--box-shadow);
     color: #fff;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 .btn-secondary-one {
     border-radius: 5px;
     border: 2px solid var(--black-10, #fff);
     background: rgba(255, 255, 255, 0.15);
     text-transform: capitalize;
     color: #fff;
     font-weight: 600;
     font-size: 14px;
     padding: 10px 20px;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 .btn.btn-sm {
     padding: 2px 7px;
     font-size: 13px;
     border-radius: 5px;
 }

 .btn-secondary {
     background: var(--secondary);
     border: 1px solid var(--secondary);
     border-radius: 10px;
     color: var(--primary);
     font-weight: 600;
     font-size: 14px;
     padding: 10px 20px;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
     display: inline-flex;
     align-items: center;
 }

 .btn-secondary-one:hover {
     background-color: #fff;
     border: 2px solid #1c0828;
     color: #1c0828;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 .btn-secondary:hover,
 .btn-secondary:focus,
 .btn-secondary.active,
 .btn-secondary:active,
 .open>.dropdown-toggle.btn-secondary {
     background-color: rgba(255, 212, 182, 1);
     border: 1px solid rgba(255, 212, 182, 1);
     color: var(--primary);
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 .btn-secondary.active.focus,
 .btn-secondary.active:focus,
 .btn-secondary.active:hover,
 .btn-secondary.focus:active,
 .btn-secondary:active:focus,
 .btn-secondary:active:hover,
 .open>.dropdown-toggle.btn-secondary.focus,
 .open>.dropdown-toggle.btn-secondary:focus,
 .open>.dropdown-toggle.btn-secondary:hover {
     background-color: #fff;
     border: 1px solid #1c0828;
     box-shadow: var(--box-shadow);
     color: #1c0828;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 .btn-secondary.active:not(:disabled):not(.disabled),
 .btn-secondary:active:not(:disabled):not(.disabled),
 .show>.btn-secondary.dropdown-toggle {
     background-color: #1c0828;
     border-color: #1c0828;
     color: #fff;
 }

 .btn-secondary.active:focus:not(:disabled):not(.disabled),
 .btn-secondary:active:focus:not(:disabled):not(.disabled),
 .show>.btn-secondary.dropdown-toggle:focus {
     box-shadow: unset;
 }

 .btn-secondary.disabled,
 .btn-secondary:disabled {
     background-color: #1c0828;
     border-color: #1c0828;
     color: #fff;
 }

 .btn-secondary.active:not(:disabled):not(.disabled),
 .btn-secondary:active:not(:disabled):not(.disabled),
 .show>.btn-secondary.dropdown-toggle {
     background-color: var(--secondary);
     border-color: var(--secondary);
     color: var(--primary);
 }

 .btn-secondary.active:focus:not(:disabled):not(.disabled),
 .btn-secondary:active:focus:not(:disabled):not(.disabled),
 .show>.btn-secondary.dropdown-toggle:focus {
     box-shadow: unset;
 }

 .btn-secondary.disabled,
 .btn-secondary:disabled {
     background-color: var(--secondary);
     border-color: var(--secondary);
     color: var(--primary);
 }

 .btn-secondary-outline {
     background: #f7f7ff;
     border: 1px solid var(--primary);
     color: var(--primary);
     border-radius: 4px;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 .btn-secondary-outline:hover {
     background-color: var(--primary);
     border: 1px solid var(--primary);
     box-shadow: var(--box-shadow);
     color: #fff;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 .btn-danger {
     background: #e82646;
     border-radius: 10px;
     border: 1px solid #e82646;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
     padding: 8px 15px;
     color: #fff;
     font-weight: 600;
     display: inline-flex;
     align-items: center;
     justify-content: center;
 }

 .form-group {
     margin-bottom: 1rem;
 }

 label {
     display: inline-block;
     margin-bottom: 0.5rem;
     color: #828282;
     font-size: 12px;
 }

 .form-control {
     padding: 6px 15px;
     border-radius: 5px;
 }

 .form-control:focus {
     border-color: #bbb;
     box-shadow: none;
     outline: 0 none;
 }

 .text-body {
     color: #74788d !important;
 }

 .pagination>ul li.arrow a {
     background: #f1f1f1;
     font-size: 16px;
     margin: 0 9px;
 }

 .pagination>ul li.active a {
     background: var(--primary);
     border-color: var(--primary);
     color: #fff;
 }

 .card {
     background: #fff;
     border-radius: 10px;
     border: none;
     box-shadow: var(--box-shadow);
     margin-bottom: 24px;
 }

 .card .card-header {
     background-color: transparent;
 }

 .card .card-body {
     padding: 20px;
 }

 .table {
     margin-bottom: 0;
 }

 .bg-info {
     background-color: #1170e4 !important;
 }

 .bg-success {
     background-color: #1abe17 !important;
 }

 /*-----------------
	3. Avatar
-----------------------*/

 .avatar {
     position: relative;
     display: inline-block;
     width: 3rem;
     height: 3rem;
 }

 .avatar>img {
     width: 100%;
     height: 100%;
     -o-object-fit: cover;
     object-fit: cover;
 }

 .avatar-title {
     width: 100%;
     height: 100%;
     background-color: #20c0f3;
     color: #fff;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .avatar-away::before,
 .avatar-offline::before,
 .avatar-online::before {
     position: absolute;
     inset-inline-end: 0;
     bottom: 0;
     width: 25%;
     height: 25%;
     border-radius: 50%;
     content: "";
     border: 2px solid #fff;
 }

 .avatar-online::before {
     background-color: #0c9e6f;
 }

 .avatar-away::before {
     background-color: #ffbc34;
 }

 .avatar .border {
     border-width: 3px !important;
 }

 .avatar .rounded {
     border-radius: 6px !important;
 }

 .avatar .avatar-title {
     font-size: 16px;
 }

 .avatar-xs {
     width: 29px;
     height: 29px;
 }

 .avatar-xs .border {
     border-width: 2px !important;
 }

 .avatar-xs .rounded {
     border-radius: 4px !important;
 }

 .avatar-xs .avatar-title {
     font-size: 10px;
 }

 .avatar-xs.avatar-away::before,
 .avatar-xs.avatar-offline::before,
 .avatar-xs.avatar-online::before {
     border-width: 1px;
 }

 .avatar-sm {
     width: 2.5rem;
     height: 2.5rem;
 }

 .avatar-sm .border {
     border-width: 3px !important;
 }

 .avatar-sm .rounded {
     border-radius: 4px !important;
 }

 .avatar-sm .avatar-title {
     font-size: 14px;
 }

 .avatar-sm.avatar-away::before,
 .avatar-sm.avatar-offline::before,
 .avatar-sm.avatar-online::before {
     border-width: 2px;
 }

 .avatar-lg {
     width: 3.75rem;
     height: 3.75rem;
 }

 .avatar-lg .border {
     border-width: 3px !important;
 }

 .avatar-lg .rounded {
     border-radius: 8px !important;
 }

 .avatar-lg .avatar-title {
     font-size: 22px;
 }

 .avatar-lg.avatar-away::before,
 .avatar-lg.avatar-offline::before,
 .avatar-lg.avatar-online::before {
     border-width: 3px;
 }

 textarea {
     resize: none;
 }

 /*-----------------
	4. Nav Tabs
-----------------------*/

 .nav-tabs {
     border-bottom: 1px solid #f0f0f0;
 }

 .nav-tabs>li>a {
     margin-inline-end: 0;
     color: #888;
     border-radius: 0;
 }

 .nav-tabs>li>a:hover,
 .nav-tabs>li>a:focus {
     border-color: transparent;
     color: #272b41;
 }

 .nav-tabs.nav-tabs-solid>li>a {
     color: #272b41;
 }

 .nav-tabs.nav-tabs-solid>.active>a,
 .nav-tabs.nav-tabs-solid>.active>a:hover,
 .nav-tabs.nav-tabs-solid>.active>a:focus {
     background-color: var(--primary);
     border-color: var(--primary);
     color: #fff;
 }

 .tab-content {
     padding-top: 0;
 }

 .nav-tabs .nav-link {
     border-radius: 0;
 }

 .nav-tabs .nav-link:focus,
 .nav-tabs .nav-link:hover {
     background-color: #eee;
     border-color: transparent;
     color: #272b41;
 }

 .nav-link:focus,
 .nav-link:hover {
     color: var(--primary);
 }

 .nav-tabs.nav-justified>li>a {
     border-radius: 0;
     margin-bottom: 0;
 }

 .nav-tabs.nav-justified>li>a:hover,
 .nav-tabs.nav-justified>li>a:focus {
     border-bottom-color: #ddd;
 }

 .nav-tabs.nav-justified.nav-tabs-solid>li>a {
     border-color: transparent;
 }

 .nav-tabs.nav-tabs-solid>li>a {
     color: #272b41;
 }

 .nav-tabs.nav-tabs-solid>li>a.active,
 .nav-tabs.nav-tabs-solid>li>a.active:hover,
 .nav-tabs.nav-tabs-solid>li>a.active:focus {
     background-color: var(--primary);
     border-color: var(--primary);
     color: #fff;
 }

 .nav-tabs.nav-tabs-solid.nav-tabs-rounded {
     border-radius: 50px;
 }

 .nav-tabs.nav-tabs-solid.nav-tabs-rounded>li>a {
     border-radius: 50px;
 }

 .nav-tabs.nav-tabs-solid.nav-tabs-rounded>li>a.active,
 .nav-tabs.nav-tabs-solid.nav-tabs-rounded>li>a.active:hover,
 .nav-tabs.nav-tabs-solid.nav-tabs-rounded>li>a.active:focus {
     border-radius: 50px;
 }

 .nav-tabs-justified>li>a {
     border-radius: 0;
     margin-bottom: 0;
 }

 .nav-tabs-justified>li>a:hover,
 .nav-tabs-justified>li>a:focus {
     border-bottom-color: #ddd;
 }

 .nav-tabs-justified.nav-tabs-solid>li>a {
     border-color: transparent;
 }

 .nav-tabs.nav-justified.nav-tabs-top {
     border-bottom: 1px solid #ddd;
 }

 .nav-tabs.nav-justified.nav-tabs-top>li>a,
 .nav-tabs.nav-justified.nav-tabs-top>li>a:hover,
 .nav-tabs.nav-justified.nav-tabs-top>li>a:focus {
     border-width: 2px 0 0 0;
 }

 .nav-tabs.nav-tabs-top>li {
     margin-bottom: 0;
 }

 .nav-tabs.nav-tabs-top>li>a,
 .nav-tabs.nav-tabs-top>li>a:hover,
 .nav-tabs.nav-tabs-top>li>a:focus {
     border-width: 2px 0 0 0;
 }

 .nav-tabs.nav-tabs-top>li.open>a,
 .nav-tabs.nav-tabs-top>li>a:hover,
 .nav-tabs.nav-tabs-top>li>a:focus {
     border-top-color: #ddd;
 }

 .nav-tabs.nav-tabs-top>li+li>a {
     margin-inline-start: 1px;
 }

 .nav-tabs.nav-tabs-top>li>a.active,
 .nav-tabs.nav-tabs-top>li>a.active:hover,
 .nav-tabs.nav-tabs-top>li>a.active:focus {
     border-top-color: var(--primary);
 }

 .nav-tabs.nav-tabs-bottom>li>a.active,
 .nav-tabs.nav-tabs-bottom>li>a.active:hover,
 .nav-tabs.nav-tabs-bottom>li>a.active:focus {
     border-bottom-width: 2px;
     border-color: transparent;
     border-bottom-color: var(--primary);
     background-color: transparent;
     transition: none 0s ease 0s;
     -moz-transition: none 0s ease 0s;
     -o-transition: none 0s ease 0s;
     -ms-transition: none 0s ease 0s;
     -webkit-transition: none 0s ease 0s;
 }

 .nav-tabs.nav-tabs-solid {
     background-color: #fafafa;
     border: 0;
 }

 .nav-tabs.nav-tabs-solid>li {
     margin-bottom: 0;
 }

 .nav-tabs.nav-tabs-solid>li>a {
     border-color: transparent;
 }

 .nav-tabs.nav-tabs-solid>li>a:hover,
 .nav-tabs.nav-tabs-solid>li>a:focus {
     background-color: #dcdcdc;
 }

 .nav-tabs.nav-tabs-solid>.open:not(.active)>a {
     background-color: #dcdcdc;
     border-color: transparent;
 }

 .nav-tabs-justified.nav-tabs-top {
     border-bottom: 1px solid #ddd;
 }

 .nav-tabs-justified.nav-tabs-top>li>a,
 .nav-tabs-justified.nav-tabs-top>li>a:hover,
 .nav-tabs-justified.nav-tabs-top>li>a:focus {
     border-width: 2px 0 0 0;
 }

 /*-----------------
    5. Table
-----------------------*/

 .table tr {
     padding: 15px;
     font-size: 14px;
     border-color: #dcdcdc;
     color: #74788d;
 }

 .table tbody td,
 .table th {
     padding: 15px;
     font-size: 13px;
     color: #74788d;
 }

 .table td,
 .table th {
     vertical-align: middle;
     white-space: nowrap;
 }

 .table> :not(:first-child) {
     border-top: 0;
 }

 .table td h2 {
     display: inline-block;
     font-size: 13px;
     font-weight: 400;
     margin: 0;
     padding: 0;
     vertical-align: middle;
 }

 .table-avatar a.avatar {
     line-height: normal;
     width: 24px;
     height: 24px;
     margin-inline-end: 8px;
 }

 .table-avatar a.avatar img {
     border-radius: 50%;
 }

 .table td h2 a {
     color: #4f4f4f;
     font-size: 13px;
     font-weight: 500;
 }

 table.table td h2.table-avatar {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     font-size: inherit;
     font-weight: 400;
     margin: 0;
     padding: 0;
     vertical-align: middle;
     white-space: nowrap;
 }

 table.table td h2 a:hover {
     color: var(--primary);
 }

 table.table td h2 span {
     color: #74788d;
     display: block;
     font-size: 10px;
     margin-top: 7px;
     font-weight: normal;
 }

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

 table.dataTable td,
 table.dataTable th {
     font-size: 13px;
 }

 table.dataTable th {
     font-weight: 600;
     color: #1d1d1d;
 }

 table.dataTable td {
     font-weight: 500;
     color: #4f4f4f;
 }

 table.dataTable th {
     background: #f2f2f2;
 }

 .table-striped>tbody>tr:nth-child(even)>* {
     background-color: #fff;
 }

 table.dataTable thead .sorting:before,
 table.dataTable thead .sorting_asc:before,
 table.dataTable thead .sorting_desc:before,
 table.dataTable thead .sorting_asc_disabled:before,
 table.dataTable thead .sorting_desc_disabled:before {
     inset-inline-end: 1em;
     content: "\f0de";
     font-family: "Font Awesome 5 Free";
 }

 table.dataTable thead .sorting:after,
 table.dataTable thead .sorting_asc:after,
 table.dataTable thead .sorting_desc:after,
 table.dataTable thead .sorting_asc_disabled:after,
 table.dataTable thead .sorting_desc_disabled:after {
     inset-inline-end: 1em;
     content: "\f0dd";
     font-family: "Font Awesome 5 Free";
 }

 .dataTables_paginate .pagination .previous,
 .dataTables_paginate .pagination .next {
     display: none;
 }

 .custom-table {
     border: 1px solid #dbdbdb;
     border-radius: 5px;
 }

 #tablefilter div.dataTables_filter .form-control {
     height: 42px;
     border: 1px solid #cdcdcd;
     border-radius: 10px;
     width: 100%;
     background-color: #fff;
     padding: 10px 12px 10px 35px;
 }

 #tablefilter div.dataTables_filter label {
     position: relative;
     margin: 0;
 }

 #tablefilter div.dataTables_filter label::before {
     position: absolute;
     font-family: "Font Awesome 5 Free";
     font-weight: 600;
     font-size: 14px;
     content: "\f002";
     inset-inline-end: 12px;
     top: 50%;
     transform: translateY(-50%);
     color: #828282;
     width: 20px;
 }

 .form-wrap.form-item {
     margin-bottom: 15px;
 }

 a.disable {
     color: #b4b4b4;
     pointer-events: none;
 }

 /*-----------------
    6. loader
-----------------------*/
 /* .loader-main {
    position: fixed;
    top: 0;
    inset-inline-start: 0;
    z-index: 999999;
    width: 100%;
    height: 100%;
    background: #ffffff47;
    backdrop-filter: blur(50px);
    display: flex ;
    align-items: center;
    justify-content: center;
}
.page-loader {
    width: 48px;
    height: 48px;
    border: 3px dotted var(--primary);
    border-style: solid solid dotted dotted;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    animation: rotation 2s linear infinite;
}
.page-loader::after {
    content: '';
    box-sizing: border-box;
    position: absolute;
    inset-inline-start: 0;
    inset-inline-end: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border: 3px dotted #040404;
    border-style: solid solid dotted;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    animation: rotationBack 1s linear infinite;
    transform-origin: center center;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
@keyframes rotationBack {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(-360deg);
    }
} */

 div#global-loader {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     background: #ffffff;
     position: fixed;
     z-index: 999999;
     width: 100%;
     height: 100vh;
 }

 div#global-loader .whirly-loader:not(:required) {
     animation: whirly-loader 1.25s linear infinite;
     background: transparent;
     box-shadow: var(--box-shadow);
     display: inline-block;
     height: 8px;
     overflow: hidden;
     position: relative;
     text-indent: -9999px;
     width: 8px;
     transform-origin: 50% 50%;
     -webkit-transform-origin: 50% 50%;
     -ms-transform-origin: 50% 50%;
     border-radius: 100%;
 }

 @keyframes loader {
     to {
         left: -100vw;
     }
 }

 @-webkit-keyframes whirly-loader {
     0% {
         -webkit-transform: rotate(0deg);
         transform: rotate(0deg);
     }

     to {
         -webkit-transform: rotate(1turn);
         transform: rotate(1turn);
     }
 }

 @keyframes whirly-loader {
     0% {
         -webkit-transform: rotate(0deg);
         transform: rotate(0deg);
     }

     to {
         -webkit-transform: rotate(1turn);
         transform: rotate(1turn);
     }
 }

 /*-----------------
    7. Header
-----------------------*/

 .header {
     position: sticky;
     inset-inline-start: 0;
     padding: 6px 0;
     top: 0;
     width: 100%;
     background: #fff;
     z-index: 1001;
     transition: ease all 0.5s;
     -webkit-transition: ease all 0.5s;
     -ms-transition: ease all 0.5s;

     .container-fluid {
         max-width: 1756px;
     }
 }



 .navbar-brand.logo {
     margin-inline: 0;
 }

 .logo img {
     height: auto;
     max-width: 100%;
     max-height: 50px;
 }

 .logo a {
     float: inline-start;
 }

 .logo a img {
     float: inline-start;
     max-height: 32px;
 }

 .header-nav {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     border: 0;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     position: relative;
     padding: 4px 10px;
     margin-bottom: 0;
 }

 .main-menu {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .main-nav {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     list-style: none;
     margin: 0;
     padding: 0;
 }

 .main-menu-wrapper .main-nav>li+li {
     margin-inline-start: 18px;
 }

 .main-nav>li>a {
     color: #676767;
     font-size: 14px;
     font-weight: 500;
 }

 .main-nav>li.active>a {
     color: #1d1d1d;
     font-size: 15px;
     font-weight: 500;
 }



 .main-nav>li .submenu>li.has-submenu>a::after {
     content: "\f054";
     font-family: "Font Awesome 5 Free";
     font-weight: 900;
     position: absolute;
     inset-inline-end: 15px;
     top: 50%;
     transform: translateY(-50%);
     font-size: 10px;
 }

 .main-nav>li .submenu li {
     position: relative;
 }

 .main-nav li a {
     display: block;
     font-weight: 400;
 }

 .main-nav li a:hover {
     color: var(--primary);
 }

 .main-nav li.login-link {
     display: none;
 }

 .header-navbar-rht {
     margin: 0;
     padding: 0;
 }

 .header-navbar-rht>li {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     padding-inline-end: 10px;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .header-navbar-rht>li:last-child {
     padding-inline-end: 0px;
 }

 .header-navbar-rht li>a.btn-primary {
     padding: 8px 20px;
 }

 .header-navbar-rht li>a.btn-secondary {
     padding: 8px 8px;
 }

 .header-navbar-rht li>a.header-login {
     padding: 14px 30px;
     font-weight: 700;
 }

 .header-navbar-rht .search-filter-selected .form-group .select2-container {
     width: 100% !important;
 }

 .user-item {
     margin-bottom: 5px;
     padding: 9px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     background: #f5712e2e;
     border-radius: 8px;
 }

 .user-item img {
     width: 48px;
     height: 48px;
     border-radius: 50%;
     margin-inline-end: 8px;
     flex-shrink: 0;
 }

 .user-item .user-name h6 {
     margin-bottom: 2px;
     text-align: start;
 }

 .user-item .user-name p {
     font-size: 13px;
     font-weight: 500;
     margin-bottom: 0;
 }

 .user-menu {
     float: inline-end;
     margin: 0;
     position: relative;
     z-index: 99;
 }

 .user-menu.nav>li>a {
     color: #fff;
     font-size: 13px;
     line-height: 58px;
     padding: 0 15px;
     height: 60px;
 }

 .user-menu.nav>li>a:hover,
 .user-menu.nav>li>a:focus {
     background-color: rgba(0, 0, 0, 0.2);
 }

 .user-menu.nav>li>a:hover i,
 .user-menu.nav>li>a:focus i {
     color: #fff;
 }

 .user-menu.nav>li>a.mobile_btn {
     border: 0;
     position: relative;
     padding: 0;
     margin: 0;
     cursor: pointer;
 }

 .header-navbar-rht li.logged-item .dropdown-menu {
     min-width: 200px;
     max-height: calc(100vh - 100px);
     top: 100%;
     overflow-y: auto;
     -webkit-transform: translateY(20px);
     -ms-transform: translateY(20px);
     transform: translateY(20px);
 }

 .header-navbar-rht li.logged-item.noti-wrapper .dropdown-menu {
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
 }

 .header-navbar-rht li.logged-item .dropdown-menu::-webkit-scrollbar {
     width: 6px;
     background: #cdcdcd;
     height: 10px;
 }

 .header-navbar-rht li.logged-item .dropdown-menu::-webkit-scrollbar-track {
     box-shadow: var(--box-shadow);
     border-radius: 4px;
 }

 .header-navbar-rht li.logged-item .dropdown-menu::-webkit-scrollbar-thumb {
     background: #686868;
     border-radius: 4px;
 }

 .header-navbar-rht li.logged-item .dropdown-menu::-webkit-scrollbar-thumb:hover {
     background: #1b2559;
 }

 .header-navbar-rht .dropdown-menu {
     min-width: 200px;
     padding: 0;
 }

 .header-navbar-rht .dropdown-menu .dropdown-item {
     padding: 7px 15px;
 }

 .header-navbar-rht .dropdown-menu .dropdown-item {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     border-top: 1px solid #e3e3e3;
     padding: 10px 15px;
 }

 .header-navbar-rht .dropdown-menu .dropdown-item:hover {
     color: #0090ce;
 }

 .header-navbar-rht .logged-item .nav-link {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     font-size: 13px;
     font-weight: 500;
     color: #1d1d1d;
     padding: 0;
     position: relative;
 }

 .popular-icon span img {
     width: 100%;
 }

 [dir="rtl"] .border-start {
     border-inline-end: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
     border-inline-start: unset !important;
 }

 .header-navbar-rht .logged-item .log-user {
     background: #f1f1f1;
     border-radius: 10px;
     padding: 5px 7px;
     width: unset;
     display: flex;
     align-items: center;
     height: unset;
 }

 .header-navbar-rht .logged-item .log-user .users-img img {
     width: 24px;
     height: 24px;
     border-radius: 50%;
 }

 .header-navbar-rht .logged-item .dropdown-toggle:after {
     margin: 0 5px;
 }

 .header-navbar-rht .logged-item .nav-link .badge {
     position: absolute;
     top: 15px;
     inset-inline-end: 0;
 }

 .header-navbar-rht .logged-item .search-filter-selected {
     margin-bottom: 12px;
     padding-bottom: 12px;
     border-bottom: 1px solid #cdcdcd;
 }

 .header-navbar-rht .logged-item .search-filter-selected .form-group {
     margin-bottom: 0;
 }

 .header-navbar-rht .logged-item .dropdown-menu hr {
     color: #cdcdcd;
     opacity: 1;
     margin: 8px 0;
 }

 .header-navbar-rht li.work-btn {
     position: relative;
     margin-inline-end: 15px;
 }

 .header-navbar-rht li.work-btn a {
     display: inline-flex;
     align-items: center;
 }

 .header-navbar-rht li.work-btn:after {
     content: "";
     background: #cdcdcd;
     width: 1px;
     height: 27px;
     position: absolute;
     inset-inline-end: 0;
 }

 .header .header-navbar-rht>li .dropdown-menu {
     box-shadow: var(--box-shadow);
     border-radius: 10px;
     top: 100%;
     inset-inline-end: 0;
     padding: 15px;
     border: transparent;
     background: #ffffffa3;
     backdrop-filter: blur(10px);
 }

 .header .header-navbar-rht>li .dropdown-menu .dropdown-item:hover {
     color: var(--primary);
     transform: translateX(-3px);
     background: transparent;
     -webkit-transition: all 0.4s ease;
     -ms-transition: all 0.4s ease;
     transition: all 0.4s ease;
 }

 .header .header-navbar-rht>li .dropdown-menu .dropdown-item {
     padding: 6px 14px;
     font-size: 13px;
     font-weight: 400;
     color: #4f4f4f;
     margin-block: 4px;
     border-radius: 10px;
     border: 0;
     -webkit-transition: all 0.4s ease;
     -ms-transition: all 0.4s ease;
     transition: all 0.4s ease;
 }

 .header .header-navbar-rht>li .dropdown-menu .dropdown-item.log-out {
     color: #e82646;
 }

 .header .header-navbar-rht>li .dropdown-menu .dropdown-item img {
     width: 16px;
     margin-inline-end: 8px;
 }

 .header .header-navbar-rht>li .dropdown-menu .dropdown-item svg {
     margin-inline-end: 8px;
 }

 .header .header-navbar-rht .noti-wrapper .bell-icon {
     width: 24px;
     height: 24px;
     background: #fff;
     border: 1px solid #cdcdcd;
     border-radius: 50%;
     margin: 0;
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
 }

 .header .header-navbar-rht .noti-wrapper .bell-icon:hover {
     background: var(--primary);
     border-color: var(--primary);
 }

 .header .header-navbar-rht .noti-wrapper .bell-icon:hover img {
     filter: brightness(0) invert(1);
 }

 .header .header-navbar-rht .noti-wrapper .badge-pill {
     width: 3px;
     height: 3px;
     background-color: #e82646;
     position: absolute;
     top: 5px;
     inset-inline-end: 5px;
     margin: 0;
     padding: 0;
     display: block;
 }

 .header .dropdown-toggle:after {
     border-top: 0;
     border-inline-start: 0;
     border-bottom: 1px solid #757575;
     border-inline-end: 1px solid #757575;
     content: "";
     height: 6px;
     display: inline-block;
     pointer-events: none;
     -webkit-transform-origin: 66% 66%;
     -ms-transform-origin: 66% 66%;
     transform-origin: 66% 66%;
     -webkit-transform: rotate(45deg);
     -ms-transform: rotate(45deg);
     transform: rotate(45deg);
     -webkit-transition: all 0.15s ease-in-out;
     transition: all 0.15s ease-in-out;
     width: 6px;
     vertical-align: 2px;
     margin-inline-start: 13px;
 }

 .user-menu.nav>li>a .badge {
     background-color: #f43f3f;
     display: block;
     font-size: 8px;
     font-weight: bold;
     min-height: 15px;
     min-width: 15px;
     position: absolute;
     inset-inline-end: 3px;
     top: 6px;
 }

 .user-menu.nav>li>a>i {
     font-size: 1.25rem;
     line-height: 60px;
 }

 .flag-dropdown .nav-link {
     color: #28283c;
     padding: 0.5rem 0;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: inline-flex;
 }

 .account-item .nav-link {
     padding: 0.5rem 0;
 }

 .user-infos {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
 }

 .main-nav li.megamenu>ul {
     width: 100%;
 }

 .menu-heading {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     margin-bottom: 15px;
 }

 .menu-heading span {
     border-radius: 10px;
     background: var(--secondary);
     width: 40px;
     height: 40px;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     justify-content: center;
     -webkit-justify-content: center;
     margin-inline-end: 8px;
     flex-shrink: 0;
 }

 .menu-heading h5 {
     font-size: 19px;
     margin-bottom: 0;
 }

 .menu-list {
     margin-bottom: 24px;
 }

 .menu-list ul li {
     margin-bottom: 20px;
 }

 .menu-list ul li h6 {
     font-size: 13px;
     margin-bottom: 5px;
 }

 .main-nav>li .submenu.mega-submenu .menu-list ul li h6 a {
     color: #1d1d1d;
     font-size: 14px;
 }

 .main-nav>li .submenu.mega-submenu .menu-list ul li h6 a:hover,
 .main-nav>li .submenu.mega-submenu .menu-list ul li h6 a.active {
     color: var(--primary);
     background-color: transparent;
 }

 .main-nav>li .submenu.mega-submenu .menu-list ul li p a {
     color: #686868;
     background-color: transparent;
     white-space: normal;
     font-size: 10px;
 }

 .main-nav>li .submenu.mega-submenu .menu-list ul li p a:hover {
     color: #686868;
 }

 .main-nav>li .submenu .menu-list ul li p {
     font-size: 10px;
     font-weight: 500;
     color: #686868;
     margin-bottom: 0;
 }

 .main-nav>li .submenu.mega-submenu ul li a {
     padding: 0;
 }

 .main-nav>li .submenu .menu-list ul li .more-link {
     font-size: 10px;
     font-weight: 600;
     color: #4f4f4f;
     display: inline-flex;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .main-nav>li .submenu .menu-list ul li .more-link i {
     opacity: 0;
 }

 .main-nav li .submenu .menu-list ul li .more-link:hover {
     background-color: transparent;
     color: var(--primary);
 }

 .main-nav li .submenu .menu-list ul li .more-link:hover i {
     opacity: 1;
     margin-inline-start: 8px;
 }

 .main-nav li>ul.mega-submenu {
     padding: 40px 40px 16px;
 }

 /*-----------------
	8. Mobile Menu
-----------------------*/

 .sidebar-overlay {
     background-color: rgba(0, 0, 0, 0.6);
     display: none;
     height: 100%;
     inset-inline-start: 0;
     position: fixed;
     z-index: 2;
     top: 0;
     width: 100%;
 }

 .menu-header {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     height: 60px;
     padding: 0 20px;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     display: none;
 }

 .menu-logo img {
     height: 50px;
 }

 .menu-close {
     font-size: 17px;
     color: var(--primary);
 }

 .bar-icon {
     display: inline-block;
     width: 31px;
 }

 .bar-icon span {
     background-color: var(--primary);
     display: block;
     float: inline-start;
     height: 2px;
     margin-bottom: 6px;
     width: 30px;
     border-radius: 2px;
 }

 .bar-icon span:nth-child(3) {
     margin-bottom: 0;
 }

 #mobile_btn {
     display: none;
     margin-inline-end: 30px;
 }

 html.menu-opened body {
     overflow: hidden;
 }

 .main-menu-wrapper {
     margin: 0 15px 0;
 }

 .navbar-brand.logo-small {
     display: none;
 }

 .navbar-brand.logo-small img {
     max-height: 30px;
 }

 img {
     vertical-align: middle;
     max-width: 100%;
 }

 /*-----------------
    9. Top-Header
-----------------------*/

 .product-more {
     padding: 37px 0 37px;
 }

 @media (min-width: 992px) {
     .text-lg-end {
         text-align: end !important;
     }
 }

 [dir="rtl"] .breadcrumb-item+.breadcrumb-item::before {
     content: "\f104";
 }

 [id^="course_"] {
     .modal-header .btn-close {
         margin-inline-start: auto !important;
         margin-inline-end: unset !important;
     }

     .modal-content {
         border-radius: 10px;
         border: none;
         background: #ffffffcf;
     }

     .modal-header {
         border-bottom-color: transparent;
     }
 }

 /* [id*="course_"] {

} */

 .product-more h3 {
     font-weight: 700;
     font-size: 22px;
     color: #030a16;
     margin-bottom: 0;
 }

 .megamenu-main {
     position: static !important;
 }

 .submenu-product-group {
     margin-bottom: 40px;
 }

 .main-nav>li .submenu li .submenu-head a {
     padding: 0;
 }

 .main-nav>li .submenu-head li a {
     white-space: normal;
 }

 .submenu-head {
     text-align: center;
     margin-bottom: 25px;
 }

 .submenu-head .product-content img {
     margin-bottom: 10px;
 }

 .submenu-head .product-content {
     padding: 10px;
     background: #ffffff;
     box-shadow: var(--box-shadow);
     border-radius: 10px;
 }

 .submenu-head .product-content p {
     font-weight: 600;
     font-size: 15px;
     color: #666666;
     margin-bottom: 0;
     -webkit-transition: 0.7s;
     -moz-transition: 0.7s;
     -o-transition: 0.7s;
     transition: 0.7s;
 }

 .submenu-head .product-content h4 {
     font-weight: 700;
     font-size: 17px;
     color: #030a16;
     -webkit-transition: 0.7s;
     -moz-transition: 0.7s;
     -o-transition: 0.7s;
     transition: 0.7s;
 }

 .submenu-head:hover .product-content h4,
 .submenu-head:hover .product-content p {
     color: var(--primary);
     -webkit-transition: 0.7s;
     -moz-transition: 0.7s;
     -o-transition: 0.7s;
     transition: 0.7s;
 }

 .megamenu-full-width li {
     height: calc(100vh - 90px);
     overflow: auto;
 }

 .megamenu-full-width li {
     background: #fff;
     box-shadow: var(--box-shadow);
     border-radius: 0px 0px 40px 40px;
 }

 .main-nav li.responsive-link {
     display: none;
 }

 /*-----------------
	10. Home
-----------------------*/

 .hero-section {
     padding: 64px 0;
     position: relative;
     z-index: 1;
 }

 .banner-head h1 {
     font-size: 38px;
     color: var(--primary);
     margin-bottom: 24px;
     position: relative;
     max-width: 660px;
     background: linear-gradient(45deg, #eb7019, #f49121);
     background-clip: text;
     -webkit-background-clip: text;
     color: transparent;
     -webkit-text-fill-color: transparent;
 }

 .banner-head h1::after {
     /*content: "";*/
     background-image: url(../img/bg/title-bar-img.svg);
     position: absolute;
     width: 150px;
     height: 10px;
     inset-inline-end: 0;
     bottom: -10px;
 }



 .banner-form {
     position: relative;
     padding: 16px;
     border-radius: 10px;
     background: #fff;
     margin-bottom: 24px;
     box-shadow: var(--box-shadow);
 }

 .banner-form form {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     border-radius: 10px;
 }

 .banner-search-list {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     width: 90%;
     margin: 0 -10px;
 }

 .banner-form .input-block {
     min-width: 180px;
     width: 100%;
     display: inline-block;
     text-align: start;
     padding: 0 10px 0 10px;
     margin: 0px 6px 15px;
 }

 .input-locaion {
     position: relative;
 }

 .banner-form .input-block .input-locaion .form-control {
     padding-inline-end: 20px;
 }

 .input-locaion img {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     inset-inline-end: 0;
 }

 .banner-form .input-block label {
     font-size: 10px;
     font-weight: 500;
     color: #4f4f4f;
     margin-bottom: 5px;
 }

 .banner-form .select2-container--default .select2-selection--single {
     background-color: var(--main-bg);
     box-shadow: 0px 1px 2px #00000020;
     border: transparent;
     border-radius: 10px;
 }

 .banner-form .input-block .form-control {
     font-size: 13px;
     font-weight: 400;
     color: #1d1d1d;
     padding: 8px;
     border-radius: 10px;
     height: 40px;
     border: 0;
     background: var(--main-bg);
     box-shadow: 0px 1px 2px #00000020;
 }

 .banner-form .input-block .form-control::placeholder {
     font-size: 13px;
     font-weight: 400;
     color: #1d1d1d;
 }

 .banner-form .input-block .select2-container .select2-selection--single {
     border: 0;
     height: auto;
 }

 .banner-form .input-block .select2-container .select2-selection--single .select2-selection__rendered {
     padding-inline-start: 10px;
     /*line-height: normal;*/
     color: #1d1d1d;
 }

 .banner-form .input-block .select2-container--default .select2-selection--single .select2-selection__arrow {
     height: auto;
     top: 50%;
 }

 .banner-form .input-block-btn {
     float: inline-end;
     margin-inline-start: auto;
 }

 .banner-form .input-block-btn .btn {
     padding: 10px 20px;
 }

 .banner-form .input-block-btn .btn i {
     font-size: 13px;
     margin-inline-end: 5px;
 }

 .popular-search {
     display: flex;
     align-items: center;
 }

 .popular-search ul {
     display: flex;
     align-items: center;
     flex-wrap: wrap;
 }

 .popular-search h5 {
     font-size: 15px;
     margin-inline-end: 12px;
     margin-bottom: 12px;
     flex-shrink: 0;
 }

 .popular-search ul li {
     margin: 0 12px 12px 0;
 }

 .popular-search ul li:last-child {
     margin-inline-end: 0;
 }

 .popular-search ul li a {
     background: #ffffff;
     border-radius: 10px;
     padding: 5px 15px;
     font-size: 13px;
     color: #1d1d1d;
     border: 1px solid #ddd;
     font-weight: 600;
     display: inline-flex;
 }

 .popular-search ul li a:hover {
     background: var(--primary);
     color: #fff;
 }

 .banner-img-right {
     max-width: 500px;
     background: radial-gradient(#ff7f473d 19%, #ff8a5729 30%, #ffffff00 64%);
     inset-inline-end: 30px;
 }

 .banner-bg-imgs img {
     position: absolute;
     z-index: -1;
 }

 .banner-bg-imgs .banner-bg-one {
     inset-inline-end: 200px;
     top: 0;
 }

 .banner-bg-imgs .banner-bg-two {
     inset-inline-end: 38%;
     bottom: 0;
     display: none;
 }

 .banner-bg-imgs .banner-bg-three {
     inset-inline-start: 0;
     top: 0;
     max-width: 400px;
 }

 .banner-bg-imgs .banner-bg-four {
     inset-inline-start: 20px;
     top: 50px;
     animation: spin 3000ms linear infinite;
 }

 .banner-small-bg-one {
     position: absolute;
     bottom: 30%;
     inset-inline-end: 60px;
 }

 .banner-small-bg-two {
     position: absolute;
     bottom: 23%;
     inset-inline-end: 450px;
 }

 @keyframes spin {
     to {
         transform: rotate(360deg);
     }
 }

 .service-section {
     padding: 80px 0;
 }

 .section-header h2 {
     font-size: 26px;
     margin-bottom: 0;
     position: relative;
     text-transform: capitalize;
 }

 .section-header h2 span {
     position: relative;
 }

 span.site_name {
     color: var(--primary);
     padding: 4px;
     border-radius: 8px;
     margin-inline: 8px;
 }

 .section-header h2 span::after {
     /*content: "";*/
     background-image: url(../img/bg/title-bar-img.svg);
     position: absolute;
     width: 100%;
     height: 10px;
     inset-inline-start: 0;
     bottom: -6px;
     background-size: cover;
 }

 .service-grid .servive-name h4 {
     font-weight: 600;
     margin-bottom: 3px;
     font-size: 17px;
 }

 .service-grid {
     background: #fff;
     box-shadow: var(--box-shadow);
     border-radius: 10px;
     margin-bottom: 24px;
 }

 .service-grid .service-img {
     position: relative;
     transition: 0.5s all;
     overflow: hidden;
     border-radius: 10px 10px 0 0;
 }

 .service-grid .service-img:hover img {
     transform: scale(1.14);
     transition: 0.5s all;
 }

 .service-grid .service-img img {
     border-radius: 10px 10px 0 0;
     width: 100%;
     transition: 0.5s all;
 }

 .service-grid .servive-name span {
     color: #4f4f4f;
 }

 .service-type {
     padding: 24px;
 }

 .next-arrow a i {
     color: #1d1d1d;
     font-size: 17px;
 }

 .service-grid:hover .next-arrow a i {
     color: var(--primary);
 }

 .avg-price h6 {
     font-size: 10px;
     font-weight: 600;
     color: #fff;
     margin-bottom: 5px;
 }

 .avg-price span {
     font-size: 17px;
     color: #fff;
     font-weight: 600;
 }

 .avg-price {
     position: absolute;
     text-align: end;
     inset-inline-end: 0;
     top: 0;
     margin: 15px 15px 0 0;
 }

 .more-btn {
     margin-top: 26px;
 }

 .more-btn a.btn {
     display: inline-flex;
     padding: 14px 25px;
     height: auto;
     align-items: center;
     justify-content: center;
 }

 .more-btn a.btn i {
     font-size: 10px;
     margin-inline-start: 8px;
 }

 .explore-gigs-section {
     padding: 40px 0;
     position: relative;
     /* background: linear-gradient(rgba(255, 114, 58, 0.05) 0%, rgb(254 140 55 / 10%) 100%); */
 }

 .partnersSection {
     background: #fff;
 }

 .section-tab {
     margin-bottom: 40px;
 }

 .section-tab ul li .nav-link {
     background: #fff;
     color: #1d1d1d;
     font-size: 14px;
     padding: 10px 25px;
     border-radius: 10px;
     margin-inline-end: 15px;
     font-weight: 500;
     transition: 0.5s all;
 }

 .section-tab ul li .nav-link.active {
     background: var(--primary);
     color: #fff;
 }

 .section-tab ul li .nav-link:hover {
     background: var(--primary);
     color: #fff;
     transition: 0.5s all;
 }

 .section-tab ul li:last-child .nav-link {
     margin-inline-end: 0;
 }

 .section-head {
     align-items: center;
     justify-content: space-between;
     gap: 10px;
     margin-bottom: 25px;
 }

 .gigs-grid .star-rate span i {
     color: rgba(255, 185, 6, 1);
 }

 .gigs-content {
     padding: 24px;
     transition: padding 0.3s ease-in-out;
 }

 .gigs-grid .gigs-content {
     padding: 10px 0px 0;
     border-radius: 0 0 10px 10px;
     border-top: none;
 }

 #cartListContainer .gigs-grid .gigs-content {
     padding: 15px;
 }

 #cartListContainer .owl-carousel .owl-item img,
 #cartListContainer .gigs-img .img-slider a::after {
     border-radius: 10px;
 }

 #cartListContainer .owl-carousel .owl-stage-outer,
 #cartListContainer .owl-carousel .owl-item,
 #cartListContainer .slide-images,
 #cartListContainer .owl-carousel .owl-stage {
     height: 100%;
 }

 #cartListContainer .gigs-card-footer {
     align-items: flex-start;
 }

 .gigs-content .gigs-info .badge {
     color: #3c3c3c;
     padding: 0px;
     position: relative;
     font-weight: normal;
     display: inline-flex;
     font-size: 11px;
     align-items: center;
     border-bottom-color: transparent;

     svg {
         margin-inline-end: 3px;
         color: var(--primary);
     }
 }

 .gigs-slider .gigs-grid .gigs-info {
     margin-bottom: 20px;
 }

 .gigs-content .gigs-info .badge::before {
     /* content: ""; */
     width: 8px;
     height: 8px;
     border-radius: 10px;
     background: var(--primary);
     position: absolute;
     inset-inline-end: 5px;
 }

 .gigs-info {
     display: flex;
     align-items: center;
     justify-content: space-between;
     border-bottom: 1px solid #cbcbcb4d;
     padding-bottom: 8px;
     bottom: 0px;
     inset-inline-end: 0;

     .cardBadge {
         border-radius: 8px !important;
         padding: 10px;
     }
 }

 .gigs-info p {
     display: inline-flex;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     color: #1d1d1d;
     margin-bottom: 0;
 }

 .owl-carousel .owl-item .gigs-info p img {
     width: 18px;
     height: 18px;
     margin-inline-end: 6px;
 }

 .gigs-info p img {
     width: 18px;
     height: 18px;
     margin-inline-end: 6px;
 }

 .gigs-info p i {
     margin-inline-end: 6px;
 }

 .gigs-info small {
     font-size: 13px;
     font-weight: 500;
     margin-inline-start: 8px;
     margin-inline-end: auto;
 }

 .gigs-card-footer {
     display: flex;
     align-items: center;
     margin-bottom: 18px;

     svg {
         margin-inline-end: 3px;
         color: var(--primary);
     }

     div {
         span {
             color: #474747;
             font-weight: 300;
             font-size: 13px;
         }
     }
 }

 .blog-content-footer {
     margin-top: 15px;
     color: var(--secondary);
 }

 .blog-content-footer.desc {
     border-top: 0;
     margin-top: 0;
     color: #4f4f4f;
 }

 .gigs-share {
     display: inline-flex;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .gigs-share a.img-icon {
     background: #f2f2f2;
     color: #1d1d1d;
 }

 .gigs-share a {
     width: 32px;
     height: 32px;
     margin-inline-end: 6px;
     border-radius: 50px;
     color: #1170e4;
     background: #f1f6fd;
     border: 1px solid #d5d5d5;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .chekout-login {
     background: #fbf6f1;
     padding: 30px;
     border-radius: 8px;
 }

 .empty-cart {
     margin-bottom: 30px;
 }

 .empty-cart img {
     width: 300px;
 }

 .gigs-share a:hover {
     color: #fff;
     background: #1170e4;
 }

 .gigs-card-footer .badge {
     border-radius: 10px;
     color: #2f2f2f;
     margin-bottom: 0;
     padding: 3px 10px 6px;
     position: relative;
     display: inline-flex;
     align-items: center;
 }

 .gigs-card-footer .badge::before {
     /* content: "\e953"; */
     font-family: "feather";
     font-weight: 900;
     position: absolute;
     inset-inline-end: 10px;
 }

 .gigs-card-footer h5 {
     font-size: 19px;
     font-weight: 600;
     margin-bottom: 0;
 }

 .star-rate span {
     font-size: 13px;
     color: #4f4f4f;
     display: inline-flex;
     align-items: center;
     font-weight: 600;
 }

 .star-rate span i {
     color: #9b9b9b;
     margin-inline-end: 5px;
 }

 .service-widget .form-check {
     padding-block: 10px;
     padding-inline: 10px 30px;
     border-radius: 6px;
     border: 1px solid #cdcdcd;
     margin-bottom: 10px;
 }

 .service-widget .form-check .course-type {
     color: var(--primary);
 }

 .service-widget .form-check .course-price {
     font-size: 16px;
     color: #333333;
     font-weight: bold;
     display: flex;
     align-items: center;
     gap: 4px;
 }

 .star-rate span i.filled {
     color: rgba(255, 185, 6, 1);
 }

 /*.gigs-title {*/
 /*    margin: 15px 0;*/
 /*}*/
 .gigs-title h3 {
     font-size: 19px;
     line-clamp: 2;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
     margin-top: 8px;
     height: 46px;
     line-height: 22px;
     text-overflow: ellipsis;
     display: -webkit-box;
 }

 .card-overlay-badge span {
     font-size: 12px;
     border-radius: 8px;
     padding: 6px 8px;
     display: inline-flex;
     align-items: center;
     margin-block: 0px;
 }

 .gigs-img {
     position: relative;
     border-radius: 12px;
     overflow: hidden;
     aspect-ratio: 131 / 90;

     a {
         display: block;
         height: 100%;
     }

     &:after {
         /* content: ""; */
         position: absolute;
         width: 100%;
         height: 40px;
         background: linear-gradient(180deg, #595959, transparent);
         top: 0;
         left: 0;
     }

     &:before {
         /* content: ""; */
         position: absolute;
         /* width: 100%;
        height: 70px; */
         background: linear-gradient(0deg, #0e0e0e, transparent);
         bottom: 0;
         left: 0;
     }
 }

 @media (width> 767px) {
     #cartListContainer .cart-page .gigs-content {
         position: relative;
     }

     .cart-page .gigs-card-footer div:not(.d-block) {
         position: absolute;
         inset-inline-end: 0px;
         bottom: 0;
         width: 100%;
     }

     .cart-page .gigs-card-footer div a {
         padding: 4px;
         color: red;
         width: 100%;
         border-radius: 0 0 10px 10px;
         background: #ff000038;
     }
 }

 .gigs-img:hover .img-slider img {
     transform: scale(1.14);
     transition: 0.5s all;
 }

 .gigs-img .img-slider a {
     position: relative;
     overflow: hidden;
     display: block;
     border-radius: 10px 10px 0 0;
 }

 .gigs-img .img-slider a::after {
     content: "";
     background: linear-gradient(182deg,
             rgba(0, 0, 0, 0.55) -7.43%,
             rgba(0, 0, 0, 0) 45.63%,
             rgba(0, 0, 0, 0.13) 98.07%);
     width: 100%;
     height: 100%;
     border-radius: 10px 10px 0 0;
     position: absolute;
     top: 0;
     inset-inline-start: 0;
 }

 .course-price-modal {
     color: #000;
     font-size: 18px;
 }

 .gigs-img img {
     position: relative;
     transition: 0.5s all;
     width: 100%;
     height: 100%;
     object-fit: contain;
 }

 .explore-gigs-section .gigs-img img {
     height: 100%;
 }

 .cart-page .gigs-img img,
 .cart-page .gigs-img .img-slider a::after {
     border-radius: 12px;
 }

 .fc-title {
     color: #9f9f9f;
     padding: 0 8px;
     font-weight: 500;
     font-size: 16px;
     border-radius: 15px;
     border-inline: 2px solid var(--primary);
 }

 .card-overlay-badge {
     display: flex;
     align-items: center;
     position: absolute;
     inset-inline-start: 5px;
     top: 5px;
     margin-top: 0px;
     margin-inline-start: 0px;
     z-index: 1;
 }

 .card-overlay-badge span i {
     margin-inline-end: 8px;
 }

 .card-overlay-badge span.bg-warning {
     margin-inline-end: 8px;
 }

 .fav-selection {
     position: absolute;
     inset-inline-end: 5px;
     top: 5px;
     z-index: 1;
 }

 .fav-selection a {
     width: 30px;
     height: 30px;
     margin-inline-end: 6px;
     background: #ffffff;
     box-shadow: var(--box-shadow);
     border-radius: 8px;
     display: inline-flex;
     align-items: center;
     justify-content: center;
 }

 .fav-selection a:last-child {
     margin-inline-end: 0;
 }

 .fav-selection .fav-icon.favourite {
     background: var(--primary);
     color: #fff;
 }

 .user-thumb {
     position: absolute;
     inset-inline-end: 0;
     bottom: 0;
     margin-bottom: 15px;
     margin-inline-end: 15px;
     z-index: 1;
 }

 .user-thumb img {
     width: 45px;
     height: 45px;
     border-radius: 50%;
     border: 2px solid #fff;
 }

 .img-slider .owl-dots {
     display: flex;
     justify-content: center;
     width: 100%;
     position: absolute;
     bottom: 0;
 }

 .img-slider .owl-dots .owl-dot {
     width: 5px;
     height: 5px;
     border-radius: 40px;
     background: #f2f2f2;
     margin: 0 0 15px 0;
     margin-inline-end: 5px;
 }

 .img-slider .owl-dots .owl-dot.active {
     width: 27px;
     height: 5px;
 }

 .gigs-card-slider.owl-carousel .owl-nav,
 .clients-slider .owl-nav {
     display: flex;
     justify-content: center;
     position: absolute;
     margin-top: 16px;
     gap: 5px;
 }

 .b-radius-12 {
     border-radius: 12px !important;
 }

 .gallery-span {
     font-size: 11px;
     color: rgb(66, 66, 66);
 }



 .absTitle {
     position: absolute;
     bottom: 0;
     width: 100%;
     margin: 0 !important;
     padding-inline: 7px;
     background: #ffffff90;
     left: 50%;
     transform: translateX(-50%);
     backdrop-filter: blur(14px);
     opacity: 0;
     transition: opacity 0.3s ease-in-out;

     a {
         display: block;
         font-size: 15px;
     }
 }

 .gigs-grid.p-2:hover {
     .absTitle {
         opacity: 1;
     }
 }

 .gigs-card-slider.owl-carousel .owl-nav button:hover {
     background: #1d1d1d;
     color: #fff;
     transition: 0.5s all;
 }

 .gigs-card-slider.owl-carousel .img-slider .owl-nav {
     display: none;
 }

 .gigs-card-slider.owl-carousel .owl-nav button:last-child {
     margin-inline-end: 0;
 }

 .section-bg-one {
     position: absolute;
     inset-inline-end: 0;
     top: 0;
     z-index: -1;
 }

 .section-bg-two {
     position: absolute;
     inset-inline-end: 20px;
     bottom: 50px;
     z-index: -1;
     animation: spin 3000ms linear infinite;
 }

 .client-slider-sec {
     padding: 80px 0;
 }

 .client-logo {
     min-height: 40px;
     background: #fff;
     padding: 10px;
     align-items: center;
     border-radius: 12px;
     overflow: hidden !important;
     display: flex;
     justify-content: center;
     margin: 6px 4px;
 }

 .client-logo img {
     height: 160px;
     object-fit: contain;
 }

 .client-slider-sec .section-header p {
     color: #515151;
     text-align: center;
 }

 .explore-services-sec {
     padding: 80px 0;
     position: relative;
     overflow: hidden;
 }

 .explore-services-one {
     position: absolute;
     inset-inline-end: 0;
     top: -100px;
     z-index: -1;
 }

 .explore-services-two {
     position: absolute;
     inset-inline-start: 0;
     top: 0;
     max-width: 450px;
     z-index: -1;
 }

 .trusted-customers {
     background-image: url(../img/bg/section-bg-02.jpg);
     background-size: cover;
     background-repeat: no-repeat;
     padding: 60px 0;
     position: relative;
     overflow: hidden;
     z-index: 1;
     border-radius: 10px;
 }

 .trusted-customers::after {
     content: "";
     width: 100%;
     height: 100%;
     border-radius: 10px;
     background: linear-gradient(180deg,
             #000 0%,
             rgba(0, 0, 0, 0) 48%,
             rgba(0, 0, 0, 0.76) 100%);
     position: absolute;
     top: 0;
     inset-inline-start: 0;
     z-index: -1;
 }

 .trusted-bg-one {
     position: absolute;
     inset-inline-end: -40px;
     top: -40px;
 }

 .trusted-bg-two {
     position: absolute;
     inset-inline-start: -40px;
     bottom: -40px;
 }

 .trusted-customers .section-header {
     display: flex;
     flex-direction: column;
     align-items: center;
 }

 .trusted-customers .section-header h2 {
     color: #fff;
     font-size: 42px;
     margin-bottom: 15px;
     text-align: center;
 }

 .trusted-customers .section-header p {
     color: #fff;
     font-size: 17px;
     margin-bottom: 0;
 }

 .trusted-customers-sec {
     position: relative;
 }

 .explore-bg1 {
     position: absolute;
     top: -25%;
     inset-inline-start: 0;
     width: 300px;
 }

 .explore-bg2 {
     position: absolute;
     bottom: 140px;
     inset-inline-start: -70px;
     animation: spin 3000ms linear infinite;
     width: 60px;
 }

 .popular-section.expert-section {
     padding: 80px 0;
 }

 .expert-wrapper {
     background: linear-gradient(0deg, #fd92382b, #ffeee2);
     padding: 48px 24px 0;
     border-radius: 8px;
 }

 .expert-header h2 {
     color: #5d5d5d;
 }

 .expert-header p {
     color: #e6e6e6;
     margin-bottom: 40px;
 }

 .expert-icon {
     flex-shrink: 0;
     margin-inline-end: 30px;
 }

 .expert-icon img {
     filter: brightness(0.6);
 }

 .expert-item {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     margin-bottom: 24px;
 }

 .expert-item h4 {
     color: #4d4d4d;
     margin-bottom: 14px;
 }

 .expert-item p {
     color: #747474;
     margin-bottom: 0;
     line-height: 20px;
     font-weight: normal;
 }

 .expert-section .popular-img {
     position: unset;
 }

 .expert-section .popular-img-left {
     bottom: 50px;
     inset-inline-start: 10px;
     top: auto;
 }

 .top-listing-section {
     position: relative;
     padding: 80px 0 56px;
 }

 .con-bg {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     inset-inline-end: 0;
     z-index: -1;
 }

 .provide-box {
     h3 {
         margin-bottom: 15px;
         font-size: 30px;
         color: var(--primary);
     }

     .provide-icon {
         width: 67px;
         position: absolute;
         background: #f1f1f1;
         height: 60px;
         border-radius: 0 0 20px;
         -webkit-box-align: center;
         -ms-flex-align: center;
         align-items: center;
         display: -webkit-box;
         display: -ms-flexbox;
         justify-content: center;
         -webkit-justify-content: center;
         -ms-flex-pack: center;
         transition: background 0.3s ease-in-out;
         display: flex;
         top: 0px;
         inset-inline-end: 0px;
     }

     p {
         margin-bottom: 0 !important;
     }

     &:hover {
         transform: translateY(-10px);

         .provide-icon {
             background: #ffffff33;

             img {
                 animation: heartbeat 1s ease-in-out;
             }
         }
     }
 }

 .provide-box .btn i {
     margin-inline-start: 5px;
 }

 .provide-section .section-header h2 {
     margin-bottom: 35px;
 }

 .country-lists .gigs-location img {
     filter: unset;
 }

 .country-lists .gigs-title h3 {
     margin-bottom: 10px;
 }

 .country-lists .gigs-title p {
     font-size: 13px;
     font-weight: 600;
     margin-bottom: 0;
 }

 .country-lists .card-overlay-badge span i {
     font-size: 6px;
 }

 .country-lists .gigs-card-footer h5 {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
 }

 .country-lists .gigs-card-footer h5 span {
     font-size: 13px;
     color: #4f4f4f;
     margin-inline-end: 8px;
 }

 .fw-semibold {
     font-weight: 600;
 }

 .section-header p {
     font-size: 17px;
     font-weight: 500;
     margin-bottom: 0;
 }

 .cta-section {
     background: url(../img/bg/faq-bg.png);
     border-radius: 10px;
     padding: 14px;
     margin: 80px 0;
 }

 .cta-wrap {
     background: #fdf6f1;
     padding: 60px;
     border-radius: 10px;
     position: relative;
     z-index: 1;
 }

 .cta-bg1 {
     position: absolute;
     top: 0;
     inset-inline-start: 0;
 }

 .cta-bg2 {
     position: absolute;
     bottom: 0;
     inset-inline-end: 0;
     z-index: -1;
 }

 .cta-wrap h3 {
     font-size: 32px;
     font-weight: 700;
     margin-bottom: 0;
 }

 .cta-wrap .badge {
     font-size: 15px;
     font-weight: 600;
     padding: 13px 10px;
     background: #1d1d1d;
     border-radius: 10px;
     margin-bottom: 15px;
     white-space: pre-wrap;
 }

 .cta-btn i {
     margin-inline-start: 5px;
 }

 .popular-section {
     background: #ffffff21;
     position: relative;
     overflow: hidden;
     padding: 80px 0 56px;
 }

 .popular-img {
     position: relative;
 }

 .popular-img-left {
     position: absolute;
     top: 460px;
 }

 .popular-img-left img {
     animation: spin 3000ms linear infinite;
     width: 60px;
 }

 .popular-img-right {
     position: absolute;
     top: -80px;
     inset-inline-end: -40px;
     opacity: 0.1;
 }

 .popular-img-right img {
     width: 400px;
 }

 .listing-slider ul {
     list-style: none !important;
 }

 .listing-section {
     background: #fff;
     position: relative;
     overflow: hidden;
     padding: 80px 0;
 }

 .listing-tab .nav {
     border: 0;
     margin-bottom: 25px;
 }

 .listing-tab .nav li {
     margin-bottom: 15px;
 }

 .listing-tab .nav li a {
     background: #fff;
     color: #1d1d1d;
     font-size: 14px;
     padding: 10px 25px;
     border-radius: 10px;
     margin-inline-end: 15px;
     font-weight: 500;
     transition: 0.5s all;
     box-shadow: var(--box-shadow);
 }

 .listing-tab .nav .nav-link.active {
     background: var(--primary);
     color: #fff;
 }

 .listing-tab .nav .nav-link:hover {
     background: var(--primary);
     color: #fff;
     transition: 0.5s all;
 }

 .listing-tab .nav li:last-child .nav-link {
     margin-inline-end: 0;
 }

 .gigs-location {
     display: inline-flex;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     -webkit-box-align: center;
     -ms-flex-align: center;
     margin-bottom: 0;
 }

 .gigs-location img {
     filter: invert(25%) sepia(97%) saturate(2355%) hue-rotate(204deg) brightness(97%) contrast(87%);

     width: auto !important;
 }

 .banner-img {
     justify-items: center;
 }

 .gigs-location span {
     width: 26px;
     height: 26px;
     border-radius: 50%;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     justify-content: center;
     -webkit-justify-content: center;
     background: #e7f1fc;
     margin-inline-end: 8px;
 }

 .listing-gigs .gigs-grid .gigs-img .img-slider a,
 .listing-gigs .gigs-grid .gigs-img .gigs-img .img-slider img {
     border-radius: 10px;
 }

 #filter_form {
     .title-filter .select2-container .select2-selection--single {
         height: 50px;
         background: #fff;
         border: 1px solid transparent;
         border-radius: 8px;
         box-shadow: var(--box-shadow);
     }

     .select2-container--default .select2-selection--single .select2-selection__rendered {
         line-height: 50px;
     }
 }

 .course_price {
     font-size: 14px;
     color: #0f0f0f;
     font-weight: bold;
     align-self: center;
     display: flex;
     align-items: center;
     justify-content: start;
     gap: 3px;
 }

 .course_price svg {
     width: 25px !important;
     height: 25px !important;
 }

 @keyframes btnAnimation {
     from {
         inset-inline-end: -100%;
     }

     to {
         inset-inline-end: 50%;
     }
 }

 .gigs-grid {
     transition: all 0.3s ease-in-out;
     overflow: hidden;
     background: #fff;
     box-shadow: var(--box-shadow);
     border-radius: 12px;
     position: relative;
     padding: 14px;
     margin-bottom: 24px;

     &:hover {
         .gigs-img {
             img {
                 transform: scale(1.1);
             }
         }
     }
 }

 .hoverShow {
     margin-bottom: 0 !important;
 }

 .gigs-card-footer p.badge {
     display: flex;
     box-shadow:
         3px 3px 3px #00000010,
         inset 3px 3px 3px #00000010;
     gap: 2px;
     line-height: 17px;
     align-items: start;
 }

 .listing-gigs .gigs-grid .gigs-info {
     justify-content: flex-start;
 }

 .listing-gigs .gigs-grid {
     padding: 24px;
 }

 .listing-gigs .gigs-grid .gigs-content {
     padding: 24px 0 0;
 }

 .listing-gigs .gigs-grid .star-rate {
     margin-inline-start: 8px;
 }

 .listing-gigs .star-rate {
     border-inline-start: 1px solid #cdcdcd;
     padding-inline-start: 8px;
 }

 .listing-gigs .star-rate span {
     font-weight: 500;
 }

 .listing-gigs .gigs-grid .user-thumb {
     bottom: -23px;
     margin: 0 15px 0 0;
 }

 .listing-gigs .gigs-grid .user-thumb img {
     border: 6px solid #fff;
 }


 .testimonial-icon {
     margin-bottom: 24px;
 }

 .testimonial-slider .testimonial-icon img {
     width: 45px;
     opacity: 0.07;
 }



 .testimonial-item .star-rate {
     margin-bottom: 5px;
 }

 .testimonial-section .testimonial-item h6 {
     text-overflow: ellipsis;
     font-size: 15px;
     overflow: hidden;
     height: 46px;
     line-height: 21px;
     display: -webkit-box;
     font-weight: 500;
     line-clamp: 2;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
 }




 .testimonial-info h6 {
     margin-bottom: 3px;
     color: #252525;
     height: auto !important;
     font-weight: 400;
     font-size: 18px;
 }

 .testimonial-info p {
     margin-bottom: 0;
     font-size: 13px;
     font-weight: 300;
     color: #272626;
 }

 .testimonial-slider.owl-carousel .owl-nav {
     display: flex;
     justify-content: center;
     position: absolute;
     margin-top: 16px;
 }

 .testimonial-slider.owl-carousel .owl-nav button {
     width: 48px;
     height: 48px;
     margin-inline-end: 15px;
     transition: 0.5s all;
 }

 .testimonial-bg1 {
     position: absolute;
     top: 10%;
     inset-inline-end: 0;
 }

 .testimonial-bg2 {
     position: absolute;
     bottom: 10%;
     inset-inline-start: 0;
 }

 .testimonial-bg3 {
     position: absolute;
     bottom: 0;
     inset-inline-start: 79px;
     display: none;
 }

 .faq-section {
     padding: 80px 0;
 }

 .faq-section .faq-wrapper {
     padding: 0;
     background: none;
 }

 .faq-section .faq-card {
     box-shadow: var(--box-shadow);
 }

 .faq-sec {
     margin-bottom: 80px;
 }

 .faq-heading .section-header {
     margin-bottom: 24px;
 }

 .faq-heading p {
     font-size: 17px;
     font-weight: 500;
     margin-bottom: 40px;
 }

 .faq-heading .btn i {
     margin-inline-start: 5px;
 }

 .faq-wrapper {
     padding: 24px;
     background: url("../img/bg/faq-bg.png");
 }

 .faq-wrapper .faq-card {
     margin-bottom: 15px;
     border: 0;
 }

 .faq-wrapper .faq-card:last-child {
     margin-bottom: 0;
     padding-bottom: 15px;
 }

 .faq-wrapper .faq-card p:last-child {
     margin-bottom: 0;
 }

 .faq-wrapper .faq-card .faq-title {
     font-size: 19px;
 }

 /*-----------------
	12. Search Page
-----------------------*/

 .breadcrumb-bar {
     position: relative;
     overflow: hidden;
     background: repeating-linear-gradient(162deg, #fd903614, #fb683700 384px);
     padding: 40px 0;
 }

 .breadcrumb-img {
     position: relative;
 }

 .breadcrumb-img .breadcrumb-left {
     position: absolute;
     top: -40px;
     inset-inline-end: 0;
 }

 .breadcrumb-img .breadcrumb-left img {
     width: 215px;
     display: none;
     filter: hue-rotate(180deg);
 }

 .breadcrumb-title {
     font-size: 22px;
     font-weight: 600;
     color: #1d1d1d;
     margin-bottom: 0;
     display: inline-flex;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     position: relative;
     z-index: 1;
 }

 .breadcrumb-title a {
     font-size: 19px;
     margin-inline-end: 6px;
 }

 .breadcrumb-bar-info .breadcrumb-title {
     margin-bottom: 50px;
 }

 .page-breadcrumb ol li {
     font-weight: 500;
     color: #f5712e;
 }

 .page-breadcrumb ol li a {
     font-weight: 500;
     color: #9b9b9b;

     svg {
         width: 18px;
         height: 18px;
     }
 }

 .page-breadcrumb .breadcrumb a:hover {
     color: var(--primary);
 }

 .page-breadcrumb ol li.active {
     color: var(--primary);
 }

 .breadcrumb-item+.breadcrumb-item::before {
     float: inline-start;
     padding-inline-end: 0.5rem;
     content: "\f105";
     font: normal normal normal 14px/1.6 FontAwesome;
     color: #000;
 }

 .page-breadcrumb .breadcrumb-item+.breadcrumb-item {
     padding-inline-start: 10px;
 }

 .page-content {
     padding: 60px 0;

     h1.page-title {
         margin-bottom: 13px;
     }
 }

 .select2-results__option {
     padding: 10px 12px;
     font-size: 13px;
 }

 .select2-container .select2-selection--single {
     border: 1px solid #dddddd;
     border-radius: 6px;
     height: 48px;
     outline: 0;
     font-size: 13px;
 }

 .select2-container--default .select2-selection--single {
     background-color: #fff;
     border: transparent;
     border-radius: 8px;
     box-shadow: var(--box-shadow);
 }

 .select2-container--default .select2-selection--single .select2-selection__arrow {
     height: 42px;
     inset-inline-end: 7px;
 }

 .select2-container--default .select2-selection--single .select2-selection__arrow b {
     position: absolute;
     top: 50%;
     inset-inline-start: 50%;
     border-color: #4f4f4f;
     border-style: solid;
     border-width: 0 2px 2px 0;
     padding: 3px;
     height: 0;
     margin-inline-start: -6px;
     margin-top: -3px;
     width: 0;
     transform: rotate(45deg) translateY(-50%);
     -webkit-transform: rotate(45deg) translateY(-50%);
     -ms-transform: rotate(45deg) translateY(-50%);
 }

 .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
     border-color: #4f4f4f;
     border-width: 2px 0 0 2px;
     margin-top: 3px;
     padding: 3px;
 }

 .select2-container .select2-selection--single .select2-selection__rendered {
     padding-inline-end: 30px;
     padding-inline-start: 12px;
 }

 .select2-container--default .select2-selection--single .select2-selection__rendered {
     color: #4f4f4f;
     line-height: 42px;
     font-weight: 400;
 }

 .select2-container--default .select2-results__option--highlighted[aria-selected] {
     background-color: var(--primary);
     border: 0;
 }

 .select2-container--default .select2-selection--multiple {
     border: 1px solid #dcdcdc;
     min-height: 50px;
 }

 .select2-dropdown {
     border-color: #dcdcdc;
 }

 .search-filter {
     float: inline-start;
     width: 100%;
     position: relative;
     padding: 24px 24px 4px;
     margin-top: -110px;
     margin-bottom: 60px;
     border-radius: 10px;
     background: #fff;
     box-shadow: var(--box-shadow);
 }

 .search-filter form {
     float: inline-start;
     width: 100%;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
 }

 .search-filter-list {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     width: 90%;
     margin: 0 -5px;
 }

 .search-filter .form-group {
     min-width: 180px;
     width: 100%;
     display: inline-block;
     text-align: start;
     border-inline-end: 1px solid #e6e6e6;
     padding: 0 10px 0 0;
     margin: 0 5px 20px;
 }

 .search-filter .form-group label {
     font-size: 10px;
     font-weight: 500;
     color: #4f4f4f;
     margin-bottom: 0;
 }

 .search-filter .form-group .form-control {
     font-size: 13px;
     font-weight: 400;
     color: #1d1d1d;
     padding: 0px;
     border-radius: 10px;
     height: auto;
     border: 0;
 }

 .search-filter .form-group .form-control::placeholder {
     font-size: 13px;
     font-weight: 400;
     color: #1d1d1d;
 }

 .search-filter .form-group .select2-container .select2-selection--single {
     border: 0;
     height: auto;
 }

 .search-filter .form-group .select2-container .select2-selection--single .select2-selection__rendered {
     padding-inline-start: 0;
     line-height: normal;
     color: #1d1d1d;
 }

 .search-filter .form-group .select2-container--default .select2-selection--single .select2-selection__arrow {
     height: auto;
     top: 7px;
 }

 .search-filter .search-filter-btn {
     float: inline-end;
     margin: 0 0 20px;
     margin-inline-start: auto;
 }

 .search-filter .search-filter-btn .btn {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     min-width: 106px;
     min-height: 54px;
     border-radius: 10px;
 }

 .search-gigs .gigs-grid {
     margin-bottom: 24px;
     box-shadow: var(--box-shadow);
 }

 .search-gigs .gigs-info small {
     font-size: 13px;
     font-weight: 500;
     color: #4f4f4f;
     margin-inline-start: 8px;
     margin-inline-end: auto;
 }

 .search-load-btn {
     text-align: center;
     margin-top: 16px;
 }

 .search-load-btn .btn {
     padding: 11px 18px;
     border-radius: 10px;
     display: inline-flex;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     min-height: 48px;
 }

 .search-load-btn .btn .spinner-border {
     padding: 0;
     margin: 0;
     border: 0;
     width: 18px;
     height: 18px;
 }

 .search-filter-selected .form-group {
     position: relative;
 }

 .search-filter-selected.breadcrumb-select-box .form-group {
     position: relative;
     float: inline-end;
 }

 .search-filter-selected .form-group .select2-container .select2-selection--single .select2-selection__rendered {
     padding-inline-end: 30px;
     color: rgba(79, 79, 79, 1);
     font-weight: 500;
 }

 .search-filter-selected .form-group .select-box-icon {
     position: absolute;
     inset-inline-start: 10px;
     top: 12px;
     z-index: 5;
 }

 .search-filter-selected .form-group .select2-container {
     width: auto !important;
 }

 .sort-search-gigs h5 {
     margin-bottom: 0;
     font-size: 15px;
 }

 .form-check-input:checked {
     background-color: var(--primary);
     border-color: var(--primary);
 }

 .sort-search-gigs {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 24px;
     padding-bottom: 24px;
     border-bottom: 1px solid #cdcdcd;
 }

 .search-filter-selected .form-group .select2-container .select2-selection--single .select2-selection__rendered {
     padding-inline-end: 70px;
     color: #787878;
 }

 .breadcrumb-select-box.search-filter-selected .form-group .select2-container .select2-selection--single .select2-selection__rendered {
     padding-inline-start: 30px;
 }

 .filter-select-boxes .search-filter-selected .form-group .select2-container .select2-selection--single .select2-selection__rendered {
     padding-inline-start: 30px;
 }

 .search-filter-selected .form-group .sort-text {
     position: absolute;
     inset-inline-start: 15px;
     top: 50%;
     transform: translateY(-50%);
     z-index: 5;
     font-weight: 600;
     font-size: 13px;
     color: #4f4f4f;
 }

 .sort-search-gigs .search-filter-selected .form-group select {
     color: rgba(29, 29, 29, 1);
 }

 .filter-gigs {
     display: flex;
     align-items: center;
     margin-bottom: 30px;
 }

 .filter-gigs h5 {
     margin-inline-end: 10px;
     margin-bottom: 10px;
 }

 .filter-gigs .filter-select-boxes {
     display: flex;
     align-items: center;
     flex-wrap: wrap;
 }

 .filter-gigs .search-filter-selected .form-group {
     float: unset;
 }

 .filter-gigs .filter-select-boxes li {
     margin-inline-end: 10px;
     margin-bottom: 10px;
 }

 .filter-gigs .filter-select-boxes li:last-child {
     margin-inline-end: 0;
 }

 .pagination {
     justify-content: center;
     padding: 0;
 }

 .pagination ul {
     display: flex;
     align-items: center;
     justify-content: center;
     flex-wrap: wrap;
     margin-top: 16px;
 }

 .pagination ul li a,
 .pagination ul li span,
 .pagination li a {
     width: 45px;
     height: 45px;
     background: #fff;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     margin-inline-end: 15px;
     font-weight: 400;
     color: #5d5d5d;
     transition: 0.5s all;
 }

 .pagination ul li span {
     color: #000;
     box-shadow: none;
     border: 1px solid #e5e5e5;
 }

 .pagination ul li a.active,
 .pagination li.active a {
     background: var(--primary);
     color: #fff;
     border-color: var(--primary);
 }

 .pagination ul li a:hover,
 .pagination li.active a:hover {
     background: var(--primary);
     color: #fff;
     border-color: var(--primary);
     transition: 0.5s all;
 }

 .pagination ul li a.previous {
     margin-inline-end: 24px;
     font-size: 10px;
 }

 .pagination ul li a.next {
     margin-inline-start: 9px;
     margin-inline-end: 0;
     font-size: 10px;
 }

 .page-item:first-child .page-link,
 .page-item:last-child .page-link {
     border-radius: 50%;
 }

 /*-----------------
    13. Services Details
-----------------------*/

 .page-content.content {
     padding: 60px 0 36px;
 }

 .page-content.category-wrap {
     padding: 60px 0 20px;
 }

 .service-wrap {
     border-radius: 10px;
     /*border: 1px solid #CDCDCD;*/
     background: #fff;
     box-shadow: var(--box-shadow);
     padding: 24px;
     margin-bottom: 24px;
 }

 .service-wrap h3 {
     margin-bottom: 24px;
 }

 .service-wrap p span {
     color: #777777;
     font-size: 13px !important;
     font-family: inherit !important;
 }

 .service-wrap p:last-child,
 .about-me p {
     margin-bottom: 0;
     line-height: 1.8;
     font-weight: 500;
     color: #999;
     font-size: 14px;
 }

 .service-lists li {
     padding-inline-start: 20px;
     position: relative;
     margin-bottom: 20px;
 }

 .service-lists li::before {
     content: "\f111";
     font-family: "Font Awesome 5 Free";
     font-weight: 600;
     position: absolute;
     inset-inline-start: 0;
     top: 6px;
     font-size: 6px;
 }

 .service-widget {
     border-radius: 10px;
     background: #fff;
     padding: 24px;
     margin-bottom: 24px;
     box-shadow: var(--box-shadow);
 }

 .service-widget .btn {
     margin-bottom: 24px;
     height: auto;
     padding: 14px 20px;
 }

 .service-widget .btn i {
     margin-inline-end: 5px;
 }

 .service-img-wrap {
     margin-bottom: 24px;
 }

 .service-img-wrap img {
     border-radius: 10px;
 }

 .service-amt {
     text-align: center;
     margin-bottom: 24px;
 }

 .service-amt p {
     color: #4f4f4f;
     margin-bottom: 0;
     font-size: 17px;
     font-weight: 600;
 }

 .service-amt h2 {
     font-size: 26px;
     margin-bottom: 0;
 }

 .service-amt h2 span {
     color: #4f4f4f;
 }

 .buy-items {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
 }

 .buy-items li:not(:last-child) {
     margin-inline-end: 15px;
 }

 .buy-box {
     border-radius: 10px;
     background: #fff;
     box-shadow: var(--box-shadow);
     border: 1px solid #cdcdcd;
     padding: 10px 5px;
     text-align: center;
 }

 .buy-box i {
     margin-bottom: 5px;
 }

 .buy-box p {
     font-size: 13px;
     margin-bottom: 10px;
 }

 .buy-box h6 {
     font-size: 15px;
     font-weight: 600;
     color: #1d1d1d;
     margin-bottom: 0;
 }

 .member-info {
     margin-bottom: 14px;
     padding-inline-start: 0 !important;
 }

 .member-info li {
     margin-bottom: 10px;
     padding: 0 0 10px;
     font-size: 13px;
     display: flex;
     justify-content: start;
     flex-direction: column;
     color: var(--primary);
     font-weight: 500;
     gap: 5px;
 }

 .service-widget.member-widget li>div {
     align-items: start;

     h3 {
         margin-bottom: 0;
         font-size: 15px;
     }
 }

 .service-widget.member-widget .breadcrumb-info .info-links {
     margin: 0;
     padding: 0;

     .order-count {
         margin: 0;
         padding: 4px 10px;
     }
 }

 .member-info li:last-child {
     border-bottom: 0;
 }

 .member-info li span {
     font-size: 13px;
     font-weight: 600;
     color: #000000a3;
     float: inline-end;
 }

 .user-details {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     margin-bottom: 24px;
 }

 .user-img {
     flex-shrink: 0;
     margin-inline-end: 10px;
 }

 .user-img img {
     width: 45px;
     height: 45px;
     border-radius: 5px;
 }

 .user-info h5 {
     font-size: 17px;
     font-weight: 500;
     margin-bottom: 5px;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
 }

 .user-info h6 {
     font-size: 13px;
     font-weight: 600;
     margin-bottom: 5px;
 }

 .user-info p {
     font-size: 13px;
     font-weight: 500;
     margin-bottom: 0;
 }

 .user-info p i {
     margin-inline-end: 5px;
     color: #ffb906;
 }

 .user-info .badge {
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     padding: 3px 5px;
 }

 .user-info .badge i {
     font-size: 7px;
     margin-inline-end: 5px;
     line-height: 0;
 }

 .badge {
     font-size: 12px;
     font-weight: 400;
     padding: 5px 2px;
 }

 .badge-success {
     border-radius: 10px;
     border: 1px solid #1abe17;
     background: #f2faf2;
     color: #1abe17;
 }

 .extra-service {
     margin-bottom: 24px;
 }

 .faq-card .view a:after {
     display: none;
 }

 .extra-service h3 {
     margin-bottom: 20px;
     font-size: 21px;
 }

 .service-time {
     border: 1px solid #cdcdcd;
     border-radius: 3px;
 }

 .service-time .modal {
     padding: 0;
 }

 .service-time .modal.new-modal .modal-header {
     border-bottom: 1px solid #cdcdcd;
     justify-content: center;
 }

 .service-time .modal-dialog {
     max-width: 80%;
     margin-top: 0;
 }

 .service-time .modal-dialog {
     text-align: end;
 }

 .service-time .modal-content {
     height: 70vh;
 }

 .service-time .modal iframe {
     height: 100%;
 }

 .service-time li {
     /*background-color: #FCFCFC;*/
     padding: 15px;
     /*border-bottom: 1px solid #CDCDCD;*/
 }

 /*.service-time li:first-child {*/
 /*    border-radius: 10px 10px 0 0;*/
 /*}*/
 /*.service-time li:last-child {*/
 /*    border: 0;*/
 /*    border-radius: 0 0 10px 10px;*/
 /*}*/
 .service-time .delivery-info h6 {
     margin-bottom: 5px;
 }

 .service-time .delivery-info p {
     font-size: 13px;
     font-weight: 500;
     margin-bottom: 0;
 }

 .service-time .delivery-amt h6.amt {
     color: #1d1d1d;
     font-size: 13px;
     font-weight: 500;
     margin-bottom: 0;
 }

 .view {
     text-align: end;
 }

 .view a {
     color: var(--secondary) !important;
 }

 .btn-light-primary {
     background-color: var(--secondary);
     border: 1px solid var(--secondary);
     color: var(--primary);
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     padding: 7px 14px;
     font-weight: 600;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
     border-radius: 10px;
 }

 .btn-light-primary:hover,
 .btn-light-primary.active,
 .btn-light-primary:active,
 .open>.dropdown-toggle.btn-primary {
     background-color: var(--primary);
     /*border: 1px solid var(--primary);*/
     color: #fff;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 .btn-light-primary i {
     margin-inline-end: 5px;
 }

 .modal-form-group {
     margin-bottom: 15px;
 }

 .form-control {
     border-radius: 10px;
     border: 1px solid transparent;
     background: var(--main-bg);
     box-shadow: var(--box-shadow);
     font-size: 13px;
     font-weight: 500;
     padding: 10px 12px;
 }

 .form-control::placeholder {
     color: #828282;
 }

 .service-modal .user-details {
     background: #f2f2f2;
     border-radius: 10px;
     padding: 15px;
 }

 .service-modal .form-control::placeholder {
     color: #4f4f4f;
 }

 .modal-title {
     font-size: 19px;
     font-weight: 600;
     margin-bottom: 15px;
 }

 .modal-header {
     padding: 24px;
 }

 .modal-body {
     padding: 24px;
 }

 .modal {
     z-index: 1050 !important;
 }

 .modal-backdrop {
     background-color: rgb(0 0 0 / 21%);
     z-index: 1040 !important;
     backdrop-filter: blur(14px);
 }

 .modal-backdrop.show {
     opacity: 1;
 }

 .service-modal .select2-container .select2-selection--single {
     border: 1px solid #cdcdcd;
     height: 41px;
 }

 .service-modal .select2-container .select2-selection--single .select2-selection__rendered {
     padding-inline-start: 12px;
     font-size: 13px;
     font-weight: 500;
     border-radius: 10px;
 }

 .service-modal p {
     font-size: 13px;
     font-weight: 500;
     margin-bottom: 0;
 }

 .service-modal .drag-upload {
     margin-bottom: 10px;
 }

 .custom_check {
     color: #4f4f4f;
     position: relative;
     font-size: 13px;
     padding-inline-start: 30px;
     margin-bottom: 10px;
     display: inline-block;
     cursor: pointer;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
     height: 20px;
 }

 .custom_check input {
     position: absolute;
     opacity: 0;
     cursor: pointer;
 }

 .custom_check input:checked~.checkmark {
     background-color: var(--primary);
     border-color: var(--primary);
 }

 .custom_check input:checked~.checkmark:after {
     display: block;
 }



 .custom_check .checkmark:after {
     content: "\f00c";
     font-family: "Font Awesome 5 Free";
     font-weight: 600;
     position: absolute;
     display: block;
     color: #fff;
     font-size: 10px;
     top: 50%;
     inset-inline-start: 50%;
     transform: translate(-50%, -50%);
     line-height: 0;
 }

 [dir="rtl"] .custom_check .checkmark:after {
     transform: translate(50%, -50%);
 }

 .custom_check a {
     color: var(--primary);
 }

 .breadcrumb-links {
     text-align: end;
 }

 .breadcrumb-links a {
     color: #1d1d1d;
     font-size: 13px;
     font-weight: 600;
 }

 .breadcrumb-links li {
     display: inline-block;
 }

 .breadcrumb-links li:not(:last-child) {
     margin-inline-end: 15px;
 }

 .breadcrumb-links a span {
     width: 32px;
     height: 32px;
     border-radius: 50%;
     border: 1px solid #cdcdcd;
     color: #1d1d1d;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     margin-inline-end: 8px;
 }

 .breadcrumb-links a:hover {
     color: var(--primary);
 }

 .breadcrumb-links a:hover span {
     color: var(--primary);
     border: 1px solid var(--primary);
 }

 .breadcrumb-info .breadcrumb-title {
     font-size: 26px;
     font-weight: 700;
     margin-bottom: 15px;
 }

 .breadcrumb-info .info-links li {
     display: inline-block;
     margin-inline-end: 15px;
     color: #000;
     font-size: 13px;
     font-weight: 500;
 }

 .breadcrumb-info .info-links li i {
     color: var(--primary);
     margin-inline-end: 8px;
 }

 .breadcrumb-info .info-links li.order-count {
     color: var(--primary);
     border-radius: 10px;
     background: #f5722524;
     padding: 5px 11px;
 }

 .breadcrumb-info .info-links li.order-count i {
     color: #1170e4;
 }

 @media (max-width: 991.98px) {

     .navbar-nav>li>a.nav-link.active::after,
     .navbar-nav>li>a.active::after {
         display: none;
     }
 }

 .faq-card {
     background: #fff;
     padding: 15px;
     border-bottom: 1px solid #cdcdcd;
 }

 .faq-card:last-child {
     margin-bottom: 0;
     border: 0;
     padding-bottom: 0;
 }

 .faq-card .faq-title {
     font-size: 17px;
     font-weight: 600;
     margin-bottom: 0;
 }

 .faq-card a {
     color: #1d1d1d;
     display: block;
     position: relative;
     padding-inline-end: 28px;
 }

 .faq-card .card-collapse .faq-content {
     padding-top: 15px;
 }

 .faq-card a:after {
     content: "+";
     position: absolute;
     top: 50%;
     inset-inline-end: 0;
     transform: translateY(-50%);
 }

 .faq-card a:not(.collapsed):after {
     content: "-";
 }

 .faq-card a:not(.collapsed)::after {
     color: var(--primary);
 }

 .sortby-title h4 {
     color: #4f4f4f;
     margin-bottom: 20px;
 }

 .sortby-title h4 span {
     color: #1d1d1d;
 }

 .sortby-title .form-group {
     margin-bottom: 20px;
 }

 .bg-success-light {
     background: #1abe17;
 }

 .review-widget {
     margin-bottom: 24px;
 }

 .review-widget .review-title h3 {
     margin-bottom: 20px;
 }

 .review-widget .pagination {
     justify-content: start;
     -webkit-justify-content: start;
     -ms-flex-pack: start;
 }

 .review-widget .pagination ul {
     margin: 0;
 }

 .review-lists li:last-child {
     margin-bottom: 20px;
 }

 .review-lists li ul li {
     border-bottom: 0;
 }

 .review-wrap {
     padding: 10px 21px;
     background: #fff;
     border-radius: 12px;
     margin-block: 8px;
     border: none;
     box-shadow: var(--box-shadow);
 }

 .review-user-info {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     margin-bottom: 10px;
 }

 .review-img {
     margin-inline-end: 11px;
 }

 .review-img img {
     width: 60px;
     height: 60px;
     flex-shrink: 0;
     border-radius: 6px;
 }

 .reviewer-loc,
 .reviewer-rating {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     flex-wrap: wrap;
 }

 .reviewer-info h6,
 .reviewer-info p {
     display: inline-block;
 }

 .reviewer-info h6 {
     margin: 0 15px 5px 0;
 }

 .reviewer-loc p {
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     margin: 0 15px 5px 0;
 }

 .reviewer-loc p i {
     margin-inline-end: 8px;
 }

 .review-content p {
     margin-bottom: 10px;
 }

 .reviewer-rating p {
     margin: 0;
     font-size: 11px;
     color: #ababab;
     font-weight: 300;
 }

 .reviewer-rating .star-rate {
     border-inline-end: 1px solid #cdcdcd;
     margin-inline-end: 5px;
     padding-inline-end: 5px;
     font-size: 13px;
     font-weight: 600;
 }

 .review-content a {
     font-size: 13px;
     font-weight: 500;
     color: #4f4f4f;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .review-content i {
     margin-inline-end: 8px;
 }

 .review-content a:hover {
     color: var(--primary);
 }

 .review-lists>li>ul>li .review-wrap {
     border-radius: 10px;
     background: #f2f2f2;
     padding: 24px;
 }

 .service-wrap.tags-lists-widget {
     padding-bottom: 14px;
 }

 .service-wrap.tags-widget {
     padding-bottom: 14px;
 }

 .tags li {
     display: inline-block;
     margin: 0 15px 10px 0;
 }

 .tags li a {
     padding: 8px 10px;
     font-size: 13px;
     font-weight: 500;
     border-radius: 10px;
     background: #f2f2f2;
     display: inline-block;
 }

 .tags li a:hover {
     background: var(--primary);
     color: #fff;
 }

 .about-me {
     border-radius: 10px;
     background: color-mix(in oklab, transparent, var(--primary) 7%);
     padding: 24px;
     margin-bottom: 24px;
 }

 .about-me h6 {
     font-size: 15px;
     font-weight: 600;
     color: #2b2b2b;
     margin-bottom: 10px;
 }

 .about-me p {
     margin-bottom: 10px;
 }

 .about-me a {
     font-size: 13px;
     font-weight: 500;
     color: var(--primary);
 }

 .slider-card {
     margin-bottom: 24px;
     direction: ltr;
 }

 .slider-nav-thumbnails {
     border-radius: 10px;
     display: none;
 }

 .slider-nav-thumbnails img {
     width: 100%;
     border-radius: 10px;
 }

 .finished {
     color: #ffffff;
     position: absolute;
     border-radius: 10px;
     padding: 5px 65px;
     font-size: 12px;
     background: #ff1919;
     cursor: default;
     top: 49px;
     left: -50px;
     transform: rotate(-45deg);
     z-index: 1;

     &:hover {
         color: #fff;
     }
 }

 .serviceSec .blog-img {
     height: auto;
 }

 .free {
     display: flex;
     gap: 9px;
     font-size: 11px;
     padding: 4px 52px;
     left: -45px;
     top: 45px;
     background: #007700;
     backdrop-filter: blur(35px);

     .course_price {
         font-weight: normal !important;
         font-size: 12px;
         color: #fff;
     }
 }

 .owl-nav button.owl-next,
 .owl-nav button.owl-prev,
 .owl-carousel .owl-nav button.owl-next,
 .owl-carousel .owl-nav button.owl-prev {
     width: 44px;
     height: 44px;
     border-color: transparent;
     margin: 4px;
     border-radius: 30px;
     box-shadow: var(--box-shadow);
     background: #fff;
     transition: ease all 0.5s;
     -webkit-transition: ease all 0.5s;
     -ms-transition: ease all 0.5s;
 }

 .owl-nav button.owl-next:hover,
 .owl-nav button.owl-prev:hover {
     background: #1d1d1d;
     color: #fff;
     transition: ease all 0.5s;
     -webkit-transition: ease all 0.5s;
     -ms-transition: ease all 0.5s;
 }

 .slider-card .owl-carousel .owl-nav button.owl-prev {
     inset-inline-start: -15px;
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
 }

 .slider-card .owl-carousel .owl-nav button.owl-next {
     inset-inline-end: -15px;
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
 }

 .mynav1 {
     text-align: end;
     margin-bottom: 24px;
 }

 .mynav1 .owl-prev,
 .nav-top .owl-prev {
     margin-inline-end: 15px;
 }

 .recent-img img {
     border-radius: 10px;
 }

 .share-icon {
     width: 32px;
     height: 32px;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     background: #f2f2f2;
     color: #1170e4;
     border-radius: 50%;
     margin-inline-end: 8px;
 }

 .share-icon:hover {
     background-color: #1170e4;
     color: #fff;
 }

 .fav-selection a.video-icon {
     inset-inline-end: 45px;
 }

 .fav-selection a.video-icon:hover {
     inset-inline-end: 45px;
 }

 .title-sec h3 {
     margin-bottom: 24px;
 }

 .worknav {
     text-align: end;
     margin-bottom: 24px;
 }

 .review-widget .review-header {
     border-bottom: 1px solid #cdcdcd;
 }

 .review-widget .review-header h3 {
     margin-bottom: 20px;
 }

 .review-widget .sort-search-gigs {
     display: block;
     margin: 0;
     padding: 0;
 }

 .review-widget .search-filter-selected {
     float: inline-end;
     margin-bottom: 20px;
 }

 .new-modal .modal-header {
     border-bottom: 1px solid #cdcdcd;
     margin: 0 24px 0;
     padding: 24px 0 15px;
     justify-content: space-between;
 }

 .new-modal .modal-body {
     padding-top: 15px;
 }

 .modal-btn .btn {
     height: auto;
     padding: 8px 10px;
 }

 .detail-table {
     border-radius: 10px;
     border: 1px solid #cdcdcd;
     margin-bottom: 15px;
 }

 .detail-table table {
     margin: 0;
 }

 .detail-table thead th,
 .detail-table tfoot th {
     background: #f2f2f2;
     color: #1d1d1d;
     font-size: 13px;
     font-weight: 600;
     border: 0;
 }

 .detail-table tr {
     border-color: #cdcdcd;
 }

 .detail-table tr td {
     font-size: 13px;
     font-weight: 500;
     color: #1d1d1d;
 }

 .text-primary {
     color: var(--primary) !important;
 }

 .new-modal .user-info .location {
     font-size: 13px;
     font-weight: 500;
     margin-inline-start: 11px;
     color: #4f4f4f;
     position: relative;
     padding-inline-start: 10px;
 }

 .new-modal .location::before {
     background: #cdcdcd;
     width: 1px;
     height: 100%;
     position: absolute;
     content: "";
     inset-inline-start: 0;
     top: 0;
 }

 .new-modal .user-img img {
     border-radius: 6px;
 }

 .modal-title {
     margin-bottom: 0;
 }

 .modal-content {
     border-radius: 10px;
     border: none;
     background: #ffffffff;
     backdrop-filter: blur(20px);

     .modal-header {
         button {
             margin-inline-start: auto;
             margin-inline-end: unset;
         }
     }
 }

 .modal-header .close-btn {
     background-color: #f2f2f2;
     border: 1px solid #f2f2f2;
     border-radius: 50%;
     color: #363636;
     font-size: 15px;
     height: 26px;
     width: 26px;
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
 }

 .modal-header .close-btn:hover {
     border: 1px solid #ff7f25;
     background-color: #ff7f25;
     color: #fff;
     -webkit-transition: all 0.7s;
     -moz-transition: all 0.7s;
     -o-transition: all 0.7s;
     transition: all 0.7s;
     -webkit-transform: rotateZ(360deg);
     -moz-transform: rotateZ(360deg);
     transform: rotateZ(360deg);
 }

 .order-item {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     margin-bottom: 15px;
 }

 .order-item img {
     object-fit: cover;
 }

 .order-info h5 {
     margin-bottom: 9px;
 }

 .order-info ul li {
     display: inline-block;
     margin-inline-end: 8px;
     padding-inline-end: 8px;
     font-size: 13px;
     font-weight: 500;
     position: relative;
 }

 .order-info ul li:last-child {
     margin-inline-end: 0;
     padding-inline-end: 0;
 }

 .order-info ul li::after {
     background: #cdcdcd;
     width: 1px;
     height: 100%;
     position: absolute;
     content: "";
     inset-inline-end: 0;
     top: 0;
 }

 .order-info ul li:last-child::after {
     content: none;
 }

 .order-status .title {
     font-size: 15px;
     margin-bottom: 10px;
 }

 .order-img {
     margin-inline-end: 8px;
 }

 .order-img img {
     width: 60px;
     height: 60px;
     border-radius: 6px;
 }

 .gigs-slider .gigs-grid {
     margin-bottom: 24px;
     padding: 8px;
 }

 .recent-works {
     padding-top: 36px;
 }

 /*-----------------
    14. Top Scroller
-----------------------*/

 .back-to-top-icon.show {
     opacity: 1;
     transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
     -o-transition: all 0.5s ease;
     -ms-transition: all 0.5s ease;
     -webkit-transition: all 0.5s ease;
 }

 .back-to-top i {
     color: #fff;
 }

 .back-to-top-icon:hover {
     color: #fff;
     background: #ff7f25;
 }

 .app-screen-img {
     border-radius: 10px;
 }

 /*-----------------
	15. Blog
-----------------------*/

 .breadcrumb-bar.breadcrumb-two {
     background: #fff;
     position: relative;
     z-index: 2;
 }

 .breadcrumb-bar.breadcrumb-two::before {
     content: "";
     background-image: url(../img/bg/breadcrumb-bg.png);
     width: 100%;
     height: 100%;
     position: absolute;
     inset-inline-start: 0;
     top: 0;
     background-repeat: no-repeat;
     background-size: contain;
     z-index: -1;
 }

 [dir="ltr"] .blog-grid,
 [dir="ltr"] .testimonial-item {
     direction: ltr;
 }

 .blog-grid .blog-img a {
     height: 100%;
 }

 .blog-img {
     aspect-ratio: 97 / 72;
 }

 .blog-img:hover img {
     transform: scale(1.14);
     transition: 0.5s all;
 }

 .blog-content .user-head {
     display: flex;
     align-items: center;
     justify-content: space-between;
     flex-wrap: wrap;
 }

 .blog-content .badge-text .badge {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     padding: 5px 10px;
     color: rgb(245 114 37);
     background: #ffefe5;
     font-weight: normal;
     font-size: 12px;
 }

 .blog-content .user-info {
     display: flex;
     align-items: center;
     margin-bottom: 5px;
 }

 .blog-content .badge-text {
     margin-bottom: 5px;
 }

 .blog-content .user-info img {
     width: 45px;
     height: 45px;
     border-radius: 50%;
     margin-inline-end: 10px;
 }

 .blog-content .user-info h6 {
     margin-bottom: 0;
     font-size: 15px;
     text-align: start;
 }

 .blog-content .user-info h6 span {
     display: block;
     margin-top: 3px;
     font-size: 13px;
     color: #4f4f4f;
     font-weight: normal;
 }






 .blog-content-footer p span {
     display: inline-block;
     margin-inline-end: 5px;
 }

 .blog-content-footer .read-more {
     font-weight: 600;
     color: #4f4f4f;
     display: inline-flex;
     align-items: center;
 }

 .blog-content-footer .read-more:hover {
     color: var(--primary);
 }

 .blog-content-footer .read-more span {
     line-height: normal;
     margin-inline-start: 5px;
 }

 .blog-grid .blog-content a.mt-4 {
     text-decoration: underline;
     background: var(--primary);
     width: fit-content;
     color: #fff;
     padding: 6px 16px;
     border-radius: 6px;
 }

 .blog-content .gigs-card-footer {
     margin-bottom: 0px;
 }

 .blog-sidebar .card {
     border: 0;
     border-radius: 10px;
     padding: 24px;
     box-shadow: var(--box-shadow);
 }

 .blog-sidebar .card-header h6 {
     font-weight: 500;
     margin-bottom: 15px;
 }

 .blog-sidebar .card-header {
     padding: 0;
     background-color: #fff;
     border-bottom: 1px solid #cdcdcd;
 }

 .blog-sidebar .card-body {
     padding: 15px 0 0;
 }

 .blog-sidebar {
     margin-bottom: 24px;
 }

 .blog-sidebar .card-header h6 img {
     margin-inline-end: 8px;
 }

 .blog-sidebar .search-group {
     margin-bottom: 20px;
 }

 .card.tag-widget {
     padding-bottom: 4px;
 }

 .category-widget .categories li {
     color: #1d1d1d;
     margin-bottom: 10px;
 }

 .category-widget .categories li span {
     float: inline-end;
 }

 .tags-list li {
     display: inline-block;
     margin: 0 10px 20px 0;
 }

 .tags-list li a {
     padding: 3px 10px;
     font-size: 13px;
     font-weight: 500;
     border-radius: 10px;
     background: var(--secondary);
     color: var(--primary);
     display: inline-block;
 }

 .tags-list li a:hover {
     background: var(--primary);
     color: #fff;
 }

 .latest-posts li {
     box-shadow: var(--box-shadow);
     margin-bottom: 10px;
     border-radius: 10px;
     padding: 15px;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .latest-posts li:last-child {
     margin-bottom: 0;
 }

 .post-thumb {
     border-radius: 10px;
     flex-shrink: 0;
     margin-inline-end: 15px;
     transition: 0.5s all;
     overflow: hidden;
 }

 .post-thumb:hover img {
     transform: scale(1.14);
     transition: 0.5s all;
 }

 .post-thumb img {
     width: 100px;
     height: 95px;
     border-radius: 10px;
     transition: 0.5s all;
 }

 .post-info h6 {
     line-clamp: 2;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
     text-overflow: ellipsis;
     display: -webkit-box;
     margin-bottom: 10px;
 }

 .blog-user {
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .blog-user img {
     width: 32px;
     height: 32px;
     border-radius: 50%;
     margin-inline-end: 10px;
 }

 .blog-user-info p {
     font-size: 13px;
     font-weight: 600;
     color: #1d1d1d;
     margin-bottom: 0;
     text-overflow: ellipsis;
     overflow: hidden;
     white-space: nowrap;
 }

 .blog-user-info .xs-text {
     font-size: 10px;
     color: #4f4f4f;
     font-weight: normal;
 }

 /*-----------------
	16. About Us
-----------------------*/

 .about-us-section {
     padding: 55px 0;
 }

 .about-inner-img {
     margin-bottom: 24px;
     border-radius: 10px;
 }

 .about-inner-img img {
     border-radius: 10px;
     padding: 25px;
     background: #fff;
     box-shadow: var(--box-shadow);
 }

 .about-us-head p span {
     line-height: 26px;
 }

 .about-us-head h6 {
     color: var(--primary);
     margin-bottom: 5px;
 }

 .about-us-head h2 {
     font-size: 26px;
     margin-bottom: 10px;
     color: var(--primary);
     max-width: 500px;
 }

 .about-us-head p {
     margin-bottom: 5px;
 }

 .about-us-head h5 {
     font-size: 19px;
     margin-bottom: 10px;
 }

 .about-features {
     display: flex;
 }

 .about-features .list-one {
     margin-inline-end: 24px;
 }

 .about-features ul li {
     margin-bottom: 15px;
 }

 .about-features ul li span {
     margin-inline-end: 5px;
 }

 .about-us-header {
     text-align: center;
     margin-bottom: 40px;
 }

 .why-choose-sec {
     background: #fdf6f1;
     padding: 80px 0 56px;
 }

 .about-us-header h2 {
     font-size: 26px;
     margin-bottom: 10px;
 }

 .about-us-header p {
     max-width: 490px;
     margin: auto;
 }

 .why-choose-card {
     background: #fff;
     box-shadow: var(--box-shadow);
     border-radius: 10px;
     padding: 24px;
     display: flex;
     flex-direction: column;
     align-items: center;
     text-align: center;
     margin-bottom: 24px;
     transition: 0.5s all;
 }

 .why-choose-card:hover {
     transform: translateY(-5px);
     transition: 0.5s all;
 }

 .card-icon {
     width: 63px;
     height: 71px;
     border-radius: 64% 36% 26% 74% / 66% 75% 25% 34%;
     display: flex;
     align-items: center;
     justify-content: center;
     background: var(--secondary);
     margin: 0 auto 15px;
 }

 .why-choose-card h4 {
     font-size: 17px;
     margin-bottom: 15px;
 }

 .why-choose-card p {
     line-clamp: 3;
     -webkit-line-clamp: 3;
     -webkit-box-orient: vertical;
     overflow: hidden;
     text-overflow: ellipsis;
     display: -webkit-box;
     margin-bottom: 0;
 }

 .popular-category-sec {
     padding: 80px 0;
 }

 .popular-category-sec .about-us-header {
     margin-bottom: 20px;
 }

 .popular-cat-card {
     border: 1px solid #4f4f4f;
     padding: 24px 0;
     border-radius: 10px;
     display: flex;
     flex-direction: column;
     align-items: center;
     text-align: center;
     transition: 0.5s all;
     margin-top: 20px;
     box-shadow: var(--box-shadow);
 }

 .category-icon {
     width: 70px;
     height: 70px;
     border-radius: 50%;
     padding: 10px;
     background: #1d1d1d;
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 24px;
     transition: 0.5s all;
 }

 .popular-cat-card:hover .category-icon {
     background: var(--primary);
     transition: 0.5s all;
 }

 .popular-cat-card:hover {
     transform: translateY(-10px);
     transition: 0.5s all;
 }

 .popular-cat-card h4 {
     font-size: 17px;
     margin-bottom: 5px;
 }

 .popular-cat-card span {
     font-size: 13px;
     font-weight: 600;
 }

 .popular-category-slider .owl-dots {
     text-align: center;
     display: flex;
     justify-content: center;
     align-items: center;
     margin-top: 40px;
 }

 .popular-category-slider .owl-dots .owl-dot {
     width: 10px;
     height: 10px;
     background: #e6e6e6;
     border-radius: 20px;
     margin-inline-end: 5px;
 }

 .popular-category-slider .owl-dots .owl-dot:last-child {
     margin-inline-end: 0;
 }

 .popular-category-slider .owl-dots .owl-dot.active {
     width: 30px;
     background: var(--primary);
 }

 .client-review-sec {
     background: #fdf6f1;
     padding: 80px 0;
 }

 .review-card {
     background: #fff;
     border-radius: 10px;
     padding: 24px;
 }

 .review-card h4 {
     font-size: 19px;
     margin: 24px 0 15px;
 }

 .review-card p {
     margin-bottom: 15px;
     line-clamp: 4;
     -webkit-line-clamp: 4;
     -webkit-box-orient: vertical;
     overflow: hidden;
     text-overflow: ellipsis;
     display: -webkit-box;
 }

 .review-user {
     display: flex;
     align-items: center;
     padding-top: 24px;
     margin-top: 24px;
     border-top: 1px solid #b4b4b4;
 }

 .owl-carousel .quotation-icon img {
     width: auto;
 }

 .owl-carousel .review-user img {
     width: 60px;
     height: 60px;
     border-radius: 50%;
     margin-inline-end: 15px;
 }

 .review-user h6 {
     margin-bottom: 0;
     font-size: 15px;
 }

 .review-user h6 span {
     display: block;
     font-size: 13px;
     color: #4f4f4f;
     margin-top: 3px;
 }

 .start-seller-sec {
     padding: 80px 0;
 }

 .seller-inner-img img {
     border-radius: 10px;
     width: 100%;
 }

 .seller-info-content {
     background: #fff;
     box-shadow: var(--box-shadow);
     border-radius: 10px;
     padding: 40px;
     display: flex;
     align-items: center;
     flex-direction: column;
     justify-content: center;
     margin: auto 0 auto -100px;
     height: 530px;
 }

 .seller-info-content p {
     margin-bottom: 15px;
 }

 .seller-info-content h3 {
     font-size: 26px;
     margin-bottom: 15px;
 }

 .seller-para {
     line-clamp: 3;
     -webkit-line-clamp: 3;
     -webkit-box-orient: vertical;
     overflow: hidden;
     text-overflow: ellipsis;
     display: -webkit-box;
 }

 .sllers-list {
     display: flex;
     align-items: center;
     flex-direction: column;
     align-items: self-start;
     flex-shrink: 0;
     margin-inline-end: 15px;
 }

 .sllers-list li {
     margin-bottom: 15px;
 }

 .sllers-list li span {
     color: rgba(26, 190, 23, 1);
     margin-inline-end: 10px;
 }

 .seller-small-img img {
     border-radius: 10px;
     width: 100%;
 }

 /*-----------------
    17. Team
-----------------------*/

 .team-section {
     padding: 80px 0;
 }

 .team-grid {
     background: #fff;
     box-shadow: var(--box-shadow);
     border-radius: 10px;
     padding: 24px;
     margin-bottom: 24px;
     position: relative;
 }

 .team-img {
     position: relative;
     overflow: hidden;
     margin-bottom: 5px;
 }



 .team-overlay-img {
     position: relative;
     overflow: hidden;
     border-radius: 10px;
 }

 .team-overlay-img::after {
     content: "";
     position: absolute;
     top: 0;
     inset-inline-start: 0;
     width: 100%;
     height: 100%;
     border-radius: 10px;
     -webkit-transition: 0.7s;
     -moz-transition: 0.7s;
     -o-transition: 0.7s;
     transition: 0.7s;
 }

 .team-grid:hover .team-overlay-img::after {
     content: "";
     position: absolute;
     top: 0;
     inset-inline-start: 0;
     width: 100%;
     height: 100%;
     border-radius: 10px;
     background: rgba(0, 0, 0, 0.6);
     -webkit-transition: 0.7s;
     -moz-transition: 0.7s;
     -o-transition: 0.7s;
     transition: 0.7s;
 }

 .team-overlay-img img {
     width: 100%;
     border-radius: 10px;
     -webkit-transform: translateZ(0);
     -moz-transform: translateZ(0);
     transform: translateZ(0);
     -webkit-transition: 0.7s;
     -moz-transition: 0.7s;
     -o-transition: 0.7s;
     transition: 0.7s;
 }

 .team-grid:hover .team-overlay-img img {
     -webkit-transform: scale(1.15);
     -moz-transform: scale(1.15);
     transform: scale(1.15);
     -webkit-transition: 0.7s;
     -moz-transition: 0.7s;
     -o-transition: 0.7s;
     transition: 0.7s;
 }

 .team-view-btn {
     position: absolute;
     top: 0;
     width: 100%;
     text-align: center;
     opacity: 0;
     -webkit-transition: 0.7s;
     -moz-transition: 0.7s;
     -o-transition: 0.7s;
     transition: 0.7s;
 }

 .team-grid:hover .team-view-btn {
     top: 50%;
     opacity: 1;
     -webkit-transform: translate(0, -50%);
     transform: translate(0, -50%);
     -webkit-transition: 0.7s;
     -moz-transition: 0.7s;
     -o-transition: 0.7s;
     transition: 0.7s;
 }

 .team-view-btn .btn {
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     padding: 11px 18px;
     height: auto;
 }

 .team-content {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
 }

 .team-title {
     margin-top: 10px;
 }

 .team-title h4 {
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
     width: 200px;
     margin-bottom: 5px;
 }

 .team-title p {
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
     width: 180px;
     margin-bottom: 0;
 }

 .team-social-links {
     margin-top: 10px;
 }

 .team-social-links a {
     width: 40px;
     min-width: 40px;
     height: 40px;
     margin-inline-end: 5px;
     border-radius: 50%;
     background: #e6e6e6;
     color: #363636;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     -webkit-transition: 0.4s;
     -moz-transition: 0.4s;
     -o-transition: 0.4s;
     transition: 0.4s;
 }

 .team-social-links a:last-child {
     margin-inline-end: 0;
 }

 .team-social-links a:hover {
     background: var(--primary);
     color: #fff;
     -webkit-transition: 0.4s;
     -moz-transition: 0.4s;
     -o-transition: 0.4s;
     transition: 0.4s;
 }

 .hi-icon {
     display: inline-block;
     font-size: 0px;
     cursor: pointer;
     border-radius: 0;
     text-align: center;
     position: relative;
     z-index: 1;
 }

 .hi-icon:after {
     pointer-events: none;
     position: absolute;
     width: 100%;
     height: 100%;
     border-radius: 0;
     content: "";
     -webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
     box-sizing: content-box;
 }

 .hi-icon:before {
     speak-as: none;
     font-size: 17px;
     line-height: 20px;
     font-style: normal;
     font-weight: normal;
     font-variant: normal;
     text-transform: none;
     display: block;
     -webkit-font-smoothing: antialiased;
 }

 .hi-icon {
     overflow: hidden;
     -webkit-transition:
         background 0.3s,
         color 0.3s,
         box-shadow 0.3s;
     -moz-transition:
         background 0.3s,
         color 0.3s,
         box-shadow 0.3s;
     transition:
         background 0.3s,
         color 0.3s,
         box-shadow 0.3s;
 }

 .hi-icon:after {
     display: none;
 }

 .hi-icon:hover:before {
     -webkit-animation: toTopFromBottom 0.5s forwards;
     -moz-animation: toTopFromBottom 0.5s forwards;
     animation: toTopFromBottom 0.5s forwards;
 }

 @-webkit-keyframes toTopFromBottom {
     49% {
         -webkit-transform: translateY(-100%);
     }

     50% {
         opacity: 0;
         -webkit-transform: translateY(100%);
     }

     51% {
         opacity: 1;
     }
 }

 @-moz-keyframes toTopFromBottom {
     49% {
         -moz-transform: translateY(-100%);
     }

     50% {
         opacity: 0;
         -moz-transform: translateY(100%);
     }

     51% {
         opacity: 1;
     }
 }

 @keyframes toTopFromBottom {
     49% {
         transform: translateY(-100%);
     }

     50% {
         opacity: 0;
         transform: translateY(100%);
     }

     51% {
         opacity: 1;
     }
 }

 .team-details {
     margin-bottom: 40px;
 }

 .team-details-img {
     position: relative;
     overflow: hidden;
     border-radius: 10px;
 }

 .team-details-img img {
     width: 100%;
     border-radius: 10px;
 }

 .team-details-img .team-social-links {
     position: absolute;
     bottom: 20px;
     width: 100%;
     margin-top: 0;
     text-align: center;
 }

 .team-details-heading {
     margin-bottom: 24px;
 }

 .team-details-heading h2 {
     margin-bottom: 6px;
 }

 .team-details-heading h5 {
     color: var(--primary);
     margin-bottom: 24px;
 }

 .team-details-heading p {
     margin-bottom: 0;
 }

 .team-details-list ul li {
     margin-bottom: 8px;
 }

 .team-details-list ul li:last-child {
     margin-bottom: 0;
 }

 .team-details-list ul li span {
     font-weight: 600;
     color: #1d1d1d;
 }

 .team-persnoal-info {
     padding: 24px;
     margin-bottom: 40px;
     border-radius: 10px;
     background: #fff;
     box-shadow: var(--box-shadow);
 }

 .team-persnoal-info h3 {
     font-weight: 600;
     margin-bottom: 15px;
 }

 .team-persnoal-info p {
     margin-bottom: 0;
 }

 .team-skills {
     margin-bottom: 40px;
 }

 .team-skills-info {
     padding: 24px;
     border-radius: 10px;
     background: #fff;
     box-shadow: var(--box-shadow);
 }

 .team-skills-info h3 {
     font-weight: 600;
     margin-bottom: 15px;
 }

 .team-progress {
     margin-bottom: 24px;
 }

 .team-progress-content {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     margin-bottom: 10px;
 }

 .team-progress-content h6 {
     font-size: 13px;
     font-weight: 500;
     margin-bottom: 0;
 }

 .team-progress-content p {
     font-size: 13px;
     font-weight: 500;
     color: #1d1d1d;
     margin-bottom: 0;
 }

 .team-skills-info .progress {
     height: 10px;
 }

 .team-skills-info .progress-bar {
     background: var(--primary);
 }

 .team-skills-info .progress-bar.w-90 {
     width: 90%;
 }

 .team-skills-info .progress-bar.w-82 {
     width: 82%;
 }

 .team-skills-info .progress-bar.w-85 {
     width: 85%;
 }

 .team-skills-info .progress-bar.w-95 {
     width: 95%;
 }

 .team-skills-info .progress-bar.w-80 {
     width: 80%;
 }

 .team-skills-info ul li {
     position: relative;
     padding-inline-start: 30px;
     margin-bottom: 15px;
 }

 .team-skills-info ul li:after {
     content: "\f111";
     font-family: "Font Awesome 5 Free";
     font-weight: 600;
     position: absolute;
     display: block;
     font-size: 6px;
     top: 8px;
     inset-inline-start: 12px;
 }

 .team-skills-info p {
     margin-bottom: 0;
 }

 .team-form {
     background: #fff;
     box-shadow: var(--box-shadow);
     border-radius: 10px;
     padding: 24px;
     width: 440px;
     max-width: 100%;
 }

 .team-form-heading {
     margin-bottom: 24px;
 }

 .team-form-heading h3 {
     color: var(--primary);
     font-weight: 600;
     margin-bottom: 5px;
 }

 .team-form-heading p {
     font-weight: 600;
     margin-bottom: 0;
 }

 .team-form .form-group {
     margin-bottom: 24px;
 }

 .team-form .form-group textarea.form-control {
     min-height: 160px;
 }

 /*-----------------
    18. Contact Us
-----------------------*/

 .contact-top {
     padding: 80px 0;
 }

 .contact-map iframe {
     width: 100%;
     height: 100%;
     border: none;
 }

 .contact-bottom {
     padding: 80px 0 56px;
 }

 .contact-grid {
     box-shadow: var(--box-shadow);
     border-radius: 10px;
     background: #fff;
     padding: 24px;
     margin-bottom: 24px;
     text-align: center;
 }

 .contact-grid.con-info {
     border: 1px solid #cdcdcd;
     box-shadow: none;
     text-align: start;
 }

 .contact-grid.con-info .contact-content {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .contact-grid.con-info .contact-icon {
     margin-bottom: 0;
 }

 .contact-grid.con-info .contact-icon span {
     border: 1px solid var(--primary);
     background: #fff;
 }

 .contact-icon span i {
     font-size: 27px;
     color: #ff6a26;
 }

 .contact-grid.con-info .contact-icon {
     margin: 0 15px 0 0;
 }

 .contact-icon {
     margin: 0 0 15px 0;
 }

 .contact-icon span {
     width: 60px;
     height: 60px;
     border-radius: 50px;
     background: var(--main-bg);
     box-shadow: var(--box-shadow);
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     margin: auto;
     -webkit-transition: 0.4s;
     -moz-transition: 0.4s;
     -o-transition: 0.4s;
     transition: 0.4s;
 }

 .contact-icon span img {
     filter: grayscale(1);
     -webkit-transition: 0.4s;
     -moz-transition: 0.4s;
     -o-transition: 0.4s;
     transition: 0.4s;
 }

 .contact-grid:hover .contact-icon span {
     background: var(--primary);
     -webkit-transition: 0.4s;
     -moz-transition: 0.4s;
     -o-transition: 0.4s;
     transition: 0.4s;
 }

 .contact-grid:hover .contact-icon span img,
 .contact-grid:hover .contact-icon span svg {
     filter: brightness(10000) grayscale(1);
     transform: rotateY(360deg);
     -webkit-transform: rotateY(360deg);
     -ms-transform: rotateY(360deg);
     -webkit-transition: 0.4s;
     -moz-transition: 0.4s;
     -o-transition: 0.4s;
     transition: 0.4s;
 }

 .contact-details {
     color: var(--primary);

     h6 {
         margin-bottom: 15px;
     }

     p {
         margin-bottom: 0;
         color: var(--primary);
     }
 }

 .contact-details-address p {
     max-width: 200px;
     margin: 0 auto 0;
 }

 .contact-map {
     border-radius: 10px;
     overflow: hidden;
     box-shadow: var(--box-shadow);
 }

 .contact-map.map-v3 {
     line-height: 0;
     margin-bottom: 0;
 }

 .contact-map.map-v3 iframe {
     height: 500px;
 }

 .contact-img img {
     border-radius: 10px;
 }

 /*-----------------
	19. Service
-----------------------*/

 .service-gigs .gigs-grid {
     margin-bottom: 24px;
 }

 .sidebar-widget {
     border-radius: 10px;
     background: #fff;
     padding: 20px;
     box-shadow: var(--box-shadow);
 }

 .sidebar-header {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     margin-bottom: 14px;
     flex-wrap: wrap;
 }

 .sidebar-header h3 {
     margin-bottom: 10px;
 }

 .sidebar-header .reset-link {
     text-decoration: underline;
     margin-bottom: 10px;
     color: #e82646;
     font-size: 13px;
     font-weight: 500;
 }

 .sidebar-header .reset-link:hover {
     color: var(--primary);
 }

 .sidebar-widget .btn {
     height: auto;
     padding: 9px 20px;
 }

 .sidebar-widget .btn i {
     padding-inline-end: 5px;
 }

 .collapse-card {
     margin-bottom: 15px;
 }

 .sidebar-widget .collapse-card:last-child .card-title a.collapsed {
     border: 0;
 }

 .collapse-card .card-title {
     font-size: 15px;
 }

 .collapse-card .card-title a {
     position: relative;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     padding-bottom: 15px;
     border-bottom: 1px solid #eee;
     color: #4f4f4f;
 }

 .collapse-card .card-title a:hover,
 .collapse-card .card-title a.collapsed:hover::after {
     color: var(--primary);
 }

 .collapse-card .card-title a::after {
     content: "\f056";
     font-family: "Font Awesome 5 Free";
     font-weight: 900;
     position: absolute;
     inset-inline-end: 0;
     top: 1px;
     font-size: 15px;
     color: var(--primary);
 }

 .collapse-card .card-title a.collapsed::after {
     content: "\f055";
     color: #1d1d1d;
 }

 .collapse-card .card-title a img {
     margin-inline-end: 8px;
     filter: opacity(0.5);
 }

 .collapse-body {
     padding: 15px 0;
 }

 .collapse-body ul li:not(:last-child) {
     margin-bottom: 10px;
 }

 .collapse-body ul li .custom_check {
     font-size: 15px;
     font-weight: 400;
     margin-bottom: 0;
 }

 .collapse-body ul li .custom_check .checkmark {
     top: 2px;
 }

 .sidebar-widget .form-group {
     margin-bottom: 20px;
 }

 .sidebar-widget .form-control {
     padding: 10px 12px;
     font-weight: 600;
 }

 .search-group {
     position: relative;
 }

 .search-group .search-icon {
     position: absolute;
     top: 50%;
     inset-inline-start: 8px;
     transform: translateY(-50%);
     color: var(--primary);
 }

 .search-group .form-control {
     padding: 10px 40px 10px 40px;
 }

 .seller-list li a {
     color: #4f4f4f;
 }

 .seller-list li a:hover {
     color: var(--primary);
 }

 .seller-list li span {
     float: inline-end;
 }

 .custom_radio {
     color: #4f4f4f;
     display: inline-block;
     position: relative;
     font-size: 15px;
     padding-inline-start: 30px;
     margin-bottom: 0 !important;
     cursor: pointer;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
 }

 .custom_radio input {
     position: absolute;
     opacity: 0;
 }

 .custom_radio input:checked~.checkmark:after {
     opacity: 1;
 }

 .custom_radio .checkmark {
     position: absolute;
     top: 50%;
     inset-inline-start: 0;
     height: 20px;
     width: 20px;
     transform: translateY(-50%);
     background-color: #fff;
     border: 1px solid #cdcdcd;
     border-radius: 50%;
 }

 .custom_radio .checkmark:after {
     display: block;
     content: "";
     position: absolute;
     opacity: 0;
     top: 50%;
     transform: translate(-50%, -50%);
     inset-inline-start: 50%;
     width: 8px;
     height: 8px;
     border-radius: 50%;
     background: var(--primary);
     -webkit-transition: all 0.4s ease;
     -ms-transition: all 0.4s ease;
     transition: all 0.4s ease;
 }

 [dir="rtl"] .custom_radio .checkmark:after {
     transform: translate(50%, -50%);
 }

 .slide-title-wrap {
     margin-top: 20px;
 }

 .title-section {
     border-bottom: 1px solid #f0f0f0;
     padding-bottom: 9px;
     margin-bottom: 24px;
 }

 .title-header {
     margin-bottom: 15px;
 }

 .title-header h3 {
     margin-bottom: 5px;
 }

 .title-header p {
     font-size: 17px;
     font-weight: 500;
     margin-bottom: 0;
 }

 .title-filter {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     justify-content: end;
     -webkit-justify-content: end;
     -ms-flex-pack: end;
     float: inline-end;
 }

 .title-filter .select2-container .select2-selection--single {
     height: 42px;
 }

 .title-filter .search-group {
     max-width: 276px;
     margin-bottom: 15px;
 }

 .title-section .search-filter-selected {
     margin: 0 0 0 10px;
     margin-inline-start: 10px;
 }

 .title-section .search-filter-selected .form-group {
     margin-bottom: 15px;
 }

 .text-dark {
     color: #1d1d1d !important;
 }

 .view-all a {
     font-size: 13px;
     font-weight: 600;
     color: var(--primary);
 }

 .gigs-user-info {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
 }

 .gigs-user-info li {
     position: relative;
     padding-inline-start: 9px;
     margin-inline-end: 8px;
 }

 .gigs-user-info li:first-child {
     padding-inline-start: 0;
 }

 .gigs-user-info li:last-child {
     margin-inline-end: 0;
 }

 .gigs-user-info li:first-child::before {
     content: none;
 }

 .gigs-user-info li::before {
     content: "|";
     position: absolute;
     top: 0;
     height: 100%;
     color: #cdcdcd;
     width: 1px;
     inset-inline-start: 0;
 }

 .gigs-user {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
 }

 .gigs-user img {
     width: 24px;
     height: 24px;
     flex-shrink: 0;
     margin-inline-end: 8px;
     border-radius: 50%;
 }

 .gigs-user-info p {
     font-size: 13px;
     font-weight: 600;
     margin-bottom: 0;
 }

 .gigs-loc p i {
     margin-inline-end: 8px;
 }

 .view-content ul li:last-child {
     margin-bottom: 10px;
 }

 .service-sliders.owl-carousel .owl-stage {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
 }

 .service-box {
     border-radius: 10px;
     background: #fff;
     border: 1px solid transparent;
     box-shadow: var(--box-shadow);
     padding: 15px;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     height: 100%;
 }

 .service-box:hover {
     border: 1px solid var(--primary);
 }

 .service-box .service-info {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
 }

 .service-box .service-icon {
     border-radius: 10px;
     width: 62px;
     background: #fff;
     height: 62px;
     box-shadow: var(--box-shadow);
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     justify-content: center;
     -webkit-justify-content: center;
     margin-inline-end: 12px;
     flex-shrink: 0;

     img {
         width: auto;
         padding: 10px;
         max-height: 100%;
     }
 }

 .service-box .servive-name h5 {
     margin-bottom: 0;
 }

 .service-box .servive-name p {
     margin-bottom: 0;
 }

 .slider-title {
     font-size: 26px;
     margin-bottom: 20px;
 }

 .service-nav {
     margin-bottom: 20px;
 }

 .service-gigs .gigs-info small {
     font-size: 13px;
     font-weight: 500;
     color: #4f4f4f;
     margin-inline-start: 8px;
     margin-inline-end: auto;
 }

 .filters-wrap {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     flex-wrap: wrap;
     margin-bottom: 9px;
 }

 .filters-wrap>li {
     display: inline-block;
     margin-inline-end: 15px;
 }

 .filters-wrap li.view-all {
     margin-bottom: 15px;
 }

 .filters-wrap li.view-all img {
     margin-inline-end: 8px;
 }

 .filters-wrap .collapse-card {
     position: relative;
 }

 .filters-wrap .filter-header a {
     border: 1px solid #cdcdcd;
     border-radius: 10px;
     background: #fff;
     padding: 10px 30px 10px 10px;
     font-size: 13px;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     position: relative;
     color: #4f4f4f;
     white-space: nowrap;
 }

 .filters-wrap .filter-header a img {
     margin-inline-end: 8px;
 }

 .filters-wrap .filter-header a::after {
     content: "\f078";
     font-family: "Font Awesome 5 Free";
     font-weight: 900;
     position: absolute;
     inset-inline-end: 10px;
     top: 50%;
     transform: translateY(-50%);
     font-size: 13px;
     color: #4f4f4f;
 }

 .filters-wrap .collapse-body {
     border-radius: 10px;
     background: #fff;
     box-shadow: var(--box-shadow);
     position: absolute;
     top: 100%;
     width: 320px;
     inset-inline-start: 0;
     z-index: 2;
     padding: 15px;
     display: none;
     margin-top: 5px;
 }

 .filter-btn {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     border-top: 1px solid #cdcdcd;
     padding-top: 15px;
     margin-top: 15px;
 }

 .filter-btn a {
     font-weight: 600;
     color: #040404;
 }

 .filter-btn .btn {
     padding: 8px 14px;
     height: auto;
 }

 .marketing-section {
     border-radius: 10px;
     background: #040404;
     position: relative;
     padding: 60px;
     text-align: center;
     color: #fff;
     margin-bottom: 40px;
     overflow: hidden;
 }

 .marketing-section h2 {
     font-size: 26px;
     color: #fff;
     margin-bottom: 5px;
 }

 .marketing-section p {
     font-size: 13px;
     margin-bottom: 0;
 }

 .market-bg {
     position: absolute;
     inset-inline-end: 0;
     top: 0;
 }

 .market-img {
     position: absolute;
     inset-inline-start: 0;
     top: 0;
 }

 .marketing-content {
     margin: auto;
     max-width: 512px;
 }

 .owl-nav.disabled {
     display: none;
 }

 .trend-section {
     border-bottom: 1px solid #cdcdcd;
     margin-bottom: 24px;
     padding-bottom: 24px;
 }

 .trend-section h3 {
     font-weight: 600;
     margin-bottom: 20px;
 }

 .trend-section .trend-nav {
     margin-bottom: 20px;
 }

 .trend-box {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     border-radius: 10px;
     border: 1px solid #cdcdcd;
     background: #fff;
     box-shadow: var(--box-shadow);
     padding: 15px;
 }

 .trend-info {
     margin-inline-end: 24px;
 }

 .trend-info h6 {
     font-size: 17px;
     font-weight: 500;
     margin-bottom: 2px;
 }

 .trend-info p {
     font-size: 10px;
     font-weight: 500;
     margin-bottom: 0;
 }

 .filters-section {
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
 }

 .service-sliders.owl-carousel .owl-stage-outer {
     overflow: visible;
 }

 .service-sliders .owl-item {
     opacity: 0;
     transition: opacity 2000ms;
 }

 .service-sliders .owl-item.active {
     opacity: 1;
 }

 .owl-carousel button.owl-dot {
     width: 8px;
     height: 8px;
     border-radius: 50%;
     background: #e6e6e6;
     margin: 0 3px;
 }

 .owl-carousel button.owl-dot.active {
     width: 30px;
     border-radius: 5px;
 }

 .slider-card {
     overflow: hidden;
 }

 .slider-card .slick-track {
     display: flex;
 }

 .slider-card .slick-slide {
     width: 25% !important;
     margin: 0 10px;
     overflow: hidden;
 }

 .slider-card .slick-slide.slick-cloned {
     width: 25% !important;
     margin: 0 10px;
     overflow: hidden;
 }

 .slider-card .slick-slide.slick-active {
     width: 100% !important;
     margin: 0 10px;
     overflow: hidden;
 }

 .slider-card .service-slider .slick-slide.slick-active {
     width: 25% !important;
 }

 .singleImage.slider-card .service-slider .slick-slide.slick-active {
     width: 100% !important;
 }

 .slider-card .slick-slide img {
     width: 100%;
     border-radius: 10px;
 }

 .service-slider {
     position: relative;
     margin-bottom: 15px;
     direction: ltr;
     z-index: 999;
 }

 .service-slider button {
     width: 44px;
     height: 44px;
     border: 1px solid #cdcdcd;
     font-size: 0;
     background: #fff;
     border-radius: 50%;
     z-index: 9999;
     transition: 0.5s all;
 }

 .service-slider button:hover {
     background: #1d1d1d;
     border-color: #1d1d1d;
     transition: 0.5s all;
     color: #fff;
 }

 .service-slider button.slick-prev {
     position: absolute;
     top: 50%;
     inset-inline-start: 30px;
     transform: translateY(-50%);
 }

 .service-slider button.slick-prev:before {
     content: "\f053";
     display: inline-block;
     font-family: "Font Awesome 5 Free";
     font-size: 14px;
     font-weight: 900;
 }

 .service-slider button.slick-next {
     position: absolute;
     top: 50%;
     inset-inline-end: 30px;
     transform: translateY(-50%);
 }

 .service-slider button.slick-next:before {
     content: "\f054";
     display: inline-block;
     font-family: "Font Awesome 5 Free";
     font-size: 14px;
     font-weight: 900;
 }

 /*-----------------
	20. Authentication
-----------------------*/

 .login-wrapper {
     width: 100%;
     overflow: hidden;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
 }

 .login-wrapper .login-content {
     width: 100%;
     padding: 24px 0;
     overflow: auto;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     flex-wrap: wrap;
 }

 .login-wrapper .login-content .login-logo {
     display: block;
     max-width: 310px;
     margin: 0 auto 20px;
     text-align: center;
 }

 .login-wrapper .login-userset {
     width: 470px;
 }

 .login-heading {
     text-align: center;
     margin-bottom: 30px;
 }

 .login-heading h3 {
     font-weight: 600;
     margin-bottom: 5px;
 }

 .login-heading p {
     margin-bottom: 0;
 }

 .form-wrap {
     position: relative;
     margin-bottom: 24px;
 }

 .login-card {
     padding: 30px;
     border-radius: 10px;
     background: #fff;
     box-shadow: var(--box-shadow);
 }

 .login-card .login-logo a img {
     height: 80px;
 }

 .form-icon {
     position: absolute;
     top: 25px;
     transform: translateY(-50%);
     inset-inline-end: 15px;
 }

 .form-icon .form-control {
     padding: 10px 30px 10px 15px;
 }

 .form-focus .focus-label {
     font-size: 13px;
     font-weight: 400;
     pointer-events: none;
     position: absolute;
     -webkit-transform: translate3d(0, -50%, 0) scale(1);
     -ms-transform: translate3d(0, -50%, 0) scale(1);
     -o-transform: translate3d(0, -50%, 0) scale(1);
     transform: translate3d(0, -50%, 0) scale(1);
     transform-origin: left top;
     transition: 240ms;
     inset-inline-start: 44px;
     top: 24px;
     z-index: 1;
     color: #828282;
     margin-bottom: 0;
 }

 .form-focus.focused .focus-label {
     opacity: 1;
     top: 0px;
     font-size: 10px;
     z-index: 1;
     background-color: #fff;
     color: var(--primary);
     padding: 0 5px;
     inset-inline-start: 11px;
 }

 .form-focus.focused .form-control {
     background: #ffffff;
     border-color: var(--primary);
 }

 .form-focus .form-control:focus {
     border-color: var(--primary);
 }

 .form-focus .form-control:focus~.focus-label,
 .form-focus .form-control:-webkit-autofill~.focus-label {
     opacity: 1;
     font-weight: 400;
     top: 0;
     font-size: 10px;
     z-index: 1;
     background-color: var(--main-bg);
     color: var(--primary);
     padding: 0 5px;
     inset-inline-start: 11px;
 }

 .login-content .btn {
     width: 100%;
     height: auto;
     padding: 10px 20px;
 }

 .span-or {
     background-color: #f3f3f3;
     padding: 0 10px;
     z-index: 9;
     position: relative;
 }

 .login-or::before {
     inset-inline-start: 0;
 }

 .login-or::after {
     inset-inline-end: 0;
 }

 .login-or::before,
 .login-or::after {
     width: 100%;
     content: "";
     border-top: 1px solid #dbdbdb;
     position: absolute;
     top: 50%;
 }

 .login-or {
     text-align: center;
     font-size: 13px;
     font-weight: 500;
     color: #1d1d1d;
     margin: 12px 0;
     padding: 10px 0;
     position: relative;
 }

 .login-social-link {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
 }

 .login-social-link li {
     width: 50%;
 }

 .login-social-link li a {
     box-shadow: var(--box-shadow);
     font-weight: 500;
     color: #1d1d1d;
     padding: 11px 10px;
     border-radius: 10px;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     background-color: #fff;
     border: 1px solid #fff;
 }

 .login-social-link li a:hover {
     border: 1px solid #ff7f25;
     color: #ff7f25;
 }

 .login-social-link li a img {
     margin-inline-end: 5px;
 }

 .login-social-link li+li {
     margin-inline-start: 15px;
 }

 .acc-in {
     text-align: center;
     margin-top: 30px;
 }

 .acc-in p {
     font-size: 14px;
     font-weight: 500;
     color: #4d4d4d;
     margin-bottom: 0;
 }

 .acc-in p a {
     color: var(--primary);
     text-decoration: underline;
 }

 .authentication-wrapper {
     background: #004c2414;
     height: 100%;
     position: fixed;
     top: 0;
     inset-inline-start: 0;
     width: 50%;
 }

 .authentication-content {
     height: 100%;
     -webkit-box-align: end;
     -ms-flex-align: end;
     align-items: end;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     justify-content: end;
 }

 .login-slider {
     padding: 0 80px;
     text-align: center;
 }

 .login-slider h2 {
     color: #393939;
     margin-bottom: 10px;
 }

 .login-slider p {
     color: #919191;
     font-weight: 600;
     margin-bottom: 0;
 }

 .login-bg .shape-01 {
     position: absolute;
     top: 0;
     inset-inline-start: 0;
 }

 .login-bg .shape-04 {
     position: absolute;
     top: 25%;
     inset-inline-start: 50px;
 }

 .login-bg .shape-02 {
     position: absolute;
     top: 3%;
     inset-inline-end: 5%;
 }

 .login-bg .shape-03 {
     position: absolute;
     top: 8%;
     inset-inline-start: 45%;
 }

 .login-bg .shape-05 {
     position: absolute;
     bottom: 10px;
     inset-inline-start: 50px;
     animation: spin 3000ms linear infinite;
 }

 .login-bg .shape-06 {
     position: absolute;
     bottom: 0;
     inset-inline-start: 45%;
 }

 .login-bg .shape-07 {
     position: absolute;
     bottom: 0;
     inset-inline-start: 70%;
 }

 .forgot-link {
     text-decoration: underline;
     font-size: 13px;
     font-weight: 600;
     color: #575757;
 }

 .mantadory-info p {
     color: #e82646;
     margin-bottom: 0;
 }

 .mantadory-info p i {
     margin-inline-end: 8px;
 }

 /*-----------------
	21. Error
-----------------------*/

 .error-wrapper {
     width: 100%;
     overflow: hidden;
     height: 100vh;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
 }

 .error-item {
     width: 100%;
     height: 100vh;
     padding: 24px;
     overflow: auto;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     flex-wrap: wrap;
 }

 .error-imgs .error-bg {
     position: absolute;
     z-index: -1;
 }

 .error-imgs .error-01 {
     inset-inline-start: 6%;
     bottom: 20%;
 }

 .error-imgs .error-02 {
     inset-inline-start: 50%;
     transform: translateX(-50%);
     top: 5%;
 }

 .error-imgs .error-03 {
     inset-inline-end: 7%;
     bottom: 30%;
 }

 .error-imgs .error-04 {
     inset-inline-end: 7%;
     top: 10%;
 }

 .error-imgs .error-05 {
     inset-inline-start: 14%;
     top: 20%;
     width: 66px;
 }

 .error-img img {
     margin-bottom: 50px;
 }

 .error-info {
     margin: 0 auto;
     max-width: 390px;
 }

 .error-content h2 {
     font-size: 32px;
     margin-bottom: 10px;
 }

 .error-content p {
     color: #828282;
     margin: 0 0 10px;
 }

 .error-content .btn {
     padding: 8px 17px;
 }

 .error-content .btn i {
     margin-inline-start: 5px;
 }

 .count-bgs .count-01 {
     position: absolute;
     bottom: -20px;
     inset-inline-start: -15px;
     z-index: -1;
     width: 66px;
 }

 .count-bgs .count-02 {
     position: absolute;
     bottom: -70px;
     inset-inline-end: 5%;
     z-index: -1;
 }

 .count-imgs.error-imgs .error-01 {
     inset-inline-start: 30px;
     bottom: 10%;
 }

 .count-imgs.error-imgs .error-05 {
     inset-inline-start: 14%;
     top: 10%;
 }

 .count-imgs.error-imgs .error-02 {
     bottom: 50px;
     inset-inline-end: 5%;
     inset-inline-start: auto;
     top: auto;
 }

 /*-----------------
	22. Coming Soon
-----------------------*/

 .days-count {
     position: relative;
     display: inline-block;
     margin-bottom: 80px;
 }

 .days-count ul {
     background-color: #fff;
     border: 1px solid #cdcdcd;
     border-radius: 10px;
     padding: 24px 24px 10px;
     display: inline-block;
     position: relative;
 }

 .days-count ul li {
     display: inline-block;
     padding: 10px;
     border-inline-end: 1px solid #cdcdcd;
     text-align: center;
     width: 200px;
     margin-bottom: 14px;
 }

 .days-count ul li:last-child {
     border: 0;
 }

 .days-count ul li h3 {
     font-size: 32px;
     margin-bottom: 0;
 }

 .days-count ul li p {
     color: #686868;
     margin-bottom: 0;
 }

 .header-logo {
     margin-bottom: 50px;
 }

 .coming-soon {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     flex-direction: column;
     height: inherit;
     padding: 20px;
     overflow: auto;
     width: 100%;
 }

 .coming-content h2 {
     font-size: 37px;
     margin-bottom: 24px;
 }

 .getback-content {
     max-width: 535px;
     width: 100%;
     margin: 0 auto;
 }

 .getback-content p {
     margin-bottom: 30px;
 }

 .getback-content .form-wrap {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
 }

 .mail-form .btn {
     padding: 8px 15px;
     height: 42px;
 }

 .mail-form .form-control {
     font-weight: 600;
     height: 42px;
     margin-inline-end: 10px;
 }

 .social-footer {
     margin-top: 50px;
 }

 .social-footer .social-icon {
     margin-bottom: 15px;
 }

 .social-footer p {
     color: #1d1d1d;
     margin-bottom: 0;
 }

 .social-icon li {
     display: inline-block;
     margin-inline-end: 15px;
 }

 .provide-box .provide-icon img {
     width: 88%;
     height: 75%;
     object-fit: none;
 }

 .social-icon li:last-child {
     margin-inline-end: 0;
 }

 .social-icon li a {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     background: #1d1d1d;
     color: #fff;
     width: 50px;
     height: 50px;
     border-radius: 50%;
 }

 .lock-screen .login-heading h3 {
     margin-bottom: 15px;
 }

 .lock-user img {
     width: 80px;
     height: 80px;
     border-radius: 50%;
     margin-bottom: 15px;
 }

 .lock-user p {
     font-weight: 600;
     color: #1d1d1d;
 }

 .coming-content .progress {
     height: 12px;
 }

 .progress-wrap {
     max-width: 386px;
     width: 100%;
     margin: 0 auto 80px;
 }

 .progress-wrap p {
     text-align: left;
     font-weight: 600;
 }

 .progress-wrap p span {
     float: inline-end;
 }

 .maintanence-sec .coming-content h2 {
     font-size: 56px;
     margin-bottom: 15px;
 }

 .maintanence-sec .coming-content p {
     margin-bottom: 15px;
 }

 .lock-screen .login-card {
     max-width: 480px;
     margin: 0 auto;
     width: 100%;
 }

 /*-----------------
	23. Category
-----------------------*/

 .category-wrap .category-item {
     margin-bottom: 40px;
 }

 .category-item {
     margin-bottom: 24px;
 }

 .category-img {
     position: relative;
     transition: 0.5s all;
     overflow: hidden;
     border-radius: 10px;
     margin-bottom: 14px;
 }

 .category-img img {
     border-radius: 10px;
     transition: 0.5s all;
 }

 .category-item .category-img:hover img {
     transform: scale(1.14);
     transition: 0.5s all;
 }

 .category-slug {
     position: absolute;
     top: 50%;
     inset-inline-start: 50%;
     transform: translate(-50%, -50%);
     width: 100%;
     text-align: center;
 }

 [dir="rtl"] .category-slug {
     transform: translate(50%, -50%);
 }

 .category-slug a {
     box-shadow: var(--box-shadow);
     background: #fff;
     color: #1d1d1d;
     font-size: 13px;
     font-weight: 600;
     padding: 5px 10px;
     border-radius: 10px;
 }

 .category-list ul li {
     padding: 10px 0;
     border-bottom: 1px solid #cdcdcd;
 }

 .category-list ul li:last-child {
     padding-bottom: 0;
     border-bottom: 0;
 }

 .category-list ul li a {
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .category-list ul li a i {
     margin-inline-start: 8px;
     opacity: 0;
     transition: 0.5s all;
 }

 .category-list ul li a:hover {
     color: var(--primary);
 }

 .category-list ul li a:hover i {
     opacity: 1;
     transition: 0.5s all;
 }

 /*-----------------
	24. Blog Details
-----------------------*/

 .page-text {
     table {
         border: 1px solid #eee;
         box-shadow: var(--box-shadow);

         td {
             padding: 12px 16px;
             border-bottom: 1px solid #ddd;
         }
     }
 }

 .blog-detail-img img {
     border-radius: 10px;
     margin-bottom: 20px;
 }

 .blog-contents p {
     margin-bottom: 20px;
     line-height: 30px;
     margin-top: 10px;
 }

 .blog-wrap {
     background: #fdf6f1;
     border-inline-start: 2px solid var(--primary);
     padding: 24px;
     margin-bottom: 20px;
 }

 .blog-contents .blog-wrap p,
 .blog-wrap p {
     margin-bottom: 0;
 }

 .blog-author {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     padding: 24px;
     background: var(--secondary);
     margin-bottom: 20px;
     border-radius: 10px;
 }

 .blog-author .author-img {
     margin-inline-end: 10px;
     flex-shrink: 0;
 }

 .blog-author .author-img img {
     width: 120px;
     height: 120px;
     border-radius: 50%;
 }

 .blog-author .author-detail h5 {
     color: var(--primary);
     font-size: 15px;
     font-weight: 400;
     margin-bottom: 5px;
 }

 .blog-author .author-detail h6 {
     color: #1d1d1d;
     margin-bottom: 10px;
 }

 .blog-author .author-detail p {
     margin-bottom: 0;
 }

 .blog-details .blog-pagination {
     margin-bottom: 20px;
     display: flex;
 }

 .blog-pagination {
     border: 1px solid #cdcdcd;
     border-width: 1px 0 1px 0;
     padding: 20px 0 10px;
 }

 .blog-pagination .page-link {
     font-size: 14px;
     font-weight: 500;
     margin-bottom: 10px;
 }

 .blog-pagination p {
     font-size: 10px;
     font-weight: 500;
     margin-bottom: 0;
 }

 .blog-pagination .page-link a {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     margin-bottom: 5px;
 }

 .blog-pagination .page-previous i {
     margin-inline-end: 5px;
 }

 .blog-pagination .page-next i {
     margin-inline-start: 5px;
 }

 .blog-paginationblog-details {
     margin-bottom: 20px;
 }

 .comment-section h3 {
     margin-bottom: 24px;
 }

 .comment-section .custom_check {
     font-weight: 600;
 }

 .relate-post-section {
     padding: 80px 0 56px;
 }

 .relate-post-section h3 {
     margin-bottom: 15px;
 }

 .badge.bg-primary-light {
     color: var(--primary);
     background: #fff;
 }

 /*-----------------
	25. Portfolio Details
-----------------------*/

 .portfolio-detail-img {
     margin-bottom: 24px;
 }

 .portfolio-detail-img img {
     border-radius: 10px;
 }

 .portfolio-header {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     flex-wrap: wrap;
     margin-bottom: 14px;
 }

 .portfolio-header h2 {
     margin-bottom: 10px;
 }

 .portfolio-header .badge {
     display: inline-block;
     padding: 7px 10px;
     margin-bottom: 10px;
 }

 .portfolio-contents h5 {
     margin-bottom: 15px;
 }

 .portfolio-scope {
     margin-bottom: 24px;
 }

 .portfolio-scope p {
     margin-bottom: 15px;
 }

 .portfolio-scope p:last-child {
     margin-bottom: 0;
 }

 .portfolio-scope ul li {
     position: relative;
     padding-inline-start: 15px;
 }

 .portfolio-scope ul li::before {
     position: absolute;
     content: "\f111";
     font-family: "Font Awesome 5 Free";
     font-weight: 600;
     top: 8px;
     inset-inline-start: 0;
     font-size: 6px;
 }

 .portfolio-info {
     box-shadow: var(--box-shadow);
     padding: 24px 24px 19px;
     margin-bottom: 24px;
 }

 .portfolio-info h6 {
     margin-bottom: 5px;
 }

 .portfolio-info p {
     margin-bottom: 0;
 }

 .portfolio-social .social-icon li {
     margin: 0 10px 5px 0;
 }

 .portfolio-box {
     margin-bottom: 24px;
 }

 .portfolio-social {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     flex-wrap: wrap;
 }

 .portfolio-social h6 {
     margin: 0 22px 5px 0;
 }

 .portfolio-social .social-icon li a {
     width: 40px;
     height: 40px;
     background: #e6e6e6;
     color: #363636;
 }

 .portfolio-social .social-icon li a:hover {
     background: var(--primary);
     color: #fff;
 }

 .portfolio-details .blog-pagination {
     margin-bottom: 24px;
 }

 .navbar-nav>li a.nav-link.active,
 .navbar-nav>li a.active {
     color: var(--primary);
     position: relative;
 }

 /*.navbar-nav > li > a.nav-link.active::before,*/
 /*.navbar-nav > li > a.active::before {*/
 /*    content: "";*/
 /*    width: 10px;*/
 /*    height: 10px;*/
 /*    background: var(--primary);*/
 /*    position: absolute;*/
 /*    border-top-left-radius: 30px;*/
 /*    inset-inline-start: 50%;*/
 /*    top: 12px;*/
 /*    transform: translatex(-50%);*/
 /*}*/
 .navbar-nav>li>a.nav-link.active::after,
 .navbar-nav>li>a.active::after {
     content: "";
     width: 90%;
     height: 10px;
     position: absolute;
     border-top: 2px solid var(--primary);
     bottom: 10px;
     inset-inline-start: 0;
     inset-inline-end: 0;
     margin: auto;
 }

 /*-----------------
	27. Footer
-----------------------*/

 .footer {
     padding: 40px 0 0;
     background: #474747;
     position: relative;
     z-index: 1;
     box-shadow: var(--box-shadow);
 }

 .footer-bg-two {
     position: absolute;
     inset-inline-start: 0;
     bottom: 50px;
     max-width: 220px;
     z-index: -1;
 }

 .footer-widget {
     margin-bottom: 20px;
 }

 .footer-widget a img {
     filter: brightness(1000);
 }

 .footer-widget img {
     margin-bottom: 20px;
     height: 100px;
 }

 .footer-widget h3 {
     font-size: 19px;
     color: #ffffff;
     margin-bottom: 24px;
 }

 .footer-widget p {
     color: #cfcfcf;
     margin-bottom: 20px;
     max-width: 290px;
     font-weight: 400;
     font-size: 14px;
 }

 .footer-widget .menu-items li a:hover {
     color: var(--primary);
 }

 .footer-widget .menu-items li {
     margin-bottom: 10px;
     position: relative;
     display: flex;
     align-items: center;
     padding-inline-start: 15px;
 }

 .footer-widget .menu-items li:last-child {
     margin-bottom: 0;
 }

 .footer-widget .menu-items li::before {
     content: "";
     width: 7px;
     height: 7px;
     border-radius: 10px;
     background: color-mix(in oklab, transparent, var(--primary) 47%);
     position: absolute;
     inset-inline-start: 0;
 }

 .social-links ul {
     display: flex;
     align-items: center;
 }

 .social-links ul li {
     margin-inline-end: 7px;
 }

 .social-links ul li:last-child {
     margin-inline-end: 0;
 }

 .social-links ul li a {
     width: 35px;
     height: 35px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     color: rgb(255 255 255);
     transition: 0.5s all;
 }

 .social-links ul li a:hover {
     background: var(--primary);
     transition: 0.5s all;
     color: #fff;
 }

 .social-links ul li a i {
     font-size: 19px;
 }

 .location-list li h6 {
     font-size: 13px;
     font-weight: 500;
     color: #ffffff;
     margin-bottom: 0px;
 }

 .location-list li span {
     width: 35px;
     height: 35px;
     border-radius: 10px;
     display: flex;
     align-items: center;
     justify-content: center;
     background: #393939;
     color: var(--primary);
     font-size: 20px;
     flex-shrink: 0;
     margin-inline-end: 8px;
 }

 .location-list li {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     margin: 0 8px 10px 0;
 }

 .footer-top table p {
     margin-bottom: 4px;
 }

 .footer-top table img {
     margin-bottom: 0;
     height: 59px;
 }

 .location-list li p {
     color: #b5b5b5;
     margin-bottom: 0;
 }

 [dir="rtl"] {
     .location-list li p {
         direction: ltr;
         text-align: end;
     }

     .blog-pagination .page-previous i,
     .blog-pagination .page-next i {
         transform: scaleX(-1);
     }
 }

 [dir="ltr"] {
     .service-box {
         direction: ltr;
     }

     .section-head div a svg {
         transform: scaleX(-1);
     }

     .category-grid {
         direction: ltr;
     }

     .gigs-card-slider.owl-carousel .owl-nav {
         direction: ltr;
         inset-inline-start: 0;
     }

     .search-group .form-control {
         padding: 10px 10px 10px 30px;
     }

     .testimonial-slider.owl-carousel .owl-nav {
         direction: ltr;
         inset-inline-start: 0;
     }

     .gigs-grid .gigs-content {
         direction: ltr;
     }
 }

 .contact-widget {
     border-top: 1px solid #cdcdcd;
     padding: 40px 0 25px;
     margin-top: 20px;
 }

 .paypal-icons {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;

     justify-content: center;
     display: flex;
     flex-wrap: wrap;
     gap: 10px;
     margin-bottom: 15px;
 }

 .footer-bottom-links ul {
     display: flex;
     align-items: center;
     justify-content: end;
 }

 .footer-bottom-links ul li a {
     color: #979797;
     text-decoration: underline;
 }

 .footer-bottom-links ul li a:hover {
     color: var(--primary);
 }

 .footer-bottom-links ul li {
     margin-inline-end: 30px;
 }

 .footer-bottom-links ul li:last-child {
     margin-inline-end: 0;
 }

 .copy-right p {
     color: #ffffff;
     font-weight: 300;
     margin-bottom: 0;

     a {
         color: var(--primary);
     }
 }

 /*-----------------
	28. Privacy Policy
-----------------------*/

 .privacy-section .terms-policy ul li {
     margin: 0 0 11px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
 }

 .privacy-section .terms-policy ul li span {
     margin-inline-end: 10px;
     color: var(--primary);
 }

 .privacy-section .terms-policy p:last-child {
     margin-bottom: 0;
 }

 /*-----------------
	29. portfolio
-----------------------*/

 .gallery-widget {
     position: relative;
     overflow: hidden;
     border-radius: 10px;
     margin-bottom: 24px;
 }

 .gallery-widget img {
     border-radius: 10px;
 }

 .gallery-overlay {
     opacity: 0;
     width: 100%;
     height: 100%;
     position: absolute;
     top: 0;
     inset-inline-start: 0;
     -webkit-transition: 0.7s;
     -moz-transition: 0.7s;
     -o-transition: 0.7s;
     transition: 0.7s;
     text-align: center;
     z-index: 9;
 }

 .gallery-widget:hover a::after {
     content: "";
     position: absolute;
     top: 0;
     inset-inline-start: 0;
     width: 100%;
     height: 100%;
     border-radius: 10px;
     background: rgba(0, 0, 0, 0.6);
     -webkit-transition: 0.7s;
     -moz-transition: 0.7s;
     -o-transition: 0.7s;
     transition: 0.7s;
 }

 .gallery-widget:hover .gallery-overlay {
     opacity: 1;
     -webkit-transition: 0.7s;
     -moz-transition: 0.7s;
     -o-transition: 0.7s;
     transition: 0.7s;
     top: 50%;
 }

 .gallery-overlay h4 {
     color: #fff;
     margin-bottom: 5px;
 }

 .gallery-overlay p {
     color: #fff;
     margin-bottom: 0;
 }

 /*-----------------
	30. User Dashboard
-----------------------*/

 .star-rating {
     direction: rtl;
     font-size: 2rem;
     unicode-bidi: bidi-override;
     display: inline-flex;
 }

 .user-body li a.active,
 .user-body li a:hover {
     .badgeDiv {
         span {
             color: var(--primary) !important;
             background: #fff !important;
             padding: 4px !important;
         }
     }
 }

 .badgeDiv {
     span {
         color: var(--primary) !important;
         background: #f572251a !important;
         padding: 4px !important;
         font-size: 10px;
     }
 }

 .star-rating input {
     display: none;
 }

 .feather-shopping-cart:before {
     content: "\e926" !important;
 }

 .star-rating label {
     color: #ddd;
     cursor: pointer;
 }

 .star-rating input:checked~label,
 .star-rating label:hover,
 .star-rating label:hover~label {
     color: #f5b301;
 }

 .user-sidebar .user-head {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     border-bottom: 1px solid #cdcdcd;
     padding-bottom: 13px;
     margin-bottom: 24px;
 }

 .user-head img {
     width: 60px;
     height: 60px;
     border-radius: 6px;
     margin-inline-end: 8px;
 }

 .user-information {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     width: 100%;
 }

 .user-information h6 {
     margin-bottom: 5px;
 }

 .user-information ul li {
     font-size: 13px;
     font-weight: 600;
     display: inline-block;
     margin-inline-end: 5px;
     padding-inline-end: 8px;
     position: relative;
 }

 .user-information ul li::before {
     content: "|";
     inset-inline-end: 0;
     top: 0;
     position: absolute;
     color: #cdcdcd;
 }

 .user-information ul li:last-child::before {
     content: none;
 }

 .user-information ul li:last-child {
     margin-inline-end: 0;
     padding-inline-end: 0;
 }

 .user-information ul li i {
     color: #ffb906;
 }

 .user-edit {
     width: 26px;
     height: 26px;
     border: 1px solid #cdcdcd;
     border-radius: 50%;
     font-size: 10px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .user-edit:hover {
     background-color: var(--primary);
     border-color: var(--primary);
     color: #fff;
 }


 .user-body ul li a img {
     margin-inline-end: 8px;
     width: 16px;
 }

 .user-body ul li a.active img,
 .user-body ul li a:hover img {
     filter: brightness(0) invert(1);
 }

 .dashboard-header {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     flex-wrap: wrap;
 }

 .dashboard-header .main-title {
     margin-bottom: 7px;
 }

 .dashboard-header .main-title h3 {
     margin-bottom: 3px;
 }

 .head-info {
     margin-bottom: 10px;
 }

 .head-info p,
 .dashboard-header .main-title p {
     margin-bottom: 0;
 }

 .head-info p {
     font-weight: 600;
 }

 .head-info .btn {
     padding: 8px 14px;
 }

 .bg-pending {
     background-color: #7230ff;
 }

 .dash-widget.dash-credit {
     background: #f2faf2;
     overflow: hidden;
 }

 .dash-widget.dash-credit .dash-cont {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     margin-bottom: 15px;
 }

 .dash-widget.dash-credit .dash-cash-info {
     overflow: hidden;
 }

 .dash-widget.dash-credit h3 {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
 }

 .dash-widget.dash-credit .dash-icon {
     margin-inline-end: 15px;
     border: 1px solid #cdcdcd;
     color: #1d1d1d;
     flex-shrink: 0;
 }

 .dash-grade {
     background: #fff;
     border-radius: 10px;
     padding: 15px;
 }

 .dash-grade img {
     margin-inline-end: 6px;
 }

 .dash-earning {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     background: #f7ebdf;
     border-radius: 10px;
     padding: 24px;
     margin-bottom: 24px;
     position: relative;
     z-index: 1;
 }

 .dash-earning::before {
     background: url("../img/bg/dash-bg.png");
     position: absolute;
     inset-inline-end: 0;
     top: 0;
     content: "";
     width: 40%;
     height: 100%;
     background-repeat: no-repeat;
     z-index: -1;
 }

 .dash-earning p,
 .dash-earning h6 {
     font-size: 13px;
     font-weight: 600;
     margin-bottom: 0;
     color: #616161;
 }

 .dash-earning h3 {
     color: #0e0e0e;
     margin-bottom: 24px;
 }

 .dash-earning h6 {
     font-weight: 500;
 }

 .dash-earning h6 span {
     color: var(--primary);
 }

 .earning-btn .btn {
     padding: 8px 15px;
 }

 .dashboard-card .card-body {
     padding: 15px;
 }

 .dashboard-card.card-gig {
     margin-bottom: 0;
 }

 .recent-payment {
     overflow: hidden;
 }

 .recent-payment h6 {
     text-overflow: ellipsis;
     white-space: nowrap;
     overflow: hidden;
     margin-bottom: 5px;
 }

 .recent-payment ul li {
     display: inline-block;
     font-size: 13px;
     font-weight: 500;
     margin-inline-end: 10px;
     padding-inline-end: 10px;
     position: relative;
 }

 .recent-payment ul li:last-child {
     margin-inline-end: 0;
     padding-inline-end: 0;
 }

 .recent-payment ul li::before {
     position: absolute;
     content: "";
     top: 50%;
     transform: translateY(-50%);
     inset-inline-end: 0;
     width: 1px;
     height: 16px;
     background: #cdcdcd;
 }

 .recent-payment ul li:last-child::before {
     content: none;
 }

 .recent-payment ul li .badge-receive {
     margin-inline-end: 10px;
 }

 .badge-receive {
     border-radius: 10px;
     padding: 6px 10px;
 }

 .file-content h6 {
     margin-bottom: 5px;
 }

 .recent-payment p,
 .file-content p {
     font-size: 13px;
     font-weight: 500;
     margin-bottom: 0;
 }

 .bg-pink-light {
     background: #fcf2f5 !important;
 }

 .dashboard-card .card-header {
     padding: 15px 15px 5px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     flex-wrap: wrap;
 }

 .dashboard-card .card-header .card-title {
     margin-bottom: 10px;
 }

 .dashboard-card .card-header .view-link {
     margin-bottom: 10px;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     font-weight: 600;
     color: #4f4f4f;
 }

 .dashboard-card .card-header .view-link:hover {
     color: var(--primary);
 }

 .dashboard-card .card-header .view-link i {
     margin-inline-start: 5px;
 }

 .file-wrap {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .file-wrap .file-icon {
     width: 48px;
     height: 48px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     background: #f2f2f2;
     border-radius: 10px;
     margin-inline-end: 8px;
 }

 .file-actions {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .file-actions a {
     width: 32px;
     height: 32px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     background: #f2f2f2;
     border-radius: 10px;
     margin-inline-end: 5px;
 }

 .file-actions a:last-child {
     margin-inline-end: 0;
 }

 .file-actions a:hover {
     background: var(--primary);
     color: #fff;
 }

 .gigs-list li {
     display: inline-block;
     margin: 0 15px 10px 0;
 }

 .gigs-list li:last-child {
     margin-inline-end: 0;
 }

 .gigs-list li a {
     font-size: 13px;
     font-weight: 600;
     padding-bottom: 5px;
     border-bottom: 2px solid #fff;
 }

 .gigs-list li a.active {
     color: var(--primary);
     border-color: var(--primary);
 }

 .table-img {
     margin-inline-end: 8px;
     flex-shrink: 0;
 }

 .table-img img {
     width: 45px;
     height: 45px;
     object-fit: cover;
     border-radius: 8px;
 }

 .search-filter-selected.select-icon .form-group .select2-container .select2-selection--single .select2-selection__rendered {
     padding-inline-start: 36px;
     color: #4f4f4f;
 }

 .dashboard-header .form-group {
     margin-bottom: 10px;
 }

 .gig-card-head {
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .gig-card-head h4 {
     margin-inline-end: 24px;
 }

 .card-table .table tr {
     border-color: #cdcdcd;
 }

 .card-table .table tr:last-child {
     border-color: transparent;
 }

 .card-table .table tr:last-child td:first-child {
     border-bottom-left-radius: 10px;
 }

 .card-table .table tr:last-child td:last-child {
     border-bottom-right-radius: 10px;
 }

 .card-table .table-hover>tbody>tr:hover>* {
     background-color: #f2f2f2;
 }

 .success-message .success-popup-icon {
     margin-bottom: 15px;
 }

 .success-message h4 {
     margin-bottom: 15px;
 }

 .success-content {
     margin-bottom: 40px;
 }

 .success-message p {
     margin-bottom: 0;
 }

 .success-message p span {
     color: #1d1d1d;
 }

 .success-message .btn {
     padding: 8px 15px;
 }

 .property-info {
     margin-bottom: 24px;
 }

 .property-info h4 {
     margin-bottom: 5px;
 }

 .property-info p {
     margin-bottom: 0;
 }

 .add-property-wrap {
     border: 1px solid #cdcdcd;
     border-radius: 10px;
     padding: 24px 24px 0;
     margin-bottom: 24px;
 }

 .add-property-wrap h6 {
     margin-bottom: 15px;
 }

 .add-property-wrap .btn {
     padding: 7px 14px;
     margin-bottom: 24px;
 }

 .add-property-wrap .btn i {
     margin-inline-end: 5px;
 }

 .upload-wrap {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     margin-bottom: 24px;
 }

 .upload-image {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .upload-image span {
     width: 36px;
     height: 36px;
     border-radius: 10px;
     background: #f2f2f2;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     margin-inline-end: 8px;
 }

 .upload-image h6 {
     margin-bottom: 0;
 }

 .upload-wrap a {
     width: 32px;
     height: 32px;
     border-radius: 10px;
     color: #1d1d1d;
     background: #f2f2f2;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .upload-wrap a:hover {
     background: var(--primary);
     color: #fff;
 }

 .upload-list {
     margin-bottom: 9px;
 }

 .upload-list li {
     margin: 0 24px 15px 0;
 }

 .upload-list li a {
     border: 1px solid #cdcdcd;
     border-radius: 10px;
     padding: 15px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .upload-list li a.active,
 .upload-list li a:hover {
     background: #f2f2f2;
 }

 .upload-list li span {
     width: 36px;
     height: 36px;
     border-radius: 50%;
     background: #1d1d1d;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     margin-inline-end: 10px;
 }

 .upload-list li h6 {
     margin-bottom: 0;
 }

 .drag-upload {
     background: #fefefe;
     border: 1px solid #cdcdcd;
     border-radius: 10px;
     position: relative;
 }

 .drag-upload input {
     opacity: 0;
     width: 100%;
     height: 100%;
     position: absolute;
     z-index: 1;
     cursor: pointer;
 }

 .drag-upload .img-upload {
     text-align: center;
     padding: 40px 15px;
 }

 .drag-upload p i {
     color: var(--primary);
     margin-inline-end: 8px;
 }

 .drag-upload p {
     font-size: 13px;
     color: #1d1d1d;
     margin-bottom: 0;
 }

 .confirm-content .custom_check {
     height: inherit;
     margin: 0;
 }

 .confirm-content .custom_check a {
     color: var(--primary);
 }

 .confirm-content .checkmark {
     top: 50%;
     transform: translateY(-50%);
 }

 .gig-post.marketing-section p {
     font-weight: 500;
     margin-bottom: 24px;
 }

 .gigs-step ul {
     padding: 24px 24px 9px;
     border: 1px solid #cdcdcd;
     border-radius: 10px;
 }

 .gigs-step ul li {
     min-width: 152px;
     display: inline-block;
     margin: 0 24px 15px 0;
 }

 .gigs-step ul li span {
     background: #1d1d1d;
     width: 36px;
     height: 36px;
     border-radius: 50%;
     background: #1d1d1d;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     margin-bottom: 10px;
 }

 .gig-post .gigs-step ul li p {
     color: #e6e6e6;
     font-size: 13px;
     font-weight: 500;
     margin-bottom: 2px;
 }

 .gigs-step ul li h6 {
     color: #fff;
     margin-bottom: 0;
 }

 .form-control:disabled {
     background: #cdcdcd;
 }

 .gig-option.form-control {
     margin-bottom: 14px;
 }

 .gig-option label {
     margin-inline-end: 24px;
     font-weight: 400;
 }

 .gig-option label:last-child {
     margin-inline-end: 0;
 }

 .custom_check.extra-serv {
     margin-bottom: 15px;
 }

 .btn-item .btn {
     padding: 8px 14px;
 }

 .btn-item .btn+.btn {
     margin-inline-start: 10px;
 }

 .new-badge {
     padding: 6px 11px;
     border-radius: 10px;
 }

 .dropdown-action .dropdown-item {
     font-size: 13px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .dropdown-action .dropdown-item i {
     margin-inline-end: 5px;
 }

 .action-icon {
     width: 26px;
     height: 26px;
     border-radius: 50%;
     border: 1px solid #cdcdcd;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .action-icon:focus {
     background-color: #fff;
     color: #1d1d1d;
 }

 .action-icon:hover {
     background-color: #cdcdcd;
     color: #1d1d1d;
 }

 .form-sort {
     position: relative;
 }

 .form-sort .form-icon {
     position: absolute;
     z-index: 101;
     width: 16px;
     top: 50%;
     transform: translateY(-50%);
     inset-inline-start: 10px;
 }

 .form-sort .select2-container--default .select2-selection--single .select2-selection__rendered {
     padding-inline-start: 35px;
 }

 .form-sort .form-control {
     padding-inline-start: 32px;
     width: 130px;
 }

 .form-sort .form-control::placeholder {
     font-weight: 600;
     color: #4f4f4f;
 }

 .bootstrap-datetimepicker-widget table th {
     font-size: 13px;
     font-weight: 500;
 }

 .bootstrap-datetimepicker-widget table td {
     font-size: 13px;
 }

 .bootstrap-datetimepicker-widget table td.active,
 .bootstrap-datetimepicker-widget table td.active:hover {
     background-color: var(--primary);
 }

 .table-filter .form-wrap {
     margin-bottom: 20px;
 }

 .table-filter .select2-container--default .select2-selection--single .select2-selection__rendered {
     font-weight: 600;
 }

 .table-filter {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     flex-wrap: wrap;
 }

 .table-filter .filter-item {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     flex-wrap: wrap;
 }

 .table-filter .filter-item li p {
     color: #1d1d1d;
     font-size: 13px;
     font-weight: 600;
     margin-bottom: 20px;
 }

 .table-filter li {
     margin: 0 10px 0 0;
 }

 .table-footer {
     margin-top: 20px;
 }

 .table-filter #tablefilter {
     margin-bottom: 20px;
 }

 .table-filter #tablefilter div.dataTables_filter .form-control {
     max-width: 270px;
 }

 .table-filter .search-form .form-control {
     padding: 10px 12px 10px 35px;
 }

 .table-filter .search-form .form-icon {
     inset-inline-end: 12px;
     color: #828282;
 }

 .col-form-label {
     font-size: 13px;
     font-weight: 600;
     padding: 0 0 5px 0;
 }

 .review-item {
     background: #f2f2f2;
     padding: 24px;
     border-radius: 10px;
     margin-bottom: 20px;
 }

 .review-item .review-img {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .review-item .review-content h6 {
     margin-bottom: 5px;
     color: #4f4f4f;
     font-weight: 700;
 }

 .review-item.reply-box {
     background: #fdf6f1;
 }

 .file-view {
     background: #f2f2f2;
     border-radius: 10px;
     padding: 24px;
 }

 .file-view .file-img {
     margin-bottom: 24px;
 }

 .file-view .file-img img {
     border-radius: 10px;
 }

 .table-action {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .table-action a+a {
     margin-inline-start: 5px;
 }

 .table-action a {
     width: 26px;
     height: 26px;
     border-radius: 10px;
     background: #f2f2f2;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     color: #4f4f4f;
 }

 .table-action a:hover {
     background: var(--primary);
     color: #fff;
 }

 .user-review .pagination ul {
     margin-top: 5px;
 }

 .user-review .review-lists .review-wrap {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     box-shadow: var(--box-shadow);
     padding: 24px;
     margin-bottom: 15px;
 }

 .user-review .review-lists .review-content h6 {
     margin-bottom: 5px;
     color: #4f4f4f;
     font-weight: 700;
 }

 .user-review .review-lists li {
     border-bottom: 0;
 }

 .user-review .review-lists .review-content p {
     margin-bottom: 0;
 }

 .user-review .review-lists .review-img img {
     border-radius: 50%;
 }

 .user-review .table-action {
     margin-inline-start: 75px;
 }

 .wallet-wrap {
     background: #040404;
     border-radius: 10px;
     padding: 24px 24px 9px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     margin-bottom: 20px;
 }

 .wallet-wrap .wallet-list {
     display: inline-block;
 }

 .wallet-wrap .btn {
     margin-bottom: 15px;
 }

 .wallet-item {
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     margin: 0 40px 15px 0;
 }

 .wallet-item:last-child {
     margin-inline-end: 0;
 }

 .wallet-item span {
     width: 54px;
     height: 54px;
     border-radius: 40px;
     background: #1d1d1d;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     margin-inline-end: 8px;
 }

 .wallet-item .wallet-info p {
     color: #e6e6e6;
     font-size: 13px;
     font-weight: 500;
     margin-bottom: 2px;
 }

 .wallet-item .wallet-info h3 {
     color: #fff;
     margin-bottom: 0;
 }

 .amt-wrap {
     background: #f2f2f2;
     padding: 15px;
     border-radius: 10px;
     margin-bottom: 15px;
 }

 .amt-wrap .form-wrap {
     margin-bottom: 10px;
 }

 .buyer-method {
     margin-bottom: 20px;
 }

 .buyer-method h6 {
     margin-bottom: 5px;
 }

 .buyer-method .custom_radio {
     margin-inline-end: 15px;
 }

 .amt-wrap .form-control {
     background: transparent;
 }

 .amt-list li {
     font-size: 13px;
     font-weight: 600;
     margin-inline-end: 10px;
     display: inline-block;
 }

 .amt-list li:last-child {
     margin-inline-end: 0;
 }

 .amt-list li .vary-amt {
     background: #1d1d1d;
     border-radius: 10px;
     color: #fff;
     font-weight: 500;
     padding: 3px 10px;
     display: inline-block;
 }

 /*-----------------
	31. Notification
-----------------------*/

 .notication-item {
     box-shadow: var(--box-shadow);
     padding: 24px;
     margin-bottom: 24px;
     border: 1px solid #fff;
     border-radius: 10px;
 }

 .notication-item .notication-content {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
 }

 .notication-item span {
     flex-shrink: 0;
     margin-inline-end: 15px;
 }

 .notication-item span img {
     width: 45px;
     height: 45px;
     border-radius: 50%;
 }

 .notication-item .notication-content p {
     margin-bottom: 2px;
 }

 .notication-item .notication-content p i {
     color: #e82646;
     font-size: 8px;
 }

 .notication-item:last-child {
     margin-bottom: 0;
 }

 .notication-item .notication-content .notify-time {
     margin-bottom: 0;
     color: #1d1d1d;
 }

 .notication-item:hover {
     border-color: var(--primary);
 }

 .notication-item .notification-btn .btn {
     display: none;
     -webkit-transition: all 0.2s ease;
     transition: all 0.2s ease;
     font-weight: 600;
 }

 .notication-item:hover .notification-btn .btn {
     -webkit-transition: all 0.2s ease;
     transition: all 0.2s ease;
     display: -webkit-inline-box;
     display: -ms-inline--flexbox;
     display: inline-flex;
 }

 .notification-header {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     flex-wrap: wrap;
     margin-bottom: 16px;
 }

 .notification-header ul li {
     display: inline-block;
     margin: 0 10px 24px 0;
 }

 .notification-header ul li:last-child {
     margin-inline-end: 0;
 }

 .notification-header ul li .btn {
     border: 1px solid #cdcdcd;
     border-radius: 10px;
     font-size: 13px;
     font-weight: 600;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     padding: 10px 14px;
 }

 .notification-header ul li .btn:hover {
     background: var(--primary);
     border-color: var(--primary);
     color: #fff;
 }

 .notification-header ul li .btn i {
     margin-inline-end: 3px;
     line-height: inherit;
 }

 .notification-header ul li .btn-delete {
     color: #e82646;
 }

 .noti-btn .btn {
     padding: 8px 15px;
     margin-top: 10px;
 }

 .noti-btn .btn+.btn {
     margin-inline-start: 15px;
 }

 /*-----------------
	32. Pricing
-----------------------*/

 .price-section {
     padding: 80px 0 56px;
 }

 .pricing-tab {
     text-align: center;
 }

 .pricing-tab ul {
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     background: #fdf6f1;
     box-shadow: var(--box-shadow);
     border-radius: 10px;
     margin-bottom: 24px;
     padding: 15px;
 }

 .pricing-tab ul li {
     display: inline-block;
 }

 .pricing-tab ul li a {
     font-weight: 600;
     background: #fdf6f1;
     border-radius: 10px;
     padding: 8px 0;
     display: inline-block;
     margin-inline-end: 10px;
 }

 .pricing-tab ul li:last-child a {
     margin-inline-end: 0;
 }

 .pricing-tab ul li a.active {
     background: var(--primary);
     color: #fff;
     padding: 8px 10px;
 }

 .price-card {
     box-shadow: var(--box-shadow);
     border: 1px solid #b4b4b4;
     border-radius: 10px;
     padding: 24px;
     margin-bottom: 24px;
     -webkit-transition: 0.5s;
     -ms-transition: 0.5s;
     transition: 0.5s;
 }

 .price-card.active,
 .price-card:hover {
     background: var(--primary);
     border-color: var(--primary);
     -webkit-transition: 0.5s;
     -ms-transition: 0.5s;
     transition: 0.5s;
 }

 .price-card:hover h3,
 .price-card:hover h2,
 .price-card:hover h6,
 .price-card:hover .price-title p,
 .price-card.active h3,
 .price-card.active h2,
 .price-card.active h6,
 .price-card.active .price-title p,
 .price-card:hover ul li,
 .price-card.active ul li {
     color: #fff;
 }

 .price-card:hover .price-title h3::before,
 .price-card.active .price-title h3::before {
     background: #fff;
 }

 .price-card:hover .price-btn a,
 .price-card.active .price-btn a {
     background: var(--secondary);
     color: var(--primary);
 }

 .price-card .price-title {
     margin-bottom: 10px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
 }

 .price-card .plan-type {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: start;
     -ms-flex-align: start;
     align-items: start;
     flex-wrap: wrap;
 }

 .price-card .plan-type .badge {
     background: var(--secondary);
     color: var(--primary);
     display: inline-block;
     padding: 7px 10px;
     border-radius: 10px;
 }

 .price-card .price-title h3 {
     padding-bottom: 15px;
     margin: 0 10px 5px 0;
     position: relative;
 }

 .price-card .price-title h3::before {
     content: "";
     position: absolute;
     inset-inline-start: 0;
     bottom: 0;
     width: 40px;
     height: 8px;
     background: var(--primary);
     border-radius: 10px;
 }

 .price-card .price-title h2 {
     margin-bottom: 2px;
 }

 .price-card .price-title p {
     margin-bottom: 5px;
     color: #1d1d1d;
     text-align: end;
 }

 .price-card .price-features ul {
     margin-bottom: 25px;
 }

 .price-card .price-features ul li {
     margin-bottom: 14px;
     position: relative;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
 }

 .price-card .price-features ul li i {
     color: #1abe17;
 }

 .price-card .price-features ul li.inactive i {
     color: #e82646;
 }

 .price-card:hover .price-features ul li i,
 .price-card:hover .price-features ul li.inactive i,
 .price-card.active .price-features ul li i,
 .price-card.active .price-features ul li.inactive i {
     color: #fff;
 }

 .price-card .price-features ul li:last-child {
     margin-bottom: 0;
 }

 .price-card .price-features ul li span {
     margin-inline-end: 5px;
 }

 .price-card .price-btn a {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     padding: 14px 18px;
 }

 .price-features h6 {
     margin-bottom: 15px;
 }

 .price-card .price-btn a i {
     margin-inline-start: 5px;
 }

 .card-bottom {
     margin-bottom: 0;
 }

 /*-----------------
	33. Settings
-----------------------*/
 .page-back-btn a {
     color: #e82646;
     font-weight: 500;
     font-size: 14px;
 }

 .settings-page-lists .settings-head {
     display: flex;
     align-items: center;
     box-shadow: var(--box-shadow);
     background: #fff;
     padding: 15px 15px 5px;
     border-radius: 10px;
     margin: 24px 0;
     flex-wrap: wrap;
 }

 .settings-page-lists .settings-head li {
     margin-inline-end: 30px;
     margin-bottom: 10px;
 }

 .settings-page-lists .settings-head li:last-child {
     margin-inline-end: 0;
 }

 .settings-page-lists .settings-head li a {
     font-size: 14px;
     font-weight: 500;
 }

 .settings-page-lists .settings-head li a.active {
     border-bottom: 2px solid var(--primary);
     color: var(--primary);
 }

 .settings-card {
     background: #fff;
     border-radius: 10px;
     padding: 24px;
     margin-bottom: 35px;
     position: relative;
 }

 .settings-card .settings-card-head {
     border-bottom: 1px solid #cdcdcd;
     margin-bottom: 15px;
     padding-bottom: 15px;
 }

 .settings-card .settings-card-head h4 {
     margin-bottom: 0;
     color: var(--primary);
 }

 .img-upload-head {
     display: flex;
     align-items: center;
     margin-bottom: 34px;
 }

 .img-upload-head .profile-img {
     flex-shrink: 0;
     margin-inline-end: 8px;
 }

 .img-upload-head .profile-img img {
     width: 120px;
     height: 120px;
     border-radius: 5px;
 }

 .img-formate p {
     font-size: 13px;
     max-width: 300px;
 }

 .upload-remove-btns {
     display: flex;
     align-items: center;
 }

 .upload-remove-btns .drag-upload {
     border: 0;
     margin-bottom: 0;
     border-radius: 10px;
 }

 .upload-remove-btns .drag-upload .img-upload {
     padding: 11px 15px;
     background: var(--primary);
     color: #fff;
     border-radius: 10px;
 }

 .upload-remove-btns .drag-upload .img-upload p {
     font-size: 10px;
     color: #fff;
     line-height: normal;
 }

 .img-remove-btn a {
     padding: 11px 15px;
     color: var(--primary);
     background: var(--secondary);
     border-radius: 10px;
     margin-inline-start: 15px;
     display: inline-block;
 }

 .settings-card-footer {
     margin-top: 16px;
 }

 .changed-info {
     font-size: 15px;
     color: #363636;
     margin-bottom: 15px;
 }

 .status-toggle .check {
     display: block;
     height: 0;
     visibility: hidden;
     opacity: 0;
     pointer-events: none;
     position: absolute;
     margin: 0;
     padding: 0;
 }

 .status-toggle .checktoggle {
     background: #cdcdcd;
     cursor: pointer;
     display: block;
     font-size: 0;
     margin-bottom: 0;
     position: relative;
     border-radius: 12px;
     width: 30px;
     height: 14px;
 }

 .status-toggle .checktoggle:after {
     content: " ";
     display: block;
     width: 10px;
     height: 10px;
     background-color: #fff;
     -webkit-transition: all 0.2s ease;
     -ms-transition: all 0.2s ease;
     transition: all 0.2s ease;
     transform: translate(3px, -50%);
     -webkit-transform: translate(3px, -50%);
     -ms-transform: translate(3px, -50%);
     position: absolute;
     top: 50%;
     inset-inline-start: 0;
     border-radius: 50%;
 }

 .status-toggle .check:checked+.checktoggle {
     background: #1abe17;
 }

 .status-toggle .check:checked+.checktoggle:after {
     inset-inline-end: 0;
     width: 10px;
     height: 10px;
 }

 .status-toggle .check:checked+.checktoggle:after {
     inset-inline-start: 100%;
     transform: translate(calc(-100% - 3px), -50%);
 }

 .settings-card h6 {
     margin-bottom: 0;
 }

 .billing-type {
     background: #f2f2f2;
     border-radius: 10px;
     padding: 24px 24px 0;
     margin-bottom: 24px;
 }

 .payment-btn {
     border-bottom: 1px solid #4f4f4f;
 }

 .payment-method-edit {
     display: flex;
     align-items: center;
     justify-content: space-between;
 }

 .payment-method-edit .card-type {
     display: flex;
     align-items: center;
 }

 .payment-method-edit .card-type .payment-card-img {
     width: 40px;
     height: 40px;
     display: inline-flex;
     align-items: center;
     justify-content: center;
     background: #f2f2f2;
     margin-inline-end: 5px;
 }

 .plan-bill-table .col-sm-12 {
     padding-inline-end: 0;
 }

 .table-card {
     border: 1px solid #cdcdcd;
     border-radius: 10px;
     padding: 14px 15px 25px 24px;
     margin-bottom: 24px;
 }

 .table-card td {
     border: 0;
     padding: 10px;
 }

 .table-card th {
     padding: 10px;
 }

 .table-card th h6 {
     margin-bottom: 0;
 }

 .table-card th h4 {
     margin-bottom: 0;
 }

 .table-card .table tbody td {
     font-weight: 600;
     font-size: 15px;
     color: #4f4f4f;
     padding: 10px;
 }

 .table-card .table th:first-child {
     padding-inline-start: 0;
 }

 .table-card .table tr td:first-child {
     padding-inline-start: 0;
 }

 .table-card.integrated-table {
     padding-bottom: 14px;
 }

 .integrated-table th {
     font-size: 19px;
     font-weight: 600;
     color: #1d1d1d;
 }

 .noti-setting-table th {
     font-size: 15px;
     font-weight: 600;
     color: #1d1d1d;
 }

 .noti-setting-table th:first-child {
     font-size: 19px;
 }

 .table-card thead th:first-child {
     width: 70%;
 }

 .integration-icon {
     border: 1px solid #cdcdcd;
     width: 100px;
     height: 50px;
     border-radius: 10px;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .badge.bg-soft-secondary {
     background: #f1f1f1;
     color: #1d1d1d;
 }

 .integrated-table .table .custom-first-row td {
     padding-top: 15px;
 }

 .integration-name h6 {
     margin: 0 0 0 15px;
     font-weight: 400;
 }

 .badge.bg-soft-danger {
     background: #fcf2f5;
     color: #e82646;
 }

 .settings-modal {
     width: 26px;
     height: 26px;
     border-radius: 50%;
     display: inline-flex;
     align-items: center;
     justify-content: center;
 }

 .settings-modal:hover {
     background: #f2f2f2;
 }

 #toast-container>div {
     width: 500px !important;
 }

 .text-info {
     color: var(--secondary) !important;
 }

 /*-----------------
	34. Profile
-----------------------*/
 .my-skills {
     display: flex;
     align-items: center;
     flex-wrap: wrap;
 }

 .service-wrap.skills-wrap {
     padding-bottom: 14px;
 }

 .my-skills li span {
     display: flex;
     align-items: center;
     background: #040404;
     color: #fff;
     border-radius: 10px;
     padding: 5px 10px;
     line-height: normal;
     font-size: 13px;
     margin-bottom: 10px;
 }

 .my-skills li {
     margin-inline-end: 10px;
 }

 .my-skills li:last-child {
     margin-inline-end: 0;
 }

 .my-skills li span i {
     font-size: 8px;
     margin-inline-end: 5px;
 }

 .service-wrap.my-profile-info {
     padding-bottom: 0;
 }

 .my-profile-details {
     background: #f2f2f2;
     border-radius: 10px;
     padding: 24px;
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 24px;
 }

 .my-profile-details .user-details {
     margin-bottom: 0;
 }

 .my-profile-info .user-img img {
     border-radius: 5px;
 }

 .more-details {
     display: flex;
     align-items: center;
     margin-bottom: 24px;
 }

 .more-details .icon-info {
     width: 36px;
     height: 36px;
     border-radius: 50%;
     border: 1px solid #cdcdcd;
     display: flex;
     align-items: center;
     justify-content: center;
     margin-inline-end: 10px;
 }

 .more-details h6 {
     font-size: 13px;
     color: #4f4f4f;
 }

 .more-details h6 span {
     display: block;
     font-weight: 500;
 }

 .profile-work-slide.listing-gigs .star-rate {
     margin-inline-start: 0;
     padding-inline-start: 0;
     border-inline-start: 0;
 }

 .profile-work-slide .card-overlay-badge span i {
     font-size: 8px;
 }

 .profile-work-slide.gigs-card-slider.owl-carousel .owl-nav {
     position: absolute;
     inset-inline-end: 0px;
     top: -70px;
     margin-bottom: 24px;
     margin-top: 0;
 }

 /*-----------------
  35. Chat
-----------------------*/

 .chat-wrapper .content {
     display: flex;
     display: -webkit-flex;
 }

 .chat-wrapper .content .sidebar-group {
     display: flex;
     display: -webkit-flex;
     flex-direction: column;
     position: relative;
     z-index: 99;
     width: 340px;
     border: 1px solid #cdcdcd;
     background: #fcfcfc;
     margin-inline-end: 24px;
     border-radius: 10px;
 }

 .left-sidebar .slimScrollDiv {
     border-radius: 10px;
 }

 .chat-wrapper .content .sidebar-group .sidebar {
     background: #fcfcfc;
     overflow: hidden;
     width: 340px;
     display: flex;
     flex-direction: column;
     flex: 1;
 }

 .dropdown-menu .dropdown-item span {
     margin-inline-end: 10px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .dropdown-menu .dropdown-item {
     font-size: 13px;
     cursor: pointer;
     padding: 7px 14px;
     font-weight: 500;
     color: #424242;
 }

 .chat-wrapper .content .sidebar-group .sidebar:not(.active) {
     display: none;
 }

 .header-top {
     display: flex;
     justify-content: space-between;
     margin-bottom: 30px;
     font-weight: 600;
     background-color: var(--primary);
 }

 .header-top .logo {
     margin-top: 0 !important;
 }

 .header-top>span {
     font-size: 21px;
 }

 .header-top ul {
     margin-bottom: 0;
     display: flex;
 }

 .header-top ul.header-action {
     margin-top: 14px !important;
 }

 .chat-header ul {
     margin-bottom: 0;
 }

 .chat-header ul li:not(.list-inline-item) {
     margin-bottom: 0;
     width: 48px;
     margin-inline-end: 15px !important;
 }

 .chat-header ul li:last-child {
     margin-inline-end: 0 !important;
 }

 .sidebar-body {
     flex: 1;
     overflow: auto;
     padding: 24px 24px 10px;
     width: 100%;
 }

 .pin-chat img {
     margin-inline-end: 6px;
 }

 .sidebar-body .profile-name {
     font-weight: 600;
     color: #4b0973;
     font-size: 17px;
     margin-bottom: 0;
 }

 .online-profile {
     position: relative;
 }

 .online-profile span {
     position: relative;
     color: #565656;
     font-size: 10px;
     padding-inline-start: 10px;
 }

 .online-profile span:before {
     content: "";
     position: absolute;
     inset-inline-start: 0;
     top: 7px;
     background-color: #49e073;
     width: 8px;
     height: 8px;
     border-radius: 50px;
 }

 .close_profile4 {
     color: #000;
     border-color: #e6e6e6;
 }

 .sidebar .user-list li a,
 .sidebar .user-list li .list-user-blk {
     padding: 10px;
     display: flex;
     display: -webkit-flex;
     cursor: pointer;
     margin-bottom: 15px;
     border: 1px solid #e0e0e0;
     box-shadow: none;
     border-radius: 5px;
     position: relative;
     transition: ease all 0.5s;
     -webkit-transition: ease all 0.5s;
     -ms-transition: ease all 0.5s;
 }

 .sidebar .user-list li a:hover,
 .sidebar .user-list li .list-user-blk:hover {
     background-color: #f8ecff;
     transition: ease all 0.5s;
     -webkit-transition: ease all 0.5s;
     -ms-transition: ease all 0.5s;
 }

 .sidebar .user-list li.item-typing {
     background-color: #f1f6ff;
 }

 .sidebar .user-list li figure {
     margin-inline-end: 1rem;
 }

 .sidebar .user-list li .users-list-body {
     flex: 1;
     position: relative;
     min-width: 0px;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .lock-icon {
     color: #000000;
 }

 .sidebar .user-list li .users-list-body>div:first-child {
     min-width: 0;
     display: flex;
     flex-direction: column;
     flex: 1;
 }

 .parti-notify-check {
     margin-bottom: 0 !important;
     display: flex;
     align-items: center;
 }

 .sidebar .user-list li .users-list-body h5 {
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
     font-size: 14px;
     font-weight: 500;
     margin-bottom: 3px;
     color: #0a0a0a;
 }

 .sidebar .user-list li .users-list-body p {
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
     margin-bottom: 0;
     color: #232323;
     font-size: 13px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .sidebar .user-list li .users-list-body p .bx-map {
     font-size: 15px;
 }

 .sidebar .user-list li .users-list-body p.missed-call-col {
     color: #de3e44;
 }

 .sidebar .user-list li .users-list-body .last-chat-time {
     padding-inline-start: 15px;
     position: relative;
 }

 .sidebar .user-list li .users-list-body .last-chat-time .text-muted {
     color: #424242 !important;
     font-weight: 400;
     font-size: 10px;
     margin-bottom: 5px;
     display: block;
     text-align: end;
 }

 .sidebar .user-list li .users-list-body .last-chat-time .contact-toggle {
     color: var(--primary);
 }

 .sidebar .user-list li .users-list-body .last-chat-time .new-message-count {
     width: 20px;
     height: 20px;
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     line-height: 0;
     font-size: 9px;
     background-color: var(--primary);
     color: #fff;
     border-radius: 50%;
     margin-inline-start: auto;
     margin-top: 10px;
     position: absolute;
     inset-inline-end: 0;
     bottom: 0;
 }

 .sidebar .user-list li .users-list-body .last-chat-time .chat-toggle {
     position: absolute;
     inset-inline-end: 0;
     bottom: 0;
     opacity: 0;
     text-align: end;
     transition: all 0.5s ease;
     -webkit-transition: all 0.5s ease;
     -ms-transition: all 0.5s ease;
     width: 18px;
     height: 24px;
 }

 .sidebar .user-list li.unread h5 {
     color: #fff;
 }

 .sidebar .user-list li.unread p {
     color: #fff;
 }

 .sidebar .user-list li.unread .text-muted {
     color: rgba(255, 255, 255, 0.4) !important;
 }

 .sidebar .user-list li.user-list-item.item-typing .users-list-body p {
     color: #0d9b35;
 }

 .rightside_tab {
     padding-top: 5px !important;
 }

 .chat-pin {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: end;
     -webkit-justify-content: end;
     -ms-flex-pack: end;
 }

 .chat-pin img {
     width: 10px;
 }

 .chat-pin .check {
     color: #1abe17;
 }

 .chat-pin .count-message {
     background: var(--primary);
     width: 20px;
     height: 20px;
     border-radius: 50px;
     font-size: 10px;
     font-weight: 400;
     color: #fff;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .select-message-box {
     margin-top: 50px;
 }

 .select-message-box h4 {
     margin-bottom: 5px;
 }

 .select-message-box p {
     margin-top: 0;
     margin-bottom: 24px;
     color: #424242;
     font-size: 15px;
     font-weight: 400;
 }

 .select-message-box .btn i {
     font-size: 14px;
 }

 .chat {
     flex: 1;
     display: flex;
     flex-direction: column;
     transition: all 0.5s ease;
     -webkit-transition: all 0.5s ease;
     -ms-transition: all 0.5s ease;
     width: 100%;
     height: 100%;
 }

 .chat.setting-chat {
     filter: blur(8px);
     -webkit-filter: blur(8px);
 }

 .chat .chat-header .chat-options.chat-small ul li a {
     width: 35px;
     height: 35px;
 }

 .chat-options ul.list-inline .list-inline-item {
     margin-bottom: 0;
 }

 .last-seen {
     color: #424242;
     font-size: 13px;
 }

 .user_callog {
     display: flex;
     margin-top: 0px;
 }

 .chev-icon i {
     font-size: 17px;
 }

 .calllog_p {
     margin-inline-start: 5px;
 }

 .chat-options.chat-option-profile .list-inline-item a {
     background: #f5f5f5;
     width: 38px;
     height: 38px;
     border-radius: 50px;
     color: #424242;
     padding: 0;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .chat-options.chat-option-profile .list-inline-item a:hover {
     background: var(--primary);
     color: #fff;
 }

 .chat-options.chat-option-profile .list-inline {
     border-bottom: 1px solid #ededed;
     margin-bottom: 0;
     padding-bottom: 15px;
 }

 .last-seen-profile span {
     color: #424242;
     font-size: 13px;
     font-weight: 400;
     margin-bottom: 12px;
     display: block;
 }

 .header_button {
     position: absolute;
     inset-inline-end: 5px;
     width: 40px;
     height: 40px;
     border-radius: 20px;
     font-size: 13px;
     color: white;
     text-align: center;
     background: #ffa977;
     bottom: 40px;
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
 }

 .btn-warning:hover {
     color: #fff;
     background-color: #ffa977;
     border-color: #ffa977;
 }

 .right_sidebar_profile {
     margin-top: 0px;
 }

 .account_details,
 .security_details {
     background-color: #edeef6;
     border-color: #d9d7d8;
     border-radius: 5px !important;
     border-bottom: 0 !important;
 }

 .close_icon {
     font-size: 17px;
 }

 .button_plus {
     margin-inline-start: 0px;
 }

 .chat .chat-header {
     display: flex;
     display: -webkit-flex;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     padding: 13px 24px;
     align-items: center;
     background: #ffffff;
     position: relative;
 }

 .chat-search {
     position: absolute;
     inset-inline-start: 0;
     top: 0;
     width: 100%;
     transition: ease all 0.5s;
     -webkit-transition: ease all 0.5s;
     -ms-transition: ease all 0.5s;
     opacity: 0;
     visibility: hidden;
 }

 .chat-search.visible-chat {
     opacity: 1;
     visibility: visible;
     top: 100%;
     transition: ease all 0.5s;
     -webkit-transition: ease all 0.5s;
     -ms-transition: ease all 0.5s;
     z-index: 9;
 }

 .form-control-feedback {
     z-index: 2;
     display: block;
     text-align: center;
     pointer-events: none;
     color: rgba(0, 0, 0, 0.4);
     position: absolute;
     inset-inline-start: 13px;
     top: 50%;
     transform: translateY(-50%);
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
 }

 .form-control-feedback i {
     font-size: 15px;
     color: #0a0a0a;
 }

 .user-chat-search {
     position: absolute;
     inset-inline-start: 0;
     top: 0;
     width: 100%;
     transition: ease all 0.5s;
     -webkit-transition: ease all 0.5s;
     -ms-transition: ease all 0.5s;
     opacity: 0;
     visibility: hidden;
 }

 .user-chat-search.visible-chat {
     opacity: 1;
     visibility: visible;
     top: 100%;
     transition: ease all 0.5s;
     -webkit-transition: ease all 0.5s;
     -ms-transition: ease all 0.5s;
     z-index: 9;
 }

 .chat-search input[type="text"],
 .user-chat-search input[type="text"] {
     padding: 8px 8px 8px 35px;
     width: 100%;
     min-height: 47px;
     border-radius: 0px 0px 5px 5px;
     border: 1px solid #e5e7eb;
     background-color: #fff;
     color: #0a0a0a;
     font-size: 14px;
     font-weight: 500;
 }

 .chat-search input[type="text"]:hover,
 .user-chat-search input[type="text"]:hover,
 .chat-search input[type="text"]:focus,
 .user-chat-search input[type="text"]:focus,
 .chat-search input[type="text"]:focus-visible,
 .user-chat-search input[type="text"]:focus-visible {
     border-color: #f3f3f3;
 }

 .all-chats {
     position: relative;
 }

 .close-btn-chat,
 .user-close-btn-chat {
     width: 25px;
     height: 25px;
     border-radius: 25px;
     color: #0a0a0a;
     display: flex;
     display: -webkit-flex;
     justify-content: center;
     -webkit-justify-content: center;
     align-items: center;
     -webkit-align-items: center;
     position: absolute;
     inset-inline-end: 12px;
     top: 9px;
     cursor: pointer;
 }

 .main_content {
     width: 100% !important;
 }

 .chat .chat-header .user-details {
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
 }

 .avatar-main {
     height: 50px;
     width: 50px;
 }

 .chat .chat-header .user-details figure {
     margin-inline-end: 1rem;
 }

 .chat .chat-header .user-details h5 {
     font-size: 14px;
     font-weight: 600;
     margin-bottom: 4px;
     line-height: 1;
     color: #424242;
 }

 .archive-btn {
     border: 1px solid #008024;
     color: #008024;
     border-radius: 4px;
     font-size: 9px;
     font-weight: 500;
     padding: 2px 6px;
     margin-inline-end: 1.5rem;
 }

 .archive-btn-grey {
     border: 1px solid #909090;
     color: #909090;
     border-radius: 4px;
     font-size: 8px;
     font-weight: 500;
     padding: 2px 6px;
     margin-top: 0.25rem;
 }

 .right_sidebar_icon {
     list-style: none;
 }

 .chat .chat-header .chat-options ul {
     margin-bottom: 0;
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
 }

 .btn.btn-outline-light:hover {
     background: #e6e6e6;
 }

 .chat .chat-header .chat-options ul>li>a {
     font-size: 13px;
     color: #424242;
     cursor: pointer;
     width: 40px;
     height: 40px;
     padding: 0;
     border-radius: 50px;
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
 }

 .chat .chat-header .chat-options ul>li>a i {
     font-size: 19px;
 }

 .chat .chat-header .chat-options ul>li>a:not(.no-bg):hover {
     background-color: #f5f5f5;
     border-color: #f5f5f5;
 }

 .chat .chat-body {
     flex: 1;
     padding: 24px;
     padding-bottom: 100px;
 }

 .chat .chat-body:not(.no-message) {
     overflow: auto;
 }

 .chat .chat-body {
     padding-bottom: 100px;
 }

 .chat .chat-body.no-message {
     user-select: none;
 }

 .chat .chat-body .messages {
     display: flex;
     display: -webkit-flex;
     flex-direction: column;
     -webkit-flex-direction: column;
     align-items: flex-start;
     -webkit-align-items: flex-start;
 }

 .chat .chat-body .messages .chats {
     max-width: 75%;
     margin-bottom: 30px;
     display: flex;
     display: -webkit-flex;
 }

 .chat-avatar {
     padding: 8px 15px 0 8px;
     display: flex;
     display: -webkit-flex;
     align-items: flex-start;
     -webkit-align-items: flex-start;
 }

 .chat .chat-body .messages .chat-profile-name h6 {
     margin-bottom: 0;
     color: #0a0a0a;
     font-weight: 600;
     font-size: 14px;
 }

 .chat .chat-body .messages .chat-profile-name h6 span {
     font-size: 10px;
     color: #9e9e9e;
     font-weight: 400;
     padding-inline-start: 10px;
 }

 .chats.chats-right .chat-profile-name {
     justify-content: end;
     -webkit-justify-content: end;
     -ms-flex-pack: end;
 }

 .chat-profile-name {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     margin-bottom: 5px;
 }

 .replay-forms .chat-profile-name h6 {
     margin-bottom: 0;
 }

 .replay-forms .chat-profile-name h6 span {
     color: #9e9e9e;
     font-size: 10px;
     margin-inline-start: 10px;
 }

 .chat .chat-body .messages .chats:last-child {
     margin-bottom: 0;
 }

 .chat .chat-body .messages .chats .chat-time {
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     margin-bottom: 0;
 }

 .chat .chat-body .messages .chats .chat-time .avatar {
     margin-inline-end: 1rem;
 }

 .chat .chat-body .messages .chats .chat-time h5 {
     font-size: 14px;
     margin-bottom: 0;
 }

 .chat .chat-body .messages .chats .chat-time .time {
     color: #fff;
     margin-top: 2px;
     font-size: 10px;
     font-weight: 400;
 }

 .chat .chat-body .messages .chats .chat-time .time i {
     color: rgba(247, 247, 247, 0.5);
 }

 .chat .chat-body .messages .chats .chat-time .time i img {
     width: 14px;
     height: auto;
     margin-inline-start: 2px;
     vertical-align: 0px;
 }

 .chat .chat-body .messages .chats .message-content {
     background-color: #fff;
     border-radius: 20px 20px 20px 0;
     padding: 14px 20px;
     color: #424242;
     font-size: 13px;
     font-weight: 400;
     box-shadow: var(--box-shadow);
 }

 .chat .chat-body .messages .chats .message-content.award-link a {
     color: #424242;
     margin-bottom: 2px;
     display: block;
 }

 .chat .chat-body .messages .chats .message-content.chat-award-link a {
     display: flex;
     margin-bottom: 10px;
 }

 .chat .chat-body .messages .chats .message-content.chat-award-link .emoj-group li a {
     margin-bottom: 0px;
 }

 .chat .chat-body .messages .chats .message-content.award-link img {
     border-radius: 10px;
 }

 .chats.chats-right {
     flex-direction: row-reverse;
     -webkit-flex-direction: row-reverse;
 }

 .group-set-wrap {
     cursor: pointer;
 }

 .message-star {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .message-star .avatar {
     width: 26px;
     height: 26px;
     margin-inline-end: 10px;
 }

 .message-star .avatar img {
     width: 100%;
 }

 .message-star h6 {
     color: #0a0a0a;
     font-size: 14px;
     font-weight: 500;
     margin-bottom: 0;
 }

 .message-star h6 span i {
     color: #fec001;
 }

 .chat .chat-body .messages .chats .message-content a {
     color: #ffa633;
 }

 .chat .chat-body .messages .chats.chats-right {
     margin-inline-start: auto;
 }

 .chat-voice-group ul {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     padding: 0;
     margin-bottom: 0;
 }

 .chat-voice-group ul li span {
     width: 28px;
     height: 28px;
     background: var(--primary);
     border-radius: 50px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .chat-voice-group li {
     margin-bottom: 0;
     color: #424242;
     font-size: 13px;
     font-weight: 400;
     list-style: none;
 }

 .chat-voice-group li+li {
     padding-inline-start: 10px;
 }

 .chat .chat-body .messages .chats.chats-right .chat-time {
     justify-content: flex-end;
 }

 .chat .chat-body .messages .chats.chats-right .message-content {
     background-color: #f8ecff;
     color: #232323;
     border-radius: 15px 0px 15px 15px;
     padding: 15px;
 }

 .chat .chat-body .messages .chats.chats-right .chat-action-btns {
     order: 2;
     -webkit-order: 2;
     display: flex;
     display: -webkit-flex;
     flex-wrap: wrap;
     -webkit-flex-wrap: wrap;
     justify-content: center;
     -webkit-justify-content: center;
 }

 .chat .chat-body .messages .chats.chats-right .chat-action-btns .chat-action-col {
     width: 20px;
     text-align: center;
 }

 .chat .chat-body .messages .chats.chats-right .chat-action-btns .chat-read-col {
     display: flex;
     display: -webkit-flex;
     align-items: flex-end;
     -webkit-align-items: flex-end;
     padding-bottom: 22px;
     color: #008024;
 }

 .chat .chat-body .messages .chats.chats-right .chat-content {
     order: 1;
     -webkit-order: 1;
 }

 .chat .chat-body .messages .chats.chats-right .chat-avatar {
     padding: 8px 0px 0 15px;
 }

 .chat .chat-body .messages .chats.chats-right .message-content .chat-time {
     justify-content: flex-start;
     -webkit-justify-content: flex-start;
 }

 .chat .chat-body .messages .chats.chats-right .message-content .chat-time .time {
     color: #909090;
 }

 .chat .chat-body .messages .chats.chats-right .message-content .chat-time .time i {
     color: #a3c2ff;
 }

 .chat .chat-body .messages .download-col {
     position: relative;
 }

 .chat .chat-body .messages .download-col ul {
     list-style: none;
     padding: 0;
     margin: 0 0 5px 0;
     display: flex;
     display: -webkit-flex;
 }

 .chat .chat-body .messages .download-col ul li+li {
     margin-inline-start: 5px;
 }

 .chat .chat-body .messages .download-col .image-download-col {
     position: relative;
 }

 .chat .chat-body .messages .download-col .image-download-col a>img {
     border: 1px solid transparent;
     width: 80px;
     border-radius: 8px;
 }

 .chat .chat-body .messages .chats .message-content.fancy-msg-box .image-not-download span {
     position: absolute;
     color: #fff;
     font-size: 10px;
     font-weight: 500;
     position: absolute;
     top: 50%;
     inset-inline-start: 50%;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
 }

 [dir="rtl"] .chat .chat-body .messages .chats .message-content.fancy-msg-box .image-not-download span {
     -webkit-transform: translate(50%, -50%);
     -ms-transform: translate(50%, -50%);
     transform: translate(50%, -50%);
 }

 .chat .chat-body .messages .download-col .image-download-col.image-not-download a>img {
     -webkit-filter: blur(1px);
     filter: blur(1px);
 }

 .chat .chat-body .messages .download-col .download-action,
 .chat .chat-body .messages .file-download .download-action,
 .file-download-col .download-action {
     position: absolute;
     inset-inline-end: 8px;
     bottom: 8px;
     line-height: 0;
 }

 .chat .chat-body .messages .file-download .download-action {
     bottom: 14px;
 }

 .chat .chat-body .messages .download-col .download-action a,
 .chat .chat-body .messages .file-download .download-action a,
 .file-download-col .download-action a {
     color: #fff;
     font-size: 8px;
 }

 .chat .chat-body .messages .download-col .download-action div+div,
 .chat .chat-body .messages .file-download .download-action div+div,
 .file-download-col .download-action div+div {
     margin-inline-start: 8px;
 }

 .chat .chat-body .messages .download-col .download-action div img,
 .chat .chat-body .messages .file-download .download-action div img,
 .file-download-col .download-action div img {
     width: 13px;
 }

 .chat .chat-body .messages .file-download {
     position: relative;
     background: #f5f5f5;
     border-radius: 10px;
     padding: 10px;
     margin-bottom: 7px;
 }

 .chat .chat-body .messages .file-download .file-type {
     width: 54px;
     height: 54px;
     background-color: #fff;
     border-radius: 4px;
 }

 .chat .chat-body .messages .file-download .file-type i {
     color: #9e9e9e;
     font-size: 22px;
 }

 .chat .chat-body .messages .file-download .file-details span.file-name {
     color: #0a0a0a;
     display: inline-block;
     width: 100%;
     font-size: 14px;
     font-weight: 500;
 }

 .chat .chat-body .messages .file-download .file-details span.file-size {
     color: #909090;
     display: inline-block;
     width: 100%;
 }

 .chat .chat-body .messages .file-download .file-details ul {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     padding: 0;
     margin-bottom: 0;
 }

 .chat .chat-body .messages .file-download .file-details ul li {
     list-style: none;
     color: #424242;
     font-size: 13px;
     position: relative;
 }

 .chat .chat-body .messages .file-download .file-details ul li::before {
     content: "";
     position: absolute;
     width: 1px;
     height: 13px;
     background: #c2c2c2;
     inset-inline-end: -8px;
     top: 5px;
 }

 .chat .chat-body .messages .file-download .file-details ul li:last-child::before {
     display: none;
 }

 .chat .chat-body .messages .file-download .file-details ul li+li {
     padding-inline-start: 15px;
 }

 .chat .chat-body .messages .file-download .file-details ul li a {
     color: var(--primary);
 }

 .chat .chat-body .messages .file-download .download-action a {
     color: var(--primary);
 }

 .chat-select .select2-container .select2-selection--single {
     border: 0;
     height: 24px;
 }

 .chat-select .select2-container--default .select2-selection--single .select2-selection__rendered {
     color: #344357;
     font-size: 17px;
     font-weight: normal;
     line-height: 24px;
     font-weight: 600;
 }

 .chat-select .select2-container--default .select2-selection--single .select2-selection__arrow {
     height: 24px;
     inset-inline-end: 7px;
 }

 .success-pass {
     margin-bottom: 40px;
     text-align: center;
 }

 .chat-select .select2-container--default .select2-selection--single .select2-selection__arrow b {
     border-color: #344357;
     border-style: solid;
     border-width: 0 2px 2px 0;
     padding: 3px;
     height: 0;
     inset-inline-start: 50%;
     margin-inline-start: -5px;
     margin-top: -5px;
     position: absolute;
     top: 50%;
     width: 0;
     transform: rotate(45deg);
     -webkit-transform: rotate(45deg);
 }

 .chat-select .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
     border-color: #344357;
     border-width: 2px 0 0 2px;
     padding: 3px;
     margin-top: -5px;
 }

 .chat-select .select2-container--default.form-control-sm .select2-selection--single .select2-selection__arrow {
     top: 7px;
 }

 .chat-select .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
     border-color: #344357;
     border-style: solid;
     border-width: 0 2px 2px 0;
     padding: 3px;
 }

 .chat-select .select2-container .select2-selection--single .select2-selection__rendered {
     padding-inline-end: 40px;
     padding-inline-start: 0px;
 }

 .chat-select .select2-container--default .select2-results__option--highlighted[aria-selected] {
     background-color: #4b4b9f;
 }

 .chat-select .select2-container--default .select2-selection--multiple {
     border: 1px solid #ddd;
     min-height: 40px;
 }

 .chat-select .select2-container--open .select2-dropdown--below {
     margin-top: 10px;
 }

 .review-files p {
     margin-bottom: 5px;
     color: #424242;
     font-size: 13px;
 }

 .like-chat-grp ul {
     padding: 0;
     margin-bottom: 0;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     margin-top: 10px;
 }

 .like-chat-grp ul li {
     list-style: none;
 }

 .like-chat-grp ul li+li {
     margin-inline-start: 10px;
 }

 .like-chat-grp ul li a {
     border: 1px solid #e0e0e0;
     border-radius: 50px;
     padding: 3px 12px;
     display: block;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     color: #0a0a0a;
     font-weight: 400;
     font-size: 13px;
 }

 .like-chat-grp ul li.like-chat a {
     background: #fef6dc;
 }

 .like-chat-grp ul li.comment-chat a {
     background: #ffe8e9;
 }

 .like-chat-grp ul li a img {
     margin-inline-start: 5px;
 }

 .chat-line {
     margin: 0px 0 20px;
     position: relative;
     text-align: center;
     width: 100%;
 }

 .chat-line:before {
     content: "";
     position: absolute;
     inset-inline-start: 0;
     top: 50%;
     transform: translateY(-50%);
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     background-color: #eeeeee;
     width: 100%;
     height: 1px;
 }

 .chat-date {
     background-color: #fff;
     color: #0a0a0a;
     font-size: 13px;
     padding: 4px 20px;
     border-radius: 50px;
     display: inline-block;
     font-weight: 400;
     position: relative;
     border: 1px solid #e0e0e0;
 }

 .chat .chat-footer {
     position: relative;
 }

 .chat .chat-footer form {
     display: flex;
     display: -webkit-flex;
     align-items: end;
     -webkit-align-items: end;
     position: absolute;
     bottom: 0px;
     inset-inline-start: 0;
     inset-inline-end: 0;
     padding: 24px;
     background-color: #f5f5f5;
 }

 .chat .chat-footer form .form-buttons .btn {
     margin-inline-start: 0px;
     color: #bdbfc7;
     font-size: 19px;
     padding: 0;
     width: 20px;
     height: 20px;
     border-radius: 50%;
     display: flex;
     justify-content: center;
     align-items: center;
     margin-inline-end: 10px;
 }

 .chat .chat-footer form .form-buttons .btn:last-child {
     margin-inline-end: 0;
 }

 .chat .chat-footer form .specker-col span {
     color: var(--primary);
     font-size: 23px;
 }

 .chat .chat-footer form .attach-col i,
 .chat .chat-footer form .smile-col i {
     color: var(--primary);
     font-size: 19px;
 }

 .chat .chat-footer form .smile-col i {
     font-size: 21px;
 }

 .chat .chat-footer form .smile-col {
     inset-inline-end: inherit;
     inset-inline-start: 15px;
 }

 .chat .chat-footer form .attach-col {
     inset-inline-end: inherit;
     inset-inline-start: 60px;
 }

 .chat+.sidebar-group {
     margin-inline-end: 0px;
 }

 .chat+.sidebar-group .sidebar {
     margin-inline-end: 0px;
 }

 .group-comman-theme {
     padding: 0 24px;
 }

 .group-comman-theme h6 {
     margin-bottom: 15px;
 }

 .group-comman-theme ul {
     padding: 0;
     padding-bottom: 15px;
     margin-bottom: 15px;
     border-bottom: 1px solid #ededed;
 }

 .group-comman-theme ul li {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     list-style: none;
     border: 1px solid #e0e0e0;
     border-radius: 5px;
     padding: 5px;
     margin-bottom: 10px;
 }

 .group-comman-theme ul li:last-child {
     margin-bottom: 0;
 }

 .group-comman-theme ul li .avatar {
     flex-shrink: 0;
     margin-inline-end: 10px;
 }

 .theme-content h6 {
     margin-bottom: 6px;
     color: #0a0a0a;
     font-size: 14px;
     font-weight: 500;
 }

 .theme-content p {
     margin-bottom: 0;
     text-align: start;
     line-clamp: 1;
     -webkit-line-clamp: 1;
     -webkit-box-orient: vertical;
     overflow: hidden;
     text-overflow: ellipsis;
     display: -webkit-box;
     color: #424242;
     font-size: 13px;
 }

 .chat-message-grp {
     padding: 24px;
     padding-top: 0;
 }

 .chat-message-grp ul {
     padding: 0;
 }

 .chat-message-grp ul li {
     list-style: none;
     margin-bottom: 15px;
 }

 .chat-message-grp ul li:last-child {
     margin-bottom: 0px;
 }

 .chat-message-grp ul li a {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
 }

 .chat-message-grp ul li a:hover .stared-group h6 {
     color: var(--primary);
 }

 .stared-group {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .stared-group span {
     width: 30px;
     height: 30px;
     border-radius: 6px;
     margin-inline-end: 10px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .star-message {
     background: #fef6dc;
 }

 .star-message i {
     color: #fec001;
 }

 .mute-message {
     background: #ebfdfffa;
 }

 .mute-message i {
     color: #02a2b9;
 }

 .block-message {
     background: #ffe8e9;
 }

 .block-message i {
     color: #de3e44;
 }

 .report-message {
     background: #f8ecff;
 }

 .report-message i {
     color: var(--primary);
 }

 .delete-message {
     background: #ffe8e9;
 }

 .delete-message i {
     color: #de3e44;
 }

 .count-group {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .count-group span {
     width: 30px;
     height: 30px;
     border-radius: 50px;
     color: #424242;
     font-size: 13px;
     background: #f5f5f5;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     margin-inline-end: 5px;
 }

 .count-group i {
     color: #424242;
     font-size: 15px;
 }

 .stared-group h6 {
     font-size: 14px;
     font-weight: 500;
     color: #0a0a0a;
     margin-bottom: 0;
 }

 .chat .chat-footer form .form-buttons .btn.send-btn {
     width: 40px;
     height: 40px;
     border-radius: 6px;
     display: inline-flex;
     justify-content: center;
     align-items: center;
     color: #fff !important;
     background: var(--primary);
     margin-inline-start: 10px;
 }

 .set-search {
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 15px;
     border-radius: 50px;
     width: 28px;
     height: 28px;
 }

 .set-search:hover {
     background: #f5f5f5;
     border-color: #f5f5f5;
 }

 .chat .chat-footer form .form-buttons .btn.send-btn:hover {
     background-color: #fff;
     border-color: var(--primary);
 }

 .chat .chat-footer form .form-buttons .btn.send-btn:hover i {
     color: var(--primary);
 }

 .chat .chat-footer form .form-buttons .btn.send-btn:focus {
     box-shadow: none;
 }

 .chat .chat-footer form .smile-foot {
     margin-inline-end: 10px;
 }

 .chat .chat-footer form .smile-foot .action-circle {
     width: 40px;
     height: 40px;
     background: #fff;
     border-radius: 50px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .chat .chat-footer form .smile-foot .action-circle:hover {
     background-color: #ededed;
     border-color: #ededed;
 }

 .chat .chat-footer form .smile-foot .action-circle i {
     color: #424242;
     font-size: 17px;
 }

 .chat .slimScrollDiv {
     height: 100% !important;
 }

 .dropdown-menu .dropdown-item span.star-msg,
 .dropdown-menu .dropdown-item span.star-msg-one,
 .dropdown-menu .dropdown-item span.star-msg-three,
 .dropdown-menu .dropdown-item span.star-msg-four,
 .dropdown-menu .dropdown-item span.star-msg-five {
     font-size: 13px;
     cursor: pointer;
     font-weight: 500;
     color: #424242;
 }

 .header-action {
     list-style: none;
     margin: 0;
     padding: 0;
 }

 .header-action li {
     display: inline-block;
     margin-inline-start: 10px;
 }

 .header-action li a {
     color: #1b1a1a;
     font-size: 17px;
 }

 .user-list {
     border-radius: 0.25rem;
     display: flex;
     display: -webkit-flex;
     flex-direction: column;
     -webkit-flex-direction: column;
     padding-inline-start: 0;
     margin-bottom: 0;
 }

 .user-list li a {
     padding: 17px 20px;
     display: flex;
     display: -webkit-flex;
     cursor: pointer;
     border-radius: 6px;
     margin-bottom: 10px;
     border: 0;
     box-shadow: var(--box-shadow);
 }

 .user-list li .avatar {
     margin-inline-end: 0.8rem;
     display: inline-block;
     margin-bottom: 0;
     height: 46px;
     width: 46px;
     border-radius: 50%;
     position: relative;
     z-index: 0;
 }

 .avatar-away::before,
 .avatar-offline::before,
 .avatar-online::before {
     content: "";
     position: absolute;
     display: block;
     width: 12px;
     height: 12px;
     border-radius: 50%;
     top: 0px;
     inset-inline-end: 2px;
     border: 2px solid #fff;
     z-index: 9;
 }

 .avatar-online::before {
     background-color: #34d859;
 }

 .avatar-away::before {
     background-color: #ffe600;
 }

 .animate-typing-col {
     color: #0d9b35;
 }

 .animate-typing-col .dot {
     display: inline-block;
     width: 4px;
     height: 4px;
     border-radius: 50%;
     margin-inline-end: -1px;
     background: #0d9b35;
     -webkit-animation: wave 1.3s linear infinite;
     animation: wave 1.3s linear infinite;
     opacity: 0.6;
 }

 .animate-typing-col .dot:nth-child(2) {
     -webkit-animation-delay: -1.1s;
     animation-delay: -1.1s;
 }

 .animate-typing-col .dot:nth-child(3) {
     -webkit-animation-delay: -0.9s;
     animation-delay: -0.9s;
 }

 @-webkit-keyframes wave {

     0%,
     100%,
     60% {
         -webkit-transform: initial;
         transform: initial;
     }

     30% {
         -webkit-transform: translateY(-5px);
         transform: translateY(-5px);
     }
 }

 @keyframes wave {

     0%,
     100%,
     60% {
         -webkit-transform: initial;
         transform: initial;
     }

     30% {
         -webkit-transform: translateY(-5px);
         transform: translateY(-5px);
     }
 }

 .user-list li .avatar .letter-avatar {
     width: 45px;
     height: 45px;
     border-radius: 45px;
     margin-inline-end: 0.8rem;
     margin-bottom: 0;
     position: relative;
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     background-color: #e8dbff;
     font-size: 15px;
     font-weight: 600;
     color: #420ba1;
 }

 .chat_form {
     border-radius: 20px;
     margin-inline-end: 0px;
     background: #ffffff;
     border: 1px solid #c2c2c2;
     box-shadow: var(--box-shadow);
     border-radius: 6px;
     height: 40px;
     padding: 10px 10px;
 }

 .chat .chat-footer form .form-control::-webkit-input-placeholder {
     color: #424242;
     opacity: 1;
 }

 .chat .chat-footer form .form-control::-moz-placeholder {
     color: #424242;
     opacity: 1;
 }

 .chat .chat-footer form .form-control:-ms-input-placeholder {
     color: #424242;
     opacity: 1;
 }

 .chat .chat-footer form .form-control:-moz-placeholder {
     color: #424242;
     opacity: 1;
 }

 .user-list .avatar>a>img,
 .user-list .avatar>img {
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

 .contact-close a {
     color: #292f4c;
     opacity: 0.5;
     border-color: #e6e6e6;
 }

 .chat-wrapper .content .sidebar-group.right-sidebar .sidebar {
     width: 310px;
 }

 .primary-title {
     color: #ffa977;
     font-size: 13px;
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 0;
 }

 .primary-title i {
     font-size: 13px;
 }

 .contact-action {
     padding: 0;
     margin: 0;
     list-style: none;
 }

 .contact-action li {
     padding: 11px 0;
     border-bottom: 1px solid #f1f1f1;
 }

 .contact-action li a {
     color: #181c2f;
 }

 .contact-action li a {
     color: #181c2f;
     font-size: 13px;
     font-weight: bold;
 }

 .contact-action li.report-contact a,
 .contact-action li.delete-chat a,
 .contact-action li.sign-out a {
     color: #f00;
 }

 .left-sidebar {
     display: flex;
     display: -webkit-flex;
     flex-direction: column;
     -webkit-flex-direction: column;
     transition: all 0.5s ease;
     -webkit-transition: all 0.5s ease;
     -ms-transition: all 0.5s ease;
 }

 .left-sidebar-wrap {
     background: var(--main-bg);
     overflow: hidden;
     width: 448px;
     display: flex;
     display: -webkit-flex;
     flex-direction: column;
     -webkit-flex-direction: column;
     flex: 1;
 }

 .right-sidebar {
     display: flex;
     display: -webkit-flex;
     flex-direction: column;
     -webkit-flex-direction: column;
     background-color: #fafbff;
     opacity: 100%;
     transition: all 0.5s ease;
     -webkit-transition: all 0.5s ease;
     -ms-transition: all 0.5s ease;
     position: relative;
     width: 320px;
 }

 .right-sidebar.video-right-sidebar {
     width: 371px;
 }

 .video-call-chat .left-chat-title.with-bg {
     background: transparent;
 }

 .video-call-chat .left-chat-title {
     border: 0;
 }

 .chat.video-call-chat .chat-body {
     background-image: none;
 }

 .video-call-chat .chat-title h4 {
     font-size: 17px;
     font-weight: 600;
     color: #424242;
 }

 .video-call-chat .chat-title span {
     font-size: 10px;
     font-weight: 400;
     color: #424242;
 }

 .chat.video-call-chat .chat-body .messages .chats .message-content {
     background: #f5f5f5;
 }

 .chat.video-call-chat .chat-body .messages .chats.chats-right .message-content {
     background: #f8ecff;
 }

 .right-sidebar.video-right-sidebar .chat .chat-body {
     padding-bottom: 110px;
 }

 .member-details {
     margin-bottom: 10px;
 }

 .chat-member-details {
     padding: 0 24px;
 }

 .chat-member-details .member-details ul {
     padding: 0;
     border-bottom: 1px solid #ededed;
 }

 .chat-member-details .member-details ul li {
     list-style: none;
     margin-bottom: 15px;
 }

 .chat-member-details .member-details ul li h6 {
     font-size: 14px;
     font-weight: 400;
     color: #424242;
     margin-bottom: 5px;
 }

 .chat-member-details .member-details ul li h5 {
     font-size: 14px;
     font-weight: 500;
     color: #0a0a0a;
     margin-bottom: 0px;
 }

 .chat-member-details .member-details ul li span {
     font-size: 15px;
     font-weight: 400;
     color: #0a0a0a;
 }

 .chat-member-details .member-details ul li a {
     font-size: 14px;
     font-weight: 500;
     color: var(--primary);
     border-radius: 100px;
     padding: 5px;
     background: #f5f5f5;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .chat-member-details .member-details ul li a+a {
     margin-inline-start: 10px;
 }

 .chat-member-details .member-details ul li a:hover {
     color: #0a0a0a;
 }

 .right-sidebar .right-sidebar-wrap {
     background-color: #fff;
     border-inline-start: 1px solid #e0e0e0;
     border-radius: 0px;
     margin-top: 0px;
     margin-bottom: 0px;
     height: calc(100vh - 0px);
 }

 .right-sidebar .right-sidebar-wrap .sidebar-body {
     padding: 0;
 }

 .right-sidebar .right-sidebar-wrap .right-sidebar-profile {
     padding: 24px;
     padding-bottom: 0;
     margin-bottom: 15px;
 }

 .right-sidebar.show-right-sidebar {
     margin-inline-end: 0;
 }

 .right-sidebar.video-right-sidebar.show-right-sidebar {
     margin-inline-end: 0;
 }

 .right-sidebar.video-right-sidebar .chat {
     margin-inline-start: 0 !important;
     display: block;
 }

 .right-sidebar.hide-right-sidebar {
     margin-inline-end: -320px;
 }

 .right-sidebar.video-right-sidebar.hide-right-sidebar {
     margin-inline-end: -371px;
 }

 .right-sidebar .contact-close_call .close_profile,
 .status-modal .custom-status-close {
     width: 25px;
     height: 25px;
     border-radius: 25px;
     color: #0a0a0a;
     display: flex;
     display: -webkit-flex;
     justify-content: center;
     -webkit-justify-content: center;
     align-items: center;
     -webkit-align-items: center;
     background-color: #f5f5f5;
     border-color: #f5f5f5;
 }

 .group-description .description-sub h5 span a {
     width: 25px;
     height: 25px;
     border-radius: 25px;
     color: #0a0a0a;
     display: flex;
     display: -webkit-flex;
     justify-content: center;
     -webkit-justify-content: center;
     align-items: center;
     -webkit-align-items: center;
     border-color: #f5f5f5;
 }

 .list_group_notread {
     color: #ffa977 !important;
 }

 .tooltip>.tooltip-inner {
     text-align: start;
     max-width: 500px;
     --bs-tooltip-bg: var(--primary);
 }

 .tooltip {
     --bs-tooltip-bg: var(--primary);
 }

 .tooltip .arrow {
     display: none;
     background-color: var(--primary);
 }

 .tooltip .tooltip-inner {
     background-color: var(--primary);
 }

 .chat-cont-type {
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .chat-cont-type .chat-type-wrapper {
     margin-bottom: 0;
 }

 .chat-cont-type .chat-type-wrapper p {
     color: #9e9e9e;
     font-size: 10px;
     font-weight: 400;
     margin-bottom: 0;
 }

 .group-type-radio {
     display: block;
     position: relative;
     padding-inline-start: 35px;
     cursor: pointer;
     font-size: 21px;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
 }

 .group-type-radio input {
     position: absolute;
     opacity: 0;
     cursor: pointer;
 }

 .group-type-radio {
     font-size: 15px;
     font-weight: 400;
     color: #424242;
     margin-inline-end: 24px;
 }

 .checkmark {
     position: absolute;
     top: 0;
     inset-inline-start: 0;
     height: 22px;
     width: 22px;
     background-color: #fff;
     border: 1px solid #e4e4e4;
     border-radius: 50%;
 }

 .pass-login label {
     color: #0a0a0a;
     font-size: 13px;
     font-weight: 500;
 }

 .select2-container--default .select2-results__option--highlighted[aria-selected] {
     background-color: var(--primary) !important;
 }

 .group-type-radio input:checked~.checkmark {
     background-color: var(--primary);
 }

 .checkmark:after {
     content: "";
     position: absolute;
     display: none;
 }

 .group-type-radio input:checked~.checkmark:after {
     display: block;
 }

 .group-type-radio .checkmark:after {
     top: 4px;
     inset-inline-start: 4px;
     width: 12px;
     height: 12px;
     border-radius: 50%;
     background: white;
 }

 .right-sidebar-profile>.avatar {
     background: rgba(66, 11, 161, 0.1);
 }

 .right-sidebar-profile .profile-name span i {
     font-size: 15px;
 }

 .group_img {
     position: relative;
     display: inline-block;
 }

 .group-name-search {
     margin-bottom: 14px;
 }

 .parti-wrapper {
     margin-bottom: 14px;
     display: flex;
     align-items: center;
 }

 .group_header {
     width: 38px !important;
     height: 38px !important;
     border: 2px solid #ffffff;
 }

 .last-chat-time i.missed-col {
     width: 17px;
     display: inline-block;
     margin-top: 10px;
 }

 .last-chat-time i.missed-col img {
     max-width: 100%;
     height: auto;
 }

 .right-sidebar-head {
     padding: 0px 24px;
 }

 .right-sidebar-head.share-media .share-media-blk {
     margin-bottom: 20px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
 }

 .right-sidebar-head h5 {
     font-size: 14px;
     font-weight: 600;
     color: #1f2937;
     margin-bottom: 0px;
 }

 .right-sidebar-head.share-media .about-media-tabs .nav-tabs {
     margin-bottom: 15px;
     background: #ededed;
     padding: 5px;
     border-radius: 8px;
     display: flex;
     justify-content: space-between;
 }

 .right-sidebar-head.share-media .about-media-tabs {
     border-bottom: 1px solid #ededed;
     padding-bottom: 10px;
     margin-bottom: 15px;
 }

 .right-sidebar-head.share-media .about-media-tabs .nav .nav-item.active {
     background: #fff;
     border-radius: 6px;
     color: #424242;
 }

 .right-sidebar-head.share-media .about-media-tabs .nav .nav-item {
     padding: 2px 10px;
     font-size: 13px;
     color: #424242;
     font-weight: 500;
     border: 0;
     margin-inline-end: 10px;
 }

 .right-sidebar-head.share-media .about-media-tabs .nav .nav-item:last-child {
     margin-inline-end: 0px;
 }

 .right-sidebar-head.share-media .about-media-tabs .share-media-img li {
     margin: 0px 6px 6px 0px;
     position: relative;
 }

 .right-sidebar-head.share-media .about-media-tabs .share-media-img li img {
     border-radius: 8px;
     width: 84px;
 }

 .right-sidebar-head.share-media .about-media-tabs .share-media-img li span i {
     font-size: 19px;
     color: #fff;
 }

 .right-sidebar-head.share-media .about-media-tabs .share-media-img li:hover span i {
     color: #eee;
 }

 .right-sidebar-head.share-media .about-media-tabs .share-media-img li.blur-media img {
     filter: blur(2px);
 }

 .right-sidebar-head.share-media .about-media-tabs .share-media-img li span {
     position: absolute;
     color: #fff;
     font-size: 10px;
     font-weight: 500;
     position: absolute;
     top: 50%;
     inset-inline-start: 50%;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
 }

 [dir="rtl"] .right-sidebar-head.share-media .about-media-tabs .share-media-img li span {
     -webkit-transform: translate(50%, -50%);
     -ms-transform: translate(50%, -50%);
     transform: translate(50%, -50%);
 }

 .media-file {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     margin-bottom: 15px;
 }

 .media-file:last-child {
     margin-bottom: 0;
 }

 .media-doc-blk {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .media-doc-blk span {
     width: 50px;
     height: 50px;
     border-radius: 5px;
     background: #f5f5f5;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     margin-inline-end: 10px;
 }

 .media-doc-blk span i {
     font-size: 22px;
 }

 .document-detail ul {
     padding: 0;
     margin-bottom: 0;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .document-detail ul li {
     list-style: none;
     color: #424242;
     font-size: 13px;
     font-weight: 400;
     position: relative;
 }

 .document-detail ul li::before {
     content: "";
     position: absolute;
     width: 1px;
     height: 13px;
     background: #c2c2c2;
     inset-inline-end: -8px;
     top: 5px;
 }

 .document-detail ul li:last-child::before {
     display: none;
 }

 .document-detail ul li+li {
     padding-inline-start: 15px;
 }

 .document-detail h6 {
     color: #0a0a0a;
     font-size: 14px;
     font-weight: 500;
 }

 .media-download a {
     color: #424242;
 }

 .social-media-col {
     margin-top: 35px;
 }

 .media-link-grp {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     margin-bottom: 15px;
 }

 .media-link-detail h6 a {
     color: #0a0a0a;
     font-size: 14px;
     font-weight: 500;
     margin-bottom: 5px;
 }

 .media-link-detail span a {
     color: #424242;
     font-size: 13px;
     font-weight: 400;
     word-break: break-all;
 }

 .media-link-detail a:hover {
     color: var(--primary);
 }

 .share-media-blk a {
     color: var(--primary);
     font-weight: 500;
 }

 .link-img img {
     border-radius: 4px;
     margin-inline-end: 10px;
 }

 .social-media-col:after {
     content: "";
     display: table;
     clear: both;
 }

 .social-media-col ul {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .social-media-col ul li {
     float: inline-start;
 }

 .social-media-col ul li+li {
     margin-inline-start: 10px;
 }

 .social-media-col ul li a {
     color: #420ba1;
     font-size: 17px;
 }

 .social-media-col h6,
 .settings-col h6 {
     font-weight: 600;
     color: #000;
     font-size: 14px;
     margin-bottom: 20px;
 }

 .settings-col {
     margin-top: 35px;
 }

 .settings-col:after {
     content: "";
     display: table;
     clear: both;
 }

 .settings-col ul {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .settings-col ul li {
     color: #939393;
     font-weight: 500;
 }

 .settings-col ul li+li {
     margin-top: 15px;
 }

 .settings-col .switch {
     position: relative;
     display: inline-block;
     width: 40px;
     height: 23px;
     margin-bottom: 0;
     margin-inline-end: 10px;
 }

 .settings-col .switch input {
     opacity: 0;
     width: 0;
     height: 0;
 }

 .settings-col .slider {
     position: absolute;
     cursor: pointer;
     top: 0;
     inset-inline-start: 0;
     inset-inline-end: 0;
     bottom: 0;
     background-color: #ccc;
     -webkit-transition: 0.4s;
     transition: 0.4s;
 }

 .settings-col .slider:before {
     position: absolute;
     content: "";
     height: 15px;
     width: 15px;
     inset-inline-start: 4px;
     bottom: 4px;
     background-color: white;
     -webkit-transition: 0.4s;
     transition: 0.4s;
 }

 .settings-col input:checked+.slider {
     background-color: #2196f3;
 }

 .settings-col input:focus+.slider {
     box-shadow: var(--box-shadow);
 }

 .settings-col input:checked+.slider:before {
     -webkit-transform: translateX(16px);
     -ms-transform: translateX(16px);
     transform: translateX(16px);
 }

 .settings-col .slider.round {
     border-radius: 34px;
 }

 .settings-col .slider.round:before {
     border-radius: 50%;
 }

 .report-col {
     margin-top: 35px;
     padding: 12px;
     padding-bottom: 50px;
 }

 .report-col:after {
     content: "";
     display: table;
     clear: both;
 }

 .report-col ul {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .report-col ul:after {
     content: "";
     display: table;
     clear: both;
 }

 .report-col ul li {
     display: block;
     width: 100%;
     font-weight: 500;
     position: relative;
 }

 .report-col ul li a {
     color: #ff0000;
     padding-inline-start: 25px;
 }

 .report-col ul li a span {
     position: absolute;
     inset-inline-start: 0;
     top: 0px;
     font-size: 15px;
 }

 .report-col ul li+li {
     margin-top: 19px;
 }

 .file-download-col:after {
     content: "";
     display: table;
     clear: both;
 }

 .file-download-col ul {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .file-download-col ul li {
     float: inline-start;
     width: 50%;
     padding: 5px;
 }

 .file-download-col ul li.full-width {
     width: 100%;
 }

 .file-download-col ul li .image-download-col {
     position: relative;
 }

 .file-download-col ul li .image-download-col a>img {
     width: 100%;
 }

 .load-more-btn {
     font-weight: 600;
     margin-top: 10px;
 }

 .load-more-btn i {
     background: #0057ff;
     border-radius: 50%;
     height: 12px;
     width: 12px;
     color: #fff;
     line-height: 8px;
     font-size: 10px;
     vertical-align: middle;
 }

 .chat-message-grp.chat-encrypt {
     padding-bottom: 0;
 }

 .chat-message-grp.chat-encrypt ul {
     border-bottom: 1px solid #ededed;
     padding-bottom: 15px;
     margin-bottom: 15px;
 }

 .participants-list {
     padding: 0px 24px;
 }

 .participants-list-group {
     border-bottom: 1px solid #ededed;
     padding-bottom: 15px;
     margin-bottom: 15px;
 }

 .participants-list-group h6 {
     margin-bottom: 15px;
     font-size: 14px;
     font-weight: 500;
     color: #0a0a0a;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
 }

 .participants-list .participants-list-group h6.parti-search {
     font-size: 19px !important;
     display: flex;
     align-items: center;
 }

 .participants-list ul {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .participants-list ul li {
     border: 1px solid #e0e0e0;
     border-radius: 5px;
     background-color: #fff;
     padding: 10px;
 }

 .participants-list ul li+li {
     margin-top: 10px;
 }

 .participants-list .users-list-body h5 {
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
     font-size: 14px;
     font-weight: 500;
     margin-bottom: 5px;
     color: #0a0a0a;
 }

 .participants-list .users-list-body p {
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
     margin-bottom: 0;
     color: #424242;
     font-size: 13px;
     font-weight: 400;
 }

 .participants-list .users-list-body {
     flex: 1;
     position: relative;
     min-width: 0px;
     display: flex;
     display: -webkit-flex;
     width: 100%;
 }

 .user-list li a.admin-shade {
     box-shadow: none;
 }

 .participants-list .admin-profiles {
     display: inline-block;
     color: var(--primary);
     border-radius: 6px;
     font-size: 10px;
     padding: 2px 10px;
     font-weight: 500;
     background: #f8ecff;
 }

 .participants-list .admin-profiles:hover {
     background: var(--primary);
     color: #fff;
 }

 .chat-message-grp.group-exits {
     padding: 0px 24px;
     padding-bottom: 30px;
 }

 .grp-delete .chat-action-col {
     display: flex;
     align-items: center;
     height: 100%;
 }

 .grp-delete .chat-action-col>a {
     color: #c8c8d8;
 }

 .chat-action-col>a {
     color: #424242;
 }

 .chat-profile-name .chat-action-col a {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
 }

 .darkmode-btn {
     width: 35px;
     height: 32px;
     background-color: #0057ff;
     border: 1px solid var(--main-bg);
     border-radius: 5px;
     color: #fff;
     font-size: 15px;
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     margin: 0 auto;
 }

 .darkmode-btn:hover,
 .darkmode-btn:focus,
 .add-contacts-btn:hover,
 .add-contacts-btn:focus {
     color: #fff;
 }

 .add-contacts-btn {
     width: 25px;
     height: 25px;
     border-radius: 30px;
     background-color: var(--primary);
     color: #fff;
     font-size: 8px;
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     margin: 0 auto;
 }

 .group-call-tab .nav-tabs .nav-link {
     color: var(--primary);
     border: 0;
     border-radius: 10px;
     font-weight: 500;
     padding: 6px 25px;
 }

 .group-call-tab .nav-tabs .nav-link:hover {
     color: var(--primary);
 }

 .group-call-tab .nav-tabs .nav-link+.nav-link {
     margin-inline-start: 10px;
 }

 .group-call-tab .nav-tabs .nav-link.active {
     background-color: rgba(90, 7, 139, 0.1);
     color: var(--primary);
 }

 .group-call-tab nav {
     padding: 0 15px 20px;
     position: relative;
 }

 .group-call-tab nav:before {
     content: "";
     position: absolute;
     inset-inline-start: 0;
     bottom: 0;
     width: 100%;
     background-color: #e2e2e2;
     height: 1px;
 }

 .right-sidebar.hide-message-right {
     margin-inline-end: -320px;
 }

 .chat.chat-contact {
     background-image: none;
     background: #f8f6fa;
 }

 .chat.chat-contact .slimscroll {
     padding: 24px;
 }

 .chat.chat-contact .chat-header {
     background: none;
     border: 0;
     padding: 0;
 }

 .chat-options.chat-contact-list ul>li>a {
     background: #fff;
 }

 .chat.chat-contact .chat-header .avatar {
     width: 100px;
     height: 100px;
 }

 .chat.chat-contact .chat-header .user-details h5 {
     font-size: 17px;
     color: #0a0a0a;
     font-weight: 600;
 }

 .call-video span {
     font-size: 19px;
     color: #424242;
 }

 .call-video span+span {
     margin-inline-start: 10px;
 }

 .fav-title.contact-title h6 {
     font-size: 17px;
     color: #0a0a0a;
 }

 .personal-info h5 {
     color: #0a0a0a;
     font-size: 15px;
     font-weight: 500;
     margin-bottom: 24px;
 }

 .personal-info ul li {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     color: #424242;
     margin-bottom: 20px;
 }

 .personal-info ul li:last-child {
     margin-bottom: 0;
 }

 .personal-info ul li h6 {
     font-size: 13px;
     font-weight: 400;
     width: 50%;
     margin-bottom: 0;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .personal-info ul li h6 i {
     font-size: 19px;
     margin-inline-end: 10px;
 }

 .personal-info ul li h6 img {
     margin-inline-end: 10px;
 }

 .personal-info ul li span {
     font-size: 15px;
     font-weight: 500;
 }

 .personal-info ul li span a {
     color: #ffa633;
 }

 .contact-added {
     font-size: 19px;
 }

 .dropdown-menu.contact-menus span i {
     font-size: 15px;
     color: #424242;
 }

 .cal-icon {
     position: relative;
 }

 .cal-icon span {
     position: absolute;
     inset-inline-end: 10px;
     top: 50%;
     -webkit-transform: translate(0, -50%);
     -ms-transform: translate(0, -50%);
     transform: translate(0, -50%);
 }

 .user-block-group .notify-check .form-check .custom-check .checkmark {
     top: -10px;
     inset-inline-start: 10px;
 }

 .mute-chat-btn .btn-primary:hover img {
     filter: invert(13%) sepia(85%) saturate(7478%) hue-rotate(266deg) brightness(42%) contrast(108%);
 }

 .chat .chat-footer form .form-buttons .btn.send-btn:hover {
     background-color: #fff;
     border-color: var(--primary);
 }

 .chat .chat-footer form .form-buttons .btn.send-btn:hover i {
     color: var(--primary);
 }

 .chat .chat-footer form .form-buttons .btn.send-btn:focus {
     box-shadow: none;
 }

 .chat .chat-footer form .smile-foot {
     margin-inline-end: 10px;
 }

 .chat .chat-footer form .smile-foot .action-circle {
     width: 40px;
     height: 40px;
     background: #fff;
     border-radius: 50px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .chat .chat-footer form .smile-foot .action-circle:hover {
     background-color: #ededed;
     border-color: #ededed;
 }

 .chat .chat-footer form .smile-foot .action-circle i {
     color: #424242;
     font-size: 17px;
 }

 .chat .slimScrollDiv,
 .right_sidebar_profile .slimScrollDiv {
     height: 100% !important;
 }

 .dropdown-menu .dropdown-item span.star-msg,
 .dropdown-menu .dropdown-item span.star-msg-one,
 .dropdown-menu .dropdown-item span.star-msg-three,
 .dropdown-menu .dropdown-item span.star-msg-four,
 .dropdown-menu .dropdown-item span.star-msg-five {
     font-size: 13px;
     cursor: pointer;
     font-weight: 500;
     color: #424242;
 }

 .header-action {
     list-style: none;
     margin: 0;
     padding: 0;
 }

 .header-action li {
     display: inline-block;
     margin-inline-start: 10px;
 }

 .header-action li a {
     color: #1b1a1a;
     font-size: 17px;
 }

 .user-list {
     border-radius: 0.25rem;
     display: flex;
     display: -webkit-flex;
     flex-direction: column;
     -webkit-flex-direction: column;
     padding-inline-start: 0;
     margin-bottom: 0;
 }

 .user-list li a {
     padding: 17px 20px;
     display: flex;
     display: -webkit-flex;
     cursor: pointer;
     border-radius: 6px;
     margin-bottom: 10px;
     border: 0;
     box-shadow: var(--box-shadow);
 }

 .user-list li .avatar {
     margin-inline-end: 0.8rem;
     display: inline-block;
     margin-bottom: 0;
     height: 46px;
     width: 46px;
     border-radius: 50%;
     position: relative;
     z-index: 0;
 }

 .avatar-away::before,
 .avatar-offline::before,
 .avatar-online::before {
     content: "";
     position: absolute;
     display: block;
     width: 12px;
     height: 12px;
     border-radius: 50%;
     top: 0px;
     inset-inline-end: 2px;
     border: 2px solid #fff;
     z-index: 9;
 }

 .avatar-online::before {
     background-color: #34d859;
 }

 .avatar-away::before {
     background-color: #ffe600;
 }

 .animate-typing-col {
     color: #0d9b35;
 }

 .animate-typing-col .dot {
     display: inline-block;
     width: 4px;
     height: 4px;
     border-radius: 50%;
     margin-inline-end: -1px;
     background: #0d9b35;
     -webkit-animation: wave 1.3s linear infinite;
     animation: wave 1.3s linear infinite;
     opacity: 0.6;
 }

 .animate-typing-col .dot:nth-child(2) {
     -webkit-animation-delay: -1.1s;
     animation-delay: -1.1s;
 }

 .animate-typing-col .dot:nth-child(3) {
     -webkit-animation-delay: -0.9s;
     animation-delay: -0.9s;
 }

 @-webkit-keyframes wave {

     0%,
     100%,
     60% {
         -webkit-transform: initial;
         transform: initial;
     }

     30% {
         -webkit-transform: translateY(-5px);
         transform: translateY(-5px);
     }
 }

 @keyframes wave {

     0%,
     100%,
     60% {
         -webkit-transform: initial;
         transform: initial;
     }

     30% {
         -webkit-transform: translateY(-5px);
         transform: translateY(-5px);
     }
 }

 .user-list li .avatar .letter-avatar {
     width: 45px;
     height: 45px;
     border-radius: 45px;
     margin-inline-end: 0.8rem;
     margin-bottom: 0;
     position: relative;
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     background-color: #e8dbff;
     font-size: 15px;
     font-weight: 600;
     color: #420ba1;
 }

 .chat_form {
     border-radius: 20px;
     margin-inline-end: 0px;
     background: #ffffff;
     border: 1px solid #c2c2c2;
     box-shadow: var(--box-shadow);
     border-radius: 6px;
     height: 40px;
     padding: 10px 10px;
 }

 .chat .chat-footer form .form-control::-webkit-input-placeholder {
     color: #424242;
     opacity: 1;
 }

 .chat .chat-footer form .form-control::-moz-placeholder {
     color: #424242;
     opacity: 1;
 }

 .chat .chat-footer form .form-control:-ms-input-placeholder {
     color: #424242;
     opacity: 1;
 }

 .chat .chat-footer form .form-control:-moz-placeholder {
     color: #424242;
     opacity: 1;
 }

 .user-list .avatar>a>img,
 .user-list .avatar>img {
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

 .contact-close a {
     color: #292f4c;
     opacity: 0.5;
     border-color: #e6e6e6;
 }

 .chat-wrapper .content .sidebar-group.right-sidebar .sidebar {
     width: 310px;
 }

 .primary-title {
     color: #ffa977;
     font-size: 13px;
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 0;
 }

 .primary-title i {
     font-size: 13px;
 }

 .contact-action {
     padding: 0;
     margin: 0;
     list-style: none;
 }

 .contact-action li {
     padding: 11px 0;
     border-bottom: 1px solid #f1f1f1;
 }

 .contact-action li a {
     color: #181c2f;
 }

 .contact-action li a {
     color: #181c2f;
     font-size: 13px;
     font-weight: bold;
 }

 .chat .chat-footer form .form-buttons .btn.send-btn:hover {
     background-color: #fff;
     border-color: var(--primary);
 }

 .chat .chat-footer form .form-buttons .btn.send-btn:hover i {
     color: var(--primary);
 }

 .chat .chat-footer form .form-buttons .btn.send-btn:focus {
     box-shadow: none;
 }

 .chat .chat-footer form .smile-foot {
     margin-inline-end: 10px;
 }

 .chat .chat-footer form .smile-foot .action-circle {
     width: 40px;
     height: 40px;
     background: #fff;
     border-radius: 50px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .chat .chat-footer form .smile-foot .action-circle:hover {
     background-color: #fff6f1;
     border-color: #fff6f1;
 }

 .chat .chat-footer form .smile-foot .action-circle i {
     color: #424242;
     font-size: 17px;
 }

 .down-emoji-circle {
     position: absolute;
     inset-inline-start: 10px !important;
     top: -38px !important;
 }

 .emoj-action .down-emoji-circle ul,
 .emoj-action-foot .down-emoji-circle ul {
     padding: 10px;
 }

 .down-emoji-circle ul li+li {
     margin-inline-start: 14px;
 }

 .emoj-action .down-emoji-circle ul li:last-child a,
 .emoj-action-foot .down-emoji-circle ul li:last-child a {
     width: 34px;
     height: 34px;
     border-radius: 50px;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .emoj-group-list,
 .emoj-group-list-foot {
     display: none;
     position: absolute;
     top: -50px;
     inset-inline-start: -90px;
     transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
     -o-transition: all 0.5s ease;
     -ms-transition: all 0.5s ease;
     -webkit-transition: all 0.5s ease;
 }

 .emoj-group-list ul,
 .emoj-group-list-foot ul {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     background: #fff;
     border-radius: 50px;
     padding: 5px;
 }

 .emoj-group-list ul li a,
 .emoj-group-list-foot ul li a {
     padding: 0;
 }

 .emoj-group-list ul li.add-emoj a,
 .emoj-group-list-foot ul li.add-emoj a {
     background: #ededed;
 }

 .emoj-group-list ul li.add-emoj a i,
 .emoj-group-list-foot ul li.add-emoj a i {
     font-size: 19px;
     color: #424242;
 }

 .chat-hover {
     position: absolute;
     bottom: 30px;
     inset-inline-end: 10px;
     display: none;
 }

 .add-section ul li {
     float: inline-start;
     border-radius: 50px;
     width: 28px;
     height: 28px;
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
 }

 .chat .chat-body {
     flex: 1;
     padding: 15px;
 }

 .chat .chat-body:not(.no-message) {
     overflow: auto;
 }

 .chat .chat-body.no-message {
     user-select: none;
 }

 .chat .chat-body .messages {
     display: flex;
     display: -webkit-flex;
     flex-direction: column;
     -webkit-flex-direction: column;
     align-items: flex-start;
     -webkit-align-items: flex-start;
 }

 .chat .chat-body .messages .chats {
     max-width: 75%;
     margin-bottom: 30px;
     display: flex;
     display: -webkit-flex;
 }

 .chat-avatar {
     padding: 8px 15px 0 8px;
     display: flex;
     display: -webkit-flex;
     align-items: flex-start;
     -webkit-align-items: flex-start;
 }

 .chat .chat-body .messages .chat-profile-name h6 {
     margin-bottom: 0;
     color: #0a0a0a;
     font-weight: 600;
     font-size: 14px;
 }

 .chat .chat-body .messages .chat-profile-name h6 span {
     font-size: 10px;
     color: #9e9e9e;
     font-weight: 400;
     padding-inline-start: 10px;
 }

 .chats.chats-right .chat-profile-name {
     justify-content: end;
     -webkit-justify-content: end;
     -ms-flex-pack: end;
 }

 .chat-profile-name {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     margin-bottom: 5px;
 }

 .replay-forms .chat-profile-name h6 {
     margin-bottom: 0;
 }

 .replay-forms .chat-profile-name h6 span {
     color: #9e9e9e;
     font-size: 10px;
     margin-inline-start: 10px;
 }

 .chat .chat-body .messages .chats:last-child {
     margin-bottom: 0;
 }

 .chat .chat-body .messages .chats .chat-time {
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     margin-bottom: 0;
 }

 .chat .chat-body .messages .chats .chat-time .avatar {
     margin-inline-end: 1rem;
 }

 .chat .chat-body .messages .chats .chat-time h5 {
     font-size: 14px;
     margin-bottom: 0;
 }

 .chat .chat-body .messages .chats .chat-time .time {
     color: #fff;
     margin-top: 2px;
     font-size: 10px;
     font-weight: 400;
 }

 .chat .chat-body .messages .chats .chat-time .time i {
     color: rgba(247, 247, 247, 0.5);
 }

 .chat .chat-body .messages .chats .chat-time .time i img {
     width: 14px;
     height: auto;
     margin-inline-start: 2px;
     vertical-align: 0px;
 }

 .chat .chat-body .messages .chats .message-content {
     background-color: #f8f8f8;
     border-radius: 0 10px 10px 10px;
     padding: 14px 20px;
     color: #424242;
     font-size: 13px;
     font-weight: 400;
     box-shadow: var(--box-shadow);
 }

 .chat .chat-body .messages .chats .message-content.award-link a {
     color: #424242;
     margin-bottom: 2px;
     display: block;
 }

 .chat .chat-body .messages .chats .message-content.chat-award-link a {
     display: flex;
     margin-bottom: 10px;
 }

 .select2-container--default .select2-selection--multiple .select2-selection__choice {
     background-color: #fcfcfc;
     border: 1px solid transparent;
     border-radius: 10px;
     box-shadow: var(--box-shadow);
     cursor: default;
     white-space: normal;
     float: left;
     margin-right: 5px;
     margin-top: 5px;
     line-height: 20px;
     padding: 0 5px;
     font-size: 12px;
 }

 [dir="rtl"] .website-phone-country-trigger {
     border-left: 1px solid transparent !important;
 }

 .website-phone-input-group {
     display: flex;
     position: relative;
     width: 100%;
     background-color: #fff !important;
     border: unset !important;
     border-radius: var(--wpi-radius);
     transition:
         border-color 0.15s ease-in-out,
         box-shadow 0.15s ease-in-out;
     height: var(--wpi-height);
     box-shadow: 0px 1px 2px #00000020;
 }

 .chat .chat-body .messages .chats .message-content.chat-award-link .emoj-group li a {
     margin-bottom: 0px;
 }

 .delete-pop-btn .btn-primary {
     margin: 0 0 0 10px;
 }

 .delete-model-head {
     padding: 40px;
 }

 .delete-model-head .modal-header {
     padding: 0;
     margin-bottom: 32px;
 }

 .delete-model-head .modal-body {
     padding: 0;
 }

 .delete-chat-notify {
     margin-bottom: 32px;
 }

 .delete-chat-notify .form-check {
     margin-bottom: 14px;
 }

 .chat .chat-body .messages .chats .message-content.award-link img {
     border-radius: 10px;
 }

 .chats.chats-right {
     flex-direction: row-reverse;
     -webkit-flex-direction: row-reverse;
 }

 .group-set-wrap {
     cursor: pointer;
 }

 .message-star {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .message-star .avatar {
     width: 26px;
     height: 26px;
     margin-inline-end: 10px;
 }

 .message-star .avatar img {
     width: 100%;
 }

 .message-star h6 {
     color: #0a0a0a;
     font-size: 14px;
     font-weight: 500;
     margin-bottom: 0;
 }

 .message-star h6 span i {
     color: #fec001;
 }

 .chat .chat-body .messages .chats .message-content a {
     color: #ffa633;
 }

 .chat .chat-body .messages .chats.chats-right {
     margin-inline-start: auto;
 }

 .chat-voice-group ul {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     padding: 0;
     margin-bottom: 0;
 }

 .chat-page-wrapper .dropdown-menu .dropdown-item {
     display: flex;
 }

 .chat-voice-group ul li span {
     width: 28px;
     height: 28px;
     background: var(--primary);
     border-radius: 50px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .chat-voice-group li {
     margin-bottom: 0;
     color: #424242;
     font-size: 13px;
     font-weight: 400;
     list-style: none;
 }

 .chat-voice-group li+li {
     padding-inline-start: 10px;
 }

 .chat .chat-body .messages .chats.chats-right .chat-time {
     justify-content: flex-end;
 }

 .chat .chat-body .messages .chats.chats-right .message-content {
     background-color: #f8ecff;
     color: #232323;
     border-radius: 15px 0px 15px 15px;
     padding: 15px;
 }

 .chat .chat-body .messages .chats.chats-right .chat-action-btns {
     order: 2;
     -webkit-order: 2;
     display: flex;
     display: -webkit-flex;
     flex-wrap: wrap;
     -webkit-flex-wrap: wrap;
     justify-content: center;
     -webkit-justify-content: center;
 }

 .chat .chat-body .messages .chats.chats-right .chat-action-btns .chat-action-col {
     width: 20px;
     text-align: center;
 }

 .chat .chat-body .messages .chats.chats-right .chat-action-btns .chat-read-col {
     display: flex;
     display: -webkit-flex;
     align-items: flex-end;
     -webkit-align-items: flex-end;
     padding-bottom: 22px;
     color: #008024;
 }

 .chat .chat-body .messages .chats.chats-right .chat-content {
     order: 1;
     -webkit-order: 1;
 }

 .chat .chat-body .messages .chats.chats-right .chat-avatar {
     padding: 8px 0px 0 15px;
 }

 .chat .chat-body .messages .chats.chats-right .message-content .chat-time {
     justify-content: flex-start;
     -webkit-justify-content: flex-start;
 }

 .chat .chat-body .messages .chats.chats-right .message-content .chat-time .time {
     color: #909090;
 }

 .chat .chat-body .messages .chats.chats-right .message-content .chat-time .time i {
     color: #a3c2ff;
 }

 .chat .chat-body .messages .download-col {
     position: relative;
 }

 .chat .chat-body .messages .download-col ul {
     list-style: none;
     padding: 0;
     margin: 0 0 5px 0;
     display: flex;
     display: -webkit-flex;
     justify-content: center;
     row-gap: 10px;
 }

 .chat .chat-body .messages .download-col ul li+li {
     margin-inline-start: 5px;
 }

 .chat .chat-body .messages .download-col .image-download-col {
     position: relative;
 }

 .chat .chat-body .messages .download-col .image-download-col a>img {
     border: 1px solid transparent;
     width: 80px;
     border-radius: 8px;
 }

 .chat .chat-body .messages .chats .message-content.fancy-msg-box .image-not-download span {
     position: absolute;
     color: #fff;
     font-size: 10px;
     font-weight: 500;
     position: absolute;
     top: 50%;
     inset-inline-start: 50%;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
 }

 [dir="rtl"] .chat .chat-body .messages .chats .message-content.fancy-msg-box .image-not-download span {
     -webkit-transform: translate(50%, -50%);
     -ms-transform: translate(50%, -50%);
     transform: translate(50%, -50%);
 }

 .chat .chat-body .messages .download-col .image-download-col.image-not-download a>img {
     -webkit-filter: blur(1px);
     filter: blur(1px);
 }

 .chat .chat-body .messages .download-col .download-action,
 .chat .chat-body .messages .file-download .download-action,
 .file-download-col .download-action {
     position: absolute;
     inset-inline-end: 8px;
     bottom: 8px;
     line-height: 0;
 }

 .chat .chat-body .messages .file-download .download-action {
     bottom: 14px;
 }

 .chat .chat-body .messages .download-col .download-action a,
 .chat .chat-body .messages .file-download .download-action a,
 .file-download-col .download-action a {
     color: #fff;
     font-size: 8px;
 }

 .chat .chat-body .messages .download-col .download-action div+div,
 .chat .chat-body .messages .file-download .download-action div+div,
 .file-download-col .download-action div+div {
     margin-inline-start: 8px;
 }

 .chat .chat-body .messages .download-col .download-action div img,
 .chat .chat-body .messages .file-download .download-action div img,
 .file-download-col .download-action div img {
     width: 13px;
 }

 .chat .chat-body .messages .file-download {
     position: relative;
     background: #f5f5f5;
     border-radius: 10px;
     padding: 10px;
     margin-bottom: 7px;
 }

 .chat .chat-body .messages .file-download .file-type {
     width: 54px;
     height: 54px;
     background-color: #fff;
     border-radius: 4px;
 }

 .chat .chat-body .messages .file-download .file-type i {
     color: #9e9e9e;
     font-size: 22px;
 }

 .chat .chat-body .messages .file-download .file-details span.file-name {
     color: #0a0a0a;
     display: inline-block;
     width: 100%;
     font-size: 14px;
     font-weight: 500;
 }

 .chat .chat-body .messages .file-download .file-details span.file-size {
     color: #909090;
     display: inline-block;
     width: 100%;
 }

 .chat .chat-body .messages .file-download .file-details ul {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     padding: 0;
     margin-bottom: 0;
 }

 .chat .chat-body .messages .file-download .file-details ul li {
     list-style: none;
     color: #424242;
     font-size: 13px;
     position: relative;
 }

 .chat .chat-body .messages .file-download .file-details ul li::before {
     content: "";
     position: absolute;
     width: 1px;
     height: 13px;
     background: #c2c2c2;
     inset-inline-end: -8px;
     top: 5px;
 }

 .chat .chat-body .messages .file-download .file-details ul li:last-child::before {
     display: none;
 }

 .chat .chat-body .messages .file-download .file-details ul li+li {
     padding-inline-start: 15px;
 }

 .chat .chat-body .messages .file-download .file-details ul li a {
     color: var(--primary);
 }

 .chat .chat-body .messages .file-download .download-action a {
     color: var(--primary);
 }

 .chat-select .select2-container .select2-selection--single {
     border: 0;
     height: 24px;
 }

 .chat-select .select2-container--default .select2-selection--single .select2-selection__rendered {
     color: #344357;
     font-size: 17px;
     font-weight: normal;
     line-height: 24px;
     font-weight: 600;
 }

 .chat-select .select2-container--default .select2-selection--single .select2-selection__arrow {
     height: 24px;
     inset-inline-end: 7px;
 }

 .success-pass {
     margin-bottom: 40px;
     text-align: center;
 }

 .chat-select .select2-container--default .select2-selection--single .select2-selection__arrow b {
     border-color: #344357;
     border-style: solid;
     border-width: 0 2px 2px 0;
     padding: 3px;
     height: 0;
     inset-inline-start: 50%;
     margin-inline-start: -5px;
     margin-top: -5px;
     position: absolute;
     top: 50%;
     width: 0;
     transform: rotate(45deg);
     -webkit-transform: rotate(45deg);
 }

 .chat-select .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
     border-color: #344357;
     border-width: 2px 0 0 2px;
     padding: 3px;
     margin-top: -5px;
 }

 .chat-select .select2-container--default.form-control-sm .select2-selection--single .select2-selection__arrow {
     top: 7px;
 }

 .chat-select .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
     border-color: #344357;
     border-style: solid;
     border-width: 0 2px 2px 0;
     padding: 3px;
 }

 .chat-select .select2-container .select2-selection--single .select2-selection__rendered {
     padding-inline-end: 40px;
     padding-inline-start: 0px;
 }

 .chat-select .select2-container--default .select2-results__option--highlighted[aria-selected] {
     background-color: #4b4b9f;
 }

 .chat-select .select2-container--default .select2-selection--multiple {
     border: 1px solid #ddd;
     min-height: 40px;
 }

 .chat-select .select2-container--open .select2-dropdown--below {
     margin-top: 10px;
 }

 .review-files p {
     margin-bottom: 5px;
     color: #424242;
     font-size: 13px;
 }

 .like-chat-grp ul {
     padding: 0;
     margin-bottom: 0;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     margin-top: 10px;
 }

 .like-chat-grp ul li {
     list-style: none;
 }

 .like-chat-grp ul li+li {
     margin-inline-start: 10px;
 }

 .like-chat-grp ul li a {
     border: 1px solid #e0e0e0;
     border-radius: 50px;
     padding: 3px 12px;
     display: block;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     color: #0a0a0a;
     font-weight: 400;
     font-size: 13px;
 }

 .like-chat-grp ul li.like-chat a {
     background: #fef6dc;
 }

 .like-chat-grp ul li.comment-chat a {
     background: #ffe8e9;
 }

 .like-chat-grp ul li a img {
     margin-inline-start: 5px;
 }

 .chat-line {
     margin: 0px 0 20px;
     position: relative;
     text-align: center;
     width: 100%;
 }

 .chat-line:before {
     content: "";
     position: absolute;
     inset-inline-start: 0;
     top: 50%;
     transform: translateY(-50%);
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     background-color: #eeeeee;
     width: 100%;
     height: 1px;
 }

 .chat-date {
     background-color: #fff;
     color: #0a0a0a;
     font-size: 13px;
     padding: 4px 20px;
     border-radius: 50px;
     display: inline-block;
     font-weight: 400;
     position: relative;
     border: 1px solid #e0e0e0;
 }

 .chat .chat-footer {
     position: relative;
 }

 .chat .chat-footer form {
     display: flex;
     display: -webkit-flex;
     align-items: end;
     -webkit-align-items: end;
     position: absolute;
     bottom: -1px;
     inset-inline-start: 0;
     inset-inline-end: 0;
     padding: 24px;
     background-color: #fff;
     border-bottom: 1px solid #cdcdcd;
     border-radius: 10px;
     align-items: center;
 }

 .chat .chat-footer form .form-buttons .btn {
     margin-inline-start: 0px;
     color: #bdbfc7;
     font-size: 19px;
     padding: 0;
     width: 20px;
     height: 20px;
     border-radius: 50%;
     display: flex;
     justify-content: center;
     align-items: center;
     margin-inline-end: 10px;
 }

 .chat .chat-footer form .form-buttons .btn:last-child {
     margin-inline-end: 0;
 }

 .chat .chat-footer form .specker-col span {
     color: var(--primary);
     font-size: 23px;
 }

 .chat .chat-footer form .attach-col i,
 .chat .chat-footer form .smile-col i {
     color: var(--primary);
     font-size: 19px;
 }

 .chat .chat-footer form .smile-col i {
     font-size: 21px;
 }

 .chat .chat-footer form .smile-col {
     inset-inline-end: inherit;
     inset-inline-start: 15px;
 }

 .chat .chat-footer form .attach-col {
     inset-inline-end: inherit;
     inset-inline-start: 60px;
 }

 .chat+.sidebar-group {
     margin-inline-end: 0px;
 }

 .chat+.sidebar-group .sidebar {
     margin-inline-end: 0px;
 }

 .group-comman-theme {
     padding: 0 24px;
 }

 .group-comman-theme h6 {
     margin-bottom: 15px;
 }

 .group-comman-theme ul {
     padding: 0;
     padding-bottom: 15px;
     margin-bottom: 15px;
     border-bottom: 1px solid #ededed;
 }

 .group-comman-theme ul li {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     list-style: none;
     border: 1px solid #e0e0e0;
     border-radius: 5px;
     padding: 5px;
     margin-bottom: 10px;
 }

 .group-comman-theme ul li:last-child {
     margin-bottom: 0;
 }

 .group-comman-theme ul li .avatar {
     flex-shrink: 0;
     margin-inline-end: 10px;
 }

 .theme-content h6 {
     margin-bottom: 6px;
     color: #0a0a0a;
     font-size: 14px;
     font-weight: 500;
 }

 .theme-content p {
     margin-bottom: 0;
     text-align: start;
     line-clamp: 1;
     -webkit-line-clamp: 1;
     -webkit-box-orient: vertical;
     overflow: hidden;
     text-overflow: ellipsis;
     display: -webkit-box;
     color: #424242;
     font-size: 13px;
 }

 .chat-message-grp {
     padding: 24px;
     padding-top: 0;
 }

 .chat-message-grp ul {
     padding: 0;
 }

 .chat-message-grp ul li {
     list-style: none;
     margin-bottom: 15px;
 }

 .chat-message-grp ul li:last-child {
     margin-bottom: 0px;
 }

 .chat-message-grp ul li a {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
 }

 .chat-message-grp ul li a:hover .stared-group h6 {
     color: var(--primary);
 }

 .stared-group {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .stared-group span {
     width: 30px;
     height: 30px;
     border-radius: 6px;
     margin-inline-end: 10px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .star-message {
     background: #fef6dc;
 }

 .star-message i {
     color: #fec001;
 }

 .mute-message {
     background: #ebfdfffa;
 }

 .chat-page .slimscroll {
     height: calc(100vh - 130px) !important;
 }

 .chat-page .chat .slimscroll {
     height: calc(100vh - 190px) !important;
 }

 .replay-forms {
     width: 100%;
     border: 1px solid #e0e0e0;
     background: #fff;
     border-radius: 10px;
 }

 .replay-forms .form-control {
     border: 0;
     background: transparent;
     box-shadow: none;
 }

 .uplaod-image {
     height: 400px;
 }

 .uplaod-image img {
     width: 100%;
     height: 100%;
 }

 .uplaod-image .chat {
     background: transparent;
     height: auto;
 }

 .sroll-side-view {
     height: 400px;
     overflow-y: scroll;
     overflow-x: hidden;
 }

 .sroll-side-view::-webkit-scrollbar {
     width: 5px;
     height: 10px;
     border-radius: 50px !important;
 }

 .sroll-side-view::-webkit-scrollbar-track {
     background: #f1f1f1;
     border-radius: 50px !important;
 }

 .sroll-side-view::-webkit-scrollbar-thumb {
     background: var(--primary);
     border-radius: 50px !important;
 }

 .sroll-side-view::-webkit-scrollbar-thumb:hover {
     background: var(--primary);
 }

 .multi-load {
     border: 2px solid #c8ccc8;
     box-shadow: var(--box-shadow);
     border-inline-start-color: #5a078b;
     border-top-color: #b8beb8;
     border-inline-end-color: #b8beb8;
     border-bottom-color: #b8beb8;
     text-align: center;
     box-sizing: border-box;
 }

 .right-sidebar .right-sidebar-wrap {
     background-color: #fff;
     border-inline-start: 1px solid #e0e0e0;
     border-radius: 0px;
     margin-top: 0px;
     margin-bottom: 0px;
     height: calc(100vh - 0px);
 }

 .right-sidebar .right-sidebar-wrap .sidebar-body {
     padding: 0;
 }

 .right-sidebar .right-sidebar-wrap .right-sidebar-profile {
     padding: 24px;
     padding-bottom: 0;
     margin-bottom: 15px;
 }

 .right-sidebar.video-right-sidebar.show-right-sidebar {
     margin-inline-end: 0;
 }

 .right-sidebar.video-right-sidebar .chat {
     margin-inline-start: 0 !important;
     display: block;
 }

 .right-sidebar.hide-right-sidebar {
     margin-inline-end: -320px;
 }

 .right-sidebar.video-right-sidebar.hide-right-sidebar {
     margin-inline-end: -371px;
 }

 .right-sidebar .contact-close_call .close_profile,
 .status-modal .custom-status-close {
     width: 25px;
     height: 25px;
     border-radius: 25px;
     color: #0a0a0a;
     display: flex;
     display: -webkit-flex;
     justify-content: center;
     -webkit-justify-content: center;
     align-items: center;
     -webkit-align-items: center;
     background-color: #f5f5f5;
     border-color: #f5f5f5;
 }

 .group-description .description-sub h5 span a {
     width: 25px;
     height: 25px;
     border-radius: 25px;
     color: #0a0a0a;
     display: flex;
     display: -webkit-flex;
     justify-content: center;
     -webkit-justify-content: center;
     align-items: center;
     -webkit-align-items: center;
     border-color: #f5f5f5;
 }

 .list_group_notread {
     color: #ffa977 !important;
 }

 .tooltip>.tooltip-inner {
     text-align: start;
     max-width: 500px;
     --bs-tooltip-bg: var(--primary);
 }

 .tooltip {
     --bs-tooltip-bg: var(--primary);
 }

 .tooltip .arrow {
     display: none;
     background-color: var(--primary);
 }

 .tooltip .tooltip-inner {
     background-color: var(--primary);
 }

 .chat-cont-type {
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .chat-cont-type .chat-type-wrapper {
     margin-bottom: 0;
 }

 .chat-cont-type .chat-type-wrapper p {
     color: #9e9e9e;
     font-size: 10px;
     font-weight: 400;
     margin-bottom: 0;
 }

 .group-type-radio {
     display: block;
     position: relative;
     padding-inline-start: 35px;
     cursor: pointer;
     font-size: 21px;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
 }

 .group-type-radio input {
     position: absolute;
     opacity: 0;
     cursor: pointer;
 }

 .group-type-radio {
     font-size: 15px;
     font-weight: 400;
     color: #424242;
     margin-inline-end: 24px;
 }

 .checkmark {
     position: absolute;
     top: 0;
     inset-inline-start: 0;
     height: 22px;
     width: 22px;
     background-color: #fff;
     border: 1px solid #e4e4e4;
     border-radius: 50%;
 }

 .pass-login label {
     color: #0a0a0a;
     font-size: 13px;
     font-weight: 500;
 }

 .paypal-icons img {
     height: 19px;
 }

 .select2-container--default .select2-results__option--highlighted[aria-selected] {
     background-color: var(--primary) !important;
 }

 .group-type-radio input:checked~.checkmark {
     background-color: var(--primary);
 }

 .checkmark:after {
     content: "";
     position: absolute;
     display: none;
 }

 .group-type-radio input:checked~.checkmark:after {
     display: block;
 }

 .group-type-radio .checkmark:after {
     top: 4px;
     inset-inline-start: 4px;
     width: 12px;
     height: 12px;
     border-radius: 50%;
     background: white;
 }

 .right-sidebar-profile>.avatar {
     background: transparent;
 }

 .right-sidebar-profile .profile-name span i {
     font-size: 15px;
 }

 .group_img {
     position: relative;
     display: inline-block;
 }

 .group-name-search {
     margin-bottom: 14px;
 }

 .parti-wrapper {
     margin-bottom: 14px;
     display: flex;
     align-items: center;
 }

 .group_header {
     width: 38px !important;
     height: 38px !important;
     border: 2px solid #ffffff;
 }

 .last-chat-time i.missed-col {
     width: 17px;
     display: inline-block;
     margin-top: 10px;
 }

 .last-chat-time i.missed-col img {
     max-width: 100%;
     height: auto;
 }

 .right-sidebar-head {
     padding: 0px 24px;
 }

 .right-sidebar-head.share-media .share-media-blk {
     margin-bottom: 20px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
 }

 .right-sidebar-head h5 {
     font-size: 14px;
     font-weight: 600;
     color: #1f2937;
     margin-bottom: 0px;
 }

 .right-sidebar-head.share-media .about-media-tabs .nav-tabs {
     margin-bottom: 15px;
     background: #ededed;
     padding: 5px;
     border-radius: 8px;
     display: flex;
     justify-content: space-between;
 }

 .right-sidebar-head.share-media .about-media-tabs {
     border-bottom: 1px solid #ededed;
     padding-bottom: 10px;
     margin-bottom: 15px;
 }

 .right-sidebar-head.share-media .about-media-tabs .nav .nav-item.active {
     background: #fff;
     border-radius: 6px;
     color: #424242;
 }

 .right-sidebar-head.share-media .about-media-tabs .nav .nav-item {
     padding: 2px 10px;
     font-size: 13px;
     color: #424242;
     font-weight: 500;
     border: 0;
     margin-inline-end: 10px;
 }

 .right-sidebar-head.share-media .about-media-tabs .nav .nav-item:last-child {
     margin-inline-end: 0px;
 }

 .right-sidebar-head.share-media .about-media-tabs .share-media-img li {
     margin: 0px 6px 6px 0px;
     position: relative;
 }

 .right-sidebar-head.share-media .about-media-tabs .share-media-img li img {
     border-radius: 8px;
     width: 84px;
 }

 .right-sidebar-head.share-media .about-media-tabs .share-media-img li span i {
     font-size: 19px;
     color: #fff;
 }

 .right-sidebar-head.share-media .about-media-tabs .share-media-img li:hover span i {
     color: #eee;
 }

 .right-sidebar-head.share-media .about-media-tabs .share-media-img li.blur-media img {
     filter: blur(2px);
 }

 .right-sidebar-head.share-media .about-media-tabs .share-media-img li span {
     position: absolute;
     color: #fff;
     font-size: 10px;
     font-weight: 500;
     position: absolute;
     top: 50%;
     inset-inline-start: 50%;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
 }

 [dir="rtl"] .right-sidebar-head.share-media .about-media-tabs .share-media-img li span {
     -webkit-transform: translate(50%, -50%);
     -ms-transform: translate(50%, -50%);
     transform: translate(50%, -50%);
 }

 .media-file {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     margin-bottom: 15px;
 }

 .media-file:last-child {
     margin-bottom: 0;
 }

 .media-doc-blk {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .media-doc-blk span {
     width: 50px;
     height: 50px;
     border-radius: 5px;
     background: #f5f5f5;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     margin-inline-end: 10px;
 }

 .media-doc-blk span i {
     font-size: 22px;
 }

 .document-detail ul {
     padding: 0;
     margin-bottom: 0;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .document-detail ul li {
     list-style: none;
     color: #424242;
     font-size: 13px;
     font-weight: 400;
     position: relative;
 }

 .document-detail ul li::before {
     content: "";
     position: absolute;
     width: 1px;
     height: 13px;
     background: #c2c2c2;
     inset-inline-end: -8px;
     top: 5px;
 }

 .document-detail ul li:last-child::before {
     display: none;
 }

 .document-detail ul li+li {
     padding-inline-start: 15px;
 }

 .document-detail h6 {
     color: #0a0a0a;
     font-size: 14px;
     font-weight: 500;
 }

 .media-download a {
     color: #424242;
 }

 .social-media-col {
     margin-top: 35px;
 }

 .media-link-grp {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     margin-bottom: 15px;
 }

 .media-link-detail h6 a {
     color: #0a0a0a;
     font-size: 14px;
     font-weight: 500;
     margin-bottom: 5px;
 }

 .media-link-detail span a {
     color: #424242;
     font-size: 13px;
     font-weight: 400;
     word-break: break-all;
 }

 .media-link-detail a:hover {
     color: var(--primary);
 }

 .share-media-blk a {
     color: var(--primary);
     font-weight: 500;
 }

 .link-img img {
     border-radius: 4px;
     margin-inline-end: 10px;
 }

 .social-media-col:after {
     content: "";
     display: table;
     clear: both;
 }

 .chat-page .content {
     padding: 0;
     overflow: hidden;
     margin-bottom: 60px;
     height: calc(100vh - 100px);
 }

 .chat-page-wrapper {
     padding-top: 60px;
 }

 .header-two .dropdown-item img {
     margin-inline-end: 5px;
 }

 .emoj-group {
     position: absolute;
     top: 50%;
     inset-inline-end: -100px;
     opacity: 0;
     transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
     -o-transition: all 0.5s ease;
     -ms-transition: all 0.5s ease;
     -webkit-transition: all 0.5s ease;
     -webkit-transform: translate(0, -50%);
     -ms-transform: translate(0, -50%);
     transform: translate(0, -50%);
 }

 .rig-emoji-group {
     position: absolute;
     inset-inline-end: 210px;
 }

 .wrap-emoji-group {
     position: absolute;
     inset-inline-end: 290px;
     z-index: 9;
 }

 .status-message-box h6 {
     font-size: 19px;
     color: #0a0a0a;
     margin-bottom: 24px;
 }

 .status-message-box .avatar {
     width: 92px;
     height: 92px;
     margin-bottom: 24px;
 }

 .status-message-box .view-link a {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
 }

 .status-message-box .view-link a:hover {
     color: #650681;
 }

 .status-message-box .view-link p {
     font-size: 15px;
     font-weight: 400;
     color: #424242;
 }

 .chat-hover {
     position: absolute;
     bottom: 30px;
     inset-inline-end: 10px;
     display: none;
 }

 .chat-user-list {
     position: relative;
 }

 .chat-user-list:hover .chat-hover {
     display: block;
 }

 .chat-user-list:hover .chat-pin,
 .chat-hover:hover .chat-pin {
     margin-inline-end: 15px;
 }

 .chat-hover span {
     cursor: pointer;
 }

 .chat.call-log-group {
     background-image: none;
     background-color: #f8f6fa;
 }

 .chat.call-log-group .chat-header {
     border: 0;
     background: transparent;
 }

 .chat.call-log-group .chat-body {
     background-image: none;
 }

 .missed-call-chat {
     color: #de3e44;
 }

 .outgoing-call {
     color: #02a2b9;
 }

 .incoming-call {
     color: #1ba345;
 }

 .phone-income i {
     color: #1ba345;
     margin-inline-end: 3px;
 }

 .phone-missed i {
     color: #de3e44;
     margin-inline-end: 3px;
 }

 .phone-outgoing i {
     color: #02a2b9;
     margin-inline-end: 3px;
 }

 .dark-mode-toggle {
     display: none;
 }

 .dark-mode-toggle.active {
     display: block;
 }

 .list-inline-item .dropdown-menu {
     background: #ffffff;
     border: 1px solid #e5e7eb;
     box-sizing: border-box;
     box-shadow: var(--box-shadow);
     border-radius: 8px;
     min-width: 173px;
     z-index: 999;
 }

 .list-inline-item .dropdown-menu .dropdown-item {
     display: flex;
     align-items: center;
 }

 .main-chat-blk .sidebar-group {
     display: flex;
     display: -webkit-flex;
     flex-direction: column;
     position: relative;
     z-index: 99;
     width: 340px;
 }

 .swiper-slide {
     flex-shrink: 0;
     width: 100%;
     height: 100%;
     position: relative;
     transition-property: transform;
 }

 .main-chat-blk .chat-page-wrapper .sidebar {
     position: initial;
 }

 .main-chat-blk .chat-page-wrapper .left-chat-title {
     padding: 15px;
     border-bottom: 1px solid #e0e0e0;
     min-height: 72px;
 }

 .main-chat-blk .all-chats {
     position: relative;
 }

 .main-chat-blk .chat-page-wrapper .setting-title-head h4 {
     font-size: 17px;
     color: #092c4c;
     font-weight: 700;
 }

 .main-chat-blk .add-section ul {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .main-chat-blk .add-section ul {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .main-chat-blk .add-section ul li a {
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
     font-size: 19px;
 }

 .main-chat-blk .top-online-contacts {
     padding: 24px 24px 0px;
 }

 .main-chat-blk .fav-title {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     margin-bottom: 15px;
 }

 .main-chat-blk .top-contacts-box .profile-img {
     position: relative;
     width: 46px;
     height: 46px;
 }

 .main-chat-blk .top-contacts-box .profile-img.online:before {
     content: "";
     position: absolute;
     inset-inline-end: 0;
     transform: translateX(-50%);
     -webkit-transform: translateX(-50%);
     -ms-transform: translateX(-50%);
     top: 0px;
     background-color: #49e073;
     width: 10px;
     height: 10px;
     border: 2px solid #fff;
     border-radius: 50px;
 }

 .main-chat-blk .top-contacts-box .profile-img img {
     max-width: 100%;
     height: auto;
     border-radius: 50px;
 }

 .main-chat-blk .sidebar-body {
     flex: 1;
     overflow: auto;
     padding: 24px 24px 10px;
     width: 100%;
 }

 .main-chat-blk .fav-title {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     -ms-flex-pack: space-between;
     margin-bottom: 15px;
 }

 .main-chat-blk .fav-title h6 {
     margin-bottom: 0;
     font-size: 17px;
     font-weight: 600;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }

 .main-chat-blk .user-list {
     border-radius: 0.25rem;
     display: flex;
     display: -webkit-flex;
     flex-direction: column;
     -webkit-flex-direction: column;
     padding-inline-start: 0;
     margin-bottom: 0;
 }

 .main-chat-blk .user-list {
     border-radius: 0.25rem;
     display: flex;
     display: -webkit-flex;
     flex-direction: column;
     -webkit-flex-direction: column;
     padding-inline-start: 0;
     margin-bottom: 0;
 }

 .main-chat-blk .user-list li .avatar {
     margin-inline-end: 0.8rem;
     display: inline-block;
     margin-bottom: 0;
     height: 46px;
     width: 46px;
     border-radius: 50%;
     position: relative;
     z-index: 0;
 }

 .main-chat-blk .avatar-online::before {
     background-color: #00e65b;
 }

 .main-chat-blk .avatar-away::before,
 .main-chat-blk .avatar-offline::before,
 .main-chat-blk .avatar-online::before {
     position: absolute;
     inset-inline-end: 0;
     bottom: 0;
     width: 25%;
     height: 25%;
     border-radius: 50%;
     content: "";
     border: 2px solid #fff;
 }

 .main-chat-blk .sidebar .user-list li .users-list-body {
     flex: 1;
     position: relative;
     min-width: 0px;
     display: flex;
 }

 .main-chat-blk .sidebar .user-list li .users-list-body>div:first-child {
     min-width: 0;
     display: flex;
     flex-direction: column;
     flex: 1;
 }

 .main-chat-blk .sidebar .user-list li .users-list-body h5 {
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
     font-size: 14px;
     font-weight: 500;
     margin-bottom: 3px;
     color: #0a0a0a;
 }

 .main-chat-blk .sidebar .user-list li .users-list-body p {
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
     margin-bottom: 0;
     font-size: 13px;
 }

 .main-chat-blk .sidebar .user-list li .users-list-body .last-chat-time {
     padding-inline-start: 15px;
     position: relative;
 }

 .main-chat-blk .sidebar .user-list li .users-list-body .last-chat-time .text-muted {
     color: #424242 !important;
     font-weight: 400;
     font-size: 10px;
     margin-bottom: 5px;
     display: block;
     text-align: end;
 }

 .main-chat-blk .chat-pin {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     justify-content: end;
     -webkit-justify-content: end;
     -ms-flex-pack: end;
 }

 .main-chat-blk .chat .chat-header {
     display: flex;
     display: -webkit-flex;
     justify-content: space-between;
     -webkit-justify-content: space-between;
     padding: 15px 15px;
     align-items: center;
     background: #fcfcfc;
     box-shadow: var(--box-shadow);
     position: relative;
     margin: 15px;
 }

 .main-chat-blk .chat .chat-header .user-details {
     display: flex;
     display: -webkit-flex;
     align-items: center;
     -webkit-align-items: center;
 }

 .header-navbar-rht li .dropdown-menu.show {
     opacity: 1;
     visibility: visible;
 }

 .main-chat-blk .chat .chat-body .messages {
     display: flex;
     display: -webkit-flex;
     flex-direction: column;
     -webkit-flex-direction: column;
     align-items: flex-start;
     -webkit-align-items: flex-start;
 }

 .main-chat-blk .chat .chat-body .messages .chats {
     max-width: 75%;
     margin-bottom: 1.5rem;
     display: flex;
     display: -webkit-flex;
 }

 .main-chat-blk .chat-avatar {
     padding: 8px 15px 0 8px;
     display: flex;
     display: -webkit-flex;
     align-items: flex-start;
     -webkit-align-items: flex-start;
     flex-shrink: 0;
 }

 .main-chat-blk .dreams_chat {
     width: 40px;
     height: 40px;
     object-fit: cover;
 }

 .main-chat-blk .dreams_chat {
     width: 40px;
     height: 40px;
     object-fit: cover;
 }

 .main-chat-blk .chat .chat-body .messages .chat-profile-name h6 {
     margin-bottom: 0;
     color: #0a0a0a;
     font-weight: 600;
     font-size: 14px;
 }

 .main-chat-blk .chat-line {
     margin: 0px 0 20px;
     position: relative;
     text-align: center;
     width: 100%;
 }

 .main-chat-blk .chat-line:before {
     content: "";
     position: absolute;
     inset-inline-start: 0;
     top: 50%;
     transform: translateY(-50%);
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     background-color: #eeeeee;
     width: 100%;
     height: 1px;
 }

 .main-chat-blk .chat-date {
     border-radius: 100px;
     background: #e8ebed;
     color: #0a0a0a;
     font-size: 13px;
     padding: 4px 20px;
     display: inline-block;
     font-weight: 400;
     position: relative;
     border: 1px solid #e0e0e0;
 }

 .view-all-chat-profiles {
     color: #ffa633;
 }

 .chat.chat-messages {
     border: 1px solid #cdcdcd;
     border-radius: 10px;
 }

 .location-sharing {
     background: #e6e6e6;
     border-radius: 5px;
     display: flex;
     align-items: center;
     padding: 5px;
     min-width: 300px;
 }

 .location-sharing h6 {
     font-weight: 400;
     font-size: 15px;
 }

 .location-sharing h6 a {
     display: block;
     font-size: 13px;
     font-weight: 500;
 }

 .sharing-location-icon {
     width: 54px;
     height: 54px;
     border-radius: 5px;
     display: flex;
     align-items: center;
     justify-content: center;
     background: #fff;
     margin-inline-end: 10px;
 }

 .select-group-chat a {
     color: #111111;
     font-weight: 600;
     font-size: 17px;
 }

 /*-----------------
	36. Notification Popup
-----------------------*/
 .topnav-dropdown-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 15px;
 }

 .topnav-dropdown-header p {
     margin-bottom: 0;
     font-size: 13px;
     font-weight: 600;
 }

 .text-end {
     text-align: end !important;
 }

 .text-start {
     text-align: start !important;
 }

 .header-navbar-rht li.logged-item .dropdown-menu.dropdown-menu-end.noti-blk {
     max-width: 440px;
     text-align: start;
     padding: 0;
 }

 .notification-message {
     padding: 0 15px;
     padding-bottom: 15px;
     margin-bottom: 15px;
     border-bottom: 1px solid #ffe6d8;
 }

 .notification-message .noti-details {
     font-size: 13px;
     margin-bottom: 0;
 }

 .notification-message .noti-details span {
     color: #4f4f4f;
     font-weight: 500;
 }

 .notification-message .avatar {
     margin-inline-end: 15px;
 }

 .noti-time {
     font-size: 13px;
     color: #4f4f4f;
     margin-bottom: 0;
 }

 .notify-btns {
     margin-top: 15px;
     margin-bottom: 8px;
 }

 .noti-time.notitime {
     margin-top: 15px;
 }

 .noti-reply-msg {
     font-size: 13px;
     padding-inline-start: 10px;
     border-inline-start: 2px solid #cdcdcd;
     margin-top: 10px;
     margin-bottom: 0;
 }

 .noti-blk ul {
     margin-top: 15px;
 }

 .noti-blk ul li.notification-message:last-child {
     border-bottom: 0;
     padding-bottom: 0;
     margin-bottom: 0;
 }

 .clear-all-noti {
     text-align: center;
     margin: 20px 0;
 }

 .clear-notification {
     font-weight: 600;
     font-size: 13px;
     color: #e82646;
 }

 .notification-message a .avatar {
     position: relative;
 }

 .notification-message .active-noti .avatar:before {
     content: "";
     width: 8px;
     height: 8px;
     border-radius: 20px;
     background: #1abe17;
     position: absolute;
     bottom: 0;
     inset-inline-end: 0;
 }

 .notification-title a {
     color: var(--primary);
     font-size: 10px;
     font-weight: 500;
 }

 .mark-all-noti {
     font-size: 13px;
     font-weight: 500;
 }

 .dropdowns {
     position: relative;
 }

 .dropdown-menu {
     display: none;
 }

 .toggle,
 .dropdown-menu {
     width: 100%;
 }

 .is-active .dropdown-menu {
     display: block;
 }

 /*-----------------
	37. Responsive
-----------------------*/

 @media only screen and (min-width: 992px) {
     .main-nav li {
         display: block;
         position: relative;
     }

     .main-nav>li>a {
         line-height: 70px;
         padding: 0 !important;
     }

     .main-nav>li>a>i {
         font-size: 10px;
         margin-inline-start: 3px;
     }

     .main-nav li>ul {
         background-color: #ffffff;
         border-radius: 10px;
         box-shadow: var(--box-shadow);
         display: block;
         font-size: 13px;
         inset-inline-start: 0;
         margin: 0;
         min-width: 200px;
         opacity: 0;
         padding: 10px;
         position: absolute;
         -webkit-transition: all 0.2s ease;
         transition: all 0.2s ease;
         -webkit-transform: translateY(20px);
         -ms-transform: translateY(20px);
         transform: translateY(20px);
         top: 100%;
         visibility: hidden;
         z-index: 1000;
     }

     .main-nav li.has-submenu:hover>.submenu {
         opacity: 1;
         visibility: visible;
         transform: scaleY(1);
         -webkit-transform: scaleY(1);
         -moz-transform: scaleY(1);
         -ms-transform: scaleY(1);
         -o-transform: scaleY(1);
     }

     .main-nav .has-submenu.active>a {
         color: var(--primary);
     }

     .main-nav .has-submenu.active .submenu li.active>a {
         color: var(--primary);
     }

     .main-nav>li .submenu li:first-child a {
         border-top: 0;
     }

     .main-nav>li.has-submenu:hover>.submenu>li.has-submenu:hover>.submenu {
         visibility: visible;
         opacity: 1;
         margin-top: -1px;
         margin-inline-end: 0;
     }

     .main-nav>li .submenu>li .submenu {
         inset-inline-start: calc(100% + 10px);
         top: 0;
         margin-top: 0;
     }

     .main-nav>.has-submenu>.submenu>.has-submenu>.submenu::before {
         top: 20px;
         margin-inline-start: -35px;
         box-shadow: var(--box-shadow);
         border-color: transparent #fff #fff transparent;
     }

     .header-navbar-rht .dropdown-toggle.show+.dropdown-menu {
         visibility: visible;
         opacity: 1;
         margin-top: 0;
         -webkit-transform: translateY(0);
         -ms-transform: translateY(0);
         transform: translateY(0);
     }

     .header-navbar-rht li .dropdown-menu {
         border-radius: 5px;
         padding: 0;
         margin: 0;
         min-width: 200px;
         top: 100%;
         inset-inline-end: 0;
         inset-inline-start: auto;
         -webkit-transition: all 0.2s ease;
         transition: all 0.2s ease;
     }

     .header-navbar-rht li.logged-item .dropdown-menu {
         min-width: 200px;
     }

     .main-nav li.megamenu {
         position: unset;
     }

     .main-nav li>ul.mega-submenu {
         border-radius: 0 0 5px 5px;
         max-height: calc(100vh - 80px);
         overflow-y: auto;
     }

     .main-nav li>ul.mega-submenu::-webkit-scrollbar {
         width: 6px;
         background: #cdcdcd;
         height: 10px;
     }

     .main-nav li>ul.mega-submenu::-webkit-scrollbar-track {
         box-shadow: var(--box-shadow);
         border-radius: 4px;
     }

     .main-nav li>ul.mega-submenu::-webkit-scrollbar-thumb {
         background: #686868;
         border-radius: 4px;
     }

     .main-nav li>ul.mega-submenu::-webkit-scrollbar-thumb:hover {
         background: #1b2559;
     }
 }

 @media only screen and (max-width: 1399.98px) {
     .banner-img-right {
         max-width: 440px;
     }

     .banner-head h1 {
         font-size: 32px;
         max-width: 570px;
     }

     .banner-small-bg-two {
         bottom: 33%;
         inset-inline-end: 350px;
     }

     .banner-small-bg-one {
         bottom: 35%;
         inset-inline-end: 100px;
         max-width: 50px;
     }

     .banner-form .input-block {
         min-width: 160px;
     }

     .popular-content h5 {
         font-size: 14px;
     }

     .category-overlay-content h5 {
         width: 150px;
         font-size: 17px;
     }

     .filter-gigs h5 {
         margin-inline-end: 9px;
     }

     .filter-gigs .filter-select-boxes li {
         margin-inline-end: 9px;
     }

     .blog-content .user-info h6 {
         font-size: 14px;
     }

     .seller-info-content {
         height: auto;
         max-height: 500px;
     }

     .footer-widget .menu-items li a {
         font-size: 14px;
     }

     .login-slider h2 {
         font-size: 27px;
     }


     .login-bg {
         width: 120px;
     }

     .error-imgs .error-02 {
         width: 60px;
     }

     .error-imgs .error-01 {
         width: 100px;
     }

     .maintanence-sec .coming-content h2 {
         font-size: 50px;
     }

     .main-menu-wrapper .main-nav>li+li {
         margin-inline-start: 25px;
     }

     .dash-widget.dash-credit .dash-icon {
         margin-inline-end: 8px;
     }

     .table-filter #tablefilter div.dataTables_filter .form-control {
         max-width: 220px;
     }

     .user-sidebar {
         padding: 20px;
     }
 }

 @media only screen and (max-width: 1299.98px) {
     .banner-img-right {
         max-width: 400px;
     }
 }

 @media only screen and (max-width: 1199.98px) {
     .main-menu-wrapper {
         margin: 0;
     }

     .main-nav>li.active>a,
     .main-nav>li>a,
     .main-nav>li .submenu li a {
         font-size: 12px;
     }

     .header-navbar-rht li>a.log-btn {
         font-size: 10px;
     }

     .main-nav>li.active>a,
     .main-nav .has-submenu.active .submenu li.active>a,
     .main-nav .has-submenu.active>a {
         color: #fff !important;
     }

     .main-nav>li .submenu>li.has-submenu>a::after {
         content: "\f078";
     }

     .main-nav .has-submenu.active>a {
         color: #1879cd;
     }

     .main-nav .has-submenu.active .submenu li.active>a {
         color: #1879cd;
     }

     .btn-primary {
         padding: 10px 15px;
     }

     .btn-secondary {
         padding: 10px 15px;
     }

     .top-header .list-inline-items a {
         font-size: 10px;
     }

     .header-navbar-rht li>a.header-login {
         padding: 10px 20px;
     }

     .header-navbar-rht li>a {
         font-size: 10px;
     }

     .banner-head h1 {
         font-size: 35px;
         max-width: 526px;
     }

     .banner-img-right {
         max-width: 330px;
         inset-inline-end: 20px;
     }

     .banner-small-bg-one {
         bottom: 43%;
     }

     .banner-small-bg-two {
         bottom: 37%;
         inset-inline-end: 260px;
     }

     .banner-form {
         padding: 15px;
     }

     .banner-form .input-block {
         min-width: 130px;
         padding: 0 5px 0 5px;
         margin: 0 5px 20px;
     }

     .banner-form .input-block .form-control {
         padding-inline-end: 20px;
     }

     .banner-form .input-block-btn .btn {
         padding: 10px 14px;
     }

     .banner-form .input-block-btn .btn i {
         font-size: 10px;
     }

     .seller-inner-img {
         height: 500px;
     }

     .seller-inner-img img {
         height: 100%;
     }

     .seller-info-content {
         margin-inline-start: -80px;
     }

     .owl-nav button.owl-next,
     .owl-nav button.owl-prev,
     .owl-carousel .owl-nav button.owl-next,
     .owl-carousel .owl-nav button.owl-prev {
         width: 40px;
         height: 40px;
     }

     .login-slider h2 {
         font-size: 24px;
     }

     .login-bg .shape-04,
     .login-bg .shape-05 {
         width: 50px;
     }

     .login-wrapper .login-userset {
         width: 400px;
     }

     .login-bg .shape-02 {
         width: 60px;
     }

     .login-bg .shape-03 {
         width: 50px;
     }

     .maintanence-sec .coming-content h2 {
         font-size: 40px;
     }

     .paypal-icons {
         margin-bottom: 0;
     }

     .main-menu-wrapper .main-nav>li+li {
         margin-inline-start: 15px;
     }

     .gigs-title h3,
     .gigs-card-footer h5 {
         font-size: 17px;
     }

     .menu-heading h5 {
         font-size: 17px;
     }

     .img-upload-head .profile-img img {
         width: 100px;
         height: 100px;
     }
 }

 .header .logo img.pe-3 {
     height: 30px;
 }

 @media only screen and (max-width: 991.98px) {
     body {
         font-size: 14px;
     }

     .main-nav>li .submenu-head li a {
         white-space: normal !important;
     }

     .main-nav>li .submenu-head li a {
         white-space: normal;
     }

     .megamenu-full-width {
         border-radius: 0;
     }

     .sidebar-overlay.opened {
         display: block;
     }

     .feature-offers {
         padding: 60px 0 40px;
     }

     .main-nav>li.active>a,
     .main-nav>li>a {
         font-size: 15px;
     }

     .banner-wrap-btn {
         justify-content: center;
     }

     .header-navbar-rht>li {
         padding-inline-end: 8px;
     }

     .main-nav {
         padding: 0;
         -ms-flex-direction: column;
         flex-direction: column;
         padding-inline-start: 0;
         margin-bottom: 0;
         list-style: none;
     }

     .main-nav ul {
         display: none;
         list-style: none;
         margin: 0;
         padding-inline-start: 0;
     }

     .main-nav>li {
         margin-inline-start: 0;
     }

     .main-nav li+li {
         margin-inline-start: 0;
     }

     .header-navbar-rht li>a {
         font-size: 13px;
     }

     .notification-header {
         margin-bottom: 0;
     }

     .product-more {
         padding: 40px 0 40px;
     }

     .product-more h3 {
         margin-bottom: 20px;
     }

     .main-nav>li>a {
         line-height: 1.5;
         padding: 15px 20px !important;
         font-size: 13px;
         font-weight: 500;
     }

     .main-nav>li>a>i {
         float: inline-end;
         margin-top: 5px;
     }

     .main-nav>li .submenu li a {
         border-top: 0;
         color: #5b5b5b;
         padding: 10px 15px 10px 35px;
         font-size: 12px;
         white-space: unset;
     }

     .main-nav>li .submenu ul li a {
         padding: 10px 15px 10px 45px;
     }

     .main-nav>li .submenu>li.has-submenu>a::after {
         content: "\f078";
     }

     .main-nav .has-submenu.active>a {
         color: var(--primary);
     }

     .main-nav .has-submenu.active .submenu li.active>a {
         color: var(--primary);
     }

     .main-nav>li>a:hover::after,
     .main-nav>li.active>a::after {
         top: 0;
     }

     .main-menu-wrapper {
         order: 3;
         width: 260px;
         position: fixed;
         top: 0;
         bottom: 0;
         inset-inline-start: 0;
         overflow-x: hidden;
         overflow-y: auto;
         z-index: 11111;
         transform: translateX(260px);
         transition: all 0.4s;
         background-color: #ffffffde;
         backdrop-filter: blur(13px);
         margin: 0;
     }

     [dir="ltr"] .main-menu-wrapper {
         transform: translateX(-260px);
     }

     .menu-opened .main-menu-wrapper {
         transform: translateX(0);
     }

     .menu-header {
         display: -webkit-box;
         display: -ms-flexbox;
         display: flex;
     }

     .navbar-header {
         -webkit-box-align: center;
         -ms-flex-align: center;
         align-items: center;
         display: -webkit-inline-box;
         display: -ms-inline-flexbox;
         display: inline-flex;
     }

     .menu-heading h5 {
         font-size: 14px;
     }

     .main-nav>li {
         border-bottom: 1px solid #fff;
         margin-inline-end: 0;
     }

     .main-nav li>ul.mega-submenu {
         padding: 0 20px;
     }

     .main-nav .mega-submenu ul {
         display: block !important;
     }

     #mobile_btn {
         line-height: 0;
         display: inline-block;
     }

     .mobile_btns {
         color: var(--primary);
         cursor: pointer;
         display: flex;
         font-size: 24px;
         height: 76px;
         inset-inline-start: 0;
         padding: 0 15px;
         position: absolute;
         text-align: center;
         top: 0;
         z-index: 10;
         justify-content: center;
         align-items: center;
     }

     .header .header-left {
         position: absolute;
         width: 100%;
         display: block;
         height: auto;
         top: 0;
         inset-inline-start: 0;
     }

     .header .header-left .sidebar-logo {
         padding: 26px 0;
     }

     .container {
         max-width: 100%;
     }

     .card-bottom {
         margin-bottom: 24px;
     }

     .feature-wrap h3 {
         font-size: 22px;
     }

     .feature-wrap p {
         font-size: 14px;
     }

     .menu-heading h5 {
         font-size: 15px;
     }

     .main-menu {
         display: block;
     }

     .main-nav>li>a,
     .main-nav>li.active>a {
         color: #0a1f2f;
         font-weight: 500;
     }

     .main-menu-wrapper .main-nav li+li {
         margin-inline-start: 0;
     }

     .top-header {
         display: none;
     }

     .section-header h2 {
         font-size: 28px;
     }

     .hero-section {
         padding: 60px 0 48px;
     }

     .banner-bg-imgs .banner-bg-four {
         top: 20px;
         max-width: 50px;
     }

     .banner-img {
         margin-top: 15px;
     }

     .banner-head h1 {
         font-size: 33px;
     }

     .service-section {
         padding: 50px 0;
     }

     .section-tab ul li .nav-link {
         padding: 10px 20px;
         margin-inline-end: 10px;
     }

     .explore-gigs-section,
     .listing-section,
     .client-slider-sec,
     .testimonial-section,
     .popular-section.expert-section {
         padding: 60px 0;
     }

     .popular-section,
     .provide-section,
     .price-section {
         padding: 60px 0 36px;
     }

     .faq-sec {
         margin-bottom: 60px;
     }

     .cta-section {
         margin: 60px 0;
     }

     .why-choose-sec,
     .about-us-section {
         padding: 60px 0 36px;
     }

     .popular-category-sec,
     .client-review-sec,
     .start-seller-sec {
         padding: 60px 0;
     }

     .cta-wrap {
         padding: 40px;
     }

     .cta-wrap h3 {
         font-size: 30px;
     }

     .faq-heading {
         margin-bottom: 30px;
     }

     .section-bg-two {
         max-width: 50px;
     }

     .trusted-customers .section-header h2 {
         font-size: 28px;
         max-width: 580px;
     }

     .trusted-customers {
         padding: 60px 15px;
     }

     .explore-services-sec {
         padding: 60px 0;
     }

     .footer-bottom-links ul {
         justify-content: center;
         margin-top: 20px;
     }

     .copy-right p {
         text-align: center;
     }

     .navbar-nav li a.nav-link.active::before {
         display: none;
     }

     .select2-container--default .select2-selection--single {
         outline: 0;
     }

     .search-filter {
         padding: 20px 20px 0;
     }

     .search-filter .form-group {
         min-width: 130px;
     }

     .gigs-card-footer h5 {
         font-size: 17px;
     }

     .gigs-share a {
         width: 28px;
         height: 28px;
     }

     .breadcrumb-img {
         display: none;
     }

     .search-filter-selected.breadcrumb-select-box .form-group {
         float: inline-start;
     }

     .breadcrumb-select-box {
         margin-top: 20px;
     }

     .dashboard-card.card-gig {
         margin-bottom: 24px;
     }

     .service-amt h2 {
         font-size: 22px;
     }

     .service-widget .btn {
         margin-bottom: 24px;
         padding: 10px 20px;
         font-size: 14px;
     }

     .listing-tab .nav li {
         margin-bottom: 10px;
     }

     .gigs-card-slider.owl-carousel .owl-nav,
     .testimonial-slider.owl-carousel .owl-nav {
         margin-top: 6px;
     }

     h3 {
         font-size: 21px;
     }

     .listing-tab .nav {
         margin-bottom: 20px;
     }

     .breadcrumb-links {
         text-align: start;
     }

     .breadcrumb-info .info-links li {
         margin-bottom: 10px;
     }

     .breadcrumb-links li {
         margin-top: 10px;
     }

     .breadcrumb-info .breadcrumb-title {
         font-size: 22px;
     }

     .faq-card .faq-title,
     .faq-wrapper .faq-card .faq-title {
         font-size: 15px;
     }

     .faq-heading p {
         font-size: 15px;
         margin-bottom: 20px;
     }

     .expert-header p {
         margin-bottom: 30px;
     }

     .filter-gigs h5 {
         margin-inline-end: 10px;
     }

     .filter-gigs .filter-select-boxes li {
         margin-inline-end: 10px;
     }

     .seller-info-content {
         margin: 0;
         max-height: 100%;
     }

     .seller-feature-list {
         flex-direction: column;
         align-items: self-start;
     }

     .sllers-list {
         margin-bottom: 24px;
     }

     .seller-inner-img {
         height: 100%;
     }

     .popular-img {
         display: none;
     }

     .owl-nav button.owl-next,
     .owl-nav button.owl-prev,
     .owl-carousel .owl-nav button.owl-next,
     .owl-carousel .owl-nav button.owl-prev {
         width: 35px;
         height: 35px;
     }

     .slider-card .owl-carousel .owl-nav button.owl-prev {
         inset-inline-start: -10px;
     }

     .slider-card .owl-carousel .owl-nav button.owl-next {
         inset-inline-end: -10px;
     }

     .sidebar-widget {
         margin-bottom: 24px;
     }

     .collapse-body ul li .custom_check {
         font-size: 14px;
     }

     .title-filter {
         float: inline-start;
     }

     .filters-section {
         display: block;
     }

     .authentication-wrapper {
         display: none;
     }

     .login-wrapper .login-content .login-logo {
         margin: 0 auto 20px;
     }

     .login-social-link li a {
         font-size: 15px;
     }

     .error-content h2 {
         font-size: 28px;
     }

     .error-img img {
         margin-bottom: 35px;
     }

     .maintanence-sec .coming-content h2 {
         font-size: 35px;
     }

     .coming-content h2 {
         font-size: 30px;
     }

     .days-count ul li h3 {
         font-size: 26px;
     }

     .days-count ul li {
         width: 150px;
     }

     .days-count {
         margin-bottom: 50px;
     }

     .listing-gigs .gigs-grid .star-rate {
         margin-inline-start: 5px;
     }

     .listing-gigs .star-rate {
         padding-inline-start: 5px;
     }

     .gigs-card-footer {
         flex-wrap: wrap;
     }

     .country-lists .gigs-card-footer h5 span {
         margin-inline-end: 5px;
     }

     .contact-widget {
         padding: 30px 0;
     }

     .team-section {
         padding: 40px 0;
     }

     .team-grid {
         padding: 20px;
         margin-bottom: 20px;
     }

     .team-details-img {
         margin-bottom: 24px;
     }

     .contact-top {
         padding: 40px 0;
     }

     .contact-map {
         margin-bottom: 20px;
     }

     .contact-map iframe {
         height: 450px;
     }

     .contact-bottom {
         padding: 40px 0 20px;
     }

     .contact-grid {
         padding: 20px;
         margin-bottom: 20px;
     }

     .recent-works {
         padding-top: 16px;
     }

     .contact-img {
         margin: 0 auto 20px;
     }

     .faq-wrapper {
         padding: 15px;
     }



     .price-card .price-btn a {
         padding: 10px 14px;
     }

     .faq-section {
         padding: 60px 0;
     }

     .profile-work-slide.gigs-card-slider.owl-carousel .owl-nav {
         top: -60px;
     }

     .chat-wrapper .content .sidebar-group {
         width: 100%;
     }

     .left-sidebar.hide-left-sidebar {
         margin-inline-start: -991px;
     }

     .left-sidebar.hide-left-sidebar {
         margin-inline-start: -991px;
     }

     .chat.show-chatbar {
         display: block;
         margin-inline-start: 0;
     }

     .right-sidebar.hide-right-sidebar {
         margin-inline-end: -991px;
     }

     .chat .chat-header {
         padding: 15px 15px 10px;
     }

     .chat-page-wrapper .content {
         height: 100%;
         display: block;
     }

     .chat-page .chat .slimscroll {
         height: 100%;
     }

     .chat-messages {
         display: none;
     }

     .chat-messages.show-chatbar {
         display: block;
     }

     .left-sidebar .slimScrollDiv {
         height: 100% !important;
     }

     .chat_sidebar.hide-left-sidebar {
         display: none !important;
     }
 }

 @media only screen and (max-width: 767.98px) {
     body {
         font-size: 13px;
     }

     .form-focus .focus-label {
         font-size: 10px;
     }

     .logo img {
         max-height: 45px;
     }

     .faq-section {
         padding: 40px 0;
     }

     h1,
     .h1 {
         font-size: 1.75rem;
     }

     h2,
     .h2 {
         font-size: 1.5rem;
     }

     h3,
     .h3 {
         font-size: 19px;
     }

     h4,
     .h4 {
         font-size: 0.75rem;
     }

     h5,
     .h5 {
         font-size: 14px;
     }

     h6,
     .h6 {
         font-size: 14px;
     }

     .main-nav>li>a:hover::after,
     .main-nav>li.active>a::after {
         top: 0;
         bottom: inherit;
     }

     #mobile_btn {
         margin-inline-end: 20px;
     }

     .blog-grid,
     .provide-box {
         height: auto;
     }

     .section-header h2 {
         font-size: 24px;
     }

     .trusted-customers .section-header h2 {
         font-size: 26px;
     }

     .banner-head h1::after,
     .section-header h2::after {
         display: none;
     }

     .hero-section {
         padding: 40px 0 28px;
         border-radius: 0;
     }

     .header-navbar-rht li:first-child {
         margin-inline-end: 0;
     }

     .header-navbar-rht li:first-child:after {
         display: none;
     }

     .banner-head h1 {
         font-size: 30px;
     }

     .breadcrumb-title {
         font-size: 19px;
     }

     .breadcrumb-bar-info .breadcrumb-title {
         margin-bottom: 0;
     }

     .breadcrumb-title a {
         font-size: 15px;
     }

     .page-content {
         padding: 40px 0;
     }

     .btn-primary {
         font-size: 14px;
     }

     .btn-secondary {
         font-size: 14px;
     }

     .explore-gigs-section,
     .listing-section,
     .testimonial-section,
     .popular-section.expert-section {
         padding: 40px 0;
     }

     .core-section .custom-row .custom-col {
         width: 33.3%;
     }

     .banner-bg-imgs {
         display: none;
     }

     .search-filter {
         padding: 15px 15px 0;
         margin: 0 0 20px;
     }

     .search-filter form {
         display: block;
     }

     .search-filter-list {
         width: 100%;
         margin: 0;
         display: block;
     }

     .search-filter .form-group {
         min-width: 130px;
         border: 0;
         padding: 0;
         margin: 0 0 15px;
     }

     .search-filter .search-filter-btn {
         float: inline-start;
     }

     .search-filter .search-filter-btn .btn {
         font-size: 13px;
         padding: 10px 10px;
         min-width: 100px;
         min-height: 40px;
     }

     .why-choose-sec,
     .about-us-section {
         padding: 40px 0 16px;
     }

     .popular-category-sec,
     .client-review-sec,
     .start-seller-sec {
         padding: 40px 0;
     }

     .search-gigs .gigs-grid {
         margin-bottom: 20px;
     }

     .search-gigs .gigs-grid .gigs-content {
         padding: 20px;
     }

     .search-load-btn {
         margin-top: 10px;
     }

     .search-load-btn .btn {
         padding: 10px 15px;
         font-size: 13px;
         min-height: 40px;
     }

     .sort-search-gigs {
         flex-direction: column;
         align-items: start;
     }

     .sort-search-gigs h5 {
         margin-bottom: 20px;
     }

     .filter-gigs {
         flex-direction: column;
         align-items: start;
     }

     .buy-items li:not(:last-child) {
         margin-inline-end: 8px;
     }

     .delivery-info {
         margin-bottom: 15px;
     }

     .view {
         text-align: start;
         margin-top: 15px;
     }

     .about-us-head h2,
     .about-us-header h2,
     .seller-info-content h3 {
         font-size: 22px;
     }

     .breadcrumb-info .breadcrumb-title {
         font-size: 21px;
     }

     .service-wrap h3 {
         margin-bottom: 15px;
     }

     .page-content.content {
         padding: 40px 0 16px;
     }

     .category-wrap .category-item {
         margin-bottom: 30px;
     }

     .page-content.category-wrap {
         padding: 40px 0 10px;
     }

     .banner-form {
         margin-bottom: 20px;
     }

     .banner-form form {
         padding: 15px 15px 1px;
         display: block;
     }

     .banner-search-list {
         width: 100%;
         margin: 0;
         display: block;
     }

     .banner-content .input-block {
         min-width: inherit;
         width: 100%;
         padding: 0;
         margin: 0 0 15px;
         border: 0;
     }

     .banner-form .input-block-btn {
         float: inherit;
         margin: 0 0 10px;
     }

     .banner-form .input-block-btn .btn {
         width: 100%;
     }

     .gigs-grid {
         margin-bottom: 15px;
     }

     .gigs-content {
         padding: 15px;
     }

     .gigs-title h3 {
         font-size: 17px;
     }

     .gigs-card-slider.owl-carousel .owl-nav {
         margin-top: 15px;
     }

     .more-btn a.btn {
         padding: 10px 25px;
     }



     .popular-section {
         padding: 40px 0 25px;
     }

     .category-grid {
         padding: 15px;
         gap: 1px;
         margin-bottom: 15px;
         flex-wrap: wrap;
         flex-direction: column;
     }

     .category-overlay-content {
         bottom: 15px;
         inset-inline-start: 15px;
     }

     .review-img img {
         width: 55px;
         height: 55px;
     }

     .modal-title {
         font-size: 17px;
     }

     .order-item {
         flex-direction: column;
         text-align: center;
     }

     .order-img {
         margin: 0 0 10px 0;
     }

     .collapse-body ul li .custom_check {
         font-size: 13px;
     }

     .title-header p {
         font-size: 15px;
     }

     .slide-title-wrap {
         margin-top: 10px;
     }

     .marketing-section h2 {
         font-size: 22px;
     }

     .marketing-section {
         padding: 40px;
     }

     .market-bg {
         width: 60px;
     }

     .login-social-link {
         display: flex;
         align-items: center;
         justify-content: center;
         gap: 8px;
     }

     .login-social-link li+li {
         margin: 0 !important;
     }

     .login-social-link li+li {
         margin: 15px 0 0;
     }

     .login-social-link li {
         width: 100%;
     }

     .login-wrapper .login-userset {
         max-width: 350px;
         width: 100%;
         padding-bottom: 60px;
     }

     .social-icon li a {
         width: 30px;
         height: 30px;
     }

     .error-content h2 {
         font-size: 26px;
     }

     .error-imgs .error-01,
     .error-imgs .error-03 {
         width: 60px;
     }

     .maintanence-sec .coming-content h2 {
         font-size: 28px;
     }

     .coming-content h2 {
         font-size: 24px;
     }

     .days-count ul li h3 {
         font-size: 22px;
     }

     .days-count ul li {
         width: 100%;
         border: 0;
     }

     .post-thumb img {
         width: 65px;
         height: 60px;
     }

     .relate-post-section,
     .price-section {
         padding: 40px 0 16px;
     }

     .provide-section .section-header h2,
     .provide-box .provide-icon,
     .provide-box p {
         margin-bottom: 24px;
     }

     .blog-contents p,
     .blog-detail-img img,
     .top-listing-section .category-item,
     .testimonial-item,
     .faq-heading .section-header {
         margin-bottom: 15px;
     }

     .blog-author {
         padding: 15px;
     }

     .testimonial-slider.owl-carousel .owl-nav {
         margin-top: 15px;
     }

     .expert-header .section-header,
     .portfolio-scope {
         margin-bottom: 20px;
     }

     .faq-sec {
         margin-bottom: 40px;
     }

     .portfolio-info {
         padding: 15px 15px 4px;
         margin-bottom: 20px;
     }

     .cta-section {
         margin: 40px 0;
     }

     .cta-wrap {
         padding: 20px;
     }

     .cta-wrap h3 {
         font-size: 24px;
         margin-bottom: 24px;
     }

     .listing-gigs .gigs-grid {
         padding: 15px;
     }

     .section-tab {
         margin-bottom: 30px;
     }

     .client-slider-sec,
     .explore-services-sec {
         padding: 40px 0;
     }

     .top-listing-section {
         padding: 40px 0 25px;
     }

     .contact-widget {
         padding: 20px 0;
         margin-top: 0;
     }

     .team-title h4 {
         font-size: 19px;
         margin-bottom: 2px;
     }

     .team-details-img {
         margin-bottom: 20px;
     }

     .team-details-heading {
         margin-bottom: 20px;
     }

     .team-details-heading h5 {
         margin-bottom: 20px;
     }

     .team-details {
         margin-bottom: 20px;
     }

     .team-skills {
         margin-bottom: 0;
     }

     .team-skills-info {
         margin-bottom: 20px;
     }

     .team-persnoal-info {
         padding: 20px;
         margin-bottom: 20px;
     }

     .team-form,
     .price-card {
         padding: 20px;
     }

     .team-form-heading {
         margin-bottom: 20px;
     }

     .team-form .form-group {
         margin-bottom: 20px;
     }

     .contact-grid.con-info .contact-icon {
         margin-inline-end: 10px;
     }

     .contact-grid.con-info .contact-icon span {
         width: 50px;
         height: 50px;
     }

     .pagination ul li a.previous {
         margin-inline-end: 19px;
     }

     .pagination ul li a,
     .pagination li a {
         width: 30px;
         height: 30px;
         margin-inline-end: 10px;
         font-size: 10px;
     }

     .user-sidebar {
         padding: 20px;
     }

     .user-review .review-lists .review-wrap {
         display: block;
     }

     .user-review .table-action {
         margin: 15px 0 0 0;
     }

     .wallet-wrap {
         flex-direction: column;
         -webkit-box-align: start;
         -ms-flex-align: start;
         align-items: start;
     }

     .service-slider button {
         width: 30px;
         height: 30px;
         font-size: 0;
         background: #fff;
         border-radius: 50%;
         border: none;
         z-index: 9999;
     }
 }

 @media only screen and (max-width: 575.98px) {
     body {
         font-size: 13px;
     }

     .template-features li {
         margin-bottom: 15px;
     }

     h1,
     .h1 {
         font-size: 1.5rem;
     }

     h2,
     .h2 {
         font-size: 1.25rem;
     }

     h3,
     .h3 {
         font-size: 1rem;
     }

     h4,
     .h4 {
         font-size: 0.75rem;
     }

     h5,
     .h5 {
         font-size: 14px;
     }

     h6,
     .h6 {
         font-size: 14px;
     }

     .card {
         margin-bottom: 0.9375rem;
     }

     .card-header {
         padding: 0.75rem 1.25rem;
     }

     .card-footer {
         padding: 0.75rem 1.25rem;
     }

     #mobile_btn {
         margin-inline-end: 0;
     }

     .navbar-header,
     .table-filter .search-form {
         width: 100%;
     }

     .header-navbar-rht {
         /*display: none;*/
         margin-inline-start: auto;
     }

     .header-nav {
         height: auto;
     }

     .header-nav {
         gap: 6px;
     }

     .header-navbar-rht li.logged-item .dropdown-menu {
         top: 100%;
         inset-inline-end: 20px;
     }

     .navbar-brand.logo {
         margin: auto;
     }

     .popular-search,
     .table-filter {
         flex-direction: column;
     }

     .table-filter li {
         margin: 0;
         width: 100%;
     }

     .banner-bg-imgs .banner-bg-four {
         display: none;
     }

     .table-filter .filter-item {
         width: 100%;
         flex-direction: column;
     }

     .table-filter #tablefilter div.dataTables_filter .form-control {
         max-width: 100%;
     }

     .section-tab,
     .form-sort .form-control,
     .table-filter #tablefilter,
     #tablefilter div.dataTables_filter label {
         width: 100%;
     }

     .section-tab .nav-pills,
     .listing-tab .nav {
         flex-wrap: nowrap;
         column-gap: 10px;
         overflow-x: auto;

         &::-webkit-scrollbar {
             display: none;
         }
     }

     .section-tab ul li .nav-link,
     .listing-tab .nav li .nav-link {
         width: 100%;
         margin: 0 0 10px 0;
         white-space: nowrap;
         text-align: center;
     }

     .trusted-customers .section-header p {
         text-align: center;
     }

     .footer-bottom-links ul {
         flex-direction: column;
     }

     .footer-bottom-links ul li {
         margin-inline-end: 0;
         margin-bottom: 10px;
     }

     .footer-bottom-links ul li:last-child {
         margin-bottom: 0;
     }

     .main-nav li.responsive-link {
         display: block;
     }

     .pagination ul li {
         margin-bottom: 0;
     }

     .user-details,
     .buy-items {
         flex-direction: column;
     }

     .user-img {
         margin: 0 0 15px 0;
     }

     .user-info {
         text-align: center;
     }

     .service-amt h2 {
         font-size: 21px;
     }

     .buy-items li:not(:last-child) {
         margin: 0 0 10px 0;
     }

     .buy-items {
         display: block;
     }



     .blog-content .user-info,
     .blog-content .badge-text .badge {
         margin-bottom: 15px;
     }

     .slider-card .owl-carousel .owl-nav,
     .error-imgs {
         display: none;
     }

     .review-widget .search-filter-selected {
         float: inline-start;
     }

     .title-filter,
     .filters-wrap {
         display: flex;
         align-items: center;
         justify-content: space-between;
         width: 100%;
     }

     .filters-wrap li {
         display: block;
         margin-inline-end: 0;
     }

     .title-section .search-filter-selected {
         margin-inline-start: 0;
     }

     .filters-wrap .collapse-body,
     .filters-wrap .filter-header a {
         width: 100%;
     }

     .blog-author {
         flex-direction: column;
         text-align: center;
     }

     .blog-author .author-img {
         margin: 0 0 15px 0;
     }

     .star-rate span,
     .gigs-content .gigs-info .badge {
         font-size: 10px;
     }

     .team-section-list {
         padding: 40px 0 25px;
     }

     .upload-list {
         flex-direction: column;
     }

     .upload-list li {
         display: block;
         margin-inline-end: 0;
     }

     .gigs-step ul li {
         width: 100%;
         margin-inline-end: 0;
     }

     .img-upload-head {
         display: block;
     }

     .img-formate p {
         margin-top: 10px;
     }

     .upload-remove-btns {
         display: block;
     }

     .upload-remove-btns .drag-upload .img-upload p {
         margin-top: 0;
     }

     .img-remove-btn a {
         width: 100%;
         margin-inline-start: 0;
         margin-top: 10px;
         text-align: center;
     }

     .my-profile-details {
         flex-direction: column;
     }

     .my-profile-details .user-edit {
         margin-top: 15px;
     }

     .main-chat-blk .chat .chat-header {
         flex-direction: column;
         align-items: start;
     }

     .main-chat-blk .chat .chat-header .user-details {
         align-items: start;
     }

     .chat-messages .user-details {
         flex-direction: row;
     }

     .chat-messages .chat-options {
         margin-top: 20px;
     }

     .chat .chat-footer form {
         padding: 15px;
     }

     .chat .chat-footer form .smile-foot .action-circle {
         width: 20px;
         height: 20px;
     }

     .location-sharing {
         min-width: 180px;
     }
 }

 @media screen and (width < 567px) {
     .logo img {
         max-height: 45px;
     }

     .navbar-header,
     .table-filter .search-form {
         width: fit-content;
         gap: 8px;
     }

     .header-nav {
         flex-wrap: nowrap;
     }

     .header .logo img.pe-3 {
         display: none;
     }

     .main-menu-wrapper .main-nav>li+li {
         margin-inline-start: 0 !important;
     }
 }

 .content {
     padding: 60px 0;
 }

 .border-end {
     border-inline-end: 1px solid #ddd !important;
 }

 .course-watch-section .progress-overview-section {
     padding: 20px;
 }

 .course-watch-section .back-to-course {
     color: #ff4667;
     font-weight: 500;
     font-size: 13px;
 }

 .course-watch-section .back-to-course {
     color: #ff4667;
     font-weight: 500;
 }

 .course-watch-section h3 {
     font-size: 26px;
     font-weight: 700;
     color: #000000;
     margin-bottom: 24px;
 }

 .course-watch-section .progress-overview-section .progress {
     background-color: #ddd;
     height: 0.75rem;
     border-radius: 0.25rem;
 }

 .progress.progress-xs {
     height: 8px;
 }

 .progress,
 .progress-stacked {
     background: #f7f7f7;
 }

 .course-watch-section .progress-overview-section .progress {
     background-color: #ddd;
     height: 0.75rem;
     border-radius: 0.25rem;
 }

 .progress.progress-xs {
     height: 8px;
 }

 .progress,
 .progress-stacked {
     background: #f7f7f7;
 }

 .course-watch-section .accordions-items-seperate .accordion-item {
     border-radius: 10px;
     overflow: hidden;
 }

 .course-watch-section .accordion-item {
     color: #ddd;
     background-color: #fff;
     border: 1px solid #f7f7f7;
 }

 .course-watch-section .accordion-button {
     background-color: #f5f5f5;
     color: #ddd;
     padding: 0.75rem 1rem;
     font-size: 0.65rem;
     font-weight: 500;
 }

 .course-watch-section .accordion-button:after {
     content: "\f0d7";
     font-family: "Fontawesome";
     font-size: 10px;
     line-height: 1;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 3.125rem;
     color: #ddd;
 }

 :root {
     --white: #fff;
     --dark: #000;
     --black: #000;
     --light: #f8f8f8;
     --gray-100: #e7e7e7;
     --gray-200: #d1d1d1;
     --gray-300: #b0b0b0;
     --gray-400: #888888;
     --gray-500: #6d6d6d;
     --gray-600: #5d5d5d;
     --gray-700: #4f4f4f;
     --gray-800: #3d3d3d;
     --gray-900: #191919;
     --light-100: #fefefe;
     --light-200: #fcfcfd;
     --light-300: #fbfbfd;
     --light-400: #f9fafc;
     --light-500: #f8fafb;
     --light-600: #f7f9fb;
     --light-700: #f6f8fa;
     --light-800: #f5f7fa;
     --light-900: #f4f6f9;
 }

 /* Course Watch*/
 .course-watch-section .progress-overview-section {
     padding: 20px;
     border: 1px solid #cdcdcd;
     border-radius: 10px;
 }

 @media (max-width: 991.98px) {
     .course-watch-section .progress-overview-section {
         padding: 20px 0 20px;
     }
 }

 .course-watch-section .progress-overview-section .progress {
     background-color: var(--light-900);
     height: 0.75rem;
     border-radius: 0.25rem;
 }

 .course-watch-section .progress-overview-section .progress.progress-xs,
 .course-watch-section .progress-overview-section .progress-stacked.progress-xs {
     height: 0.3125rem;
 }

 .course-watch-section .progress-overview-section .progress.progress-sm,
 .course-watch-section .progress-overview-section .progress-stacked.progress-sm {
     height: 0.5rem;
 }

 .course-watch-section .progress-overview-section .progress.progress-lg,
 .course-watch-section .progress-overview-section .progress-stacked.progress-lg {
     height: 1rem;
 }

 .course-watch-section .progress-overview-section .progress.progress-xl,
 .course-watch-section .progress-overview-section .progress-stacked.progress-xl {
     height: 1.25rem;
 }

 .course-watch-section h3 {
     font-size: 26px;
     font-weight: 700;
     color: var(--gray-900);
     margin-bottom: 24px;
 }

 .course-watch-section .accordion-button {
     background-color: var(--light);
     color: var(--gray-500);
     padding: 0.75rem 1rem;
     font-size: 0.65rem;
     font-weight: 500;
 }

 .course-watch-section .accordion-button:not(.collapsed) {
     color: var(--gray-500);
     background-color: var(--light);
     box-shadow: none;
 }

 .course-watch-section .accordion-button:focus {
     border-color: rgba(57, 44, 125, 0.3);
     box-shadow: none;
 }

 .course-watch-section .accordion-button:after,
 .course-watch-section .accordion-button:not(.collapsed)::after {
     background-image: none;
 }

 .course-watch-section .accordion-button:after {
     content: "\f0d7";
     font-family: "Fontawesome";
     font-size: 10px;
     line-height: 1;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 3.125rem;
     color: var(--gray-500);
 }

 .course-watch-section .accordion-body {
     padding: 1rem;
     font-size: 0.6125rem;
     color: #677788;
     border-top: 1px solid var(--gray-100);
 }

 .course-watch-section .accordion-item {
     color: var(--gray-500);
     background-color: var(--white);
     border: 1px solid var(--gray-100);
 }

 .course-watch-section .accordions-items-seperate .accordion-item:not(:first-of-type) {
     margin-block-start: 1rem;
 }

 .course-watch-section .accordions-items-seperate .accordion-item {
     border-radius: 10px;
     overflow: hidden;
 }

 .course-watch-section .accordian-content {
     font-weight: 500 !important;
     font-size: 13px !important;
     color: var(--gray-900) !important;
 }

 .course-watch-section .course-watch-content {
     padding: 20px 0 0 20px;
 }

 @media (max-width: 991.98px) {
     .course-watch-section .course-watch-content {
         padding: 0;
     }
 }

 .course-watch-section .course-watch-content .nav-style-1 .nav-item {
     margin-inline-end: 0.5rem;
     flex-grow: inherit;
 }

 .course-watch-section .course-watch-content .nav-style-1 .nav-item:last-child {
     margin-inline-end: 0;
 }

 @media (max-width: 575.98px) {
     .course-watch-section .course-watch-content .nav-style-1 .nav-item {
         margin-inline-end: 0;
     }
 }

 .course-watch-section .course-watch-content .nav-style-1 .nav-item .nav-link {
     background: var(--light);
     color: var(--gray-900);
     border-radius: 10px;
     font-size: 15px;
 }

 .course .btn {
     border-radius: 1.5rem;
     padding: 0.4rem 0.85rem;
     font-size: 13px;
     transition: all 0.5s;
     font-weight: 500;
 }

 @media (max-width: 767.98px) {
     .course-watch-section .course-watch-content .nav-style-1 .nav-item .nav-link {
         margin-bottom: 16px;
     }
 }

 .course-watch-section .course-watch-content .nav-style-1 .nav-item .nav-link.active,
 .course-watch-section .course-watch-content .nav-style-1 .nav-item .nav-link:hover {
     background: #ff4667;
     border-color: #ff4667;
     color: var(--white);
 }

 .course-watch-section .course-watch-content .video-btn {
     margin-bottom: 30px;
 }

 .course-watch-section .course-watch-content .video-btn img {
     border-radius: 10px;
 }

 .course-watch-section .course-watch-content .course-video {
     position: relative;
     margin-bottom: 47px;
     width: fit-content;
 }

 .course-watch-section .course-watch-content .course-video .icon-play {
     position: absolute;
     top: 230px;
     inset-inline-start: 50%;
 }

 .course-watch-section .course-watch-content .tab-pane p {
     line-height: 1.6;
 }

 .course-watch-section .course-watch-content .readmore-btn {
     color: #ff4667;
     text-decoration: underline;
     font-size: 15px;
 }

 .course-watch-section .course-watch-content .readmore-btn:hover {
     color: #392c7d;
 }

 .course-watch-section .course-watch-content .close-btn {
     position: absolute;
     top: 10px;
     inset-inline-end: 10px;
     font-size: 22px;
     color: white;
     cursor: pointer;
 }

 .course-watch-section .course-watch-content iframe {
     width: 100%;
     height: 400px;
     border: none;
 }

 .course-watch-section .course-watch-content .faq-accordion .accordion-button {
     background-color: var(--white);
     color: var(--gray-900);
     padding: 20px;
     font-size: 17px;
     font-weight: 600;
 }

 .course-watch-section .course-watch-content .faq-accordion .accordion-button:not(.collapsed) {
     color: var(--gray-900);
     background-color: var(--white);
     box-shadow: none;
 }

 .course-watch-section .course-watch-content .faq-accordion .accordion-button:focus {
     border-color: rgba(57, 44, 125, 0.3);
     box-shadow: none;
 }

 .course-watch-section .course-watch-content .faq-accordion .accordion-button:after,
 .course-watch-section .course-watch-content .faq-accordion .accordion-button:not(.collapsed)::after {
     background-image: none;
 }

 .course-watch-section .course-watch-content .faq-accordion .accordion-button:after {
     content: "+";
     font-family: "Fontawesome";
     font-size: 10px;
     line-height: 1;
     background-color: var(--white);
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 10px;
     color: var(--gray-900);
 }

 .course-watch-section .course-watch-content .faq-accordion .accordion-button:not(.collapsed)::after {
     transform: rotate(45deg);
 }

 .course-watch-section .course-watch-content .faq-accordion .accordion-body {
     font-size: 14px;
 }

 .course-watch-section .course-watch-content .faq-accordion .accordion-item {
     color: var(--gray-900);
     background-color: var(--white);
     border: 1px solid var(--gray-100);
 }

 .course-watch-section .course-watch-content .faq-accordion .accordions-items-seperate .accordion-item:not(:first-of-type) {
     margin-block-start: 1rem;
 }

 .course-watch-section .course-watch-content .faq-accordion .accordions-items-seperate .accordion-item {
     border-block-start: 1px solid var(--gray-100);
     border-radius: 10px;
     overflow: hidden;
 }

 .course-watch-section .back-to-course {
     color: #ff4667;
     font-weight: 500;
 }

 .course-watch-section .back-to-course:hover {
     color: #392c7d;
 }

 .course-watch-section .back-to-course {
     color: #ff4667;
     font-weight: 500;
     font-size: 13px;
 }

 .course-watch-section .back-to-course:hover {
     color: #392c7d;
 }

 .course-watch-section .course-accordion-head-1 {
     font-size: 15px;
     font-weight: 500;
     color: var(--gray-900);
 }

 .course-watch-section .play-icon {
     width: 50px;
     height: 50px;
     background-color: rgba(1, 1, 1, 0.4);
     border-radius: 50px;
     position: absolute;
     top: 50%;
     inset-inline-start: 50%;
     transform: translate(-50%, -50%);
     color: var(--white);
     display: flex;
     justify-content: center;
     align-items: center;
 }

 [dir="rtl"] .course-watch-section .play-icon {
     transform: translate(50%, -50%);
 }

 .course-watch-section .play-icon i {
     font-size: 15px;
 }

 @media (max-width: 575.98px) {
     .course-watch-section .play-icon {
         width: 40px;
         height: 40px;
     }

     .course-watch-section .play-icon i {
         font-size: 13px;
     }
 }

 /* /Course Watch*/
 .cart-cover {
     margin: 0 60px;
 }

 #videoModal {
     display: none;
     position: fixed;
     z-index: 9999;
     inset-inline-start: 0;
     top: 0;
     width: 100%;
     height: 100%;
     background-color: rgba(0, 0, 0, 0.7);
     justify-content: center;
     align-items: center;
 }

 .modal-content1 {
     position: relative;
     width: 80%;
     max-width: 720px;
     background: #000;
     padding: 0;
     border-radius: 8px;
 }

 .close-btn {
     position: absolute;
     top: 10px;
     inset-inline-end: 10px;
     font-size: 22px;
     color: white;
     cursor: pointer;
 }

 iframe {
     width: 100%;
     height: 400px;
     border: none;
 }

 .course-sidebar-sec {
     margin-top: -252px;
 }

 @media (max-width: 991.98px) {
     .course-sidebar-sec {
         margin-top: 0;
     }
 }

 .course-sidebar-sec h5 {
     margin-bottom: 20px;
 }

 .course-sidebar-sec .course-sidebar-sec-card {
     padding: 20px;
     border: 1px solid #e7e7e7;
     border-radius: 10px;
     margin-bottom: 24px;
     background: var(--white);
 }

 .course-sidebar-sec .course-sidebar-sec-card p {
     margin-bottom: 20px;
     color: var(--gray-500);
 }

 .course-sidebar-sec .play-icon {
     width: 60px;
     height: 60px;
     background-color: rgba(1, 1, 1, 0.4);
     border-radius: 50px;
     position: absolute;
     top: 50%;
     inset-inline-start: 50%;
     transform: translate(-50%, -50%);
     color: var(--white);
     display: flex;
     justify-content: center;
     align-items: center;
 }

 [dir="rtl"] .course-sidebar-sec .play-icon {
     transform: translate(50%, -50%);
 }

 @media (max-width: 1199.98px) {
     .course-sidebar-sec .wishlist-btns {
         flex-wrap: wrap;
     }
 }

 @media (max-width: 991.98px) {
     .course-sidebar-sec .wishlist-btns {
         flex-wrap: nowrap;
     }
 }

 @media (max-width: 575.98px) {
     .course-sidebar-sec .wishlist-btns {
         flex-wrap: wrap;
     }
 }

 .course-sidebar-sec .btn-wish {
     color: var(--gray-900);
     border: 1px solid var(--gray-100);
     width: 100%;
     text-align: center;
     align-items: center;
     justify-content: center;
     padding: 10px;
 }

 .course-sidebar-sec .btn-wish:hover {
     background-color: #ff4667;
     border-color: #ff4667;
     color: var(--white);
 }

 .course-sidebar-sec .btn-enroll {
     height: 50px;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .course-sidebar-sec .btn-enroll:hover {
     background-color: #ff4667;
     border-color: #ff4667;
 }

 .course-sidebar-sec .cou-features-card {
     border: 1px solid var(--gray-100);
     border-radius: 10px;
 }

 .course-sidebar-sec .cou-features {
     padding: 20px;
 }

 .course-sidebar-sec .cou-features h5 {
     margin-bottom: 20px;
 }

 .course-sidebar-sec .cou-features ul li {
     margin-bottom: 1rem;
 }

 .course-sidebar-sec .cou-features ul li:last-child {
     margin-bottom: 0;
 }

 .course-details-two {
     position: relative;
     padding: 60px 0 45px;
 }

 @media (max-width: 575.98px) {
     .course-details-two {
         padding: 45px 0 30px;
     }
 }

 .course-details-two .play-icon {
     width: 60px;
     height: 60px;
     background-color: rgba(1, 1, 1, 0.4);
     border-radius: 50px;
     position: absolute;
     top: 50%;
     inset-inline-start: 50%;
     transform: translate(-50%, -50%);
     color: var(--white);
     display: flex;
     justify-content: center;
     align-items: center;
 }

 [dir="rtl"] .course-details-two .play-icon {
     transform: translate(50%, -50%);
 }

 @media (max-width: 575.98px) {
     .course-details-two .play-icon {
         width: 70px;
         height: 70px;
     }
 }

 .course-details-two .play-again-btn {
     background-color: #392c7d;
     color: var(--white);
 }

 .course-details-two .play-again-btn:hover {
     background-color: #ff4667;
 }

 .course-details-two .note-btn {
     background-color: #ff4667;
     color: var(--white);
 }

 .course-details-two .note-btn:hover {
     background-color: #392c7d;
 }

 /* Modern Pastel Color Palette */

 .survey-header {
     text-align: center;
     margin-bottom: 2rem;
     padding-bottom: 1.5rem;
     border-bottom: 1px solid var(--border);
 }

 .survey-header h1 {
     color: var(--primary-dark);
     margin-bottom: 0.5rem;
     font-weight: 600;
 }

 .survey-header p {
     color: #6c757d;
 }

 /* Progress Bar */
 .progress-container {
     width: 100%;
     height: 8px;
     background-color: #e9ecef;
     border-radius: 4px;
     margin-bottom: 0.5rem;
     overflow: hidden;
 }

 .progress-bar {
     height: 100%;
     background-color: var(--primary);
     border-radius: 4px;
     width: 25%;
     /* Will be updated by JS */
     transition: width 0.3s ease;
 }

 .step-counter {
     text-align: right;
     font-size: 0.7rem;
     color: #6c757d;
     margin-bottom: 1.5rem;
 }

 /* Form Steps */

 .step.active {
     display: block;
     animation: fadeIn 0.5s;
 }

 @keyframes fadeIn {
     from {
         opacity: 0;
         transform: translateY(10px);
     }

     to {
         opacity: 1;
         transform: translateY(0);
     }
 }

 .step h2 {
     color: var(--primary-dark);
     margin-bottom: 1.5rem;
     font-weight: 500;
     font-size: 1.25rem;
 }

 /* Form Groups */
 .form-group {
     margin-bottom: 1.5rem;
 }

 label {
     display: block;
     margin-bottom: 0.5rem;
     font-weight: 500;
 }

 input[type="text"],
 input[type="number"],
 input[type="email"],
 select,
 textarea {
     width: 100%;
     padding: 0.75rem 1rem;
     border-radius: 8px;
     font-size: 0.85rem;
     transition: border-color 0.3s;
 }

 input[type="text"]:focus,
 input[type="number"]:focus,
 input[type="email"]:focus,
 select:focus,
 textarea:focus {
     outline: none;
     border-color: var(--primary);
     box-shadow: var(--box-shadow);
 }

 select {
     appearance: none;
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23343a40' d='M6 8.825L1.175 4 2.238 2.938 6 6.7 9.763 2.938 10.825 4z'/%3E%3C/svg%3E");
     background-repeat: no-repeat;
     background-position: right 1rem center;
     background-size: 12px;
     padding-inline-end: 2.5rem;
 }

 textarea {
     resize: vertical;
     min-height: 100px;
 }

 /* Rating Scale */
 .rating-container {
     display: flex;
     justify-content: space-between;
     margin: 0.5rem 0;
 }

 .rating {
     width: 40px;
     height: 40px;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 50%;
     background-color: #ededed;
     border: 1px solid #ddd;
     cursor: pointer;
     font-weight: 500;
     transition: all 0.2s ease;
 }

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

 .rating.selected {
     background-color: var(--primary);
     color: white;
     border-color: var(--primary);
 }

 .rating-labels {
     display: flex;
     justify-content: space-between;
     font-size: 0.65rem;
     color: #6c757d;
     margin-top: 0.25rem;
 }

 /* Slider Rating */
 .rating-slider {
     margin: 1rem 0;
 }

 input[type="range"] {
     width: 100%;
     height: 8px;
     border-radius: 4px;
     background: linear-gradient(to right, var(--primary) 50%, #e9ecef 50%);
     outline: none;
     -webkit-appearance: none;
     appearance: none;
 }

 input[type="range"]::-webkit-slider-thumb {
     -webkit-appearance: none;
     width: 18px;
     height: 18px;
     border-radius: 50%;
     background: var(--primary);
     cursor: pointer;
     border: 2px solid white;
     box-shadow: var(--box-shadow);
 }

 .slider-labels {
     display: flex;
     justify-content: space-between;
     margin-top: 0.5rem;
     font-size: 0.65rem;
     color: #6c757d;
 }

 /* Checkbox */
 .checkbox-group {
     margin-top: 2rem;
 }

 .checkbox-container {
     display: flex;
     align-items: center;
     cursor: pointer;
     font-weight: normal;
     position: relative;
     padding-inline-start: 30px;
 }

 .checkbox-container input {
     position: absolute;
     opacity: 0;
     cursor: pointer;
     height: 0;
     width: 0;
 }

 .checkmark {
     position: absolute;
     inset-inline-start: 0;
     height: 20px;
     width: 20px;
     background-color: var(--light);
     border: 1px solid var(--border);
     border-radius: 4px;
 }

 .checkbox-container:hover input~.checkmark {
     background-color: #e9ecef;
 }

 .checkbox-container input:checked~.checkmark {
     background-color: var(--primary);
     border-color: var(--primary);
 }

 .checkmark:after {
     content: "";
     position: absolute;
     display: none;
 }

 .checkbox-container input:checked~.checkmark:after {
     display: block;
 }

 .checkbox-container .checkmark:after {
     inset-inline-start: 7px;
     top: 3px;
     width: 5px;
     height: 10px;
     border: solid white;
     border-width: 0 2px 2px 0;
     transform: rotate(45deg);
 }

 /* Navigation Buttons */
 .form-nav {
     display: flex;
     justify-content: space-between;
     margin-top: 2rem;
     padding-top: 1.5rem;
     border-top: 1px solid var(--border);
 }

 .btn {
     padding: 8px 14px;
     border-radius: 10px;
     font-size: 0.85rem;
     font-weight: 500;
     cursor: pointer;
     transition: all 0.2s;
     border: none;
 }

 .btn.primary {
     background-color: var(--primary);
     color: white;
 }

 .btn.primary:hover {
     background-color: var(--primary-dark);
 }

 .btn.secondary {
     background-color: var(--light);
     color: var(--dark);
     border: 1px solid var(--border);
 }

 .btn.secondary:hover {
     background-color: #e9ecef;
 }

 #prevBtn {
     visibility: hidden;
     /* Initially hidden, will be shown by JS */
 }

 #submitBtn {
     display: none;
     /* Initially hidden, will be shown by JS */
 }

 /* Thank You Message */
 .thank-you {
     text-align: center;
     padding: 2rem 0;
 }

 .thank-you h2 {
     color: var(--primary-dark);
     margin: 1rem 0;
 }

 .checkmark-circle {
     width: 80px;
     height: 80px;
     position: relative;
     background-color: var(--success);
     border-radius: 50%;
     margin: 0 auto 1rem;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .checkmark-circle .checkmark {
     transform: rotate(45deg);
     height: 40px;
     width: 20px;
     border-bottom: 4px solid white;
     border-inline-end: 4px solid white;
     position: absolute;
     top: 15px;
     inset-inline-start: 28px;
 }

 .hidden {
     display: none;
 }

 header .container {
     max-width: 1340px;
 }

 /* Responsive Design */
 @media (max-width: 768px) {
     .container {
         padding: 1.5rem;
     }

     .rating {
         width: 35px;
         height: 35px;
         font-size: 0.7rem;
     }
 }

 @media (max-width: 480px) {
     .container {
         padding: 1rem;
     }

     .form-nav {
         flex-direction: column;
         gap: 0.75rem;
     }

     .rating {
         width: 30px;
         height: 30px;
         font-size: 0.6rem;
     }
 }

 /***************************************
Scroll
***************************************/
 ::-webkit-scrollbar {
     width: 5px !important;
 }

 /* Track */
 ::-webkit-scrollbar-track {
     background: #fff;
 }

 /* Handle */
 ::-webkit-scrollbar-thumb {
     background: var(--primary);
     height: 100px;
     border-radius: 10px;
 }

 /* Handle on hover */
 ::-webkit-scrollbar-thumb:hover {
     background: var(--secondary);
 }

 .settings-card input[type="text"],
 .settings-card input[type="number"],
 .settings-card input[type="email"],
 .settings-card select,
 .settings-card textarea,
 .settings-card .form-control,
 .settings-card .select2-container .select2-selection--single,
 .settings-card .select2-container--default .select2-selection--multiple,
 .settings-card input[type="file"],
 #contact-form input[type="text"],
 #contact-form input[type="number"],
 #contact-form input[type="email"],
 #contact-form select,
 #contact-form textarea,
 #contact-form .form-control,
 #contact-form .select2-container .select2-selection--single,
 #contact-form .select2-container--default .select2-selection--multiple {
     background-color: #eeeeee4a !important;
     color: var(--bs-gray-700);
     appearance: none;
     border: 1px solid transparent;
     border-radius: 0.65rem;
     transition:
         border-color 0.15s ease-in-out,
         box-shadow 0.15s ease-in-out;
     height: 48px;
     line-height: 32px;
     width: 100%;
 }

 .settings-card input[type="file"] {
     padding: 5px;
 }

 .settings-card input[type="text"]:focus,
 .settings-card input[type="number"]:focus,
 .settings-card input[type="email"]:focus,
 .settings-card select:focus,
 .settings-card textarea:focus,
 .settings-card .form-control:focus,
 .settings-card .select2-container .select2-selection--single:focus,
 .settings-card .select2-container--default .select2-selection--multiple:focus,
 .settings-card input[type="file"]:focus,
 #contact-form input[type="text"]:focus,
 #contact-form input[type="number"]:focus,
 #contact-form input[type="email"]:focus,
 #contact-form select:focus,
 #contact-form textarea:focus,
 #contact-form .form-control:focus,
 #contact-form .select2-container .select2-selection--single:focus,
 #contact-form .select2-container--default .select2-selection--multiple:focus {
     background-color: #fff !important;
 }

 #contact-form .form-control {
     font-size: 12px;
     font-weight: 400;
     padding: 0.75rem 1rem;
     height: 48px;
 }

 #contact-form .select2-container--default .select2-selection--single .select2-selection__rendered {
     line-height: 46px;
 }

 #contact-form .select2-container .select2-selection--single {
     min-height: 48px;
     padding-block: 0;
 }

 #contact-form .select2-container--default .select2-selection--multiple {
     height: auto;
     padding-block: 0;
     min-height: 48px;
 }

 #contact-form .select2-container--default .select2-search--inline .select2-search__field {
     line-height: 2.1;
 }

 .select2-container--default .select2-search--dropdown .select2-search__field {
     outline: none;
     border: 1px solid #dbdbdb;
     border-radius: 6px;
 }

 #contact-form.getin_form .form-group label,
 #contact-form.getin_form label.form-label {
     color: #828282;
     font-size: 12px;
 }

 .popular-section {
     padding: 30px 0 0px;
 }

 .popular-section .blog-form {
     border-radius: 10px;
     margin: 10px;
     position: relative;

     h3 {
         color: var(--primary);
         top: -20px;
         padding-inline: 10px;
     }
 }

 .breadcrumb-title {
     color: #000000a3;
 }

 .table-responsive {
     scrollbar-width: thin;
 }

 .course-watch-section .course-watch-content .video-btn img {
     height: auto;
     width: 100%;
 }

 .call-to-sction a svg {
     width: 20px;
     transform: scaleX(-1);
 }

 .call-to-sction {
     background: conic-gradient(from 270deg, #eb7019, #d88d7c69);
     padding: 40px;
     border-radius: 6px;
     display: flex;
     margin-bottom: 25px;
     align-items: center;
     justify-content: space-between;
     z-index: 1;
     position: relative;
     overflow: hidden;
 }

 .call-to-sction .rts-btn.with-arrow {
     display: flex;
     align-items: center;
     font-size: 13px;
     gap: 12px;
     padding: 10px 30px;
     min-width: max-content;
 }

 .call-to-sction .rts-btn {
     display: block;
     max-width: max-content;
     padding: 14px 34px;
     border-radius: 4px;
     transition: 0.3s;
     font-weight: 500;
     color: var(--color-primary);
 }

 .call-to-sction .rts-btn .call-to-sction .title {
     margin-inline-start: 25%;
     margin-block-end: 0;
     font-size: 48px;
     font-style: normal;
     font-weight: 600;
     line-height: 58px;
     color: #fff;
 }

 .course-watch-section .course-watch-content .nav-style-1 .nav-item .nav-link.active,
 .course-watch-section .course-watch-content .nav-style-1 .nav-item .nav-link:hover {
     background: var(--secondary);
     border-color: var(--secondary);
 }

 .course-watch-section {
     padding: 40px 20px;
     border-radius: 10px;
     position: relative;
 }

 .border-end {
     border-inline-start: 0 !important;
 }

 .course-watch-section .course-watch-content .nav-style-1 .nav-item:last-child {
     white-space: nowrap;
 }

 .course .btn {
     border-radius: 5px;
     width: max-content;
     border: 0;
 }

 .btn.disabled,
 .btn:disabled,
 fieldset:disabled .btn,
 .training-code {
     background: var(--primary);
     padding: 0 3px;
     border-radius: 3px;
     color: #fff;
     opacity: 0.65;
 }

 .course-watch-section .course-watch-content {
     padding: 20px 20px !important;
     box-shadow: var(--box-shadow);
     border-radius: 10px;
 }

 .tab-content h6,
 .accordion-button h6,
 .course-watch-section .course-watch-content h4,
 .table td a,
 .course-watch-section .progress-overview-section h5,
 .dashboard-header .main-title h3,
 h1,
 h2,
 h3,
 h4,
 h5,
 h6,
 .step label {
     color: #2b2b2b;
 }

 .course.content .table td a {
     font-weight: 400;
 }

 .course-watch-section .course-watch-content .nav-style-1 .nav-item .nav-link,
 .training_date p {
     color: var(--secondary);
 }

 .course-watch-section .progress-overview-section {
     padding-top: 0;
 }

 .training_days,
 .training_date,
 .trainign_instructors {
     padding-block: 20px;
     border-bottom: 1px dashed #eee;
 }

 .training_days {
     border-bottom: 0;
 }

 .progress-overview-section {
     padding: 0 15px 15px;
 }

 .training_days,
 .progress-overview-section .accordions-items-seperate {
     box-shadow: var(--box-shadow);
     padding: 15px;
     border-radius: 10px;
 }

 .account-payment h4 {
     color: var(--primary);

     span {
         color: var(--secondary) !important;
     }
 }

 .account-payment #total_price {
     color: var(--secondary) !important;
 }

 .account-courses,
 .account-trainings,
 .account-wishlist,
 .account-order,
 .account-certificate,
 .account-payment,
 .account-stats,
 .settings-card,
 .contact-top .team-form {
     padding: 20px;
     position: relative;
 }

 .account-payment span {
     font-weight: 500;
 }

 .account-order span {
     color: #999;
 }

 .account-order table.table span {
     color: #353535;
     background: #ffffff;
     box-shadow: var(--box-shadow);
     display: block;
     font-size: 12px;
     margin-bottom: 8px;
     padding: 10px 13px;
     text-align: start;
 }

 .account-payment {
     box-shadow: var(--box-shadow);
     border: 0;
 }

 .account-payment .dashboard-header .main-title h3 {
     position: relative;
     top: 0;
 }

 .cart-form .form-check {
     padding-block: 10px;
     padding-inline: 10px 30px;
     border-radius: 6px;
     border: 1px solid #cdcdcd;
     margin-bottom: 10px;
     margin-inline-end: 0;
 }

 .form-check-label {
     font-weight: 500;
     color: var(--primary);
 }

 .account-payment .btn-secondary {
     height: 48px;
 }

 .contact-top .team-form .team-form-heading h3 {
     top: -15px;
     background: #fff;
     padding-inline: 15px;
     color: var(--primary);
 }

 .btn-primary:hover,
 .btn-primary.active,
 .btn-primary:active,
 .open>.dropdown-toggle.btn-primary {
     border: none;
 }

 .training_date .mb-4 {
     margin-bottom: 0 !important;
 }

 .breadcrumb-bar {
     padding: 25px 0;

     .info-links {
         margin-top: 10px;
     }
 }

 .new-badge.bg-success {
     background-color: var(--secondary) !important;
     display: block;
     margin-bottom: 5px;
     font-size: 10px;
     border-radius: 3px;
     text-align: start;
 }

 .contact-widget {
     border-top: 1px solid #5a5b5b;
     border-bottom: 1px solid #5a5b5b;
     padding: 12px 0 0;
     background: #ffffff57;
     border-radius: 9px;
     margin-top: 0;
 }

 .form-check {
     margin-inline-end: 10px;
 }

 .popular-img {
     display: none;
 }

 .progress-overview-section .table {
     --bs-table-striped-bg: #f8f9fa;
 }

 .progress-overview-section .table tr {
     border-color: #fff;
 }

 .course.content .table td a.btn-danger {
     color: #fff;
     padding: 0 5px;
     margin-inline-start: 10px;
 }

 .progress-overview-section .table tr .feather-check-square,
 .training-exam .feather-check-square {
     margin-top: 5px;
     text-align: start !important;
 }

 .underline-link {
     text-decoration: underline;
 }

 .login-wrapper.reg .login-userset {
     width: 600px;
 }

 .login-wrapper.reg .form-icon {
     padding-inline-end: 7px;
 }

 .login-wrapper.reg .form-focus .focus-label {
     padding-inline-start: 7px;
 }

 .form-control {
     border-radius: 5px;
     height: 48px;
 }

 .step label {
     font-size: 18px;
 }

 /* Hide native radio button */
 .exam-page input[type="radio"] {
     display: none;
 }

 /* Base label style */
 .exam-page .radio-label {
     display: inline-block;
     padding: 10px 16px;
     border-radius: 8px;
     background-color: #eee;
     cursor: pointer;
     margin-inline-end: 10px;
     font-family: sans-serif;
     transition:
         background-color 0.3s,
         color 0.3s;
 }

 /* Style when input is checked */
 .exam-page input[type="radio"]:checked+.radio-label {
     background-color: var(--primary);
     color: white;
 }

 .exam-page,
 #feedbackForm {
     position: relative;
     border: 1px solid #cdcdcd;
     padding: 30px 20px;
     border-radius: 10px;
     box-shadow: none;
 }

 .survey-content {
     position: relative;
 }

 .survey-header {
     text-align: start;
     color: var(--primary);
     margin-bottom: 6px;
 }

 .survey-header h4 {
     background: #fff;
     position: relative;
     z-index: 99;
     padding-inline: 15px;
 }

 .table tbody td,
 .table th {
     padding: 13px;
 }

 hr {
     border-top: var(--bs-border-width) dashed;
 }

 .gigs-title .badge.bg-primary-light {
     color: var(--primary);
     background: #fff;
     line-height: 1.2;
     border: 1px solid #cdcdcd;
     transition: all 0.2s;
     text-align: start;
 }

 .gigs-title .badge.bg-primary-light:hover {
     background: var(--primary);
     color: #fff;
     border: 1px solid var(--primary);
 }

 .gigs-title a p {
     margin-bottom: 0;
 }

 .gigs-title h6 {
     display: flex;
     line-height: 30px;
 }

 .course-watch-section .course-watch-content h4 {
     font-size: 20px;
 }

 .course-watch-section .course-watch-content .faq-accordion .accordion-button {
     font-size: 14px;
     font-weight: 500;
 }

 .gigs-title h3 {
     font-size: 16px;
 }

 @media (min-width: 768px) {
     .text-md-end {
         text-align: left !important;
     }
 }

 @media (max-width: 768px) {
     #wishlistContainer .gigs-grid {
         height: auto;
         flex-direction: column;
     }
 }

 @media only screen and (max-width: 1399.98px) {
     .header-nav {
         padding: 0;
     }

     .main-menu-wrapper .main-nav>li+li {
         margin-inline-start: 14px;
     }

     .main-nav>li>a {
         font-size: 12px;
     }

     .header-navbar-rht>li .btn {
         padding: 0.75rem 0.75rem;
     }
 }

 @media (992px < width < 2680px) {
     .logo img.pe-3 {
         height: 35px;
         max-width: 45px;
         object-fit: cover;
         object-position: right;
     }
 }

 .login-card {
     .select2-container--default .select2-selection--single {
         background-color: #ffffff;
         border: 1px solid #dddddd;
         border-radius: 4px;
         height: 47px;
     }
 }



 @media (992px < width < 1204px) {
     .header-nav {
         justify-content: center;
         gap: 10px;
         padding-block: 9px !important;
     }
 }

 /*////////////////////*/
 /*////////////////////*/
 /*////////////////////*/
 /*     bottom nav     */
 /*////////////////////*/
 /*////////////////////*/
 /*////////////////////*/

 #bot-nav {
     display: none;
 }

 @media only screen and (max-width: 575px) {
     #bot-nav {
         display: block;
     }
 }

 @media only screen and (max-width: 575px) {
     nav.amazing-tabs {
         background-color: #ffffffb0;
         backdrop-filter: blur(5px);
         border-radius: 25px;
         bottom: 10px;
         transform: translateX(-50%);
         left: 50%;
         position: fixed;
         z-index: 1054;
         user-select: none;
         box-shadow: var(--box-shadow);
     }

     .main-tabs-container {
         padding: 0 0.5rem;
         position: relative;
         z-index: 999;
         box-shadow: var(--box-shadow);
         border-radius: 999px;
     }

     .main-tabs-wrapper {
         position: relative;
         margin: 0 20px;
     }

     ul.main-tabs,
     ul.filter-tabs {
         list-style-type: none;
         display: flex;
         align-items: center;
         justify-content: space-between;
         padding-left: 0;
         margin-bottom: 0;
     }

     ul.main-tabs li {
         display: inline-flex;
         position: relative;
         padding: 0.25rem;
         z-index: 1;
     }

     .amazing-tabs .main-tabs li {
         cursor: pointer;
     }

     .amazing-tabs .main-tabs li a {
         transition: all 0.4s ease-in-out;
     }

     #bot-nav .round-button {
         height: 42px;
         width: 42px;
         padding: 8px;
         border-radius: 50%;
         display: inline-flex;
         align-items: center;
         justify-content: center;
         color: #ddd;
         transition: color 0.2s ease-in-out;
     }

     #bot-nav .avatar {
         width: unset;
         height: unset;
         border-radius: 50%;
         pointer-events: none;
     }

     .amazing-tabs .main-tabs li a img {
         transition: all 0.4s ease-in-out;
     }

     .avatar img {
         object-fit: cover;
         width: 100%;
         filter: hue-rotate(197deg);
     }

     .foot-box img {
         filter: hue-rotate(200deg);
     }

     .foot-box {
         background: #ffffff;
         box-shadow: var(--box-shadow);
         padding: 4px 10px;
         border-radius: 27px;
         cursor: pointer;
         min-height: 65px;
         color: #414141;
         margin-bottom: 0.75rem;
         font-size: 12px;
         font-weight: 500;
         gap: 4px;
         box-shadow: var(--box-shadow);
         transition: all 0.4s ease-in-out;
     }

     .amazing-tabs .main-tabs .btmNavHome img {
         filter: brightness(15);
     }

     .foot,
     .foot-uniqe,
     .foot-user,
     .foot-uniqe-profile,
     .user-foot {
         position: fixed;
         width: 100%;
         z-index: 99;
         text-align: center;
         min-height: 125px;
         max-height: 500px;
         font-size: 18px;
         color: #000;
         display: flex;
         justify-content: center;
         border-radius: 25px;
         right: 0;
         left: 0;
         margin-right: auto;
         margin-left: auto;
         transform: translateY(15%);
         padding-bottom: 50px !important;
         transition: 1s;
     }

     .foot.active,
     .user-foot.active,
     .foot-user.active,
     .foot-uniqe.active,
     .foot-uniqe-profile.active {
         transform: translateY(-100%);
     }

     .copyright-area-one-border {
         padding-bottom: 64px;
     }

     .footer-callto-action-area .ptb--105 {
         padding: 22px 8px;
     }
 }

 .tagsAbsolute {
     position: absolute;
     top: 36px;
     font-size: 13px;
     right: 0px;
     background: #ffffffcc;
     color: #f5712e;
     padding: 0px 8px;
     border-radius: 6px 0 0 6px;
 }

 .btmNavHome a {
     background: var(--primary);
     transform: translateY(-14px);
     box-shadow: var(--box-shadow);
 }

 /* design 2 */
 .btn-white-shadow {
     -webkit-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
     color: #fff;
     -webkit-box-shadow: var(--box-shadow);
     box-shadow: var(--box-shadow);
     background-color: #fff;
 }

 .how-it-works {
     padding: 80px 0 60px;
 }

 @media (max-width: 991.98px) {
     .how-it-works {
         padding: 50px 0 38px;
     }
 }

 .how-it-works-item {
     box-shadow: var(--box-shadow);
     margin-bottom: 12px;
     background-color: var(--white);
 }

 .how-it-works-item .count {
     flex-shrink: 0;
     width: 80px;
     height: 80px;
     border-radius: 5px;
     font-size: 38px;
     font-weight: 700;
     display: flex;
     align-items: center;
     justify-content: center;
     margin-right: 24px;
 }

 .how-it-works-bg {
     position: absolute;
     left: 0;
     top: 50%;
     transform: translateY(-50%);
     z-index: -1;
 }

 .how-it-works-images img {
     margin-bottom: 20px;
 }

 .what-makes-dream-gigs {
     padding: 80px 0;
     z-index: 1;
     position: relative;
 }

 @media (max-width: 991.98px) {
     .what-makes-dream-gigs {
         padding: 50px 0;
     }
 }

 @media (max-width: 991.98px) {
     .what-makes-left {
         margin-bottom: 20px;
     }
 }

 .what-makes-left h2 {
     color: #1a1a1a;
     z-index: 1;
     position: relative;
 }

 .what-makes-left h2 span {
     position: relative;
     color: var(--primary);
     display: inline-flex;
 }



 @media (max-width: 575.98px) {
     .what-makes-left h2 span::before {
         width: 139px;
         height: 40px;
         background-size: 100%;
     }
 }

 .what-makes-left p {
     color: #b5b5b5;
     font-size: 16px;
 }

 .testimonial-bg2 img,
 .testimonial-bg1 img {
     filter: grayscale(1);
     display: none;
 }

 .what-makes-item {
     padding: 30px 20px;
     transition: 0.3s;
     border-radius: 10px !important;
     box-shadow: var(--box-shadow);
 }

 .what-makes-item:hover {
     transform: translateY(-10px);
 }

 .what-makes-item h2 {
     font-size: 71px;
     color: #f3f3f3;
     margin-bottom: 0;
 }

 .what-makes-item h6 {
     line-clamp: 1;
     -webkit-line-clamp: 1;
     -webkit-box-orient: vertical;
     overflow: hidden;
     color: #1a1a1a;
     text-overflow: ellipsis;
     font-size: 18px;
     display: -webkit-box;
 }

 .what-makes-item p {
     line-clamp: 3;
     -webkit-line-clamp: 3;
     -webkit-box-orient: vertical;
     overflow: hidden;
     font-weight: 400;
     text-overflow: ellipsis;
     color: #919191;
     display: -webkit-box;
 }

 .col-lg-9 .row .col-xl-4.col-md-6 {
     position: relative;
 }

 .what-makes-icon {
     font-size: 35px;
     display: flex;
     align-items: center;
     justify-content: center;
     width: 60px;
     height: 60px;
     margin-bottom: 20px;
 }

 .course-price svg {
     color: var(--primary);
     width: 20px;
     margin-inline: 6px;
 }

 #wishlistContainer .gigs-grid.cart-page {
     height: -webkit-fill-available;
     padding: 6px;
     position: relative;

     .gigs-title {
         margin-bottom: 0px !important;
         width: 100%;
     }

     .gigs-content {
         padding: 15px 8px;
         padding-bottom: 32px;
         display: flex;
         flex-direction: column;
         align-items: center;

         hr {
             display: none;
         }

         .gigs-info {
             .badge {
                 position: absolute;
                 top: 12px;
                 inset-inline-end: 12px;
                 font-size: 12px;
                 background: #ffffff;
             }
         }

         .badge.bg-primary-light {
             position: absolute;
             bottom: 4px;
             color: #313131;
             margin-inline: 4px;
             font-size: 12px;
             line-height: 18px;
             left: 0;
             right: 0;
             border: none;
             text-align: center;
             background: #fff;
         }
     }
 }

 .hyperpay-payment-section .card .card-body {
     direction: ltr;
 }

 .account-payment .card {
     box-shadow:
         3px 3px 3px #00000010 inset,
         3px 3px 3px #00000010;
 }

 .account-payment .card-header {
     border-bottom: 0 !important;
 }

 .account-payment .card-header img {
     height: 23px;
     object-fit: contain;
 }

 .account-payment .card-header h5 {
     width: 150px;
 }

 .account-payment .card-header i {
     width: 40px;
 }

 .show-course {
     .show-course {
         position: relative;
         margin-bottom: 20px;
         overflow: hidden;
         height: 100%;
     }

     .halal {
         .show-course~.footer {
             z-index: 9999;
         }
     }

     /* Sidebar Styles */
     .sidebar {
         width: 330px;
         background: #fff;
         color: white;
         padding: 0;
         box-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);
         position: fixed;
         height: 100%;
         overflow-y: auto;
         z-index: 1000;
         inset-inline-start: 0;
         max-height: 100vh;
         top: 78px;
         transition: transform 0.3s ease;
         margin: 0 10px;
         overflow: hidden;
     }

     .course-header {
         padding: 24px;
         background: rgba(255, 255, 255, 0.1);
         backdrop-filter: blur(10px);
         border-bottom: 1px solid rgba(255, 255, 255, 0.2);
         position: sticky;
         top: 0;
         z-index: 10;
         position: relative;
     }

     .drawer-close-btn {
         display: none;
         position: absolute;
         top: 20px;
         inset-inline-end: 20px;
         background: rgba(255, 255, 255, 0.2);
         border: none;
         border-radius: 50%;
         width: 40px;
         height: 40px;
         color: white;
         font-size: 18px;
         cursor: pointer;
         transition: all 0.3s ease;
         backdrop-filter: blur(10px);
     }

     .drawer-close-btn:hover {
         background: rgba(255, 255, 255, 0.3);
         transform: scale(1.1);
     }

     @media (max-width: 768px) {
         .drawer-close-btn {
             display: flex;
             align-items: center;
             justify-content: center;
         }
     }

     .course-title {
         font-size: 1.2rem;
         font-weight: 700;
         margin-bottom: 8px;
         padding-bottom: 10px;
         line-height: 1.3;
         border-bottom: 1px solid #eee;
     }

     .course-instructor {
         font-size: 0.9rem;
         opacity: 0.9;
         margin-bottom: 15px;
     }

     .course-progress {
         background: rgba(255, 255, 255, 0.2);
         border-radius: 10px;
         height: 8px;
         overflow: hidden;
         margin-bottom: 10px;
     }

     .progress-bar {
         height: 100%;
         background: rgb(246 133 34 / 50%);
         width: 65%;
         border-radius: 10px;
         transition: width 0.3s ease;
     }

     .progress-text {
         font-size: 0.8rem;
         opacity: 0.8;
     }

     .course-modules {
         padding: 0 0 20px 0;
     }

     .module {
         margin-bottom: 15px;
     }

     .module-header {
         padding: 15px 25px;
         background: rgba(255, 255, 255, 0.1);
         cursor: pointer;
         transition: all 0.3s ease;
         border-inline-start: 4px solid transparent;
         display: flex;
         align-items: center;
         justify-content: space-between;
         color: var(--secondary);
         box-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);
     }

     .module-header:hover {
         background: rgba(255, 255, 255, 0.15);
         border-left-color: rgba(255, 255, 255, 0.5);
     }

     .module-header.active {
         background: #f3f3f3;
         border-left-color: white;
     }

     .module-title {
         font-size: 0.9rem;
         color: #595959;
         font-weight: 500;
     }

     .module-count {
         font-size: 0.8rem;
         opacity: 0.7;
         background: rgba(255, 255, 255, 0.2);
         padding: 2px 8px;
         border-radius: 12px;
     }

     .collapse-icon {
         transition: transform 0.3s ease;
         font-size: 14px;
     }

     [dir="rtl"] {
         .collapse-icon {
             transform: scaleX(-1);
         }
     }

     .module.expanded .collapse-icon {
         transform: rotate(90deg);
     }

     .module-content {
         max-height: 0;
         overflow: hidden;
         transition: max-height 0.3s ease;
         /* background: rgba(0, 0, 0, 0.1); */
     }

     .module.expanded .module-content {
         max-height: 500px;
     }

     .lesson {
         padding: 12px 25px 12px 25px;
         cursor: pointer;
         transition: all 0.3s ease;
         border-inline-start: 4px solid rgb(13 118 127 / 60%);
         display: flex;
         align-items: center;
         justify-content: space-between;
         background: linear-gradient(270deg,
                 rgb(246 133 34 / 15%),
                 transparent,
                 #0d767f1a);
         color: #393939;
     }

     .lesson:hover {
         background: linear-gradient(135deg,
                 rgb(246 133 34 / 15%),
                 transparent,
                 #0d767f1a);
         border-left-color: rgba(255, 255, 255, 0.3);
     }

     .lesson.active {
         background: rgba(255, 255, 255, 0.15);
         border-left-color: white;
     }

     .lesson-info {
         flex: 1;
     }

     .lesson-title {
         font-size: 0.9rem;
         margin-bottom: 4px;
     }

     .lesson-duration {
         font-size: 0.7rem;
         opacity: 0.7;
     }

     .lesson-status {
         width: 20px;
         height: 20px;
         border-radius: 50%;
         display: flex;
         align-items: center;
         justify-content: center;
         font-size: 12px;
     }

     .lesson-status.completed {
         background: var(--primary);
         color: #fff;
     }

     .lesson-status.current {
         background: rgba(255, 193, 7, 0.8);
     }

     .lesson-status.locked {
         background: rgba(158, 158, 158, 0.8);
     }

     .lesson-status.exam-available {
         background-image: linear-gradient(to right,
                 var(--primary),
                 var(--main-color2),
                 var(--main-color2),
                 var(--primary));
         color: white;
     }

     .exam-lesson {
         background: linear-gradient(135deg,
                 rgba(102, 126, 234, 0.05),
                 rgba(118, 75, 162, 0.05));
         border-inline-start: 4px solid var(--primary);
         background: linear-gradient(135deg,
                 rgb(246 133 34 / 15%),
                 transparent,
                 #0d767f1a);
     }

     .exam-lesson:hover {
         background: linear-gradient(135deg,
                 rgb(246 133 34 / 15%),
                 transparent,
                 #0d767f1a);
     }

     .exam-lesson .lesson-title {
         font-weight: 600;
         color: var(--primary);
     }

     .final-exam {
         border-inline-start: 4px solid rgb(13 118 127 / 60%);
         border-radius: 10px;
         margin: 8px;
         background: linear-gradient(270deg,
                 rgb(13 86 53 / 42%),
                 transparent,
                 #c8a06c73);
     }

     .final-exam .lesson-title {
         font-weight: 700;
         color: var(--primary);
     }

     /* Main Content Styles */
     .main-content {
         flex: 1;
         background: #fff;
         min-height: 100vh;
         transition: margin-inline-start 0.3s ease;
         width: calc(100% - 350px);
         margin-top: 0;
         box-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);
         position: relative;
         top: 88px;
         overflow: hidden;
     }

     .content-header {
         background: white;
         padding: 25px 40px;
         border-bottom: 1px solid #eee;
         position: sticky;
         top: 0;
         z-index: 100;
         display: flex;
         align-items: center;
         justify-content: space-between;
         position: fixed;
         top: 78px;
         width: 100%;
     }

     .mobile-menu-btn {
         display: none;
         background-image: linear-gradient(to right,
                 var(--primary),
                 var(--primary));
         border: none;
         font-size: 24px;
         color: white;
         cursor: pointer;
         padding: 8px;
         border-radius: 8px;
         margin-inline-end: 15px;
         transition: all 0.3s ease;
     }

     .mobile-menu-btn:hover {
         transform: translateY(-2px);
         box-shadow: 0 8px 25px rgba(102, 126, 234, 0.3);
     }

     .header-left {
         display: flex;
         align-items: center;
         flex: 1;
     }

     .content-title h1 {
         font-size: 18px;
         color: var(--primary);
         margin-bottom: 5px;
         font-weight: 600;
     }

     .content-subtitle {
         color: #666;
         font-size: 0.9rem;
     }

     .content-actions {
         display: none;
     }

     .btn {
         padding: 10px 20px;
         border: none;
         border-radius: 8px;
         cursor: pointer;
         font-size: 0.9rem;
         font-weight: 500;
         transition: all 0.3s ease;
         text-decoration: none;
         display: inline-flex;
         align-items: center;
         gap: 8px;
         white-space: nowrap;
     }

     .btn-primary {
         background-image: linear-gradient(to right,
                 var(--primary),
                 var(--main-color2),
                 var(--main-color2),
                 var(--primary));
         color: white;
     }

     .btn-primary:hover {
         transform: translateY(-2px);
         box-shadow: 0 8px 25px rgba(102, 126, 234, 0.3);
     }

     .btn-secondary {
         background: #f8f9fa;
         color: var(--primary);
         border: 1px solid #e0e0e0;
     }

     .btn-secondary:hover {
         background: #e9ecef;
     }

     .content-body {
         padding: 40px;
         margin-bottom: 85px;
     }

     .content-body img {
         width: 100%;
     }

     .video-container {
         background: #000;
         border-radius: 12px;
         overflow: hidden;
         margin-block: 30px;
         box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
     }

     .video-container iframe {
         min-height: 550px;
     }

     .video-placeholder {
         width: 100%;
         height: 400px;
         background: linear-gradient(45deg, #333, #555);
         display: flex;
         align-items: center;
         justify-content: center;
         color: white;
         font-size: 3rem;
         cursor: pointer;
         transition: all 0.3s ease;
     }

     .video-placeholder:hover {
         background: linear-gradient(45deg, #444, #666);
     }

     .section-title {
         font-size: 1.4rem;
         margin-bottom: 20px;
         font-weight: 600;
         padding-bottom: 10px;
         border-bottom: 2px solid #eee;
         margin-top: 10px;
     }

     .content-text {
         line-height: 1.8;
         color: #444;
         font-size: 1rem;
         margin-bottom: 20px;
     }

     .resources-grid {
         display: grid;
         grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
         gap: 20px;
         margin-top: 20px;
     }

     .resource-card {
         background: linear-gradient(270deg,
                 rgb(246 133 34 / 15%),
                 transparent,
                 #0d767f1a);
         border: 0;
         border-radius: 0;
         padding: 20px;
         transition: all 0.3s ease;
         cursor: pointer;
     }

     .resource-card:hover {
         transform: translateY(-5px);
         box-shadow: 0 10px 25px rgba(102, 126, 234, 0.1);
         background: linear-gradient(135deg,
                 rgb(246 133 34 / 15%),
                 transparent,
                 #0d767f1a);
     }

     .resource-icon {
         width: 40px;
         height: 40px;
         background-image: rgb(246 133 34 / 40%);
         border-radius: 10px;
         display: flex;
         align-items: center;
         justify-content: center;
         color: white;
         font-size: 18px;
         margin-bottom: 15px;
     }

     .resource-title {
         font-size: 1.1rem;
         font-weight: 600;
         color: var(--primary);
         margin-bottom: 8px;
     }

     .resource-description {
         font-size: 0.9rem;
         color: #666;
         line-height: 1.5;
     }

     .navigation-footer {
         display: flex;
         justify-content: space-between;
         padding: 30px 40px;
         background: #f8f9fa;
         border-top: 1px solid #e0e0e0;
         margin-top: 40px;
     }

     .nav-btn {
         display: flex;
         align-items: center;
         gap: 10px;
         padding: 12px 24px;
         border: none;
         border-radius: 8px;
         cursor: pointer;
         font-weight: 500;
         transition: all 0.3s ease;
         text-decoration: none;
     }

     .nav-btn.prev {
         background: #f0f0f0;
         color: var(--primary);
     }

     .nav-btn.next {
         background-image: linear-gradient(to right,
                 var(--primary),
                 var(--main-color2),
                 var(--main-color2),
                 var(--primary));
         color: white;
     }

     .nav-btn:hover {
         transform: translateY(-2px);
     }

     .nav-btn:disabled {
         opacity: 0.5;
         cursor: not-allowed;
         transform: none;
     }

     /* Mobile Overlay */
     .mobile-overlay {
         position: fixed;
         top: 0;
         inset-inline-start: 0;
         width: 100%;
         height: 100%;
         background: rgba(0, 0, 0, 0.5);
         z-index: 999;
         opacity: 0;
         visibility: hidden;
         transition: all 0.3s ease;
     }

     .mobile-overlay.show {
         opacity: 1;
         visibility: visible;
     }

     /* Exam Modal */
     .exam-info-modal {
         position: fixed;
         top: 0;
         inset-inline-start: 0;
         width: 100%;
         height: 100%;
         background: rgba(0, 0, 0, 0.5);
         z-index: 2000;
         display: flex;
         align-items: center;
         justify-content: center;
         opacity: 0;
         visibility: hidden;
         transition: all 0.3s ease;
     }

     .exam-info-modal.show {
         opacity: 1;
         visibility: visible;
     }

     .exam-modal-content {
         background: white;
         border-radius: 20px;
         padding: 30px;
         max-width: 500px;
         width: 90%;
         text-align: center;
         box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
         transform: scale(0.9);
         transition: transform 0.3s ease;
     }

     .exam-info-modal.show .exam-modal-content {
         transform: scale(1);
     }

     .exam-modal-title {
         font-size: 1.5rem;
         font-weight: 700;
         color: var(--primary);
         margin-bottom: 20px;
     }

     .exam-modal-details {
         background: #f8f9ff;
         border-radius: 12px;
         padding: 20px;
         margin: 20px 0;
         text-align: left;
     }

     .exam-detail-row {
         display: flex;
         justify-content: space-between;
         margin-bottom: 10px;
         padding-bottom: 8px;
         border-bottom: 1px solid #e0e0e0;
     }

     .exam-detail-row:last-child {
         border-bottom: none;
         margin-bottom: 0;
     }

     .exam-detail-label {
         font-weight: 600;
         color: var(--primary);
     }

     .exam-detail-value {
         color: #666;
     }

     .exam-modal-actions {
         display: flex;
         gap: 15px;
         justify-content: center;
         margin-top: 25px;
     }

     .modal-btn {
         padding: 12px 25px;
         border: none;
         border-radius: 8px;
         cursor: pointer;
         font-weight: 600;
         transition: all 0.3s ease;
     }

     .modal-btn-primary {
         background-image: linear-gradient(to right,
                 var(--primary),
                 var(--main-color2),
                 var(--main-color2),
                 var(--primary));
         color: white;
     }

     .modal-btn-secondary {
         background: #f0f0f0;
         color: var(--primary);
     }

     /* Responsive Design */
     @media (max-width: 1024px) {
         .sidebar {
             width: 300px;
         }

         .main-content {
             margin-inline-start: 300px;
         }
     }

     @media (max-width: 768px) {
         .sidebar {
             transform: translateX(-100%);
             width: 320px;
         }

         .sidebar.show {
             transform: translateX(0);
         }

         .main-content {
             margin-inline-start: 0;
             width: 100%;
         }

         .mobile-menu-btn {
             display: block;
         }

         .content-header {
             padding: 15px 20px;
             flex-wrap: wrap;
             gap: 15px;
         }

         .header-left {
             min-width: 0;
         }

         .content-title h1 {
             font-size: 1.3rem;
             line-height: 1.2;
         }

         .content-subtitle {
             font-size: 0.8rem;
         }

         .content-actions {
             display: none;
         }

         .btn {
             width: 100%;
             justify-content: center;
             padding: 12px 20px;
             font-size: 0.9rem;
         }

         .content-body {
             padding: 20px;
         }

         .video-placeholder {
             height: 250px;
             font-size: 2rem;
         }

         .section-title {
             font-size: 1.2rem;
         }

         .content-text {
             font-size: 0.95rem;
             line-height: 1.6;
         }

         .resources-grid {
             grid-template-columns: 1fr;
             gap: 15px;
         }

         .resource-card {
             padding: 15px;
         }

         .navigation-footer {
             padding: 20px;
             flex-direction: column;
             gap: 15px;
         }

         .nav-btn {
             width: 100%;
             justify-content: center;
             padding: 15px 20px;
         }

         .course-header {
             padding: 20px;
         }

         .course-title {
             font-size: 1.2rem;
             line-height: 1.2;
         }

         .course-instructor {
             font-size: 0.85rem;
         }

         .progress-text {
             font-size: 0.75rem;
         }

         .module-header {
             padding: 12px 20px;
         }

         .module-title {
             font-size: 0.9rem;
         }

         .module-count {
             font-size: 0.7rem;
             padding: 1px 6px;
         }

         .lesson {
             padding: 10px 20px 10px 35px;
         }

         .lesson-title {
             font-size: 0.85rem;
         }

         .lesson-duration {
             font-size: 0.65rem;
         }

         .lesson-status {
             width: 18px;
             height: 18px;
             font-size: 10px;
         }

         .exam-modal-content {
             padding: 25px 20px;
             margin: 20px;
         }

         .exam-modal-title {
             font-size: 1.3rem;
         }

         .exam-modal-actions {
             flex-direction: column;
             gap: 10px;
         }

         .modal-btn {
             width: 100%;
             padding: 15px 25px;
         }
     }

     @media (max-width: 480px) {
         .sidebar {
             width: 100vw;
         }

         .content-header {
             padding: 12px 15px;
         }

         .content-title h1 {
             font-size: 1.1rem;
         }

         .content-body {
             padding: 15px;
         }

         .video-placeholder {
             height: 200px;
             font-size: 1.5rem;
         }

         .section-title {
             font-size: 1.1rem;
         }

         .navigation-footer {
             padding: 15px;
         }

         .course-header {
             padding: 15px;
         }

         .course-title {
             font-size: 1.1rem;
         }
     }

     /* Scrollbar styling */
     .sidebar {
         scrollbar-width: thin;
         scrollbar-color: rgba(255, 255, 255, 0.3) transparent;
     }

     .sidebar::-webkit-scrollbar {
         width: 6px;
     }

     .sidebar::-webkit-scrollbar-track {
         background: transparent;
     }

     .sidebar::-webkit-scrollbar-thumb {
         background: rgba(255, 255, 255, 0.3);
         border-radius: 3px;
     }

     .sidebar::-webkit-scrollbar-thumb:hover {
         background: rgba(255, 255, 255, 0.5);
     }
 }

 .service-wrap ul,
 .blog-contents ul,
 .info-card ul,
 .slider-card~.tab-content ul,
 .post-content.panel ul {
     padding-inline-start: 30px;
     /* list-style: auto; */
     list-style: inherit;
 }

 .about-us-section ul {
     list-style: inherit;
     padding-inline-start: 30px;
 }

 .service-wrap .btns {
     display: flex;
     justify-content: center;
     gap: 15px;
 }

 .Whatsapp-btn a,
 .Call-btn a {
     background: var(--primary);
     color: #fff;
     padding: 10px 20px;
     border-radius: 8px;

     svg path {
         fill: #fff;
     }
 }

 .blog-contents .service-wrap {
     box-shadow: none;
 }

 [dir="rtl"] .pagination .fa-chevron-right {
     --fa: "\f053";
     --fa--fa: "\f054\f053";
 }

 [dir="rtl"] .pagination .fa-chevron-left {
     --fa: "\f054";
     --fa--fa: "\f054\f054";
 }

 .sticky-top {
     z-index: 1;
     margin-top: 25px;
 }

 /* for global file */

 input:-webkit-autofill,
 input:-webkit-autofill:hover,
 input:-webkit-autofill:focus,
 input:-webkit-autofill:active {
     -webkit-box-shadow: 0 0 0 30px #fbfbfb inset !important;
 }

 .pe-2 {
     padding-inline-start: 0.5rem !important;
     padding-inline-end: unset !important;
 }

 .ps-2 {
     padding-inline-end: 0.5rem !important;
     padding-inline-start: unset !important;
 }

 .company-request .pre-title {
     display: flex;
     align-items: center;
     gap: 5px;
     line-height: 28px;
     margin-bottom: 10px;
 }

 .company-request .pre-title img {
     width: 28px;
 }

 .company-request .pre-title span {
     color: var(--primary);
     line-height: 28px;
 }

 .company-request .title {
     color: #000000a3;
     margin-bottom: 15px;
 }

 .company-request p {
     line-height: 1.8;
 }

 button[type="submit"]:disabled {
     opacity: 0.6;
     cursor: not-allowed;
 }

 .spinner-border-sm {
     width: 1rem;
     height: 1rem;
     border-width: 0.15em;
 }

 .certificateCard {
     .gigs-content {
         padding: 10px 15px !important;
     }
 }

 /* show my training style */
 .contentTraining {
     padding-bottom: 50px;

     @media (width<767px) {
         .days-nav {
             display: flex;
             flex-wrap: nowrap;
             justify-content: start;
             gap: 10px;
             overflow-x: auto;

             &::-webkit-scrollbar {
                 display: none;
             }
         }
     }
 }

 /* new sections styls */
 .hero-section2 {
     background: url("https://i.ibb.co/qMJxT2Rb/hero.jpg");

     margin: 15px;
     border-radius: 20px;
     background-size: cover;
     position: relative;
     align-content: center;
     overflow: hidden;
     min-height: 50vh;

     .banner-content {
         position: relative;
         z-index: 1;
     }

     &:after {
         content: "";
         background: #000000a6;
         left: 0;
         top: 0;
         width: 100%;
         height: 100%;
         position: absolute;
     }

     .banner-head {
         h1 {
             color: #fff;
         }

         p {
             font-size: 16px;
             margin-bottom: 40px;
             color: #bcbcbc;
             max-width: 719px;
         }
     }

     .banner-form {
         background: #ffffff61;
         max-width: 780px;

         .input-block label {
             color: #ececec;
         }
     }
 }

 /* custom radio btn */
 .glass-radio-group-vertical {
     position: relative;
     display: flex;
     flex-direction: column;
     background: rgba(255, 255, 255, 0);
     padding: 1.5rem 1.2rem;
     border: 0px solid rgb(255, 255, 255, 0);
     border-radius: 1rem;
     backdrop-filter: blur(16px);
     width: 230px;
     overflow: hidden;
     gap: 0.5rem;
 }

 .glass-radio-group-vertical input {
     display: none;
 }

 .glass-radio-group-vertical label {
     position: relative;
     display: flex;
     align-items: center;
     gap: 0.8rem;
     padding: 1rem 1.2rem;
     border-radius: 0.8rem;
     font-weight: 600;
     font-size: 1rem;
     color: #ccc;
     cursor: pointer;
     z-index: 2;
     transition: all 0.4s ease-in-out;
     overflow: hidden;
 }

 .label-text {
     flex: 1;
     display: flex;
     align-items: center;
     justify-content: flex-start;
 }

 .radio-indicator {
     width: 1.2rem;
     height: 1.2rem;
     border-radius: 50%;
     background: #999;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 0.75rem;
     color: white;
     box-shadow: 0 0 0 2px transparent;
     transition: all 0.3s ease-in-out;
 }

 .checkmark {
     /* opacity: 0; */
     /* transform: scale(0); */
     transition: all 0.3s ease-in-out;
 }

 .glass-glider-vertical {
     position: absolute;
     left: 0;
     height: 56px;
     width: 80%;
     margin-left: 20px;
     border-radius: 0.8rem;
     z-index: 1;
     transition:
         transform 0.4s cubic-bezier(0.5, 1.6, 0.4, 1),
         background 0.5s ease-in-out,
         box-shadow 0.4s;
 }

 #glass-silver:checked~.glass-glider-vertical {
     transform: translateY(0%);
     background: linear-gradient(135deg, #00000050, #d1d1d1cc);
     box-shadow: 0 0 15px #00000077;
 }

 #glass-silver:checked+label {
     color: white;
 }

 #glass-silver:checked+label .radio-indicator {
     background: #c0c0c0;
     box-shadow:
         0 0 0 2px #858585aa,
         0 0 6px #6b6b6baa;
 }

 #glass-silver:checked+label .checkmark {
     opacity: 1;
     transform: scale(1);
 }

 #glass-gold:checked~.glass-glider-vertical {
     transform: translateY(115%);
     background: linear-gradient(135deg, #00000050, #ffbb00);
     box-shadow: 0 0 15px #00000077;
 }

 #glass-gold:checked+label {
     color: white;
 }

 #glass-gold:checked+label .radio-indicator {
     background: #ffc400;
     box-shadow:
         0 0 0 2px #9c7300d3,
         0 0 6px #695a00aa;
 }

 #glass-gold:checked+label .checkmark {
     opacity: 1;
     transform: scale(1);
 }

 #glass-platinum:checked~.glass-glider-vertical {
     transform: translateY(230%);
     background: linear-gradient(135deg, #00000050, #57d5ff);
     box-shadow: 0 0 15px #00000077;
 }

 #glass-platinum:checked+label {
     color: white;
 }

 #glass-platinum:checked+label .radio-indicator {
     background: #75c5ff;
     box-shadow:
         0 0 0 2px #0095ff5b,
         0 0 6px #0095ff57;
 }

 #glass-platinum:checked+label .checkmark {
     opacity: 1;
     transform: scale(1);
 }

 .glass-radio-group-vertical:has(#glass-silver:checked) {
     border-color: #c0c0c0;
     box-shadow:
         0 4px 20px rgba(0, 0, 0, 0.2),
         inset 0 0 8px rgba(255, 255, 255, 0.4);
 }

 .glass-radio-group-vertical:has(#glass-gold:checked) {
     border-color: #ffbb00;
     box-shadow:
         0 4px 20px rgba(0, 0, 0, 0.2),
         inset 0 0 8px rgba(255, 196, 0, 0.527);
 }

 .glass-radio-group-vertical:has(#glass-platinum:checked) {
     border-color: #57d5ff;
     box-shadow:
         0 4px 20px rgba(0, 0, 0, 0.2),
         inset 0 0 8px rgba(0, 183, 255, 0.63);
 }

 /* accissibility plugin */

 .muneer-theme-light #muneer-popup,
 .muneer-theme-light #muneer-sidebar,
 .muneer-theme-light #muneer-voice-nav-popup {
     background-color: transparent !important;
     backdrop-filter: blur(25px);
 }

 #muneer-hide-btn {
     display: none !important;
 }

 .muneer-theme-dark .muneer-action-box {
     background: var(--muneer-color-transparent-dark) !important;
 }

 #muneer-popup-footer {
     padding: 16px 32px;
     display: none;
 }

 .muneer-action-box {
     background: transparent !important;
     box-shadow:
         inset 3px 3px 9px #00000010,
         3px 3px 9px #00000010;
 }

 /* footer styles */
 .footer-1 {
     background: #fff;
     padding: 40px 0 0;
     position: relative;
     z-index: 1;
     box-shadow: var(--box-shadow);

     .footer-widget a img {
         filter: unset;
         margin-bottom: 0;
     }

     .footer-widget {
         h3 {
             color: #393939;
         }

         .menu-items li a {
             color: #626262;
             font-size: 14px;
         }

         p {
             color: #626262;
         }

         table td span {
             font-family: inherit !important;
         }
     }

     .social-links ul li a {
         color: #626262;
     }

     .contact-widget {
         border: none;
         padding: 12px 0 0;
         background: linear-gradient(45deg, #f48b20, #c6c6c6, #eb7019);
         border-radius: 9px;
         margin-top: 0;

         .location-list li span {
             background: #ffffff8f;
             color: #626262;
         }
     }

     .footer-bottom {
         .copy-right p {
             color: #626262;
         }

         .footer-bottom-links ul li a {
             color: #626262;
         }
     }
 }

 .range-slider {
     position: relative;
     width: 100%;
     height: 30px;
 }

 .range-slider input[type="range"] {
     position: absolute;
     width: 100%;
     pointer-events: none;
     -webkit-appearance: none;
     background: none;
 }

 .range-slider input[type="range"]::-webkit-slider-thumb {
     pointer-events: auto;
     -webkit-appearance: none;
     height: 16px;
     width: 16px;
     border-radius: 50%;
     background: #fd9239;
     cursor: pointer;
 }

 .contentText {
     padding: 20px;
     background: #e4c9a329;
     border-radius: 10px;
     margin-bottom: 25px;

     p {
         font-size: 15px;
         font-weight: 400;
         padding-inline-start: 28px;
     }
 }

 /* key frames */
 @keyframes heartbeat {
     0% {
         -webkit-transform: scale(1);
         transform: scale(1);
     }

     14% {
         -webkit-transform: scale(1.3);
         transform: scale(1.3);
     }

     28% {
         -webkit-transform: scale(1);
         transform: scale(1);
     }

     42% {
         -webkit-transform: scale(1.3);
         transform: scale(1.3);
     }

     70% {
         -webkit-transform: scale(1);
         transform: scale(1);
     }
 }

 @keyframes bounce {

     0%,
     20%,
     53%,
     100% {
         -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
         animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
         -webkit-transform: translateZ(0);
         transform: translateZ(0);
     }

     40%,
     43% {
         -webkit-animation-timing-function: cubic-bezier(0.755,
                 0.05,
                 0.855,
                 0.06);
         animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
         -webkit-transform: translate3d(0, -30px, 0) scaleY(1.1);
         transform: translate3d(0, -30px, 0) scaleY(1.1);
     }

     70% {
         -webkit-animation-timing-function: cubic-bezier(0.755,
                 0.05,
                 0.855,
                 0.06);
         animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
         -webkit-transform: translate3d(0, -15px, 0) scaleY(1.05);
         transform: translate3d(0, -15px, 0) scaleY(1.05);
     }

     80% {
         -webkit-transform: translateZ(0) scaleY(0.95);
         transform: translateZ(0) scaleY(0.95);
         -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
         transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
     }

     90% {
         -webkit-transform: translate3d(0, -4px, 0) scaleY(1.02);
         transform: translate3d(0, -4px, 0) scaleY(1.02);
     }
 }

 @keyframes wobble {
     0% {
         -webkit-transform: translateZ(0);
         transform: translateZ(0);
     }

     15% {
         -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg);
         transform: translate3d(-25%, 0, 0) rotate(-5deg);
     }

     30% {
         -webkit-transform: translate3d(20%, 0, 0) rotate(3deg);
         transform: translate3d(20%, 0, 0) rotate(3deg);
     }

     45% {
         -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg);
         transform: translate3d(-15%, 0, 0) rotate(-3deg);
     }

     60% {
         -webkit-transform: translate3d(10%, 0, 0) rotate(2deg);
         transform: translate3d(10%, 0, 0) rotate(2deg);
     }

     75% {
         -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg);
         transform: translate3d(-5%, 0, 0) rotate(-1deg);
     }

     100% {
         -webkit-transform: translateZ(0);
         transform: translateZ(0);
     }
 }

 .card-content.main-card h3.course-price {
     margin-block: 15px;
 }

 .card-content.main-card ul li {
     display: flex;
     gap: 10px;
 }

 .card-content.main-card ul li i {
     color: var(--secondary);
 }

 /* new header */
 .new-header {
     .header-nav {
         justify-content: space-between;
     }

     .header-navbar-rht .logged-item .log-user {
         padding: 0 !important;
         background: transparent !important;

         .users-img img {
             width: 45px;
             height: 45px;
             object-fit: cover;
             border: 1px solid #ddd;
             margin-inline-end: 8px;
         }
     }

     .user-role {
         font-size: 11px;
         color: #9e9e9e;
         font-weight: 400;
     }

     @media (990px < width < 1245px) {

         .navbar-expand-lg li:nth-child(6),
         .navbar-expand-lg li:nth-child(7) {
             display: none;
         }
     }
 }

 /* end new header */

 .new-design-content {
     .gigs-grid {
         display: flex !important;
         padding: 15px !important;
         gap: 14px;

         .gigs-img {
             height: 148px;
             background: #f3f3f3;
         }

         .gigs-content {
             align-items: start !important;
             padding: 0px !important;

             .gigs-title h3 {
                 line-clamp: 1;
                 -webkit-line-clamp: 1;
                 -webkit-box-orient: vertical;
                 margin: 0px !important;
                 margin-bottom: 6px !important;
                 height: 26px;
                 line-height: 22px;
             }

             .trainingCode,
             .notInTraining,
             .category,
             .place {
                 color: #9e9e9e;
                 font-size: 12px;
                 display: flex;
                 margin: 0 !important;
                 align-items: center;
                 justify-content: start;
                 gap: 4px;
             }

             .go-to-link {
                 color: #fff;
                 padding: 8px 20px;
                 background: var(--bs-primary);
                 border-radius: 6px;
                 display: inline-block;
                 margin-top: 7px;
                 transition: margin 0.3s ease-in-out;

                 svg {
                     margin-inline-start: 5px;
                     transition: margin 0.3s ease-in-out;

                     path {
                         fill: #fff;
                     }
                 }

                 &:hover svg {
                     margin-inline-start: 15px;
                 }
             }

             .no-certificate {
                 font-size: 12px;
                 padding: 2px;
                 width: 100%;
                 color: #9e9e9e;
                 margin: 0;
                 margin-top: 8px;
             }
         }
     }

     .gigs-grid.no-img {
         border-inline-start: 4px solid #ddd;
         margin-bottom: 18px;

         .badge.bg-primary-light {
             position: absolute !important;
             bottom: 0px !important;
             color: #fff !important;
             background: var(--primary) !important;
             margin: 0 !important;
             left: unset !important;
             right: unset !important;
             font-size: 12px !important;
             line-height: 18px !important;
             inset-inline-end: 0 !important;
             border: none !important;
             text-align: center !important;
             border-radius: 0 8px !important;
         }
     }

     .learning-ul {
         display: flex;
         align-items: center;
         justify-content: start !important;
         margin-bottom: 15px;
         border-radius: 10px;
         background: #eb710017;
         padding: 8px;

         li {
             button {
                 border: none;
                 border-radius: 8px;
                 color: #6d6d6d;
                 font-weight: 400;

                 &.active {
                     color: var(--primary);
                     background: #fff;
                 }
             }
         }
     }

     table {
         border-radius: 10px;
         overflow: hidden;
         --bs-table-bg: #f9f9f9;

         thead {
             th {
                 background: #ffffff;
                 padding: 15px;
                 border-color: #d5d5d5;
                 border-inline-end: 2px solid #f5f5f5;
             }
         }

         tbody {
             tr {
                 border-color: #ffffff;
                 border-bottom: 3px solid #fff;

                 td {
                     padding: 18px;
                     border-inline-end: 1px solid #e7e7e7;

                     &:last-child {
                         border-inline-end: 0;
                     }
                 }
             }
         }
     }
 }

 @media (width < 768px) {
     .new-design-content {
         .gigs-grid {
             .gigs-img {
                 height: auto !important;
             }
         }
     }
 }

 /* profile header */
 .profile-header {

     .container-fluid {
         max-width: unset;
     }

     #filter_form {
         width: 300px;

         .autoComplete_wrapper {
             width: 100%;
         }

         .autoComplete_wrapper>ul>li {
             text-align: start;
             font-size: 12px;
             color: #bdbdbd;
             white-space: nowrap;
             overflow: hidden;
             text-overflow: ellipsis;
             transition: all 0.2s ease;

             a {
                 color: #606060;
                 font-weight: 400;
             }

             &:hover {
                 background-color: rgb(254 238 228);
             }
         }

         input {
             border: 1px solid #e5e5e5;
             box-shadow: none;
             font-weight: 300;
             color: #9d9d9d;

             &::placeholder {
                 color: #8f8f8f;
             }
         }
     }

     @media (width < 767px) {
         #filter_form {
             display: none;
         }
     }
 }

 /* ======================== Start Of New Form ======================== */
 .page-content.with-wizard {
     padding: 50px 0;
 }

 .popular-section.with-wizard {
     padding: 0;
 }

 .wizard-steps {
     width: 100%;
 }

 .wizard-steps .wizard-step-wrap {
     display: flex;
     flex-direction: column;
     align-items: center;
     flex-shrink: 0;
 }

 .wizard-steps .wizard-step-circle {
     width: 38px;
     height: 38px;
     border-radius: 50%;
     background: transparent;
     color: #bbb;
     border: 2px solid #bbb;
     display: flex;
     align-items: center;
     justify-content: center;
     font-weight: 700;
     font-size: 15px;
     transition:
         background 0.3s,
         color 0.3s,
         border-color 0.3s;
     position: relative;
     z-index: 1;
     flex-shrink: 0;
 }

 .wizard-steps .wizard-step-wrap.active .wizard-step-circle {
     background: transparent;
     border-color: var(--primary);
     color: var(--primary);
 }

 .wizard-steps .wizard-step-wrap.completed .wizard-step-circle {
     background: var(--primary);
     border-color: var(--primary);
     color: #fff;
 }

 .wizard-steps .wizard-step-line {
     flex: 1;
     height: 2px;
     background: #ddd;
     min-width: 60px;
     align-self: flex-start;
     margin-top: 18px;
 }

 .wizard-steps .wizard-step-line.completed {
     background: var(--primary);
 }

 .wizard-step-label {
     font-size: 12px;
     font-weight: 600;
     color: #bbb;
     text-align: center;
     transition: color 0.3s;
     margin-top: 8px;
     white-space: nowrap;
 }

 .wizard-step-wrap.active .wizard-step-label {
     color: var(--primary);
 }

 .wizard-step-wrap.completed .wizard-step-label {
     color: var(--primary);
 }

 .wizard-step-panel {
     display: none;
 }

 .wizard-step-panel.active {
     display: block;
 }

 .getin_form .row {
     margin-right: -12px;
     margin-left: -12px;
 }

 .getin_form .row>[class*="col-"] {
     padding-right: 12px;
     padding-left: 12px;
 }

 .getin_form label.form-label {
     font-size: 16px;
     font-weight: 500;
     line-height: 180%;
     color: #1a1a1a;
     margin-bottom: 8px;
 }

 .getin_form input:not([type="radio"]):not([type="checkbox"]):not(.website-phone-input-control),
 .getin_form select,
 .getin_form .select2-container--default .select2-selection--single,
 .getin_form .select2-container--default .select2-selection--multiple {
     border-radius: 6px !important;
     background-color: transparent !important;
     border: 1px solid #ebedef !important;
     height: 48px !important;
     padding: 0 16px !important;
     width: 100% !important;
     display: flex;
     align-items: center;
     box-shadow: none !important;
     outline: none !important;
     transition: all 0.3s ease;
 }

 .getin_form textarea {
     border-radius: 6px !important;
     background-color: transparent !important;
     border: 1px solid #ebedef !important;
     padding: 12px 16px !important;
     width: 100% !important;
     box-shadow: none !important;
     outline: none !important;
     height: 179px !important;
     transition: all 0.3s ease;
 }

 .getin_form input:not([type="radio"]):not([type="checkbox"]):not(.website-phone-input-control):focus,
 .getin_form select:focus,
 .getin_form textarea:focus,
 .getin_form .select2-container--default.select2-container--focus .select2-selection--single,
 .getin_form .select2-container--default.select2-container--focus .select2-selection--multiple {
     border-color: var(--primary) !important;
     box-shadow: 0 0 0 1px var(--primary) !important;
     /* Adding subtle ring to ensure visibility */
     outline: none !important;
 }

 .getin_form .select2-container--default .select2-selection--single .select2-selection__rendered {
     padding-left: 0;
     padding-right: 0;
     color: #1a1a1a;
 }

 .getin_form .select2-container--default .select2-selection--single .select2-selection__arrow {
     height: 46px;
 }

 .getin_form .select2-selection__clear {
     display: none !important;
 }

 .getin_form ::placeholder {
     font-weight: 500 !important;
     font-size: 14px !important;
     line-height: 180% !important;
     color: #808080 !important;
     opacity: 1;
 }

 .getin_form .form-check {
     display: flex;
     align-items: center;
     gap: 10px;
     padding-left: 0 !important;
     padding-right: 0 !important;
     margin: 0;
 }

 .getin_form .form-check-input {
     width: 20px !important;
     height: 20px !important;
     border-color: #ebedef !important;
     cursor: pointer;
     margin: 0 !important;
     position: static !important;
 }

 .getin_form .form-check-input:checked {
     background-color: var(--primary);
     border-color: var(--primary);
 }

 .getin_form .form-check-label {
     font-size: 15px;
     font-weight: 500;
     color: #1a1a1a;
     cursor: pointer;
     margin: 0 !important;
     padding: 0 !important;
     line-height: 1;
 }

 /* Phone Input Component Fixes */
 .getin_form .website-phone-input-group {
     display: flex !important;
     align-items: stretch !important;
     border: 1px solid #ebedef !important;
     border-radius: 6px !important;
     height: 48px !important;
     background-color: transparent !important;
     padding: 0 !important;
     box-shadow: none !important;
     transition: all 0.3s ease;
     position: relative !important;
     overflow: visible !important;
 }

 .getin_form .website-phone-input-group:focus-within {
     border-color: var(--primary) !important;
     box-shadow: none !important;
     outline: none !important;
 }

 .getin_form .website-phone-input-control {
     border: none !important;
     height: 100% !important;
     flex: 1 !important;
     padding: 0 16px !important;
     background-color: transparent !important;
     box-shadow: none !important;
     outline: none !important;
     border-start-end-radius: 6px !important;
     border-end-end-radius: 6px !important;
     text-align: end !important;
 }

 [dir="ltr"] .getin_form .website-phone-input-control {
     text-align: start !important;
 }

 /* Ensure high specificity for focus state */
 .getin_form .website-phone-input-group:focus-within .website-phone-country-trigger {
     border-inline-end: 1px solid var(--primary) !important;
 }

 .getin_form label {
     font-size: 16px !important;
     font-weight: 500 !important;
     line-height: 180% !important;
     color: #1a1a1a !important;
     margin-bottom: 8px;
     display: block;
 }

 /* Navigation Buttons */
 .wizard-next-btn,
 .wizard-prev-btn,
 .getin_form .btn-primary {
     width: 148px !important;
     height: 48px !important;
     border-radius: 6px !important;
     display: flex !important;
     align-items: center !important;
     justify-content: center !important;
     font-weight: 600 !important;
     font-size: 16px !important;
     transition: all 0.3s ease !important;
     cursor: pointer;
 }

 .wizard-next-btn,
 .getin_form .btn-primary {
     background-color: var(--primary) !important;
     color: #fff !important;
     border: none !important;
 }

 .wizard-prev-btn {
     background-color: #fff !important;
     color: var(--primary) !important;
     border: 1px solid var(--primary) !important;
 }

 .wizard-next-btn:hover,
 .getin_form .btn-primary:hover {
     opacity: 0.9;
 }

 .wizard-prev-btn:hover {
     background-color: var(--primary) !important;
     color: #fff !important;
 }

 .wizard-navigation-buttons {
     display: flex;
     justify-content: flex-start;
     gap: 16px;
     margin-top: 30px;
 }

 .upload-dropbox {
     border: 1px solid #e7e9eb;
     border-radius: 6px;
     padding: 30px 20px;
     text-align: center;
     cursor: pointer;
     transition: all 0.3s ease;
     background: #fbfbfb;
     position: relative;
     width: 100%;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
 }

 .upload-dropbox:hover {
     border-color: var(--primary);
 }

 .upload-dropbox.has-file {
     border-color: var(--primary);
     background: #fff;
 }

 .dropbox-label {
     cursor: pointer;
     margin-bottom: 0;
     width: 100%;
 }

 .dropbox-icon {
     font-size: 32px;
     color: var(--primary);
     background: #fff;
     width: 54px;
     height: 54px;
     border-radius: 10px;
     display: flex;
     align-items: center;
     justify-content: center;
     margin: 0 auto 15px;
     border: 1px solid #ebedef;
     transition: all 0.3s ease;
 }

 .upload-dropbox.has-file .dropbox-icon {
     background: var(--primary);
     color: #fff;
     border-color: var(--primary);
 }

 .dropbox-text {
     font-weight: 600;
     font-size: 16px;
     color: var(--primary);
     margin-bottom: 5px;
 }

 .dropbox-subtext {
     font-size: 13px;
     color: #808080;
     transition: all 0.3s ease;
 }

 .upload-dropbox.has-file .dropbox-subtext {
     color: var(--primary);
     font-weight: 500;
 }

 .popular-section,
 .blog-form,
 .getin_form {
     overflow: visible !important;
 }

 .cms-multiselect-hidden {
     display: none !important;
 }

 .cms-wrapper {
     position: relative;
     width: 100%;
     font-size: 14px;
 }

 /* The visible trigger box */
 .cms-trigger {
     display: flex !important;
     align-items: center !important;
     height: 48px !important;
     border: 1px solid #ebedef !important;
     border-radius: 6px !important;
     padding: 0 40px 0 10px !important;
     cursor: pointer !important;
     background: transparent !important;
     transition:
         border-color 0.25s,
         box-shadow 0.25s;
     flex-wrap: nowrap !important;
     gap: 6px;
     position: relative !important;
     user-select: none !important;
     overflow-x: auto !important;
     overflow-y: hidden !important;
 }

 /* Subtle Horizontal Scrollbar for trigger */
 .cms-trigger::-webkit-scrollbar {
     height: 2px;
 }

 .cms-trigger::-webkit-scrollbar-thumb {
     background: var(--primary) !important;
     border-radius: 4px;
 }

 .cms-wrapper.is-open .cms-trigger,
 .cms-trigger:focus-within {
     border-color: var(--primary);
     box-shadow: 0 0 0 1px var(--primary);
     outline: none;
 }

 /* Chevron arrow */
 .cms-trigger::after {
     content: "\F285";
     /* Chevron Down icon */
     font-family: "bootstrap-icons" !important;
     position: absolute;
     right: 14px;
     top: 50%;
     transform: translateY(-50%) rotate(0deg) !important;
     /* Force reset */
     font-size: 14px;
     color: #808080;
     pointer-events: none;
     transition:
         transform 0.2s,
         color 0.15s;
 }

 .cms-wrapper.is-open .cms-trigger::after {
     content: "\F282";
     /* Chevron Up icon */
     transform: translateY(-50%) rotate(0deg) !important;
     /* Force reset */
 }

 /* Placeholder text shown when nothing is selected */
 .cms-placeholder {
     color: #808080;
     font-size: 14px;
     font-weight: 500;
     line-height: 180%;
     padding: 0 4px;
     display: none;
 }

 .cms-placeholder.is-visible {
     display: block;
 }

 .cms-single-label {
     color: #1a1a1a;
     font-size: 14px;
     font-weight: 500;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
     flex: 1;
 }

 /* Individual selected tags */
 .cms-tag {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     background-color: color-mix(in srgb, var(--primary), white 90%);
     border: 1px solid color-mix(in srgb, var(--primary), white 80%);
     color: var(--primary);
     border-radius: 4px;
     padding: 3px 8px 3px 10px;
     font-size: 13px;
     font-weight: 500;
     max-width: 200px;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
 }

 .cms-tag-label {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
 }

 .cms-tag-remove {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     width: 16px;
     height: 16px;
     border-radius: 50%;
     background: transparent;
     border: none;
     cursor: pointer;
     color: color-mix(in srgb, var(--primary), black 20%);
     font-size: 14px;
     line-height: 1;
     padding: 0;
     flex-shrink: 0;
     transition:
         background 0.15s,
         color 0.15s;
 }

 .cms-tag-remove:hover {
     background: color-mix(in srgb, var(--primary), white 70%);
     color: #c00;
 }

 /* Dropdown panel */
 .cms-dropdown {
     display: none;
     position: absolute;
     top: calc(100% + 4px);
     left: 0;
     right: 0;
     z-index: 9999;
     background: #fff;
     border: 1px solid #ebedef;
     border-radius: 8px;
     box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
     overflow: hidden;
 }

 .cms-wrapper.is-open .cms-dropdown {
     display: block;
 }

 /* Search inside dropdown */
 .cms-search-wrap {
     padding: 10px 10px 6px;
     border-bottom: 1px solid #ebedef;
 }

 .cms-search {
     width: 100%;
     height: 36px !important;
     border: 1px solid #ebedef !important;
     border-radius: 6px !important;
     padding: 0 12px !important;
     font-size: 13px !important;
     background: #f7f8fa !important;
     outline: none !important;
     box-sizing: border-box !important;
     transition: border-color 0.2s;
 }

 .cms-search:focus {
     border-color: var(--primary) !important;
 }

 .cms-search-wrap {
     position: relative;
 }

 /* Options list */
 .cms-options {
     max-height: 220px;
     overflow-y: auto;
     padding: 6px 0;
     scrollbar-width: thin;
     scrollbar-color: var(--primary) transparent;
 }

 .cms-options::-webkit-scrollbar {
     width: 3px;
 }

 .cms-options::-webkit-scrollbar-thumb {
     background: var(--primary) !important;
     border-radius: 4px;
 }

 .cms-option {
     display: flex;
     align-items: center;
     gap: 10px;
     padding: 9px 14px;
     cursor: pointer;
     font-size: 14px;
     color: #1a1a1a;
     transition: background 0.12s;
 }

 .cms-option:hover,
 .cms-option.is-focused {
     background: #f7f8fa;
 }

 .cms-option.is-selected {
     background: color-mix(in srgb, var(--primary), white 94%);
 }

 /* Custom checkbox inside each option */
 .cms-option-check {
     width: 18px;
     height: 18px;
     border-radius: 4px;
     border: 1.5px solid #ebedef;
     flex-shrink: 0;
     display: flex;
     align-items: center;
     justify-content: center;
     transition:
         background 0.15s,
         border-color 0.15s;
     font-size: 11px;
     color: #fff;
 }

 .cms-option.is-selected .cms-option-check {
     background: var(--primary);
     border-color: var(--primary);
 }

 .cms-option-label {
     flex: 1;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
 }

 /* Empty state */
 .cms-empty {
     padding: 20px 14px;
     text-align: center;
     font-size: 13px;
     color: #aaa;
     display: none;
 }

 /* Footer summary */
 .cms-footer {
     border-top: 1px solid #ebedef;
     padding: 8px 14px;
     font-size: 12px;
     color: #808080;
     display: flex;
     align-items: center;
     justify-content: space-between;
 }

 .cms-footer-clear {
     font-size: 12px;
     color: var(--primary);
     cursor: pointer;
     font-weight: 500;
     border: none;
     background: none;
     padding: 0;
     transition: opacity 0.15s;
 }

 .cms-footer-clear:hover {
     opacity: 0.75;
 }

 .cms-footer-clear:disabled {
     color: #ccc;
     cursor: default;
 }

 /* Disabled state */
 .cms-wrapper.is-disabled .cms-trigger {
     background: #f7f8fa !important;
     cursor: not-allowed;
     opacity: 0.7;
 }

 /* ======================== End Of New Form ======================== */

 /* ===== Start Of Custom Datepicker Styles ===== */
 .custom-datepicker-wrap {
     position: relative;
     width: 100%;
 }

 .custom-datepicker-trigger {
     display: flex !important;
     align-items: center !important;
     justify-content: space-between !important;
     width: 100% !important;
     padding: 0 16px !important;
     border: 1px solid #ebedef !important;
     border-radius: 6px !important;
     background: transparent !important;
     cursor: pointer !important;
     font-size: 14px !important;
     color: #1a1a1a !important;
     transition: all 0.3s ease !important;
     height: 48px !important;
     box-sizing: border-box !important;
 }

 .custom-datepicker-trigger:hover {
     border-color: #d1d5db !important;
 }

 .custom-datepicker-trigger:focus,
 .custom-datepicker-wrap.is-open .custom-datepicker-trigger {
     outline: none !important;
     border-color: var(--primary) !important;
     box-shadow: 0 0 0 1px var(--primary) !important;
 }

 .custom-datepicker-trigger.is-invalid {
     border-color: #ef4444 !important;
     box-shadow: 0 0 0 1px #ef4444 !important;
 }

 .datepicker-display-value {
     color: #1a1a1a;
     font-size: 14px;
     font-weight: 500;
 }

 .datepicker-display-value.is-placeholder {
     color: #808080 !important;
 }

 .datepicker-icon {
     color: #808080;
     display: flex;
     align-items: center;
     flex-shrink: 0;
 }

 .custom-datepicker-dropdown {
     position: absolute;
     top: calc(100% + 6px);
     left: 0;
     z-index: 9999;
     background: #fff;
     border: 1px solid #ebedef;
     border-radius: 8px;
     box-shadow:
         0 8px 30px rgba(0, 0, 0, 0.12),
         0 2px 8px rgba(0, 0, 0, 0.06);
     width: 300px;
     padding: 16px;
     box-sizing: border-box;
 }

 .datepicker-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 14px;
     gap: 8px;
 }

 .datepicker-header-center {
     display: flex;
     align-items: center;
     gap: 6px;
     flex: 1;
     justify-content: center;
 }

 .datepicker-nav-btn {
     background: none;
     border: 1px solid #ebedef;
     border-radius: 6px;
     width: 30px;
     height: 30px;
     display: flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
     color: #1a1a1a;
     flex-shrink: 0;
     padding: 0;
     transition:
         background 0.15s,
         border-color 0.15s;
 }

 .datepicker-nav-btn:hover {
     background: #f7f8fa;
     border-color: #ebedef;
     color: var(--primary);
 }

 .datepicker-month-select,
 .datepicker-year-select {
     border: 1px solid #ebedef;
     border-radius: 6px;
     padding: 4px 6px;
     font-size: 13px;
     font-weight: 600;
     color: #1a1a1a;
     background: #fff;
     cursor: pointer;
     appearance: none;
     -webkit-appearance: none;
     text-align: center;
     transition: border-color 0.15s;
 }

 .datepicker-month-select {
     min-width: 90px;
 }

 .datepicker-year-select {
     min-width: 60px;
 }

 .datepicker-month-select:focus,
 .datepicker-year-select:focus {
     outline: none;
     border-color: var(--primary);
 }

 .datepicker-weekdays {
     display: grid;
     grid-template-columns: repeat(7, 1fr);
     margin-bottom: 6px;
 }

 .datepicker-weekday {
     text-align: center;
     font-size: 11px;
     font-weight: 600;
     color: #808080;
     padding: 4px 0;
     text-transform: uppercase;
     letter-spacing: 0.04em;
 }

 .datepicker-days-grid {
     display: grid;
     grid-template-columns: repeat(7, 1fr);
     gap: 2px;
 }

 .dp-day {
     text-align: center;
     padding: 7px 2px;
     font-size: 13px;
     border-radius: 6px;
     cursor: pointer;
     color: #1a1a1a;
     transition:
         background 0.12s,
         color 0.12s;
     border: none;
     background: none;
     width: 100%;
     line-height: 1;
 }

 .dp-day:hover:not(.dp-day-empty):not(.dp-day-selected) {
     background: #f7f8fa;
 }

 .dp-day-today:not(.dp-day-selected) {
     font-weight: 700;
     color: var(--primary);
     background: color-mix(in srgb, var(--primary), white 92%);
     border-radius: 6px;
 }

 .dp-day-selected {
     background: var(--primary);
     color: #fff !important;
     font-weight: 600;
     border-radius: 6px;
 }

 .dp-day-empty {
     cursor: default;
 }

 .dp-day-other-month {
     color: #ccc;
 }

 .datepicker-footer {
     display: flex;
     justify-content: space-between;
     margin-top: 14px;
     padding-top: 12px;
     border-top: 1px solid #ebedef;
     gap: 8px;
 }

 .datepicker-today-btn,
 .datepicker-clear-btn {
     background: none;
     border: 1px solid #ebedef;
     border-radius: 6px;
     padding: 5px 12px;
     font-size: 12px;
     cursor: pointer;
     transition: all 0.15s ease;
 }

 .datepicker-today-btn {
     color: var(--primary);
     border-color: color-mix(in srgb, var(--primary), white 70%);
 }

 .datepicker-today-btn:hover {
     background: color-mix(in srgb, var(--primary), white 92%);
     border-color: var(--primary);
 }

 .datepicker-clear-btn {
     color: #ef4444;
     border-color: #fecaca;
 }

 .datepicker-clear-btn:hover {
     background: #fef2f2;
     border-color: #ef4444;
 }

 /* RTL support */
 [dir="rtl"] .custom-datepicker-dropdown {
     left: auto;
     right: 0;
 }

 [dir="rtl"] .datepicker-nav-btn svg {
     transform: rotate(180deg);
 }

 /* ===== End Of Custom Datepicker Styles ===== */

 .breadcrumb-bar.course-braedcrumb {
     background-image: url(../img/bg/bread-image.png);
     background-repeat: no-repeat;
     position: relative;
 }