/*Transparent top bar menu. When scrolled down, it turns into a color and it's a fixed menu*/


.navbar-fixed-top.scrolled {
  /*BACKGROUND COLOR CURRENTLY GRAY OR BLUE #071b34 */
  background-color: #31322e !important;
  transition: background-color 300ms linear;
   /*opacity:0.9;*/



}




.logo img {
  display:block;
  margin-left:10px;
}

.navbar-fixed-top.scrolled .logo img {
    display: block;
}

.navbar-fixed-top.scrolled #links{
  color:white;
}

.navbar-fixed-top.scrolled #links:hover{
  color:white;
}



.navbar-fixed-top.shrink{height:55px;line-height:55px}


.top-bar {
 max-height: 90px !important;
  -webkit-transition: max-height 2s ease-in-out;
  -moz-transition: max-height 2s ease-in-out;
  -o-transition: max-height 2s ease-in-out;
  transition: max-height 2s ease-in-out;


position:absolute; /*putting position absolute means it goes on top of the header*/
width:100%; /*width 100% is needed with position absolute*/



  
}






.top-bar.expanded{
  max-height: 6000px !important;
}

/* area that is not covered by any menu's items*/ 
.top-bar 
/* logo area */
,.top-bar-section ul li, .top-bar.expanded .title-area 
/* menu item */
,.top-bar-section li:not(.has-form) a:not(.button) 
/* menuitem with dropdown when hovering */



,.top-bar-section ul li:hover:not(.has-form) > a /*background color for entire nav */
{
 
   background-color:transparent;  /* can be transparent too - background color for entire row*/
   z-index:2;


}



/* general font and colors */
.top-bar-section ul li > a 
/* topbar H1 name */
,.top-bar .name h1 a, .top-bar .name h2 a, .top-bar .name h3 a, .top-bar .name h4 a, .top-bar .name p a, .top-bar .name span a
{
    /*font-family: "Crimson Text",serif;*/
    color: white;
  /* font-family: 'Raleway', sans-serif;*/

  /*added new*/
  /*font-family:Maximo !important;*/
  font-family:Lato;
  font-size:15px;  
  font-weight:lighter;
  letter-spacing: 2px;
margin-right:10px;

}

/* menu item when hover */
.top-bar-section li:not(.has-form) a:hover:not(.button) 
{
  /* background-color:#1c75bc;*/
 /* background-color:transparent;*/
     
    /* transition: background-color 0.1s ease;*/
}

/* parent menu item when leaving a hovered child for another parent menu item */
.top-bar-section li.hover > a:not(.button) {
    color: white;
}

/* menu item when active */
.top-bar-section li.active:not(.has-form) a:not(.button) 
{
   
   background-color:transparent; /*this changes the menu links background*/
      color: white;
      text-transform: uppercase;

}


/* menu item when active and hover */
.top-bar-section li.active:not(.has-form) a:hover:not(.button) 
{
     background-color:transparent;
    color: white;
    text-underline-position: 4px;
    text-decoration-line:black;
}

/* dropdown arrow color */
.top-bar-section .has-dropdown > a::after 
{
    border-color: rgba(51, 51, 51, 0.4) transparent transparent;
}

/* dropdown parent when hovering a child item */
.top-bar-section ul li:hover:not(.has-form) > a 
{
    color: white;
}

/* ul.dropdown, only to add border no background */
.top-bar-section .has-dropdown.hover > .dropdown, .top-bar-section .has-dropdown.not-click:hover > .dropdown, .top-bar-section .has-dropdown > a:focus + .dropdown
{
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}

/* dropdown child */
.top-bar-section .dropdown li:not(.has-form):not(.active) > a:not(.button) 
{
    background: #31322e;
    color: white;
}
/* dropdown child when hover */
.top-bar-section .dropdown li:hover:not(.has-form):not(.active) > a:not(.button) 
{
    background: #31322e;
    color: white;
}

/* on small screen */

/* content of the toggled menu */
.top-bar .toggle-topbar.menu-icon a 
{
    color: #1b75bc; 
  
}

.top-bar .toggle-topbar.menu-icon a:hover
{
 

  
}


/* toggle 3 horizontal bars */
.top-bar .toggle-topbar.menu-icon a span::after 
{
    box-shadow: 0 0 0 1px #333, 0 7px 0 1px #333, 0 14px 0 1px #333;
    
}
/* responsive dropdown back menu */
.top-bar-section .dropdown li.parent-link a, .top-bar-section .dropdown li.title h5 a {
    color: black;
   
   
    text-transform: uppercase;
}


.top-bar .logo img {
  max-height: 46px !important;
  width: auto !important;
}

@media only screen and (min-width: 40.063em) {
  .top-bar {
    height: 90px !important;
  
  }
  .top-bar-section li:not(.has-form) a:not(.button) {
    line-height: 90px !important;

  }
  .top-bar .logo img {
    max-height: 90px !important;

  }

}




/*FOR SMALL SCREEN*/
  @media screen and (max-width: 600px) {

,.top-bar-section ul li:hover:not(.has-form) > a /*background color for entire nav */
{
    /*background: transparent;*/
   /* background-color:#1b75bc; */
   background-color:#31322e;  /*left side logo background*/
}


.top-bar-section li.active:not(.has-form) a:not(.button) /*THIS IS FOR MOBILE MENU BACKGROUND */
{
   
   background-color:#31322e; /*this changes the menu links background*/
      color: white;
      text-transform: uppercase;

}

.top-bar-section li.active:not(.has-form) a:not(.button):hover { /*THIS CHANGES THE MOBILE MENU LINKS BACKGROUND COLOR*/
background-color:#031e37;
color:white;
}






  }


 @media screen and (max-width: 980px) {
.logo img{
  display:none;
 }
}