
.page-item.active .page-link{
	background-color: var(--primary-color) !important;
	border-color: var(--primary-color) !important;
	color: white !important;
}
.page-item a{
	color: var(--primary-color) !important;
	border-bottom-right-radius: 0 !important;
	border-top-right-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
	border-top-left-radius: 0 !important;
	border-radius: 25px !important;
	margin: 5px;
}

.txt__normal {
	 font-family: 'Pathway Gothic One', sans-serif;
	 font-weight: 400;
}
 .txt__normal--it {
	 font-family: 'Pathway Gothic One', sans-serif;
	 font-weight: 400;
	 font-style: italic;
}
 .txt__bold {
	 font-family: 'Pathway Gothic One', sans-serif;;
	 font-weight: 900;
}
 .txt__bold--it {
	 font-family: 'Pathway Gothic One', sans-serif;
	 font-weight: 900;
	 font-style: italic;
}
 .txt__awesome {
	 font: normal normal normal 14px/1 FontAwesome;
}

.c-day{
  color: var(--primary-color);
  font-family: 'Pathway Gothic One';
  font-weight: 500;
  font-size: 1.5em;
}

 .wrapper {
	 position: relative;
   color: var(--primary-color);
	 max-width: 1280px;
	 width: 100%;
	 margin: 0 auto;
}

 .u-border-box {
	 box-sizing: border-box;
	 -moz-box-sizing: border-box;
	 -webkit-box-sizing: border-box;
}
 .u-transition {
	 transition: all 0.4s cubic-bezier(0.4,0.0,0.2,1);
	 -webkit-transition: all 0.4s cubic-bezier(0.4,0.0,0.2,1);
}
 .u-transition.long {
	 transition: all 0.8s cubic-bezier(0.4,0.0,0.2,1);
	 -webkit-transition: all 0.8s cubic-bezier(0.4,0.0,0.2,1);
}
 .u-transition.elastic {
	 transition: all 0.25s cubic-bezier(0.175,0.885,0.320,1.275);
	 -webkit-transition: all 0.25s cubic-bezier(0.175,0.885,0.320,1.275);
}
 .resetDefaultApparence {
	 -webkit-appearance: none;
	 -moz-appearance: none;
	 -ms-appearance: none;
	 appearance: none;
	 border-radius: 0px;
	 padding: 0;
	 border-width: 0;
	 resize: none;
}
 .resetDefaultApparence::-ms-expand {
	 display: none;
}

.wrapper-head {
  font-family: 'Pathway Gothic One', sans-serif;
	 z-index: 100;
	 background: var(--primary-color);
	 display: flex;
	 justify-content: space-between;
	 align-items: center;
	 box-sizing: border-box;
	 -moz-box-sizing: border-box;
	 -webkit-box-sizing: border-box;
	 color: #ffffff;
	 letter-spacing: 1px;
	 font-size: 13px;
}
 .wrapper-head a {
	 color: #ffffff;
	 text-decoration: none;
}
 .c-monthyear {
	 display: flex;
}
 .c-month {
	 position: relative;
	 height: 80px;
	 line-height: 80px;
}
 .c-month #c-paginator {
	 position: relative;
	 width: 200px;
	 display: block;
	 height: 80px;
	 line-height: 80px;
	 text-align: center;
	 overflow: hidden;
}
 .c-month #c-paginator .c-paginator__month {
	 position: absolute;
	 width: 200px;
	 top: 0;
   font-size: 2em;
	 bottom: 0;
	 right: 0;
}
 .c-month #c-paginator .c-paginator__month:nth-child(1) {
	 left: 0;
}
 .c-month #c-paginator .c-paginator__month:nth-child(2) {
	 left: 200px;
}
 .c-month #c-paginator .c-paginator__month:nth-child(3) {
	 left: 400px;
}
 .c-month #c-paginator .c-paginator__month:nth-child(4) {
	 left: 600px;
}
 .c-month #c-paginator .c-paginator__month:nth-child(5) {
	 left: 800px;
}
 .c-month #c-paginator .c-paginator__month:nth-child(6) {
	 left: 1000px;
}
 .c-month #c-paginator .c-paginator__month:nth-child(7) {
	 left: 1200px;
}
 .c-month #c-paginator .c-paginator__month:nth-child(8) {
	 left: 1400px;
}
 .c-month #c-paginator .c-paginator__month:nth-child(9) {
	 left: 1600px;
}
 .c-month #c-paginator .c-paginator__month:nth-child(10) {
	 left: 1800px;
}
 .c-month #c-paginator .c-paginator__month:nth-child(11) {
	 left: 2000px;
}
 .c-month #c-paginator .c-paginator__month:nth-child(12) {
	 left: 2200px;
}
 .c-month .prev, .c-month .next {
	 position: absolute;
	 display: block;
	 top: 50%;
	 width: 30px;
	 height: 30px;
	 padding: 9px 12px;
	 background-color: var(--cal-color-fest);
	 cursor: pointer;
	 z-index: 10;
	 box-sizing: border-box;
	 -moz-box-sizing: border-box;
	 -webkit-box-sizing: border-box;
	 transform: translatey(-50%);
	 -webkit-transform: translatey(-50%);
	 border-radius: 50%;
	 -webkit-border-radius: 50%;
	 transition: all 0.4s cubic-bezier(0.4,0.0,0.2,1);
	 -webkit-transition: all 0.4s cubic-bezier(0.4,0.0,0.2,1);
}
 .c-month .prev.long, .c-month .next.long {
	 transition: all 0.8s cubic-bezier(0.4,0.0,0.2,1);
	 -webkit-transition: all 0.8s cubic-bezier(0.4,0.0,0.2,1);
}
 .c-month .prev.elastic, .c-month .next.elastic {
	 transition: all 0.25s cubic-bezier(0.175,0.885,0.320,1.275);
	 -webkit-transition: all 0.25s cubic-bezier(0.175,0.885,0.320,1.275);
}
 .c-month .prev {
	 left: 0;
}
 .c-month .prev:hover {
	 padding: 9px 10px;
	 background-color: var(--cal-back);
   color: var(--primary-color);
}
 .c-month .next {
	 right: 0;
}
 .c-month .next:hover {
	 padding: 9px 14px;
	 background-color: var(--cal-back);
   color: var(--primary-color);
}
 .c-paginator__year {
	 height: 80px;
	 line-height: 80px;
   font-size: 2em;
	 padding: 0px 20px;
}


 .o-btn {
	 display: inline-block;
	 padding: 0 10px;
   font-size: 2em;
	 cursor:pointer;
	 line-height: 30px;
	 height: 30px;
	 background-color: var(--cal-color-fest);
	 text-transform: uppercase;
	 transition: all 0.4s cubic-bezier(0.4,0.0,0.2,1);
	 -webkit-transition: all 0.4s cubic-bezier(0.4,0.0,0.2,1);
}
 .o-btn.long {
	 transition: all 0.8s cubic-bezier(0.4,0.0,0.2,1);
	 -webkit-transition: all 0.8s cubic-bezier(0.4,0.0,0.2,1);
}
 .o-btn.elastic {
	 transition: all 0.25s cubic-bezier(0.175,0.885,0.320,1.275);
	 -webkit-transition: all 0.25s cubic-bezier(0.175,0.885,0.320,1.275);
}
 .o-btn span {
	 margin-left: 10px;
}
 .o-btn:hover {
	 background-color: var(--cal-back);
   color: var(--primary-color);
}
 .c-calendar {
   height: auto;
	 min-height: 600px;
	 padding-top: 20px;
	 display: flex;
	 justify-content: space-between;
	 flex-direction: row;
}
 .c-calendar__style {
	 background-color: #dee2e6e8;
	 margin: 12px;
	 padding: 10px;
	 /*box-shadow: 0 0 30px 0 rgba(0,0,0,0.18);
	 -webkit-box-shadow: 0 0 30px 0 rgba(0,0,0,0.18);*/
}
 .c-cal__container {
	 position: relative;
	 width: calc(100% - 300px);
	 height: auto;
	 overflow: hidden;
}
 .c-main {
	 position: absolute;
	 left: 0;
	 right: 0;
	 width: 100%;
	 padding: 45px;
	 display:grid;
	 align-content: center;
	 box-sizing: border-box;
	 -moz-box-sizing: border-box;
	 -webkit-box-sizing: border-box;
}
 .c-main-01 {
	 left: 0;
}
 .c-main-02 {
	 left: 100%;
}
 .c-main-03 {
	 left: 200%;
}
 .c-main-04 {
	 left: 300%;
}
 .c-main-05 {
	 left: 400%;
}
 .c-main-06 {
	 left: 500%;
}
 .c-main-07 {
	 left: 600%;
}
 .c-main-08 {
	 left: 700%;
}
 .c-main-09 {
	 left: 800%;
}
 .c-main-10 {
	 left: 900%;
}
 .c-main-11 {
	 left: 1000%;
}
 .c-main-12 {
	 left: 1100%;
}
 .c-cal__row {
	 display: flex;
	 justify-content: flex-start;
   max-height:85px;
}
 .c-cal__col {
	 width: calc(100% / 7);
	 text-align: center;
	 height: 50px;
	 line-height: 50px;
	 letter-spacing: 2px;
	 text-transform: uppercase;
}
 .c-cal__cel {
	 position: relative;
	 width: calc(100% / 7);
	 text-align: center;
	 cursor: pointer;
}
 .c-cal__cel p {
	 position: absolute;
	 margin: 0;
	 top: 50%;
	 left: 50%;
	 width: 50px;
	 height: 50px;
	 line-height: 47px;
   font-weight: 400;
   background: #ffff;
    color: #5e5d5d;
    border: none;
    box-shadow: 1px 1px 3px #00000057;
	 transform: translate(-50%,-50%);
	 -webkit-transform: translate(-50%,-50%);
	 border-radius: 50%;
}
 .c-cal__cel::before {
	 content: "";
	 display: block;
	 padding-top: 100%;
}
 /*.c-cal__cel:nth-child(1) p {
   background: #b113127d;
    color: white;
    border: none;
    box-shadow: 1px 1px 3px #00000057;
}*/
 .event p {
   background: #b113127d;
    color: white;
    border: none;
    box-shadow: 1px 1px 3px #00000057;
}
 .c-cal__cel:hover {
	 background-color: transparent !important;
}
 .c-cal__cel:hover p {
	 background: var(--primary-color) !important;
   color: white;
   border-color: white;
}
 .c-cal__cel.isSelected {
	 background-color: transparent;
}
 .c-cal__cel.isSelected p {
	 background: var(--primary-color);
	 color:white;
}
/*
 .c-cal__cel.isToday {
	 background-color: var(--cal-color-today);
}*/
 .c-cal__cel.isToday p {
	 /*background: var(--cal-color-today);*/
}
 .c-cal__cel.other_month {
	 color: rgba(255,255,255,0.2);
}
 /*.event:before {
	 position: absolute;
	 content: '';
	 display: block;
	 width: 10px;
	 height: 10px;
	 background-color: #F5F5F5;
	 z-index: 10;
	 padding: 0;
	 top: 50%;
	 left: 50%;
	 border-radius: 50%;
	 -webkit-border-radius: 50%;
	 transform: translate(-50%,calc(50% + 10px));
	 -webkit-transform: translate(-50%,calc(50% + 10px));
}*/

 .event--birthday:before {
	 background-color: #FACC2E;
}
 .event--festivity:before {
	 background-color: #10DDC2;
}
 /*.event--important:before {
	 background-color: #F57170;
}*/
 .c-aside {
	 width: 580px;
	 padding: 0px;
   background-color: #dee2e6e8;
	 min-height: 1000px;
}
 .c-aside__day {
	 font-size: 28px;
	 text-align: center;
	 margin-top:15px;
}
 .c-aside__day .c-aside__num {
	 font-family: 'Lato', sans-serif;
	 font-weight: 900;
}
 .c-aside__event {
	 position: relative;
	 padding-left: 20px;
	 margin: 20px 0;
}
 .c-aside__event:before {
	 position: absolute;
	 display: block;
	 content: '';
	 width: 16px;
	 height: 16px;
	 left: 0;
	 background-color: #F5F5F5;
	 border-radius: 50%;
	 -webkit-border-radius: 50%;
}
 .c-aside__event--birthday:before {
	 background-color: #FACC2E;
}
 .c-aside__event--festivity:before {
	 background-color: #10DDC2;
}
 .c-aside__event--important:before {
	 background-color: #F57170;
}
 .c-event__creator {
	 position: fixed;
	 top: 50%;
	 left: 50%;
	 max-width: 500px;
	 max-height: 470px;
	 width: 100%;
	 height: 100%;
	 z-index: 100;
	 padding: 20px;
	 visibility: hidden;
	 opacity: 0;
	 transition: all 0.4s cubic-bezier(0.4,0.0,0.2,1);
	 -webkit-transition: all 0.4s cubic-bezier(0.4,0.0,0.2,1);
	 box-sizing: border-box;
	 -moz-box-sizing: border-box;
	 -webkit-box-sizing: border-box;
	 transform: translate(-50%,-50%) scale(0.9);
	 -webkit-transform: translate(-50%,-50%) scale(0.9);
}
 .c-event__creator.long {
	 transition: all 0.8s cubic-bezier(0.4,0.0,0.2,1);
	 -webkit-transition: all 0.8s cubic-bezier(0.4,0.0,0.2,1);
}
 .c-event__creator.elastic {
	 transition: all 0.25s cubic-bezier(0.175,0.885,0.320,1.275);
	 -webkit-transition: all 0.25s cubic-bezier(0.175,0.885,0.320,1.275);
}
 .c-event__creator form {
	 display: flex;
	 flex-direction: column;
	 align-items: flex-start;
	 justify-content: space-between;
}
 .c-event__creator.isVisible {
	 transform: translate(-50%,-50%) scale(1);
	 -webkit-transform: translate(-50%,-50%) scale(1);
	 opacity: 1;
	 visibility: visible;
}
.wrapper-filter {
	 height: 160px;
	 z-index: 100;
	 background: var(--primary-color);
   margin-left: 30px;
   margin-right: 30px;
   margin-top: 20px;
	 display: flex;
	 justify-content: space-between;
	 align-items: center;
	 padding: 0 20px;
	 box-sizing: border-box;
	 -moz-box-sizing: border-box;
	 -webkit-box-sizing: border-box;
	 color: #ffffff;
	 letter-spacing: 2px;
	 font-size: 13px;
   font-weight: 700;
}
 .wrapper-filter a {
	 color: #ffffff;
	 text-decoration: none;
	 margin-left: 10px;
}

.c-title__filter {
  color: white;
  font-weight: 700;
  font-size: 22;
}

.c-label_filter {
  color: white;
  padding-right: 15px;
  font-weight: 400;
  text-transform: uppercase;
  padding-left: 17px;
	font-size: 2em;
}

.filter-btn-2{
  margin-left:25px;
}

.half-head-2{
  height:80px;
}

.c-input_filter{
  border:0;
	font-size: 1.5rem;
}

.c-aside__eventList .card-body{
	background-color:white;
	box-shadow: 0px 0px 6px lightgrey;
	height:100%;
}

.calendar-container{
  margin-top: -50px;
}

.c-calendar .card{
	background-color:transparent;
}

.c-aside__eventList h5.card-title{
	color: var(--primary-color);
	font-family: 'Pathway Gothic One';
	text-transform:uppercase;
	padding-top:10px;
	padding-bottom:0px;
	padding-left: 10px;
	padding-right:10px;
	margin:0;
	font-size: 1.8em;
	font-weight: 600;
}

.c-aside__eventList p.card-text{
	color: var(--secondary-color);
	padding-top: 6px;
  padding-bottom: 6px;
	padding-left: 10px;
	padding-right:10px;
}

.img-containerlist{
	height:100%;
}

.cat-event__card{
	color: #303030;
  font-size: 1em;
	padding-left:10px;
	padding-bottom:5px;
	padding-top:2px;
	font-weight:bold;
}

.cat-date__card{
	color: #303030;
  font-size: 0.8em;
	padding-left:10px;
	padding-bottom:2px;
	font-weight:bold;
}

.calendar-container select {
    padding: 2px 13px;
    font-size: 2em;
    cursor: pointer;
}

.pagination {
	cursor:pointer;
}

.errormsg{
	display: inline !important;
	font-size: 2rem;
	text-align: center;
}

@media (max-width: 1400px){
	.wrapper-head{
		font-size: 0.6rem;
	}
}

@media (max-width: 1200px){

	.half-head-1{
		font-size: 0.7rem;
	}

	.c-label_filter {
	  padding-right: 0px;
	  padding-left: 0px;
		margin-top:5px;
		margin-bottom:5px;
	}
	.filter-btn-2{
	  margin-left:0px;
		margin-top:10px;
		margin-bottom:30px;
		text-align:center;
	}
	.c-aside {
		width: auto;
		padding: 20px;
		order:2;
		background-color: #dee2e6e8;
		padding-top: 0 !important;
 }

 .c-cal__container {
    position: relative;
    width: 100% !important;
    padding-bottom: 100%;
    overflow: hidden;
}
.c-calendar__style {
    margin: 0px;
    margin-top:10px;
}
.img-containerlist{
	height:130px;
}
}

#loading_screen
{
  display: block;
  left: 0px;
  top: 0px;
  height: 100%;
  width: 100%;
  text-align: center;
  background-color: #fff;
  box-sizing: border-box;
}

.c-aside-filter {
	width: 100% !important;
}

@media (max-width: 768px){
	.c-aside__eventList .card-body{
	 height:auto;
	}
	.c-main {
		padding: 5px;
 }
 .c-cal__cel p {
	 width: 35px;
	 height: 35px;
	 line-height: 34px;
}
.c-calendar {
	height: auto;}

	#btn-o{
		display: none;
	}

	.c-paginator__year {
		padding: 0px 0px 0px 40px;
 }
}


/* Accessibilità (WCAG 2.1.1 / 2.4.7): indicatore di focus da tastiera
   visibile sugli elementi operabili del calendario (celle-giorno, frecce
   mese, paginazione, pulsanti). Colore scuro per garantire contrasto >= 3:1. */
.c-cal__cel:focus-visible,
#prev:focus-visible,
#next:focus-visible,
.page-link:focus-visible,
.o-btn:focus-visible {
  outline: 3px solid #1a1a1a;
  outline-offset: 2px;
}
.c-cal__cel:focus-visible p {
  background: var(--primary-color);
  color: #fff;
}

@media (max-width:345px){

  .half-head-1{
    font-size: 0.6rem !important;
  }

	.c-month .prev{
		width: 25px;
		height: 25px;
		padding: 9px 10px;
	}

	.c-month .next{
		width: 25px;
		height: 25px;
		padding: 9px 10px;
	}
}

/* ==========================================================================
   Fase 4 — Calendario (rilev. #26, #27, #30, #31, #32, #33, #36, #37)
   ========================================================================== */

/* #31, #33 — prev/next, "OGGI" e i pulsanti filtro erano <span> e <a> senza
   href: ora sono <button> veri. Qui si azzerano solo gli stili che il browser
   applica ai bottoni, perché la resa deve restare identica a prima.
   Nessun font-family: le frecce sono icone FontAwesome e la .fa lo imposta. */
button.prev,
button.next {
  border: 0;
  color: inherit;
  font-size: inherit;
}

button.o-btn {
  border: 0;
  color: var(--third-color);
  font-family: inherit;
}

/* #26 — i due titoli sono diventati <h2>. Le regole globali h1–h6
   (Pathway Gothic One, maiuscolo, line-height 1) ne cambierebbero l'aspetto:
   qui si annullano, perché il cambiamento è semantico, non visivo. */
h2.c-aside__day,
h2.c-aside__daybody {
  font-family: inherit;
  text-transform: none;
  font-weight: normal;
  line-height: inherit;
}

h2.c-aside__day {
  margin-bottom: 0;
}

h2.c-aside__daybody {
  font-size: inherit;
  margin: 0;
}

/* #30 — le regole di .breadcrumb-tl stanno in css/style_front.css: il
   breadcrumb serve anche al dettaglio evento (rilev. #38), che non carica
   questo foglio di stile. */

/* #36 — il pallino dei giorni con eventi era #b113127d, cioè rosso al 49%
   sul fondo chiaro del calendario: testo bianco su un rosa che misura 3.30:1,
   sotto il 4.5:1 richiesto. Con il rosso pieno si arriva a 7.10:1. */
.event p {
  background: var(--primary-color);
  color: #fff;
}

/* #37 — il giorno selezionato si distingueva solo per il colore di sfondo,
   e con #36 ora condivide il rosso con i giorni che hanno eventi. L'anello
   più il grassetto sono l'indicatore non cromatico.
   L'anello è doppio di proposito: uno scuro da solo misura 1.88:1 contro il
   rosso del pallino, sotto il 3:1 che 1.4.11 chiede a un indicatore. Il giro
   bianco interno stacca dal rosso (7.07:1), quello scuro esterno stacca dal
   fondo chiaro della griglia (10.19:1). */
.c-cal__cel.isSelected p {
  background: var(--primary-color);
  color: #fff;
  font-weight: 700;
  box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--cal-color-fest);
}
