body {
    font-family: 'Changa', sans-serif;
    font-family: 'PT Serif', serif;
    margin: 0;
    padding: 0;
    height: 130vh;
}

#cafe-logo {
    display:relative;
    transform: translate(-5%,-5%);
    width: 17%;
    padding:3%;
    padding-left: 25%;
}
.nav {
    font-family: Changa;
    display: flex;
    justify-content: space-between;
    width:100%;
    align-items: center;
    list-style: none;
    background-color: rgba(0, 0, 0, 1);
}

.nav-ul {
    color:white;
    font-size:1.15em;
    display: flex;
    list-style: none;
    align-items: right;
    padding-right: 5%;
    width: 70%;
    margin:0.2em;
}

.nav ul li{
    width:5vw;
    float:left;
    padding:1.5vw;
    margin:0.5vw auto;
    text-align:center;
}
.nav ul li a{
    text-decoration: none;
    color:lightgrey;
}
.nav ul li:hover{ background-color:#543616; }
.nav ul li a:hover{ color:white; }
.title{
    position:absolute;
    background-color:black;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    width:100%;
    height:63vh;
    left:0;
    top:13vh;
}
.title #eunsa{
    font-family: PT Serif, Bold700;
    font-size:3em;
    color:orange;
    width:30%;
    position:absolute;
    top:9vh;
    left:44.5vw;
}
.title #shop{
    font-family:PT Serif Bold700;
    font-size:4em;
    color:white;
    width:30%;
    position:absolute;
    top:14vh;
    left:45vw;
}
.title #line{
    width:80%;
    border:0.5;
    position:absolute;
    top:33vh;
    left:10vw;
}
.title #p{
    font-family:Changa;
    position:absolute;
    top:35vh;
    left:33vw;
    color:white;
    font-size:1em;
}
button{
    width:13vw;
    height:5vh;
    position:absolute;
    left:43vw;
    top:25vw;
    background-color:transparent;
    color:white;
    border:solid white;
    border-width:thin;
    font-size:1.1em;
    border-radius:0.25em;
    cursor:pointer;
    font-family:Changa;
}

button:hover{
    color:brown;
    border-color:brown;
    box-shadow : 0.1em 0 0 0 rgba(0,0,0,0.5) inset;
}
#redbutton{
    width:13vw;
    height:5vh;
    position:absolute;
    left:43vw;
    top:73vh;
    background-color:red;
    color:white;
    border:solid red;
    border-width:thin;
    font-size:1.2em;
    border-radius:0.25em;
    cursor:pointer;
    font-family:Changa;
}

.white #D{
    color:red;
    font:PT Serif regular;
    font-size:1.7em;
    width:100%;
    height:90vh;
    position:absolute;
    top:90vh;
    left:15vw
}
.white #D1{
    width:17vw;
    height:25vh;
    position:absolute;
    top:100vh;
    left:12vw;
    box-shadow:2px 2px 2px #666666;
    border-radius:1.5vh;
}
.white #D2{
    width:17vw;
    height:25vh;
    position:absolute;
    top:100vh;
    left:32vw;
    box-shadow:2px 2px 2px #666666;
    border-radius:1.5vh;
}
.white #D3{
    width:17vw;
    height:25vh;
    position:absolute;
    top:100vh;
    left:52vw;
    box-shadow:2px 2px 2px #666666;
    border-radius:1.5vh;
}
.white #D4{
    width:17vw;
    height:25vh;
    position:absolute;
    top:100vh;
    left:72vw;
    box-shadow:2px 2px 2px #666666;
    border-radius:1.5vh;
}
.white #D1p{
    font-family:Changa;
    position:absolute;
    top:125vh;
    left:19.25vw;
}
.white #D2p{
    font-family:Changa;
    position:absolute;
    top:125vh;
    left:39.25vw;
}
.white #D3p{
    font-family:Changa;
    position:absolute;
    top:125vh;
    left:59.25vw;
}
.white #D4p{
    font-family:Changa;
    position:absolute;
    top:125vh;
    left:79.25vw;
}


.machine #M{
    color:red;
    font:PT Serif regular;
    font-size:1.7em;
    width:100%;
    height:90vh;
    position:absolute;
    top:140vh;
    left:15vw
}
.machine #M1{
    width:17vw;
    height:25vh;
    position:absolute;
    top:150vh;
    left:12vw;
    box-shadow:2px 2px 2px #666666;
    border-radius:1.5vh;
}
.machine #M2{
    width:17vw;
    height:25vh;
    position:absolute;
    top:150vh;
    left:32vw;
    box-shadow:2px 2px 2px #666666;
    border-radius:1.5vh;
}
.machine #M3{
    width:17vw;
    height:25vh;
    position:absolute;
    top:150vh;
    left:52vw;
    box-shadow:2px 2px 2px #666666;
    border-radius:1.5vh;
}
.machine #M4{
    width:17vw;
    height:25vh;
    position:absolute;
    top:150vh;
    left:72vw;
    box-shadow:2px 2px 2px #666666;
    border-radius:1.5vh;
}
.machine #M1p{
    font-family:Changa;
    position:absolute;
    top:175vh;
    left:18.25vw;
}
.machine #M2p{
    font-family:Changa;
    position:absolute;
    top:175vh;
    left:38.25vw;
}
.machine #M3p{
    font-family:Changa;
    position:absolute;
    top:175vh;
    left:58.25vw;
}
.machine #M4p{
    font-family:Changa;
    position:absolute;
    top:175vh;
    left:78.25vw;
}