/*  --------- DESKTOP VERSION  ------------- */

.slicknav_menu {   /* mobile menu hidden */
  display:none;
}


/*Wrapper and Font Settings (applies to the whole menu)*/
#menu {
  display:block;
  float:right;
  height:100%;
  font-size:18px;
  color: white;
  text-transform: lowercase;
  font-family:inherit;

  /*Prevent it from being too close to right edge */
  margin-right:25%;

}

/* padding, position relative */
#menu ul {
  position:relative;
  list-style:none;
  padding-left:5px;
  padding-right:5px;
}

/* full height, align bottom */
#menu ul, #menu li {
  height:100%;
  display:inline-block;
  text-align:center;
  float:none;
  vertical-align: bottom;
}

/* aling bottom within the full height */
#menu li, #menu ul li a {
  display: flex;
  justify-content: center;
  align-items: flex-end;
}


/* Static link height and LINK text COLOR*/
#menu ul li a {
  height: 50px;
  color: white;
}

/* LINK Hover effect */
#menu ul li a:hover, #menu ul li a:focus, #menu ul li a:active {
  color: #1e7d27;
}

#menu li {
  border-left: 1px solid;
  border-image-source: linear-gradient(5deg, rgb(30, 125, 39), rgb(9, 9, 16));
  border-image-slice: 1;
  min-width: 90px; /*try to enforce consistent li widths without limiting our available width in case of large menu items */
}

#menu ul > li:last-child {
  border-right: 1px solid;
}
.slicknav_menu {
  background-color: #130C1F!important;
}


/* TOP LEVEL MENU */



#menu ul li {
  float: left;
  position: relative;
  list-style: none;
  margin-top: -10px;
  height: 100%;
  min-height: 170px;

}

#menu ul li a {
  text-decoration: none;
  text-align:center;
  padding: 15px;
  margin: 0;

}





/* OPTIONAL: If top level menu capitalize */
#menu > ul > li > a  {  }

/* ==== 2ND LEVEL DROP DOWN ==== */
#menu ul ul {
  visibility: hidden;               /* @@@ DON'T TOUCH */
  position: absolute;
  z-index:200;
  left: 0;
  top: 100%;
  opacity: 1;
  background:white;               /* DROP DOWN BOX BG COLOR */
  border-bottom:3px solid #3C7AC8;  /* DROP DOWN BOX BOTTOM BORDER */
}

#menu ul ul li {
  width:345px;
  border-bottom:1px solid #07375E;
  height:47px;  /* SUB ITEMS BOTTOM BORDER */

}

#menu ul li li:hover {
  background-color: #07375E;  /* DROP DOWN ITEMS BG COLOR ON HOVER */

}

#menu ul ul li a {
  text-align:left;
  padding: 12px 20px;
  margin: 0; color:#ffffff;
  font-size: 17px;
}

#menu ul ul li a:hover  { background-image:none;   }

#menu ul li:hover > ul {
  visibility: visible;  /* @@@ DON'T TOUCH */

}

/* ==== 3RD LEVEL DROP DOWN ==== */
#menu ul ul ul {
  /* @@@ DON'T TOUCH, all other properties brought from (menu ul ul) */
  left: 100%;
  top: 0;
}

#menu li li:hover ul {
  background:#000000; /* DROP DOWN BG COLOR */
}

/* DROP DOWN BACKGROUND COLOR on HOVER */
#menu li li li:hover { background:#212B66; }

/* ========== CSS MEDIA QUERY TO HIDE DESKTOP MENU AND SHOW RESPONSIVE MENU   ================== */

@media               screen and (min-width: 220px) and (max-width: 990px),
screen and (min-device-width: 480px) and (max-device-width: 990px),
only screen and (max-device-width: 480px) and (orientation:portrait),
/* iphone 4*/   only screen and (-webkit-min-device-pixel-ratio : 1.5),
/* iphone 5*/   only screen and (min-device-pixel-ratio : 1.5)

{


  #menu { display:none; } /* desktop menu hidden */
.slicknav_menu { display:block; position: relative; z-index: 1000; }





/*  --------- MOBILE  VERSION  ------------- */

.slicknav_btn { position: relative; display: block; vertical-align: middle; float: right; padding: 5px; line-height: 22px; cursor: pointer; font-size:20px; }
.slicknav_menu .slicknav_menutxt { display: block; line-height: 18px; float: left; }
.slicknav_menu .slicknav_icon { float: left; margin: 3px 3px 3px 3px; }
.slicknav_menu .slicknav_no-text { margin: 0 }
.slicknav_menu .slicknav_icon-bar { display: block; width:32px; height: 2px }
.slicknav_btn .slicknav_icon-bar + .slicknav_icon-bar { margin-top: 6px }
.slicknav_nav { clear: both }
.slicknav_nav ul,
.slicknav_nav li { display: block;  }
.slicknav_nav .slicknav_arrow { font-size: 0.8em; margin: 0 0 0 5px; color:#ffffff; }
.slicknav_nav .slicknav_item { cursor: pointer; }
.slicknav_nav .slicknav_row { display: block; }
.slicknav_nav a { display: block;  /*font-family: 'Josefin Sans', Arial, sans-serif;*/ text-transform: uppercase; }
.slicknav_nav .slicknav_item a,
.slicknav_nav .slicknav_parent-link a { display: inline }
.slicknav_brand { float:left }
.slicknav_menu:before,
.slicknav_menu:after { content: " "; display: table; }
.slicknav_menu:after { clear: both }
/* IE6/7 support */
.slicknav_menu { *zoom: 1 }


.slicknav_menu {
  box-sizing:border-box;
}
.slicknav_menu * {
  box-sizing:border-box;
}
/* Button */
.slicknav_btn {
  margin: 5px 5px 6px;
  text-decoration:none;
  background-color: #000000;
}
/* Button Text */
.slicknav_menu  .slicknav_menutxt {
  color: #FFF;
  font-weight: bold;

}
/* Button Lines */
.slicknav_menu .slicknav_icon-bar {
  background-color: #f5f5f5;
}
.slicknav_menu {
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#37175f+0,000000+100&0.8+0,1+100 */
  background: -moz-linear-gradient(45deg,  rgba(55,23,95,0.5) 0%, rgba(0,0,0,0.8) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(45deg,  rgba(55,23,95,0.5) 0%,rgba(0,0,0,0.8) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(45deg,  rgba(55,23,95,0.5) 0%,rgba(0,0,0,0.8) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc37175f', endColorstr='#000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */


  padding:11px;
}
.slicknav_nav {
  color:#ffffff;
  margin:0;
  padding: 15px 0px 0px 0px;
  font-size:2.5em;
}
.slicknav_nav, .slicknav_nav ul {
  list-style: none;
  overflow:hidden;
}
.slicknav_nav ul {
  padding:0;
  margin:0;
}

.slicknav_nav ul ul {
  padding:0;
  margin:0 0 0 20px;
}


.slicknav_nav ul li {
  line-height:22px;
  font-size:19px; }

.slicknav_nav .slicknav_row {
  padding:5px 10px;
  margin:2px 5px;
}
.slicknav_nav a{
  padding:5px 10px;
  margin:2px 5px;
  color:#ffffff;
}
.slicknav_nav .slicknav_item a,
.slicknav_nav .slicknav_parent-link a {
  padding:0;
  margin:0;
}
.slicknav_nav .slicknav_row:hover {
  background: #07375E;
  color:#ffffff;
}
.slicknav_nav a:hover{
  background: #29154a;
  color:#ffffff;
}
.slicknav_nav .slicknav_txtnode {
  margin-left:15px;
}
.slicknav_brand {
  color:#fff;
  font-size: 18px;
  line-height:30px;
}

}