/****************************
If you would like to make a global change on colors or font please find and replace all the following: 

Dark color: #108247
Light color: #d8d4d4

Font: 'Gudea', sans-serif
****************************/

html,
body {
  height: 100%;
  /*font-family: "Trebuchet MS","Lucida Grande","Lucida Sans Unicode","Lucida Sans",Tahoma,sans-serif;*/
  font-family: "Montserrat", sans-serif;
  color: #8f8f8f;
  font-size: 16px;
}
/* Wrapper for page content to push down footer */
#wrap {
  min-height: 100%;
  height: auto !important;
  height: 100%;
  /* Negative indent footer by it's height */
  /* ----- Margin for Single Column Sticky Footer -----*/
  margin: 0 auto -231px;
  /* ----- Margin for Two Column Sticky Footer -----*/
  /*margin: 0 auto -264px;*/
}

/* Set the fixed height of the footer here */
#push/*, #footer*/ {
  /* ----- Height for Single Column Sticky Footer -----*/
  height: 231px;
  /* ----- Height for Two Column Sticky Footer -----*/
  /*height: 264px;*/
}

h1,
h2,
h3,
h4,
h5 {
  margin-top: 10px;
  margin-bottom: 10px;
}
.h2,
h2 {
  font-size: 24px;
}

#page-top {
  position: relative;
}
#page-top.other-page {
  height: auto;
  margin-top: 0;
}
#page-top.other-page #homepage_slideshow {
  display: none;
}
#page-top.other-page #strapline {
  display: none;
}
nav.home-nav {
  z-index: 2;
  position: absolute;
  width: 100%;
}

a {
  color: #2a4e95;
  word-break: break-word;
}
a:focus,
a:hover {
  color: #ffd400;
  text-decoration: none;
}
h1.welcome {
  color: #2a4e95;
  font-size: 45px;
  font-family: "Signika", sans-serif;
}
h2.welcome {
  color: #2a4e95;
  font-size: 35px;
  font-family: "Signika", sans-serif;
}
#school-logo-mobile {
  height: 150px;
  max-height: 150px;
  background: #108247;
  padding: 10px;
}
#school-logo-mobile .container,
#school-logo-mobile .row,
#school-logo-mobile .col-xs-12.col-sm-12,
#school-logo-mobile .img-responsive {
  height: 100%;
}
#school-logo-mobile .img-responsive {
  margin: auto;
}
#page-top {
  position: relative;
  height: 100%;
}
#page-top #header-logo {
  padding-right: 0px;
  z-index: 9999;
  height: auto;
  max-height: 300px;
}
#page-top #header-logo .logo-container {
  height: 100%;
  position: relative;
  background: #2a4e95;
  display: block;
  padding: 10px 3px;
  box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.64);
}
#header-logo img {
  margin-bottom: 20px;
  margin: auto;
}
#page-top.other-page {
  position: relative;
  height: auto;
}
#page-top .container-fluid {
  padding: 0px;
}
#page-top .row {
  padding-left: 15px;
}
#page-top #header-logo {
  padding-right: 0px;
  z-index: 9999;
}
#page-top #header-navbar {
  padding: 0px;
}
#page-top #header-navbar ul#menu {
  list-style: none;
  width: 100%;
  padding-left: 0px;
  padding: 0px;
  margin: 0px;
  font-size: 0px;
  background: #2a4e95;
  display: flex;
}
#badge-logo img {
  position: absolute;
  z-index: 200;
}
#page-top #header-navbar ul#menu li.topItem {
  text-align: center;
  -webkit-flex: auto; /* Safari 6.1+ */
  -ms-flex: auto; /* IE 10 */
  flex: auto;
}
#page-top #header-navbar ul#menu li.topItem a {
  text-decoration: none;
  font-size: 15px;
  color: #ffffff;
  padding: 10px;
  display: block;
  font-weight: 700;
  font-family: "Muli", sans-serif !important;
  transition: 0.3s;
  overflow: hidden;
  text-overflow: ellipsis;
}
#page-top #header-navbar ul#menu li.topItem a:hover {
  color: #ffd400;
}
#page-top #header-navbar ul#menu li.subItem a:hover {
  color: #fff;
}
#page-top #header-navbar ul#menu li.topItem > ul li a {
  padding: 15px;
}
#page-top #header-navbar ul#menu li.topItem > ul {
  display: none;
  padding: 0px;
  background: #108247;
}
#page-top #header-navbar ul#menu li.topItem:hover {
  cursor: pointer;
}
#page-top #header-navbar ul#menu li.topItem:hover > ul {
  position: absolute;
  background: #2a4e95;
  list-style: none;
  display: block;
  width: auto;
  cursor: pointer;
}
#page-top #header-navbar ul#menu li.topItem:hover > ul li.subItem {
  text-align: left;
}
#page-top #header-navbar ul#menu li.topItem:hover > ul li.subItem > ul.right {
  display: none;
  position: absolute;
  text-align: left;
}
#page-top #header-navbar ul#menu li.topItem:hover > ul li.subItem:hover {
  cursor: pointer;
  background: #1c3e84;
}
#page-top
  #header-navbar
  ul#menu
  li.topItem:hover
  > ul
  li.subItem:hover
  > ul.right {
  position: absolute;
  padding: 0;
  list-style: none;
  background: #2a4e95;
  margin-top: -51px;
  display: block;
}
ul#menu ul ul {
  margin-left: 100%;
}
#page-top .container.other-page {
  padding: 0px;
}
#page-top .container.other-page .row {
  padding: 0px;
}
#page-top .container.other-page #login {
  float: right;
  width: 30%;
}
#slider_caption_position {
  position: absolute;
  padding-left: 40px;
  padding-right: 40px;
  bottom: 130px;
  background-color: rgba(42, 78, 149, 0.7);
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
  z-index: 100;
}
.slider_caption {
  color: #fff;
}
h2.slider_caption {
  font-size: 80px;
  letter-spacing: 2px;
  font-family: "Quicksand", Sans-serif !important;
}
h3.slider_caption {
  font-size: 45px;
  font-family: "Quicksand", Sans-serif !important;
  margin-left: 10px;
}
#page-top.other-page {
  background: #2a4e95;
}
#login h2 {
  text-align: center;
}
#login #studentlogin {
  width: 100%;
}
#login #studentlogin .username,
#login #studentlogin .username #username,
#login #studentlogin .password #password {
  width: 100%;
}
#login #studentlogin .password {
  width: 50%;
  display: inline-block;
  margin-top: 5px;
}
#login #studentlogin .go {
  width: 48%;
  display: inline-block;
  padding: 1px;
  margin-top: 5px;
}
#login #studentlogin .username #username,
#login #studentlogin .password #password {
  padding: 5px;
}
#login #studentlogin .gobutton {
  width: 102%;
  padding: 5px;
  margin-left: 3px;
}
#main-school-slogan {
  background: #2a4e95;
  margin-top: -60px;
  overflow: hidden;
}
#main-school-slogan h2 {
  margin: 0px;
  padding: 30px;
  font-size: 22px;
  color: #ffffff;
  font-style: italic;
  font-family: "Signika", sans-serif;
}
#main-text {
  padding: 30px 0px;
}
#main-text.home {
  margin-top: 100px;
}
#main-text.home p,
#main-text.home span,
#main-text.home {
  text-align: center !important;
}
#main-text .container #content.home,
#main-text .container #builder-content.home {
  text-align: center;
}
#main-text .container #content,
#main-text .container #builder-content {
  padding: 20px 0px;
  border-radius: 8px;
}
#main-text #content p,
#main-text #builder-content p {
  text-align: left;
  font-size: 16px !important;
}
#main-text .container #login {
  padding: 15px;
  border: 2px solid #065c91;
  background: #065c91;
  color: #ffffff;
  border-radius: 8px;
}
#main-text .container #login .gobutton {
  background: #ffffff;
  color: #065c91;
  padding: 5px;
  font-weight: 600;
  cursor: pointer;
}
#main-text .container #login #studentlogin .go {
  width: 50%;
  display: inline-block;
  margin-top: 5px;
}
#main-text .container #login #studentlogin .password {
  width: 49%;
  display: inline-block;
  margin-top: 5px;
}
#main-text .container #login .textfield {
  border: 0px;
}
#main-text .container #login #studentlogin .go {
  padding: 0px;
}
#main-text .container #login h2 {
  margin-bottom: 10px;
}
#main-text .container #login .login_fail {
  color: #f00 !important;
  font-size: 15px !important;
  margin-bottom: 5px !important;
  font-weight: 600 !important;
}
#main-text .container #pupil-login-container {
  margin-bottom: 10px;
}
#main-text .container #staff-login-container a {
  padding: 10px;
  transition: 0.5s;
  border: 2px solid #065c91;
  background: #065c91;
  color: #ffffff;
  display: block;
  font-size: 20px;
  border-radius: 8px;
}
#main-text .container #golden-stars-download-container {
  padding: 20px;
}
#main-text .container #golden-stars-download-container ul {
  list-style: none;
  padding: 0px;
}
#main-text .container #golden-stars-download-container ul li {
  text-align: left;
}
#main-text .container #golden-stars-download-container h3 i.fa-star {
  margin-top: 1px !important;
  color: gold;
}
#main-text .container #staff-login-container a:hover {
  background: #ffffff;
  color: #065c91;
}
#school_blogs {
  padding: 10px;
  border-radius: 8px;
  background: #2a4e95;
}
#school_blogs h1 {
  text-align: center;
  color: #fff;
  margin-top: 0px;
}
.blog-circle h1 {
  float: left;
  width: 43px;
  height: 43px;
  margin-right: 10px;
  border-radius: 30px;
  border: 2px solid;
  font-size: 30px;
  padding-top: 3px;
}

#school_blogs h3 {
  font-size: 18px;
  color: #fff;
  line-height: 24px;
}
#school_blogs span {
  display: block;
  font-size: 14px;
  margin-top: -5px;
}
/************** BOTTOM BOARDS *************/
#bottom-blocks {
  background: #e4e0e0;
  padding: 20px;
}
#bottom-blocks .darker .panel-footer,
#bottom-blocks .lighter .panel-footer {
  border: 0;
  border-top: 2px solid #adadad;
}
#bottom-blocks .darker,
#bottom-blocks .darker .panel-footer {
  background: #2a4e95;
  border-radius: 8px;
}
#bottom-blocks .lighter,
#bottom-blocks .lighter .panel-footer {
  background: #2a4e95;
  border-radius: 8px;
}
#bottom-blocks .panel-heading .image-container {
  max-height: 200px;
  height: 200px;
  width: 100%;
}
#bottom-blocks .panel-heading .image-container .image {
  background: url("../images/news.png") no-repeat;
  background-size: cover !important;
  height: 100%;
  width: 100%;
  background-position: center;
}
#bottom-blocks .panel-heading .image-container .image-2 {
  background: url("../images/events.png") no-repeat;
  background-size: cover !important;
  height: 100%;
  width: 100%;
  background-position: center;
}
#bottom-blocks .panel-heading .image-container .image-3 {
  background: url("../images/calendar.png") no-repeat;
  background-size: cover !important;
  height: 100%;
  width: 100%;
  background-position: center;
}
#bottom-blocks .panel-body {
  padding: 15px;
  padding-top: 0px;
  height: 200px;
}
#bottom-blocks .panel-body .box {
  width: 100%;
}
#bottom-blocks .panel-body .box p {
  padding: 5px;
  margin-bottom: 5px;
}
#bottom-blocks .panel-body h2 {
  margin: 0px;
  margin-bottom: 10px;
  text-align: center;
  font-size: 32px;
}
#bottom-blocks .panel-body h2 a {
  color: #ffffff;
  font-family: "Signika", sans-serif;
}
#bottom-blocks .panel-body a,
#bottom-blocks a.panel-footer-link .panel-footer {
  color: #ffffff;
}
#bottom-blocks .panel-body a:hover,
#bottom-blocks a.panel-footer-link .panel-footer:hover {
  color: #ffd400;
}
/************** GOOGLE MAPS ***************/
#google-maps .container-fluid {
  padding: 0px;
  height: 250px;
}
#google-maps iframe {
  margin-bottom: -5px;
}
/************** TWITTER *****************/
#twitter-title {
  margin-bottom: 20px;
  color: #055c91;
}
#twitter-blocks .darker .panel-footer,
#twitter-blocks .lighter .panel-footer {
  border: 0;
  border-top: 2px solid #adadad;
}
#twitter-blocks .darker,
#twitter-blocks .darker .panel-footer {
  background: #108247;
}
#twitter-blocks .lighter,
#twitter-blocks .lighter .panel-footer {
  background: #842943;
}
#twitter-blocks .panel-heading {
  display: inline-block;
}
#twitter-blocks .panel-heading img {
  height: 50px;
  width: 50px;
  float: left;
}
#twitter-blocks .panel-heading .profile_text {
  float: left;
  margin-top: 5px;
  margin-left: 15px;
}
#twitter-blocks .panel-heading .profile_text p {
  margin: 0px;
  color: #ffffff;
}
#twitter-blocks .panel-heading .profile_text p:hover {
  color: #ff8c00;
}

#twitter-blocks .panel-body {
  padding: 15px;
  border-top: 2px solid #adadad;
  color: #ffffff;
}
#twitter-blocks .panel-body .image-container {
  max-height: 200px;
  height: 200px;
  overflow: hidden;
  margin-top: 10px;
  margin-bottom: 10px;
}
#twitter-blocks .panel-body .image-container .image-0,
#twitter-blocks .panel-body .image-container .image-1,
#twitter-blocks .panel-body .image-container .image-2 {
  height: 100%;
  width: 100%;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
#twitter-blocks .panel-body .last {
  margin-top: 10px;
}
#twitter-blocks .panel-body .box {
  width: 100%;
}
#twitter-blocks .panel-body .box p {
  padding: 5px;
}
#twitter-blocks .panel-body h2 {
  margin: 0px;
  margin-bottom: 10px;
  text-align: center;
}
#twitter-blocks .panel-body h2 a {
  color: #ffffff;
}
/********** CONTACT BLOCK ***************/
#contact_block {
  background-color: #2a4e95;
  color: #fff;
  padding: 25px;
  position: relative;
}
section.contact-section {
  background-color: #69567e;
  color: #fff;
}
.col-md-12.contact {
  margin-bottom: 16px;
}
.contact-icon {
  padding: 20px 0 30px;
}
.contact-upper {
  font-size: 18px;
  padding-top: 2px;
}
.contact-lower {
  font-size: 23px;
}
.contact-lower a {
  color: #fff;
  transition: 0.5s color ease;
}
.contact-lower a:hover {
  color: #ffd400;
}
#footer_logins .col-sm-12,
#footer_logins .col-xs-12 {
  padding: 15px;
  font-size: 20px;
}
#footer_logins a {
  background: #2a4e95 !important;
  color: #ffffff !important;
  border-bottom: 2px solid #fff !important;
  font-family: "Signika", sans-serif;
}
#footer_block {
  text-align: center;
  padding: 20px;
}
#footer_pupil_login {
  height: 45px;
  background: #842943;
  color: #ffffff;
  font-weight: 600;
  cursor: pointer;
}
#footer_pupil_login h5 {
  margin-top: 15px;
}
#footer_pupil_login_panel {
  display: none;
  padding: 15px;
}
#footer_pupil_login_panel #login h2,
#footer_pupil_login_panel #login .go {
  display: none !important;
}
#footer_pupil_login_panel #login .username,
#footer_pupil_login_panel #login .password {
  padding: 10px !important;
  width: 100% !important;
}
#footer_pupil_login_panel #login input.textfield {
  width: 100% !important;
  margin: 0px !important;
  padding: 10px !important;
  border: 2px solid #108247;
}
#footer_logins .row {
  margin-left: auto;
  margin-right: auto;
}
/************* FOOTER *******************/
section#footer footer {
  text-align: center;
  padding: 15px;
  background: #000000;
  color: #ffffff;
  font-weight: 600;
}

.top_border_darker {
  border-top: 2px solid #2a4e95;
}
.top_border_lighter {
  border-top: 2px solid #2a4e95;
}
.bottom_border_lighter {
  border-bottom: 2px solid #2a4e95;
}

/************** IMAGE CAROSUEL ***********/

#header-carousel {
  position: absolute;
  width: 100%;
  height: 100%;
  max-height: 100%;
  overflow: hidden;
}
#header-carousel .slides {
  height: 100%;
  width: 100%;
}
#header-carousel .slides .image-1,
#header-carousel .slides .image-2,
#header-carousel .slides .image-3 {
  height: 100%;
  width: 100%;
  background-size: cover !important;
  background-position: top left, 0px 0px !important;
}
#header-carousel .slides .image-1 {
  background: url("../images/Bottom-1.jpg?v=0.1") no-repeat;
}
#header-carousel .slides .image-2 {
  background: url("../images/Bottom-2.jpg") no-repeat;
}
#header-carousel .slides .image-3 {
  background: url("../images/Bottom-3.jpg") no-repeat;
}

.header-carousel-container #login {
  z-index: 9999;
  position: absolute;
  right: 0;
  right: 5%;
  bottom: 5%;
  background: rgba(255, 255, 255, 0.91);
  padding: 20px;
  border: 2px solid rgba(16, 130, 71, 0.39);
  box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.64);
}

.box .content p .fa.fullstop {
  margin-top: 3px;
  margin-right: 15px;
  color: #ffffff;
}

/************** BOTTOM LINKS ***********/
#quick-blocks {
  background: #2a4e95;
}
#quick-blocks .hvr-shutter-out-horizontal {
  background: #2a4e95 !important;
  border-right: 2px solid #fff;
}
#quick-blocks .hvr-shutter-out-horizontal:before {
  background: #fff !important;
}

#facebook-link a,
#twitter-link a,
#insta a {
  text-align: center;
  color: #fff;
  font-size: 28px;
  padding: 50px;
  display: block;
  font-family: "Signika", sans-serif;
}

#facebook-link a:hover,
#twitter-link a:hover,
#insta a:hover {
  color: #2a4e95;
}

#facebook-link,
#twitter-link,
#insta {
  padding: 0;
}
#insta {
  border: 0 !important;
}
/************** LOGOS ***********/

#logo_awards {
  background: #fff;
  padding: 20px;
}

#logo_awards img {
  margin: auto;
}

.schoolspider {
  color: #ffd400;
}

.schoolspider:hover {
  color: #fff;
}

@media (min-width: 470px) {
  #main-school-slogan h2 {
    font-size: 30px;
  }
}
@media (min-width: 768px) {
  #main-text.home {
    margin-top: 140px;
  }
}
@media (min-width: 992px) {
  /*#main-school-slogan {
		display: none;
	}*/
  #main-text.home {
    margin-top: 0;
  }

  /* ----- Wrap and Push for Single Column Sticky Footer -----*/
  #wrap {
    margin: 0 auto -52px;
  }
  #push {
    height: 52px;
  }
}