/* ============== TABLE OF CONTENTS ============== */

/* HOMEPAGE COMPONENTS
__General
__Hero Text and Heading
__Our Services
__Our Courses
__Our Partners
__Contact Us
*/

/* ================================================ */


/* || HOMEPAGE COMPONENTS */

/* ===== General ===== */

p, 
h1 {
	margin-bottom: 0;
}

img {
	vertical-align: unset;
}

h3 {
	font-size: 19px;
	margin-bottom: unset;
	font-weight: bold;
}


/* ===== Hero text and heading ===== */

.hero__text {
	background-color: rgb(246, 100, 43);
	background-color: rgba(246, 100, 43, 0.7); /* Dark Orange */
    color: #FFF; /* White */;
    text-align: center;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
	font-size: var(--XXSmallFont);
}

.hero__heading {
	padding: 1rem;
    font-size: 1.8rem;
    line-height: 1.2;
}

@media (min-width: 992px) {
	.hero__heading {
		font-size: 3rem;
		word-spacing: 3px;
	}
}


/* ===== Our Services ===== */

.services {
	font-size: var(--SmallFont);
	padding-top: 1.25rem;
}
	
.services__heading {
	text-align: center;
	padding: 0.625rem;
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
	background-color: #CCC; /* Light Gray */
}

@media (min-width: 992px) {
	.services__heading {
		font-size: var(--XXLargeFont);
		margin: 2.5rem auto 0.3125rem;
	}
}

.services__gallery img {
	display: block;
	margin-bottom: 0.5rem;
}

@media (min-width: 551px) and (max-width: 991px) {
	.services__gallery {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		    -ms-flex-pack: justify;
		        justify-content: space-between;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap;
	}
	.services__gallery a {
		width: 48%;
		margin: 0.625rem 0.313rem 0.313rem;
	}
}

@media (min-width: 992px) {
	.services__gallery {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}
	.services__gallery a {
		margin: 0.313rem;
	}
}


/* ===== Our Courses ===== */

.courses {
	margin-top: 3rem;
	margin-bottom: 3rem;
}

@media (min-width: 992px) {
	.courses {
		margin-top: 6rem;
		margin-bottom: 6rem;
	}
}

.courses__heading {
	margin-bottom: 2rem;
}

@media (min-width: 992px) {
	.courses__heading {
		font-size: var(--XXLargeFont);
	}
}

.courses__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-template-rows: repeat(2, 1fr);
	grid-column-gap: 0;
	grid-row-gap: 0.625rem;
}

@media (min-width: 500px) and (max-width: 949px) {
	.courses__grid {
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: repeat(2, 1fr);
		grid-column-gap: 0.313rem;
		grid-row-gap: 0.313rem;
	}
}

@media (min-width: 950px) {
	.courses__grid {
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: repeat(3, 1fr);
		grid-column-gap: 0.625rem;
		grid-row-gap: 0.625rem;
		margin: 0 1.25rem;
	}
}

.courses__grid h3 { 
	font-size: 0.688rem;
	font-family: 'Fira Sans Bold';
}

@media (min-width: 600px) {
	.courses__grid h3 { 
		font-size: var(--Medium);
	}
	
}

.courses__grid img {
	display: block;
	max-width: 100%;
}

.courses__grid a {
	overflow: hidden;
}

.courses__grid figure {
	transition: transform 0.2s;
}

.larger:hover {
	transform: scale(1.02); 
}

.courses__container {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: space-evenly;
	    -ms-flex-pack: space-evenly;
	        justify-content: space-evenly;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	width: 80%;
	margin: 3rem auto;
	background-color: rgb(248, 149, 29);
	padding: 1.25rem;
	gap: 0.625rem;
}

.courses__container div {
	flex-basis: 49%;
}

.courses__container img {
	border-radius: 30px;
}

.courses__text__box {
	color: #FFF; /* White */
    font-size: var(--SmallFont);
    padding: 1.25rem;
    text-align: center;
    border-radius: 30px;
    border: 3px solid #FFF; /* White */
    font-family: 'Fira Sans Bold';
	transform: translate(13%, 0);
	background-color: rgb(248, 149, 29);
}

@media (min-width: 992px) and (max-width: 1350px) {
	.courses__text__box {
		transform: unset;
	}
}

.courses__text__box p {
    font-size: var(--SmallFont);
	font-family: 'Fira Sans Regular';
    text-align: center;
}

.courses__text__container {
	margin: 1.5rem auto 0;
	background-color: rgb(248, 149, 29);
}

.courses__text__inner {
	color: #FFF; /* White */
    font-size: var(--SmallFont);
    padding: 1.25rem;
    text-align: center;
    border-radius: 30px;
    border: 3px solid #FFF; /* White */
    font-family: 'Fira Sans Bold';
	width: 80%;
	margin: 1.25rem auto;
}

.courses__text__inner p {
	font-family: 'Fira Sans Regular';
}

picture img {
	max-width: 100%;
}

figure {
    margin: 0 0.3125rem;
}

@media (min-width: 500px) {
	figure {
		margin: 0;
	}
}	

.grid-overlay-text {
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.51);
    color: #FFFFFF;
    text-transform: uppercase;
    text-align: left;
    padding: 0.3125rem 0.625rem;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 25%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.photo-1,
.photo-2,
.photo-3 {
	position: relative;
}



.slider-outer {
	height: 180px;
	margin: 0 auto 250px;
}

.slider-outer p {
	text-align: center;
}

.button-control {
	position: absolute;
	top: 18%;
	color: rgb(248, 149, 29);
	width: 120px;
	height: 300px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.button--back {
	left: 3%;
}

.button--next {
	right: 3%;
}

.button--back:hover,
.button--next:hover {
	color: #E86424;
}

.carousel-item {
	padding: 32px;
}

.carousel-text-wrapper {
	color: #FFF; /* White */
	font-size: var(--SmallFont);
	padding: 20px;
	text-align: center;
	border-radius: 30px;
	border: 3px solid #FFF; /* White */
	font-family: 'Fira Sans Bold';
	background-color: rgb(248, 149, 29);
	width: 80%;
}

.carousel-text-wrapper p:nth-child(1){
	font-style: italic;
}

.carousel-text-wrapper p:nth-child(2){
	margin-top: 0.75rem;
}

.carousel-item .courses__container {
	min-height: 300px;
	margin:0 auto; 
	padding-top: 56px; 
	padding-bottom: 30px;
}

.carousel-p {
	position: absolute; 
	left: 15%; 
	top: 13%; 
	color: #FFF; /* White */
	font-size: 22px;
	text-transform: uppercase;
}

@media (min-width: 1081px) {
	.carousel-p {
		font-size: 24px;
	}
}

.container-quote {
	flex-basis: 65% !important;
}

@media (max-width: 1048px) {
	.slider-outer.hide-for-mobile {
		display: none !important;
	}
}

@media (min-width: 1049px) {
	.hide-for--desktop {
		display: none !important;
	}
}

@media (max-width: 1322px) {
	.hide-for-mobile--text {
		display: none !important;
	}
}

@media (min-width: 1323px) {
	.hide-for-desktop--text {
		display: none !important;
	}
}


/* ===== Our Partners ===== */

.partners {
	text-align: center;
	margin-bottom: 3rem;
}

.partners__heading {
	margin-bottom: 2rem;
}

@media (min-width: 992px) {
	.partners__heading {
		font-size: var(--XXLargeFont);
	}
}


/* ===== Contact Us ===== */

.contact {
	margin-bottom: 3rem;
}

.contact__heading {
	text-align: center;
	padding: 0.625rem;
	margin-bottom: 0;
	background-color: #CCC; /* Light Gray */
}

@media (min-width: 992px) {
	.contact__heading {
		font-size: var(--XXLargeFont);
	}
}

@media (min-width: 992px) {
	.contact__main {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		    -ms-flex-pack: justify;
		        justify-content: space-between;
	}
}	

.contact__main__div {
	text-align: center;
}

.contact__main__div section {
	text-transform: capitalize;
	margin: 0.75rem 0;
}

.contact__main__div > section > h3 {
	font-size: var(--SmallFont);
	font-family: 'Fira Sans Bold';
	margin-top: 0.3125rem;
}

.contact__main__div > section > p {
	font-size: var(--SmallFont);
	margin: 0.3125rem 0;
} 

@media (min-width: 992px) {
	.contact__main__div {
		width: 30%;
		text-align: left;
		padding: 0.625rem 0 0 5rem;
		margin: 1rem;
	}

	.contact__main__div div {
		margin-top: auto;
		margin-bottom: 0.75rem;
	}

	.contact__div--pd {
		padding: 0.625rem 0;
	}

	 .contact__main__div .contact--section {
		margin-top: 2.375rem;
	}	
}

.contact__main__div--bg {
	background-image: url("../img/map.png");
	background-position: center;
	background-size: cover;
	height: 45vh;
	min-height: 400px;
	position: relative;
}

@media (min-width: 768px) and (max-width: 991px) {
	.contact__main__div--bg {
		height: 35vh;
	}
}

@media (min-width: 992px) {
	.contact__main__div--bg {
		width: 34%;
		height: unset;
	}
}

.contact__main__overlay {
	background-color: rgb(249, 140, 30);
	background-color: rgba(249, 140, 30, 0.51); /* Orange */
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

.contact__main__cta {
	text-align: center;
	color: #FFF; /* White */
	background-color: #F98C1E; /* Orange */
	border: 3px solid #FFF; /* White */
	border-radius: 30px;
	height: 70%;
	width: 90%;
}

@media (min-width: 992px) {
	.contact__main__cta {
		transform: translate(-25%, 0);
		width: unset;
	}
}

.contact__main__heading {
	font-size: var(--LargeFont);
	font-family: 'Fira Sans Bold';
	margin-bottom: -0.3125rem;
	margin-top: 0.3125rem;
}
 
.contact__main__inner {
	max-width: 85%;
	padding: 1.25rem 0;
	gap: 1.5rem;
}

.contact__icons {
	margin: 1.875rem 0;
}

@media (min-width: 992px) {
	.contact__icons {
		margin: 0;
	}
}

.contact__icons-a {
	margin: 0.625rem;
}

@media (min-width: 992px) {
	.contact__icons-a:first-child {
		margin-left: 0;
	}
}

.contact__footer {
	background-color: #E86424; /* Dark Orange */
	color: #FFF; /* White */
	text-align: center;
	padding: 0.625rem 0;
	margin: 0.625rem 0 1.5625rem;
}

 @media (min-width: 992px) {
	.contact__footer {
		margin: 0 0 1.5625rem;
	}
}

.contact__footer-p {
	margin: 0.625rem auto;
	width: 80%;
}

@media (min-width: 992px) {
	.contact__footer-p {
		width: 32%;
	}
}