@-webkit-keyframes effect-zoomin {
    0% , 100% { -webkit-transform: scale(1); }
    50%{ -webkit-transform: scale(1.2); }
}

@-webkit-keyframes effect-zoomout {
    0% , 100% { -webkit-transform: scale(1.2); }
    50%{ -webkit-transform: scale(1); }
}

/*SWIPER*/
.swiper-container{position:relative;width:100%;height:100vh;/*min-height:100%;*/ margin-left:auto;margin-right:auto; overflow: hidden;-webkit-transition:all .2s linear;-moz-transition:all .2s linear;transition:all .2s linear }
/*.swiper-container.sw-small{height:400px;}
.swiper-container.sw-medium{height:600px;}
.swiper-container.sw-big{height:800px;}
.swiper-container.sw-full{height:100vH;}*/

.swiper-wrapper {height: 99%;}

/*MASK*/
.swiper-mask-wrapper { position: absolute; top: -1px; left: -1px; width: 101%; height: 101%; z-index: 2 !important; overflow: hidden;}
.swiper-mask{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff; z-index: 2 !important;}

.skyline {position: absolute; bottom:-1px; left: 0; width: 100%; height: 20vh; z-index: 9;   }

.skyline .sl-image img { object-fit: cover; object-position: top; width: 100%; height: 100%;} 
.skyline .sl-bg {margin-top: -2px; height: 500px; background: #fff; }


@media all and (max-width: 667px) {
	.skyline .sl-image {     height: 100px;}
}

.swiper-mask.fade { opacity:1; transition: opacity 0s linear; }
.swiper-mask.fade.start { opacity: 0; transition: opacity 1.0s ease;  transition-delay: .2s;} 


.swiper-mask.up-down { top:0; transition: top 0s linear; }
.swiper-mask.up-down.start { top: 100%; transition: top 1.0s ease;  transition-delay: .5s;} 

.swiper-mask.down-up { height:100%; transition: height 0s linear; }
.swiper-mask.down-up.start { height: 0%; transition: height 1.0s ease;  transition-delay: .5s;} 

/*CLIP PATH ANIMATION*/ 

.swiper-mask.clip-path {}
.swiper-mask.clip-path.up-down { clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); transition: clip-path 0s linear;  }
.swiper-mask.clip-path.up-down.start { clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%); transition: clip-path 1.3s ease; transition-delay: 1s; }

.swiper-mask.clip-path.down-up { clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0% 100%); transition: clip-path 0s linear;  }
.swiper-mask.clip-path.down-up.start { clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0% 100%);  transition: clip-path 1.3s ease; transition-delay: 1s; }

.swiper-mask.clip-path.left-right { clip-path: inset(0 0 0 0%); transition: clip-path 0s linear;  }
.swiper-mask.clip-path.left-right.start { clip-path:inset(0 0 0 100%); transition: clip-path 1.3s ease; transition-delay: 1s; }

.swiper-mask.clip-path.right-left { clip-path: inset(0 0% 0 0); transition: clip-path 0s linear;  }
.swiper-mask.clip-path.right-left.start { clip-path:inset(0 100% 0 0); transition: clip-path 1.3s ease; transition-delay: 1s; }

.swiper-mask.clip-path.circle-center { clip-path: circle(100% at 50% 50%); transition: clip-path 0s linear;  }
.swiper-mask.clip-path.circle-center.start { clip-path:circle(0.0% at 50% 50%); transition: clip-path 1.3s ease; transition-delay: 1s; }
  
.swiper-mask.clip-path.square-center { clip-path: inset(0% round 0%); transition: clip-path 0s linear;  }
.swiper-mask.clip-path.square-center.start { clip-path:inset(100% round 0%); transition: clip-path 1.3s ease; transition-delay: 1s; }
  
.swiper-mask.clip-path.star-center { clip-path: polygon(0 0, 50% 0, 100% 0, 100% 50%, 100% 100%, 50% 100%, 0 100%, 0 50%); transition: clip-path 0s linear;  }
.swiper-mask.clip-path.star-center.start { clip-path:polygon(50% 50%, 50% 25%, 50% 50%, 75% 50%, 50% 50%, 50% 75%, 50% 50%, 25% 50%); transition: clip-path 1.3s ease; transition-delay: 1s; }
  
 
@keyframes anim-spiral {  
  0% { clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%, 0% 25%, 75% 25%, 75% 75%, 25% 75%, 25% 50%, 50% 50%, 25% 50%, 25% 75%, 75% 75%, 75% 25%, 0% 25%); }
  14.25% { clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%, 0% 25%, 75% 25%, 75% 75%, 50% 75%, 50% 50%, 50% 50%, 25% 50%, 25% 75%, 75% 75%, 75% 25%, 0% 25%); }
  28.5% { clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%, 0% 25%, 75% 25%, 75% 50%, 50% 50%, 50% 50%, 50% 50%, 25% 50%, 25% 75%, 75% 75%, 75% 25%, 0% 25%); }
  42.75% { clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%, 0% 25%, 25% 25%, 25% 50%, 25% 50%, 25% 50%, 25% 50%, 25% 50%, 25% 75%, 75% 75%, 75% 25%, 0% 25%); }
  57% { clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%, 0% 75%, 25% 75%, 25% 75%, 25% 75%, 25% 75%, 25% 75%, 25% 75%, 25% 75%, 75% 75%, 75% 25%, 0% 25%); }
  71.25% { clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 75% 100%, 75% 75%, 75% 75%, 75% 75%, 75% 75%, 75% 75%, 75% 75%, 75% 75%, 75% 75%, 75% 75%, 75% 25%, 0% 25%); }
  85.5% { clip-path: polygon(0% 0%, 100% 0%, 100% 25%, 75% 25%, 75% 25%, 75% 25%, 75% 25%, 75% 25%, 75% 25%, 75% 25%, 75% 25%, 75% 25%, 75% 25%, 75% 25%, 0% 25%); }
  100% {clip-path: polygon(0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 25%, 0% 25%, 0% 25%, 0% 25%, 0% 25%, 0% 25%, 0% 25%); }
}

.swiper-mask.clip-path.spiral {  clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);  transition: clip-path 0s linear; }
.swiper-mask.clip-path.spiral.start { animation: 1s anim-spiral; animation-iteration-count: 1;animation-fill-mode: forwards;}

 @keyframes anim-slots {
  0% {
    clip-path: polygon(0% 0%, 14% 0%, 14% 0%, 28% 0%, 28% 0%, 42% 0%, 42% 0%, 56% 0%, 56% 0%, 70% 0%, 70% 0%, 84% 0%, 84% 0%, 100% 0, 100% 100%, 0% 100%);
  }
  50% {
    clip-path: polygon(0% 0%, 14% 0%, 14% 100%, 28% 100%, 28% 0%, 42% 0%, 42% 100%, 56% 100%, 56% 0%, 70% 0%, 70% 100%, 84% 100%, 84% 0%, 100% 0, 100% 100%, 0% 100%);
  }
  100% {
    clip-path: polygon(0% 100%, 14% 100%, 14% 100%, 28% 100%, 28% 100%, 42% 100%, 42% 100%, 56% 100%, 56% 100%, 70% 100%, 70% 100%, 84% 100%, 84% 100%, 100% 100%, 100% 100%, 0% 100%);
	  
  }
}
 
.swiper-mask.clip-path.slots { clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);  transition: clip-path 0s linear;  }
.swiper-mask.clip-path.slots.start { animation: 2s anim-slots; animation-delay: 1s;  animation-iteration-count: 1;animation-fill-mode: forwards; }

@keyframes anim-shutters {
  0% {
    clip-path: polygon(0% 0%, 20% 0%, 20% 100%, 20% 100%, 20% 0%, 40% 0%, 40% 100%, 40% 100%, 40% 0%, 60% 0%, 60% 100%, 60% 100%, 60% 0%, 80% 0%, 80% 100%, 80% 100%, 80% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
  100% {
    clip-path: polygon(20% 0%, 20% 0%, 20% 100%, 40% 100%, 40% 0%, 40% 0%, 40% 100%, 60% 100%, 60% 0%, 60% 0%, 60% 100%, 80% 100%, 80% 0%, 80% 0%, 80% 100%, 100% 100%, 100% 0%, 100% 0%, 100% 100%, 20% 100%);
  }
}

.swiper-mask.clip-path.shutters { clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);  transition: clip-path 0s linear;  }
.swiper-mask.clip-path.shutters.start { animation: 1s anim-shutters; animation-delay: 1s;  animation-iteration-count: 1;animation-fill-mode: forwards; }


 

/*LOADER*/
.swiper-loader { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);text-align: center; z-index: 3; border: 0px solid #f90 }
.swiper-loader > .inner { vertical-align: middle }
.swiper-loader > .inner > .loader-icona i { color: #ccc; font-size: 12px;  }
.swiper-loader > .inner > .loader-logo { }
.swiper-loader > .inner > .loader-logo img { margin-bottom: 10px; -webkit-filter: grayscale(1) invert(1); filter: grayscale(1) invert(1); opacity: .2 }

.swiper-btn-down { display: none; position: absolute;display: table; bottom: 0px; left: 50%; width: 50px; height: 50px; transform: translateX(-50%); z-index:2; border: 0px solid #fff;   }
.swiper-btn-down a {display: table-cell; height: 100%; vertical-align: middle; text-align: center;color: #fff; opacity: 1; }
.swiper-btn-down a:hover { opacity: 1 }

.swiper-container.swiper-scale-effect .swiper-slide > .swiper-slide-cover { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: transparent no-repeat 50% 50% /cover; }
.swiper-container.swiper-scale-effect .swiper-slide-cover {-webkit-animation: effect-zoomout 85s ease-in-out infinite;   }
.swiper-container.swiper-scale-effect .swiper-slide.swiper-slide-active .swiper-slide-cover { -webkit-animation: effect-zoomout 85s ease-in-out infinite;  }

/*SLIDE*/
.swiper-slide{position:relative; overflow: hidden; width: 100%; display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;background-position:center;background-size:cover;background-repeat:no-repeat;-webkit-transition:all .2s linear;-moz-transition:all .2s linear;transition:all .2s linear;}
.swiper-slide .swiper-fg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; opacity: 0.3; z-index: 2; }

/*MASK*/

/*IMG*/

.swiper-slide .swiper-image { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-size: cover; background-position: center;}
.swiper-slide .swiper-image-inner { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-size: cover; background-position: center;}
.swiper-slide .swiper-image-inner img { display: none;width: 100%; height: 100%; object-fit: cover; object-position: center;}

.swiper-slide .swiper-image-inner.img-object { background-image: none !important}
.swiper-slide .swiper-image-inner.img-object img { display: block;}

.swiper-slide .swiper-image-inner.img-bg { background-image:   !important}
.swiper-slide .swiper-image-inner.img-bg img { display: none;}

/*.swiper-slide .swiper-image { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-size: cover; background-position: center;}
.swiper-slide .swiper-image img { display: none;width: 100%; height: 100%; object-fit: cover; object-position: center;}

.swiper-slide .swiper-image.img-object { background-image: none !important}
.swiper-slide .swiper-image.img-object img { display: block;}

.swiper-slide .swiper-image.img-bg { background-image:   !important}
.swiper-slide .swiper-image.img-bg img { display: none;}
*/

.swiper-slide iframe {z-index: 1;}
.swiper-slide video {z-index: 1;}

/*CAPTION*/
/*.swiper-slide .swiper-caption {position:absolute;top: 60%; transform: translateY(-50%);left:0;width:100%;padding:0 80px;background-color:rgba(70, 74, 76, 0);z-index:3;opacity:0;transition:opacity .4s;}*/
.swiper-slide .swiper-caption { position: relative; margin-top: 5%;background-color:rgba(70, 74, 76, 0);z-index:3;opacity:0;transition:opacity .4s;}
.swiper-slide .swiper-caption .title{font-family: 'Playfair Display';font-size:60px;color:#fff;font-weight:200;line-height:120%}
.swiper-slide .swiper-caption .title a{padding:4px 8px;color:rgba(255, 255, 255, .1);background-color:rgba(255, 255, 255, .1)}

.swiper-slide .swiper-caption .subtitle{font-size:30px;color:#fff;font-weight:300;margin-top:15px}
.swiper-slide .swiper-caption .subtitle a{padding:4px 8px;color:rgba(255, 255, 255, .1);background-color:rgba(255, 255, 255, .1)}

.swiper-slide .swiper-caption .text{font-size:18px;color:#fff;font-weight:300;margin-top:15px}
.swiper-slide .swiper-caption .text a{padding:4px 8px;color:rgba(255, 255, 255, .1);background-color:rgba(255, 255, 255, .1)}

.swiper-slide .swiper-caption .title a:hover, .swiper-slide .swiper-caption .subtitle a:hover, .swiper-slide .swiper-caption .text a:hover {color:#fff}



.swiper-slide .swiper-caption .url{   }
.swiper-slide .swiper-caption .url span {display: inline-block;  }
.swiper-slide .swiper-caption .url a{ display: inline-block; width: 100%; height: 100%;padding:4px 8px;  margin-top: 10px; color:#fff;border: 1px solid #fff; transition: all .3s}
.swiper-slide .swiper-caption .url a:hover{ background-color: #fff; color: #000; text-decoration: none; }

/*TEXT ANIMATION MASKING*/ 
.swiper-slide .swiper-caption .title.mask-vertical span, .swiper-slide .swiper-caption .subtitle.mask-vertical span, .swiper-slide .swiper-caption .text.mask-vertical span, .swiper-slide .swiper-caption .url.mask-vertical span { clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%); transition: all .4s ease; }
.swiper-slide .swiper-caption .title.mask-vertical.start span, .swiper-slide .swiper-caption .subtitle.mask-vertical.start span, .swiper-slide .swiper-caption .text.mask-vertical.start span, .swiper-slide .swiper-caption .url.mask-vertical.start span { clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); transition: all .6s ease; transition-delay: 1s;} 

/*small*/
.swiper-container.sw-small .swiper-slide .swiper-caption {bottom: 20%;}
.swiper-container.sw-small .swiper-slide .swiper-caption .title{font-size:26px; font-weight: 300;}
.swiper-container.sw-small .swiper-slide .swiper-caption .subtitle{font-size:20px;margin: 0;}
.swiper-container.sw-small .swiper-slide .swiper-caption .text{font-size:16px;margin: 0;}
.swiper-container.sw-small .swiper-slide .swiper-caption .url{font-size:14px; }

/*vertical mode*/
.swiper-container-vertical .title, .swiper-container-vertical .subtitle, .swiper-container-vertical .text, .swiper-container-vertical .url { transform: none!important} 

/*VIDEO CONTROLS*/
.slide-video { position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); min-width: 100%; min-height: 100%; width: auto; height: auto; z-index: -1000; overflow: hidden; }
.slide-video-controls { position: absolute; top: 20px; left: 50%; transform: translateX(-50%); z-index: 3;  }
.slide-video-controls.hide-controls {bottom: -100px;}
.slide-video-controls > button { border-radius:0%; border-color: transparent; background-color: rgba(255,255,255,.6); color: #212529; font-size: 10px; padding: 6px 7px 5px 7px;   cursor: pointer; -webkit-transition: all .2s linear; -moz-transition: all .2s linear; transition: all .2s linear; }
.slide-video-controls > button:hover { background-color: rgba(255,255,255,1); }

.swiper-container-vertical .slide-video-controls{ transform: none!important} 

/*PAGINATION*/
.swiper-pagination{opacity: 0; bottom: 30px!important; right: 60px!important; width: auto!important; left: inherit!important;right: 0; color: #fff; text-align: right; padding-right: 30px;transition: .2s linear}
.swiper-pagination.swiper-pagination-center{ left: 50%!important; right: inherit!important; bottom: -5px; padding: 0!important; transform: translateX(-50%);}

.swiper-pagination-bullet{background-color:transparent;border:2px solid #333;width:10px;height:10px;display:inline-block;border-radius:50%;opacity:.4}
.swiper-pagination-bullet:focus { outline: 0; border: 0;}
.swiper-pagination-bullet-active, .swiper-pagination-bullet:hover{background-color:#333;opacity:.8}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background-color:#333;opacity:.8}
.swiper-pagination-bullets.custom .swiper-pagination-bullet { border: none; background-color: transparent;}
/*vertical mode*/
.swiper-container-vertical > .swiper-pagination { padding-right: 8px;}
.swiper-container-horizontal>.swiper-pagination-progressbar {width: 100%!important}

/*NAVIGATION*/

.swiper-scrollbar { display: none; }
.swiper-button-next, .swiper-button-prev {opacity: 0; top:50%;margin-top:inherit;transform:translateY(-50%);background:0 0 !important;background-image:none !important;text-align:center;font-size:30px;color:#fff;transition: .2s linear}
.swiper-button-next:focus,.swiper-button-prev:focus { outline: 0; border: 0;}
.swiper-button-next:hover, .swiper-button-prev:hover{opacity:1;}
.swiper-button-prev{left:20px}
.swiper-button-next{right:20px}
/*vertical mode*/
.swiper-container-vertical > .swiper-button-prev {top: 0 !important; left: inherit; right: 15px;   transform: rotate(90deg);}
.swiper-container-vertical > .swiper-button-next {top: inherit; bottom: 0 !important;right: 15px;  transform: rotate(90deg);}	
 

/*THUMBS*/
.swiper-container.swiper-thumbs{height:150px !important;box-sizing:border-box;padding:10px 0}
.swiper-thumbs > .swiper-wrapper > .swiper-slide{width:25%;height:100%;opacity:.4;-webkit-transition:all .2s linear;-moz-transition:all .2s linear;transition:all .2s linear}
.swiper-thumbs > .swiper-wrapper > .swiper-slide:hover{opacity:.8}
.swiper-thumbs > .swiper-wrapper > .swiper-slide-thumb-active{opacity:1}
.swiper-thumbs > .swiper-wrapper > .swiper-slide >.swiper-thumbs-caption { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 10px;text-align: center; z-index: 3; }
.swiper-thumbs > .swiper-wrapper > .swiper-slide >.swiper-thumbs-caption >.title{font-size:12px;color:#fff;font-weight:600;line-height:normal}
.swiper-thumbs > .swiper-wrapper > .swiper-slide >.swiper-thumbs-caption >.icon { position: absolute; top: 50%; left: 50%; width: 50%; height: 50%; transform: translate(-50%,-50%); border: 0px solid #fff; z-index: 1} 
.swiper-thumbs > .swiper-wrapper > .swiper-slide >.swiper-thumbs-caption >.icon img{width: 100%; height: 100%; object-fit: contain; object-position: center;}


/*.either-gif-or-video video { display: none; }*/
@media (-webkit-video-playable-inline) {
    .either-gif-or-video .swipe-image { display: none; }
    .either-gif-or-video video { display: initial; }
}


/* Schermi grandi o ad alta risoluzione */
@media all and (max-width: 1690px) {   }

/* Schermi Desktop o Portatili */
@media all and (min-width: 1280px) and (max-width: 1689px) {  }

/* Tablet in modalità orizzontale */
@media all and (min-width: 737px) and (max-width: 1279px) {   }

/* Tablet in modalità verticale */
@media all and (min-width: 481px) and (max-width: 736px) { 	}

/* Smartphone landscape */
@media all and (max-width: 667px) {
	
	.swiper-container, .swiper-slide{ width: 100%!important;}
    /*CAPTION*/
    .swiper-slide .swiper-caption { padding: 0 30px}
    .swiper-slide .swiper-caption .title{font-size:24px;font-weight:300;}
    .swiper-slide .swiper-caption .subtitle{font-size:20px;font-weight:300;}
    .swiper-slide .swiper-caption .text{font-size:18px;font-weight:300;}
    .swiper-slide .swiper-caption .url{font-size:16px;font-weight:300;}
	
	.swiper-pagination{ bottom: 30px!important; right: 0px!important;}
	
    /*NAVIGATION*/
    .swiper-button-next, .swiper-button-prev { font-size: 16px;}
    .swiper-button-prev{left:5px}
    .swiper-button-next{right:5px}
}

/* Smartphone portrait o piccoli Tablet */
@media all and (max-width: 480px) {
  
}