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


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

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

#loading .fond{
    margin : 2cm 2cm !important;
    width : calc(100vw - 4cm) !important;
    height : calc(100vh - 4cm) !important;
    background-color : rgb(255,231,231) !important;
    min-width : calc(100vw - 4cm) !important;
    min-height : calc(100vh - 4cm) !important;
    padding : 0 !important;
}
#loading .centreur{
    position : relative !important;
    top : calc((100vh - 4cm) /2) !important;
}
#loading .contenu{
    transform : translate(0, -50%) !important;
    text-align : center !important;
    font-family : 'MyFontBold' !important;
    color : white !important;
    text-transform: uppercase !important;
    font-size : 3vw !important;
}
#loading img{
    width : 2.1vw !important;
    height : auto !important;
}

span.blanc{
    color : white;
}

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

nav ul{
    list-style-type : none;
}

nav ul .current_page{
    font-family : 'MyFontBold';
    color : rgb(255,231,231);
}

nav ul .bull_icon{
    font-family : 'MyFontBold';
    color : rgb(255,231,231);
}

nav a{
    color : black;
    text-decoration : none;
}

h1{
    text-transform: uppercase;
    font-weight : normal;
}

h2{
    font-weight : normal;
}

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

a.mail{
	display : block;
	text-align : center;
    text-decoration : none;
    color : black;
}

a.mail:hover{
	color : white;
}

a.lien_mentions_legales{ /* #lien_mentions_legales{*/
    text-decoration : none;
    color : black;
}
a.lien_mentions_legales .separateur{ /*#lien_mentions_legales span.separateur{*/
    display : inline-block;
    width : 1.5vw;
}

html{overflow:auto;} 

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

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

    br.cesure_desktop{
		display:none;
	}
    
    /* ..... nav ..................... */
    nav {
	z-index : 1;
	position : fixed;
	top : 0px;
	left : 0px;
	width : calc(100vw - 10px);
	padding : 5px 5px 0 5px;
	text-transform: uppercase;
	background-color : rgba(255,255,255,0.4);
	text-align : right;
    }
    nav.montree{
	background-color : rgba(255,255,255,0.9);
    }
    
    #nav_logo{
	height : 14.5vw;
	width : auto;
    }
    nav ul{
	font-size : 4.156vw;
	padding : 0 2em;
	display : none;
    }
    nav.montree ul{	
	display : block;
    }

    nav li a:hover{
	font-family : 'MyFontBold';
	color : white;
	background-color : rgba(255,231,231,0.9);
    }
    
    .separateur_page{
	min-height : 10em;
    }

    .fond{
	width : calc(100vw - 18em);
	min-height : calc(100vh - 17em);
	margin : 0em 4em 0em 4em;
	padding : 0 4em 4em 4em;
	background-color : rgb(255,231,231);
	min-width : 460px;
    }
    
    /* ...... titres ................. */
    #accueil .fond{
	min-height : calc(100vh - 15em);
	padding : 0em 4em 0em 4em;
    }
    #accueil .centreur{
	position : relative;
	top : calc((100vh - 15em) /2);
    }
    #accueil .contenu{
	transform : translate(0, -50%);
	text-align : center;
    }

    #accueil h1{
	margin : 0;
	font-size : 5.830vw;
	font-weight : normal;
	text-transform : capitalize;
    }
    #accueil h1 span.blanc{
	font-family : 'MyFontBold';
    }

    #accueil h2{
	margin : 0px;
	font-size : 2.811vw;
	font-weight : normal;
    }
    html[lang="en"] #accueil h2{
	font-size : 3.014vw;
    }
    html[lang="ru"] #accueil h2{
	font-size : 1.874vw;
    }
    
    #accueil h2 span.gt{
	font-size : 2.500vw;
	font-family : 'MyFontBold';
	color : white;
    }
    html[lang="en"] #accueil h2 span.gt{
	font-size : 2.500vw;
	font-family : 'MyFontBold';
	color : white;
    }
    html[lang="ru"] #accueil h2 span.gt{
	font-size : 1.666vw;
	font-family : 'MyFontBold';
	color : white;
    }

    html[lang="en"] #accueil h2 span.fill{
	display : inline-block;
	width : 0cm;
    }
    html[lang="ru"] #accueil h2 span.fill{
	display : inline-block;
	width : 0.6em;
    }


    /* ...... pages .................. */
    
    span.bull::after{
	font-size: 1.457vw;
    }

    .page .centreur{
	position : relative;
	top : 0;
    }
    .page h1{
	font-family : 'MyFontBold';
	font-size : 4.655vw;
	margin : 0;
	padding : 2.5em 0 0 0;
    }
    .page p,
    .page p.titre~p{
	font-size : 1.663vw;
	margin : 0;
	padding : 0.5em 0;
	text-align : left;
    }
    html[lang=fr] .page p{
	text-align : justify;
	text-justify: inter-word;
    }

    .colonne_1,
    .colonne_2,
    .colonne_3,
    .colonne_4{
	flex : 100%;
    }
    
    html .page .colonne_1 .titre_colonne,
    html .page .colonne_2 .titre_colonne,
    html .page .colonne_3 .titre_colonne,
    html .page .colonne_4 .titre_colonne{
	font-size : 3.159vw;
	font-family : 'MyFontBold';
	text-align : center;
	line-height: normal;
	padding : 1em 0 0 0;
    }
    .colonne_1 div.paragraphes_colonne p,
    .colonne_2 div.paragraphes_colonne p,
    .colonne_3 div.paragraphes_colonne p,
    .colonne_4 div.paragraphes_colonne p{
	padding : 0 4em;
	text-align : center;
    }
    .titre_colonne .bull_icon{
	color : white;
    }
    .titre_colonne .bull_icon::before{
	content : "\A";
	white-space : pre;
    }
    .titre_colonne .bull_icon::after{
	content : "\A";
	white-space : pre;
    }

    /* ...... page 1 ................. */

    /* ...... page 2 ................. */    
    
    #souspage_2 p.titre_colonne~p{
	text-align : center;
	padding : 0 4em;
    }
    
    /* ...... page 3 ................. */
    
    #souspage_3 p.titre_colonne~p{
	text-align : center;
    }
        
    /* ...... page 4 ................. */
    
    #souspage_4 p.titre_colonne~p{
	text-align : center;
    }
        
    /* ...... page 5 ................. */
    
    #souspage_5 h2{
	font-size : 3.824vw;
	font-family : 'MyFontBold';
	text-align : center;
	margin : 0;
	padding : 1em 0 0 0;
    }
    #souspage_5 p{
	font-size : 1.663vw; /*2.494vw;*/
	text-align : center;
	padding : 0;
    }
    
    #souspage_5 .bull_icon{
	display : none;
    }
        
    /* ...... page 6 ................. */
    
    /*#photo{*/
    #souspage_6 img{
	padding-top : 36px;
	display : block;
	margin-left : auto;
	margin-right : auto;
	width : 30vw;
	height : auto;
    }
    
    /*#signature{*/
    #souspage_6 p.signature{
	text-align : center;
	font-family : 'MyFontBold';
    }
        
    /* ...... page 7 ................. */
    
    #souspage_7 h2{
	font-size : 3.824vw;
	text-align : center;
	text-transform : uppercase;
	margin : 1em 0;
	padding : 0;
    }
    #souspage_7 h2 span.gras{
	font-family : 'MyFontBold';
    }

    
    #souspage_7 .tel{ /*#tel{*/
	font-size : 1.663vw; /*2.826vw;*/
	text-align : center;
	margin : 1em 0 0 0;
	padding : 0;
    }
    #souspage_7 .mail { /*#mail{*/
	font-size : 1.663vw; /*2.826vw;*/
	text-align : center;
	margin : 0.9em 0 0 0;
	padding : 0;
    }
    /*
    #marque_deposee{
	font-size : 1.662vw;
	text-align : center;
	margin : 4em 0 0 0;
	padding : 0;
    }
   */

    #footer_top{
	min-height : 9em;
    }

    #footer .fond{
	min-height : 1em;
	padding : 0 4em 0em 4em;
	background-color : white;
	text-align : center;
    }

    
    /* ............................... */
    
}


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

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

    /* ..... nav ..................... */

    nav {
	z-index : 1;
	position : fixed;
	width : 16.5vw;
	left : calc(100vw - 6vw - 13.5vw);
    }

    nav {
	top : 6.5cm;
    }
    
    #nav_logo{
	height : 5.062vw;
	width : auto;
	float : right;
    }
    
    nav ul{
	clear : both;
	padding : 0.5cm 0 0 0 ;
	font-size : 1.020vw;
	text-transform: uppercase;
	text-align : right;
    }
    
    nav a:hover{
	color : white;
	font-family : 'MyFontBold';
	background-color : rgb(255,231,231);
    }

    .separateur_page{
	min-height : 2cm;
    }
    
    .fond{
	min-height : calc(100vh - 4cm);
	margin-left : 6vw;
	width : calc(100vw - 6vw - 6vw - 15vw);
	background-color : rgb(255,231,231);
    }

    /* ....... titres ................ */

    #accueil .centreur{
	position : relative;
	top : calc((100vh - 4cm) /2);
    }
    
    #accueil .contenu{
	transform : translate(0, -50%);
	text-align : center;
    }

    #accueil h1{
	text-transform : capitalize;
	font-size : 5.65vw;
	font-weight : normal;
	margin : 0;
    }
    #accueil h1 span.blanc{
	font-family : 'MyFontBold';
    }

    #accueil h2{
	font-size : 2.72vw;
	font-weight : normal;
	margin : 0px;
    }
    html[lang="en"] #accueil h2{
	font-size : 2.903vw;
    }
    html[lang="ru"] #accueil h2{
	font-size : 1.883vw;
    }

    #accueil h2 span.blanc{
	font-size: 2.354vw;
	font-family : 'MyFontBold';
	color : white;
    }

    #accueil h2 span.gt{
	font-size : 2.354vw;
	font-family : 'MyFontBold';
	color : white;
    }
    html[lang="en"] #accueil h2 span.gt{
	font-size : 2.510vw;
    }
    html[lang="ru"] #accueil h2 span.gt{
	font-size : 1.490vw;
    }

    html[lang="en"] #accueil h2 span.fill{
	display : inline-block;
	width : 0cm;
    }
	
    /* ........ pages ................ */

    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 : 2.746vw;
	margin : 0;
	padding : 4.5cm 0 0 2cm;
    }
    .page p{
	font-size : 0.9416vw;
	margin : 0.2em 2cm 1em 2cm;
	text-align : left;
    }
    html[lang=fr] .page p{
	text-align : justify;
	text-justify: inter-word;
    }
    
    #souspage_2 .conteneur_colonnes{
	padding-top : 1.5cm;
	display: flex;
	flex-wrap: wrap;
	margin : 0em 3em;
    }
    
    #souspage_2 .colonne_1,
    #souspage_2 .colonne_2,
    #souspage_2 .colonne_3{
	flex : 28%;
	padding: 0;
	width : 6.75cm;
	margin-bottom : 3.5cm;
    }
    
    html #souspage_2 p.titre_colonne{
	font-family : 'MyFontBold';
	font-size : 1.569vw;
	text-align : center;
	margin : 1em 0.5em 0em 0.5em ;
	padding : 0;
    }

    html #souspage_2 div.paragraphes_colonne p{
 	font-size : 0.863vw;
	text-align : center;
	padding : 0;
	margin : 0 2em;
	visibility: hidden;
    }
    
    #souspage_2 .colonne_1:hover p.titre_colonne,
    #souspage_2 .colonne_2:hover p.titre_colonne,
    #souspage_2 .colonne_3:hover p.titre_colonne{
	color : white;

    }

    #souspage_2 .colonne_1:hover div.paragraphes_colonne p,
    #souspage_2 .colonne_2:hover div.paragraphes_colonne p,
    #souspage_2 .colonne_3:hover div.paragraphes_colonne p{
	visibility: visible;
    }
    
    #souspage_3 .conteneur_colonnes{
	padding-top : 1.5cm;
	display: flex;
	flex-wrap: wrap;
	margin : 0em 3em;
    }
    
    #souspage_3 .colonne_1, 
    #souspage_3 .colonne_2{
	flex : 45%;
	padding: 0;
	width : 10.5cm;
	margin-bottom : 3.5cm;
    }
    
    html #souspage_3 p.titre_colonne{
	font-family : 'MyFontBold';
	font-size : 1.962vw;
	text-align : center;
	margin : 1em 0.5em 0em 0.5em ;
	padding : 0;
    }

    html #souspage_3 div.paragraphes_colonne p{
 	font-size : 1.020vw;
	text-align : center;
	padding : 0;
	margin : 0 2em;
	color : black;
    }
    
    #souspage_4 .conteneur_colonnes{
	padding-top : 1.5cm;
	display: flex;
	flex-wrap: wrap;
	margin : 0em 3em;
    }
    
    #souspage_4 .colonne_1, 
    #souspage_4 .colonne_2, 
    #souspage_4 .colonne_3, 
    #souspage_4 .colonne_4 {
	flex : 20%;
	padding: 0;
	width : 4.5cm;
	margin-bottom : 3.5cm;
    }
    
    html #souspage_4 p.titre_colonne{
	font-family : 'MyFontBold';
	font-size : 1.569vw;
	text-align : center;
	margin : 1em 0.5em 0em 0.5em;
	padding : 0;
    }
    
    html #souspage_4 div.paragraphes_colonne p{
	font-size : 0.863vw;
	text-align : center;
	padding : 0;
	margin : 0 0.5em;
	visibility : hidden;
    }

    #souspage_4 .colonne_1:hover p.titre_colonne,
    #souspage_4 .colonne_2:hover p.titre_colonne,
    #souspage_4 .colonne_3:hover p.titre_colonne,
    #souspage_4 .colonne_4:hover p.titre_colonne{
	color : white;

    }
    
    #souspage_4 .colonne_1:hover div.paragraphes_colonne p,
    #souspage_4 .colonne_2:hover div.paragraphes_colonne p,
    #souspage_4 .colonne_3:hover div.paragraphes_colonne p,
    #souspage_4 .colonne_4:hover div.paragraphes_colonne p{
	visibility : visible;
    }
    
    html #souspage_5 h2{
	font-family : 'MyFontBold';
	font-size : 2.354vw;
	text-align : center;
	margin : 0;
	padding : 1.5cm 0 0 0;
    }
    
    html #souspage_5 div.paragraphes_colonne p{
	font-size : 1.177vw;
	text-align : center !important;
	margin : 0;
	padding : 0;
    }

    html #souspage_6 p{
	padding-bottom : 6px;
    }
	
    #souspage_6 img{
	padding-top : 36px;
	display : block;
	margin-left : auto;
	margin-right : auto;
	width : 16.8vw;
	height : auto;
    }
    
    #souspage_6 p.signature{
	font-family : 'MyFontBold';
	font-size : 1.020vw;
	text-align : center !important; 
	margin : 0;
	padding: 1em 0;
    }
    
    #souspage_7 h2{
	font-size : 2.825vw;
	text-align : center;
	text-transform : uppercase;
	margin : 40px 0 18px 0;
	padding : 0;
    }

    #souspage_7 h2 span.gras{
	font-family : 'MyFontBold';
    }
    
    #souspage_7 p.tel{
	font-size : 1.412vw;
	text-align : center !important;
	margin : 0 0 18px 0;
	padding : 0;
    }
    #souspage_7 .mail{
	font-size : 1.412vw;
	text-align : center !important;
	margin :  0 0 0 0;
	padding : 0;
    }
    /*
    #souspage_7 #marque_deposee{
	font-size : 0.55em;
	text-align : center;
	margin : 6em 0 0 0;
	padding : 0;
    }
   */

    /* ........ footer ............... */

    #bottom_top{
	/*min-height : calc(2cm - 1.177vw);*/
    }

    #footer{
	margin-left : 6vw;
	width : calc(100vw - 6vw - 6vw - 15vw);
	text-align : center;
	font-size : 1vw;
    }

    #footer .fond{
	margin-left : 6vw;
	width : calc(100vw - 6vw - 6vw - 15vw);
	text-align : center;
	font-size : 1vw;
	min-height : 0;
	min-width : 0;
	margin : 0;
	padding : 0;
	background-color : white;
    }

    /* ............................... */
    
}
