html, body {
    max-width: 100%;
    overflow-x: hidden;
    font-family: 'Permanent Marker', cursive;
}

body{
    background-color: #f3eee5;
}

.container{
}

.guestbook-container{
    margin-left: 25em;
    width: 600px;
}

.gallery-container{
    margin-left: 25em;
}

.about-container{
    margin-left: 15em;
    margin-top: 4em;
    font-size: 1.4em;
    width: 700px;
}

.image-container{
    text-align: center;
}

.image{
    height: 100%;
}

.modal-object{
    width: 100%;
    height: 100%;
    font-family: 'Permanent Marker', cursive;
}

.tingle-modal-box{
    width: 40% !important;
}

.tingle-modal-box__content{
    height: 70vh;
}

.tingle-modal-box__footer{
    text-align: center;
}

.modal-image{
    width: 100vw;
}

.nav-bar{
    position: fixed;
    left: 2vw;
    top: 10vh;
    width: 11em;
}

.logo{
    width: 100%;
}

.nav-bar__button{
    font-size: 1.3em;
    margin-bottom: .5em;
    margin-left: 1em;
}

.nav-bar__button:hover{
    cursor: pointer;
    color: white;
    background-color: red;
}

.message-container{
    border: 1px solid;
    padding: 1.5em;
    margin-bottom: 1em;
    box-shadow: 4px 4px;
}

.message-name{

}

.message-message{
    font-size: 2em;
}

.message-time{
    text-align: right;

}

.guestbook{
}

.guestbook-button{
    font-size: 1.2em;
    background-color: #ffb100;
    text-align: center;
    border-radius: 1em;
    padding: 0.8em;
    margin-bottom: 1em;
}

.guestbook-button:hover{
    cursor: pointer;
    background-color: black;
    color: white;
}

.guestbook-textarea{
    font-family: Permanent Marker;
    font-size: 1em;
    margin-top: 1em;
    width: 100%;
}

.guestbook-name{
    font-family: Permanent Marker;
    font-size: 1.5em;
}

.gallery-image{
    margin: 1em;
    width: 50%;
}