/* CSS Document */
/* Pages-civsm */
h1 {              
 font-size : 200%; 
 font-family : VERDANA;
 font-weight: bold;
 color : #3333FF ;
 text-align : center;
 }
h2 {
 font-size: 150%; 
 font-family : GENEVA;
 font-weight: bold;
 font-style: italic;
 color: #3333FF; 
 text-align : center;
 padding-left: 15px;
 }

 div.shadow{ 
   text-shadow: 7px 7px 1px #F5F6CE 0.86;
}

p,ul,li,td {
 color: #3333FF;

 }
table, th, td,tr {
            border-width : 1px; 
            border-style:  solid ;
            border-color : #ffffff;
          <!--  width:80%;    -->
          <!--  border-collapse: collapse;-->
 }
 #cadre {
    margin: auto; 
    width: 80%; 
    padding: 5px; 
    background-color: #FCFBDC; 
  /*  border: 2px solid #3333FF;  */
    border-width : 2px; 
    border-style:  solid ;
    border-color : #3333FF;
    border-radius: 10px;
    text-align: center;
    line-height:normal;
   font-family:Arial,Geneva,sans-serif;
   font-style:normal ;
   font  size=3;
   font-weight: bold;
 } 
 
 #cadre2 {
    margin: auto; 
    width: 80%; 
    padding: 5px; 
    background-color: #FFFFFF; 
  /*  border: 2px solid #3333FF;  */
    border-width : 2px; 
    border-style:  solid ;
    border-color : #FFFFFF;
    border-radius: 10px;
    text-align: center;
    line-height:normal;
   font-family:Arial,Geneva,sans-serif;
   font-style:normal ;
   font  size=3;
   font-weight: bold;
 }  

 #texte-cadre {
 font-family : comics sans ms;
 font-weight: bold;
 font-style: italic;
 color: #3333FF;
 text-align:center;
 }
 
 #titre-activite {
 font-family : comics sans ms;
 font-size : 120%;
text-align:center;  
color:#3333FF; 
font-weight:bold; 
 }
 
 #sous-titre-activite{
 font-size : 15;
 text-align : center;
 font-weight : bold;
 color : #339966;
 font-family : comic sans ms;
 }
 
 #activite{
 font-family : arial black;
 font-size : 15px;
 font-style: italic;
 text-align : left;
 text-decoration: underline;
 font-weight : bold;
 color : #800000;
 }
 
#liste-activite{
 font-family : arial ;
 font-size : 12px;
 text-indent :50px;
 text-align : left;
 text-decoration: none;
 font-weight : bold;
 color : #800080;
} 
 
 
 #deroulant{
     
      font-size:20px; 
      color:red; 
      font-family:Verdana;
      font-weight: bold;
 }   
 div.bouton{
   display:inline-block;
   line-height:60%;
   vertical-align:middle;    
   margin: auto;  
    width: 100px; 
    height : 25px;  
    padding: 0px; 
    background-color: #FCFBDC; 
  /*  border: 2px solid #3333FF;  */
    border-width : 1px; 
    border-style:  solid ;
    border-color : #3333FF;
    border-radius: 10px;
    text-align: center;
   /* line-height:normal;  */
   font-family:Arial,Geneva,sans-serif;
   font-style:normal ;
   font  size=2;
   font-weight: bold;
 }     
 
 div.anim-color {
    color: red;
    -webkit-animation-name: example; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 4s; /* Chrome, Safari, Opera */
    animation-name: example;
    animation-duration: 4s;
     animation-iteration-count : infinite;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes example {
    0%   {color: red;}
    25%  {color: yellow;}
    50%  {color: blue;}
    100% {color: green;}
}

/* Standard syntax */
@keyframes example {
    0%   {color: red;}
    25%  {color: yellow;}
    50%  {color: blue;}
    100% {color: green;}
}

div.box2 {
  display: inline-block;
  width: 100%;
  height: 100%;
  vertical-align:middle;
  position: relative;
  margin: 1em;
  text-align: center
}
div.page{
    background-color :#F5F9DA; 
}