/*
 Theme Name:  Crowned Theme
 Theme URI:    https://doddsbydesign.com
 Description:  
 Author:       Richard Dodds
 Author URI:   https://doddsism.com
 Template:     Divi
 Version:      1.0.0
*/

/*****Add any custom CSS below this line*****/

/*add spacing to list*/
.et_pb_text ol, .et_pb_text ul {
	padding-left: 60px;
	margin-top: 20px;
}

.underline-header {
	display: inline-block; /* Ensures the underline adjusts to the text width */
	position: relative; /* Allows positioning of the ::after pseudo-element */
}

.et_pb_text.underline-header h1, .et_pb_text.underline-header h2 {
  font-weight: 500 !important;
  font-size: 18px !important;
}

.underline-header::after {
	content: ' ';
	position: absolute;
  	left: 0;
  	bottom: 20%; /* Aligns the underline with the bottom of the text */
  	width: 100%; /* Makes the underline as wide as the text */
  	height: 12px; /* Thickness of the underline */
  	background-color: #f8953c; /* Color of the underline */
  	z-index: -1; /* Places the underline behind the text */
}

.crowned-list {
	display: flex;
	align-items: center; /* Center the content vertically */
	justify-content: flex-start; /* Keep text left-aligned */
}

.crowned-list ul{
	list-style: none;
}	

.crowned-list li::before {
	content: url('https://crownedculturemedia.com/wp-content/uploads/2024/10/crown-list-icon.png');
	margin-right: 10px; /* Space between bullet and text */
	display: inline-block;
	align-self: center; /* Centers the bullet icon relative to the text */
	vertical-align: middle; /* Additional alignment */
	position: relative; /* Optional: use to tweak position with top/bottom */
	top: -10px; /* Use this to make fine adjustments */
}

@media screen and (max-width: 980px) {
    .reverse-col {
        display: flex;
        flex-direction: column-reverse;
    }
}

.img-bg-tilt-left {
	position: relative; /* Sets up a context for positioning */
	display: inline-block; /* Adjusts to the size of the image */
}

.img-bg-tilt-left::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #318177;
	z-index: -1; /* Places the background behind the image */
	transform: rotate(-5deg); /* Rotate the background */
	transform-origin: center;
}

.img-bg-tilt-right::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #318177 !important;
	z-index: -1; /* Places the background behind the image */
	transform: rotate(5deg); /* Rotate the background */
	transform-origin: center;
}

/*show desktop menu on phone*/
@media (max-width: 980px) {
	.pa-open-mobile-menu .et_pb_menu__menu {
		display: flex!important;
	}
	.pa-open-mobile-menu .et_mobile_nav_menu {
		display: none!important;
	}
	.pa-open-mobile-menu.et_pb_menu--style-left_aligned.et_pb_text_align_right .et_pb_menu__wrap {
		-webkit-box-pack: start !important;
        -ms-flex-pack: start !important;
        justify-content: start !important;
	}
}
@media (min-width: 981px) {
	.cta-button a {
		color: #FFFFFF !important;
		background-color: #318177 !important;
		padding: 18px 16px !important;
		border-color: #318177 !important;
		transition: all 300ms ease 0ms;
		border: 2px solid;
		border-radius: 3px;
		-webkit-transition-duration: .2s;
		transition-duration: .2s;
		-webkit-transition-property: all !important;
		transition-property: all !important;
		display: inline-block;
		line-height: 9px;
		font-weight: 600;
		display: block;
		padding-left: 32px!important;
		padding-right: 32px!important;
		text-align: center;
		font-size: initial!important;
	}

	.cta-button a:hover {
		transform: scale(1.1);
		transition: all .2s 0s;
	}
  
    /*Removing padding from the menu module to fix the size of the button*/
    .et_pb_menu--with-logo .et_pb_menu__menu>nav>ul>li>a {
        padding-top: 0px;
        padding-bottom: 0px;
    }
  
    /*vertically center the menu items in menu module*/
    .et_pb_menu .et_pb_menu__menu>nav>ul>li {
        align-items: center;
    }
}
#mobile_menu1 > li.cta-button a {
	color: #ffffff !important;
	background-color: #318177 !important;
	text-align: center;
}