@font-face {
  font-family: "Linux Biolinum O";
  font-style: normal;
  font-weight: normal;
  src: url("police/LinBiolinum_R.otf") format("opentype");
}
@font-face {
  font-family: "Linux Biolinum O";
  font-style: normal;
  font-weight: bold;
  src: url("police/LinBiolinum_RB.otf") format("opentype");
}
@font-face {
  font-family: "Linux Biolinum O";
  font-style: italic;
  font-weight: normal;
  src: url("police/LinBiolinum_RI.otf") format("opentype");
}
@font-face{
  font-family: "BaifB";
  src: url("../baif/police/Baifb.ttf") format("truetype");
}  

@keyframes fadeInAnimation {
  0% {
    opacity: 0;
  }
  10%{
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* Reset CSS */
*{
  margin: 0px;
  padding: 0px;
}

p {padding-bottom:20px}

body{
  max-width:1600px;
  background-color: #a29c84;
  /*background-image: url("virgfond.jpg")}*/
}

#fond {
  width:100%;
  position:absolute;
  top:0px;
  left:0px;
  height:2701px;
  animation: fadeInAnimation ease 6s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  background-image: url(virgfond.jpg);
}  


#contenu {
  position:absolute;
  max-width:1000px;
  top:200px;
  left: 10%;
  width: 80%;
  margin: 0px;
  background-color:rgba(255, 255, 255,.8);
  border-radius:10px;
  padding-top:20px;
  margin-top:20px;
  text-align:justify; padding-right:4%; padding-left:4%; font-family:"Linux Biolinum O", Arial, sans-serif; font-size:12pt;
}


nav ul {
 list-style-type: none;
 font-size: 100%;
}

nav ul::after{
  content:"";
  display:table;
  clear:both;
  border-collapse:collapse;
}  

nav li {
  border: 1px solid #efefef;
  
  background-color: rgba(195, 195, 195, .6);
  float: left;
  text-align: center;
  width:30%;
  height:23px;
  vertical-align:middle;
}  

nav li:hover {
    
    background-color: rgba(255, 255, 255, .8);
  }

nav a{
  display: block;
}  

#virga {
  width:350px;  
}


#champ_recherche {
  width: 400px;
  height: 21px;
  border: 1px solid #574c4c;
  border-radius:6px
}

#menu_recherche_valider{
	width:180px;
	height:28px;
	font-size: 14px;
	font-weight: bold;
	/*background-image: url(images/recherche.gif);*/
	background: linear-gradient(to right, #574c4c, #ffffff);
	color: #574c4c;
	border: 1px solid #574c4c;
     border-radius:6px;
}
#menu_recherche_valider:hover {
    font-size: 15px;
    background: linear-gradient(to right, #ffffff, #574c4c);
}

/*
P, UL, OL, DT, DL, TD { text-align:justify; margin-right:4%; margin-left:4%; font-family:"Linux Biolinum O", Arial, sans-serif; font-size:12pt;}
*/



H1 { margin-left:4%; font-family:"Linux Biolinum O", Arial, sans-serif; font-size:44pt; }
H2 { margin-left:4%; font-family:"Linux Biolinum O", Arial, sans-serif; font-size:28pt; }
H3 { margin-left:4%; font-family:"Linux Biolinum O", Arial, sans-serif; font-size:18pt; }
H4 { margin-left:4%; font-family:"Linux Biolinum O", Arial, sans-serif; font-size:16pt; }
SUP {font-size:8pt; }

A:link, A:active {color:#76310c; text-decoration:none}
A:visited {color:#76310c; text-decoration:none}
/*
A:hover {color:#76310c; text-decoration:none}
*/
.nret {text-indent:0pt; }
.drt {text-align:right; }
.cen {text-align:center;}
.grd {font-size:150%;}
.cenmoy {text-align:center; font-size:15pt;margin-top:40px}
.moy {font-size:120%;}
.pt {font-size:80%;}
.nmrg {margin-left:0%; text-indent:0pt;}
.baif{font-family:Baifb; font-size:85%;}
.sansbord{border:0px solid black;}
.sc{font-variant:small-caps;}

@media screen and (max-width: 1024px) {
   
  #contenu {
    position:absolute;
    top:200px;
    left: 10%;
    width: 70%;
    margin: 0px;
    background-color:rgba(255, 255, 255,.8);
    border-radius:10px;
    padding-top:20px;
    margin-top:20px;
    text-align:left;
    padding-right:4%;
    padding-left:4%;
    font-family:"Linux Biolinum O", Arial, sans-serif;
    font-size:14pt;
  }
  
    
  #fond {
    width:100%;
    position:absolute;
    top:0px;
    left:0px;
    height:6600px;
    animation: fadeInAnimation ease 6s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    background-image: url(virgfondlong.jpg);  
  }
  
  
  nav ul {
    
    list-style:none;
    
  }  
  
  
  
  nav li:hover {
    
    background-color: rgba(255, 255, 255, .8);
  }
  
  
  nav li {
    float:none;
    border: 0px;
    background-color: rgba(195, 195, 195, .6);
    text-align: left;
    padding-left:10px;
    width:90%;
  }
  
  #virga {
    width: 250px;
    border:0px;
  }  
}

@media screen and (max-width: 430px) {
 a {font-size:66%}
}