/* ---------------------------------------------------------------------------
   Inter : police du projet, appliquee a toutes les pages
   (layouts/splash pour le jeu, layouts/bo pour le back-office).
   --------------------------------------------------------------------------- */
@font-face {
  font-family: "Inter";
  src: url("../font/Inter_18pt-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Bootstrap lit sa pile de polices dans cette variable : on la remplace pour
   que tous ses composants suivent sans avoir a les cibler un par un. */
:root {
  --bs-body-font-family: "Inter", Arial, Helvetica, sans-serif;
}

body {
  font-family: "Inter", Arial, Helvetica, sans-serif;
}

/* Les champs de formulaire et boutons n'heritent pas de la police du body
   dans tous les navigateurs : on les raccroche explicitement. */
button, input, optgroup, select, textarea {
  font-family: inherit;
}

a{ text-decoration: none !important;}
a:hover{ text-decoration: none !important;}
.border-none{ border: none;}
.cursorLink{ cursor: pointer;}
.mg-top-140{ margin-top:140px;}
.mg-top-240{ margin-top:240px;}
.mg-top-80{ margin-top:80px;}
.mg-top-60{ margin-top:60px;}
.mg-top-40{ margin-top:40px;}
.mg-top-10{ margin-top: 10px;}
.mg-left-10{ margin-left: 10px;}
.mg-left-20{ margin-left: 20px;}
.mg-left-40{ margin-left: 40px;}
.mg-left-80{ margin-left: 80px;}
.mg-left-120{ margin-left: 120px;}
.mg-left-160{ margin-left: 160px;}
.mg-top-5{ margin-top:5px;}
.mg-top-20{ margin-top:20px;}
.mg-top-neg-20{ margin-top:-20px;}
.mg-top-neg-40{ margin-top:-40px;}
.mg-top-neg-60{ margin-top:-60px;}
.mg-top-neg-80{ margin-top:-80px;}
.mg-top-neg-90{ margin-top:-90px;}
.mg-top-neg-120{ margin-top:-120px;}
.mg-top-120{ margin-top:120px;}
.mg-top-180{ margin-top:180px;}
.mg-bottom-10{ margin-bottom:10px;}
.mg-bottom-20{ margin-bottom:20px;}
.mg-bottom-40{ margin-bottom:40px;}
.mg-bottom-80{ margin-bottom:80px;}
.mg-bottom-100{ margin-bottom:100px;}
.mg-bottom-120{ margin-bottom:120px;}
.mg-bottom-200{ margin-bottom:200px;}
.pd-top-5{ padding-top: 5px;}
.pd-top-10{ padding-top: 10px;}
.pd-top-15{ padding-top: 15px;}
.pd-top-20{ padding-top: 20px;}
.pd-top-30{ padding-top: 30px;}
.pd-top-40{ padding-top: 40px;}
.pd-bottom-15{ padding-bottom: 15px;}
.pd-bottom-30{ padding-bottom: 30px;}
.pd-bottom-60{ padding-bottom: 60px;}
.pd-bottom-80{ padding-bottom: 80px;}
.pd-bottom-120{ padding-bottom: 120px;}
.pd-bottom-180{ padding-bottom: 180px;}
.pd-right-10{ padding-right: 10px;}
.pd-right-25{ padding-right: 25px;}
.pd-left-10{ padding-left: 10px;}
.pd-left-25{ padding-left: 25px;}
.cursorlink{ cursor: pointer;}
.card-custom-light{ background-color:rgba(255, 255, 255, 0.911); color:rgb(0, 0, 0);}
.card_shadow{
    -webkit-box-shadow: 13px 10px 21px 1px rgba(0,0,0,0.66);
    -moz-box-shadow: 13px 10px 21px 1px rgba(0,0,0,0.66);
    box-shadow: 13px 10px 21px 1px rgba(0,0,0,0.66);
}

.card-custom{ border-radius: 0px;}
.card-custom-dark{
    -webkit-box-shadow: 0px 0px 30px 16px rgba(0,0,0,0.82); 
      -moz-box-shadow: 13px 10px 21px 1px rgba(0,0,0,0.66);
box-shadow: 0px 0px 30px 16px rgba(0,0,0,0.82);
}

.card-custom-red{
    
        -webkit-box-shadow: 0px 0px 30px 16px rgba(129, 8, 8, 0.82); 
        -moz-box-shadow: 0px 0px 30px 16px rgba(129, 8, 8, 0.82); 
            box-shadow: 0px 0px 30px 16px rgba(129, 8, 8, 0.82); 
    
}

.card-custom-white{
    -webkit-box-shadow: 0px 0px 50px 50px rgba(255,255,255,0.51); 
    box-shadow: 0px 0px 50px 50px rgba(255,255,255,0.51);
}

.card-custom-pink{
    background-color: #F39FC7;
    -webkit-box-shadow: 0px 0px 50px 50px rgba(255,255,255,0.51); 
    box-shadow: 0px 0px 50px 50px rgba(255,255,255,0.51);
}