/* 
Theme Name: Ruspantino
Theme URI: https://ruspantino.com
Description: Tema ufficiale del sito Ruspantino.com
Author: Luca Rosaldi – PubliOne
Author URI: https://publione.it/
Template: hello-elementor
Text Domain: ruspantino
Version: 1.0.3
*/


/* -------------------------------------------*/
/* THEME GLOBAL VARS
/* -------------------------------------------*/
body.elementor-default {
}


/* -------------------------------------------*/
/* ELEMENTOR CUSTOM COLORS (NAMED)
/* -------------------------------------------*/
body.elementor-default {
	--e-global-color-white:     var(--e-global-color-aa1b005);
	--e-global-color-black:     var(--e-global-color-e5dd601);
	--e-global-color-black-75p: var(--e-global-color-b9af018);
	--e-global-color-gray-500:  var(--e-global-color-c95dc70);
	--e-global-color-beige:     var(--e-global-color-c2dda5d);
	--e-global-color-beige-75p: var(--e-global-color-17d3872);
	--e-global-color-red-700:   var(--e-global-color-f0ff4ff);
	--e-global-color-red-500:   var(--e-global-color-9dc9675);
	--e-global-color-green-700: var(--e-global-color-ff754b2);
	--e-global-color-green-500: var(--e-global-color-b97d33b);
}


/* -------------------------------------------*/
/* THEME RESET
/* -------------------------------------------*/
*, *::before, *::after {
	box-sizing: border-box;
}
* {
	margin: 0;
}
html, body {
	height: 100%;
	-webkit-text-size-adjust: none;
	text-size-adjust: none;
}
body {
	width: 100vw;
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
	scroll-behavior: smooth;
}
html {
	overflow: hidden;
}
img, picture, video, canvas, svg {
	display: block;
	max-width: 100%;
}
input, button, textarea, select {
	font: inherit;
}
p, h1, h2, h3, h4, h5, h6 {
	overflow-wrap: break-word;
}


/* -------------------------------------------*/
/* THEME TRANSITIONS
/* -------------------------------------------*/
.elementor a,
.elementor a::before,
.elementor-button .elementor-button-text,
.elementor input {
	transition: all .2s linear, transform .25s cubic-bezier(0.25, 1, 0.5, 1);
}


/* -------------------------------------------*/
/* THEME ANIMATIONS
/* -------------------------------------------*/

/* Override Zoom with Reveal animation */
.elementor-element.zoomInUp,
.elementor-element.zoomInDown,
.elementor-element.zoomInLeft,
.elementor-element.zoomInRight {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
	animation-name: none;
}
.elementor-element.zoomInUp.animated .elementor-widget-container,
.elementor-element.zoomInDown.animated .elementor-widget-container,
.elementor-element.zoomInLeft.animated .elementor-widget-container,
.elementor-element.zoomInRight.animated .elementor-widget-container {
	animation-duration: inherit;
	animation-delay: inherit;
	animation-timing-function: cubic-bezier(0.25, 1, 0.5, 1);
}
.elementor-element.zoomInUp.animated .elementor-widget-container    { animation-name: revealInUp; }
.elementor-element.zoomInDown.animated .elementor-widget-container  { animation-name: revealInDown; }
.elementor-element.zoomInLeft.animated .elementor-widget-container  { animation-name: revealInLeft; }
.elementor-element.zoomInRight.animated .elementor-widget-container { animation-name: revealInRight; }
@keyframes revealInUp    { from { transform: translateY(100%); } }
@keyframes revealInDown  { from { transform: translateY(-100%); } }
@keyframes revealInLeft  { from { transform: translateX(100%); } }
@keyframes revealInRight { from { transform: translateX(-100%); } }

/* Rotating badge */
.elementor-element.rotating {
	--rotate-duration: 40s;
}
.elementor-element.rotating .elementor-widget-container {
	animation: rotateClockwise var(--rotate-duration) linear infinite both paused;
}
.elementor-element.rotating .elementor-widget-container,
.elementor-element.rotating-on-hover:hover .elementor-widget-container {
	animation-play-state: running;
}
@keyframes rotateClockwise {
	to { transform: rotate(360deg); }	
}


/* -------------------------------------------*/
/* THEME SCROLLTRACK
/* -------------------------------------------*/
/* Firefox */
body.elementor-default,
body.elementor-default * {
  scrollbar-width: thin;
  scrollbar-color: var(--e-global-color-gray-500) var(--e-global-color-black);
}
/* Chrome, Edge, and Safari */
body.elementor-default::-webkit-scrollbar,
body.elementor-default *::-webkit-scrollbar {
  width: 12px;
}
body.elementor-default::-webkit-scrollbar-track,
body.elementor-default *::-webkit-scrollbar-track{
  background: var(--e-global-color-black);
}
body.elementor-default::-webkit-scrollbar-thumb,
body.elementor-default *::-webkit-scrollbar-thumb {
  background-color: var(--e-global-color-gray-500);
  border-radius: 20px;
  border: 3px solid var(--e-global-color-black);
}


/* -------------------------------------------*/
/* CLASS: GRID
/* -------------------------------------------*/
.elementor-element.grid {
	--grid-item-min-width: 480px;
	--grid-gap: 40px;
	
	display: grid;
	justify-content: center;
    grid-template-columns: repeat(auto-fit, minmax(var(--grid-item-min-width), 1fr));
    grid-gap: var(--grid-gap);
}


/* -------------------------------------------*/
/* CLASS: CARD
/* -------------------------------------------*/
a.elementor-element.card {
	cursor: pointer;
}
.elementor-element.card,
.elementor-element.card * {
	transition: all .25s linear, transform .25s ease-out;
}
	.elementor-element.card .card-label {
		--corner-radius: 1em;
		--border-width: 2px;
		--border-color: rgba(255,255,255,0.2);
		--border-padding: 5px;
	}
		/* Cutout corners with inner border  */
		.elementor-element.card .card-label .elementor-widget-heading {
			min-width: 200px;

			--cr: var(--corner-radius);
			--bp: var(--border-padding);
			--bw: var(--border-width);
			--bc: var(--border-color);
			--co: calc(var(--cr) + var(--bw));
			--bo: calc(var(--cr) * 2);
			--gr: #0000 calc(98% - var(--bw)),#000 calc(100% - var(--bw)) 98%,#0000;
			--mask-inside: 
			radial-gradient(farthest-side at 0    0   ,var(--gr)) 0    0   /var(--co) var(--co) no-repeat,
			radial-gradient(farthest-side at 100% 0   ,var(--gr)) 100% 0   /var(--co) var(--co) no-repeat,
			radial-gradient(farthest-side at 0    100%,var(--gr)) 0    100%/var(--co) var(--co) no-repeat,
			radial-gradient(farthest-side at 100% 100%,var(--gr)) 100% 100%/var(--co) var(--co) no-repeat,
			linear-gradient(90deg,#000 var(--bw),#0000 0 calc(100% - var(--bw)),#000 0) 50%/100% calc(100% - var(--bo)) no-repeat,
			linear-gradient(      #000 var(--bw),#0000 0 calc(100% - var(--bw)),#000 0) 50%/calc(100% - var(--bo)) 100% no-repeat;
			--mask-outside:
			radial-gradient(var(--cr) at 0    0   ,#0000 98%,#000) 0    0   /51% 51%  no-repeat,
			radial-gradient(var(--cr) at 100% 0   ,#0000 98%,#000) 100% 0   /51% 51%  no-repeat,
			radial-gradient(var(--cr) at 100% 100%,#0000 98%,#000) 100% 100%/51% 51%  no-repeat,
			radial-gradient(var(--cr) at 0    100%,#0000 98%,#000) 0    100%/51% 51%  no-repeat;	

			position: relative;
			-webkit-mask: var(--mask-outside);
			        mask: var(--mask-outside);
		}
		.elementor-element.card .card-label .elementor-widget-heading::before {
			content: "";
			position: absolute;
			pointer-events: none;
			inset: var(--bp);
			background: var(--bc);
			-webkit-mask: var(--mask-inside);
			        mask: var(--mask-inside);
		}
	.elementor-element.card .card-image {
	}
	.elementor-element.card .card-badges {
	}
	.elementor-element.card .card-cta {
	}
	/* Not hover state */
	.elementor-element.card:not(:hover) .card-image {
		opacity: 0.8;
	}
	a.elementor-element.card:not(:hover) .card-label {
		transform: scale(0.9);
	}
	a.elementor-element.card:not(:hover) .card-badges {
		opacity: 0;
		transform: translateX(-50%);
	}
	a.elementor-element.card:not(:hover) .card-cta {
		opacity: 0;
		transform: translateY(50%);
	}


/* -------------------------------------------*/
/* CLASS: MASK
/* -------------------------------------------*/
.elementor-element.mask-1 .elementor-widget-container,
.elementor-element.mask-2 .elementor-widget-container {
    -webkit-mask-size: cover;
            mask-size: cover;
    -webkit-mask-position: center;
            mask-position: center;
}
.elementor-element.mask-1 .elementor-widget-container {
    -webkit-mask-image: url(https://ruspantino.com/wp-content/uploads/2022/05/square-rugged-mask.svg);
    mask-image: url(https://ruspantino.com/wp-content/uploads/2022/05/square-rugged-mask.svg);
}
.elementor-button,
.elementor-element.mask-2 .elementor-widget-container {
    -webkit-mask-image: url(https://ruspantino.com/wp-content/uploads/2022/05/mask-rectangle-paint.svg);
    mask-image: url(https://ruspantino.com/wp-content/uploads/2022/05/mask-rectangle-paint.svg);
}


/* -------------------------------------------*/
/* THEME HEADER
/* -------------------------------------------*/
.elementor-element.elementor-widget-theme-site-logo a {
	display: inline-flex;
	justify-content: center;
}


/* -------------------------------------------*/
/* ELEMENTOR: LINKS
/* -------------------------------------------*/
.elementor p a,
.elementor .elementor-heading-title a,
.elementor .elementor-field-type-acceptance a {
	position: relative;
	color: inherit;
}
.elementor p a:hover, .elementor p a:focus,
.elementor .elementor-heading-title a:hover, .elementor .elementor-heading-title a:focus,
.elementor .elementor-field-type-acceptance a:hover, .elementor .elementor-field-type-acceptance a:focus {
	text-decoration: underline;
}


/* -------------------------------------------*/
/* ELEMENTOR: BUTTONS
/* -------------------------------------------*/
.elementor-button {
	position: relative;
	overflow: hidden;
	
	padding: 1.5em 2em;
	
    -webkit-mask-image: url(https://ruspantino.com/wp-content/uploads/2022/05/mask-rectangle-paint.svg);
    mask-image: url(https://ruspantino.com/wp-content/uploads/2022/05/mask-rectangle-paint.svg);
    -webkit-mask-size: cover;
            mask-size: cover;
    -webkit-mask-position: center;
            mask-position: center;
}
.elementor-button .elementor-button-content-wrapper,
.elementor-widget .elementor-button-icon {
	display: flex;
	align-items: center;
}


/* -------------------------------------------*/
/* ELEMENTOR: ICONS
/* -------------------------------------------*/
/* Fix display issues */
.elementor-icon {
	display: block;
}
/* Intensity Beans */
.elementor-element.bean {
	width: auto;
	transform: rotate(45deg);
}
.elementor-element.bean .elementor-icon svg {
	width: 0.5625em;
	height: 1.25em;
}


/* -------------------------------------------*/
/* ELEMENTOR: LIGHTBOX
/* -------------------------------------------*/
.elementor-lightbox .elementor-lightbox-image {
	background: var(--e-global-color-black);
}


/* -------------------------------------------*/
/* UTILITY CLASSES
/* -------------------------------------------*/
.sr-only {
    border: 0;
    clip: rect(0,0,0,0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}
.flip-x {
	transform: scaleX(-1);
}
.flip-y {
	transform: scaleY(-1);
}
.center .elementor-widget-container {
	transform: translate(-50%,-50%);
}