@charset "UTF-8";
/**
 * @license
 *
 * Font Family: Satoshi
 * Designed by: Deni Anggara
 * URL: https://www.fontshare.com/fonts/satoshi
 * © 2023 Indian Type Foundry
 *
 * Font Styles:
 * Satoshi Variable(Variable font)
 * Satoshi Variable Italic(Variable font)
 * Satoshi Light
 * Satoshi Light Italic
 * Satoshi Regular
 * Satoshi Italic
 * Satoshi Medium
 * Satoshi Medium Italic
 * Satoshi Bold
 * Satoshi Bold Italic
 * Satoshi Black
 * Satoshi Black Italic
 *
*/
/**
* This is a variable font
* You can controll variable axes as shown below:
* font-variation-settings: 'wght' 900.0;
*
* available axes:

* 'wght' (range from 300.0 to 900.0)

*/
@font-face {
  font-family: "Satoshi-Variable";
  src: url("../static/assets/fonts/Satoshi-Variable.woff2") format("woff2"), url("../static/assets/fonts/Satoshi-Variable.woff") format("woff"), url("../static/assets/fonts/Satoshi-Variable.ttf") format("truetype");
  font-weight: 300 900;
  font-display: swap;
  font-style: normal;
}
/**
* This is a variable font
* You can controll variable axes as shown below:
* font-variation-settings: 'wght' 900.0;
*
* available axes:

* 'wght' (range from 300.0 to 900.0)

*/
@font-face {
  font-family: "Satoshi-VariableItalic";
  src: url("../static/assets/fonts/Satoshi-VariableItalic.woff2") format("woff2"), url("../static/assets/fonts/Satoshi-VariableItalic.woff") format("woff"), url("../static/assets/fonts/Satoshi-VariableItalic.ttf") format("truetype");
  font-weight: 300 900;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: "Satoshi-Light";
  src: url("../static/assets/fonts/Satoshi-Light.woff2") format("woff2"), url("../static/assets/fonts/Satoshi-Light.woff") format("woff"), url("../static/assets/fonts/Satoshi-Light.ttf") format("truetype");
  font-weight: 300;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "Satoshi-LightItalic";
  src: url("../static/assets/fonts/Satoshi-LightItalic.woff2") format("woff2"), url("../static/assets/fonts/Satoshi-LightItalic.woff") format("woff"), url("../static/assets/fonts/Satoshi-LightItalic.ttf") format("truetype");
  font-weight: 300;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: "Satoshi-Regular";
  src: url("../static/assets/fonts/Satoshi-Regular.woff2") format("woff2"), url("../static/assets/fonts/Satoshi-Regular.woff") format("woff"), url("../static/assets/fonts/Satoshi-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "Satoshi-Italic";
  src: url("../static/assets/fonts/Satoshi-Italic.woff2") format("woff2"), url("../static/assets/fonts/Satoshi-Italic.woff") format("woff"), url("../static/assets/fonts/Satoshi-Italic.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: "Satoshi-Medium";
  src: url("../static/assets/fonts/Satoshi-Medium.woff2") format("woff2"), url("../static/assets/fonts/Satoshi-Medium.woff") format("woff"), url("../static/assets/fonts/Satoshi-Medium.ttf") format("truetype");
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "Satoshi-MediumItalic";
  src: url("../static/assets/fonts/Satoshi-MediumItalic.woff2") format("woff2"), url("../static/assets/fonts/Satoshi-MediumItalic.woff") format("woff"), url("../static/assets/fonts/Satoshi-MediumItalic.ttf") format("truetype");
  font-weight: 500;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: "Satoshi-Bold";
  src: url("../static/assets/fonts/Satoshi-Bold.woff2") format("woff2"), url("../static/assets/fonts/Satoshi-Bold.woff") format("woff"), url("../static/assets/fonts/Satoshi-Bold.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "Satoshi-BoldItalic";
  src: url("../static/assets/fonts/Satoshi-BoldItalic.woff2") format("woff2"), url("../static/assets/fonts/Satoshi-BoldItalic.woff") format("woff"), url("../static/assets/fonts/Satoshi-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: "Satoshi-Black";
  src: url("../static/assets/fonts/Satoshi-Black.woff2") format("woff2"), url("../static/assets/fonts/Satoshi-Black.woff") format("woff"), url("../static/assets/fonts/Satoshi-Black.ttf") format("truetype");
  font-weight: 900;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "Satoshi-BlackItalic";
  src: url("../static/assets/fonts/Satoshi-BlackItalic.woff2") format("woff2"), url("../static/assets/fonts/Satoshi-BlackItalic.woff") format("woff"), url("../static/assets/fonts/Satoshi-BlackItalic.ttf") format("truetype");
  font-weight: 900;
  font-display: swap;
  font-style: italic;
}
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  overflow-x: hidden !important;
  font-family: "Satoshi-Variable", sans-serif !important;
  background-color: #FFFFFF;
  scroll-behavior: smooth;
}
body h1, body h2, body h3, body h4, body h5, body p {
  padding: 0;
  margin: 0;
}

.topNavigation {
  display: flex;
  border-bottom: 1.2px solid #dedede;
  width: 100%;
  position: relative;
  gap: 2rem;
  height: 4rem;
  align-items: center;
}
.topNavigation .topLastWrapper {
  display: flex;
  position: absolute;
  right: 3rem;
  gap: 5rem;
}
.topNavigation .logoContainer {
  border-right: 1.2px solid #dedede;
  height: 4rem;
  display: flex;
  align-items: center;
  width: 14rem;
}
.topNavigation .logoContainer .logo {
  height: 3.2rem;
  display: flex;
  margin-left: 1.5rem;
}
.topNavigation .navigationItems {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.topNavigation .navigationItems .activeNav {
  color: #296EB4;
}
.topNavigation .navigationItems .navBtn {
  border: 1.2px solid #dedede;
  transition: all 0.3s ease-in-out;
}
.topNavigation .navigationItems .navBtn:hover {
  background-color: #296EB4;
  color: #fff;
  border: 1.2px solid #296EB4;
}
.topNavigation .navigationItems li {
  list-style: none;
}
.topNavigation .navigationItems li a {
  display: flex;
  font-size: 0.8rem;
  color: hwb(0 10% 90%/0.842);
  height: 2rem;
  align-items: center;
  padding: 0 0.5rem;
  border-radius: 4px;
  text-decoration: none;
  font-family: "Satoshi-Medium";
  gap: 0.3rem;
  transition: color 0.3s ease-in-out;
}
.topNavigation .navigationItems li a span {
  display: flex;
  height: 0.8rem;
  width: 0.8rem;
}
.topNavigation .navigationItems li a:hover {
  color: #296EB4;
}
.topNavigation .searchContainer {
  display: flex;
  height: 2rem;
  width: 16rem;
  position: relative;
  align-items: center;
}
.topNavigation .searchContainer .searchIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 1.5rem;
  width: 1.5rem;
  position: absolute;
  left: 0.5rem;
}
.topNavigation .searchContainer input:focus {
  border: 1.2px solid #296EB4;
  background-color: rgba(172, 214, 255, 0.0901960784);
}
.topNavigation .searchContainer input {
  width: 100%;
  height: 100%;
  border: 1.2px solid #dedede;
  border-radius: 4px;
  font-family: "Satoshi-Medium";
  padding-left: 2.5rem;
  outline: none;
}
.topNavigation .shortcutItems {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.topNavigation .shortcutItems div {
  height: 1rem;
  width: 1rem;
}
.topNavigation .shortcutItems div span {
  display: flex;
  height: 100%;
  width: 100%;
  align-items: center;
  justify-content: center;
}
.topNavigation .shortcutItems div span img {
  height: 100%;
  width: 100%;
}
.topNavigation .accountDisplay {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.topNavigation .accountDisplay .accountName {
  font-family: "Satoshi-Medium";
  font-size: 0.8rem;
}
.topNavigation .accountDisplay .avatar {
  display: flex;
  height: 2rem;
  width: 2rem;
}

.myContainer {
  display: flex;
  overflow-y: auto;
  margin-top: 2rem;
  justify-content: space-between;
  position: absolute;
  right: 0;
  padding-bottom: 2rem;
  width: calc(100% - 14rem);
  /* background-color: red; */
  left: 15rem;
  margin-right: 15rem;
}
.myContainer .navigationBtns {
  display: flex;
  margin-top: 2rem;
  height: -moz-fit-content;
  height: fit-content;
  width: -moz-fit-content;
  width: fit-content;
  gap: 1rem;
}
.myContainer .navigationBtns .previousBtn {
  border-radius: 0.25rem;
  border: 1px solid var(--Dashboard-Main, #296EB4);
  background: rgba(41, 110, 180, 0.49);
  color: #fff;
}
.myContainer .navigationBtns .nextBtn {
  border-radius: 0.25rem;
  background: var(--Dashboard-Main, #296EB4);
  color: #fff;
}
.myContainer .navigationBtns a {
  display: flex;
  height: 2.2rem;
  align-items: center;
  justify-content: center;
  align-items: center;
  padding: 0 1rem;
  font-size: 0.75rem;
  font-family: "Satoshi-Bold";
  text-decoration: none;
  gap: 0.5rem;
}
.myContainer .navigationBtns a span {
  display: flex;
  height: 1rem;
  width: 1rem;
  align-items: center;
  justify-content: center;
}
.myContainer .myContainerWrapper {
  width: 95%;
  margin-inline: auto;
  display: flex;
  justify-content: space-between;
  align-items: left;
  gap: 2rem;
  background-color: #F9F9F9;
  flex-direction: column;
  padding: 0.5rem;
  height: fit-content;
  
}
.myContainer .myContainerWrapper .navigationIndicator {
  display: flex;
  border-radius: 0.625rem;
  border: 1px solid rgba(41, 110, 180, 0.15);
  background: #F4F7FB;
  padding: 0.5rem;
  padding-bottom: 0;
  margin-bottom: 0;
}
.myContainer .myContainerWrapper .navigationIndicator li.uk-active {
  background-color: #296EB4;
  border-radius: 4px;
  color: #fff;
}
.myContainer .myContainerWrapper .navigationIndicator li.uk-active a {
  color: #fff !important;
}
.myContainer .myContainerWrapper .navigationIndicator .navigationWrapper {
  display: flex;
}
.myContainer .myContainerWrapper .navigationIndicator .navigationWrapper .navItems {
  display: flex;
  flex-direction: column;
  list-style-type: none;
  padding: 0;
  gap: 0.5rem;
}
.myContainer .myContainerWrapper .navigationIndicator .navigationWrapper .navItems a:hover {
  border: 1.2px solid #296EB4;
}
.myContainer .myContainerWrapper .navigationIndicator .navigationWrapper .navItems a {
  border-radius: 0.25rem;
  border: 1.2px solid rgba(41, 111, 180, 0);
  color: #000000;
  font-size: 0.75rem;
  border-radius: 10px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  padding-left: 0.5rem;
  text-transform: capitalize;
  display: flex;
  height: 2.5rem;
  align-items: center;
  font-size: 0.75rem;
  text-decoration: none;
  font-family: "Satoshi-Bold";
  width: 15rem;
  position: relative;
}
.myContainer .myContainerWrapper .navigationIndicator .navigationWrapper .navItems a .iconCloser {
  position: absolute;
  right: 0.5rem;
}
.myContainer .myContainerWrapper .navigationIndicator .navigationWrapper .navItems a .sliderCountNumber {
  display: flex;
  height: 2rem;
  min-width: 2rem;
  min-height: 2rem;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: var(--Dashboard-Icon, #464646);
  font-family: Satoshi;
  font-size: 0.63144rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-transform: capitalize;
  margin-right: 0.5rem;
  border-radius: 1.20231rem;
  border: 1.031px solid rgba(70, 70, 70, 0.12);
  background: rgba(247, 247, 247, 0.59);
}
.myContainer .formWrapper {
  display: flex;
  width: 60%;
  flex-direction: column;
}
.myContainer .formWrapper .topWrapper .mainHeading {
  font-size: 2rem;
  font-family: "Satoshi-Black";
  width: 60%;
  color: #333;
}
.

.formWrapper .topWrapper .mainHeading span {
  color: #296EB4;
}
.myContainer .formWrapper .topWrapper .suheading {
  margin-top: 0.5rem;
  width: 60%;
  font-size: 0.9rem;
  font-family: "Satoshi-Medium";
}
.myContainer .formWrapper form {
  margin-top: 2rem;
}
.myContainer .formWrapper form .formInputWrapper > * {
  width: 50%;
}
.myContainer .formWrapper form .formInputWrapper {
  display: flex;
  gap: 1rem;
  width: 100%;
}
.myContainer .formWrapper form .formInputWrapper .inputsContained {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.myContainer .formWrapper form .formInputWrapper .secondaryInputsWrapper {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.myContainer .formWrapper form .formInputWrapper .inputWrapped {
  height: -moz-fit-content;
  height: fit-content;
  display: flex;
  position: relative;
  flex-direction: column;
}
.myContainer .formWrapper form .formInputWrapper .inputWrapped .countryDrop {
  position: absolute;
  bottom: 0.5rem;
  right: 0.5rem;
}
.myContainer .formWrapper form .formInputWrapper .inputWrapped input {
  display: flex;
  height: 2.2rem;
  padding-left: 0.5rem;
  border-radius: 0.25rem;
  border: 1px solid #e2e2e2;
  background: #FFF;
  margin-top: 0.5rem;
  outline: none;
}
.myContainer .formWrapper form .formInputWrapper .inputWrapped input:focus {
  border: 1px solid #296EB4;
  background-color: rgba(41, 111, 180, 0.0745098039);
}
.myContainer .formWrapper form .formInputWrapper .inputWrapped ::-moz-placeholder {
  font-size: 0.8rem;
  font-family: "Satoshi-Medium";
  text-transform: capitalize;
}
.myContainer .formWrapper form .formInputWrapper .inputWrapped ::placeholder {
  font-size: 0.8rem;
  font-family: "Satoshi-Medium";
  text-transform: capitalize;
}
.myContainer .formWrapper form .formInputWrapper .inputWrapped .inputDisplayName {
  font-size: 0.75rem;
  font-family: "Satoshi-Bold";
  color: #333;
  margin-left: 0.5rem;
  padding: 0;
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
}

.mainWrapperContainer {
  display: flex;
}
.mainWrapperContainer .sideNavigation {
  border-right: 1.2px solid #dedede;
  width: 14rem;
  position: absolute;
  bottom: 0;
  height: calc(100dvh - 4rem);
}
.mainWrapperContainer .sideNavigation .sideWrapper {
  width: 90%;
  border-radius: 10px;
  margin-inline: auto;
  margin-top: 2rem;
}
.mainWrapperContainer .sideNavigation .sideWrapper .topMenu {
  background-color: rgba(41, 111, 180, 0.05);
  padding: 0.5rem;
  border-radius: 4px;
}
.mainWrapperContainer .sideNavigation .sideWrapper .menuHeading {
  font-size: 0.7rem;
  font-family: "Satoshi-Bold";
  padding: 0;
  color: rgba(26, 26, 26, 0.546);
  margin: 0;
}
.mainWrapperContainer .sideNavigation .sideWrapper .helpMenu {
  margin-top: 1rem;
  background-color: rgba(41, 111, 180, 0.05);
  padding: 0.5rem;
  border-radius: 4px;
}
.mainWrapperContainer .sideNavigation .sideWrapper .helpMenu .helpHeading {
  font-size: 0.7rem;
  font-family: "Satoshi-Bold";
  padding: 0;
  color: rgba(26, 26, 26, 0.546);
  margin: 0;
}
.mainWrapperContainer .sideNavigation .sideWrapper .bottomDarkModeToggle {
  display: none;
}
.mainWrapperContainer .sideNavigation .sideWrapper .sideNavLinks {
  list-style: none;
  padding: 0;
  margin-top: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.mainWrapperContainer .sideNavigation .sideWrapper .sideNavLinks .uk-nav-sub a {
  font-size: 0.7rem;
  text-transform: capitalize;
  color: #1a1a1a;
  font-family: "Satoshi-Medium";
  gap: 0.1rem !important;
  padding-left: unset !important;
  transition: all 0.3s ease-in-out;
}
.mainWrapperContainer .sideNavigation .sideWrapper .sideNavLinks .uk-nav-sub a:hover {
  color: #296EB4;
}
.mainWrapperContainer .sideNavigation .sideWrapper .sideNavLinks .active {
  background-color: #296EB4;
  border: 1.2px solid #296EB4;
  color: #FFFFFF;
}
.mainWrapperContainer .sideNavigation .sideWrapper .sideNavLinks .active span {
  background-color: #fff;
}
.mainWrapperContainer .sideNavigation .sideWrapper .sideNavLinks .active:hover {
  background-color: #296EB4;
  border: 1.2px solid #296EB4;
  color: #FFFFFF;
}
.mainWrapperContainer .sideNavigation .sideWrapper .sideNavLinks .active:hover span {
  background-color: #fff;
}
.mainWrapperContainer .sideNavigation .sideWrapper .sideNavLinks a {
  font-size: 0.8rem;
  display: flex;
  height: 2rem;
  padding-left: 0.5rem;
  border-radius: 4px;
  text-decoration: none;
  align-items: center;
  gap: 0.5rem;
  font-family: "Satoshi-Medium";
  border: 1.2px solid rgba(41, 111, 180, 0);
  color: rgba(26, 26, 26, 0.8);
  transition: all 0.3s ease-in-out;
  position: relative;
}
.mainWrapperContainer .sideNavigation .sideWrapper .sideNavLinks a .iconDrop {
  position: absolute;
  right: 0.5rem;
}
.mainWrapperContainer .sideNavigation .sideWrapper .sideNavLinks a .linkIcon {
  background-color: unset !important;
  height: 0.9rem;
  width: 0.9rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mainWrapperContainer .sideNavigation .sideWrapper .sideNavLinks a .linkIcon img {
  height: 100%;
  width: 100%;
}
.mainWrapperContainer .sideNavigation .sideWrapper .sideNavLinks a:hover {
  background-color: #cee7ff;
  border: 1.2px solid #8cc4ff;
}

.dashboardMainDisplay {
  width: 85%;
  max-width: 1250px;
  margin-inline: auto;
}
.dashboardMainDisplay .topContainer {
  margin-top: 2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.dashboardMainDisplay .topContainer .balanceDisplay {
  display: flex;
  flex-direction: column;
  min-width: 4rem;
  position: relative;
}
.dashboardMainDisplay .topContainer .balanceDisplay span {
  display: flex;
  font-size: 0.8rem;
  font-style: normal;
  font-family: "Satoshi-Bold";
  font-weight: 500;
  line-height: normal;
  position: absolute;
  right: 0;
  top: 0;
  width: -moz-fit-content;
  width: fit-content;
}
.dashboardMainDisplay .topContainer .balanceDisplay .Balance {
  padding-top: 1rem;
  font-family: "Satoshi-Black";
  position: relative;
  right: 0;
  font-size: 1.65781rem;
  font-style: normal;
  margin-left: 1rem;
  font-weight: 900;
  line-height: 135.189%; /* 2.24119rem */
  color: #F09000;
}
.dashboardMainDisplay .topContainer .breadcrumbContainer {
  height: -moz-fit-content;
  height: fit-content;
}
.dashboardMainDisplay .topContainer .breadcrumbContainer nav {
  padding-bottom: unset !important;
  margin-bottom: unset !important;
}
.dashboardMainDisplay .topContainer .breadcrumbContainer nav .activeLinkDashboard span {
  font-family: "Satoshi-Bold";
  color: #296EB4;
}
.dashboardMainDisplay .topContainer .breadcrumbContainer .wrapper {
  display: flex;
  flex-direction: column;
}
.dashboardMainDisplay .topContainer .breadcrumbContainer .wrapper .welcomeMessage {
  padding: 0;
  font-family: "Satoshi-Medium";
  color: #1a1a1a;
  margin: 0;
  margin-top: -0.5rem;
  height: -moz-fit-content;
  height: fit-content;
  font-size: 1.3rem;
}
.dashboardMainDisplay .topContainer .breadcrumbContainer .wrapper .welcomeMessage span {
  font-size: 1.3rem;
  font-family: "Satoshi-Black";
  color: #16154D;
}
.dashboardMainDisplay .kpiContainer {
  margin-top: 1.5rem;
}
.dashboardMainDisplay .kpiContainer .flexWrapper {
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div {
  background-color: #F9F9F9;
  width: 35%;
  border-radius: 10px;
  padding-bottom: 1rem;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .mainCardContainer {
  padding: 0 2rem;
  margin-top: 0.5rem;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .mainCardContainer .bottomCardContainer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 1rem;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .mainCardContainer .bottomCardContainer .graphGrowthDisplay {
  display: flex;
  align-items: center;
  gap: 0.312rem;
  border-radius: 0.25rem;
  background: rgba(41, 110, 180, 0.05);
  padding: 0.3rem;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .mainCardContainer .bottomCardContainer .graphGrowthDisplay span {
  display: flex;
  align-items: center;
  width: 1.2rem;
  height: 1.2rem;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .mainCardContainer .bottomCardContainer .graphGrowthDisplay p {
  font-size: 0.7rem;
  font-family: "Satoshi-Medium";
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .mainCardContainer .bottomCardContainer .viewKPIBtn:hover {
  background-color: #184572;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .mainCardContainer .bottomCardContainer .viewKPIBtn:hover span {
  transform: translateX(0.3rem);
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .mainCardContainer .bottomCardContainer .viewKPIBtn {
  display: flex;
  background-color: #296EB4;
  color: #fff;
  font-family: "Satoshi-Bold";
  height: 2.3rem;
  font-size: 0.8rem;
  align-items: center;
  padding: 0 1rem;
  text-decoration: none;
  gap: 0.5rem;
  border-radius: 10rem;
  transition: all 0.3s ease-in-out;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .mainCardContainer .bottomCardContainer .viewKPIBtn span {
  display: flex;
  height: 1rem;
  width: 1rem;
  align-items: center;
  justify-content: center;
  padding: 0.1rem;
  transition: all 0.3s ease-in-out;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .mainCardContainer .bottomCardContainer .viewKPIBtn span img {
  height: 100%;
  height: 100%;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .mainCardContainer .cardValueDisplay {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .mainCardContainer .cardValueDisplay .dealsValueTop {
  margin-top: 1rem;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .mainCardContainer .cardValueDisplay .dealsValueTop .availableDeals {
  font-size: 0.8rem;
  font-family: "Satoshi-Medium";
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .mainCardContainer .cardValueDisplay .dealsValueTop .dealsAvailable h2 {
  font-size: 2.1875rem;
  font-family: "Satoshi-Black";
  color: #16154D;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .mainCardContainer .cardValueDisplay .optionsDropDateView a {
  font-size: 0.7rem;
  font-weight: 600;
  display: flex;
  gap: 0.2rem;
  height: 2rem;
  background-color: #eee;
  display: flex;
  color: rgba(26, 26, 26, 0.7450980392);
  align-items: center;
  padding: 0 0.5rem;
  text-decoration: none;
  border-radius: 4px;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .topCardContaier {
  border-bottom: 1.2px solid #dedede;
  display: flex;
  align-items: center;
  height: 3rem;
  padding: 0 2rem;
  justify-content: space-between;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .topCardContaier .cardDescription {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .topCardContaier .cardDescription p {
  font-family: "Satoshi-Bold";
  color: #333;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .topCardContaier .cardDescription .newDisplay {
  display: flex;
  font-size: 0.6rem;
  background-color: #296EB4;
  color: #fff;
  border-radius: 10rem;
  height: 1rem;
  font-family: "Satoshi-Medium";
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 0.5rem;
  align-items: center;
  justify-content: center;
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .topCardContaier .cardDescription .iconContainer {
  height: 1.3rem;
  width: 1.3rem;
  border-radius: 50%;
  justify-content: center;
  display: flex;
  align-items: center;
  background: rgba(41, 110, 180, 0.15);
}
.dashboardMainDisplay .kpiContainer .flexWrapper > div .topCardContaier .dotsOptions {
  display: flex;
  height: 1rem;
  width: 1rem;
  align-items: center;
}

.hotDealsCompWatch {
  margin-top: 1.5rem;
  display: flex;
  flex-direction: row-reverse;
  gap: 2rem;
}
.hotDealsCompWatch .comparisonWatchWrapper {
  border-radius: 4px;
  height: -moz-fit-content;
  height: fit-content;
  width: 100%;
  position: relative;
}
.hotDealsCompWatch .comparisonWatchWrapper .cardHeading {
  font-size: 1.3rem;
  font-family: "Satoshi-Bold";
  margin-top: 1rem;
  color: #1a1a1a;
}
.hotDealsCompWatch .comparisonWatchWrapper .pieChartContainer {
  margin-inline: unset;
  width: 100%;
}
.hotDealsCompWatch .discoverHotDeals {
  min-width: 60%;
  height: 23rem;
  padding-right: 1rem;
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals {
  display: flex;
  justify-content: space-between;
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .creditCardDisplay {
  padding: 0 2rem;
  width: 60%;
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .creditCardDisplay .heading {
  margin-top: 2rem;
  font-size: 1.2rem;
  font-family: "Satoshi-Bold";
  color: #1a1a1a;
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .creditCardDisplay .cardContainer {
  display: flex;
  margin-top: 2rem;
  width: 100%;
  height: 15rem;
  gap: 1rem;
  align-items: end;
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .creditCardDisplay .cardContainer .pieChartWrapper {
  display: flex;
  transform: translateY(-1.5rem);
  height: 14rem;
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .creditCardDisplay .cardContainer .keyContainer {
  display: flex;
  height: 6rem;
  width: 12rem;
  margin-left: 1rem;
  transform: translateY(-6rem);
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .creditCardDisplay .cardContainer .keyContainer img {
  height: 100%;
  width: 100%;
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .dealsMore {
  width: 40%;
  position: relative;
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .dealsMore .spanheading {
  display: flex;
  background-color: #F09000;
  color: #fff;
  font-family: "Satoshi-Medium";
  width: -moz-fit-content;
  width: fit-content;
  font-size: 0.7rem;
  height: 1.2rem;
  align-items: center;
  border-radius: 10rem;
  margin-left: 1.5rem;
  margin-top: 1rem;
  padding: 0 0.5rem;
  align-items: center;
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .dealsMore .spanheading #svgIcon {
  margin-left: 0.2rem;
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .dealsMore::before {
  content: "";
  position: absolute;
  height: 12rem;
  width: 100%;
  bottom: 0;
  z-index: 2;
  background: linear-gradient(0deg, #F1F1F1 0%, rgba(241, 241, 241, 0) 100%);
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .dealsScroll {
  list-style: none;
  width: 100%;
  height: 15rem;
  overflow-y: scroll;
  position: relative;
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .dealsScroll a {
  text-decoration: none;
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .discoverAllDeals {
  display: flex;
  background-color: #296EB4;
  height: 2.5rem;
  text-decoration: none;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 1rem;
  align-items: center;
  font-size: 0.75rem;
  margin-inline: auto;
  border-radius: 10rem;
  color: #fff;
  font-family: "Satoshi-Bold";
  position: relative;
  z-index: 3;
  gap: 0.5rem;
  transform: translateY(-1rem);
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .discoverAllDeals span {
  display: flex;
  align-items: center;
  height: 1rem;
  width: 1rem;
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .dealDescription .heading {
  font-size: 0.9rem;
  color: #1a1a1a;
  font-family: "Satoshi-Bold";
}
.hotDealsCompWatch .discoverHotDeals .wrapperHotDeals .dealDescription .description {
  font-size: 0.75rem;
  font-family: "Satoshi-Medium";
  margin-top: 0.5rem;
  max-width: 95%;
  color: rgba(26, 26, 26, 0.801);
}

.hotDealsCompWatch > div {
  background-color: #F9F9F9;
  height: 100%;
}

.globalReachPortfolio {
  margin-top: 1rem;
}
.globalReachPortfolio .ReachBackground {
  height: 100%;
  display: flex;
}
.globalReachPortfolio .globalPortfolioWrapper > div {
  background-color: #F9F9F9;
  height: 20rem;
}
.globalReachPortfolio .globalPortfolioWrapper > div .cardHeading {
  padding-left: 2rem;
}
.globalReachPortfolio .globalPortfolioWrapper {
  display: flex;
  gap: 2rem;
}
.globalReachPortfolio .globalPortfolioWrapper .cardHeading {
  width: -moz-fit-content;
  width: fit-content;
  font-size: 1.5rem;
  font-family: "Satoshi-Bold";
  color: #1a1a1a;
  margin-top: 1rem;
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer {
  width: 40%;
  position: relative;
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer .sessionsCountry {
  background-color: rgba(242, 242, 242, 0.6980392157);
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 14rem;
  padding-bottom: 0.5rem;
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer .sessionsCountry .topContainer {
  display: flex;
  padding: 0 0.5rem;
  align-items: top;
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer .sessionsCountry .topContainer span {
  display: flex;
  font-size: 1.1rem;
  font-family: "Satoshi-Medium";
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer .sessionsCountry .topContainer .optionsToggle {
  display: flex;
  height: 1rem;
  width: 1rem;
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer .sessionsCountry .topSessionFilter {
  background-color: #eee;
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
  margin-top: 0.5rem;
  margin-left: 0.5rem;
  color: #1a1a1a;
  font-family: "Satoshi-Regular";
  font-weight: 400;
  border: 0.2px solid #dedede;
  border-radius: 4px;
  text-decoration: none !important;
  padding: 0.24831rem 0.20644rem;
  justify-content: center;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.7rem;
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer .sessionsCountry .topSessionFilter span {
  display: flex;
  height: 0.8rem;
  width: 0.8rem;
  align-items: center;
  justify-content: center;
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer .sessionsCountry .countryListDescription:before {
  content: "";
  position: absolute;
  height: 10rem;
  width: 100%;
  background: linear-gradient(0deg, #F1F1F1 0%, rgba(241, 241, 241, 0) 100%);
  bottom: 0;
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer .sessionsCountry .countryListDescription {
  display: flex;
  margin-top: 1rem;
  border-bottom: 1.2px solid #dedede;
  flex-direction: column;
  gap: 1rem;
  list-style: none;
  padding: 0;
  padding-bottom: 1rem;
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer .sessionsCountry .countryListDescription li {
  height: 1.5rem;
  padding: 0 0.5rem;
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer .sessionsCountry .countryListDescription li a {
  display: flex;
  height: 100%;
  width: 100%;
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer .sessionsCountry .countryListDescription li a span {
  display: flex;
  height: 100%;
  width: 100%;
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer .sessionsCountry .description {
  padding: 0 0.5rem;
  position: relative;
  z-index: 2;
  margin-top: -1.5rem;
  text-align: center;
  font-size: 0.75rem;
  font-family: "Satoshi-Medium";
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer .sessionsCountry .viewFullCountryList {
  display: flex;
  background-color: #296EB4;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 1rem;
  height: 2.2rem;
  align-items: center;
  font-size: 0.75rem;
  font-family: "Satoshi-Bold";
  border-radius: 10rem;
  color: #fff;
  gap: 0.5rem;
  margin-inline: auto;
  margin-top: 0.5rem;
  position: relative;
  z-index: 3;
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer .sessionsCountry .viewFullCountryList span {
  display: flex;
  height: 1rem;
  width: 1rem;
  align-items: center;
  justify-content: center;
}
.globalReachPortfolio .globalPortfolioWrapper .globalReachContainer .sessionsCountry .viewFullCountryList span img {
  height: 100%;
  width: 100%;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper {
  width: 60%;
  display: flex;
  gap: 1rem;
  position: relative;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .graphDisplayContainer {
  width: 60%;
  height: 100%;
  position: relative;
  padding-left: 2rem;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .graphDisplayContainer .investHeading {
  font-size: 1.5rem;
  font-family: "Satoshi-Bold";
  color: #1a1a1a;
  margin-top: 1rem;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .graphDisplayContainer .graphWrapper {
  height: 70%;
  width: 90%;
  position: absolute;
  bottom: 0;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .graphDisplayContainer .graphWrapper span {
  display: flex;
  width: 100%;
  height: 100%;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .graphDisplayContainer .graphWrapper span img {
  height: 100%;
  width: 100%;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .assetsManagment {
  display: flex;
  flex-direction: column;
  background-color: #F1F1F1;
  border-radius: 4px;
  width: 35%;
  height: -moz-fit-content;
  height: fit-content;
  padding: 1rem 0;
  position: absolute;
  bottom: 0;
  right: 0;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .assetsManagment .assetsWrapper .cardSubHeading {
  font-size: 1rem;
  padding: 0 0.5rem;
  font-family: "Satoshi-Bold";
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  display: flex;
  gap: 0.5rem;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .assetsManagment .assetsWrapper .cardSubHeading span {
  background-color: #296EB4;
  display: flex;
  height: 1.2rem;
  width: -moz-fit-content;
  width: fit-content;
  font-size: 0.6rem;
  align-items: center;
  color: #fff;
  padding: 0 0.6rem;
  border-radius: 10rem;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .assetsManagment .listedStockOptions {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .assetsManagment .listedStockOptions li {
  height: 3rem;
  width: 90%;
  margin-inline: auto;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .assetsManagment .listedStockOptions li a {
  display: flex;
  align-items: center;
  position: relative;
  gap: 0.5rem;
  height: 100%;
  width: 100%;
  text-decoration: none;
  background-color: #fff;
  border-radius: 5px;
  padding-left: 0.5rem;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .assetsManagment .listedStockOptions li a .CompanyName {
  font-size: 0.8rem;
  color: #1a1a1a;
  font-family: "Satoshi-Bold";
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .assetsManagment .listedStockOptions li a .stockGrowth {
  position: absolute;
  right: 0.5rem;
  display: flex;
  align-items: center;
  gap: 0.2rem;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .assetsManagment .listedStockOptions li a .stockGrowth .chartDisplay {
  display: flex;
  display: flex;
  height: 1.5rem;
  width: 1.5rem;
  align-items: center;
  justify-content: center;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .assetsManagment .listedStockOptions li a .stockGrowth .chartDisplay img {
  height: 100%;
  width: 100%;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .assetsManagment .listedStockOptions li a .stockGrowth .percentageGrowth {
  font-size: 0.6rem;
  font-family: "Satoshi-Bold";
  color: #1C7630;
}
.globalReachPortfolio .globalPortfolioWrapper .investmentPortfolioWrapper .assetsManagment .listedStockOptions li a .logoContainer {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(0, 176, 240, 0.0705882353);
  height: 2.3rem;
  width: 2.3rem;
  border-radius: 50%;
}

.pieChartContainer {
  display: flex;
  flex-direction: column;
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-fit-content;
  height: fit-content;
  background-color: #F9F9F9;
  position: relative;
  padding-bottom: 1.5rem;
  border-radius: 4px;
  display: flex;
  align-items: unset !important;
}
.pieChartContainer .keyDealsComponent {
  display: flex;
  height: -moz-fit-content;
  height: fit-content;
  width: 95%;
  margin-top: 1.5rem;
  margin-inline: auto;
  gap: 2rem;
}
.pieChartContainer .keyDealsComponent a:hover {
  background-color: #16154D;
}
.pieChartContainer .keyDealsComponent a:hover .uk-icon {
  color: #fff;
}
.pieChartContainer .keyDealsComponent a:hover .numberAvailable {
  color: white;
  opacity: 0.9;
}
.pieChartContainer .keyDealsComponent a:hover p {
  color: #cee7ff;
}
.pieChartContainer .keyDealsComponent a {
  display: flex;
  flex-direction: column;
  width: 35%;
  gap: 0.5rem;
  border: 1.2px solid #e7e7e7;
  border-radius: 4px;
  padding: 0.5rem 0;
  text-decoration: none;
  align-items: center;
  transition: all 0.3s ease-in-out;
}
.pieChartContainer .keyDealsComponent a .uk-icon {
  color: #16154D;
}
.pieChartContainer .keyDealsComponent a .numberAvailable {
  margin-top: 0.5rem;
  font-family: "Satoshi-Bold";
  font-size: 0.75rem;
  width: 50%;
  text-align: center;
  color: #1a1a1a;
}
.pieChartContainer .keyDealsComponent a p {
  font-family: "Satoshi-Black";
  font-size: 1.2rem;
  color: #296EB4;
}
.pieChartContainer .dealsWrapper {
  background-color: unset !important;
  background-color: #fff !important;
  margin-top: 1rem;
  margin-left: 0.5rem;
  height: -moz-fit-content;
  height: fit-content;
  width: 95%;
  padding: 0.5rem 0;
}
.pieChartContainer .dealsWrapper .cardValueDisplay {
  width: 100%;
}
.pieChartContainer .topCardContaier {
  border-bottom: 1.2px solid #dedede;
  display: flex;
  align-items: center;
  height: 3rem;
  padding: 0 2rem;
  justify-content: space-between;
}
.pieChartContainer .topCardContaier .cardDescription {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.pieChartContainer .topCardContaier .cardDescription p {
  font-family: "Satoshi-Bold";
  color: #333;
}
.pieChartContainer .topCardContaier .cardDescription .newDisplay {
  display: flex;
  font-size: 0.6rem;
  background-color: #296EB4;
  color: #fff;
  border-radius: 10rem;
  height: 1rem;
  font-family: "Satoshi-Medium";
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 0.5rem;
  align-items: center;
  justify-content: center;
}
.pieChartContainer .topCardContaier .cardDescription .iconContainer {
  height: 1.3rem;
  width: 1.3rem;
  border-radius: 50%;
  justify-content: center;
  display: flex;
  align-items: center;
  background: rgba(41, 110, 180, 0.15);
}
.pieChartContainer .topCardContaier .dotsOptions {
  display: flex;
  height: 1rem;
  width: 1rem;
  align-items: center;
}
.pieChartContainer .mainCardContainer {
  padding: 0 2rem;
  margin-top: 0.5rem;
}
.pieChartContainer .mainCardContainer .bottomCardContainer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 1rem;
}
.pieChartContainer .mainCardContainer .bottomCardContainer .graphGrowthDisplay {
  display: flex;
  align-items: center;
  gap: 0.312rem;
  border-radius: 0.25rem;
  background: rgba(41, 110, 180, 0.05);
  padding: 0.3rem;
}
.pieChartContainer .mainCardContainer .bottomCardContainer .graphGrowthDisplay span {
  display: flex;
  align-items: center;
  width: 1.2rem;
  height: 1.2rem;
}
.pieChartContainer .mainCardContainer .bottomCardContainer .graphGrowthDisplay p {
  font-size: 0.7rem;
  font-family: "Satoshi-Medium";
}
.pieChartContainer .mainCardContainer .bottomCardContainer .viewKPIBtn:hover {
  background-color: #184572;
}
.pieChartContainer .mainCardContainer .bottomCardContainer .viewKPIBtn:hover span {
  transform: translateX(0.3rem);
}
.pieChartContainer .mainCardContainer .bottomCardContainer .viewKPIBtn {
  display: flex;
  background-color: #296EB4;
  color: #fff;
  font-family: "Satoshi-Bold";
  height: 2.3rem;
  font-size: 0.8rem;
  align-items: center;
  padding: 0 1rem;
  text-decoration: none;
  gap: 0.5rem;
  border-radius: 10rem;
  transition: all 0.3s ease-in-out;
}
.pieChartContainer .mainCardContainer .bottomCardContainer .viewKPIBtn span {
  display: flex;
  height: 1rem;
  width: 1rem;
  align-items: center;
  justify-content: center;
  padding: 0.1rem;
  transition: all 0.3s ease-in-out;
}
.pieChartContainer .mainCardContainer .bottomCardContainer .viewKPIBtn span img {
  height: 100%;
  height: 100%;
}
.pieChartContainer .mainCardContainer .cardValueDisplay {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.pieChartContainer .mainCardContainer .cardValueDisplay .dealsValueTop {
  margin-top: 1rem;
}
.pieChartContainer .mainCardContainer .cardValueDisplay .dealsValueTop .availableDeals {
  font-size: 0.8rem;
  font-family: "Satoshi-Medium";
}
.pieChartContainer .mainCardContainer .cardValueDisplay .dealsValueTop .dealsAvailable h2 {
  font-size: 2.1875rem;
  font-family: "Satoshi-Black";
  color: #16154D;
}
.pieChartContainer .mainCardContainer .cardValueDisplay .optionsDropDateView a {
  font-size: 0.7rem;
  font-weight: 600;
  display: flex;
  gap: 0.2rem;
  height: 2rem;
  background-color: #eee;
  display: flex;
  color: rgba(26, 26, 26, 0.7450980392);
  align-items: center;
  padding: 0 0.5rem;
  text-decoration: none;
  border-radius: 4px;
}

.uploadContentscontainer .uploadWrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background-color: #dedede;
  margin-top: 1.5rem;
  height: 20rem;
  width: 35rem;
}
.uploadContentscontainer .uploadWrapper .cloudIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 6rem;
  background-color: #fff;
  width: 6rem;
}
.uploadContentscontainer .uploadWrapper .uploadHeader {
  margin-top: 1rem;
  font-size: 1.4rem;
  width: 60%;
  margin-inline: auto;
  text-align: center;
  font-family: "Satoshi-Bold";
}
.uploadContentscontainer .headingHeaderContainer {
  display: flex;
  flex-direction: column;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  margin-top: 1rem;
}
.uploadContentscontainer .headingHeaderContainer .headingHeader {
  font-family: "Satoshi-Bold";
  color: #1a1a1a;
  width: 35rem;
  text-align: center !important;
  font-size: 2rem;
}
.uploadContentscontainer .headingHeaderContainer .paragraphHeader {
  font-size: 0.8rem;
  margin-top: 0.5rem;
  width: -moz-fit-content;
  width: fit-content;
  align-items: center;
  margin-inline: auto;
  font-family: "Satoshi-Medium";
  text-align: center;
}

.chooseFilesBtn {
  margin-top: 2rem;
  height: 2rem;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 1.5rem;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: unset;
  border: none;
  font-family: "Satoshi-Bold";
  background-color: #296EB4;
  color: #fff;
}

.documentsUpload {
  margin-top: 1rem;
  width: 35rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.documentsUpload .file-item {
  display: flex;
  align-items: center;
  justify-content: space-around;
  height: 2rem;
  border-radius: 4px;
  border: 1.2px solid #dedede;
}

.bottomWrapperContainer {
  background-color: red;
}

.topRightHeading {
  background-color: purple;
}

.topHeading {
  background-color: green;
}

.formGroup {
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
}

.label {
  background-color: red;
}

.formGroup label {
  font-family: "Satoshi-Bold";
  color: #1a1a1a;
}

.formGroup .editBtn {
  justify-content: center;
  font-family: "Satoshi-Bold";
  position: relative;
  justify-content: center;
}

.formGroup input {
  width: -moz-max-content;
  width: max-content;
  justify-content: right;
  display: flex;
  border: none;
  font-family: "Satoshi-medium";
}

.approveBtn {
  margin-top: 2rem;
  height: 2rem;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 1.5rem;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: unset;
  border: none;
  font-family: "Satoshi-Bold";
  background-color: #296EB4;
  color: #fff;
}

.file-itemm {
  display: flex;
  align-items: center;
  justify-content: space-around;
  height: 2rem;
  border-radius: 4px;
  border: 1.2px solid #dedede;
}/*# sourceMappingURL=dasboard.css.map */


.modal  h2{
  font-family: 'Satoshi-Bold';
  font-size: 1.4rem;
  text-transform: capitalize;
  /* background-color: red; */
}
.modal form {
  /* border: 1.2px solid red; */
  width: 35rem !important;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
form .formGroup {
  /* border: 1.2px solid black; */
  min-width: 100%;
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: space-between;
}
.formGroup label {
  /* background-color: blue; */
  font-size: .8rem;
  font-family: 'Satoshi-Medium';
  color: #333;
}
.formGroup input {
  border: 1.2px solid #dedede;
  height: 2.2rem;
  width: 60%;
}
.profileActions {
  margin-top: 1rem;
  justify-content: unset !important;
  /* background-color: red !important; */
  margin-bottom: 2rem;
  gap: 3rem;
}
.profileActions .editBtn {
  display: flex;
  background-color: black;
  width: fit-content;
  height: 2rem;
  align-items: center;
  justify-content: center;
  padding: 0 1rem;
  color: #fff;
  border-radius: 4px;
  font-family: 'Satoshi-Bold';
  text-decoration: none !important;
  font-size: .8rem;
}
.profileActions label {
  font-size: 1.2rem;
  font-family: 'Satoshi-Bold';
}
.sideNavigation {
  overflow: hidden;
  height: 100dvh;
  /* background-color: red; */
}






.myContainer {
  /* background-color: red; */
  position: relative;
  /* height: 27vh !important; */
  /* margin-top: unset !important; */
  /* overflow-y: scroll; */
  /* padding-top: 2rem !important; */
  width: 100%;
  margin-top: 5px;
  padding: 10px;
  /* border-radius: 8px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); */
}

.containerHeader {
  margin-top: -1rem;
}

.containerHeader h2 {
  font-size: 24px;
  font-family: 'Satoshi-Bold';
  color: #1A1A1A;
}
.containerHeader p {
  margin: 5px 0;
  font-size: 14px;
  color: rgba(26, 26, 26, 1);
}
.needHelp h2 {
  font-size: 24px;
  font-family: 'Satoshi-Bold';
  color: #1a1a1a;
}

.needHelp p {
  font-size: 14px;
  margin: 5px 0;
  /* font-family: 'Satoshi'; */
  color: rgba(26, 26, 26, 1);
  margin-bottom: .5rem;
}

button {
  padding: 8px 12px;
  background: #296eb4;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}
button:hover {
  background: #16154D;
}




/* .form-container {
  flex: 1 1 45%; 
  padding: 20px; 
  background: white; 
  border-radius: 8px; 
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
} 


.map-container {
  flex: 1 1 45%; 
  height: 300px; 
  background: #e3e3e3; 
  border-radius: 8px; 
} */

.wrapper {
  display: flex; 
  flex-wrap: wrap; 
  flex-direction: row;
  justify-content: space-between; 
  /* margin-top: 10px; */
  margin-bottom: 1rem;
  height: fit-content;
  width: 100%;
  background-color: #ffffff;
  /* border: 1px solid rgba(222, 222, 222, 1); */
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  /* gap: 10px; */
}


.map-container {
  margin: 20px auto; 
  margin-right: 2%;
  width: 45%; 
  background-color: rgba(247, 247, 247, 1); 
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.form-container {
  margin: 10px auto; 
  margin-left: 1rem;
  padding: 20px;
  width: 50%; 
  background-color: rgba(247, 247, 247, 1); 
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}


.form-group {
  margin-bottom: 10px;
  color: #666;  
}


label {
  display: block;
  margin-bottom: 5px;
  color: rgba(26, 26, 26, 0.8);
  font-size: 12px; 
  font-weight: bold;
}
input, textarea {
  width: 90%;
  padding: 10px;
  border: none;
  border-radius: 4px;
  font-size: 10px; 
  background-color: #ffffff;
}


/* .form-group label {
  font-size: 14px; 
  color: #666;  
  margin-bottom: 5px;
  display: block;
}


.form-group input,
.form-group textarea {
  font-size: 14px; 
  color: #333; 
} */


.helpcenterMain {
  display: flex;
  flex-direction: column;
  margin-left: 14rem;
  width: calc(100vw - 14rem);
  height: 100dvh;
  overflow-y: scroll;
}

.helpCenterMap {
  display: flex;
  flex-direction: column;
  /* justify-content: center;
  align-items: center; */
  padding: 20px;
  width: 100%;
  gap: 20px;
  margin-top: 0;
}

.helpCenterFAQs {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 10px;
  width: 100%;
}



.formContainer{
  background-color: red;
  justify-content: center;
  align-items: center;
  background-color: #fafafa;
  height: fit-content;
  position: relative;
}
.bottom{
  /* background-color: #000000; */
  justify-content: center;
  align-items: center;
  /* width: fit-content; */
  width: 100%;
  padding: 10px;
  /* border-radius: 8px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); */
}
.bottomContainer{
  display: flex;
  /* background-color: red; */
  /* width: -moz-fit-content; */
  /* width: fit-content; */
  /* margin-inline: auto; */
  flex-wrap: wrap; 
  
  margin-top: 2rem;
  flex-direction: row;
  justify-content: space-between;
  row-gap: 20px;
}

.itemFAQ{
  /* background-color: red; */
  background-color: #ffffff;
  border-radius: 15px;
  border-style: solid;
  border-color: rgba(172, 172, 172, 0.50);;
  border-width: 1px;
  padding: 20px;
  /* height: fit-content; */
  width: calc(30% - .1rem);


  

  .avatar{
    background: rgba(92, 145, 198, 0.20);
    border-radius: 31.86px;
    flex-shrink: 0;
    width: 35px;
    height: 35px;
    position: relative;
    overflow: hidden;
    border: none;
  }

  h2{
    color: #1a1a1a;
    font-family: 'Satoshi-Bold';
    font-size: 18px;
    position: relative;
    align-self: stretch;
    border: none;
    width: fit-content;
  }
  p {
    color: #464646;
    text-align: left;
    font-family: 'Satoshi-Medium';
    font-size: 10px;
    position: relative;
    align-self: stretch;
    border: none;
    width: fit-content;
  }

  button{
    background-color:rgba(41, 110, 180, 0.76);
    border-radius: 4px;
    display: flex;
    flex-direction: row;
    align-items: center;
    color: #ffffff;
    font-family: 'Satoshi-Bold';
    position: relative;
    border: none;
    width: 100px;
    height: 25px;
    justify-content: center;
    font-size: 9px;

  }
}

.adminSettings{
  background-color: #ffffff;
  border-radius: 15px;
  border-style: solid;
  border-color: rgba(172, 172, 172, 0.50);;
  border-width: 1px;
  padding: 5px;
  height: fit-content;
  width: 250px;
  

  .avatar{
    background: rgba(92, 145, 198, 0.20);
    border-radius: 31.86px;
    flex-shrink: 0;
    width: 35px;
    height: 35px;
    position: relative;
    overflow: hidden;
    border: none;
  }

  h2{
    color: #1a1a1a;
    font-family: 'Satoshi-Bold';
    font-size: 18px;
    position: relative;
    align-self: stretch;
    border: none;
    width: fit-content;
  }
  p {
    color: #464646;
    text-align: left;
    font-family: 'Satoshi-Medium';
    font-size: 10px;
    position: relative;
    align-self: stretch;
    border: none;
    width: fit-content;
  }

  button{
    background-color:rgba(41, 110, 180, 0.76);
    border-radius: 4px;
    display: flex;
    flex-direction: row;
    align-items: center;
    color: #ffffff;
    font-family: 'Satoshi-Bold';
    position: relative;
    border: none;
    width: 100px;
    height: 25px;
    justify-content: center;
    font-size: 9px;

  }
}

.accountSetup{
  background-color: #ffffff;
  border-radius: 15px;
  border-style: solid;
  border-color: rgba(172, 172, 172, 0.50);;
  border-width: 1px;
  padding: 5px;
  height: fit-content;
  width: 250px;
  

  .avatar{
    background: rgba(92, 145, 198, 0.20);
    border-radius: 31.86px;
    flex-shrink: 0;
    width: 35px;
    height: 35px;
    position: relative;
    overflow: hidden;
    border: none;
  }

  h2{
    color: #1a1a1a;
    font-family: 'Satoshi-Bold';
    font-size: 18px;
    position: relative;
    align-self: stretch;
    border: none;
    width: fit-content;
  }
  p {
    color: #464646;
    text-align: left;
    font-family: 'Satoshi-Medium';
    font-size: 10px;
    position: relative;
    align-self: stretch;
    border: none;
    width: fit-content;
  }

  button{
    background-color:rgba(41, 110, 180, 0.76);
    border-radius: 4px;
    display: flex;
    flex-direction: row;
    align-items: center;
    color: #ffffff;
    font-family: 'Satoshi-Bold';
    position: relative;
    border: none;
    width: 100px;
    height: 25px;
    justify-content: center;
    font-size: 9px;

  }
}

.gettingStarted{
  background-color: #ffffff;
  border-radius: 15px;
  border-style: solid;
  border-color: rgba(172, 172, 172, 0.50);;
  border-width: 1px;
  padding: 5px;
  height: fit-content;
  width: 250px;
  

  .avatar{
    background: rgba(92, 145, 198, 0.20);
    border-radius: 31.86px;
    flex-shrink: 0;
    width: 35px;
    height: 35px;
    position: relative;
    overflow: hidden;
    border: none;
  }

  h2{
    color: #1a1a1a;
    font-family: 'Satoshi-Bold';
    font-size: 18px;
    position: relative;
    align-self: stretch;
    border: none;
    width: fit-content;
  }
  p {
    color: #464646;
    text-align: left;
    font-family: 'Satoshi-Medium';
    font-size: 10px;
    position: relative;
    align-self: stretch;
    border: none;
    width: fit-content;
  }

  button{
    background-color:rgba(41, 110, 180, 0.76);
    border-radius: 4px;
    display: flex;
    flex-direction: row;
    align-items: center;
    color: #ffffff;
    font-family: 'Satoshi-Bold';
    position: relative;
    border: none;
    width: 100px;
    height: 25px;
    justify-content: center;
    font-size: 9px;

  }
}


/* .formContainer {
  background-color: red; 
  position: relative;
  height: 848px;
  flex-shrink: 0;
  align-self: stretch;
  border-width: 1px;
  border-color: #dedede;
  border-style: solid;
  border-radius: 10px;
} */



  /* button{
    width: fit-content;
    height: 30px;
    padding: 10px 6px;
    background-color: #16154d;
    color: #fafafa;
    border-radius: 0.2rem;
    border: none;
  } */


.tabHeading{
    width: fit-content;
    /* background-color: purple; */
    font-family: 'Satoshi';
    font-weight: 400;
    color: #4D4D4D;
    font-size: 18px;
    display: flex;
    flex-direction: row;
    
  
    


    .allTickets{
        /* color: #003cff; */
         font-weight: 500;
    }
}

 .uk-active{
  color: blue;
}
.newTicketContainer{
  background-color: #DBECFF ;
  color: #007BFF;
  display: flex;
  border-radius: 4px;
  padding: 0.20rem;
  position: relative;
  left: 88%;
  height: fit-content;
  padding: 0.4rem;
  font-size: 15px;
  width: 10rem;
  justify-content: center;
  font-family: 'Satoshi-Bold';
  right: 0%;

}

.ticketWrapper{
  /* background-color: red; */
  /* display: flex;
  flex-direction: row;
  justify-content: space-between; */

}


.ticketHeading{
  /* background-color: #007BFF; */
}
.ticketContainer{
/* background-color: #000000; */
display: flex;
flex-direction: flex;
justify-content: space-between;
gap: 0.1rem;
}

.ticketAvatar{
  background-color: rgba(0, 123, 255, 0.14);
  border-radius: 6rem;
  width: 2.5rem;
  height: 2.5rem;
  position: relative;
}

.ticketMain{
  /* background-color: blue; */
  position: relative;
  left: -13%;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  

}

.ticketDescription{
  color: rgba(26, 26, 26, 0.50);
text-align: left;
font-family: 'Satoshi-Regular', sans-serif;
font-size: 10px;
font-weight: 400;
position: relative;

}

.uploadButton{

border-radius: 15rem;
height: 0.2rem;
align-self: center;
font-size: 8px;
font-family: 'Satoshi-regular';
color: #1a1a1a;
background: none;
border-style: solid;
border-width: 0.1rem;
border-color: #dedede;
align-items: center;
display: flex;
justify-content: center;
width: 6rem;
}

.ticketTime{
  
  /* background-color: rgba(255, 163, 0, 0.56); */
  width: 5rem;
  border-style: solid;
  /* border: none; */
  border-radius: 15rem;
  padding: 0.3rem;
  justify-content: center;
  align-items: center;
  display: flex;
  color: #1a1a1a;
  font-family: 'Satoshi';
  height: fit-content;
  border-width: 0.1rem;
  border-color: #dedede;
  gap: 0.3rem;
  font-size: 8px;
  left: -20%;
  position: relative;
  
}

.ticketTime span[uk-icon="clock"]{
  /* background-color: #000000; */
  height: 0.7rem;
  width: 0.7rem;

}
.ticketStatus{
  background-color: rgba(255, 163, 0, 0.56);
  width: 10rem;
  /* border-style: solid; */
  border: none;
  border-radius: 15rem;
  padding: 0.3rem;
  justify-content: center;
  align-items: center;
  display: flex;
  color: #1a1a1a;
  font-family: 'Satoshi';
  height: fit-content;
  position: relative;
  font-size: 10px;
  
}

.ticketStatus1{
  background-color: #00AFB9;
  width: 10rem;
  /* border-style: solid; */
  border: none;
  border-radius: 15rem;
  padding: 0.3rem;
  justify-content: center;
  align-items: center;
  display: flex;
  color: #1a1a1a;
  font-family: 'Satoshi';
  height: fit-content;
  position: relative;
  font-size: 10px;
}

.ticketStatus2{
  background-color: #B8C0FF;
  width: 10rem;
  /* border-style: solid; */
  border: none;
  border-radius: 15rem;
  padding: 0.3rem;
  justify-content: center;
  align-items: center;
  display: flex;
  color: #1a1a1a;
  font-family: 'Satoshi';
  height: fit-content;
  position: relative;
  font-size: 10px;
}

.buttonContainer{
  display: flex;
  /* justify-content: space-between; */
  gap: 1rem;
  /* background-color: #000000; */
  width: fit-content;
}

.ticketSubHeading{
  font-size: 12px;
}

.addNewTicket{
  background-color: #DBECFF;
  width: fit-content;
  padding: 0.4rem;
  border-radius: 50%;
  position: relative;
  left: 45%;
  top: 100%;
  display: flex;
  justify-content: center;
  align-items: center;

  
}

.addNewTicket span[uk-icon="plus"]{
  color: #007BFF;
  font-size: 15px;
  width: fit-content;
  height: fit-content;
  
}

.newTicket{
  width: fit-content;
  position: relative;
  left: 43.5%;
  font-family: 'Satoshi-Medium';
  color: #1a1a1a;
}


.addNewTicketContainer{
  display: flex;
  flex-direction: column;
  position: relative;
}

.switcherController{
  /* background-color: #000000; */
  display: flex;
  gap: 25px;
  font-family: 'Satoshi-Bold';
  color: #4D4D4D;
}

.newTicketBtn{
  width: fit-content;
  position: relative;
  display: flex;
  font-family: 'Satoshi-Bold';
  padding: 15px;
  left: 45%;

  
}

.newTicketBtn1{
  width: fit-content;
  position: relative;
  display: flex;
  left: 105%;
  width: fit-content;
  font-family: 'Satoshi-Bold';
  padding: 15px;
  background-color: #dbdfff;
  color: #007BFF;
}

.createTicket{
  /* background-color: red; */
  font-family: 'Satoshi-bold';
  color: #26387B;
  font-size: medium;
  margin-bottom: 20px;
}

.category{
  font: 'Satoshi-Bold';
  font-size: 14px;
  color: #1A1A1A;
  margin-bottom: 15px;

}



.mediumLevel{
  width: 15rem;
  font-size: 15px;
  margin-top: 10px;
}

.mediumLeveltxt{
  font-size: 15px;
  margin-bottom: 10px;
}

.enquirydrpdwn{
  background-color: #F7F7F7;
  border-radius: 5px;
  border-width: 1px;
  /* background: none; */
  width: 15rem;
  padding: 10px;
  font-family: 'Satoshi-Medium';
  color: #26387B;
}

.status{
  font-family:  'Satoshi';
  font-size: 16px;
  color: #1A1A1A;
  margin-bottom: 15px;
  
}

.statusdrpdwn{
  background-color: #F29A16;
  border-radius: 5px;
  border-width: 1px;
  width: 8rem;
  padding: 10px;
  font-family: 'Satoshi-Medium';
  color: #fefefe;
  padding: 8px;
}

.ticketHeading{
  font-family: 'Satoshi';
  font-size: 12px;
  color: #1A1A1A;
  border-radius: 1px;
  border-radius: 5px;

}

.ticketHeadings{
  font-family: 'Satoshi-Medium';
  font-size: 16px;
  color: #1A1A1A;
  margin-bottom: 15px;
}

.ticketDecritption{
  font-family:  'Satoshi';
  font-size: 16px;
  color: #1A1A1A;
  margin-bottom: 15px;
}

.ticketDescritpionTxt{
  border-radius: 10px;
  height: 10rem;
  width: 18.5rem;
  font-size: 12px;
  font-family: 'Satoshi-Medium';
  margin-bottom: 15px;
  
}
.primaryBtn{
  width: 15rem;
  font-family: 'Satoshi-bold';
}

.canvas{
  background-color: #007BFF;
}