@charset "UTF-8";

html {height: 101%; margin: 0; padding: 0; min-height: 101%;}
body {font-family: "futura-pt-n4", "futura-pt", Arial, sans-serif; font-weight: 400; font-size: 100%; font-style: normal; margin: 0; padding: 0; height: 100%; position: relative; overflow-x: hidden; background: #de1829; min-height: 101%;}

hr {width: 100%; height: 1px; background: #cccccc; border: none; margin: 10px auto; clear: both;}

img {display: block; margin: 0; outline: none; padding: 0; vertical-align: bottom; max-width: 100%; width: auto;}
img.seecmsimagedefault, img.seecmsimagedefaultundefined {display: inline-block; margin: 0 0 20px 0!important;}
img.seecmsimageleft, img.seecmsimageleftundefined {float: left; margin: 0 20px 20px 0!important;}
img.seecmsimageright, img.seecmsimagerightundefined {float: right; margin: 0 0 20px 20px!important;}
img.seecmsimagecentre, img.seecmsimagecentreundefined {display: block; margin: 0 auto;}

p, h1, h2, h3, h4, li {margin: 0; padding: 0; line-height: 140%; color: #58595b; font-style: normal; font-weight: 400;}
p {padding: 0 0 10px 0;}
ul, ol {margin: 0 0 10px 40px; padding: 0;}
li p {padding: 0;}
li li, li p {font-size: 100%;}
strong {font-weight: bold;}
a {text-decoration: none; color: #be1e2d;}
a:hover {color: #be1e2d; text-decoration: none;}
a img {border: none; outline: none;}
* {-webkit-print-color-adjust: exact;}
label {color: #58595b; font-size: 100%;}
sup {font-size: 70%; line-height: 110%; padding: 0 0 10px 0; margin: 0; font-weight: 400; color: #58595b;}

p.seeformerrors {color: red;}

.col1, .col2, .col3, .col4, .left, .right {display: block; float: left; min-height: 5px;}

div:after, form:after, ul:after, input:after, section:after, article:after, header:after, footer:after, nav:after, aside:after, hgroup:after {clear: both; content: ""; display: block; height: 0; visibility: hidden;}
section, article, header, footer, nav, aside, hgroup {display: block;}

table {width: 100%; margin: 0 0 10px 0; border: 0!important; border-collapse: separate!important; border-spacing: 0!important;}
table th {padding: 10px 10px 10px 0; font-size: 100%; color: #58595b; background: #ffffff; font-weight: 700; border-collapse: separate!important; text-align: left; border: 0!important; border-spacing: 0!important; position: relative; text-transform: uppercase;}
table td {padding: 10px 10px 10px 0; font-size: 100%; color: #58595b; background: #ffffff; font-weight: 400; border-collapse: separate!important; text-align: left; border: 0!important; border-spacing: 0!important; position: relative;}
table td:before {width: 100%; height: 1px; content: ""; background: #58595b; position: absolute; bottom: 0; left: 0; display: block;}
table th:before {width: 100%; height: 1px; content: ""; background: #be1e2d; position: absolute; top: 0; left: 0; display: block;}
table th:after {width: 100%; height: 1px; content: ""; background: #be1e2d; position: absolute; bottom: 0; left: 0; display: block;}
table th p, table td p {font-size: 100%; padding: 0;}
table td li, table th li {font-size: 100%;}

input[type="text"], input[type="password"], input[type="email"], textarea, select, button {width: 100%; padding: 0 10px; box-sizing: border-box; height: 40px; background: #ffffff; border: 1px solid #cccccc; margin: 5px 0 15px 0; outline: none; resize: none; font-family: "futura-pt-n4", "futura-pt", Arial, sans-serif; font-weight: 400; font-size: 100%;}
input:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px white inset; -webkit-text-fill-color: #58595b;}
textarea {height: 130px; padding: 10px;}
input[type="checkbox"] {width: 15px; height: 15px; float: left; margin: 5px 10px 0 0;}
input[type="text"], input[type="submit"], textarea, button, input[type="password"], input[type="button"], select {-webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0;}
input[type="submit"], button, input[type="button"] {cursor: pointer; width: auto; outline: none; border: none; text-transform: uppercase; background: #be1e2d; padding: 0 20px; height: 40px; color: #ffffff; font-size: 100%; font-family: "futura-pt-n7", "futura-pt", Arial, sans-serif; font-weight: 700; border-radius: 0;}

.slick-slide, .slick-slide a {outline: none!important;}
.cmsform p {padding: 0;}
.cmsform p.fieldname {padding: 0 0 5px 0;}
.cmsform p.fieldoption {padding: 0 0 20px 0;}
.cmsform p.fieldoption .notes {font-style: italic;}
.cmsform input, .cmsform select, .cmsform textarea {margin: 0 0 5px 0;}
.cmsform input[type="checkbox"] {margin: 0 10px 0 0;}
.cmsform input[type="submit"] {margin: 15px 0;}
.cmsform .errors p {color: red!important; padding: 0 0 20px 0;}
.cmsform span.error {color: red!important; float: right;}

.searchresult h4 img {width: auto; float: left; display: inline-block; margin: 0 10px 0 0;}

.clear {clear: both;}

.sitemap ul ul {margin: 10px 0 0 20px;}

.form .row.thirds, .form .row.halves {width: 102%; margin-left: -2%;}
.form .row.thirds .input {float: left; width: 31.3%; margin: 0 0 0 2%;}
.form .row.halves .input {float: left; width: 48%; margin: 0 0 0 2%;}

/* font-weight: 300; font-weight: 400; font-weight: 700; */
/* "futura-pt-bold-n7", "futura-pt-bold", arial, sans-serif; font-weight: 700;	*/

.nopadding {padding: 0!important;}

h1, h2, h3, h4 {font-weight: 700; padding: 0 0 10px 0; margin: 0; line-height: 110%; text-transform: uppercase;}
h1 {color: #58595b; font-size: 280%;}
h2 {text-transform: none; font-size: 150%; color: #be1e2d;}
h3 {text-transform: none; font-size: 150%; color: #58595b;}
h4 {text-transform: none; font-size: 120%; color: #be1e2d;}
ul, ol {padding: 0; margin: 0 0 0 15px;}
ul li {list-style: none; padding: 0 0 10px 20px; background: url(../images/li-back.png) no-repeat left 4px;}
p, li, label {font-size: 110%;}

.wrap {width: 100%; position: relative; overflow: hidden;}

.es-widget-header-container-template[data-v-4e70ca5c] {flex-direction: row!important;}

.redtext {color: #be1e2d!important;}
.bluetext {color: #5ba3dc!important;}

.arrowbutton a {display: inline-block; font-weight: 700; color: #58595b!important; position: relative; padding: 0 20px 0 0; text-transform: uppercase; font-size: 90%;}
.arrowbutton a:before {content: "\f138"; position: absolute; top: 4px; right: 0; font-family: "Font Awesome\ 5 Free"; color: #be1e2d; font-size: 100%; line-height: 100%; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-weight: 900;}
.arrowbutton.opposite a {padding: 0 0 0 20px;}
.arrowbutton.opposite a:before {right: auto; left: 0; content: "\f137";}

.blockbutton a {display: inline-block; font-weight: 700; color: #ffffff!important; position: relative; padding: 10px 40px 10px 15px; text-transform: uppercase; font-size: 90%; background: #be1e2d; margin: 0 10px 0 0;}
.blockbutton a:before {content: "\f138"; position: absolute; top: 14px; right: 10px; font-family: "Font Awesome\ 5 Free"; color: #ffffff; font-size: 100%; line-height: 100%; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-weight: 900;}

.blockheading {padding: 10px 20px; margin: 0 0 20px 0; background: #be1e2d; color: #ffffff; text-transform: uppercase; font-weight: 700; font-size: 120%;}

.sidebar-buttons {position: fixed; top: 211px; right: 0; width: 35px; z-index: 100;}
.sidebar-buttons a {display: block; width: 100%; text-indent: -9999px; text-align: center; color: #ffffff; text-decoration: none; font-weight: 700;}
.sidebar-buttons a.sportscentrebutton {background: url(../images/sports-centre-button.png) no-repeat 0 0; background-size: 100%; height: 258px;}
.sidebar-buttons a.rossettschoolbutton {background: url(../images/rossettschool-button.png) no-repeat 0 0; background-size: 100%; height: 207px;}
.sidebar-buttons a.adultlearningbutton {background: url(../images/adult-learning-button.png) no-repeat 0 0; background-size: 100%; height: 250px; margin-top: -30px;}

.connect-wrap {background: #393536; position: fixed; top: -170px; left: 0; width: 100%; z-index: 20;}
.connect-wrap .connect {max-width: 1180px; width: 100%; margin: 0 auto; padding: 25px 0; position: relative;}
.connect-wrap .connect .inner {height: 120px; width: 100%; display: table;}
.connect-wrap .connect .inner .logo {display: table-cell; text-align: center; vertical-align: middle; height: 120px;}
.connect-wrap .connect .inner .logo img {display: inline-block; max-height: 100px; max-width: 100%; width: auto;}
.connect-wrap .connect .button {position: absolute; bottom: -28px; right: 0; display: block; padding: 7px 30px; border-radius: 0 0 30px 30px; color: #ffffff; background: #393536; text-transform: uppercase; font-weight: 700; font-size: 90%; line-height: 100%;}
.connect-wrap .connect .button:hover {color: #ffffff;}

.header-buttons-wrap {position: fixed; top: 0; left: 0; width: 100%; z-index: 20;}
.header-buttons-wrap .header-buttons {max-width: 1180px; width: 100%; margin: 0 auto; position: relative; text-align: right;}
.header-buttons-wrap .header-buttons a {float: none; display: inline-block; padding: 7px 30px; border-radius: 0 0 30px 30px; color: #ffffff!important; background: #be1e2d; text-transform: uppercase; font-weight: 700; font-size: 90%; line-height: 100%;}

.header-wrap {padding: 0 20px; background: #ffffff;}
.header {max-width: 1180px; width: 100%; margin: 0 auto; padding: 25px 0;}
.header .left {float: left; width: 122px;}
.header .right {float: right; width: 850px; padding: 15px 0 0 0;}
.header .right .col1 {float: left; width: 480px; text-align: right; padding: 20px 0 0 0;}
.header .right .col2 {float: left; width: 155px; margin: 0 0 0 20px; padding: 20px 0 0 0;}
.header .right .col3 {float: right; width: 150px;}
.header a.logo {display: block; width: 100%; height: 121px; background: url(../images/svgs/logo.svg) no-repeat 0 0; background-size: 100%;}
.header p {font-size: 260%; padding: 0; font-weight: 300; color: #231f20;}

.header .translate {width: 100%; margin: 0; height: 30px; float: left; padding-top: 15px;}
.header .translate .goog-te-gadget-simple {width: 100%; padding-top: 6px; padding-bottom: 5px;}
.header .translate #google_translate_element, .header .translate .goog-te-gadget {height: 30px;}
.header .translate .goog-te-gadget img {display: inline-block;}

.nav-wrap {background: #ffffff; position: relative;}
.nav {max-width: 1180px; width: 100%; background: #be1e2d; margin: 0 auto; border-radius: 40px 40px 0 0;}
.nav ul {margin: 0; padding: 0 20px; width: 100%; display: table; box-sizing: border-box;}
.nav li {list-style: none; padding: 0; display: table-cell; text-align: center; vertical-align: middle; text-transform: uppercase; font-size: 100%; background: none;}
.nav li a {text-align: center; text-decoration: none; color: #ffffff; display: block; padding: 10px 10px 9px 10px; font-weight: 700; font-size: 90%;}
.nav li.selected a, .nav li:hover a {color: #ffffff;}
.nav .dropdown-wrap {background: rgba(57, 53, 54, 0.9); position: absolute; top: 100%; left: 0; width: 100%; z-index: 20; padding: 0 20px; box-sizing: border-box; display: none;}
.nav li:hover .dropdown-wrap {display: block;}
.nav .dropdown {max-width: 1180px; width: 100%; margin: 0 auto; box-sizing: border-box; padding: 40px 0;}
.nav .dropdown .image {float: left; width: 220px; margin: 0 30px 0 0; min-height: 5px;}
.nav .dropdown .links {float: left; width: 560px; min-height: 5px;}
.nav .dropdown img {width: 100%;}
.nav .dropdown li a, .nav li:hover .dropdown li a, .nav li.selected .dropdown li a {color: #ffffff;}
.nav .dropdown li.selected a, .nav .dropdown li:hover a, .nav li:hover .dropdown li:hover a, .nav li.selected .dropdown li:hover a, .nav li:hover .dropdown li.selected a, .nav li.selected .dropdown li.selected a {color: #ff5061;}
.nav .dropdown ul {margin: 0; padding: 0; width: 100%; display: block; -webkit-column-count: 2; -moz-column-count: 2; column-count: 2;}
.nav .dropdown li {display: block; text-align: left; background: none;}
.nav .dropdown li a {text-align: left; text-decoration: none; color: #ffffff; display: block; padding: 0; font-weight: 700; font-size: 90%;}
.nav li.selected .dropdown li.selected a {padding: 0 0 0 20px; background: url(../images/li-back.png) no-repeat left 4px;}
.nav li.searchbutton {position: relative;}
.nav li.searchbutton span {display: block;}
.nav li.searchbutton span.opened {display: none;}
.nav li.searchbutton a.open span {display: none;}
.nav li.searchbutton a.open span.opened {display: block;}
.nav .searchbox {position: absolute; width: 300px; top: 100%; background: #be1e2d; box-sizing: border-box; padding: 10px; z-index: 200; left: 50%; transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); display: none;}
.nav .searchbox .input {position: relative;}
.nav .searchbox input {border-color: #ffffff; margin: 0; padding: 0 50px 0 10px; font-size: 90%;}
.nav .searchbox input[type="submit"] {padding: 0; width: 40px; height: 40px; position: absolute; top: 0; right: 0; background: #393536 url(../images/search-icon.png) no-repeat center center;}

.home .nav .dropdown {min-height: 500px;}

.snav ul {margin: 0 0 20px 0;}
.snav li {list-style: none; padding: 0; background: none; margin: 0 0 5px 0; font-size: 100%;}
.snav li a {color: #393536; font-weight: 700; display: block; padding: 0 0 1px 20px; background: url(../images/li-back-grey.png) no-repeat left 4px; position: relative;}
.snav li:hover a, .snav li.selected a {color: #be1e2d; background: url(../images/li-back.png) no-repeat left 4px;}
.snav li.selected a:after {content: ""; height: 1px; width: 100%; display: block; position: absolute; bottom: -2px; left: 0; background: #be1e2d;}
.snav li.selected ul {margin: 5px 0 10px 20px;}
.snav li.selected ul li {line-height: 110%; margin: 0 0 5px 0;}
.snav li.selected ul li a {padding: 0; background: none; color: #393536;}
.snav li.selected ul li a:after {display: none;}
.snav li.selected ul li.selected a, .snav li.selected ul li:hover a {color: #be1e2d;}
.snav li.selected ul li.selected li a {font-size: 90%; font-weight: 700; position: relative; padding: 0 0 0 10px; color: #393536;}
.snav li.selected ul li.selected li a:before {content: "-"; position: absolute; top: 0; left: 0; display: block;}
.snav li.selected ul li.selected li:hover a, .snav li.selected ul li.selected li.selected a {color: #be1e2d;}

.notice-wrap {background: #a91523; padding: 0 20px;}
.notice {max-width: 1180px; width: 100%; margin: 0 auto; padding: 15px 0;}
.notice p {color: #ffffff; padding: 0; font-size: 90%; line-height: 110%; max-width: 35%; width: 100%;}
.notice p span {text-transform: uppercase; font-weight: 700;}

.banners {background: #393536; position: relative; height: 500px;}
.banners .banner {width: 100%; position: relative;}
.banners .banner .overlay {width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: url(../images/banner-overlay.png) no-repeat top left; background-size: auto 100%;}
.banners .banner .image {max-width: 1180px; width: 100%; margin: 0 auto; position: relative;}
.banners .banner .image img {width: 100%;}
.banners .banner .image .overlayleft {width: 200px; height: 100%; position: absolute; top: 0; left: 0; background: linear-gradient(to right, rgba(57, 53, 54, 1) 0%, rgba(57, 53, 54, 1) 7%, rgba(57, 53, 54, 0) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#393536", endColorstr="#00393536", GradientType=1);}
.banners .banner .image .overlayright {width: 600px; height: 100%; position: absolute; top: 0; right: 0; background: linear-gradient(to right, rgba(57, 53, 54, 0) 0%, rgba(57, 53, 54, 1) 80%, rgba(57, 53, 54, 1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00393536", endColorstr="#393536", GradientType=1);}
.banners .banner .inner {max-width: 1180px; width: 100%; position: absolute; top: 0; left: 0; right: 0; margin: 0 auto; height: 100%;}
.banners .banner .inner .bannertext {max-width: 470px; width: 100%; position: absolute; top: 50%; right: 0; text-align: right; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); padding: 0 0 70px 0;}
.banners .banner .inner .bannertext h2 {color: #ffffff; font-size: 280%; padding: 0 0 20px 0; line-height: 100%; text-transform: uppercase;}
.banners .banner .inner .bannertext p {color: #ffffff; padding: 0; font-size: 140%; line-height: 110%;}
.banners .banner .inner .bannertext p a {color: #ffffff; text-decoration: none; font-weight: 700; text-transform: uppercase; font-size: 65%;}
.banners .banner .inner .bannertext p a i {color: #be1e2d;}
.banners .slick-dots {max-width: 1180px; width: 100%; position: absolute; bottom: 70px; left: 0; right: 0; margin: 0 auto; text-align: right;}
.banners .slick-dots li {list-style: none; float: none; display: inline-block; margin: 0 0 0 5px; padding: 0; width: 12px; height: 12px; line-height: 12px; background: none;}
.banners .slick-dots li button {width: 12px; height: 12px; padding: 0; margin: 0; background: #ffffff; border-radius: 50%; outline: none; border: none; cursor: pointer; text-indent: -9999px; opacity: 0.5;}
.banners .slick-dots li:hover button, .banners .slick-dots li.slick-active button {opacity: 1;}

.quicklinks {position: absolute; top: 0; right: 0; float: right; width: auto; padding: 0 0 0 130px;}
.quicklinks .quicklinktitle {color: #ffffff; background: #393536; border-radius: 0 0 0 40px; text-transform: uppercase; font-weight: 700; font-size: 90%; padding: 8px 0 8px 30px; position: absolute; top: 0; left: 0; width: 90%; box-sizing: border-box; min-height: 38px;}
.quicklinks .quicklinksinner {float: right; margin-top: -65px;}
.quicklinks .quicklinksinner .quicklink {float: left; width: 128px; height: 130px; background: url(../images/svgs/quicklink-wrap.svg) no-repeat 0 0; background-size: 100% 100%; position: relative; text-align: center; display: block; color: #ffffff; text-decoration: none; margin-right: -10px;}
.quicklinks .quicklinksinner .quicklink:hover {background: url(../images/svgs/quicklink-wrap-hover.svg) no-repeat 0 0; background-size: 100% 100%; transition: all 0.15s ease; -webkit-transition: all 0.15s ease; -moz-transition: all 0.15s ease; -ms-transition: all 0.15s ease; -o-transition: all 0.15s ease;}
.quicklinks .quicklinksinner .quicklink span {padding: 0; color: #ffffff; font-size: 240%; position: absolute; top: 50%; left: 0; right: 0; width: 100%; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); display: block;}
.quicklinks .quicklinktitle span {display: none;}
.quicklinks .quicklinktitle span.default {display: block;}

.title-wrap {padding: 0 20px; background: #393536 url(../images/title-wrap.png) no-repeat top left; background-size: auto 100%;}
.title {max-width: 1180px; width: 100%; margin: 0 auto; padding: 35px 0;}
.title p {color: #ffffff; padding: 0; text-transform: uppercase; font-weight: 700; font-size: 280%;}

.breadcrumb p {font-size: 80%; padding: 0 0 30px 0;}
.breadcrumb p a {text-decoration: none; color: #58595b;}
.breadcrumb p span {color: #be1e2d;}

.content-wrap {padding: 0 20px; background: #ffffff url(../images/content-wrap.jpg) no-repeat top left;}
.content-wrap.home {background: #ffffff url(../images/content-wrap-home.jpg) no-repeat top left;}
.content {max-width: 1180px; width: 100%; margin: 0 auto; padding: 25px 0 20px 0;}
.content .left {float: left; width: 240px;}
.content .right {float: right; width: 900px;}
.content .right .col1 {float: left; width: 650px;}
.content .right .col2 {float: right; width: 220px;}

.content .columns {width: 102%; margin-left: -2%;}
.content .columns .column {width: 31.333%; float: left; margin: 0 0 0 2%; min-height: 5px;}

.home .content {padding: 40px 0 20px 0; position: relative;}
.home .content h1 {padding: 0 640px 20px 0;}
.home .content .left {float: left; width: 360px; margin: 0;}
.home .content .right {float: right; width: 783px; margin: 0;}
.home .content .right .top {margin: 0 0 20px 0;}
.home .content .right .col1 {float: left; width: 302px;}
.home .content .right .col2 {float: right; width: 461px;}
.home .content .right .col2 .left {float: left; width: 220px; margin: 0;}
.home .content .right .col2 .right {float: right; width: 220px; margin: 0;}

.newsbox {background: #393536; width: 100%;}
.newsbox img {width: 100%;}
.newsbox .inner {padding: 20px; height: 220px; box-sizing: border-box; background: url(../images/news-wrap.png) no-repeat center center; background-size: cover;}
.newsbox .inner h4 {color: #ffffff; font-size: 100%; text-transform: uppercase;}
.newsbox .inner p {color: #ffffff; padding: 0 0 10px 0; line-height: 130%;}
.newsbox .inner p.date {font-size: 90%;}
.newsbox .inner p.arrowbutton {font-size: 80%;}
.newsbox .inner p.arrowbutton a, .newsbox .inner p.arrowbutton a:before {color: #ffffff!important;}
.newsbox.mainnewsbox {background: #be1e2d;}
.newsbox.widenewsbox .image {float: left; width: 220px; min-height: 5px;}
.newsbox.widenewsbox .inner {float: right; width: 240px; min-height: 5px;}

.newsfeedmain {width: 100%!important; margin-left: 0!important;}
.newsfeedmain .newsbox {width: 31%; float: left; display: block; margin: 0 0 2% 0;}
.newsfeedmain .newsbox .inner {height: auto;}
.newsfeedmain .grid-sizer {width: 31%;}
.newsfeedmain .gutter-sizer {width: 2%;}

.newsfeedmain .newsstory {border-top: 1px solid #e2e2e2; padding: 20px 0;}
.newsfeedmain .newsstory img {width: 100%;}
.newsfeedmain .newsstory .image {width: 150px; float: left; min-height: 5px;}
.newsfeedmain .newsstory .text {width: 730px; float: right; min-height: 5px;}

.newsarchive {margin: 0 0 20px 0;}
.newsarchive ul {padding: 0; margin: 0;}
.newsarchive li {padding: 5px 0; margin: 0; font-size: 100%; background: none; border-bottom: 1px solid #e2e2e2;}
.newsarchive li a {display: block; margin: 0; padding: 0 20px 0 0; position: relative; font-weight: 600; color: #58595b;}
.newsarchive li a:before {content: "\f138"; position: absolute; top: 0; right: 0; font-family: "Font Awesome\ 5 Free"; color: #58595b; font-size: 100%; line-height: 100%; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-weight: 900;}
.newsarchive ul ul {display: none;}
.newsarchive ul ul li.all {display: none!important;}
.newsarchive li.selected a, .newsarchive li:hover a {color: #be1e2d;}
.newsarchive li.selected a:before, .newsarchive li:hover a:before {color: #be1e2d;}
.newsarchive ul li.selected ul {display: block; padding: 10px 0 10px 20px; border-top: 1px solid #e2e2e2;}
.newsarchive ul li.selected ul li {font-size: 90%; border-bottom: 0;}
.newsarchive ul li.selected ul li a {color: #58595b;}
.newsarchive ul li.selected ul li a:before {display: none!important;}
.newsarchive li.selected li.selected a, .newsarchive li.selected li:hover a {color: #be1e2d;}
.newsarchive li.selected li.selected a:before, .newsarchive li.selected li:hover a:before {color: #be1e2d;}

.additionallinksbox {background: #393536; width: 100%; border-radius: 0 0 50px 0;}
.additionallinksbox .inner {padding: 20px; box-sizing: border-box; background: url(../images/news-wrap.png) no-repeat bottom center; background-size: 100%;}
.additionallinksbox .inner h4 {color: #ffffff; font-size: 110%;}
.additionallinksbox .inner p {color: #ffffff; padding: 0;}
.additionallinksbox .inner p a {color: #ffffff; padding: 0 0 0 25px; display: inline-block; position: relative;}
.additionallinksbox .inner p a i {position: absolute; top: 3px; left: 0; color: #be1e2d;}
.additionallinksbox .inner p a:hover {color: #ffffff;}

.governors {padding: 20px 0 0 0;}
.governors .governor {margin: 0 0 20px 0;}
.governors .governor .image {float: left; width: 150px; min-height: 5px;}
.governors .governor .image img {width: 100%;}
.governors .governor .text {float: right; width: 730px;}

.form {margin: 0 0 20px 0;}

.twitter {background: #00aced; border-radius: 0 0 70px 0; text-align: center; height: 200px; position: relative;}
.twitter h3 {color: #ffffff; font-size: 100%; text-transform: uppercase; padding: 0 0 5px 0;}
.twitter p {color: #ffffff; padding: 0; line-height: 120%; font-size: 95%;}
.twitter p a {color: #ffffff; text-decoration: none;}
.twitter p a:hover {color: #ffffff;}
.twitter .inner {position: absolute; top: 50%; left: 0; right: 0; margin: 0 auto; max-width: 80%; width: 100%; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); padding: 0 0 20px 0;}
.twitter .tweet {height: 200px;}
.twitter .slick-dots {padding: 0; margin: 0; width: 100%; text-align: center; position: absolute; left: 0; right: 0; bottom: 10px;}
.twitter .slick-dots li {list-style: none; float: none; display: inline-block; margin: 0 2px; padding: 0; width: 12px; height: 12px; line-height: 12px; background: none;}
.twitter .slick-dots li button {width: 12px; height: 12px; padding: 0; margin: 0; background: #ffffff; border-radius: 50%; outline: none; border: none; cursor: pointer; text-indent: -9999px; opacity: 0.5;}
.twitter .slick-dots li:hover button, .twitter .slick-dots li.slick-active button {opacity: 1;}

.twitter .image {float: left; width: 200px; height: 200px; overflow: hidden;}
.twitter .image img {width: auto; height: 200px; max-width: none;}
.twitter .text {float: right; width: 240px; text-align: left; box-sizing: border-box; padding: 0 30px 0 0; position: relative; height: 200px;}
.twitter .text .inner {max-width: 100%;}

.galleries {width: 102%; margin-left: -2%;}
.galleries .gallery {float: left; width: 23%; margin: 0 0 20px 2%;}
.galleries .gallery img {width: 100%;}
.galleries .gallery a {margin: 0 0 10px 0; display: block;}
.galleries .gallery h4 {font-size: 100%;}

.grid {width: 102%; margin-left: -2%;}
.grid .box {float: left; width: 23%; margin: 0 0 20px 2%;}
.grid .box .image {margin: 0 0 10px 0; background: #be1e2d;}
.grid .box img {width: 100%; opacity: 0.7;}
.grid .box:hover img {opacity: 1;}
.grid .box h3 {font-size: 100%;}

.gridfilter {padding: 20px 0;}
.gridfilter a {display: inline-block; padding: 12px 15px; background: #f2f2f2; color: #393536!important; text-decoration: none; margin: 0 5px 5px 0; font-weight: 700; font-size: 90%;}
.gridfilter a:hover, .gridfilter a.selected {color: #ffffff!important; background: #be1e2d;}

.grid.simplegrid .box {width: 31%; margin: 0 0 2% 2%;}
.grid.simplegrid .box a {padding: 15px; text-decoration: none; background: #be1e2d; color: #ffffff; display: block;}
.grid.simplegrid .box a h3, .grid.simplegrid .box a p {padding: 0; color: #ffffff;}
.grid.simplegrid .box a h3 {text-transform: uppercase; font-size: 100%; position: relative; padding: 0 20px 0 0; min-height: 35px;}
.grid.simplegrid .box a p {font-size: 90%;}
.grid.simplegrid .box h3:after {content: "\f138"; position: absolute; top: 4px; right: 0; font-family: "Font Awesome\ 5 Free"; color: #ffffff; font-size: 100%; line-height: 100%; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-weight: 900;}

.offersgrid.grid .box .image {border: 1px solid #cccccc; box-sizing: border-box;}
.offersgrid.grid .box img {opacity: 1;}

.stafflist .heading {margin: 0 0 10px 0; cursor: pointer;}
.stafflist .heading h3 {padding: 15px 50px 15px 15px; color: #ffffff; font-size: 100%; margin: 0; line-height: 110%; background: #be1e2d; position: relative;}
.stafflist .heading h3 i {position: absolute; top: 15px; right: 15px; font-size: 120%;}
.stafflist .text {display: none;}

.googlemap {width: 100%; height: 300px;}

.advertising .advert {margin: 0 0 20px 0;}
.advertising .advert .text {padding: 20px; background: #f1f1f1;}

.infobox {padding: 20px; background: #be1e2d; margin: 0 0 20px 0;}
.infobox * {color: #ffffff;}
.infobox p, .infobox li, .infobox label {font-size: 100%;}
.infobox .blockbutton a {background: #ffffff!important; color: #be1e2d!important; line-height: 110%;}
.infobox .blockbutton a:before {color: #be1e2d!important;}

.footer-wrap {background: #393536 url(../images/footer-wrap.png) no-repeat right 47px; padding: 0 20px; position: relative;}
.footer-wrap .footer-block {position: absolute; display: block; max-width: 1332px; width: 100%; margin: 0 auto; left: 0; right: 0; top: 0; height: 0; padding-bottom: 3.5%; background: url(../images/footer-block.png) no-repeat 0 0; background-size: 100%;}
.footer {max-width: 1180px; width: 100%; margin: 0 auto; padding: 80px 0 20px 0;}
.footer .left {float: left; width: 690px;}
.footer .left .col1 {float: left; width: 87px; margin: 0 33px 0 0;}
.footer .left .col2 {float: left; width: 200px; margin: 0 10px 0 0;}
.footer .left .col3 {float: left; width: 280px; margin: 0 19px 0 0;}
.footer .left .col4 {float: left; width: 61px; margin: 0;}
.footer .right {float: right; width: 295px;}
.footer .share {float: right; min-height: 16px;}
.footer h4 {color: #ffffff;}
.footer p {font-weight: 700; color: #ffffff; line-height: 140%; font-size: 90%; padding: 0 0 10px 0;}
.footer p a {text-decoration: none; color: #ffffff;}
.footer p a i {color: #abacad; font-size: 85%; transition: all 0.25s ease; -webkit-transition: all 0.25s ease; -moz-transition: all 0.25s ease; -ms-transition: all 0.25s ease; -o-transition: all 0.25s ease;}
.footer p a:hover {color: #ffffff;}
.footer p a:hover i {color: #be1e2d;}
.footer span {text-transform: uppercase;}
.footer p.small {font-size: 75%; font-weight: 400;}

.accreditations-wrap {background: #393536; padding: 0 20px;}
.accreditations {max-width: 1180px; width: 100%; margin: 0 auto; padding: 15px 0 25px 0;}
.accreditations .inner {width: 100%; text-align: center; display: table;}
.accreditations .inner .logo {display: table-cell; padding: 0 15px;}
.accreditations .inner .logo img {display: inline-block; vertical-align: middle; max-height: 80px; max-width: 100%; width: auto;}

.bottom-footer-wrap {padding: 0 20px;}
.bottom-footer {max-width: 1180px; width: 100%; margin: 0 auto; padding: 15px 0;}
.bottom-footer p {padding: 0; color: #ffffff; font-size: 90%;}
.bottom-footer p a {color: #ffffff; text-decoration: none;}
.bottom-footer p a:hover {color: #ffffff;}
.bottom-footer .col1 {float: left; width: 303px; margin: 0 21px 0 0;}
.bottom-footer .col2 {float: left; width: 450px; margin: 0;}
.bottom-footer .col3 {float: right; width: 245px; margin: 0; text-align: right;}

.mobile-header-wrap, .mobile-connect-wrap {display: none;}

.fancybox-container .button-close, .fancybox-container .button-previous, .fancybox-container .button-next {position: absolute; width: 40px; height: 40px; background: #000000; text-align: center; line-height: 40px; color: #ffffff; text-decoration: none; border-radius: 50%; font-size: 16px;}
.fancybox-container .button-previous, .fancybox-container .button-next {top: 50%; margin-top: -22px; line-height: 42px;}
.fancybox-container .button-previous {left: -20px;}
.fancybox-container .button-next {right: -20px;}
.fancybox-container .button-close {top: -18px; right: -18px; font-size: 22px; color: #ffffff; line-height: 36px;}
.fancybox-button--arrow_left, .fancybox-button--arrow_right {display: none!important;}

.contactpage .content-wrap {margin-top: -5px;}

.gridboxes {width: 102%; margin-left: -2%; margin-top: 10px;}
.gridboxes .box {float: left; width: 31.333%; margin: 0 0 2% 2%; position: relative;}
.gridboxes .box img {width: 100%;}
.gridboxes .box a.overlay {transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; text-decoration: none; color: #ffffff; font-weight: 600; font-size: 110%; background: rgba(0, 0, 0, 0.5);}
.gridboxes .box a.overlay:hover {background: rgba(190, 30, 45, 0.85);}
.gridboxes .box a.overlay span {position: absolute; top: 50%; left: 50%; display: block; padding: 0 30px 5px; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); text-align: center; line-height: 110%; width: 100%; box-sizing: border-box;}
.gridboxes .box a.overlay span:after {transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; width: 20px; height: 2px; background: #be1e2d; display: block; content: ""; visibility: visible; position: absolute; bottom: -8px; left: 0; right: 0; margin: 0 auto;}
.gridboxes .box a.overlay:hover span:after {background: #ffffff;}
.gridboxes .box .image {margin: 0 0 15px 0;}

.content-wrap.default .gridboxes .box {width: 48%;}
.content-wrap.three-columns .gridboxes {width: 100%; margin-left: 0;}
.content-wrap.three-columns .gridboxes .box {width: 100%; margin: 0 0 20px;}

@media (max-width: 1260px){
  .content .left {width: 20%;}
  .content .right {width: 76%;}
  .content .right .col1 {width: 72%;}
  .content .right .col2 {width: 24%;}

  .home .content .left {width: 30%; margin: 0;}
  .home .content .right {width: 66%; margin: 0;}
  .home .content .right .top {margin: 0 0 3% 0;}
  .home .content .right .col1 {width: 38%;}
  .home .content .right .col2 {width: 58%;}
  .home .content .right .col2 .left {width: 48%; margin: 0;}
  .home .content .right .col2 .right {width: 48%; margin: 0;}

  .home .newsbox .inner {height: 0; padding-bottom: 92%;}
  .home .newsbox.mainnewsbox .inner {padding-bottom: 60%;}

  .newsbox.widenewsbox .image {width: 47%;}
  .newsbox.widenewsbox .inner {width: 53%; padding-bottom: 42%;}

  .twitter {height: auto;}
  .twitter .image {width: 43%; height: 0; padding-bottom: 43%;}
  .twitter .text {width: 52%;}

  .governors .governor .image {width: 16%;}
  .governors .governor .text {width: 81%;}

  .newsfeedmain .newsstory .image {width: 16%;}
  .newsfeedmain .newsstory .text {width: 81%;}

  .footer .left {width: 70%;}
  .footer .left .col1 {width: 12%; margin: 0 4% 0 0;}
  .footer .left .col2 {width: 28%; margin: 0 1% 0 0;}
  .footer .left .col3 {width: 40%; margin: 0 19px 0 0;}
  .footer .left .col4 {width: 8%; margin: 0;}
  .footer .right {width: 25%;}

  .bottom-footer .col1 {width: 25%; margin: 0 2% 0 0;}
  .bottom-footer .col2 {width: 38%; margin: 0;}
  .bottom-footer .col3 {width: 20%; margin: 0;}
}

@media (max-width: 1200px){
  .banners .banner .inner .bannertext {right: 20px;}
  .banners .slick-dots {max-width: 100%; padding-right: 20px; box-sizing: border-box;}

  .banners {height: 0; padding-bottom: 42.4%;}
}

@media (max-width: 1100px){
  .home .content .left {width: 100%; margin: 0 0 20px 0;}
  .home .content .right {width: 100%; margin: 0;}
  .home .content h1 {padding: 0 0 20px 0;}
}

@media (max-width: 990px){
  .banners .banner .inner .bannertext h2 {font-size: 220%;}
  .banners .banner .inner .bannertext p {font-size: 110%;}

  .footer {padding: 80px 0 0 0;}
  .footer .left {width: 100%;}
  .footer .right {width: 100%; margin-top: 20px;}
  .footer .share {float: none;}

  .bottom-footer .col1 {width: 100%; margin: 0;}
  .bottom-footer .col2 {width: 100%; margin: 0;}
  .bottom-footer .col3 {width: 100%; margin: 0; text-align: left;}
}

@media (max-width: 1035px){
  .header .right {width: 650px;}
  .header .right .col1 {width: 315px; padding: 30px 0 0 0;}
  .header p {font-size: 200%;}
}

@media (max-width: 800px){
  .galleries .gallery {width: 31%;}
  .grid .box {width: 31%;}

  .grid.simplegrid .box {width: 98%;}
  .grid.simplegrid .box a h3 {min-height: 5px;}
}

@media (max-width: 840px){
  .header-wrap, .nav-wrap {display: none;}

  .mobile-header-wrap {display: block; width: 100%; background: #ffffff;}
  .mobile-header {padding: 15px 20px; background: #ffffff;}
  .mobile-header .left {float: left; width: 60px;}
  .mobile-header .right {float: right; text-align: right;}
  .mobile-header a.logo {display: block; width: 100%; height: 62px; background: url(../images/svgs/logo.svg) no-repeat 0 0; background-size: 100%;}
  .mobile-header p {font-size: 160%; padding: 0; font-weight: 300; color: #231f20; line-height: 100%; display: inline-block; max-width: 120px;}
  .mobile-header .right a {display: inline-block; width: 90px; margin: 0 0 0 20px;}

  .mobile-nav .top {background: #be1e2d; padding: 15px 20px; cursor: pointer;}
  .mobile-nav .top p {padding: 4px 0 0 0; float: left; line-height: 100%; color: #ffffff; text-transform: uppercase; font-weight: 700; font-size: 80%;}
  .mobile-nav .nav-icon {
    width: 27px;
    height: 20px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
    cursor: pointer;
    float: right;
  }
  .mobile-nav .nav-icon span {display: block; position: absolute; height: 3px; width: 100%; background: #ffffff; border-radius: 0; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: 0.25s ease-in-out; -moz-transition: 0.25s ease-in-out; -o-transition: 0.25s ease-in-out; transition: 0.25s ease-in-out;}
  .mobile-nav .nav-icon span:nth-child(1) {top: 0;}
  .mobile-nav .nav-icon span:nth-child(2), .mobile-nav .nav-icon span:nth-child(3) {top: 7px;}
  .mobile-nav .nav-icon span:nth-child(4) {top: 14px;}
  .mobile-nav .open .nav-icon span:nth-child(1) {top: 21px; width: 0%; left: 50%;}
  .mobile-nav .open .nav-icon span:nth-child(2) {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);}
  .mobile-nav .open .nav-icon span:nth-child(3) {-webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg);}
  .mobile-nav .open .nav-icon span:nth-child(4) {top: 18px; width: 0%; left: 50%;}
  .mobile-nav ul {padding: 0; margin: 0; display: none;}
  .mobile-nav ul ul {padding: 0; margin: 0; display: none;}
  .mobile-nav li {list-style: none; position: relative; font-size: 100%; padding: 0; background: none;}
  .mobile-nav li a {display: block; padding: 15px 65px 15px 20px; color: #ffffff; text-transform: uppercase; font-weight: 700; font-size: 80%; text-decoration: none; background: #be1e2d;}
  .mobile-nav li.selected a {background: #524c4d; color: #ffffff;}
  .mobile-nav li span {position: absolute; top: 0; cursor: pointer; right: 0; width: 52px; height: 52px; text-align: center; line-height: 52px; background: rgba(0, 0, 0, 0.2); color: #ffffff; z-index: 2; font-size: 140%; font-weight: 700;}
  .mobile-nav li li a {padding: 10px 65px 10px 40px; font-size: 80%; background: #e03d4c;}
  .mobile-nav li.selected li.selected a {background: #ff3b4d; color: #ffffff;}
  .mobile-nav li.selected li a {background: #e03d4c; color: #ffffff;}
  .mobile-nav li.selected ul {display: block;}
  .mobile-nav li li span {height: 42px; line-height: 42px;}
  .mobile-nav li li li a {padding: 10px 65px 10px 60px; background: #f2f2f2!important; color: #393536!important;}
  .mobile-nav li li li.selected a {background: #f2f2f2!important; color: #be1e2d!important;}

  .connect-wrap {display: none;}
  .mobile-connect-wrap {display: block; background: #393536;}
  .mobile-connect-wrap .button {display: block; padding: 20px; border-radius: 0; color: #ffffff; background: #393536; text-transform: uppercase; font-weight: 700; font-size: 80%; line-height: 100%; text-align: center;}
  .mobile-connect-wrap .button:hover {color: #ffffff;}
  .mobile-connect-wrap .mobile-connect {display: none;}
  .mobile-connect-wrap .mobile-connect .inner {padding: 20px; text-align: center;}
  .mobile-connect-wrap .mobile-connect .inner .logo {display: inline-block; text-align: center; vertical-align: top; width: 33.3333%; box-sizing: border-box; padding: 0 20px; position: relative; height: 100px;}
  .mobile-connect-wrap .mobile-connect .inner .logo img {display: inline-block; max-height: 80px; max-width: 80%; width: auto; position: absolute; top: 50%; left: 0; right: 0; margin: 0 auto; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%);}
}

@media (max-width: 768px){
  .gridboxes .box {width: 48%;}
}

@media (max-width: 680px){
  p, li, label, table th, table td {font-size: 100%;}

  .header-wrap, .nav-wrap, .snav, .newsarchive {display: none;}

  .banners {height: auto; padding-bottom: 0;}
  .banners .banner .overlay {display: none;}
  .banners .banner .image {max-width: 100%;}
  .banners .banner .image .overlayleft {display: none;}
  .banners .banner .image .overlayright {display: none;}
  .banners .banner .inner {max-width: 100%; width: 100%; position: static; height: auto;}
  .banners .banner .inner .bannertext {max-width: 100%; width: 100%; position: static; text-align: left; transform: none; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; padding: 30px 20px; box-sizing: border-box;}
  .banners .slick-dots {margin: 0; max-width: 100%; width: 100%; position: absolute; bottom: auto; top: 20px; text-align: right;}

  .breadcrumb p {padding: 0 0 10px 0;}

  .notice p {max-width: 100%;}

  .quicklinks {display: none;}

  .title {padding: 20px 0;}
  .title p {font-size: 200%;}

  .content {padding: 30px 0;}
  .content .left {width: 100%;}
  .content .right {width: 100%;}
  .content .right .col1 {width: 100%;}
  .content .right .col2 {width: 100%;}

  .content .columns {width: 100%; margin-left: 0%;}
  .content .columns .column {width: 100%; margin: 0;}

  .home .content h1 {padding: 0 0 10px 0;}
  .home .content .right .col1 {width: 100%; margin: 0 0 20px 0;}
  .home .content .right .col2 {width: 100%;}
  .home .content .right .col2 .left {width: 100%; margin: 0 0 20px 0;}
  .home .content .right .col2 .right {width: 100%; margin: 0;}

  .home .newsbox .inner, .home .newsbox.mainnewsbox .inner {padding-bottom: 20px; height: auto;}

  .governors .governor .image {width: 26%;}
  .governors .governor .text {width: 71%;}

  .sidebar-buttons {position: static; width: 100%;}
  .sidebar-buttons a {width: 100%; box-sizing: border-box; padding: 10px 10px; text-indent: 0; font-size: 90%;}
  .sidebar-buttons a.rossettschoolbutton {background: #be1e2d; height: auto; color: #ffffff!important;}
  .sidebar-buttons a.sportscentrebutton {background: #5ba3dc; height: auto; color: #ffffff!important;}
  .sidebar-buttons a.adultlearningbutton {background: #e0a151; margin-top: 0; height: auto; color: #ffffff!important;}

  .accreditations-wrap {background: #292627;}
  .accreditations .inner {display: block;}
  .accreditations .inner .logo {display: block; padding: 0; float: left; width: 33.3333%; height: 70px; position: relative;}
  .accreditations .inner .logo img {display: inline-block; vertical-align: middle; max-height: 40px; max-width: 100%; width: auto; position: absolute; top: 50%; left: 0; right: 0; margin: 0 auto; transform: translate(0, -50%);}

  .footer-wrap {background: #393536;}
  .footer-wrap .footer-block {display: none;}
  .footer {padding: 30px 0;}
  .footer .left .col1 {max-width: 100px; width: 100%; margin: 0 0 20px 0; float: none;}
  .footer .left .col2 {width: 100%; margin: 0 0 10px 0;}
  .footer .left .col3 {width: 100%; margin: 0 0 20px 0;}
  .footer .left .col4 {max-width: 60px; width: 100%; margin: 0; float: none;}
}

@media (max-width: 550px){
  .content-wrap.default .gridboxes {width: 100%; margin-left: 0;}
  .content-wrap.default .gridboxes .box {width: 100%; margin: 0 0 20px;}
  .gridboxes {width: 100%; margin-left: 0;}
  .gridboxes .box {width: 100%; margin: 0 0 20px;}
}

@media (max-width: 480px){
  .galleries .gallery {width: 48%;}
  .grid .box {width: 48%;}

  .newsfeedmain .newsbox {width: 100%;}

  .newsbox.widenewsbox .image {width: 100%;}
  .newsbox.widenewsbox .inner {width: 100%; padding-bottom: 20px; height: auto;}

  .newsfeedmain .newsstory .image {width: 100%; margin: 0 0 20px 0;}
  .newsfeedmain .newsstory .text {width: 100%;}

  input[type="submit"], button, input[type="button"] {width: 100%;}
}

@media (max-width: 380px){
  .grid .box {width: 98%;}
  .grid .box h3 {min-height: 5px;}

  .governors .governor .image {width: 100%; margin: 0 0 10px 0;}
  .governors .governor .text {width: 100%;}
}

@media (max-width: 340px){
  .mobile-header p {font-size: 120%; max-width: 100px;}
  .mobile-header .right a {margin: 0 0 0 10px;}
}
