

:root {

	--hg-primary: #7FB157;

	--hg-primary-hover: #7cba3e;
  
	--hg-secondary: #005042;

	--body-txt-color: #191919;
  
	--white-color: #ffffff;
  
	--black-color: #000;
  
	--grey-color: #cccccc;
  
	--lightgrey-color: #e9e9e9;

	--sidebar-color: #ECECEC;

	--placeholder-color: #7a7a7a;

	--font-1: 'Inter', sans-serif;
  
	--transition: all 0.5s;
  
  }


  body {
    padding: 0;
    margin: 0px;
    color: #2b2b2b;
    font-family: 'Raleway', sans-serif !important;
    background: #fff;
      background-color: rgb(255, 255, 255);
  }

  h1, h2, h3, h4, h5, h6 {
    clear: both;
    padding: 0;
    margin: 0;
      margin-top: 0px;
      margin-bottom: 0px;
   
    font-family: 'Raleway', sans-serif !important;
  }


.align-items-center { align-items:center; }

/* .primery-btn { background: var(--hg-primary); color: var(--white-color); display: inline-block; border-radius: 3px; padding: 10px 20px; text-decoration: none; border: none; outline: none!important; cursor: pointer; text-align: center; }
.primery-btn:hover { background: var(--hg-primary-hover)!important; color: var(--white-color)!important; outline: none;}

 */

/*------------------------------------*\

         Custom Css Start

\*------------------------------------*/


.wapper { padding:0px 0 0 0; }


/*Header css start*/

header { background:var(--white-color); padding:20px 0px; box-shadow:0px 5px 12px #00000029; position:fixed; top:0px; width:100%; z-index:99; 
  transition: 0.3s; font-family: 'Inter', sans-serif; }

header .container { max-width:100%; padding: 0px 30px; width: 100%; }

.header-row { display: flex; align-items: center; justify-content: space-between;}

.header-left { display: flex; align-items: center; }

.exo-logo2 { width:auto; height: auto;}

.logo img { max-width: 78px; }

.nav-menu-inner { margin: 0 30px 0 0;}
.nav-menu-inner > ul { display: flex; margin: 0px;}
.nav-menu-inner ul li a { display: inline; padding:33px 20px; color: var(--hg-secondary); font-size: 16px; font-weight: 500; text-transform: capitalize; text-decoration:none; font-family: 'Inter', sans-serif;  }
.nav-menu-inner ul li > ul { position: absolute; background: var(--white-color); padding:0px 0px; box-shadow: 0px 0px 10px rgba(0,0,0,0.2); display: none; top: 85px; }
.nav-menu-inner ul li > ul li a { padding:10px 20px; display: block; color:#191919; pointer-events: none;  }
.nav-menu-inner ul li > ul li.highlight-link a { color: var(--hg-secondary); pointer-events:auto; }
.nav-menu-inner ul > li > ul > li > a:hover { background: var(--lightgrey-color); }
.nav-menu-inner > ul > li.sub-menu > a:after { content:""; width: 10px; height: 10px; background:url(../agent-hub-images/menu-arrow.svg) 0 0 no-repeat; display: inline-block; vertical-align: middle; margin: 0 0px 0 10px; vertical-align: unset; }

.nav-menu-inner ul li > ul li { border-bottom:var(--grey-color) solid 1px;}
.nav-menu-inner ul li > ul li ul li  { border-bottom:none; padding: 0 0px; }
.nav-menu-inner ul li > ul li ul li a {  padding: 10px 30px;}

.nav-menu-inner ul li > ul li ul { position: static; display: block!important; box-shadow: none;} 
.nav-menu-inner ul li > ul li:last-child { border: none;}
.nav-menu-inner ul li > ul li ul { padding-bottom: 0px;}


.mobile-toggle { display: none;}
.mobile-toggle a { width: 25px; height: 18px; display: block; background: url(../agent-hub-images/hamburger-icon.svg) 0 0 no-repeat; }
.mobile-toggle a.close-icon {  background: url(../agent-hub-images/close-icon.svg) 0 0 no-repeat;}


.settings-btn a { padding: 10px 20px; display: inline-block; background: var(--hg-primary); border: var(--hg-primary) solid 1px; border-radius: 5px; 
  color: var(--white-color); margin: 0 20px 0 0; text-transform: uppercase;  text-decoration: none; font-family: 'Inter', sans-serif;}
.settings-btn a i { margin: 0 10px 0 0; }
.settings-btn a:hover { background: var(--hg-secondary); color:var(--white-color); }

.logout-btn a { padding: 10px 20px; display: inline-block; background: var(--white-color); border: var(--hg-primary) solid 1px; border-radius: 5px; 
  color: var(--hg-primary); text-decoration: none; font-family: 'Inter', sans-serif;   }
.logout-btn a i { margin: 0 10px 0 0; }
.logout-btn a:hover {  color:var(--hg-secondary);  border: var(--hg-secondary) solid 1px; }




 


@media (min-width:1024px){

.nav-menu-inner ul li:hover > ul {  display: block;}

}




 @media (max-width:1240px){


  .nav-menu-inner { margin: 0 15px 0 0; }
  .nav-menu-inner ul li a {padding: 33px 10px; align-items: center; font-size: 15px; }


 }



 @media (max-width:1023px){

  

  .mobile-toggle { display: block;} 

  header { background:var(--white-color); padding:15px 0px; display: flex; height: 65px; align-items: center;  }
  header .logo img { height: 30px; width: auto;} 
  header .container { padding: 0 15px;}

  .header-left { position: absolute; top: 65px; background: var(--white-color); left: 0px; display: none; width: 100%;  box-shadow: 0px 0px 2px rgba(0,0,0,0.5);  z-index: 999; height: calc(100vh - 65px); overflow-y: scroll;  }

  .nav-menu-inner { margin: 0px;}
  .nav-menu-inner > ul { display: block;}
  .nav-menu-inner ul li { position: relative; border-bottom: var(--grey-color) solid 1px;}
  .nav-menu-inner ul li a { display: block; padding: 15px 20px; font-weight: bold;  }
  .nav-menu-inner ul li a:after {right:20px; position:absolute; top: 24px;}

  .nav-menu-inner ul li ul { position: static; box-shadow: none; padding:0px 0px 10px 0; }

  .nav-menu-inner ul li ul li a { border: none; padding: 10px 30px; font-weight: 500;}
  .nav-menu-inner ul li ul li ul li a { border: none; padding: 10px 45px; font-weight: 500; }

  .settings-btn { float: left; margin:10px 10px 10px 20px; }
  .logout-btn { float: left; margin:10px 10px 10px 20px;}
  

 }



