.btnpainel{
    position: fixed;
    top: 10px;
    right: 10px;
    z-index: 99999999999999999999;

    background-color: hsl(0deg 0% 20%);
    padding: 10px;
    border-radius: 5px;
    transition: all .28s linear;

    color: #FFF;
    font-family: sans-serif;
    text-decoration: none;
}

.btnpainel:hover {
	background-color: hsl(0deg 0% 27%);
}

.btn__whatsapp{

	text-decoration: none;
	text-shadow: -1px 1px rgba(0,0,0,.24);
	font-family: 'Montserrat', sans-serif;
	color: #FFF;

	display: -webkit-inline-box;

	display: -ms-inline-flexbox;

	display: inline-flex;
	gap: 0.75rem;

	background: hsl(129, 72%, 42%);
	padding: var(--btn__whatsapp-padding-y) var(--btn__whatsapp-padding-x);
	border-radius: 50rem;
	transition:
		all .3s linear
	;
	border: 1px solid rgba(0,0,0,.13);
}

.btn__whatsapp:hover {
	background: hsl(129, 72%, 32%);
}

@media (max-width: 991px) {

    .btn__whatsapp__content {
        display: none;
    }

    .btn__whatsapp {
        --size: 3.5rem;

        width: var(--size);
        height: var(--size);
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
}
@media (min-width: 992px) {
    .btn__whatsapp--hidden {
        opacity: 0;
        pointer-events: none;
    }

    .btn__whatsapp {
        --btn__whatsapp-padding-y: .75rem;
        --btn__whatsapp-padding-x: 1rem;
    }
}

.btn__whatsapp__content{
    line-height: 1;
}

.btn__whatsapp .fa-whatsapp,
.btn__whatsapp svg
{
    font-size: 2rem;
    -ms-flex-item-align: center;
        -ms-grid-row-align: center;
        align-self: center;
}

.btn__whatsapp--fixed{
    position: fixed;
    right: 1rem;
    z-index: 50;
    bottom: var(--btn__whatsapp-bottom, 1rem);
    -webkit-box-shadow: 0 0 1rem rgba(0,0,0,.5);
            box-shadow: 0 0 1rem rgba(0,0,0,.5);
    -webkit-transition: all .3s linear;
    -o-transition: bottom .3s linear;
    transition:
    	background .3s linear,
    	bottom .3s linear,
    	opacity .3s linear
    ;
}

.alert__cookies{
	position: fixed;
	z-index: 50;

	left: 50%;
	bottom: 1rem;
	transform: translateX(-50%);

	background: #FFF;
	padding: 1.5rem;
	border-radius: 1rem;
	box-shadow: 0 0 1rem rgba(0, 0, 0, .25);

	width: 780px;
	max-width: calc(100% - 4rem);

	color: #323232;
	font-family: Montserrat, sans-serif;
	font-size: 1rem;
}

.alert__cookies:not(.show) {
	display: none;
}

.alert__cookies.show {
	animation: alertCookiesIn .4s linear;
}

.alert__cookies.hide {
	animation: alertCookiesOut .4s linear forwards;
}

.alert__cookies a {
	color: hsl(215.75deg 98.36% 52.16%);
}

.alert__cookies__btn{
	--cookies-btn-color: #FFF;
	--cookies-btn-bg: hsl(215.75deg 98.36% 52.16%);

	--cookies-btn-hover-color: #FFF;
	--cookies-btn-hover-bg: hsl(215.75deg 98.36% 40.16%);

	display: block;
	margin-top: 1rem;
	margin-left: auto;
	margin-right: auto;

	color: var(--cookies-btn-color);
	font-size: 1rem;

	background: var(--cookies-btn-bg);
	border: none;
	padding: .75rem 1.75rem;
	border-radius: 4rem;
	cursor: pointer;

	transition: all .25s linear;
}

.alert__cookies__btn:hover {
	color: var(--cookies-btn-hover-color);
	background: var(--cookies-btn-hover-bg);
	box-shadow: 0 0 .5rem rgba(0, 0, 0, .2);
}


@keyframes alertCookiesIn {
	from {
		transform: translate(-50%, 100%);
		opacity: 0;
	}

	to {
		transform: translate(-50%, 0);
		opacity: 1;
	}
}

@keyframes alertCookiesOut {
	to {
		transform: translate(-50%, 100%);
		opacity: 0;
	}

	from {
		transform: translate(-50%, 0);
		opacity: 1;
	}
}