/* Homepage Features */
#topBanner {
    position: relative;
}

#topBanner .tbDesc {
    background-color: #027789;
    width: 100%;
    position: relative;
    top: -4px;
    z-index: 2;
    color: white;
    padding: 5px 30px 0;}
    
#topBanner .tbDesc .msl-title a {
    font-size: 35px; 
    font-weight: bold;
}    
    
#topBanner .tbDesc a {
    color: white; 
    text-decoration: none;
}
    
#topBanner .tbDesc .newButton {font-weight: 900; font-size: 50px }

#topBanner .tbDesc .newButton:hover {
    background: white;
    color: #027789;}


#topBanner .tbDesc a.msl-morelink {
    color: white;
    text-decoration: none;
    border: 2px solid white;
    padding: 10px 20px;
    font-size: 13px;
    font-weight: bold;
    display: table;
    font-family: 'Montserrat Alternates', sans-serif;
    transition-duration: 1s;
    width: max-content;
    margin-top: 15px;}
    
#topBanner .tbDesc a.msl-morelink:hover {
    color: #027789;
    transition-duration: 1s;
    background:  white;}

#top-banner img {
    width: 100%;
    object-fit: cover;
    min-height: 200px;
    height: auto;}

#topBanner .pageTitle {
    font-family: 'Montserrat Alternates', sans-serif;
    font-size: 34px;
    line-height: normal;
    margin-bottom: 20px;}
    
#topBanner .msl-pagedescription {
    margin-bottom: 30px;
    font-size: 14px;
    width: 90%;
    line-height: 20px;}
    

    
@media (min-width: 550px) {
 #topBanner .pageTitle {
    font-size: 50px;}
}
    
@media (min-width: 769px) {
    #topBanner .tbDesc {
    width: 50%;
    top: 0;
    z-index: 2;
    min-height: 350px;}

#top-banner img {
    width: 50%;
    float: right;}
    
#top-banner img {
    height: 350px;}

}

.news_all {display: none;}

/* Top News */

.topNew .msl-item  {
    clear: both;
    height: auto;
    color: white;
    margin: 20px auto 0;}
    
#firstBanner .msl-item  {
    background: #8e2364;}
    
#firstBanner .msl-item .msl-leader .msl-morelink:hover {
    color: #8e2364;
}
    
#secondBanner .msl-item  {
    background: #cd4400;}
    
#secondBanner .msl-item .msl-leader .msl-morelink:hover {
    color: #cd4400;
}
    
#thirdBanner .msl-item  {;
    background: #5c5d60;}
    
#thirdBanner .msl-item .msl-leader .msl-morelink:hover {
    color: #5c5d60;}

.topNew:last-child .msl-item  { margin: 20px auto 40px;}

.topNew .killfloat {display: none;}

.topNew .msl-item .msl-image {
    width: 100%;
    clear: both;}

.topNew .msl-item .msl-title {
    margin: 20px auto;
    padding: 0 25px;
    width: 100%;
    font-size: 24px;
}
    
.topNew .msl-item .msl-title a {
    color: white;
    text-decoration: none;
    font-weight: bold !important;}

.topNew .msl-item .msl-leader .msl-morelink {
    color: white;
    text-decoration: none;
    border: 2px solid white;
    padding: 10px 20px;
    font-size: 13px;
    display: table;
    font-family: 'Montserrat Alternates', sans-serif;
    transition-duration: 1s;    
    width: max-content;
    margin-top: 15px;}
    
.topNew .msl-item .msl-leader .msl-morelink:hover {
    background: white;}
    
.topNew .msl-item .msl-leader {
    font-size: 14px;
    line-height: 20px;
    margin: 20px 0;
    padding: 0 25px 25px;}
    
.topNew .msl-item .msl-image img { width: 100%; height: 200px;object-fit: cover;}

.topNew:nth-child(even) .msl-item {padding: 0 ;}

.topNew:nth-child(even) .msl-item .msl-image {
    float: right;    
    margin: 0 0 0 20px;
}

.topNew:nth-child(even) .msl-item .msl-title {
    padding: 0 0 0 25px;
    float: left;}

#page-content-body > section:nth-child(1) > div:nth-child(3){ margin-top: -15px;}

@media (min-width: 769px) {
#page-content-body > section:nth-child(1) > div:nth-child(3) { margin-top: auto;}
    
.topNew .msl-item  {
    height: 200px;
    padding-right: 20px;}

.topNew .msl-item .msl-image {
    float: left;
    width: 40%;
    margin-right: 20px;}

.topNew .msl-item .msl-title {
    margin: 20px auto;
    width: 25%;
    max-height: 150px;
    padding: 0 25px 0 0;
    float: left;}

.topNew .msl-item .msl-leader {
    float: left;
    width: 30%;
    max-height: 180px;
    overflow: hidden;
    margin: 20px 0;
    padding: 0;
    padding-left: 3%;}
}

@media (min-width: 1000px) {
    .topNew .msl-item .msl-title {  font-size: 30px;}
}

/* Adverts */

#header-advert {
    clear: both;
}

    
/* Quicklinks */
.quickLinksHome {
    background: #FCB912;
    clear: both;
}
    
.quickLinksHome .maxWidth {
    background-image: linear-gradient(120deg, #ffd059 3.13%, #fcb912 3.13%, #fcb912 50%, #ffd059 50%, #ffd059 53.13%, #fcb912 53.13%, #fcb912 100%);
    background-size: 18.48px 32.00px;
    padding: 50px 20px;
}
    
.quickLinksHome ul {
    list-style: none;
    padding: 0;
    margin: 0;}
    
.quickLinksHome li {
    display: inline-block;
    vertical-align: top;
    width: 100%;
    margin: 20px 0;}

.quickLinksHome li a {
    display: block;
    text-align: center;
    font-family: 'Montserrat Alternates', sans-serif;
    text-decoration: none;
    width: 80%;
    margin: auto;
}

.quickLinksHome li img {
    width: 130px;
    height: 130px;
    object-fit: cover;
    border-radius: 80px;
    display: block;
    margin: auto;
    opacity: 0.95;}

.quickLinksHome li img:hover { opacity: 1;}

.quickLinksHome li a span {
    font-size:1.5em;
    padding: 10px;
    display: block;
    line-height: 21px;
    font-weight: bold;
    color: #5C5D61;
}


@media (min-width: 450px) {
.quickLinksHome li {
    width: 47%;
    width: calc(50% - 5px);}
    
}


@media (min-width: 600px) {
.quickLinksHome li {
    width: 32%;
    width: calc(33% - 10px);}
    
}


/* News section */

.newsHome {
    margin: 50px auto;}

.newsHome h2 {
    display: block;
    text-align: center;
    font-family: 'Montserrat Alternates', sans-serif;
    color: #5c5d61;
    margin-bottom: 30px;
    font-size: 24px;
}

.newsHome .news_item {
    background: white;
    padding: 20px;
    margin: 10px;
    width: calc(100% - 30px);
    display: inline-block;
    vertical-align: top;
    border: 1px solid #858585;}

#page-content .newsHome .news_item h5 a {
    color: #027789;
    Font-size: 24px;
    font-weight: bold;
    text-decoration: none;
}
    
#page-content .newsHome .news_item h5 a:hover {
    color: #8b195e;
    text-decoration: none;}
    
.newsHome .news_item .msl_pubdate {
    font-size: 11px;
    font-weight: 700;
    margin: 0 0 0 6px;
    color: #5C5D61;
}

.newsHome .news_item .leader { color: #5c5c61;}
    
.newsHome .news_item .news_image {
    position: relative;}

.newsHome .news_item .news_image.hover {display: block;}
        
    
.large_image .news_item .news_item_hook {display: none;}


.newsHome .news_full .leader {
    font-size: 14px;
    line-height: 20px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 25px;}
    
.newsHome .news_item .news_image a img {
    width: 100%;
    height: auto;
    position: relative;}

.newsHome .newButton {
    color: #5c5d61;
    border: 2px solid #5c5d61;
    padding: 10px 40px;
    margin: 20px auto;
    display: table;
    font-weight: bold !important;
}

.newsHome .newButton:hover {
    background: #5c5d61;
    color: #eeede7;}
    
    
@media (min-width: 600px) {
.newsHome .news_item {min-height: 400px;}
.newsHome .news_item {
    width: 48%;
    width: calc(50% - 25px);}

.newsHome h2 { font-size: 40px;}

}
    
    
    
    
/* Social section */   

.twitterFeed {
    background: #dcbc8d;}

    
.twitterFeed .maxWidth {
    background-image: linear-gradient(120deg, #ad926a 3.13%, #dcbc8d 3.13%, #dcbc8d 50%, #ad926a 50%, #ad926a 53.13%, #dcbc8d 53.13%, #dcbc8d 100%);
    background-size: 18.48px 32.00px;
    padding: 50px 10px;}

.twitterFeed .maxWidth .tweets {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;}

.twitterFeed .maxWidth .tweets::-webkit-scrollbar {
    width: 1em;
}
 
.twitterFeed .maxWidth .tweets::-webkit-scrollbar-track {
    background-color: #dbceba;
}
 
.twitterFeed .maxWidth .tweets::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  outline: 1px solid slategrey;
}

.twitterFeed h2 {
  margin: 0 0 50px 0;
}


#twitter-widget-0,
#twitter-widget-1,
#instagram-embed-0 {
    margin: 0 5px;
    width: 23%;
    width: calc(25% - 14px) !important;
    min-width: 250px !important;
    display: inline-block !important;
}

.twitterFeed h2 {
    display: block;
    text-align: center;
    font-family: 'Montserrat Alternates', sans-serif;
    font-size: 40px;
    color: #5c5d61;
}

.twitterFeed p.subtitle {
    display: block;
    text-align: center;
    font-size: 22px;
    color: #2B2B2B;
    margin: 5px 0 30px;
}
 
 
 .fb-page {
     margin: 0 5px;
 }   
    
.fb-page span iframe {
    border-radius: 7px;
    margin-top: -5px;
}
    
    
/* Representatives */
.repreHome {
    background: white;
    padding: 50px 10px 20px;
}

@media only screen and (max-width: 700px) {
    .repreHome {
        max-width: 100%;
    }
    
    .repreHome > .maxWidth {
        width: 95%;
        margin-left: 10px;
    }
}

.repreHome h2 {
    display: block;
    text-align: center;
    font-family: 'Montserrat Alternates', sans-serif;
    font-size: 40px;
    font-weight: bold;
    color: #5c5d61;
    margin: 0;}
    
.repreHome ul {    
    overflow-x: auto;
    overflow-y: hidden;
}

.repreHome ul::-webkit-scrollbar {
    width: 1em;
}
 
.repreHome ul::-webkit-scrollbar-track {
    background-color: #e7e7e7;
}
 
.repreHome ul::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  outline: 1px solid slategrey;
} 

.repreHome .newButton {
    color: #5c5d61;
    border: 2px solid #5c5d61;
    padding: 10px 40px;
    margin: 20px auto;
    display: table;
    font-weight: bold !important;
}

.repreHome .newButton:hover {
    background: #5c5d61;
    color: #eeede7;}

#homepage-sabbs {
  list-style: none;
  padding: 0;}

#homepage-sabb-info,
#homepage-coursereps {display: none;}

#homepage-sabbs li {
    width: calc(14% - 12px);
    display: inline-block;
    vertical-align: top;
    margin: 10px 5px;
    white-space: initial;}

#homepage-sabbs li img {   
    background: #c5c6ca;
    max-width: 150px;
    padding-top: 10px;}

#homepage-sabbs li:hover img {
    background: #cb4b0a;}
    
#homepage-sabbs li h3 {
    font-size: 17px;
    margin: 10px 0;}

#homepage-sabbs li a {text-decoration: none;}

#homepage-sabbs li:hover a h3, #homepage-sabbs li:hover a p {
    color: #cb4b0a;}

@media (max-width:1100px) {
    #homepage-sabbs li {
        min-width: 142px;
    }
}

/* Course Reps */
.courseReps {
    background: #8b195e;
    padding: 30px 5%;
    text-align: center;
    color: white;
    margin: 60px auto;}
    
#page-content .courseReps h3,
#page-content .courseReps h2 {color: white;}
 
.courseReps h3 {font-weight: normal; margin: 0.9em 0; font-size: 12px;}

.courseReps .newButton {
    margin: 50px auto 15px;
    display: table;
    padding: 10px 40px;
    font-weight: bold !important;
    
}

.courseReps .newButton:hover {
    background: white;
    color: #8b195e;}

@media (min-width: 600px) {
.courseReps h2 {font-size: 40px;} 
.courseReps h3 {margin-bottom: 50px;font-size: 26px;}
}






/* Try new layout */
/*#topBanner .tbDesc {height: 350px; min-height: fit-content; padding:15px 30px}
#top-banner img {height: 350px}

.topNew .msl-item {height: 200px}
.topNew .msl-item .msl-image {width: 40%}
.topNew .msl-item .msl-image img {height: 200px;}
.topNew .msl-item .msl-title {width: 25%; max-height: 150px; overflow: hidden}
.topNew .msl-item .msl-leader {width: 30%; padding-left: 3%; max-height: 180px; overflow: hidden}*/