/*
Theme Name: Firstweb Child Theme
Theme URI: http://brettarchibald.com
Description: Firstweb Child Theme
Author: Grant Pretorius
Author URI: https://firstweb.co.za
Version: 1.0.0
Template: Divi
*/

.et_header_style_left #logo {
  max-width: 69%;
}




/*--------------------------------------H TAGS----------------------------*/
/*--CENTER FOOTER INFO—DIVI CSS*/
#footer-info

{float:none;
	padding-bottom:10px;
	text-align: center;}
/*--END CENTER FOOTER INFO—DIVI CSS*/





/*--Mobile Menu Text Size--*/
.et_mobile_menu li a { font-size: 16px !important; }
/*--END Mobile Menu Text Size--*/
/*--------------------------------------H TAGS END-------------------------------*/

/*--Make submit button full width--*/
.pa-contact-form-submit-fullwidth .et_contact_bottom_container {
	width: 100%!important;
	flex-direction: column!important;
	gap: 1em;
	padding-left: 3%;
	margin-top: 0px;
}

.pa-contact-form-submit-fullwidth .et_contact_bottom_container button {
	width: 100%!important;
	margin: 0;
}

/*--Superscript and subscript setting--*/
sup { position: relative;
	vertical-align: baseline;
    font-size: 15%;
    line-height: 0;
    vertical-align: baseline;
    top: -4em; }
sub { 
  top: 0.4em; 
}
/*--setting indents for OL and UL --*/
.entry-content ol, .entry-content ul {
    padding: 0px 0px 30px 50px;
    list-style-position: outside;
}
 
.entry-content ol li, .entry-content ul li {
    margin-bottom: 10px;
} 

.text-pad {padding-left:20px;padding-right:20px;
	padding-bottom:20px;
}

/*--Make image fill the image moduale nomatter how high the column is--Source:https://www.youtube.com/watch?v=miIxPfxR8oM--*/
/*this sets the height of the image module*/
.pa-full-height-image-column {
	height: 100%;
}
/*this sets the height of the image container*/
.pa-full-height-image-column .et_pb_image_wrap {
	height: 100%;
}
/*--this sets the height and fit of the actual image--*/
.pa-full-height-image-column img {
	object-fit: cover;
	height: 100%;
}
/*-------------------[Make logo bigger on mobile]------------------
Source: https://www.youtube.com/watch?v=e7XZkzkH8qs&t=72s*/

@media only screen and (max-width: 767px)
{ body header img#logo {
	max-width:50%!important;
		max-height:80%!important;
		height:auto;
	width:auto;
	}} {}



/*Hide logo on home page*/
.page-id-3 #logo {display:none!important;}

/* Reduce left spacing between blurb icon and blurb text */
.dm-tight-blurb.et_pb_blurb_position_left .et_pb_blurb_container {
    padding-left:1px!important;
}

/*Mobile menus hamburger*/
.mobile_menu_bar:before {
	color:#fff;}

.et_mobile_menu li a { text-transform: uppercase;}

/*special link White*/
.special-link-white:hover {
    color: #ffffff; /* Change #007bff to your desired hover color */
}


/*special link White HOVER*/
.special-link-green:hover {
    color: #D6F76A; /* Change #007bff to your desired hover color */
}

/*special link White NO-HOVER*/
.special-link-green{
    color: #ffffff!important; /* Change #007bff to your desired hover color */
}

/*--Make image fill the image moduale nomatter how high the column is--Source:https://www.youtube.com/watch?v=miIxPfxR8oM--*/
/*this sets the height of the image module*/
.pa-full-height-image-column {
	height: 100%;
}
/*this sets the height of the image container*/
.pa-full-height-image-column .et_pb_image_wrap {
	height: 100%;
}
/*--this sets the height and fit of the actual image--*/
.pa-full-height-image-column img {
	object-fit: cover;
	height: 100%;
}

/*special link White HOVER*/
.special-link-pink:hover {
    color:pink!important; /* Change #007bff to your desired hover color */
}

/*special link pink NO-HOVER*/
.special-link-pink{
    color: red!important; /* Change #007bff to your desired hover color */
}

/* Center align text only on tablet and mobile */
@media (max-width:980px) {
.center-text-on-mobile .et_pb_text_inner,
.center-text-on-mobile .heading
{
text-align: center!important;
}
}

/*set the Divi menu dropdown auto width*/
@media only screen and (min-width: 981px) {
	.nav li ul {
		width: fit-content;
		display: flex;
		flex-direction: column;
	}
	.nav li li {
		white-space: nowrap;
	}
	.nav li li a {
		width: auto !important;
	}
}

/*---------Hard code Mobile Menu Hamburger Menu Color-------------*/
#et_search_icon:hover, .mobile_menu_bar:before, .mobile_menu_bar:after, .et_toggle_slide_menu:after {
    color: #ce0000!important;
}
/*-----------------------*/

.et_pb_contact_error_text {color:red!important;}

/* Move the title above the image in the bloke module prompted GPT*/
/* Make the content a grid *//* Title above image in Divi blurb */
.title-above .et_pb_blurb_content {
  display: grid;
  grid-template-rows: auto auto auto;
  row-gap: 0.75rem; /* uniform spacing between title, image, description */
  align-items: start;
}

.title-above .et_pb_blurb_container {
  display: contents; /* allows title + description to be placed in grid */
}

/* Order: title → image → description */
.title-above .et_pb_module_header   { grid-row: 1; margin: 0 !important; line-height: 1.2; }
.title-above .et_pb_main_blurb_image{ grid-row: 2; margin: 0 !important; }
.title-above .et_pb_blurb_description{ grid-row: 3; margin: 0 !important; }

/* Remove stray inline gap under image */
.title-above .et_pb_main_blurb_image img {
  display: block;
}
/* Center title and description inside reordered blurbs */
.title-above .et_pb_module_header{
  text-align: center;
}

/* Optional: center the image too, in case it shifts */
.title-above .et_pb_main_blurb_image {
  justify-self: center;
}

/*---------------------------------------------*/
/*---------------------------------------------*/
/*---------------------------------------------*/
/* Make blurb image bigger and align left of heading */
.blurb-img-left .et_pb_main_blurb_image img {
  width: 40px;   /* Increase size – adjust as needed */
  height: auto;
  max-width: none; /* Remove Divi’s default max constraint */
}

.blurb-img-left .et_pb_main_blurb_image {
  margin-right: 1px;  /* Space between image and heading */
}

.blurb-img-left .et_pb_blurb_content {
  display: flex;
  align-items: top; /* Vertically align image with heading */
}

.blurb-img-left .et_pb_module_header {
  margin: 0; /* Clean alignment */
}


.centered-stack {
  max-width: 480px!important;      /* adjust to taste */
  margin-left: auto!important;  
  margin-right: auto!important;      /* centers the block */
}
.centered-stack .et_pb_blurb {
  text-align: left!important;        /* keeps blurb content left-aligned */
}