body {

    display: flex;
    justify-content: center;
    align-items: center;
}
.text-container {
    width: 50vw;
    height: 20vh;
    display: flex;
    align-items: center;   
    flex-direction: column;
}

.text-container h1 {
    width: 100%
}


@media (max-width: 800px) {
    body {

        display: flex;
        justify-content: center;
        align-items: center;
    }
    .text-container {
        width: 60vw;
        height: 60vh;
        display: flex;
        align-items: center;   
        flex-direction: column;
    }
    
    .text-container h1 {
        width: 100%
    }
    
  }

  @media (max-width: 600px) {
    body {

        display: flex;
        justify-content: center;
        align-items: center;
    }
    .text-container {
        width: 70vw;
        height: 70vh;
        display: flex;
        align-items: center;   
        flex-direction: column;
    }
    
    .text-container h1 {
        width: 100%
    }
    
  }