/* CSS Document 
Client: 91جزة«
Version: 1.0
Date: 22/05/2023
Author: Geoff Boult
Company: Concept4
Website: www.concept4.com
Type: Inclusive Stylesheet
*/
/*

01: Variables
02: Mixins
03: Placeholder
04: REM/Boilerplate/Project Color Scheme/Transitions
05: Normalize
06: Building Blocks
07: Type
08: Header
09: Menu
10: Footer
11: Landing page
12: Internal Page
13: News template
14: Search template
15: Sitemap page
16: C4 Global
17: Page Columns
18: Events
19: Courses

*/
.visuallyhidden {
  border: 0;
  margin: -1px;
  padding: 0;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip: rect(0);
  position: absolute;
}

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
html {
  color: #000000;
  height: 100%;
  font-size: 16px;
  webkit-font-smoothing: antialiased;
}

nav[role="mobileMenu"] {
  display: none;
}

.indent {
  text-indent: -999em;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */
::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */
audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */
fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */
textarea {
  resize: vertical;
}

/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */
.browserupgrade {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */
body {
  width: 100%;
  height: 100%;
  min-height: 100%;
  font-size: 62.5%;
  /* 1em = 10px */
  line-height: 1;
  font-family: "interstate", sans-serif;
  background: #fff;
  margin: 0;
  color: #000000;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */
/*
 * Hide visually and from screen readers:
 */
.hidden {
  display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */
/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */
.invisible {
  visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */
@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}

@media print, (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 1.25dppx), (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   http://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */
@media print {
  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important;
    /* Black prints faster:
                                   http://www.sanbeiji.com/archives/953 */
    box-shadow: none !important;
    text-shadow: none !important;
  }
  a,
  a:visited {
    text-decoration: underline;
  }
  a[href]:after {
    content: " (" attr(href) ")";
  }
  abbr[title]:after {
    content: " (" attr(title) ")";
  }
  /*
     * Don't show links that are fragment identifiers,
     * or use the `javascript:` pseudo protocol
     */
  a[href^="#"]:after,
  a[href^="javascript:"]:after {
    content: "";
  }
  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }
  /*
     * Printing Tables:
     * http://css-discuss.incutio.com/wiki/Printing_Tables
     */
  thead {
    display: table-header-group;
  }
  tr,
  img {
    page-break-inside: avoid;
  }
  img {
    max-width: 100% !important;
  }
  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }
  h2,
  h3 {
    page-break-after: avoid;
  }
}

header#masthead,
header#masthead .topBar .links,
#latestNews a.more:hover,
#latestNews .blogCarousel .blogInfo,
#latestNews:after,
#video .searchHolder .courseSearch:before,
#video .searchHolder .linkButtons a:hover,
#infoScroller .item .content a.more:hover,
#infoScroller .owl-dots button.active,
#events a.viewAll:hover,
#events .eventsCarousel .event a:after,
#socials .flex a:hover,
#pageHolder aside#sidebar .linkButtons a,
#infoScroller.page .flex.socials a:hover,
button.more,
#pageHolder #pageContent.fullWidth .openDayDates .openDay.hammersmith-blue:after,
.openDayDates .openDay.hammersmith-blue a.more:hover,
.otherEvents .openDay:after,
#pageHolder #pageContent.fullWidth .videoCarousel .owl-dots button,
#pageHolder #pageContent.fullWidth #blockquote .owl-dots button,
.courseListing .courseList .course .info .suitable .age-range,
.courseListing .courseList .course .info .buttons a:hover,
#slider .searchHolder .linkButtons a:hover,
#slider .searchHolder .courseSearch:before,
body.course-page #pageHolder .pageHolder .flex-carousel .owl-dots button,
#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content a.apply:hover,
#pageHolder aside#sidebar .sidebarBTNS a.apply:hover,
#pageHolder aside#sidebar .sidebarBTNS a.print:hover,
#relatedCourses .courseListing .courseList .course,
#relatedCourses .courseListing .courseList .course .info .buttons a.more.apply:hover,
#campusScroller .owl-carousel .owl-dots button.active,
#campusScroller .campus .campusImage:after {
  background-color: #fff;
}

header#masthead .logoHolder:before,
nav#mainMenu ul li a:after,
header#masthead:before,
section#section-one .holder .left-column a.more:hover,
section#section-one .left-block,
section#section-one:after,
#latestNews,
#video .searchHolder .courseSearch .searchElement button.searchBTN,
#events,
#events:before,
footer#siteFooter,
nav#mainMenu ul .sf-mega,
nav#mainMenu ul .sf-mega:before,
nav#mainMenu ul .sf-mega:after,
a.mobileMenuBTN #navIcon span,
#pageHolder aside#sidebar nav#sideMenu,
#pageHolder:before,
#pageHolder:after,
#pageHolder aside#sidebar ul:before,
#pageHolder aside#sidebar nav#sideMenu:before,
#pageHolder aside#sidebar nav#sideMenu:after,
#pageHolder aside#sidebar #courseSearch,
#pageHolder aside#sidebar #courseSearch:before,
#pageHolder aside#sidebar .linkButtons a:hover,
#infoScroller.page .topBlock,
#infoScroller.page:before,
#pageHolder #pageContent #mobile-page-content #courseSearch,
#pageHolder #pageContent #mobile-page-content #courseSearch:before,
button.more:hover,
#pageHolder #pageContent a.back-home:hover,
#pageHolder #pageContent.fullWidth a.register:hover,
#pageHolder #pageContent.fullWidth .otherEvents .openDay a,
.pickPath ul li .overlay,
#pageHolder #pageContent.fullWidth .videoCarousel .owl-dots button.active,
#pageHolder #pageContent.fullWidth .courseListing .courseList .course,
#pageHolder #pageContent.fullWidth .courseListing .filterWrapper button,
#slider .searchHolder .linkButtons a,
#slider .searchHolder .courseSearch .searchElement button.searchBTN,
#pageHolder #pageContent.fullWidth .interestListing ul li a,
body.search-results #pageHolder #pageContent.fullWidth .results .searchElement button.searchBTN,
body.search-results #pageHolder #pageContent.fullWidth .tabs button,
body.search-results #tab-5.tab-content .pageList .page a.more:hover,
body.course-page #pageHolder .pageHolder .flex-carousel .owl-dots button.active,
#pageHolder aside#sidebar .sidebarBTNS a.print,
#pageHolder #pageContent #mobile-page-content .sidebarBTNS a.print,
#relatedCourses,
#relatedCourses .courseListing .courseList .course .info .suitable .age-range,
#relatedCourses .courseListing .courseList .course .info .buttons a.more:hover,
#campusScroller .campus .campusInfo .buttons a:hover,
#campusScroller:before,
#campusScroller:after {
  background-color: #018489;
}

#video .searchHolder .courseSearch .searchElement button.searchBTN:hover,
#slider .searchHolder .courseSearch .searchElement button.searchBTN:hover,
#pageHolder #pageContent.fullWidth .filterWrapper .filterGroup.open,
#pageHolder #pageContent.fullWidth .filterWrapper .filterItems,
#pageHolder #pageContent.fullWidth .interestListing ul li .overlay,
body.search-results #pageHolder #pageContent.fullWidth .results .searchElement button.searchBTN:hover {
  background-color: #377171;
}

header#masthead .logoHolder a.applyBTN:before,
section#section-one .sectorLinks .link a,
header#masthead #sticky-header.sectorLinks .link a,
#socials,
aside#sidebar #courseSearch .searchElement button.searchBTN:hover,
#pageHolder #pageContent.fullWidth #blockquote .owl-dots button.active,
.courseListing .courseList .course .info .buttons .apply,
#pageHolder #pageContent.fullWidth .courseListing .filterWrapper button:hover,
body.search-results #pageHolder #pageContent.fullWidth .tabs button:hover,
body.search-results #pageHolder #pageContent.fullWidth .tabs button.current,
body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs button,
#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content a.apply,
#pageHolder aside#sidebar .sidebarBTNS a.apply,
#pageHolder #pageContent #mobile-page-content .sidebarBTNS a.apply,
body.course-page #pageHolder aside#sidebar a.apply {
  background-color: #D23A81;
}

header#masthead .logoHolder a.applyBTN:hover:before,
section#section-one .sectorLinks .link a:hover,
section#section-one .sectorLinks .link a.active,
header#masthead #sticky-header.sectorLinks .link a:hover,
header#masthead #sticky-header.sectorLinks .link a.active {
  background-color: #82275C;
}

section#section-one .holder .right-column .qlBlock .overlay,
#infoScroller .item .content,
#infoScroller .item .content:after,
#infoScroller .item .image .overlay,
#infoScroller .item.text-black .content a.more:hover,
#pageHolder aside#sidebar #sidebarQL .qlBlock .overlay,
#pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock .overlay,
#pageHolder #pageContent .sitemap li ul ul li:before,
#pageHolder #pageContent.fullWidth .openDayDates .openDay:after,
.openDayDates .openDay a.more:hover {
  background-color: #000000;
}

#video .searchHolder .linkButtons a {
  background-color: black;
  background-color: rgba(0, 0, 0, 0.5);
}

#infoScroller .owl-dots button,
aside#sidebar #courseSearch .searchElement button.searchBTN,
#pageHolder #pageContent #mobile-page-content #courseSearch .searchElement button.searchBTN,
#campusScroller .owl-carousel .owl-dots button {
  background-color: transparent;
}

#infoScroller .item.ealing-green .content,
#infoScroller .item.ealing-green .content:after,
#collegeList .college.ealing-green .details,
#collegeList .college.ealing-green .details:before,
#collegeList .holder .college.ealing-green .mobTitle,
#pageHolder #pageContent.fullWidth .openDayDates .openDay.ealing-green,
.courseListing .courseList .course .info .collegeList .college.ealing {
  background-color: #94C24A;
}

#infoScroller .item.hammersmith-blue .content,
#infoScroller .item.hammersmith-blue .content:after,
#collegeList .college.hammersmith-blue .details,
#collegeList .college.hammersmith-blue .details:before,
#collegeList .holder .college.hammersmith-blue .mobTitle,
#pageHolder #pageContent.fullWidth .openDayDates .openDay.hammersmith-blue,
.courseListing .courseList .course .info .collegeList .college.hammersmith {
  background-color: #0B6FB0;
}

#infoScroller .item.southall-orange .content,
#infoScroller .item.southall-orange .content:after,
#collegeList .college.southall-orange .details,
#collegeList .college.southall-orange .details:before,
#collegeList .holder .college.southall-orange .mobTitle,
#pageHolder #pageContent.fullWidth .openDayDates .openDay.southall-orange,
.courseListing .courseList .course .info .collegeList .college.southall {
  background-color: #F39433;
}

#video .videoText,
header#masthead .logoHolder a.applyBTN,
#video #pausePlay i,
#video #sound button,
.searchBox button.searchBTN,
header#masthead .topBar a,
header#masthead .topBar span.loginDropTitle,
section#section-one .sectorLinks .link a,
section#section-one .holder .left-column a.more:hover,
section#section-one .holder .right-column .qlBlock .title,
#latestNews .sectionTitle,
#latestNews a.more,
#video .searchHolder .courseSearch .searchElement button.searchBTN,
#video .searchHolder .linkButtons a,
#infoScroller .item .content,
#infoScroller .item .content a.more,
#infoScroller .item.text-black .content a.more:hover,
#events a.viewAll,
#events .sectionTitle,
#events .eventsCarousel .event a,
#collegeList .college .details,
#socials i,
footer#siteFooter,
footer#siteFooter a,
nav#mainMenu ul .sf-mega ul li a,
header#masthead #sticky-header.sectorLinks .link a,
header#masthead .topBar a.headerBTN.mobMenu,
#collegeList .holder .college.hammersmith-blue .mobTitle,
#pageHolder aside#sidebar ul li a,
#pageHolder aside#sidebar .sectionHeader,
#pageHolder aside#sidebar ul li ul li:before,
#pageHolder aside#sidebar #courseSearch,
#pageHolder aside#sidebar .linkButtons a:hover,
#pageHolder aside#sidebar #sidebarQL .qlBlock .title,
#infoScroller.page .flex.socials a,
#slider.page .pageTitle,
#pageHolder #pageContent #mobile-page-content #courseSearch .title,
#pageHolder #pageContent #mobile-page-content #courseSearch .searchElement button.searchBTN,
#pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock .title,
#pageHolder #pageContent.fullWidth .filterWrapper .filterGroup.open,
#pageHolder #pageContent.fullWidth .filterWrapper .filterItems .filterItem,
button.more:hover,
#pageHolder #pageContent a.back-home:hover,
#pageHolder #pageContent.fullWidth a.register:hover,
#pageHolder #pageContent.fullWidth .openDayDates .openDay.hammersmith-blue,
.openDayDates .openDay.hammersmith-blue a.more,
#pageHolder #pageContent.fullWidth .otherEvents .openDay a,
.pickPath ul li a,
.interestListing ul li a,
#pageHolder #pageContent.fullWidth .courseListing .courseList .course,
.courseListing .courseList .course .info .collegeList .college.hammersmith,
.courseListing .courseList .course .info .buttons a,
#pageHolder #pageContent.fullWidth .courseListing .filterWrapper button,
#slider .searchHolder .linkButtons a,
#slider .searchHolder .courseSearch .searchElement button.searchBTN,
body.search-results #pageHolder #pageContent.fullWidth .results .searchElement button.searchBTN,
body.search-results #pageHolder #pageContent.fullWidth .results .searchElement button.searchBTN span,
body.search-results #pageHolder #pageContent.fullWidth .tabs button,
body.search-results #tab-5.tab-content .pageList .page a.more:hover,
#pageHolder #sidebar #accordion.mainDetail .accordion-title,
aside#sidebar #accordion.mainDetail div.ui-accordion-content,
aside#sidebar #accordion.mainDetail div.ui-accordion-content .explain a,
#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content a.apply,
#pageHolder aside#sidebar .sidebarBTNS a,
#pageHolder #pageContent #mobile-page-content .sidebarBTNS a,
#relatedCourses .sectionTitle,
#relatedCourses .courseListing .courseList .course .info .suitable .age-range,
#relatedCourses .courseListing .courseList .course .info .buttons a.more.apply,
#relatedCourses .courseListing .courseList .course .info .buttons a.more:hover,
#campusScroller .campus .campusInfo .buttons a:hover,
body.course-page #pageHolder aside#sidebar a.apply {
  color: #fff;
}

nav#mainMenu ul li a,
header#masthead .topBar .links a,
section#section-one .holder .left-column h1,
section#section-one .holder .left-column a.more,
#latestNews a.more:hover,
#latestNews .blogCarousel .blogInfo .title,
#video .searchHolder .linkButtons a:hover,
#events a.viewAll:hover,
#pageHolder #pageContent h1,
#pageHolder #pageContent h2,
#pageHolder #pageContent h4,
#pageHolder #pageContent .breadcrumb a.current,
#pageHolder #pageContent .breadcrumb a:hover,
#pageHolder aside#sidebar .linkButtons a,
#infoScroller.page .flex.socials a:hover,
#pageHolder #pageContent #mobile-page-content .linkButtons a,
.share,
.share a,
#pageHolder #pageContent ul.newsList .itemInfo .title,
#pageHolder #pageContent.fullWidth .filterWrapper .sectionName,
#pageHolder #pageContent.fullWidth .filterWrapper .filterGroup,
button.more,
#pageHolder #pageContent a.back-home,
#pageHolder #pageContent.fullWidth a.register,
#accordion.mainDetail .accordion-title,
#pageHolder #pageContent p.pageHighlight,
.pickPath .sectionTitle,
.courseListing .courseList .course .info .suitable .age-range,
.courseListing .courseList .course .info .buttons a:hover,
#pageHolder #pageContent.fullWidth .courseListing .sectionTitle,
#slider .searchHolder .linkButtons a:hover,
body.search-results #pageHolder #pageContent.fullWidth .results,
body.search-results #pageHolder #pageContent .tab-content .sectionTitle,
body.search-results #tab-5.tab-content .pageList .page .title,
body.search-results #tab-5.tab-content .pageList .page a.more,
#pageHolder aside#sidebar .sidebarBTNS a.print:hover,
#relatedCourses .courseListing .courseList .course,
#relatedCourses .courseListing .courseList .course .info .buttons a.more,
#campusScroller .campus .campusInfo .name,
#campusScroller .campus .campusInfo .buttons a,
#campusScroller .owl-nav .owl-next {
  color: #018489;
}

#latestNews .blogCarousel a:hover .blogInfo .title,
#socials .flex a:hover i,
#pageHolder #pageContent h3,
#pageHolder #pageContent h5,
#pageHolder #pageContent p a,
#pageHolder #pageContent blockquote,
#pageHolder #pageContent ul.newsList li a:hover .itemInfo .title,
#pageHolder #pageContent .sitemap li a,
#pageHolder #pageContent .sitemap li ul li a:hover,
#pageHolder #pageContent.fullWidth .eventDate,
.courseListing .courseList .course .info .buttons a.apply:hover,
#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content a.apply:hover,
#pageHolder aside#sidebar .sidebarBTNS a.apply:hover,
#relatedCourses .courseListing .courseList .course .info .buttons a.more.apply:hover {
  color: #D23A81;
}

#latestNews .blogCarousel .blogInfo,
#infoScroller .item .content a.more:hover,
#infoScroller .item.text-black .content,
#infoScroller .item.text-black .content a.more,
#collegeList .college.text-black .details,
#collegeList .holder .college .mobTitle,
#pageHolder #pageContent blockquote cite,
#pageHolder #pageContent .breadcrumb a,
.share a:hover,
#pageHolder #pageContent ul.newsList .itemInfo,
#pageHolder #pageContent .sitemap li ul li a,
#pageHolder #pageContent.fullWidth .openDayDates .openDay,
.openDayDates .openDay a.more,
.courseListing .courseList .course .info .collegeList .college,
body.search-results #pageHolder #pageContent.fullWidth .results a,
body.search-results #pageHolder #pageContent.fullWidth .results span {
  color: #000000;
}

.openDayDates .openDay.hammersmith-blue a.more:hover {
  color: #0B6FB0;
}

.openDayDates .openDay.southall-orange a.more:hover {
  color: #F39433;
}

.openDayDates .openDay.ealing-green a.more:hover {
  color: #94C24A;
}

#latestNews a.more,
#video .searchHolder .linkButtons a,
#infoScroller .item .content a.more,
#infoScroller .owl-dots button,
#events a.viewAll,
#socials .flex a,
#pageHolder aside#sidebar #courseSearch .searchElement button.searchBTN,
#infoScroller.page .flex.socials a,
#pageHolder #pageContent #mobile-page-content #courseSearch .searchElement button.searchBTN,
#pageHolder #pageContent.fullWidth a.register:hover,
.openDayDates .openDay.hammersmith-blue a.more,
.courseListing .courseList .course .info .buttons a,
#pageHolder aside#sidebar #accordion.mainDetail .accordion-title,
#pageHolder #pageContent #mobile-page-content .sidebarBTNS a,
#relatedCourses .related,
#campusScroller .owl-carousel .owl-dots button {
  border-color: #fff;
}

section#section-one .holder .left-column a.more,
#pageHolder #pageContent #mobile-page-content .linkButtons a,
.share,
#pageHolder #pageContent.fullWidth .filterWrapper .filterGroup,
button.more,
#pageHolder #pageContent a.back-home,
#pageHolder #pageContent.fullWidth a.register,
#accordion.mainDetail .accordion-title,
#pageHolder #pageContent.fullWidth .videoCarousel .owl-dots button,
body.search-results #pageHolder #pageContent.fullWidth .results .searchElement,
body.search-results #tab-5.tab-content .pageList .page,
body.search-results #tab-5.tab-content .pageList .page a.more,
body.course-page #pageHolder .pageHolder .flex-carousel .owl-dots button,
#pageHolder aside#sidebar .sidebarBTNS a.print,
#pageHolder #pageContent #mobile-page-content .sidebarBTNS a.print,
#relatedCourses .courseListing .courseList .course .info .buttons a.more,
#campusScroller .campus .campusInfo .buttons a {
  border-color: #018489;
}

#pageHolder #pageContent.fullWidth .filterWrapper .filterItems {
  border-color: #377171;
}

#pageHolder #pageContent blockquote,
#pageHolder #pageContent .breadcrumb a,
#pageHolder #pageContent.fullWidth #blockquote .owl-dots button,
#pageHolder #pageContent.fullWidth .courseListing .filterWrapper button:hover,
#pageHolder aside#sidebar .sidebarBTNS a.apply,
#relatedCourses .courseListing .courseList .course .info .buttons a.apply {
  border-color: #D23A81;
}

#infoScroller .item.text-black .content a.more,
.openDayDates .openDay a.more {
  border-color: #000000;
}

@media (max-width: 1023px) {
  header#masthead .topBar a,
  header#masthead .topBar span.loginDropTitle {
    color: #018489;
  }
  #video .searchHolder .linkButtons a {
    background-color: transparent;
  }
  #video .searchHolder .courseSearch .searchElement button.searchBTN {
    background-color: #377171;
  }
}

#latestNews .blogCarousel .blogInfo span.title,
.share a,
#pageHolder #pageContent ul.newsList .itemInfo .title {
  -webkit-transition: color 0.2s ease-in-out;
  -moz-transition: color 0.2s ease-in-out;
  -ms-transition: color 0.2s ease-in-out;
  -o-transition: color 0.2s ease-in-out;
  transition: color 0.2s ease-in-out;
}

header#masthead .logoHolder a.applyBTN:before,
.searchHolder .courseSearch .searchElement button.searchBTN,
header#masthead #sticky-header.sectorLinks .link a,
aside#sidebar #courseSearch .searchElement button.searchBTN,
body.search-results #pageHolder #pageContent.fullWidth .tabs button,
body.search-results #pageHolder #pageContent.fullWidth .results .searchElement button.searchBTN {
  -webkit-transition: background-color, 0.3s ease-in-out;
  -moz-transition: background-color, 0.3s ease-in-out;
  -ms-transition: background-color, 0.3s ease-in-out;
  -o-transition: background-color, 0.3s ease-in-out;
  transition: background-color, 0.3s ease-in-out;
}

a.more,
span.more,
header#masthead,
#video #pausePlay,
#video #sound button,
.searchBox button.searchBTN,
header#masthead .topBar span.loginDropTitle i.fa-chevron-down,
nav#mainMenu ul li a:after,
header#masthead .logoHolder,
header#masthead .logoHolder:before,
header#masthead .logoHolder a.applyBTN,
section#section-one .sectorLinks .link a,
#latestNews .blogCarousel .item figure img,
.owl-nav button,
#video .searchHolder .linkButtons a,
#events .eventsCarousel .event a:after,
#socials .flex a,
#socials .flex a i,
nav#mainMenu ul .sf-mega ul li a,
nav#mainMenu ul .sf-mega ul li a:before,
header#masthead #sticky-header.sectorLinks,
#pageHolder aside#sidebar ul li a,
#pageHolder aside#sidebar ul li a:before,
#pageHolder aside#sidebar .linkButtons a,
#infoScroller.page .flex.socials a,
#pageHolder #pageContent ul.newsList figure img,
button.more,
.pickPath ul li .title,
.pickPath ul li .view,
.pickPath ul li .overlay,
#pageHolder #pageContent.fullWidth .courseListing .filterWrapper button,
#pageHolder #pageContent.fullWidth .filterWrapper .filterGroup,
#slider .searchHolder .linkButtons a,
#pageHolder #pageContent.fullWidth .interestListing ul li .overlay,
.interestListing ul li a .title,
.interestListing ul li a .view,
nav#mainMenu,
nav#mainMenu ul li a,
#pageHolder #pageContent.fullWidth .filterWrapper .filterGroup:after,
#pageHolder #pageContent.fullWidth .otherEvents .openDay:after {
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  box-sizing: border-box;
  overscroll-behavior: none;
}

body {
  margin: 0;
  overscroll-behavior: none;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
  display: block;
}

audio, canvas, progress, video {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}

audio:not([controls]) {
  display: none;
  height: 0;
}

[hidden], template {
  display: none;
}

a {
  background-color: transparent;
  text-decoration: none;
}

a:active, a:hover {
  outline: 0;
}

abbr[title] {
  border-bottom: 1px dotted;
}

b, strong {
  font-weight: bold;
}

dfn {
  font-style: italic;
}

small {
  font-size: 80%;
}

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

img {
  border: 0;
}

svg:not(:root) {
  overflow: hidden;
}

figure {
  margin: 1em 40px;
}

hr {
  box-sizing: content-box;
  height: 0;
}

pre {
  overflow: auto;
}

code, kbd, pre, samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

button, input, optgroup, select, textarea {
  color: inherit;
  /* 1 */
  font: inherit;
  /* 2 */
  margin: 0;
  /* 3 */
}

button {
  overflow: visible;
}

button,
elect {
  text-transform: none;
}

button,
html input[type="button"], input[type="reset"], input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */
}

button[disabled], html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner, input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

input {
  line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"], input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  box-sizing: content-box;
  /* 2 */
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
  overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
  font-weight: bold;
}

/* Tables
   ========================================================================== */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

td, th {
  padding: 0;
}

#wrapper, .mm-page {
  width: 100%;
  min-height: 100%;
  height: auto !important;
  height: 100%;
  margin: 0 auto;
  position: relative;
  top: 0;
  padding: 0;
  overflow: hidden;
}

#wrapper {
  overflow: hidden;
}

.container {
  padding: 0 5%;
  position: relative;
}

@media (min-width: 1400px) {
  .container {
    max-width: 1400px;
    max-width: 87.5rem;
    padding: 0 50px;
    padding: 0 3.125rem;
    margin: 0 auto;
    position: relative;
  }
}

@media all and (min-width: 1400px) and (max-width: 1700px) {
  .container.medium {
    max-width: none;
  }
}

@media (min-width: 1700px) {
  .container.medium {
    max-width: 1700px;
    max-width: 106.25rem;
  }
}

h2, h3, h4, h5 {
  margin: 5px 0 16px 0;
  margin: 0.3125rem 0 1rem 0;
  padding-top: 0;
  line-height: 1.2;
}

#pageHolder #pageContent .breadcrumb a,
.courseListing .courseList .course .info .date span,
.courseListing .courseList .course .info .suitable .age-range,
.courseListing .courseList .course .info .collegeList .college,
#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content .explain {
  font-size: 14px;
  font-size: 0.875rem;
}

.b {
  font-size: 15px;
  font-size: 0.9375rem;
}

body,
nav#mainMenu ul li .sf-mega li a,
section#section-one .holder .left-column a.more,
#latestNews .blogCarousel .blogInfo .date,
#pageHolder #pageContent blockquote cite,
#pageHolder #pageContent #mobile-page-content .linkButtons a,
.share span,
span.articleDate,
#pageHolder #pageContent.fullWidth .filterWrapper .sectionName,
#pageHolder #pageContent .sitemap li ul li a,
#slider .searchHolder .linkButtons a,
body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs .tab-item button {
  font-size: 16px;
  font-size: 1rem;
}

.b {
  font-size: 17px;
  font-size: 1.0625rem;
}

#video #sound button,
#socials .flex a,
aside#sidebar #courseSearch .searchElement button.searchBTN i,
#infoScroller.page .flex.socials a,
#pageHolder #pageContent #mobile-page-content #courseSearch .searchElement button.searchBTN i,
.share a,
#slider .searchHolder .courseSearch .searchElement button.searchBTN i,
#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content a.apply i {
  font-size: 18px;
  font-size: 1.125rem;
}

nav#mainMenu ul li a,
section#section-one .sectorLinks .link a,
section#section-one .holder .left-column,
#video .searchHolder .courseSearch .searchElement input.searchInput,
#video .searchHolder .courseSearch .searchElement button.searchBTN,
#video .searchHolder .linkButtons a,
#infoScroller .item .content .type,
#events .eventsCarousel .event a .date span,
#collegeList .college .details,
header#masthead #sticky-header.sectorLinks .link a,
#pageHolder aside#sidebar .sectionHeader,
#pageHolder #pageContent h2,
#pageHolder #pageContent blockquote,
aside#sidebar #courseSearch .searchElement button.searchBTN,
#pageHolder aside#sidebar .linkButtons a i,
#pageHolder #pageContent #mobile-page-content #courseSearch .title,
#pageHolder #pageContent #mobile-page-content #courseSearch .searchElement button.searchBTN,
.openDayDates .openDay .date span,
.otherEvents .openDay .date span,
#pageHolder #pageContent p.pageHighlight,
.pickPath ul li a,
.interestListing ul li a,
body.search-results #pageHolder #pageContent.fullWidth .results,
#pageHolder #sidebar #accordion.mainDetail .accordion-title {
  font-size: 20px;
  font-size: 1.25rem;
}

#video #pausePlay i,
#latestNews .blogCarousel .blogInfo .title,
#pageHolder #pageContent ul.newsList .itemInfo .title {
  font-size: 22px;
  font-size: 1.375rem;
}

section#section-one .holder .right-column .qlBlock .title,
#events .eventsCarousel .event a .title,
#pageHolder #pageContent h4,
#pageHolder aside#sidebar #courseSearch .title,
.openDayDates .openDay .name,
.otherEvents .openDay .name,
#accordion.mainDetail .accordion-title,
.courseListing .courseList .course .title,
body.search-results #tab-5.tab-content .pageList .page .title {
  font-size: 24px;
  font-size: 1.5rem;
}

#pageHolder #pageContent h3,
#pageHolder #pageContent .sitemap li a,
#pageHolder #pageContent.fullWidth .eventDate {
  font-size: 30px;
  font-size: 1.875rem;
}

.courseListing .courseList .course .icon {
  font-size: 35px;
  font-size: 2.1875rem;
}

#infoScroller .item .content .title,
#pageHolder #pageContent h2,
.pickPath .sectionTitle,
#pageHolder #pageContent.fullWidth .courseListing .sectionTitle,
body.search-results #pageHolder #pageContent .tab-content .sectionTitle,
body.course-page #pageHolder #pageContent #accordion.mainDetail .accordion-title,
#relatedCourses .sectionTitle,
#campusScroller .campus .campusInfo .name {
  font-size: 40px;
  font-size: 2.5rem;
}

#pageHolder #pageContent h1 {
  font-size: 50px;
  font-size: 3.125rem;
}

#slider.page .pageTitle {
  font-size: 60px;
  font-size: 3.75rem;
}

#events .eventsCarousel .event a .date,
.openDayDates .openDay .date,
.otherEvents .openDay .date,
#pageHolder #pageContent.fullWidth .interestListing ul li .icon {
  font-size: 70px;
  font-size: 4.375rem;
}

#video .videoText,
section#section-one .holder .left-column h1,
body.home .sectionTitle {
  font-size: 80px;
  font-size: 5rem;
}

nav#mainMenu ul li .sf-mega li a,
#pageHolder #pageContent .sitemap li ul li a,
.courseListing .courseList .course .info .date span,
.courseListing .courseList .course .info .suitable .age-range,
.courseListing .courseList .course .info .workplace span,
.courseListing .courseList .course .info .deliveryMode span,
aside#sidebar #accordion.mainDetail div.ui-accordion-content .detail span {
  font-weight: 400;
}

.courseListing .courseList .course .info .collegeList .college,
.searchHolder .courseSearch .searchElement input.searchInput,
body.search-results #pageHolder #pageContent.fullWidth .results .searchElement input.searchInput,
#pageHolder #pageContent.fullWidth .courseListing .filterWrapper .filterGroup .filterName,
#pageHolder aside#sidebar #accordion.mainDetail .accordion-title {
  font-weight: 500;
}

a.more,
span.more,
nav#mainMenu ul li a,
#video .videoText,
header#masthead .logoHolder a.applyBTN,
section#section-one .sectorLinks .link a,
#latestNews .blogCarousel .blogInfo .date,
#video .searchHolder .courseSearch .searchElement button.searchBTN,
#video .searchHolder .linkButtons a,
#infoScroller .item .content,
#events .eventsCarousel .event a .date,
#events .eventsCarousel .event a .time,
#collegeList .college .details .collegeName,
header#masthead #sticky-header.sectorLinks .link a,
#collegeList .holder .college .mobTitle,
#pageHolder #pageContent blockquote cite,
#pageHolder aside#sidebar #courseSearch .title,
aside#sidebar #courseSearch .searchElement button.searchBTN,
#pageHolder aside#sidebar .linkButtons a,
#pageHolder #pageContent #mobile-page-content #courseSearch .title,
#pageHolder #pageContent #mobile-page-content #courseSearch .searchElement button.searchBTN,
#pageHolder #pageContent #mobile-page-content .linkButtons a,
.share span,
span.articleDate,
#pageHolder #pageContent ul.newsList .itemInfo .date,
#pageHolder #pageContent.fullWidth .filterWrapper .sectionName,
button.more,
#pageHolder #pageContent.fullWidth .eventTime,
.openDayDates .openDay .date,
.openDayDates .openDay .time,
.otherEvents .openDay .date,
.otherEvents .openDay .time,
.courseListing .courseList .course .info .date,
.courseListing .courseList .course .info .suitable,
.courseListing .courseList .course .info .workplace,
.courseListing .courseList .course .info .deliveryMode,
#slider .searchHolder .linkButtons a,
#slider .searchHolder .courseSearch .searchElement button.searchBTN,
body.search-results #pageHolder #pageContent.fullWidth .results a,
body.search-results #pageHolder #pageContent.fullWidth .results span,
body.search-results #pageHolder #pageContent.fullWidth .tabs button,
aside#sidebar #accordion.mainDetail div.ui-accordion-content .detail,
#campusScroller .owl-nav .owl-next {
  font-weight: 700;
}

section#section-one .holder .left-column h1,
section#section-one .holder .right-column .qlBlock .title,
body.home .sectionTitle,
#pageHolder aside#sidebar .sectionHeader,
#pageHolder #pageContent h1,
#pageHolder #pageContent h2,
#pageHolder #pageContent h3,
#pageHolder #pageContent h4,
#pageHolder #pageContent h5,
#pageHolder aside#sidebar #sidebarQL .qlBlock .title,
#slider.page .pageTitle,
#pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock .title,
#pageHolder #pageContent .sitemap li a,
#pageHolder #pageContent.fullWidth .eventDate,
#accordion.mainDetail .accordion-title,
.pickPath .sectionTitle,
.pickPath ul li a,
.interestListing ul li a,
.courseListing .courseList .course .title,
#pageHolder #pageContent.fullWidth .courseListing .sectionTitle,
body.search-results #pageHolder #pageContent .tab-content .sectionTitle,
body.search-results #tab-5.tab-content .pageList .page .title,
#relatedCourses .sectionTitle,
#campusScroller .campus .campusInfo .name {
  font-weight: 900;
}

@media (max-width: 767px) {
  body,
  #video .searchHolder .courseSearch .searchElement input.searchInput,
  #video .searchHolder .linkButtons a,
  section#section-one .sectorLinks .link a,
  section#section-one .holder .left-column,
  section#section-one .holder .left-column a.more,
  #infoScroller .item .content .type,
  #video #sound button,
  header#masthead #sticky-header.sectorLinks.owl-carousel .link a,
  #pageHolder #pageContent .sitemap li ul li a,
  body.search-results #pageHolder #pageContent.fullWidth .results .searchElement input.searchInput {
    font-size: 14px;
    font-size: 0.875rem;
  }
  section#section-one .holder .right-column .qlBlock .title,
  #collegeList .college .details,
  #video #pausePlay i,
  header#masthead .topBar a.headerBTN,
  header#masthead .topBar span.loginDropTitle i.fa-user-lock,
  #pageHolder #pageContent h5,
  #pageHolder #pageContent blockquote {
    font-size: 16px;
    font-size: 1rem;
  }
  #pageHolder #pageContent p.pageHighlight,
  #pageHolder #pageContent #mobile-page-content .linkButtons a i,
  body.search-results #pageHolder #pageContent.fullWidth .results {
    font-size: 18px;
    font-size: 1.125rem;
  }
  #infoScroller .item .content .title,
  #pageHolder #pageContent.fullWidth #accordion.mainDetail .accordion-title,
  #pageHolder #pageContent h4,
  .courseListing .courseList .course .title,
  body.search-results #tab-5.tab-content .pageList .page .title {
    font-size: 20px;
    font-size: 1.25rem;
  }
  .b {
    font-size: 22px;
    font-size: 1.375rem;
  }
  #video .videoText,
  #pageHolder #pageContent .sitemap li a,
  #pageHolder #pageContent h3,
  body.course-page #pageHolder #pageContent #accordion.mainDetail .accordion-title {
    font-size: 25px;
    font-size: 1.5625rem;
  }
  #pageHolder #pageContent h2 {
    font-size: 27px;
    font-size: 1.6875rem;
  }
  #pageHolder #pageContent h1,
  .pickPath .sectionTitle,
  #pageHolder #pageContent.fullWidth .courseListing .sectionTitle,
  body.search-results #pageHolder #pageContent .tab-content .sectionTitle,
  #relatedCourses .sectionTitle,
  #campusScroller .campus .campusInfo .name {
    font-size: 30px;
    font-size: 1.875rem;
  }
  section#section-one .holder .left-column h1,
  body.home .sectionTitle {
    font-size: 40px;
    font-size: 2.5rem;
  }
  .openDayDates .openDay .date,
  .otherEvents .openDay .date {
    font-size: 60px;
    font-size: 3.75rem;
  }
}

@media all and (min-width: 768px) and (max-width: 1023px) {
  #video .searchHolder .linkButtons a,
  .openDayDates .openDay .time,
  #pageHolder #pageContent #mobile-page-content .linkButtons a {
    font-size: 14px;
    font-size: 0.875rem;
  }
  section#section-one .sectorLinks .link a,
  #collegeList .college .details,
  .openDayDates .openDay .date span,
  #pageHolder #pageContent #mobile-page-content .linkButtons a i {
    font-size: 16px;
    font-size: 1rem;
  }
  header#masthead #sticky-header.sectorLinks .link a,
  .openDayDates .openDay .name {
    font-size: 18px;
    font-size: 1.125rem;
  }
  #slider.page .pageTitle {
    font-size: 40px;
    font-size: 2.5rem;
  }
  #video .videoText,
  .openDayDates .openDay .date {
    font-size: 50px;
    font-size: 3.125rem;
  }
}

@media all and (min-width: 768px) and (max-width: 1200px) {
  #infoScroller .item .content .title {
    font-size: 30px;
    font-size: 1.875rem;
  }
  section#section-one .holder .left-column h1,
  body.home .sectionTitle {
    font-size: 60px;
    font-size: 3.75rem;
  }
}

@media all and (min-width: 1024px) and (max-width: 1200px) {
  #video .searchHolder .linkButtons a {
    font-size: 16px;
    font-size: 1rem;
  }
}

@media all and (min-width: 768px) and (max-width: 1400px) {
  body.course-page #pageHolder #pageContent #accordion.mainDetail .accordion-title {
    font-size: 32px;
    font-size: 2rem;
  }
}

@media all and (min-width: 1024px) and (max-width: 1600px) {
  section#section-one .sectorLinks .link a,
  header#masthead #sticky-header.sectorLinks .link a {
    font-size: 16px;
    font-size: 1rem;
  }
  #slider.page .pageTitle {
    font-size: 50px;
    font-size: 3.125rem;
  }
  #video .videoText {
    font-size: 65px;
    font-size: 4.0625rem;
  }
}

@media all and (min-width: 1024px) and (max-height: 900px) {
  #video .videoText {
    font-size: 55px;
    font-size: 3.4375rem;
  }
}

@keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-moz-keyframes fadein {
  /* Firefox */
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-webkit-keyframes fadein {
  /* Safari and Chrome */
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-o-keyframes fadein {
  /* Opera */
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fade-in-move-down {
  0% {
    opacity: 0;
    transform: translateY(2rem);
    -webkit-transform: translateY(2rem);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
    -webkit-transform: translateY(0);
  }
}

header#masthead {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 150px;
  height: 9.375rem;
  z-index: 9000;
  -webkit-box-shadow: 0px 10px 10px -8px rgba(0, 0, 0, 0.28);
  -moz-box-shadow: 0px 10px 10px -8px rgba(0, 0, 0, 0.28);
  box-shadow: 0px 10px 10px -8px rgba(0, 0, 0, 0.28);
}

header#masthead:before {
  top: 0;
  left: 0;
  width: 100%;
  content: "";
  position: absolute;
  height: 60px;
}

header#masthead .logoHolder {
  position: absolute;
  left: 50px;
  left: 3.125rem;
  top: 35px;
  top: 2.1875rem;
  z-index: 2000;
}

header#masthead .logoHolder:before {
  top: -35px;
  height: 180px;
  right: -180px;
  left: -2000px;
  width: auto;
  content: "";
  position: absolute;
  -webkit-box-shadow: 4px 4px 5px -2px rgba(0, 0, 0, 0.28);
  -moz-box-shadow: 4px 4px 5px -2px rgba(0, 0, 0, 0.28);
  box-shadow: 4px 4px 5px -2px rgba(0, 0, 0, 0.28);
}

header#masthead .logoHolder:before,
header#masthead .logoHolder a.applyBTN:before {
  transform: skewX(-35deg);
  -webkit-transform: skewX(-35deg);
}

header#masthead .logoHolder a.logo {
  display: block;
  position: relative;
  z-index: 5;
}

header#masthead .logoHolder a.logo img {
  max-width: 100%;
  height: auto;
}

header#masthead .logoHolder a.applyBTN {
  position: absolute;
  top: -35px;
  right: -420px;
  width: 200px;
  height: 60px;
  line-height: 60px;
  padding: 0 40px;
  text-align: center;
}

header#masthead .logoHolder a.applyBTN:before {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  top: 0;
  z-index: 0;
}

header#masthead .logoHolder a.applyBTN i {
  margin-right: 10px;
}

header#masthead .logoHolder a.applyBTN i,
header#masthead .logoHolder a.applyBTN span {
  position: relative;
  z-index: 2;
}

header#masthead .logoHolder,
header#masthead .logoHolder a {
  width: 235px;
  width: 14.6875rem;
  height: 110px;
  height: 6.875rem;
}

header#masthead header#masthead .logoHolder:before,
header#masthead header#masthead .logoHolder a.applyBTN:before {
  transform: skewX(-35deg);
  -webkit-transform: skewX(-35deg);
}

header#masthead .topBar {
  display: flex;
  justify-content: flex-end;
  height: 60px;
  line-height: 60px;
  position: relative;
}

header#masthead .topBar a.headerBTN,
header#masthead .topBar span.loginDropTitle {
  margin-right: 30px;
}

header#masthead .topBar a.headerBTN i,
header#masthead .topBar span.loginDropTitle i {
  margin-right: 10px;
}

header#masthead .topBar a.headerBTN i.fa-chevron-down,
header#masthead .topBar span.loginDropTitle i.fa-chevron-down {
  margin-right: 0;
  margin-left: 8px;
  transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
}

header#masthead .topBar a.headerBTN:hover,
header#masthead .topBar span.loginDropTitle:hover {
  text-decoration: underline;
}

header#masthead .topBar a.headerBTN.mobMenu {
  margin-right: 0;
  display: none;
}

header#masthead .topBar span.loginDropTitle {
  position: relative;
}

header#masthead .topBar span.loginDropTitle:hover {
  cursor: pointer;
}

header#masthead .topBar span.loginDropTitle.open i.fa-chevron-down {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
}

header#masthead .topBar .links {
  display: none;
  position: absolute;
  right: 0;
  top: 100%;
  width: 120px;
  padding: 12px;
  z-index: 20;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.28);
}

header#masthead .topBar .links a {
  display: block;
  line-height: 1.5;
  margin: 3px 0;
}

header#masthead .topBar .links a:hover {
  text-decoration: underline;
}

header#masthead #sticky-header.sectorLinks {
  display: flex;
  height: 50px;
  position: absolute;
  bottom: -50px;
  flex-wrap: nowrap;
  width: calc(100% + 90px);
  margin-left: -45px;
  z-index: 2;
}

header#masthead #sticky-header.sectorLinks .link {
  display: flex;
  height: 50px;
  flex: 1;
}

 header#masthead #sticky-header.sectorLinks .link a {
  display: flex;
  height: 0;
  opacity: 0;
  flex: 0 0 100%;
  overflow: hidden;
  justify-content: center;
  align-items: center;
  transform: skewX(0deg);
  -webkit-transform: skewX(0deg);
//was -35
  border-left-width: 2px;
  border-left-style: solid;
  text-align: center;
  line-height: 1.5;
}

header#masthead #sticky-header.sectorLinks .link a span {
  display: block;
}

header#masthead #sticky-header.sectorLinks .link a span.unskew {
  transform: skewX(0deg);
  -webkit-transform: skewX(0deg);
  -moz-transform: skewX(0deg);    
    -ms-transform: skewX(0deg);    
    -o-transform: skewX(0deg);   
//was 35   
  display: inline-block;
}

header#masthead #sticky-header.sectorLinks .link:first-child a {
  border: none;
}

header#masthead #sticky-header.sectorLinks .link:first-child a span.unskew {
  margin-left: 50px;
}

header#masthead #sticky-header.sectorLinks .link:last-child a span.unskew {
  margin-right: 50px;
}

header#masthead #sticky-header.sectorLinks.owl-carousel {
  top: -999em;
}

header#masthead #sticky-header.sectorLinks.owl-carousel .link a {
  transform: none;
  -webkit-transform: none;
}
 body header#masthead #sticky-header.sectorLinks{display:none}
body.is-active header#masthead #sticky-header.sectorLinks{display:flex}
body header#masthead #sticky-header.sectorLinks.keyboard {display:none}
body header#masthead #sticky-header.sectorLinks.owl-carousel  {display:none}


body.is-active header#masthead #sticky-header.sectorLinks .link a,
body.page header#masthead #sticky-header.sectorLinks .link a {
  height: 50px;
  opacity: 1;
}

@media (max-width: 767px) {
  header#masthead {
    height: 100px;
  }
  header#masthead:before {
    height: 35px;
  }
  header#masthead .logoHolder {
    top: 20px;
  }
  header#masthead .logoHolder:before {
    height: 100px;
    left: -110px;
    width: 252px;
    right: auto;
    top: -20px;
  }
  header#masthead .logoHolder a.applyBTN {
    right: -142px;
    height: 35px;
    line-height: 35px;
    width: 95px;
    padding: 0 10px;
    top: -20px;
  }
  header#masthead .logoHolder:before,
  header#masthead .logoHolder a.applyBTN:before {
    transform: skewX(-25deg);
    -webkit-transform: skewX(-25deg);
  }
  header#masthead .logoHolder,
  header#masthead .logoHolder a {
    width: 110px;
    height: 51px;
  }
  header#masthead .topBar {
    top: 43px;
    height: auto;
    line-height: 20px;
  }
  header#masthead .topBar .links {
    top: 29px;
  }
  header#masthead .topBar a.headerBTN {
    margin-right: 15px;
  }
  header#masthead .topBar a.headerBTN.mobMenu {
    right: 0px;
    top: -35px;
    position: absolute;
  }
  header#masthead .topBar a.headerBTN.accessibility {
    margin-right: 0;
  }
  header#masthead .topBar span.loginDropTitle {
    position: absolute;
    right: 22px;
    bottom: -28px;
  }
  body.home header#masthead .logoHolder:before {
    height: 110px;
    width: 250px;
  }
}

@media all and (min-width: 768px) and (max-width: 1023px) {
  header#masthead {
    height: 130px;
  }
  header#masthead .logoHolder:before {
    height: 150px;
    left: -200px;
    right: auto;
  }
  header#masthead .logoHolder,
  header#masthead .logoHolder a {
    width: 214px;
    height: 100px;
  }
  header#masthead .logoHolder a.applyBTN {
    right: -368px;
    top: -35px;
  }
  header#masthead .topBar {
    top: 65px;
    padding-right: 40px;
  }
  header#masthead .topBar a.headerBTN.mobMenu {
    right: 0px;
    top: -65px;
    position: absolute;
  }
  body.page header#masthead .logoHolder {
    top: 25px;
  }
  body.page header#masthead .logoHolder a.applyBTN {
    top: -35px;
    height: 60px;
    right: -342px;
  }
  body.page header#masthead .logoHolder,
  body.page header#masthead .logoHolder a {
    width: 171px;
    height: 80px;
  }
  body.page header#masthead #sticky-header.sectorLinks.owl-carousel {
    height: 60px;
    bottom: -60px;
  }
  body.page header#masthead #sticky-header.sectorLinks.owl-carousel .link,
  body.page header#masthead #sticky-header.sectorLinks.owl-carousel .link a {
    height: 60px;
  }
}

@media all and (min-width: 768px) and (max-width: 1400px) {
  header#masthead {
    height: 130px;
  }
  header#masthead .logoHolder:before {
    height: 150px;
    left: -200px;
  }
  header#masthead .logoHolder,
   header#masthead .logoHolder a {
    width: 203px;
    height: 95px;
  }
  header#masthead .logoHolder a.applyBTN {
    right: -368px;
    top: -35px;
  }
}

@media (max-width: 1023px) {
  header#masthead #sticky-header.sectorLinks {
    display: none !important;
    top: -1000em;
  }
  header#masthead #sticky-header.sectorLinks.owl-carousel {
    display: block !important;
    top: auto;
  }
  body.page header#masthead .logoHolder a.applyBTN span.mobHide {
    display: none;
  }
}

@media (max-width: 1250px) {
  header#masthead .topBar a.headerBTN.mobMenu {
    display: inline-block;
  }
}

@media (max-width: 1400px) {
  header#masthead .logoHolder {
    left: 5%;
  }
}

@media all and (min-width: 768px) and (max-width: 1400px) {
  header#masthead .logoHolder:before {
    right: -138px;
  }
  body.fixedHeader header#masthead .logoHolder,
  body.page header#masthead .logoHolder {
    top: 15px;
  }
  body.fixedHeader header#masthead .logoHolder:before,
  body.page header#masthead .logoHolder:before {
    height: 150px;
    top: -35px;
    right: -152px;
  }
  body.fixedHeader header#masthead .logoHolder a.applyBTN,
  body.page header#masthead .logoHolder a.applyBTN {
    top: -15px;
  }
}

@media all and (min-width: 768px) and (max-width: 1500px) {
  header#masthead .topBar a.headerBTN,
  header#masthead .topBar span.loginDropTitle {
    margin-right: 20px;
  }
}

@media (max-width: 1500px) {
  header#masthead .topBar a.headerBTN span,
  header#masthead .topBar span.loginDropTitle span {
    display: none;
  }
  header#masthead .topBar a.headerBTN i {
    margin-right: 0;
  }
}

@media all and (min-width: 1400px) and (max-width: 1700px) {
  header#masthead .logoHolder:before {
    right: -120px;
  }
  header#masthead .logoHolder a.applyBTN {
    right: -360px;
  }
  body.fixedHeader.home header#masthead .logoHolder:before {
    right: -140px;
  }
  body.page header#masthead .logoHolder:before {
    right: -133px;
  }
  body.page.fixedHeader header#masthead .logoHolder:before {
    right: -140px;
  }
}

@media all and (min-width: 1500px) and (max-width: 1700px) {
  header#masthead .topBar a.headerBTN,
  header#masthead .topBar span.loginDropTitle {
    margin-right: 20px;
  }
  header#masthead .topBar a.headerBTN i,
  header#masthead .topBar span.loginDropTitle i {
    margin-right: 7px;
  }
}

@media (min-width: 1400px) {
  body.fixedHeader header#masthead {
    height: 130px;
  }
  body.fixedHeader.home header#masthead .logoHolder {
    top: 10px;
  }
  body.fixedHeader.home header#masthead .logoHolder:before {
    height: 140px;
    top: -20px;
  }
  body.fixedHeader.home header#masthead .logoHolder a.applyBTN {
    top: -10px;
  }
  body.page header#masthead .logoHolder {
    top: 10px;
  }
  body.page header#masthead .logoHolder:before {
    height: 160px;
    top: -20px;
  }
  body.page header#masthead .logoHolder a.applyBTN {
    top: -10px;
  }
  body.page.fixedHeader header#masthead .logoHolder {
    top: 10px;
  }
  body.page.fixedHeader header#masthead .logoHolder:before {
    height: 140px;
    top: -20px;
  }
  body.page.fixedHeader header#masthead .logoHolder a.applyBTN {
    top: -10px;
  }
}

@media (min-width: 1700px) {
  body.fixedHeader.home header#masthead .logoHolder:before {
    right: -200px;
  }
  body.page header#masthead .logoHolder:before {
    right: -193px;
  }
  body.page.fixedHeader header#masthead .logoHolder:before {
    right: -198px;
  }
}

nav#mainMenu {
  right: 0;
  top: 15px;
  top: 0.9375rem;
  height: 60px;
  height: 3.75rem;
  position: relative;
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
}

nav#mainMenu ul {
  width: auto;
  margin: 0;
  padding: 0;
  list-style-type: none;
 }

nav#mainMenu ul li {
  display: inline-block;
  padding: 0 15px;
  padding: 0 0.9375rem;
}

nav#mainMenu ul li a {
  line-height: 60px;
  line-height: 3.75rem;
  display: block;
  position: relative;
  text-transform: uppercase;
  padding-bottom: 15px;
}

nav#mainMenu ul li a:after {
  height: 8px;
  height: 0.5rem;
  left: 50%;
  right: 50%;
  content: "";
  position: absolute;
  bottom: 0px;
  bottom: 0rem;
}

nav#mainMenu ul li a:hover:after,
nav#mainMenu ul li a:focus:after,
nav#mainMenu ul li a.active:after,
nav#mainMenu ul li:hover > a:after {
  left: 0;
  right: 0;
}

nav#mainMenu ul li:last-child {
  padding: 0 0 0 15px;
  padding: 0 0 0 0.9375rem;
}

nav#mainMenu ul .sf-mega {
  display: none;
  position: absolute;
  left: -100px;
  right: -100px;
  width: auto;
  top: 75px;
  padding: 70px 0 20px 0;
  z-index: 5;
}

nav#mainMenu ul .sf-mega:before, nav#mainMenu ul .sf-mega:after {
  width: 2000px;
  top: 0;
  height: 100%;
  content: "";
  position: absolute;
}

nav#mainMenu ul .sf-mega:before {
  left: -2000px;
}

nav#mainMenu ul .sf-mega:after {
  right: -2000px;
}

nav#mainMenu ul .sf-mega .flex {
  display: flex;
  flex-wrap: nowrap;
  align-content: space-between;
}

nav#mainMenu ul .sf-mega ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

nav#mainMenu ul .sf-mega ul.colFour {
  flex: 0 0 25%;
}

nav#mainMenu ul .sf-mega ul li {
  padding: 16px 100px 16px 0;
  width: 100%;
}

nav#mainMenu ul .sf-mega ul li a {
  text-transform: none;
  line-height: 1.5;
  padding: 4px 20px 4px 0;
}

nav#mainMenu ul .sf-mega ul li a:after {
  display: none;
}

nav#mainMenu ul .sf-mega ul li a:before {
  content: "";
  position: absolute;
  left: -3px;
  opacity: 0;
  top: 9px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 10px;
  border-color: transparent transparent transparent #ffffff;
}

nav#mainMenu ul .sf-mega ul li a:hover {
  padding: 4px 0 4px 20px;
  text-decoration: underline;
}

nav#mainMenu ul .sf-mega ul li a:hover:before {
  opacity: 1;
  left: 0;
}

body.fixedHeader nav#mainMenu ul .sf-mega {
  padding-top: 50px;
}

body.page.sub-menu-show nav#mainMenu ul ul {
  display: block !important;
  opacity: 1 !important;
}

a.mobileMenuBTN {
  display: none;
  float: left;
  padding: 7px 0;
  padding: 0.4375rem 0;
  outline: none;
}

a.mobileMenuBTN #navIcon {
  width: 30px;
  width: 1.875rem;
  height: 21px;
  height: 1.3125rem;
  position: relative;
  cursor: pointer;
  float: left;
}

a.mobileMenuBTN #navIcon span {
  display: block;
  position: absolute;
  height: 2px;
  height: 0.125rem;
  width: 100%;
  opacity: 1;
  left: 0;
}

a.mobileMenuBTN #navIcon span:nth-child(1) {
  top: 0px;
}

a.mobileMenuBTN #navIcon span:nth-child(2) {
  top: 9px;
  top: 0.5625rem;
  opacity: 1;
}

a.mobileMenuBTN #navIcon span:nth-child(3) {
  top: 18px;
  top: 1.125rem;
}

body.mm-wrapper--opened a.mobileMenuBTN #navIcon span:nth-child(1) {
  top: 10px;
  transform: rotate(40deg);
  -webkit-transform: rotate(40deg);
  -ms-transform: rotate(40deg);
}

body.mm-wrapper--opened a.mobileMenuBTN #navIcon span:nth-child(2) {
  opacity: 0;
}

body.mm-wrapper--opened a.mobileMenuBTN #navIcon span:nth-child(3) {
  top: 10px;
  transform: rotate(-40deg);
  -webkit-transform: rotate(-40deg);
  -ms-transform: rotate(-40deg);
}

.mm-searchfield__input .mm-searchfield__btn {
  position: absolute;
  right: 20px;
  right: 1.25rem;
  top: 3px;
  top: 0.1875rem;
  height: 44px;
  width: 44px;
  border: none;
  -webkit-appearance: none;
  padding: 0;
  z-index: 10;
}

.mm-searchfield__input .mm-searchfield__btn:before {
  width: 44px;
  width: 2.75rem;
  height: 44px;
  height: 2.75rem;
  content: "\f002";
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  line-height: 44px;
  line-height: 2.75rem;
  color: #292459;
}

.mm-searchfield__input .mm-searchfield__btn:hover {
  cursor: pointer;
}

.mm-searchfield__input input {
  border: none;
  color: #fff;
}

.mm-searchfield__input input::-webkit-input-placeholder {
  color: #fff;
  opacity: 1;
}

.mm-searchfield__input input:moz-placeholder {
  color: #fff;
  opacity: 1;
}

.mm-searchfield__input input::-moz-placeholder {
  color: #fff;
  opacity: 1;
}

.mm-searchfield__input input:-ms-input-placeholder {
  color: #fff;
  opacity: 1;
}

.mobileMenus {
  position: absolute;
  top: 65px;
  top: 4.0625rem;
  left: 40px;
  right: 40px;
  width: auto;
  height: 80px;
  height: 5rem;
  z-index: 100;
}

.mobileMenus .innerHeader {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.mobileMenus .innerHeader .logoHolder,
.mobileMenus .innerHeader .logoHolder a {
  display: block;
  float: left;
  width: 171px;
  width: 10.6875rem;
  height: 80px;
  height: 5rem;
}

.mobileMenus .innerHeader .logoHolder a img {
  width: 100%;
}

 .mm-menu .mm-navbar__searchfield .searchButton {
  position: absolute;
  right: -9px;
  right: -0.5625rem;
  top: 0px;
  top: 0rem;
  width: 30px;
  width: 1.875rem;
  height: 30px;
  height: 1.875rem;
  border: none;
  -webkit-appearance: none;
  padding: 0;
  z-index: 10;background: none;
}

.mm-menu .mm-navbar__searchfield .searchButton:before {
  width: 30px;
  width: 1.875rem;
  height: 30px;
  height: 1.875rem;
  content: "\f002";
  font-family: 'Font Awesome 6 Free';
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  line-height: 30px;
  line-height: 1.875rem;
}

.mm-menu .mm-navbar__searchfield .searchButton:hover {
  cursor: pointer;
}

.mm-menu .mm-btn--close {
  width: 32px;
  height: 28px;
}

.mm-menu .mm-btn--close:before,
.mm-menu .mm-btn--close:after {
  content: "";
  position: absolute;
  height: 2px;
  height: 0.125rem;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  background-clip: padding-box;
  behavior: url(/wp-content/themes/C4/assets/css/PIE.htc);
  width: 100%;
  opacity: 1;
  left: 0;
  background-color: #fff;
}

.mm-menu .mm-btn--close:before {
  top: 10px;
  transform: rotate(40deg);
  -webkit-transform: rotate(40deg);
  -ms-transform: rotate(40deg);
}

.mm-menu .mm-btn--close:after {
  top: 10px;
  transform: rotate(-40deg);
  -webkit-transform: rotate(-40deg);
  -ms-transform: rotate(-40deg);
}

@media (max-width: 767px) {
  nav#mainMenu {
    top: 63px;
  }
  .mobileMenus {
    left: 20px;
    right: 20px;
    height: 50px;
    top: 53px;
  }
  .mobileMenus .innerHeader .logoHolder,
  .mobileMenus .innerHeader .logoHolder a {
    display: block;
    float: left;
    width: 100px;
    width: 6.25rem;
    height: 47px;
    height: 2.9375rem;
  }
}

@media all and (min-width: 768px) and (max-width: 1024px) {
  nav#mainMenu {
    top: 77px;
  }
}

@media all and (min-width: 1024px) and (max-width: 1400px) {
  nav#mainMenu {
    top: 77px;
  }
}

@media (max-width: 1400px) {
  nav#mainMenu {
    width: 30px;
    position: absolute;
    right: 5%;
    height: 30px;
  }
  nav#mainMenu ul {
    display: none;
  }
  a.mobileMenuBTN {
    display: block;
  }
}

@media (min-width: 1400px) {
  body.fixedHeader nav#mainMenu {
    top: 10px;
    top: 0.625rem;
    height: 50px;
  }
  body.fixedHeader nav#mainMenu ul li a {
    line-height: 50px;
    padding-bottom: 10px;
  }
  body.fixedHeader nav#mainMenu ul .sf-mega {
    top: 60px;
  }
  body.fixedHeader nav#mainMenu ul .sf-mega ul > li > a {
    line-height: 1.5;
    padding: 4px 20px 4px 0;
  }
  body.fixedHeader nav#mainMenu ul .sf-mega ul > li > a:hover {
    padding: 4px 0px 4px 20px;
  }
}

@media all and (min-width: 1400px) and (max-width: 1500px) {
  nav#mainMenu ul li {
    padding: 0 10px;
  }
}

@media (max-width: 1900px) {
  nav#mainMenu ul .sf-mega {
    left: 0;
    right: 0;
  }
}

footer#siteFooter {
  width: 100%;
  padding: 30px 0;
}

footer#siteFooter .holder {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
}

footer#siteFooter a:hover {
  text-decoration: underline;
}

footer#siteFooter .fLeft a {
  margin-left: 20px;
}

footer#siteFooter .fLeft a:first-child {
  margin-left: 0;
}

footer#siteFooter .fRight {
  display: flex;
  flex-grow: 1;
  justify-content: flex-end;
}

footer#siteFooter .fRight .siteBy {
  margin-left: 20px;
}

@media (max-width: 767px) {
  footer#siteFooter {
    padding: 16px 0 20px 0;
  }
  footer#siteFooter .fLeft,
  footer#siteFooter .fRight {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  footer#siteFooter .fLeft .copy,
  footer#siteFooter .fRight .copy {
    width: 100%;
    text-align: center;
    line-height: 1.5;
    margin-bottom: 10px;
  }
  footer#siteFooter .fLeft .siteBy,
  footer#siteFooter .fRight .siteBy {
    margin-left: 0;
  }
  footer#siteFooter .fLeft a {
    margin: 7px 10px;
  }
  footer#siteFooter .fRight {
    margin-top: 15px;
  }
}

@media all and (min-width: 768px) and (max-width: 1023px) {
  footer#siteFooter {
    padding: 30px 0;
  }
}

@media all and (min-width: 768px) and (max-width: 1300px) {
  footer#siteFooter .fRight {
    margin-top: 20px;
  }
  footer#siteFooter .fLeft,
  footer#siteFooter .fRight {
    justify-content: flex-start;
  }
}

@media (max-width: 1300px) {
  footer#siteFooter .fLeft,
  footer#siteFooter .fRight {
    flex: 0 0 100%;
    text-align: center;
    justify-content: center;
  }
}

@media (min-width: 1300px) and (max-width: 1400px) {
  footer#siteFooter .fLeft a {
    margin-left: 12px;
  }
}

a.more,
span.more {
  padding: 0 25px;
  line-height: 48px;
  line-height: 3rem;
  display: inline-block;
  border-width: 1px;
  border-style: solid;
  text-transform: uppercase;
}

#video {
  display: flex;
  height: 100%;
  height: 100vh;
  height: calc(100vh - 270px);
  margin-top: 150px;
  position: relative;
  overflow: hidden;
}

#video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  -o-object-fit: cover;
  object-position: bottom center;
  position: absolute;
  top: 0;
  left: 0;
}

#video .overlay {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  background: transparent linear-gradient(360deg, #000000 0%, #545454 100%) 0% 0%;
  opacity: 0.3;
}

#video .videoText {
  position: absolute;
  left: 50%;
  bottom: 290px;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  z-index: 10;
  width: 100%;
  max-width: 90%;
  text-shadow: 0 3px 6px rgba(0, 0, 0, 0.28);
  text-align: center;
}

#video #pausePlay {
  position: absolute;
  z-index: 1000;
  height: 30px;
  width: 30px;
  left: 65px;
  bottom: 80px;
}

#video #pausePlay button {
  position: absolute;
  height: 30px;
  width: 30px;
  left: 0;
  top: 0px;
  padding: 0;
  border: none;
  -webkit-appearance: none;
  background-color: transparent;
}

#video #pausePlay i {
  line-height: 30px;
  width: 30px;
  text-align: center;
  position: absolute;
  left: 0;
  top: 0;
}

#video #pausePlay:hover {
  opacity: 0.6;
}

#video button#play {
  display: none;
}

#video #sound {
  position: absolute;
  z-index: 1000;
  height: 30px;
  width: 30px;
  left: 65px;
  bottom: 45px;
}

#video #sound button {
  position: absolute;
  height: 30px;
  width: 30px;
  left: 0;
  top: 0px;
  padding: 0;
  border: none;
  -webkit-appearance: none;
  background-color: transparent;
}

#video #sound button:hover {
  opacity: 0.6;
}

#video .searchHolder,
#slider .searchHolder {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 1300px;
  max-width: 90%;
  height: 164px;
  bottom: 45px;
  z-index: 5;
}

#video .searchHolder .linkButtons,
#slider .searchHolder .linkButtons {
  position: relative;
  display: flex;
  margin-top: 20px;
  justify-content: center;
}

#video .searchHolder .linkButtons a,
#slider .searchHolder .linkButtons a {
  display: inline-block;
  line-height: 64px;
  padding: 0 30px;
  border-width: 1px;
  border-style: solid;
  text-transform: uppercase;
  margin: 0 10px;
}

#video .searchHolder .linkButtons a i,
#slider .searchHolder .linkButtons a i {
  margin-right: 10px;
}

#video .searchHolder .courseSearch,
#slider .searchHolder .courseSearch {
  height: 80px;
  width: 100%;
  width: calc(100% - 13px);
  margin-left: 13px;
  position: relative;
}

#video .searchHolder .courseSearch:before,
#slider .searchHolder .courseSearch:before {
  position: absolute;
  height: 100%;
  content: "";
  top: 0;
  width: 38px;
  width: 2.375rem;
  transform: skewX(-24.4deg);
  -webkit-transform: skewX(-24.4deg);
  left: 0px;
  left: 0rem;
}

#video .searchHolder .courseSearch .searchElement,
#slider .searchHolder .courseSearch .searchElement {
  position: relative;
  float: left;
  width: 100%;
  height: 80px;
  z-index: 10;
}

#video .searchHolder .courseSearch .searchElement input.searchInput,
#slider .searchHolder .courseSearch .searchElement input.searchInput {
  position: absolute;
  top: 0;
  left: 20px;
  left: 1.25rem;
  width: 86%;
  width: calc(100% - 240px);
  height: 63px;
  height: 3.9375rem;
  padding: 8px 12px 9px 10px;
  padding: 0.5rem 0.75rem 0.5625rem 0.625rem;
  box-sizing: content-box;
  border: none;
  color: #000000;
  -webkit-appearance: none;
  outline: none;
  z-index: 10;
}

#video .searchHolder .courseSearch .searchElement input.searchInput::-webkit-input-placeholder,
#slider .searchHolder .courseSearch .searchElement input.searchInput::-webkit-input-placeholder {
  color: #000000;
  opacity: 1;
}

#video .searchHolder .courseSearch .searchElement input.searchInput:moz-placeholder,
#slider .searchHolder .courseSearch .searchElement input.searchInput:moz-placeholder {
  color: #000000;
  opacity: 1;
}

#video .searchHolder .courseSearch .searchElement input.searchInput::-moz-placeholder,
#slider .searchHolder .courseSearch .searchElement input.searchInput::-moz-placeholder {
  color: #000000;
  opacity: 1;
}

#video .searchHolder .courseSearch .searchElement input.searchInput:-ms-input-placeholder,
#slider .searchHolder .courseSearch .searchElement input.searchInput:-ms-input-placeholder {
  color: #000000;
  opacity: 1;
}

#video .searchHolder .courseSearch .searchElement button.searchBTN,
#slider .searchHolder .courseSearch .searchElement button.searchBTN {
  position: absolute;
  right: 0;
  right: 0;
  top: 0;
  top: 0;
  width: 200px;
  width: 12.5rem;
  height: 80px;
  text-align: center;
  border: none !important;
  -webkit-appearance: none;
  padding: 0;
  border-radius: 0;
  z-index: 12;
}

#video .searchHolder .courseSearch .searchElement button.searchBTN i,
#slider .searchHolder .courseSearch .searchElement button.searchBTN i {
  margin-right: 15px;
}

#video .searchHolder .courseSearch .searchElement button.searchBTN:hover,
#slider .searchHolder .courseSearch .searchElement button.searchBTN:hover {
  cursor: pointer;
}

#slider .searchHolder {
  max-width: 100%;
  height: 60px;
  bottom: 50px;
}

#slider .searchHolder .courseSearch {
  width: 37.6923%;
  width: calc(37.6923% - 13px);
  float: left;
  height: 60px;
}

#slider .searchHolder .courseSearch .searchElement {
  height: 60px;
}

#slider .searchHolder .courseSearch .searchElement button.searchBTN {
  width: 160px;
  height: 60px;
  line-height: 60px;
}

#slider .searchHolder .courseSearch .searchElement input.searchInput {
  width: calc(100% - 200px);
  height: 43px;
}

#slider .searchHolder .linkButtons {
  width: 61.3001%;
  float: right;
  margin-top: 0;
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

#slider .searchHolder .linkButtons a {
  flex-grow: 1;
  margin: 0;
  border: none;
  height: 60px;
  line-height: 60px;
  padding: 0 5px;
  text-align: center;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.28);
}

#slider .searchHolder.two-buttons .courseSearch {
  width: 56.3846%;
  width: calc(56.3846% - 13px);
}

#slider .searchHolder.two-buttons .linkButtons {
  width: 42.6461%;
}

section#section-one {
  clear: both;
  position: relative;
  overflow: hidden;
}

section#section-one .left-block {
  width: 90px;
  top: 120px;
  bottom: 0;
  height: auto;
  position: absolute;
  left: auto;
}

section#section-one:after {
  height: 150px;
  width: 90%;
  content: "";
  left: -20px;
  bottom: -90px;
  position: absolute;
  transform: rotate(5deg);
  -webkit-transform: rotate(5deg);
}

section#section-one .sectorLinks {
  display: flex;
  flex-wrap: nowrap;
  width: calc(100% + 90px);
  margin-left: -45px;
}

section#section-one .sectorLinks .link {
  display: flex;
  height: 120px;
  flex: 1;
}

section#section-one .sectorLinks .link a {
  display: flex;
  height: 120px;
  flex: 0 0 100%;
  justify-content: center;
  align-items: center;
  transform: skewX(-35deg);
  -webkit-transform: skewX(-35deg);
  border-left-width: 2px;
  border-left-style: solid;
  text-align: center;
  line-height: 1.5;
  text-transform: uppercase;
}

section#section-one .sectorLinks .link a span {
  display: block;
}

section#section-one .sectorLinks .link a span.unskew {
  transform: skewX(35deg);
  -webkit-transform: skewX(35deg);
  display: inline-block;
}

section#section-one .sectorLinks .link:first-child a {
  border: none;
}

section#section-one .sectorLinks .link:first-child a span.unskew {
  margin-left: 50px;
}

section#section-one .sectorLinks .link:last-child a span.unskew {
  margin-right: 50px;
}

section#section-one .holder {
  display: flex;
  flex-wrap: nowrap;
  padding: 140px 0 0 0;
}

section#section-one .holder .left-column {
  flex: 0 0 47.6922%;
  padding-right: 90px;
}

section#section-one .holder .left-column h1 {
  margin: 0 0 70px 0;
  line-height: 1.1;
  text-transform: uppercase;
  position: relative;
}

section#section-one .holder .left-column h1:after {
  position: absolute;
  left: 0;
  bottom: -100px;
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 29px 0 29px 50px;
  border-color: transparent transparent transparent #D23A81;
}

section#section-one .holder .left-column p {
  padding-left: 110px;
  line-height: 1.5;
}

section#section-one .holder .left-column a.more {
  margin: 20px 0 0 110px;
}

section#section-one .holder .right-column {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  flex: 0 0 52.3078%;
  width: 52.3078%;
  position: relative;
  z-index: 3;
}

section#section-one .holder .right-column .qlBlock {
  width: 530px;
  max-width: 100%;
  height: 310px;
  position: relative;
  overflow: hidden;
}

section#section-one .holder .right-column .qlBlock:after {
  position: absolute;
  left: -310px;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 175px 0 175px 308px;
  opacity: 0.8;
  z-index: 3;
  transition: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  -webkit-transition: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

section#section-one .holder .right-column .qlBlock.open-days {
  align-self: flex-start;
}

section#section-one .holder .right-column .qlBlock.open-days:after {
  border-color: transparent transparent transparent #018489;
}

section#section-one .holder .right-column .qlBlock.how-to-apply {
  align-self: flex-end;
  margin-top: 20px;
}

section#section-one .holder .right-column .qlBlock.how-to-apply:after {
  border-color: transparent transparent transparent #D23A81;
}

section#section-one .holder .right-column .qlBlock .image,
section#section-one .holder .right-column .qlBlock .overlay {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

section#section-one .holder .right-column .qlBlock .image {
  z-index: 1;
}

section#section-one .holder .right-column .qlBlock .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

   section#section-one .holder .right-column .qlBlock .overlay {
  z-index: 2;

  mix-blend-mode: multiply;
background: linear-gradient(90deg, rgba(0,0,0,0.6) 22%, rgba(0,0,0,0) 100%) !important;
}

section#section-one .holder .right-column .qlBlock .small-arrow {
  z-index: 3;
  position: absolute;
  width: 0;
  height: 0;
  right: 25px;
  bottom: 25px;
  border-style: solid;
  border-width: 11.5px 0 11.5px 20px;
  border-color: transparent transparent transparent #ffffff;
}

section#section-one .holder .right-column .qlBlock .title {
  position: absolute;
  z-index: 10;
  left: 45px;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}

section#section-one .holder .right-column .qlBlock:hover:after {
  left: 0;
}

section#section-one .right-arrow {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 369.5px 640px 369.5px 0;
  border-color: transparent #B3CDCD transparent transparent;
  z-index: 2;
}

  #latestNews {
  clear: both;
  padding: 208px 0 50px 0;
  padding: 13rem 0 3.125rem 0;
  margin-top: -60px;margin-bottom:40px;
  position: relative;
}


@media (max-width:  767px) 
{
	#latestNews {margin-bottom:0px}

}

#latestNews:after {
  height: 360px;
  left: -20px;
  width: auto;
  content: "";
  right: -20px;
  bottom: -110px;
  position: absolute;
  transform: rotate(-4deg);
  -webkit-transform: rotate(-4deg);
}

#latestNews .flex {
  display: flex;
  align-items: flex-start;
}

#latestNews .sectionTitle {
  position: relative;
  z-index: 10;
  margin-bottom: 45px;
  margin-bottom: 2.8125rem;
  display: inline-block;
  text-transform: uppercase;
}

#latestNews a.more {
  margin: 15px 0 0 100px;
}

#latestNews .blogCarousel {
  display: flex;
  position: relative;
  width: calc(100% + 10px);
  margin-left: -5px;
}

#latestNews .blogCarousel .owl-stage-outer {
  z-index: 2;
}

#latestNews .blogCarousel:before {
  content: "";
  position: absolute;
  width: 530px;
  height: 420px;
  top: -270px;
  left: -223px;
  background-image: url(/wp-content/themes/C4/assets/images/background/bird-icon.svg);
  background-size: cover;
}

#latestNews .blogCarousel .owl-item {
  padding: 8px;
}

#latestNews .blogCarousel .item {
  width: 100%;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.28);
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.28);
}

#latestNews .blogCarousel .item a {
  display: block;
}

#latestNews .blogCarousel .item figure {
  margin: 0;
  position: relative;
  overflow: hidden;
  height: 220px;
  height: 13.75rem;
  width: 100%;
}

#latestNews .blogCarousel .item figure img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 50%;
  left: 50%;
  max-width: none;
  object-fit: cover;
  transform: translate(-50%, -50%) scale(1);
  -webkit-transform: translate(-50%, -50%) scale(1);
}

#latestNews .blogCarousel .blogInfo {
  width: 100%;
  padding: 20px 20px 70px 20px;
  padding: 1.25rem 1.25rem 4.375rem 1.25rem;
  line-height: 1.1;
  position: relative;
  min-height: 210px;
  min-height: 13.125rem;
}

#latestNews .blogCarousel .blogInfo span {
  display: block;
}

#latestNews .blogCarousel .blogInfo span.title {
  line-height: 1.35;
  margin: 10px 0 0 0;
  margin: 0.625rem 0 0 0;
}

#latestNews .blogCarousel .item a:hover figure img {
  transform: translate(-50%, -50%) scale(1.1);
  -webkit-transform: translate(-50%, -50%) scale(1.1);
}

#infoScroller {
  clear: both;
  margin: 50px 0 40px 0;
}

#infoScroller .scroller {
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.28);
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.28);
}

#infoScroller .scroller,
#infoScroller .item {
  width: 100%;
}

#infoScroller .item {
  display: flex;
  overflow: hidden;
}

#infoScroller .item .content {
  min-height: 500px;
  flex: 0 0 50%;
  padding: 50px 130px 140px 40px;
  position: relative;
  z-index: 2;
}

#infoScroller .item .content:after {
  width: 100px;
  content: "";
  position: absolute;
  right: -50px;
  top: -20px;
  bottom: -20px;
  height: auto;
  transform: rotate(-6deg);
  -webkit-transform: rotate(-6deg);
}

#infoScroller .item .content .type {
  padding-left: 20px;
  position: relative;
  text-transform: uppercase;
}

#infoScroller .item .content .type:before {
  position: absolute;
  content: "";
  left: 0;
  top: 4px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 10px;
  border-color: transparent transparent transparent #ffffff;
}

#infoScroller .item .content .title {
  margin-top: 40px;
  line-height: 1.4;
}

#infoScroller .item .content a.more {
  position: absolute;
  left: 40px;
  bottom: 40px;
}

#infoScroller .item .image {
  flex: 1;
  align-content: stretch;
  position: relative;
}

#infoScroller .item .image .overlay {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0.3;
}

#infoScroller .item .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#infoScroller .item.text-black .content .type:before {
  border-color: transparent transparent transparent #000000;
}

#infoScroller .owl-dots {
  position: absolute;
  bottom: 40px;
  right: 32px;
  height: 20px;
  z-index: 5;
}

#infoScroller .owl-dots button {
  height: 18px;
  width: 18px;
  border-width: 1px;
  border-style: solid;
  margin: 0 7px;
  -webkit-transform: none;
  padding: 0;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  display: inline-block;
}

#latestNews,
#events,
header#masthead #sticky-header.sectorLinks.owl-carousel,
#relatedCourses .courseListing .courseList {
  width: 100%;
  margin-left: 0;
}

#latestNews .owl-nav,
#events .owl-nav,
header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav,
#relatedCourses .courseListing .courseList .owl-nav {
  position: absolute;
  width: 100%;
  cursor: pointer;
  display: block;
  top: 214px;
  height: 23px;
  height: 1.4375rem;
  z-index: 1;
}

#latestNews .owl-nav .owl-prev,
#latestNews .owl-nav .owl-next,
#events .owl-nav .owl-prev,
#events .owl-nav .owl-next,
header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-prev,
header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-next,
#relatedCourses .courseListing .courseList .owl-nav .owl-prev,
#relatedCourses .courseListing .courseList .owl-nav .owl-next {
  width: 20px;
  height: 23px;
  position: absolute;
  outline: none;
  border: none;
  -webkit-appearance: none;
  z-index: 5;
  top: 0;
  padding: 0;
  background-color: transparent;
}

#latestNews .owl-nav .owl-prev:hover,
#latestNews .owl-nav .owl-next:hover,
#events .owl-nav .owl-prev:hover,
#events .owl-nav .owl-next:hover,
header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-prev:hover,
header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-next:hover,
#relatedCourses .courseListing .courseList .owl-nav .owl-prev:hover,
#relatedCourses .courseListing .courseList .owl-nav .owl-next:hover {
  opacity: 0.6;
}

#latestNews .owl-nav .owl-prev,
#events .owl-nav .owl-prev,
header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-prev,
#relatedCourses .courseListing .courseList .owl-nav .owl-prev {
  left: -30px;
  left: -1.875rem;
  border-style: solid;
  border-width: 11.5px 20px 11.5px 0;
  border-color: transparent #ffffff transparent transparent;
}

#latestNews .owl-nav .owl-next,
#events .owl-nav .owl-next,
header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-next,
#relatedCourses .courseListing .courseList .owl-nav .owl-next {
  right: -30px;
  right: -1.875rem;
  border-style: solid;
  border-width: 11.5px 0 11.5px 20px;
  border-color: transparent transparent transparent #ffffff;
}

#latestNews .owl-dots,
#events .owl-dots,
header#masthead #sticky-header.sectorLinks.owl-carousel .owl-dots,
#relatedCourses .courseListing .courseList .owl-dots {
  display: none;
}

header#masthead #sticky-header.sectorLinks.owl-carousel .owl-stage-outer {
  z-index: 5;
}

header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav {
  top: 0;
  height: 60px;
  z-index: auto;
}

header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-prev:before,
header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-next:before {
  position: absolute;
  content: "";
  width: 0;
  height: 0;
  top: 50%;
  left: 50%;
  margin-top: -6px;
}

header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-prev,
header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-next {
  height: 60px;
  width: 50px;
  border: none;
  position: absolute;
  z-index: 5;
  background-color: #D23A81;
}

header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-prev {
  left: 0;
}

header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-prev:before {
  border-style: solid;
  border-width: 6px 10px 6px 0;
  border-color: transparent #ffffff transparent transparent;
}

header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-next {
  right: 0;
}

header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-next:before {
  border-style: solid;
  border-width: 6px 0 6px 10px;
  border-color: transparent transparent transparent #ffffff;
}

#relatedCourses .courseListing .courseList .owl-nav {
  top: 50%;
  margin-top: -11px;
}

#relatedCourses .courseListing .courseList .owl-nav .owl-prev {
  left: -38px;
  width: 0;
  height: 0;
}

#relatedCourses .courseListing .courseList .owl-nav .owl-next {
  right: -38px;
  width: 0;
  height: 0;
}

#events {
  clear: both;
  padding: 90px 0 150px 0;
  position: relative;
}

#events:before {
  height: 200px;
  left: -20px;
  width: auto;
  content: "";
  right: -20px;
  top: -110px;
  position: absolute;
  transform: rotate(-3deg);
  -webkit-transform: rotate(-3deg);
}

#events .flex {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

#events a.viewAll {
  margin-top: 15px;
}

#events .eventsCarousel {
  width: 100%;
  position: relative;
  z-index: 5;
  margin-top: 40px;
}

#events .eventsCarousel .owl-stage-outer {
  z-index: 10;
}

#events .eventsCarousel .event {
  width: 100%;
  overflow: hidden;
}

#events .eventsCarousel .event .date {
  padding: 40px 0 30px 0;
  padding: 2.5rem 0 1.875rem 0;
  position: relative;
  z-index: 5;
}

#events .eventsCarousel .event .date span {
  display: block;
  margin-top: 8px;
}

#events .eventsCarousel .event a {
  display: block;
  width: 100%;
  padding: 0 30px 0px 30px;
  text-align: center;
  position: relative;
}

#events .eventsCarousel .event a:after {
  content: "";
  width: 90px;
  height: 10px;
  position: absolute;
  top: 178px;
  left: 50%;
  transform: translate(-50%, -50%) skew(-35deg);
  -webkit-transform: translate(-50%, -50%) skew(-35deg);
}

#events .eventsCarousel .event a .eventInfo {
  padding: 50px 0 15px 0;
  padding: 3.125rem 0 0.9375rem 0;
  position: relative;
  z-index: 5;
}

#events .eventsCarousel .event a .eventInfo .title,
#events .eventsCarousel .event a .eventInfo .time {
  display: block;
  line-height: 1.5;
  margin: 7px 0;
  margin: 0.4375rem 0;
}

#events .eventsCarousel .event a .eventInfo .time {
  margin: 0;
  margin: 0;
}

#events .eventsCarousel .event a:hover:after {
  width: 210px;
}

#collegeList {
  clear: both;
  margin: 0 0 30px 0;
}

#collegeList .holder {
  display: flex;
  justify-content: flex-start;
  gap: 1.5386%;
  margin-top: -90px;
}

#collegeList .college {
  flex: 0 0 32.3076%;
  overflow: hidden;
}

#collegeList .college .mobTitle {
  padding: 8px 70px 8px 20px;
  line-height: 1.3;
  position: relative;
  display: none;
}

#collegeList .college .mobTitle:after {
  content: "";
  position: absolute;
  top: 40%;
  top: calc(50% - 6px);
  right: 5%;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 10px;
  border-color: transparent transparent transparent #000;
}

#collegeList .college.open .mobTitle:after {
  transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
}

#collegeList .college.ealing-green .mobTitle {
  line-height: 50px;
  padding-top: 0;
  padding-bottom: 0;
}

#collegeList .college.hammersmith-blue .mobTitle:after {
  border-color: transparent transparent transparent #fff;
}

#collegeList .college .image {
  height: 220px;
}

#collegeList .college .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#collegeList .college .details {
  padding: 25px 25px 75px 28px;
  line-height: 1.5;
  position: relative;
}

#collegeList .college .details:before {
  content: "";
  height: 50px;
  position: absolute;
  left: -10px;
  right: -10px;
  width: auto;
  top: -20px;
  transform: rotate(-6deg);
  -webkit-transform: rotate(-6deg);
}

#collegeList .college .details .collegeName {
  position: relative;
  z-index: 5;
}

#collegeList .college .details .collegeAddress {
  margin: 20px 0;
}

#collegeList .college .details .collegeTel {
  position: absolute;
  left: 28px;
  bottom: 30px;
}

#collegeList .college .details .collegeTel i {
  margin-right: 8px;
}

#associates {
  clear: both;
  padding: 30px 0 40px 0;
}

#associates #ticker {
  width: 100%;
  overflow: hidden;
}

#associates #ticker .slick-slide {
  margin: 0 25px;
  margin: 0 1.5625rem;
}

#associates #ticker div {
  float: left;
  text-align: center;
  height: 120px;
  height: 7.5rem;
  vertical-align: middle;
  line-height: 120px;
  line-height: 7.5rem;
}

#associates #ticker div:before {
  display: none;
}

#associates #ticker .slick-slide img {
  display: inline-block;
  max-width: 100%;
}

#socials {
  clear: both;
  padding: 30px 0;
}

#socials .flex {
  display: flex;
  justify-content: center;
  gap: 20px;
}

#socials .flex a {
  height: 38px;
  width: 38px;
  border-radius: 50%;
       -webkit-border-radius: 50%;
  border-width: 1px;
  border-style: solid;
  line-height: 38px;
  text-align: center;
}

@media (max-width: 767px) {
  a.more,
  span.more {
    line-height: 40px;
    padding: 0 12px;
  }
  #video {
    height: 430px;
    margin-top: 100px;
  }
  #video #pausePlay {
  left: auto;
        bottom: auto;
        top: 39px;
        right: 10px;
  }
  #video #sound {
    bottom: auto;
    left: 5%;
    top: 45px;
  }
  #video video#College-Video {
    height: 200px;
  }
  #video .overlay {
    height: 200px;
  }
  #video .searchHolder {
    height: 230px;
    bottom: 0;
    max-width: 100%;
    background-color: #018489;
  }
  #video .searchHolder .courseSearch {
    height: 50px;
    width: calc(90% - 13px);
    margin-left: calc(5% + 13px);
    margin-top: 15px;
  }
  #video .searchHolder .courseSearch .searchElement {
    height: 50px;
  }
  #video .searchHolder .courseSearch .searchElement input.searchInput {
    height: 33px;
    width: calc(100% - 92px);
  }
  #video .searchHolder .courseSearch .searchElement button.searchBTN {
    height: 50px;
    width: 50px;
  }
  #video .searchHolder .courseSearch .searchElement button.searchBTN span {
    display: none;
  }
  #video .searchHolder .courseSearch .searchElement button.searchBTN i {
    margin-right: 0;
  }
  #video .searchHolder .linkButtons {
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
    margin-top: 7px;
  }
  #video .searchHolder .linkButtons a {
    line-height: 40px;
    margin: 5px 0;
    width: auto;
    padding: 0 12px;
  }
  #video .videoText {
    bottom: 240px;
    line-height: 1.3;
  }
  section#section-one {
    z-index: 100;
  }
  section#section-one .sectorLinks .link a {
    height: auto;
    padding: 12px 60px 12px 5%;
    position: relative;
  }
  section#section-one .sectorLinks .link a:after {
    content: "";
    position: absolute;
    top: 40%;
    top: calc(50% - 6px);
    right: 5%;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 0 6px 10px;
    border-color: transparent transparent transparent #fff;
  }
  section#section-one .holder {
    padding: 20px 0 0 0;
    flex-wrap: wrap;
  }
  section#section-one .holder .left-column {
    flex: 0 0 100%;
    padding-right: 0;
    margin-bottom: 20px;
  }
  section#section-one .holder .left-column h1 {
    margin: 0 0 20px 0;
  }
  section#section-one .holder .left-column h1:after {
    display: none;
  }
  section#section-one .holder .left-column p {
    padding-left: 0;
  }
  section#section-one .holder .left-column a.more {
    margin: 10px 0 0 0;
  }
  section#section-one .holder .right-column {
    flex: 0 0 100%;
    align-content: center;
  }
  section#section-one .holder .right-column .qlBlock {
    height: 200px;
  }
  section#section-one .holder .right-column .qlBlock:after {
    border-width: 120px 0 120px 240px;
  }
  section#section-one .holder .right-column .qlBlock .title {
    left: 20px;
  }
   section#section-one:after {
    display: none;
  }
  #latestNews {
    margin-top: 20px;
    padding: 25px 0 20px 0;
  }
  #latestNews .flex {
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
  }
  #latestNews .sectionTitle {
    margin-bottom: 15px;
  }
  #latestNews .blogCarousel {
    margin-top: 15px;
  }
  #latestNews .blogCarousel:before {
    width: 300px;
    height: 238px;
    left: 50%;
    top: -180px;
    transform: translateX(-50%);
  }
  #latestNews .blogCarousel .blogInfo {
    padding: 20px 20px 30px 20px;
    min-height: 0;
  }
  #latestNews .owl-nav {
    top: -50px;
  }
  #latestNews .owl-nav .owl-prev {
    left: 8px;
  }
  #latestNews .owl-nav .owl-next {
    right: 8px;
  }
  #latestNews:after {
    height: 250px;
  }
  #infoScroller {
    margin: 0 0 30px 0;
  }
  #infoScroller .item {
    flex-wrap: wrap;
  }
  #infoScroller .item .content {
    flex: 0 0 100%;
    min-height: 0;
    padding: 25px 20px 100px 20px;
  }
  #infoScroller .item .content:after {
    width: auto;
    left: -20px;
    right: -20px;
    height: 60px;
    top: auto;
    bottom: -20px;
  }
  #infoScroller .item .content .type:before {
    top: 0;
  }
  #infoScroller .item .content .title {
    margin-top: 25px;
  }
  #infoScroller .item .content a.more {
    left: 20px;
    bottom: 10px;
    z-index: 5;
  }
  #infoScroller .item .image {
    height: 230px;
    flex: 0 0 100%;
  }
  #infoScroller .item .image img {
    background-position: top center;
  }
  #infoScroller .owl-dots {
    width: 100%;
    right: 0;
    text-align: center;
    height: 10px;
    bottom: 26px;
  }
  #infoScroller .owl-dots button {
    display: inline-block;
    height: 10px;
    width: 10px;
    margin: 0 5px;
  }
  #events {
    padding: 0px 0 0px 0;
  }
  #events:before {
    transform: rotate(-6deg);
    -webkit-transform: rotate(-6deg);
    top: -240px;
    height: 280px;
  }
  #events .flex {
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
  }
  #events .sectionTitle {
    margin-bottom: 15px;
  }
  #events .eventsCarousel {
    margin-top: 0;
  }
  #events .owl-nav {
    top: -32px;
  }
  #events .owl-nav .owl-prev {
    left: 8px;
  }
  #events .owl-nav .owl-next {
    right: 8px;
  }
  #collegeList {
    margin-bottom: 0;
  }
  #collegeList .holder {
    flex-wrap: wrap;
    margin: 15px 0 0 0;
  }
  #collegeList .holder .college {
    flex: 0 0 100%;
    margin-top: 5px;
  }
  #collegeList .holder .college .details {
    padding: 0px 20px 50px 20px;
  }
  #collegeList .holder .college .details:before {
    height: 80px;
    top: -44px;
  }
  #collegeList .holder .college .details .collegeName {
    display: none;
  }
  #collegeList .holder .college .details .collegeAddress {
    position: relative;
    z-index: 5;
    margin: 0 0 20px 0;
  }
  #collegeList .holder .college .details .collegeTel {
    left: 20px;
    bottom: 20px;
  }
  #collegeList .holder .college .collapse {
    display: none;
  }
  #collegeList .holder .college .mobTitle {
    display: block;
  }
  #associates {
    padding: 25px 0 30px 0;
  }
  #socials {
    padding: 20px 0;
  }
  header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav {
    height: 50px;
  }
  header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-prev,
  header#masthead #sticky-header.sectorLinks.owl-carousel .owl-nav .owl-next {
    height: 50px;
  }
}

@media (min-width: 768px) {
  #collegeList .college .collapse {
    display: block !important;
  }
}

@media all and (min-width: 768px) and (max-width: 1023px) {
  #video {
    height: 585px;
  }
  #video video#College-Video {
    height: 430px;
  }
  #video .searchHolder {
    height: 155px;
    bottom: 0;
    max-width: 100%;
    background-color: #018489;
  }
  #video .searchHolder .courseSearch {
    height: 54px;
    width: calc(90% - 13px);
    margin-left: calc(5% + 13px);
    margin-top: 20px;
  }
  #video .searchHolder .courseSearch .searchElement {
    height: 54px;
  }
  #video .searchHolder .courseSearch .searchElement input.searchInput {
    height: 37px;
    width: calc(100% - 96px);
  }
  #video .searchHolder .courseSearch .searchElement button.searchBTN {
    height: 54px;
    width: 54px;
  }
  #video .searchHolder .courseSearch .searchElement button.searchBTN span {
    display: none;
  }
  #video .searchHolder .courseSearch .searchElement button.searchBTN i {
    margin-right: 0;
  }
  #video .searchHolder .linkButtons {
    width: 90%;
    margin-left: 5%;
    gap: 14px;
  }
  #video .searchHolder .linkButtons .clearfix {
    display: none;
  }
  #video .searchHolder .linkButtons a {
    line-height: 40px;
    margin: 0;
    padding: 0 8px;
    flex-grow: 1;
    text-align: center;
  }
  #video .videoText {
    bottom: 210px;
    line-height: 1.3;
  }
  section#section-one {
    z-index: 100;
  }
  section#section-one .container {
    padding: 0 90px;
  }
  section#section-one .sectorLinks .link a {
    height: auto;
    padding: 20px 70px 20px 5%;
    position: relative;
  }
  section#section-one .sectorLinks .link a:after {
    content: "";
    position: absolute;
    top: 40%;
    top: calc(50% - 6px);
    right: 5%;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 0 6px 10px;
    border-color: transparent transparent transparent #fff;
  }
  section#section-one .holder {
    padding: 60px 0 0 0;
    flex-wrap: wrap;
  }
  section#section-one .holder .left-column {
    flex: 0 0 100%;
    padding-right: 0;
    margin-bottom: 40px;
  }
  section#section-one .holder .left-column h1 {
    margin: 0 0 55px 0;
  }
  section#section-one .holder .left-column h1:after {
    bottom: -90px;
  }
  section#section-one .holder .right-column {
    flex: 0 0 100%;
    align-content: center;
  }
  section#section-one:after {
    left: -30px;
    right: -30px;
    width: auto;
    bottom: 0;
    height: 200px;
  }
  #latestNews {
    padding: 138px 0 0 0;
  }
  #latestNews:after {
    height: 250px;
  }
  #latestNews .sectionTitle {
    margin-bottom: 25px;
  }
  #latestNews .blogCarousel:before {
    left: -20px;
    top: -320px;
  }
  #infoScroller {
    margin: 40px 0;
  }
  #infoScroller .item .content {
    flex: 0 0 56%;
    padding: 40px 80px 160px 40px;
    min-height: 400px;
  }
  #infoScroller .item .content a.more {
    bottom: 30px;
  }
  #infoScroller .owl-dots {
    height: 15px;
  }
  #infoScroller .owl-dots button {
    height: 14px;
    width: 14px;
    margin: 0 5px;
  }
  #events {
    padding: 40px 0 80px 0;
  }
  #events:before {
    top: -200px;
    height: 280px;
  }
  #events .eventsCarousel {
    margin-top: 20px;
  }
  #collegeList {
    margin-bottom: 10px;
  }
  #collegeList .holder {
    margin-top: -60px;
  }
  #collegeList .college .image {
    height: 120px;
  }
  #collegeList .college .details {
    padding: 5px 22px 45px 22px;
  }
  #collegeList .college .details .collegeTel {
    left: 22px;
    bottom: 15px;
  }
}

@media (max-width: 1023px) {
  section#section-one .sectorLinks {
    width: 100%;
    margin-left: 0;
    flex-wrap: wrap;
  }
  section#section-one .sectorLinks .link {
    height: auto;
    flex: 0 0 100%;
  }
  section#section-one .sectorLinks .link a {
    height: auto;
    transform: none;
    -webkit-transform: none;
    border-left: none;
    border-top: 1px solid #fff;
    text-align: left;
    justify-content: flex-start;
  }
  section#section-one .sectorLinks .link a span.unskew {
    transform: none;
    -webkit-transform: none;
  }
  section#section-one .sectorLinks .link a span {
    display: inline-block;
  }
  section#section-one .sectorLinks .link:first-child a span.unskew {
    margin-left: 0;
  }
  section#section-one .right-arrow {
    display: none;
  }
  section#section-one .holder .right-column .qlBlock:after {
    left: 0;
  }
  #slider .searchHolder {
    display: none;
  }
}

@media all and (min-width: 1024px) and (max-width: 1400px) {
  #slider .searchHolder {
    width: 90%;
    height: 130px;
  }
  #slider .searchHolder .courseSearch {
    width: 100%;
    width: calc(100% - 13px);
    margin-bottom: 10px;
    float: none;
  }
  #slider .searchHolder .linkButtons {
    width: auto;
    float: none;
  }
  #slider .searchHolder .linkButtons a {
    padding: 0 20px;
  }
}

@media all and (min-width: 1024px) and (max-width: 1200px) {
  section#section-one .holder {
    padding-top: 100px;
  }
  section#section-one .holder .left-column {
    padding-right: 70px;
  }
  section#section-one .holder .left-column h1 {
    margin: 0 0 50px 0;
  }
  section#section-one .holder .left-column h1:after {
    bottom: -85px;
  }
  section#section-one .holder .left-column p {
    padding-left: 90px;
  }
  section#section-one .right-arrow {
    right: -200px;
  }
  section#section-one:after {
    bottom: -60px;
  }
}

@media (max-width: 1200px) {
  #events a.viewAll,
  #latestNews a.more {
    margin: 5px 0 0 0;
  }
}

@media all and (min-width: 1024px) and (max-width: 1300px) {
  #latestNews:after {
    height: 300px;
  }
}

@media all and (min-width: 768px) and (max-width: 1400px) {
  #video {
    margin-top: 130px;
  }
  #latestNews .container,
  #events .container {
    padding: 0 90px;
  }
  #latestNews .flex {
    justify-content: space-between;
  }
}

@media all and (min-width: 768px) and (max-width: 1500px) {
  #video #pausePlay {
    bottom: auto;
    top: 70px;
    left: 30px;
  }
  #video #sound {
    bottom: auto;
    top: 110px;
    left: 30px;
  }
}

@media all and (min-width: 1024px) and (max-width: 1600px) {
  header#masthead #sticky-header.sectorLinks .link a {
    line-height: 1.2;
    padding: 0 20px;
  }
}

@media all and (min-width: 1024px) and (max-width: 1850px) {
  #latestNews .blogCarousel:before {
    left: -50px;
    top: -350px;
  }
}

@media (max-width: 1600px) {
  section#section-one .left-block {
    display: none;
  }
}

@media all and (min-width: 1024px) and (max-height: 900px) {
  #video {
    min-height: 400px;
  }
  #video .searchHolder .courseSearch {
    height: 54px;
    width: calc(90% - 13px);
    margin-left: calc(5% + 13px);
    margin-top: 20px;
  }
  #video .searchHolder .courseSearch .searchElement {
    height: 54px;
  }
  #video .searchHolder .courseSearch .searchElement input.searchInput {
    height: 37px;
    width: calc(100% - 96px);
  }
  #video .searchHolder .courseSearch .searchElement button.searchBTN {
    height: 54px;
    width: 54px;
  }
  #video .searchHolder .courseSearch .searchElement button.searchBTN span {
    display: none;
  }
  #video .searchHolder .courseSearch .searchElement button.searchBTN i {
    margin-right: 0;
  }
  #video .videoText {
        bottom: 220px;
  }
}

#slider.page {
  margin-top: 150px;
  min-height: 0;
  position: relative;
  width: 100%;
  overflow: hidden;
}

#slider.page .sliderImages {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

#slider.page .sliderImages .slideImage {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center center;
}

#slider.page .sliderImages .overlay {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: transparent linear-gradient(180deg, #1D1D1B 0%, #686866 10%) 0% 0% no-repeat padding-box;
  mix-blend-mode: multiply;
  z-index: 2;
  opacity: 0.3;
}

#slider.page .sliderImages .slideImage {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center center;
}

#slider.page .pageTitle {
  position: absolute;
  z-index: 10;
  top: 100px;
  left: 140px;
  text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.28);
}

#slider.page .pageTitle:after {
  position: absolute;
  left: -90px;
  bottom: 5px;
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 25px 0 25px 50px;
  border-color: transparent transparent transparent #D23A81;
}

#slider.page,
#slider.page .sliderImages,
#slider.page .sliderImages .slide,
#slider.page .sliderImages .slideImage,
#slider.page .container {
  height: 630px;
  height: 39.375rem;
  max-height: 58vh;
}

html.tablet.landscape #slider.page,
html.tablet.landscape #slider.page .sliderImages,
html.tablet.landscape #slider.page .sliderImages .slide,
html.tablet.landscape #slider.page .sliderImages .slideImage,
html.tablet.landscape #slider.page .container {
  height: 500px;
  height: 31.25rem;
}

#pageHolder {
  clear: both;
  width: 100%;
  position: relative;
}

#pageHolder:before {
  content: "";
  position: absolute;
  left: 0;
  width: 90px;
  top: 0;
  bottom: 0;
  height: auto;
}

#pageHolder:after {
  height: 150px;
  width: 50%;
  content: "";
  left: -20px;
  bottom: -95px;
  position: absolute;
  transform: rotate(6deg);
  -webkit-transform: rotate(6deg);
}

#pageHolder .pageHolder {
  clear: both;
  width: 100%;
  position: relative;
  display: flex;
  padding: 0 0 200px 0;
  padding: 0 0 12.5rem 0;
}

#pageHolder aside#sidebar {
  flex: 22%;
  /*added*/
  position: relative;
  margin: -42px 0 0 0;
  padding: 0;
  opacity: 1;
}

#pageHolder aside#sidebar nav#sideMenu {
  display: block;
  width: 100%;
  padding-bottom: 15px;
  padding-bottom: 0.9375rem;
  margin: 0;
  position: relative;
}

#pageHolder aside#sidebar nav#sideMenu:before, #pageHolder aside#sidebar nav#sideMenu:after {
  position: absolute;
  width: 2000px;
  content: "";
  right: -10px;
  /*added*/
  height: 200px;
  transform: rotate(-8deg) skew(-8deg);
  -webkit-transform: rotate(-8deg) skew(-8deg);
}

#pageHolder aside#sidebar nav#sideMenu:before {
  top: 85px;
}

#pageHolder aside#sidebar nav#sideMenu:after {
  bottom: -150px;
}

#pageHolder aside#sidebar .sectionHeader {
  display: block;
  position: relative;
  width: 100%;
  height: 40px;
  height: 1.4rem;
  line-height: 40px;
  line-height: 1.4rem;
  padding-top: 15px;
  padding-top: 0.9375rem;
  text-transform: uppercase;
}

#pageHolder aside#sidebar .sectionHeader .sectionTitle .arrow {
  display: none;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 15px 8.5px 0px 8.5px;
  border-color: #fff transparent transparent transparent;
  position: absolute;
  top: 17px;
  right: 5%;
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}

#pageHolder aside#sidebar .sectionHeader a.linkAction {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

#pageHolder aside#sidebar .sectionHeader.sectionMenuOpen .sectionTitle .arrow {
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  margin: 0 0 0 0;
  margin: 0 0 0 0;
}

#pageHolder aside#sidebar ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  width: 100%;
  padding: 30px 0 5px 0;
  padding: 1.875rem 0 0.3125rem 0;
  z-index: 2000;
  position: relative;
}

#pageHolder aside#sidebar ul:before {
  width: 2000px;
  content: "";
  position: absolute;
  left: -2000px;
  top: 0;
  bottom: -15px;
  height: auto;
}

#pageHolder aside#sidebar ul li {
  width: 100%;
  position: relative;
}

#pageHolder aside#sidebar ul li a {
  display: block;
  padding: 10px 25px 7px 0;
  padding: 0.625rem 1.5625rem 0.4375rem 0;
  line-height: 1.4;
  position: relative;
}

#pageHolder aside#sidebar ul li a:hover, #pageHolder aside#sidebar ul li a:focus, #pageHolder aside#sidebar ul li a.active {
  text-decoration: underline;
}

#pageHolder aside#sidebar ul li a:before {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 10px;
  border-color: transparent transparent transparent #fff;
  position: absolute;
  top: 14px;
  left: -5px;
  opacity: 0;
}

#pageHolder aside#sidebar ul li a:hover, #pageHolder aside#sidebar ul li a.active {
  padding-left: 20px;

}

#pageHolder aside#sidebar ul ul li a:hover, #pageHolder aside#sidebar ul ul li a.active {
  padding-left: 28px;

}


#pageHolder aside#sidebar ul li a:hover:before, #pageHolder aside#sidebar ul li a.active:before {
  opacity: 1;
  left: 0;
}

#pageHolder aside#sidebar ul li.has-sub > a {
  padding: 10px 50px 6px 0px;
  padding: 0.625rem 3.125rem 0.375rem 0rem;
}

#pageHolder aside#sidebar ul li.has-sub > a:hover {
  padding-left: 20px;
  padding-right: 20px;
}

#pageHolder aside#sidebar ul li.has-sub > a.active {
  padding: 10px 30px 6px 20px;
  padding: 0.625rem 1.875rem 0.375rem 1.25rem;
}

#pageHolder aside#sidebar ul li ul {
  display: none;
  margin: 0 0 5px 0;
  margin: 0 0 0.3125rem 0;
  padding: 0;
}

#pageHolder aside#sidebar ul li ul .holder:after {
  top: 8px;
}

#pageHolder aside#sidebar ul li ul:before {
  display: none !important;
}

#pageHolder aside#sidebar ul li ul li {
  width: 100%;
  padding: 0;
  border: none;
}

#pageHolder aside#sidebar ul li ul li a {
  padding: 2px 35px 2px 20px;
  padding: 0.125rem 2.1875rem 0.125rem 1.25rem;
  border: none;
}

#pageHolder aside#sidebar ul li ul li a:before {
  display: none;
}

#pageHolder aside#sidebar ul li ul li a:hover {
  padding-left: 20px !important;
  text-decoration: underline;
}

#pageHolder aside#sidebar ul li ul li.has-sub > a {
  padding: 2px 60px 2px 20px;
  padding: 0.125rem 3.75rem 0.125rem 1.25rem;
}

#pageHolder aside#sidebar ul li ul li:before {
  position: absolute;
  top: 5px;
  top: 0.3125rem;
  left: 0px;
  left: 0rem;
  content: "-";
}

#pageHolder aside#sidebar ul li ul li li a {
  padding: 2px 35px 2px 28px;
  padding: 0.125rem 2.1875rem 0.125rem 1.75rem;
}

#pageHolder aside#sidebar ul li ul li li a:hover {
  padding-left: 28px !important;
  padding-right: 35px;
}

#pageHolder aside#sidebar ul li ul li li:before {
  left: 15px;
  left: 0.9375rem;
}

#pageHolder aside#sidebar ul li.has-sub ul {
  display: none;
}

#pageHolder aside#sidebar ul li.has-sub.open .holder:after,
#pageHolder aside#sidebar ul li.has-sub.open ul li.has-sub.open .holder:after {
  transform: rotate(180deg);
}

#pageHolder aside#sidebar ul li.has-sub.open ul li .holder:after {
  transform: rotate(0deg);
}

#pageHolder aside#sidebar .holder {
  width: 30px;
  width: 1.875rem;
  height: 0;
  right: 0px;
  position: absolute;
  top: 0;
  top: 0;
  height: 100%;
}

#pageHolder aside#sidebar .holder:after {
  display: block;
  position: absolute;
  text-align: center;
  width: 100%;
  padding: 0;
  padding: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 6px 0 6px;
  border-color: #fff transparent transparent transparent;
  z-index: 10;
  content: "";
  top: 15px;
  top: 0.9375rem;
}

#pageHolder aside#sidebar .holder:hover {
  cursor: pointer;
}

#pageHolder aside#sidebar #courseSearch {
  width: 100%;
  margin-top: 80px;
  padding: 15px 25px 25px 25px;
  position: relative;
}

#pageHolder aside#sidebar #courseSearch:before {
  height: 40px;
  left: -1px;
  right: -1.5px;
  width: auto;
  top: -20px;
  content: "";
  position: absolute;
  transform: rotate(-8deg) skew(-8deg);
  -webkit-transform: rotate(-8deg) skew(-8deg);
}

#pageHolder aside#sidebar #courseSearch .title {
  position: relative;
  z-index: 2;
}

#pageHolder aside#sidebar #courseSearch .searchElement {
  position: relative;
  width: 100%;
  z-index: 10;
  margin-top: 20px;
}

#pageHolder aside#sidebar #courseSearch .searchElement input.searchInput {
  width: 90%;
  width: calc(100% - 22px);
  height: 40px;
  height: 2.5rem;
  padding: 8px 12px 9px 10px;
  padding: 0.5rem 0.75rem 0.5625rem 0.625rem;
  box-sizing: content-box;
  border: none;
  color: #000000;
  -webkit-appearance: none;
  outline: none;
  z-index: 10;
}

#pageHolder aside#sidebar #courseSearch .searchElement input.searchInput::-webkit-input-placeholder {
  color: #000000;
  opacity: 1;
}

#pageHolder aside#sidebar #courseSearch .searchElement input.searchInput:moz-placeholder {
  color: #000000;
  opacity: 1;
}

  #pageHolder aside#sidebar #courseSearch .searchElement input.searchInput::-moz-placeholder {
  color: #000000;
  opacity: 1;
}

#pageHolder aside#sidebar #courseSearch .searchElement input.searchInput:-ms-input-placeholder {
  color: #000000;
  opacity: 1;
}

#pageHolder aside#sidebar #courseSearch .searchElement button.searchBTN {
  width: 100%;
  height: 54px;
  text-align: center;
  border-width: 1px;
  border-style: solid;
  -webkit-appearance: none;
  padding: 0;
  border-radius: 0;
  margin-top: 10px;
  z-index: 12;
}

#pageHolder aside#sidebar #courseSearch .searchElement button.searchBTN i {
  margin-right: 15px;
}

#pageHolder aside#sidebar #courseSearch .searchElement button.searchBTN:hover {
  cursor: pointer;
}

#pageHolder aside#sidebar .linkButtons {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  margin-top: 20px;
  justify-content: center;
}

#pageHolder aside#sidebar .linkButtons a {
  display: inline-block;
  flex: 0 0 100%;
  line-height: 60px;
  padding: 0 10px;
  padding: 0 10px;
  border-width: 1px;
  border-style: solid;
  margin: 0 0 10px 0;
  text-align: center;
  text-transform: uppercase;
}

#pageHolder aside#sidebar .linkButtons a i {
  margin-right: 10px;
}

#pageHolder aside#sidebar #sidebarQL {
  display: block;
  width: 100%;
}

#pageHolder aside#sidebar #sidebarQL .qlBlock {
  width: 100%;
  max-width: 100%;
  height: 200px;
  position: relative;
  overflow: hidden;
}

#pageHolder aside#sidebar #sidebarQL .qlBlock:after {
  position: absolute;
  left: -240px;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 110px 0 110px 220px;
  opacity: 0.8;
  z-index: 3;
  transition: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  -webkit-transition: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

#pageHolder aside#sidebar #sidebarQL .qlBlock.open-days {
  align-self: flex-start;
}

#pageHolder aside#sidebar #sidebarQL .qlBlock.open-days:after {
  border-color: transparent transparent transparent #018489;
}

#pageHolder aside#sidebar #sidebarQL .qlBlock.how-to-apply {
  align-self: flex-end;
  margin-top: 20px;
}

#pageHolder aside#sidebar #sidebarQL .qlBlock.how-to-apply:after {
  border-color: transparent transparent transparent #D23A81;
}

#pageHolder aside#sidebar #sidebarQL .qlBlock .image,
#pageHolder aside#sidebar #sidebarQL .qlBlock .overlay {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

#pageHolder aside#sidebar #sidebarQL .qlBlock .image {
  z-index: 1;
}

#pageHolder aside#sidebar #sidebarQL .qlBlock .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

     #pageHolder aside#sidebar #sidebarQL .qlBlock .overlay {
  z-index: 2;
  opacity: 0.8;
mix-blend-mode: multiply;
background: linear-gradient(90deg, rgba(0,0,0,0.8) 40%, rgba(0,0,0,0) 100%) !important;
}

#pageHolder aside#sidebar #sidebarQL .qlBlock .small-arrow {
  z-index: 3;
  position: absolute;
  width: 0;
  height: 0;
  right: 25px;
  bottom: 25px;
  border-style: solid;
  border-width: 11.5px 0 11.5px 20px;
  border-color: transparent transparent transparent #ffffff;
}

#pageHolder aside#sidebar #sidebarQL .qlBlock .title {
  position: absolute;
  z-index: 10;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}

#pageHolder aside#sidebar #sidebarQL .qlBlock:hover:after {
  left: -10px;
}

#pageHolder #pageContent {
  flex: 78%;
  max-width: 78%;
  padding-top: 40px;
  padding-top: 2.5rem;
  padding-left: 50px;
  /*added*/
  position: relative;
  z-index: 2000;
}

#pageHolder #pageContent .breadcrumb {
  position: relative;
  width: 100%;
  margin-bottom: 65px;
  margin-bottom: 4.0625rem;
  line-height: 1.3;
}

#pageHolder #pageContent .breadcrumb a {
  word-break: break-word;
  display: inline-block;
  padding: 0 4px 0 16px;
  padding: 0 0.25rem 0 1rem;
  margin: 0 9px 0 0;
  margin: 0 0.5625rem 0 0;
  position: relative;
  border-left-width: 1px;
  border-left-style: solid;
  line-height: 1;
  transform: skew(-20deg);
  -webkit-transform: skew(-20deg);
}

#pageHolder #pageContent .breadcrumb a span {
  display: inline-block;
  transform: skew(20deg);
  -webkit-transform: skew(20deg);
}

#pageHolder #pageContent .breadcrumb a:first-child {
  padding: 0 4px 0 0;
  padding: 0 0.25rem 0 0;
  border: none;
}

#pageHolder #pageContent .breadcrumb a:hover span,
#pageHolder #pageContent .breadcrumb a.current span {
  text-decoration: underline;
}

#pageHolder #pageContent ul, #pageHolder #pageContent ol {
  line-height: 1.5;
  display: block;
  width: 100%;
}

#pageHolder #pageContent ul {
  margin-bottom: 25px;
  margin-bottom: 1.5625rem;
  margin-left: 0;
  padding: 0;
  padding-left: 18px;
  padding-left: 1.125rem;
}

#pageHolder #pageContent ul li {
  position: relative;
  list-style-position: outside;
}

#pageHolder #pageContent ol {
  counter-reset: li;
  list-style: none;
  *list-style: decimal;
  padding: 0 0 0 24px;
  width: 96%;
}

#pageHolder #pageContent ol li {
  position: relative;
  margin-bottom: 1px;
  margin-bottom: 0.0625rem;
}

#pageHolder #pageContent ol li:before {
  content: counter(li) ".";
  counter-increment: li;
  position: absolute;
  left: -28px;
  left: -1.75rem;
  top: 0;
  top: 0;
  height: 20px;
  width: 20px;
  text-align: center;
}

#pageHolder #pageContent h1 {
  margin-top: 0;
  margin-bottom: 30px;
  margin-bottom: 1.875rem;
  position: relative;
  line-height: 1.35;
  width: 100%;
}

#pageHolder #pageContent h1,
#pageHolder #pageContent h2,
#pageHolder #pageContent h3,
#pageHolder #pageContent h4,
#pageHolder #pageContent h5 {
  text-transform: uppercase;
}

#pageHolder #pageContent p {
  line-height: 1.5;
  margin: 0 0 25px 0;
  margin: 0 0 1.5625rem 0;
}

#pageHolder #pageContent p a:hover {
  text-decoration: underline;
}

#pageHolder #pageContent img.alignLeft,
#pageHolder #pageContent img.alignRight {
  margin-bottom: 25px;
  margin-bottom: 1.5625rem;
}

#pageHolder #pageContent img.alignLeft {
  float: left;
  margin-right: 25px;
  margin-right: 1.5625rem;
}

#pageHolder #pageContent img.alignRight {
  float: right;
  margin-left: 25px;
  margin-left: 1.5625rem;
}

#pageHolder #pageContent img.centered {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

#pageHolder #pageContent img.alignright {
  padding: 4px;
  margin: 0 0 2px 7px;
  display: inline;
}

#pageHolder #pageContent img.alignleft {
  padding: 4px;
  margin: 0 7px 2px 0;
  display: inline;
}

#pageHolder #pageContent .alignright {
  float: right;
}

#pageHolder #pageContent .alignleft {
  float: left;
}

#pageHolder #pageContent blockquote {
  margin: 50px 0 40px 0;
  margin: 3.125rem 0 2.5rem 0;
  padding: 50px 55px 50px 55px;
  padding: 3.125rem 3.4375rem 3.125rem 3.4375rem;
  line-height: 1.5;
  border-width: 1px;
  border-style: solid;
}

#pageHolder #pageContent blockquote cite.author {
  margin-top: 14px;
  margin-top: 0.875rem;
  display: block;
  font-style: normal;
}

#pageHolder #pageContent .oneThird {
  float: left;
  width: 30%;
  margin-left: 5%;
}

#pageHolder #pageContent .oneHalf {
  float: left;
  width: 47.5%;
  margin-left: 5%;
}

#pageHolder #pageContent .extraContent {
  padding: 20px 0 0 0;
  padding: 1.25rem 0 0 0;
  float: left;
  width: 100%;
}

#pageHolder #pageContent .extraContent h2 {
  text-transform: none;
}

#pageHolder #pageContent .oneThird:first-of-type {
  margin-left: 0;
}

#pageHolder #pageContent .oneHalf:first-of-type {
  margin-left: 0;
}

#pageHolder #pageContent.fullWidth {
  margin-left: 0;
  flex: 100%;
  max-width: 100%;
  padding-left: 0;
}

#pageHolder #pageContent #mobile-page-content {
  display: none;
  width: 100%;
  flex-wrap: wrap;
}

#pageHolder #pageContent #mobile-page-content #courseSearch {
  width: 100%;
  flex: 0 0 100%;
  margin-top: 50px;
  padding: 40px 25px 25px 25px;
  position: relative;
  overflow-y: hidden;
  clip-path: polygon(0% 10%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 10%, 100% 0%, 100% 100%, 0% 100%);
}

#pageHolder #pageContent #mobile-page-content #courseSearch .title {
  position: relative;
  z-index: 2;
}

#pageHolder #pageContent #mobile-page-content #courseSearch .searchElement {
  position: relative;
  width: 100%;
  z-index: 10;
  margin-top: 20px;
}

#pageHolder #pageContent #mobile-page-content #courseSearch .searchElement input.searchInput {
  width: 80%;
  width: calc(100% - 232px);
  height: 32px;
  height: 2rem;
  padding: 8px 12px 9px 10px;
  padding: 0.5rem 0.75rem 0.5625rem 0.625rem;
  box-sizing: content-box;
  border: none;
  color: #000000;
  -webkit-appearance: none;
  outline: none;
  z-index: 10;
}

#pageHolder #pageContent #mobile-page-content #courseSearch .searchElement input.searchInput::-webkit-input-placeholder {
  color: #000000;
  opacity: 1;
}

#pageHolder #pageContent #mobile-page-content #courseSearch .searchElement input.searchInput:moz-placeholder {
  color: #000000;
  opacity: 1;
}

#pageHolder #pageContent #mobile-page-content #courseSearch .searchElement input.searchInput::-moz-placeholder {
  color: #000000;
  opacity: 1;
}

#pageHolder #pageContent #mobile-page-content #courseSearch .searchElement input.searchInput:-ms-input-placeholder {
  color: #000000;
  opacity: 1;
}

#pageHolder #pageContent #mobile-page-content #courseSearch .searchElement button.searchBTN {
  width: 200px;
  height: 48px;
  text-align: center;
  border-width: 1px;
  border-style: solid;
  -webkit-appearance: none;
  padding: 0;
  border-radius: 0;
  z-index: 12;
  margin: 0;
  float: right;
  display: inline-block;
}

#pageHolder #pageContent #mobile-page-content #courseSearch .searchElement button.searchBTN i {
  margin-right: 15px;
}

#pageHolder #pageContent #mobile-page-content #courseSearch .searchElement button.searchBTN:hover {
  cursor: pointer;
}

#pageHolder #pageContent #mobile-page-content .linkButtons {
  position: relative;
  display: flex;
  flex: 0 0 100%;
  flex-wrap: wrap;
  margin-top: 20px;
  justify-content: center;
  gap: 12px;
}

#pageHolder #pageContent #mobile-page-content .linkButtons a {
  display: inline-block;
  flex-grow: 1;
  line-height: 60px;
  padding: 0 10px;
  padding: 0 10px;
  border-width: 1px;
  border-style: solid;
  margin: 0;
  text-align: center;
  text-transform: uppercase;
}

#pageHolder #pageContent #mobile-page-content .linkButtons a i {
  margin-right: 10px;
}

#pageHolder #pageContent #mobile-page-content #sidebarQL {
  display: flex;
  width: 100%;
  gap: 3.1978%;
  margin-top: 20px;
}

#pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock {
  flex: 0 0 48.4011%;
  max-width: 100%;
  height: 200px;
  position: relative;
  overflow: hidden;
}

#pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock:after {
  position: absolute;
  left: -10px;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 110px 0 110px 220px;
  opacity: 0.8;
  z-index: 3;
  transition: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  -webkit-transition: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

#pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock.open-days {
  align-self: flex-start;
}

#pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock.open-days:after {
  border-color: transparent transparent transparent #018489;
}

#pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock.how-to-apply {
  align-self: flex-end;
}

#pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock.how-to-apply:after {
  border-color: transparent transparent transparent #D23A81;
}

#pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock .image,
#pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock .overlay {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

#pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock .image {
  z-index: 1;
}

#pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

    #pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock .overlay {
  z-index: 2;
  opacity: 0.8;
mix-blend-mode: multiply;
background: linear-gradient(90deg, rgba(0,0,0,0.6) 22%, rgba(0,0,0,0) 100%) !important;
}

#pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock .small-arrow {
  z-index: 3;
  position: absolute;
  width: 0;
  height: 0;
  right: 25px;
  bottom: 25px;
  border-style: solid;
  border-width: 11.5px 0 11.5px 20px;
  border-color: transparent transparent transparent #ffffff;
}

#pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock .title {
  position: absolute;
  z-index: 10;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}

body.noSidebar #pageHolder .pageHolder {
  gap: 0;
  flex-direction: column;
}

#infoScroller.page {
  margin-bottom: 70px;
  margin-top: 0;
  padding-top: 200px;
  position: relative;
}

#infoScroller.page .topBlock {
  height: 240px;
  left: 0;
  width: 100%;
  content: "";
  position: absolute;
  top: 0px;
}

#infoScroller.page .flex.socials {
  top: -100px;
  position: absolute;
  right: 50px;
  display: flex;
  justify-content: flex-end;
  gap: 20px;
}

#infoScroller.page .flex.socials a {
  height: 38px;
  width: 38px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  border-width: 1px;
  border-style: solid;
  line-height: 38px;
  text-align: center;
}

#infoScroller.page:before {
  height: 300px;
  left: -20px;
  width: auto;
  content: "";
  right: -20px;
  top: 130px;
  position: absolute;
  transform: rotate(-4deg);
  -webkit-transform: rotate(-4deg);
}

#infoScroller.page .scroller:before {
  content: "";
  position: absolute;
  width: 530px;
  height: 420px;
  top: -210px;
  left: -223px;
  background-image: url(/wp-content/themes/C4/assets/images/background/bird-icon.svg);
  background-size: cover;
}

#collegeList.page {
  position: relative;
}

#collegeList.page .holder {
  margin-top: 0px;
  z-index: 3;
  position: relative;
}

#collegeList.page .right-arrow {
  position: absolute;
  right: 0;
  top: -100px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 202px 350px 202px 0;
  border-color: transparent #B3CDCD transparent transparent;
  z-index: 2;
}

.pickPath,
#pageHolder #pageContent.fullWidth .interestListing {
  display: flex;
  flex-direction: column;
  margin-top: 50px;
}

.pickPath .sectionTitle,
#pageHolder #pageContent.fullWidth .interestListing .sectionTitle {
  margin-bottom: 40px;
}

.pickPath ul,
#pageHolder #pageContent.fullWidth .interestListing ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  display: flex !important;
  flex-wrap: wrap;
  gap: 0 1.5385%;
  padding-left: 0 !important;
}

.pickPath ul li,
#pageHolder #pageContent.fullWidth .interestListing ul li {
  flex: 0 0 23.8461%;
  margin-bottom: 20px;
}

.pickPath ul li a{
  display: block;
  position: relative;
  height: 305px;
  overflow: hidden;
}



#pageHolder #pageContent.fullWidth .interestListing ul li a {
  display: block;
  position: relative;
  height: 155px;
  overflow: hidden;
}

.pickPath ul li .image,
#pageHolder #pageContent.fullWidth .interestListing ul li .image {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.pickPath ul li .image img,
#pageHolder #pageContent.fullWidth .interestListing ul li .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
} 

.pickPath ul li .icon,
      #pageHolder #pageContent.fullWidth .interestListing ul li .icon {
  position: absolute;
left:50%;
  left: 85%;

  top: 5px;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
}

 .pickPath ul li .overlay{
  position: absolute;
  z-index: 2;
  height: 310px;
  left: -20px;
  right: -20px;
  transform: rotate(8deg);
  -webkit-transform: rotate(8deg);
  top: 180px;
  opacity: 0.9;
}

@media all and (max-width:767px)
{
 .pickPath ul li .overlay{

  top: 80px;

}
}
#pageHolder #pageContent.fullWidth .interestListing ul li .overlay {
  position: absolute;
  z-index: 2;
  height: 210px;
  left: -20px;
  right: -20px;
  transform: rotate(8deg);
  -webkit-transform: rotate(8deg);
  top: 70px;
  opacity: 0.9;
}

.pickPath ul li .title,
.pickPath ul li .view,
#pageHolder #pageContent.fullWidth .interestListing ul li .title,
#pageHolder #pageContent.fullWidth .interestListing ul li .view {
   position: absolute;
  z-index: 5;
  left: 20px;
  right: 60px;
  width: auto;
}

.pickPath ul li .title {
  top: 225px;
  text-transform: uppercase;
}


   #pageHolder #pageContent.fullWidth .interestListing ul li .title {
  top: 85px;
  text-transform: uppercase;
}
.pickPath ul li .view,
#pageHolder #pageContent.fullWidth .interestListing ul li .view {
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  opacity: 0;
}

.pickPath ul li .small-arrow,
#pageHolder #pageContent.fullWidth .interestListing ul li .small-arrow {
  z-index: 3;
  position: absolute;
  width: 0;
  height: 0;
  right: 15px;
  bottom: 15px;
  border-style: solid;
  border-width: 11.5px 0 11.5px 20px;
  border-color: transparent transparent transparent #ffffff;
}

.pickPath ul li a:hover .overlay,
#pageHolder #pageContent.fullWidth .interestListing ul li a:hover .overlay {
    top: 0;
  transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
}

.pickPath ul li a:hover .view,
#pageHolder #pageContent.fullWidth .interestListing ul li a:hover .view {
  opacity: 1;
}

.pickPath ul li a:hover .title,
#pageHolder #pageContent.fullWidth .interestListing ul li a:hover .title {
  opacity: 0;
}

.pickPath ul {
  flex: 0 0 100%;
}

#pageHolder #pageContent.fullWidth .interestListing ul li .overlay {
  opacity: 1;
}

#pageHolder #pageContent.fullWidth .interestListing ul li .small-arrow {
  border-width: 7.5px 0 7.5px 15px;
}

@media (max-width: 650px) {
  #pageHolder #pageContent #mobile-page-content #sidebarQL {
    gap: 0;
    flex-wrap: wrap;
  }
  #pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock {
    flex: 0 0 100%;
  }
  #pageHolder #pageContent #mobile-page-content #sidebarQL .qlBlock.open-days {
    margin-bottom: 10px;
  }
}

@media (max-width: 767px) {
  #slider.page {
    margin-top: 150px;
  }
  #slider.page .pageTitle {
    display: none;
  }
  #slider.page,
  #slider.page .sliderImages,
  #slider.page .sliderImages .slide,
  #slider.page .sliderImages .slideImage,
  #slider.page .container {
    height: 200px;
    height: 12.5rem;
    min-height: 0;
  }
  #pageHolder aside#sidebar .sectionHeader {
    height: 60px;
    line-height: 63px;
    margin-top: -4px;
  }
  #pageHolder aside#sidebar .sectionHeader .sectionTitle .arrow {
    border-width: 10px 6px 0px 6px;
    top: 26px;
  }
  #pageHolder aside#sidebar nav#sideMenu:before {
    height: 80px;
    left: -7%;
    right: -7%;
    width: auto;
    transform: rotate(-1deg);
    -webkit-transform: rotate(-1deg);
    top: -15px;
  }
  #pageHolder .pageHolder {
    padding: 45px 0 110px 0;
  }
  body.page.noSidebar #pageHolder .pageHolder {
    padding-top: 30px;
  }
  #pageHolder #pageContent {
    padding-top: 50px;
  }
  #pageHolder #pageContent.fullWidth {
    padding-top: 0;
  }
  #pageHolder #pageContent .breadcrumb {
    display: none;
  }
  #pageHolder #pageContent h1 {
    margin-bottom: 25px;
    margin-bottom: 1.5625rem;
  }
  #pageHolder #pageContent blockquote {
    padding: 25px 20px 20px 20px;
    padding: 1.5625rem 1.25rem 1.25rem 1.25rem;
    margin: 30px 0 15px 0;
    margin: 1.875rem 0 0.9375rem 0;
  }
  #pageHolder #pageContent img {
    width: 100%;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  #pageHolder #pageContent #mobile-page-content #courseSearch .searchElement input.searchInput {
    width: calc(100% - 22px);
  }
  #pageHolder #pageContent #mobile-page-content #courseSearch .searchElement button.searchBTN {
    width: 100%;
    margin-top: 10px;
  }
  #pageHolder #pageContent #mobile-page-content .linkButtons {
    margin-top: 10px;
  }
  #pageHolder #pageContent #mobile-page-content .linkButtons a {
    flex: 0 0 100%;
    margin-bottom: 10px;
  }
  #infoScroller.page {
    padding-top: 80px;
    margin-bottom: 20px;
  }
  #infoScroller.page .flex.socials {
    justify-content: flex-start;
    left: 5%;
    top: -80px;
  }
  #infoScroller.page:before {
    transform: rotate(-6deg);
    -webkit-transform: rotate(-6deg);
    height: 190px;
  }
  .pickPath,
  #pageHolder #pageContent.fullWidth .interestListing {
    margin-top: 15px;
  }
  .pickPath .sectionTitle,
  #pageHolder #pageContent.fullWidth .interestListing .sectionTitle {
    margin-bottom: 25px;
    line-height: 1.3;
  }
  .pickPath ul,
  #pageHolder #pageContent.fullWidth .interestListing ul {
    gap: 0;
    margin-bottom: 0 !important;
  }
  .pickPath ul li,
  #pageHolder #pageContent.fullWidth .interestListing ul li {
    flex: 0 0 100%;
    margin-bottom: 10px;
  }
  .pickPath ul li:last-child,
  #pageHolder #pageContent.fullWidth .interestListing ul li:last-child {
    margin-bottom: 0;
  }
  .pickPath ul li a,
   #pageHolder #pageContent.fullWidth .interestListing ul li a {
    height: 155px;
  }
  .pickPath ul li .title,
  #pageHolder #pageContent.fullWidth .interestListing ul li .title {
    top: 90px;
  }
  .pickPath ul li a:hover .title,
  #pageHolder #pageContent.fullWidth .interestListing ul li a:hover .title {
    opacity: 1;
  }
  .pickPath ul li a:hover .view,
  #pageHolder #pageContent.fullWidth .interestListing ul li a:hover .view {
    opacity: 0;
  }
  .pickPath ul li a:hover .overlay,
      #pageHolder #pageContent.fullWidth .interestListing ul li a:hover .overlay {
    transform: rotate(8deg);
    -webkit-transform: rotate(8deg);
    top: 80px;
  }
  #pageHolder #pageContent.fullWidth .interestListing button.more {
    margin-top: 20px;
  }
  #pageHolder #pageContent #mobile-page-content .sidebarBTNS a {
    border: none;
  }
  #pageHolder #pageContent #mobile-page-content #courseSearch:before {
    left: 0;
    right: 0;
  }
  #pageHolder #pageContent #mobile-page-content #courseSearch {
    margin-top: 30px;
  }
}

@media all and (min-width: 768px) and (max-width: 1023px) {
  #slider.page {
    margin-top: 180px;
  }
  #slider.page .pageTitle {
    left: 90px;
    top: 40px;
  }
  #slider.page,
  #slider.page .sliderImages,
  #slider.page .sliderImages .slide,
  #slider.page .sliderImages .slideImage,
  #slider.page .container {
    height: 350px;
    height: 21.875rem;
    min-height: 0;
  }
  #pageHolder aside#sidebar .sectionHeader {
    height: 60px;
    line-height: 63px;
    margin-top: -4px;
  }
  #pageHolder aside#sidebar nav#sideMenu:before {
    height: 80px;
    left: -7%;
    right: -7%;
    width: auto;
    transform: rotate(-1deg);
    -webkit-transform: rotate(-1deg);
    top: -15px;
  }
  #pageHolder .pageHolder {
    padding: 0 0 130px 0;
  }
  body.noSidebar #pageHolder .pageHolder {
    padding: 0 0 180px 0;
  }
  #pageHolder #pageContent {
    margin-top: 30px;
  }
  #pageHolder #pageContent.fullWidth {
    margin-top: 0;
  }
  #pageHolder #pageContent .breadcrumb {
    margin-bottom: 40px;
  }
  #pageHolder #pageContent blockquote {
    padding: 35px 40px 35px 40px;
  }
  #pageHolder:after {
    bottom: -60px;
    height: 120px;
  }
  #infoScroller.page {
    padding-top: 40px;
    margin-bottom: 40px;
  }
  #infoScroller.page .flex.socials {
    right: auto;
    left: 5%;
    top: -70px;
  }
  #infoScroller.page:before {
    top: auto;
    bottom: -100px;
  }
  #infoScroller.page .topBlock {
    height: 340px;
  }
  .pickPath,
  #pageHolder #pageContent.fullWidth .interestListing {
    margin-top: 35px;
  }
  .pickPath ul,
  #pageHolder #pageContent.fullWidth .interestListing ul {
    gap: 0 3%;
    padding: 0 0px !important;
  }
  .pickPath ul li,
  #pageHolder #pageContent.fullWidth .interestListing ul li {
    flex: 0 0 48.5%;
  }
  body.noSidebar.sector-listing #pageHolder .pageHolder {
    padding: 0 0 130px 0;
  }
  #pageHolder #pageContent #mobile-page-content .linkButtons a {
    line-height: 40px;
  }
  #pageHolder #pageContent #mobile-page-content .linkButtons.two-buttons a {
    flex-grow: 0;
  }
}

@media (max-width: 1023px) {
  #pageHolder .container {
    padding: 0;
  }
  #pageHolder:after {
    right: -20px;
    width: auto;
  }
  #pageHolder .pageHolder {
    gap: 0;
    flex-wrap: wrap;
  }
  #pageHolder aside#sidebar .collapse {
    position: relative;
    display: none;
    float: left;
    width: 100%;
    position: relative;
    box-shadow: 0px 3px 6px -3px rgba(0, 0, 0, 0.28);
  }
  #pageHolder aside#sidebar {
    flex: 0 0 100%;
    width: 100%;
    z-index: 3000;
  }
  #pageHolder aside#sidebar ul {
    padding: 0 5% 20px 5%;
  }
  #pageHolder aside#sidebar ul:before {
    top: auto;
    width: auto;
    left: -20px;
    right: -20px;
    height: 40px;
    background-color: #018489;
    transform: rotate(-1deg);
    -webkit-transform: rotate(-1deg);
  }
  #pageHolder aside#sidebar nav#sideMenu {
    position: absolute;
    left: 0;
    padding-bottom: 0;
    z-index: 5;
  }
  #pageHolder aside#sidebar nav#sideMenu:after {
    display: none;
  }
  #pageHolder aside#sidebar .sectionHeader {
    padding: 0 5%;
  }
  #pageHolder aside#sidebar .sectionHeader a.linkAction {
    display: block;
    z-index: 2000;
  }
  #pageHolder aside#sidebar .sectionHeader a.linkAction:hover {
    cursor: pointer;
  }
  #pageHolder aside#sidebar .sectionHeader .sectionTitle .arrow {
    position: absolute;
    display: block;
  }
  #pageHolder aside#sidebar #courseSearch,
  #pageHolder aside#sidebar .linkButtons,
  #pageHolder aside#sidebar #sidebarQL {
    display: none;
  }
  #pageHolder #pageContent {
    width: 100%;
    flex: 0 0 100%;
    max-width: 100%;
    padding-left: 5%;
    padding-right: 5%;
  }
  #pageHolder #pageContent.fullWidth {
    padding-left: 5%;
  }
  #pageHolder #pageContent #mobile-page-content {
    display: flex;
  }
  #pageHolder #pageContent a.back-home {
    margin-bottom: 50px;
  }
}

@media (max-width: 1249px) {
  #pageHolder #pageContent .oneThird {
    width: 100%;
    margin: 15px 0 0 0;
    margin: 0.9375rem 0 0 0;
  }
  #pageHolder #pageContent .oneThird:first-child {
    margin-top: 0;
  }
}

@media (max-width: 1550px) {
  #pageHolder:before {
    display: none;
  }
}

@media (max-width: 1600px) {
  #infoScroller.page .scroller:before,
  #collegeList.page .right-arrow {
    display: none;
  }
}

@media all and (min-width: 1024px) and (max-width: 1300px) {
  .pickPath ul,
  #pageHolder #pageContent.fullWidth .interestListing ul {
    gap: 0 2%;
  }
  .pickPath ul li,
  #pageHolder #pageContent.fullWidth .interestListing ul li {
    flex: 0 0 32%;
  }
}

@media all and (min-width: 1024px) and (max-width: 1400px) {
  #slider.page {
    margin-top: 180px;
  }
  #infoScroller.page .flex.socials {
    right: 5%;
  }
  #pageHolder aside#sidebar nav#sideMenu:before {
    height: 80px;
    top: 80px;
  }
  #pageHolder aside#sidebar {
    flex: 30%;
  }
  #pageHolder #pageContent {
    flex: 70%;
    max-width: 70%;
  }
  #pageHolder aside#sidebar #courseSearch {
    margin-top: 90px;
  }
  #pageHolder aside#sidebar #courseSearch:before {
    height: 60px;
    top: -30px;
  }
  #slider .searchHolder {
    height: auto;
  }
  #slider .searchHolder.two-buttons .courseSearch {
    width: calc(100% - 13px);
  }
  #slider .searchHolder.two-buttons .linkButtons {
    width: 100%;
    justify-content: center;
  }
  #slider .searchHolder.two-buttons .linkButtons a {
    flex-grow: 0;
  }
}

@media all and (min-width: 1024px) and (max-width: 1500px) {
  #pageHolder:after {
    width: 65%;
    bottom: -115px;
  }
}

@media all and (min-width: 1024px) and (max-width: 1600px) {
  #slider.page .pageTitle {
    left: 90px;
  }
}

@media all and (min-width: 768px) and (max-width: 1600px) {
  #slider.page .pageTitle:after {
    border-width: 17.5px 0 17.5px 30px;
    left: -50px;
  }
}

@media all and (min-width: 1600px) and (max-width: 1800px) {
  #infoScroller.page .scroller:before {
    width: 430px;
    background-size: 430px auto;
    left: -133px;
  }
}

@media all and (min-width: 1500px) and (max-width: 2000px) {
  #pageHolder:after {
    width: 60%;
    bottom: -105px;
  }
}

@media (min-width: 1024px) {
  #pageHolder #pageContent {
    min-height: 600px;
  }
}

@media all and (min-width: 1024px) and (max-height: 900px) {
  #slider.page,
  #slider.page .sliderImages,
  #slider.page .sliderImages .slide,
  #slider.page .sliderImages .slideImage,
  #slider.page .container {
    min-height: 400px;
  }
}

span.articleDate {
  margin-bottom: 25px;
  margin-bottom: 1.5625rem;
  display: block;
  text-transform: uppercase;
}

#pageHolder #pageContent ul.newsList {
  margin: 0;
  padding: 0;
  list-style-type: none;
  margin: 0;
  margin: 0;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 1.4769%;
}

#pageHolder #pageContent ul.newsList li:before {
  display: none;
}

#pageHolder #pageContent ul.newsList li {
  flex: 0 0 23.8923%;
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.28);
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.28);
}

#pageHolder #pageContent ul.newsList li a {
  display: block;
  z-index: 5;
}

#pageHolder #pageContent ul.newsList figure {
  margin: 0;
  height: 200px;
  height: 12.5rem;
  width: 100%;
  overflow: hidden;
  position: relative;
}

#pageHolder #pageContent ul.newsList figure img {
  position: relative;
  width: 101%;
  height: 101%;
  top: 50%;
  left: 50%;
  max-width: none;
  object-fit: cover;
  transform: translate(-50%, -50%) scale(1);
  -webkit-transform: translate(-50%, -50%) scale(1);
}

#pageHolder #pageContent ul.newsList figure a {
  display: block;
}

#pageHolder #pageContent ul.newsList a:hover figure img {
  transform: translate(-50%, -50%) scale(1.1);
  -webkit-transform: translate(-50%, -50%) scale(1.1);
}

#pageHolder #pageContent ul.newsList .itemInfo {
  display: flex;
  flex-direction: column;
  padding: 20px 20px 70px 20px;
  padding: 1.25rem 1.25rem 4.375rem 1.25rem;
  line-height: 1.1;
  position: relative;
}

#pageHolder #pageContent ul.newsList .itemInfo .title {
  line-height: 1.35;
  margin: 10px 0 0 0;
  margin: 0.625rem 0 0 0;
}

.fullWidth.alignCenter {
  width: 100%;
  text-align: center;
}

button.more {
  padding: 0 20px;
  height: 48px;
  line-height: 48px;
  -webkit-appearance: none;
  margin: 20px 0 0 0;
  display: inline-block;
  border-style: solid;
  border-width: 1px;
}

.share {
  display: flex;
  width: 100%;
  margin: 50px 0 0 0;
  margin: 3.125rem 0 0 0;
  border-top-style: solid;
  border-top-width: 1px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  padding: 10px 0;
}

.share span {
  margin: 1px 5px 0 0;
  margin: 0.0625rem 0.3125rem 0 0;
}

.share a {
  display: block;
  margin-left: 7px;
  margin-left: 0.4375rem;
  padding: 0 3px;
}

#pageHolder #pageContent.fullWidth .flex {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

#pageHolder #pageContent.fullWidth .flex h1 {
  align-self: flex-start;
  width: auto;
}

#pageHolder #pageContent.fullWidth .filterWrapper {
  display: flex;
  margin-top: 15px;
}

#pageHolder #pageContent.fullWidth .filterWrapper .sectionName {
  display: inline-block;
  line-height: 40px;
  margin-right: 20px;
}

#pageHolder #pageContent.fullWidth .filterWrapper .filterGroup {
  width: 310px;
  height: 38px;
  height: 2.375rem;
  line-height: 38px;
  line-height: 2.375rem;
  padding: 0 35px 0 17px;
  position: relative;
  border-width: 1px;
  border-style: solid;
  /*&:after {
            content: "";
            position: absolute;
            top: 0;
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 6px 0 6px 10px;
            border-color: transparent transparent transparent #018489;
            @include rem(right, 5px);
            text-align: center;
            transform-style: preserve-3d;
            transform: rotate(0deg);
            -webkit-transform: rotate(0deg);
        }*/
}

#pageHolder #pageContent.fullWidth .filterWrapper .filterGroup.open:after {
  transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  border-color: transparent transparent transparent #fff;
}

#pageHolder #pageContent.fullWidth .filterWrapper .filterGroup:hover {
  cursor: pointer;
}

#pageHolder #pageContent.fullWidth .filterWrapper .filterGroup:after {
  content: "";
  position: absolute;
  top: 32%;
  top: calc(50% - 6px);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 10px;
  border-color: transparent transparent transparent #018489;
  right: 15px;
  right: 0.9375rem;
  text-align: center;
  transform-style: preserve-3d;
  transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
}

#pageHolder #pageContent.fullWidth .filterWrapper .filterItems {
  position: absolute;
  width: 100%;
  width: calc(100% + 1.5px);
  top: 100%;
  left: -0.5px;
  
  overflow: hidden;
  display: none;
  z-index: 100;
  border-style: solid;
  border-width: 1px;
  border-top: 0;
}

#pageHolder #pageContent.fullWidth .filterWrapper .filterItems .filterItem {
  line-height: normal;
  padding: 4px 17px;
  padding: 0.25rem 1.0625rem;
  line-height: 1.4;
}

#pageHolder #pageContent.fullWidth .filterWrapper .filterItems .filterItem:last-child {
  padding: 4px 18px 15px 17px;
  padding: 0.25rem 1.125rem 0.9375rem 1.0625rem;
}

#pageHolder #pageContent.fullWidth .filterWrapper .filterItems .filterItem:hover,
#pageHolder #pageContent.fullWidth .filterWrapper .filterItems .filterItem:focus {
  cursor: pointer;
  text-decoration: underline;
  z-index: 200;
}

@media (max-width: 767px) {
  .share {
    margin: 20px 0 0 0;
  }
  #pageHolder #pageContent ul.newsList {
    gap: 0;
    margin-top: 25px;
  }
  #pageHolder #pageContent ul.newsList li {
    flex: 0 0 100%;
    margin-bottom: 12px;
  }
  #pageHolder #pageContent ul.newsList figure {
    height: auto;
  }
  #pageHolder #pageContent ul.newsList figure img {
    position: relative;
    width: 100%;
    height: auto;
    top: auto;
    left: auto;
    transform: none !important;
  }
  button.more {
    margin: 5px 0 20px 0;
    padding: 0 15px;
  }
  #pageHolder #pageContent.fullWidth .filterWrapper {
    flex-grow: 1;
    flex-wrap: wrap;
  }
  #pageHolder #pageContent.fullWidth .filterWrapper .sectionName,
  #pageHolder #pageContent.fullWidth .filterWrapper .filterGroup {
    width: 100%;
    flex: 0 0 100%;
  }
}

@media all and (min-width: 767px) and (max-width: 1023px) {
  #pageHolder #pageContent ul.newsList {
    gap: 3.125%;
  }
  #pageHolder #pageContent ul.newsList li {
    flex: 0 0 48.4375%;
  }
  #pageHolder #pageContent.fullWidth .filterWrapper {
    margin-bottom: 40px;
  }
}

@media (max-width: 1023px) {
  #pageHolder #pageContent.fullWidth .flex {
    flex-wrap: wrap;
  }
  #pageHolder #pageContent.fullWidth .flex h1 {
    flex: 0 0 100%;
  }
  #pageHolder #pageContent.fullWidth .filterWrapper {
    margin-top: 0;
  }
}

@media all and (min-width: 1024px) and (max-width: 1300px) {
  #pageHolder #pageContent ul.newsList {
    gap: 2.2325%;
  }
  #pageHolder #pageContent ul.newsList li {
    flex: 0 0 31.8450%;
  }
}

.searchBox {
  width: 185px;
  width: 11.5625rem;
  height: 30px;
  height: 1.875rem;
  margin: 14px 20px 0 0;
  z-index: 10;
  border-bottom: 1px solid #fff;
  position: relative;
}

.searchBox input.searchInput {
  position: absolute;
  top: 0;
  left: 0;
  left: 0;
  width: 185px;
  width: 11.5625rem;
  width: calc(100% - 18px);
  height: 18px;
  height: 1.125rem;
  padding: 7px 15px 3px 0;
  padding: 0.4375rem 0.9375rem 0.1875rem 0;
  box-sizing: content-box;
  border: none;
  color: #fff;
  -webkit-appearance: none;
  z-index: 10;
  background: none;
}

.searchBox input.searchInput::-webkit-input-placeholder {
  color: #fff;
  opacity: 1;
}

.searchBox input.searchInput:moz-placeholder {
  color: #fff;
  opacity: 1;
}

.searchBox input.searchInput::-moz-placeholder {
  color: #fff;
  opacity: 1;
}

.searchBox input.searchInput:-ms-input-placeholder {
  color: #fff;
  opacity: 1;
}

.searchBox input.searchInput:focus {
  outline: none;
}

.searchBox button.searchBTN {
  position: absolute;
  right: -20px;
  right: -1.25rem;
  top: 0;
  top: 0;
  width: 20px;
  width: 1.25rem;
  height: 30px;
  height: 1.875rem;
  line-height: 30px;
  border: none !important;
  -webkit-appearance: none;
  padding: 0;
  background-color: transparent;
  opacity: 0.8;
}

.searchBox button.searchBTN:hover {
  opacity: 1;
}

body.search-results #pageHolder #pageContent.fullWidth .results {
  width: 100%;
  display: block;
}

body.search-results #pageHolder #pageContent.fullWidth .results .searchElement {
  position: relative;
  width: 100%;
  height: 80px;
  z-index: 10;
  border-style: solid;
  border-width: 1px;
}

body.search-results #pageHolder #pageContent.fullWidth .results .searchElement input.searchInput {
  position: absolute;
  top: 0;
  left: 20px;
  left: 1.25rem;
  width: 86%;
  width: calc(100% - 240px);
  height: 61px;
  height: 3.8125rem;
  padding: 8px 12px 9px 10px;
  padding: 0.5rem 0.75rem 0.5625rem 0.625rem;
  box-sizing: content-box;
  border: none;
  color: #000000;
  -webkit-appearance: none;
  outline: none;
  z-index: 10;
}

body.search-results #pageHolder #pageContent.fullWidth .results .searchElement input.searchInput::-webkit-input-placeholder {
  color: #000000;
  opacity: 1;
}

body.search-results #pageHolder #pageContent.fullWidth .results .searchElement input.searchInput:moz-placeholder {
  color: #000000;
  opacity: 1;
}

body.search-results #pageHolder #pageContent.fullWidth .results .searchElement input.searchInput::-moz-placeholder {
  color: #000000;
  opacity: 1;
}

body.search-results #pageHolder #pageContent.fullWidth .results .searchElement input.searchInput:-ms-input-placeholder {
  color: #000000;
  opacity: 1;
}

body.search-results #pageHolder #pageContent.fullWidth .results .searchElement button.searchBTN {
  position: absolute;
  right: 0;
  right: 0;
  top: 0;
  top: 0;
  width: 200px;
  width: 12.5rem;
  height: 80px;
  text-align: center;
  border: none !important;
  -webkit-appearance: none;
  padding: 0;
  border-radius: 0;
  z-index: 12;
}

body.search-results #pageHolder #pageContent.fullWidth .results .searchElement button.searchBTN i {
  margin-right: 15px;
}

body.search-results #pageHolder #pageContent.fullWidth .results .searchElement button.searchBTN:hover {
  cursor: pointer;
}

body.search-results #pageHolder #pageContent.fullWidth .courseListing {
  margin-top: 60px;
  position: relative;
}

body.search-results #pageHolder #pageContent.fullWidth .courseListing #apprenticeship-anchor {
  position: absolute;
  bottom: 150px;
  visibility: hidden;
}

body.search-results #pageHolder #pageContent.fullWidth .tabs {
  display: flex;
  justify-content: center;
  margin-top: 40px;
  z-index: 100;
}

body.search-results #pageHolder #pageContent.fullWidth .tabs .tab-item {
  display: inline-block;
  position: relative;
  margin-right: 10px;
}

body.search-results #pageHolder #pageContent.fullWidth .tabs .tab-item:before {
  height: 18px;
  width: 1px;
  position: absolute;
  top: 12px;
  left: -6px;
  content: "";
}

body.search-results #pageHolder #pageContent.fullWidth .tabs .tab-item:first-child:before {
  display: none;
}

body.search-results #pageHolder #pageContent.fullWidth .tabs button {
  padding: 0 15px;
  --height: 50px;
  display: block;
  height: var(--height);
  line-height: var(--height);
  border: none;
  -webkit-appearance: none;
}

body.search-results #pageHolder #pageContent.fullWidth .tabs button.current {
  text-decoration: none;
}

body.search-results #pageHolder #pageContent.fullWidth .tabs a:hover {
  cursor: pointer;
}

body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs {
  display: none;
  width: 100%;
  margin-top: 10px;
}

body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs .tab-item {
  width: 100%;
  margin-right: 0;
  display: flex;
  flex: 1;
}

body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs .tab-item button {
  width: 100%;
}

body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs .owl-stage-outer {
  z-index: 5;
}

body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs .owl-nav {
  top: 0;
  height: 50px;
  z-index: auto;
  position: absolute;
  width: 100%;
}

body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs .owl-nav .owl-prev:before,
body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs .owl-nav .owl-next:before {
  position: absolute;
  content: "";
  width: 0;
  height: 0;
  top: 50%;
  left: 50%;
  margin-top: -6px;
}

body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs .owl-nav .owl-prev,
body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs .owl-nav .owl-next {
  height: 50px;
  width: 50px;
  border: none;
  position: absolute;
  z-index: 5;
  background-color: #D23A81;
}

body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs .owl-nav .owl-prev {
  left: 0;
}

body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs .owl-nav .owl-prev:before {
  border-style: solid;
  border-width: 6px 10px 6px 0;
  border-color: transparent #ffffff transparent transparent;
}

body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs .owl-nav .owl-next {
  right: 0;
}

body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs .owl-nav .owl-next:before {
  border-style: solid;
  border-width: 6px 0 6px 10px;
  border-color: transparent transparent transparent #ffffff;
}

body.search-results #pageHolder #pageContent.fullWidth .tab-content {
  box-sizing: border-box;
  width: 100%;
  position: absolute;
  top: -999rem;
  opacity: 0;
  transition: opacity 0.2s ease-in 0s;
  -webkit-transition: opacity 0.2s ease-in 0s;
  visibility: hidden;
  height: 0;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

body.search-results #pageHolder #pageContent.fullWidth .tab-content.current {
  opacity: 1;
  position: relative;
  top: auto;
  visibility: visible;
  height: auto;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-3.tab-content .flex,
body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .flex {
  margin-top: 60px;
  flex-grow: 1;
  justify-content: flex-start;
  flex-wrap: wrap;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-3.tab-content .flex .sectionTitle,
body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .flex .sectionTitle {
  line-height: 1.2;
  flex: 0 0 100%;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-3.tab-content .flex .filterWrapper,
body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .flex .filterWrapper {
  margin-top: 30px;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-3.tab-content .flex .filterWrapper .filterGroup.event-year,
body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .flex .filterWrapper .filterGroup.event-year {
  margin-left: 8px;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-3.tab-content .flex .filterWrapper .filterGroup,
body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .flex .filterWrapper .filterGroup {
  width: 250px;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-3.tab-content .flex.no-margin,
body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .flex.no-margin {
  margin-top: 0;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-3.tab-content ul.newsList,
body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content ul.newsList {
  margin-top: 40px;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-3.tab-content .otherEvents,
body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .otherEvents {
  flex: 0 0 100%;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin: 40px 0 0 0;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-3.tab-content .otherEvents .openDay,
body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .otherEvents .openDay {
  margin-bottom: 20px;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-5.tab-content .pageListing {
  position: relative;
  margin-top: 60px;
  display: flex;
  flex-wrap: wrap;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-5.tab-content .pageListing .sectionTitle {
  line-height: 1.2;
  margin-bottom: 30px;
  flex: 0 0 100%;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-5.tab-content .pageListing .pageList {
  flex: 0 0 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-5.tab-content .pageListing .pageList .page {
  flex: 0 0 49.2307%;
  padding: 25px 25px 120px 25px;
  position: relative;
  margin-bottom: 20px;
  border-width: 1px;
  border-style: solid;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-5.tab-content .pageListing .pageList .page .title {
  line-height: 1.3;
  margin-bottom: 20px;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-5.tab-content .pageListing .pageList .page .excerpt {
  line-height: 1.5;
}

body.search-results #pageHolder #pageContent.fullWidth #tab-5.tab-content .pageListing .pageList .page a.more {
  position: absolute;
  bottom: 25px;
  left: 25px;
}

@media (max-width: 767px) {
  body.search-results #pageHolder #pageContent.fullWidth .results .searchElement {
    height: 50px;
  }
  body.search-results #pageHolder #pageContent.fullWidth .results .searchElement input.searchInput {
    height: 31px;
    left: 10px;
  }
  body.search-results #pageHolder #pageContent.fullWidth .results .searchElement button.searchBTN {
    height: 50px;
    line-height: 50px;
    width: 50px;
  }
  body.search-results #pageHolder #pageContent.fullWidth .results .searchElement button.searchBTN span {
    display: none;
  }
  body.search-results #pageHolder #pageContent.fullWidth .results .searchElement button.searchBTN i {
    margin-right: 0;
  }
  body.search-results #pageHolder #pageContent.fullWidth .courseListing {
    margin-top: 30px;
  }
  body.search-results #pageHolder #pageContent.fullWidth .tabs {
    display: none;
  }
  body.search-results #pageHolder #pageContent.fullWidth #scroller.tabs {
    display: block;
  }
  body.search-results #pageHolder .pageHolder {
    flex-wrap: nowrap;
  }
  body.search-results #pageHolder #pageContent.fullWidth #tab-3.tab-content .flex,
  body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .flex {
    margin-top: 30px;
  }
  body.search-results #pageHolder #pageContent.fullWidth #tab-3.tab-content .flex .filterWrapper,
  body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .flex .filterWrapper {
    margin-top: 20px;
  }
  body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .flex .filterWrapper .sectionName {
    margin-right: 0;
  }
  body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .flex .filterWrapper .filterGroup {
    width: 100%;
  }
  body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .flex .filterWrapper .filterGroup.event-year {
    margin: 8px 0 0 0;
  }
  body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .otherEvents {
    margin: 25px 0 0 0;
  }
  body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .otherEvents .openDay {
    margin-bottom: 12px;
  }
  body.search-results #pageHolder #pageContent.fullWidth .results .searchElement input.searchInput {
    width: calc(100% - 80px);
  }
  body.search-results #pageHolder #pageContent.fullWidth #tab-5.tab-content .pageListing {
    margin-top: 30px;
  }
  body.search-results #pageHolder #pageContent.fullWidth #tab-5.tab-content .pageListing .pageList .page {
    padding: 20px 20px 90px 20px;
    margin-bottom: 12px;
  }
  body.search-results #pageHolder #pageContent.fullWidth #tab-5.tab-content .pageListing .sectionTitle {
    margin-bottom: 20px;
  }
}

@media all and (min-width: 768px) and (max-width: 1023px) {
  body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .otherEvents {
    gap: 1.5386%;
  }
  body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .otherEvents .openDay {
    flex: 0 0 49.2307%;
  }
  body.search-results #pageHolder #pageContent.fullWidth #tab-3.tab-content .flex .filterWrapper,
  body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .flex .filterWrapper {
    margin-bottom: 0;
  }
  body.search-results #pageHolder #pageContent.fullWidth #tab-4 .otherEvents {
    padding-left: 0;
    padding-right: 0;
  }
}

@media (max-width: 1023px) {
  body.search-results #pageHolder #pageContent.fullWidth #tab-5.tab-content .pageListing .pageList .page {
    flex: 0 0 100%;
  }
}

@media all and (min-width: 1024px) and (max-width: 1300px) {
  body.search-results #pageHolder #pageContent.fullWidth #tab-4.tab-content .otherEvents .openDay {
    flex: 0 0 32.3076%;
  }
}

@media (max-width: 1250px) {
  .searchBox {
    display: none;
  }
}

#pageHolder #pageContent .sitemap {
  display: flex;
  justify-content: space-between;
}

#pageHolder #pageContent .sitemap ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  list-style-type: none;
  padding-left: 0;
}

#pageHolder #pageContent .sitemap li {
  list-style-position: inside;
  margin: 0;
  padding: 0;
  list-style-type: none;
  width: 100%;
  padding: 5px 0 !important;
  padding: 0.3125rem 0 !important;
}

#pageHolder #pageContent .sitemap li a {
  line-height: 1.2;
  text-decoration: none;
  position: relative;
  text-transform: uppercase;
}

#pageHolder #pageContent .sitemap li a:hover {
  text-decoration: underline;
}

#pageHolder #pageContent .sitemap li:before {
  display: none;
}

#pageHolder #pageContent .sitemap li ul {
  margin: 15px 0 10px 0 !important;
  margin: 0.9375rem 0 0.625rem 0 !important;
}

#pageHolder #pageContent .sitemap li ul li {
  padding: 2px 0 !important;
  padding: 0.125rem 0 !important;
}

#pageHolder #pageContent .sitemap li ul li a {
  text-transform: none;
}

#pageHolder #pageContent .sitemap li ul ul {
  margin: 5px 0 !important;
  margin: 0.3125rem 0 !important;
}

#pageHolder #pageContent .sitemap li ul ul li {
  padding: 0 0 0 16px !important;
  padding: 0 0 0 1rem !important;
  position: relative;
}

#pageHolder #pageContent .sitemap li ul ul li:before {
  padding: 0 4px;
  padding: 0 0.25rem;
  -webkit-transition: color 0.3s;
  -moz-transition: color 0.3s;
  -ms-transition: color 0.3s;
  -o-transition: color 0.3s;
  transition: color 0.3s;
  display: block;
  height: 1px !important;
  height: 0.0625rem !important;
  left: 0 !important;
  width: 3px !important;
  width: 0.1875rem !important;
  border-radius: 0 !important;
  top: 10px !important;
  top: 0.625rem !important;
  position: absolute;
  content: "";
}

@media (max-width: 767px) {
  #pageHolder #pageContent .sitemap {
    margin: 15px 0 30px 0;
    flex-wrap: wrap;
  }
  #pageHolder #pageContent .sitemap .column.span_5_of_10 {
    width: 100%;
    flex: 0 0 100%;
  }
}

@media all and (min-width: 768px) and (max-width: 1250px) {
  #pageHolder #pageContent nav.sitemap .span_5_of_10 {
    flex: 0 0 48%;
  }
}

.span_10_of_10 {
  width: 100%;
  flex: 0 0 100%;
}

.span_9_of_10 {
  width: 89.6%;
}

.span_8_of_10 {
  width: 79.2%;
}

.span_7_of_10 {
  width: 68.8%;
}

.span_6_of_10 {
  width: 58.4%;
}

.span_5_of_10 {
  width: 48%;
  flex: 0 0 48%;
}

.span_4_of_10 {
  width: 37.6%;
}

.span_3_of_10 {
  width: 27.2%;
}

.span_2_of_10 {
  width: 16.8%;
}

.span_1_of_10 {
  width: 6.4%;
}

.align-col-left {
  float: left;
}

.align-col-right {
  float: right;
}

#pageHolder #pageContent.fullWidth .flexbox {
  display: flex;
}

#pageHolder #pageContent.fullWidth .flexbox.space_between {
  justify-content: space-between;
}

@media (max-width: 1300px) {
  #pageHolder #pageContent.fullWidth .flexbox {
    flex-wrap: wrap;
  }
  #pageHolder #pageContent.fullWidth .flexbox .span_5_of_10 {
    flex: 0 0 100%;
    width: 100%;
  }
}

#pageHolder #pageContent.fullWidth .eventTime {
  margin: 8px 0 25px 0;
}

#pageHolder #pageContent.fullWidth .openDayDates,
#pageHolder #pageContent.fullWidth .otherEvents {
  display: flex;
  justify-content: space-between;
  margin: 35px 0 25px 0;
  flex-wrap: wrap;
}

#pageHolder #pageContent.fullWidth .openDayDates .openDay,
#pageHolder #pageContent.fullWidth .otherEvents .openDay {
  flex: 0 0 32.3076%;
  padding: 25px 22px 105px 22px;
  text-align: center;
  position: relative;
  margin-bottom: 20px;
}

#pageHolder #pageContent.fullWidth .openDayDates .openDay:after,
#pageHolder #pageContent.fullWidth .otherEvents .openDay:after {
  content: "";
  width: 90px;
  height: 10px;
  position: absolute;
  top: 160px;
  left: 50%;
  transform: translate(-50%, -50%) skew(-35deg);
  -webkit-transform: translate(-50%, -50%) skew(-35deg);
}

#pageHolder #pageContent.fullWidth .openDayDates .openDay .date,
#pageHolder #pageContent.fullWidth .otherEvents .openDay .date {
  padding-bottom: 30px;
}

#pageHolder #pageContent.fullWidth .openDayDates .openDay .date span,
#pageHolder #pageContent.fullWidth .otherEvents .openDay .date span {
  margin-top: 8px;
  display: block;
}

#pageHolder #pageContent.fullWidth .openDayDates .openDay .info,
#pageHolder #pageContent.fullWidth .otherEvents .openDay .info {
  padding: 50px 0 0 0;
}

#pageHolder #pageContent.fullWidth .openDayDates .openDay .name,
#pageHolder #pageContent.fullWidth .otherEvents .openDay .name {
  margin: 7px 0;
  line-height: 1.5;
}

#pageHolder #pageContent.fullWidth .openDayDates .openDay a.more,
#pageHolder #pageContent.fullWidth .otherEvents .openDay a.more {
  position: absolute;
  bottom: 30px;
  left: 50%;
  width: 180px;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
}

#pageHolder #pageContent.fullWidth .otherEvents {
  gap: 1.5385%;
}

#pageHolder #pageContent.fullWidth .otherEvents .openDay {
  flex: 0 0 23.8461%;
  padding: 0;
}

#pageHolder #pageContent.fullWidth .otherEvents .openDay a {
  display: block;
  padding: 25px 22px 70px 22px;
}

#pageHolder #pageContent #accordion.mainDetail,
#pageHolder aside#sidebar #accordion.mainDetail {
  display: block;
  width: 100%;
  margin: 20px 0 35px 0;
  margin: 1.25rem 0 2.1875rem 0;
}

#pageHolder #pageContent #accordion.mainDetail .accordion-title,
#pageHolder aside#sidebar #accordion.mainDetail .accordion-title {
  display: block;
  padding: 16px 80px 16px 0;
  padding: 1rem 5rem 1rem 0;
  position: relative;
  outline: none;
  border-top-width: 1px;
  border-top-style: solid;
  text-transform: uppercase;
  line-height: 1.4;
}

#pageHolder #pageContent #accordion.mainDetail .accordion-title:after,
#pageHolder aside#sidebar #accordion.mainDetail .accordion-title:after {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8.5px 0 8.5px 15px;
  border-color: transparent transparent transparent #018489;
  position: absolute;
  right: 0;
  top: 50%;
  z-index: 2;
  content: "";
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}

#pageHolder #pageContent #accordion.mainDetail .accordion-title:hover,
#pageHolder aside#sidebar #accordion.mainDetail .accordion-title:hover {
  cursor: pointer;
}

#pageHolder #pageContent #accordion.mainDetail .accordion-title.ui-state-active:after,
#pageHolder aside#sidebar #accordion.mainDetail .accordion-title.ui-state-active:after {
  transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  margin-top: -6px;
}

#pageHolder #pageContent #accordion.mainDetail div.ui-accordion-content,
#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content {
  padding: 10px 0 10px 0;
  padding: 0.625rem 0 0.625rem 0;
}

#pageHolder #pageContent #accordion.mainDetail div.ui-accordion-content img,
#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content img {
  max-width: 100%;
}

#pageHolder #pageContent.fullWidth .otherEvents .openDay:hover:after {
  width: 220px;
}

@media (max-width: 767px) {
  #pageHolder #pageContent.fullWidth .flex .eventInfo {
    flex: 0 0 100%;
  }
  #pageHolder #pageContent.fullWidth .flex a.register {
    margin-bottom: 25px;
  }
  #pageHolder #pageContent.fullWidth .openDayDates {
    flex-wrap: wrap;
    gap: 0;
  }
  #pageHolder #pageContent.fullWidth .openDayDates .openDay {
    flex: 0 0 100%;
    margin-bottom: 10px;
  }
  #pageHolder #pageContent.fullWidth .openDayDates .openDay a {
    padding: 25px 22px 65px 22px;
  }
  #pageHolder #pageContent.fullWidth .openDayDates .openDay a.more {
    padding: 0 8px;
    width: 145px;
  }
  #pageHolder #pageContent.fullWidth .otherEvents {
    gap: 0;
    flex-wrap: wrap;
  }
  #pageHolder #pageContent.fullWidth .otherEvents .openDay {
    flex: 0 0 100%;
    margin-bottom: 10px;
  }
  #pageHolder #pageContent.fullWidth .openDayDates .openDay .date,
  #pageHolder #pageContent.fullWidth .otherEvents .openDay .date {
    padding-bottom: 25px;
  }
  #pageHolder #pageContent.fullWidth .openDayDates .openDay .info,
  #pageHolder #pageContent.fullWidth .otherEvents .openDay .info {
    padding: 25px 0 0 0;
  }
  #pageHolder #pageContent.fullWidth .openDayDates .openDay:after,
  #pageHolder #pageContent.fullWidth .otherEvents .openDay:after {
    top: 136px;
  }
  #pageHolder #pageContent.fullWidth .openDayDates,
  #pageHolder #pageContent.fullWidth .otherEvents {
    margin: 20px 0 20px 0;
  }
  #pageHolder #pageContent.fullWidth .otherEvents {
    margin-bottom: 20px;
  }
  #pageHolder #pageContent #accordion.mainDetail .accordion-title {
    padding: 10px 65px 10px 0;
  }
  #pageHolder #pageContent #accordion.mainDetail p {
    margin: 0 0 18px 0;
  }
  #pageHolder #pageContent #accordion.mainDetail div.ui-accordion-content {
    padding: 5px 0;
  }
}

@media all and (min-width: 768px) and (max-width: 1023px) {
  #pageHolder #pageContent.fullWidth .openDayDates .openDay {
    padding: 20px 10px 95px 10px;
  }
  #pageHolder #pageContent.fullWidth .openDayDates .openDay:after {
    top: 115px;
    width: 60px;
  }
  #pageHolder #pageContent.fullWidth .openDayDates .openDay .date {
    padding-bottom: 25px;
  }
  #pageHolder #pageContent.fullWidth .openDayDates .openDay .info {
    padding: 20px 0 0 0;
  }
  #pageHolder #pageContent.fullWidth .openDayDates .openDay a.more {
    padding: 0 8px;
    width: 145px;
  }
  #pageHolder #pageContent.fullWidth .otherEvents {
    gap: 3.125%;
    flex-wrap: wrap;
    margin-bottom: 0;
  }
  #pageHolder #pageContent.fullWidth .otherEvents .openDay {
    flex: 0 0 48.4375%;
    margin-bottom: 20px;
  }
}

#pageHolder #pageContent.fullWidth .videoCarousel {
  width: 100%;
  padding-bottom: 50px;
  overflow: hidden;
}

#pageHolder #pageContent.fullWidth .videoCarousel .item {
  position: relative;
  width: 110%;
}

#pageHolder #pageContent.fullWidth .videoCarousel .item img {
  width: 100%;
}

#pageHolder #pageContent.fullWidth #blockquote .owl-dots,
#pageHolder #pageContent.fullWidth .videoCarousel .owl-dots,
#campusScroller .owl-carousel .owl-dots {
  position: absolute;
  bottom: 4px;
  left: 0;
  height: 20px;
  z-index: 5;
  text-align: center;
  width: 100%;
}

#pageHolder #pageContent.fullWidth #blockquote .owl-dots button,
#pageHolder #pageContent.fullWidth .videoCarousel .owl-dots button,
#campusScroller .owl-carousel .owl-dots button {
  height: 18px;
  width: 18px;
  border-width: 1px;
  border-style: solid;
  margin: 0 7px;
  -webkit-transform: none;
  padding: 0;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  display: inline-block;
}

#pageHolder #pageContent.fullWidth #blockquote {
  flex: 0 0 100%;
  width: 100%;
  display: block;
}

#pageHolder #pageContent.fullWidth .courseListing,
#relatedCourses .recentlyViewed .courseListing {
  display: flex;
  flex-wrap: wrap;
  margin-top: 80px;
}

#pageHolder #pageContent.fullWidth .courseListing .sectionTitle,
#relatedCourses .recentlyViewed .courseListing .sectionTitle {
  flex: 0 0 100%;
  line-height: 1.2;
  margin-bottom: 30px;
}

#pageHolder #pageContent.fullWidth .courseListing .filterWrapper,
#relatedCourses .recentlyViewed .courseListing .filterWrapper {
  height: 50px;
  flex: 0 0 100%;
}

#pageHolder #pageContent.fullWidth .courseListing .courseList,
#relatedCourses .recentlyViewed .courseListing .courseList {
  flex: 0 0 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 40px;
}

#pageHolder #pageContent.fullWidth .courseListing .courseList .course,
#relatedCourses .recentlyViewed .courseListing .courseList .course {
  flex: 0 0 49.2307%;
  margin-bottom: 20px;
}

#pageHolder #pageContent.fullWidth .courseListing .courseList .course,
#relatedCourses .courseListing .courseList .course {
  padding: 25px 25px 100px 25px;
  position: relative;
}

#pageHolder #pageContent.fullWidth .courseListing .courseList .course .title,
#relatedCourses .courseListing .courseList .course .title {
  padding-right: 80px;
  line-height: 1.3;
}

#pageHolder #pageContent.fullWidth .courseListing .courseList .course .icon,
#relatedCourses .courseListing .courseList .course .icon {
  position: absolute;
  right: 25px;
  top: 28px;
}

#pageHolder #pageContent.fullWidth .courseListing .courseList .course .info,
#relatedCourses .courseListing .courseList .course .info {
  margin-top: 40px;
}

#pageHolder #pageContent.fullWidth .courseListing .courseList .course .info .suitable,
#pageHolder #pageContent.fullWidth .courseListing .courseList .course .info .deliveryMode,
#relatedCourses .courseListing .courseList .course .info .suitable,
#relatedCourses .courseListing .courseList .course .info .deliveryMode {
  margin: 10px 0 12px 0;
  line-height: 26px;
}

#pageHolder #pageContent.fullWidth .courseListing .courseList .course .info .suitable .age-range,
#pageHolder #pageContent.fullWidth .courseListing .courseList .course .info .deliveryMode .age-range,
#relatedCourses .courseListing .courseList .course .info .suitable .age-range,
#relatedCourses .courseListing .courseList .course .info .deliveryMode .age-range {
  padding: 0px 6px;
  display: inline-block;
  margin-left: 4px;
}

#pageHolder #pageContent.fullWidth .courseListing .courseList .course .info .collegeList .college,
#relatedCourses .courseListing .courseList .course .info .collegeList .college {
  display: inline-block;
  padding: 5px 7px;
  line-height: 1.2;
  margin: 0 4px 5px 0;
}

#pageHolder #pageContent.fullWidth .courseListing .courseList .course .info .buttons,
#relatedCourses .courseListing .courseList .course .info .buttons {
  position: absolute;
  bottom: 25px;
  left: 25px;
}

#pageHolder #pageContent.fullWidth .courseListing .courseList .course .info .buttons a,
#relatedCourses .courseListing .courseList .course .info .buttons a {
  margin-right: 4px;
}

#relatedCourses .related {
  width: 100%;
  padding-bottom: 50px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
}

#relatedCourses .courseListing {
  margin-top: 0;
  width: 100%;
}

#relatedCourses .courseListing .courseList {
  margin-top: 0;
  width: 100%;
}

#relatedCourses .courseListing .courseList .course {
  width: 100%;
}

#relatedCourses .recentlyViewed {
  margin-top: 50px;
}

#campusScroller {
  clear: both;
  position: relative;
}

#campusScroller:before {
  content: "";
  position: absolute;
  left: 0;
  width: 90px;
  top: 0;
  bottom: 0;
  height: auto;
  z-index: 5;
}

#campusScroller:after {
  height: 150px;
  width: 60%;
  content: "";
  left: -20px;
  bottom: -100px;
  position: absolute;
  transform: rotate(6deg);
  -webkit-transform: rotate(6deg);
  z-index: 5;
}

#campusScroller .campus {
  display: flex;
  flex-wrap: nowrap;
}

#campusScroller .campus .campusInfo,
#campusScroller .campus .campusImage {
  flex: 50%;
}

#campusScroller .campus .campusInfo {
  padding: 60px 0 220px 0;
  display: flex;
  justify-content: flex-end;
}

#campusScroller .campus .campusInfo .contain {
  max-width: 650px;
  padding-right: 140px;
}

#campusScroller .campus .campusInfo .name {
  line-height: 1.5;
}

#campusScroller .campus .campusInfo .intro {
  margin-top: 25px;
  line-height: 1.5;
}

#campusScroller .campus .campusInfo .buttons {
  margin-top: 38px;
}

#campusScroller .campus .campusInfo .buttons a {
  margin-right: 15px;
}

#campusScroller .campus .campusImage {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

#campusScroller .owl-nav {
  position: absolute;
  bottom: 115px;
  z-index: 10;
  left: 50%;
}

#campusScroller .owl-nav .owl-next {
  border: none;
  -webkit-appearance: none;
  background: none;
  padding: 5px;
  margin: 0 0 0 -260px;
}

#campusScroller .owl-nav .owl-prev {
  display: none;
}

#campusScroller .owl-carousel .owl-dots {
  left: auto;
  right: 90px;
  width: auto;
  bottom: 60px;
}

body.course-page #infoScroller.page .scroller.owl-carousel {
  z-index: 6;
}

#relatedCourses .recentlyViewed .courseListing {
  margin-top: 0;
}

#relatedCourses .recentlyViewed .courseListing .courseList {
  margin-top: 0;
}

#pageHolder #pageContent.fullWidth .courseListing .filterWrapper {
  gap: 0 8px;
  margin-top: 0;
}

#pageHolder #pageContent.fullWidth .courseListing .filterWrapper .filterGroup {
  width: auto;
  line-height: 48px;
  height: 48px;
  flex-grow: 1;
}

#pageHolder #pageContent.fullWidth .courseListing .filterWrapper button.more {
  margin-top: 0;
}

#pageHolder #pageContent.fullWidth .courseListing .filterWrapper.apprenticeships .filterGroup {
  flex-grow: 0;
  width: 210px;
}

body.search-interest #pageHolder #pageContent.fullWidth .courseListing {
  margin-top: 50px;
}

body.course-page #pageHolder .pageHolder .flex-carousel {
  width: 100%;
  padding-bottom: 80px;
}

body.course-page #pageHolder .pageHolder .flex-carousel img {
  max-width: 100%;
}

body.course-page #pageHolder .pageHolder .flex-carousel .owl-dots {
  position: absolute;
  bottom: -40px;
  left: 0;
  width: 100%;
  text-align: center;
  height: 20px;
  z-index: 5;
}

body.course-page #pageHolder .pageHolder .flex-carousel .owl-dots button {
  height: 18px;
  width: 18px;
  border-width: 1px;
  border-style: solid;
  margin: 0 7px;
  -webkit-transform: none;
  padding: 0;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  display: inline-block;
}

body.course-page #pageHolder aside#sidebar {
  margin-bottom: 80px;
}

body.course-page #pageHolder aside#sidebar a.apply {
  border: none;
  width: 100%;
  z-index: 5;
  position: relative;
}

body.course-page #pageHolder aside#sidebar a.apply i {
  margin-right: 8px;
}

body.course-page #pageHolder aside#sidebar a.apply.mobile {
  display: none;
}

#pageHolder aside#sidebar #accordion.mainDetail {
  width: 95%;
  width: calc(100% - 30px);
}

#pageHolder aside#sidebar #accordion.mainDetail .accordion-title {
  text-transform: capitalize;
}

#pageHolder aside#sidebar #accordion.mainDetail .accordion-title:after {
  border-color: transparent transparent transparent #fff;
  border-width: 5px 0 5px 10px;
}

#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content .detail {
  display: block;
  line-height: 1.4;
  margin: 7px 0;
}

#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content .detail span {
  display: block;
}

#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content .explain {
  line-height: 1.3;
  margin-bottom: 10px;
}

#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content .explain a {
  text-decoration: underline;
}

#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content .explain a:hover {
  text-decoration: none;
}

#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content a.apply {
  width: 100%;
  position: relative;
  margin-top: 20px;
  border: none;
  line-height: 60px;
}

#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content a.apply i {
  margin-right: 10px;
}

#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content a.apply:after {
  content: "";
  top: 50%;
  right: 20px;
  position: absolute;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8.5px 0 8.5px 15px;
  border-color: transparent transparent transparent #fff;
}

#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content a.apply:hover:after {
  border-color: transparent transparent transparent #D23A81;
}

#pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content img {
  max-width: 100%;
}

#pageHolder aside#sidebar .sidebarBTNS,
#pageHolder #pageContent #mobile-page-content .sidebarBTNS {
  width: 100%;
  margin-top: 20px;
}

#pageHolder aside#sidebar .sidebarBTNS a,
#pageHolder #pageContent #mobile-page-content .sidebarBTNS a {
  display: block;
  margin-bottom: 10px;
  position: relative;
  line-height: 60px;
}

#pageHolder aside#sidebar .sidebarBTNS a i,
#pageHolder #pageContent #mobile-page-content .sidebarBTNS a i {
  margin-right: 10px;
}

#pageHolder aside#sidebar .sidebarBTNS a:after,
#pageHolder #pageContent #mobile-page-content .sidebarBTNS a:after {
  content: "";
  top: 50%;
  right: 20px;
  position: absolute;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8.5px 0 8.5px 15px;
  border-color: transparent transparent transparent #fff;
}

#pageHolder aside#sidebar .sidebarBTNS a.print:hover:after,
#pageHolder #pageContent #mobile-page-content .sidebarBTNS a.print:hover:after {
  border-color: transparent transparent transparent #018489;
}

#pageHolder aside#sidebar .sidebarBTNS a.apply:hover:after,
#pageHolder #pageContent #mobile-page-content .sidebarBTNS a.apply:hover:after {
  border-color: transparent transparent transparent #D23A81;
}

#pageHolder #pageContent #mobile-page-content .sidebarBTNS a.print:hover:after,
#pageHolder #pageContent #mobile-page-content .sidebarBTNS a.apply:hover:after {
  border-color: transparent transparent transparent #fff;
}

#pageHolder aside#sidebar .share,
#pageHolder #pageContent #mobile-page-content .share {
  margin-top: 0px;
}

body.course-page #pageHolder:after {
  display: none;
}

body.course-page #pageHolder .pageHolder {
  padding: 0 0 130px 0;
}

#relatedCourses {
  clear: both;
  padding: 80px 0 200px 0;
}

#relatedCourses .sectionTitle {
  line-height: 1.3;
  margin-bottom: 30px;
}

#pageHolder.mobile {
  display: none;
}

@media (max-width: 767px) {
  #pageHolder #pageContent #blockquote.owl-carousel blockquote {
    margin-bottom: 50px;
  }
  #pageHolder #pageContent.fullWidth .courseListing {
    margin-top: 30px;
  }
  #pageHolder #pageContent.fullWidth .courseListing .courseList {
    margin-top: 0px;
  }
  #pageHolder #pageContent.fullWidth .courseListing .courseList .course {
    margin-top: 10px;
    padding: 22px 20px 70px 20px;
  }
  #pageHolder #pageContent.fullWidth .courseListing .courseList .course .info {
    margin-top: 28px;
  }
  #pageHolder #pageContent.fullWidth .courseListing .courseList .course .info .buttons {
    bottom: 20px;
    left: 20px;
  }
  #pageHolder #pageContent.fullWidth .courseListing .courseList .course .icon {
    right: 20px;
    top: 25px;
  }
  #pageHolder #pageContent.fullWidth .courseListing .courseList button.more {
    margin-top: 20px;
  }
  #pageHolder #pageContent.fullWidth .courseListing .sectionTitle {
    margin-bottom: 20px;
  }
  #pageHolder #pageContent.fullWidth .courseListing .filterWrapper {
    justify-content: space-between;
    gap: 0 0;
  }
  #pageHolder #pageContent.fullWidth .courseListing .filterWrapper button.more {
    width: 49.2142%;
  }
  #pageHolder #pageContent.fullWidth .courseListing .filterWrapper .filterGroup {
    margin-bottom: 8px;
  }
  #pageHolder #pageContent.fullWidth .courseListing .filterWrapper .filterGroup {
    height: 35px;
    line-height: 35px;
  }
  body.search-interest #pageHolder #pageContent.fullWidth .courseListing {
    margin-top: 25px;
  }
  #pageHolder #pageContent #accordion.mainDetail {
    margin: 0px 0 0px 0;
  }
  body.course-page #pageHolder .pageHolder {
    padding: 0 0 20px 0;
  }
  #relatedCourses {
    padding: 25px 0 15px 0;
  }
  #relatedCourses .sectionTitle {
    margin-bottom: 22px;
    padding-left: 50px;
    padding-right: 50px;
  }
  #relatedCourses .related {
    padding-bottom: 30px;
  }
  #relatedCourses .courseListing .courseList .course .info {
    margin-top: 25px;
  }
  #relatedCourses .courseListing .courseList .owl-nav {
    top: -39px;
  }
  #relatedCourses .courseListing .courseList .owl-nav .owl-prev {
    left: 0;
    border-width: 8.5px 15px 8.5px 0;
  }
  #relatedCourses .courseListing .courseList .owl-nav .owl-next {
    right: 0;
    border-width: 8.5px 0 8.5px 15px;
  }
  #relatedCourses .recentlyViewed {
    margin-top: 20px;
  }
  #campusScroller .campus .campusInfo {
    padding: 25px 0 30px 0;
  }
  #campusScroller .campus .campusInfo .contain {
    z-index: 5;
  }
  #campusScroller .campus .campusInfo .intro {
    margin-top: 17px;
  }
  #campusScroller .campus .campusInfo .buttons {
    width: 170px;
    margin-top: 25px;
  }
  #campusScroller .campus .campusInfo .buttons a {
    margin-right: 0;
    margin-bottom: 10px;
  }
  #campusScroller .campus .campusImage {
    height: 250px;
    position: relative;
  }
  #campusScroller .campus .campusImage:after {
    height: 60px;
    width: auto;
    content: "";
    left: -20px;
    right: -20%;
    top: -30px;
    position: absolute;
    transform: rotate(4deg);
    -webkit-transform: rotate(4deg);
    z-index: 2;
  }
  #campusScroller .owl-nav {
    right: 5%;
    bottom: 240px;
    left: auto;
  }
  #campusScroller .owl-nav .owl-next {
    margin: 0;
  }
  #pageHolder #pageContent #mobile-page-content .linkButtons {
    display: block;
  }
  #pageHolder #pageContent #mobile-page-content .linkButtons a {
    width: 100%;
  }
  #pageHolder #pageContent #mobile-page-content #courseSearch .searchElement button.searchBTN {
    float: none;
  }
  #pageHolder.mobile #pageContent #mobile-page-content #courseSearch {
    margin-top: 0px;
    padding: 34px 25px 25px 25px;
  }
  #pageHolder.mobile #pageContent {
    padding-bottom: 90px;
  }
  body.course-page #pageHolder aside#sidebar #accordion.mainDetail {
    width: 100%;
  }
  #pageHolder aside#sidebar #accordion.mainDetail div.ui-accordion-content {
    padding-top: 0;
  }
  #pageHolder aside#sidebar #accordion.mainDetail {
    margin: 10px 0 0px 0;
  }
}

@media all and (min-width: 768px) and (max-width: 1023px) {
  #pageHolder #pageContent.fullWidth .courseListing {
    margin-top: 40px;
  }
  #pageHolder #pageContent.fullWidth .courseListing .courseList .course {
    margin-top: 20px;
  }
  #pageHolder #pageContent.fullWidth .courseListing .courseList .course:first-child {
    margin-top: 0;
  }
  body.courses-listing.noSidebar #pageHolder .pageHolder {
    padding-bottom: 130px;
  }
  body.search-interest #pageHolder #pageContent.fullWidth .courseListing {
    margin-top: 35px;
  }
  body.course-page #pageHolder .pageHolder {
    padding: 0 0 30px 0;
  }
  #relatedCourses {
    padding: 55px 0;
  }
  #relatedCourses .sectionTitle {
    margin-bottom: 22px;
  }
  #relatedCourses .courseListing .courseList .course .info {
    margin-top: 25px;
  }
  #relatedCourses .courseListing .courseList .owl-nav {
    top: -50px;
  }
  #relatedCourses .courseListing .courseList .owl-nav .owl-prev {
    left: 0;
  }
  #relatedCourses .courseListing .courseList .owl-nav .owl-next {
    right: 0;
  }
  #relatedCourses .recentlyViewed {
    margin-top: 30px;
  }
  #pageHolder.mobile #pageContent {
    margin-top: 0;
    padding-top: 10px;
    padding-bottom: 110px;
  }
}

@media (max-width: 1023px) {
  #pageHolder #pageContent.fullWidth .courseListing .courseList .course {
    flex: 0 0 100%;
    margin-bottom: 0;
  }
  body.courses-listing #pageHolder .pageHolder {
    flex-wrap: nowrap;
  }
  #pageHolder aside#sidebar .sidebarBTNS,
  #pageHolder aside#sidebar .share,
  body.course-page #pageHolder #pageContent #mobile-page-content {
    display: none;
  }
  body.course-page #pageHolder.mobile #pageContent #mobile-page-content,
  #pageHolder.mobile,
  body.course-page #pageHolder aside#sidebar a.apply {
    display: block;
  }
  body.course-page #pageHolder aside#sidebar {
    margin-bottom: 0;
  }
  #relatedCourses .sectionTitle {
    text-align: center;
  }
  #relatedCourses .recentlyViewed .courseListing .courseList .course {
    flex: 0 0 100%;
  }
  #pageHolder aside#sidebar #accordion.mainDetail {
    width: 100%;
  }
  #pageHolder.mobile:after {
    display: block !important;
    height: 150px;
    width: auto;
    content: "";
    left: -20px;
    right: -20px;
    bottom: -95px;
    position: absolute;
    transform: rotate(4deg);
    -webkit-transform: rotate(4deg);
  }
}

@media (max-width: 1300px) {
  #campusScroller .campus {
    flex-wrap: wrap;
  }
  #campusScroller .campus .campusInfo,
  #campusScroller .campus .campusImage {
    flex: 100%;
  }
  #pageHolder #pageContent.fullWidth .courseListing .filterWrapper {
    flex-wrap: wrap;
    height: auto;
  }
}

@media all and (min-width: 1300px) and (max-width: 1600px) {
  #campusScroller:after {
    bottom: -110px;
  }
  #campusScroller .campus .campusInfo .contain #campusScroller .campus .campusInfo {
    flex: 0 0 60%;
  }
  #campusScroller .campus .campusImage {
    flex: 0 0 40%;
  }
}

@media all and (min-width: 768px) and (max-width: 1300px) {
  #pageHolder #pageContent.fullWidth .videoCarousel {
    width: 640px;
    margin: 20px auto 0 auto;
  }
  #campusScroller .campus .campusInfo {
    padding: 50px 0 80px 0;
  }
  #campusScroller .campus .campusInfo .contain {
    z-index: 5;
  }
  #campusScroller .campus .campusImage {
    height: 400px;
    position: relative;
  }
  #campusScroller .campus .campusImage:after {
    height: 150px;
    width: auto;
    content: "";
    left: -20px;
    right: -20%;
    top: -100px;
    position: absolute;
    transform: rotate(4deg);
    -webkit-transform: rotate(4deg);
    z-index: 2;
  }
  #campusScroller .owl-nav {
    right: 55px;
    bottom: 400px;
    left: auto;
  }
  #campusScroller .owl-nav .owl-next {
    margin: 0;
  }
  #pageHolder #pageContent.fullWidth .courseListing .filterWrapper {
    gap: 0 2.03495%;
    margin-bottom: 20px;
  }
  #pageHolder #pageContent.fullWidth .courseListing .filterWrapper .filterGroup {
    flex: 0 0 31.9767%;
    margin-bottom: 10px;
  }
  #pageHolder #pageContent.fullWidth .courseListing .filterWrapper button {
    width: 14.9358%;
    margin-bottom: 10px;
  }
  #pageHolder #pageContent.fullWidth .courseListing .courseList {
    margin-top: 0;
  }
}

@media (max-width: 1300px) {
  #campusScroller:before,
  #campusScroller:after {
    display: none;
  }
  #campusScroller .campus .campusInfo .contain {
    max-width: none;
    padding-left: 5%;
    padding-right: 5%;
  }
}

@media all and (min-width: 1024px) and (max-width: 1400px) {
  #relatedCourses .container {
    padding: 0 65px;
  }
}

@media all and (min-width: 1300px) and (max-width: 1600px) {
  #campusScroller .owl-nav .owl-next {
    margin: 0 0 0 -80px;
  }
}

@media all and (min-width: 1300px) and (max-width: 1800px) {
  #campusScroller .campus .campusInfo .contain {
    padding-right: 80px;
  }
}

@media all and (min-width: 1600px) and (max-width: 1800px) {
  #campusScroller .owl-nav .owl-next {
    margin: 0 0 0 -220px;
  }
}
 #pageHolder #pageContent.fullWidth .interestListing ul li .icon {
    font-size: 35px;
    font-size: 2.375rem;
}

#pageHolder aside#sidebar .sidebarBTNS a.apply:hover{border-color: #D23A81 !important;}

.keyboard-navigation .owl-item.active:focus,
.keyboard-navigation .owl-item.active:focus-within{outline: 2px solid black;border:2px solid black}
.keyboard-navigation #sticky-header .owl-nav{display:none !important}

.qlBlock:focus,
.qlBlock:focus-within{outline: 2px solid black;border:2px solid black}
 header#masthead #sticky-header.sectorLinks.keyboard .link a {

transform: skewX(0eg);
    -webkit-transform: skewX(0deg);

}

@media (max-width: 1023px) {
      .keyboard-navigation  header#masthead #sticky-header.sectorLinks {
        display: none !important;
    }
     .keyboard-navigation  header#masthead #sticky-header.sectorLinks.owl-carousel {
        display: none !important;
        top: auto;
    }

  .keyboard-navigation header#masthead #sticky-header.sectorLinks.keyboard {
        display: block !important;   top: auto;
    }
  .keyboard-navigation header#masthead #sticky-header.sectorLinks.keyboard .link a {
transform: skewX(0deg);font-size:12px;
}
 body.page.keyboard-navigation header#masthead #sticky-header.sectorLinks .link a {
    height: 43px;
    opacity: 1;
}
  .keyboard-navigation header#masthead #sticky-header.sectorLinks .link {
    display: block;
    height: 40px;
    flex: 1;
    width: 33%;
    float: left;
    margin-bottom: 5px;
}

}


@media (max-width: 767px) {
    .keyboard-navigation #slider.page {
        margin-top: 190px;
    }
}

}