:root{
    --BgPage: blanchedalmond;
    --BgElemnt: cadetblue;
    --AccCorner: rgb(49, 121, 166);
    --Highleight: coral;
}

body {
    background-color: var(--BgPage);
    font-family: georgia, serif;
}

.TextBlock {
    display: flex;
    justify-content: center;
    align-items: stretch;
    flex-direction: column;
    min-height: 3vw;
    background-color:var(--BgElemnt);
    padding: 3%;
    padding-top: 2vw;
    min-width: 90vw;
    max-width: 98vw;
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.7);
    float: left;
}

.Menu {
    display: flex;
    position: fixed;
    z-index: 999;
    min-width: 92vw;
    max-width: 98vw;
    height: 3vw;
    background-color:var(--BgElemnt);
    box-shadow: 0 1vw 3vw rgba(0, 0, 0, 0.17);
    padding: 2%;
    border-bottom: solid 1vw var(--AccCorner);
}
h2 {
    font-family: 'Brush Script MT', cursive;
}

.MenuText{
    font-family: Arial, sans-serif;
    font-size:3vw;
    background-color: var(--BgElemnt);
    text-decoration: dotted;
    padding-right: 1vw;
    text-shadow: 1px 1px 0.5px rgba(0, 0, 0, 0.7);
}
.MenuText:hover{
    background-color:var(--Highleight);
    font-size: 3.5vw;
}

.RecipeCategoryGrid{
    display: grid;
    grid: repeat(1, 10vw) / auto-flow 12vw;
    width: 10vw;
    height: 10vw;

    background-color:var(--BgElemnt);
    padding: 3%;
    padding-top: 10vw;
    min-width: 90vw;
    max-width: 98vw;
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.7);
    float: left;

    text-decoration:none;
    text-shadow: 0.5px 0.5px 0.5px rgba(0, 0, 0, 0.7);
    font-family:Arial, Helvetica, sans-serif;
    
}

.RecipeCategoryGrid a{
    text-decoration:none;
}
.Padding{
    padding-top: 10vw;
}
.CategoryPicture{
    width: 10vw;
}

.CategoryPicture:hover{
    width: 11vw;
}