@font-face{
    font-family:"pencil";
    src:url("Banana\ Moonpie\ Free.ttf");
}

html{
 background-image: url("images/back.jpg");

}
body {
    max-width: 600px;
    margin-left:auto;
    margin-right:auto;
    display:block;
    font-size:18px;
    color: gray;
    font-family:pencil;
}
#header{
    background-image:url("images/header.png");
    height: 190px;  
    border-radius: 45px 45px 0 0;
    background-clip: padding-box;
    background-position: center;
    overflow: hidden;
    background-size: cover;
    margin-bottom: 10px;
}
.boxstyle{
    border:3px ridge gray;
    overflow: hidden;
    background-color: whitesmoke;
}

.title{
    text-align:center;
    padding-top: 40px;

}
.content {
    background-image:url("images/paper.png");
    padding: 20px;
    margin: 0;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: aliceblue;
}
#indexBodyGrid { 
    grid-template-columns: 1fr; 
    grid-template-rows: 300px 175px 210px;
}
#indexBodyMain { 
    grid-area: 1 / 1 / 2 / 2;
}
.main {
  border: 3px ridge grey;
  border-radius: 50px;
  background-color: rgb(206, 215, 221);
  box-shadow: 0 10px 15px 5px rgba(24, 24, 24, 0.5);
  padding: 10px;
}

#indexBodyMain button{
width: 100%;
font-family: pencil;
background-image: url("images/paper.png");
border-color: grey;

}