/*-----------------------------------------------
Any Video Poster CSS
Made for Blocs for Mac
Version 1.0.0 (21 Nov 2021)
By Blocs Builder / https://www.blocsbuilder.com
------------------------------------------------*/

/* --- Video Modal --- */
#anyvideomodal .modal-content, #anyvideomodal .modal-header, #anyvideomodal .modal-footer {border: 0; padding: 0rem; margin-right: 0.5rem; margin-left: 0.5rem; background: rgba(0,0,0,0);}
#anyvideomodal .modal-fullscreen .modal-header {padding:  1.5rem;}
#anyvideomodal .modal-body {background: #000!important; padding:0!important; border: 0px; overflow:hidden; z-index: 1;}
#anyvideomodal .modal-footer {padding: 1rem;}
#any-video-iframe-wrapper {background: #000000;}
#any-video-iframe-wrapper .light {background: #ffffff;}
#anyvideomodal .ratio {max-height: 100%!important;}

/* -- Modal Content Height Auto - fix full screen issues -- */
#anyvideomodal .modal-content {height: auto!important;}

/* --- Modal Close Btn --- */
#anyvideomodal .av-close {border-radius: 1rem!important; z-index: 2!important; opacity: 1!important; padding: 0; font-size: 1.5rem; width: 1.5rem; height: 1.5rem;}

/* --- Modal Close Btn - Right --- */
#anyvideomodal .av-close.av-close-right {position: absolute; top: -0.75rem; right: -0.75rem;}
#anyvideomodal .modal-fullscreen .av-close.av-close-right {position: absolute; top: 1rem; right: 1rem;}

/* --- Modal Close Btn - left --- */
#anyvideomodal .av-close.av-close-left {position: absolute; top: -0.75rem; left: -0.75rem;}
#anyvideomodal .modal-fullscreen .av-close.av-close-left {position: absolute; top: 1rem; left: 1rem;}

/* --- Modal Close Btn - Centre --- */
#anyvideomodal .av-close.av-close-centre {position: relative; margin-left:  auto; margin-right:  auto; margin-bottom: -1rem}
#anyvideomodal .modal-fullscreen .av-close.av-close-centre {position: relative; margin-left:  auto; margin-right:  auto; margin-top: 0rem; margin-bottom: -0.75rem;}

/* --- Modal Shadow --- */
#anyvideomodal .modal-body.shadow {box-shadow:0 .5rem 1rem rgba(0,0,0,0.5)!important;}

/* --- Modal BG Blur --- */
.blur__0 {backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);} 
.blur__1 {backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);} 
.blur__2 {backdrop-filter: blur(50px); -webkit-backdrop-filter: blur(50px);} 

/*#anyvideo-modalbackdrop .modal-backdrop.show {opacity: 1;}*/

/* --- Modal Fade FX Fix --- */
/*.modal.fade .modal-dialog {
    transition: transform 0.3s linear;
}
.modal.fade.show .modal-dialog {
    transition: transform 0.3s linear;
}*/

/* --- Modal Zoom FX --- */
/*.modal.fade.zoom .modal-dialog {-webkit-transform: translate(0,0)scale(.3);transform: translate(0,0)scale(.3);}
.modal.show.zoom .modal-dialog {-webkit-transform: translate(0,0)scale(1);transform: translate(0,0)scale(1);}*/
.modal.fade.zoom .modal-dialog {-webkit-transform: translate(0,0)scale(.5);transform: translate(0,0)scale(.5);}
.modal.show.zoom .modal-dialog {-webkit-transform: translate(0,0)scale(1);transform: translate(0,0)scale(1);}

/* --- Gallery Controls --- */
/*.any-video-controls-next, .any-video-controls-prev, .any-video-controls-close {color: red; opacity: 1; font-size: 0.8rem;}
.any-video-controls-close {opacity: 0.5;}
.any-video-controls-close, .any-video-controls-close:hover { font-size: 1rem; transition: all 0.4s linear;}
.any-video-controls-next:hover, .any-video-controls-prev:hover, .any-video-controls-close:hover {color: white; opacity: 1;}
.any-video-controls-next.disabled, .any-video-controls-prev.disabled {color: red; opacity: 0.3;}
.any-video-controls-wrapper {display: absolute; bottom: 50%; left: 10px;}*/

/* -- Any Video Trigger -- */
.any-video-trigger {cursor: pointer;}

/* -- Poster Ratios -- */
.poster-fit {object-fit: cover; }
.ratio-16x10 {--bs-aspect-ratio:calc(10 / 16 * 100%)}
.ratio-21x9 {--bs-aspect-ratio:calc(9 / 21 * 100%)}
.ratio-1x1 {--bs-aspect-ratio:calc(1 / 1 * 100%)}
.ratio-4x5 {--bs-aspect-ratio:calc(5 / 4 * 100%)}
.ratio-4x3 {--bs-aspect-ratio:calc(3 / 4 * 100%)}
.ratio-2x3 {--bs-aspect-ratio:calc(3 / 2 * 100%)}
.ratio-9x16 {--bs-aspect-ratio:calc(16 / 9 * 100%)}

/* -- Player Border -- */
#anyvideomodal .modal-body.border-1 {border-width: 1px!important;}
#anyvideomodal .modal-body.border-2 {border-width: 2px!important;}
#anyvideomodal .modal-body.border-3 {border-width: 4px!important;}
#anyvideomodal .modal-body.border-4 {border-width: 6px!important;}
#anyvideomodal .modal-body.border-5 {border-width: 8px!important;}
#anyvideomodal .modal-body.rounded-1 {border-radius: 0.25rem!important;}
#anyvideomodal .modal-body.rounded-2 {border-radius: 0.5rem!important;}
#anyvideomodal .modal-body.rounded-3 {border-radius: 0.75rem!important;}

/* -- Caption Justify Fix -- */
.text-justify {text-align: justify!important;}

/* Smaller devices */
@media (min-width: 0px) {  
 	.any-video-poster-container {font-size: 2.5rem;}
}	

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {  
 	.any-video-poster-container {font-size: 4rem;}
}	
 
/* Medium devices (tablets, 768px and up)  */
@media (min-width: 768px) {  
 	.any-video-poster-container {font-size: 4rem;}
}
 
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
 	.any-video-poster-container {font-size: 4rem;}
}

/* -- Modal Fade Speed -- */
.fade.fade__1 {transition:opacity .5s linear}
.fade.fade__2 {transition:opacity .15s linear}
.fade.fade__3 {transition:opacity 0s linear}

/* -- Poster -- */
.anv-video-poster-container {overflow:hidden;}
.any-video-poster-wrap {overflow:hidden; position: relative; z-index:  1; border-style: solid; border-width: 0px; border-color: rgba(0,0,0,0); border-radius: 0;}

.any-video-poster-image {transform: scale(1.003);}
.any-video-poster-overlay {position: absolute; content=""; left: 0; top: 0; width: 100%; height: 100%; cursor: pointer;}
.any-video-poster-overlay:hover { }
.any-video-poster-container figure {margin: 0px;}
.any-video-caption {margin: 0px;}

/* -- Poster Overlay Padding for Icon -- */
.any-video-poster-overlay.padding-0 {padding: 0;}
.any-video-poster-overlay.padding-1 {padding: 3%;}
.any-video-poster-overlay.padding-2 {padding: 4%;}
.any-video-poster-overlay.padding-3 {padding: 5%;}
.any-video-poster-overlay.padding-4 {padding: 6%;} 

/* -- Poster Border -- */
.any-video-poster-wrap.border-1 {border-width: 1px!important;}
.any-video-poster-wrap.border-2 {border-width: 2px!important;}
.any-video-poster-wrap.border-3 {border-width: 4px!important;}
.any-video-poster-wrap.border-4 {border-width: 6px!important;}
.any-video-poster-wrap.border-5 {border-width: 8px!important;}
.any-video-poster-wrap.rounded-1 {border-radius: 0.25rem!important;}
.any-video-poster-wrap.rounded-2 {border-radius: 0.5rem!important;}
.any-video-poster-wrap.rounded-3 {border-radius: 0.75rem!important;}

/* -- Poster Icon -- */
.any-video-poster-icon {width: 100%; height: auto; vertical-align: unset!important;}
.any-video-icon-size.small {width:  10%;};
.any-video-icon-size.medium {width:  12%;};
.any-video-icon-size.large {width:  15%;};

/* -- Enable Non-Persistant Icon -- */
.icon__hover {opacity: 0;}
.any-video-poster-overlay:hover .icon__hover {opacity: 1!important;}

/* -- Shadow Classes -- */
.any-video-shadowfx {box-shadow: 0 .5rem 1rem rgba(0,0,0,.5)!important;}
.any-video-shadowfx-hover {box-shadow: 0 0 0 rgba(0,0,0,0)!important;}
.any-video-shadowfx-hover:hover {box-shadow: 0 .5rem 1rem rgba(0,0,0,.5)!important;}

/* -- Fade Classes -- */
.fadefx__0 {-webkit-transition: all 0.0s; transition: all 0.0s;}
.fadefx__1 {-webkit-transition: all 0.2s; transition: all 0.2s;}
.fadefx__1:hover {-webkit-transition: all 0.2s; transition: all 0.2s;}
.fadefx__2 {-webkit-transition: all 0.4s; transition: all 0.4s;}
.fadefx__2:hover {-webkit-transition: all 0.4s; transition: all 0.4s;}
.fadefx__3 {-webkit-transition: all 0.6s; transition: all 0.6s;}
.fadefx__3:hover {-webkit-transition: all 0.6s; transition: all 0.6s;}
.fadefx__4 {-webkit-transition: all 0.7s; transition: all 0.7s;}
.fadefx__4:hover {-webkit-transition: all 0.7s; transition: all 0.7s;}
.fadefx__5 {-webkit-transition: all 0.8s; transition: all 0.8s;}
.fadefx__5:hover {-webkit-transition: all 0.8s; transition: all 0.8s;}
.fadefx__6 {-webkit-transition: all 0.9s; transition: all 0.9s;}
.fadefx__6:hover {-webkit-transition: all 0.9s; transition: all 0.9s;}
.fadefx__7 {-webkit-transition: all 1s; transition: all 1s;}
.fadefx__7:hover {-webkit-transition: all 1s; transition: all 1s;}

/* -- Poster Zoom Classes -- */
.any-video-poster-image {transform: scale(1.01);}
.any-video-poster-wrap:hover img.zoomfx__1 {transform: scale(1.01);}
.any-video-poster-wrap:hover img.zoomfx__2 {transform: scale(1.02);}
.any-video-poster-wrap:hover img.zoomfx__3 {transform: scale(1.03);}
.any-video-poster-wrap:hover img.zoomfx__4 {transform: scale(1.04);}
.any-video-poster-wrap:hover img.zoomfx__5 {transform: scale(1.05);}

/* -- Poster Rotate Classes -- */
/* .any-video-poster-image img {transform: rotate(0);} */
.any-video-poster-wrap:hover img.rotatefx__1 {transform: rotate(-2.5deg);}
.any-video-poster-wrap:hover img.rotatefx__2 {transform: rotate(-2deg);}
.any-video-poster-wrap:hover img.rotatefx__3 {transform: rotate(-1.5deg);}
.any-video-poster-wrap:hover img.rotatefx__4 {transform: rotate(-1deg);}
.any-video-poster-wrap:hover img.rotatefx__5 {transform: rotate(-0.5deg);}
.any-video-poster-wrap:hover img.rotatefx__6 {transform: rotate(0.5deg);}
.any-video-poster-wrap:hover img.rotatefx__7 {transform: rotate(1deg);}
.any-video-poster-wrap:hover img.rotatefx__8 {transform: rotate(1.5deg);}
.any-video-poster-wrap:hover img.rotatefx__9 {transform: rotate(2deg);}
.any-video-poster-wrap:hover img.rotatefx__10 {transform: rotate(2.5deg);}

/* -- Transition Timing Classes -- */
.timingfx__1 {transition-timing-function: ease;}
.timingfx__1:hover {transition-timing-function: ease;}
.timingfx__2 {transition-timing-function: ease-in;}
.timingfx__2:hover {transition-timing-function: ease-in;}
.timingfx__3 {transition-timing-function: ease-out;}
.timingfx__3:hover {transition-timing-function: ease-out;}
.timingfx__4 {transition-timing-function: ease-in-out;}
.timingfx__4:hover {transition-timing-function: ease-in-out;}
.timingfx__5 {transition-timing-function: linear;}
.timingfx__5:hover {transition-timing-function: linear;}