/* CSS Document */
.swiper-container { position: relative; /*height:2000px !important;*/ height: 100vh; min-height: 100px; padding-top: 0px; -webkit-transition: all .2s linear; -moz-transition: all .2s linear; transition: all .2s linear; }
.swiper-container > .loader { position:absolute; top:0; left:0; width:100%; height:100%; z-index:2;  }
.swiper-container > .loader > .inner { position:absolute; padding:50px 30px; top:20%; left:50%; transform:translate(-50%,-20%);/*background-color:#fff; border:1px solid #ccc; */ color:#ccc; font-size:12px; text-align:center; vertical-align:middle}
.swiper-container > .loader > .inner img { margin-bottom:10px; -webkit-filter: grayscale(1) invert(1); filter: grayscale(1) invert(1); opacity:.2}
.swiper-wrapper .swipe-btn-down { position: absolute; bottom: 0px; left: 50%; transform: translateX(-50%); z-index: 1; display: none; }
.swiper-wrapper .swipe-btn-down a { color: #fff; font-size: 100px; opacity: 0.1 }
.swiper-wrapper .swipe-btn-down a:hover { opacity: 1 }
.swiper-wrapper .swipe-btn-down a img { width: 40px; }
.swiper-bottom { position: relative; display: block; width: 100%; height: 20px; }
/*SLIDE*/
.swiper-slide { width: 100%; background-color: #fff; background-position: center; background-size: cover; }
.swiper-slide .fg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color:rgba(59,85,164,.8); z-index: 2; }
/*CAPTION*/
.swiper-slide .caption { display: none; position: absolute; bottom: 10%; left: 0; width: 100%; /*min-height: 80px;*/ padding: 0; background-color: rgba(70,74,76,0.0); z-index: 3; }
.swiper-slide .caption .container {  width: 80%;} 
.swiper-slide .caption .title { font-size: 20px; color: #fff; font-weight: 400; text-shadow: 0px 0px 3px #666; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.swiper-slide .caption .title a { padding: 4px 8px; color: rgba(255,255,255,0.1); background-color: rgba(255,255,255,0.1); }
.swiper-slide .caption .subtitle { font-size: 16px; color: #fff; font-weight: 300; text-shadow: 0px 0px 3px #666; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.swiper-slide .caption .subtitle a { padding: 4px 8px; color: rgba(255,255,255,0.1); background-color: rgba(255,255,255,0.1); }
.swiper-slide .caption .title a:hover, .swiper-slide .caption .subtitle a:hover { color: #fff; }
.swiper-slide .caption .url { padding: 0; }
.swiper-slide .caption .url a { color: #fff; text-shadow: 0px 0px 3px #666; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.swiper-slide .caption .url a:hover { background-color: rgba(255,255,255,1); color: rgba(59,85,164,1); text-shadow: none; }

@media screen and (min-width: 768px) {
/* da testare #slider_<?php echo $ss_array['ss_id'] ?> { margin-top:-150px;}*/
.swiper-slide .caption { top:40%;  bottom: inherit;  }
.swiper-slide .caption .title { font-size:18px; margin-bottom:10px;}
.swiper-slide .caption .subtitle { font-size:36px; font-weight:300; margin-bottom:25px;}
.swiper-slide .caption .url a { padding:10px 15px; border:1px solid #fff; font-size:16px; font-weight:300; margin-bottom:15px;}
}

/*NAVIGATION*/
.swiper-scrollbar { display: none; }
.swiper-button-next, .swiper-button-prev { top: 50%; margin-top: inherit; width: auto; transform: translateY(-50%); background: none !important; background-image: none !important; text-align: center; font-size: 30px; color: #fff; opacity: 0.3; -webkit-transition: all .2s linear; -moz-transition: all .2s linear; transition: all .2s linear; }
.swiper-button-next i, .swiper-button-prev i { display: none; }
.swiper-button-next:hover, .swiper-button-prev:hover { opacity: 1 }
.swiper-button-prev { left: 20px }
.swiper-button-next { right: 20px }
/*PAGINATION*/
.swiper-pagination { width: auto !important; left: 50% !important; transform: translateX(-50%); color: #fff }
.swiper-pagination-bullet { background-color: #fff; }
.swiper-pagination-bullet-active { background-color: #FFF; }
/*propgress*/
.swiper-pagination-progress .swiper-pagination-progressbar { background-color: #fff; opacity: 0.8; }
/*THUMBS*/
.swiper-thumbs { height: 100px; box-sizing: border-box; padding: 10px 0; }
.swiper-thumbs .swiper-slide { width: 25%; height: 100%; opacity: 0.4; -webkit-transition: all .2s linear; -moz-transition: all .2s linear; transition: all .2s linear; }
.swiper-thumbs .swiper-slide:hover { opacity: 0.8; }
.swiper-thumbs .swiper-slide-active { opacity: 1; }
/*VIDEO CONTROLS*/
.slider-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; }
.slider-video-controls { position: absolute; top: 20px; left: 50%; transform: translateX(-50%); z-index: 3; }
.slider-video-controls > button { border-color: transparent; background-color: rgba(70,74,76,0.5); color: #fff; font-size: 10px; padding: 6px 9px; opacity: 0.5; cursor: pointer; }
.slider-video-controls > button:hover { opacity: 1; }

@media screen and (max-width: 768px) {
.swiper-container { padding-top: 0px !important; /*height:330px !important;*/ }
	
	.swiper-wrapper > .mask,.swiper-container > .loader {display: none;}
}

@media screen and (max-width: 736px) {
.swiper-container { padding-top: 0px; /*height:310px !important; */ }
.swiper-slide .caption .container {  width: 100%;} 
.swiper-slide > .caption { bottom: 40%; left: 20px; }
.swiper-slide > .caption .title { font-size: 20px; }
.swiper-slide > .caption .subtitle { font-size: 16px; }
.swiper-button-next, .swiper-button-prev { top: inherit; bottom: 10%; width: 20px; overflow: hidden; }
.swiper-button-next img { right: 0px; top: 10px; position: absolute; }
}

@media screen and (max-width: 667px) {
.swiper-container { padding-top: 0px !important;/*height:250px!important; */ }
}

@media screen and (max-width: 480px) {
.swiper-container { padding-top: 0px !important;/*height:160px!important; */ }
}

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