*,
 :after,
 :before {
	box-sizing: border-box;
}

.head-profile {
	background: #1e293b;
	color: white;
	min-height: 220px;
	padding: 24px;
}

.head-profile-2 {
	background: #1e293b;
	color: white;
	min-height: 260px;
	padding: 24px;
}

.btn-profile-options {
	height: 2.8rem;
	padding: 0rem 1.5rem;
}

.sub-noti-text {
	opacity: 0.8;
	color: #aaaaaa;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.6px;
	margin-top: -6px;
	margin-left: 4px;
}

.vs-mat-card {
	background: #fff;
	color: rgba(0, 0, 0, .87);
	border-radius: 6px!important;
	padding: 0!important;
	margin-bottom: 20px!important;
	overflow: hidden;
}

.mat-elevation-z4 {
	box-shadow: 0 2px 4px -1px rgb(0 0 0 / 20%), 0 4px 5px 0 rgb(0 0 0 / 14%), 0 1px 10px 0 rgb(0 0 0 / 12%);
}

.vw-botm-bdr {
	border-bottom: 2px solid #5454543b;
	box-shadow: 0px 2px 8px 0px #d8d8d8a3;
	padding: 12px 20px;
	background: #cccccc91;
	color: #1e293b;
}

.h2-1 {
	font-family: "Poppins";
	font-size: 18px;
	color: #2b2b2bcf;
	font-weight: 500;
	text-transform: capitalize;
}

.vs-pos-inherit {
	position: inherit;
}

.vs-pos-relative {
	position: relative;
}

.vs-pos-absolute {
	position: absolute;
}

.text-bold {
	font-weight: bold;
}

.vs-cropped-image {
	max-width: 180px;
	min-width: 180px;
	max-height: 180px;
	min-width: 180px;
	width: 180px;
	background: white;
	border-radius: 16px;
	border: 3px solid #cccccc;
	padding: 4px;
	z-index: 10;
}

.vs-cropped-image-img {
	width: 100%!important;
	height: 100%!important;
	background-size: contain;
	object-fit: contain;
	background-repeat: no-repeat;
	border-radius: 12px;
}

.top-6-1 {
	border-radius: 50%;
	width: 26px;
	height: 26px;
	padding: 2px;
	font-weight: 800;
	color: #1e293b;
	border: 2px solid #484848;
	background: white;
	top: 12px;
	right: 12px;
	-webkit-font-smoothing: antialiased;
}

.vs-icon-rnd {
	width: 100%!important;
	height: 100%!important;
	background-size: contain;
	object-fit: contain;
	background-repeat: no-repeat;
	padding: 3px 2px;
	vertical-align: top;
}

.vs-sub-line {
	font-size: 13px;
	color: black;
}

.vs-forgot-pass {
	letter-spacing: 0.4px;
	font-weight: 700;
	color: #3f51b5;
	cursor: pointer;
}

.vs-forgot-pass:hover {
	color: #4caf50;
	;
}

.vs-table-heads {
	font-size: 12px;
	font-weight: 600!important;
	align-items: center;
	overflow: hidden;
	word-wrap: break-word;
	min-height: inherit;
	color: rgba(0, 0, 0, .54)!important;
}

.vs-table-heads-down {
	font-size: 12px;
	font-weight: 500!important;
	align-items: center;
	overflow: hidden;
	word-wrap: break-word;
	min-height: inherit;
	color: rgba(0, 0, 0, .54)!important;
}

.vs-table-icon {
	font-size: 12px;
	font-weight: bold;
}

.vs-table-list-one {
	font-size: 12px;
	cursor: pointer;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-weight: 500;
	color: rgb(0 0 0 / 80%);
	letter-spacing: 0.2px;
}

.vs-table-min-height {
	min-height: 400px;
}

.expender-buttons {
	font-weight: bold;
}

.vs-bg-clrs .p-card {
	background: #f1f5f9d4!important;
	/* min-height: 800px; */
	height: 100%!important;
}

.vs-bg-clrs {
	background: #f1f5f9d4!important;
	/* min-height: 800px; */
}

.vs-dialog-confirm {
	width: 46vh!important;
	padding: 6px;
	background: #F6F6F6;
}

.vs-style-svg {
	position: absolute;
	z-index: -1;
	top: 0!important;
	bottom: 0!important;
	right: 0!important;
	left: 0!important;
	background: aliceblue;
}

.vs-g-fill {
	opacity: .4!important;
	--tw-text-opacity: 1!important;
	color: rgba(226, 232, 240, var(--tw-text-opacity))!important;
}

.vs-head-sec {
	font-size: 1.125rem!important;
	font-weight: 600!important;
}

.vs-head-subline {
	font-size: 3rem!important;
	letter-spacing: -.025em!important;
	margin-top: .25rem!important;
	line-height: 1.25!important;
	font-weight: 800!important;
}

.vs-head-triline {
	font-size: 1.25rem!important;
	letter-spacing: -.025em!important;
	margin-top: .75rem!important;
	color: #004480cc;
}

.vs-head-triline-2 {
	font-size: 1.25rem!important;
	letter-spacing: -.025em!important;
	margin-top: .75rem!important;
	color: #67bb67;
}

.avatar {
	width: 40px;
	min-width: 40px;
	height: 40px;
	line-height: 40px;
	margin: 0 8px 0 0;
	border-radius: 50%;
	font-size: 17px;
	font-weight: 600;
	text-align: center;
	object-fit: contain;
	background-position: center;
	/* background: #eaf2f9;
  border: 2px solid #a7a7a76b;
  padding: 2px; */
}

.vs-truncate {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	width: 100%;
	padding-right: 16px;
}


.vs-added-btn {
	width: 2.5rem!important;
	height: 2.5rem!important;
	background: #8bc34a;
	color: white;
	border: 1px solid #4caf50;
}

.vs-p-d-none {
	display: table-cell;
}

.vs-resp-bottom {
	border-bottom: 1px solid #ddddddba;
	margin: 4px 0px;
}

.vs-min-heighter {
	min-height: 60vh;
	height: 100%;
}

.vs-btn-dataset {
	border-radius: 8px;
	color: #6D6D6D;
	font-weight: 500;
	background: white;
}

.vs-nav-btns {
	/* height: 26px;
	background: #8bc34ade;
	color: white; */
	height: 30px;
    width: 42px!important;
    background: #8bc34ade;
    color: white;
}

.vs-btn-del {
	width: 2.1rem!important;
	height: 2.1rem;
	border-radius: 50%;
	background: transparent;
	color: rgb(139 139 139);
	border: 1px solid rgb(186 186 186);
	-webkit-font-smoothing: antialiased;
}

.vs-btn-del:hover {
	background: #fe4081!important;
	color: rgb(255, 255, 255)!important;
	border: 1px solid white!important;
}

.vs-headings1 {
	font-weight: 600;
	text-transform: uppercase;
	color: #838383cc;
	font-family: poppins;
	letter-spacing: 0.2px;
	font-size: medium;
	word-spacing: 1px;
}

.vs-btn-pos {
	position: absolute!important;
	z-index: 9999999!important;
	right: 2%;
  margin: 14px 4px!important;
	padding: 16px!important;
	border-radius: 50%!important;
	border: 0!important;
	color: #6d6d6d!important;
	background: transparent!important;
}

.vs-btn-pos .pi {
	font-size: 1rem;
	font-weight: 600!important;
	/* color: #6d6d6d; */
}

.vs-btn-pos:hover {
	color: #8bc34a!important;
	background: #f8f8f8!important;
}

.vs-buttony {
	display: inline-block;
	height: 50px;
	line-height: 50px;
	padding-right: 30px;
	border: none!important;
	padding-left: 70px;
	position: relative;
	background-color: #3f51b5;;
	color: rgb(255, 255, 255);
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1px;
	margin-bottom: 15px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
	-ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=1,Color=#ff123852,Positive=true)";
	zoom: 1;
	filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=0, OffY=1, Color=#ff123852, Positive=true);
	-moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
	-ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=2,Color=#33000000,Positive=true)";
	filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=0, OffY=2, Color=#33000000, Positive=true);
}

.vs-buttony span {
	position: absolute;
	left: 0;
	width: 50px;
	height: 49px;
	background-color: rgba(0, 0, 0, 0.5);
	-webkit-border-top-left-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	border-right: 1px solid rgba(0, 0, 0, 0.15);
}

.vs-buttony:hover span,
.button.active span {
	background-color: rgb(63 81 181 / 70%);
	border-right: 1px solid rgba(0, 0, 0, 0.3);
}

.vs-buttony:active {
	margin-top: 2px;
	margin-bottom: 13px;
	-moz-box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.5);
	-webkit-box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.5);
	box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.5);
	-ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=1,Color=#ccffffff,Positive=true)";
	filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=0, OffY=1, Color=#ccffffff, Positive=true);
}

.vs-buttony.orange {
	background: #FF7F00;
}

.vs-buttony.purple {
	background: #8e44ad;
}

.vs-buttony.turquoise {
	background: #4caf50;
}

.vs-buttony.red {
	background: #e74c3c;
}

.vs-ref-class { 
  position: inherit;
}

.vs-ref-class .p-accordion-tab-active {
  margin-bottom: 0rem!important;
}

.vs-ref-class .p-accordion-content {
  padding: 0!important;
}

.vs-bdr-rgt {
  border-right: 1px solid #9e9e9e75;
}

.vs-del-abso { 
  position: absolute;
  right: 0%;
  z-index: 999;
}

.vs-green-btn { 
	background: #8bc34a!important;
	color: white!important;
}

.vs-green-btn:hover { 
	background: #5aa00a!important;
	color: white!important;
}


	.product-item-content {
			border: 1px solid var(--surface-d);
			border-radius: 3px;
			margin: .3rem;
			text-align: center;
			padding: 2rem 0;
	}

	.product-image {
			width: 50%;
			box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23)
	}

	.vs-pos-refral { 
		position: inherit;
	}
	
	.vs-pos-refral .p-datatable-header {
		padding: 0px!important;
	}

	.refs-btns { 
		position: inherit;
	}

	.refs-btns .p-button { 
		padding: 4px 12px!important;
	}

.p-inner-refs3 { 
	position:inherit;
}

.p-inner-refs3  .p-button {
	width: 33.33%!important;
}

.refs-btns-2 { 
	position: inherit;
}

.refs-btns-2 .p-button { 
	width: 100%!important;
}

.sub-email-vs { 
	font-size: 12px;
	text-align: center;
	font-weight: 400;
}

.padder-0-16 { 
	padding: 0 16px;
}

.vw-texty-botm {
	font-size: 12px;
	font-weight: 300;
	text-transform: uppercase;
	/* padding: 6px 0; */
	letter-spacing: 0.8px;
}

.vw-bdr-right {
	border-right: 1px solid #607d8bd6;
	padding: 10px!important;
	margin: 0;
}

.vw-bdr-right:hover {
	background: #ecf8ff;
	transition: ease-in 0.28s;
}

.clicker-lft-vw:hover {
	cursor: pointer;
	color: #06bc0d;
	background: #8bc34a24;
	transition: ease-in 0.28s;
}

.clicker-rgt-vw:hover {
	cursor: pointer;
    color: #e64900;
	background: #ff000014;
	transition: ease-in 0.2s;
}

.vw-two-btns {
	border: 1px solid #607d8bd6;
	border-radius: 8px;
	margin: 0 12px;
	margin-top: -32px;
	z-index: 1;
	background: #1f1f1f;
    /* box-shadow: 0 2px 6px 0px #b9b9b98c; */
	overflow: hidden;
	min-height: 56px;
}

.vs-clrfff { 
	color: #fff;
}

.vs-font-s16 { 
	font-size: 16px;
	margin-bottom: 2px;
}

.vs-bg-contrast { 
	background-color: #5b5b5b57;;
	height: 100%;
}

.p-mt-64px { 
	margin-top: 108px;
}

.vs-certicle-scroll { 
	overflow-y: auto;
	height: 100%;
	overflow-x: hidden;
	overflow-y: hidden;
}

.vs-box-click { 
	padding: 10px!important;
    margin: 0;
}

.mersaline { 
	position: inherit;
}


.vs-undergo { 
	position: absolute!important;
	top: 74px;
	left: 4%;
    z-index: 999999999;
}

.sml-image { 
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: #f0f0f0;
	padding: 3px;
	margin: 12px -12px 12px 0px;
}

.vs-input-sets { 
	width: 223px;
}


.btn-map-picks { 
	width: 3rem!important;
	height: 3rem!important;
	margin-top: 16px!important;
	background-color: #673ab7!important;
	color: white!important;
}

.btn-map-pickup { 
	width: 3rem!important;
	height: 3rem!important;
	background-color: #673ab7!important;
	color: white!important;
	margin-top: 4px!important;
}

.bottom-track { 
	position: absolute;
	bottom: 0%;
	right: 0%;
	background: white;
	width: 100%;
	border-top: 2px solid #bfbfbf;
	box-shadow: 0px -2px 12px 0px #cbcbcb;
	border-radius: 4px;
}

.p-field label {
	font-weight: 400!important;
	letter-spacing: 0.1px!important;
	color: #6c6c6c!important;
}
.vs-ref-ddcomp { 
	position: inherit;
}

.vs-ref-ddcomp .p-dropdown {
   padding: 4px 0!important;
}

.vs-main-logster { 
	color:white;
}

/* Force dropdown above modal */
body>div.p-dropdown-panel {
	z-index: 10000!important;
}

.loader{
	position: absolute;
	top:0px;
	right:0px;
	width:100%;
	height:100%;
	background-color:#eceaea;
	background-size: 50px;
	background-repeat:no-repeat;
	background-position:center;
	z-index:10000000;
	opacity: 0.4;
	filter: alpha(opacity=40);
}

.loadingbar {
	position: absolute;
	top:0px;
	right:0px;
	width:100%;
}

.p-dropdown span {
	padding: 0.74em .75em;
}

.subscription-card {
	border-radius: 15px;
}
.subscription-card .p-card-body{
	padding: 0px;
}

.subscription-card .p-card-content{
	padding: 0px;
}

.subscription-card .pi-spinner {
	font-size: 15px !important;
}

.subscription-card .subscription-header {
	padding-top: 20px;
	background: #1e293b;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	color: #fff !important;
}

.subscription-header h1 {
	color: #fff;
}

.subscription-detail-section {
  padding: 0px 60px;
}
.subscription-sub-heading p {margin-top: 15px;}

.subscription-detail-section span {
	color: #999;
	font-size: 12px;
	border-bottom: 2px solid #ccc;
	padding: 5px;
}
.subscription-detail-section label {
	width: 150px;
}
.subscription-detail-section strong {
	width: 110px;
	color: #1e293b;
}
.subscription-detail-section .pi-check{
color: green;
}
.subscription-detail-section .pi-times{
color: red
}

@media (min-width: 300px) and (max-width: 380px) {
	.vs-head-subline {
		font-size: 2.8rem!important;
		letter-spacing: -.025em!important;
		margin-top: .25rem!important;
		line-height: 1.25!important;
		font-weight: 800!important;
	}
	.vs-head-triline {
		font-size: 1.10rem!important;
		letter-spacing: -.025em!important;
		margin-top: .75rem!important;
		color: #004480cc;
	}
	.vs-head-triline-2 {
		font-size: 1.10rem!important;
		letter-spacing: -.025em!important;
		margin-top: .75rem!important;
		color: #67bb67;
	}
	.vs-p-d-none {
		display: none;
	}

  .vs-bdr-rgt {
    border-right:none;
  }

}

@media (min-width: 381px) and (max-width: 767.98px) {
	.vs-head-subline {
		font-size: 2.8rem!important;
		letter-spacing: -.025em!important;
		margin-top: .25rem!important;
		line-height: 1.25!important;
		font-weight: 800!important;
	}
	.vs-head-triline {
		font-size: 1.10rem!important;
		letter-spacing: -.025em!important;
		margin-top: .75rem!important;
		color: #004480cc;
	}
	.vs-head-triline-2 {
		font-size: 1.10rem!important;
		letter-spacing: -.025em!important;
		margin-top: .75rem!important;
		color: #67bb67;
	}
	.vs-p-d-none {
		display: none;
	}

  .vs-bdr-rgt {
    border-right:none;
  }

}

@media (min-width: 768px) and (max-width: 991.98px) {
	.vs-head-subline {
		font-size: 2.8rem!important;
		letter-spacing: -.025em!important;
		margin-top: .25rem!important;
		line-height: 1.25!important;
		font-weight: 800!important;
	}
	.vs-head-triline {
		font-size: 1.10rem!important;
		letter-spacing: -.025em!important;
		margin-top: .75rem!important;
		color: #004480cc;
	}
	.vs-head-triline-2 {
		font-size: 1.10rem!important;
		letter-spacing: -.025em!important;
		margin-top: .75rem!important;
		color: #67bb67;
	}
}

@media (min-width: 992px) and (max-width: 1199.98px) {}

@media (min-width: 1200px) and (max-width: 1600px) {}

@media (min-width: 1600px) and (max-width: 1900px) {}