.double-bulles{
position:relative;
margin-top:60px;
}

.double-bulles h3 {
    font-size: 2.5em;
    line-height: 0.9em;
    font-weight: 600;
    font-family: "Gotham Cond A","Gotham Cond B";
    text-transform: uppercase;
margin:0px;
}

.bulle-mots{
padding:20px 20px 40px 20px;
border:3px solid #CCE2E1;
max-width:70%;
margin-left:auto;
margin-right:auto;
border-radius:15px;
text-align: center;
position:relative;
}

.bulles-resultat{
padding:20px;
border:1px solid #45A5B2;
background-color:#45A5B2;
max-width:50%;
margin-left:auto;
margin-right:auto;
border-radius:15px;
margin-top:-20px;
text-align: center;
position:relative;
}

.bulles-resultat h3{
color:#fff !important;
}

.span2{
grid-column: span 2;
}

.box-stage{
position:relative; 
background-color:#fff; 
padding:10px; 
color:#555; 
border-width:0px 1px 1px 1px; 
border-style: solid; 
border-color:#81C5C5;
min-height: 210px;
}

.box-cabinets {
    position: relative;
    width: 100%;
    padding: 60px 30px;
    margin-bottom: 20px !important;
    background-color: #000;
    /*background-image: url(https://cpaquebec.ca/-/media/images/etudiants-futurs-cpa/comment-devenir-cpa/brochure_universitaire/svg/graph_affaires.svg);
    background-repeat: no-repeat;
    background-position: left 0 bottom 6%;
    background-size: 1027px; */
}

.aqua {
    color: #81C5C5 !important;
}

    h2.h2bloc {
        font-size: 4em;
        line-height: 0.8em;
        margin: 0px;
    text-align: end;
    position:relative;
    z-index:2;
    }
    
    h2.h2bloc span {
        font-size: 0.8em;
        margin: 0px;
    }
    
    h2.h2section {
        font-size: 4em;
        line-height: 0.8em;
        margin: 0px;
    margin-bottom:10px;
    margin-top:25px !important;
    position:relative;
    z-index:2;
    }
    
    h2.h2section span {
        font-size: 0.8em;
        margin: 0px;
    }
    
    .aquafonce {
        color: #45A5B2;
    }
    
    .aqua {
        color: #003B5D;
    }
    
    .bleu {
        color: #0081AD;
    }
    
    .white {
        color: #ffffff;
    }
      
      .grid-item {
          color: #555555 !important;
    background:none !important;
    box-shadow:none !important;
    padding:0px !important;
      }
      
        .grid-container {
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          gap: 10px;
          max-width: 1200px;
          margin: 0 auto;
          padding: 0px;
margin-bottom:10px;
        }
    
        .grid-container1 {
          display: grid;
          grid-template-columns: repeat(1, 1fr);
          gap: 10px;
          max-width: 1200px;
          margin: 0 auto;
          padding: 0px;
margin-bottom:10px;
        }

        .grid-container2 {
          display: grid;
          grid-template-columns: repeat(2, 1fr);
          gap: 10px;
          max-width: 1200px;
          margin: 0 auto;
          padding: 0px;
margin-bottom:10px;
        }


      
        .grid-item {
          background-color: #3498db;
          color: #fff;
          padding: 20px;
          border-radius: 5px;
          box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        }
      
        .grid-item.rowspan {
          grid-row-end: span 2;
        }
      
        .grid-item.colspan {
          grid-column-end: span 2;
        }
      

.grid-container .grid-item .box-compagnon{
min-height:260px;
}

.grid-container .grid-item .box-compagnon1{
min-height:260px;
}

.grid-container .grid-item .box-compagnon2{
min-height:260px;
}


        /* ----------------------- */
          .box-compagnon{
              background-color: #EFF7F7; 
              padding: 20px; 
              margin:0px; 
              border-radius: 10px;
              position: relative;
          }
      
          .box-compagnon:hover{
              background-color: #D7EFF1; /* C7DBDC */
          }

.box-compagnon1{
              background-color: #c9f0f1; 
              padding: 20px; 
              margin:0px; 
              border-radius: 10px;
              position: relative;
          }
      
          .box-compagnon1:hover{
              background-color: #D7EFF1; /* C7DBDC */
          }

.box-compagnon2{
              background-color: #E0DFFF; 
              padding: 20px; 
              margin:0px; 
              border-radius: 10px;
              position: relative;
          }
      
          .box-compagnon2:hover{
              background-color: #CDCCFF; /* C7DBDC */
          }
      
          .lien-tuiles{
            color:#000000; 
            text-decoration:underline;
          }
      
          .lien-tuiles:hover{
            text-decoration:none;
            color:#000000;
          }
    
      
        @media (max-width: 768px) {
          .grid-container {
            grid-template-columns: 1fr;
          }

        .grid-container2 {
          grid-template-columns: repeat(1, 1fr);
        }

        .grid-container3 {
          grid-template-columns: repeat(1, 1fr);
        }
      
          .grid-item.colspan {
          grid-column-end: span 1;
        }
    
    .txt-bulle, .img-bulle{
        display: inline-block;
        width: 100%;
    vertical-align:top;
    }

.span2{
grid-column: span 1;
}

.box-stage{
min-height: auto;
}
    
        }