.content {
  margin-bottom: 20px;
}

h2 {
    padding: 0px 0 15px;
    margin: 0;
    border-bottom: 1px solid #ccc;
    text-align: center;
    font-size: 24px;
   font-family:rift,Arial,sans-serif;
   color:#0397D6;
    font-weight: normal;
}

/* News banner  */
[id="slider"] .msl-item { text-align: center; }
[id="slider"] .news_all { display:none; }
[id="slider"] .msl-item h3 { display:none; }

/* Sabbs */

[id="sabbs"] {
  margin: 30px -15px;
  text-align: center;
}
[id="sabbs"] > div {
  text-align: center; padding: 0 15px; max-width: 49%; display: inline-block;
  vertical-align: top;
  margin-bottom: 20px;
}


[id="sabbs"] p, [id="sabbs"] .twitter { font-size:12px; margin: 0;}
[id="sabbs"] strong { font-size:14px;}

@media all and (min-width:480px) {
  [id="sabbs"] > div { max-width: 31%;}
}

@media all and (min-width:768px) {
[id="sabbs"] {
  display: flex;
}
[id="sabbs"] > div {
  flex-grow: 1;
  position: relative;
  max-width: 50%;
  margin-bottom:0;
}
[id="sabbs"] > div img {

}
[id="sabbs"] p { font-size:12px; margin: 0;}
[id="sabbs"] strong { font-size:14px;}
}

@media all and (min-width:768px) {
[id="sabbs"] {

}
[id="sabbs"] > div {
  width: 20%;
}
[id="sabbs"] p {font-size:16px;margin: 0 0 5px;line-height: 1.3;}
[id="sabbs"] strong { font-size:16px;}
}

.msl_blog_description, .msl_blog_postcount, .msl_blog_lastpostdate, .msl_blog_lastcommentdate, [id="sabbs"] span { display:none; }

.msl-blog-image { position: relative; margin: 0 0 10px; }
.msl-blog-image:before, .msl-blog-image:after {
  content: '';
  position: absolute;
  z-index: 10;
  border-style: solid;
  border-color: transparent transparent white;
  border-width: 40px 80px;
  bottom: 0px;
  left:50%;
  transform: translateX(-50%);
  transition: 0.2s ease all;
  -webkit-transition: 0.2s ease all;
}
.msl-blog-image:after {  
  border-width: 25px 50px;
}
.msl-blog-image:hover:after {  
  border-width: 30px 60px;
}

[id="sabbs"] > div:nth-of-type(5n+1) .msl-blog-image:after {border-bottom-color: #C6093A;}
[id="sabbs"] > div:nth-of-type(5n+2) .msl-blog-image:after { border-bottom-color:#28398C; }
[id="sabbs"] > div:nth-of-type(5n+3) .msl-blog-image:after { border-bottom-color:#5C2A9D; }
[id="sabbs"] > div:nth-of-type(5n+4) .msl-blog-image:after { border-bottom-color:#ED3488; }
[id="sabbs"] > div:nth-of-type(5n+5) .msl-blog-image:after { border-bottom-color:#86BC2D; }

/* events */
.eventlist h2 + div{margin-top:20px;}

/* Youtube scroller */
.blackout {
  background: rgba(255,255,255,0.5);
  position: fixed;
  top:0;
  left:0;
  right:0;
  bottom:0;
  z-index: 10;
  display:none;
  cursor: pointer;
    transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
}
.blackout:hover {
  background: rgba(255,255,255,0.25);
}
.yt-player {
  position: fixed;
  left:50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  max-width: 90%;
  z-index: 11;
  padding-top: 50%;
  width: 1280px;
  display:none;
}
.blackout:hover + .yt-player {
  opacity: 0.5;
}
.yt-player iframe {
  position: absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  height: 100%;
  width: 100%;
  border: none;
  }

ul[id="videos"] {}
ul[id="videos"] li {
  position:relative;
  cursor: pointer;
}
ul[id="videos"] li img {
  display: block;
  margin: -9.4% 0;
}
ul[id="videos"] li span {
    position: absolute;
    bottom: 10px;
    left: 15px;
    padding: 6px 8px;
    color: #fff;
    background: #E31B23;
    right: 15px;
    transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
    font-size: 12px;
}
ul[id="videos"] li:hover span {
    background: #0397D6;
}

@media all and (min-width:480px) {
 ul[id="videos"] li img {
  display: block;
 } 
 ul[id="videos"] li span {
    bottom: 15px;
    font-size: 14px;padding: 10px;
 }
 ul[id="videos"] li:hover span {
    background: #0397D6;
    bottom: 20px;
 }
 ul[id="videos"] li span:before {
    font-size: 12px;
    margin: 0 10px 0 5px;
    content: "\f04b";
    font-family: FontAwesome;
 }
}



/* social icons */
.social-box i{
    font-size: 4rem;
    text-align: center;
    display: block;
    color: #0397d6;
    margin-bottom: 5px;
}

/* social iframes */

.social-box iframe {
    width: 1px !important;
    min-width: 100% !important;
}


/* VIDEOS */
/* Pop up */
.popup-overlay {
    position: fixed;
    width: 80%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 999;
    visibility: hidden;
}

.popup-overlay.active {
  /*displays pop-up when "active" class is present*/
  visibility: visible;
  text-align: center;
}

.popup-content,
.popupClose {
  /*Hides pop-up content when there is no "active" class */
  visibility: hidden;
}

.popup-content.active,
.popupClose.active {
  /*Shows pop-up content when "active" class is present */
  visibility: visible;
}

.popupClose {
    position: fixed;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .5;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 99;}

/* Carousel */
.videoSlider iframe,
.videoSlider .embedContainer { display: none;}

.videoSlider .slick-prev:before, .slick-next:before {color: black;}
.slick-next {right: -25px;}

.slick-prev {
    left: -25px;
    z-index: 9;}

.videoSlider {    padding: 0;}
.videoSlider li {
  position:relative;
  cursor: pointer;
  margin: 0 8px;
}
.videoSlider li img {
  display: block;
  margin: 0;
}
.videoSlider li span {
    position: absolute;
    bottom: 10px;
    left: 15px;
    padding: 6px 8px;
    color: #fff;
    background: #0397D6;
    right: 15px;
    z-index: 1;
    transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
    font-size: 12px;
}
.videoSlider li:hover span {
    background: #0397D6;
}

@media all and (min-width:480px) {
 .videoSlider li img {
  display: block;
 } 
 .videoSlider li span {
    font-size: 14px;
    padding: 5px 10px;
 }
 .videoSlider li:hover span {
    background: #0397D6;
    bottom: 15px;
 }
 .videoSlider li span:before {
    font-size: 12px;
    margin: 0 10px 0 5px;
    content: "\f04b";
    font-family: FontAwesome;
 }
}


/* Videos */
.embedContainer { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } 
.embedContainer iframe, .embedContainer object, .embedContainer embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }








.youtube {
	background-color: #000;
	margin-bottom: 0;
	position: relative;
	padding-top: 56.25%;
	overflow: hidden;
	cursor: pointer;
}
.youtube img {
	width: 100%;
	top: -16.82%;
	left: 0;
	opacity: 0.7;
}
.youtube .play-button {
	width: 70px;
	height: 45px;
	background-color: #333;
	box-shadow: 0 0 30px rgba( 0,0,0,0.6 );
	z-index: 1;
	opacity: 0.8;
	border-radius: 6px;
}
.youtube .play-button:before {
	content: "";
	border-style: solid;
	border-width: 11px 0 11px 22px;
	border-color: transparent transparent transparent #fff;
}
.youtube img,
.youtube .play-button {
	cursor: pointer;
}
.youtube img,
.youtube iframe,
.youtube .play-button,
.youtube .play-button:before {
	position: absolute;
}
.youtube .play-button,
.youtube .play-button:before {
	top: 50%;
	left: 50%;
	transform: translate3d( -50%, -50%, 0 );
}
.youtube iframe {
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
}

