body
{
   color: #333333;
   background: #93c9e3 url('Herbe.jpg') repeat fixed top center;
   font-size: 18px;
   font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif;
}

.interieur
{
   background: #76F164 url('Fond.png') repeat-x scroll top left;
   border: solid 1px #dddddd;
   padding: 20px 20px;
   margin: 3% 5%;
   border-radius: 6px;
   min-width: 300px;
}

.interieur2
{
   background: #76F164;
   border: solid 1px #dddddd;
   padding: 20px 20px;
   margin: 3% 5%;
   border-radius: 6px;
   min-width: 300px;
}

.Txt01
{
   font-family: 'Comfortaa', cursive;
   font-size: 19px;
   color: black;
   text-shadow : 1px 1px 1px lightgrey;
}

.Txt02
{
   font-family: 'Comfortaa';
   font-size: 24px;
   line-height: 28px;
   color: #008000;
}

.Txt03
{
   font-family: 'Comfortaa';
   font-size: 14px;
   line-height: 18px;
   color: #008000;
}

.Txt04
{
   font-family: 'Comfortaa';
   font-size: 17px;
   line-height: 20px;
   color: darkgreen;
}

.Txt05
{
   font-family: 'Comfortaa';
   font-size: 20px;
   line-height: 28px;
   color: black;
   text-shadow: 1px 1px 1px white;
}

.Txt06
{
   font-family: 'Comfortaa';
   font-size: 16px;
   line-height: 18px;
   color: black;
}

.Txt07
{
   font-family: 'Comfortaa';
   font-size: 15px;
   line-height: 18px;
   color: blue;
   text-shadow: 1px 1px 2px darkorange;
}

.Lien01
{
   font-family: 'Comfortaa';
   font-size: 16px;
   color: #0000DD;
}

.Lien01:hover
{
   -webkit-animation: Anim03 0.4s infinite;
   -webkit-animation: Anim03 0.4s infinite;
   -moz-animation: Anim03 0.4s infinite;
   -ms-animation: Anim03 0.4s infinite;
   animation: Anim03 0.4s infinite;
}

.B01
{
   display: inline-block;
   width: 172px;
}

.B02
{
   display: inline-block;
   width: 171px;
   height: 58px;
   line-height: 58px;
   text-align: center;
   vertical-align: bottom;
   background-image: url(Bouton.png);
   font-family: 'Comfortaa';
   font-size: 24px;
   color: white;
   text-shadow : 2px 2px 4px black;
   letter-spacing: 0.05em;
}

.B02:hover
{
   color: yellow;
   letter-spacing: 0.01em;
}

.D01
{
   margin: auto;
   display: inline-block;
   width: 85%;
   min-height: 38px;
   line-height: 24px;
   vertical-align: middle;
}

.D02
{
   display: inline-block;
   width: 85%;
   min-height: 38px;
   line-height: 38px;
   vertical-align: middle;
   text-align: left;
}

.D03
{
   display: inline-block;
   width: 14%;
   min-height: 38px;
   line-height: 24px;
   vertical-align: middle;
}

.D04
{
  border-radius: 10px;
  background-image: radial-gradient(circle at center, gold, darkorange);
  width: 290px;
  margin: auto;
  text-align: center;
  border-top: 1px solid #00B0F0;
  border-right: 4px solid #00B0F0;
  border-bottom: 4px solid #00B0F0;
  border-left: 1px solid #00B0F0;
  padding: 10px;
}

.D05
{
  border-radius: 10px;
  background-image: radial-gradient(circle at center, gold, darkorange);
  width: 570px;
  margin: auto;
  text-align: center;
  border-top: 1px solid #00B0F0;
  border-right: 4px solid #00B0F0;
  border-bottom: 4px solid #00B0F0;
  border-left: 1px solid #00B0F0;
  padding: 10px;
}

.D06
{
   margin: auto;
   display: inline-block;
   width: 85%;
}

.D07
{
   display: inline-block;
   width: 49%;
}

.D08
{
   margin: auto;
   width: 85%;
   border-top: 1px solid grey;
   border-right: 3px solid black;
   border-bottom: 3px solid black;;
   border-left: 1px solid grey;
   border-radius: 20px;
   text-align: left;
   padding: 20px;
}

.D09
{
   display:block;
   float:left;
   width: 85px;
   height: 27px;
   text-align: left;
   padding-top: 8px;
   padding-left: 15px;
   color: white;
   font-weight: bold;
   text-shadow: 0px -1px 0px rgba(0,0,0,0.2);
   -webkit-border-radius: 5px 0px 0px 5px;
   -moz-border-radius: 5px 0px 0px 5px;
   border-radius: 5px 0px 0px 5px;
   background: #09c;
   background: -moz-linear-gradient(top,#51c3fa,#09c);
   background: -webkit-gradient(linear,left top,left bottom,from(#51c3fa),to(#09c));
   -webkit-box-shadow: 0px 1px 1px rgba(0,0,0,1) inset;
   -moz-box-shadow: 0px 1px 1px rgba(0,0,0,1) inset;
   box-shadow: 0px 1px 1px rgba(0,0,0,1) inset;
}

.D10
{
   display:block;
   float:left;
   width: 460px;
   height: 30px;
   text-align: left;
   padding-top: 4px;
   padding-left: 10px;
   color: #cecece;
   font-weight: bold;
   border: none;
   text-shadow: 0px 1px 0px #000;
   background: #1f2026;
   -webkit-border-radius: 0px 5px 5px 0px;
   -moz-border-radius: 0px 5px 5px 0px;
   border-radius: 0px 5px 5px 0px;
   -webkit-box-shadow: 0px 1px 1px #000 inset;
   -moz-box-shadow: 0px 1px 1px #000 inset;
   box-shadow: 0px 1px 1px #000 inset;
}

.D11
{
   display:block;
   float:left;
   width: 455px;
   height: 180px;
   text-align: left;
   padding-top: 4px;
   padding-left: 10px;
   color: #cecece;
   font-weight: bold;
   border: none;
   text-shadow: 0px 1px 0px #000;
   background: #1f2026;
   -webkit-border-radius: 0px 5px 5px 0px;
   -moz-border-radius: 0px 5px 5px 0px;
   border-radius: 0px 5px 5px 0px;
   -webkit-box-shadow: 0px 1px 1px #000 inset;
   -moz-box-shadow: 0px 1px 1px #000 inset;
   box-shadow: 0px 1px 1px #000 inset;
}

.D12
{
   width: 95px;
   height: 30px;
   font-size: 1em;
   font-weight: bold;
   border: none;
   color: #cecece;
   text-shadow: 0px -1px 0px #000;
   background: #1f2026;
   background: -moz-linear-gradient(top,#1f2026,#15161a);
   background: -webkit-gradient(linear,left top,left bottom,from(#1f2026),to(#15161a));
   -webkit-border-radius :5px;
   -moz-border-radius :5px;
   border-radius :5px;
   -webkit-box-shadow: 0px 0px 1px #000;
   -moz-box-shadow: 0px 0px 1px #000;
   box-shadow: 0px 0px 1px #000;
}

.D12:hover
{
   background: #343640;
   background: -moz-linear-gradient(top,#343640,#B3B5C1);
   background: -webkit-gradient(linear,left top,left bottom,from(#343640),to(#B3B5C1));
}


.Img01
{
   -webkit-animation: Anim01 0.5s ease-in-out 0ms infinite;
   -webkit-animation: Anim01 0.5s ease-in-out 0ms infinite;
   -moz-animation: Anim01 0.5s ease-in-out 0ms infinite;
   -ms-animation: Anim01 0.5s ease-in-out 0ms infinite;
   animation: Anim01 0.5s ease-in-out 0ms infinite;
}

.Img02
{
   -webkit-animation: Anim02 1.3s ease-in-out 0ms infinite;
   -webkit-animation: Anim02 1.3s ease-in-out 0ms infinite;
   -moz-animation: Anim02 1.3s ease-in-out 0ms infinite;
   -ms-animation: Anim02 1.3s ease-in-out 0ms infinite;
   animation: Anim02 1.3s ease-in-out 0ms infinite;
}

.Img03
{
   border-top: 1px solid black;
   border-right: 3px solid black;
   border-bottom: 3px solid black;
   border-left: 1px solid black;
   border-radius: 8px;
}


.st01_text
{
   font-family: Tahoma;
   font-size: 24px;
   line-height: 28px;
   color: #008000;
}

.st02_text
{
   font-family: Tahoma;
   font-size: 14px;
   line-height: 18px;
   color: #008000;
}

.st03_text
{
   font-family: Tahoma;
   font-size: 20px;
   line-height: 24px;
   color: #000050;
}

.st04_text
{
   font-family: Tahoma;
   font-size: 18px;
   line-height: 22px;
   color: #008000;
}

.st05_text
{
   font-family: Arial;
   font-size: 20px;
   color: #FFFFFF;
   text-align: center;
   text-shadow : 1px 1px 1px #555555;
}

.st06_text
{
   font-family: Arial;
   font-size: 20px;
   color: #008000;
   font-weight: bold;
   text-align: center;
}

.st07_text
{
   font-family: Arial;
   font-size: 22px;
   color: #FFFFFF;
   text-align: center;
   text-shadow : 2px 2px 2px #000000;
}

@-webkit-keyframes Anim01
{
   50% { -webkit-transform:  skew(4deg, 4deg) translate(-6px,0px); }
}

@-moz-keyframes Anim01
{
   50% { -moz-transform:  skew(4deg, 4deg) translate(-6px,0px); }
}

@-o-keyframes Anim01
{
   50% { -o-transform:  skew(4deg, 4deg) translate(-6px,0px); }
}

@-ms-keyframes Anim01
{
   50% { -ms-transform:  skew(4deg, 4deg) translate(-6px,0px); }
}

@keyframes Anim01
{
   50% { transform:  skew(4deg, 4deg); }
}



@-webkit-keyframes Anim02
{
   50% { -webkit-transform:  skew(1deg, 1deg) translate(-6px,0px); }
}

@-moz-keyframes Anim02
{
   50% { -moz-transform:  skew(1deg, 1deg) translate(-6px,0px); }
}

@-o-keyframes Anim02
{
   50% { -o-transform:  skew(1deg, 1deg) translate(-6px,0px); }
}

@-ms-keyframes Anim02
{
   50% { -ms-transform:  skew(1deg, 1deg) translate(-6px,0px); }
}

@keyframes Anim02
{
   50% { transform:  skew(1deg, 1deg) translate(-10px,0px); }
}



@-webkit-keyframes Anim03
{
   50% { color: #BD8A2C }
}

@-moz-keyframes Anim03
{
   50% { color: #BD8A2C }
}

@-o-keyframes Anim03
{
   50% { color: #BD8A2C }
}

@-ms-keyframes Anim03
{
   50% { color: #BD8A2C }
}

@keyframes Anim03
{
   50% { color: deepskyblue }
}



