@font-face {
font-family: "Felipa";
src: url("../../fonts/Felipa-Regular.ttf")format("truetype");
}

#home-button{
    position: absolute;
    left: 0.5vw;
    top: 0.5vw;
    font-family: 'Courier New', Courier, monospace;
    width:fit-content;
    font-size: 0.3vw;
    font-weight: 600;
    background-image: url("../../images/BCKGRND/TEXTORA.JPG");
    padding-right: 1vw;
    color: rgb(20, 20, 20);
    border: double 0.4vw brown;
}
#home-button:hover{
    color: red;
}


#body{
    background-image: url("img/background1.gif");
    background-repeat: repeat-y;
    background-size: contain;
    font-family: Felipa;
    font-size: 1.5vw;
}

#main-container{
    flex-direction: column;
    max-width: 1200px;
    width: 80vw;
    margin: auto;
    margin-top: 5vh;
}

.overlay{
    width: 95%;
    margin: auto;
    background-color: rgba(233, 177, 75, 0.65);
    box-shadow: 0.5vw 0.5vw 0.2vw black;
    padding-top: 0.5vw;
    padding-left: 1vw;
}

.ingredient-pic{
    height: 5vh;
}

header{
    font-family: 'Times New Roman', Times, serif;
    text-align: center;
    width: 80%;
    margin: auto;
    padding: 0px;
    margin-bottom: 2vh;
    background-image: url("img/folded-paper-min.jpg");
    border: double rgb(46, 46, 46) 1vw;
    font-size: 4vw;
}

ol, ul{
    line-height: 5vh;
}

#title-h1{
    padding: 0px;
    margin-top: 3vh;
    margin-bottom: 3vh;
}

#bigR{
    width: 7vw;
    display: inline-block;
    margin:auto;
    margin-top: 3vh;
}

footer{
    text-align: center;
    width: 100%;
    margin: auto;
    background-image: url("img/chef2-text-w.gif");
    background-repeat: repeat;
    height: 12vh;
}

#body-container{
    width:100%;
    padding: 0px;
    display: flex;
    flex-direction: row;
    justify-content: start;
    background-image: url(img/lined-paper.jpg);
    background-position-y: -120px;
}

#left-panel{
    width: 30%;
    max-width: 250px;
    padding: 0px;
    margin: none;
    background-image: url("img/cardboard.jpg");
    box-shadow: 0.5vw 0.5vw 0.5vw black;
}

.left-panel-link{
    font-weight: bold;
}

.left-panel-link:hover{
    font-style: italic;
    text-shadow: 0.2vw 0.2vw 0.2vw rgb(255, 238, 164);
}

#main-panel{
    width: 70%; 
}

#bulbasour-img{
    width: 90%;
}