/*========================================================================*/
/*==== VIDEO BANNER ======================================================*/
/*========================================================================*/
.videolink{ position: relative; color:#ffffff; height: 100%; }


.videolink video{ position: absolute; z-index: 1;top:0; left: 0; width: 100%; height:100%; display: block; object-fit: cover; }



.videolink .mobile{position: absolute; pointer-events: none;height: 100%; display: none; top: 0; left: 0; width: 100%; opacity: 0.5; }
.videolink .mobile img{ display: block; width: 100%; height:100%; object-fit:cover; }

.videolink .logo{ position: absolute; z-index: 500; top: 50%; left: 50%; transform: translate(-50%,-50%); width:250px; height:250px; display: flex; }
.videolink .logo img{ display: block; max-width: 100%; height: auto; margin: auto; }


.videolink .layer { background: linear-gradient(to bottom,rgba(0,0,0,0), rgba(0,0,0,0.5) 50% ); position: absolute; z-index: 200; width: 100%; padding:40px; display: flex; font-size:1.3em; text-transform: uppercase; font-weight: 700;  justify-content: center; align-items: center; bottom:0; top:calc(50% + 150px); text-align: center; }
.videolink .layer>*{ display: block;}


.videolink .layer a{ margin-top:20px;  color: inherit; font-weight: 700; padding:6px 15px; border:2px solid #ffffff; display:inline-block; text-decoration:none;  }
.videolink .layer a:hover{ background: #ffffff; border:2px solid #ffffff; display:inline-block; color:var(--wp--preset--color--nightblue);   }



@media (max-width:950px){
	.videolink{ padding:140px 0 100px 0;  }
	.videolink video{ display:none; }
	.videolink .mobile{ display: block;   }
.videolink .logo{ position: relative; transform: none; height: auto; left: auto; top: auto; margin: auto;}
    .videolink .layer { margin-bottom: -100px; /*background: none;*/ position:relative; padding:30px 30px 40px 30px; }
}