/*!
Theme Name: SWAT Ministries
Theme URI: http://captcoder.com/
Author: Captain Coder
Author URI: http://captcoder.com/
Description: This is a Bootstrap 5 theme base custom built for SWAT Ministries
Version: 2.5.0
License: GNU General Public License v2 or later
Text Domain: captcoder

captcoder is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/

@import url("inc/normalize.css");
@import url("inc/xl.css");

@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,900;1,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@400;700&display=swap');

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# HTML
# Body
# Navigation
# Links & Buttons
# Overall
# Home
# Bottom Includes
# Footer
--------------------------------------------------------------*/


/*--------------------------------------------------------------
# Colors
--------------------------------------------------------------*/
:root{
	--blue: #1E4472;
	--teal: #5BA3A1;
	--yellow: #FFD166;
	--gray: #E5E1EE;
	--black: #000;
	--white: #fff;
} 

/*--------------------------------------------------------------
# HTML
--------------------------------------------------------------*/
/* Make jump links scroll smoothly down the page */
html {scroll-behavior: smooth;}

/*--------------------------------------------------------------
# Body
--------------------------------------------------------------*/
/* Set the base font family and font size for ems here. Check with designer on desired paragraph font size */
body {font-size:16px;font-family: 'Heebo', sans-serif;overflow-x: hidden;line-height: 1.6;background: var(--white);color:var(--black);}

@media only screen and (min-width:992px) {
	body {font-size:20px;}
}


/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
nav.navbar {background: var(--gray);transition: all 0.2s ease;}
	nav.navbar .navbar-toggler {background: var(--gray);}
	.navbar-brand img {max-height: 60px;transition: all 0.2s ease;}
	/* remove navbar if a landing page or other speciality template */
	.page-template-landing-page nav.navbar.navbar-expand-xl.navbar-dark, .page-template-funnel-page nav.navbar.navbar-expand-xl.navbar-dark, .page-template-thanks-page nav.navbar.navbar-expand-xl.navbar-dark {display: none;}
	.navbar-dark .navbar-nav .nav-link, .navbar-light .navbar-nav .nav-link:focus {color: var(--blue);}

	.navbar-toggler-icon {background-image: none!important;background-color: var(--blue);height: 3px;width: 25px;margin: 10px 0;position: relative;transition: all 0.35s ease-out;transform-origin: center;}
	.navbar-toggler-icon::before {display: block;background-color: var(--blue);height: 3px;content: "";position: relative;top: -7px; transition: all 0.15s ease-out;/*taken down to hide quicker*/transform-origin: center;}
	.navbar-toggler-icon::after {display: block;background-color: var(--blue);height: 3px;content: "";position: relative;top: 4px;transition: all 0.35s ease-out;transform-origin: center;}
		.navbar-toggler:not(.collapsed) .navbar-toggler-icon {transform: rotate(45deg);}
			.navbar-toggler:not(.collapsed) .navbar-toggler-icon::before {opacity: 0;}
			.navbar-toggler:not(.collapsed) .navbar-toggler-icon::after {transform: rotate(-90deg) translateX(7px) ;}

	/* delete if not a single page site */
	nav.fixed-top.navbar-shrink {background: rgba(255,255,255,0.6);max-height: 70px;}
		nav.fixed-top.navbar-shrink .navbar-brand img {max-height: 45px;}
	/******/

nav.navbar li.btn {background: transparent;}

@media only screen and (min-width:992px) {
	.navbar-brand img {max-height: 70px;}
}
@media only screen and (min-width:1200px) {
	.navbar-brand img {max-height: 80px;}
	nav.navbar li.menu-item {display: flex;align-items: center;}
	
	.navbar-collapse {margin-right: 0;margin-left: 0;padding-left: 0;background: transparent;}
		nav.navbar .navbar-nav .nav-link, .navbar-dark .navbar-nav .nav-link:visited {font-weight: bold;padding-right: 0.75rem;padding-left: 0.75rem;}
			nav.navbar .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:active {color: var(--blue);}
}
@media only screen and (min-width:1600px) {
	.navbar-brand img {max-height: 100px;}
}


/*--------------------------------------------------------------
# Buttons & Links
--------------------------------------------------------------*/
a, a:visited {color:var(--blue);}
	a:hover, a:active {color:var(--green);text-decoration: none;}
.btn,.gform_wrapper .gform_footer input[type=submit], .btn:visited,.gform_wrapper .gform_footer input[type=submit]:visited, #gform_submit_button_6, nav.navbar li.btn a, a.more-link, a.more-link:visited {border-radius: .75rem;border: 0;background: var(--yellow);color: var(--blue);padding:10px 15px;transition: all 0.2s;font-size:1em;font-weight: 700;}
	.btn:hover, .btn:active, #gform_submit_button_6:hover, .gform_wrapper .gform_footer input[type=submit]:hover, .gform_wrapper .gform_footer input[type=submit]:active, a.more-link:hover, a.more-link:active, nav.navbar li.btn a:hover {color:var(--white);background:var(--blue);}
	a.more-link {display: block;width: 35%;text-align: center;margin-top: 1em;}
	nav.navbar li.btn a:hover {color: var(--white)!important;text-decoration: none;}

.navbar-collapse a {font-weight: 700;}
	.navbar-collapse a:hover {text-decoration: underline;}


/*--------------------------------------------------------------
# Headings
--------------------------------------------------------------*/
h1,h2,h3,h4,h5,h6 {font-weight: 900;}
h1 {font-size: 28px;}
h2 {font-size: 24px;}
h3 {font-size: 20px;}

@media only screen and (min-width:992px) {
	h1 {font-size: 50px;margin: 0 0 .25em 0;}
	h2 {font-size: 40px;}
	h3 {font-size: 30px;}
}


/*--------------------------------------------------------------
# Overall
--------------------------------------------------------------*/
header {position: relative;}
	.textOver {position: absolute;top: 0;left: 50%;transform: translateX(-50%);}
	.textOver h1, .textOver .subheadline {color: var(--white);}

.uppercase {text-transform: uppercase}
.tealBk {background: var(--teal);}
.blueBg {background: var(--blue);}

.one-column:not(#report):not(#request):not(#contact) {padding-top: 6rem!important;padding-bottom: 8rem!important;}

.two-column h2, .half-image h2 {margin-top: 1em;}

.three-column-block .col-md-4 {display: flex;align-items: center;column-gap: 1rem;}
.section:not(#method).three-column-block .col-md-4 .copy-block, .section:not(#method).three-column-block .col-md-4 .img-block {width: 50%;}

.half-image .image img {width: 100vw;max-width: inherit;margin-left: -15px;}

.testimonials {background: var(--purple);}
.carousel, .carousel-item {height: 300px;}
	.carousel-caption {color: #000;text-shadow: none;}
		.carousel-caption blockquote {border-left: 0;}
			.carousel-caption blockquote footer {text-align: right;}

.video-container {
    position: relative;
    padding-top: 56.25%; /* 16:9 Aspect Ratio */
    height: 0; /* Collapse the container to just the padding */
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.3);
}

.modal-content {background: transparent;border: none;}
.modal-header {border: none;}


@media only screen and (min-width:768px) {
	.three-column-block .col-md-4 {display: block;}
	.three-column-block .col-md-4 .copy-block, .three-column-block .col-md-4 .img-block {width: 100%;}
}
@media only screen and (min-width:768px) and (max-width:991px) {
	.half-image .image img {margin-left: calc((100vw - 100%) / -2) !important;margin-right: calc((100vw - 100%) / -2) !important;}
	.half-image h2 {margin-top:1em;}
}
@media only screen and (min-width:992px) {
	.one-column:not(#report) {padding-top: 10rem!important;padding-bottom: 10rem!important;}
	.subheadline {width: 70%;margin: 0 auto 2rem;}
	.home .subheadline {width: 80%;}
	
	.one-column:not(#report):not(#request):not(#contact) {padding-top: 10rem!important;padding-bottom: 12rem!important;}
	
	
	.half-image {overflow: hidden;}
		.half-image .image img {height: 100%;width: 80vw;}
		.half-image .image.left {min-height: 720px;}
			article.half-image .image.left {min-height: 680px;}
			.half-image .image.left img {right: 0;position: absolute;}
}
@media only screen and (min-width:1200px) {
	.half-image .image.left {min-height: 720px;}
}
@media only screen and (min-width:1600px) {
	.subheadline {width: 70%;}
	.half-image .image img {width: 50vw;max-width: inherit;height: auto;}
}


/*--------------------------------------------------------------
# Home
--------------------------------------------------------------*/
.home .textOver .btn {background: transparent;}
.home .textOver .btn {display: flex;margin: auto;}
	.home .textOver .btn, .home .textOver i {color: var(--yellow);}
	.home .textOver i {font-size: 2rem;padding-right: .5rem;}

.textOver, .textOver .row {height: 100%;}
	.textOver .row {display: flex;flex-direction: column;justify-content: center;}

#child h2, #voice h2, #child strong {color: var(--blue)!important;}

/* funnels */
.box {color: var(--black);text-align: center;padding: 2em 1em;transition: all 0.2s ease-in;}
	.icon {font-size: 4em;}
	#funnels a:hover {text-decoration: none;}
		#funnels a:hover .box {background: var(--blue);color: var(--white);}
			#funnels a:hover .box .btn span.showhover {display: inline-block;}
				#funnels a:hover .box .btn:hover {background: var(--blue);}

@media only screen and (min-width:768px) {
	.box {padding: 2em 0.5em;}
}
@media only screen and (min-width:992px) {
	#funnels {padding: 5em 0!important;}
		.box {padding: 2em 1.25em;}
}
@media only screen and (min-width:1200px) {
	#funnels {padding: 7em 0!important;}
		.box {margin-top:2em;padding: 2em 4em;}
}
@media only screen and (min-width:1600px) {
	.box {padding: 4em;}
	#voice p {width: 80%;}
}


/*--------------------------------------------------------------
# Get Involved & Donate
--------------------------------------------------------------*/
#sponsor h2, #sponsor-freedom h2, #book h2, #join h2 {color: var(--blue)!important;}
#book, #join, #join .container {padding-top: 0!important;}
	#book {padding-bottom: 0!important;}

@media only screen and (min-width:992px) {
	#sponsor h2 + p, #sponsor-freedom h2 + p {width: 60%;margin: auto;}
}
@media only screen and (min-width:1600px) {
	#book .copy p, #join .copy p {width: 80%;}
}


/*--------------------------------------------------------------
# About
--------------------------------------------------------------*/
#who h2, #founders h2, #team h2, #map h2 {color: var(--blue)!important;}
#method.three-column-block .col-md-4 {display: block!important;}
#mission {background-position: right center!important;}
#mission .copy {padding-bottom: 5rem;}
#mission .image {display: none;}
#founders .container {padding-top: 0!important;padding-bottom: 0!important;}
#team {padding-top: 0!important;}

@media only screen and (min-width:992px) {
	#founders .container {padding-top: 0!important;padding-bottom: 3rem!important;}
	#team {padding-top: 3rem!important;}
	#method {padding-top: 6rem!important;padding-bottom: 6rem!important;}
}
@media only screen and (min-width:1400px) {
	.page-id-183 .textOver .col-12 {width: 55%;}
}
@media only screen and (min-width:1600px) {
	.page-id-183 .textOver .col-12 {width: 45%;}
	#who .copy p, #founders .copy p {width: 80%;}
}


/*--------------------------------------------------------------
# Human Trafficking
--------------------------------------------------------------*/
#global .bottom_copy p:nth-of-type(2) {margin-bottom: 0;}
#global i {font-size: 4rem;margin-bottom: 1rem;margin-top: 1rem;}
#global h3 {margin-top: 2rem;margin-bottom: 2rem;}
#freedom h2 {color: var(--blue)!important;}

@media only screen and (min-width:992px) {
	#global h2 + p {width: 75%;margin: auto;}
	#global ul {column-count: 3;margin-left: 4em;}
	.bottom_copy p, #global h3 {text-align: center;}
	#freedom.one-column {padding-top: 14rem!important;padding-bottom: 14rem!important;}
}
@media only screen and (min-width:1200px) {
	.page-id-834 .textOver .col-12 {width: 50%;margin: auto;}
	#global h2 + p {width: 65%;}
}
@media only screen and (min-width:1400px) {
	#global h2 + p {width: 55%;}
}
@media only screen and (min-width:1600px) {
	.page-id-834 .textOver .col-12 {width: 40%;}
	#global h2 + p {width: 45%;}
}


/*--------------------------------------------------------------
# Request Speaker
--------------------------------------------------------------*/
.page-id-816 .textOver .col-12 {width: 70%;margin: auto;}
#request h2 {color: var(--blue)!important;}
#request #gform_7, #contact #gform_5 {text-align: left;}
#request p {text-align: left;}

@media only screen and (min-width:1200px) {
	.page-id-816 .textOver .col-12 {width: 55%;}
	#request p {text-align: center;}
}
@media only screen and (min-width:1400px) {
	.page-id-816 .textOver .col-12 {width: 45%;}
}
@media only screen and (min-width:1600px) {
	.page-id-816 .textOver .col-12 {width: 35%;}
}


/*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/
.page-id-185 .textOver .col-12 {margin-top: 8rem!important;}
#contact h2 {color: var(--blue)!important;}
#contact ul:not(.gform_fields) {list-style-type: none;text-align: left;padding-left: 0;}
	#contact ul:not(.gform_fields), #contact p {text-align: left;}
	#contact ul li:nth-of-type(3) {margin-top: 1rem;}

@media only screen and (min-width:768px) {
	.page-id-185 .textOver .col-12 {margin-top: 6rem!important;}
	#contact ul:not(.gform_fields) {column-count: 2;padding-left: 2rem;margin-top: 2.5rem;}
	#contact p {text-align: center;}
		#contact ul li:nth-of-type(3) {margin-top: 0;}
}
@media only screen and (min-width:1200px) {
	#request p {text-align: center;}
}


/*--------------------------------------------------------------
# Funnel Template
--------------------------------------------------------------*/
.page-template-funnel-page header .logo, .page-template-thanks-page header .logo, .page-template-landing-page header .logo {position: absolute;top: 2rem;left: 50%;transform: translateX(-50%) translateY(-50%);}
	.page-template-funnel-page header .logo img, .page-template-thanks-page header .logo img, .page-template-landing-page header .logo img {max-height: 30px;}


/*--------------------------------------------------------------
# Blog
--------------------------------------------------------------*/
input#searchsubmit {font-family: "Font Awesome 5 Pro";background: var(--blue);padding: 5px 7px;border: 0;}
input#s {width: 80%;padding: 3px;}
h2.widget-title {margin-top: 1em;}

.posts h2 {color: var(--blue);}
.posts article {display: flex;flex-direction: column;height: 100%;}
.posts .post-info {display: flex;flex-direction: column;justify-content: space-between;height: 100%;}
.posts img {max-height: 250px;width: 100%;object-fit: cover;border-radius: .5rem;}
.posts img, .single-post header img {border-radius: .5rem;}
.posts .post-title {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3; /* Number of lines you want to show */
    -webkit-box-orient: vertical;
}

.single-post header img {margin: 3rem 0;}
.single-post header h1 {color: var(--white);}




/*--------------------------------------------------------------
# Bottom Includes
--------------------------------------------------------------*/
/* Call to Action */
#cta {margin:0;padding:3em 0;}
#cta h2 {margin-bottom: 1rem;}

@media only screen and (min-width:992px) {
	#cta p {width: 60%;margin: auto;}
}
@media only screen and (min-width:1600px) {
	#cta p {width: 50%;}
}

/*--------------------------------------------------------------
# Leadcapture & Forms
--------------------------------------------------------------*/
#leadcapture h2 {color: var(--blue)!important;}
.gform_required_legend {display: none;}

.gform_wrapper input[type="text"], .gform_wrapper input[type="email"], .gform_wrapper input[type="tel"], .gform_wrapper input[type="number"], .gform_wrapper select, .gform_wrapper textarea {border: 1px solid var(--black);border-radius: .75rem;}

#field_6_3, #field_6_2 {grid-column: span 12;}
#field_submit {grid-column: span 12!important;}

@media only screen and (min-width:992px) {
	#field_6_3, #field_6_2 {grid-column: span 5;}
	#field_submit {grid-column: span 2!important;}
}


/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
footer.footer {background: var(--black);color:var(--white);padding-top: 2em;}
	footer.footer a {color: var(--white);}
		footer.footer a:hover {color: var(--gray);}
	.foot-nav ul {list-style: none;-webkit-padding-start: 0;}
	.phone {font-size: 20px;}
	.social h4 {margin-bottom: 0;}
	.social .fab {margin: 15px;font-size: 2em;}
	.report, .report-msg, .fab {color: var(--yellow);}
		.report a {color: var(--yellow)!important;}
	.fab:hover {color: var(--blue);}
		

#siteinfo {font-size: 0.8em;}

.one-column:not(#report):not(#request):not(#contact){
	padding-top: 3rem !important;
    padding-bottom: 3rem !important;
}

#privacy .col-12.col-lg-6.offset-lg-3.text-center {
	width: 100% !important;
	margin-left: 0 !important;
	text-align: left !important;
}

#sitemap, .error-404 {
	padding-top: 3rem !important;
    padding-bottom: 3rem !important;
}


@media only screen and (max-width:576px) {
	footer .logo {width: 50%;margin-right: 1rem;}
	.main-foot .col-6 {display: flex;}
	.main-foot .col-6.col-lg-1 {justify-content: end;}
	.address {margin-bottom: 2.5rem;}
	.report-msg {width: 70%;margin: auto auto 1rem;}
	.quote {width: 75%;margin: auto auto 1rem;}
	#other-ways-to-donate .my-3{
		flex-direction: column;
	}
	
	#other-ways-to-donate .copy-block {
		width: 100%;
	}
}
@media only screen and (min-width:992px) {
	.social .fab {font-size: 1.5em;}
}
@media only screen and (min-width:1200px) {
	.main-foot .row {align-items: flex-end;}
		#footer-nav ul>li {display: inline-block;}
}
