@font-face {
  font-family: 'Vida Pro 32';
  src: url('../../fonts/Vida32Pro.eot');
  src: url('../../fonts/Vida32Pro.eot?#iefix') format('embedded-opentype'), url('../../fonts/Vida32Pro.woff') format('woff'), url('../../fonts/Vida32Pro.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'vida_32_probold';
  src: url('../../fonts/vida32pro-boldwebfont.eot');
  src: url('../../fonts/vida32pro-boldwebfont.eot?#iefix') format('embedded-opentype'), url('../../fonts/vida32pro-boldwebfont.woff') format('woff'), url('../../fonts/vida32pro-boldwebfont.ttf') format('truetype'), url('../../fonts/vida32pro-boldwebfont.svg#vida_32_probold') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'vida_32_proregular';
  src: url('../../fonts/vida32prowebfont.eot');
  src: url('../../fonts/vida32prowebfont.eot?#iefix') format('embedded-opentype'), url('../../fonts/vida32prowebfont.woff') format('woff'), url('../../fonts/vida32prowebfont.ttf') format('truetype'), url('../../fonts/vida32prowebfont.svg#vida_32_proregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
:root {
  --event-general-padding: 4vw;
  --event-general-gap: 4%;
  --archi-blue: #0066FF;
  --gray: #858585;
  --right-col-width: 30%;
  --col-gap: 60px;
  --col-sup-gap: 30px;
}
div {
  box-sizing: border-box;
}
.event-wrapper {
  width: calc(100vw - 2*var(--event-general-padding));
  max-width: 1540px;
  margin: var(--col-gap) auto 0 auto;
  display: grid;
  grid-gap: var(--col-gap);
  column-gap: var(--event-general-gap);
  grid-template-columns: 1fr;
  grid-template-areas: "main" "ads" "press" "events";
}
.event-wrapper .event-info {
  grid-area: main;
}
.event-wrapper .ads-space {
  grid-area: ads;
}
.event-wrapper .linked-press-space {
  grid-area: press;
}
.event-wrapper .linked-events-space {
  grid-area: events;
}
@media (min-width: 640px) {
  .event-wrapper {
    row-gap: var(--col-gap);
    grid-template-columns: 1fr 240px;
    grid-template-rows: auto auto 1fr;
    grid-template-areas: "main ads" "main press" "main events";
  }
}
@media (min-width: 960px) {
  .event-wrapper {
    grid-template-columns: 240px 1fr 240px;
    grid-template-rows: auto 1fr;
    grid-template-areas: "press main ads" "events main ads";
  }
}
