/* _________________________________________________________________________
DEFAULTS
_________________________________________________________________________ */


body {
  margin: 0rem;
  background: white;
}

.paragraphs {
  margin: 0px;
  font-family: "Open Sans", sans-serif;
}

#social-media {
  margin-top: 1rem;
  text-align: center;
  font-family: "Open Sans", sans-serif;
  color: white;
}

.nhe {
  padding: 0% 6% 0% 0%;
}

p {
  display: block;
  margin-block-start: 0em;
  margin-block-end: 0em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
}

h1 {
  color: white;
  font-family: Oleo script;
}

#eng {
  color: white;
  font-family: "Open Sans", sans-serif;
}

.nhe {
  color: white;
}

.purple-page-text {
  color: black;
}

.purple-page-titles {
  color: #60595991;
}

.yellow-title {
  font-family: oleo script;
  color: white;
}

.nh {
  font-family: oleo script;
}

/* _________________________________________________________________________
NAVBAR LARGE
_________________________________________________________________________ */

@media only screen and (max-width: 3000px) and (min-width: 710px) {
  .navbar {
    height: 4.5rem;
    width: 100%;
    display: flex;
    justify-content: space-between;
    background: rgba(255, 87, 51, 0.16);
    position: fixed;
  }

  .nh {
    padding: 1.5rem 1.5rem 1.5rem 1.5rem;
    text-decoration: none;
    color: white;
    font-size: 1.2rem;
  }

  .navbar-right {
    display: flex;
  }
  .topnav {
    display: none;
  }
}

/* _________________________________________________________________________
NAVBAR SMALL
_________________________________________________________________________ */

@media only screen and (max-width: 709px) and (min-width: 0px) {
  .navbar {
    display: none;
  }
  .topnav {
    overflow: hidden;
    position: fixed;
    width: 100%;
  }

  /* Hide the links inside the navigation menu (except for logo/home) */
  .topnav #myLinks {
    display: none;
    background: rgba(255, 87, 51, 0.56);
  }

  /* Style navigation menu links */
  .topnav a {
    color: white;
    padding: 15px 45px 15px 45px;
    text-decoration: none;
    font-size: 17px;
    display: block;
  }

  /* Style the hamburger menu */
  .topnav a.icon {
    background: rgba(255, 87, 51, 0.16);
    display: block;
    position: absolute;
    right: 0;
    top: 0;
  }

  /* Add a grey background color on mouse-over */
  .topnav a:hover {
    color: white;
  }

  /* Style the active link (or home/logo) */
  .active {
    background: rgba(255, 87, 51, 0.16);
    color: white;
  }
}

/* _________________________________________________________________________
LANDING PAGE LENGTH, CONTENT, BIG
_________________________________________________________________________ */

@media only screen and (max-width: 3000px) and (min-width: 907px) {
  .landing-page {
    background-color: #fdda21;
    height: 43.5rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
}
  .landing-page-content {
    display: flex;
    padding-top: 4rem;
  }
  #landing-page-text {
    width: 25rem;
    padding-top: 16rem;
  }
  #landing-page-image {
    width: 25rem;
    height: 30rem;
    background: url(line-120.png);
  }
  #landing-page-title {
    text-align: center;
    color: white;
  }
  #social-media-icons {
    text-align: center;
    padding: 2.5%;
  }
}

/* _________________________________________________________________________
LANDING PAGE LENGTH SMALL
_________________________________________________________________________ */

@media only screen and (max-width: 906px) and (min-width: 353px) {
  .landing-page {
    background-color: #fdda21;
    height: 48.2rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
}
  .landing-page-content {
    display: flex;
    flex-direction: column;
    /* padding-top: 6rem; */
    /* padding-top: 4rem; */
  }
  #landing-page-title {
    text-align: center;
    color: white;
  }
  #landing-page-text {
    width: 20rem;
  }
  #landing-page-image {
    align-self: center;
    width: 15rem;
    height: 20rem;
    background: url(line-158.png);
    order: -1;
  }
  #social-media-icons {
    display: flex;
    justify-content: center;
    padding: 2.5%;
  }
  .paragraphs {
    text-align: center;
  }
}

@media only screen and (max-width: 352px) and (min-width: 324px) {
  .landing-page {
    background-color: #fdda21;
    height: 43.2rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
  }
  .landing-page-content {
    display: flex;
    flex-direction: column;
    /* padding-top: 4rem; */
  }
  #landing-page-title {
    text-align: center;
    font-size: 20px;
  }
  #landing-page-text {
    width: 20rem;
  }
  #landing-page-image {
    width: 15rem;
    height: 20rem;
    background: url(line-158.png);
    order: -1;
  }
  .paragraphs {
    text-align: center;
    font-size: 0.9rem;
  }
}

@media only screen and (max-width: 323px) and (min-width: 0px) {
  .landing-page {
    background-color: #fdda21;
    height: 43.2rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
  }
  .landing-page-content {
    display: flex;
    flex-direction: column;
    /* padding-top: 4rem; */
  }
  #landing-page-title {
    text-align: center;
    font-size: 18px;
  }
  #landing-page-text {
    width: 14rem;
  }
  #landing-page-image {
    background: url(line-158.png);
    width: 15rem;
    height: 20rem;
    order: -1;
  }
  #ge-purp {
    background: url(line-158.png);
  }
  #english-image {
    background: url(line-158-2.png);
  }
  #conservation-image {
    background: url(line-158-3.jpg);
  }
  .paragraphs {
    text-align: center;
    font-size: 0.7rem;
  }
}

/* _________________________________________________________________________
PURPLE PAGE
_________________________________________________________________________ */

@media only screen and (max-width: 3000px) and (min-width: 1522px) {
  .purple-page {
    display: flex;
  }
  .purple-page-text {
    width: 35rem;
  }
  .purple-page-image {
    width: 48rem;
    height: 24rem;
    background-color: blue;
  }
  #ge-purp {
    background: url(line-250.jpeg);
  }
  #english-image {
    background: url(line-250-2.jpg);
  }
  #conservation-image {
    background: url(line-250-3.jpg);
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }
}

@media only screen and (max-width: 1522px) and (min-width: 1000px) {
  .purple-page {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 3rem 0rem;
  }
  .purple-page-text {
    width: 33rem;
  }
  .purple-page-image {
    width: 45rem;
    height: 24rem;
    background-color: blue;
  }
  #ge-purp {
    background: url(line-271.jpeg);
  }
  #english-image {
    background: url(line-271-2.jpg);
  }
  #conservation-image {
    background: url(line-271-3.jpg);
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }
}

@media only screen and (max-width: 1407px) and (min-width: 1257px) {
  .purple-page {
    display: flex;
  }
  .purple-page-text {
    width: 30rem;
  }
  .purple-page-image {
    width: 41rem;
    height: 22rem;
    background-color: blue;
  }
  #ge-purp {
    background: url(line-289.jpg);
  }
  #english-image {
    /* background: url(line-289-2.jpg); */
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-289-2.jpg);
  }
  #conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-289-3.jpg);
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }
}

@media only screen and (max-width: 1256px) and (min-width: 1174px) {
  .purple-page {
    display: flex;
  }
  .purple-page-text {
    width: 30rem;
  }
  .purple-page-image {
    width: 33rem;
    height: 21rem;
    background-color: blue;
  }
  #ge-purp {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-307.jpg);
  }
  #english-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-307-2.jpg);
  }
  #conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-307-3.jpg);
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }
  .paragraphs {
    font-size: 0.9rem;
  }
}

@media only screen and (max-width: 1173px) and (min-width: 1058px) {
  .purple-page {
    display: flex;
  }
  .purple-page-text {
    width: 26rem;
  }
  .purple-page-image {
    width: 31rem;
    height: 19rem;
    background-color: blue;
  }
  #ge-purp {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-328.jpg);
  }
  #english-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-328-2.jpg);
  }
  #conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-328-3.jpg);
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }
  .paragraphs {
    font-size: 0.8rem;
  }
}

@media only screen and (max-width: 1058px) and (min-width: 922px) {
  .purple-page {
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 3rem 0rem;
  }
  .purple-page-text {
    width: 26rem;
  }
  .purple-page-image {
    width: 29rem;
    height: 17rem;
    background-color: blue;
  }
  #ge-purp {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-352.jpg);
  }
  #english-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-352-2.jpg);
  }
  #conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-352-3.jpg);
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }
  .paragraphs {
    font-size: 0.8rem;
  }
}

@media only screen and (max-width: 974px) and (min-width: 924px) {
  .purple-page {
    display: flex;
  }
  .purple-page-text {
    width: 23rem;
  }
  .purple-page-image {
    width: 28rem;
    height: 15rem;
    background-color: blue;
  }
  #ge-purp {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-373.jpg);
  }
  #english-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-373-2.jpg);
  }
  #conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-373-3.jpg);
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }
  .paragraphs {
    font-size: 0.7rem;
  }
}

@media only screen and (max-width: 974px) and (min-width: 924px) {
  .purple-page {
    display: flex;
  }
  .purple-page-text {
    width: 23rem;

    padding-bottom: 2rem;
  }
  .purple-page-image {
    width: 27rem;
    height: 14rem;
    background-color: blue;
  }
  #ge-purp {
    background: url(line-396.jpg);
  }
  #english-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-2.jpg);
  }
  #conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-3.jpg);
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }
  .paragraphs {
    font-size: 0.9rem;
  }
}

@media only screen and (max-width: 923px) and (min-width: 485px) {
  .purple-page {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 3rem 0rem;
  }
  .purple-page-text {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    width: 23rem;
  }
  .purple-page-image {
    width: 27rem;
    height: 14rem;
    background-color: blue;
  }
  #ge-purp {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396.jpg);
  }
  #english-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-2.jpg);
  }
  #conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-3.jpg);
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }
  .paragraphs {
    font-size: 0.7rem;
  }
}

@media only screen and (max-width: 755px) and (min-width: 675px) {
  .purple-page {
    display: flex;
    flex-direction: column;
  }
  .purple-page-text {
    width: 23rem;
  }
  .purple-page-image {
    width: 27rem;
    height: 14rem;
    background-color: blue;
  }
  #ge-purp {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396.jpg);
  }
  #english-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-2.jpg);
  }
  #conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-3.jpg);
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }
  .paragraphs {
    font-size: 0.7rem;
  }
}

@media only screen and (max-width: 674px) and (min-width: 610px) {
  .purple-page {
    display: flex;
    flex-direction: column;
  }
  .purple-page-text {
    width: 23rem;
  }
  .purple-page-image {
    width: 27rem;
    height: 14rem;
    background-color: blue;
  }
  #ge-purp {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396.jpg);
  }
  #english-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-2.jpg);
  }
  #conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-3.jpg);
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }
  .paragraphs {
    font-size: 0.7rem;
  }
}

@media only screen and (max-width: 609px) and (min-width: 552px) {
  .purple-page {
    display: flex;
    flex-direction: column;
  }
  .purple-page-text {
    width: 23rem;
  }
  .purple-page-image {
    width: 27rem;
    height: 14rem;
    background-color: blue;
  }
  #ge-purp {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396.jpg);
  }
  #english-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-2.jpg);
  }
  #conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-3.jpg);
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }
  .paragraphs {
    font-size: 0.7rem;
  }
}

@media only screen and (max-width: 552px) and (min-width: 508px) {
  .purple-page {
    display: flex;
    flex-direction: column;
  }
  .purple-page-text {
    width: 23rem;
  }
  .purple-page-image {
    width: 27rem;
    height: 14rem;
    background-color: blue;
  }
  #ge-purp {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396.jpg);
  }
  #english-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-2.jpg);
  }
  #conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-3.jpg);
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }
  .paragraphs {
    font-size: 0.7rem;
  }
}

@media only screen and (max-width: 507px) and (min-width: 485px) {
  .purple-page {
    display: flex;
    flex-direction: column;
  }
  .purple-page-text {
    width: 23rem;
  }
  .purple-page-image {
    width: 27rem;
    height: 14rem;
    background-color: blue;
  }
  #ge-purp {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396.jpg);
  }
  #english-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-2.jpg);
  }
  #conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-3.jpg);
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }
  .paragraphs {
    font-size: 0.7rem;
  }
}

@media only screen and (max-width: 484px) and (min-width: 415px) {
  .purple-page {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 3rem 0rem;
  }
  .purple-page-image {
    width: 22rem;
    height: 11rem;
    background-color: blue;
  }
  #ge-purp {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396.jpg);
  }
  #english-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-2.jpg);
  }
  #conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-3.jpg);
  }
  .paragraphs {
    font-size: 0.7rem;
    width: 20rem;
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }
}

@media only screen and (max-width: 414px) and (min-width: 345px) {
  .titles-div {
    display: flex;
    justify-content: center;
  }
  .purple-page {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 3rem 0rem;
  }
  .purple-page-image {
    width: 20rem;
    height: 11rem;
    background-color: blue;
  }
  #ge-purp {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396.jpg);
  }
  #english-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-2.jpg);
  }
  #conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-3.jpg);
  }
  .paragraphs {
    font-size: 0.7rem;
    width: 20rem;
  }
}

@media only screen and (max-width: 344px) and (min-width: 280px) {
  .purple-page {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 3rem 0rem 3rem 0rem;
  }
  .purple-page-text {
    width: 16rem;
  }
  .purple-page-image {
    width: 14rem;
    height: 8rem;
    background-color: blue;
  }
  #ge-purp {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396.jpg);
  }
  #conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-3.jpg);
  }
  #english-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(line-396-2.jpg);
  }
  #social-media-icons {
    text-align: center;
    padding: 2.5%;
  }
  .titles-div {
    display: flex;
    justify-content: center;
  }

  .paragraphs {
    font-size: 0.7rem;
    /* padding-bottom: 2rem; */
  }
}

/* _________________________________________________________________________
YELLOW PAGE
_________________________________________________________________________ */

@media only screen and (max-width: 3000px) and (min-width: 0px) {
  .yellow-page {
    background-color: #fdda21;
    height: 39.5rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
  }
  .yellow-image {
    background-color: burlywood;
    height: 27.7rem;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    width: 60rem;
  }
  .yellow-title {
    padding: 0rem 3rem 3rem 0rem;
    font-size: 2rem;
  }
  #big-conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(big-convo.jpg);
  }
  #gender-equality-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(798b.jpg);
  }
}

@media only screen and (max-width: 1075px) and (min-width: 933px) {
  .yellow-page {
    background-color: #fdda21;
    height: 32.5rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
  }
  .yellow-image {
    background-color: burlywood;
    height: 22.8rem;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    width: 860px;
  }
  #big-conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(big-convo.jpg);
  }
  #gender-equality-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(840b.jpg);
  }
  .yellow-title {
    padding: 0rem 3rem 3rem 0rem;
  }
}

@media only screen and (max-width: 932px) and (min-width: 555px) {
  .yellow-page {
    background-color: #fdda21;
    height: 32.5rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
  }
  .yellow-image {
    background-color: burlywood;
    height: 27rem;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    width: 46.5rem;
  }
  #gender-equality-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(798b.jpg);
  }
  #big-conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(861b.jpg);
  }
  .yellow-title {
    padding: 0rem 1rem 1rem 0rem;
  }
}

@media only screen and (max-width: 931px) and (min-width: 682px) {
  .yellow-page {
    background-color: #fdda21;
    height: 28.5rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
  }
  .yellow-image {
    background-color: burlywood;
    height: 20rem;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    width: 40.89rem;
  }
  #gender-equality-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(861b.jpg);
  }
  .yellow-title {
    padding: 0rem 1rem 1rem 0rem;
  }
}

@media only screen and (max-width: 681px) and (min-width: 558px) {
  .yellow-page {
    background-color: #fdda21;
    height: 24.5rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
  }
  .yellow-image {
    background-color: burlywood;
    height: 17.2rem;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    width: 448px;
  }
  #gender-equality-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(861b.jpg);
  }
  #big-conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(861a.jpg);
  }
  .yellow-title {
    padding: 0rem 1rem 1rem 0rem;
  }
}

@media only screen and (max-width: 557px) and (min-width: 500px) {
  .yellow-page {
    background-color: #fdda21;
    height: 21.5rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
  }
  .yellow-image {
    background-color: burlywood;
    height: 15rem;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    width: 21.8rem;
  }
  #gender-equality-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(903b.jpg);
  }
  #big-conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(903a.jpg);
  }
  .yellow-title {
    padding: 0rem 1rem 1rem 0rem;
  }
}

@media only screen and (max-width: 499px) and (min-width: 0px) {
  .yellow-title {
    padding: 0rem 1rem 1rem 0rem;
  }
}

@media only screen and (max-width: 499px) and (min-width: 464px) {
  .yellow-page {
    background-color: #fdda21;
    height: 21.5rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
  }
  .yellow-image {
    background-color: burlywood;
    height: 10.5rem;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    width: 19.25rem;
  }
  #gender-equality-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(930b.jpg);
  }
  #big-conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(930a.jpg);
  }
  .yellow-title {
    padding: 0rem 1rem 1rem 0rem;
    font-size: 1.2rem;
  }
}

@media only screen and (max-width: 463px) and (min-width: 410px) {
  .yellow-page {
    background-color: #fdda21;
    height: 18.5rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
  }
  .yellow-image {
    background-color: burlywood;
    height: 10.5rem;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    width: 16.6rem;
  }
  #big-conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(951a.jpg);
  }
  #gender-equality-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(951b.jpg);
  }
  .yellow-title {
    padding: 0rem 1rem 1rem 0rem;
    font-size: 1rem;
  }
}

@media only screen and (max-width: 409px) and (min-width: 0px) {
  .yellow-page {
    background-color: #fdda21;
    height: 16.5rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
  }
  .yellow-image {
    background-color: burlywood;
    height: 10.5rem;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    width: 15.06rem;
  }
  #big-conservation-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(972a.jpg);
  }
  #gender-equality-image {
    background: linear-gradient(
        to bottom,
        rgba(245, 246, 252, 0.005),
        rgba(0, 0, 0, 0.5)
      ),
      url(972b.jpg);
  }
  .yellow-title {
    padding: 0rem 1rem 1rem 0rem;
    font-size: 1rem;
  }
}