/* @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&family=Urbanist:wght@300;400;500;600;700&display=swap"); */
html {
background: #fafafa;
}
body {
font-family: "Urbanist", sans-serif;
}
.overflow-style-none::-webkit-scrollbar {
display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
.overflow-style-none {
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
}
/* width */
.scroll-style-1::-webkit-scrollbar {
width: 2px;
}
/* Track */
.scroll-style-1::-webkit-scrollbar-track {
background: #f1f1f1;
}
/* Handle */
.scroll-style-1::-webkit-scrollbar-thumb {
background: #8e8e8e;
}
/* Handle on hover */
.scroll-style-1::-webkit-scrollbar-thumb:hover {
background: #8e8e8e;
}
.layout-wrapper .sidebar-wrapper {
left: -308px;
transition: left 0.5s ease-in-out;
}
.layout-wrapper.active .sidebar-wrapper {
left: 0;
}
.layout-wrapper .sidebar-wrapper-collapse {
left: 0;
transition: left 0.5s ease-in-out;
}
.layout-wrapper.active .sidebar-wrapper-collapse {
left: -120px;
}
.layout-wrapper .body-wrapper {
/*margin-left: 96px;*/
transition: margin-left 0.5s ease-in-out;
}
.layout-wrapper.active .body-wrapper {
margin-left: 208px;
}
.upgrade-wrapper .upgrade-banner {
background-repeat: no-repeat;
background-size: cover;
}
.layout-wrapper.active .body-wrapper .drawer-btn {
opacity: 0;
transition: opacity 0.5s ease-in-out;
}
.layout-wrapper .body-wrapper .drawer-btn {
opacity: 100;
transition: opacity 0.5s ease-in-out;
}
.layout-wrapper.active .body-wrapper .header-wrapper {
width: calc(100% - 308px);
transition: width 0.5s ease-in-out;
}
.layout-wrapper .body-wrapper .header-wrapper {
width: calc(100% - 96px);
transition: width 0.5s ease-in-out;
}
.progess-bar .bonus-per .bonus-outer {
width: 80px;
height: 80px;
border-radius: 50%;
padding: 10px;
box-shadow: 100px 100px 100px 100px #e4e4e4 inset;
}
.progess-bar .bonus-per .bonus-inner {
width: 60px;
height: 60px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background: white;
}
.progess-bar .bonus-per svg {
position: absolute;
left: 0;
top: 0;
}
.progess-bar .bonus-per svg circle {
fill: none;
stroke: #22c55e;
stroke-width: 9px;
stroke-dasharray: 215;
}
.card-slider .slick-dots {
display: flex;
justify-content: center;
margin-top: 10px;
}
.card-slider .slick-dots button {
width: 10px;
height: 4px;
border-radius: 50px;
text-indent: 1000px;
overflow: hidden;
background: #a0aec0;
margin-right: 4px;
transition: 1s all ease-in-out;
}
.card-slider .slick-dots .slick-active button {
width: 24px;
background: #1a202c;
}
.mini-calender-wrapper .flatpickr-calendar {
box-shadow: none;
}
.mini-calender-wrapper
.flatpickr-calendar
:is(.flatpickr-time, .flatpickr-months) {
display: none;
}
.mini-calender-wrapper
:is(.flatpickr-calendar, .flatpickr-innerContainer, .flatpickr-rContainer, .flatpickr-days, .dayContainer) {
width: 100%;
min-width: 100%;
}
.mini-calender-wrapper
.flatpickr-calendar
.flatpickr-innerContainer
.flatpickr-rContainer {
padding: 26px;
border-radius: 18px;
background: #f7fafc;
}
.dark .flatpickr-calendar{
background: #1D1E24;
}
.dark .mini-calender-wrapper
.flatpickr-calendar
.flatpickr-innerContainer
.flatpickr-rContainer {
background: #23262B;
border-color: #2A313C;
}
.mini-calender-wrapper
.flatpickr-calendar
.flatpickr-innerContainer
.flatpickr-rContainer
.flatpickr-weekdays
.flatpickr-weekdaycontainer
.flatpickr-weekday {
color: #b7b7b7;
font-weight: 600;
font-size: 14px;
}
.mini-calender-wrapper
.flatpickr-calendar
.flatpickr-innerContainer
.flatpickr-rContainer
.flatpickr-weekdays {
margin-bottom: 5px;
}
.dark .mini-calender-wrapper
.flatpickr-calendar
.flatpickr-innerContainer
.flatpickr-rContainer
.flatpickr-days
.dayContainer
.flatpickr-day {
color: #ffffff;
}
.mini-calender-wrapper
.flatpickr-calendar
.flatpickr-innerContainer
.flatpickr-rContainer
.flatpickr-days
.dayContainer
.flatpickr-day {
color: #000000;
font-size: 16px;
font-weight: 600;
margin-bottom: 8px;
}
.mini-calender-wrapper
.flatpickr-calendar
.flatpickr-innerContainer
.flatpickr-rContainer
.flatpickr-days
.dayContainer
.flatpickr-day.prevMonthDay {
color: #b7b7b7;
font-weight: 400;
}
.mini-calender-wrapper
.flatpickr-calendar
.flatpickr-innerContainer
.flatpickr-rContainer
.flatpickr-days
.dayContainer
.flatpickr-day.nextMonthDay {
color: #b7b7b7;
font-weight: 400;
}
.mini-calender-wrapper
.flatpickr-calendar
.flatpickr-innerContainer
.flatpickr-rContainer
.flatpickr-days
.dayContainer
.flatpickr-day.today,
.mini-calender-wrapper
.flatpickr-calendar
.flatpickr-innerContainer
.flatpickr-rContainer
.flatpickr-days
.dayContainer
.flatpickr-day.today.selected {
background: #22c55e;
color: #ffffff;
border: none;
border-radius: 8px;
}
.mini-calender-wrapper
.flatpickr-calendar
.flatpickr-innerContainer
.flatpickr-rContainer
.flatpickr-days
.dayContainer
.flatpickr-day.selected {
background: none;
border: 1px solid #22c55e;
border-radius: 8px;
}
.dark .fc-daygrid-dot-event .fc-event-title{
color: white;
}
canvas {
position: relative;
z-index: 1;
}
/* Modal */
/* Hide scrollbar */
body.modal-open {
overflow: hidden;
}
.modal {
z-index: 9999;
}
.modal-overlay {
z-index: -1;
}
/* Settings Tab */
.tab {
cursor: pointer;
transition: background-color 0.2s ease-in-out;
}
.tab.active {
background-color: #f7fafc;
color: #1e293b;
}
.dark .tab.active {
background-color: #23262B;
}
.dark .tab .tab-icon {
background-color: #23262B;
color: white;
}
.tab.active .tab-icon {
background-color: #22c55e;
color: white;
}
.tab-pane {
display: none;
}
.tab-pane.active {
display: block;
}
/* Accordion */
.accordion-content {
transition: max-height 0.3s ease-out, padding 0.3s ease;
}
/* Custom Quill Editor */
.custom-quill .ql-toolbar.ql-snow {
background-color: #fafafa;
border: 1px solid #e2e8f0;
color: white;
padding: 16px 24px;
border-radius: 8px 8px 0 0;
}
.dark .custom-quill .ql-toolbar.ql-snow {
background-color: #E2E8F0;
border: #2A313C;
}
.custom-quill .ql-toolbar.ql-snow .ql-formats {
color: hsl(0, 0%, 100%);
}
.ql-container.ql-snow {
border: 1px solid #e2e8f0;
}
/* Quill Two */
.custom-quill-2 .ql-container.ql-snow {
background-color: #ffffff;
border-radius: 8px 8px 0 0;
border-bottom: 0;
}
.dark .custom-quill .ql-container.ql-snow {
background-color: #1D1E24;
border-color: #2A313C;
}
.dark .custom-quill-2 .ql-container.ql-snow {
background-color: #1D1E24;
border-color: #2A313C;
}
.custom-quill-2 .ql-toolbar.ql-snow {
padding: 16px 20px;
background: #fafafa;
border-radius: 0 0 8px 8px;
border: 1px solid #e2e8f0;
}
.dark .custom-quill-2 .ql-toolbar.ql-snow {
background: #1D1E24;
border-color: #2A313C;
}
.dark .ql-editor{
color: white;
}
/* for calender */
.fc .fc-daygrid .fc-non-business {
background-color: white ;
}
.dark .fc .fc-daygrid .fc-non-business {
background-color: #23262B ;
}
.fc .fc-col-header-cell .fc-col-header-cell-cushion {
font-weight: 600;
font-size: 20px;
line-height: 24px;
color: #22c55e;
}
.fc-day-sun .fc-col-header-cell-cushion,
.fc-day-sun a.fc-daygrid-day-number {
color: #ff4747 !important;
}
.fc-day-sat,
.fc-day-sat a.fc-daygrid-day-number {
color: #ff4747 !important;
}
.fc-button-group button.fc-dayGridMonth-button.fc-button.fc-button-primary,
.fc-button-group button.fc-timeGridWeek-button.fc-button.fc-button-primary,
.fc-button-group button.fc-timeGridDay-button.fc-button.fc-button-primary,
.fc-button-group button.fc-listMonth-button.fc-button.fc-button-primary {
display: none !important;
}
button.fc-button.fc-button-primary.fc-next-button,
button.fc-button.fc-button-primary.fc-prev-button {
border: 1px solid gray;
padding: 10px 5px;
border-radius: 5px;
margin-right: 2px;
outline: none;
}
.MiddletitleButton {
display: flex;
}
.fc-toolbar-title {
color: #1a202c ;
font-size: 18px !important;
font-weight: bold !important;
}
.dark .fc-toolbar-title {
color: white;
}
.fc-header-toolbar {
margin-bottom: 24px !important;
}
.fc td,
.fc th {
border-style: none !important;
}
.fc-scrollgrid {
padding-top: 20px !important ;
border-top: 1px solid #e4f2ff !important ;
}
.dark .fc-scrollgrid {
border-top: 1px solid #2A313C!important ;
}
.fc-scrollgrid td:last-of-type {
border-right: none !important;
}
.fc-day:first-child > div:first-child {
position: relative;
}
#calendar td {
vertical-align: middle !important;
border: 1px solid #000;
}
.fc {
text-align: center !important;
}
.fc td {
padding: 0;
vertical-align: middle !important;
}
.fc-day .fc-daygrid-day-frame {
position: relative !important;
}
.fc-day .fc-daygrid-day-frame .fc-daygrid-day-number {
position: absolute !important;
top: 50% !important;
left: 0px !important;
right: 0px !important;
text-align: center !important;
margin-top: -0.5em !important;
line-height: 1em !important;
font-weight: 500;
font-size: 18px;
color: #2f3032;
}
.dark .fc-day .fc-daygrid-day-frame .fc-daygrid-day-number {
color: white;
}
.fc .fc-daygrid .fc-day-today .fc-daygrid-day-frame {
border: 2px solid #b7ffd1 !important;
background: none !important;
}
.fc .fc-day-today {
background: none !important;
}
/* .fc .fc-timegrid .fc-daygrid-day{
background: none !important;
} */
.fc .fc-timegrid .fc-timegrid-slot.fc-timegrid-slot-lane {
border: 1px solid #cbd5e0 !important;
}
.fc .fc-non-business {
background: none !important;
}
.fc .fc-daygrid .fc-timegrid-col {
background: none !important;
border: none !important;
}
.fc .fc-daygrid .fc-day-today .fc-daygrid-day-frame {
border-radius: 6px;
}
.fc .fc-scrollgrid.fc-scrollgrid-liquid {
border: none;
}
.fc .fc-view-harness{
width: 100% !important;
height: 800px !important;
}
.fc .fc-scrollgrid-sync-table{
width: 100% !important;
height: 100% !important;
}
.fc table.fc-col-header {
width: 100% !important;
}
.fc .fc-daygrid-body.fc-daygrid-body-unbalanced {
width: 100% !important;
height: 100% !important;
}
:is(.sidebar-wrapper, .sidebar-wrapper-collapse)
.sidebar-body
.item-wrapper
ul
li.item,
:is(.sidebar-wrapper, .sidebar-wrapper-collapse)
.sidebar-body
.item-wrapper
ul
li.item
.item-ico
svg
.path-1,
:is(.sidebar-wrapper, .sidebar-wrapper-collapse)
.sidebar-body
.item-wrapper
ul
li.item
.item-ico
svg
.path-2 {
transition: all 0.3s ease-in-out;
}
:is(.sidebar-wrapper, .sidebar-wrapper-collapse)
.sidebar-body
.item-wrapper
ul
li.item:hover
.item-ico
svg
.path-1,
:is(.sidebar-wrapper, .sidebar-wrapper-collapse)
.sidebar-body
.item-wrapper
ul
li.item:hover {
fill: #22c55e;
color: #22c55e;
}
:is(.sidebar-wrapper, .sidebar-wrapper-collapse)
.sidebar-body
.item-wrapper
ul
li.item:hover
.item-ico
svg
.path-2 {
fill: #b7ffd1;
}
.sidebar-wrapper .sidebar-body .nav-wrapper ul li.item .sub-menu {
display: none;
animation: tabFade 1s;
}
.sidebar-wrapper .sidebar-body .nav-wrapper ul li.item .sub-menu.active {
display: block;
}
@keyframes tabFade {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.sidebar-wrapper-collapse .sidebar-body .nav-wrapper ul li.item {
position: relative;
}
.sidebar-wrapper-collapse .sidebar-body .nav-wrapper ul li.item .sub-menu {
position: absolute;
left: 100%;
top: 0;
z-index: 10;
display: none;
}
.sidebar-wrapper-collapse
.sidebar-body
.nav-wrapper
ul
li.item:hover
.sub-menu {
display: block;
}
/* TODO: ===============RESPONSIVE */
:is(.dark .sidebar-wrapper, .dark .sidebar-wrapper-collapse)
.sidebar-body
.item-wrapper
ul
li.item
.item-ico
svg
.path-1,
:is(.dark .sidebar-wrapper, .dark .sidebar-wrapper-collapse)
.sidebar-body
.item-wrapper
ul
li.item {
fill: #FFFFFF;
color: #FFFFFF;
}
:is(.dark .sidebar-wrapper, .dark .sidebar-wrapper-collapse)
.sidebar-body
.item-wrapper
ul
li.item:hover
.item-ico
svg
.path-1,
:is(.dark .sidebar-wrapper, .dark .sidebar-wrapper-collapse)
.sidebar-body
.item-wrapper
ul
li.item:hover {
fill: #27DA68;
color: #27DA68;
}
:is(.dark .sidebar-wrapper, .dark .sidebar-wrapper-collapse)
.sidebar-body
.item-wrapper
ul
li.item:hover
.item-ico
svg
.path-2 {
fill: #16A34A;
}
@media (max-width: 1536px) {
}
@media (max-width: 1280px) {
}
@media (max-width: 1024px) {
.fc .fc-view-harness{
width: 100% !important;
height: 600px !important;
}
.layout-wrapper.active .sidebar-wrapper-collapse {
left: 0;
}
.layout-wrapper.active .body-wrapper {
margin-left: 0;
}
.layout-wrapper.active .body-wrapper .header-wrapper {
width: calc(100% - 96px);
transition: all 0.5s ease-in-out;
}
}
@media (max-width: 768px) {
}
@media (max-width: 640px) {
.fc .fc-view-harness{
width: 100% !important;
height: 400px !important;
}
}
@media (max-width: 426px) {
.layout-wrapper.active .body-wrapper {
margin-left: 0;
}
.layout-wrapper.active .body-wrapper .drawer-btn {
opacity: 1;
}
.layout-wrapper .body-wrapper {
margin-left: 0;
}
.layout-wrapper.active .sidebar-wrapper {
left: -308px;
}
.layout-wrapper .sidebar-wrapper {
left: 0;
}
.layout-wrapper .sidebar-wrapper + .aside-overlay {
left: 0;
}
.layout-wrapper.active .sidebar-wrapper + .aside-overlay {
left: -100%;
}
}
/* TODO: ===============RESPONSIVE END */
.dark .jvm-container{
background-color: #23262B!important;
border-color: #2A313C;
}
/* Slider Pagination */
.trust-pagination {
top: 150px;
}
.trust-pagination.swiper-pagination.swiper-pagination-bullets
.swiper-pagination-bullet {
background-color: #22c55e;
opacity: 0.2;
width: 12px;
height: 12px;
transition: all 0.4s;
}
.trust-pagination.swiper-pagination.swiper-pagination-bullets
.swiper-pagination-bullet-active {
background-color: #22c55e;
opacity: 1;
width: 14px;
height: 14px;
}
/* slide active */
.swiper-slide-active > div {
border-radius: 12px;
border: 1px solid var(--stock-color, #cbcbcb);
background: var(--white-v-1, #fff);
border-bottom: 7px solid #22c55e;
}
.swiper-slide-next > div {
border-bottom: 7px solid #facc15;
}
.moving-element > img:nth-child(1) {
animation: linear 20s animationFramesOne infinite;
}
.moving-element > img:nth-child(2) {
animation: linear 20s animationFramesTwo infinite;
}
.moving-element > img:nth-child(3) {
animation: linear 25s animationFramesThree infinite;
}
.moving-element > img:nth-child(4) {
animation: linear 25s animationFramesFour infinite;
}
.moving-element > img:nth-child(5) {
animation: linear 25s animationFramesFive infinite;
}
.moving-element > img:nth-child(6) {
animation: linear 20s animationFramesTwo infinite;
}
.moving-element > img:nth-child(7) {
animation: linear 25s animationFramesFour infinite;
}
.moving-element > img:nth-child(8) {
animation: linear 20s animationFramesOne infinite;
}
.moving-element > img:nth-child(9) {
animation: linear 25s animationFramesThree infinite;
}
.moving-element > img:nth-child(10) {
animation: linear 25s animationFramesFive infinite;
}
.moving-element > img:nth-child(11) {
animation: linear 25s animationFramesTwo infinite;
}
.moving-element > img:nth-child(12) {
animation: linear 20s animationFramesOne infinite;
}
.moving-element > img:nth-child(13) {
animation: linear 25s animationFramesFive infinite;
}
.moving-element > img:nth-child(14) {
animation: linear 25s animationFramesFour infinite;
}
.moving-element > img:nth-child(15) {
animation: linear 20s animationFramesOne infinite;
}
.moving-element > img:nth-child(16) {
animation: linear 25s animationFramesFive infinite;
}
.moving-element > img:nth-child(17) {
animation: linear 25s animationFramesThree infinite;
}
.moving-element > img:nth-child(18) {
animation: linear 20s animationFramesTwo infinite;
}
.moving-element > img:nth-child(19) {
animation: linear 25s animationFramesFour infinite;
}
.moving-element > img:nth-child(20) {
animation: linear 20s animationFramesTwo infinite;
}
.moving-element > img:nth-child(21) {
animation: linear 20s animationFramesOne infinite;
}
@keyframes animationFramesOne {
0% {
transform: translate(0px, 0px) rotate(0deg);
}
20% {
transform: translate(73px, -1px) rotate(36deg);
}
40% {
transform: translate(141px, 72px) rotate(72deg);
}
60% {
transform: translate(83px, 122px) rotate(108deg);
}
80% {
transform: translate(-40px, 72px) rotate(144deg);
}
100% {
transform: translate(0px, 0px) rotate(0deg);
}
}
@keyframes animationFramesTwo {
0% {
transform: translate(0px, 0px) rotate(0deg) scale(1);
}
20% {
transform: translate(73px, -1px) rotate(36deg) scale(0.9);
}
40% {
transform: translate(141px, 72px) rotate(72deg) scale(1);
}
60% {
transform: translate(83px, 122px) rotate(108deg) scale(1.2);
}
80% {
transform: translate(-40px, 72px) rotate(144deg) scale(1.1);
}
100% {
transform: translate(0px, 0px) rotate(0deg) scale(1);
}
}
@keyframes animationFramesThree {
0% {
transform: translate(165px, -179px);
opacity: 1;
}
96% {
opacity: 1;
}
100% {
transform: translate(-346px, 617px);
opacity: 0;
}
}
@keyframes animationFramesFour {
0% {
transform: translate(-300px, 151px) rotate(0deg);
opacity: 1;
}
96% {
opacity: 1;
}
100% {
transform: translate(251px, -200px) rotate(180deg);
opacity: 0;
}
}
@keyframes animationFramesFive {
0% {
transform: translate(61px, -99px) rotate(0deg);
}
21% {
transform: translate(4px, -190px) rotate(38deg);
}
41% {
transform: translate(-139px, -200px) rotate(74deg);
}
60% {
transform: translate(-263px, -164px) rotate(108deg);
}
80% {
transform: translate(-195px, -49px) rotate(144deg);
}
100% {
transform: translate(-1px, 0px) rotate(180deg);
}
}
@media (max-width: 1280px) {
.overFlowHidden {
overflow: hidden !important;
}
}