/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Lato&display=swap');
* {
    box-sizing: border-box;
  }
  
  body {
    display: flex;
    flex-direction: column;
    margin: 0;
    font-family: 'Lato', sans-serif;
  }
  
  main {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: center;
    justify-content: center;
  }

  .big {
    width: 100%;
    height: 99vh;
    background: url('/images/Guldberg\ Farms\ Homepage\ Background.jpg') center/cover no-repeat;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }

  .big h1 {
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    font-size: 5.5vw;
    color: black;
    text-align: center;
}

.big p {
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    font-size: 4vw;
    color: black;
    text-align: center;
    font-weight: bold;
    margin-top: -20px;
}
  
  footer {
    background: white;
    height: auto;
    margin-left: 15%;
    margin-right: 15%;
    text-align: center;
  }
  

/* About Us Section Styles */
.about-us {
    width: 100%;
    padding-left: 15%;
    padding-right: 15%;
    background-color: white;
    margin-bottom: 2%;
}

.row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
}

.column {
    display: flex;
    flex-direction: column;
    flex-basis: 100%;
    flex: 1;
    height: auto; /* Set a fixed height for both image and text containers */
    margin-right: 20px; /* Adjust the margin as needed */
    padding: 20px; /* Adjust the padding as needed */
    overflow: hidden; /* Ensure overflow is hidden to contain the image */
}

.column:last-child {
    margin-right: 0;
}

.column img {
    height: 100%; /* Set the height to 100% of the container */
    width: 100%; /* Set the width to 100% of the container */
    object-fit: cover; /* Make the image cover the container without distortion */
}

.column.text {
    display: flex; /* Ensure it's a flex container */
    flex-direction: column; /* Align text vertically within the container */
    align-items: center; /* Center the text vertically */
    justify-content: center; /* Center the text horizontally */
    text-align: center;
}

.column.text h3 {
    font-size: 32px;
}

.column.text p {
    align-content: center;
    justify-content: center;
    font-size: 24px;
}

/* Animation Styles */
.hidden {
    opacity: 0;
    filter: blur(2px);
    transform: translateX(-5%);
    transition: opacity 0.5s, blur 0.5s, transform 0.5s;
}

.show {
    opacity: 1;
    filter: blur(0px);
    transform: translateX(0%);
}

@media (max-width: 700px) {
    .row {
        flex-direction: column;
        margin-top: 0;
    }

    .column {
        margin-right: 0px;
        width: 100%;
    }

    .column.text h3 {
        font-size: 20px;
    }

    .column.text p {
        font-size: 15px;
    }

    .image {
        order: 1;
    }

    .text {
        order: 2;
    }

    .about-us {
        padding-left: 5%;
        padding-right: 5%;
    }

    .big h1 {
        font-size: 9vw;
    }
    .big p {
        font-size: 6vw;
    }

}
  