body {
  background-color: #80b8b1;
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.container {
  width: 90%;
  height: 100%;
  margin: 0 auto;
  text-align: center;
}

img {
  border-radius: 5px;
}

.container img {
  display: block;
  margin: 0 auto;
  width: 100%;
  filter: brightness(95%);
}

div .SeeExercises {
  display: block;
  margin: 0 auto;
  text-align: center;
  width: 200px;
  background-color: black;
  border-radius: 5px;
  color: white;
  margin-top: 15px;

}

.exercise-link {
  display: block;
  margin: 0 auto;
  color: #BB4C9C;
  padding: 20px;
  font-weight: 800; 
  text-transform: uppercase;
  margin-bottom: 30px;
}

a {
text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

main {
  border-radius: 10px;
}

section img {
width: 90%;
padding: 10px;
}

.text-section {
  border-radius: 5px;
  width: 90%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  background-color: rgba(228, 222, 222, 0.955);
  margin-bottom: 30px;
}

.right-section {
  margin-top: 20%;
}

div .inner-container {
  background: white;
  color: black;
  border-radius: 10px;
  margin: 5px;
  padding: 10px;
  opacity: 1 !important;
}

.image-section {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.image-section img {
  width: 75%;
  margin: 0 auto;
  padding: 10px;
  display: block;
  margin: 0 auto;
}

h3 {
  color: #BB4C9C;
  text-align: center;
  font-size: 14px;
}

div .card {
  display: block;
  background-color:white;
  margin: 10px;
  box-shadow: 5px 5px 5px rgb(39, 36, 36);
  text-align: center;
  width: 90%;
  padding: 10px;
}

.card-a {
  display: block;
  text-align: center;
  padding: 10px;
  border-radius: 5px;
  background: black;
  color: #BB4C9C;
  font-weight: bolder;
  width: 95%;
  text-transform: uppercase;
}

.vid-embeds {
  display: block;
  margin: 0 auto;
  padding: 10px;
}

iframe {
    display: block;
    margin: 0 auto;
  }

footer {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  padding: 12px;
  color: black;
  --s: 31px; 
  --c1: #b2b2b2;
  --c2: #ffffff;
  --c3: #d9d9d9;
  --_g: var(--c3) 0 120deg,#0000 0;
  background:
    conic-gradient(from -60deg at 50% calc(100%/3),var(--_g)),
    conic-gradient(from 120deg at 50% calc(200%/3),var(--_g)),
    conic-gradient(from  60deg at calc(200%/3),var(--c3) 60deg,var(--c2) 0 120deg,#0000 0),
    conic-gradient(from 180deg at calc(100%/3),var(--c1) 60deg,var(--_g)),
    linear-gradient(90deg,var(--c1)   calc(100%/6),var(--c2) 0 50%,
                          var(--c1) 0 calc(500%/6),var(--c2) 0);
  background-size: calc(1.732*var(--s)) var(--s);
}

footer a {
  color: black;
  text-decoration: none;
}

footer div {
  height: 90%;
  padding-top: 0;
}

@media (max-width: 900px){

  main {
    display: grid;
    grid-template-columns: 1fr;
  }

  section {
    display: block;
    width: 90%;
    padding-bottom: 30px;
  }

  section img {
    padding-top: 70px;
  }

  .image-section {
    display: grid;
    grid-template-columns: 1fr;
  }

  .image-section img {
    width: 90%;
  }

}