.astari-wrapper {
	position: fixed;
	width: 100vw;
	height: 100vh;
	z-index: 10001;
	left: 0;
	display: flex;
	align-items: end;
	justify-content: end;
	pointer-events: none;
	top: 2px;
}
@media (min-width: 1440px)  {
	.astari--navigation{
		/* right: calc( (100vw - 1440px ) / 2 ) !important ; */
		right: 0;
	}
}
.astari--navigation{
	position: absolute;
	/* bottom: 0; */
	display: flex;
	/* padding: .5rem; */
	/* right: 0 ; */
	/* align-items: flex-end; */
	pointer-events: bounding-box;
}

body.front-end html{
	overflow-x: hidden;
	scroll-behavior: smooth;
	font-family:'Poppins';
  font-family: Arial,
}
body.front-end{
	overflow-x: hidden;
	scroll-behavior: smooth;
  font-family: 'Open Sans' !important;
}
/* font bold and bolditalic */
  @font-face {
		font-family: 'Open Sans';
		src: url('font/OpenSans/OpenSans-Bold.ttf');
		font-weight: 700;
		font-style: normal;
	}
	@font-face {
		font-family: 'Open Sans';
		src: url('font/OpenSans/OpenSans-BoldItalic.ttf');
		font-weight: 700;
		font-style: italic;
	}

	/* font bold and bolditalic */
  @font-face {
		font-family: 'Open Sans';
		src: url('font/OpenSans/OpenSans-Bold.ttf');
		font-weight: 700;
		font-style: normal;
	}
	@font-face {
		font-family: 'Open Sans';
		src: url('font/OpenSans/OpenSans-BoldItalic.ttf');
		font-weight: 700;
		font-style: italic;
	}
	/* font extrabold and extrabolditalic */
  @font-face {
		font-family: 'Open Sans';
		src: url('font/OpenSans/OpenSans-ExtraBold.ttf');
		font-weight: 800;
		font-style: normal;
	}
	@font-face {
		font-family: 'Open Sans';
		src: url('font/OpenSans/OpenSans-ExtraBoldItalic.ttf');
		font-weight: 800;
		font-style: italic;
	}

		/* font regular and regularitalic */
		@font-face {
			font-family: 'Open Sans';
			src: url('font/OpenSans/OpenSans-Regular.ttf');
			font-weight: 400;
			font-style: normal;
		}
		@font-face {
			font-family: 'Open Sans';
			src: url('font/OpenSans/OpenSans-Italic.ttf');
			font-weight: 400;
			font-style: italic;
		}

		/* font light and lightitalic */
		@font-face {
			font-family: 'Open Sans';
			src: url('font/OpenSans/OpenSans-Light.ttf');
			font-weight: 300;
			font-style: normal;
		}
		@font-face {
			font-family: 'Open Sans';
			src: url('font/OpenSans/OpenSans-LightItalic.ttf');
			font-weight: 300;
			font-style: italic;
		}

		/* font medium and mediumitalic */
		@font-face {
			font-family: 'Open Sans';
			src: url('font/OpenSans/OpenSans-Medium.ttf');
			font-weight: 500;
			font-style: normal;
		}
		@font-face {
			font-family: 'Open Sans';
			src: url('font/OpenSans/OpenSans-MediumItalic.ttf');
			font-weight: 500;
			font-style: italic;
		}
		
		/* font medium and mediumitalic */
		@font-face {
			font-family: 'Open Sans';
			src: url('font/OpenSans/OpenSans-Medium.ttf');
			font-weight: 500;
			font-style: normal;
		}
		@font-face {
			font-family: 'Open Sans';
			src: url('font/OpenSans/OpenSans-MediumItalic.ttf');
			font-weight: 500;
			font-style: italic;
		}

			/* font semibold and semibolditalic */
			@font-face {
				font-family: 'Open Sans';
				src: url('font/OpenSans/OpenSans-SemiBold.ttf');
				font-weight: 600;
				font-style: normal;
			}
			@font-face {
				font-family: 'Open Sans';
				src: url('font/OpenSans/OpenSans-SemiBoldItalic.ttf');
				font-weight: 600;
				font-style: italic;
			}
.astari--navigation button{
	background: none;
	border: none;
	border-radius: 0;
}

.astari--navigation .astari--navigation-bubble{

	background-size: contain;
	background-repeat: no-repeat;
	padding: 0rem 1.35rem;
	position: absolute;
	width: 150px;
	display: none;
}

.astari--navigation .astari--navigation-bubble .astari--navigation-bubble-close button{
	background: none;
	bottom: 3rem;
	color: #C4C4C4;
	font-size: .8rem !important;
	right: 22px;
	top: 2px;
	position: absolute;
	padding: 0 0; 
}

.astari--navigation .astari--navigation-bubble p{
	font-size: .7rem !important;
	line-height: 1rem;
	margin: 1rem 0;
}

.astari--navigation .astari--navigation-bubble p span{
	color: #05A5B3;
	font-size: .7rem !important;
	line-height: 1rem;
}

.astari--navigation button{
	padding: 0 0 !important;
}

.astari--navigation button:hover{
	cursor: pointer;
}

.astari--navigation button img{
	height: 4rem;
	width: 4rem;
}

.astari--navigation .astari--navigation-contact{
	align-items: center;
	display: none;
	flex-direction: column;
	right: 75px;
}

.astari--navigation .astari--navigation-contact a{
	box-sizing: border-box;
	margin: 0;
}

.astari--navigation .astari--navigation-contact a img{
	height: 3rem;
	margin: .1rem 0;
	width: 3rem;
}

.astari--navigation .astari--navigation-contact button img{
	height: 3rem;
	margin: .1rem 0;
	width: 3rem;
}

@media screen and (min-width: 1024px) {
	.astari--navigation .astari--navigation-contact{
		bottom: 1rem;
		flex-direction: row;
		position: absolute;
	}
	.astari--navigation-contact.left {
		right: 5rem;
	}
	.astari--navigation-contact.right {
		right: 5rem;
	}
}
@media (max-width: 1024px) {
.astari--navigation {
	
	/* bottom: 4.8rem; */
	justify-content: flex-end;

}

}
@media (max-width: 767px) {
	#floating-snap-btn-wrapper {
		position: fixed;
		transform: translate(-50%, -50%);
		top: 70% !important;
		/* right: 7px !important; */
		width: 50px;
		height: 50px;
		border-radius: 50%;
 }
.astari--navigation .astari--navigation-bubble{
	display: none;
}

/* .astari-wrapper {
	top: -9rem;
} */
}
@media ( min-width: 768px) and (max-width: 1024px ) {
	.astari-wrapper {
		top: -24rem;
	}
}
 .img-icon-astari {
	height: 3rem;
    width: 3rem;
 }
  #main-wrapper {
	position: fixed;
    width: 10px;
    height: 100vh;
    z-index: 10001;
    left: 0;
    display: flex;
    align-items: end;
    justify-content: end;
    pointer-events: fill ;
    top: 2px;
}
  #floating-snap-btn-wrapper {
	 position: fixed;
	 transform: translate(-50%, -50%);
	 top: 80%;
	 right: 9%;
	 width: 50px;
	 height: 50px;
	 border-radius: 50%;
}
  #floating-snap-btn-wrapper .fab-btn {
	 position: absolute;
	 top: 0;
	 left: 0;
	 display: flex;
	 justify-content: center;
	 align-items: center;
	 width: 100%;
	 height: 100%;
	 border-radius: 50%;
	 background-color: transparent;
	 color: white;
	 z-index: 1000;

}
 #floating-snap-btn-wrapper .fab-btn img{
	height: 4rem;
	width: 4rem;
	margin-left: 1rem;
	margin-top: 1rem;
}
  #floating-snap-btn-wrapper ul {
	 position: relative;
	 width: 100%;
	 height: 100%;
	 top: 0;
	 left: 0;
	 margin-bottom: 0;
}
  #floating-snap-btn-wrapper ul li {
	 position: absolute;
	 top: 0;
	 right: 0;
	 /* width: 100%;
	 height: 100%; */
	 display: flex;
	 align-items: center;
	 justify-content: center;
	 /* background: #f7f7f7; */
	 color: black;
	 list-style-type: none;
	 transform: scale(0.95);
	 transition: 0.5s;
	 border-radius: 50%;
}
  #floating-snap-btn-wrapper.fab-active li:hover {
	 background-color: #f8e487;
}
#floating-snap-btn-wrapper.fab-active.left li:nth-child(5) {
	top: 0%;
	right: -540%;
	transition-delay: 0s;
}
#floating-snap-btn-wrapper.fab-active.left li:nth-child(4) {
	 top: 0%;
	 right: -440%;
	 transition-delay: 0s;
}
#floating-snap-btn-wrapper.fab-active.left li:nth-child(3) {
	 top: 0%;
	 right: -340%;
	 transition-delay: 0.2s;
}
  #floating-snap-btn-wrapper.fab-active.left li:nth-child(2) {
	 top: 0%;
	 right: -240%;
	 transition-delay: 0.4s;
}
 #floating-snap-btn-wrapper.fab-active.left li:nth-child(1) {
	 top: 0%;
	 right: -140%;
	 transition-delay: 0.4s;
}
  #floating-snap-btn-wrapper.fab-active.right li:nth-child(1) {
	 top: 0%;
	 right: 100%;
	 transition-delay: 0s;
}
  #floating-snap-btn-wrapper.fab-active.right li:nth-child(2) {
	 top: 0%;
	 right: 200%;
	 transition-delay: 0.2s;
}
  #floating-snap-btn-wrapper.fab-active.right li:nth-child(3) {
	 top: 0%;
	 right: 300%;
	 transition-delay: 0.2s;
}
#floating-snap-btn-wrapper.fab-active.right li:nth-child(4) {
	 top: 0%;
	 right: 400%;
	 transition-delay: 0.2s;
}
#floating-snap-btn-wrapper.fab-active.right li:nth-child(5) {
	top: 0%;
	right: 500%;
	transition-delay: 0.2s;
}