/*  Styling for sponsor display on the home page */
.flex-sponsors {
  display: flex;
  flex-wrap: wrap;
  background-color: #bcdbf6;
  text-align: center;
  font-family: "Times New Roman", Times, serif;
  justify-content: center;
  align-items: baseline;
}

.flex-sponsors>figure {
  padding: 10px;
}

img.kilimanjaro {
  height: 150px;
}

img.serengeti {
  height: 125px;
}

img.sahara {
  height: 100px;
}

img.nile {
  height: 75px;
}

img.victoria {
  height: 50px;
}

img.event {
  height: 75px;
}

figure > img {
  width: auto;
}

.amount {
  font-size: 0.75em;
  font-family: arial, sans-serif;
  font-weight: bold;
}

/* =============================================== */
/*   Sponsor display section */
/* =============================================== */
/*  background colors */
/* kilimanjaro - img/diamond-background.png) &  #e9f3fc  */
/* sahara      #fff7cc  */
/* nile    #f2f2f2  */
/* victoria    #efd9c2  */
/* serengeti  #dcdcdc; */
/* ================================================ */

/* figcaption.category {
  font-family: arial, sans-serif;
  color: #196db6;
} */

.sponsor-display {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  border-bottom: 0.7em solid #196db6;
  text-align: center;
  align-items: center;
  gap: 1em 3em;
  
  }

  .sponsor-display-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); /* Flexible columns */
    gap: 16px; 
    align-items: center;
    justify-items: center;
    }

.sponsor-display figcaption {
  font-family:  Calibri, sans-serif;
  color: #125087;
  font-size: 1.5em;
  text-decoration: none;
}

.sponsor-display img {
  padding-top: 15px;
}
.sponsor-display-grid img {
  padding-top: 15px;
}

.sponsor-container    {
  max-width: 975px;
  border: 1px solid #125087;
  border-radius: 10px;
  margin:auto;
  gap: 2em;
}

.sponsor-container  a {
  text-decoration: none;
}

.kilimanjaro {
  background-image: url("../img/kilimanjaro-ultrawide.png");
  background-size: cover;
  background-position:  35%;
  }
 
  .kilimanjaro figcaption {
  color: black;
  background-color: white;
  font-family: Helvetica, Arial, sans-serif;
  }

.sahara {
  background-image: url("../img/sahara-ultrawide.png");
  background-size: cover;
}

.nile {
  background-image: url("../img/nile-ultrawide.png");
  background-size: cover;
}

.serengeti {
  background-image: url("../img/serengeti-ultrawide.png");
  background-size: cover;
}

.victoria {
  background-image: url("../img/victoria-falls-ultrawide.png");
  background-size: cover;
  }

.event {
  border-bottom: 0px;
}

.sponsor-category {
  text-align: left;
  color: #196db6;
  font-size: 1.7em;
}

/* =============================================== */
/*   Sponsor solicitation section                  */
/* =============================================== */

.sold {   
  position: absolute;
  left: 200px;
  opacity: 50%;
  transform: rotate(340deg);
  font-size: 800%;
  color: red;
}
}

.draft {   
  position: absolute;
  top: -200px;
  left: 10%;
  opacity: 20%;
  transform: rotate(340deg) scale(0.6);
  font-size: 1800%;
  color: red;
}

.position-rel {
  position: relative;
}


.sponsor-card {
  display: grid;
  margin-inline: auto;
  grid-template-columns: 1fr 3fr;
  border-radius: 20px 20px 20px 20px;
  width: 70%;
  margin-block: 1em;
  
}

.sponsor-card-event {
  display: grid;
  margin-inline: auto;
  grid-template-columns: repeat( auto-fill, minmax(40ch, 1fr) );
  width: 95%;
  margin-block: 1em;
}

.sponsor-card-event ul {
  min-width: 30%;
  position: relative;
  }

.sponsor-card > img {
  width: 100%;
  height: 100%;
  border-radius: 15px 0 0 15px;
  object-fit: cover;
}

@media screen and (max-width: 800px) {
  .sponsor-card > img {
    display: none;
  }
  .sponsor-card {
    display: block;
    width: 95%;
  }
  .sold {   
    transform: rotate(340deg) scale(1.1);
  }
  .sponsor-card-event {
    display: grid;
    margin-inline: auto;
    grid-template-columns: 1fr;
    width: 90%;
    margin-block: 1em;
  }

}

.sponsor-card ul li:nth-of-type(1), .sponsor-card-event ul li:nth-of-type(1) {
  font-weight: 900;
  font-size: large;
  list-style-type: none;
  width: 95%;
  border-bottom: 2px solid var(--ashe-background-medium);
}

.sponsor-card ul li {
  list-style-type: circle;
  color: black;
}