/* costanza */
.costanza{
	border-radius:100%;
	width:180px;
}
.reverse{
	transform: scaleX(-1);
}

/* Popups */
#no-js .css-popup-body{
	display:flex;
	align-items:center;
	justify-content:center;
	background: var(--background-color);
}
#no-js .css-popup-body .css-popup-close svg{
	stroke:var(--main-color);
}
#no-js .css-popup-body img{
	border-radius: 100%;
}

/* Inputs */
#no-js .image-input-radio{
	border-color: var(--text-color);
}
#no-js .image-input-radio::before{
	background: var(--background-color);
}
#no-js .image-input-radio:has(input:checked)::before{
	opacity:0.5;
}
#no-js .image-input-radio::after{
	background: var(--text-color);
}
#no-js .image-input-radio:has(input:checked)::after{
	transform:scale(0.5);
}
#no-js .image-input-radio:has(input:focus){
	border-color: var(--main-color);
	box-shadow: 0px 0px 4px var(--main-color);
}

#no-js .image-input-check{
	border-color: var(--text-color);
}
#no-js .image-input-check::before{
	background: var(--background-color);
}
#no-js .image-input-check:has(input:checked)::before{
	opacity:0.5;
}
#no-js .image-input-check::after{
	background: var(--text-color);
}
#no-js .image-input-check:has(input:checked)::after{
	transform:scale(0.7);
}
#no-js .image-input-check:has(input:focus){
	border-color: var(--main-color);
	box-shadow: 0px 0px 4px var(--main-color);
}

/* Tabs */
#no-js .css-tab{
	background:var(--background-color);
	border: 2px solid var(--text-color);
}
#no-js .css-tab > .css-tab-inner{
	background: var(--background-color);
}
#no-js .css-tab > .css-tab-inner > input:checked + label{
	border-color:var(--text-color);
}
#no-js .css-tab > .css-tab-inner > input + label + .css-tab-wrapper{
	display:flex;
	align-items:center;
	justify-content:center;
	background: var(--background-color);
}
#no-js .css-tab > .css-tab-inner > input + label + .css-tab-wrapper p{
	font-size:18px;
}
#no-js #tab-2{
	background: var(--text-color);
	color: var(--background-color);
}
#no-js #tab-3{
	background: var(--main-color);
	color: var(--header-color);
}

/* Slider */
#no-js .css-slider{
	width:100%;
	margin:auto;
}
#no-js .css-slider > input + .css-slider-item-wrapper .css-slider-item .css-slider-item-body{
	display:flex;
	align-items:center;
	justify-content:center;
}
#no-js .css-slider > input + .css-slider-item-wrapper .css-slider-item .css-slider-item-body img{
	max-width:100%;
	max-height:100%;
}

#no-js .css-slider > input + .css-slider-item-wrapper .css-slider-prev svg,
#no-js .css-slider > input + .css-slider-item-wrapper .css-slider-next svg{
	position: absolute;
	top:50%; left:50%;
	width:21px;
	stroke:black;
}
#no-js .css-slider > input + .css-slider-item-wrapper .css-slider-prev svg{
	transform: translate(-50%, -50%) rotate(90deg);
}
#no-js .css-slider > input + .css-slider-item-wrapper .css-slider-next svg{
	transform: translate(-50%, -50%) rotate(-90deg);
}
@media (min-width:1000000px){
	#no-js #slider-1.css-slider > input + .css-slider-item-wrapper  .css-slider-item {
		width:50%;
		padding:10px;
		transition: transform 500ms ease-in-out;
	}
	#no-js #slider-1.css-slider > input:nth-child(4n+1) + .css-slider-item-wrapper  .css-slider-item {
		transform:translate(-200%);
	}
	#no-js #slider-1.css-slider > input:checked + .css-slider-item-wrapper .css-slider-item{
		transform:translate(0%);
	}
	#no-js #slider-1.css-slider > input:checked + .css-slider-item-wrapper ~ .css-slider-item-wrapper .css-slider-item{
		transform: translate(200%);
	}
	#no-js #slider-1.css-slider > input:checked + .css-slider-item-wrapper + input + .css-slider-item-wrapper + input + .css-slider-item-wrapper ~ .css-slider-item-wrapper .css-slider-item{
		transform: translate(300%);
	}
	#no-js #slider-1.css-slider > input:checked + .css-slider-item-wrapper + input + .css-slider-item-wrapper  .css-slider-item {
		transform: translate(100%);
	}
	#no-js #slider-1.css-slider > input + .css-slider-item-wrapper .css-slider-prev{
		opacity:0;
		pointer-events:all;
	}
	#no-js #slider-1.css-slider > input:checked + .css-slider-item-wrapper .css-slider-prev{
		opacity:1;
		pointer-events:none;
	}
	#no-js #slider-1.css-slider > input:checked + .css-slider-item-wrapper ~ .css-slider-item-wrapper  .css-slider-prev{
		opacity:0;
		pointer-events:none;
	}
	
	
	#no-js #slider-1.css-slider > input:checked + .css-slider-item-wrapper .css-slider-next{
		opacity:0;
		pointer-events:none;
	}
	#no-js #slider-1.css-slider > input:checked + .css-slider-item-wrapper + input + .css-slider-item-wrapper  .css-slider-next {
		opacity:1;
		pointer-events:all;
	}
}


/* Popup + Tabs */
input.css-popup + .css-popup-container .css-popup-body.css-tab{
	width:auto;
	height:auto;
}
input.css-popup + .css-popup-container .css-popup-body.css-tab .css-tab-inner{
	width:500px;
}
input.css-popup + .css-popup-container .css-popup-body.css-tab .css-tab-inner input[type="checkbox"].image-input + span,
input.css-popup + .css-popup-container .css-popup-body.css-tab .css-tab-inner input[type="radio"].image-input + span{
	margin:0px 10px;
}

/* Slider + Popup */
.css-slider-item-body > label{
	cursor:pointer;
	width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.css-popup-container.css-popup-slider-container > img{
	max-width:100%;
	max-height:100%;
}