* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    height: 100%;
    width: 100%;
    font-family: Arial, sans-serif;
    user-select: none;
}

body {
    background: linear-gradient(170deg, white 20%, #b3cff2ff 80%); /* Updated gradient colors */
}

.upper-half, .lower-half {
    width: 100%;
    display: flex;
    padding: 5vh 10vw;
    align-items: center;
}

.upper-half {
    height: 50%;
    justify-content: flex-start; /* Align content to the left */
}

.lower-half {
    height: 50%;
    justify-content: flex-end; /* Align content to the right */
}

.logo {
    max-height: 100%;
    max-width: 600px; /*Limit the logo width to 1000px or 100% of its container*/
    width: 100%;
}

.text-block {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

/* .text-block { */
    /* text-align: right; */
/* } */

/* .text-block p { */
    /* text-align: right; */
/* } */

/* Different styles for each text */
.style1 {
    font-size: 50px; /* Big font size for title */
    color: black;
    font-weight: bold;
}

.style2 {
    font-size: 30px; /* Smaller font size for subtitle */
    color: #555;
}

.style3 {
    font-size: 22px; /* Suitable font size for contact information */
    color: #777;
    font-weight: bold;
}

.spacer {
    height: 10px; /* Height of the spacer for vertical spacing */
}

/* Copyright styling */
.copyright {
    position: fixed;
    bottom: 10px;
    right: 10px;
    color: #555;
    font-size: 14px;
}