/* @font-face {
	font-family: 'Lora';
	src: url('../fonts/Lora-VariableFont_wght.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
} */
@font-face {
	font-family: 'Roboto';
	src: url('../fonts/Roboto-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Montserrat';
	src: url('../fonts/Montserrat Regular 400.ttf') format('truetype');
	src: url('../fonts/Montserrat SemiBold 600.ttf') format('truetype');
	src: url('../fonts/Montserrat-Bold-700.ttf') format('truetype');
}

/* @font-face {
	font-family: 'PermanentMarker-Regular';
	src: url('../fonts/PermanentMarker-Regular.ttf') format('truetype');
} */
  
* {
	/* La largeur de tous les élémnets prend en compte les bordures et le padding. */
	box-sizing: border-box;
}
  
body {
    /* position: relative; */
    /* weight | size/line-height | families */
    /* font: 400 13px/26px "Montserrat", "Lora", "Roboto", sans-serif; */
    /* font : 400 15px/1.8 Arial, sans-serif; */
	text-align: center;    
    /* color: #000000; */
    /* overflow: hidden; */
    /* position: relative; */
    height: 100%;
    margin: 0;
    font: 400 15px/1.8 "LuckiestGuy", sans-serif;
    background-color: #000000;
    /* background-image: url('../../images/BackGround/background_1.jpg'); */
    /* background-repeat: no-repeat; */
    /* background-attachment: fixed; */
    /* background-position: center;  */
}

html {
    /* overflow: hidden; */
    height: 100vh;
    width: 100vw;
    /* position: fixed; */
  }

/* html {
    overflow: hidden;
    height: 100%;
} */

.hidden {
    display: none;
}

.titleBorderTop {
    border-top : 1px solid #bd1522;
}

.titleFont {
    font-size: 1.1rem;
    line-height: 2.4rem;
}

.titleMarginLeft {
    margin-left : 1px;
}

.titleMarginRight {
    margin-right : 1px;
}

.bgc_grey{
	background-color: rgb(206, 206, 206);
}

.text_white {
	color : #FFFFFF;
}

.text_black {
	color : #000000;
}

.text_upper {
	text-transform: uppercase;
}

.text_left {
	text-align : left;
}

/* =================== */
/*    POPUP MESSAGE    */
/* =================== */
#popUpMessage {
    display: none; /* ==> flex via Js*/
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    color: white;
    font-size: 30px;
    background-color: black;
    z-index: 1;
    justify-content: center;
    align-items: center;
}

#popUpMessage > div {
    width: 40%;
    border: 1px solid red;
    height: 30%;
    display: flex;
    justify-content: start;
    align-items: center;
    font-size: 32px;
    padding: 0 10px;
    flex-direction: column;
}

#popUpMessage>div .popupTitle{
    position: relative;
    border-bottom: 1px solid red;
    width: 100%;
}

#popUpMessage>div .popupCore{
    position: relative;
    margin-top : 40px;
    font-size: 18px;
    margin-left: 0px;
    text-align: center;
}