
.container1{
    width:1217px;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:145px;
    background:#B7CAD8;
    height:auto;
    margin-left:150px;
    }

.trainer{
width:200px;
text-align:center;
margin-top:45px;

}

.trainer img{
    width:300px;
    height:300px;}

h1{
    text-align:center;
    font-family:Playfair Display;
    font-size:30px;}

.description{
      font-family:Playfair Display;
      font-size:20px;
      margin-top:5px;
      white-space:nowrap;}

.name{
      margin-top:10px;
      margin-right:25px;
      white-space:nowrap;
      font-family:Playfair Display;
      font-size:25px;}

@media(max-width:1024px){
    .container1{
    width:853px !important;
    margin-left:91px !important;
    }

    .trainer{
    margin-left:25px !important;
    }
}

@media (max-width:768px){
    .container1{
    width:644px !important;
    margin-left:91px !important;
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:65px;

    }

    .trainer img{
    width:250px;
    height:250px;}

}

@media (max-width:430px){
     .container1{
        width:358px;
        height:auto;
        display:flex;
        flex-direction: column;
        align-items: center;
        gap:5px;
        margin-left: 59px;}

     .trainer{
     margin-left:-88px !important;
     }

     .trainer img{
     width:300px;
     height:300px;
     }
}


@media (max-width:320px){
    .container1{
    width:287px !important;
    height:auto;
    margin-left:26px !important;
    display:flex;
    flex-direction: column;
    gap:5px;}

    h1{
    margin-top:5px;}

    .trainer{
    margin-left:-48px;
    }

    .trainer img{
    width:250px;
    height:250px;}

    .name{
    font-size:20px;
    font-family:Playfair Display;
    }

    .description{
    font-size:15px;
    font-family:Playfair Display;
    margin-left:-34px;
    margin-top:-14px;
    }
}

