@import url("/media/templates/site/cassiopeia_main/css/base.css");

:root {
  --body-color: #333 !important;
  --body-font-size: 15px !important;
  --body-font-weight: 300 !important;

  --cassiopeia-color-primary: #546d77 !important;
  --cassiopeia-color-secondary: #546d77 !important;
  --cassiopeia-color-link: #11143e !important;
  --cassiopeia-color-hover: #282728 !important;

  --cassiopeia-font-family-body: "Open Sans", sans-serif !important;
  --cassiopeia-font-weight-normal: 300 !important;
  --cassiopeia-font-family-headings: "Open Sans", sans-serif !important;
  --cassiopeia-font-weight-headings: 400 !important;
}


/* HTML TAGS/GENERIC CLASSES */

iframe {
  max-width: 100%;
}

b, strong {
  font-weight: bold;
}

h1, h2, h3, h4, h5, h6 {
  margin: 9px 0;
  font-family: 'Open Sans';
  font-weight: 300;
  line-height: 1.2;
  text-rendering: optimizelegibility;
  color: #2b3349;
  text-transform: uppercase;
  margin-bottom: 10px !important;
}

h1 {
  font-size: 34px;
  line-height: 38px;
}

h2 {
  font-size: 30px;
  line-height: 34px;
}

h3 {
  font-size: 26px;
  line-height: 30px;
}

h4 {
  font-size: 20px;
  line-height: 24px;
}

a {
  color: #000;
  text-decoration: underline !important;
}

a:hover, a:focus {
  color: #506c77;
  text-decoration: underline !important;
}

main#content a {
  text-decoration: underline !important;
}

h1 a, h2 a, h3 a {
  color: #2b3349;
  text-decoration: none !important;
}

h1 a:hover, h2 a:hover, h3 a:hover {
  text-decoration: none !important;
}

p {
  margin: 0 0 16px;
}

.btn {
  background: #5d7589 !important;
  color: #ffffff !important;
  border: 0 none !important;
  text-shadow: none !important;
  box-shadow: none !important;
  border-radius: 4px !important;
  font-size: 16px !important;
  padding: 6px 16px !important;
  line-height: 18px !important;
  font-family: Open Sans !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  text-decoration: none !important;
}

.btn:hover, .btn:focus {
  background: #2b3349 !important;
  color: white !important;
  text-decoration: none !important;
}

.form-label {
  font-weight: 500;
}

.rsform-calendar-button {
  margin-left: 5px !important;
  margin-top: -2px !important;
}

/* NAVBAR */

.topbarmenu {
  position: relative;
}

.topbarmenu .mod-menu {
  justify-content: flex-end;
}

.topbarmenu .mod-custom {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  margin-top: 5px;
  position: absolute;
  right: 0;
}

.topbarmenu .mod-custom a {
  margin-left: 0 !important;
  font-size: 13px !important;
  text-decoration: none !important;
}

.topbarmenu .mod-custom a:hover {
  text-decoration: none !important;
}

.topbarmenu .mod-custom > .moduletable {
  max-width: unset !important;
  margin: unset !important;
  text-align: unset !important;
}

.topbarmenu .mod-finder input {
  border-radius: 1px !important;
  box-shadow: none;
  border-color: #FFF !important;
  padding: 3px;
  background: none;
  color: #ffffff !important;
  text-shadow: none !important;
  height: 25px;
}

.topbarmenu .mod-finder input::placeholder {
  font-size: 13px;
  color: lightgrey;
}

.topbarmenu .mod-finder button {
  margin-left: 1px !important;
  padding: 0 !important;
  font-size: 0 !important;
}

.topbarmenu .mod-finder span {
  font-size: 13px;
  margin-left: 5px;
}

.topbarmenu img {
  max-width: 17px;
  width: auto;
  margin-right: 3px;
}

header.container-header .grid-child.container-menuwrap::after {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  content: "";
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 25%, rgba(255, 255, 255, 1) 75%, rgba(255, 255, 255, 0) 100%);
  height: 1px;
  max-width: 1100px;
  margin: 0 auto;
  background-position: bottom center;
}

header.container-header .container-menuwrap {
  align-items: flex-end;
  padding-bottom: 0;
  margin-top: 10px;
}

header.container-header .navbar-brand img {
  height: auto;
  width: 200px;
  margin-bottom: 10px;
}

/* NAVBAR ITEMS */
header.container-header .container-menuwrap .mod-menu > li {
  padding: 8px 12px !important;
}


header.container-header .container-menuwrap .mod-menu li.level-2 {
  padding: 0;
}

header.container-header .container-menuwrap .mod-menu button,
header.container-header .container-menuwrap .mod-menu a {
  font-size: 15px !important;
  font-weight: var(--body-font-weight);
}

header.container-header .container-menuwrap .mod-menu__heading.nav-header {
  background: #2b3348 !important;
  color: white;
  text-shadow: none;
  width: 100%;
  padding: 3px 9px !important;
  border-bottom: 1px solid white;
  font-size: 13px;
  font-weight: 300;
  text-transform: uppercase;
}

header.container-header .container-menuwrap .mod-menu li.level-2 a {
  clear: both;
  color: white !important;
  display: block;
  font-weight: normal;
  line-height: 18px;
  margin: 0;
  padding: 3px 9px !important;
  white-space: nowrap;
  background: #415D68 !important;
  font-size: 13px !important;
  font-weight: 300;
  border-bottom: 1px solid white;
  width: 100%;
  text-decoration: none !important;
}

header.container-header .container-menuwrap .mod-menu li.level-2 a:hover {
  background: #FFFFFF !important;
  filter: none;
  color: #2b3349 !important;
}


/* TOP BANNER */

.container-banner.full-width {
  margin-bottom: 0 !important;
}

.container-banner .carousel h3 {
  color: white;
  margin-bottom: 10px !important;
  font-size: 28px;
}

.container-banner .carousel .carousel-inner .carousel-item::after {
  content: "";
  background-color: rgba(80, 108, 119, 0.5);
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.container-banner .carousel .carousel-inner .carousel-caption {
  z-index: 2;
}

.container-banner .carousel .carousel-indicators {
  bottom: 60px;
  z-index: 3 !important;
}

.container-banner .carousel .carousel-indicators button {
  background-color: white !important;
  border-color: white !important;
  padding: 5px !important;
  width: 4px;
  border-radius: 100% !important;
}

/* BODY */

.gradient-header {
  width: 100%;
  min-height: 100px;
  background: linear-gradient(180deg, #506C77 0%, #528e9d 100%);
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  color: white;
  padding-bottom: 61px;
  position: relative;
  margin-bottom: 40px;
}

.gradient-header::after {
  content: "";
  height: 88px;
  background-image: url(/media/templates/site/cassiopeia_main/images/wavewhite.svg);
  z-index: 9;
  width: 100%;
  display: block;
  position: absolute;
  background-position: bottom center;
  background-size: 100% auto;
  background-repeat: no-repeat;
  bottom: 0;
}

.gradient-header h1 {
  margin-top: 50px;
  color: white !important;
}

.com-content-article > .page-header, .com-content-category-blog > h1 {
  display: none;
}

main:not(.view-search) {
  margin-top: 0 !important;
}

.i51imagecontentrows {
  z-index: 9;
}

.com-content-article__body {
  clear: both;
}

.container-component {
  margin-bottom: 0;
}

.item-page .none.item-image {
  width: 100% !important;
  float: none !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: center;
}

.item-page .none.item-image img {
  width: 100% !important;
}

.category-desc > img {
  float: left;
  max-width: 400px;
  margin: 0 10px 10px 0;
}

/* LIST VIEWS */
th.list-title a {
  font-weight: 300;
}

/* HOMEPAGE GRID */

/* gridright/gridleft is on the homepage */
.gridright h3 {
  background: white;
  border-radius: 4px;
  color: #2b3348 !important;
}

.gridleft h2 {
  background: white;
  border-radius: 4px;
  padding: 4px 16px;
  padding-top: 2px;
  text-transform: capitalize;
  font-size: 30px;
  color: #2b3348 !important;
}

/* ACADEMY PAGES */
.academydetails, .vacancydetails {
  background: #f3f3f3;
  padding: 10px;
  margin-bottom: 20px;
}

/*.academydetails .fieldlist-container {
display: flex;
flex-wrap: wrap;
}*/

.academydetails .fieldlist-entry {
  border-bottom: 1px solid white;
  padding-bottom: 4px;
  margin-bottom: 4px;
  font-size: 14px;
  line-height: 16px;
  flex-basis: 33.33%;
}

.academydetails .fieldlist-entry {
  font-size: 14px;
  line-height: 17px;
  margin-bottom: 8px;
}

.fieldlist-label {
  font-weight: normal;
  display: block;
}

#academymainimage {
  width: 100%;
  height: auto;
}

ul.academyrotator {
  margin: 10px 0;
  padding: 0;
  list-style: none;
  text-align: center;
}

ul.academyrotator li {
  display: inline-block;
  vertical-align: top;
  width: auto;
  padding: 3px;
}

ul.academyrotator li img {
  width: 90px;
  height: auto;
}

.moduletable.academylist .category-module {
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center;
}

.moduletable.academylist .category-module li {
  left: unset !important;
  max-width: unset !important;
  display: inline-block;
  margin: 5px;
}

/* STAFF */
.flexholder {
  display: flex;
  flex-wrap: wrap;
}

.flexitem {
  width: auto;
  flex-basis: 33%;
  padding: 10px;
  box-sizing: border-box;
}

.introimageholder {
  width: 100%;
  max-width: 450px;
  min-height: 0;
  padding-bottom: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-attachment: scroll;
  max-height: 450px;
  float: left;
  margin-bottom: 10px;
}

/* VACANIES */
.moduletable.vacancylist .mod-list {
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
  display: block;
}

.moduletable.vacancylist .mod-list > li {
  left: 0 !important;
  margin-bottom: 30px !important;
}

.moduletable.vacancylist .mod-list {
  list-style: none;
}

.moduletable.vacancylist .mod-list .fields-container {
  margin: 0;
  margin-left: 10px;
}

.moduletable.vacancylist .mod-list .fields-container .field-entry {
  display: block;
  padding: 0 !important;
}

.moduletable.vacancylist .mod-list .fields-container .field-label {
  font-weight: 400;
}

.moduletable.vacancylist .newsitemlink {
  display: inline-block;
  margin-top: 10px;
}

/* TAGS */

.tags .list-inline-item {
  margin: 0 !important;
}

.tags .list-inline-item .label {
  display: inline-block;
  padding: 2px 4px !important;
  font-size: 12px !important;
  font-weight: bold;
  line-height: 14px;
  color: #fff !important;
  vertical-align: baseline;
  white-space: nowrap;
  text-shadow: none !important;
  font-weight: 300;
  text-transform: capitalize !important;
  letter-spacing: unset !important;
  background: var(--cassiopeia-color-link) !important;
}

/* HOVER BOXES */

.hoverboxholder {
  padding: 5px;
}

.i51hoverboxes {
  background: #507a87 !important;
}

.i51hoverboxes .hoverbox {
  margin: 10px;
  border-radius: 10px;
  display: flex;
}

.i51hoverboxes .hoverbox img {
  margin: 30px 15px !important;
}

.i51hoverboxes .hoverbox .boxtext {
  padding: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.i51hoverboxes .hoverbox .boxtext h3 {
  color: #2b3348;
  margin-bottom: 11px !important;
}

.i51hoverboxes .hoverbox .boxtext span {
  background: white !important;
  display: block;
  color: #2b3348;
  padding: 20px 10px;
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
  width: 100%;
  box-sizing: border-box;
  flex-grow: 1;
}

/* DOCUMENTS */
.edocman-box-heading .edocman-document-title, .edocman-box-heading h3.edocman-document-title, .edocman-box-heading h3.edocman-category-title {
  text-transform: capitalize;
  font-size: 16px !important;
  font-weight: 300;
  margin-bottom: 0 !important;
}

.edocman-document-title a {
  color: #2b3349;
}

.row-fluid .edocman-document {
  margin-bottom: 4px !important;
}

#edocman-category-page-default .edocman-description {
  display: none;
}

#edocman-category-page-default .edocman-box-heading {
  border-radius: 5px !important;
}

#edocman-category-page-default #edocman-category {
  display: none !important;
}

#edocman-category-page-default .sortPagiBar {
  display: none !important;
}

/* TABS */
[data-rlta-element="container"] {
  clear: both;
}

[data-rlta-element="container"][data-rlta-type="tabs"][data-rlta-orientation="vertical"] > [data-rlta-element="button-list"] {
  min-width: 200px;
}

[data-rlta-element="container"][data-rlta-type="accordions"] > [data-rlta-element="panel"], 
[data-rlta-element="container"][data-rlta-type="tabs"] > [data-rlta-element="panels"] > [data-rlta-element="panel"] {
  border: 1px solid #dddddd !important;
}

[data-rlta-element="container"][data-rlta-type="tabs"] > [data-rlta-element="button-list"] > [data-rlta-element="button"],
[data-rlta-element="container"][data-rlta-type="accordions"] > [data-rlta-element="button"] {
  box-shadow: none !important;
  border: 0 none !important;
  text-align: left !important;
  padding: 6px 9px !important;
  background-color: #f3f3f3 !important;
  border-radius: 0 !important;
}

[data-rlta-element="container"][data-rlta-type="tabs"] > [data-rlta-element="button-list"] > [data-rlta-element="button"] [data-rlta-element="heading"],
[data-rlta-element="container"][data-rlta-type="accordions"] > [data-rlta-element="button"]  [data-rlta-element="heading"]{
  text-transform: capitalize !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  margin: 0 !important;
  line-height: 18px !important;
}

[data-rlta-element="container"][data-rlta-type="tabs"] > [data-rlta-element="button-list"] > [data-rlta-element="button"][data-rlta-color="blue"],
[data-rlta-element="container"][data-rlta-type="accordions"] > [data-rlta-element="button"][data-rlta-color="blue"] {
  border-left: 4px solid #49a0af !important;
}


[data-rlta-element="container"][data-rlta-type="tabs"] > [data-rlta-element="button-list"] > [data-rlta-element="button"][data-rlta-color="red"],
[data-rlta-element="container"][data-rlta-type="accordions"] > [data-rlta-element="button"][data-rlta-color="red"] {
  border-left: 4px solid #fec514 !important;
}


[data-rlta-element="container"][data-rlta-type="tabs"] > [data-rlta-element="button-list"] > [data-rlta-element="button"][data-rlta-color="orange"],
[data-rlta-element="container"][data-rlta-type="accordions"] > [data-rlta-element="button"][data-rlta-color="orange"] {
  border-left: 4px solid #ff671f !important;
}


[data-rlta-element="container"][data-rlta-type="tabs"] > [data-rlta-element="button-list"] > [data-rlta-element="button"][data-rlta-color="green"],
[data-rlta-element="container"][data-rlta-type="accordions"] > [data-rlta-element="button"][data-rlta-color="green"] {
  border-left: 4px solid #56c252 !important;
}

[data-rlta-element="container"][data-rlta-type="accordions"] > [data-rlta-element="button"]:hover,
[data-rlta-element="container"][data-rlta-type="tabs"] > [data-rlta-element="button-list"] > [data-rlta-element="button"]:hover {
  background-color: #2b3349 !important;
}

[data-rlta-element="container"][data-rlta-type="accordions"] > [data-rlta-element="button"]:hover [data-rlta-element="heading"],
[data-rlta-element="container"][data-rlta-type="tabs"] > [data-rlta-element="button-list"] > [data-rlta-element="button"]:hover [data-rlta-element="heading"]{
  color: white !important;
}

[data-rlta-element="container"][data-rlta-type="tabs"] > [data-rlta-element="button-list"] > [data-rlta-element="button"]:not([data-rlta-state="closed"]), 
[data-rlta-element="container"][data-rlta-type="tabs"] > [data-rlta-element="button-list"] > [data-rlta-element="button"]:not([data-rlta-state="closed"]):hover,
[data-rlta-element="container"][data-rlta-type="accordions"] > [data-rlta-element="button"]:not([data-rlta-state="closed"]), 
[data-rlta-element="container"][data-rlta-type="accordions"] > [data-rlta-element="button"]:not([data-rlta-state="closed"]):hover{
  background-color: #506c77 !important;
}

[data-rlta-element=container][data-rlta-state=ready]:last-child {
  margin-bottom: 40px;
}

/* FIELD GROUP - SUBJECT AREAS */

.subject-areas .subject-card {
  cursor: pointer;
}

.card.subject-card .card-body {
  padding: 0;
}

.subject-areas .subject-card img {
  cursor: pointer;
  height: 150px;
  object-fit: cover;
}

.subject-areas .subject-card img[src='/images/logo.png'] {
  object-fit: contain;
}

.subject-areas .subject-card h4 {
  text-align: center;
  cursor: pointer;
}

.subject-areas .subject-text {
  width: 100%;
  display: none;
}

/* CALENDAR */
.leadership-calendar {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.leadership-calendar .item {
  display: flex;
  margin-right: 2rem;
  margin-bottom: 1rem;
  width: 45%;
  height: 10rem;
}

.leadership-calendar .date {
  display: flex;
  flex-direction: column;
  background-color: #59a1af;
  width: 40%;
  justify-content: center;
  align-content: center;
  padding: 5px;
  flex-wrap: wrap;
  align-items: center;
  color: white;
  text-align: center;
  font-weight: 900;
}


.leadership-calendar .date h3 {
  margin: 0 !important;
  color: white;
  text-align: center;
  font-weight: 900;
}

.leadership-calendar .details {
  display: flex;
  flex-direction: column;
  background-color: #ececf4;
  width: 80%;
  padding: 15px;
  justify-content: space-between;
  width: 100%;
}

.leadership-calendar .item .details h4 {
  margin: 0 !important;
  font-weight: bold;
}

.leadership-calendar .item .details a {
  width: 40%;
  margin-left: 50%;
}

/* BOTTOM BANNER */

/* LATEST NEWS */
.latestnews {
	margin-bottom: 40px;
	margin-top: 40px;
}

.latestnews h2 {
  margin: 15px auto;
  color: #2b3349;
  padding: 0 9px;
  border-bottom: 1px solid #bfbfbf !important;
  padding-bottom: 5px;
}

.latestnews .mod-articlesnews .mod-articlesnews__item {
  border-radius: 10px;
  background: #f7f7f7;
}

.latestnews .mod-articlesnews .mod-articlesnews__item img {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.latestnews .mod-articlesnews .mod-articlesnews__item p,
.latestnews .mod-articlesnews .mod-articlesnews__item h3 {
  padding: 10px;
}

.latestnews .mod-articlesnews .mod-articlesnews__item h3 {
  padding-top: 0;
  margin-top: 0;
}

.latestnews .mod-articlesnews .mod-articlesnews__item h3 a {
  font-size: 20px;
  line-height: 24px;
  color: #2b3348;
  text-decoration: none !important;
}

.latestnews .mod-articlesnews .mod-articlesnews__item > p + p {
  display: none;
}

/* FOOTER */

.footermenu .separator {
  font-weight: 600;
  text-transform: uppercase;
  margin-top: 10px !important;
  display: block;
}

.footermenu ul  {
  margin: 0;
  padding: 0;
}

.footermenu ul li {
  padding: 0 !important;
}

.footermenu a {
  background: none repeat scroll 0 0 rgba(0, 0, 0, 0) !important;
  color: white !important;
  font-weight: 300;
}

.footermenu a:hover, .footermenu a:focus {
  text-decoration: underline !important;
}

.footerdetails {
  text-align: right;
}


/* RESPONSIVE DESIGN */
@media (max-width: 1100px){
  header.container-header .container-menuwrap .mod-menu > li {
    padding: 8px 8px !important;
  }

}

@media (max-width: 992px){
  .container-topbar {
    display: none;
  }

  .container-header .navbar-brand img {
    max-width: 150px;
    width: auto;
  }

  .gradient-header {
    margin-top: 71px;
    margin-bottom: 5px;
  }

  header.container-header .container-menuwrap {
    margin-top: 0;
  }

  body > div.site-grid {
    margin-top: 71px;
  }

  .container-header .navbar-collapse {
    top: 72px;
  }

  .container-header .metismenu > li.level-1 > ul {
    margin-inline-end: 0 !important;
  }

  .i51homegrid {
    clip-path: none !important;
    webkit-clip-path: none !important;
  }
}

@media (max-width: 875px){
    .flexitem {
    flex-basis: 50%;
  }
}


@media (max-width: 767px) {
  .leadership-calendar {
    flex-direction: column;
    justify-content: center;
  }

  .leadership-calendar .item {
    width: 100%;
    margin-right: 0 !important;
  }

  .leadership-calendar .item .details a {
    width: 45%;
    margin-left: 45%;
  }

}

@media (max-width: 450px){
  .flexitem {
    flex-basis: 100%;
  }
}