@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500&display=swap');

/* HEADER */
header.hideff {
    display: block !important;
}

/* MARGINS */
@media screen and (min-width: 1200px){
	.rightpadding {
		padding: 15px 8% 3% 0;
	}
}

@media (min-width: 1500px){
	.container {
		max-width: 1400px !important;
	}
}

/* SUB NAV */
.sub-navigation {
    background-color: #f3f4f4 !important;
    color: #000000 !important;
}

.sub-navigation nav .nav-item {
    border: 1px solid #f3f4f4 !important;
}

@media screen and (min-width: 1200px){
	.sub-navigation nav .nav-item {
		margin: 10px 0!important;
	}
}

a.nav-item.nav-link {
    color: #767575 !important;
}

a.nav-item.nav-link.active {
    background-color: #f3f4f4!important;
    color: #000!important;
}

a.nav-item.nav-link:last-child {
	font-weight: 700;
}

/* BANNER */
div.sticky-header.is-sticky {
    animation: fadeOut 5s;
-webkit-animation: fadeOut 5s;
-moz-animation: fadeOut 5s;
-o-animation: fadeOut 5s;
-ms-animation: fadeOut 5s;
}

.padding-top-landing.shrink {
    padding-top: 60vh!important;
}

.services-banner.landing-page {
    background-position-x: 0%!important;
    background-size: contain;
    background-position-y: bottom!important;
    background-repeat: no-repeat;
    background-color: #212120 !important;
}

@media screen and (min-width: 769px) and (max-width: 789px){
	.services-banner.landing-page {
    background-position-x: 40%!important;
    background-size: 140% !important;
}

	.banner-content.studentsheading {
		display: none!important;
	}
}

@media screen and (min-width: 790px) and (max-width: 991px){
	.services-banner.landing-page {
		background-position-x: 28%!important;
		background-size: cover!important;
	}

	.banner-content.studentsheading {
		display: none!important;
	}
}

@media screen and (min-width: 992px) and (max-width: 1199px){
	.services-banner.landing-page {
		background-position-y: 128%!important;
	}
}

@media screen and (min-width: 1200px) and (max-width: 1245px){
	.services-banner.landing-page {
		background-position-x: 36%!important;
		background-size: 143%!important;
	}
	

}

@media screen and (min-width: 1246px) and (max-width: 1280px){
	.services-banner.landing-page {
		background-position-x: 36%!important;
		background-size: 139%!important;
	}
}

@media screen and (min-width: 1281px) and (max-width: 1350px){
	.services-banner.landing-page {
		background-position-x: 36%!important;
		background-size: 132%!important;
	}
}

@media screen and (min-width: 1351px) and (max-width: 1400px){
	.services-banner.landing-page {
		background-position-x: 36%!important;
		background-size: 124%!important;
	}
}

@media screen and (min-width: 1401px) and (max-width: 1470px){
	.services-banner.landing-page {
		background-position-x: 28%!important;
		background-size: 120%!important;
	}
}

@media screen and (min-width: 1471px) and (max-width: 1500px){
	.services-banner.landing-page {
		background-position-x: 21%!important;
		background-size: 114%!important;
	}
}

@media screen and (min-width: 1501px) and (max-width: 1570px){
	.services-banner.landing-page {
		background-position-x: 51%!important;
		background-size: 112%!important;
	}
}

@media screen and (min-width: 1571px) and (max-width: 1630px){
	.services-banner.landing-page {
		background-position-x: 55%!important;
		background-size: 107%!important;
	}
}

@media screen and (min-width: 1631px) and (max-width: 1700px){
	.services-banner.landing-page {
		background-position-x: 60%!important;
		background-size: 103%!important;
	}
}


@media screen and (min-width: 1200px) and (max-width: 1700px){ 
		.services-banner.landing-page.bigfor .banner__inner {
    height: 495px!important;
}
	
	.padding-top-landing {
    padding-top: 580px!important;
}
}

@media screen and (min-width: 1701px){ 
	.services-banner.landing-page.bigfor .banner__inner {
		height: 545px!important;
	}
	
	.padding-top-landing {
		padding-top: 640px!important;
	}
}

@media screen and (min-width: 1701px) and (max-width: 1740px){ 
.services-banner.landing-page {
    background-position-x: 50%!important;
    background-size: 113% !important;
}
}

@media screen and (min-width: 1741px) and (max-width: 1800px){ 
.services-banner.landing-page {
    background-position-x: 50%!important;
    background-size: 110% !important;
}
}

@media screen and (min-width: 1801px) and (max-width: 1892px){ 
.services-banner.landing-page {
    background-position-x: 50%!important;
    background-size: 106% !important;
}
}

div.sticky-header.is-sticky .services-banner .banner__inner .banner-content {
    top: 113px!important;
}


/* FONTS */
.banner-content.studentsheading a span {
    color: #02b58b !important;
}

h1.SLargeLight {
    font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif" !important;
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 2.5rem;
    margin-bottom: 20px;
}

h1, h3, h4, h5, h6, html, p, .container.sub-page-content li, table.datestable td {
    font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif" !important;
    font-style: normal;
}

.sub-page-content h2 {
    font-size: 1.6em;
    letter-spacing: .01em;
    text-transform: uppercase;
	font-family: 'Oswald', Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif" !important;
	margin-top: 10px;
}

.banner-content.studentsheading a {
	font-size: 1.6em;
    letter-spacing: .01em;
    text-transform: uppercase;
	font-family: 'Oswald', Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif" !important;
	color: #ffffff;
}

.container.sub-page-content p, .content-area p, .container.sub-page-content li, table.datestable td {
    font-size: 0.9rem!important;
    line-height: 1.5rem!important;
}

.container.sub-page-content ul li {
    font-weight: 400!important;
}

.sub-page-content h3 {
    color: #000 !important;
    font-size: 1.2em !important;
    font-weight: 700!important;
    line-height: 2.5em;
}

/* ELEMENTS - BUTTON */
a.studentbtn {
    border: 1px solid #000;
    padding: 5px 20px 7px;
    font-size: 1rem;
    color: #000;
    text-transform: uppercase;
    font-weight: 500;
	transition: 0.3s;
}

a.studentbtn:hover {
    border: 1px solid #000;
	background-color: #000000;
    color: #fff;
}

/* ELEMENTS - HR */
hr.students-hr {
    background: #02b58b !important;
    border: 1px solid #02b58b !important;
}

/* ELEMENTS - DIV BOXES */
.whitepadding {
	background-color: #ffffff;
	padding: 30px 40px;
	margin-bottom: 50px;
}

@media screen and (min-width: 900px){
	.whitepadding {
		min-height: 390px;
	}
}

/* ELEMENTS - LOGOS */
.imagelogo {
	height: 90px !important;
	padding-right: 14px;
}

.imagelogowide{
	height: 60px !important;
}

/* ELEMENTS - GRAD PROFILES */
.profile {
    position: relative;
}

.profileQuote {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 1.3rem;
    text-align: center;
    color: #ffffff;
	max-width: 302px;
	height: 386px;
	opacity: 0%;
}

.profile .profileQuote:hover {
    max-width: 302px;
	padding: 20px;
    margin: 10% auto;
	display: block;
	animation: fadeOut 10s;
-webkit-animation: fadeOut 10s;
-moz-animation: fadeOut 10s;
-o-animation: fadeOut 10s;
-ms-animation: fadeOut 10s;
}

.profile:hover img {
    filter: grayscale(100%) blur(3px);
	animation: fadeIn 0.5s;
  -webkit-animation: fadeIn 0.5s;
  -moz-animation: fadeIn 0.5s;
  -o-animation: fadeIn 0.5s;
  -ms-animation: fadeIn 0.5s;
}

.profileName {
    position: absolute;
    bottom: -50px;
    background: #000;
    color: #02b58b;
    padding: 0px 15px;
}

a .profileName h3 {
    color: #ffffff !important;
    margin-bottom: -10px;
    font-weight: 500 !important;
}

@keyframes fadeIn {
  0% { filter: grayscale(0%) blur(0);}
  100% { filter: grayscale(100%) blur(3px); }
}

@-moz-keyframes fadeIn {
  0% { filter: grayscale(0%) blur(0); }
  100% { filter: grayscale(100%) blur(3px); }
}

@-webkit-keyframes fadeIn {
  0% { filter: grayscale(0%) blur(0); }
  100% { filter: grayscale(100%) blur(3px); }
}

@-o-keyframes fadeIn {
  0% { filter: grayscale(0%) blur(0); }
  100% { filter: grayscale(100%) blur(3px); }
}

@-ms-keyframes fadeIn {
  0% { filter: grayscale(0%) blur(0); }
  100% { filter: grayscale(100%) blur(3px); }
}

@keyframes fadeOut {
0% { opacity: 0% }
	20% { opacity: 100% }
  100% { opacity: 100% }
}
@-webkit-keyframes fadeOut {
0% { opacity: 0% }
	20% { opacity: 100% }
  100% { opacity: 100% }
}
@-moz-keyframes fadeOut {
0% { opacity: 0% }
	20% { opacity: 100% }
  100% { opacity: 100% }
}
@-o-keyframes fadeOut {
0% { opacity: 0% }
	20% { opacity: 100% }
  100% { opacity: 100% }
}
@-ms-keyframes fadeOut {
0% { opacity: 0% }
	20% { opacity: 100% }
  100% { opacity: 100% }
}

/* TABLE DESIGN */
table.datestable tr td {
    border-top: 0px solid #fff !important;
    border-bottom: 10px solid #fff;
}

table.datestable tr td:first-child {
    border-left: 0px solid #02b58b !important;
    font-weight: 700;
    padding-left: 0px !important;
	text-transform: inherit !important;
}

/* COLOURS */
.yellow {
    background-color: #f6fbfe !important;
    color: #000;
}

.black {
    background-color: #f3f4f4  !important;
    color: #000;
}

.yellow hr.students-hr {
    background: #02b58b !important;
    border: 1px solid #02b58b !important;
}

/* REMOVE EXTRA DIV */
.row.test {
    display: none;
}

/* FOOTER */
section#student-footer {
    background: #f4f5f5;
}