/*Links*/
/*		Grid CSS : https://css-tricks.com/snippets/css/complete-guide-grid/
		Text-vertical : http://jsfiddle.net/jZJ87/1/
		Flex Text : https://codepen.io/aknip/pen/GpGevp/
		Wordpress reference : http://eris-lite.tkdemos.com/
		Font generator : https://everythingfonts.com/font-face
		Reference model : https://codepen.io/julesforrest/pen/xLBbVb
		Integration video responsive : https://codepen.io/adrianparr/pen/GjayvV
*/ 

@charset "UTF-8";
/* CSS Document */

body, html {
    height:100%;
    width:100%;
    font-weight: 100;
    margin: auto;
    min-width: 683px;
}

/*container grid*/

/*index*/

.container-index {
  display: grid;
  grid-template-columns: 10% auto ;
  grid-template-rows: auto;
  grid-template-areas:
    "name menu"
    "name img01"
    "name txt"
    "name img02"
    "name footer"
    "name footer02"
    "name footer03";
  grid-gap: 25px 2%;
  background-color: rgba(0, 0, 0, 0);
  justify-content: center;
  padding-right: 50px;
}

.container-index > div {
  background-color: rgba(255, 255, 255, 1);
  text-align: center;
  padding: 0px 0;
  font-size: 30px;
  position:relative;
  max-width: 900px;
}

/*motion*/

.container-motion {
  display: grid;
  grid-template-columns: 10% auto ;
  grid-template-rows: auto;
  grid-template-areas:
    "name menu"
    "name img"
    "name titre"
    "name img2"
    "name titre2"
    "name img3"
    "name titre3"
    "name img4"
    "name titre4"
    "name img5"
    "name titre5"
    "name img6"
    "name titre6"
    "name img7"
    "name titre7"
    "name img8"
    "name titre8"
    "name img9"
    "name titre9"
    "name img10"
    "name titre10"
    "name img11"
    "name titre11"
    "name img12"
    "name titre12"
    "name img13"
    "name titre13"
    "name img14"
    "name titre14"
    "name img15"
    "name titre15"
    "name info"
    "name footer";
  grid-gap: 25px 2%;
  background-color: rgba(0, 0, 0, 0);
  justify-content: center;
  padding-right: 50px;
}

.container-motion > div {
  background-color: rgba(255, 255, 255, 1);
  text-align: center;
  padding: 0px 0;
  font-size: 30px;
  position:relative;
  max-width: 900px;
}

/*print*/

.container-print {
  display: grid;
  grid-template-columns: 10% auto ;
  grid-template-rows: auto;
  grid-template-areas:
    "name menu"
    "name img"
    "name titre"
    "name img2"
    "name titre2"
    "name img3"
    "name titre3"
    "name img4"
    "name titre4"
    "name img5"
    "name titre5"
    "name img6"
    "name titre6"
    "name img7"
    "name titre7"
    "name img8"
    "name titre8"
    "name img9"
    "name titre9"
    "name img10"
    "name titre10"
    "name img11"
    "name titre11"
    "name img12"
    "name titre12"
    "name img13"
    "name titre13"
    "name img14"
    "name titre14"
    "name img15"
    "name titre15"
    "name info"
    "name footer";
  grid-gap: 25px 2%;
  background-color: rgba(0, 0, 0, 0);
  justify-content: center;
  padding-right: 50px;
}

.container-print > div {
  background-color: rgba(255, 255, 255, 1);
  text-align: center;
  padding: 0px 0;
  font-size: 30px;
  position:relative;
  max-width: 900px;
}

/*archives*/

.container-archives {
  display: grid;
  grid-template-columns: 10% auto ;
  grid-template-rows: auto;
  grid-template-areas:
    "name menu"
    "name img"
    "name titre"
    "name img2"
    "name titre2"
    "name img3"
    "name titre3"
    "name img4"
    "name titre4"
    "name img5"
    "name titre5"
    "name img6"
    "name titre6"
    "name info"
    "name footer";
  grid-gap: 25px 2%;
  background-color: rgba(0, 0, 0, 0);
  justify-content: center;
  padding-right: 50px;
}

.container-archives > div {
  background-color: rgba(255, 255, 255, 1);
  text-align: center;
  padding: 0px 0;
  font-size: 30px;
  position:relative;
  max-width: 900px;
}

/*content*/

.container-content {
  display: grid;
  grid-template-columns: 10% auto ;
  grid-template-rows: auto;
  grid-template-areas:
    "name menu"
    "name titre1"
    "name img01"
    "name txt"
    "name link"
    "name img02"
    "name ligne02"
    "name img03"
    "name ligne03"
    "name img04"
    "name ligne04"
    "name img05"
    "name ligne05"
    "name img06"
    "name ligne06"
    "name img07"
    "name ligne07"
    "name img08"
    "name ligne08"
    "name img09"
    "name ligne09"
    "name img010"
    "name ligne010"
    "name img011"
    "name ligne011"
    "name img012"
    "name ligne012"
    "name img013"
    "name ligne013"
    "name img014"
    "name ligne014"
    "name img015"
    "name ligne015"
    "name img016"
    "name ligne016"
    "name img017"
    "name ligne017"
    "name img018"
    "name ligne018"
    "name img019"
    "name ligne019"
    "name img020"
    "name ligne020"
    "name top1";
  grid-gap: 25px 2%;
  background-color: rgba(0, 0, 0, 0);
  justify-content: center;
  padding-right: 50px;
}

.container-content > div {
  background-color: rgba(255, 255, 255, 1);
  text-align: center;
  padding: 0px 0;
  font-size: 30px;
  position:relative;
  max-width: 900px;
}

/*about*/

.container-about {
  display: grid;
  grid-template-columns: 10% auto ;
  grid-template-rows: auto;
  grid-template-areas:
    "name menu"
    "name titre-about"
    "name contact"
    "name img01"
    "name about"
    "name img02"
    "name ligne02"
    "name info"
    "name footer";
  grid-gap: 25px 2%;
  background-color: rgba(0, 0, 0, 0);
  justify-content: center;
  padding-right: 50px;
}

.container-about > div {
  background-color: rgba(255, 255, 255, 1);
  text-align: center;
  padding: 0px 0;
  font-size: 30px;
  position:relative;
  max-width: 900px;
}

/*Grid-area*/

/*class div lignes horizontales*/

.ligne01 {
	grid-area: ligne01;
	border-bottom: 2px solid #000;
	max-width: 1000px;
}

.ligne02 {
	grid-area: ligne02;
	border-bottom: 2px solid #000;
	max-width: 1000px;
}

.ligne03 {
	grid-area: ligne03;
	border-bottom: 1px solid #000;
	max-width: 1000px;
}

.ligne04 {
	grid-area: ligne04;
	border-bottom: 1px solid #000;
	max-width: 1000px;
}

.ligne05 {
	grid-area: ligne05;
	border-bottom: 1px solid #000;
	max-width: 1000px;
}

.ligne06 {
	grid-area: ligne06;
	border-bottom: 1px solid #000;
	max-width: 1000px;
}

.ligne07 {
	grid-area: ligne07;
	border-bottom: 1px solid #000;
	max-width: 1000px;
}

.ligne08 {
	grid-area: ligne08;
	border-bottom: 1px solid #000;
	max-width: 1000px;
}

.ligne09 {
	grid-area: ligne09;
	border-bottom: 1px solid #000;
	max-width: 1000px;
}

.ligne010 {
	grid-area: ligne010;
	border-bottom: 1px solid #000;
	max-width: 1000px;
}

.ligne011 {
  grid-area: ligne011;
  border-bottom: 1px solid #000;
  max-width: 1000px;
}

.ligne012 {
  grid-area: ligne012;
  border-bottom: 1px solid #000;
  max-width: 1000px;
}

.ligne013 {
  grid-area: ligne013;
  border-bottom: 1px solid #000;
  max-width: 1000px;
}

.ligne014 {
  grid-area: ligne014;
  border-bottom: 1px solid #000;
  max-width: 1000px;
}

.ligne015 {
  grid-area: ligne015;
  border-bottom: 1px solid #000;
  max-width: 1000px;
}

.ligne016 {
  grid-area: ligne016;
  border-bottom: 1px solid #000;
  max-width: 1000px;
}

.ligne017 {
  grid-area: ligne017;
  border-bottom: 1px solid #000;
  max-width: 1000px;
}

.ligne018 {
  grid-area: ligne018;
  border-bottom: 1px solid #000;
  max-width: 1000px;
}

/*class div nom Hugo Perez-Sappia*/

.item-h {
  grid-area: name;
  width:50%;
 

}

.item-h li {
	display: inline-block;
}


.item-h ul {
	margin-bottom: 25px;
	border-bottom: 1px solid #000;
}

/*class div menu général*/

.item-m {
  grid-area: menu;
  border-bottom: 1px solid #000;
  height: 25px;
  margin-top: 20px;
}

.item-m li {
	display: inline-block;
	float: right;
	text-align: right;
}

/*class div titre*/

.item-b {
  grid-area: titre;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
  }


.item-b:hover {
  background-color: #000;
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-b:hover a {
  color: #fff;
}

.item-b1 {
  grid-area: titre1;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}


.item-b2 {
  grid-area: titre2;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b2:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b2:hover a {
  color: #fff;
}


.item-b3 {
  grid-area: titre3;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b3:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b3:hover a {
  color: #fff;
}


.item-b4 {
  grid-area: titre4;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b4:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b4:hover a {
  color: #fff;
}

.item-b5 {
  grid-area: titre5;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b5:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b5:hover a {
  color: #fff;
}


.item-b6 {
  grid-area: titre6;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b6:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b6:hover a {
  color: #fff;
}


.item-b7 {
  grid-area: titre7;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b7:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b7:hover a {
  color: #fff;
}


.item-b8 {
  grid-area: titre8;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b8:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b8:hover a {
  color: #fff;
}

.item-b9 {
  grid-area: titre9;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b9:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b9:hover a {
  color: #fff;
}


.item-b10 {
  grid-area: titre10;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b10:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b10:hover a {
  color: #fff;
}


.item-b11 {
  grid-area: titre11;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b11:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b11:hover a {
  color: #fff;
}


.item-b12 {
  grid-area: titre12;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b12:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b12:hover a {
  color: #fff;
}


.item-b13 {
  grid-area: titre13;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b13:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b13:hover a {
  color: #fff;
}


.item-b14 {
  grid-area: titre14;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b14:hover {;
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b14:hover a {
  color: #fff;
}


.item-b15 {
  grid-area: titre15;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b15:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b15:hover a {
  color: #fff;
}

.item-b16 {
  grid-area: titre16;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b16:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b16:hover a {
  color: #fff;
}

.item-b17 {
  grid-area: titre17;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b17:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b17:hover a {
  color: #fff;
}

.item-b18 {
  grid-area: titre18;
  color: #000;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  margin-bottom: 20px;
}

.item-b18:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-b18:hover a {
  color: #fff;
}

/*class div texte de description*/

.item-txt {
  grid-area: txt;
  color: #000;
  display: block;
  width: 100%; 
  height: 100%;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000; 
}

/*class div texte about*/

.item-about1 {
  grid-area: titre-about;
  color: #000;
  border-top: 1px solid #000;
  border-bottom: 0px solid #000;
  margin-bottom: -30px;
}

.item-about2 {
  grid-area: about;
  color: #000;
  display: block;
  width: 100%; 
  height: 100%;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000; 
}

.item-contact {
  grid-area: contact;
  color: #000;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
}

.item-contact:hover {
  color: #fff;
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05); 
}

.item-contact:hover a {
  color: #fff;
}

/*class div images homepage*/

.item-c {
  grid-area: img; 
}

.item-c:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c2 {
  grid-area: img2; 
}

.item-c2:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c3 {
  grid-area: img3; 
}

.item-c3:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c4 {
  grid-area: img4; 
}

.item-c4:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c5 {
  grid-area: img5; 
}

.item-c5:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c6 {
  grid-area: img6; 
}

.item-c6:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c7 {
  grid-area: img7; 
}

.item-c7:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c8 {
  grid-area: img8; 
}

.item-c8:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c9 {
  grid-area: img9; 
}

.item-c9:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c10 {
  grid-area: img10; 
}

.item-c10:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c11 {
  grid-area: img11; 
}

.item-c11:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c12 {
  grid-area: img12; 
}

.item-c12:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c13 {
  grid-area: img13; 
}

.item-c13:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c14 {
  grid-area: img14; 
}

.item-c14:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c15 {
  grid-area: img15; 
}

.item-c15:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c16 {
  grid-area: img16; 
}

.item-c16:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c17 {
  grid-area: img17; 
}

.item-c17:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

.item-c18 {
  grid-area: img18; 
}

.item-c18:hover {
  transform: scale(1.02); 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);
}

/*class div liens externes projet*/

.item-link {
  grid-area: link;
  border-bottom: 1px solid #000;
  height: 25px;
}

.item-link li {
	display: inline-block;
	float: left;
	text-align: left;
	margin-left: 4%;
  margin-right: 4%;
}

/*class div images*/

.item-c01 {
  grid-area: img01;
}

.item-c02 {
  grid-area: img02; 
}

.item-c03 {
  grid-area: img03; 
}

.item-c04 {
  grid-area: img04; 
}

.item-c05 {
  grid-area: img05; 
}

.item-c06 {
  grid-area: img06; 
}

.item-c07 {
  grid-area: img07; 
}

.item-c08 {
  grid-area: img08; 
}

.item-c09 {
  grid-area: img09; 
}

.item-c010 {
  grid-area: img010; 
}

.item-c011 {
  grid-area: img011; 
}

.item-c012 {
  grid-area: img012; 
}

.item-c013 {
  grid-area: img013; 
}

.item-c014 {
  grid-area: img014; 
}

.item-c015 {
  grid-area: img015; 
}

.item-c016 {
  grid-area: img016; 
}

.item-c017 {
  grid-area: img017; 
}

.item-c018 {
  grid-area: img018; 
}

/*class div reserve*/

.item-d {
  grid-area: info;
}

.item-e {
  grid-area: footer;
  color: #000;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
}

.item-e:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-e:hover a {
  color: #fff;
}

.item-e2 {
  grid-area: footer02;
  color: #000;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
}

.item-e2:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-e2:hover a {
  color: #fff;
}
.item-e3 {
  grid-area: footer03;
  color: #000;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
}

.item-e3:hover {
  background-color: #000; 
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);  
}

.item-e3:hover a {
  color: #fff;
}



/*class div video*/

.vid {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}

.vid iframe,
.vid object,
.vid embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*class image*/

.img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  
}

/*class text*/

.text-vertical {
	font-size:80%;
	text-align:right;
	position:relative;
	 /*FIRST you have to position it from the top right*/
    position:absolute;
    top:0;
    right:0;
    /*Give hime a fixed height and width*/
    height:50px;
    width:1610px;
    /*Rotation origin to top right*/  
    transform-origin: calc(100% - 20px) 20px 0;
    -webkit-transform-origin : calc(100% - 20px) 20px 0;
	-moz-transform-origin : calc(100% - 20px) 20px 0;
	-ms-transform-origin : calc(100% - 20px) 20px 0;
	-o-transform-origin : calc(100% - 20px) 20px 0;*/
    /*rotation*/
	transform:rotate(-90deg);
    -ms-transform:rotate(-90deg); /* Internet Explorer */
    -moz-transform:rotate(-90deg); /* Firefox */
    -webkit-transform:rotate(-90deg); /* Safari et Chrome */
    -o-transform:rotate(-90deg); /* Opera */
}

  
.a {
	text-decoration: none;
	list-style-type: none;
	color: #000;
	font-family: 'dinproregular';
	letter-spacing: .05rem;
	font-size:60%;
	min-width: 300px;	
}

a:link { 
     text-decoration:none;
     list-style-type: none;
     color: #000;
}

mark {
  background-color: #F5F5F5;
  color: black;
}

.h1 {
  text-decoration: none;
	list-style-type: none;
	font-weight: normal;  
	font-size:100%;
	margin-right: 1.5em;  
	margin-left: 1.5em;
  margin-top: 7px;
	position:relative;
}

.h2 {
  text-decoration: none;
  list-style-type: none;
  font-weight: normal;
  font-family: 'dinproregular';
  letter-spacing: .05rem;  
  font-size: 50%;
  margin-bottom: 0.9em;
  text-align: justify;
  position:relative;
}

.a-o {
  color: #000;
  padding: 6px;
  display: inline-block;
  font-family: 'ExquiseFYRegular';
  font-size:100%;
  text-align:right;
  position:relative;
  letter-spacing:.05rem;
}

.a-n {
	color: #fff;
	padding: 6px;
	display: inline-block;
	font-family: 'ExquiseFYRegular';
	font-size:100%;
	text-align:right;
	position:relative;
	letter-spacing:.05rem;
}

.a-m {
	text-decoration: none;
	list-style-type: none;
	font-family: 'dinproregular';
	letter-spacing: .05rem;
  margin-left: 0px;
  margin-right: 0px;
	font-size:45%;
}

.a-l {
	text-decoration: none;
	list-style-type: none;
  margin: -6px;
	font-family: 'dinproregular';
	letter-spacing: .05rem;
	font-size:60%;
}

.p-t {
	text-decoration: none;
	list-style-type: none;
	font-family: 'dinproregular';
	letter-spacing: .05rem;
	font-size:60%;
	text-align: left;
	min-width: 300px;
	position:relative;
  float:left;
  margin-top: 16px;
}

.p {
  color: #000;
  font-family: 'ExquiseFYRegular';
  text-align:left;
  position:relative;
  font-size:60%;
  letter-spacing:.1rem;
}

.nom a {
    color: #fff;
    background-color: #000;
    position:relative;
}

.nom:hover a {
    background-color: #000;
    color: #fff;
}

.nom-index a {
    color: #000;
    background-color: #fff;
    position:relative;
}

.nom-index:hover a {
    background-color: #fff;
    color: #000;
}

.network a {
    color: #000;
    padding-left: 24px;
    padding-right: 24px;
    padding-bottom: 10px;
    padding-top: 21px;
}

.network:hover a {
    background-color: #000;
    color: #fff;
    padding-left: 24px;
    padding-right: 24px;
    padding-bottom: 10px;
    padding-top: 21px;
}

.menu a {
    color: #000;
    padding-right: 24px;
    padding-left: 24px;
    padding-bottom: 10px;
    padding-top: 21px;
}

.menu:hover a {
    background-color: #000;
    color: #fff;
    padding-right: 24px;
    padding-left: 24px;
    padding-bottom: 10px;
    padding-top: 21px;
}

.flexFont {
	font-size: 0.6em;
    font-family: 'ExquiseFYRegular';
    text-align:left;
    margin-left: 5%;
    margin-right: 5%;
    margin-top: 2%;
}

.flexFont a {
    color: #000;
}

.flexFont:hover a {
    color: #fff;   
}

.flexFontCenter {
    font-size: 1.5em;
    font-family: 'ExquiseFYRegular';
    text-align:center;
    margin-left: 5%;
    margin-right: 5%;
    margin-top: 2%;
    margin-bottom: 2%;
}

.flexFontCenter a {
    color: #000;
}

.flexFontCenter:hover a {
    color: #fff;   
}

.smaller {
    font-size: 0.5em;
    text-align:left;
    font-family: 'dinproregular';
    line-height: 1.5em;
    height:5em;
    margin-top: 1%;
}

.txt {
    font-size: 0.5em;
    text-align:justify;
    font-family: 'dinproregular';
    line-height: 1.5em;
    height:auto;
    min-height:100%;
    margin-top: 1%;
    margin-bottom: 2%;
}