/* border: 10px solid red; */

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  text-align : center;
  color: rgb(42, 42, 46);
  width: 50%;
}

.grid_container {
  display: grid;
  width: 109%;
  grid-template-columns: 50% 50%;
  justify-content: space-evenly;
}

.main_page {
  display: block;
  margin-left: auto;
  margin-right: auto;
  text-align : center;
  max-width : 800px;
  min-width : 400px;
  height: 100%;
  color: rgb(42, 42, 46);
}

.title_box {
  display: block;
  margin-top: 1%;
  margin-left: auto;
  margin-right: auto;
  text-align : center;
  width:70%;
  aspect-ratio: 2 / 1;
  background: url(title.png);
  background-position: center top;
  background-repeat:no-repeat;
  background-size: contain;
  color: rgb(42, 42, 46);
}

.page_content {
  display: block;
  position : relative;
  margin-left: 13%;
  width: 68%;
  height: 100%;
}

.banner {
  display: block;
  position : relative;
  top : 0;
  margin-left: auto;
  margin-right: auto;
  text-align : center;
  color: rgb(0, 255, 0);
  height: 100%;
}

.colored_green {
  display: block;
  color: rgb(101, 111, 188);
  width: 100%;
  text-align: left;
}

.post_holder {
  position: relative;
  aspect-ratio: 1 / 1.5;
  z-index : 5;
}

.post_icon {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 10;
}

.post_image {
  position: absolute;
  right: 9%;
  top: 12%;
  width: 82%;
  height: 40%;
  z-index: -4;
}

.post_text {
  position: absolute;
  width: 90%;
  height: 30%;
  top: 47%;
  margin-left: 5%;
  margin-right: auto;
  text-align: center;
  font-size: 1rem;
  z-index: 20;
}

.text_margin {
  max-width: 600px;
  margin: 0 auto; 
}

.logo_box {
  position: relative;
  display:inline-block;
  top:60%;
  height: 20%;
}

.logo0 {
  left: 20px;
  background-color: rgba(255, 255, 255, 0);
  width: 10%;
  margin-left: 5%;
  margin-right: 5%;
}

.logo1 {
  position: relative;
  top: -20px;
  left: 80px;
  background-color: white;
  width: 500px;
}