/* Botão */
.btn{display:inline-block;outline:0;border:0;cursor:pointer;text-align:center;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle;background-color:transparent;padding: .25rem;font-size:.7rem;box-sizing:border-box;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}

/* Imagens */
.img{display:block;width:100%;max-width:100%;height: auto;}
.img-lazy{-webkit-transition:500ms -webkit-filter linear;transition:500ms -webkit-filter linear;-o-transition:500ms filter linear;transition:500ms filter linear;transition:500ms filter linear, 500ms -webkit-filter linear}
.img-blur{-webkit-filter:blur(1rem);filter:blur(1rem)}

.bg-cover{background-size:cover;background-repeat:no-repeat;background-position:center center}

/* Elementos externos */
.iframe{display:block;width:100%;height:auto}
.video-widescreen, .video-height{position: relative;background-color: #000;overflow:hidden}
.video-height{width: 0;height: 100%;padding-right: 100%;}
.video-widescreen{width:100%;height:0;padding-bottom:56.25%}
.video-widescreen iframe, .video-height iframe{position:absolute;top:0;left:0;width:100%;height:100%}

/* Divisor */
.divider-top{border-top: thin solid var(--light)}
.divider-left{border-left: thin solid var(--light)}
.divider-right{border-right: thin solid var(--light)}
.divider-bottom{border-bottom: thin solid var(--light)}

/*!
 * Snippet Vídeo do Youtube
 */

.snippet-ytb-lazy{position: relative;width:100%;aspect-ratio:16/9;background-color:#000;border-radius:var(--radius);overflow:hidden;cursor:pointer; }
.snippet-ytb-lazy .player,.snippet-ytb-lazy iframe{position:relative;width:100%;height:100%;background-color:inherit}
.snippet-ytb-lazy iframe{border-radius: inherit;}
.snippet-ytb-lazy .player{display:flex;justify-content:center;align-items:center;}
.snippet-ytb-lazy img{position:absolute;width:100%;height:100%;top:0;left:0}
.snippet-ytb-lazy svg{position: absolute; width:30px;line-height:0;border-radius:50%;z-index: 1;fill:var(--main); transition: opacity .2s; opacity: .7;background-color: #fff; padding: 2px;}
.snippet-ytb-lazy:hover svg{opacity: 1;}

.snippet-ytb-lazy .play{position: absolute; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; background-color: #000; top: 0; left: 0; z-index: 1; }
.snippet-ytb-lazy .play.transition{transition: opacity .5s;}
.snippet-ytb-lazy .play.playing{opacity: 0}

@media (min-width:576px){.snippet-ytb-lazy svg{width:50px}}
@media (min-width:992px){.snippet-ytb-lazy svg{width:80px}}

/* Modal Vídeo */
#boxModalVideo{display: none;align-items: center; justify-content: center;align-content: center; position: fixed; left: 0; top: 0; z-index: 99; height: 100vh; width: 100%;}
#boxModalVideo .overlay{position: absolute; background-color: rgba(0,0,0,.3); width: 100%; height: 100%; top: 0;left: 0; z-index: 1; visibility: hidden; opacity: 0; transition: visibility .2s, opacity .2s;}
#boxModalVideo .content_box{position: relative; z-index: 2; width: 328px; margin-top: -50px; aspect-ratio: 16/9; visibility: hidden; opacity: 0; transition: visibility .2s, opacity .2s, margin-top .2s; background-color: #000; border-radius: 8px;}
#boxModalVideo .close{position: absolute; top: -22px; right: 5px; cursor: pointer;}
#boxModalVideo .video{width: 100%; background-color: transparent; aspect-ratio:16/9;border-radius:8px;overflow:hidden}
#boxModalVideo iframe{position:relative;width:100%;height:100%;background-color:inherit}

#boxModalVideo.opened{display: flex;}
#boxModalVideo.visible .overlay{opacity: 1; visibility: visible;}
#boxModalVideo.visible .content_box{opacity: 1; visibility: visible; margin-top: 0;}

@media (min-width:576px){
    #boxModalVideo .content_box{width: 530px;}
}

@media (min-width:992px){
    #boxModalVideo .content_box{width:874px;}
    #boxModalVideo .close{top: -20px; right: -20px;}
}

/* 
* Gallery
*/

.gallery__container{position: relative; width: 100%; height: 100%}
.gallery__content{position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; align-items: center; width: 100%; height: 100%; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); opacity: 1; visibility: visible; -webkit-transition: opacity .3s, visibility .3s, -webkit-transform .3s; transition: opacity .3s, visibility .3s, -webkit-transform .3s; -o-transition: transform .3s, opacity .3s, visibility .3s; transition: transform .3s, opacity .3s, visibility .3s; transition: transform .3s, opacity .3s, visibility .3s, -webkit-transform .3s; -webkit-transition-timing-function: ease-in-out; -o-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out; padding: 20px; z-index: 1;}
.gallery__content img{max-width: 100%; max-height: 100%}
.gallery__to_left, .gallery__to_right{opacity: 0; visibility: hidden;}
.gallery__to_left{-webkit-transform: translateX(-300px);-ms-transform: translateX(-300px);transform: translateX(-300px)}
.gallery__to_right{-webkit-transform: translateX(300px);-ms-transform: translateX(300px);transform: translateX(300px)}
.gallery__wait{-webkit-transition: none;-o-transition: none;transition: none}
.gallery__arrow{position: absolute; display: block;  top: calc(50% - 25px); left: 1rem;  cursor: pointer; fill: #fff; z-index: 9; opacity: .5; -webkit-transition: opacity .2s; -o-transition: opacity .2s; transition: opacity .2s; visibility: hidden;}
.gallery__arrow:hover{opacity: 1}
.gallery__arrow svg{display: block; position: relative; height: 50px; width: 30px; -webkit-filter: drop-shadow( 0 3px 10px rgba(0, 0, 0, 1)); filter: drop-shadow( 0 3px 10px rgba(0, 0, 0, 1)) }
.gallery__arrow_next{left: auto; right: 1rem;}
.gallery__loader{position:absolute;top:calc(50% - 30px);left:calc(50% - 30px);border:8px solid #fff;border-radius:50%;border-top:8px solid transparent;border-bottom:8px solid transparent;width:50px;height:50px;-webkit-animation:spin .8s linear infinite;animation:spin_loader .8s linear infinite;opacity:.8}
@-webkit-keyframes spin_loader{0%{-webkit-transform:rotate(0)}100%{-webkit-transform:rotate(360deg)}}@keyframes spin_loader{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}
@media (min-width:768px){.gallery__arrow{visibility:visible}.gallery__content{padding:40px}}
