 /*
 Theme Name:   FPFA
 Theme URI:    https://fpfa.ab.ca/
 Description:  Thinkmojo Theme
 Author:       Thinkmojo
 Author URI:   https://fpfa.ab.ca/
 Template:     Divi
 Version:      1.0.0
 Tags:         
 Text Domain:  FPFA
*/

@import url("../Divi/style.css");

/* ##########################################################################
Theme customization starts here
This is the child theme of Divi. 
see more about child themes here: http://codex.wordpress.org/Child_Themes
############################################################################# */



/*
Color Palette
-----
Gris : #4d4d4d
Orange : #f98b0a
Green: #b5c62d
Red: #c22452
Dark Green: #016c73
Yellow: #fff2a1
Alt Green Seb #aabd16 
*/




/*
Make Top Primary Navigation Responsive
*/

/* 
Large Desktop: 1405px and above
Standard Desktop: between 1100px and 1405px
Laptops and Large Tablets: between 980px and 1100px
Tablets: between 768px and 980px
Smartphones and small Tablets: between 320px and 768px;
Smartphones: between 320px and 480px;
*/


/*
https://quiroz.co/the-overlapping-divi-logo/
https://www.elegantthemes.com/blog/divi-resources/fixing-your-responsive-navigation-menu-in-divi
*/

@media (min-width: 768px) and (max-width: 1200px) {
	#logo {
    	max-height: 45% !important;
	}

	 #top-menu li, #top-menu li a {
		 font-size: 8px;
		 padding-right: 10px;
	 }

}

/* Primary Menu Dropdown */
#main-header .nav li ul {margin-top: -15px !important;}
#main-header .nav li ul li a{
	font-family:'Lato',Helvetica,Arial,Lucida,sans-serif !important;
	font-size: 16px !important;
	color:#f98b0a !important;
	text-transform: none !important;
	text-decoration: none !important;
}


/*
Primary Menu Hover effect (aninated line)
https://www.elegantthemes.com/blog/divi-resources/beautiful-css-hover-effects-you-can-add-to-your-divi-menus
*/

#top-menu .current-menu-item a::before,
#top-menu .current_page_item a::before {
 content: "";
 position: absolute;
 z-index: 2;
 left: 0;
 right: 0;
}

#top-menu li a:before {
 content: "";
 position: absolute;
 z-index: -2;
 left: 0;
 right: 100%;
 bottom: 50%;
 background: #fff; /*** COLOR OF THE LINE ***/
 height: 3px; /*** THICKNESS OF THE LINE ***/
 -webkit-transition-property: right;
 transition-property: right;
 -webkit-transition-duration: 0.3s;
 transition-duration: 0.3s;
 -webkit-transition-timing-function: ease-out;
 transition-timing-function: ease-out;
}

#top-menu li a:hover {
 opacity: 1 !important;
}
#top-menu li a:hover:before {
 right: 0;
}
#top-menu li li a:before {
 bottom: 10%;
}
#top-menu li ul li a:hover:before  {
 background: #f6f7f7 !important;
}

#top-menu li li a:hover:  {
 background: #f6f7f7 !important;
 opacity: 1;
   transition: opacity .0s ease-in-out;
   -moz-transition: opacity .0s ease-in-out;
   -webkit-transition: opacity .0s ease-in-out;
}


/* Monarch Newsletter widget */

/*
.et_bloom .et_bloom_form_container .et_bloom_form_content .et_bloom_popup_input input

{
	background-color: #666 !important;
	color:#bbb !important;
}


.et_bloom .et_bloom_form_container .et_bloom_form_header
{
	display:none;
}

.et_bloom .et_bloom_form_header img, .et_bloom .et_bloom_form_header .et_bloom_form_text {
	padding:0px !important;
}

.et_bloom .et_bloom_form_header h2 {
	display:none !important;
}
*/

.et_bloom .et_bloom_optin_3 .et_bloom_form_container .et_bloom_form_header {
	display: none !important;
	background-color:green;
}

.et_bloom .et_bloom_optin_4 .et_bloom_form_container .et_bloom_form_header {
	display: none !important;
	background-color:green;
}

.et_bloom .et_bloom_form_container .et_bloom_form_content {
    padding: 0px 0px !important;
}




/*
Footer icon size 
*/

.et_monarch .et_social_networks .et_social_icon, .et_monarch .et_social_networks .et_social_icon:before, .et_monarch .et_social_networks .et_social_icon:after {
    width: 20px;
    height: 20px;
    line-height: 20px;
}

/*
Footer Link to web designer

#footer-info a {
    color: #444;
}

#footer-info a:hover {
    color: #eee;
}

*/
#footer-bottom {
    padding: 5px 0 0 0;
    background: #111;
}

a.webdesign {color:#333 !important; }
a.webdesign:hover {color:#eee !important; }

 
