body{
    background-image: url(../image/ancre.png);
    background-size: 100px 100px ;
    
     }
     body {
       font-family: Arial, sans-serif;
       color: #333333;
       background-color:#ffffff;
       margin: 0;
       padding: 0;
     }
     
     
     header {
       color: white;
       padding: 20px;
       text-align: center;
     }
     
     
     .button {
       display: inline-block;
       padding: 15px 25px;
       font-size: 24px;
       cursor: pointer;
       text-align: center;
       text-decoration: none;
       color: #fff;
       background-color: #50c878;
       border: none;
       border-radius: 15px;
       box-shadow: 0 9px #317e4a;
       
 
     }
     
     .button:active {
       box-shadow: 0 5px #666;
       transform: translateY(4px);
     }
     
     
     
     
     p{
       font-family: Arial, Helvetica, sans-serif;
       background-color: rgb(255, 255, 255);
       font-size: 20px;
       margin: 10vw;
     }
 
     pre {
       background-color: #ffffff;
       padding: 10px;
       border-radius: 5px;
       overflow-x: auto;
       font-family: Arial, Helvetica, sans-serif;
       font-size: 30px;
       line-height: 1.75em;
     }
    
       
 
       h1 {
         font-family: Arial, Helvetica, sans-serif;
         background-color: #ffffff;
         color: #50c878;
         
       }
 
       h2 {
         font-family: Arial, Helvetica, sans-serif;
         background-color: #ffffff;
         color: #50c878;
        
       }
     .img {
       border-radius: 18px;
 
     }
     .cards {
       text-align: center;
       
 
     }
     .max{
       text-align: center;
       margin: auto;
     }
     .whiteBG {
        background-color:#ffffff ;
        margin: 10vw;
     }
     .link{
      text-align: center;
      font-size: 25px;
      color: #50c878;
    }
  }