/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/

/* 22/05/2025 */
:root {
	--cnvs-body-font: "Noto Serif JP", serif;
	--cnvs-primary-font: "Noto Serif JP", serif;
	--cnvs-secondary-font: "Noto Serif JP", serif;
	--cnvs-themecolor: #8F050F;
}

.title-block {
    --cnvs-title-block-border-color: #8F050F;
}

.giappo-vertical {
    /* writing-mode: vertical-lr;
    text-orientation: upright; */
    
    writing-mode: vertical-lr;
    text-orientation: upright;
    line-height: 1;
    vertical-align: top;
    padding: 12px;
}

.tp-gradientstyle {
			background:-moz-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.75) 100%);
			background:-webkit-gradient(linear,left top,left bottom,color-stop(50%,rgba(0,0,0,0)),color-stop(99%,rgba(0,0,0,0.83)),color-stop(100%,rgba(0,0,0,0.75)));
			background:-webkit-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%);
			background:-o-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.75) 100%);
			background:-ms-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.75) 100%);
			background:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.75) 100%);
			filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000',endColorstr='#d9000000',GradientType=0);
		}
		.gyges .tp-thumb { opacity:1 }
		.gyges .tp-thumb-img-wrap {
			padding:3px;
			background-color:rgba(17,17,17,1);
			display:inline-block;
			width:100%;
			height:100%;
			position:relative;
			margin:0px;
			box-sizing:border-box;
			transition:all 0.3s;
			-webkit-transition:all 0.3s}.gyges .tp-thumb-image{padding:3px;
			display:block;
			box-sizing:border-box;
			position:relative;
			-webkit-box-shadow:inset 5px 5px 10px 0px rgba(17,17,17,1);
			-moz-box-shadow:inset 5px 5px 10px 0px rgba(17,17,17,1);
			box-shadow:inset 5px 5px 10px 0px rgba(17,17,17,1)
		}
		.gyges .tp-thumb:hover .tp-thumb-img-wrap,.gyges .tp-thumb.selected .tp-thumb-img-wrap {
			background:-moz-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(255,255,255,1) 100%);
			background:-webkit-gradient(left top,left bottom,color-stop(0%,rgba(255,255,255,1)),color-stop(100%,rgba(255,255,255,1)));
			background:-webkit-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(255,255,255,1) 100%);
			background:-o-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(255,255,255,1) 100%);
			background:-ms-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(255,255,255,1) 100%);
			background:linear-gradient(to bottom,rgba(255,255,255,1) 0%,rgba(255,255,255,1) 100%)
		}
		.gyges .tp-tab {
			opacity:1;
			padding:10px;
			box-sizing:border-box;
			font-family:"roboto",sans-serif;
			border-bottom:1px solid rgba(255,255,255,0.15)}.gyges .tp-tab-image{width:60px;
			height:60px;
			max-height:100%;
			max-width:100%;
			position:relative;
			display:inline-block;
			float:left
		}
		.gyges .tp-tab-content {
			background:rgba(0,0,0,0);
			position:relative;
			padding:15px 15px 15px 85px;
			left:0px;
			overflow:hidden;
			margin-top:-15px;
			box-sizing:border-box;
			color:rgba(51,51,51,0);
			display:inline-block;
			width:100%;
			height:100%;
			position:absolute
		}
		.gyges .tp-tab-date{display:block;
			color:rgba(255,255,255,0.5);
			font-weight:500;
			font-size:12px;
			margin-bottom:0px
		}
		.gyges .tp-tab-title {
			display:block;
			text-align:left;
			color:rgba(255,255,255,1);
			font-size:14px;
			font-weight:500;
			text-transform:none;
			line-height:17px
		}
		.gyges .tp-tab:hover,.gyges .tp-tab.selected { background:rgba(0,0,0,0.51)}
		
		
/* ------------------------
    sezione contattaci 
--------------------------- */

.modal-contatto {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
}

/* Contenitore della modal */
.modal-contatto-content {
    background-color: #fefefe;
    margin: 15% auto; 
    padding: 20px;
    border: 1px solid #888;
    width: 40%; 
}

/* Loader */
.loader-contatto {
    border: 16px solid #f3f3f3; 
    border-top: 16px solid #3498db; 
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 2s linear infinite; 
    margin: auto;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}