    
   /*--------------------------
author: webmaster cmpp.ch
date: 28.04.2025
version 1.2
--------------------------*/
/*--------------------
typography
----------------------*/

      body{
    font-family: Arial, sans-serif;
      font-size: 18px;
      text-align: justify;
      margin:40px;
      color:black;
      background-color: white;
      background-image:url(http://www.cmpp.ch/biblebck.gif);
      }
      h1{
      font-family:Comic sans MS;
        color: #B35900;
        font-weight: bold;
        text-align:center;
        font-size: 24px;
      }
      h2{
        text-align:center;
        font-weight:normal;
        font-size: 16px;
        color: #B35900;
      }
h3{ 
font-family:Comic sans MS;
        color: #B35900;
        font-weight: bold;
        text-align:center;
        font-size: 24px;
}
    

/*----------------------------------------
classes
----------------------------------*/
     article table{
      background-image:url(http://www.cmpp.ch/biblebck.gif);
        text-align:center;
        font-family: Arial, sans-serif;
        margin: 40px 0;
max-width:100%;
width:750px;
border:4px solid #fcb66c;
      }
      th{
      color: #FFDCB9;
        background-color:#FFB66C;
        text-align:center;
       font-weight: bold;
        font-size:24px;
height:40px;
padding:5px;
      }
    
      hr{
      text-align:center;
        width:800px;
max-width:100%;
background: red;
height:4px;
margin:40px 0;
      }
   
      
    
      input{
      font-size:13px; 
color:white; 
font-weight:bold;
background-color:#EC7600; 
width:100px;
padding:5px;
      }
header{
 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, main, article{
 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%;
}
article .td2{
 height:140px;
 width:250px;
}
footer table{
border:4px solid salmon;
width:600px;
max-width:100%;
}
footer td{
height:40px;
width:300px;
padding:5px;
border:1px solid salmon;
}
/*-----------------------------------
pseudo classes
-------------------------------*/
 
 .td1:hover{
      background: #FFB66C;
      }
      .td1{
      background-color: #FFDCB9;
        color:black;
        text-align:center;
       font-weight: bold;
      }
      .th2{
        text-align:center;
        color: #EC7600;
        background-color: #FFB66C;
        font-weight: bold;
        font-size: 18px;
      }
      .fc{
      background-color: #FFDCB9;
         color:#974B00;
         font-size: 18px;
      }
      .ff{
      background-color:#FFCF9F;
         color:#974B00;
        font-size: 18px;
      }
      .tab2{
      color:#974B00;
        text-align:center;
       font-size: 18px;
      }
   .td2{
      background-color:#FFAC59;
        color:white;
        text-align:center;
        font-weight: bold;
        font-size: 18px;
height:140px; 
width:248px;
      }
footer table{
height:200px;
width:600px;
max-width:100%;
border:4px solid salmon;
}
.f7{
font-size:40px;
font-weight:bold;
}
.f2{
font-size:14px;
}
.f3{
font-size:16px;
}
.f4{
font-size:20px;
}
.t1{
height:20px;
width:250px;
text-align:left;
padding: 5px  5px 5px 40px;
}
.t2{
height:20px;
 width:100px;
text-align:center;
}
.t3{
height:20px; 
width:250px;
text-align:center;
padding:5px;
}
/*-----------------------------------
navigation
--------------------------------*/
::-webkit-scrollbar {
  width: 20px;
color:white;
}
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 3px #87CEFA; 
  border-radius: 10px;
}
::-webkit-scrollbar-thumb {
  background:  #D7CCB5; 
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
  background: #176F99; 
}