/* 
 Theme Name:   Chimes Chiropractic
 Theme URI:    
 Description:  
 Author:       Promoworx
 Author URI:   https://wordpress-840174-3260888.cloudwaysapps.com
 Template:     Divi
 Version:      1.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html

 /* == Add your own styles below this line ==
--------------------------------------------*/


@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&family=Signika:wght@300;400;500;600;700&display=swap');


/* Typography */
h1, h2, h3, h4 {
	font-family: 'Signika', sans-serif;
	color: #045d9e !important;
	word-wrap: normal;
}
h1 {
	font-size: 4.5em;
	text-transform: uppercase;
}
h2 {
	font-size: 2.8em;
	text-transform: uppercase;
}
h3 {
	font-size: 1.5em;
	text-transform: uppercase;
	line-height: 1.4em;
}
body, p {
	font-family: 'Roboto', sans-serif;
	font-size: 1rem;
	font-weight: 400;
}



/* General Styling */
.vertical_align {
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.display_flex {
	display: flex;
	flex-wrap: wrap;
}
.center_align {
	text-align: center !important;
}
.bottom_align {
	display: flex;
	align-items: flex-end;
}
.focus_text,
.focus_text p {
	font-size: 1.4rem;
}
.small_print,
.small_print p {
	font-size: 0.8rem;
	font-weight: 500;
}



/* Menu styling */
.et-info a {
	color: #003a72 !important;
}
#mobile_menu li a,
#top-menu li a,
#top-menu .sub-menu li a,
#top-menu .mega-menu .sub-menu .menu-item li a {
	color: #003a72 !important;
	text-decoration: none;
	display: block;
	position: relative;
	-webkit-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
	font-family: 'Signika', sans-serif;
	font-size: 1.2rem;
    font-weight: 500;
	opacity: 1 !important;
}
#mobile_menu li a:hover,
#top-menu li a:hover {
	color: #00bdff !important;
	opacity: 1 !important;
	transition: none;
}
#top-menu li.current-menu-ancestor > a, 
#top-menu li.current-menu-item > a, 
#top-menu li.current_page_item > a,
#top-menu li.current_page_item > a[aria-current="page"]{
	color: #00bdff !important;
	font-family: 'Signika', sans-serif;
}
.nav li ul {
	border-top: 3px solid #00bdff;
}
#top-menu li.mega-menu>ul>li>a:first-child {
	font-weight: normal;
}



/* Layout styling */
.hp_hero {}
.hp_hero h1 {
	color: #ffffff !important;
	font-size: 3.5rem;
}

.sp_header {
	background-blend-mode: multiply !important;
	/*background: linear-gradient(180deg, #045d9e 0%, #003a72, 100%) !important;*/
	background-color: #045D9E !important;
}
.sp_header h1 {
	color: #ffffff !important;
}



.sp_header_large .et_pb_row {
	height: 350px;
	background-color: #9D0000;
}
.sp_header_large .et_pb_column:first-child {
	padding: 5% 2% 5% 7%;
}
.sp_header_large h1 {
	font-size: 4.8rem;
	font-weight: 200 !important;
	font-style: italic !important;
	color: #ffffff;
	margin-left: 15px;
}
.sp_header_large h1 .line_one {
	font-family: 'Montserrat';
	font-size: 1.4rem;
	font-weight: 400;
	color: #ffffff;
	margin-bottom: 10px;
	display: block;
	line-height: 0em;
}
.sp_header_large h1 .line_two {
	font-size: 4.8rem;
	font-weight: 200;
	font-style: italic;
	color: #ffffff;
}


/* Global Footer */
.global_footer {}
.global_footer,
.global_footer p {
	color: #ffffff;
}
.global_footer a {
	color: #0c71c3;
}
.global_footer h4 {
	color: #ffffff !important;
	font-size: 21px !important;
}


/* Button styling */
.et_pb_button {
	background-color: transparent;
	border-width: 5px;
	border-color: #045d9e;
	border-radius: 50px;
	font-weight: bold;
	font-style: normal;
}
.et_pb_button:hover {
	color: #00bdff ;
    border-color: #00bdff;
}
.btn_white {
	border-color: #ffffff !important;
	color: #ffffff !important;
}
.btn_white:hover {
	color: #00bdff ;
    border-color: #00bdff;
}


@media (max-width: 780px) {
	h1 {
		font-size: 3rem;
	}
	h2 {
		font-size: 2rem;
	}
	h3 {
		font-size: 1rem;
	}
	
	.display_col_one {
		order: 1 !important;
		margin-bottom: 40px !important;
	}
	.display_col_two {
		order: 2 !important;
	}
	
	/* Layout styling */
	.hp_hero h1 {
		font-size: 2.8rem;
	}
}


@media only screen and (max-width: 980px) {
	.four-columns .et_pb_column {
		width: 49%!important;
	}
}