/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */
/**
 * Environment for all styles (variables, additions, etc).
 */
/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/
.pk-scroll-to-top {
	--pk-scrolltop-background: #FEB912;
	--pk-scrolltop-icon-color: #FFFFFF;
	--pk-scrolltop-opacity: 1;
	--pk-scrolltop-opacity-hover: 0.7;
}

/*--------------------------------------------------------------*/
.pk-scroll-to-top {
	background: var(--pk-scrolltop-background);
	display: none;
	position: fixed;
	left: -9999px;
	bottom: 2rem;
	opacity: 0;
	transition: opacity 0.25s;
	width: 55px; 
	height: 55px;
	border-radius: 50%;
	border: 2px solid #fff;
	-webkit-box-shadow: 0 3px 12px rgba(0, 0, 0, 0.2);
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.2);
	z-index:9999;
}

.pk-scroll-to-top.pk-active {
	opacity: var(--pk-scrolltop-opacity);
	left: auto;
	right: 2rem;
}

.pk-scroll-to-top:hover {
	opacity: var(--pk-scrolltop-opacity-hover);
}

.pk-scroll-to-top .pk-icon {
	display: block;
	color: var(--pk-scrolltop-icon-color);
	transition: opacity .2s ease;
	font-size:40px;
	line-height: 1;
	padding: 7px;
	align-items: center; 
	justify-content: center;
	z-index:9999;
}

@media (min-width: 760px) {
	.pk-scroll-to-top {
		display: block;
	}
}
