/*
 Theme Name:   Divi Child
 Theme URI:    http://cooldesign.co.za
 Description:  A Child Theme built for Divi
 Author:       Cool Design Digital Agency
 Author URI:   http://cooldesign.co.za
 Template:     Divi
 Version:      1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
*/
/* =========================================================================================== 
   IVYLINE PRINTING TECHNOLOGIES
/* ===========================================================================================
/* GENERAL STYLING

/* LINK UNDERLINE ON HOVER
================================================================= */
.link-hover-underline a:hover {
	border-bottom: solid 2px;
}

/* VERTICALLY ALIGN A COLUMN - FROM DIVI SPACE
================================================================= */
.col-vertical-align { 
    display: flex; 
    flex-direction: column; 
    justify-content: center;
} 

/* ===========================================================================================
/* GALLERY STYLING
/* ===========================================================================================
/* DISABLE DIVI GALLERY SLIDE IN EFFECT
================================================================= */
.et_pb_gallery_item {
	-webkit-animation: none !important;
	-moz-animation: none !important;
	-o-animation: none !important;
	-ms-animation: none !important;
	animation: none !important;
}

/* MAKE CLOSE 'X' PERMANENTLY VISIBLE AND BIGGER ON LIGHTBOX IMAGES
================================================================== */
button.mfp-close	{
	opacity: 1 !important;
	color: white !important;
}
.mfp-iframe-holder .mfp-close, .mfp-image-holder .mfp-close {
	font-size: 30px !important;
	line-height: 1em !important;
}

/* DO THE SAME ON THE PRIVACY POLICY POPUP
------------------------------------------------------------------ */
.da-close	{
	background-color: #eee !important;
	font-size: 30px !important;
	margin-top: 10px;
	margin-right: 20px;
		padding: 4px;
	border: solid 1px #000;
	border-radius: 50%;
}

/* ===========================================================================================
   BULLET STYLES
/* ===========================================================================================
/* Square Blue Bullet image 
================================================================= */
.image-blue {
	list-style-image: url("images/bullet-blue.png");
	padding-left: 10px;
}

/* Square Red Bullet image 
================================================================= */
.image-red {
	list-style-image: url("images/bullet-red.png");
	padding-left: 10px;
}

/* ===========================================================================================
   BUTTON STYLES
/* ===========================================================================================
/* Scroll to Top button
================================================================= */
.et_pb_scroll_top.et-pb-icon {
	background: #2573f9; /* button blue */	
}

/* BUTTONS ALONGSIDE ONE ANOTHER
================================================================== */
.button-inline .et_pb_button_module_wrapper {
display: inline-block !important;
/* padding-bottom: 20px; */
margin: 0 10px 0 0;
}

/* ===========================================================================================
   HEADER STYLES
/* ===========================================================================================
/* Paint a 2-pixel red border above the top menu
------------------------------------------------------- */
#top-header {
	border-top: 2px solid #e20a17 /* logo red */
}

/* Add a SHADOW below the main header
------------------------------------------------------- */
#main-header { 
	-webkit-box-shadow: 0px 9px 20px 2px rgba(0,0,0,0.24);
	-moz-box-shadow: 0px 9px 20px 2px rgba(0,0,0,0.24);
	box-shadow: 0px 9px 20px 2px rgba(0,0,0,0.24);
}

/* Add a SHADOW to the Fixed Header too
------------------------------------------------------- */
#main-header.et-fixed-header { 
	-webkit-box-shadow: 0px 9px 20px 2px rgba(0,0,0,0.24)!important;
	-moz-box-shadow: 0px 9px 20px 2px rgba(0,0,0,0.24)!important;
	box-shadow: 0px 9px 20px 2px rgba(0,0,0,0.24)!important;
}

/* ===========================================================================================
   MENU STYLES
/* ===========================================================================================
/* Increase sub-menu width - this is the sub-menu text width
------------------------------------------------------- */
#top-menu li li a {
	padding: 3px 20px; 
/*	width: 360px;   /* was 210px */
	width: 660px;
}

/* Sub-menu background width
------------------------------------------------------- */
.nav li ul  {
/*	width: 400px; */
	width: 700px
}

/* Menu hover speed and colors
------------------------------------------------------- */
#top-menu-nav > ul > li > a:hover  {
	opacity: 1.0; 
	-webkit-transition: all 0.1s ease-in-out;
	-moz-transition: all 0.1s ease-in-out;
	transition: all 0.1s ease-in-out; 
}

#et-secondary-menu > ul > li > a:hover,
#et-info-email:hover,
.et-social-icons a:hover {
/*	color: #444; */
	text-decoration: underline;
	opacity: 1.0; 
	font-weight: bold;
	-webkit-transition: all 0.1s ease-in-out;
	-moz-transition: all 0.1s ease-in-out;
	transition: all 0.1s ease-in-out;
}
/* Menu item red on hover
------------------------------------------------------- */
#top-menu-nav #top-menu a:hover { 
/*	color: #e04b4b !important; /* lighter red */
	color: red !important; /* red */	
	background-color: #fff;
}

/*----------------------------------------------------- */
/* TOP (SECONDARY) MENU
/* Right align top menu Phone and Email details
------------------------------------------------------- */
@media only screen and (min-width: 768px) {
    #et-info { float:right !important; }
}

/* ===========================================================================================
   GRAVITY FORMS CUSTOMISATION
/* ===========================================================================================
/* GRAVITY FORMS - REMOVE LABEL ON FIELDS USING PLACEHOLDER 
================================================================= */ 
.gform_wrapper .top_label .gfield_label,
.gform_wrapper .field_sublabel_below .ginput_complex.ginput_container label {	
	display: none !important;
}
	
/* GRAVITY FORMS - FIELD STYLING
=================================================================
 User #gform_wrapper_1 for specific forms 
 User .gform_wrapper for all forms 
*/

body .gform_wrapper .gform_body .gform_fields .gfield input[type="text"],
body .gform_wrapper .gform_body .gform_fields .gfield input[type="email"], 
body .gform_wrapper .gform_body .gform_fields .gfield input[type="tel"], 
body .gform_wrapper .gform_body .gform_fields .gfield textarea {
	background: #ffffff;
	border: solid 1px #bbbbbb;
	border-radius: 0;
	color: #333 !important;
	padding: 10px 15px !important;
}

/* GRAVITY FORMS - 'SEND MESSAGE' BUTTON STYLING 
================================================================= 
body .gform_wrapper .gform_footer input[type=submit] { 
	width: 98.5%;
} 
*/

body .gform_wrapper .gform_footer input[type=submit] { 
/*	float: right; */
	color: #ffffff;
	background: #2573f9; /* lighter blue */
	border: solid 2px #2573f9; /* blue */
	border-radius: 50px;
	font-size: 15px;
	font-weight: bold;
	letter-spacing: 1px;
/*	padding: 12px 23px; standard size button */
	padding: 15px 26px;
	cursor: pointer;
/*	height: 35px; 
	min-width: 150px; 
	border: 0; */
}

/* Change to slightly darker blue ON HOVER
----------------------------------------------------------------- */
body .gform_wrapper .gform_footer input:hover[type=submit] {
	background: #245bf2; /* slightly darker blue */
}