/* That's 17px, having set font size on HTML element below */
/* That's 19.5px, having set font size on HTML element below */
/* That's 24px */
/* That's 125% of the base font size for Alright Sans */
#events {
  background-color: #8bb6d7;
  background-image: linear-gradient(#d86847 50%, #8bb6d7 67.5%); }
  #events #feature-primary {
    background-image: none;
    padding-top: none !important; }
    #events #feature-primary #feature-primary-02 {
      padding-top: 1.2rem; }
      #events #feature-primary #feature-primary-02 h2 {
        width: auto; }
      #events #feature-primary #feature-primary-02 p {
        margin-bottom: 0; }
      #events #feature-primary #feature-primary-02 img {
        float: left;
        width: 33.333%; }
  #events h2, #events h3 {
    text-transform: uppercase !important; }
  #events h2 {
    background-image: none;
    color: white;
    font-size: 63.75px;
    height: auto !important;
    line-height: 7.2rem;
    margin-bottom: 0 !important;
    text-indent: 0 !important;
    font-family: "futura-pt", sans-serif;
    font-weight: 300 !important;
    font-style: normal; }
  #events h3 {
    font-size: 21.25px;
    color: #191d19;
    margin-bottom: 2.4rem;
    margin-top: 0;
    position: relative !important;
    right: 0 !important;
    font-family: "futura-pt", sans-serif;
    font-weight: 500 !important;
    font-style: normal; }
    #events h3 span {
      color: white; }
  #events h3 + p span {
    color: white; }
  #events h4 {
    position: absolute;
    right: 1000000px; }
  #events .event {
    background-image: linear-gradient(#4c95cb, #87b8dc);
    padding: 1.2rem;
    margin-bottom: 2.4rem;
    box-shadow: 0.075rem 0.075rem 0.15rem #252b25; }
    #events .event h5, #events .event h6 {
      font-size: 23.90625px;
      line-height: 2.1rem;
      text-transform: uppercase;
      font-family: "futura-pt-bold", sans-serif;
      font-weight: 700 !important;
      font-style: normal; }
    #events .event h5 {
      color: white; }
    #events .event h6 {
      color: #c2dbed;
      margin-bottom: 0.6rem; }
    #events .event .venue {
      margin-bottom: 0.6rem; }
    #events .event .extra {
      font-size: 1.4875rem;
      line-height: 2.1rem;
      padding-bottom: 1.2rem;
      font-family: 'Alright-v2-Normal-Medium'; }
    #events .event .extra + p, #events .event .venue + p {
      margin-bottom: 0; }
      #events .event .extra + p button, #events .event .venue + p button {
        margin-bottom: 0.6rem; }
      #events .event .extra + p a:link, #events .event .extra + p a:visited, #events .event .extra + p a:hover, #events .event .extra + p a:active, #events .event .venue + p a:link, #events .event .venue + p a:visited, #events .event .venue + p a:hover, #events .event .venue + p a:active {
        color: white; }
  #events figure img {
    float: right;
    width: 60svw; }

@media only screen and (min-width: 568px) and (orientation: landscape) {
  #events #feature-primary {
    height: auto; }
    #events #feature-primary #feature-primary-02 {
      grid-column: 3 / span 14;
      height: auto; }
  #events .event {
    float: left;
    height: 100%;
    width: calc(95% / 2); }
  #events #event_02 {
    margin: 0 2.5%; }

  figure img {
    margin-top: 2.4rem;
    position: relative;
    right: calc((100svw / 18) * 2);
    width: 30svw !important; } }
@media only screen and (min-width: 768px) and (orientation: portrait) {
  #events #feature-primary {
    height: auto; }
    #events #feature-primary #feature-primary-02 {
      grid-column: 3 / span 14;
      height: auto; }
  #events .event {
    float: left !important;
    height: 100%;
    width: calc(95% / 3) !important; }
  #events #event_02 {
    margin: 0 2.5%; }

  figure img {
    margin-top: 2.4rem;
    position: relative;
    right: calc((100svw / 18) * 2);
    width: 30svw !important; } }
@media only screen and (min-width: 1024px) and (orientation: landscape) {
  #events #feature-primary #feature-primary-02 {
    grid-column: 5 / span 10; }

  figure img {
    margin-top: 2.4rem;
    position: relative;
    right: calc((100svw / 18) * 4);
    width: 30svw !important; } }
/* iPad Pro portrait and above */
@media only screen and (min-width: 1024px) and (orientation: portrait) {
  #events #feature-primary #feature-primary-02 {
    grid-column: 5 / span 10; }

  figure img {
    margin-top: 2.4rem;
    position: relative;
    right: calc((100svw / 18) * 4);
    width: 30svw !important; } }