#events {
  display: flex;
  flex-flow: wrap;
  list-style-type: none; }
  #events .shape1::before {
    background: url(/image/shape/event/1.svg) no-repeat; }
  #events .shape2::before {
    background: url(/image/shape/event/2.svg) no-repeat; }
  #events .shape3::before {
    background: url(/image/shape/event/3.svg) no-repeat; }
  #events .shape4::before {
    background: url(/image/shape/event/4.svg) no-repeat; }
  #events .shape5::before {
    background: url(/image/shape/event/5.svg) no-repeat; }
  #events .event {
    position: relative;
    min-width: 508px;
    width: 508px;
    background-color: white;
    margin: 0 15px 30px 15px;
    display: flex;
    flex-direction: column;
    padding: 15px;
    border-radius: 5px;
    box-shadow: rgba(136, 165, 191, 0.48) 6px 2px 16px 0px, rgba(255, 255, 255, 0.8) -6px -2px 16px 0px; }
    #events .event::before, #events .event span::before {
      content: "";
      position: absolute;
      z-index: -1;
      width: 116%;
      height: 128%;
      background-position: 0px 0px;
      top: -13%;
      left: -8%;
      display: block;
      -moz-animation: fadeInFromNone 3s infinite ease-out alternate;
      opacity: 0.3; }
    #events .event h2 {
      text-transform: capitalize;
      margin-bottom: 15px; }
    #events .event .summary {
      margin-bottom: 30px;
      flex: 1 0 auto; }
    #events .event img {
      width: 100%;
      margin-top: 15px;
      border-radius: 5px;
      box-shadow: rgba(136, 165, 191, 0.48) 6px 2px 16px 0px, rgba(255, 255, 255, 0.8) -6px -2px 16px 0px; }
    #events .event .contentButtom a {
      display: flex;
      align-items: center;
      justify-content: center;
      margin-top: 15px;
      border: 1px dotted #cc21e94f;
      padding-top: 10px;
      padding-bottom: 10px;
      width: 100%;
      text-transform: capitalize;
      border-radius: 5px;
      box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px; }
      #events .event .contentButtom a span {
        background-color: #001fff;
        background-image: linear-gradient(45deg, #3b8f6b, #5307ef);
        background-size: 100%;
        -webkit-background-clip: text;
        -moz-background-clip: text;
        -webkit-text-fill-color: transparent;
        -moz-text-fill-color: transparent; }

@-webkit-keyframes fadeInFromNone {
  0% {
    opacity: 0.3; }
  100% {
    opacity: 1; } }

@-moz-keyframes fadeInFromNone {
  0% {
    opacity: 0.3;
    transform: height(100%); }
  100% {
    opacity: 1;
    transform: scaleY(1.2); } }

@-o-keyframes fadeInFromNone {
  0% {
    opacity: 0.3; }
  100% {
    opacity: 1; } }

@keyframes fadeInFromNone {
  0% {
    opacity: 0.3; }
  100% {
    transform: scaleY(1.05);
    transform: scaleX(1.05);
    opacity: 1; } }