@charset "UTF-8";
.event {
    width: 80%;
    background-color:#ffffff;
    margin: auto;
    margin-bottom: 2%;
    padding: 2%;
    transition: all .25s;
    -webkit-transition: all .25s;
    -moz-transition: all .25s;
    -o-transition: all .25s;
}
.event.hover{
  color:#fbfbfb;
  border-color:#282828;
  background-color:#282828;
  cursor:pointer;
}

.event-button a {
    color: #fbfbfb;
    border-color: #282828;
    background-color: #282828;
}
.event-button a:hover {
    color: #282828;
    border-color: #282828;
    background-color: #fbfbfb;
}
.event-headline {
    font-weight: bold;
    font-size: 1.5em;
    margin-top: 0;
}
.event-date {
    margin-bottom: 0;
}
.event-time {
    margin: 0;
}
.event-location {
    margin-top: 0;
}
.event-left {
    display: inline-block;
    width: 80%;
    text-align: left;
    vertical-align: top;
}
.event-right {
    display: inline-block;
    width: 18%;
    vertical-align: top;
}
.month-label {
    font-size: 2em;
    margin-left: 2%;
    font-weight: bold;
}
.event-image {
    width: 50%;
    float: left;
    margin: 0 2% 0 0;
}
.event-image img{
  width:100%;
}
@media screen and (max-width:850px), only screen
and (min-device-width : 768px)
and (max-device-width : 1024px), only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 2), only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 1), only screen
and (min-device-width : 375px)
and (max-device-width : 667px), only screen
and (min-device-width : 414px)
and (max-device-width : 736px), only screen
and (min-device-width : 320px)
and (max-device-width : 568px), only screen
and (min-device-width : 320px)
and (max-device-width : 480px){
  .event-left{
    width:70%;
  }
  .event-right{
    width:28%;
  }
}
@media screen and (max-width:700px), (max-device-width : 667px), only screen
and (min-device-width : 414px)
and (max-device-width : 736px), only screen
and (min-device-width : 320px)
and (max-device-width : 568px), only screen
and (min-device-width : 320px)
and (max-device-width : 480px){
  .event {
    width: 94%;
  }
  .event-left{
    width:94%;
  }
  .event-right {
    width: 94%;
    margin-bottom: 5%;
}
}