/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/
.item2 {
    order: 1;
}
.item3 {
    order: 2;
}
.item4 {
    order: 3;
}
@media (max-width:319.9px) { 
	.containerGrid .gb-inside-container{
/*         height: calc(100vh - 160px); */
    }
    .contenitore {
/*         height: calc(100vh - 160px); */
        display: grid;
        grid-template-columns: 1fr;
        grid-gap: 5px;
        background-color: white;
        padding: 10px 5px 10px 5px;
    }
    .item1 .immagine, .item2 .immagine, .item3 .immagine, .item4 .immagine, .item5 .immagine, .item6 .immagine, .item7 .immagine, .item8 .immagine, .item9 .immagine, .item10 .immagine, .item11 .immagine, .item12 .immagine {
        height: 100%;
        width: 100%;
        object-fit: cover;
		border-radius: 10px;
    }
	.item1 {
/*         grid-column: 1 / 2; */
        /*grid-row: 1 / 2;*/
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item1:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item2 {
/*         grid-column: 2 / 3; */
/*         grid-row: 1 / 6; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item2:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item3 {
/*         grid-column: 1 / 3; */
/*         grid-row: 1 / 4; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
		height: 300px;
    }
	.item3:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item4 {
/*         grid-column: 1 / 2; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
		height: 300px;
    }
	.item4:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item5 {
/*         grid-column: 1 / 2; */
/*         grid-row: 2 / 3; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item5:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item6 {
/*         grid-column: 1 / 2; */
/*         grid-row: 3 / 4; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item6:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item7 {
/*         grid-column: 1 / 2; */
/*         grid-row: 4 / 6; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item7:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item8 {
/*         grid-column: 2 / 3; */
/*         grid-row: 6 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item8:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item9 {
/*         grid-column: 3 / 4; */
/*         grid-row: 4 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item9:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item10 {
/*         grid-column: 3 / 5; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
		height: 260px;
    }
	.item10:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item11 {
/*         grid-column: 1 / 2; */
/*         grid-row: 6 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item11:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.item12 {
/*         grid-column: 2 / 3; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item12:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.title-carosello {
		font-weight: 600;
		margin-left: 35px;
		margin-right: 35px;
		font-size: 40px;
		padding-top: 18px;
		padding-left: 20px;
		padding-right: 20px;
		color: white;
		font-family: 'Poppins';
	}
	.container-carosello {
        padding: 25px 25px 25px 25px;
    }
    .sep-line {
        width: 80px;
        border: 1.5px solid white;
		margin: 10px 35px 0px 55px;
    }
    .bottom-tag {
		width: 40%;
		margin: auto;
		position: absolute;
  		left: 50%;
  		bottom: 0px;
  		transform: translate(-30%, 0);
		font-family: 'Poppins';
    }
	.bottom-tag .rome-is.more {
		position: fixed;
     	bottom: 0;
     	right: 0;
		margin-bottom: 0;
	}
	.rome-is-more {
		font-size: 14px;
		color: white;
		margin-bottom: 2px;
		font-family: 'Poppins';
	}
	.description {
		margin: 10px 35px 15px 35px;
		font-size: 18px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.sub-title {
		margin: 3px 35px 3px 35px;
		font-size: 14px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.note-citation {
		margin: 3px 35px 3px 35px;
		font-size: 14px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	} 
	.container-center-outside {
		display: table;
		height: 100%;
		overflow: hidden;
	}
	.container-center {
		display: table-cell;
		vertical-align: middle;
		padding-bottom: 42px;
	}
	video.video_ricetta {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.shadow_box {
		position: absolute;
		top: auto;
		bottom: 0;
		text-align: center;
		width: 100%;
		height: 100%;
        /*box-shadow: inset 0px -30px 30px 5px black;
		-webkit-box-shadow: 0px -30px 30px 5px #000 inset;
		-moz-box-shadow: 0px -30px 30px 5px #000 inset;*/
		box-shadow: inset 0 -50px 60px -5px black;
		border-radius: 10px;
		z-index: 30;
	}
	.pagina_ricette, .pagina_ristoranti, .itinerario, .musei, .colosseo, .musei-insoliti, .roma-4-giorno, .autobus, .personaggi-celebri, .airport, .info-citta{
		position:absolute;
		bottom: 0;
		font-family: 'Poppins';
		font-weight: bold;
		color: white;
		text-align: center;
		bottom: 0;
		width: 100%;
		margin-bottom: 3px;
		font-size: 20px;
	}
	video.video_roma {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.slider {
		height: 100%;
		width: 100%;
	}
	
	/* celebrities's style */
	
/* 	#slider {
		position: absolute;
		top: auto;
		bottom: 0;
		text-align: center;
		width: 100%;
		height: 100%;
	} */
	
  	#slider img {
    	position: absolute;
		width: 100%;
		height: 100%;
  	}
  	#slider img:nth-of-type(1) {
    	animation-name: fader;
    	animation-delay: 4s;
    	animation-duration: 2s;
    	z-index: 20;
  	}
  	#slider img:nth-of-type(2) {
    	z-index: 10;
  	}
  	#slider img:nth-of-type(n+3) {
    	display: none;
  	}

  	@keyframes fader {
    	from { opacity: 1.0; }
    	to   { opacity: 0.0; }
  	}
	
	/* style Carosello Rome is More */

	* {
		box-sizing: border-box
	}
	.mySlides {
		display: block;
		height: 100%;
	}
	img {
		vertical-align: middle;
	}
	.slideshow-container {
	 position: relative;
	 margin: auto;
	 background: #000;
	 height: 100%;
	 border-radius: 10px;
	}
	.mySlides.fade-kit {
	 height: 100%;
	}
	.mySlides .kit-desk-img {
	 width: 70%;
	}
	.mySlides .kit-mobile-img {
	 width: 100%;
	}
	/* Next & previous buttons */
	a.carousel-prev, a.carousel-next {
	 text-decoration: none;
	}
	.carousel-prev, .carousel-next {
	 cursor: pointer;
	 position: absolute;
	 top: 50%;
	 width: auto;
	 padding: 15px 10px;
	 margin-top: -22px;
	 color: #fff !important;
	 font-weight: bold;
	 font-size: 18px;
	 transition: 0.6s ease;
	 user-select: none;
	}
	/* Position the "next button" to the right */
	.carousel-next {
	 right: 0;
	}
	/* On hover, add a black background color with a little bit see-through */
	.carousel-prev:hover, .carousel-next:hover {
	 background-color: rgba(0,0,0,0.8);
	}
	/* Caption text */
	.text {
	 color: #f2f2f2;
	 font-size: 15px;
	 padding: 8px 12px;
	 position: absolute;
	 bottom: 8px;
	 width: 100%;
	 text-align: center;
	}
	/* Number text (1/3 etc) */
	.numbertext {
	 color: #f2f2f2;
	 font-size: 12px;
	 padding: 8px 12px;
	 position: absolute;
	 top: 0;
	}
	/* The dots/bullets/indicators */
	.active, .dot:hover {
	 background-color: #717171;
	}
	/* Fading animation */
	.fade-kit {
	 -webkit-animation-name: fade;
	 -webkit-animation-duration: 1.5s;
	 animation-name: fade;
	 animation-duration: 1.5s;
	}
	a {
		text-decoration: none;
		font-family: 'Poppins';
	}
	@-webkit-keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	@keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	/* On smaller screens, decrease text size */
	@media only screen and (max-width: 300px) {
	 .carousel-prev, .carousel-next,.text {font-size: 11px}
	}
	/* css for stick footer always to the bottom of the page*/
	body {
		min-height: 100vh;
		display: flex;
		flex-direction: column;
	}
	.container.grid-container {
		width: 100%;
	}
	.site-footer {
		margin-top: auto;
	}
}

@media (min-width:320px) and (max-width:374px)  { 
	.containerGrid .gb-inside-container{
/*         height: calc(100vh - 160px); */
    }
    .contenitore {
/*         height: calc(100vh - 160px); */
        display: grid;
        grid-template-columns: 1fr;
        grid-gap: 5px;
        background-color: white;
        padding: 10px 5px 10px 5px;
    }
    .item1 .immagine, .item2 .immagine, .item3 .immagine, .item4 .immagine, .item5 .immagine, .item6 .immagine, .item7 .immagine, .item8 .immagine, .item9 .immagine, .item10 .immagine, .item11 .immagine, .item12 .immagine {
        height: 100%;
        width: 100%;
        object-fit: cover;
		border-radius: 10px;
    }
	.item1 {
/*         grid-column: 1 / 2; */
        /*grid-row: 1 / 2;*/
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item1:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item2 {
/*         grid-column: 2 / 3; */
/*         grid-row: 1 / 6; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item2:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item3 {
/*         grid-column: 1 / 3; */
/*         grid-row: 1 / 4; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
		height: 300px;
    }
	.item3:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item4 {
/*         grid-column: 1 / 2; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
		height: 300px;
    }
	.item4:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item5 {
/*         grid-column: 1 / 2; */
/*         grid-row: 2 / 3; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item5:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item6 {
/*         grid-column: 1 / 2; */
/*         grid-row: 3 / 4; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item6:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item7 {
/*         grid-column: 1 / 2; */
/*         grid-row: 4 / 6; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item7:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item8 {
/*         grid-column: 2 / 3; */
/*         grid-row: 6 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item8:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item9 {
/*         grid-column: 3 / 4; */
/*         grid-row: 4 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item9:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item10 {
/*         grid-column: 3 / 5; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
		height: 260px;
    }
	.item10:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item11 {
/*         grid-column: 1 / 2; */
/*         grid-row: 6 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item11:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.item12 {
/*         grid-column: 2 / 3; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item12:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.title-carosello {
		font-weight: 600;
		margin-left: 35px;
		margin-right: 35px;
		font-size: 40px;
		padding-top: 18px;
		padding-left: 20px;
		padding-right: 20px;
		color: white;
		font-family: 'Poppins';
	}
	.container-carosello {
        padding: 25px 25px 25px 25px;
    }
    .sep-line {
        width: 80px;
        border: 1.5px solid white;
		margin: 10px 35px 0px 55px;
    }
    .bottom-tag {
		width: 40%;
		margin: auto;
		position: absolute;
  		left: 50%;
  		bottom: 0px;
  		transform: translate(-30%, 0);
		font-family: 'Poppins';
    }
	.bottom-tag .rome-is.more {
		position: fixed;
     	bottom: 0;
     	right: 0;
		margin-bottom: 0;
	}
	.rome-is-more {
		font-size: 14px;
		color: white;
		margin-bottom: 2px;
		font-family: 'Poppins';
	}
	.description {
		margin: 10px 35px 15px 35px;
		font-size: 18px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.sub-title {
		margin: 3px 35px 3px 35px;
		font-size: 14px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.note-citation {
		margin: 3px 35px 3px 35px;
		font-size: 14px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	} 
	.container-center-outside {
		display: table;
		height: 100%;
		overflow: hidden;
	}
	.container-center {
		display: table-cell;
		vertical-align: middle;
		padding-bottom: 42px;
	}
	video.video_ricetta {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.shadow_box {
		position: absolute;
		top: auto;
		bottom: 0;
		text-align: center;
		width: 100%;
		height: 100%;
        /*box-shadow: inset 0px -30px 30px 5px black;
		-webkit-box-shadow: 0px -30px 30px 5px #000 inset;
		-moz-box-shadow: 0px -30px 30px 5px #000 inset;*/
		box-shadow: inset 0 -50px 60px -5px black;
		border-radius: 10px;
		z-index: 30;
	}
	.pagina_ricette, .pagina_ristoranti, .itinerario, .musei, .colosseo, .musei-insoliti, .roma-4-giorno, .autobus, .personaggi-celebri, .airport, .info-citta{
		position:absolute;
		bottom: 0;
		font-family: 'Poppins';
		font-weight: bold;
		color: white;
		text-align: center;
		bottom: 0;
		width: 100%;
		margin-bottom: 3px;
		font-size: 20px;
	}
	video.video_roma {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.slider {
		height: 100%;
		width: 100%;
	}
	
	/* celebrities's style */
	
  	#slider img {
    	position: absolute;
  	}
  	#slider img:nth-of-type(1) {
    	animation-name: fader;
    	animation-delay: 4s;
    	animation-duration: 2s;
    	z-index: 20;
  	}
  	#slider img:nth-of-type(2) {
    	z-index: 10;
  	}
  	#slider img:nth-of-type(n+3) {
    	display: none;
  	}

  	@keyframes fader {
    	from { opacity: 1.0; }
    	to   { opacity: 0.0; }
  	}
	
	/* celebrities's style 
	
	#slider {
		position: relative;
	}
	
  	#slider img {
/*     	position: absolute; 
  	}
  	#slider img:nth-of-type(1) {
    	animation-name: fader;
    	animation-delay: 4s;
    	animation-duration: 2s;
    	z-index: 20;
  	}
  	#slider img:nth-of-type(2) {
    	z-index: 10;
  	}
  	#slider img:nth-of-type(n+3) {
    	display: none;
  	}

  	@keyframes fader {
    	from { opacity: 1.0; }
    	to   { opacity: 0.0; }
  	}
	
	/* style Carosello Rome is More */

	* {
		box-sizing: border-box
	}
	.mySlides {
		display: block;
		height: 100%;
	}
	img {
		vertical-align: middle;
	}
	.slideshow-container {
	 position: relative;
	 margin: auto;
	 background: #000;
	 height: 100%;
	 border-radius: 10px;
	}
	.mySlides.fade-kit {
	 height: 100%;
	}
	.mySlides .kit-desk-img {
	 width: 70%;
	}
	.mySlides .kit-mobile-img {
	 width: 100%;
	}
	/* Next & previous buttons */
	a.carousel-prev, a.carousel-next {
	 text-decoration: none;
	}
	.carousel-prev, .carousel-next {
	 cursor: pointer;
	 position: absolute;
	 top: 50%;
	 width: auto;
	 padding: 15px 10px;
	 margin-top: -22px;
	 color: #fff !important;
	 font-weight: bold;
	 font-size: 18px;
	 transition: 0.6s ease;
	 user-select: none;
	}
	/* Position the "next button" to the right */
	.carousel-next {
	 right: 0;
	}
	/* On hover, add a black background color with a little bit see-through */
	.carousel-prev:hover, .carousel-next:hover {
	 background-color: rgba(0,0,0,0.8);
	}
	/* Caption text */
	.text {
	 color: #f2f2f2;
	 font-size: 15px;
	 padding: 8px 12px;
	 position: absolute;
	 bottom: 8px;
	 width: 100%;
	 text-align: center;
	}
	/* Number text (1/3 etc) */
	.numbertext {
	 color: #f2f2f2;
	 font-size: 12px;
	 padding: 8px 12px;
	 position: absolute;
	 top: 0;
	}
	/* The dots/bullets/indicators */
	.active, .dot:hover {
	 background-color: #717171;
	}
	/* Fading animation */
	.fade-kit {
	 -webkit-animation-name: fade;
	 -webkit-animation-duration: 1.5s;
	 animation-name: fade;
	 animation-duration: 1.5s;
	}
	a {
		text-decoration: none;
		font-family: 'Poppins';
	}
	@-webkit-keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	@keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	/* On smaller screens, decrease text size */
	@media only screen and (max-width: 300px) {
	 .carousel-prev, .carousel-next,.text {font-size: 11px}
	}
	/* css for stick footer always to the bottom of the page*/
	body {
		min-height: 100vh;
		display: flex;
		flex-direction: column;
	}
	.container.grid-container {
		width: 100%;
	}
	.site-footer {
		margin-top: auto;
	}
}

@media (min-width:375px) and (max-width:420px)  { 
	.containerGrid .gb-inside-container{
/*         height: calc(100vh - 160px); */
    }
    .contenitore {
/*         height: calc(100vh - 160px); */
        display: grid;
        grid-template-columns: 1fr;
        grid-gap: 5px;
        background-color: white;
        padding: 10px 5px 10px 5px;
    }
    .item1 .immagine, .item2 .immagine, .item3 .immagine, .item4 .immagine, .item5 .immagine, .item6 .immagine, .item7 .immagine, .item8 .immagine, .item9 .immagine, .item10 .immagine, .item11 .immagine, .item12 .immagine {
        height: 100%;
        width: 100%;
        object-fit: cover;
		border-radius: 10px;
    }
	.item1 {
/*         grid-column: 1 / 2; */
        /*grid-row: 1 / 2;*/
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item1:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item2 {
/*         grid-column: 2 / 3; */
/*         grid-row: 1 / 6; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item2:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item3 {
/*         grid-column: 1 / 3; */
/*         grid-row: 1 / 4; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
		height: 300px;
    }
	.item3:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item4 {
/*         grid-column: 1 / 2; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
		height: 300px;
    }
	.item4:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item5 {
/*         grid-column: 1 / 2; */
/*         grid-row: 2 / 3; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item5:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item6 {
/*         grid-column: 1 / 2; */
/*         grid-row: 3 / 4; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item6:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item7 {
/*         grid-column: 1 / 2; */
/*         grid-row: 4 / 6; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item7:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item8 {
/*         grid-column: 2 / 3; */
/*         grid-row: 6 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item8:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item9 {
/*         grid-column: 3 / 4; */
/*         grid-row: 4 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item9:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item10 {
/*         grid-column: 3 / 5; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
		height: 260px;
    }
	.item10:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item11 {
/*         grid-column: 1 / 2; */
/*         grid-row: 6 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item11:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.item12 {
/*         grid-column: 2 / 3; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item12:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.title-carosello {
		font-weight: 600;
		margin-left: 35px;
		margin-right: 35px;
		font-size: 30px;
		padding-top: 18px;
		padding-left: 20px;
		padding-right: 20px;
		color: white;
		font-family: 'Poppins';
	}
	.container-carosello {
        padding: 25px 25px 25px 25px;
    }
    .sep-line {
        width: 80px;
        border: 1.5px solid white;
		margin: 10px 35px 0px 55px;
    }
    .bottom-tag {
		width: 40%;
		margin: auto;
		position: absolute;
  		left: 50%;
  		bottom: 0px;
  		transform: translate(-30%, 0);
		font-family: 'Poppins';
    }
	.bottom-tag .rome-is.more {
		position: fixed;
     	bottom: 0;
     	right: 0;
		margin-bottom: 0;
	}
	.rome-is-more {
		font-size: 12px;
		color: white;
		margin-bottom: 2px;
		font-family: 'Poppins';
	}
	.description {
		margin: 10px 35px 15px 35px;
		font-size: 14px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.sub-title {
		margin: 3px 35px 3px 35px;
		font-size: 11px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.note-citation {
		margin: 3px 35px 3px 35px;
		font-size: 11px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	} 
	.container-center-outside {
		display: table;
		height: 100%;
		overflow: hidden;
	}
	.container-center {
		display: table-cell;
		vertical-align: middle;
		padding-bottom: 42px;
	}
	video.video_ricetta {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.shadow_box {
		position: absolute;
		top: auto;
		bottom: 0;
		text-align: center;
		width: 100%;
		height: 100%;
        /*box-shadow: inset 0px -30px 30px 5px black;
		-webkit-box-shadow: 0px -30px 30px 5px #000 inset;
		-moz-box-shadow: 0px -30px 30px 5px #000 inset;*/
		box-shadow: inset 0 -50px 60px -5px black;
		border-radius: 10px;
		z-index: 30;
	}
	.pagina_ricette, .pagina_ristoranti, .itinerario, .musei, .colosseo, .musei-insoliti, .roma-4-giorno, .autobus, .personaggi-celebri, .airport, .info-citta{
		position:absolute;
		bottom: 0;
		font-family: 'Poppins';
		font-weight: bold;
		color: white;
		text-align: center;
		bottom: 0;
		width: 100%;
		margin-bottom: 3px;
		font-size: 20px;
	}
	video.video_roma {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.slider {
		height: 100%;
		width: 100%;
	}
	
	/* celebrities's style */
	
  	#slider img {
    	position: absolute;
  	}
  	#slider img:nth-of-type(1) {
    	animation-name: fader;
    	animation-delay: 4s;
    	animation-duration: 2s;
    	z-index: 20;
  	}
  	#slider img:nth-of-type(2) {
    	z-index: 10;
  	}
  	#slider img:nth-of-type(n+3) {
    	display: none;
  	}

  	@keyframes fader {
    	from { opacity: 1.0; }
    	to   { opacity: 0.0; }
  	}
	
	/* style Carosello Rome is More */

	* {
		box-sizing: border-box
	}
	.mySlides {
		display: block;
		height: 100%;
	}
	img {
		vertical-align: middle;
	}
	.slideshow-container {
	 position: relative;
	 margin: auto;
	 background: #000;
	 height: 100%;
	 border-radius: 10px;
	}
	.mySlides.fade-kit {
	 height: 100%;
	}
	.mySlides .kit-desk-img {
	 width: 70%;
	}
	.mySlides .kit-mobile-img {
	 width: 100%;
	}
	/* Next & previous buttons */
	a.carousel-prev, a.carousel-next {
	 text-decoration: none;
	}
	.carousel-prev, .carousel-next {
	 cursor: pointer;
	 position: absolute;
	 top: 50%;
	 width: auto;
	 padding: 15px 10px;
	 margin-top: -22px;
	 color: #fff !important;
	 font-weight: bold;
	 font-size: 18px;
	 transition: 0.6s ease;
	 user-select: none;
	}
	/* Position the "next button" to the right */
	.carousel-next {
	 right: 0;
	}
	/* On hover, add a black background color with a little bit see-through */
	.carousel-prev:hover, .carousel-next:hover {
	 background-color: rgba(0,0,0,0.8);
	}
	/* Caption text */
	.text {
	 color: #f2f2f2;
	 font-size: 15px;
	 padding: 8px 12px;
	 position: absolute;
	 bottom: 8px;
	 width: 100%;
	 text-align: center;
	}
	/* Number text (1/3 etc) */
	.numbertext {
	 color: #f2f2f2;
	 font-size: 12px;
	 padding: 8px 12px;
	 position: absolute;
	 top: 0;
	}
	/* The dots/bullets/indicators */
	.active, .dot:hover {
	 background-color: #717171;
	}
	/* Fading animation */
	.fade-kit {
	 -webkit-animation-name: fade;
	 -webkit-animation-duration: 1.5s;
	 animation-name: fade;
	 animation-duration: 1.5s;
	}
	a {
		text-decoration: none;
		font-family: 'Poppins';
	}
	@-webkit-keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	@keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	/* On smaller screens, decrease text size */
	@media only screen and (max-width: 300px) {
	 .carousel-prev, .carousel-next,.text {font-size: 11px}
	}
	/* css for stick footer always to the bottom of the page*/
	body {
		min-height: 100vh;
		display: flex;
		flex-direction: column;
	}
	.container.grid-container {
		width: 100%;
	}
	.site-footer {
		margin-top: auto;
	}
}

@media (min-width:421px) and (max-width:550px)  { 
	.containerGrid .gb-inside-container{
/*         height: calc(100vh - 160px); */
    }
    .contenitore {
/*         height: calc(100vh - 160px); */
        display: grid;
        grid-template-columns: 1fr;
        grid-gap: 5px;
        background-color: white;
        padding: 10px 5px 10px 5px;
    }
    .item1 .immagine, .item2 .immagine, .item3 .immagine, .item4 .immagine, .item5 .immagine, .item6 .immagine, .item7 .immagine, .item8 .immagine, .item9 .immagine, .item10 .immagine, .item11 .immagine, .item12 .immagine {
        height: 100%;
        width: 100%;
        object-fit: cover;
		border-radius: 10px;
    }
	.item1 {
/*         grid-column: 1 / 2; */
        /*grid-row: 1 / 2;*/
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item1:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item2 {
/*         grid-column: 2 / 3; */
/*         grid-row: 1 / 6; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item2:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item3 {
/*         grid-column: 1 / 3; */
/*         grid-row: 1 / 4; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
		height: 300px;
    }
	.item3:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item4 {
/*         grid-column: 1 / 2; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
		height: 300px;
    }
	.item4:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item5 {
/*         grid-column: 1 / 2; */
/*         grid-row: 2 / 3; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item5:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item6 {
/*         grid-column: 1 / 2; */
/*         grid-row: 3 / 4; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item6:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item7 {
/*         grid-column: 1 / 2; */
/*         grid-row: 4 / 6; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item7:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item8 {
/*         grid-column: 2 / 3; */
/*         grid-row: 6 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item8:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item9 {
/*         grid-column: 3 / 4; */
/*         grid-row: 4 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item9:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item10 {
/*         grid-column: 3 / 5; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
		height: 260px;
    }
	.item10:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item11 {
/*         grid-column: 1 / 2; */
/*         grid-row: 6 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item11:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.item12 {
/*         grid-column: 2 / 3; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item12:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.title-carosello {
		font-weight: 600;
		margin-left: 35px;
		margin-right: 35px;
		font-size: 30px;
		padding-top: 18px;
		padding-left: 20px;
		padding-right: 20px;
		color: white;
		font-family: 'Poppins';
	}
	.container-carosello {
        padding: 25px 25px 25px 25px;
    }
    .sep-line {
        width: 80px;
        border: 1.5px solid white;
		margin: 10px 35px 0px 55px;
    }
    .bottom-tag {
		width: 40%;
		margin: auto;
		position: absolute;
  		left: 50%;
  		bottom: 0px;
  		transform: translate(-30%, 0);
		font-family: 'Poppins';
    }
	.bottom-tag .rome-is.more {
		position: fixed;
     	bottom: 0;
     	right: 0;
		margin-bottom: 0;
	}
	.rome-is-more {
		font-size: 10px;
		color: white;
		margin-bottom: 2px;
		font-family: 'Poppins';
	}
	.description {
		margin: 10px 35px 15px 35px;
		font-size: 14px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.sub-title {
		margin: 3px 35px 3px 35px;
		font-size: 11px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.note-citation {
		margin: 3px 35px 3px 35px;
		font-size: 11px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	} 
	.container-center-outside {
		display: table;
		height: 100%;
		overflow: hidden;
	}
	.container-center {
		display: table-cell;
		vertical-align: middle;
		padding-bottom: 42px;
	}
	video.video_ricetta {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.shadow_box {
		position: absolute;
		top: auto;
		bottom: 0;
		text-align: center;
		width: 100%;
		height: 100%;
        /*box-shadow: inset 0px -30px 30px 5px black;
		-webkit-box-shadow: 0px -30px 30px 5px #000 inset;
		-moz-box-shadow: 0px -30px 30px 5px #000 inset;*/
		box-shadow: inset 0 -50px 60px -5px black;
		border-radius: 10px;
		z-index: 30;
	}
	.pagina_ricette, .pagina_ristoranti, .itinerario, .musei, .colosseo, .musei-insoliti, .roma-4-giorno, .autobus, .personaggi-celebri, .airport, .info-citta{
		position:absolute;
		bottom: 0;
		font-family: 'Poppins';
		font-weight: bold;
		color: white;
		text-align: center;
		bottom: 0;
		width: 100%;
		margin-bottom: 3px;
		font-size: 20px;
	}
	video.video_roma {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.slider {
		height: 100%;
		width: 100%;
	}
	
	/* celebrities's style */
	
  	#slider img {
    	position: absolute;
  	}
  	#slider img:nth-of-type(1) {
    	animation-name: fader;
    	animation-delay: 4s;
    	animation-duration: 2s;
    	z-index: 20;
  	}
  	#slider img:nth-of-type(2) {
    	z-index: 10;
  	}
  	#slider img:nth-of-type(n+3) {
    	display: none;
  	}

  	@keyframes fader {
    	from { opacity: 1.0; }
    	to   { opacity: 0.0; }
  	}
	
	/* style Carosello Rome is More */

	* {
		box-sizing: border-box
	}
	.mySlides {
		display: block;
		height: 100%;
	}
	img {
		vertical-align: middle;
	}
	.slideshow-container {
	 position: relative;
	 margin: auto;
	 background: #000;
	 height: 100%;
	 border-radius: 10px;
	}
	.mySlides.fade-kit {
	 height: 100%;
	}
	.mySlides .kit-desk-img {
	 width: 70%;
	}
	.mySlides .kit-mobile-img {
	 width: 100%;
	}
	/* Next & previous buttons */
	a.carousel-prev, a.carousel-next {
	 text-decoration: none;
	}
	.carousel-prev, .carousel-next {
	 cursor: pointer;
	 position: absolute;
	 top: 50%;
	 width: auto;
	 padding: 15px 10px;
	 margin-top: -22px;
	 color: #fff !important;
	 font-weight: bold;
	 font-size: 18px;
	 transition: 0.6s ease;
	 user-select: none;
	}
	/* Position the "next button" to the right */
	.carousel-next {
	 right: 0;
	}
	/* On hover, add a black background color with a little bit see-through */
	.carousel-prev:hover, .carousel-next:hover {
	 background-color: rgba(0,0,0,0.8);
	}
	/* Caption text */
	.text {
	 color: #f2f2f2;
	 font-size: 15px;
	 padding: 8px 12px;
	 position: absolute;
	 bottom: 8px;
	 width: 100%;
	 text-align: center;
	}
	/* Number text (1/3 etc) */
	.numbertext {
	 color: #f2f2f2;
	 font-size: 12px;
	 padding: 8px 12px;
	 position: absolute;
	 top: 0;
	}
	/* The dots/bullets/indicators */
	.active, .dot:hover {
	 background-color: #717171;
	}
	/* Fading animation */
	.fade-kit {
	 -webkit-animation-name: fade;
	 -webkit-animation-duration: 1.5s;
	 animation-name: fade;
	 animation-duration: 1.5s;
	}
	a {
		text-decoration: none;
		font-family: 'Poppins';
	}
	@-webkit-keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	@keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	/* On smaller screens, decrease text size */
	@media only screen and (max-width: 300px) {
	 .carousel-prev, .carousel-next,.text {font-size: 11px}
	}
	/* css for stick footer always to the bottom of the page*/
	body {
		min-height: 100vh;
		display: flex;
		flex-direction: column;
	}
	.container.grid-container {
		width: 100%;
	}
	.site-footer {
		margin-top: auto;
	}
}

@media (min-width:551px) and (max-width:766.9px)  { 
	.containerGrid .gb-inside-container{
/*         height: calc(100vh - 160px); */
    }
    .contenitore {
/*         height: calc(100vh - 160px); */
        display: grid;
        grid-template-columns: repeat(2 , calc(calc(100% / 2) - 5px));
        /*grid-template-rows: repeat(10 , calc(calc(100% / 10) - 5px));*/
        grid-gap: 5px;
        background-color: white;
        padding: 10px 5px 10px 5px;
    }
    .item1 .immagine, .item2 .immagine, .item3 .immagine, .item4 .immagine, .item5 .immagine, .item6 .immagine, .item7 .immagine, .item8 .immagine, .item9 .immagine, .item10 .immagine, .item11 .immagine, .item12 .immagine {
        height: 100%;
        width: 100%;
        object-fit: cover;
		border-radius: 10px;
    }
	.item1 {
/*         grid-column: 1 / 2; */
        /*grid-row: 1 / 2;*/
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item1:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item2 {
/*         grid-column: 2 / 3; */
/*         grid-row: 1 / 6; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item2:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item3 {
/*         grid-column: 1 / 3; */
/*         grid-row: 1 / 4; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
		height: 300px;
    }
	.item3:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item4 {
/*         grid-column: 1 / 2; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
		height: 300px;
    }
	.item4:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item5 {
/*         grid-column: 1 / 2; */
/*         grid-row: 2 / 3; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item5:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item6 {
/*         grid-column: 1 / 2; */
/*         grid-row: 3 / 4; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item6:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item7 {
/*         grid-column: 1 / 2; */
/*         grid-row: 4 / 6; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item7:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item8 {
/*         grid-column: 2 / 3; */
/*         grid-row: 6 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item8:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item9 {
/*         grid-column: 3 / 4; */
/*         grid-row: 4 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item9:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item10 {
/*         grid-column: 3 / 5; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item10:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item11 {
/*         grid-column: 1 / 2; */
/*         grid-row: 6 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item11:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.item12 {
/*         grid-column: 2 / 3; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item12:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.title-carosello {
		font-weight: 600;
		margin-left: 35px;
		margin-right: 35px;
		font-size: 30px;
		padding-top: 18px;
		padding-left: 20px;
		padding-right: 20px;
		color: white;
		font-family: 'Poppins';
	}
	.container-carosello {
        padding: 25px 25px 25px 25px;
    }
    .sep-line {
        width: 80px;
        border: 1.5px solid white;
		margin: 10px 35px 0px 55px;
    }
    .bottom-tag {
		width: 40%;
		margin: auto;
		position: absolute;
  		left: 50%;
  		bottom: 0px;
  		transform: translate(-30%, 0);
		font-family: 'Poppins';
    }
	.bottom-tag .rome-is.more {
		position: fixed;
     	bottom: 0;
     	right: 0;
		margin-bottom: 0;
	}
	.rome-is-more {
		font-size: 11px;
		color: white;
		margin-bottom: 2px;
		font-family: 'Poppins';
	}
	.description {
		margin: 10px 35px 15px 35px;
		font-size: 14px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.sub-title {
		margin: 3px 35px 3px 35px;
		font-size: 11px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.note-citation {
		margin: 3px 35px 3px 35px;
		font-size: 11px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	} 
	.container-center-outside {
		display: table;
		height: 100%;
		overflow: hidden;
	}
	.container-center {
		display: table-cell;
		vertical-align: middle;
		padding-bottom: 42px;
	}
	video.video_ricetta {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.shadow_box {
		position: absolute;
		top: auto;
		bottom: 0;
		text-align: center;
		width: 100%;
		height: 100%;
        /*box-shadow: inset 0px -30px 30px 5px black;
		-webkit-box-shadow: 0px -30px 30px 5px #000 inset;
		-moz-box-shadow: 0px -30px 30px 5px #000 inset;*/
		box-shadow: inset 0 -50px 60px -5px black;
		border-radius: 10px;
		z-index: 30;
	}
	.pagina_ricette, .pagina_ristoranti, .itinerario, .musei, .colosseo, .musei-insoliti, .roma-4-giorno, .autobus, .personaggi-celebri, .airport, .info-citta{
		position:absolute;
		bottom: 0;
		font-family: 'Poppins';
		font-weight: bold;
		color: white;
		text-align: center;
		bottom: 0;
		width: 100%;
		margin-bottom: 3px;
		font-size: 20px;
	}
	video.video_roma {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.slider {
		height: 100%;
		width: 100%;
	}
	
	/* celebrities's style */
	
  	#slider img {
    	position: absolute;
  	}
  	#slider img:nth-of-type(1) {
    	animation-name: fader;
    	animation-delay: 4s;
    	animation-duration: 2s;
    	z-index: 20;
  	}
  	#slider img:nth-of-type(2) {
    	z-index: 10;
  	}
  	#slider img:nth-of-type(n+3) {
    	display: none;
  	}

  	@keyframes fader {
    	from { opacity: 1.0; }
    	to   { opacity: 0.0; }
  	}
	
	/* style Carosello Rome is More */

	* {
		box-sizing: border-box
	}
	.mySlides {
		display: block;
		height: 100%;
	}
	img {
		vertical-align: middle;
	}
	.slideshow-container {
	 position: relative;
	 margin: auto;
	 background: #000;
	 height: 100%;
	 border-radius: 10px;
	}
	.mySlides.fade-kit {
	 height: 100%;
	}
	.mySlides .kit-desk-img {
	 width: 70%;
	}
	.mySlides .kit-mobile-img {
	 width: 100%;
	}
	/* Next & previous buttons */
	a.carousel-prev, a.carousel-next {
	 text-decoration: none;
	}
	.carousel-prev, .carousel-next {
	 cursor: pointer;
	 position: absolute;
	 top: 50%;
	 width: auto;
	 padding: 15px 10px;
	 margin-top: -22px;
	 color: #fff !important;
	 font-weight: bold;
	 font-size: 18px;
	 transition: 0.6s ease;
	 user-select: none;
	}
	/* Position the "next button" to the right */
	.carousel-next {
	 right: 0;
	}
	/* On hover, add a black background color with a little bit see-through */
	.carousel-prev:hover, .carousel-next:hover {
	 background-color: rgba(0,0,0,0.8);
	}
	/* Caption text */
	.text {
	 color: #f2f2f2;
	 font-size: 15px;
	 padding: 8px 12px;
	 position: absolute;
	 bottom: 8px;
	 width: 100%;
	 text-align: center;
	}
	/* Number text (1/3 etc) */
	.numbertext {
	 color: #f2f2f2;
	 font-size: 12px;
	 padding: 8px 12px;
	 position: absolute;
	 top: 0;
	}
	/* The dots/bullets/indicators */
	.active, .dot:hover {
	 background-color: #717171;
	}
	/* Fading animation */
	.fade-kit {
	 -webkit-animation-name: fade;
	 -webkit-animation-duration: 1.5s;
	 animation-name: fade;
	 animation-duration: 1.5s;
	}
	a {
		text-decoration: none;
		font-family: 'Poppins';
	}
	@-webkit-keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	@keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	/* On smaller screens, decrease text size */
	@media only screen and (max-width: 300px) {
	 .carousel-prev, .carousel-next,.text {font-size: 11px}
	}
	/* css for stick footer always to the bottom of the page*/
	body {
		min-height: 100vh;
		display: flex;
		flex-direction: column;
	}
	.container.grid-container {
		width: 100%;
	}
	.site-footer {
		margin-top: auto;
	}
}

@media (min-width:767px) and (max-width:899.99px)  { 
	.containerGrid .gb-inside-container{
/*         height: calc(100vh - 160px); */
    }
    .contenitore {
/*         height: calc(100vh - 160px); */
        display: grid;
        grid-template-columns: repeat(3 , calc(calc(100% / 3) - 5px));
        /*grid-template-rows: repeat(10 , calc(calc(100% / 10) - 5px));*/
        grid-gap: 5px;
        background-color: white;
        padding: 10px 5px 10px 5px;
    }
    .item1 .immagine, .item2 .immagine, .item3 .immagine, .item4 .immagine, .item5 .immagine, .item6 .immagine, .item7 .immagine, .item8 .immagine, .item9 .immagine, .item10 .immagine, .item11 .immagine, .item12 .immagine {
        height: 100%;
        width: 100%;
        object-fit: cover;
		border-radius: 10px;
    }
	.item1 {
/*         grid-column: 1 / 2; */
        /*grid-row: 1 / 2;*/
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item1:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item2 {
/*         grid-column: 2 / 3; */
/*         grid-row: 1 / 6; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item2:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item3 {
/*         grid-column: 1 / 3; */
/*         grid-row: 1 / 4; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item3:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item4 {
/*         grid-column: 1 / 2; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item4:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item5 {
/*         grid-column: 1 / 2; */
/*         grid-row: 2 / 3; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item5:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item6 {
/*         grid-column: 1 / 2; */
/*         grid-row: 3 / 4; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item6:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item7 {
/*         grid-column: 1 / 2; */
/*         grid-row: 4 / 6; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item7:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item8 {
/*         grid-column: 2 / 3; */
/*         grid-row: 6 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item8:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item9 {
/*         grid-column: 3 / 4; */
/*         grid-row: 4 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item9:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item10 {
/*         grid-column: 3 / 5; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item10:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item11 {
/*         grid-column: 1 / 2; */
/*         grid-row: 6 / 7; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item11:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.item12 {
/*         grid-column: 2 / 3; */
/*         grid-row: 7 / 8; */
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item12:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.title-carosello {
		font-weight: 600;
		margin-left: 35px;
		margin-right: 35px;
		font-size: 31px;
		padding-top: 18px;
		padding-left: 20px;
		padding-right: 20px;
		color: white;
		font-family: 'Poppins';
	}
	.container-carosello {
        padding: 25px 25px 25px 25px;
    }
    .sep-line {
        width: 80px;
        border: 1.5px solid white;
		margin: 10px 35px 0px 55px;
    }
    .bottom-tag {
		width: 40%;
		margin: auto;
		position: absolute;
  		left: 50%;
  		bottom: 0px;
  		transform: translate(-30%, 0);
		font-family: 'Poppins';
    }
	.bottom-tag .rome-is.more {
		position: fixed;
     	bottom: 0;
     	right: 0;
		margin-bottom: 0;
	}
	.rome-is-more {
		font-size: 12px;
		color: white;
		margin-bottom: 2px;
		font-family: 'Poppins';
	}
	.description {
		margin: 10px 35px 15px 35px;
		font-size: 13px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.sub-title {
		margin: 3px 35px 3px 35px;
		font-size: 10px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.note-citation {
		margin: 3px 35px 3px 35px;
		font-size: 10px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	} 
	.container-center-outside {
		display: table;
		height: 100%;
		overflow: hidden;
	}
	.container-center {
		display: table-cell;
		vertical-align: middle;
 		padding-bottom: 42px;
	}
	video.video_ricetta {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.shadow_box {
		position: absolute;
		top: auto;
		bottom: 0;
		text-align: center;
		width: 100%;
		height: 100%;
        /*box-shadow: inset 0px -30px 30px 5px black;
		-webkit-box-shadow: 0px -30px 30px 5px #000 inset;
		-moz-box-shadow: 0px -30px 30px 5px #000 inset;*/
		box-shadow: inset 0 -50px 60px -5px black;
		border-radius: 10px;
		z-index: 30;
	}
	.pagina_ricette, .pagina_ristoranti, .itinerario, .musei, .colosseo, .musei-insoliti, .roma-4-giorno, .autobus, .personaggi-celebri, .airport, .info-citta{
		position:absolute;
		bottom: 0;
		font-family: 'Poppins';
		font-weight: bold;
		color: white;
		text-align: center;
		bottom: 0;
		width: 100%;
		margin-bottom: 3px;
		font-size: 20px;
	}
	video.video_roma {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.slider {
		height: 100%;
		width: 100%;
	}
	
	/* celebrities's style */
	
  	#slider img {
    	position: absolute;
  	}
  	#slider img:nth-of-type(1) {
    	animation-name: fader;
    	animation-delay: 4s;
    	animation-duration: 2s;
    	z-index: 20;
  	}
  	#slider img:nth-of-type(2) {
    	z-index: 10;
  	}
  	#slider img:nth-of-type(n+3) {
    	display: none;
  	}

  	@keyframes fader {
    	from { opacity: 1.0; }
    	to   { opacity: 0.0; }
  	}
	
	/* style Carosello Rome is More */

	* {
		box-sizing: border-box
	}
	.mySlides {
		display: block;
		height: 100%;
	}
	img {
		vertical-align: middle;
	}
	.slideshow-container {
	 position: relative;
	 margin: auto;
	 background: #000;
	 height: 100%;
	 border-radius: 10px;
	}
	.mySlides.fade-kit {
	 height: 100%;
	}
	.mySlides .kit-desk-img {
	 width: 70%;
	}
	.mySlides .kit-mobile-img {
	 width: 100%;
	}
	/* Next & previous buttons */
	a.carousel-prev, a.carousel-next {
	 text-decoration: none;
	}
	.carousel-prev, .carousel-next {
	 cursor: pointer;
	 position: absolute;
	 top: 50%;
	 width: auto;
	 padding: 15px 10px;
	 margin-top: -22px;
	 color: #fff !important;
	 font-weight: bold;
	 font-size: 18px;
	 transition: 0.6s ease;
	 user-select: none;
	}
	/* Position the "next button" to the right */
	.carousel-next {
	 right: 0;
	}
	/* On hover, add a black background color with a little bit see-through */
	.carousel-prev:hover, .carousel-next:hover {
	 background-color: rgba(0,0,0,0.8);
	}
	/* Caption text */
	.text {
	 color: #f2f2f2;
	 font-size: 15px;
	 padding: 8px 12px;
	 position: absolute;
	 bottom: 8px;
	 width: 100%;
	 text-align: center;
	}
	/* Number text (1/3 etc) */
	.numbertext {
	 color: #f2f2f2;
	 font-size: 12px;
	 padding: 8px 12px;
	 position: absolute;
	 top: 0;
	}
	/* The dots/bullets/indicators */
	.active, .dot:hover {
	 background-color: #717171;
	}
	/* Fading animation */
	.fade-kit {
	 -webkit-animation-name: fade;
	 -webkit-animation-duration: 1.5s;
	 animation-name: fade;
	 animation-duration: 1.5s;
	}
	a {
		text-decoration: none;
		font-family: 'Poppins';
	}
	@-webkit-keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	@keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	/* On smaller screens, decrease text size */
	@media only screen and (max-width: 300px) {
	 .carousel-prev, .carousel-next,.text {font-size: 11px}
	}
	/* css for stick footer always to the bottom of the page*/
	body {
		min-height: 100vh;
		display: flex;
		flex-direction: column;
	}
	.container.grid-container {
		width: 100%;
	}
	.site-footer {
		margin-top: auto;
	}
}

@media (min-width:900px) and (max-width:1400px)  {  
	.containerGrid .gb-inside-container{
        height: calc(100vh - 160px);
    }
    .contenitore {
        height: calc(100vh - 160px);
        display: grid;
        grid-template-columns: repeat(3 , calc(calc(100% / 3) - 5px));
        grid-template-rows: repeat(7 , calc(calc(100% / 7) - 5px));
        grid-gap: 5px;
        background-color: white;
        padding: 10px 5px 10px 5px;
    }
    .item1 .immagine, .item2 .immagine, .item3 .immagine, .item4 .immagine, .item5 .immagine, .item6 .immagine, .item7 .immagine, .item8 .immagine, .item9 .immagine, .item10 .immagine, .item11 .immagine, .item12 .immagine {
        height: 100%;
        width: 100%;
        object-fit: cover;
		border-radius: 10px;
    }
	.item1 {
        grid-column: 1 / 2;
        grid-row: 1 / 2;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item1:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item2 {
        grid-column: 2 / 3;
        grid-row: 1 / 6;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item2:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item3 {
        grid-column: 3 / 4;
        grid-row: 1 / 4;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item3:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item4 {
        grid-column: 1 / 2;
        grid-row: 7 / 8;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item4:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item5 {
        grid-column: 1 / 2;
        grid-row: 2 / 3;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item5:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item6 {
        grid-column: 1 / 2;
        grid-row: 3 / 4;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item6:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item7 {
        grid-column: 1 / 2;
        grid-row: 4 / 6;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item7:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item8 {
        grid-column: 2 / 3;
        grid-row: 6 / 7;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item8:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item9 {
        grid-column: 3 / 4;
        grid-row: 4 / 7;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item9:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item10 {
        grid-column: 3 / 5;
        grid-row: 7 / 8;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item10:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item11 {
        grid-column: 1 / 2;
        grid-row: 6 / 7;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item11:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.item12 {
        grid-column: 2 / 3;
        grid-row: 7 / 8;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item12:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.title-carosello {
		font-weight: 600;
		margin-left: 35px;
		margin-right: 35px;
		font-size: 35px;
		padding-top: 18px;
		padding-left: 20px;
		padding-right: 20px;
		color: white;
		font-family: 'Poppins';
	}
	.container-carosello {
        padding: 25px 25px 25px 25px;
    }
    .sep-line {
        width: 80px;
        border: 1.5px solid white;
		margin: 10px 35px 0px 55px;
    }
    .bottom-tag {
		width: 40%;
		margin: auto;
		position: absolute;
  		left: 50%;
  		bottom: 0px;
  		transform: translate(-30%, 0);
		font-family: 'Poppins';
    }
	.bottom-tag .rome-is.more {
		position: fixed;
     	bottom: 0;
     	right: 0;
		margin-bottom: 0;
	}
	.rome-is-more {
		font-size: 14px;
		color: white;
		margin-bottom: 2px;
		font-family: 'Poppins';
	}
	.description {
		margin: 10px 35px 15px 35px;
		font-size: 16px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.sub-title {
		margin: 3px 35px 3px 35px;
		font-size: 13px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.note-citation {
		margin: 3px 35px 3px 35px;
		font-size: 13px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	} 
	.container-center-outside {
		display: table;
		height: 100%;
		overflow: hidden;
	}
	.container-center {
		display: table-cell;
		vertical-align: middle;
	}
	video.video_ricetta {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.shadow_box {
		position: absolute;
		top: auto;
		bottom: 0;
		text-align: center;
		width: 100%;
		height: 100%;
        /*box-shadow: inset 0px -30px 30px 5px black;
		-webkit-box-shadow: 0px -30px 30px 5px #000 inset;
		-moz-box-shadow: 0px -30px 30px 5px #000 inset;*/
		box-shadow: inset 0 -50px 60px -5px black;
		border-radius: 10px;
		z-index: 30;
	}
	.pagina_ricette, .pagina_ristoranti, .itinerario, .musei, .colosseo, .musei-insoliti, .roma-4-giorno, .autobus, .personaggi-celebri, .airport, .info-citta{
		position:absolute;
		bottom: 0;
		font-family: 'Poppins';
		font-weight: bold;
		color: white;
		text-align: center;
		bottom: 0;
		width: 100%;
		margin-bottom: 3px;
		font-size: 20px;
	}
	video.video_roma {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.slider {
		height: 100%;
		width: 100%;
	}
	
	/* celebrities's style */
	
  	#slider img {
    	position: absolute;
  	}
  	#slider img:nth-of-type(1) {
    	animation-name: fader;
    	animation-delay: 4s;
    	animation-duration: 2s;
    	z-index: 20;
  	}
  	#slider img:nth-of-type(2) {
    	z-index: 10;
  	}
  	#slider img:nth-of-type(n+3) {
    	display: none;
  	}

  	@keyframes fader {
    	from { opacity: 1.0; }
    	to   { opacity: 0.0; }
  	}
	
	/* style Carosello Rome is More */

	* {
		box-sizing: border-box
	}
	.mySlides {
		display: block;
		height: 100%;
	}
	img {
		vertical-align: middle;
	}
	.slideshow-container {
	 position: relative;
	 margin: auto;
	 background: #000;
	 height: 100%;
	 border-radius: 10px;
	}
	.mySlides.fade-kit {
	 height: 100%;
	}
	.mySlides .kit-desk-img {
	 width: 70%;
	}
	.mySlides .kit-mobile-img {
	 width: 100%;
	}
	/* Next & previous buttons */
	a.carousel-prev, a.carousel-next {
	 text-decoration: none;
	}
	.carousel-prev, .carousel-next {
	 cursor: pointer;
	 position: absolute;
	 top: 50%;
	 width: auto;
	 padding: 15px 10px;
	 margin-top: -22px;
	 color: #fff !important;
	 font-weight: bold;
	 font-size: 18px;
	 transition: 0.6s ease;
	 user-select: none;
	}
	/* Position the "next button" to the right */
	.carousel-next {
	 right: 0;
	}
	/* On hover, add a black background color with a little bit see-through */
	.carousel-prev:hover, .carousel-next:hover {
	 background-color: rgba(0,0,0,0.8);
	}
	/* Caption text */
	.text {
	 color: #f2f2f2;
	 font-size: 12px;
	 padding: 8px 12px;
	 position: absolute;
	 bottom: 8px;
	 width: 100%;
	 text-align: center;
	}
	/* Number text (1/3 etc) */
	.numbertext {
	 color: #f2f2f2;
	 font-size: 10px;
	 padding: 8px 12px;
	 position: absolute;
	 top: 0;
	}
	/* The dots/bullets/indicators */
	.active, .dot:hover {
	 background-color: #717171;
	}
	/* Fading animation */
	.fade-kit {
	 -webkit-animation-name: fade;
	 -webkit-animation-duration: 1.5s;
	 animation-name: fade;
	 animation-duration: 1.5s;
	}
	a {
		text-decoration: none;
		font-family: 'Poppins';
	}
	@-webkit-keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	@keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	/* On smaller screens, decrease text size */
	@media only screen and (max-width: 300px) {
	 .carousel-prev, .carousel-next,.text {font-size: 11px}
	}
	/* css for stick footer always to the bottom of the page*/
	body {
		min-height: 100vh;
		display: flex;
		flex-direction: column;
	}
	.container.grid-container {
		width: 100%;
	}
	.site-footer {
		margin-top: auto;
	}
}

@media(min-width:1401px) {
	/* grid and items's style */

    .containerGrid .gb-inside-container{
        height: calc(100vh - 160px);
    }
    .contenitore {
        height: calc(100vh - 160px);
        display: grid;
        grid-template-columns: repeat(4 , calc(calc(100% / 4) - 5px));
        grid-template-rows: repeat(6 , calc(calc(100% / 6) - 5px));
        grid-gap: 5px;
        background-color: white;
        padding: 10px 5px 10px 5px;
    }
    .item1 .immagine, .item2 .immagine, .item3 .immagine, .item4 .immagine, .item5 .immagine, .item6 .immagine, .item7 .immagine, .item8 .immagine, .item9 .immagine, .item10 .immagine, .item11 .immagine, .item12 .immagine {
        height: 100%;
        width: 100%;
        object-fit: cover;
		border-radius: 10px;
    }
	.item1 {
        grid-column: 1 / 2;
        grid-row: 1 / 2;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item1:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item2 {
        grid-column: 2 / 3;
        grid-row: 1 / 5;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item2:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item3 {
        grid-column: 3 / 4;
        grid-row: 1 / 4;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item3:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item4 {
        grid-column: 4 / 5;
        grid-row: 1 / 4;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item4:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item5 {
        grid-column: 1 / 2;
        grid-row: 2 / 3;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item5:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item6 {
        grid-column: 1 / 2;
        grid-row: 3 / 4;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item6:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item7 {
        grid-column: 1 / 2;
        grid-row: 4 / 6;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item7:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item8 {
        grid-column: 2 / 3;
        grid-row: 5 / 6;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item8:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item9 {
        grid-column: 4 / 5;
        grid-row: 4 / 7;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item9:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item10 {
        grid-column: 3 / 4;
        grid-row: 4 / 7;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item10:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
    .item11 {
        grid-column: 1 / 2;
        grid-row: 6 / 7;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item11:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.item12 {
        grid-column: 2 / 3;
        grid-row: 6 / 7;
		border-radius: 10px;
		transition: box-shadow .5s;
		position: relative;
    }
	.item12:hover {
		box-shadow: 0 7px 10px rgb(135,135,135);
	}
	.title-carosello {
		font-weight: 600;
		margin-left: 35px;
		margin-right: 35px;
		font-size: 40px;
		padding-top: 18px;
		padding-left: 20px;
		padding-right: 20px;
		color: white;
		font-family: 'Poppins';
	}
	.container-carosello {
        padding: 25px 25px 25px 25px;
    }
    .sep-line {
        width: 80px;
        border: 1.5px solid white;
		margin: 10px 35px 0px 55px;
    }
    .bottom-tag {
		width: 40%;
		margin: auto;
		position: absolute;
  		left: 50%;
  		bottom: 0px;
  		transform: translate(-30%, 0);
		font-family: 'Poppins';
    }
	.bottom-tag .rome-is.more {
		position: fixed;
     	bottom: 0;
     	right: 0;
		margin-bottom: 0;
	}
	.rome-is-more {
		font-size: 14px;
		color: white;
		margin-bottom: 2px;
		font-family: 'Poppins';
	}
	.description {
		margin: 10px 35px 15px 35px;
		font-size: 18px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.sub-title {
		margin: 3px 35px 3px 35px;
		font-size: 14px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	}
	.note-citation {
		margin: 3px 35px 3px 35px;
		font-size: 14px;
		color: white;
		font-family: 'Poppins';
		padding-left: 20px;
		padding-right: 20px;
	} 
	.container-center-outside {
		display: table;
		height: 100%;
		overflow: hidden;
	}
	.container-center {
		display: table-cell;
		vertical-align: middle;
	}
	video.video_ricetta {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.shadow_box {
		position: absolute;
		top: auto;
		bottom: 0;
		text-align: center;
		width: 100%;
		height: 100%;
        /*box-shadow: inset 0px -30px 30px 5px black;
		-webkit-box-shadow: 0px -30px 30px 5px #000 inset;
		-moz-box-shadow: 0px -30px 30px 5px #000 inset;*/
		box-shadow: inset 0 -50px 60px -5px black;
		border-radius: 10px;
		z-index: 30;
	}
	.pagina_ricette, .pagina_ristoranti, .itinerario, .musei, .colosseo, .musei-insoliti, .roma-4-giorno, .autobus, .personaggi-celebri, .airport, .info-citta{
		position:absolute;
		bottom: 0;
		font-family: 'Poppins';
		font-weight: bold;
		color: white;
		text-align: center;
		bottom: 0;
		width: 100%;
		margin-bottom: 3px;
		font-size: 20px;
	}
	video.video_roma {
		height: 100%;
		width: 100%;
		object-fit:cover;
		border-radius: 10px;
		position: relative;
	}
	.slider {
		height: 100%;
		width: 100%;
	}
	
	/* celebrities's style */
	
  	#slider img {
    	position: absolute;
  	}
  	#slider img:nth-of-type(1) {
    	animation-name: fader;
    	animation-delay: 4s;
    	animation-duration: 2s;
    	z-index: 20;
  	}
  	#slider img:nth-of-type(2) {
    	z-index: 10;
  	}
  	#slider img:nth-of-type(n+3) {
    	display: none;
  	}

  	@keyframes fader {
    	from { opacity: 1.0; }
    	to   { opacity: 0.0; }
  	}
	
	/* style Carosello Rome is More */

	* {
		box-sizing: border-box
	}
	.mySlides {
		display: block;
		height: 100%;
	}
	img {
		vertical-align: middle;
	}
	.slideshow-container {
	 position: relative;
	 margin: auto;
	 background: #000;
	 height: 100%;
	 border-radius: 10px;
	}
	.mySlides.fade-kit {
	 height: 100%;
	}
	.mySlides .kit-desk-img {
	 width: 70%;
	}
	.mySlides .kit-mobile-img {
	 width: 100%;
	}
	/* Next & previous buttons */
	a.carousel-prev, a.carousel-next {
	 text-decoration: none;
	}
	.carousel-prev, .carousel-next {
	 cursor: pointer;
	 position: absolute;
	 top: 50%;
	 width: auto;
	 padding: 15px 10px;
	 margin-top: -22px;
	 color: #fff !important;
	 font-weight: bold;
	 font-size: 18px;
	 transition: 0.6s ease;
	 user-select: none;
	}
	/* Position the "next button" to the right */
	.carousel-next {
	 right: 0;
	}
	/* On hover, add a black background color with a little bit see-through */
	.carousel-prev:hover, .carousel-next:hover {
	 background-color: rgba(0,0,0,0.8);
	}
	/* Caption text */
	.text {
	 color: #f2f2f2;
	 font-size: 15px;
	 padding: 8px 12px;
	 position: absolute;
	 bottom: 8px;
	 width: 100%;
	 text-align: center;
	}
	/* Number text (1/3 etc) */
	.numbertext {
	 color: #f2f2f2;
	 font-size: 12px;
	 padding: 8px 12px;
	 position: absolute;
	 top: 0;
	}
	/* The dots/bullets/indicators */
	.active, .dot:hover {
	 background-color: #717171;
	}
	/* Fading animation */
	.fade-kit {
	 -webkit-animation-name: fade;
	 -webkit-animation-duration: 1.5s;
	 animation-name: fade;
	 animation-duration: 1.5s;
	}
	a {
		text-decoration: none;
		font-family: 'Poppins';
	}
	
	ul > li:hover {
/* 		text-decoration: none; */
	}
	
	ul#menu-main-menu > li {
/*  		border: 10px solid white;
		border-radius:25px;
		margin: 3px;
		background-color: rgba(0,0,0,0.1); */
	}
	
	ul.sub-menu {
		background-color: rgba(0,0,0,0.2);
		border-radius: 10px;
	}
	
	@-webkit-keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	@keyframes fade {
	 from {opacity: .4} 
	 to {opacity: 1}
	}
	/* On smaller screens, decrease text size */
	@media only screen and (max-width: 300px) {
	 .carousel-prev, .carousel-next,.text {font-size: 11px}
	}
	/* css for stick footer always to the bottom of the page*/
	body {
		min-height: 100vh;
		display: flex;
		flex-direction: column;
	}
	.container.grid-container {
		width: 100%;
	}
	.site-footer {
		margin-top: auto;
	}
}