/* start reset*/
html, body {
    margin: 0;
    padding: 0;

}

body{
    font-family: 'Lato', san-serif;
}

/* navigation */
nav { 
    width: 100%;
    display: flex;
    justify-content: center;

    /* add a background color */
    background-image: linear-gradient(to right, lightseagreen, teal );

}

nav ul {
    display: flex;

}

nav ul li {
    margin: 8px 24px;
    list-style: none;
    
}

nav ul li a {
    color: white;
    text-decoration: none;

}

/* hero */
.hero {
    width: 100%;
    height: 90%;

    /* add a background image */
    background-image: linear-gradient(to right, rgba(32, 178, 171, 0.43), rgba(0, 128, 128, 0.353) ),
    url('../images/hero-main.jpg');
    background-size: cover;

    /* move text to center */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

}

/* dog section */
.dog {
    height: 100%;
    display: flex;

}

.dogImg {
    background-image: url('../images/dog.jpg');
    background-size: cover;

    /* add width and height via flexbox */
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 100%;

}

.text {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 100%;
    justify-content: center;
    padding: 20px;

}

.learnMore {
    background-color: rgba(255, 255, 255,0);
    border: 2px solid black;
    border-radius: 5px;
    padding:20px;
    text-align: center;
    text-decoration: none;
    color: black;
}