#courses{
  justify-content: center;
  align-items: center;
  align-content: center;
}



.courses-info {
    position: relative;
    margin:45px auto;
    justify-content: center;
    align-items: center;
  }
  
.courses-info img {
    max-width: 1000px;
    min-width: 450px;
    margin: 0px auto;
  }
  .about-btn{
    size: 0.5rem;
    position: absolute;
    margin-top:40px;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    background-color: transparent;
    color: white;
    font-size: calc(10px + 7 * (50vw / 600));
    padding: 10px 16px;
    border: none;
    cursor: pointer;
    border-radius: 10px;
    border:1px solid white;
    text-align: center;
  }
.courses-info .courses-btn {
    size: 0.5rem;
    position: absolute;
    top: 80%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    background-color: transparent;
    color: white;
    font-size: calc(10px + 7 * (50vw / 600));
    padding: 10px 16px;
    border: none;
    cursor: pointer;
    border-radius: 10px;
    border:1px solid white;
    text-align: center;
  }
  
  .courses-info .courses-btn:hover {
    background-color: black;
  }
  .about-btn :hover{
    background-color: black;

  }