.events-four {padding-top: 20px;}

.events-four  .bx-controls {
    position: absolute;
    top: -30px;
    right: 0;}

.events-four  .bx-controls-direction a {
    width: 20px;
    height: auto;
    top: 0;}

.events-four  .bx-controls-direction a.bx-prev { 
    background: url(/stylesheet/default/left-arrow.png) 50% 50% no-repeat;
    left: auto;
    background-size: 16px auto;
    right: 45px;}

.events-four  .bx-controls-direction a.bx-next { 
    background: url(/stylesheet/default/right-arrow.png) 50% 50% no-repeat;
    left: auto;
    background-size: 16px auto;
    right: 20px;}



/* Twitter */

[id*="twitter-stream-c"] {
  background: #8e62a0;
  color: #fff;
  text-align: center;
  padding: 20px 50px;
  display: none;
  margin: 0 0 30px;
  display: block;
  min-height: 125px;
}
[id="twitter-stream"] {
  margin-top: 30px;
}
[id*="twitter-stream"] a {
  color: #cef;
  text-decoration: underline;
}
[id*="twitter-stream"] a:hover {
  color:#fff;
}
[id*="twitter-stream"] ul, [id*="twitter-stream"] li {
  list-style:none;
  margin:0;
  padding:0;
}

/* - This week - */
/* Tabs */
[id="venue-tabs"] {
  list-style:none;
  margin:1px 0 0;
  padding: 0px 0px 0px 5px;
  background: #000;
}
[id="venue-tabs"] li {
  margin: 0 0px 0px 0;
  display: inline-block;
  vertical-align: top;
}
[id="venue-tabs"] li.tab-label {
  color: #fff;
  padding: 15px 10px;
}
@media all and (min-width: 768px) {
  [id="venue-tabs"] li.tab-label { display:none; }
}
@media all and (min-width: 992px) {
  [id="venue-tabs"] li.tab-label { display: inline-block; }
}
[id="venue-tabs"] li a {
  padding: 15px 10px;
  display: inline-block;
  color: #fff;
  cursor: pointer;
  transition: 0.2s ease all;
  -webkit-transition: 0.2s ease all;
}
[id="venue-tabs"] li a:hover { background: #d2d4d8; color:#000; text-decoration:none; }
[id="venue-tabs"] li a.active { background: #8e62a0; color:#fff; }
[id="tabs"] > div {display: none; overflow:hidden;position: relative;}
@media all and (min-width: 992px) {
  [id="tabs"] > div { height: 400px; }
}
[id="tabs"] > div.active {display: block;}
[id="tabs"] > div > a.more-link {
  position: absolute;
  background: rgba(130,98,160,0.75);
  padding: 10px;
  bottom:0;
  left:0;
  right:0;
  text-align: center;
  color: #fff;
  transition: 0.2s ease all;
  -webkit-transition: 0.2s ease all;
}
[id="tabs"] > div > a.more-link:hover {
  background: #76348b; color:#fff; text-decoration: none; cursor: pointer;
}
h3{
margin:auto;
}
[id="tabs"] .msl_eventlist {
  border-top: 1px solid #ccc;
}
[id="tabs"] .event_item {
  position: relative;
  padding: 15px 0 15px 80px;
  min-height: 50px;
  background: #eee;
  border-bottom: 1px solid #ccc;
  transition: 0.2s ease all;
  -webkit-transition: 0.2s ease all;
}
[id="tabs"] dl, [id="tabs"] dt, [id="tabs"] dd { margin:0; padding:0; }
[id="tabs"] .event_item img {
  position: absolute;
  left:15px;
  top:15px;
}
[id="tabs"] .event_item dd.msl_event_description, [id="tabs"] .event_item dd.msl_event_location { display:none; }
[id="tabs"] .event_item dt a.msl_event_name {
  font-weight: normal;
  display: block;
  margin-bottom: 3px;
  color: #000;
}
[id="tabs"] .event_item dt a:after {
  position: absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  content:'';
  background: transparent;
}
[id="tabs"] .event_item dt a:hover {
  text-decoration:none;
}
[id="tabs"] .event_item:hover {
  background: #ddd;
}
[id="tabs"] .event_item dd {
  font-size: 14px;
}

.follow-gap {
  margin-bottom: 30px;
}

/* SIgnposts */

.signpost {
  position: relative;
  margin-bottom: 30px;
}
.signpost span {
  position: absolute;
  bottom:0;
  left:0;
  background: #000;
  color: #fff;
  font-family: 'Fjalla One', sans-serif;
  padding: 10px 15px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

a.placeholder {
  display: block;
  padding: 12px 15px;
  margin: 0 0 15px;
  background: #8e62a0;
  text-transform: uppercase;
  font-size: 16px;
  border-bottom: 2px solid ##8e62a0;
  color: #fff;
  transition: 0.2s ease all;
  -webkit-transition: 0.2s ease all;
  line-height: 1.5;
  cursor: pointer;
}

a.placeholder:hover {
  text-decoration:none;
  background: #186496;
  border-color:#fff;
}

.club-links {
  margin:0; padding:0; list-style:none;
}
.club-links li {
  margin: 20px 0;
  padding: 0;
}

/* Event Calendar */

/* -----------Functional styles â€“ do not change these they are needed for the widget to function----------------- */
.msl_event_calendar .msl-cal-wrapper {
    position: relative;
    top: 0;
    left: 0;
}

.msl_event_calendar .msl-cal-hoverbox {
    position: absolute;
    top: 0;
    left: -6000px;
}

.msl_event_calendar td:hover .msl-cal-wrapper {
    z-index: 200;
}

/* need to specify base z-index too perhaps */
.msl_event_calendar table, .msl_event_calendar tr, .msl_event_calendar td, .msl_event_calendar .msl-cal-hoverbox dd, .msl_event_calendar .msl-cal-hoverbox dl, .msl_event_calendar .msl-cal-hoverbox dt {
    margin: 0;
    padding: 0;
    text-indent: 0;
}

/* zero all elements used in calendar styles*/
/* -----------Dimensions of calendar----------- */
.msl-eventcal-default {
    width: 100%;
}

.msl-eventcal-default td {
    height: 60px;
    text-align: center;
}

/*---- Whole calendar styling ----- */
.msl-eventcal-default {
}

/* border of outside of table */
.msl-eventcal-default td {
    border: 1px solid #fff;
}

/* border of cells */
/* ----------Month title--------------- */
.msl-eventcal-default .msl_event_calendar_title td {
    border: none;
    background-color: #000;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-family: 'Fjalla One', san-serif;
    font-size: 18px;
    font-weight: normal;
}

.msl-eventcal-default .msl_event_calendar_title td a {
    color: #fff !important;
}

/* ----------Day headers----------------- */
.msl-eventcal-default th {
    border: 1px solid #fff;
    height: 40px;
    text-align: center;
}

/* ------------Inactive dates--------------- */
.msl-eventcal-default td.month {
    background-color: #ffffff !important;
    color: #000000 !important;
}

.msl-eventcal-default td.othermonth {
    color: #999 !important;
    background-color: #ffffff !important;
}

/* ---------------Date with event attached--------------- */
.msl-eventcal-default td.msl_event_calendar_selected_day {
    background-color: #8e62a0 !important;
}

.msl-eventcal-default td.othermonth.msl_event_calendar_selected_day {
    background-color: #d4d2da !important;
}

.msl-eventcal-default td.msl_event_calendar_selected_day:hover .msl-cal-wrapper {
    color: #fff; background: transparent; cursor: pointer;
    
}

/* colour of text when hovered over - you need to specify background so that z-index works in IE */
.msl-eventcal-default td.msl_event_calendar_selected_day:hover {
    background-color: #5c3377 !important;
}

/* ---------------Eventlist box that appears----------------- */
body .msl-eventcal-default .msl-cal-hoverbox {
    padding: 0px;
    transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
    text-align: left;
    background: #5c3377;
    color: #fff;
    max-height:0;
    overflow:hidden;
    top: 33px;
    left: 0em;
    border: none;
    width: 300px;
}

.msl-eventcal-default td:hover .msl-cal-hoverbox {
    max-height: 500px;
    padding: 10px;
    width: 300px;
    top: 33px;
}

/* -------------- size and positioning of the hoverbox relative to the date ------------*/
/* add some opacity here */
/* ------------Events list ---------------- */
.msl-eventcal-default .msl-cal-hoverbox a {
    padding: 10px;
    display: block;
    color: #fff;
}

/* links in hoverbox */
.msl-eventcal-default .msl-cal-hoverbox a dd {
    padding-left: 0px;
}

.msl-eventcal-default .msl-cal-hoverbox a:hover {
    background: #e9e9e9;
    color: #000;
    text-decoration: none;
}

/* hoverover colour for links in hoverbox */
.msl-eventcal-default .msl-cal-hoverbox dt {
    font-weight: bold;
    font-size: 12px;
}

/* colour and styles for event times */

.hide-this {
    display:none;
}

#banner-message-container {
  background: #8e62a0;
  color: #fff!important;
  text-align: center;
  padding: 20px 50px;
  margin: 0 0 30px;
  display: block;
  min-height: 125px;
}

#banner-message {
    margin: 0.5rem auto;
}

#banner-message a {
    color: #ffffff!important;
}

#banner-message h1 {
    border-bottom: 0 solid transparent!important;
}