/*Navigation styles go here*/

/*Universal Nav Styles*/

header nav {
  background:transparent;
  box-shadow: none;
  position:static;
  padding:0 10px;
}

.header-cta{}

.header-cta a {
  color: #7F20F8;
  line-height: 70px;
  text-decoration: none;
  background: transparent;
  padding: 10px 25px;
  font-family: 'Red Hat Display', sans-serif;
  font-size: 0.9rem;
  transition: all ease .15s;
  font-weight: bold;
  border-radius: 15px;
  border: 2px solid #7F20F8;
  font-weight: 700;
}

.header-cta a:hover {
  background: #7F20F8;
  color: #fff;
  border-color:#7F20F8;
}

nav ul{}

nav a, nav a:visited, nav a:hover {
  transition: all .15s ease-out;
  padding: 0 15px;
  font-size: 0.85rem;
  font-family: 'Red Hat Display', sans-serif;
  font-weight: 500;
  color: #000;
  line-height: 70px;
}

nav a:hover {
  background: transparent;
  color: #7F20F8;
}

header nav::after {
  display:none;
}

header .flex-items{
  display:flex;
}
header .flex-item1{}
header .flex-item2{}
header .flex-item3 {
  flex: 0 0 max-content;
}

.mobile-top-nav-show,.mobile-top-nav-hide {
  padding: 4px 6px;
  /* position: absolute;
  top: -56px;
  right: 10px;*/
  color: #fff;
  text-align: center;
  transition: all .15s ease-out;
}

/***mobile menu image styling***/
.sticky-header .mobile-top-nav-show, .sticky-header .mobile-top-nav-hide {
  transition: top .25s ease-out;
  color: #414141;
}

.close{
  background:url(images/close-black.svg)no-repeat center;
  background-size:contain;
}
.menu{
  background:url(images/menu-black.svg)no-repeat center;
  background-size:contain;
}

nav li.selected_nav{
  background:transparent;
}

nav .selected_nav > a, nav .selected_nav > a:hover {
  background:transparent;
}


nav .selected_nav > a::after {
  content: " ";
  background: #7F20F8;
  width: 8px;
  height: 8px;
  display: inline-block;
  position: absolute;
  top: 45px;
  right: calc(50% - 4px);
  border-radius: 20px;
}

nav li:hover > a{
  /* Nav link hover state */
}


/*Dropdown menu item styles*/
nav ul ul {
  background:#fff;
  box-shadow: 0 10px 20px -10px #0000005e;
}

nav ul ul a
,nav ul ul a:visited
,nav ul ul a:hover{
  color:#000;
  background:#fff;
  line-height: 70px;
  padding:0 40px;
}

nav ul ul a:hover {
  background:#e1e1e1;
}

nav li.has_submenu > a::after {
  background: url("images/arrow-black.svg") no-repeat center center;
}

nav .at-toolbar2.at-minimal_toolbar.at-draggable {
  /* Adjust position of nav editing toolbar */
  top:10px;
}

.mobile-top-nav-show, .mobile-top-nav-hide {
  /* Toggle buttons/links for showing/hiding mobile navigation menu */
  padding: 4px 10px;
}
.mobile-top-nav-show:after, .mobile-top-nav-hide:after {display:none;}
nav.fontawesome .mobile-top-nav-hide::before,nav.fontawesome .mobile-top-nav-show::before {
  display:none;
  content:'';
}

.contact-us-mobile{display:none;}

/* Universal footer nav Styles*/
footer nav a
, footer nav a:visited
, footer nav a:hover
, footer nav .selected_nav a
, footer nav .selected_nav a:visited
, footer nav .selected_nav a:hover 
{
  color: #000000ad;
  text-align: left;
  line-height: 33px;
  font-weight: normal;
  padding:0px;
  text-transform:uppercase;
  letter-spacing:2px;
  font-size:0.8rem;
}
footer nav ul{display:block;}
footer nav li{display:block;float:none;}
footer nav li.selected_nav{background:transparent;}

.header-area{display:grid;}


@media (max-width:1100px),(max-device-width: 1100px)
{
  .header-cta{display:none;}
  .header-area{display:flex;}
  .logo{flex:1 1 200px;}
  nav{flex:1 1 auto;}
  nav a, nav a:visited, nav a:hover{padding:0 10px;}
  /*no longer fits in window*/
}

@media (max-width:800px),(max-device-width: 800px)
{
  .header-area{display:grid;}
  .header-cta{display:none;}
  .contact-us-mobile{display:inline-block;}
  /* Mobile nav break point */
  nav {box-shadow: none;}
  nav.mobile-nav a, nav.mobile-nav a:visited, nav.mobile-nav a:hover {
    background: #fff;
    color: #414141;
    line-height: 60px;
    padding: 0 25px;
    font-size: 1rem;
  }
  nav.mobile-nav ul {top: 65px;left: 0;width: 100%;}
  nav.mobile-nav a {
    border-bottom: none;
  }
  nav.mobile-nav-open ul {
    padding: 0;
    background: #fff;
    box-shadow:0px 10px 20px -20px #000;
  }
  nav.mobile-nav a:hover, nav.mobile-nav li:hover > a {
    background: #efefef;
    color: #000;
    border: none;
  }

  nav.mobile-nav ul ul li a, nav.mobile-nav ul ul li a:visited, nav.mobile-nav ul ul li a:hover {
    padding:0px 40px;
    background: #E7E7E7;
    white-space: normal;
    color: #000000b0;
  }
  nav.mobile-nav nav ul ul a, nav.mobile-nav nav ul ul a:visited{padding: 2px 40px;}

  li.has_submenu > a::after {
    position: absolute;
    top: 15px;
    padding-left: 35px;
  }

  nav .selected_nav > a::after {
    content: " ";
    background: #7F20F8;
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 20px;
    margin-left: 10px;
    position:static;
  }
  /* or this way...
  nav .selected_nav > a::after {
  content: " ";
  background: #7F20F8;
  width: 8px;
  height: 8px;
  border-radius: 20px;
  position: absolute;
  right: 30px;
  top: 25px;
}
  */

  nav li{
    position:relative !important;
  }

  nav a::before {
    content: " ";
    width: 21px;
    height: 17px;
    background: url(images/right-arrow-color.svg)no-repeat right center;
    background-size: auto;
    background-size: contain;
    display: inline-block;
    position: absolute;
    right: 30px;
    top: 20px;
  }
  nav .selected_nav > a::before {
    display:none;
  }


  footer nav.mobile-nav ul{display:block;background:transparent;}

  footer nav.mobile-nav a
  , footer nav.mobile-nav a:visited
  , footer nav.mobile-nav a:hover
  , footer nav.mobile-nav .selected_nav a
  , footer nav.mobile-nav .selected_nav a:visited
  , footer nav.mobile-nav .selected_nav a:hover {
    color: #000000ad;
    text-align: left;
    line-height: 33px;
    font-weight: normal;
    padding: 0px;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 0.8rem;
    background:transparent;
  }
}