body{
  margin: 0px;
  padding: 0px;
  font: var(--bodyfont);
  font-size: 0.8125rem;
  line-height: 1.8;
  letter-spacing: 1px;
  color: var(--peach70);
  background-image: url(https://64.media.tumblr.com/adab6da9e9130698d73d2c5967ae0f25/afa400d7278e362b-4f/s2048x3072/01a58d3abb5be7f1efea94a58e3ef417abc90357.jpg);
  background-position: center;
  background-attachment: fixed;

td{
    font: var(--bodyfont);
  font-size: 0.8125rem;
  line-height: 1.8;
  letter-spacing: 1px;
  color: var(--peach70);
  }
 
  /* Core darks / text */
  --dgreen: rgba(17, 18, 24, 1);   /* #111218 – primary body text */
  --black: rgba(1, 1, 2, 1);       /* #010102 – deepest background */

  /* Backgrounds */
  --cream: rgba(9, 13, 20, 1);     /* #090D14 – main page background */
  --cream70: rgba(9, 13, 20, .7); 
  --beige: rgba(26, 29, 35, 1);    /* #1A1D23 – section background */
  --beige70: rgba(26, 29, 35, .7);

  /* Nav + secondary accents */
  --green: rgba(5, 6, 15, 1);      /* #05060F – header/sidebar bg */
  --green70: rgba(5, 6, 15, .7);

  /* Accent / highlight */
  --peach: rgba(206, 74, 86, 1);   /* #CE4A56 – bold red-pink accent */
  --peach70: rgba(206, 74, 86, .7);
  --peach80: rgba(206, 74, 86, .8);

  /* Links */
  --indigo2: rgba(206, 74, 86, 1);  /* same accent for strong emphasis */
  --indigo10: rgba(206, 74, 86, .9);  

 /* Fonts */
  --bodyfont: 500 11px/18px 'Manrope', sans-serif;
  --serifcaps: 700 10px/10px 'Inria Serif', serif;
  --display: 'DM Serif Display', serif;

/* LINKS */
a {
  position: relative;
  text-decoration: none;
  font: var(--serifcaps);
  text-transform: uppercase;
  color: var(--dgreen);
}

/* SERIF LINKS */
.btop a{
  position: relative;
  color: var(--indigo2);
}
.btop a:before{
  content: '';
  position: absolute;
  bottom: -3px;
  left: 0px;
  width: 0px;
  height: 1px;
  background-color: var(--indigo10);
  transition: width 1s .5s;
  -webkit-transition: width 1s .5s;
}
.btop a:hover:before{
  width: 100%;
  height: 1px;
  background-color: var(--indigo10);
  transition: width 1s;
  -webkit-transition: width 1s;
}


.btop {
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 1000;
  min-height: 10px;
  width: calc(100% - 125px);
  padding: 15px 40px 15px 85px;
  font: var(--serifcaps);
  text-transform: uppercase;
  background-color: var(--green);
    display: flex;          /* make children align horizontally */
  align-items: center;    /* vertically center the items */
  justify-content: space-between; /* optional: push them to opposite ends */
}


.bbot {
  position: fixed;
  bottom: 0px;
  left: 0px;
  z-index: 1000;
  min-height: 10px;
  width: calc(100% - 105px);
  padding: 15px 65px 15px 40px;
  font: var(--serifcaps);
  text-transform: uppercase;
  text-align: right;
  background-color: var(--green);
}
.bleft {
  position: fixed;
  top: 40px;
  left: 0px;
  z-index: 999;
  width: 40px;
  height: calc(100% - 78px);
  background-color: var(--green);
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
}
.bleft a {
  font-size: 12px;
  line-height: 25px;
}
.bleft::before {
  content: "";
  position: absolute;
  background-color: transparent;
  top: 0px;
  left: 40px;
  height: 80px;
  width: 80px;
  border-top-left-radius: 40px;
  box-shadow: 0 -40px 0 0 var(--green);
}
.brig {
  position: fixed;
  top: 40px;
  right: 0px;
  z-index: 999;
  width: 40px;
  height: calc(100% - 80px);
  background-color: var(--green);
}
.brig::after {
  content: "";
  position: absolute;
  background-color: transparent;
  bottom: 0px;
  right: 40px;
  height: 80px;
  width: 80px;
  border-bottom-right-radius: 40px;
  box-shadow: 0 40px 0 0 var(--green);
}

.header {
  display: block;
  position: relative;
  top: 40px;
  left: 40px;
  z-index: 1;
  width: calc(100vw - 80px);
  height: calc(100vh);
}
.header a.hdr {
  display: block;
  position: fixed;
  top: 95px;
  left: 120px;
  width: 100%;
  max-width: 1000px;
  margin: 0px auto;
  padding: 50px;
  color: var(--peach);
  font: 80px/80px var(--display);
  text-transform: capitalize;
}

.header .subhead {
  display: block;
  position: fixed;
  top: 230px;
  left: 170px;
  color: var(--peach70);
  font: var(--serifcaps);
  text-transform: uppercase;
  word-spacing: 3.5px;
}

#wrapper {
  position: relative;
  z-index: 5;
  width: calc(100% - 160px);
  margin: 0px auto 10px auto;
}

h1 {
  font-family: 'kanit';
  font-weight:900;
  font-size: 2.5rem;
  line-height: 1;
  text-transform: uppercase;
  color: var(--peach);
  padding: 0px;
  margin: 0px;
}

.wrapper {
  margin: 60px auto; /* 20px on top/bottom, auto on left/right */
  padding: 20px;
  border-radius: 20px;
  background-color: var(--cream70);
}
  

.text{
  border-radius:20px;
  padding:40px;
  background-color: var(--cream);
  }
  
.full {
  margin-top: 60px;
  padding-top: 20px;
  background-color: var(--cream70);
}

.ftext{
  padding:80px;
  background-color: var(--cream);
  }