@font-face {
  font-family: 'Big Parade';
  src: url('https://files.jcink.net/uploads2/bananacat/8ba37426-Big_Parade.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}      @font-face {
  font-family: 'Med Parade';
  src: url('https://files.jcink.net/uploads2/bananacat/5743f3c3-Med_Parade.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}@font-face {
  font-family: 'Buttercup';
  src: url('https://files.jcink.net/uploads2/bananacat/BUTTERCUP_TTF.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

      

:root {
--text: #685e3b;
--brown: #ad5b12;
}

body {
background: url("imgs/bg.png");
 background-attachment: fixed;
  background-repeat: no-repeat;
position: relative;
overflow-x: hidden;
}

.header {
background: url("imgs/header.png");
width: 105%;
margin:-10px;
height: 90%;
background-size: cover;
position: relative;
}

.logo {
padding-top: 100px;
position: relative;
animation: logobounce 0.5s 1;
}

.about {
background: url("imgs/about.png");
height: 438px;
width: 1026px;
margin-top: 100px;
margin-left:20px;
}

@keyframes logobounce {
  0%   { opacity:0; padding-top: 0px; }
  45%  { opacity:1;padding-top: 120px; }
  100% { padding-top: 100px; }
}

.abouttext {
font-family: buttercup;
font-size: 20px;
color: var(--text);
position: relative;
padding-top: 120px;
width: 880px;
text-align: left;
line-height: 35px;
}

.features {
margin-top: 100px;
background: url("imgs/features.png");
background-repeat: none;
width: 918px;
height: 405px;
margin-left:20px;
}

.featurestext {
font-family: buttercup;
font-size: 20px;
color: var(--text);
position: relative;
padding-top: 70px;
width: 820px;
text-align: right;
line-height: 63.5px;
}

.book {
width: 1092px;
height: 603px;
margin-top: 140px;
background: url("imgs/book.png");
margin-left:20px;
}

.blog1 {
padding-top: 80px;
width: 422px;
padding-left: 20px;
padding-right: 20px;
}

.photo1 {
margin-left:-20px;
width: 430px;
height: 210px;
background: url("imgs/blog/girls.png");
background-size: 390px;
background-repeat: no-repeat;
background-position: 35px 40px;
}

.photo2 {
margin-left:-20px;
width: 430px;
height: 210px;
background: url("imgs/blog/name.png");
background-size: 390px;
background-repeat: no-repeat;
background-position: 35px 40px;
}

.book h1 {
margin-top: 40px;
font-family: big parade;
padding-left: 20px;
color: var(--brown);
text-transform: uppercase;
font-size: 24px;
letter-spacing:0px;
width: 300px;
}

.book h2 {
font-family: med parade;
font-size: 18px;
color: var(--text);
padding-left: 20px;
margin-top: -10px;
}

.readme {
padding-left:15px;
transition: 0.3s;
}

.readme:hover {
padding-left: 30px;
}

.girls {
margin-left: 20px;
margin-top: 120px;
pointer-events: none;
}

.footer {
width: 100%;
height: 700px;
background: url(imgs/footer.png);
margin-top: -200px;
font-family: buttercup;
color: var(--text);  display: flex;
  align-items: flex-end;
  justify-content: center;
padding-bottom: 100px;
}