@media screen and (min-width: 1560px) and (min-height: 850px) {
    body {
        background: #5E4E86;
        margin: 0;
        padding: 0;
        color: white;
        font-family: "Alata", sans-serif;
    }
    
    .global {
        width: 100vw;
        height: 100vh;
        position: relative;
        max-height: 100vh;
        display: flex;
        overflow-x: hidden;
    }
    
    .box-present {
        display: flex;
        flex-direction: column;
        background-color: #2F3678 ;
        width: 781px;
        height: 100vh;
        padding-right: 80px;
        padding-left: 80px;
        gap: 10px;
        justify-content: space-between;
        
    }

    .box-project-container {
        display: flex;
        flex-direction: column;
        width: 100%;
        gap: 50px;
        overflow-y: auto;
        height: 100%;
        position: relative;
    }
    
    .box-project-list {
        display: flex;
        flex-direction: column;
        gap: 30px;
        padding: 40px;
    
    
    }
    

        
}

    
    
    p {
        margin: 5px !important;
    }
    
    h1 {
        margin: 5px !important;
    }
    
    .header {
        display: flex;
        flex-direction: column;
        gap: 30px;
    }
    
    /*Name */
    
    .name {
        margin-top: 30px;
        display: flex;
        align-items: center;
        gap: 35px;
        justify-content: center;
    }
    
    .name-img {
        width: 200px;
        height: 200px;
        border-radius: 100%;
    }
    
    .name-text {
        display: flex;
        flex-direction: column;
    }
    
    .name-t1 {
        color: #FFF;
        font-size: 70px;
    }
    
    .name-t2 {
    
        color: #959595;
        font-size: 50px;
    }
    
    /*Networks*/
    
    .networks {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 10%;
    }
    
    
    .networks a button {
        background-color: transparent;
        border: none;
    }
    
    
    /*Activties */
    
    .activities {
        display: grid;
        justify-content: center;
        align-items: center;
        align-content: center;
        width: 600px;
        gap: 25px;
        grid-template-columns: 1fr 1fr 1fr;
        margin-left: auto;
        margin-right: auto;
    
    }
    
    .activity {
        border-radius: 20px;
        background: rgba(255, 255, 255, 0.26);
        width: 180px;
        height: 140px;
        flex-shrink: 0;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
        padding-top: 40px;
        transition: 0.2s;
       
    }
    .activity:hover {
    
        transform: scale(1.1);
    }
    
    .activity p {
        margin: 0 !important;
        margin-block-start: 1em !important;
        margin-block-end: 1em !important;
    
    }
    
    .activity svg {
        height: 80px;
    }
    
    /*Services */
    
    .services {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 50px;
        margin-bottom: 20px;
    }
    .services svg {
        height: 83px;
    }
    
    .service {
        display: flex;
        flex-direction: column;
        align-items: center;
    
    
    }
    
    /* Project */
    
    .projet-image {
        width: 126px;
        height: 126px;
    }
    
    /*Scrollbar */
    
    ::-webkit-scrollbar {
        width: 10px;
        margin-right: 20px;
        background-color: #5E4E86;
      }
      
      /* Track */
      ::-webkit-scrollbar-track {
        border-radius: 12px;
      }
      
      /* Handle */
      ::-webkit-scrollbar-thumb {
        background: #ffffff43;
        border-radius: 10px;
      }
      
    /*Project*/
    
    
    .exBox {
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-radius: 20px;
        background: rgba(255, 255, 255, 0.26);
        padding: 20px;
        gap: 20px;
    }
    
    .projet-image-ex {
    
       width: 50%;
    }
    
    .pri {
        display: flex;
        flex-direction: column;
        gap: 10px;
        width: 100%;
        align-items: center;
    
    }
    
    /* svg */
    
    a, a:hover, a:visited, a:active {
        color: inherit;
        text-decoration: none;
    }
      
    
    a:visited {
        fill: currentColor;
       
    }
    
    .box-present svg path {
        transition: 0.1s;
    }
    
    .services svg:hover path {
    
        fill: #d2d2d2 !important;
        
    
    }
    
    .box-present svg {
        cursor: pointer;
    }
    

