
@import url("https://use.typekit.net/tmr8lwo.css");

@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.2/font/bootstrap-icons.css");


body, html {
margin:0;
padding:0;
font-family: "katarine-web", sans-serif;
font-weight: 400;
font-style: normal;
font-size:16px;
overflow:hidden;
}

strong,b {
font-weight:600;
}


.btn-video {
background: #000000;
color: #ffffff;
border-radius: 0.2em;
padding: 5px 5px 5px 30px;
line-height: 1;
transition: all 0.3s;
font-family: "stevie-sans", sans-serif;
font-weight: 500;
font-style: normal;
position: relative;
border: 1px solid #000000;
}

.btn-video:hover {
background: #ffffff !important;
color: #000000;
border: 1px solid #000000;
}

.btn-video:after {
font-family: "bootstrap-icons";
content: "\F3C3";
position: absolute;
left: 5px;
top: 5px;
}


/*****************
MODAL
*****************/

.modal.fade .modal-dialog {
transform: none !important;
}


/*****************
LECTEUR VIDEO
*****************/


.lecteur-video {
position:relative;
line-height:0;
}

.lecteur-video #message-video {
top: 0;
bottom: 0;
position: absolute;
width: 100%;
background: #FFFFFFCC;
color: #333333;
text-align: center;
z-index: 2;
opacity: 1;
transition: opacity 0.3s;
font-weight:bold;
border:1px solid #333333;
font-size:1.1em;
cursor:pointer;
transition:all 0.3s;
padding-top:32px;
}

.lecteur-video #message-video:hover {
color:var(--Skyblue);
background:#FFFFFFEE;
}

.lecteur-video #message-video.disapeared {
opacity:0;
pointer-events: none;
}

.lecteur-video #message-video p.picto-play {
margin-bottom:100px;
}

.lecteur-video #message-video p {
text-align:center;
}


.lecteur-video #message-video p.picto-play:after {
content: '\F4F2';
font-family: "bootstrap-icons";
font-size:4rem;
line-height:4rem;
width:4rem;
height:4rem;
position:absolute;
margin-left:-2rem;
color:#135b69;
transition:transform 0.3s, background 0.3s;
}
.lecteur-video #message-video:hover p.picto-play:after {
color:#000000;
transform:scale(1.1);
}

@media screen and (max-width: 539px) {
.lecteur-video #message-video p.picto-play:after {
width:48px;
height:48px;
margin-left:-24px;
border-radius:24px;
}
.lecteur-video #message-video p.picto-play {
margin-bottom:60px;
}
}
