@import "./fonts.css";
* {
    box-sizing: border-box;
    /* margin: 0; */
    /* outline: 1px solid purple; */
}
input, button, textarea, select {
    font: inherit;
}
body {
    font-family: jost;
    margin: 0px;
    margin-top: 10px;
}
  
.landing-page {
    display:flex;
    flex-direction: column;
    align-items: center;
    font-size: x-large;
    font-family: "Jost";
  
    padding-top: 10px;

    background-color: lightskyblue;
    padding: 10px;
    
    height:100vh;
}


section {
    display: flex;
    justify-content: space-around;
    gap: 5px;
    
    width: 100%;
    max-width: 800px;

    margin-bottom: 10px;
}

section .content{
    background-color: white;
    /* width: 48%; */

    padding: 10px;
    border-radius: 10px;

    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 20px;
}


section .image {
    /* width: 50% */
    border-radius: 10px;
}

.first-section .content {
    width: 60%;
}
.first-section .image {
    width: 40%;
    background-image: url("./assets/dummy-map.jpg");
    background-position: center;
}

.first-section .content p {
    margin-top: 7px;
}


.map-link-button {
    background-color: rgb(60, 0, 128);
    color: white;
    padding: 5px 15px;

    width: fit-content;
    border-radius: 10px;
    text-decoration: none;
}

.second-section .content p {
    margin: 0;
}

.second-section .content {
    width: 80%;
}
.second-section .image {
    width: 20%;
}
.second-section .image img{
    width: 100%;
    height: 100%
}


.third-section {
    height: 150px;
}
.third-section .content {
    width: 80%;
    
}
.third-section .content p{
    margin:0;
}
.third-section .image {
    width: 20%;
}
.third-section .image img {
    height:100%;
}

.fourth-section .content {
    width: 80%;
}
.fourth-section .image {
    width: 18%;
    background-color: white;
    padding: 10px;
    padding-right: 12px;
    height:100%
}


.logo-and-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: fit-content;
}
.logo-and-title img{
    width: 100px;
}
.logo-and-title h1 {
    margin: 0;
    margin-top: -10px;
}