:root {
  --color-gris: #333;
  --color-gris-clair: #999;
}

 

 

.container_event {
  max-width: 42rem;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.container_event:not(.error) {
  background-color: white;
  border-radius: .375rem;
  border: 1px solid grey;
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
  padding: 1rem;
  margin-top: 1rem;

  & .event {
    display: block;
    text-align: left;
    margin-bottom: 2rem;
    font-size: 0.8em;

    h2 {
      font-size: 1.3rem;
    }

    .container_dates {
      display: flex;
      align-items: center;
    }

    .container_dates_number {
      background: black;
      display: flex;
      border-radius: 9999px;
      width: 40px;
      min-height: 40px;
      color: white;
      text-align: center;
      font-size: 1.2em;
      font-weight: bold;
      padding: 5px;
      align-items: center;
      justify-content: space-around;
      flex-direction: column;
    }

    .date_end_number {
      border-top: 1px solid white;
    }

    .dates_plain_text {
      flex-direction: column;
      padding-left: 1rem;

      .day_plain_text {
        font-weight: bold;
      }
    }

    .timezone {
      color: grey;
    }

    .address,
    .description,
    .url,
    .url a {
      color: grey;
      margin-top: 0.5rem;
    }

    p {
      margin: 0;
    }
  }

  ul.calendar_links {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;

    li {
      margin-bottom: 1rem;
    }

    .apple a,
    .google a,
    .ics a,
    .yahoo a,
    .weboutlook a {
      background-repeat: no-repeat;
      background-size: 15px;
      padding-left: 28px;
      background-position: 6px center;
      border-radius: 7px;
      border: 1px dashed grey;
    }

    .apple a {
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 56.7 56.7' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M-1-1h582v402H-1z' fill='none'/%3E%3Cpath d='M41.8 30.5c-.1-6.2 5.1-9.2 5.3-9.4-2.9-4.2-7.4-4.8-9-4.9-3.8-.4-7.5 2.3-9.4 2.3s-4.9-2.2-8.1-2.1c-4.2.1-8 2.4-10.2 6.2-4.4 7.5-1.1 18.6 3.1 24.7 2.1 3 4.5 6.3 7.8 6.2 3.1-.1 4.3-2 8.1-2s4.8 2 8.1 2c3.4-.1 5.5-3 7.5-6 2.4-3.5 3.3-6.8 3.4-7-.1-.1-6.6-2.5-6.6-10zm-6.2-18.3c1.7-2.1 2.9-5 2.6-7.9-2.5.1-5.5 1.6-7.2 3.7-1.6 1.8-3 4.8-2.6 7.6 2.6.3 5.5-1.3 7.2-3.4z' fill='%23606060'/%3E%3C/svg%3E")
    }

    .google a {
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 128 128' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h128v128H0z' fill='none'/%3E%3Cpath d='M27.6 64c0-4.2.7-8.1 1.9-11.9L7.9 35.6C3.7 44.2 1.4 53.8 1.4 64S3.8 83.8 8 92.3l21.6-16.5c-1.3-3.7-2-7.7-2-11.8' fill='%23fbbc05'/%3E%3Cpath d='M65.5 26.2c9 0 17.2 3.2 23.6 8.4L107.7 16C96.3 6.1 81.8 0 65.5 0 40.1 0 18.4 14.5 7.9 35.6l21.6 16.5c5-15.1 19.1-25.9 36-25.9' fill='%23ea4335'/%3E%3Cpath d='M65.5 101.8c-16.8 0-31-10.9-35.9-25.9L7.9 92.4C18.4 113.5 40.1 128 65.5 128c15.6 0 30.6-5.6 41.8-16L86.7 96.2c-5.7 3.7-13 5.6-21.2 5.6' fill='%2334a853'/%3E%3Cpath d='M126.6 64c0-3.8-.6-7.9-1.5-11.6H65.5v24.7h34.4c-1.7 8.4-6.4 14.9-13.1 19.1l20.5 15.8c11.7-10.9 19.3-27.1 19.3-48' fill='%234285f4'/%3E%3C/svg%3E")
    }

    .ics a {
      background-image: url('/assets/images/ics.svg');
    }

    .yahoo a {
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1792 1792' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M-1-1h582v402H-1z' fill='none'/%3E%3Cpath d='M987 957l13 707c-41.3-7.3-76.3-11-105-11-27.3 0-62.3 3.7-105 11l13-707c-26.7-46-82.8-144.5-168.5-295.5S476.7 385.7 418 287 299 92.7 237 0c38.7 10 74.7 15 108 15 28.7 0 65.7-5 111-15 42 74 86.5 150.5 133.5 229.5s102.7 171.2 167 276.5S867 687 895 733c24.7-40.7 61.2-99.8 109.5-177.5s87.5-141 117.5-190 65-107.7 105-176S1302.7 58 1334 0c36 9.3 71.7 14 107 14 37.3 0 75.3-4.7 114-14-18.7 26-38.7 55.5-60 88.5s-37.8 59.2-49.5 78.5-30.5 51.3-56.5 96-42.3 72.7-49 84c-97.3 165.3-215 368.7-353 610z' fill='%234a089f'/%3E%3C/svg%3E")
    }

    .weboutlook a {
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M-1-1h582v402H-1z' fill='none'/%3E%3Cg fill='%23daa603'%3E%3Cpath d='M644.9 764.4V492.7c19.3 13.3 37.4 25.6 55.4 38 16.2 11.1 18.9 11 35.6-.1 92.5-61.5 185-122.9 277.5-184.4 2.8-1.9 5.7-3.6 9.8-6.1.3 4.2.8 7.4.8 10.5 0 118.2.1 236.4 0 354.7 0 39.3-19.9 59.1-59 59.1zm.7-547.5h336.2c19.4 0 34.4 11.9 40.5 30.5 2.7 8.2 0 12.2-6.7 16.6-84.1 56.3-168 112.9-252 169.4-12 8.1-24.1 15.9-35.9 24.3-6.4 4.6-12.2 4.8-18.8.5-19.2-12.4-38.7-24.2-57.8-36.7-3.2-2.1-6.5-6.9-6.5-10.4-.3-63.5-.2-127-.1-190.5 0-.8.4-1.5 1.1-3.7zM596.7 1024C397.6 982.3 199.3 940.8.3 899.2v-13.1c0-252.5.1-505-.3-757.5 0-10.5 2.8-14.1 13-16 159.1-30.4 318.2-61.2 477.3-92C525.4 13.7 560.5 7 596.7 0zM438 511c-.4-41.6-6.1-80-26.7-114.9-16.6-28.1-39-49.4-71.3-58.6-62.8-17.9-122.8 11.5-152.4 75-18.9 40.7-23 83.9-19.3 128.1 3.2 38.3 14.3 73.7 39 104 49.1 60.2 138.4 60.6 188.2.8 32.9-39.6 41.9-86.7 42.5-134.4z'/%3E%3Cpath d='M232.9 511.9c-.1-29.7 3.9-58.4 20.7-83.8 15.5-23.5 39-33.1 64.9-26.6 20.1 5 32.3 19.3 40.4 37.2 13.8 30.7 16.2 63.3 12.1 95.9-2.3 18.1-7.5 36.5-14.8 53.2-9.5 21.6-27.8 34-52.2 34.5-24.6.5-41.7-12.2-53.6-32.6-14.1-23.9-17.5-50.5-17.5-77.8z'/%3E%3C/g%3E%3C/svg%3E")
    }
  }
}

header {
  margin-top: 3rem;
}

.shareButton {
  margin: 0;
}

#shareButton {
  color: grey;
}

footer {
  margin: 1rem;

  ul {
    display: flex;
    padding: 0;
    flex-wrap: wrap;
    justify-content: space-between;

    li,
    li a {
      color: var(--color-gris-clair);
      list-style: none;
      font-size: 0.8rem;
      margin: 0.5rem;
    }
  }
}

.icon {
  display: inline-block;
  height: 17px;
  width: 17px;
  float: left;
  margin-right: 2px;

  &.icon-link {
    background-image: url('/assets/images/link.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
  }

  &.icon-location {
    background-image: url('/assets/images/location.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
  }
}

.main {
  min-height: 50vh;
}

.alert {
  padding: 15px;
  margin-bottom: 20px;
  border-radius: 4px;
  color: #8a6d3b;
  background-color: #fcf8e3;
  border-color: #faebcc;
}

.presentation {
  margin-top: 1rem;

  h3 {
    margin-top: 1rem;
    font-size: 1.4rem;
    background: linear-gradient(90deg, rgba(240, 122, 18, 1) 0%, rgba(184, 34, 92, 1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  h4 {
    font-size: 1.3rem;
    margin-left: 1rem;
    background: linear-gradient(90deg, rgba(240, 122, 18, 1) 0%, rgba(184, 34, 92, 1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

}

/* Form wizard */
.nav-tabs {
  margin-bottom: 1rem;
}

.tab-container {
  border: 1px solid grey;
  padding: 0.5rem;
  border-radius: 5px;
}

.form-validation {
  margin-top: 1rem;
}

.form-control.description {
  height: auto;
}

.form-floating,
.input-group,
.form-check {
  margin-bottom: 0.5rem;
}

.input-dates {
  flex-direction: column;

  @media screen and (min-width: 576px) {
    flex-wrap: nowrap;
    flex-direction: inherit;

    div:not(:last-child) {
      margin-right: 1rem;
    }
  }
}