body {

    margin: 0;

    font-family: Arial, Helvetica, sans-serif;

    height: 100%;

}



.hero-image {

    background-image: url("./full.logo.png"); /* The image used */

    background-color: white; /* Used if the image is unavailable */

    height: 100%;

    background-position: center 0%; /* Center the image */

    background-repeat: no-repeat; /* Do not repeat the image */

    background-size: auto 100%;

    

}



.hero-text {

    text-align: center;

    position: absolute;

    top: 70%;

    left: 50%;

    transform: translate(-50%, -50%);

    color:brown;

}

.hero-text h1 {
    font-size:50px;
}



.social {

    margin-top: 40px;

}



.social a {

    margin: 0px 10px

}

@media only screen and (max-width: 800px) {

    .hero-image {
        background-size: auto 70%;
    }

    .social a img {
        width: 32px;
        height: auto;
        
    }

    .hero-text h1 {
        font-size:30px;
    }


    @media only screen and (max-width: 450px) {
        .social a img {
            width: 20px;
            height: auto;
            
        }
    }
    
  }