/* CSS Document */

/*########################################
## Body
########################################*/
body {padding: 0; margin: 0; width: 100%; font-family: 'Manrope', sans-serif; font-size: 18px; font-weight: 400; color: #333; line-height: 1.6em; min-width: 320px;}

/*########################################
## Typography
########################################*/
h1, h2, h3, h5, h5, li, ol, a, p {padding: 0; margin: 0;}
h1, h2, h3, h5 {font-weight: 700; line-height: 1.2em;}
h1, h2 {font-size: 60px;}
.home h1 span, .home h2 span {font-size: 18px; color: #FDBF26; letter-spacing: 3px; display: block; line-height: 1em;}
h3 {font-size: 28px;}
h5 {font-size: 18px; color: #FDBF26; letter-spacing: 3px;}
p, li {letter-spacing: 0.5px;}
a {text-decoration: none;}

/*########################################
## Layouts
########################################*/
.screen-reader-text {display: block; width: .1px; height: .1px; overflow: hidden; padding: 0 !important; margin: 0 !important;}
.container {width: 100%; max-width: 1620px; padding: 0 10px; box-sizing: border-box; margin: 0 auto;}
.block {display: block;}

/*########################################
## Forms
########################################*/
/*contact form messages*/
form .messages p {display: none; font-family: "Open Sans", sans-serif!important; font-weight: 400 !important;letter-spacing: 0 !important;font-size: 16px !important;}
form .loading {display: none;}
form .alert {padding: 15px !important;margin-bottom: 20px;border: 1px solid transparent !important;border-radius: 4px !important;}
form .alert-success {color: #3c763d !important;background-color: #dff0d8 !important;border-color: #d6e9c6 !important;}
form .alert-danger {color: #a94442 !important;background-color: #f2dede !important;border-color: #ebccd1 !important;}
form input:focus, form select:focus, form textarea:focus {outline: none;}

/*contact form*/
.ctc-form .one-half {display: flex; column-gap: 10px;}
.ctc-form .one-half .half {width: 100%;}
.ctc-form label {font-family: 'Manrope', sans-serif; font-size: 18px; font-weight: 400; color: #333; line-height: 1.2em; display: block;}
.ctc-form input[type="text"]::placeholder, .ctc-form textarea::placeholder {color: transparent !important;}
.ctc-form input[type="text"], .ctc-form textarea {font-family: 'Manrope', sans-serif; font-size: 16px; font-weight: 400; color: #333; display: block; padding: 10px; box-sizing: border-box; border: 1px solid #333; border-radius: 0; width: 100%; margin-bottom: 10px;}
.ctc-form input[type="text"] {height: 50px;}
.ctc-form textarea {height: 140px;}
.ctc-form button {border: none; margin: 30px auto 0; display: block; width: 125px;}
.ctc-form .checkbox-wrapper {display: flex; flex-direction: column; row-gap: 10px; margin-bottom: 10px;}
.ctc-form .recap {display: inline-block;}
.ctc-form .ctc-hide {display: block; margin-bottom: 5px;}
.g-recaptcha > div {margin: 20px auto 0;} 

/*########################################
## Button
########################################*/
.btn, .contactForm input[type=submit] {font-size: 18px; font-weight: 700; color: #FFF; background: #549D35; border-radius: 5px; display: block; width: 100%; max-width: 200px; padding: 11px 20px; box-sizing: border-box; text-align: center; transition: all 0.5s ease;}
.btn:hover, .contactForm input[type=submit]:hover {background: #FDBF26;}

/*########################################
## Header
########################################*/
header {position: sticky; top: 0; width: 100%; z-index: 999;}
#header {background: #FFF;}
#header .container {display: flex; justify-content: space-between; align-items: center;}
#header .logo {width: 27.75%;}
#header .logo img {display: block; width: 100%;}
#header .content-right {width: 62.81%;}
#header .info-button {display: flex; justify-content: flex-end; align-items: center; gap: 65px; border-bottom: 1px solid #D6D6D6; padding: 10px 0;}
#header .info-button .phone {display: flex; align-items: center; gap: 15px;}
#header .info-button .phone i {font-size: 20px; color: #549D35; line-height: 1.2em;}
#header .info-button .phone a {font-size: 30px; font-weight: 700; color: #333; line-height: 1.2em;}
#header .info-button .social a {display: block;}
#header .info-button .social i {font-size: 30px; color: #333; line-height: 1.2em;}
#header .info-button .button .btn {width: 200px;}
#header nav #pull {display: none; cursor: pointer;}
#header nav {width: 100%; margin: 0 auto; padding: 0;}
#header nav ul {padding: 0; margin: 0; list-style: none; display: flex; justify-content: flex-end; align-items: center; gap: 85px;}
#header nav ul li {padding: 0; margin: 0;}
#header nav ul li a {display: inline-block; font-weight: 700; font-size: 16px; line-height: 120%; padding: 30px 0 25px; text-transform: uppercase; color: #333; transition: all .3s linear; position: relative;}
#header nav ul li a::after {content: ""; background: #549D35; height: 4px; width: 100%; position: absolute; top: 0; left: 0; transform: scaleX(0); transform-origin: center; transition: all .3s linear;}
#header nav ul li a.active-menu, #header nav ul li a:hover {color: #549D35;}
#header nav ul li a.active-menu::after, #header nav ul li a:hover::after {transform: scaleX(1);}
#header .navigation .mobile-phone {display: none; font-size: 12px; background: #549D35; color: #FFF; width: 32px; height: 32px; border-radius: 50%; position: absolute; top: 7px; right: 60px; z-index: 9999;}
#header .mobile-btn {position: absolute; top: 9px; right: 105px; z-index: 9999; padding: 0 5px; max-width: 70px; font-size: 14px; display: none;}

/*########################################
## Banner
########################################*/
#banner {position: relative;}
#banner .main-banner {background: url('../images/content/main-banner-background-3.webp') no-repeat; background-size: cover; position: relative;}
#banner .main-banner .container {max-width: 100%; padding: 0; display: flex; align-items: center;}
#banner .main-banner .left-image {width: 58.22%; position: relative;}
#banner .main-banner .left-image img {display: block; width: 100%;}
#banner .main-banner .right-content {width: 41.78%; padding: 0 60px 0 30px; box-sizing: border-box; color: #FFF;}
#banner .main-banner .wrapper {max-width: 531px; margin-left: auto; position: relative;}
#banner .main-banner .wrapper h2 {font-size: 80px; line-height: 1.1em; margin-bottom: 25px;}
#banner .main-banner .wrapper p {font-size: 24px; line-height: 1.6em;}
#banner .inner-banner {background: radial-gradient(circle at 28% 18%, rgba(70,168,224,0.45) 0%, rgba(70,168,224,0) 50%), linear-gradient(215deg, #46A8E0 5%, #1D58A3 95%); height: 180px; display: flex; flex-direction: column; justify-content: center;}
#banner .inner-banner img {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;}
#banner .inner-banner h1 {color: #FFF; text-align: center; position: relative; z-index: 5;}

/*########################################
## Home Page Content
########################################*/
#mission {background: radial-gradient(circle at 28% 18%, rgba(70,168,224,0.45) 0%, rgba(70,168,224,0) 50%), linear-gradient(215deg, #46A8E0 5%, #1D58A3 95%); padding: 90px 0 280px; color: #FFF; text-align: center; position: relative;}
#mission .container {max-width: 920px;}
#mission h1 {margin-bottom: 25px;}
#mission h1 span {margin-bottom: 15px;}
#mission .btn {margin: 40px auto 0;}
#about {background: #FBFBFE;}
#about .container {max-width: 1640px;}
#about .content-wrapper {padding: 90px 90px 90px 125px; background: #FFF; border-radius: 10px; box-shadow: 5px 5px 30px 5px rgba(0,0,0,0.05); display: flex; justify-content: space-between; align-items: center; margin-top: -140px; position: relative; z-index: 10;}
#about .content-wrapper .content-left, #about .content-wrapper .image-right {width: 45.55%;}
#about .content-wrapper .content-left h2 span {margin-bottom: 20px;}
#about .content-wrapper .content-left h2 {margin-bottom: 45px;}
#about .content-wrapper .content-left .btn {margin-top: 60px;}
#about .content-wrapper .image-right img {display: block; width: 100%;}
#services {background: #FBFBFE; padding: 85px 0 110px; text-align: center;}
#services h2 span {margin-bottom: 20px;}
#services h2 {margin-bottom: 25px;}
#services p {max-width: 800px; margin: 0 auto;}
#services .box-wrapper {display: flex; justify-content: space-between; margin: 70px 0 45px;}
#services .box-wrapper .box {width: 31.25%; padding: 75px 45px 50px 45px; box-sizing: border-box; background: url('../images/content/academic-scholarships.webp') no-repeat; background-size: cover; color: #FFF; display: flex; flex-direction: column-reverse; position: relative;}
#services .box-wrapper .financial {background: url('../images/content/financial-assistance.webp') no-repeat; background-size: cover;}
#services .box-wrapper .volunteer {background: url('../images/content/volunteer-engagement.webp') no-repeat; background-size: cover;}
#services .box-wrapper .box:hover {flex-direction: column;}
#services .box-wrapper .box:before{content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.6) 20%, rgba(0, 0, 0, 0) 40%); z-index: 1;}
#services .box-wrapper .box:hover::before {background: rgba(0, 0, 0, 0.8);}
#services .box-wrapper .box:hover .offset {opacity: 0;}
#services .box-wrapper .box .offset {position: absolute; bottom: 45px; left: 0; right: 0;}
#services .box-wrapper .box h3 {z-index: 5;}
#services .box-wrapper .box h3 span {display: block;}
#services .box-wrapper .box hr {border: none; background: #FDC027; width: 64px; height: 7px; margin: 20px auto;}
#services .box .hover {opacity: 0; transition: all 0.5s ease; position: relative; z-index: 5;}
#services .box:hover .hover {opacity: 1;}
#services .box:hover h3 {position: relative; bottom: 0;}
#services .btn {margin: 0 auto;}

/*########################################
## Footer
########################################*/
footer {position: relative;}
#footer {background: radial-gradient(circle at 28% 18%, rgba(70,168,224,0.45) 0%, rgba(70,168,224,0) 50%), linear-gradient(215deg, #46A8E0 5%, #1D58A3 95%); color: #FFF; padding-bottom: 80px;}
#footer a {color: #FFF;}
#footer .top-section {padding: 30px 0 20px; border-bottom: 2px solid #46A8E0; display: flex; justify-content: space-between; align-items: flex-end;}
#footer .top-section .logo, #footer .top-section .social {width: 14.49%;}
#footer .top-section .text-wrapper, #footer .top-section .social {padding-bottom: 50px;}
#footer .top-section .logo img {display: block; width: 100%;}
#footer .top-section .text-wrapper {max-width: 720px; text-align: center;}
#footer .top-section .social {text-align: right;}
#footer .top-section .social a {display: block;}
#footer .top-section .social i {font-size: 40px; line-height: 1em;}
#footer .bottom-section {display: flex; justify-content: space-between; align-items: center; padding: 60px 0 70px; border-bottom: 2px solid #46A8E0;}
#footer .bottom-section .phone a {font-size: 30px; font-weight: 700;}
#footer .bottom-section .copyright a, #footer .bottom-section .copyright p {font-size: 16px; text-align: right;}
#footer .bottom-section .copyright p span {display: block;}

/*########################################
## Inner Pages
########################################*/

/*########################################
## About Us Page
########################################*/
.about-page .mission {background: #FBFBFD; padding-top: 50px;}
.about-page .mission .content-wrapper {background: #FFF; border-radius: 10px; box-shadow: 5px 5px 30px 5px rgba(0,0,0,0.05); padding: 100px 115px; display: flex; justify-content: space-between; align-items: center; position: relative; margin-bottom: -120px; z-index: 5;}
.about-page .mission .content-left, .about-page .mission .image-right {width: 46.71%;}
.about-page .mission .content-left h2 {font-size: 45px; margin-bottom: 30px;}
.about-page .mission .image-right img {display: block; width: 100%;}
.about-page .team {background: #EEE; padding: 225px 0 105px; position: relative; text-align: center;}
.about-page .team h5 {margin-bottom: 10px;}
.about-page .team .members {display: flex; justify-content: space-between; margin-top: 55px;}
.about-page .members .member {width: 18.18%; text-align: left;}
.about-page .members .member h3 {margin: 25px 0 5px;}
.about-page .members .member p {line-height: 1.2em;}
.about-page .members .member img {display: block; width: 100%;}

/*########################################
## Services Page
########################################*/
.services-page #content {padding-bottom: 125px;}
.services-page .entry-section {padding: 50px 0; text-align: center;}
.services-page .entry-section .container {max-width: 1160px;}
.services-page .entry-section p {font-size: 24px; line-height: 1.6em;}
.services-page .services-wrapper .container {max-width: 1420px; display: flex; flex-direction: column; gap: 80px;}
.services-page .services-wrapper .service {display: flex; justify-content: space-between; align-items: center;}
.services-page .services-wrapper .reverse {flex-direction: row-reverse;}
.services-page .service .content-left, .services-page .service .image-right {width: 45.71%;}
.services-page .service .content-left h2 {margin-bottom: 30px;}
.services-page .service .image-right img {display: block; width: 100%;}

/*########################################
## Accordion Inner Pages
########################################*/
.accordion .title {padding: 10px 20px; box-sizing: border-box; background: #FFF; margin-top: 15px; position: relative; box-shadow: 1px 1px 3px #333; transition: all .3s linear;}
.accordion .title:hover {background: #8EC449;}
.accordion .title:hover h3 {color: #FFF;}
.accordion .title h3::after {content: "+"; position: absolute; right: 15px; transition: all .3s linear;}
.accordion .title h3.open::after {content: "-";}
.accordion .title h3 {cursor: pointer; font-size: 20px; color: #8EC449; text-shadow: 1px 1px 1px #333;}
.accordion .acc-content {background: #FFF; padding: 15px 20px; box-sizing: border-box; box-shadow: 0 0 1px #333;}

/*########################################
## Contact Us Page
########################################*/
.contact-page #content {padding: 50px 0;}
.contact-page #content .container {max-width: 980px;}

/*########################################
## Apply Here Page
########################################*/
.apply-page #content {padding: 50px 0;}
.apply-page #content .container {max-width: 980px;}
.apply-page #content p {margin-bottom: 30px; text-align: center;}

/*########################################
## Gallery Page
########################################*/
.galBox {margin-top: 20px; padding: 20px; box-sizing: border-box; box-shadow: 2px 2px 8px #DDD;}
.galBox h3 {font-size: 20px; margin-bottom: 15px; text-align: center;}

.gallery {display: flex; display: -webkit-flex; justify-content: center; align-items: center; flex-wrap: wrap;}
.gallery li {width: 19.3%; padding: 3px; box-sizing: border-box; border: 1px solid #AAA; margin: 3px; border-radius: 3px; transition: all .3s linear;}
.gallery li a {overflow: hidden; display: block;}
.gallery li img {transition: all .3s linear; display: block; width: 100%; height: 200px; object-fit: cover;}
.gallery li:hover {background: #FF9124;}
.gallery li:hover img {transform: scale(1.1);}
.page_navigation {display: flex; display: -webkit-flex; justify-content: center; align-items: center;}
.page_navigation a {font-size: 12px; font-weight: 600; color: #1f1f1f; background: #FF9124; padding: 3px 5px; margin: 0 2px;}
.page_navigation a:hover {color: #FFF !important; text-shadow: 1px 1px 1px #1f1f1f;}

/*########################################
## Thank You Page
########################################*/
.thank-you-page #content {padding: 100px 0; text-align: center;}
.thank-you-page #content a {display: inline-block;}
.thank-you-page #content img {display: block; margin: 0 auto;}
.thank-you-page #content p {font-size: 22px; line-height: 1.2em; margin: 40px 0;}

/*########################################
## Responsive
########################################*/
@media screen and (max-width: 1600px) {
	#banner .main-banner .right-content {padding: 0 30px 0 20px;}
	#banner .main-banner .wrapper {max-width: 485px;}
	#banner .main-banner .wrapper h2 {font-size: 60px;}
	#banner .main-banner .wrapper p {font-size: 22px;}
	.about-page .mission .content-wrapper {padding: 80px 95px; align-items: flex-start;}
}

@media screen and (max-width: 1480px) {
	#header nav ul {gap: 70px;}
}

@media screen and (max-width: 1366px) {
	h1, h2, #banner .main-banner .wrapper h2 {font-size: 50px;}
	h3 {font-size: 24px;}
	.btn {max-width: 180px;}
	#header .info-button {gap: 55px;}
	#header .info-button .phone i {font-size: 16px;}
	#header .info-button .phone a {font-size: 25px;}
	#header .info-button .social i {font-size: 27px;}
	#header .info-button .button .btn {padding: 10px 15px; width: 160px;}
	#header nav ul {gap: 50px;}
	#header nav ul li a {padding: 25px 0 20px;}
	#banner .main-banner .wrapper {max-width: 325px;}
	#mission {padding: 80px 0 200px;}
	#about .content-wrapper {margin-top: -100px; padding: 80px; align-items: flex-start;}
	#about .content-wrapper .content-left h2 span {margin-bottom: 15px;}
	#about .content-wrapper .content-left h2 {margin-bottom: 25px;}
	#about .content-wrapper .content-left .btn {margin-top: 40px;}
	#services {padding: 80px 0;}
	#services .box-wrapper {margin: 60px 0 40px;}
	#services .box-wrapper .box {padding: 40px 30px; width: 32.5%;}
	#footer {padding-bottom: 50px;}
	#footer .bottom-section {padding: 50px 0;}
	#banner .inner-banner {height: 150px;}
	.about-page .mission, .apply-page #content, .contact-page #content {padding-top: 30px;}
	.about-page .mission .content-wrapper {padding: 50px; margin-bottom: -50px;}
	.about-page .mission .content-left h2 {font-size: 40px; margin-bottom: 25px;}
	.about-page .team {padding: 140px 0 80px;}
	.about-page .team .members {margin-top: 45px;}
	.about-page .members .member {text-align: center;}
	.about-page .members .member h3 {font-size: 22px; margin: 20px 0 5px;}
	.services-page .entry-section p {font-size: 22px;}
	.services-page #content {padding-bottom: 80px;}
	.services-page .services-wrapper .container {gap: 60px;}
	.services-page .service .content-left h2 {margin-bottom: 25px;}
	.thank-you-page #content {padding: 80px 0;}
}

@media screen and (max-width: 1200px) {
	h1, h2, #banner .main-banner .wrapper h2 {font-size: 45px;}
	#header nav ul {gap: 40px;}
	#header nav ul li a {padding: 20px 0 15px;}
	#header .logo {width: 25.75%;}
	#header .content-right {width: 68.81%;}
	#header .info-button {gap: 45px;}
	#header .info-button .phone i {font-size: 14px;}
	#header .info-button .phone a {font-size: 22px;}
	#header .info-button .social i {font-size: 25px;}
	#header .info-button .button .btn {padding: 8px 15px; width: 140px;}
	#about .content-wrapper {padding: 65px;}
	#footer .top-section .text-wrapper, #footer .top-section .social {padding-bottom: 30px;}
	#footer .top-section .text-wrapper {max-width: 575px;}
	.about-page .mission .content-left h2 {font-size: 35px;}
	.about-page .members .member {width: 19%;}
	.services-page .service .content-left, .services-page .service .image-right {width: 48%;}
}

@media screen and (max-width: 1024px) {
	h1, h2, #banner .main-banner .wrapper h2 {font-size: 40px;}
	h3 {font-size: 21px;}
	.btn {max-width: 160px;}
	#header nav ul {gap: 35px;}
	#mission {padding: 50px 0 150px;}
	#about .content-wrapper {margin-top: -80px; padding: 50px;}
	#about .content-wrapper .content-left h2 {margin-bottom: 20px;}
	#about .content-wrapper .content-left .btn {margin-top: 30px;}
	#services {padding: 50px 0;}
	#services .box-wrapper {margin: 50px 0 40px; flex-wrap: wrap; justify-content: center; gap: 20px;}
	#services .box-wrapper .box {width: 48.5%;}
	#footer {padding-bottom: 40px;}
	#footer .bottom-section {padding: 40px 0;}
	#footer .bottom-section .phone a {font-size: 27px;}
	#footer .top-section .social i {font-size: 35px;}
	#banner .inner-banner {height: 120px;}
	.about-page .mission .content-wrapper {padding: 40px;}
	.about-page .mission .content-left h2 {font-size: 30px; margin-bottom: 20px;}
	.about-page .members .member h3 {font-size: 20px;}
	.about-page .team {padding: 120px 0 50px;}
	.about-page .team h5 {margin-bottom: 5px;}
	.about-page .team .members {margin-top: 40px;}
	.services-page #content {padding-bottom: 50px;}
	.services-page .entry-section {padding: 30px 0;}
	.services-page .services-wrapper .container {gap: 50px;}
	.services-page .service .content-left h2 {margin-bottom: 20px;}
	.thank-you-page #content {padding: 50px 0;}
}

@media screen and (max-width: 980px) {
	h1, h2, #banner .main-banner .wrapper h2 {font-size: 35px;}
	#header .container {padding: 0; display: block;}
	#header .logo, #header .info-button {display: none;}
	#header .content-right {width: 100%;}
	#header .navigation .mobile-phone {display: flex; justify-content: center; align-items: center;}
	#header nav {position: fixed; top: 0; left: 0; width: 100%; z-index: 999; box-shadow: 0 0 5px rgba(0, 0, 0, .8);}
	#header nav ul {max-width: 100%; display: none; height: auto; background: rgba(255, 255, 255, .9);}
	#header nav ul li {max-width: 100%; position: relative; text-align: left; padding: 0; display: block; border-bottom: 1px solid #EEE; margin-left: 0 !important;}
	#header nav ul li a {padding: 10px 0; font-size: 16px; margin: 0; color: #000; text-align: left; width: 100%; text-indent: 20px;}
	#header nav ul li a::after, #header nav ul li a.active-menu::before, #header nav ul li a:hover::before {display: none;}
	#header nav ul li a.active-menu, #header nav ul li a:hover {color: #FFF; background: #549D35;}
	#header nav #pull {display: block; background: #FFF; width: 100%; position: relative; height: 45px; color: #fff; z-index: 999;}
	#header nav #pull img {max-height: 40px; display: block; position: relative; top: 4px; padding-left: 10px;}
	#header nav #pull:after {content:"\f0c9"; font-family: 'Font Awesome 5 Free'; font-size: 30px; display: inline-block; position: absolute; right: 15px; top: 10px; font-weight: 700; color: #549D35;}
	#header nav #pull strong{line-height: 45px;}
	#header .mobile-btn {display: block;}
	#banner .main-banner {margin-top: 45px;}
	#banner .main-banner .wrapper p {font-size: 20px;}
	#mission, #about {padding: 50px 0;}
	#about .content-wrapper {margin-top: 0; padding: 50px 30px;}
	#footer .top-section {flex-direction: column; gap: 30px;}
	#footer .top-section .logo, #footer .top-section .social {width: 100%;}
	#footer .top-section .text-wrapper, #footer .top-section .social {padding-bottom: 0;}
	#footer .top-section .text-wrapper {margin: 0 auto;}
	#footer .top-section .logo img {width: auto; margin: 0 auto;}
	#footer .top-section .social a, #footer .bottom-section .copyright a, #footer .bottom-section .copyright p {text-align: center;}
	#footer .bottom-section {flex-direction: column; gap: 20px;}
	#banner .inner-banner {margin-top: 45px;}
	.about-page .team {padding: 50px 0;}
	.about-page .mission {padding: 30px 0;}
	.about-page .mission .content-wrapper {margin-bottom: 0;}
	.about-page .team .members {flex-wrap: wrap; gap: 20px; justify-content: center;}
	.about-page .members .member {width: 31%;}
	.services-page .services-wrapper .service {align-items: flex-start;}
}

@media screen and (max-width: 767px) {
	h1, h2, #banner .main-banner .wrapper h2 {font-size: 30px;}
	.btn {padding: 9px 15px; max-width: 140px;}
	#banner .main-banner .container {flex-direction: column;}
	#banner .main-banner .right-content {width: 100%; padding: 30px 10px;}
	#banner .main-banner:before, #banner .main-banner .left-image:before {display: none;}
	#banner .main-banner .wrapper {max-width: 410px; margin: 0 auto; text-align: center;}
	#banner .main-banner .wrapper h2 {margin-bottom: 15px;}
	#mission, #about, #services, #footer .bottom-section, .about-page .team, .thank-you-page #content {padding: 30px 0;}
	#mission h1, #about .content-wrapper .content-left h2 {margin-bottom: 15px;}
	#mission .btn {margin-top: 30px;}
	#services .box-wrapper {margin: 30px 0;}
	#services .box-wrapper .box {padding: 30px 15px;}
	#about .content-wrapper {flex-direction: column-reverse; gap: 30px; padding: 15px; text-align: center;}
	#about .content-wrapper .content-left, #about .content-wrapper .image-right, #services .box-wrapper .box, .about-page .mission .content-left, .about-page .mission .image-right, 
	.services-page .service .content-left, .services-page .service .image-right, #banner .main-banner .left-image {width: 100%;}
	#about .content-wrapper .content-left .btn {margin: 30px auto 0;}
	#footer, .services-page #content {padding-bottom: 30px;}
	#footer .bottom-section .phone a {font-size: 23px;}
	#footer .top-section .logo img {max-width: 180px;}
	#banner .inner-banner {height: 100px;}
	.about-page .mission .content-wrapper {padding: 20px; flex-direction: column-reverse; gap: 30px;}
	.about-page .mission .content-left, .services-page .service .content-left {text-align: center;}
	.about-page .mission .content-left h2 {font-size: 25px; /*max-width: 500px; margin: 10px auto 20px;*/}
	.about-page .team .members {margin-top: 30px;}
	.about-page .members .member {width: 30%;}
	.services-page .entry-section p, .thank-you-page #content p {font-size: 20px;} 
	.services-page .services-wrapper .container {gap: 30px;}
	.services-page .services-wrapper .service {flex-direction: column-reverse; gap: 25px;}
	.services-page .service .content-left h2 {margin-bottom: 15px;}
	.ctc-form .one-half {flex-direction: column;}
	.ctc-form input[type="text"] {height: 45px;}
}

@media screen and (max-width: 600px) {
	#header nav #pull img {max-width: 110px; top: 7px;}
	.services-page #content h2 {font-size: 27px;}
	.about-page .mission .content-wrapper {padding: 15px;}
	.about-page .mission .content-left h2 {font-size: 22px;}
	.about-page .members .member {width: 100%;}
	.about-page .members .member img {max-width: 240px; margin: 0 auto;}
	.thank-you-page #content img {max-width: 280px;}
	.thank-you-page #content p {margin: 30px 0;}
}