body {
    background-color: #2a3447 !important;
}
body {
    margin: 0;
    font-family: var(--bs-body-font-family);
    font-size: var(--bs-body-font-size);
    font-weight: var(--bs-body-font-weight);
    line-height: var(--bs-body-line-height);
    color: var(--bs-body-color);
    text-align: var(--bs-body-text-align);
    background-color: var(--bs-body-bg);
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
}

/* custom color */
.radial-gradient::before {
    content: "";
    position: absolute;
    height: 100%;
    width: 100%;
    opacity: .3;
	background: radial-gradient(#d2f1df, #d3d7fa, #bad8f4) 0 0 / 400% 400%;
    animation: 15s ease 0s infinite normal none running gradient;
}
/* end of custom color */

/* preloader */
body .bootstrap-switch .bootstrap-switch-label,
body .preloader {
    background: #2a3447 !important;
	transition: .2s ease-in;
}
.preloader {
	display: block;
	width: 100%;
    height: 100%;
    top: 0;
    position: fixed;
    z-index: 99999;
    background: #ffffff;
	transition: .2s ease-in;
}
.lds-ripple {
    display: inline-block;
    position: relative;
    width: 40px;
    position: absolute;
    top: calc(50% - 3.5px);
    left: 0;
    right: 0;
    margin: 0 auto;
	transition: .2s ease-in;
}

/* end of preloader */

	/* button custom */
	
	/* .btn {
		background: #997a31;
		border-color: #997a31;
		border-color: #997a31;


	}

	.btn:hover,
	.btn:focus,
	.btn:active,
	.btn.active,
	.open>.dropdown-toggle.btn {
		color: #997a31;
		background-color: #ffffff;
		border-color: #997a31;
	} */


	.btn1 {

		font-size: 1.2em;
		line-height: 1.2em;

	}


	.btn1 {
		background: #3700b3;
		margin-top: 15px;
		margin-bottom: 15px;
		border: #3700b3;
		padding: 15px 45px;
		text-align: center;
		color: #FFFFFF;
		transition: 0.5s;
		background-size: 200% auto;
		color: white;

		border-radius: 10px;
		display: block;
	}

	.btn1:hover {

		background: #bb86fc;

		background-position: right center;
		/* change the direction of the change here */
		color: #fff;
	}

	.btn2 {
		color: #00ADEE;

		font-size: 1.2em;
		line-height: 1.2em;

	}

	.btn2 {
		background: #00ADEE;
		margin-top: 15px;
		margin-bottom: 15px;

		border: #00ADEE;
		padding: 15px 45px;
		text-align: center;
		color: #FFFFFF;
		transition: 0.5s;
		background-size: 200% auto;
		color: white;

		border-radius: 10px;
		display: block;
	}

	.btn2:hover {

		background: #048ec0;

		background-position: right center;
		/* change the direction of the change here */
		color: #fff;
		text-decoration: none;
	}

	.btn3 {
		background: #fa6b6b;
		margin-top: 15px;
		margin-bottom: 15px;

		border: #fa6b6b;
		padding: 15px 45px;
		text-align: center;
		color: #FFFFFF;
		transition: 0.5s;
		background-size: 200% auto;
		color: white;

		border-radius: 10px;
		display: block;
	}

	.btn3:hover {

		background: #d45555;;

		background-position: right center;
		/* change the direction of the change here */
		color: #fff;
		text-decoration: none;
	}

	/* end button custom */



	/* image custom  */

	.img-thumbnail {
		background-color: transparent;
		border: 0;
		margin-bottom: 0px;

	}


	.bg-transparent {
		background-color: rgba(11, 11, 11, 0.72);
	}

	/* end of image custom  */
	/* layout custom */
	.card {
		position: relative;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		min-width: 0;
		word-wrap: break-word;
		background-clip: border-box;
		border: 0px solid rgba(0, 0, 0, 0.125)!important;
		border-radius: 10px;
	}
	.card-body {
		
		padding: 30px!important;
		border-width: 0px;
		border-radius: 10px;
		background: #2A3447;

	}
	.card-profile {
		position: relative;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		min-width: 0;
		word-wrap: break-word;
		background-clip: border-box;
		/* border: 1px solid rgba(145, 158, 171, 0.3) !important; */
		border-radius: 10px !important;
	}
	.card-profile-body {
		padding: 30px!important;
		border-width: 0px;
		border-radius: 10px;
		background: rgba(122, 133, 145, 0.3);

	}
	hr {
		margin-top: 1rem;
		margin-bottom: 1rem;
		border: 0;
		border-top: 1px solid rgba(145, 158, 171, 0.3) !important;
	}
	/* end of layout custome */
	/* heading custom  */

h5 {
		/* margin-top: 10px !important; */
		/* font-size: 30px; */
		background: #ffffff;
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		/* text-align: center; */
	}


	h2 {

		margin-top: 10px !important;

		background: #ffffff;


		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		text-align: center;

	}

	p {
		color: lightgrey;
	}
	a{
		color:#a6a6a6;
	}
	a:hover{
		color:#00ADEE;
	}

	/* end of heading custom  */
/* custom option */
select:invalid { color: gray; }
/* end custom option */
	/* form custom color */



	.form-control {
		border-radius: 10px;
		height: 55px;
		margin: 10px 0;
		border: 2px solid lightgrey;
	}

	.form-group ::placeholder,
	.form-group select {

		left: 15px;
		font-size: 18px;
		font-weight: 400;
		padding: 0 6px;
		color: #a6a6a6;
	}

	.form-control .input {
		position: relative;
		height: 100%;
		width: 100%;
		outline: none;
		color: #333;

		padding: 0 40px 0 16px;
		border: 2px solid lightgrey;
		border-radius: 10px;
		transition: all 0.3s ease;
	}

	.form-control i,
	.form-control .label {

		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		color: #a6a6a6;
		transition: all 0.3s ease;

	}

	/* end form custom color */
	.poppins-thin {
		font-family: "Poppins", sans-serif;
		font-weight: 100;
		font-style: normal;
	}

	.poppins-extralight {
		font-family: "Poppins", sans-serif;
		font-weight: 200;
		font-style: normal;
	}

	.poppins-light {
		font-family: "Poppins", sans-serif;
		font-weight: 300;
		font-style: normal;
	}

	.poppins-regular {
		font-family: "Poppins", sans-serif;
		font-weight: 400;
		font-style: normal;
	}

	.poppins-medium {
		font-family: "Poppins", sans-serif;
		font-weight: 500;
		font-style: normal;
	}

	.poppins-semibold {
		font-family: "Poppins", sans-serif;
		font-weight: 600;
		font-style: normal;
	}

	.poppins-bold {
		font-family: "Poppins", sans-serif;
		font-weight: 700;
		font-style: normal;
	}

	.poppins-extrabold {
		font-family: "Poppins", sans-serif;
		font-weight: 800;
		font-style: normal;
	}

	.poppins-black {
		font-family: "Poppins", sans-serif;
		font-weight: 900;
		font-style: normal;
	}

	.poppins-thin-italic {
		font-family: "Poppins", sans-serif;
		font-weight: 100;
		font-style: italic;
	}

	.poppins-extralight-italic {
		font-family: "Poppins", sans-serif;
		font-weight: 200;
		font-style: italic;
	}

	.poppins-light-italic {
		font-family: "Poppins", sans-serif;
		font-weight: 300;
		font-style: italic;
	}

	.poppins-regular-italic {
		font-family: "Poppins", sans-serif;
		font-weight: 400;
		font-style: italic;
	}

	.poppins-medium-italic {
		font-family: "Poppins", sans-serif;
		font-weight: 500;
		font-style: italic;
	}

	.poppins-semibold-italic {
		font-family: "Poppins", sans-serif;
		font-weight: 600;
		font-style: italic;
	}

	.poppins-bold-italic {
		font-family: "Poppins", sans-serif;
		font-weight: 700;
		font-style: italic;
	}

	.poppins-extrabold-italic {
		font-family: "Poppins", sans-serif;
		font-weight: 800;
		font-style: italic;
	}

	.poppins-black-italic {
		font-family: "Poppins", sans-serif;
		font-weight: 900;
		font-style: italic;
	}

	@font-face {
		font-family: 'w13';
		src: url('./assets/font/W13-Normal.ttf');
	}

	.register {
		background: rgba(255, 255, 255, 0.61);
		border-radius: 15px;
	}



	.containtr {
		background: rgba(0, 0, 0, 0);
		border-radius: 15px;
	}

	/** for partition password */
	#partition {

		letter-spacing: 42px;
		border: 0;
		background-image: linear-gradient(to left, black 70%, rgba(255, 255, 255, 0) 0%);
		background-position: bottom;
		background-size: 50px 1px;
		background-repeat: repeat-x;
		background-position-x: 35px;
		width: 100%;

		outline: none;
	}

	#divInner {
		left: 0;
		position: sticky;
	}

	#divOuter {
		width: 100%;
		overflow: hidden;
	}

	/**end parrtition password */

	/**custom input field */
	.form-control {
		border-radius: 10px;
		height: 55px;
		margin: 10px 0;
		border: 2px solid lightgrey;
	}

	.form-group ::placeholder,
	.form-group select {

		left: 15px;
		font-size: 18px;
		font-weight: 400;
		padding: 0 6px;
		color: #a6a6a6;
	}

	.form-control .input {
		position: relative;
		height: 100%;
		width: 100%;
		outline: none;
		color: #333;

		padding: 0 40px 0 16px;
		border: 2px solid lightgrey;
		border-radius: 10px;
		transition: all 0.3s ease;
	}

	.form-control i,
	.form-control .label {

		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		color: #a6a6a6;
		transition: all 0.3s ease;

	}

	/**end ofcustom input field */


/* input form custom */
.input-slider {
	position: relative;
	height: 55px;
	margin: 10px 0;
}
.input-slider input {
	position: relative;
	height: 100%;
	width: 100%;
	outline: none;
	color: #333;

	padding: 0 40px 0 16px;
	border: 2px solid lightgrey;
	border-radius: 10px;
	transition: all 0.3s ease;
}
.input-slider input:focus,
	.input-slider input:valid {
		border-color: #00ADEE;
	}

	.input-slider i,
	.input-slider label {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		color: #a6a6a6;
		transition: all 0.3s ease;
	}

	.input-slider label {
		border-radius: 10px;
		left: 15px;
		font-size: 18px;
		font-weight: 400;
		background: #fff;
		padding: 0 6px;
		pointer-events: none;
	}

	.input-slider input:focus~label,
	.input-slider input:valid~label {
		top: 0;
		font-size: 14px;
		color: #00ADEE;
	}

	.input-slider i {
		right: 15px;
		cursor: pointer;
		padding: 8px;
	}







	.input-box {
		position: relative;
		height: 55px;
		margin: 10px 0;
	}

	.input-box input {
		position: relative;
		height: 100%;
		width: 100%;
		outline: none;
		color: #333;

		padding: 0 40px 0 16px;
		border: 2px solid lightgrey;
		border-radius: 10px;
		transition: all 0.3s ease;
	}

	.input-box input:focus,
	.input-box input:valid {
		border-color: #00ADEE;
	}

	.input-box i,
	.input-box label {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		color: #a6a6a6;
		transition: all 0.3s ease;
	}

	.input-box label {
		border-radius: 10px;
		left: 15px;
		font-size: 18px;
		font-weight: 400;
		background: #fff;
		padding: 0 6px;
		pointer-events: none;
	}

	.input-box input:focus~label,
	.input-box input:valid~label {
		top: 0;
		font-size: 14px;
		color: #00ADEE;
	}

	.input-box i {
		right: 15px;
		cursor: pointer;
		padding: 8px;
	}

	.alert {
		display: flex;
		align-items: center;
		margin-top: -13px;
	}

	.alert .error {
		color: #D93025;
		font-size: 18px;
		display: none;
		margin-right: 8px;
	}

	.text {
		font-size: 18px;
		font-weight: 400;
		color: #a6a6a6;
	}

	.input-box.button input {
		border: none;
		font-size: 20px;
		color: #fff;
		letter-spacing: 1px;
		background: #4070F4;
		cursor: not-allowed;
	}

	.input-box.button input.active:hover {
		background: #265df2;
		cursor: pointer;
	}
/* input form custom */

	/* custom notification  */
	.error {
		border-radius: 10px;
		padding: 15px;
		font-weight: 400;
		background-color: #FF5630;
		color: #FFEBE6;

		align-items: center;
		text-align: center;
	}

	.error ul {
		margin: 5px;
		padding: 0px;
		font-weight: 400;
		align-items: center;
		text-align: center;
	}

	.success {
		border-radius: 10px;
		padding: 15px;
		font-weight: 400;
		text-align: center;
		align-items: center;

		background-color: #00875A;
		color: #E3FCEF;

	}

	/* end custom notification  */


	/* root color */
	:root, [data-bs-theme=light] {
		--bs-blue: #5D87FF;
		--bs-indigo: #6610f2;
		--bs-purple: #6f42c1;
		--bs-pink: #d63384;
		--bs-red: #FA896B;
		--bs-orange: #fd7e14;
		--bs-yellow: #FFAE1F;
		--bs-green: #13DEB9;
		--bs-teal: #20c997;
		--bs-cyan: #539BFF;
		--bs-black: #000;
		--bs-white: #fff;
		--bs-gray: #F2F6FA;
		--bs-gray-dark: #343a40;
		--bs-gray-100: #333F55;
		--bs-gray-200: #465670;
		--bs-gray-300: #7C8FAC;
		--bs-gray-400: #DFE5EF;
		--bs-gray-500: #EAEFF4;
		--bs-gray-600: #F2F6FA;
		--bs-gray-700: #465670;
		--bs-gray-800: #343a40;
		--bs-gray-900: #212529;
		--bs-primary: #5D87FF;
		--bs-secondary: #49BEFF;
		--bs-success: #13DEB9;
		--bs-inverse: #333F55;
		--bs-info: #539BFF;
		--bs-warning: #FFAE1F;
		--bs-danger: #FA896B;
		--bs-light: #465670;
		--bs-dark: #333F55;
		--bs-indigo: #6610f2;
		--bs-light-primary: #253662;
		--bs-light-secondary: #1C455D;
		--bs-light-success: #1B3C48;
		--bs-light-warning: #4D3A2A;
		--bs-light-danger: #4B313D;
		--bs-light-indigo: #39235c;
		--bs-light-info: #223662;
		--bs-gray-200: #465670;
		--bs-dark-primary: #7067a4;
		--bs-dark-info: #6099a9;
		--bs-dark-success: #5cab99;
		--bs-dark-warning: #ae8e59;
		--bs-dark-danger: #b18d7c;
		--bs-dark-indigo: #557fb9;
		--bs-dark-light: #333F55;
		--bs-primary-rgb: 93, 135, 255;
		--bs-secondary-rgb: 73, 190, 255;
		--bs-success-rgb: 19, 222, 185;
		--bs-inverse-rgb: 51, 63, 85;
		--bs-info-rgb: 83, 155, 255;
		--bs-warning-rgb: 255, 174, 31;
		--bs-danger-rgb: 250, 137, 107;
		--bs-light-rgb: 70, 86, 112;
		--bs-dark-rgb: 51, 63, 85;
		--bs-indigo-rgb: 102, 16, 242;
		--bs-light-primary-rgb: 37, 54, 98;
		--bs-light-secondary-rgb: 28, 69, 93;
		--bs-light-success-rgb: 27, 60, 72;
		--bs-light-warning-rgb: 77, 58, 42;
		--bs-light-danger-rgb: 75, 49, 61;
		--bs-light-indigo-rgb: 57, 35, 92;
		--bs-light-info-rgb: 34, 54, 98;
		--bs-gray-200-rgb: 70, 86, 112;
		--bs-dark-primary-rgb: 112, 103, 164;
		--bs-dark-info-rgb: 96, 153, 169;
		--bs-dark-success-rgb: 92, 171, 153;
		--bs-dark-warning-rgb: 174, 142, 89;
		--bs-dark-danger-rgb: 177, 141, 124;
		--bs-dark-indigo-rgb: 85, 127, 185;
		--bs-dark-light-rgb: 51, 63, 85;
		--bs-primary-text-emphasis: #253666;
		--bs-secondary-text-emphasis: #1d4c66;
		--bs-success-text-emphasis: #08594a;
		--bs-info-text-emphasis: #213e66;
		--bs-warning-text-emphasis: #66460c;
		--bs-danger-text-emphasis: #64372b;
		--bs-light-text-emphasis: #465670;
		--bs-dark-text-emphasis: #465670;
		--bs-primary-bg-subtle: #dfe7ff;
		--bs-secondary-bg-subtle: #dbf2ff;
		--bs-success-bg-subtle: #d0f8f1;
		--bs-info-bg-subtle: #ddebff;
		--bs-warning-bg-subtle: #ffefd2;
		--bs-danger-bg-subtle: #fee7e1;
		--bs-light-bg-subtle: #999faa;
		--bs-dark-bg-subtle: #DFE5EF;
		--bs-primary-border-subtle: #becfff;
		--bs-secondary-border-subtle: #b6e5ff;
		--bs-success-border-subtle: #a1f2e3;
		--bs-info-border-subtle: #bad7ff;
		--bs-warning-border-subtle: #ffdfa5;
		--bs-danger-border-subtle: #fdd0c4;
		--bs-light-border-subtle: #465670;
		--bs-dark-border-subtle: #EAEFF4;
		--bs-white-rgb: 255, 255, 255;
		--bs-black-rgb: 0, 0, 0;
		--bs-font-sans-serif: "Plus Jakarta Sans", sans-serif;
		--bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
		--bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
		--bs-body-font-family: var(--bs-font-sans-serif);
		--bs-body-font-size: 0.875rem;
		--bs-body-font-weight: 400;
		--bs-body-line-height: 1.5;
		--bs-body-color: #7C8FAC;
		--bs-body-color-rgb: 124, 143, 172;
		--bs-body-bg: #2A3447;
		--bs-body-bg-rgb: 42, 52, 71;
		--bs-emphasis-color: #000;
		--bs-emphasis-color-rgb: 0, 0, 0;
		--bs-secondary-color: rgba(124, 143, 172, 0.75);
		--bs-secondary-color-rgb: 124, 143, 172;
		--bs-secondary-bg: #465670;
		--bs-secondary-bg-rgb: 70, 86, 112;
		--bs-tertiary-color: rgba(124, 143, 172, 0.5);
		--bs-tertiary-color-rgb: 124, 143, 172;
		--bs-tertiary-bg: #333F55;
		--bs-tertiary-bg-rgb: 51, 63, 85;
		--bs-heading-color: #EAEFF4;
		--bs-link-color: #5D87FF;
		--bs-link-color-rgb: 93, 135, 255;
		--bs-link-decoration: underline;
		--bs-link-hover-color: #4a6ccc;
		--bs-link-hover-color-rgb: 74, 108, 204;
		--bs-code-color: #d63384;
		--bs-highlight-bg: #ffefd2;
		--bs-border-width: 1px;
		--bs-border-style: solid;
		--bs-border-color: #333F55;
		--bs-border-color-translucent: rgba(0, 0, 0, 0.175);
		--bs-border-radius: 7px;
		--bs-border-radius-sm: 5px;
		--bs-border-radius-lg: 15px;
		--bs-border-radius-xl: 12px;
		--bs-border-radius-xxl: 2rem;
		--bs-border-radius-2xl: var(--bs-border-radius-xxl);
		--bs-border-radius-pill: 50rem;
		--bs-box-shadow: 0px 15px 30px rgba(0, 0, 0, 0.3);
		--bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
		--bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
		--bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
		--bs-focus-ring-width: 0.25rem;
		--bs-focus-ring-opacity: 0.25;
		--bs-focus-ring-color: rgba(93, 135, 255, 0.25);
		--bs-form-valid-color: #13DEB9;
		--bs-form-valid-border-color: #13DEB9;
		--bs-form-invalid-color: #FA896B;
		--bs-form-invalid-border-color: #FA896B;
	}
	/* end of root color */