@font-face {
  font-family: 'MyFontRegular';
  src: url('Gothic.ttf')  format('truetype')
}
@font-face {
  font-family: 'MyFontBold';
  src: url('GothicB.ttf')  format('truetype')
}


/* ------------------------------------------------------------------------- */
/* ---------------------------- globaux ------------------------------------ */
/* ------------------------------------------------------------------------- */

html{
    overflow:auto;
}

body {
    font-family : 'MyFontRegular';
    color : black;
}

span.blanc{
    color : white;
}

span.bull::after{
    content: "\2022";
    color: white;
}

.fond{
    background-color : rgb(255,231,231);
}

.page h1{
    text-transform: uppercase;
    font-family : 'MyFontBold';
    color: white;
}

.page h2{
    font-family : 'MyFontBold';
    text-align : left;
}

.page p{
    text-align : left;
}

/* ------------------------------------------------------------------------- */
/* ---------------------------- desktop ------------------------------------ */
/* ------------------------------------------------------------------------- */

@media only screen and (min-width: 981px) {

    .separateur_page{
	min-height : 2cm;
	margin : 0;
    }
    
    .fond{
	min-height : calc(100vh - 4.5cm);
	margin-left : 6vw;
	width : calc(100vw - 6vw - 6vw - 2vw);
    }

    span.bull::after{
	font-size: 8px;
    }

    /*
    .page .centreur{
	position : relative;
	top : calc((100vh - 10em) /2);
    }
    .page .contenu {
	transform : translate(0, -50%);
    }
   */
    
    .page h1{
	font-size : 3.3vw;
	margin : 0 7vw;
	padding : 3cm 0 1cm 0;
    }

    .page h2{
	font-size : 1.5vw;
	margin : 0 7vw;
	padding : 1cm 0 0 0;
    }

    .page p{
	font-size : 1.1vw;
	margin : 0 7vw;
    }
    
    html[lang=fr] .page p{
	text-align : justify;
	text-justify: inter-word;
    }

    #marque_deposee p{
	text-align : center;
	padding : 1cm 0 0.8cm 0;
	font-size : 0.85vw;
    }
    
}


/* ------------------------------------------------------------------------- */
/* ---------------------------- mobile ------------------------------------- */
/* ------------------------------------------------------------------------- */

@media only screen and (max-width: 980px) {

    .separateur_page{
	min-height : 2cm;
	margin : 0;
    }

    .fond{
	min-height : calc(100vh - 4.5cm);
	margin-left : 6vw;
	width : calc(100vw - 6vw - 6vw - 2vw);
    }
    
    span.bull::after{
	font-size: 1.457vw;
    }

    .page .centreur{
	position : relative;
	top : 0;
    }
    .page h1{
	font-size : 4.655vw;
	margin : 0 7vw;
	padding : 1.5em 0 0 0;
    }
    .page h2{
	font-size : 2.1vw;
	margin : 0 7vw;
	padding : 1.5em 0 0 0;
    }
    .page p{
	font-size : 1.663vw;
	margin : 0;
	padding : 0em 7vw;
    }
    
    html[lang=fr] .page p{
	text-align : justify;
	text-justify: inter-word;
    }

    #marque_deposee p{
	text-align : center;
	padding : 3em 0 4em 0;
	font-size : 1.25vw;
    }


}