.edit-page-preview-container{
    position: relative;
}
.hellobar-preview.renotify-hellobar-container{
    top: 0.938rem;
    animation: none !important;
	scale: unset !important;
	z-index: 10!important;
}
.edit-page-preview-container.tablet .hellobar-preview.renotify-hellobar-container{
	scale: 0.56!important;
}
.edit-page-preview-container.mobile .hellobar-preview.renotify-hellobar-container{
	scale: 0.3!important;
}
.stickyHello.top{
	position: sticky !important;	
	top: 0;
	animation: smoothScroll 1s forwards;
	box-shadow: 0 0.938rem 2.5rem rgba(0, 0, 0, 0.06);
/* 	width: 100%; */
}
@keyframes smoothScroll {
	0% {
		transform: translateY(-40px);
	}
	100% {
		transform: translateY(0px);
	}
}
.renotify-hellobar-container.top{
	 position: relative;
}

.renotify-hellobar-container {
    position: fixed;
    z-index: 999;
    background-color: #D9F0F2;
    width: -webkit-fill-available;
	width: -moz-available;
	width: fill-available;
    box-sizing: border-box;
    animation: slideDown 0.5s ease-in-out;
    padding: 0.938rem 0.625rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
	top:0;
/* 	border-radius: 0.5rem; */
	margin: 1.5rem 0.625rem;
}
.renotify-hellobar-container.bottom{
	bottom: 0.938rem;
	top: unset;
}
.edit-page-preview-box .renotify-hellobar-container{
	position: absolute;
}
.renotify-hellobar-main {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-between;
	justify-content: center;
    align-items: center;
    z-index: 99999;
    flex-basis: 96%;
    gap: 2.625rem;
}

.renotify-hellobar-main.left .hellobar-button {
    order: 1;
}

.renotify-hellobar-main.left .hellobar-content {
    order: 2;
}

.renotify-hellobar-main.middle{
	flex-direction: column;
}

.hellobar-content{
    color: #424242;
    font-weight: 400;
    font-size: 0.875rem;
	line-height: normal;
}
.hellobar-content.hellobar-content-ctr{
    flex-basis: 44%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.close-hellobar-btn{
    cursor: pointer;
    flex-basis: 4%;
    display: inherit;
}

.close-hellobar-btn svg{
	width: 0.875rem;
	height: 0.875rem;
}

.close-hellobar-btn svg path{
/* 	fill: #424242; */
}

.renotify-hellobar-link {
    color: #FED571;
    text-decoration: none;
    font-weight: 500;
    font-size: 1.25rem;
}
/*simple announcement bar*/
.renotify-hellobar-container.simple-announcement-bar{
    background-color: #ffffff;
    color: #1A1A1A;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    margin: 0.625rem;
/*     border-radius: 1rem; */
    padding: 1rem;
}
.renotify-hellobar-container.simple-announcement-bar .close-hellobar-btn path{
    fill: #1A1A1A;
}
.renotify-hellobar-container.simple-announcement-bar .hellobar-content{
    color: #1A1A1A;
}

/*simple announcement bar*/
.renotify-hellobar-container.contact{
    background-color: #ffffff;
    color: #1A1A1A;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    margin: 1.25rem 0.625rem;
    border-radius: 1rem;
    padding: 1rem;
}
.renotify-hellobar-container.contact .hellobar-content{
    color: #1A1A1A;
}
.renotify-hellobar-container.contact .close-hellobar-btn path{
    fill: #1A1A1A;
}
.renotify-hellobar-container.contact .close-hellobar-btn{
   position: absolute;
   right: 0.625rem;
}
.renotify-hellobar-container.contact .hellobar-btn{
    background-color: #1A1A1A;
    color: #ffffff;
    border-radius: 1rem;
    padding: 1rem;
    text-decoration: none;
    transition: all .3s;
    text-wrap-mode: nowrap;
	font-size: 0.875rem;
}
.renotify-hellobar-container.contact .hellobar-btn:hover{
    background-color: #ffffff;
    color: #1A1A1A;
    outline: 0.063rem solid #1A1A1A;
    transition: all .3s;
}

.hellobar-btn{
	display:block;
	text-align: center;
    min-width: 4rem;
}

.hellobar-btn.filled {
    text-decoration: none;
    padding: 0.625rem 1.25rem;
}

.hellobar-btn.outline {
    background: transparent !important;
    border: 0.063rem solid;
	padding: 0.625rem 1.25rem;
	text-decoration: none;
}
@keyframes slideUp {
    from {
        transform: translateY(0);
    }

    to {
        transform: translateY(-100%);
    }
}

@keyframes slideDown {
    from {
        transform: translateY(-100%);
    }

    to {
        transform: translateY(0);
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}
@media screen and (min-width: 992px){
    .renotify-hellobar-main {

        flex-direction: unset;       
    }
}