/* CSS Document 
Client: Capital City College Group
Version: 1.0
Date: 05/07/2021
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: Staff template
14: Search template
15: Sitemap page
16: C4 Global
17: Courses
18: News Page

*/
nav#mainMenu:before, #welcome .row:before,
#collegeList .row:before, #pageHolder #pageContent .advert:before, .vacancyDetails:before, #listingSection:before, #pageContent .pagination:before, nav#mainMenu:after, #welcome .row:after,
#collegeList .row:after, #pageHolder #pageContent .advert:after, .vacancyDetails:after, #listingSection:after, #pageContent .pagination:after {
  content: "";
  display: table;
}

nav#mainMenu:after, #welcome .row:after,
#collegeList .row:after, #pageHolder #pageContent .advert:after, .vacancyDetails:after, #listingSection:after, #pageContent .pagination:after {
  clear: both;
}

.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: #000;
  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: "moderngothicregular", sans-serif;
  background: #fff;
  margin: 0;
  color: #000;
}

/* ==========================================================================
   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,
.searchBox,
#cultureValues a.readMore,
#latestNews .customNavButtons button:hover,
#pageHolder #pageContent .advert a.readMore,
#address .column a.contactBtn,
.courseSearch .holder,
header#masthead .headerMenu ul ul,
header#masthead #scrolled.h-menu ul,
.filterItems,
.categoryList .cat .readMore,
#listingSection .button-group button,
#listingSection #searchFilter {
  background-color: #fff;
}

#latestNews .customNavButtons button {
  background-color: white;
  background-color: rgba(255, 255, 255, 0.8);
}

header#masthead a.accessibility,
#welcome a.readMore,
#cultureValues .column.align_right,

.applyBlock a.apply,
#pageHolder #pageContent ul.staffList li a:hover .itemInfo span.readMore,
#pageContent .pagination a.current,
#pageContent .pagination a:hover,
#pageContent .pagination a:focus,
.additionalCollegeInfo .info a.readMore,
.searchForm .searchBTN,
.courseSearch .holder .searchBlock button.searchBTN,
   .categoryList .cat .readMore:hover {
  background-color: #00001E;color:white;
}

.searchForm .searchBTN,.courseSearch .holder .searchBlock button.searchBTN {
  background-color: #AB64FF !important;color:#00001E !important ;
}

.searchForm .searchBTN:hover,.courseSearch .holder .searchBlock button.searchBTN:hover {
  background-color: #00001E !important;color:white !important;
}

#footerLinks,
#address,
 header#masthead, header#masthead .logoHolder, header#masthead .logoHolder a{background-color:#00001e;}

.b {
  background-color: #86378b;
  background-color: rgba(134, 55, 139, 0.8);
}

#pageHolder #pageContent .advert .overlay,
#welcome .column.quicklinks .ql .overlay,
.categoryList .cat .overlay,
#pageHolder #pageContent ul.newsList figure .overlay,
#pageHolder #pageContent .norm.singular figure .overlay,
#pageHolder #pageContent .featured figure .overlay,
#latestNews .item figure .overlay,
  body.article #pageHolder #rightSidebar .sidebarList figure .overlay {
  background-color: #ab64ff;
  background-color: rgba(171, 100, 255,.9);
}

      #pageTitle:after {
    background-color: #AB64FF;
    background-color: rgba(171, 100, 255, 1);
}
   #pageTitle.white:after {
    background-color: #FFFFFF;
    background-color: rgba(255, 255, 255, 1);
}

nav#mainMenu .sf-menu .sf-mega,
nav#mainMenu .sf-menu .sf-mega:before,
nav#mainMenu .sf-menu .sf-mega:after,
#pageHolder aside#sidebar nav#sideMenu,
body.article #pageHolder #rightSidebar,
    body.article #pageHolder:after {
  background-color: #D9D9D9;
}

#pageHolder #pageContent ul.collegeList .animatedOverlay {
  background-color: #7acaf1;
  background-color: rgba(122, 202, 241, 0.9);
}

.searchBox input.searchInput,
.courseSearch .holder .searchBlock .search,
.courseSearch .holder .column.associates,
#collegeList .column .info,
.courseSearch .holder .column.associates:before,
.courseSearch .holder .column.associates:after,
.filterGroup,
.filterItems,
.searchForm .searchBlock .search,
body.courseDetail #accordion div.ui-accordion-content {
  background-color: #E5E5E5;
}

header#masthead a.accessibility:hover,
#welcome a.readMore:hover,
#cultureValues a.readMore:hover,
footer,
a.mobileMenuBTN #navIcon span,
#pageHolder #pageContent .advert a.readMore:hover,
#pageHolder #pageContent .sitemap li ul ul li:before,
#pageHolder #pageContent ul.staffList .itemInfo span.readMore,
.additionalCollegeInfo .info a.readMore:hover,
.searchForm .searchBTN:hover,
#address .column a.contactBtn:hover,
.courseSearch .holder .searchBlock button.searchBTN:hover,
#listingSection .button-group button:hover,
#listingSection .button-group button.is-checked,
#listingSection .grid .grid-item .tag,
     body.courseDetail #accordion h3 {
  background-color: #00001E;
}

a.mobileMenuBTN #navIcon span{background-color:white}

#collegeList .column:hover .info a.readMore,
#listingSection .grid .grid-item a.button.readMore,
body.courseDetail .mainTitle .rightSide a.readMore,
 body.courseDetail .centralHolder a.readMore {
  background-color: #FFFFFF !important;color:#00001E !important;border: 1px solid #ab64ff !important;
}


#collegeList .column:hover .info a.readMore:hover,
#listingSection .grid .grid-item a.button.readMore:hover,
body.courseDetail .mainTitle .rightSide a.readMore:hover,
 body.courseDetail .centralHolder a.readMore:hover {
  background-color: #00001E !important;color:#ffffff !important;border: 1px solid #00001E !important;
}

.b {
  background-color: black;
  background-color: rgba(0, 0, 0, 0.6);
}

#welcome .column.quicklinks .ql a:hover .overlay,
.categoryList .cat a:hover .overlay {
  background-color: black;
  background-color: rgba(0, 0, 0, 0.9);
}

.b {
  background-color: transparent;
}

#collegeList .column.candi .info a.readMore,
#collegeList .column.candi:hover .image .overlay,
#collegeList .column.candi:hover .info,
#listingSection .grid .grid-item.candi a.button.readMore,
body.courseDetail.candi #accordion h3:before,
body.courseDetail.candi .mainTitle .rightSide a.readMore,
body.courseDetail.candi .centralHolder a.readMore {
  background-color: #CD1719;
}

#collegeList .column.candi .image .overlay,
body.courseDetail.candi #pageTitle:after {
  background-color: #cd1719;
  background-color: rgba(205, 23, 25, 0.9);
}

#collegeList .column.candi:hover .info a.readMore,
#listingSection .grid .grid-item.candi .title,
#listingSection .grid .grid-item.candi .title a,
 body.candi #pageHolder #pageContent .mainTitle h2 {
  color: #00001E;
}

#collegeList .column.wkc .info a.readMore,
#collegeList .column.wkc:hover .image .overlay,
#collegeList .column.wkc:hover .info,
#listingSection .grid .grid-item.wkc a.button.readMore,
body.courseDetail.wkc #accordion h3:before,
body.courseDetail.wkc .mainTitle .rightSide a.readMore,
body.courseDetail.wkc .centralHolder a.readMore {
  background-color: #E6941D;
}

#collegeList .column.wkc .image .overlay,
body.courseDetail.wkc #pageTitle:after {
  background-color: #e6941d;
  background-color: rgba(230, 148, 29, 0.9);
}

#collegeList .column.wkc:hover .info a.readMore,
#listingSection .grid .grid-item.wkc .title,
#listingSection .grid .grid-item.wkc .title a,
body.wkc #pageHolder #pageContent .mainTitle h2 {
  color: #00001E;
}

#collegeList .column.conel .info a.readMore,
#collegeList .column.conel:hover .image .overlay,
#collegeList .column.conel:hover .info,
#listingSection .grid .grid-item.conel a.button.readMore,
body.courseDetail.conel #accordion h3:before,
body.courseDetail.conel .mainTitle .rightSide a.readMore,
body.courseDetail.conel .centralHolder a.readMore {
  background-color: #959A00;
}

#collegeList .column.conel .image .overlay,
body.courseDetail.conel #pageTitle:after {
  background-color: #959a00;
  background-color: rgba(149, 154, 0, 0.9);
}

#collegeList .column.conel .info a.readMore {
  color: #000;
}


#listingSection .grid .grid-item.conel .title,
#listingSection .grid .grid-item.conel .title a,
body.conel #pageHolder #pageContent .mainTitle h2 {
  color: #00001E;
}

#collegeList .column.ccc-training .info a.readMore,
#collegeList .column.ccc-training:hover .image .overlay,
#collegeList .column.ccc-training:hover .info,
#listingSection .grid .grid-item.ccc-training a.button.readMore,
body.courseDetail.ccc-training #accordion h3:before,
body.courseDetail.ccc-training .mainTitle .rightSide a.readMore,
body.courseDetail.ccc-training .centralHolder a.readMore {
  background-color: #35AEC4;
}

#collegeList .column.ccc-training .image .overlay,
body.courseDetail.ccc-training #pageTitle:after {
  background-color: #35aec4;
  background-color: rgba(53, 174, 196, 0.9);
}

#collegeList .column.ccc-training:hover .info a.readMore,
#listingSection .grid .grid-item.ccc-training .title,
#listingSection .grid .grid-item.ccc-training .title a,
body.ccc-trianing #pageHolder #pageContent .mainTitle h2 {
  color: #00001E;
}

#collegeList .column.visionnaires .info a.readMore,
#collegeList .column.visionnaires:hover .image .overlay,
#collegeList .column.visionnaires:hover .info,
#listingSection .grid .grid-item.visionnaires a.button.readMore,
body.courseDetail.visionnaires #accordion h3:before,
body.courseDetail.visionnaires .mainTitle .rightSide a.readMore,
body.courseDetail.visionnaires .centralHolder a.readMore {
  background-color: #2E317D;
}

#collegeList .column.visionnaires .image .overlay,
body.courseDetail.visionnaires #pageTitle:after {
  background-color: #2e317d;
  background-color: rgba(46, 49, 125, 0.9);
}

#collegeList .column.visionnaires:hover .info a.readMore,
#listingSection .grid .grid-item.visionnaires .title,
#listingSection .grid .grid-item.visionnaires .title a,
body.visionnaires #pageHolder #pageContent .mainTitle h2 {
  color: #2E317D;
}

#collegeList .column.places-spaces .info a.readMore,
#collegeList .column.places-spaces:hover .image .overlay,
#collegeList .column.places-spaces:hover .info,
#listingSection .grid .grid-item.places-spaces a.button.readMore,
body.courseDetail.places-spaces #accordion h3:before,
body.courseDetail.places-spaces .mainTitle .rightSide a.readMore,
body.courseDetail.places-spaces .centralHolder a.readMore {
  background-color: #837647;
}

#collegeList .column.places-spaces .image .overlay,
body.courseDetail.places-spaces #pageTitle:after {
  background-color: #837647;
  background-color: rgba(131, 118, 71, 0.9);
}

#collegeList .column.places-spaces:hover .info a.readMore,
#listingSection .grid .grid-item.places-spaces .title,
#listingSection .grid .grid-item.places-spaces .title a,
body.places-spaces #pageHolder #pageContent .mainTitle h2 {
  color:#00001E;
}



#collegeList .column.vincentrooms .info a.readMore,
#collegeList .column.vincentrooms:hover .image .overlay,
#collegeList .column.vincentrooms:hover .info,
#listingSection .grid .grid-item.vincentrooms a.button.readMore,
body.courseDetail.vincentrooms #accordion h3:before,
body.courseDetail.vincentrooms .mainTitle .rightSide a.readMore,
body.courseDetail.vincentrooms .centralHolder a.readMore {
  background-color: #d1b067;
}
#collegeList .column.vincentrooms:hover .info a.readMore,
#collegeList .column.vincentrooms .info a.readMore {
  color: #3d3935;
}
#collegeList .column.vincentrooms .image .overlay,
body.courseDetail.vincentrooms #pageTitle:after {
  background-color: #d1b067;
  background-color: rgba(209, 176, 103, 0.9);
}


#listingSection .grid .grid-item.vincentrooms .title,
#listingSection .grid .grid-item.vincentrooms .title a,
body.vincentrooms #pageHolder #pageContent .mainTitle h2 {
  color: #d1b067;
}




#collegeList .column.founders .info a.readMore,
#collegeList .column.founders:hover .image .overlay,
#collegeList .column.founders:hover .info,
#listingSection .grid .grid-item.founders a.button.readMore,
body.courseDetail.founders #accordion h3:before,
body.courseDetail.founders .mainTitle .rightSide a.readMore,
body.courseDetail.founders .centralHolder a.readMore {
  background-color: #56C271;
}

#collegeList .column.founders .image .overlay,
body.courseDetail.founders #pageTitle:after {
  background-color: #56c271;
  background-color: rgba(86, 194, 113, 0.9);
}

#collegeList .column.founders .info a.readMore {
  color: #000;
}

#listingSection .grid .grid-item.founders .title,
#listingSection .grid .grid-item.founders .title a,
body.founders #pageHolder #pageContent .mainTitle h2 {
  color: #56C271;
}

#collegeList .column:hover .info a.readMore {
  background-color: #fff !important;
}

#slider .sliderText .slide .bannerText .title,
header#masthead a.accessibility,
#welcome a.readMore,
#cultureValues .column.content,
#cultureValues a.readMore:hover,
#footerLinks a,
footer,
footer a,
#pageTitle h1,
#pageTitle h5,
#pageHolder #pageContent .advert .advertText,
#pageHolder #pageContent .advert a.readMore:hover,
.applyBlock a.apply,
#pageHolder #pageContent ul.staffList .itemInfo span.readMore,
#pageContent .pagination a.current,
#pageContent .pagination a:hover,
#pageContent .pagination a:focus,
.additionalCollegeInfo .info a.readMore,
.searchForm .searchBTN,
#address,
#address a,
#address .column a.contactBtn:hover,
#welcome .column.quicklinks .ql .title,
.courseSearch .holder .searchBlock button.searchBTN,
#collegeList .column .info a.readMore,
#collegeList .column:hover .info a.readMore:hover,
#collegeList .column:hover .info .excerpt,
.categoryList .cat .catName,
.categoryList .cat .readMore:hover,

#latestNews .item figure .overlay span,
body.article #pageHolder #rightSidebar .sidebarList figure .overlay span,
#listingSection .button-group button:hover,
#listingSection .button-group button.is-checked,
#listingSection .grid .grid-item .tag,
#listingSection .grid .grid-item a.button.readMore:hover,
#listingSection .grid .grid-item a.button.readMore,
body.courseDetail #accordion h3:after,
body.courseDetail #pageHolder #pageContent #accordion h3,
body.courseDetail .centralHolder a,
 body.courseDetail .mainTitle .rightSide a.readMore {
  color: #fff;
}
#pageHolder #pageContent figure .overlay span,
body.article #pageHolder #rightSidebar .sidebarList figure .overlay span,
#latestNews .item figure .overlay span{color:#00001E;}



body.courseDetail .mainTitle .rightSide a.readMore:hover,
body.courseDetail .centralHolder a.readMore:hover,
#listingSection .grid .grid-item.conel a.button.readMore:hover,
#listingSection .grid .grid-item.founders a.button.readMore:hover {
  color: #fff !important;
}

header#masthead .socialSearch a,
nav#mainMenu ul li a,
.searchBox a.closeBTN:hover,
#welcome h1,
#welcome .column.content p a,
#cultureValues a.readMore,
#latestNews a.seeAll:hover,
#latestNews .customNavButtons button:hover,
#pageHolder #pageContent h3,
#pageHolder #pageContent .advert a.readMore,
#pageHolder #pageContent .breadcrumb a,
.vacancyDetails .sectionTitle,
#pageHolder #pageContent p a,
#pageHolder #pageContent blockquote,
#address .column a.contactBtn,
.courseSearch .holder .column .sectionTitle,
header#masthead .headerMenu ul li a:hover,
header#masthead .headerMenu ul li:hover > a,
.searchForm .advanced a:hover,
     .categoryList .cat .readMore {
  color: #00001E;
}

 #footerLinks .socials a:hover {
  color:#ab64ff !important;
}

nav#mainMenu ul li a.active,
nav#mainMenu ul li a:hover,
nav#mainMenu ul li a:focus,
nav#mainMenu ul li:hover > a,
header#masthead .socialSearch a:hover,
nav#mainMenu ul li .sf-mega li a,
.searchBox a.closeBTN,
#latestNews .item a,
#pageHolder #pageContent .breadcrumb a.current,
#pageHolder #pageContent .breadcrumb a:hover,
#pageHolder #pageContent .breadcrumb afocus,
#pageHolder #pageContent .sitemap li a,
#pageHolder #pageContent ul.staffList .itemInfo,
#pageContent .pagination a,
#pageHolder #pageContent blockquote cite,
#pageHolder #pageContent ul.collegeList .collegeName,
#pageHolder #pageContent ul.collegeList .readMore,
#latestNews a.seeAll,
header#masthead .headerMenu ul li a,
header#masthead .headerMenu ul li ul li a:hover,
#pageHolder aside#sidebar ul li a,
.searchForm .advanced a,
#pageHolder #pageContent ul.newsList .info,
#pageHolder #pageContent .norm.singular .info,
#pageHolder #pageContent .featured .info,
body.article #pageHolder #rightSidebar .sidebarList .info,
#listingSection .button-group button,
#listingSection .grid .grid-item.conel a.button.readMore,
#listingSection .grid .grid-item.founders a.button.readMore,
body.courseDetail.conel .centralHolder a,
body.courseDetail.conel .mainTitle .rightSide a.readMore,
body.courseDetail.founders .centralHolder a,
body.courseDetail.founders .mainTitle .rightSide a.readMore {
  color: #00001E;
}

 #listingSection .grid .grid-item .tag {
  border-color:#00001E;
}

@media (max-width: 767px) {
  .b {
    background-color: transparent;
  }
}

header#masthead a.searchBTN.desktop,
nav#mainMenu ul li a,
#latestNews a.seeAll,
#collegeList .column .info .excerpt,
.searchForm .advanced a,
#footerLinks .socials a {
  -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 a.accessibility,
#welcome a.readMore,
.applyBlock a.apply,
#pageHolder #pageContent ul.staffList .itemInfo span.readMore,
.additionalCollegeInfo .info a.readMore,
.searchForm .searchBTN,
#welcome .column.quicklinks .ql .overlay,
.courseSearch .holder .searchBlock button.searchBTN,
#collegeList .column .info a.readMore,
#collegeList .column .image .overlay,
#collegeList .column .info {
  -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;
}

#pageHolder #pageContent ul.collegeList .collegeName,
#pageHolder #pageContent ul.collegeList .readMore,
body.article #pageHolder #rightSidebar .sidebarList .overlay,
body.article #pageHolder #rightSidebar .sidebarList .overlay span {
  -webkit-transition: opacity, 0.3s ease-in-out;
  -moz-transition: opacity, 0.3s ease-in-out;
  -ms-transition: opacity, 0.3s ease-in-out;
  -o-transition: opacity, 0.3s ease-in-out;
  transition: opacity, 0.3s ease-in-out;
}

#latestNews .item figure .overlay,
nav#mainMenu,
header#masthead .socialSearch,
#latestNews .customNavButtons button,
a.mobileMenuBTN #navIcon span,
#pageHolder #pageContent .advert a.readMore,
#pageHolder #pageContent ul.staffList figure img,
#address .column a.contactBtn,
#listingSection .button-group button,
#listingSection .grid .grid-item a.button.readMore,
body.courseDetail .mainTitle .rightSide a.readMore,
body.courseDetail .centralHolder a.readMore {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

header#masthead,
header#masthead .logoHolder,
header#masthead .logoHolder a,
#pageHolder #pageContent ul.collegeList .animatedOverlay,
.categoryList .cat .overlay,
.categoryList .cat .catName,
.categoryList .cat .readMore,
#pageHolder #pageContent figure .overlay,
#pageContent .pagination a,
body.courseDetail #accordion h3: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;
}

 body {
  margin: 0;overflow-x: hidden;
}

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

article, aside, details, figcaption, figure, footer, header#masthead, 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;
}

   
.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;
  }
  .container.wide {
    max-width: none;
    padding: 0 50px;
  }
}

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

h2, h3, h4, h5, h6 {
  margin: 10px 0 15px 0;
  margin: 0.625rem 0 0.9375rem 0;
  padding-top: 0;
  line-height: 1.2;
}

@font-face {
  font-family: 'greycliffregular';
  src: url("../font/Greycliff-reg/Greycliff-Regular.eot");
  src: url("../font/Greycliff-reg/Greycliff-Regular.eot?#iefix") format("embedded-opentype"), url("../font/Greycliff-reg/Greycliff-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;  font-display: swap;
}

@font-face {
  font-family: 'greycliffbold';
  src: url("../font/Greycliff-bold/Greycliff-Bold.eot");
  src: url("../font/Greycliff-bold/Greycliff-Bold.eot?#iefix") format("embedded-opentype"), url("../font/Greycliff-bold/Greycliff-Bold.woff") format("woff");
  font-weight: normal;
  font-style: normal;  font-display: swap;
}


@font-face {
  font-family: 'moderngothicregular';
  src: url("../font/ModernGothic/ModernGothic-Regular.otf");
url("../font/ModernGothic/ModernGothic-Regular.woff2") format("woff");
  font-weight: normal;
  font-style: normal;  font-display: swap;
}
@font-face {
  font-family: 'moderngothicitalic';
  src: url("../font/ModernGothic/ModernGothic-Italic.otf");
url("../font/ModernGothic/ModernGothic-Italic.woff2") format("woff");
  font-weight: normal;
  font-style: italic;  font-display: swap;
}
@font-face {
  font-family: 'moderngothicbold';
  src: url("../font/ModernGothic/ModernGothic-Bold.otf");
url("../font/ModernGothic/ModernGothic-Bold.woff2") format("woff");
  font-weight: 700;
  font-style: normal;  font-display: swap;
}
@font-face {
  font-family: 'moderngothicbolditalic';
  src: url("../font/ModernGothic/ModernGothic-BoldItalic.otf");
url("../font/ModernGothic/ModernGothic-BoldItalic.woff2") format("woff");
  font-weight: 700;
  font-style: italic;  font-display: swap;
}


@font-face {
  font-family: 'moderngothicmedium';
  src: url("../font/ModernGothic/ModernGothic-Medium.otf");
url("../font/ModernGothic/ModernGothic-Medium.woff2") format("woff");
  font-weight: 500;
  font-style: normal;  font-display: swap;
}
@font-face {
  font-family: 'moderngothicmediumitalic';
  src: url("../font/ModernGothic/ModernGothic-MediumItalic.otf");
url("../font/ModernGothic/ModernGothic-MediumItalic.woff2") format("woff");
  font-weight: 500;
  font-style: italic;  font-display: swap;
}

#slider .sliderText .slide .bannerText .title,
header#masthead a.accessibility,
nav#mainMenu ul li a,
#welcome h1,
a.readMore,
span.readMore,
#latestNews .sectionTitle,
#latestNews .item .itemInfo .date,
#latestNews a.seeAll,
#footerLinks,
#mm-0 .mm-listview > li > a,
.mm-navbar .mm-title,
#pageTitle h1,
#pageTitle h5,
#pageHolder #pageContent h2,
#pageHolder #pageContent h3,
#pageHolder #pageContent h4,
#pageHolder #pageContent h5,
#pageHolder #pageContent h6,
#pageHolder #pageContent .advert .advertText,
#pageHolder #pageContent blockquote cite,
#pageHolder #pageContent .sitemap li a,
#pageHolder #pageContent ul.staffList .itemInfo .title,
#pageContent .pagination a,
#pageHolder #pageContent blockquote,
#pageHolder #pageContent ul.collegeList .collegeName,
#pageHolder #pageContent ul.collegeList .readMore,
.filterGroup .filterName,
.jobList .vacancy .title,
.searchBTN,
.additionalCollegeInfo .addresses div span,
#pageHolder #pageContent p.bold,
.applyBlock div span,
#address .sectionHeading,
#address .column a.contactBtn,
#welcome .column.quicklinks .ql .title,
.courseSearch .holder .column .sectionTitle,
header#masthead .headerMenu ul li a,
header#masthead #scrolled.h-menu span.activator,
#pageHolder aside#sidebar .sectionHeader span,
.searchForm .advanced a,
.categoryList .cat .catName,
#pageHolder #pageContent ul.newsList .info span.date,
#pageHolder #pageContent .norm.singular .info span.date,
#pageHolder #pageContent .featured .info span.date,
#pageHolder #pageContent figure .overlay span,
#latestNews .item figure .overlay span,
body.article #pageHolder #rightSidebar .sidebarTitle,
.articleDate,
body.article #pageHolder #rightSidebar .sidebarList figure .overlay span,
body.article #pageHolder #rightSidebar .sidebarList .info .date,
#listingSection #searchFilter .title,
#listingSection .button-group button,
.grid .grid-item .title,
#listingSection .grid .grid-item .tag,
body.courseDetail .initialInfo .row.info span.infoTitle {
  font-family: 'moderngothicbold', sans-serif;
}

nav#mainMenu ul li .sf-mega li a,
#pageHolder #pageContent .sitemap li ul li a,
header#masthead .headerMenu ul li ul li a {
  font-family: 'moderngothicregular', sans-serif;
}

header#masthead #scrolled.h-menu span.activator i {
  font-size: 12px;
  font-size: 0.75rem;
}

body,
.filterGroup,
.courseSearch .holder .searchBlock input.searchInput,
footer,
.searchForm .advanced {
  font-size: 14px;
  font-size: 0.875rem;
}

nav#mainMenu ul li ul li a,
#welcome,
#pageHolder #pageContent h5,
#pageHolder #pageContent h6,
#pageHolder,
#pageHolder #pageContent .sitemap li ul li a,
#pageHolder #pageContent ul.staffList .itemInfo,
#pageHolder #pageContent blockquote cite,
#latestNews .item .itemInfo .date,
#address .column a.contactBtn,
body.courseDetail #pageHolder #pageContent #accordion h3 {
  font-size: 16px;
  font-size: 1rem;
}

nav#mainMenu ul li a,
header#masthead .socialSearch a,
.searchBox button.searchBTN,
.mm-search .searchButton:before,
#footerLinks .socials a {
  font-size: 18px;
  font-size: 1.125rem;
}

header#masthead .socialSearch a.twitter,
#latestNews a.seeAll,
#footerLinks .contained .socials a,
#associations .assocItems .owl-nav button,
#associationsUpper .assocItems .owl-nav button,
#pageHolder #pageContent blockquote,
#listingSection #searchFilter .title {
  font-size: 20px;
  font-size: 1.25rem;
}

#latestNews .item .itemInfo .title,
#pageHolder #pageContent h4,
#pageHolder #pageContent ul.staffList .itemInfo .name,
#pageHolder #pageContent ul.collegeList .collegeName,
#pageHolder #pageContent ul.collegeList .readMore,
#address .sectionHeading,
#welcome .column.quicklinks .ql .title,
.courseSearch .holder .column .sectionTitle,
.categoryList .cat .catName,
#pageHolder #pageContent ul.newsList .info .title,
#pageHolder #pageContent .norm.singular .info .title,
#pageHolder #pageContent .featured .info .title,
body.article #pageHolder #rightSidebar .sidebarTitle,
body.article #pageHolder #rightSidebar .sidebarList .info .title {
  font-size: 24px;
  font-size: 1.5rem;
}

#pageHolder #pageContent h3,
#pageHolder #pageContent figure .overlay span,
#latestNews .item figure .overlay span,
body.article #pageHolder #rightSidebar .sidebarList figure .overlay span,
.grid .grid-item .title {
  font-size: 30px;
  font-size: 1.875rem;
}

#pageHolder #pageContent h2,
#pageHolder #pageContent .sitemap li a {
  font-size: 40px;
  font-size: 2.5rem;
}

#welcome h1,
#latestNews .sectionTitle,
#pageHolder #pageContent .advert .advertText {
  font-size: 50px;
  font-size: 3.125rem;
}

#slider .sliderText .slide .bannerText .title {
  font-size: 60px;
  font-size: 3.75rem;
}

.b {
  font-size: 65px;
  font-size: 4.0625rem;
}

 #pageTitle h5, #pageTitle h1 {
  font-size: 48px;
  font-size: 3rem;
}

#pageHolder #pageContent blockquote .speechMarks {
  font-size: 90px;
  font-size: 5.625rem;
}

@media (max-width: 767px) {
  #welcome,
  footer,
  #pageHolder #pageContent .breadcrumb a,
  #pageHolder #pageContent h5,
  #pageHolder #pageContent h6,
  #pageHolder,
  body.courseDetail #pageHolder #pageContent #accordion h3 {
    font-size: 14px;
    font-size: 0.875rem;
  }
  #whyAreWeHere .contained .question .info,
  #pageHolder #pageContent ul.collegeList .collegeName,
  .courseSearch .holder .column .sectionTitle {
    font-size: 16px;
    font-size: 1rem;
  }
  #pageHolder #pageContent blockquote {
    font-size: 18px;
    font-size: 1.125rem;
  }
  #slider .sliderText .slide .bannerText .title,
  #pageHolder #pageContent h4,
  .categoryList .cat .catName,
  #address .column .sectionHeading,
  #pageHolder #pageContent figure .overlay span,
  #latestNews .item figure .overlay span,
  body.article #pageHolder #rightSidebar .sidebarList figure .overlay span {
    font-size: 20px;
    font-size: 1.25rem;
  }
  #pageHolder #pageContent .advert .advertText,
  #pageHolder #pageContent h3 {
    font-size: 25px;
    font-size: 1.5625rem;
  }
  #welcome h1,
  #pageTitle h1,  #pageTitle h5,
  #pageHolder #pageContent h2,
  #latestNews .sectionTitle,
  #pageHolder #pageContent .sitemap li a {
    font-size: 30px;
    font-size: 1.875rem;
  }
}

@media all and (min-width: 768px) and (max-width: 1023px) {
  #slider .sliderText .slide .bannerText .title {
    font-size: 30px;
    font-size: 1.875rem;
  }
  #pageHolder #pageContent .advert .advertText {
    font-size: 40px;
    font-size: 2.5rem;
  }
  #pageTitle h1,#pageTitle h5 {
    font-size: 50px;
    font-size: 3.125rem;
  }
}

@media all and (min-width: 768px) and (max-width: 1249px) {
  #welcome h1 {
    font-size: 40px;
    font-size: 2.5rem;
  }
}

@media all and (min-width: 1024px) and (max-width: 1300px) {
  #slider .sliderText .slide .bannerText .title {
    font-size: 45px;
    font-size: 2.8125rem;
  }
}

@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 cccg-logo {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.8);
  }
}

@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: relative;
  width: 100%;
  height: 140px;
  height: 8.75rem;
  z-index: 9000;
}

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

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

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

header#masthead .logoHolder,
header#masthead .logoHolder a {
  width: 241px;
  width: 15.0625rem;
  height: 70px;
  height: 4.375rem;
}

header#masthead .headerMenu {
  position: absolute;
  right: 250px;
  right: 15.625rem;
  top: 7px;
  top: 0.4375rem;
  z-index: 3000;
}

header#masthead .headerMenu ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

header#masthead .headerMenu ul li {
  float: left;
  position: relative;
  margin-right: 25px;
  margin-right: 1.5625rem;
}

header#masthead .headerMenu ul li a {
  display: block;
  padding: 10px 0;
  padding: 0.625rem 0;
}

header#masthead .headerMenu ul li a:hover,
  header#masthead .headerMenu ul li:hover > a {
  text-decoration: underline;
}

header#masthead .headerMenu ul ul {
  display: none;
  position: absolute;
  right: 0;
  top: 35px;
  top: 2.1875rem;
  width: 240px;
  width: 15rem;
  padding: 10px 12px;
  padding: 0.625rem 0.75rem;
  box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2);
}

header#masthead .headerMenu ul ul li {
  display: block;
  text-align: right;
  width: 100%;
  margin: 0;
}

header#masthead .headerMenu ul ul li a {
  display: block;
  padding: 3px 0;
  padding: 0.1875rem 0;
  line-height: 1.3;
}

header#masthead #scrolled.h-menu {
  position: absolute;
  right: 29px;
  right: 1.8125rem;
  top: 11px;
  top: 0.6875rem;
  display: none;
  opacity: 0;
}

header#masthead #scrolled.h-menu span.activator {
  display: block;
  width: 60px;
  width: 3.75rem;
  padding: 10px 0;
  padding: 0.625rem 0;
}

header#masthead #scrolled.h-menu span.activator i {
  float: right;
  margin-top: 3px;
  margin-top: 0.1875rem;
}

header#masthead #scrolled.h-menu ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  display: none;
  position: absolute;
  right: 0;
  top: 35px;
  top: 2.1875rem;
  opacity: 1;
  width: 240px;
  width: 15rem;
  padding: 10px 0;
  padding: 0.625rem 0;
  box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2);
}

header#masthead #scrolled.h-menu ul li {
  display: block;
  text-align: right;
  width: 100%;
  margin: 0;
  padding: 0 12px;
  padding: 0 0.75rem;
}

header#masthead #scrolled.h-menu ul li.has-sub > a {
  padding: 3px 20px 3px 0;
  padding: 0.1875rem 1.25rem 0.1875rem 0;
}

header#masthead #scrolled.h-menu ul li.has-sub.open .holder:after {
  content: "\f106";
}

header#masthead #scrolled.h-menu ul li a {
  display: block;
  padding: 3px 0;
  padding: 0.1875rem 0;
  line-height: 1.3;
}

header#masthead #scrolled.h-menu ul li ul {
  box-shadow: none;
  top: auto;
  width: 100%;
  padding: 0;
  position: relative;
  display: none;
}

header#masthead #scrolled.h-menu ul li ul li {
  padding: 0;
}

header#masthead #scrolled.h-menu ul li .holder {
  width: 30px;
  width: 1.875rem;
  height: 0;
  right: 3px;
  right: 0.1875rem;
  position: absolute;
  top: 0;
  top: 0;
  height: 100%;
}

header#masthead #scrolled.h-menu ul li .holder:after {
  display: block;
  position: absolute;
  text-align: center;
  width: 100%;
  height: 12px;
  height: 0.75rem;
  padding: 0;
  padding: 0;
  z-index: 10;
  content: "\f107";
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  top: 7px;
  top: 0.4375rem;
}

header#masthead #scrolled.h-menu ul li .holder:hover {
  cursor: pointer;
}

header#masthead #scrolled.h-menu.open > ul {
  display: block;
  opacity: 1;
}

header#masthead a.accessibility {
  position: absolute;
  top: 0;
  right: 50px;
  right: 3.125rem;
  line-height: 45px;
  line-height: 2.8125rem;
  padding: 0 16px;
  padding: 0 1rem;
  display: block;
  border-radius: 0px 0px 10px 10px;
  -webkit-border-radius: 0px 0px 10px 10px;
}

header#masthead .socialSearch {
  float: right;
  position: relative;
  margin: 86px 0 0 0;
  margin: 5.375rem 0 0 0;
}

header#masthead .socialSearch a {
  float: left;
  line-height: 40px;
  line-height: 2.5rem;
}

 header#masthead .socialSearch a.twitter {
  margin-left: 19px;
  margin-left: 0.7875rem;
}

header#masthead .socialSearch a.searchBTN.desktop,
header#masthead .socialSearch a.searchBTN.mobile {
  width: 34px;
  width: 2.125rem;
  text-align: right;
}

header#masthead .socialSearch a.searchBTN.mobile {
  display: none;
}

@media (max-width: 767px) {
  header#masthead {
    height: 128px;
    height: 8rem;
  }
  header#masthead .logoHolder,
  header#masthead .logoHolder a {
    width: 138px;
    width: 8.625rem;
    height: 40px;
    height: 2.5rem;
  }
  header#masthead .logoHolder {
    top: 65px;
    top: 4.0625rem;
  }
  header#masthead .logoHolder a {
    background-repeat: no-repeat;
  }
}


@media (max-width: 767px) {
  header#masthead a.accessibility {
    right: auto !important;
    left: 5%;
  }
  header#masthead .socialSearch {
    margin: 3px 0 0 0;
    margin: 0.1875rem 0 0 0;
  }
  header#masthead .socialSearch a.mobileMenuBTN {
    position: absolute;
    right: 0;
    top: 62px;
    top: 3.875rem;
  }
  header#masthead .socialSearch a.twitter {
    margin-left: 14px;
    margin-left: 0.875rem;
  }
  header#masthead .socialSearch a.searchBTN.mobile {
    width: 30px;
    width: 1.875rem;
  }
  header#masthead .headerMenu {
    right: 5%;
    top: 58px;
    top: 3.625rem;
    margin-right: 45px;
    margin-right: 2.8125rem;
  }
  header#masthead #scrolled.h-menu {
    right: 5%;
  }
}

@media (min-width: 768px) {
  header#masthead .logoHolder a {
    background-repeat: no-repeat;
  }
}

@media (min-width: 768px) and (min--moz-device-pixel-ratio: 2), (min-width: 768px) and (-o-min-device-pixel-ratio: 2 / 1), (min-width: 768px) and (-webkit-min-device-pixel-ratio: 2), (min-width: 768px) and (min-device-pixel-ratio: 2), (min-width: 768px) and (min-resolution: 192dpi), (min-width: 768px) and (min-resolution: 2dppx) {
 

}

@media all and (min-width: 768px) and (max-width: 1023px) {
  header#masthead .headerMenu {
    margin-right: 235px;
    margin-right: 14.6875rem;
    right: 0;
  }
  header#masthead #scrolled.h-menu {
    top: 0;
  }
}

@media (max-width: 1023px) {
  header#masthead .headerMenu ul {
    display: none;
  }
  header#masthead .headerMenu #scrolled.h-menu {
    display: block;
    opacity: 1;color:white;
  }
}

@media (max-width: 1198px) {
  header#masthead .socialSearch a.searchBTN.desktop {
    display: none;
  }
  header#masthead .socialSearch a.searchBTN.mobile {
    display: block;
  }
}

@media (min-width: 1024px) {
  header#masthead {
    position: fixed;
    top: 0;
    left: 0;
  }
  body.fixedHeader header#masthead {
    height: 70px;
    height: 4.375rem;
    -webkit-box-shadow: 0px 10px 10px -8px rgba(0, 0, 0, 0.38);
    -moz-box-shadow: 0px 10px 10px -8px rgba(0, 0, 0, 0.38);
    box-shadow: 0px 10px 10px -8px rgba(0, 0, 0, 0.38);
  }
  body.fixedHeader header#masthead .logoHolder {
    top: 15px;
    top: 0.9375rem;
  }
  body.fixedHeader header#masthead .logoHolder,
  body.fixedHeader header#masthead .logoHolder a {
    width: 120px;
    width: 7.5rem;
    height: 35px;
    height: 2.1875rem;
  }
}

@media (min-width: 1024px) and (min--moz-device-pixel-ratio: 2), (min-width: 1024px) and (-o-min-device-pixel-ratio: 2 / 1), (min-width: 1024px) and (-webkit-min-device-pixel-ratio: 2), (min-width: 1024px) and (min-device-pixel-ratio: 2), (min-width: 1024px) and (min-resolution: 192dpi), (min-width: 1024px) and (min-resolution: 2dppx) {
  
 
}

@media (min-width: 1024px) {
  body.fixedHeader header#masthead .socialSearch {
    margin: 15px 315px 0 0;
    margin: 0.9375rem 19.6875rem 0 0;
  }
  body.fixedHeader header#masthead .headerMenu ul {
    display: none;
    opacity: 0;
  }
  body.fixedHeader header#masthead .headerMenu #scrolled.h-menu {
    display: block;
    opacity: 1;
  }
}

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

@media all and (min-width: 1024px) and (max-width: 1400px) {
  header#masthead .headerMenu {
    right: 5%;
    margin-right: 195px;
    margin-right: 12.1875rem;
  }
}

@media (max-width: 1450px) {
  header#masthead .socialSearch a.searchBTN.desktop {
    display: none;
  }
  header#masthead .socialSearch a.searchBTN.mobile {
    display: block;
  }
}

nav#mainMenu {
  float: right;
  margin: 68px 40px 0 0;
  margin: 4.25rem 2.5rem 0 0;
}

nav#mainMenu ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  width: 100%;
  display: block;
}

nav#mainMenu ul li {
  display: block;
  float: left;
  padding: 0 2px;
  padding: 0 0.125rem;
}

nav#mainMenu ul li:hover > a {
  text-decoration: underline;
}

nav#mainMenu ul li:last-child {
  padding: 0;
}

nav#mainMenu ul li:last-child a {
  padding: 30px 0 30px 18px;
  padding: 1.875rem 0 1.875rem 1.125rem;
}

nav#mainMenu ul li a {
  display: block;
  padding: 30px 18px;
  padding: 1.875rem 0.725rem;
  letter-spacing: normal;
  position: relative;
}

nav#mainMenu ul li a.active, nav#mainMenu ul li a:focus, nav#mainMenu ul li a:hover {
  text-decoration: underline;
}

nav#mainMenu .sf-mega .colFour,
nav#mainMenu .sf-mega .colThree,
nav#mainMenu .sf-mega .colFive {
  float: left;
  width: 25%;
  position: relative;
  min-height: 200px;
  min-height: 12.5rem;
}

nav#mainMenu .sf-mega .colFive {
  width: 20%;
  float: left;
}

nav#mainMenu .sf-mega .colThree {
  width: 33.3333%;
  float: left;
}

nav#mainMenu .sf-menu .sf-mega {
  position: absolute;
  display: none;
  top: 140px;
  top: 8.75rem;
  left: 0;
  z-index: 300;
  padding: 0 50px;
  padding: 0 3.125rem;
  width: 100%;
  line-height: 1.4;
}

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

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

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

nav#mainMenu .sf-mega .colFour,
nav#mainMenu .sf-mega .colFive {
  overflow: hidden;
}

nav#mainMenu .sf-mega .colFour.subMenu,
nav#mainMenu .sf-mega .colFive.subMenu {
  padding: 30px 30px 30px 0;
  padding: 1.875rem 1.875rem 1.875rem 0;
}

nav#mainMenu .sf-mega .colFour ul,
nav#mainMenu .sf-mega .colFive ul {
  display: block;
  float: left;
}

nav#mainMenu .sf-mega .colFour li,
nav#mainMenu .sf-mega .colFive li {
  display: block;
  height: auto;
  width: 100%;
  float: left;
  padding: 5px 0;
  padding: 0.3125rem 0;
}

nav#mainMenu .sf-mega .colFour li a,
nav#mainMenu .sf-mega .colFive li a {
  padding: 8px 0;
  padding: 0.5rem 0;
}

nav#mainMenu .sf-mega .colFour li:last-child,
nav#mainMenu .sf-mega .colFive li:last-child {
  padding: 5px 0;
  padding: 0.3125rem 0;
}

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

a.mobileMenuBTN {
  display: none;
  margin: 0 0 0 20px;
  margin: 0 0 0 1.25rem;
  padding: 9px 0;
  padding: 0.5625rem 0;
  height: 36px;
  height: 2.25rem;
  outline: none;
}

a.mobileMenuBTN span {
  display: block;
  float: left;
  margin-right: 15px;
  margin-right: 0.9375rem;
  line-height: 27px;
  line-height: 1.6875rem;
}

a.mobileMenuBTN #navIcon {
  width: 32px;
  width: 2rem;
  height: 28px;
  height: 1.75rem;
  position: relative;
  cursor: pointer;
  float: left;
}

a.mobileMenuBTN #navIcon span {
  display: block;
  position: absolute;
  height: 4px;
  height: 0.25rem;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  background-clip: padding-box;
  behavior: url(PIE.htc);
  width: 100%;
  opacity: 1;
  left: 0;
}

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

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

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

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

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

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

.mm-search .searchButton {
  position: absolute;
  right: 0;
  right: 0;
  top: 0;
  top: 0;
  width: 40px;
  width: 2.5rem;
  height: 45px;
  height: 2.8125rem;
  border: none;
  -webkit-appearance: none;
  padding: 0;
  z-index: 10;
}

.mm-search .searchButton:before {
  width: 40px;
  width: 2.5rem;
  height: 45px;
  height: 2.8125rem;
  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: 45px;
  line-height: 2.8125rem;
}

.mm-search .searchButton:hover {
  cursor: pointer;
}

.mm-search input {
  border: none;
  color: #000;
}

.mm-search input::-webkit-input-placeholder {
  color: #000;
  opacity: 1;
}

.mm-search input:moz-placeholder {
  color: #000;
  opacity: 1;
}

.mm-search input::-moz-placeholder {
  color: #000;
  opacity: 1;
}

.mm-search input:-ms-input-placeholder {
  color: #000;
  opacity: 1;
}

@media (min-width: 1024px) {
  body.fixedHeader nav#mainMenu {
    margin: -2px 30px 0 0;
    margin: -0.125rem 1.875rem 0 0;
  }
  body.fixedHeader nav#mainMenu > ul > li {
    padding: 0;
  }
  body.fixedHeader nav#mainMenu > ul > li a {
    padding: 30px 14px;
    padding: 1.875rem 0.675rem;
  }
  body.fixedHeader nav#mainMenu > ul > li:last-child a {
    padding: 30px 0 30px 14px;
    padding: 1.875rem 0 1.875rem 0.875rem;
  }
  body.fixedHeader nav#mainMenu .sf-menu .sf-mega {
    top: 90px;
    top: 6rem;
  }
}

@media (max-width: 1450px) {
  nav#mainMenu ul {
    display: none;
  }
  a.mobileMenuBTN {
    display: block;
  }
}

@media all and (min-width: 1199px) and (max-width: 1300px) {
  nav#mainMenu ul li {
    padding: 0 2px;
    padding: 0 0.125rem;
  }
}

footer#siteFooter {
  float: left;
  width: 100%;
  padding: 20px 0;
  padding: 1.25rem 0;
}

footer#siteFooter .contained {
  float: left;
  width: 100%;
  padding: 0 16%;
}

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

footer#siteFooter .fLeft {
  float: left;
}

footer#siteFooter .fCenter {
  position: absolute;
  left: 50%;
  width: 46%;
  margin-left: -23%;
  text-align: center;
}

footer#siteFooter .fRight {
  float: right;
}

@media (max-width: 767px) {
  footer#siteFooter .contained {
    padding: 0 5%;
  }
}

@media all and (min-width: 768px) and (max-width: 1850px) {
  footer#siteFooter .contained {
    padding: 0 8%;
  }
}

@media (max-width: 1400px) {
  footer#siteFooter .fLeft,
  footer#siteFooter .fCenter,
  footer#siteFooter .fRight {
    width: 100%;
    text-align: center;
    line-height: 1.5;
  }
  footer#siteFooter .fCenter {
    position: relative;
    float: left;
    left: auto;
    margin-left: 0;
  }
  footer#siteFooter .fLeft,
  footer#siteFooter .fCenter {
    margin-bottom: 12px;
    margin-bottom: 0.75rem;
  }
}

a.readMore,
span.readMore {
  line-height: 40px;
  line-height: 2.5rem;
  padding: 0 17px;
  padding: 0 1.0625rem;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  background-clip: padding-box;
  behavior: url(PIE.htc);
  display: block;
}

#slider {
  position: relative;
  float: left;
  width: 100%;
  height: 100vh;
  height: calc(100vh - 140px);
  margin-top: 140px;
  margin-top: 8.75rem;
  overflow: hidden;
}

#slider .container {
  height: 100vh;
  height: calc(100vh - 140px);
}

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

#slider .sliderImages button.slick-prev,
#slider .sliderImages button.slick-next {
  position: absolute;
  z-index: 20;
  height: 50px;
  width: 50px;
  margin-top: -25px;
  margin-top: -1.5625rem;
  top: 50%;
  border: none;
  font-size: 0;
  outline: none;
  background: rgba(0, 0, 0, 0.1);
  -webkit-appearance: none;
}

#slider .sliderImages button.slick-prev:before,
#slider .sliderImages button.slick-next:before {
  font-family: "Font Awesome 5 Free";
  font-weight: 700;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 50px;
  line-height: 3.125rem;
  text-align: center;
}

#slider .sliderImages button.slick-prev:hover,
#slider .sliderImages button.slick-next:hover {
  background: rgba(255, 255, 255, 0.8);
}

#slider .sliderImages button.slick-prev {
  left: 0;
  left: 0;
}

#slider .sliderImages button.slick-prev:before {
  content: "\f053";
}

#slider .sliderImages button.slick-next {
  right: 0;
  right: 0;
}

#slider .sliderImages button.slick-next:before {
  content: "\f054";
}

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

#slider .overlay {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg, black 0%, rgba(255, 255, 255, 0) 100%);
  background: -webkit-linear-gradient(90deg, black 0%, rgba(255, 255, 255, 0) 100%);
}

#slider .slick-list,
#slider .slick-track {
  height: 100%;
}

#slider .sliderText {
  position: absolute;
  top: 0;
  left: 230px;
  left: 14.375rem;
  right: 230px;
  right: 14.375rem;
  width: auto;
  z-index: 200;
  height: 100%;
}

#slider .sliderText .slide .bannerText {
  bottom: 40%;
  bottom: 40%;
  width: 100%;
  text-align: center;
  left: 0;
  position: absolute;
  z-index: 200;
  transform: translateY(2rem);
  -webkit-transform: translateY(2rem);
  animation: fade-in-move-down 1s;
  -webkit-animation: fade-in-move-down 1s;
  opacity: 0;
}

#slider .sliderText .slide .bannerText .title {
  line-height: 1.18;
  float: left;
  width: 100%;
}

#slider .sliderText .slide .bannerText .subTitle {
  line-height: 1.5;
  float: left;
  width: 90%;
}

#slider .slick-slide.slick-active .bannerText {
  transform: translateY(0);
  -webkit-transform: translateY(0);
  opacity: 1;
  transition-duration: 1s;
  -webkit-transition-duration: 1s;
}

#slider ul.slick-dots {
  margin: 0;
  padding: 0;
  list-style-type: none;
  position: absolute;
  left: 0;
  width: 100%;
  bottom: 32%;
  bottom: 32%;
  text-align: center;
}

#slider ul.slick-dots li {
  display: inline-block;
  margin: 0 15px;
  margin: 0 0.9375rem;
}

#slider ul.slick-dots li button {
  border: 0;
  padding: 0;
  margin: 0;
  -webkit-appearance: none;
  text-indent: -999em;
  width: 100px;
  width: 6.25rem;
  height: 8px;
  height: 0.5rem;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
  background-clip: padding-box;
  behavior: url(PIE.htc);
  outline: none;
  opacity: 0.4;
}

#slider ul.slick-dots li.slick-active button {
  opacity: 1;
}

#slider .cccg-logo {
  position: absolute;
  top: 50%;
  width: 398px;
  width: 24.875rem;
  height: 774px;
  height: 48.375rem;
  margin-top: -387px;
  margin-top: -24.1875rem;
  z-index: 100;
  right: -30px;
  right: -1.875rem;
  opacity: 0.5;
  animation: cccg-logo 2s ease-in-out infinite alternate;
}

#slider .cccg-logo img {
  width: 398px;
  width: 24.875rem;
  height: 774px;
  height: 48.375rem;
}

html.tablet.landscape body.home #slider,
html.tablet.landscape body.home #slider .container,
html.mobile.landscape body.home #slider,
html.mobile.landscape body.home #slider .container {
  min-height: 70vh;
}

.courseSearch {
  float: left;
  width: 100%;
  height: 150px;
  height: 9.375rem;
  position: relative;
  margin-top: -150px;
  margin-top: -9.375rem;
  z-index: 2000;
}

.courseSearch .holder {
  float: left;
  width: 100%;
  border-radius: 20px 20px 0px 0px;
  -webkit-border-radius: 20px 20px 0px 0px;
  height: 150px;
  height: 9.375rem;
}

.courseSearch .holder .column {
  width: 50%;
  float: left;
}

.courseSearch .holder .column.associates {
  float: right;
  height: 150px;
  height: 9.375rem;
  text-align: center;
  -webkit-border-radius: 0px 20px 0px 0px;
}

.courseSearch .holder .column.searchArea {
  padding: 30px 40px;
  padding: 1.875rem 2.5rem;
}

.courseSearch .holder .searchBlock {
  float: left;
  width: 100%;
  position: relative;
  margin-top: 20px;
  margin-top: 1.25rem;
}

.courseSearch .holder .searchBlock .search {
  position: absolute;
  top: 0;
  height: 40px;
  height: 2.5rem;
  width: auto;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  background-clip: padding-box;
  behavior: url(PIE.htc);
  overflow: hidden;
}

.courseSearch .holder .searchBlock .search.keyword {
  left: 0;
  right: 358px;
  right: 22.375rem;
}

.courseSearch .holder .searchBlock .search.postcode {
  left: 324px;
  left: 20.25rem;
  right: 90px;
  right: 5.625rem;
}

       .courseSearch .holder .searchBlock input.searchInput {
  position: absolute;
  top: 0;
  left: 0;
  left: 0;
  width: 92%;
  width: calc(100% - 30px);
  height: 20px;
  height: 1.25rem;
  padding: 8px 15px 9px 15px;
  padding: 0.5rem 0.9375rem 0.5625rem 0.9375rem;
  box-sizing: content-box;
  border: none;
  color: #000;
  font-family: 'moderngothicbold', sans-serif;
  font-size: 14px;
  -webkit-appearance: none;
  outline: none;
  background: none;
  z-index: 10;
}

.courseSearch .holder .searchBlock input.searchInput::-webkit-input-placeholder {
  color: #000;
  opacity: 1;
  font-family: 'moderngothicbold', sans-serif;
  font-size: 14px;
}

.courseSearch .holder .searchBlock input.searchInput:moz-placeholder {
  color: #000;
  opacity: 1;
  font-family: 'moderngothicbold', sans-serif;
  font-size: 14px;
}

    .courseSearch .holder .searchBlock input.searchInput::-moz-placeholder {
  color: #000;
  opacity: 1;
  font-family: 'moderngothicbold', sans-serif;
  font-size: 14px;
}

.courseSearch .holder .searchBlock input.searchInput:-ms-input-placeholder {
  color: #000;
  opacity: 1;
  font-family: 'moderngothicbold', sans-serif;
  font-size: `4px;
}

.courseSearch .holder .searchBlock button.searchBTN {
  position: absolute;
  right: 0;
  right: 0;
  top: 0;
  top: 0;
  width: 80px;
  width: 5rem;
  height: 40px;
  height: 2.5rem;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  background-clip: padding-box;
  behavior: url(PIE.htc);
  border: none !important;
  -webkit-appearance: none;
  padding: 0;
}

.courseSearch .holder .item {
  display: inline-block;
  position: relative;
  height: 80px;
  height: 5rem;
  margin: 35px 15px 0 15px;
  margin: 2.1875rem 0.9375rem 0 0.9375rem;
}

.courseSearch .holder .item img {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

#welcome,
#collegeList {
  float: left;
  width: 100%;
  position: relative;
}

#welcome .row,
#collegeList .row {
  width: 100%;
  position: relative;
}

#welcome h1,
#collegeList h1 {
  margin: 0 0 40px 0;
  margin: 0 0 2.5rem 0;
}

#welcome p,
#collegeList p {
  line-height: 1.5;
}

#welcome p a:hover,
#collegeList p a:hover {
  text-decoration: underline;
}

#welcome a.readMore,
#collegeList a.readMore {
  display: inline-block;
  margin-top: 35px;
  margin-top: 2.1875rem;
}

.column.span_5_of_10 {
  width: 50%;
  float: left;
  position: relative;
}

#welcome {
  padding: 120px 0;
  padding: 7.5rem 0;
}

#welcome .column {
  min-height: inherit;
}

#welcome .column.content {
  text-align: left;
  padding: 0 100px 0 0;
  padding: 0 6.25rem 0 0;
}

#welcome .column.content a.readMore {
  margin: 15px 15px 0 0;
  margin: 0.9375rem 0.9375rem 0 0;
}

#welcome .column.quicklinks {
  float: right;
  margin-top: 12px;
  margin-top: 0.75rem;
}

#welcome .column.quicklinks .ql {
  float: left;
  position: relative;
  width: 48.4375%;
  background-size: cover;
  background-position: center center;
  margin-top: 20px;
  margin-top: 1.25rem;
}

#welcome .column.quicklinks .ql a {
  display: block;
  height: 150px;
  height: 9.375rem;
}

#welcome .column.quicklinks .ql .overlay {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

#welcome .column.quicklinks .ql .title {
  display: block;
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
  padding: 0 20px;
  padding: 0 1.25rem;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
}

#welcome .column.quicklinks .ql:nth-child(2), #welcome .column.quicklinks .ql:nth-child(4) {
  margin-left: 3.125%;
}

#welcome .cccg-logo {
  position: absolute;
  top: 50%;
  width: auto;
  height: 100%;
  z-index: 100;
  right: 0px;

  opacity: 1;
  z-index: -1;
  transform: translateY(-50%) scale(1);
  -webkit-transform: translateY(-50%) scale(1);
  background-position: center right;
}

#welcome .cccg-logo img {
  float: right;
  width: auto;
  height: 100%;
  height: 100%;
}

#welcome:hover .cccg-logo {
  transform: translateY(-50%) scale(1.3);
  -webkit-transform: translateY(-50%) scale(1.3);
}

#collegeList .verticalSplit {
  float: left;
  width: 50%;
}

#collegeList .column {
  width: 100%;
  float: left;
  height: 300px;
  height: 19.75rem;
}

   #collegeList .column .image,
#collegeList .column .info {
  width: 50%;
  position: relative;
  height: 330px;

}

#collegeList .column .image.fullwidth,
#collegeList .column .info.fullwidth {
  width: 100%;
}

#collegeList .column .align_left {
  float: left;
}

#collegeList .column .align_right {
  float: right;
}

#collegeList .column .image {
  background-size: cover;
  background-position: center center;
}

#collegeList .column .image .logo {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 5;
  transform: translate(-50%, -50%);
}

#collegeList .column .image .logo img {
  background-size: 100% 100%;
  max-width: 100%;
  height: auto;
}

#collegeList .column .image .overlay {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

#collegeList .column .info {
  z-index: 10;
  padding: 45px 50px 130px 50px;
  padding: 2.8125rem 3.125rem 8.125rem 3.125rem;
}

#collegeList .column .info .excerpt {
  line-height: 1.6;
}

#collegeList .column .info .links {
  position: absolute;
  bottom: 48px;
  bottom: 3rem;
  left: 50px;
  left: 3.125rem;
}

#collegeList .column .info .links a {
  margin: 0 12px 0 0;
  margin: 0 0.75rem 0 0;
}

#collegeList .column.align_right {
  float: right;
}

#collegeList .column.candi .image .logo {
  width: 235px;
  width: 14.6875rem;
  height: 100px;
  height: 6.25rem;
}

#collegeList .column.wkc .image .logo {
  width: 132px;
  width: 8.25rem;
  height: 100px;
  height: 6.25rem;
}

#collegeList .column.conel .image .logo {
  width: 250px;
  width: 15.625rem;
  height: 100px;
  height: 6.25rem;
}

#collegeList .column.ccc-training .image .logo {
  width: 311px;
  width: 19.4375rem;
  height: 80px;
  height: 5rem;
}

#collegeList .column.visionnaires .image .logo {
  width: 268px;
  width: 16.75rem;
  height: 80px;
  height: 5rem;
}

#collegeList .column.places-spaces .image .logo {
  width: 298px;
  width: 18.625rem;
  height: 60px;
  height: 3.75rem;
}
#collegeList .column.vincentrooms .image .logo {
  width: 295px;

  height: 100px;

}

#collegeList .column.founders .image .logo {
  width: 259px;
  width: 16.1875rem;
  height: 80px;
  height: 5rem;
}

#latestNews {
  float: left;
  width: 100%;
  padding: 95px 0 70px 0;
  padding: 5.9375rem 0 4.375rem 0;
  position: relative;
}

#latestNews a.seeAll {
  float: right;
  margin-top: 25px;
  margin-top: 1.5625rem;
}

#latestNews a.seeAll:hover {
  text-decoration: underline;
}

#latestNews .specialContainer {
  position: relative;
  left: 50%;
  width: 82%;
  width: calc(100% - 50% + 650px);
  margin-left: -650px;
  margin-left: -40.625rem;
  z-index: 10;
  overflow: hidden;
}

#latestNews .specialContainer .holder {
  float: left;
  width: 100%;
  width: calc(100% - 160px);
}

#latestNews .owl-carousel {
  margin-top: 40px;
  margin-top: 2.5rem;
  float: left;
  width: 100%;
}

#latestNews .owl-carousel .owl-stage-outer {
  overflow: visible;
  width: 100%;
  float: left;
  z-index: 10;
}

#latestNews .sectionTitle {
  float: left;
}

#latestNews a.seeAll {
  float: right;
}

#latestNews .customNavButtons {
  position: absolute;
  top: 340px;
  top: 21.25rem;
  left: 50%;
  margin-left: -650px;
  margin-left: -40.625rem;
  right: 110px;
  right: 6.875rem;
  width: auto;
  height: 40px;
  height: 2.5rem;
}

#latestNews .customNavButtons button {
  height: 40px;
  width: 40px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  border-radius: 10px;
  background-clip: padding-box;
  behavior: url(PIE.htc);
  position: absolute;
  top: 0;
  text-align: center;
  border: none !important;
  -webkit-appearance: none;
  padding: 0;
  z-index: 50;
  outline: none;
}

#latestNews .customNavButtons button i {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 40px;
  width: 2.5rem;
  line-height: 40px;
  line-height: 2.5rem;
}

#latestNews .customNavButtons button.customPrevBtn {
  left: -20px;
  left: -1.25rem;
}

#latestNews .customNavButtons button.customNextBtn {
  right: -20px;
  right: -1.25rem;
}

#latestNews .item {
  float: left;
  width: 100%;
  position: relative;
}

#latestNews .item a {
  display: block;
  float: left;
  width: 100%;
}

#latestNews .item a:hover figure .overlay {
  opacity: 1;
}

#latestNews .item figure {
  margin: 0;
  z-index: 1;
  overflow: hidden;
  height: 325px;
  height: 20.3125rem;
  position: relative;
  background-position: center;
  background-size: cover;
}

#latestNews .item figure .overlay {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  opacity: 0;
}

#latestNews .item figure .overlay span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  padding: 0;
}

#latestNews .item .itemInfo {
  float: left;
  width: 100%;
  padding: 35px 0 70px 0;
  padding: 2.1875rem 0 4.375rem 0;
  line-height: 1.2;
  z-index: 2;
  overflow: hidden;
}

#latestNews .item .itemInfo .title {
  margin: 20px 0 0 0;
  margin: 1.25rem 0 0 0;
}

#latestNews .item .itemInfo span.readMore {
  position: absolute;
  bottom: 0;
  bottom: 0;
  left: 0;
  left: 0;
}

#address {
  float: left;
  width: 100%;
  padding: 40px 0 15px 0;
  padding: 2.5rem 0 0.9375rem 0;
}

#address .column {
  line-height: 1.6;
  width: 33.333%;
  padding-right: 40px;
  padding-right: 2.5rem;
  float: left;
}

#address .column .sectionHeading {
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
}

#address .column a.contactBtn {
  display: block;
  float: left;
  padding: 0 15px;
  padding: 0 0.9375rem;
  line-height: 40px;
  line-height: 2.5rem;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  background-clip: padding-box;
  behavior: url(PIE.htc);
  margin-top: 18px;
  margin-top: 1.125rem;
}

#address .column a.contactBtn:hover {
  text-decoration: none;
}

#address .column.group a {
  display: block;
  position: relative;
  padding: 1px 0 3px 0;
  padding: 0.0625rem 0 0.1875rem 0;
}

#address .column.quicklinks {
  padding-right: 0;
}

#address .col {
  float: left;
}

#address .col a {
  display: block;
  position: relative;
  padding: 1px 0 3px 0;
  padding: 0.0625rem 0 0.1875rem 0;
}

 #address a:hover {
  text-decoration: underline;color:#ab64ff !important;
}

#footerLinks {
  float: left;
  width: 100%;
  padding: 30px 0;
  padding: 1.875rem 0;
}

#footerLinks a {
  display: block;
  float: left;
}

#footerLinks .links {
  float: left;
}

#footerLinks .links a {
  margin-left: 30px;
  margin-left: 1.875rem;
}

  #footerLinks .links a:hover {
  text-decoration: underline; color:#ab64ff !important;
}

#footerLinks .links a:first-child {
  margin-left: 0;
}

#footerLinks .socials {
  float: right;
}

#footerLinks .socials a {
  margin-left: 25px;
  margin-left: 1.5625rem;
}

#associations {
  float: left;
  width: 100%;
  padding: 30px 0;
  padding: 1.875rem 0;
}

#associations .contained {
  float: left;
  width: 100%;
  padding: 0 16%;
}

#associations .assocItems {
  margin: 0;
  padding: 0;
  list-style-type: none;
  width: 100%;
  width: calc(100% + 48px);
  margin-left: -22px;
  margin-left: -1.375rem;
  position: relative;
}

#associations .assocItems .owl-item {
  text-align: center;
}

#associations .assocItems .item {
  position: relative;
  display: block;
  height: 100px;
  height: 6.25rem;
}

#associations .assocItems .item img {
  width: auto;
  margin-left: auto;
  margin-right: auto;
  max-width: 90%;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}

#associations .assocItems .owl-nav {
  position: absolute;
  left: 0;
  width: 100%;
  top: 50%;
  height: 40px;
  height: 2.5rem;
  margin-top: -20px;
  margin-top: -1.25rem;
}

#associations .assocItems .owl-nav button {
  position: absolute;
  top: 0;
  height: 40px;
  width: 40px;
  border-radius: 0;
  border: none;
  -webkit-appearance: none;
  outline: none;
  z-index: 2;
  background: none;
}

#associations .assocItems .owl-nav button.owl-prev {
  left: 35px;
  left: 2.1875rem;
}

#associations .assocItems .owl-nav button.owl-next {
  right: 35px;
  right: 2.1875rem;
}

#associations .assocItems .owl-nav button:before {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  text-align: center;
  line-height: 40px;
  line-height: 2.5rem;
}

#associations .assocItems .owl-nav button.owl-prev {
  left: -110px;
  left: -6.875rem;
  top: 0;
}

#associations .assocItems .owl-nav button.owl-prev:before {
  content: "\f053";
}

#associations .assocItems .owl-nav button.owl-next {
  right: -110px;
  right: -6.875rem;
}

#associations .assocItems .owl-nav button.owl-next:before {
  content: "\f054";
}

@media (max-width: 479px) {
  #associations .assocItems .item {
    width: 100% !important;
    text-align: center;
    margin: 0 !important;
    display: inline-block !important;
  }
  #associations .assocItems .item img {
    display: inline-block;
  }
}



#associationsUpper {
  float: left;
  width: 100%;
  padding: 30px 0;
  padding: 1.875rem 0;
}

#associationsUpper .contained {
  float: left;
  width: 100%;
  padding: 0 16%;
}

#associationsUpper .assocItems {
  margin: 0;
  padding: 0;
  list-style-type: none;
  width: 100%;
  width: calc(100% + 48px);
  margin-left: -22px;
  margin-left: -1.375rem;
  position: relative;
}

#associationsUpper .assocItems .owl-item {
  text-align: center;
}

#associationsUpper .assocItems .item {
  position: relative;
  display: block;
  height: 100px;
  height: 6.25rem;
}

#associationsUpper .assocItems .item img {
  width: auto;
  margin-left: auto;
  margin-right: auto;
  max-width: 90%;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}

#associationsUpper .assocItems .owl-nav {
  position: absolute;
  left: 0;
  width: 100%;
  top: 50%;
  height: 40px;
  height: 2.5rem;
  margin-top: -20px;
  margin-top: -1.25rem;
}

#associationsUpper .assocItems .owl-nav button {
  position: absolute;
  top: 0;
  height: 40px;
  width: 40px;
  border-radius: 0;
  border: none;
  -webkit-appearance: none;
  outline: none;
  z-index: 2;
  background: none;
}

#associationsUpper .assocItems .owl-nav button.owl-prev {
  left: 35px;
  left: 2.1875rem;
}

#associationsUpper .assocItems .owl-nav button.owl-next {
  right: 35px;
  right: 2.1875rem;
}

#associationsUpper .assocItems .owl-nav button:before {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  text-align: center;
  line-height: 40px;
  line-height: 2.5rem;
}

#associationsUpper .assocItems .owl-nav button.owl-prev {
  left: -110px;
  left: -6.875rem;
  top: 0;
}

#associationsUpper .assocItems .owl-nav button.owl-prev:before {
  content: "\f053";
}

#associationsUpper .assocItems .owl-nav button.owl-next {
  right: -110px;
  right: -6.875rem;
}

#associationsUpper .assocItems .owl-nav button.owl-next:before {
  content: "\f054";
}

@media (max-width: 479px) {
  #associationsUpper .assocItems .item {
    width: 100% !important;
    text-align: center;
    margin: 0 !important;
    display: inline-block !important;
  }
  #associationsUpper .assocItems .item img {
    display: inline-block;
  }
}


@media (max-width: 767px) {
  body.home #slider,
  body.home #slider .container {
    height: 260px;
    height: 16.25rem;
    min-height: 0;
  }
  body.home #slider ul.slick-dots,
  body.home #slider .container ul.slick-dots {
    bottom: 85px;
    bottom: 5.3125rem;
  }
  body.home #slider ul.slick-dots li,
  body.home #slider .container ul.slick-dots li {
    margin: 0 9px;
    margin: 0 0.5625rem;
  }
  body.home #slider ul.slick-dots li button,
  body.home #slider .container ul.slick-dots li button {
    width: 20px;
    width: 1.25rem;
  }
  body.home #slider .sliderText .slide .bannerText,
  body.home #slider .container .sliderText .slide .bannerText {
    bottom: 120px;
    bottom: 7.5rem;
  }
  body.home #slider .sliderText,
  body.home #slider .container .sliderText {
    left: 10%;
    right: 10%;
  }
  #slider .cccg-logo {
    width: 134px;
    width: 8.375rem;
    height: 260px;
    height: 16.25rem;
    right: -14px;
    right: -0.875rem;
    margin-top: -130px;
    margin-top: -8.125rem;
  }
  #slider .cccg-logo img {
    width: 134px;
    width: 8.375rem;
    height: 260px;
    height: 16.25rem;
  }
  #welcome .column.image,
  #cultureValues .column.image {
    height: 280px;
    height: 17.5rem;
  }
  .courseSearch {
    height: auto;
    margin-top: -50px;
    margin-top: -3.125rem;
  }
  .courseSearch .container {
    padding: 0;
  }
  .courseSearch .holder {
    height: auto;
    background-color: transparent;
  }
  .courseSearch .holder .column {
    width: 100%;
  }
  .courseSearch .holder .column .sectionTitle {
    padding: 0 15px;
    padding: 0 0.9375rem;
    text-align: center;
  }
  .courseSearch .holder .column.searchArea {
    width: 90%;
    margin-left: 5%;
    background-color: #fff;
    border-radius: 20px 20px 0 0;
    -webkit-border-radius: 20px 20px 0 0;
    padding: 12px 15px 19px 15px;
    padding: 0.75rem 0.9375rem 1.1875rem 0.9375rem;
    line-height: 1.4;
  }
  .courseSearch .holder .column.associates {
    height: auto;
    padding: 2px 0 22px 0;
    padding: 0.125rem 0 1.375rem 0;
  }
  .courseSearch .holder .item {
    margin: 22px 13px 0 13px;
    margin: 1.375rem 0.8125rem 0 0.8125rem;
  }
  .courseSearch .holder .searchBlock {
    height: 90px;
    height: 5.625rem;
  }
  .courseSearch .holder .searchBlock .search.keyword {
    right: 0;
  }
  .courseSearch .holder .searchBlock .search.postcode {
    left: 0;
    top: auto;
    bottom: 0;
    right: 90px;
    right: 5.625rem;
  }
  .courseSearch .holder .searchBlock button.searchBTN {
    top: auto;
    bottom: 0;
  }
  #welcome {
    padding: 40px 0;
    padding: 2.5rem 0;
  }
  #welcome .cccg-logo {
    width: 202px;
    width: 12.625rem;
    height: 390px;
    height: 24.375rem;
    transform: none;
    top: 0;
    margin-top: 0;
  }
  #welcome:hover .cccg-logo {
    transform: none;
  }
  #welcome .column.content {
    padding: 0;
  }
  #welcome .column.content h1 {
    margin: 0 0 20px 0;
    margin: 0 0 1.25rem 0;
  }
  #welcome .column.content a.readMore {
    margin-top: 10px;
    margin-top: 0.625rem;
  }
  #welcome .column.quicklinks {
    padding-right: 0;
    margin-top: 25px;
    margin-top: 1.5625rem;
  }
  #welcome .column.quicklinks .ql {
    width: 100%;
    margin: 10px 0 0 0 !important;
    margin: 0.625rem 0 0 0 !important;
  }
  #collegeList .column {
    height: auto;
  }
  #collegeList .column .info,
  #collegeList .column .image {
    width: 100%;
  }
  #collegeList .column .image {
    height: 200px;
    height: 12.5rem;
  }
  #collegeList .column .info {
    padding: 25px 6.5% 90px 6.5%;
    padding: 1.5625rem 6.5% 5.625rem 6.5%;
    height: auto;
  }
  #collegeList .column .info .links {
    bottom: 20px;
    bottom: 1.25rem;
    left: 6.5%;
  }
  #collegeList .column .info .links a {
    margin: 0 5px 0 0;
    margin: 0 0.3125rem 0 0;
  }
  #collegeList .column .image .logo {
    max-width: 80%;
  }
  #latestNews {
    padding: 35px 0 40px 0;
    padding: 2.1875rem 0 2.5rem 0;
  }
  #latestNews .holder {
    text-align: center;
  }
  #latestNews a.seeAll {
    float: none;
    display: inline-block;
  }
  #latestNews .owl-carousel {
    text-align: left;
  }
  #latestNews .specialContainer {
    left: 0;
    margin-left: 5%;
    width: 95%;
  }
  #latestNews .specialContainer .holder {
    width: 95%;
  }
  #latestNews .customNavButtons {
    right: 5%;
    left: 5%;
    margin-left: 0;
    top: 270px;
    top: 16.875rem;
  }
  #latestNews .sectionTitle,
  #latestNews .contained a.seeAll {
    width: 100%;
    text-align: center;
  }
  #latestNews .item figure {
    height: 280px;
    height: 17.5rem;
  }
  #latestNews .item figure img {
    height: auto;
    width: 135%;
  }
  #latestNews .item .itemInfo {
    padding: 20px 0 25px 0;
    padding: 1.25rem 0 1.5625rem 0;
  }
  #associations .container {
    padding: 0 8%;
  }
  #associations .assocItems .owl-nav button.owl-prev {
    left: -30px;
    left: -1.875rem;
  }
  #associations .assocItems .owl-nav button.owl-next {
    right: -30px;
    right: -1.875rem;
  }
  #associationsUpper .container {
    padding: 0 8%;
  }
  #associationsUpper .assocItems .owl-nav button.owl-prev {
    left: -30px;
    left: -1.875rem;
  }
  #associationsUpper .assocItems .owl-nav button.owl-next {
    right: -30px;
    right: -1.875rem;
  }
  #address {
    padding: 25px 0 0 0;
    padding: 1.5625rem 0 0 0;
  }
  #address .contained {
    padding: 0 5%;
  }
  #address .column {
    width: 100%;
    padding-right: 0;
    text-align: center;
  }
  #address .column .sectionHeading {
    margin-bottom: 15px;
    margin-bottom: 0.9375rem;
  }
  #address .column.group, #address .column.quicklinks {
    margin-top: 30px;
    margin-top: 1.875rem;
  }
  #address .column a.contactBtn {
    display: inline-block;
    float: none;
  }
}

@media all and (min-width: 768px) and (max-width: 1023px) {
  #slider,
  #slider .container {
    height: 550px;
    height: 34.375rem;
    min-height: 0;
  }
  #slider ul.slick-dots {
    bottom: 180px;
    bottom: 11.25rem;
  }
  #slider .sliderText .slide .bannerText {
    bottom: 240px;
    bottom: 15rem;
  }
  #slider .sliderText {
    left: 10%;
    right: 10%;
  }
  #welcome {
    padding: 70px 0;
    padding: 4.375rem 0;
  }
  #welcome .column.content {
    padding: 0 3%;
  }
  #welcome .column.content .cccg-logo {
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    margin-top: 0;
  }
  #welcome .column.content:hover .cccg-logo {
    transform: translateY(-50%) scale(1);
    -webkit-transform: translateY(-50%) scale(1);
  }
  #collegeList .column .info {
    padding: 35px 40px 130px 40px;
    padding: 2.1875rem 2.5rem 8.125rem 2.5rem;
  }
  #collegeList .column .info .links {
    left: 40px;
    left: 2.5rem;
    bottom: 40px;
    bottom: 2.5rem;
  }
  #latestNews {
    padding: 40px 0;
    padding: 2.5rem 0;
  }
  #latestNews .item figure {
    height: 300px;
    height: 18.75rem;
  }
  #latestNews .specialContainer {
    left: 0;
    margin-left: 5%;
    width: 95%;
  }
  #latestNews .specialContainer .holder {
    width: 95%;
  }
  #latestNews .customNavButtons {
    right: 5%;
    left: 5%;
    margin-left: 0;
  }
  #associations .assocItems .owl-nav button.owl-prev {
    left: -30px;
    left: -1.875rem;
  }
  #associations .assocItems .owl-nav button.owl-next {
    right: -30px;
    right: -1.875rem;
  }
#associationsUpper .assocItems .owl-nav button.owl-prev {
    left: -30px;
    left: -1.875rem;
  }
  #associationsUpper .assocItems .owl-nav button.owl-next {
    right: -30px;
    right: -1.875rem;
  }

  #address .container {
    padding: 0 40px;
    padding: 0 2.5rem;
  }
}

@media (max-width: 1023px) {
  #slider {
    margin-top: 0;
  }
  .column.span_5_of_10 {
    width: 100%;
  }
  #associations .assocItems {
    width: 100%;
    margin-left: 0;
  }
 #associationsUpper .assocItems {
    width: 100%;
    margin-left: 0;
  }
}

@media all and (min-width: 768px) and (max-width: 1300px) {
  #welcome .column.content {
    margin-bottom: 40px;
    margin-bottom: 2.5rem;
  }
  #welcome .column.quicklinks {
    width: 640px;
    width: 40rem;
    float: none;
    margin: 0 auto;
    padding: 0;
  }
  #address .combined {
    float: left;
    width: 60.9579%;
  }
  #address .combined .column {
    width: 100%;
  }
  #address .combined .column.group {
    margin-top: 30px;
    margin-top: 1.875rem;
  }
  #address .column.quicklinks {
    width: 30.0436%;
    float: right;
    padding-right: 0;
  }
  #address .column.quicklinks .col.span_5_of_10 {
    width: 100%;
  }
}

@media (max-width: 1300px) {
  #latestNews .customNavButtons button.customNextBtn {
    right: -20px;
    right: -1.25rem;
  }
  #welcome .column.content.span_5_of_10 {
    width: 100%;
  }
}

@media all and (min-width: 1024px) and (max-width: 1399px) {
  #latestNews .specialContainer {
    left: 0;
    margin-left: 5%;
    width: 95%;
  }
  #latestNews .specialContainer .holder {
    width: 95%;
  }
  #latestNews .customNavButtons {
    right: 5%;
    left: 5%;
    margin-left: 0;
  }
  #associations .assocItems .owl-nav button.owl-prev {
    left: -55px;
    left: -3.4375rem;
  }
  #associations .assocItems .owl-nav button.owl-next {
    right: -55px;
    right: -3.4375rem;
  }
  #associationsUpper .assocItems .owl-nav button.owl-prev {
    left: -55px;
    left: -3.4375rem;
  }
  #associationsUpper .assocItems .owl-nav button.owl-next {
    right: -55px;
    right: -3.4375rem;
  }
}

@media (max-width: 1550px) {
  #footerLinks .container .socials,
  #footerLinks .container .links {
    width: 100%;
    text-align: center;
    margin-top: 20px;
    margin-top: 1.25rem;
  }
  #footerLinks .container .socials a,
  #footerLinks .container .links a {
    display: inline-block;
    float: none;
  }
  #footerLinks .container .links {
    margin-top: 0;
  }
  #footerLinks .container .links a {
    margin: 10px 8px;
    margin: 0.625rem 0.5rem;
  }
}

@media all and (min-width: 1024px) and (max-width: 1550px) {
  #associations .container {
    padding: 0 100px;
    padding: 0 6.25rem;
  }
 #associationsUpper .container {
    padding: 0 100px;
    padding: 0 6.25rem;
  }
}

@media all and (min-width: 768px) and (max-width: 1600px) {
  .courseSearch,
  .courseSearch .holder {
    height: 300px;
    height: 18.75rem;
  }
  .courseSearch .container {
    padding: 0;
  }
  .courseSearch .holder {
    background-color: transparent;
  }
  .courseSearch .holder .column.searchArea {
    width: 90%;
    margin-left: 5%;
    background-color: #fff;
    border-radius: 20px 20px 0px 0px;
    -webkit-border-radius: 20px 20px 0px 0px;
  }
  .courseSearch .holder .column {
    width: 100%;
    height: 150px;
    height: 9.375rem;
  }
  .courseSearch .holder .column.associates {
    position: relative;
  }
  .courseSearch .holder .column.associates:before, .courseSearch .holder .column.associates:after {
    content: "";
    position: absolute;
    top: 0;
    height: 100%;
    width: 6%;
  }
  .courseSearch .holder .column.associates:before {
    left: -5.8%;
  }
  .courseSearch .holder .column.associates:after {
    right: -5.8%;
  }
  .courseSearch .holder .searchBlock {
    width: calc(100% - 100px);
  }
  .courseSearch .holder .searchBlock .search.keyword {
    right: auto;
    width: 58.2706%;
  }
  .courseSearch .holder .searchBlock .search.postcode {
    left: auto;
    right: 0;
    width: 38.1578%;
  }
  .courseSearch .holder .searchBlock button.searchBTN {
    right: -100px;
    right: -6.25rem;
  }
}

@media all and (min-width: 1024px) and (max-width: 1650px) {
  #welcome .column.content .cccg-logo {
    transform: translateY(-50%) scale(1);
    -webkit-transform: translateY(-50%) scale(1);
    margin-top: 0;
  }
  #welcome .column.content:hover .cccg-logo {
    transform: translateY(-50%) scale(1.3);
    -webkit-transform: translateY(-50%) scale(1.3);
  }
  #welcome {
    padding: 80px 0;
    padding: 5rem 0;
  }
  #welcome .column.content {
    padding: 0 60px 0 0;
    padding: 0 3.75rem 0 0;
  }
}

@media (max-width: 1300px) {
  #collegeList .verticalSplit {
    width: 100%;
  }
}

@media all and (min-width: 1300px) and (max-width: 1600px) {
  #collegeList .column .info {
    padding: 35px 30px 130px 30px;
    padding: 2.1875rem 1.875rem 8.125rem 1.875rem;
  }
  #collegeList .column .info .links {
    left: 30px;
    left: 1.875rem;
    bottom: 35px;
    bottom: 2.1875rem;
  }
  #collegeList .column .info .links a {
    margin: 0 5px 0 0;
    margin: 0 0.3125rem 0 0;
  }
}

@media (max-width: 1600px) {
  .courseSearch .holder .column.associates {
    border-radius: 0;
  }
}

@media (max-width: 1650px) {
  #welcome .column,
  #cultureValues .column {
    min-height: 0;
  }
}

@media all and (min-width: 1400px) and (max-width: 1850px) {
  #associations .assocItems .owl-nav button.owl-prev {
    left: -70px;
    left: -4.375rem;
  }
  #associations .assocItems .owl-nav button.owl-next {
    right: -70px;
    right: -4.375rem;
  }
  #associationsUpper .assocItems .owl-nav button.owl-prev {
    left: -70px;
    left: -4.375rem;
  }
  #associationsUpper .assocItems .owl-nav button.owl-next {
    right: -70px;
    right: -4.375rem;
  }
}

@media (min-width: 1024px) {
  #slider,
  #slider .container {
    min-height: calc(100vh - 140px);
  }
}
@media all and (min-width:1200)
{
	#pageTitle {    min-height: 350px;}
}
           #pageTitle {
  float: left;
  width: 100%;
  padding: 80px 0 80px;
padding: 6rem 0 5rem;


 
  position: relative;
}


        #pageTitle.white {
 
padding: 4rem 0 0rem;

}




#pageTitle h1,#pageTitle h5 {
  margin: 0;
  line-height: 1.2;
  position: relative;
  z-index: 10;
}

#pageTitle:after {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  content: "";
  z-index: 1;
}

 .cccg-logo-new {
  position: absolute;
  top: 250px;

  width: 15rem;
  height: 22rem;
  margin-top: -9rem;
  z-index: 9;
  right: -7rem;
  opacity: 1;
}
.cccg-logo-new img  {
width:240px;
  width: 15rem;
height:358px;
  height: 22rem;
}

               #pageTitle .cccg-logo {
  position: absolute;
  top: 0px;

  width: 15rem;
  height: 22rem;
  margin-top: 0rem;
  z-index: 9;
  right: -2rem;
  opacity: 1;
}

#pageTitle .cccg-logo img, .cccg-logo img  {
width:240px;
  width: 15rem;
height:358px;
  height: 22rem;
}

@media all and (max-width:1200px)
{
.cccg-logo-new {
  right: -10rem;

}

    #pageTitle .cccg-logo {
  right: -2rem;

}
}

@media all and (max-width:767px)
{
.cccg-logo-new {
display:none;

}
    #pageTitle .cccg-logo {
  right: -2rem;
width:7.5rem;
height:11rem;
top:auto;
bottom:0px;
}


#pageTitle .cccg-logo img, .cccg-logo img {

    width: 7.5rem;

    height: 11rem;
}
}

#pageHolder {
  float: left;
  width: 100%;
  position: relative;
}

#pageHolder .cccg-logo {
  position: absolute;
  bottom: 70px;
  bottom: 4.375rem;
  width: 12rem;

  height: 20.375rem;
  z-index: -1;
  right: -30px;
  right: -1.875rem;
  opacity: 0.6;
}

#pageHolder .cccg-logo img {
  width: 398px;
  width: 12.875rem;
  height: 774px;
  height: 20.375rem;
}

#pageHolder .pageHolder {
  float: left;
  width: 100%;
  position: relative;
  padding-bottom: 100px;
  padding-bottom: 6.25rem;
}

#pageHolder aside#sidebar {
  position: absolute;
  right: 0;
  top: -50px;
  top: -3.125rem;
  width: 310px;
  width: 19.375rem;
  margin: 0;
  padding: 0;
  opacity: 1;
  z-index: 3000;
}

#pageHolder aside#sidebar .collapse {
  position: relative;
  display: none;
  float: left;
  width: 100%;
  -webkit-box-shadow: 0px 10px 10px -8px rgba(0, 0, 0, 0.38);
  -moz-box-shadow: 0px 10px 10px -8px rgba(0, 0, 0, 0.38);
  box-shadow: 0px 10px 10px -8px rgba(0, 0, 0, 0.38);
}

#pageHolder aside#sidebar nav#sideMenu {
  float: left;
  width: 100%;
}

#pageHolder aside#sidebar .sectionHeader {
  display: block;
  float: left;
  position: relative;
  padding: 0 20px;
  padding: 0 1.25rem;
  width: 100%;
  height: 50px;
  height: 3.125rem;
  line-height: 50px;
  line-height: 3.125rem;
}

#pageHolder aside#sidebar .sectionHeader .sectionTitle i {
  line-height: 50px;
  line-height: 3.125rem;
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  position: absolute;
  right: 22px;
  right: 1.375rem;
  top: 0;
  top: 0;
}

#pageHolder aside#sidebar .sectionHeader a.linkAction {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
}

#pageHolder aside#sidebar .sectionHeader a.linkAction:hover {
  cursor: pointer;
}

#pageHolder aside#sidebar .sectionHeader.sectionMenuOpen .sectionTitle i {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
}

#pageHolder aside#sidebar ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  float: left;
  width: 100%;
  padding: 12px 0 15px 0;
  padding: 0.75rem 0 0.9375rem 0;
  z-index: 2000;
  position: relative;
}

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

#pageHolder aside#sidebar ul li a {
  display: block;
  padding: 5px 20px;
  padding: 0.3125rem 1.25rem;
  line-height: 1.4;
}

#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.has-sub > a {
  padding: 6px 60px 6px 20px;
  padding: 0.375rem 3.75rem 0.375rem 1.25rem;
}

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

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

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

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

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

#pageHolder aside#sidebar ul li.has-sub.open .holder {
  top: -2px;
  top: -0.125rem;
}

#pageHolder aside#sidebar ul li.has-sub.open .holder:after {
  content: "\f106";
}

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

#pageHolder aside#sidebar .holder:after {
  display: block;
  position: absolute;
  text-align: center;
  width: 100%;
  height: 12px;
  height: 0.75rem;
  padding: 0;
  padding: 0;
  z-index: 10;
  content: "\f107";
  font-family: 'Font Awesome 5 Free';
  font-weight: 700;
  top: 10px;
  top: 0.625rem;
}

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

      #pageHolder #pageContent {
  padding-top: 40px;
  padding-top:1.5rem;
  position: relative;
  z-index: 2000;
}

#pageHolder #pageContent .breadcrumb {
  float: left;
  position: relative;
  width: 100%;
  margin-bottom: 60px;
  margin-bottom: 3.75rem;
  line-height: 1.5;
}

#pageHolder #pageContent .breadcrumb a {
  word-break: break-word;
  padding: 0 4px 0 0;
  padding: 0 0.25rem 0 0;
  margin-right: 20px;
  margin-right: 1.25rem;
  position: relative;
  line-height: 1.4;
}

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

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

#pageHolder #pageContent .advert {
  padding: 80px 28%;
  padding: 5rem 28%;
  margin: 50px 0 40px 0;
  margin: 3.125rem 0 2.5rem 0;
  text-align: center;
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}

#pageHolder #pageContent .advert .advertText {
  line-height: 1.4;
  position: relative;
  z-index: 10;
}

#pageHolder #pageContent .advert a.readMore {
  margin-top: 30px;
  margin-top: 1.875rem;
  position: relative;
  z-index: 10;                
  display: inline-block;
}

#pageHolder #pageContent .advert .overlay {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

#pageHolder #pageContent .advert.mTop {
  margin: 80px 0 0 0;
  margin: 5rem 0 0 0;
}

    #pageHolder #pageContent ul, #pageHolder #pageContent ol {
  line-height: 1.5;

  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 .wp-block-stackable-column  ol{padding-left:0px;list-style:ol;}
   #pageHolder #pageContent .wp-block-stackable-column  ol li:before {display:none}
#pageHolder #pageContent h1 {
  margin-top: 0;
  margin-bottom: 40px;
  margin-bottom: 2.5rem;
  position: relative;
  line-height: 1.1;
  width: 100%;
  float: left;
}

#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 {
    max-width: 100%;
    height: auto;
}

#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: 0;
  padding: 0;
  line-height: 1.5;
}

#pageHolder #pageContent blockquote cite {
  margin-top: 8px;
  margin-top: 0.5rem;
  display: block;
  font-style: normal;
}

#pageHolder #pageContent blockquote .speechMarks {
  line-height: normal;
  height: 80px;
  height: 5rem;
}

#pageHolder #pageContent blockquote .speechMarks span.top {
  margin: 0 0 0 5px;
  margin: 0 0 0 0.3125rem;
}

#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;
}

.col.span_5_of_10 {
  width: 50%;
}

.vacancyDetails {
  margin: 40px 0;
  margin: 2.5rem 0;
  padding: 20px 0 30px 0;
  padding: 1.25rem 0 1.875rem 0;
  border-top-style: solid;
  border-top-width: 1px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
}

.vacancyDetails .sectionTitle {
  float: left;
  width: 100%;
  margin: 10px 0 20px 0;
  margin: 0.625rem 0 1.25rem 0;
}

.vacancyDetails .info {
  float: left;
  width: 100%;
  padding-right: 200px;
  padding-right: 12.5rem;
  position: relative;
}

.vacancyDetails .info div {
  margin: 6px 0;
  margin: 0.375rem 0;
  line-height: 1.3;
}

.vacancyDetails .info a.apply,
.vacancyDetails .info a.forward {
  position: absolute;
  right: 0;
}

.vacancyDetails .info a.apply {
  bottom: 90px;
  bottom: 5.625rem;
  line-height: 50px;
  line-height: 3.125rem;
}

.vacancyDetails .info a.forward {
  bottom: 32px;
  bottom: 2rem;
}

.applyBlock {
  float: left;
  width: 100%;
  padding: 20px 200px 20px 0;
  padding: 1.25rem 12.5rem 1.25rem 0;
  position: relative;
  border-top-style: solid;
  border-top-width: 1px;
  margin: 30px 0 0 0;
  margin: 1.875rem 0 0 0;
}

.applyBlock div {
  margin: 6px 0;
  margin: 0.375rem 0;
  line-height: 1.3;
}

.applyBlock a.apply,
.applyBlock a.forward {
  position: absolute;
  right: 0;
  bottom: 32px;
  bottom: 2rem;
}

.applyBlock a.apply {
  line-height: 50px;
  line-height: 3.125rem;
}

#pageHolder #pageContent ul.collegeList {
  margin: 0;
  padding: 0;
  list-style-type: none;
  margin: 0;
  margin: 0;
  width: 100%;
  float: left;
  clear: none;
}

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

#pageHolder #pageContent ul.collegeList li {
  float: left;
  width: 100%;
  margin-bottom: 25px;
  margin-bottom: 1.5625rem;
  height: 365px;
  height: 22.8125rem;
  position: relative;
  overflow: hidden;
}

#pageHolder #pageContent ul.collegeList li a {
  display: block;
  z-index: 5;
  height: 365px;
  height: 22.8125rem;
}

#pageHolder #pageContent ul.collegeList .collegeImage,
#pageHolder #pageContent ul.collegeList .animatedOverlay,
#pageHolder #pageContent ul.collegeList .collegeName,
#pageHolder #pageContent ul.collegeList .readMore,
#pageHolder #pageContent ul.collegeList .overlay {
  position: absolute;
}

#pageHolder #pageContent ul.collegeList .collegeImage,
#pageHolder #pageContent ul.collegeList .overlay {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

#pageHolder #pageContent ul.collegeList .collegeImage {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  z-index: 1;
}

#pageHolder #pageContent ul.collegeList .overlay {
  z-index: 2;
}

#pageHolder #pageContent ul.collegeList .animatedOverlay {
  z-index: 3;
  top: 50%;
  left: 50%;
  position: absolute;
  width: 420px;
  width: 26.25rem;
  height: 100px;
  height: 6.25rem;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  border-radius: 10px;
  background-clip: padding-box;
  behavior: url(PIE.htc);
}

#pageHolder #pageContent ul.collegeList .collegeName,
#pageHolder #pageContent ul.collegeList .readMore {
  z-index: 10;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  text-align: center;
}

#pageHolder #pageContent ul.collegeList .collegeName {
  max-width: 320px;
  max-width: 20rem;
  line-height: 1.1;
}

#pageHolder #pageContent ul.collegeList .readMore {
  opacity: 0;
}

#pageHolder #pageContent ul.collegeList li a:hover .readMore {
  opacity: 1;
}

#pageHolder #pageContent ul.collegeList li a:hover .collegeName {
  opacity: 0;
}

#pageHolder #pageContent ul.collegeList li a:hover .animatedOverlay {
  width: 104%;
  height: 104%;
}

.additionalCollegeInfo {
  float: left;
  margin-bottom: 50px;
  margin-bottom: 3.125rem;
  width: 100%;
}

.additionalCollegeInfo .collegeGallery {
  float: left;
  width: 48%;
  height: 365px;
  height: 22.8125rem;
  overflow: hidden;
}

.additionalCollegeInfo .collegeGallery img {
  max-width: 100%;
  height: auto;
}

.additionalCollegeInfo .info {
  width: 48%;
  float: right;
}

.additionalCollegeInfo .info a {
  float: left;
  clear: left;
  margin-top: 30px;
  margin-top: 1.875rem;
}

.additionalCollegeInfo .addresses {
  float: left;
  width: 100%;
  margin: 50px 0 0 0;
  margin: 3.125rem 0 0 0;
}

.additionalCollegeInfo .addresses div {
    margin: 6px 0;
  margin: 0.375rem 0;
  line-height: 1.3;
}

@media (max-width: 767px) {
    #pageTitle {
    padding: 35px 0 35px 0;
    padding: 2.1875rem 0 2.1875rem 0;
  }

    #pageTitle.white {
    padding: 35px 0 35px 0;
    padding: 2.1875rem 0 2.1875rem 0;
  }
  #pageHolder .container {
    padding: 0;
  }
  #pageHolder aside#sidebar {
    width: 100%;
    top: 0;
    top: 0;
  }
  #pageHolder aside#sidebar .sectionHeader {
    padding: 0 5%;
    height: 40px;
    height: 2.5rem;
    line-height: 40px;
    line-height: 2.5rem;
  }
  #pageHolder aside#sidebar .sectionHeader .sectionTitle i {
    line-height: 40px;
    line-height: 2.5rem;
    right: 5%;
  }
  #pageHolder aside#sidebar ul li a {
    padding: 5px 5%;
    padding: 0.3125rem 5%;
  }
  #pageHolder aside#sidebar ul li.has-sub > a {
    padding: 5px 60px 5px 5%;
    padding: 0.3125rem 3.75rem 0.3125rem 5%;
  }
  #pageHolder aside#sidebar ul li ul li:before {
    left: 5%;
  }
  #pageHolder aside#sidebar ul li ul li a {
    padding-left: calc(5% + 15px);
  }
  #pageHolder #pageContent {
    padding: 0 5%;
    padding-top: 65px;
    padding-top: 4.0625rem;
  }
     #pageHolder #pageContent h1 {
    margin-bottom: 25px;
    margin-bottom: 1.5625rem;        font-size: 30px;
  }
  #pageHolder #pageContent blockquote {
    margin: 35px 0 20px 0;
    margin: 2.1875rem 0 1.25rem 0;
  }
  body.page.noSidebar #pageHolder #pageContent {
    padding: 30px 5% 0 5%;
    padding: 1.875rem 5% 0 5%;
  }
  #pageHolder .pageHolder {
    padding-bottom: 40px;
    padding-bottom: 2.5rem;
  }
  #pageHolder #pageContent .breadcrumb {
    margin-bottom: 30px;
    margin-bottom: 1.875rem;
  }
  #pageHolder #pageContent .advert {
    padding: 30px 6%;
    padding: 1.875rem 6%;
    margin: 35px 0 30px 0;
    margin: 2.1875rem 0 1.875rem 0;
  }
  #pageHolder #pageContent img {
    width: 100%;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

    .vacancyDetails {
    margin: 20px 0;
    margin: 1.25rem 0;
    padding: 10px 0 20px 0;
    padding: 0.625rem 0 1.25rem 0;
  }
  #pageHolder #pageContent .info a {
    clear: both;
  }
  #pageHolder #pageContent .info a.apply {
    margin-top: 20px;
    margin-top: 1.25rem;
  }
  #pageHolder #pageContent .info a.forward {
    margin-top: 13px;
    margin-top: 0.8125rem;
  }
  .applyBlock {
    padding: 15px 0;
    padding: 0.9375rem 0;
    margin: 20px 0 0 0;
    margin: 1.25rem 0 0 0;
  }
  .applyBlock a.apply {
    position: relative;
    float: left;
    right: auto;
    bottom: auto;
    margin-top: 15px;
    margin-top: 0.9375rem;
  }
  #pageHolder .cccg-logo {
    display: none;
  }
  #pageHolder #pageContent ul.collegeList li {
    margin-bottom: 12px;
    margin-bottom: 0.75rem;
  }
  #pageHolder #pageContent ul.collegeList li,
  #pageHolder #pageContent ul.collegeList li a {
    height: 180px;
    height: 11.25rem;
  }
  #pageHolder #pageContent ul.collegeList .animatedOverlay {
    width: 78%;
    height: 70px;
    height: 4.375rem;
  }
  #pageHolder #pageContent ul.collegeList .collegeName {
    max-width: none;
    width: 70%;
  }
  #pageHolder #pageContent .additionalCollegeInfo .info .logo img {
    width: auto;
  }
  .additionalCollegeInfo {
    margin-bottom: 20px;
    margin-bottom: 1.25rem;
  }
  .additionalCollegeInfo .addresses {
    margin: 15px 0 20px 0;
    margin: 0.9375rem 0 1.25rem 0;
  }
  .searchForm {
    margin: 0 0 35px 0;
    margin: 0 0 2.1875rem 0;
  }
  .filterHolder,
  .filterGroup,
  .searchBTN,
  .col.span_5_of_10 {
    width: 100%;
  }
  .filterGroup {
    margin: 0 0 10px 0;
    margin: 0 0 0.625rem 0;
  }
  .jobList {
    margin-bottom: 35px;
    margin-bottom: 2.1875rem;
  }
  .jobList .vacancy a {
    padding: 15px 0 25px 0;
    padding: 0.9375rem 0 1.5625rem 0;
  }
  .jobList .vacancy a:hover i {
    opacity: 0;
    display: none;
  }
  .jobList .vacancy .title {
    margin-bottom: 20px;
    margin-bottom: 1.25rem;
  }
  #pageHolder #pageContent .advert.mTop {
    margin-top: 35px;
    margin-top: 2.1875rem;
  }
  .additionalCollegeInfo .collegeGallery {
    height: auto;
    height: auto;
  }
}

@media all and (min-width: 768px) and (max-width: 1023px) {
  #pageHolder .pageHolder {
    padding-bottom: 70px;
    padding-bottom: 4.375rem;
  }
  #pageHolder #pageContent .breadcrumb {
    margin-bottom: 50px;
    margin-bottom: 3.125rem;
  }
  #pageHolder #pageContent .info a.forward {
    margin-left: 15px;
    margin-left: 0.9375rem;
  }
  #pageHolder #pageContent .info a.apply {
    margin-top: 20px;
    margin-top: 1.25rem;
  }
  #pageHolder #pageContent .info a.forward {
    margin-top: 30px;
    margin-top: 1.875rem;
  }
  .additionalCollegeInfo .info {
    position: relative;
    margin-bottom: 40px;
    margin-bottom: 2.5rem;
  }
  .additionalCollegeInfo .info .logo {
    float: left;
  }
  .additionalCollegeInfo .addresses {
    width: auto;
    float: left;
    margin: 110px 0 0 70px;
    margin: 6.875rem 0 0 4.375rem;
  }
  .additionalCollegeInfo .info a.readMore {
    position: absolute;
    left: 0;
    bottom: 8px;
    bottom: 0.5rem;
    margin-top: 0;
  }
  .searchForm {
    margin: 10px 0 35px 0;
    margin: 0.625rem 0 2.1875rem 0;
  }
  .searchForm .searchBTN {
    top: auto;
    float: none;
    position: absolute;
    right: 0;
    bottom: 10px;
    bottom: 0.625rem;
  }
  .filterGroup {
    width: 49.5867%;
    margin-left: 0.8266%;
    margin-bottom: 10px;
    margin-bottom: 0.625rem;
  }
  .filterGroup:nth-child(3) {
    margin-left: 0;
  }
  .jobList .vacancy a {
    padding: 30px 70px 30px 30px;
    padding: 1.875rem 4.375rem 1.875rem 1.875rem;
  }
}

@media (min-width: 768px) {
  #pageHolder {
    min-height: 1000px;
    min-height: 62.5rem;
  }
}

@media (max-width: 1023px) {
  .vacancyDetails .info {
    padding-right: 0;
  }
  .vacancyDetails .info a.apply,
  .vacancyDetails .info a.forward {
    position: relative;
    float: left;
    right: auto;
    bottom: auto;
  }
  .additionalCollegeInfo .info,
  .additionalCollegeInfo .collegeGallery {
    width: 100%;
  }
  .searchForm {
    height: auto;
  }
  #pageTitle {
    margin-top: 0;
  }
}

@media all and (min-width: 768px) and (max-width: 1600px) {
  #pageHolder aside#sidebar {
    right: 0;
  }
}

@media all and (min-width: 1024px) and (max-width: 1600px) {
  #pageHolder #pageContent .advert {
    padding: 80px 16%;
    padding: 5rem 16%;
  }
}

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

@media (min-width: 1024px) {
  #pageHolder #pageContent ul.collegeList li {
    width: 48.5%;
    margin: 0 0 30px 2.5%;
    margin: 0 0 1.875rem 2.5%;
  }
  #pageHolder #pageContent ul.collegeList li:nth-child(odd) {
    margin-left: 0;
  }
}

#pageHolder #pageContent ul.staffList {
  margin: 0;
  padding: 0;
  list-style-type: none;
  margin: 0;
  margin: 0;
  width: 100%;
  float: left;
  clear: none;
}

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

#pageHolder #pageContent ul.staffList li {
  float: left;
  width: 100%;
  margin-bottom: 25px;
  margin-bottom: 1.5625rem;
}

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

#pageHolder #pageContent ul.staffList figure {
  margin: 0;
  height: 325px;
  height: 20.3125rem;
  float: left;
  width: 100%;
  overflow: hidden;
  position: relative;
}

#pageHolder #pageContent ul.staffList figure img {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 110%;
  transform: translate(-50%, -50%) scale(1);
  -webkit-transform: translate(-50%, -50%) scale(1);
}

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

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

#pageHolder #pageContent ul.staffList .itemInfo {
  float: left;
  width: 100%;
  padding: 35px 0 70px 0;
  padding: 2.1875rem 0 4.375rem 0;
  line-height: 1.2;
  z-index: 2;
  overflow: hidden;
}

#pageHolder #pageContent ul.staffList .itemInfo .title {
  margin: 20px 0 0 0;
  margin: 1.25rem 0 0 0;
}

#pageHolder #pageContent ul.staffList .itemInfo span.readMore {
  position: absolute;
  bottom: 0;
  bottom: 0;
  left: 0;
  left: 0;
}

@media (max-width: 767px) {
  #pageHolder #pageContent ul.staffList figure {
    height: 250px;
    height: 15.625rem;
  }
  #pageHolder #pageContent ul.staffList .itemInfo {
    padding: 20px 0 70px 0;
    padding: 1.25rem 0 4.375rem 0;
  }
}

@media all and (min-width: 768px) and (max-width: 1349px) {
  #pageHolder #pageContent ul.staffList li {
    width: 47.3282%;
    margin: 0 0 30px 5.3436%;
    margin: 0 0 1.875rem 5.3436%;
  }
  #pageHolder #pageContent ul.staffList li:nth-child(odd) {
    margin-left: 0;
  }
}

@media (min-width: 1350px) {
  #pageHolder #pageContent ul.staffList li {
    width: 31.9587%;
    margin: 0 0 80px 2.06195%;
    margin: 0 0 5rem 2.06195%;
  }
  #pageHolder #pageContent ul.staffList li:nth-child(3n+1) {
    margin-left: 0;
  }
}

.searchBox {
  display: none;
  width: 940px;
  width: 58.75rem;
  height: 40px;
  height: 2.5rem;
  position: absolute;
  top: 0;
  top: 0;
  right: -2px;
  right: -0.125rem;
  z-index: 10;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  background-clip: padding-box;
  behavior: url(PIE.htc);
}

.searchBox input.searchInput {
  position: absolute;
  top: 0;
  left: 15px;
  left: 0.9375rem;
  width: 856px;
  width: 53.5rem;
  height: 32px;
  height: 2rem;
  padding: 3px 15px 3px 18px;
  padding: 0.1875rem 0.9375rem 0.1875rem 1.125rem;
  box-sizing: content-box;
  border: none;
  color: #000;
  -webkit-appearance: none;
  outline: none;
  z-index: 10;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  border-radius: 10px;
  background-clip: padding-box;
  behavior: url(PIE.htc);
}

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

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

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

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

.searchBox button.searchBTN {
  position: absolute;
  right: 2px;
  right: 0.125rem;
  top: 0;
  top: 0;
  width: 40px;
  width: 2.5rem;
  height: 40px;
  height: 2.5rem;
  border: none !important;
  -webkit-appearance: none;
  padding: 0;
  outline: none;
  background-color: transparent;
  text-align: right;
}

.searchBox a.closeBTN {
  position: absolute;
  left: -30px;
  left: -1.875rem;
  top: 0;
  top: 0;
  z-index: 2;
  width: 40px;
  width: 2.5rem;
  height: 40px;
  height: 2.5rem;
  margin-left: 0 !important;
  text-align: center;
}

.searchBox a.closeBTN i {
  line-height: 40px;
  line-height: 2.5rem;
}

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

@media all and (min-width: 1450px) and (max-width: 1600px) {
  body.fixedHeader .searchBox {
    width: calc(100vw - 620px);
  }
  body.fixedHeader .searchBox input.searchInput {
    width: 90%;
    width: calc(100% - 80px);
  }
}

#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;
  float: left;
  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;
}

#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 ul {
  margin: 5px 0 20px 0 !important;
  margin: 0.3125rem 0 1.25rem 0 !important;
}

#pageHolder #pageContent .sitemap li ul ul li {
  padding: 0 0 0 19px !important;
  padding: 0 0 0 1.1875rem !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: 12px !important;
  top: 0.75rem !important;
  position: absolute;
  content: "";
}

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

.searchForm {
  float: left;
  width: 100%;
  z-index: 1000;
  position: relative;
  margin: 10px 0 0 0;
  margin: 0.625rem 0 0 0;
}

.searchForm .bottomShadow {
  border-bottom: 1px solid #eeeeee;
  box-shadow: 0px 4px 11px -7px rgba(0, 0, 0, 0.18);
  left: -2000px;
  left: -125rem;
  right: -2000px;
  right: -125rem;
  height: 20px;
  height: 1.25rem;
  width: auto;
  position: absolute;
  content: "";
  bottom: 0;
}

.searchForm .searchBlock {
  float: left;
  width: 100%;
  position: relative;
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
  height: 40px;
  height: 2.5rem;
}

.searchForm .searchBlock .search {
  position: absolute;
  top: 0;
  height: 40px;
  height: 2.5rem;
  width: auto;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  background-clip: padding-box;
  behavior: url(PIE.htc);
  overflow: hidden;
}

 .searchForm .searchBlock .search.keyword {
  left: 0;
  width: 92%
}

.searchForm .searchBlock .search.postcode {
  left: 880px;
  left: 55rem;
  right: 90px;
  right: 5.625rem;
}

.searchForm .searchBlock input.searchInput {
  position: absolute;
  top: 0;
  left: 0;
  left: 0;
  width: 92%;
  width: calc(100% - 30px);
  height: 20px;
  height: 1.5rem;
  padding: 8px 15px 9px 15px;
  padding: 0.5rem 0.9375rem 0.5625rem 0.9375rem;
  box-sizing: content-box;
  border: none;
  color: #000;
  font-family: 'moderngothicbold', sans-serif;
  font-size: 14px;
  -webkit-appearance: none;
  outline: none;
  background: none;
  z-index: 10;
}

.searchForm .searchBlock input.searchInput::-webkit-input-placeholder {
  color: #000;
  opacity: 1;
  font-family: 'moderngothicbold', sans-serif;
  font-size: 14px;
}

.searchForm .searchBlock input.searchInput:moz-placeholder {
  color: #000;
  opacity: 1;
  font-family: 'moderngothicbold', sans-serif;
  font-size: 14px;
}

.searchForm .searchBlock input.searchInput::-moz-placeholder {
  color: #000;
  opacity: 1;
  font-family: 'moderngothicbold', sans-serif;
  font-size: 14px;
}

.searchForm .searchBlock input.searchInput:-ms-input-placeholder {
  color: #000;
  opacity: 1;
  font-family: 'moderngothicbold', sans-serif;
  font-size: 14px;
}

.searchForm .searchBlock button.searchBTN {
  position: absolute;
  right: 0;
  right: 0;
  top: 0;
  top: 0;
  width: 80px;
  width: 5rem;
  height: 40px;
  height: 2.5rem;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  background-clip: padding-box;
  behavior: url(PIE.htc);
  border: none !important;
  -webkit-appearance: none;
  padding: 0;
}

.searchForm .advanced {
  float: left;
  width: 100%;
  margin-bottom: 25px;
  margin-bottom: 1.5625rem;
}

.searchForm .advanced a {
  display: block;
  float: left;
}

.searchForm .advanced a:hover {
  text-decoration: underline;
}

.filterHolder {
  float: left;
  width: 100%;
  display: none;
  padding-bottom: 40px;
  padding-bottom: 2.5rem;
}

.filterGroup {
  float: left;
  width: 15.3846%;
  height: 40px;
  height: 2.5rem;
  line-height: 40px;
  line-height: 2.5rem;
  padding: 0 60px 0 15px;
  padding: 0 3.75rem 0 0.9375rem;
  margin-left: 1.5384%;
  position: relative;
  border-radius: 20px;
}

.filterGroup:after {
  content: "\f078";
  font-family: "Font Awesome 5 Free";
  font-weight: 700;
  position: absolute;
  right: 0;
  top: 0;
  line-height: 40px;
  line-height: 2.5rem;
  width: 40px;
  width: 2.5rem;
  height: 40px;
  height: 2.5rem;
  right: 0;
  text-align: center;
}

.filterGroup.courseArea, .filterGroup.location {
  width: 23.8461%;
}

.filterGroup:first-of-type {
  margin-left: 0;
}

.filterItems {
  position: absolute;
  width: 100%;
  top: 100%;
  left: 0;
  padding: 0;
  padding: 0;
  max-height: 0;
  overflow-y: scroll;
  opacity: 0;
  z-index: 100;
  transition: max-height 0s, opacity 0.25s ease-in;
  -webkit-transition: max-height 0s, opacity 0.25s ease-in;
  border-radius: 0px 0px 10px 10px;
}

.filterItems .filterItem {
  line-height: normal;
  padding: 8px 12px;
  padding: 0.5rem 0.75rem;
}

.filterItems .filterItem:last-child {
  margin-bottom: 10px;
  margin-bottom: 0.625rem;
}

.filterItems .filterItem:hover {
  text-decoration: underline;
}

.filterItems .filterItem:hover,
.filterItems .filterItem:focus {
  cursor: pointer;
}

.filterGroup:hover .filterItems {
  max-height: 202px;
  max-height: 12.625rem;
  opacity: 1;
}

.filterGroup:hover {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

   .searchBTN {
  width: 82px;
  width: 7.125rem;
  height: 40px;
  height: 2.5rem;
  line-height: 40px;
  line-height: 2.5rem;
  text-align: center;
  float: right;
  border: none;
  -webkit-appearance: none;
  outline: none;
  margin: 0;
  padding: 0;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  border-radius: 10px;
  background-clip: padding-box;
  behavior: url(PIE.htc);
}

.categoryList {
  float: left;
  width: 100%;
  margin-top: 100px;
  margin-top: 6.25rem;
}

.categoryList .cat {
  height: 250px;
  height: 15.625rem;
  float: left;
  position: relative;
  width: 32.3076%;
  margin-left: 1.5384%;
  background-size: cover;
  background-position: center;
  margin-bottom: 25px;
  margin-bottom: 1.5625rem;
}

.categoryList .cat a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.categoryList .cat .overlay,
.categoryList .cat .readMore,
.categoryList .cat .catName {
  position: absolute;
}

.categoryList .cat .catName,
.categoryList .cat .readMore {
  z-index: 5;
}

.categoryList .cat .overlay {
  z-index: 1;
  width: 100%;
  left: 0;
  bottom: 0;
  top: 150px;
  top: 9.375rem;
  height: auto;
}

.categoryList .cat .catName {
  bottom: 0px;
  bottom: 0rem;
  height: 100px;
  height: 6.25rem;
  left: 0;
  width: 100%;
  text-align: center;
}

.categoryList .cat .catName .center {
  position: absolute;
  left: 0;
  width: 100%;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  padding: 0 50px;
  padding: 0 3.125rem;
  line-height: 1.3;
}

.categoryList .cat .readMore {
  opacity: 0;
  display: none;
  top: 50%;
  left: 50%;
  padding: 0 15px;
  padding: 0 0.9375rem;
  display: block;
  transform: translate(-50%, 5%);
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  border-radius: 10px;
  background-clip: padding-box;
  behavior: url(PIE.htc);
}

.categoryList .cat a:hover .overlay {
  top: 0;
}

.categoryList .cat a:hover .catName {
  bottom: 120px;
  bottom: 7.5rem;
}

.categoryList .cat a:hover .readMore {
  opacity: 1;
  display: block;
}

body.courseListing #pageHolder .pageHolder {
  padding-bottom: 0;
}

#listingSection {
  position: relative;
}

#listingSection .column {

  min-height: 15.125rem;
  position: relative;
}

#listingSection .column.align_left {
  float: left;
}

#listingSection .column.align_right {
  float: right;
}

#listingSection .column .placement {
  float: right;
  width: 650px;
  width: 40.625rem;
  padding-right: 40px;
  padding-right: 2.5rem;
  position: relative;
}

#listingSection #searchFilter {
  padding: 40px 40px 18px 0;
  padding: 2.5rem 2.5rem 1.125rem 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 10;
}

#listingSection #searchFilter .title {
  float: left;
  width: 100%;
}

#listingSection .button-group {
  float: left;
  width: 100%;
  margin-top: 20px;
  margin-top: 1.25rem;
}

#listingSection .button-group button {
  height: auto;
  line-height: 1.2;
  border-radius: 50vh;
  border-width: 1px;
  border-style: solid;
  padding: 5px 15px;
  padding: 0.3125rem 0.9375rem;
  margin: 0 10px 10px 0;
  margin: 0 0.625rem 0.625rem 0;
}

#listingSection .grid {
  float: left;
  width: 100%;
  padding-top: 60px;
  padding-top: 3.75rem;
  max-height: 96vh;
  max-height: 96vh;
  overflow-y: scroll;
  -ms-overflow-style: none;
  /* for Internet Explorer, Edge */
  scrollbar-width: none;
  /* for Firefox */
}

#listingSection .grid::-webkit-scrollbar {
  display: none;
  /* for Chrome, Safari, and Opera */
}

#listingSection .grid .grid-item {
  padding: 15px 0 25px 0;
  padding: 0.9375rem 0 1.5625rem 0;
  width: 100%;
  float: left;
  position: relative;
  border-top: 1px solid #000;
}

#listingSection .grid .grid-item .title {
  line-height: 1.3;
}

#listingSection .grid .grid-item .tags {
  float: left;
  width: 100%;
  margin: 15px 0 5px 0;
  margin: 0.9375rem 0 0.3125rem 0;
}

#listingSection .grid .grid-item .tag {
  padding: 0 15px;
  padding: 0 0.9375rem;
  height: 28px;
  height: 1.75rem;
  line-height: 26px;
  line-height: 1.625rem;
  display: block;
  float: left;
  margin: 0 12px 10px 0;
  margin: 0 0.75rem 0.625rem 0;
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  -ms-border-radius: 14px;
  border-radius: 14px;
  background-clip: padding-box;
  behavior: url(PIE.htc);
  border-width: 1px;
  border-style: solid;
}

#listingSection .grid .grid-item .info .extra {
  float: left;
  width: 100%;
  padding-right: 180px;
  padding-right: 11.25rem;
  position: relative;
}

#listingSection .grid .grid-item .info .extra div {
  margin: 6px 0;
  margin: 0.375rem 0;
  line-height: 1.3;
}

#listingSection .grid .grid-item .info .extra .collegeBranding {
  position: absolute;
  bottom: 0;
  right: 0;
  height: 50px;
  height: 3.125rem;
  max-width: 130px;
  max-width: 8.125rem;
}

#listingSection .grid .grid-item .info .extra .collegeBranding img {
  height: 100%;
  width: auto;
  float: right;
}

#listingSection a.button.readMore {
  float: left;
  margin: 15px 0 0 0;
  margin: 0.9375rem 0 0 0;
}

body.courseDetail #pageHolder #pageContent .column.left {
  width: 49.2307%;
  float: left;
}

body.courseDetail #pageHolder #pageContent .column.right {
  width: 49.2307%;
  float: right;
}

body.courseDetail .mainTitle {
  float: left;
  width: 100%;
  margin-bottom: 40px;
  margin-bottom: 2.5rem;
}

body.courseDetail .mainTitle h2 {
  max-width: 48%;
  float: left;
}

body.courseDetail .mainTitle .rightSide {
  float: right;
  margin-top: 20px;
  margin-top: 1.25rem;
}

body.courseDetail .mainTitle .rightSide a.readMore {
  float: left;
  margin: 42px 50px 0 0;
  margin: 2.625rem 3.125rem 0 0;
}

body.courseDetail .mainTitle .rightSide .brandingHolder {
  float: left;
  height: 80px;
  height: 5rem;
  width: auto;
}

body.courseDetail .mainTitle .rightSide .brandingHolder img {
  height: 100%;
  width: auto;
}

body.courseDetail .map {
  float: left;
  width: 100%;
  position: relative;
  overflow: hidden;
}

body.courseDetail .initialInfo {
  float: left;
  width: 100%;
  padding: 40px 40px;
  padding: 2.5rem 2.5rem;
}

body.courseDetail .initialInfo .row {
  float: left;
  width: 100%;
  padding: 14px 0;
  padding: 0.875rem 0;
}

body.courseDetail .initialInfo .row.info {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

body.courseDetail .initialInfo .row.info:first-of-type {
  border: none;
}

body.courseDetail .initialInfo .row.info span.infoTitle {
  float: left;
}

body.courseDetail .initialInfo .row.info span.infoResult {
  float: right;
}

body.courseDetail .initialInfo .row.info i {
  margin-left: 8px;
  margin-left: 0.5rem;
}

body.courseDetail #accordion {
  float: left;
  width: 100%;
  margin-top: -15px;
  margin-top: -0.9375rem;
}

body.courseDetail #accordion h3 {
  display: block;
  padding: 0 150px 0 35px;
  padding: 0 9.375rem 0 2.1875rem;
  height: 60px;
  height: 3.75rem;
  line-height: 60px;
  line-height: 3.75rem;
  margin: 15px 0 0 0;
  margin: 0.9375rem 0 0 0;
  position: relative;
  outline: none;
  text-transform: uppercase;
}

body.courseDetail #accordion h3:after, body.courseDetail #accordion h3:before {
  width: 60px;
  width: 3.75rem;
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  text-align: center;
  font-family: "Font Awesome 5 Free";
  font-weight: 700;
}

body.courseDetail #accordion h3:before {
  content: "";
  z-index: 1;
}

body.courseDetail #accordion h3:after {
  content: "\f078";
  z-index: 2;
  transform: rotate(0);
  -webkit-transform: rotate(0);
}

body.courseDetail #accordion h3.ui-state-active:after {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
}

body.courseDetail #accordion div.ui-accordion-content {
  padding: 30px 35px 10px 35px;
  padding: 1.875rem 2.1875rem 0.625rem 2.1875rem;
}

body.courseDetail .centralHolder {
  float: left;
  width: 100%;
  text-align: center;
  margin-top: 70px;
  margin-top: 4.375rem;
  position: relative;
}

body.courseDetail .centralHolder a {
  display: inline-block;
}

@media (max-width: 767px) {
  .filterGroup {
    width: 100%;
    margin: 0 0 10px 0;
    margin: 0 0 0.625rem 0;
  }
  .filterGroup.courseArea, .filterGroup.location {
    width: 100%;
  }
  .filterHolder {
    padding-bottom: 20px;
    padding-bottom: 1.25rem;
  }
  .categoryList {
    margin-top: 35px;
    margin-top: 2.1875rem;
  }
  .categoryList .cat {
    width: 100%;
    margin-left: 0;
  }
  .categoryList .cat .catName .center {
    padding: 0 30px;
    padding: 0 1.875rem;
  }
  #listingSection .grid {
    margin-bottom: 50px;
    margin-bottom: 3.125rem;
    padding-top: 10px;
    padding-top: 0.625rem;
  }
  #listingSection .column.courseMap {
    height: 300px;
    height: 18.75rem;
  }
  #listingSection .grid .grid-item .info .extra {
    padding-right: 0;
  }
  #listingSection .grid .grid-item .info .extra .collegeBranding {
    position: relative;
    float: left;
    margin: 10px 0;
    margin: 0.625rem 0;
  }
  #listingSection .grid .grid-item .info .extra .collegeBranding img {
    float: left;
  }
  body.courseDetail .mainTitle .rightSide a.readMore {
    margin: 0;
    margin: 0;
  }
  body.courseDetail #pageHolder #pageContent .mainTitle .rightSide .brandingHolder {
    clear: left;
    margin: 25px 0 0 0;
    margin: 1.5625rem 0 0 0;
  }
  body.courseDetail #pageHolder #pageContent .mainTitle .rightSide .brandingHolder img {
    width: auto;
  }
  body.courseDetail #pageHolder .pageHolder {
    padding-bottom: 70px;
    padding-bottom: 4.375rem;
  }
  body.courseDetail .initialInfo {
    padding: 20px 0;
    padding: 1.25rem 0;
  }
  body.courseDetail .centralHolder {
    margin: 35px 0 0 0;
    margin: 2.1875rem 0 0 0;
  }
  body.courseDetail #accordion h3 {
    padding: 0 150px 0 20px;
    padding: 0 9.375rem 0 1.25rem;
  }
  body.courseDetail #accordion div.ui-accordion-content {
    padding: 20px 20px 5px 20px;
    padding: 1.25rem 1.25rem 0.3125rem 1.25rem;
  }
}

@media all and (min-width: 768px) and (max-width: 1023px) {
  #listingSection .grid {
    margin-bottom: 50px;
    margin-bottom: 3.125rem;
    padding-top: 30px;
    padding-top: 1.875rem;
  }
  #listingSection .column.courseMap {
    height: 420px;
    height: 26.25rem;
  }
  body.courseDetail #pageHolder #pageContent .column.right {
    padding: 0 30px;
    padding: 0 1.875rem;
  }
  body.courseDetail #pageHolder .pageHolder {
    padding-bottom: 90px;
    padding-bottom: 5.625rem;
  }
  body.courseDetail .initialInfo {
    padding: 40px 60px;
    padding: 2.5rem 3.75rem;
  }
}

@media (max-width: 1023px) {
   .searchForm .searchBlock {
   
    height: 2.5rem;
  }
  .searchForm .searchBlock .search.keyword {
    width: calc(100% - 90px);
  }
  .searchForm .searchBlock .search.postcode {
    width: auto;
    left: 0;
    right: 90px;
    right: 5.625rem;
    top: auto;
    bottom: 0;
  }
  .searchForm .searchBlock button.searchBTN {
    top: auto;
    bottom: 0;
  }
  #listingSection .column {
    min-height: 0;
  }
  #listingSection .column .placement {
    width: 100%;
    padding-left: 5%;
    padding-right: 5%;
  }
  #listingSection #searchFilter {
    position: relative;
    float: left;
  }
  #listingSection .grid {
    margin-top: 0 !important;
    overflow-y: visible;
    max-height: none;
  }
  body.courseDetail .mainTitle h2 {
    max-width: none;
  }
  body.courseDetail .mainTitle .rightSide {
    float: left;
  }
  body.courseDetail #pageHolder #pageContent .column.left,
  body.courseDetail #pageHolder #pageContent .column.right {
    width: 100%;
  }
}

@media (max-width: 1024px) {
  #listingSection .column {
    min-height: 0;
  }
}

@media all and (min-width: 1024px) and (max-width: 1350px) {
      .searchForm .searchBlock .search.keyword {
   width: calc(100% - 90px);
  }
  .searchForm .searchBlock .search.postcode {
    width: auto;
    left: 61.5%;
  }
}

@media all and (min-width: 768px) and (max-width: 1200px) {
  .categoryList .cat {
    width: 48.1976%;
    margin-left: 3.6048%;
  }
  .categoryList .cat:nth-child(odd) {
    margin-left: 0;
  }
}

@media all and (min-width: 768px) and (max-width: 1250px) {
  .categoryList {
    margin-top: 50px;
    margin-top: 3.125rem;
  }
  .filterGroup {
    width: 48.8750%;
    margin-left: 1.4556%;
  }
  .filterGroup.courseArea {
    width: 68%;
    margin-bottom: 15px;
    margin-bottom: 0.9375rem;
  }
  .filterGroup.courseType {
    width: 30.8259%;
    margin-left: 1.1741%;
    margin-bottom: 15px;
    margin-bottom: 0.9375rem;
  }
  .filterGroup.level, .filterGroup.iam {
    width: 29.8985%;
  }
  .filterGroup.level {
    margin-left: 0;
  }
  .filterGroup.location {
    width: 37.2781%;
  }
}

@media all and (min-width: 1024px) and (max-width: 1400px) {
  #listingSection .column.courseMap.align_right {
    width: 45%;
  }
  #listingSection .column.courseList.align_left {
    width: 55%;
  }
  #listingSection .column.courseList.align_left .placement {
    width: 100%;
    padding-left: 9%;
  }
  #listingSection #searchFilter {
    right: 0;
    padding-left: 9%;
  }
}

@media (min-width: 1200px) {
  .categoryList .cat:nth-child(3n+1) {
    margin-left: 0;
  }
}

.articleDate {
  display: block;
  margin: 35px 0 20px 0;
  margin: 2.1875rem 0 1.25rem 0;
}

#pageHolder #pageContent .featureRow {
  position: relative;
  width: 100%;
  float: left;
}

#pageHolder #pageContent .featureRow .featured {
  float: left;
  width: 65.97935%;
  position: relative;
}

#pageHolder #pageContent .featureRow .featured ul {
  padding-left: 0;
  margin: 0;
}

#pageHolder #pageContent .featureRow .featured li {
  margin-bottom: 0;
  list-style-type: none;
}

#pageHolder #pageContent .featureRow .featured figure {
  height: 670px;
  height: 41.875rem;
}

#pageHolder #pageContent .featureRow .featured .info {
  padding: 35px 0 70px 0;
  padding: 2.1875rem 0 4.375rem 0;
  line-height: 1.2;
}

#pageHolder #pageContent .featureRow .norm.singular {
  position: absolute;
  top: 320px;
  top: 20rem;
  width: 31.9587%;
  right: 0;
}

#pageHolder #pageContent ul.newsList,
#pageHolder #pageContent .norm.singular,
#pageHolder #pageContent .featured {
  margin: 0;
  padding: 0;
  list-style-type: none;
  margin: 0;
  margin: 0;
  width: 100%;
  float: left;
}

#pageHolder #pageContent ul.newsList li:before,
#pageHolder #pageContent .norm.singular li:before,
#pageHolder #pageContent .featured li:before {
  display: none;
}

#pageHolder #pageContent ul.newsList figure,
#pageHolder #pageContent .norm.singular figure,
#pageHolder #pageContent .featured figure {
  float: left;
  width: 100%;
  margin: 0;
  height: 350px;
  height: 21.875rem;
  overflow: hidden;
  position: relative;
}

#pageHolder #pageContent ul.newsList figure .enlarge,
#pageHolder #pageContent .norm.singular figure .enlarge,
#pageHolder #pageContent .featured figure .enlarge {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
}

#pageHolder #pageContent ul.newsList figure .overlay,
#pageHolder #pageContent .norm.singular figure .overlay,
#pageHolder #pageContent .featured figure .overlay {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  opacity: 0;
}

#pageHolder #pageContent ul.newsList figure .overlay span,
#pageHolder #pageContent .norm.singular figure .overlay span,
#pageHolder #pageContent .featured figure .overlay span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
}

#pageHolder #pageContent ul.newsList li,
#pageHolder #pageContent .norm.singular li,
#pageHolder #pageContent .featured li {
  float: left;
  margin-bottom: 25px;
  margin-bottom: 1.5625rem;
  padding: 0 !important;
  width: 100%;
}

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

#pageHolder #pageContent ul.newsList a:hover .overlay,
#pageHolder #pageContent .norm.singular a:hover .overlay,
#pageHolder #pageContent .featured a:hover .overlay {
  opacity: 1;
}

#pageHolder #pageContent ul.newsList .info,
#pageHolder #pageContent .norm.singular .info,
#pageHolder #pageContent .featured .info {
  float: left;
  width: 100%;
  padding: 35px 0 70px 0;
  padding: 2.1875rem 0 4.375rem 0;
  line-height: 1.2;
  position: relative;
}

#pageHolder #pageContent ul.newsList .info span,
#pageHolder #pageContent .norm.singular .info span,
#pageHolder #pageContent .featured .info span {
  display: block;
}

#pageHolder #pageContent ul.newsList .info .title,
#pageHolder #pageContent .norm.singular .info .title,
#pageHolder #pageContent .featured .info .title {
  margin: 20px 0 0 0;
  margin: 1.25rem 0 0 0;
}

#pageHolder #pageContent ul.newsList {
  margin-top: 70px;
  margin-top: 4.375rem;
}

#pageContent .pagination {
  width: 100%;
  display: block;
  margin: 20px 0 0 0;
  margin: 1.25rem 0 0 0;
  text-align: center;
  position: relative;
  z-index: 2;
  clear: both;
}

#pageContent .pagination a {
  display: inline-block;
  height: 40px;
  width: 40px;
  text-align: center;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  margin: 0 3px;
  margin: 0 0.1875rem;
  line-height: 40px;
  line-height: 2.5rem;
}

#pageContent .pagination a.previous,
#pageContent .pagination a.next {
  display: inline-block;
}

#pageContent .pagination a.next:hover, #pageContent .pagination a.previous:hover {
  cursor: pointer;
}

body.article #pageHolder {
  overflow: hidden;
}

body.article #pageHolder #pageContent {
  margin-right: 470px;
  margin-right: 29.375rem;
}

body.article #pageHolder #rightSidebar {
  float: right;
  width: 370px;
  width: 23.125rem;
  padding: 255px 0 0 60px;
  padding: 15.9375rem 0 0 3.75rem;
}

body.article #pageHolder #rightSidebar.mobile {
  display: none;
  width: 100%;
  padding: 45px 0 0 0;
  padding: 2.8125rem 0 0 0;
}

body.article #pageHolder #rightSidebar.mobile .sidebarList li {
  width: 45%;
  margin-left: 10%;
}

body.article #pageHolder #rightSidebar.mobile .sidebarList li:first-child {
  margin-left: 0;
}

body.article #pageHolder #rightSidebar .sidebarTitle {
  display: block;
  margin-bottom: 30px;
  margin-bottom: 1.875rem;
}

body.article #pageHolder #rightSidebar .sidebarList {
  margin: 0;
  padding: 0;
  list-style-type: none;
  float: left;
  width: 100%;
}

body.article #pageHolder #rightSidebar .sidebarList figure {
  float: left;
  width: 100%;
  margin: 0;
  height: 250px;
  height: 15.625rem;
  overflow: hidden;
  position: relative;
}

body.article #pageHolder #rightSidebar .sidebarList figure .enlarge {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
}

body.article #pageHolder #rightSidebar .sidebarList figure .overlay {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  opacity: 0;
}

body.article #pageHolder #rightSidebar .sidebarList figure .overlay span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  padding: 0;
}

body.article #pageHolder #rightSidebar .sidebarList li {
  float: left;
  margin-bottom: 25px;
  margin-bottom: 1.5625rem;
  padding: 0 !important;
  width: 100%;
}

body.article #pageHolder #rightSidebar .sidebarList li a {
  display: block;
  z-index: 5;
}

body.article #pageHolder #rightSidebar .sidebarList a:hover .overlay {
  opacity: 1;
}

body.article #pageHolder #rightSidebar .sidebarList .info {
  float: left;
  width: 100%;
  padding: 30px 0 50px 0;
  padding: 1.875rem 0 3.125rem 0;
  line-height: 1.2;
  position: relative;
}

body.article #pageHolder #rightSidebar .sidebarList .info span {
  display: block;
}

body.article #pageHolder #rightSidebar .sidebarList .info .title {
  margin: 20px 0 0 0;
  margin: 1.25rem 0 0 0;
}

  body.article #pageHolder:after {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  height: 100%;
  right: 0;
  width: auto;
  z-index: -2;
  margin-left: 280px;
  margin-left: 17.5rem;
}

@media (max-width: 767px) {
  #pageHolder #pageContent ul.newsList .info,
  #pageHolder #pageContent .featureRow .featured .info {
    padding: 35px 0 30px 0;
    padding: 2.1875rem 0 1.875rem 0;
  }
  #pageHolder #pageContent ul.newsList figure,
  #pageHolder #pageContent .featureRow .featured figure {
    height: 200px;
    height: 12.5rem;
  }
  body.article #pageHolder #rightSidebar.mobile {
    padding: 30px 0 0 0;
    padding: 1.875rem 0 0 0;
  }
  body.article #pageHolder #rightSidebar.mobile .container {
    padding: 0 5%;
  }
  body.article #pageHolder #rightSidebar.mobile .sidebarList li {
    width: 100%;
    margin-left: 0;
    margin-bottom: 0;
  }
}

@media all and (min-width: 768px) and (max-width: 1023px) {
  #pageHolder #pageContent ul.newsList li:nth-child(odd) {
    margin-left: 0;
  }
  #pageHolder #pageContent .featureRow .featured .info,
  #pageHolder #pageContent ul.newsList .info {
    padding: 35px 0 50px 0;
    padding: 2.1875rem 0 3.125rem 0;
  }
}

@media all and (min-width: 768px) and (max-width: 1300px) {
  #pageHolder #pageContent ul.newsList li {
    width: 45.7227%;
    margin-left: 8.5546%;
  }
  #pageHolder #pageContent ul.newsList li .info {
    padding: 35px 0 60px 0;
    padding: 2.1875rem 0 3.75rem 0;
  }
}

@media (max-width: 1023px) {
  #pageHolder #pageContent .featureRow .featured {
    width: 100%;
  }
  #pageHolder #pageContent .featureRow .norm.singular,
  body.article #pageHolder #rightSidebar,
  body.article #pageHolder:after {
    display: none;
  }
  #pageHolder #pageContent ul.newsList li:nth-child(1),
  body.article #pageHolder #rightSidebar.mobile {
    display: block;
  }
  body.article #pageHolder #pageContent {
    margin-right: 0;
  }
  #pageHolder #pageContent ul.newsList {
    margin-top: 25px;
    margin-top: 1.5625rem;
  }
}

@media all and (min-width: 1024px) and (max-width: 1300px) {
      #pageHolder #pageContent ul.newsList li:nth-child(odd) {
    margin-left: 0;
  }
}


@media (min-width: 1300px) {
  #pageHolder #pageContent ul.newsList li {
    width: 31.9587%;
    margin-left: 2.06195%;
  }
  #pageHolder #pageContent ul.newsList li:nth-child(3n+1) {
    margin-left: 0;
  }
}

@media all and (min-width: 1024px) and (max-width: 1400px) {
  body.article #pageHolder:after {
    width: calc(370px + 5%);
    left: auto;
  }
}


.searchBlock input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
 font-size:18px;
}
.searchBlock input::-moz-placeholder { /* Firefox 19+ */
 font-size:18px;
}
.searchBlock input:-ms-input-placeholder { /* IE 10+ */
 font-size:18px;
}
.searchBlock input:-moz-placeholder { /* Firefox 18- */
  font-size:18px;
}



/* line 61, ../scss/_search.scss */
body.search-results #pageHolder #pageContent, body.basket #pageHolder #pageContent { margin-right: 0!important; margin-left: 0!important; width: 100%; margin-top: -100px; margin-top: -6.25rem; padding: 75px; padding: 4.6875rem; }
/* line 67, ../scss/_search.scss */
body.search-results #pageHolder #pageContent:before, body.basket #pageHolder #pageContent:before { display: none; }
/* line 70, ../scss/_search.scss */
body.search-results #pageHolder #pageContent .row, body.basket #pageHolder #pageContent .row { width: 100%; float: left; padding: 35px 0 40px 0; padding: 2.1875rem 0 2.5rem 0; }
/* line 74, ../scss/_search.scss */
body.search-results #pageHolder #pageContent .row .column, body.basket #pageHolder #pageContent .row .column { float: left; line-height: 1.5; }
/* line 77, ../scss/_search.scss */
body.search-results #pageHolder #pageContent .row .column.subjects, body.basket #pageHolder #pageContent .row .column.subjects { width: 25%; padding-left: 30px; padding-left: 1.875rem; }
/* line 81, ../scss/_search.scss */
body.search-results #pageHolder #pageContent .row .column.courses, body.basket #pageHolder #pageContent .row .column.courses { width: 40%; }
/* line 84, ../scss/_search.scss */
body.search-results #pageHolder #pageContent .row .column.vacancies, body.basket #pageHolder #pageContent .row .column.vacancies { width: 35%; }
/* line 89, ../scss/_search.scss */
body.search-results #pageHolder #pageContent .row.titles, body.basket #pageHolder #pageContent .row.titles { padding-top: 0; padding-bottom: 40px; padding-bottom: 2.5rem; border-bottom-style: solid; border-bottom-width: 1px; }
/* line 94, ../scss/_search.scss */
body.search-results #pageHolder #pageContent .row.titles .column.subjects, body.basket #pageHolder #pageContent .row.titles .column.subjects { padding-left: 0; }
/* line 99, ../scss/_search.scss */
body.search-results #pageHolder #pageContent .column.courses .courseData, body.basket #pageHolder #pageContent .column.courses .courseData { margin-top: 5px; margin-top: 0.3125rem; }
/* line 102, ../scss/_search.scss */
body.search-results #pageHolder #pageContent .column.courses span.new, body.basket #pageHolder #pageContent .column.courses span.new { padding: 4px 5px; padding: 0.25rem 0.3125rem; margin-left: 12px; margin-left: 0.75rem; }
/* line 108, ../scss/_search.scss */
body.search-results #pageHolder #pageContent .column.vacancies span.number, body.basket #pageHolder #pageContent .column.vacancies span.number { float: left; }
/* line 110, ../scss/_search.scss */
body.search-results #pageHolder #pageContent .column.vacancies span.number span, body.basket #pageHolder #pageContent .column.vacancies span.number span { display: none; }
/* line 114, ../scss/_search.scss */
body.search-results #pageHolder #pageContent .column.vacancies .floatWrapper, body.basket #pageHolder #pageContent .column.vacancies .floatWrapper { float: right; margin-top: -10px; margin-top: -0.625rem; }
/* line 118, ../scss/_search.scss */
body.search-results #pageHolder #pageContent .column.vacancies a, body.basket #pageHolder #pageContent .column.vacancies a { display: block; float: left; height: 60px; height: 3.75rem; line-height: 60px; line-height: 3.75rem; width: 210px; width: 13.125rem; text-align: center; margin-right: 30px; margin-right: 1.875rem; }
/* line 126, ../scss/_search.scss */
body.search-results #pageHolder #pageContent .column.vacancies a.view, body.basket #pageHolder #pageContent .column.vacancies a.view { width: 115px; width: 7.1875rem; margin-right: 25px; margin-right: 1.5625rem; }
/* line 133, ../scss/_search.scss */
body.search-results #pageHolder #pageContent span.location, body.basket #pageHolder #pageContent span.location { margin-right: 40px; margin-right: 1.875rem; }
body.search-results #pageHolder #pageContent span.date, body.basket #pageHolder #pageContent span.date { margin-right: 40px; margin-right: 1.875rem; }
body.search-results #pageHolder #pageContent .cExcerpt, body.basket #pageHolder #pageContent .cExcerpt { margin-top:15px; }

    body.search-results .courseType a, body.basket .courseType a{font-family: "Montserrat", sans-serif;color: #000;-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;}
body.search-results .courseType a:hover, body.basket .courseType a:hover{font-family: "Montserrat", sans-serif;color: #e6941d}


/* line 139, ../scss/_search.scss */
body.basket #pageHolder #pageContent span.number { display: block; }

/* line 144, ../scss/_search.scss */
body.search-results.sitewide #pageHolder #pageContent { padding: 0; z-index: 20; }
/* line 148, ../scss/_search.scss */
body.search-results.sitewide .topSection:before { display: none; }
/* line 151, ../scss/_search.scss */
body.search-results.sitewide #pageHolder .mainTitle h1 { opacity: 0.3; }
/* line 154, ../scss/_search.scss */
body.search-results.sitewide #pageHolder .bgCircles { z-index: 10; right: -170px; right: -10.625rem; }
/* line 159, ../scss/_search.scss */
body.search-results.sitewide #pageHolder #pageContent .courseResults, body.search-results.sitewide #pageHolder #pageContent .pageResults { float: left; width: 46.2857%; }
/* line 162, ../scss/_search.scss */
body.search-results.sitewide #pageHolder #pageContent .courseResults h3, body.search-results.sitewide #pageHolder #pageContent .pageResults h3 { margin: 14px 0 85px 0; margin: 0.875rem 0 5.3125rem 0; }
/* line 165, ../scss/_search.scss */
body.search-results.sitewide #pageHolder #pageContent .courseResults ul, body.search-results.sitewide #pageHolder #pageContent .pageResults ul { margin: 0; padding: 0; list-style-type: none; line-height: 1.3; float: left; width: 100%; }
/* line 170, ../scss/_search.scss */
body.search-results.sitewide #pageHolder #pageContent .courseResults ul li, body.search-results.sitewide #pageHolder #pageContent .pageResults ul li { float: left; width: 100%; padding: 50px; padding: 3.125rem; margin-left: 0; margin-bottom: 35px; margin-bottom: 2.1875rem; }
/* line 176, ../scss/_search.scss */
body.search-results.sitewide #pageHolder #pageContent .courseResults ul li:before, body.search-results.sitewide #pageHolder #pageContent .pageResults ul li:before { display: none; }
/* line 180, ../scss/_search.scss */
body.search-results.sitewide #pageHolder #pageContent .courseResults ul li span.level, body.search-results.sitewide #pageHolder #pageContent .courseResults ul li span.type, body.search-results.sitewide #pageHolder #pageContent .pageResults ul li span.level, body.search-results.sitewide #pageHolder #pageContent .pageResults ul li span.type { display: block; }
/* line 183, ../scss/_search.scss */
body.search-results.sitewide #pageHolder #pageContent .courseResults ul li .title, body.search-results.sitewide #pageHolder #pageContent .pageResults ul li .title { margin-bottom: 20px; margin-bottom: 1.25rem; }
/* line 186, ../scss/_search.scss */
body.search-results.sitewide #pageHolder #pageContent .courseResults ul li a, body.search-results.sitewide #pageHolder #pageContent .pageResults ul li a { height: 60px; height: 3.75rem; line-height: 60px; line-height: 3.75rem; }
/* line 192, ../scss/_search.scss */
body.search-results.sitewide #pageHolder #pageContent .courseResults a.viewAll, body.search-results.sitewide #pageHolder #pageContent .pageResults a.viewAll { height: 60px; height: 3.75rem; line-height: 60px; line-height: 3.75rem; display: block; text-align: center; float: left; width: 100%; }
/* line 201, ../scss/_search.scss */
body.search-results.sitewide #pageHolder #pageContent .pageResults { float: right; }
/* line 203, ../scss/_search.scss */
body.search-results.sitewide #pageHolder #pageContent .pageResults ul li { padding: 50px 0 20px 0; padding: 3.125rem 0 1.25rem 0; }
/* line 207, ../scss/_search.scss */
body.search-results.sitewide #pageHolder #pageContent .pageResults { float: right; width: 51.4285%; padding: 20px 6%; padding: 1.25rem 6%; min-height: 500px; }
/* line 213, ../scss/_search.scss */
body.search-results.sitewide #pageHolder #pageContent .pagination { float: right; width: 51.4285%; margin: 40px 0 30px 0; margin: 2.5rem 0 1.875rem 0; height: auto; }


   body.search-results.sitewide #pageHolder #pageContent .courseResults ul li{background: #AB64FF;color:#00001e;} 
body.search-results.sitewide #pageHolder #pageContent .pageResults ul li {background-color:#00001e;color:white;}

body.search-results.sitewide #pageHolder #pageContent .courseResults ul li .title{color:#00001e}
body.search-results.sitewide #pageHolder #pageContent .pageResults ul li .title{color:white}
body.search-results.sitewide #pageHolder #pageContent .courseResults h3, body.search-results.sitewide #pageHolder #pageContent .pageResults h3 {

    margin: 2.3125rem 0 3.3125rem 0;
}

body.search-results.sitewide #pageHolder #pageContent .courseResults ul li a{color:#00001e !important; font-weight:bold !important}
body.search-results.sitewide #pageHolder #pageContent .pageResults ul li a {color:#FFFFFF !important; font-weight:bold !important}

body.search-results.sitewide #pageHolder #pageContent .pageResults ul li {
  padding: 3.125rem;
}
body.search-results.sitewide #pageHolder #pageContent .courseResults h3{color:white !important; }

body.search-results.sitewide #pageHolder #pageContent .courseResults a.viewAll{background-color:#00001e;color:white;}
body.search-results.sitewide #pageHolder #pageContent .courseResults a.viewAll:hover{background-color:#AB64FF;color:#00001e;}

@media all and (min-width: 768px) and (max-width: 1500px) { /* line 732, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row.titles .column.vacancies, body.basket #pageHolder #pageContent .row.titles .column.vacancies { display: none; }
  /* line 735, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row .column.subjects, body.basket #pageHolder #pageContent .row .column.subjects { width: 42%; padding-right: 40px; padding-right: 2.5rem; }
  /* line 740, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row .columnWrap, body.search-results #pageHolder #pageContent .row.titles .column.courses, body.basket #pageHolder #pageContent .row .columnWrap, body.basket #pageHolder #pageContent .row.titles .column.courses { width: 58%; float: left; }
  /* line 745, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row .column.courses, body.search-results #pageHolder #pageContent .row .column.vacancies, body.basket #pageHolder #pageContent .row .column.courses, body.basket #pageHolder #pageContent .row .column.vacancies { width: 100%; }
  /* line 748, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row.titles, body.basket #pageHolder #pageContent .row.titles { padding-right: 0; }
  /* line 752, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row .column.vacancies .floatWrapper, body.basket #pageHolder #pageContent .row .column.vacancies .floatWrapper { float: left; margin-top: 15px; margin-top: 0.9375rem; }
  /* line 756, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row .column.vacancies a, body.basket #pageHolder #pageContent .row .column.vacancies a { height: 45px; height: 2.8125rem; line-height: 45px; line-height: 2.8125rem; width: 160px; width: 10rem; margin-right: 18px; margin-right: 1.125rem; }
  /* line 761, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row .column.vacancies a.view, body.basket #pageHolder #pageContent .row .column.vacancies a.view { width: 90px; width: 5.625rem; }
  /* line 765, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row .column.vacancies span.number, body.basket #pageHolder #pageContent .row .column.vacancies span.number { display: block; width: 100%; margin-bottom: 15px; margin-bottom: 0.9375rem; font-style: italic; font-weight: 400; }
  /* line 771, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row .column.vacancies span.number span, body.basket #pageHolder #pageContent .row .column.vacancies span.number span { display: inline-block; margin-right: 4px; margin-right: 0.25rem; font-style: normal; }
  /* line 781, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent, body.basket #pageHolder #pageContent { padding: 60px 5%; padding: 3.75rem 5%; } }
@media (max-width: 1023px) { /* line 790, ../scss/_search.scss */
  body.search-results #pageHolder .lowerSection .container, body.basket #pageHolder .lowerSection .container { padding: 0; }
  /* line 793, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row.titles, body.basket #pageHolder #pageContent .row.titles { padding-left: 0; padding-right: 0; }
  /* line 797, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row, body.basket #pageHolder #pageContent .row { padding: 35px 5%; padding: 2.1875rem 5%; }
  /* line 800, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row .column.vacancies, body.basket #pageHolder #pageContent .row .column.vacancies { margin-top: 5px; margin-top: 0.3125rem; }
  /* line 802, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row .column.vacancies .floatWrapper, body.basket #pageHolder #pageContent .row .column.vacancies .floatWrapper { float: left; margin-top: 15px; margin-top: 0.9375rem; }
  /* line 806, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row .column.vacancies a, body.basket #pageHolder #pageContent .row .column.vacancies a { height: 45px; height: 2.8125rem; line-height: 45px; line-height: 2.8125rem; width: 160px; width: 10rem; margin-right: 18px; margin-right: 1.125rem; }
  /* line 811, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row .column.vacancies a.view, body.basket #pageHolder #pageContent .row .column.vacancies a.view { width: 90px; width: 5.625rem; }
  /* line 815, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row .column.vacancies span.number, body.basket #pageHolder #pageContent .row .column.vacancies span.number { display: block; width: 100%; margin-bottom: 15px; margin-bottom: 0.9375rem; font-style: italic; font-weight: 400; }
  /* line 821, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row .column.vacancies span.number span, body.basket #pageHolder #pageContent .row .column.vacancies span.number span { display: inline-block; margin-right: 4px; margin-right: 0.25rem; font-style: normal; }
  /* line 828, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent .row .column.subjects, body.basket #pageHolder #pageContent .row .column.subjects { padding-left: 0; }
  /* line 833, ../scss/_search.scss */
  body.search-results #pageHolder #pageContent, body.basket #pageHolder #pageContent { margin-top: 0; margin-bottom: 0; }
  /* line 839, ../scss/_search.scss */
  body.search-results.sitewide #pageHolder #pageContent .courseResults, body.search-results.sitewide #pageHolder #pageContent .pageResults, body.search-results.sitewide #pageHolder #pageContent .pagination { width: 100%; }
  /* line 842, ../scss/_search.scss */
  body.search-results.sitewide #pageHolder #pageContent .courseResults { padding: 0 5%; } }

header#masthead #scrolled.h-menu span.activator {cursor:hand;cursor:pointer}
header#masthead #scrolled.h-menu span.activator:hover {color:#ab64ff;}

#pageHolder #pageContent ul{margin-top:0px}
.tribe-events-schedule{display:block !important}

.stk--no-padding.stk-container{width:100% !important}
.tribe-events-l-container,#tribe-events-pg-template {
    padding-left: 0px !important;
    padding-right: 0px !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
    width: 100% !important;
    max-width: 100% !important;
}

@media (min-width: 1001px) 
{
	#pageHolder #pageContent .pgcsimplygalleryblock-slider-collection{height:450px !important;}
	#pageHolder #pageContent .pgcsimplygalleryblock-slider-slider-view{height:400px !important;}
	#pageHolder #pageContent .pgcsimplygalleryblock-slider-item-wrap img {
 		height:auto !important;
		top:0px !important
	}
}

@media (min-width: 701px) and (max-width: 1000px)
{
	#pageHolder #pageContent .pgcsimplygalleryblock-slider-collection{height:400px !important;}
	#pageHolder #pageContent .pgcsimplygalleryblock-slider-slider-view{height:350px !important;}
	#pageHolder #pageContent .pgcsimplygalleryblock-slider-item-wrap img {
 		height:auto !important;
		top:0px !important
	}
}

@media (min-width: 501px) and  (max-width: 700px)
{
	#pageHolder #pageContent .pgcsimplygalleryblock-slider-collection{height:300px !important;}
	#pageHolder #pageContent .pgcsimplygalleryblock-slider-slider-view{height:250px !important;}
	#pageHolder #pageContent .pgcsimplygalleryblock-slider-item-wrap img {
 		height:auto !important;
		top:0px !important
	}
}


@media (max-width: 500px)
{
	#pageHolder #pageContent .pgcsimplygalleryblock-slider-collection{height:250px !important;}
	#pageHolder #pageContent .pgcsimplygalleryblock-slider-slider-view{height:200px !important;}
	#pageHolder #pageContent .pgcsimplygalleryblock-slider-item-wrap img {
 		height:auto !important;
		top:0px !important
	}
}


 /* NEW STUFF */


header#masthead .basket2023{position: absolute;    right: 17rem;    top: 15px;	width:25px;	height:20px;}
header#masthead .searchTop2023{position: absolute;    right: 19.5rem;    top: 15px;	width:225px;	height:20px;}
header#masthead .searchTop2023 .searchInput{width:200px;background: #E5E5E5;border-radius: 30px;color:#292929;padding:8px;margin-top:-8px;border:none;outline:none;font-size:14px;    padding-left: 14px; font-weight: 700;}
header#masthead .searchTop2023 .searchInput::placeholder{color:#292929;    font-weight: 700;}

header#masthead .searchTop2023 .searchBTN{background:none !important;width:20px !important;height:20px !important;line-height:22px !important}
header#masthead .searchTop2023 .searchBTN i{color:#86378B !important;    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;}
header#masthead .searchTop2023 .searchBTN:hover i{color:#292929 !important}

@media all and (min-width:1024px)
{
header#masthead .headerMenu {right: 33rem;}
header#masthead .searchTop2023 .searchBTN i{font-size:16px;}
}

header#masthead .basket2023 i{line-height:20px;font-size:20px;color:#00001E}
header#masthead .basket2023:hover i{color:#FFFFFF}
  header#masthead .basket2023 #bNumber{position:absolute;top: -6px;right: -6px;width:20px;height:20px;line-height:18px;font-size:15px;text-align:center;border-radius:20px;background-color:#F7A200;color:#00001E;z-index:9999;font-weight: 600;}
header#masthead .basket2023:hover #bNumber{color:#ffffff;background-color:#00001E;}

        .careerCoach .holder .searchBlock{
    display: block;
    width: 100%;

    border-radius: 10px;
padding:20px;
background:#ab64ff;
}
 .careerCoach .holder .searchBlock .search.keyword input{ border-radius: 10px;border:none;width:calc(100% - 132px);font-size:14px; font-weight: 700;
padding:10px;}


.careerCoach .holder .searchBlock .search.keyword input::placeholder {
    font-size:14px !important; font-weight: 700;
}

@media all and (max-width:767px)
{
   .careerCoach .holder .searchBlock{
    display: block;
    width: 100%;

    border-radius: 10px;
padding:10px;
background: #ab64ff;
}

.searchBTN {    height: 2.4rem;line-height: 2.3rem;}

   .careerCoach .holder .searchBlock .search.keyword input{ border-radius: 10px;border:none;width:calc(100% - 125px);font-size:14px;border:none !important;outline:none !important;
padding:10px;}


.careerCoach .holder .searchBlock .search.keyword input::placeholder {
    font-size:14px !important;
}
}

.careerCoach .holder .searchBlock .search.keyword input:focus-visible {
    outline:none;
}
 .careerCoach .holder .searchBlock .search.keyword .searchBTN{
background-color:#fff;color:#00001E;border-radius: 25px;    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;    border: 1px solid #00001E;
}
.careerCoach .holder .searchBlock .search.keyword .searchBTN:hover{
background-color:#00001E;color:#ffffff;border-radius: 25px;
}

@media (min-width: 1024px)
{
body.fixedHeader header#masthead .logoHolder {

    top: 1.2rem !important;
}
body.fixedHeader header#masthead .logoHolder, body.fixedHeader header .logoHolder a {
    width: 207px !important;

    height: 60px !important;

}

body.fixedHeader nav#mainMenu {
   margin:0 !important; margin-top: 35px !important;
}
nav#mainMenu {margin-right:0px !important}

body.fixedHeader header#masthead .headerMenu ul {
    display:block !important;
    opacity:1  !important;
}
body.fixedHeader header#masthead .headerMenu #scrolled.h-menu {
    display: none !important;
    opacity: 0  !important;
}
body.fixedHeader header#masthead {height:100px !important}
}

@media (min-width: 1400px)
{
header#masthead .socialSearch {display:none !important}
nav#mainMenu ul {
    display: block;
}}

@media (min-width: 1024px) and (max-width: 1400px)
{
header#masthead .basket2023{right: 18rem;  }
header#masthead .searchTop2023{right: 21rem; }
header#masthead .socialSearch a.searchBTN.mobile {
    display: none !important;
}
header#masthead .socialSearch {margin-right: 0px !important;
    margin-top: 70px !important;}
body.fixedHeader header#masthead .socialSearch {margin-right: 0px !important;
    margin-top: 50px !important;}
header#masthead .headerMenu {
  margin-right: 0px !Important;
       top: 75px !Important;
    right: 100px !Important;
}

body.fixedHeader header#masthead .headerMenu {
  margin-right: 0px !Important;
       top: 55px !Important;
    right: 100px !Important;
}
}


@media (min-width: 768px) and (max-width: 1023px)
{
header#masthead .socialSearch a.searchBTN.mobile {

    position: absolute !important;
    top: -82px !important;
    right: 275px !important;
}
header#masthead .basket2023 {

    right: 17rem;

}

header#masthead .headerMenu {
    right: 4.5rem !important;
    top: 5.5rem !important;
    margin-right: 0px !important;
}
}
@media all and (max-width: 1023px)
{
header#masthead .searchTop2023{display:none !important}
}
@media all and (max-width: 767px)
{
header#masthead .socialSearch a.searchBTN.mobile {

    margin-right: 40px;
}
header#masthead .basket2023 {

    right: 5%;

}
}

@media (min-width: 1024px) and (min--moz-device-pixel-ratio: 2), (min-width: 1024px) and (-o-min-device-pixel-ratio: 2 / 1), (min-width: 1024px) and (-webkit-min-device-pixel-ratio: 2), (min-width: 1024px) and (min-device-pixel-ratio: 2), (min-width: 1024px) and (min-resolution: 192dpi), (min-width: 1024px) and (min-resolution: 2dppx)

{

	


}
@media all and (min-width: 1024px)
{
nav#mainMenu {

    margin-top: 3.25rem;
}
}

figure.C4Video  iframe{width:100% !important;height:550px !important;}
@media all and (max-width: 1023px)
{
figure.C4Video  iframe{width:100% !important;height:350px !important;}
}
header#masthead .headerMenu ul li a:hover, header#masthead .headerMenu ul li:hover > a{    color: #ab64ff !important;
}
     header#masthead .headerMenu ul li > a{
    color: #FFFFFF !important;
}
     header#masthead .headerMenu #scrolled  ul li > a{
    color: #00001E !important;
}
header#masthead .headerMenu ul li a.MaPbutton:hover, header#masthead .headerMenu ul li:hover > a.MaPbutton{    background-color: #ab64ff !important;
}

header#masthead .headerMenu ul li > a.MaPbutton{
    color: #00001e !important;
}
header#masthead .searchTop2023 .searchBTN i,header#masthead .basket2023 i {    color: #ab64ff !important;}
header#masthead .searchTop2023 .searchBTN i:hover,header#masthead .basket2023 i:hover {opacity:0.8 !important}
a.MaPbutton,#address .column a.contactBtn, header#masthead a.accessibility{background-color:white !important;color:#00001e !important}
header#masthead a.accessibility:hover{background-color:#ab64ff !important;color:#00001e !important}
nav#mainMenu ul li a{    color: #FFF !important;}
nav#mainMenu ul li a.active, nav#mainMenu ul li a:hover, nav#mainMenu ul li a:focus, nav#mainMenu ul li:hover > a{    color: #ab64ff  !important}

header#masthead .searchTop2023 .searchBTN:hover i {
        color: #ab64ff !important;

}
header#masthead .socialSearch a,header#masthead .socialSearch a:hover{
      color: #ab64ff !important;

}

a.MaPbutton:hover,#address .column a.contactBtn:hover, header#masthead a.accessibility:hover{background-color:#ab64ff !important;color:#00001e !important;text-decoration:none !important;}

#pageTitle h1{    color: #00001E;}

nav#mainMenu ul.pageMenu li a {
    color: #00001E !important;
}

#pageContent p a{text-decoration:underline !important}
#pageContent p a:hover{text-decoration:none !important}