/*--------------------------------------
      author: webmaster@cmpp.ch
      date: 28.03.2025
      version: 1.1
------------------------------------------ */
body{
 color: white; 
 background-color: #ffcc99; 
 background-image: url(http://www.cmpp.ch/007.jpg);
font-family: Arial, sans-serif;
  font-size: 16px;
  margin:  40px;
  overflow: scroll;
  }
/*------------------------------
typography
---------------------------*/
h1{
text-align:center;
}
article h2{
font-size:10px;
padding:0;
margin:0;
}
/*------------------------
classes
------------------------*/
   header{
      padding:0;
        margin:0;
        letter-spacing: 4px;
      }

hr{

 height: 4px; 
width: 100%;
background-color: #F04242;
border:0;
margin: 20px 0;
      }
main{
text-align:center;
max-width:100%;
}
main table{
text-align:center;
  padding: 40px 0 20px 0;
width:600px;
 display:flex;
        flex-direction:column;
        flex-wrap:nowrap;
        justify-content:center;
        align-items:center;
         margin-left: auto;
    margin-right: auto;
      flex:  0 1 auto;
max-width:100%;
}
 
a{
font-family: Arial, sans-serif; 
font-size: 16px; 
 font-weight: bold; 
color: #00FFFF;
}
 th{
  background-color: #FFB96A;
 border:1px solid #FFBE7D;
      font-size: 26px;
color: #000066;
      text-align: center;
      height:40px;
      
  } 
/*--------------------------
pseudo classes
---------------------------*/
   .head{
       display:flex;
        flex-direction:column;
        flex-wrap:nowrap;
        justify-content:center;
        align-items:center;
         margin-left: auto;
    margin-right: auto;
      flex:  0 1 auto;
text-align:center;
margin-top:20px;
      } 
 
 .mainflex{
 display:flex;
        flex-direction:column;
        flex-wrap:nowrap;
        justify-content:center;
        align-items:center;
         margin-left: auto;
    margin-right: auto;
      flex:  0 1 auto;
text-align:center;
}

.tc1{
font-size: 20px;
 height:30px; 
width:400px;
}

.tc2{
text-align:right;
 font-size: 16px;
 height:30px;
 width:400px;
}

 .head hr{
      padding:  0;
        margin: 4px 0;
        width:100%;
      }  

 .article-flex{
     
        display:flex;
        flex-direction:column;
        flex-wrap:nowrap;
        justify-content:center;
        align-items:center;
         margin-left: auto;
    margin-right: auto;
      flex:  0 1 auto;
max-width:100%;
}
    .tab1{
font-size: 16px; 

text-align: center;
color: #FFFFFF;
  border:1px solid #008EB3;
          padding: 0;
        height:460px;
        width:800px;
          max-width:100%;
        margin-top: 40px ;
        margin-bottom:40px;


  }
.bf{
background-color: #000066;
    text-align: center;
    color: #FFFFFF;
	 
    padding:5px;
  }
.row1{
 height:30px;
    width:18px;
padding:0 10px;
}
      .th1{
   background-color: #0033FF;
         
font-size: 22px; 
font-weight: bold;
color: #00FFFF;
   border:1px solid aqua;       
  }
        .th2{
   color: #000066;
	text-align: center;
 font-size: 16px; 
	height:30px;
          width:130px;
  background-color: #FFCB91;
   
  }
            .th3{
   padding:10px;
	text-align: center;
	 font-size: 12px; 
  color: #000066;
            
  }

.bc{
	background-color: #000099; 
     text-align: center;
    color: #FFFFFF;
 }
   .bf12{
    padding:  5px 5px 5px 10px; 
        text-align: left;
    color: #FFFFFF;
        height:30px;
font-size:16px;
      }
  .bc12{
	font-size:16px;
 
    text-align: left;
    padding: 5px 5px 5px 10px;
    height:30px;
  }
   .bf1{
	 text-align: center;
     padding: 10px;
	  height:20px;
      width:130px;
  }
 .bc1:hover { 
  background: #B95C00;
      }

   .bf1:hover { 
  background: #B95C00;
   }
.titre{
width:301px;
 text-align:left;
padding:5px 5px 5px 20px;
}
 .bc1{
	
     text-align: center;
  
    height:30px;
    width:130px;
  }
.right{
text-align:right;
width:97px;
}
.tab2{
text-align:center;
  padding: 40px 0 20px 0;
width:600px;
display:flex;
 flex-direction:column;
 flex-wrap:nowrap;
  justify-content:center;
 align-items:center;
 margin-left: auto;
    margin-right: auto;
      flex:  0 1 auto;
max-width:100%;
}
 .footer{
       display:flex;
        flex-direction:column;
       
        flex-wrap:nowrap;
        justify-content:center;
        align-items:center;
         margin-left: auto;
    margin-right: auto;
      flex:  0 1 auto;
      }
.tab4{
    color: #00FFFF;
	text-align: center;
    margin: 30px 0 20px 0;
font-size: 18px;
 background-color: #000099;
       height:200px;
         width:550px;
         max-width:80%;
border: 4px solid aqua;
  }
 .td1{
      background-color: #000099;
border: 1px solid aqua;
height:40px;
width:350px;;
      }
        .td1:hover { 
  background: #0033FF;
      }
.tab3{
color: #00FFFF;
	text-align: center;
    margin: 30px 0 20px 0;
font-size: 18px;
 opacity: 1;
       height:20px;
         width:600px;
         max-width:90%;

}
.aide{
background-color:#FFB664;
text-align:center;
}
.f4{
font-size:20px;
}
.f6{
font-size:28px;
}
.f2{
font-size:14px;
}