/*
Theme Name: Canyons Foundation
Version: 1.0
Description: A child theme of Special 310 Divi
Author: bourn404
Template: Special310Divi
*/

@import url("../Special310Divi/style.css");

/*MY ADJUSTMENTS*/

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

.heading p, nav {
		font-family: 'Fira Sans', sans-serif;
}

p {
	font-size: 1.4em;
	line-height: 1.8em;
	font-family: 'Merriweather', serif;
}

#call-to-action li {
	font-size: 1.1em;
	line-height: 1.3em;
	font-family: 'Merriweather', serif;
}

.heading h2 {
	font-size: 1.8em;
	line-height: 1.3em;
	margin-bottom: 0.4em!important;
	font-weight: 900;
	color: #23618E;
}

#partnerships .et_pb_button_module_wrapper {
	display: inline-block;
	margin-right: 15px;
}

.et_pb_button {
	background:  radial-gradient(at bottom left, #2EB0E2, #236391);
	color: #ffffff;
}

.et_pb_module .et_pb_button:hover, .et_pb_module .et_pb_button {
	border: 2px solid transparent;
}

footer#main-footer {
	background-color: #F4F4F8;
	text-align: center;
	font-size: 1.5em;
	padding: 1.5em 0;
}

#main-footer #footer-bottom {
	background-color: transparent;
	font-weight: bold;
}

#footer-bottom div {
	text-align: center;
	color: #23618E;
}

body {
	overflow-x: hidden;
}

#call-to-action ol {
	list-style-type: disc;
	font-size: 1.3em;
}
	
#call-to-action .et_pb_module {
	margin-bottom: 10px!important;
}

#call-to-action .et_pb_button {
	background: transparent!important;
	border: 2px solid white;
}

@media (max-width: 980px) {
	
	#partnerships img {
		border-top: 20px solid #2A92C3;
	}
	
	#quote {
		display: none;
	}
	
	#call-to-action {
		background:  radial-gradient(at bottom left, #2EB0E2, #236391);
		color: #ffffff;
	}
	
	#call-to-action h2 {
		color: #ffffff;
	}
	
	.blue-box, .gray-box, .box-wrapper {
		display: none;
	}

	.et_pb_row {
		margin: 0!important;
		width: 100%;
	}

	p, ol, .et_pb_button_module_wrapper, li, h2 {
		padding: 0 20px;
	}

	.section-content img {
		width: 100vw;
	}
	
	#partnerships .et_pb_button_module_wrapper {
		margin-right: 0;
		padding-right: 0;
	}
	
	.et_pb_column .et_pb_row_inner, .et_pb_row {
		padding: 10px 0;
	}
	
	.et_pb_section {
		padding: 0px 0!important;
	}
	
	.mobile-flip {
		display: flex;
		flex-direction: column-reverse;
	}
}

@media (min-width: 981px) {
	
	.et_pb_section {
		padding: 25px 0!important;
	}
	
	#logo {
		max-height: 84%;
	}

	header .et_menu_container {
		height: 100px;
	}

	#et-top-navigation {
		padding: 2.5em 0!important;
	}

	.menu-item {
		font-size: 1.5em!important;
	}

	.menu-item a {
		padding-bottom: 0!important;
	}

	.box-wrapper {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
	}

	.box-wrapper .et_pb_column {
		height: 100%;
	}

	.blue-box {
		background:  radial-gradient(at bottom left, #2EB0E2, #236391);
		min-height: 15px;
		width: 100%;
		position: absolute;
		z-index: -1;
	}

	.gray-box {
		background-color: #F4F4F8;
		min-height: 15px;
		width: 100%;
		position: absolute;
		z-index: -5;
	}

	.section-content {
		z-index: 200;
	}

	.left-overlap .section-content .et_pb_column:first-child {
		position: absolute;
		width: 57%;
		z-index: 100;
		background-color: white;
		padding: 1.5em;
	}

	.left-overlap .section-content .et_pb_column:last-child {
		float: right;
	}

	#mission .blue-box {
		bottom: 10%; 
		top: 60%;
		left: -1.5em;
		width: 130%;
	}

	#mission .section-content .et_pb_column:first-child {
		top: 40px;
	}

	#quote .blue-box {
		bottom: 2%;
		top: 40%;
		left: -1.5em;
		width: 95%;
	}

	#quote .gray-box {
		top: 10%;
		bottom: 20%;
		left: -2em;
		width: 120%;
	}

	#quote .section-content .et_pb_column:first-child {
		top: 80px;
	}

	.quote-text {
		font-size: 1.2em;
		font-weight: 900;
		font-family: 'Fira Sans', sans-serif;
	}

	.quote-author {
		font-size: 1em;
		font-weight: 900;
		font-family: 'Fira Sans', sans-serif;
	}

	#impact .gray-box {
		bottom: 0;
		top: 50%;
		left: 8%;
		right: 8%;
		width: auto;
	}

	#partnerships .blue-box {
		bottom: 0;
		width: 90%;
		top: 80%;
		left: 5%;
	}
	
	.w100, .w100 img, .w100 .et_pb_image_wrap {
		width: 100%;
	}

	#events .blue-box {
		bottom: 0;
		right: -1.5em;
		left: 2.5em;
		top: 30%;
	}

	#call-to-action .section-content .et_pb_column:first-child {
		background:  radial-gradient(at bottom left, #2EB0E2, #236391);
		color: white;
		position: absolute;
		top: 18%;
		padding: 1.5em 3em;;
		left: -2em;
		background-color: red;
		width: 100vw;
	}

	#call-to-action .heading h2 {
		color: white;
		font-size: 2.4em;
	}

	#call-to-action .section-content .et_pb_column:last-child {
		float: right;
	}

}