@charset "UTF-8";
/* CSS Document */

.titleheader {position: relative;}
.titleheader .head {display: flex; gap: .5em; font-size: 2em;}
.titleheader img {position: absolute; left: 0; top:0; z-index: -1; width: 100%; height: auto;}
h1.pagetitle {font-weight: 300; color: var(--orange); letter-spacing: .01em; font-size: 1em;}
.titleheader svg.loghinoaat {display: inline; width:1em; fill: none; stroke:var(--orange); stroke-width: .1em; transform: scale(-1, 1);}
.titleheader p {width: 50vw; font-size: clamp(12px, 7vw, 20px); line-height: 1.3em; font-weight: 300; margin: 1em; margin-top: 0; padding: 0 0 0 1em; border-left: solid .5em var(--grigino);}
@media (max-width: 550px) { .titleheader p {width: 80vw; margin: 1em 0;} }

.blognormal {margin-top: 4em;}
.blognormal a {color: var(--text); text-decoration: none;}
.blognormal img {width: 100%; height: auto; aspect-ratio:3/2; object-fit: cover; box-sizing: border-box; border: solid 0 var(--bkg); transition: all 0.3s ease-in-out;}
.blognormal a.blog-item:hover img {box-sizing: border-box; border: solid .5em var(--bkg);}
.blognormal pre {display: block; width: fit-content; margin:0; padding: .2em .4em; margin-bottom: 1em; background: var(--orange); color: var(--white);}

.blognormal h2.title {display: inline; background-image: linear-gradient(to right, var(--orange), var(--orange)); background-repeat: no-repeat; background-size: 0% 2px; background-position: left bottom; transition: background-size 0.3s ease-in-out;}

.blognormal a:hover h2.title {background-size: 100% 2px;}

.blognormalwrapper {display:flex; flex-flow: row wrap; gap: 2em;}
.blog-item {flex: 1 0 30%; min-width: 15em; background: var(--white); padding: 1em; box-sizing: border-box;}


/* POSIZIONAMENTO BANNER */
.blognormalwrapper .blog-item:nth-child(1) {order: 1;}
.blognormalwrapper .blog-item:nth-child(2) {order: 2;}
.blognormalwrapper .blog-item:nth-child(3) {order: 3;}
.blognormalwrapper .bannerdi136 {order: 4;}
.blognormalwrapper .blog-item {order: 100;}
.blognormalwrapper .bannerdi137 {order: 101;}


/* banner */
.blognormalwrapper .banneritem {width: 100%;}
.blognormalwrapper .banneritem img {width: 100%; height: auto; aspect-ratio: auto;}


/* elenco altre categorie */
.cat-children {padding: 1em; background: var(--marroncino); margin-top: 4em;}
.cat-children h2 {display: block; text-align: center; margin: 0; color: var(--text); font-weight: 300; padding-bottom: .5em; margin-bottom: .5em; border-bottom: dotted 2px var(--orange);}
.cat-children-wrapper {display: flex; flex-flow: row wrap; justify-content: center; gap: .5em 0;}
.cat-children-wrapper .com-content-category-blog__child {padding: 0 .5em; border-right: solid 1px var(--text);}
.cat-children-wrapper .com-content-category-blog__child:last-child {border-right: 0;}
.cat-children-wrapper h3 {margin: 0;}
.cat-children-wrapper a {font-weight: 200; color: var(--orange); text-decoration: none; padding: .1em .2em; font-size: 1em;}
.cat-children-wrapper a:hover {background:var(--orange); color:var(--white);}
@media (max-width: 550px) { .cat-children-wrapper {flex-flow: column nowrap;} .cat-children-wrapper h3 {text-align: center;} .cat-children-wrapper .com-content-category-blog__child {border-right: 0; border-bottom: solid 1px var(--brown); padding-bottom: .5em;} .cat-children-wrapper a {font-size: 1.2em;}}



/* paginazione */
.com-content-category-blog__navigation {border-top: solid 1px var(--grigione); margin-top: 2em;}
ul.pagination {display: flex; flex-flow: row nowrap; justify-content: center; list-style: none; font-size: 2em;}
ul.pagination .page-item, ul.pagination .page-item span {display: flex; justify-content: center; align-items: center; width: 1em; height: 1em;}
ul.pagination .disabled.page-item {display: none;}
ul.pagination  .active.page-item a {color: var(--orange);}
ul.pagination .page-item svg {height: 100%;}
ul.pagination .page-item:hover svg {fill: var(--darkorange);} 
ul.pagination .page-item:hover a {color: var(--darkorange);}

ul.pagination .page-item a {text-decoration: none; color: var(--black);}
ul.pagination .page-item {margin: 0 .3em;}
ul.pagination .page-item:nth-child(-n+2),
ul.pagination .page-item:nth-last-child(-n+2) {margin: 0; width:.8em; height:1em;}