.html {
    padding: 0 !important;
    margin: 0 !important;
    overflow-x: hidden;
}

.body {
    overflow-x: hidden;
    padding: 0 !important;
    margin: 0 !important;
    font-family: 'Dancing Script', cursive;
    font-family: 'Marck Script', cursive;
    font-family: 'Red Hat Display', sans-serif;
}

* {
    font-family: 'Red Hat Display', sans-serif;
}

@keyframes pulse {
    0%,
    100% {
      animation-timing-function: ease-in;
      transform: scale(1.1);
    }
    /* 50% {
      transform: scale(1.33);
    } */
  }
  

.page {
    overflow-x: hidden;
    width: calc(100lvw);
    min-height: 100lvh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.page-content {
    overflow-x: hidden;
    padding: 10% 20% 10% 20%;
    width: 60%;
}

.header {
    padding-left: 64px;
    padding-right: 64px;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10;
    /* width: calc(100% - 128px); */
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    height: 64px;
    background-color: rgba(255, 255, 255, 0.6);

    font-size: 1.1em;

    & span {
        font-weight: bold;
        text-transform: uppercase;
    }

    & nav {
        display: flex;
        flex-direction: row;
        gap: 32px;

        & a {
            text-decoration: none;
            font-size: 1em;
            color: black;
            transform: scale(1);        }

        & a:hover{
            animation: pulse 2s infinite;
        }
        
    }

}

@media (max-width:600px){

  .header{
    text-align: center;

    & span{
      width: 100%;
    }

    & nav{display: none;}
  }

}

#home {
    background-image: url('./table.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

    background-color: #FFF6E5;

    & .page-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        & .title {
            font-size: 4em;
            color: wheat;
        }

        & .sub-title {
            display: block;
            font-size: 2em;
            color: wheat;
        }
    }

}

#services {
    /* background-color: #D6EFE3; */

    & .page-content {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: stretch;
        flex-wrap: nowrap;
        gap: 32px;

        & .service {
            & .service-title {
                font-size: 1.1em;
                margin-bottom: 16px;
            }

            & .service-description {
                font-size: 0.9em
            }
        }
    }
}

#contact {
    background-color: #FFF6E5;

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;

   

    
}