.wallet-error {
    background-color: red;
    padding: 2%;
    font-size: 16px;
    border-radius: 10px;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 1%;
    margin-bottom: 1%;
	color: white;
}

.wallet-success {
    background-color: greenyellow;
    padding: 2%;
    font-size: 16px;
    border-radius: 10px;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 1%;
    margin-bottom: 1%;
	color: black;
}

.spinner {
  background-image: url('../img/spinner.gif');
  background-repeat: no-repeat;
  background-size: contain;
  height: 30px;
  width: 30px;
}

.wallet-flash {
    background-color: #f3fdf1;
    padding: 2%;
    font-size: 16px;
    border-radius: 10px;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 1%;
    margin-bottom: 1%;
	color: black;
}

.wamobilemenu {
	display: none;
	text-align: center;
}


.menubase-logo {
  max-width: 150px;
  max-height: 150px;
  float: left;
  margin-left: 4%;
  margin-right: 3%;
  margin-top: -1%;
}

.menubase-navigation {
  float: left;
  margin-left: 1%;
  margin-right: 1%;
}

.img-logo {
  width: 100%;
  max-width: 150px;
  max-height: 80px;
  vertical-align: middle;
}

.flexsidebarandcontent {
	display: inline-flex;
	width: 100%;		
}


/* use this to remove the padding that betheme added to its content*/
.the_content_wrapper {
  margin: 0px !important;
  
}

.has_content .section_wrapper {
  width: 100% !important;
  padding: 0px !important;
  margin: 0px !important;
  max-width: 1800px !important;
}


/* Use this to remove the gaps created by another bootrap row padding */
.row {
  --bs-gutter-x: 0px !important;
  --bs-gutter-y: 0px !important;
}


.walletTranslator {
  position: absolute !important;
  top: 10 !important;
  right: 1%;
  z-index: 999999 !important;
}



/* MOBILE VERSION STARTS HERE */
@media (max-width: 800px) {
	
	.flexsidebarandcontent {
		display: block;
		width: 100%;	
	}
	
	.wallet-portal-sidebarbase {
	   width: 100% !important;
	}

	.wallet-portal-contentbase {
	  width: 100% !important;
	}
	
	.wamobilemenu{
		display: block;
	}
	
	.waportmenu {
	  position: absolute;
	  width: 80%;
	  display: none;
	  padding: 4%;
	  z-index: 999999;
	  height: 200px;
	  overflow: scroll;
	}
	
	.walletTranslator {
		position: absolute;
	    right: 25% !important;
	}
	
}



/* popup goes here */
.popupbase {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.1);
}

.popupinner {
  background-color: black;
  width: 40%;
  margin-left: 38%;
  margin-right: auto;
  margin-top: 10%;
  padding: 1% 2% 5% 1%;
  border-radius: 10px;
  /* position: fixed; */
  /* left: 0; */
  /* right: 0; */
}

/* Mobile version*/
@media only screen and (max-width: 800px){
	.popupinner {
		width: 80%;
		margin-right: auto;
		margin-left: auto;
		margin-top: 26%;
	}
	.popupwarningtext {
	  margin-bottom: 14%;
	  font-size: 13px;
	}
	.cancel_process {
		margin-bottom: 4%;
	}
	
	.wallet-error {
		width: 93%;
		font-size: 14px;
	}
	
	.stagebarholder {
		width: 96%;
		top: 8%;
	}
}

/* animate it*/
.popupinnerx{
	opacity: 0;
	transform: scale(0);
	animation: zoomIn 0.5s forwards;
}

@keyframes zoomIn {
	from {
		opacity: 0;
		transform: scale(0);
	}
	to{
		opacity: 1;
		transform: scale(1);
	}
}


.popupacctinfobase {
  padding: 4%;
  background: linear-gradient(to right,#5b075b,#280775);
  border-radius: 10px;
}


.popupinfobind {
  display: flex;
}

.popupinfoLeft {
  width: 50%;
}

.popupinfoRight {
  width: 50%;
  text-align: right;
}

.popupinfobalancelabel {
  color: white;
  font-size: 16px;
}
.popupinfobalance {
  font-size: 21px;
  color: white;
  font-weight: 600;
}

.popupinfostatuslabel {
  text-align: right;
  font-size: 16px;
  color: white;
}

.popupinfostatus {
  font-size: 18px;
  color: white;
  font-weight: 600;
}

.popupinfodivider {
  margin-bottom: 12%;
}

.popupinfoaccountlabel {
  font-size: 16px;
  color: white;
}

.popupinfoaccount {
  color: white;
  font-size: 18px;
  font-weight: 700;
}

.popupinfotypelabel {
  font-size: 16px;
  color: white;
}

.popupinfotype {
  color: white;
  font-size: 18px;
  font-weight: 600;
}

.popupwarningtext {
  margin-top: 10%;
  margin-bottom: 10%;
  border-left: 8px solid #07077b;
  padding: 2% 4%;
  background-color: #1a1c4a;
  color: white;
  font-size: 17px;
}

.portbaseLeft {
  padding-left: 2%;
  font-size: 18px;
}



.cancel_process {
  background-color: #f16449 !important;
  border-radius: 10px;
  margin-right: 6px;
}

.submit_process {
  background-color: #4b38b3 !important;
  border-radius: 10px;
  margin-left: 6px;
}


.wallet-error {
  background-color: #d96868;
  padding: 2%;
  font-size: 16px;
  border-radius: 10px;
  width: 74%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1%;
  margin-bottom: 1%;
  color: white;
  position: absolute;
  top: 0;
  z-index: 90;
}

.wallet-success {
  background-color: #d96868;
  padding: 2%;
  font-size: 16px;
  border-radius: 10px;
  width: 74%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1%;
  margin-bottom: 1%;
  color: white;
  position: absolute;
  top: 0;
  z-index: 90;
}


.stagebarholder {
  background-color: #d9d8d8;
  text-align: center;
  margin-bottom: 0.5%;
  overflow: hidden;
  position: absolute;
  width: 80%;
  top: 5%;
}