/* 

1. Add your custom Css styles below
2. Place the this code in your template: 

 <link href="css/custom.css" rel="stylesheet">

*/
/* ----------------------------------------------------------------
			HEADER
-----------------------------------------------------------------*/
.dark #header .header-inner,
.dark #header #header-wrap,
#header.dark .header-inner,
#header.dark #header-wrap {
  background-color: #FFF;																								/* --- MENU BG desktop ---*/
}
#header.header-modern:not(.header-active).header-colored .header-inner,
#header.header-modern:not(.header-active).header-colored #header-wrap {
  background-color: #FFF;																								/* --- MENU BG desktop ---*/
}
#header.header-colored .header-inner,
#header.header-colored #header-wrap {
  background-color: #FFF;																								/* --- MENU BG desktop ---*/
}
#header #mainMenu nav > ul > li.hover-active > a,
#header #mainMenu nav > ul > li.hover-active > span, #header #mainMenu nav > ul > li.current > a,
#header #mainMenu nav > ul > li.current > span, #header #mainMenu nav > ul > li:hover > a,
#header #mainMenu nav > ul > li:hover > span, #header #mainMenu nav > ul > li:focus > a,
#header #mainMenu nav > ul > li:focus > span {
  color: #00A3E0 !important; 																													/* --- MENU LINK TXT COLOR ACTIVE desktop ---*/
}
#header #mainMenu nav > ul > li .dropdown-menu > li > a:focus, #header #mainMenu nav > ul > li .dropdown-menu > li > a:hover, #header #mainMenu nav > ul > li .dropdown-menu > li > a:active,
#header #mainMenu nav > ul > li .dropdown-menu > li > span:focus,
#header #mainMenu nav > ul > li .dropdown-menu > li > span:hover,
#header #mainMenu nav > ul > li .dropdown-menu > li > span:active,
#header #mainMenu nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a:focus,
#header #mainMenu nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a:hover,
#header #mainMenu nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a:active {
  background-color: #E3F3FA;																										/* --- SUBMENU BOX BG COLOR desktop ---*/
  border-radius: 4px;																												/* --- SUBMENU BOX CORNER RADIUS desktop ---*/
}
#header #mainMenu nav > ul > li .dropdown-menu > li.current > a,
#header #mainMenu nav > ul > li .dropdown-menu > li.current > span, #header #mainMenu nav > ul > li .dropdown-menu > li:hover > a,
#header #mainMenu nav > ul > li .dropdown-menu > li:hover > span, #header #mainMenu nav > ul > li .dropdown-menu > li:focus > a,
#header #mainMenu nav > ul > li .dropdown-menu > li:focus > span, #header #mainMenu nav > ul > li .dropdown-menu > li:active > a,
#header #mainMenu nav > ul > li .dropdown-menu > li:active > span, #header #mainMenu nav > ul > li .dropdown-menu > li.hover-active > a,
#header #mainMenu nav > ul > li .dropdown-menu > li.hover-active > span {
  color: #fff;																															/* --- SUBMENU LINK TXT COLOR ACTIVE desktop ---*/
}
#mainMenu nav > ul > li > a {
  position: relative;
  font-family: "Poppins", sans-serif;
  padding: 10px 12px;
  text-transform: uppercase;
  font-size: 18px;																													/* --- MENU LINK TXT SIZE desktop ---*/
  font-weight: 700;																													/* --- MENU LINK TXT WEIGHT desktop ---*/
  letter-spacing: 0.6px;
  color: #005EB8 !important;
  border-radius: 0;
  border-width: 0;
  border-style: solid;
  border-color: transparent;
  transition: all .3s ease;
  line-height: normal;
}
#mainMenu nav > ul > li .dropdown-menu > li > a,
#mainMenu nav > ul > li .dropdown-menu > li > span,
#mainMenu nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a {
  font-size: 16px;																													/* --- SUBMENU LINK TXT SIZE desktop ---*/
  line-height: 16px;
  font-weight: 600;																													/* --- SUBMENU LINK TXT WEIGHT desktop ---*/
  font-style: normal;
  color: #005EB8 !important;
  font-family: "Poppins", sans-serif;
  padding: 12px 20px 12px 18px;
  display: block;
  transition: .3s ease;
}
.dark:not(.submenu-light) #mainMenu nav > ul > li .dropdown-menu,
#mainMenu.dark nav > ul > li .dropdown-menu {
  background-color: #fff;																										/* --- SUBMENU BG COLOR desktop ---*/
  border-color: #E3F3FA;																												/* --- SUBMENU OUTLINE COLOR desktop ---*/
}
.dark:not(.submenu-light) #mainMenu nav > ul > li .dropdown-menu > li > a,
.dark:not(.submenu-light) #mainMenu nav > ul > li .dropdown-menu > li > span,
.dark:not(.submenu-light) #mainMenu nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a,
#mainMenu.dark nav > ul > li .dropdown-menu > li > a,
#mainMenu.dark nav > ul > li .dropdown-menu > li > span,
#mainMenu.dark nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a {
  color: #000;																														/* --- SUBMENU LINK TXT COLOR desktop ---*/
}

/* ----------------------------------------------------------------
			MAIN NENU: RESPONSIVE
-----------------------------------------------------------------*/

@media (max-width: 1024px) {
.dark:not(.submenu-light) #mainMenu nav > ul > li .dropdown-menu,
#mainMenu.dark nav > ul > li .dropdown-menu {
	background-color: #fff !important;																								/* --- SUBMENU BG COLOR mobile ---*/
}
.dark:not(.submenu-light) #mainMenu nav > ul > li .dropdown-menu > li > a,
.dark:not(.submenu-light) #mainMenu nav > ul > li .dropdown-menu > li > span,
.dark:not(.submenu-light) #mainMenu nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a,
#mainMenu.dark nav > ul > li .dropdown-menu > li > a,
#mainMenu.dark nav > ul > li .dropdown-menu > li > span,
#mainMenu.dark nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a {
  color: #005EB8;																															/* --- SUBMENU LINK TXT COLOR mobile ---*/
}
#header #mainMenu nav > ul > li .dropdown-menu > li > a:focus, #header #mainMenu nav > ul > li .dropdown-menu > li > a:hover, #header #mainMenu nav > ul > li .dropdown-menu > li > a:active,
#header #mainMenu nav > ul > li .dropdown-menu > li > span:focus,
#header #mainMenu nav > ul > li .dropdown-menu > li > span:hover,
#header #mainMenu nav > ul > li .dropdown-menu > li > span:active,
#header #mainMenu nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a:focus,
#header #mainMenu nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a:hover,
#header #mainMenu nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a:active {
  background-color: #fff !important;																								/* --- SUBMENU BOX BG COLOR mobile ---*/
}

			/*	MAIN MENU	*/
			
#mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li > a,
#mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li > span,
#mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a {
  line-height: 16px;
  font-size: 14px;																													/* --- SUBMENU LINK TXT SIZE mobile ---*/
  padding: 12px 0;
  display: block;
}
.mainMenu-open #header .header-inner,
.mainMenu-open #header #header-wrap {
  box-shadow: 0 4px 10px rgba(0, 94, 184, 0.08);
  background-color: #fff !important;																				/* --- MENU BG mobile ---*/
}
.mainMenu-open.dark #header .header-inner,
.mainMenu-open.dark #header #header-wrap,
.mainMenu-open #header:not(.submenu-light).dark .header-inner,
.mainMenu-open #header:not(.submenu-light).dark #header-wrap {
  background-color: #fff !important;																				/* --- MENU BG mobile ---*/
}
}