/* Top Menu */
#at_topbar {
  /* menu sizings */
--menuPadding:10px;
--menuTopBar:70px;
/* position:relative; */
display: flex;
justify-content: flex-end;
background-color: var(--mid-blue);
background-color: #005893BF;
/* height:85px; */
/* border-bottom: 5px solid var(--sand); */
transition: background-color 1000ms;
}
.open>#at_topbar{
background-color: var(--dark-blue);
transition: background-color 1000ms;
}

div#at_topbar{
position: fixed;
top: 0;
top:calc( 0 + var(--wp-admin--admin-bar--height));
left: 0;
right: 0;
z-index: 100;
}



#at_topbar .at_logo {
position:absolute;
top:0;
left:var(--gridGap);
z-index: 1;
/* max-width:170px; */
display: flex;
align-items: center;
padding: 24px;
/* background-color: var(--dark-blue); */
/* border-radius: 0 0 10px 10px; */
}
#at_topbar  .at_logo img{
width:clamp(6.25rem, 6.41vw + 4.808rem, 12.5rem);
height:auto;
/* max-height:20vh;
max-width:18vw; */
transition: width 1000ms;
}
#at_topbar.scrolling {

background-color: var(--mid-blue);
/* border-radius: 0 0 10px 10px; */ */
}

#at_topbar.scrolling .at_logo {
  padding:6px;

    }

/* #at_topbar.scrolling .at_logo a{
position:absolute;
inset:0;
  } */

#at_topbar.scrolling .at_logo img{
  padding:0;
width:52px;
}


#at_topbar li.menu-item.level-0{
height: 100%;
display: flex;
align-items: center;
}
#at_topbar li.menu-item{
  padding-right: 20px;  
}

#at_topbar:hover{ 
  background-color: var(--mid-blue);
}


#at_topbar .at_nav ul.sub-menu li.menu-item {
  padding: 4px 0;

}

#at_topbar .menu-item:hover ul.sub-menu {
  display: block;
  position: absolute;
  top: var(--topHeaderHeight);

  width: fit-content;
    height: auto;
  background-color: var(--dark-blue);
  padding: 20px;
  transform: translateX(-20px);
}


@media (max-width:768px) {
#at_topbar .at_logo {
  padding:10px;
}
#at_topbar .at_menu-text{
display:none;
}

#at_topbar.scrolling .at_logo {
  padding:10px;
}

#at_topbar.scrolling .at_logo a {
  position: relative;
  inset: 0;
}
#at_topbar.scrolling .at_logo img{
  padding:0;
height:auto;
width:80px;
transition: width 1000ms;
}
}


#at_topbar .at_nav  {
display: flex;
align-items: center;
padding:0 20px;
/* align-content: center; */
}

#at_topbar .at_nav ul {
display: flex;
list-style-type: none;
padding:0;
height: 100%;
    align-items: center;
}

#at_topbar  #at_quick-links{
  border-left:4px solid var(--gold);
}

#at_topbar  #at_quick-links ul{
  display: flex;
align-items: center;
list-style-type: none;
padding:12px 20px;
Background-color: var(--black);
}

#at_topbar #at_quick-links .at_ql-item{
display: flex;
flex-direction:column;
align-items: center;
margin-right: 14px;
gap:6px;
color:#fff;
text-decoration: none;
font-family: "Work Sans", Sans-serif;
font-size: 15px;
/* font-size: clamp(0.875rem, 0.125rem + 1.5625vw, 1.125rem); */
font-weight:500;
}
/*Menu Icons*/
#at_topbar #at_quick-links .at_ql-item>img{
  height: 24px;
/* filter: invert(33%) sepia(73%) saturate(908%) hue-rotate(170deg) brightness(98%) contrast(88%); */
}



#at_topbar .at_ql-item:hover{
/* color: lightblue; */
/* filter: invert(33%) sepia(73%) saturate(908%) hue-rotate(170deg) brightness(98%) contrast(88%); */
filter: brightness(0) saturate(100%) invert(94%) sepia(13%) saturate(6455%) hue-rotate(341deg) brightness(87%) contrast(94%);
}

/* Hamburger */
#at_topbar .g-hamburger {
position: relative;
z-index: 0;
width: 24px;
height: 24px;
cursor: pointer;
transition: opacity .2s ease-in-out;
color: #FFF;
}
#at_topbar .g-hamburger .hamburger-inner,
#at_topbar .g-hamburger .hamburger-inner::before,
#at_topbar .g-hamburger .hamburger-inner::after {
position: absolute;
right: 0;
left: 0;
height: 2px;
border-radius: 1.5px;
background: currentColor;
}
#at_topbar .g-hamburger .hamburger-inner {
top: 11px;
transition: transform .1s ease-in-out;
}
#at_topbar .g-hamburger .hamburger-inner::before,
#at_topbar .g-hamburger .hamburger-inner::after {
content: "";
transition: top .1s ease-in-out .1s, transform .1s ease-in-out;
}
#at_topbar .g-hamburger .hamburger-inner::before {
top: -7.5px;
}
#at_topbar .g-hamburger .hamburger-inner::after {
top: 7.5px;
}
#at_topbar .at_ql-item.active .g-hamburger .hamburger-inner {
transition: transform .1s ease-in-out .1s;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
#at_topbar .at_ql-item.active .g-hamburger .hamburger-inner::before,
#at_topbar .at_ql-item.active .g-hamburger .hamburger-inner::after {
top: 0;
transition: top .1s ease-in-out, transform .1s ease-in-out .1s;
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
}

/*#region*/
#at_menu-container {
position: fixed;
top: calc( var(--wp-admin--admin-bar--height) + 85px);
top:var(--headerHeight);
right: 0;
bottom: 0;
left: 0;
background-color: var(--dark-blue); /* semi-transparent gray */
display: grid;
grid-template-columns: 1fr 500px;
z-index:100;
overflow:scroll;
}

#at_menu{
padding:10vh var(--menuColPadding) 0;
position:relative;
}
#menu-main-menu-1{
position:relative;
}

#at_menu ul{
list-style:none;
padding:0;
margin:0;
}

/* Sub Menus*/


#at_topbar .at_nav ul.sub-menu {
  display: none;
}

#at_menu ul.sub-menu {
  visibility: hidden;
    height: 0;
    opacity: 0;
    transition: visibility 0.5s, height 0.5s, opacity 0.5s linear;
  
}

#at_menu li.menu-open>ul.sub-menu {
  visibility: visible;
    opacity: 1;
    height: 100%;
  padding: 20px 0;
  columns:2;
}



#at_menu #menu-primary-1{
  padding:20px;
}


#at_menu   li.level-0 {
  padding:20px 0;
  max-width:var(--menuColWidth);
  border-bottom:1px solid white;
  /* font-family: 'franklin-gothic-urw', sans-seriff; */
  font-size: clamp(1.5rem, 1.0714rem + 0.6696vw, 1.875rem);
  line-height:1.2;

  font-weight: 700;
}

#at_menu   li.level-0:(first-of-type) {
  border-top:1px solid white;
}
#at_menu   li.level-0:hover {
  color:var(-gold);
}

.at-mi-clicker {
  width: 20px;
  height: 20px;
  background-color: #fff;
  -webkit-mask: url(/wp-content/themes/oc/icons/icon_arrow.svg) no-repeat 50% 50%;
  mask: url(/wp-content/themes/oc/icons/icon_arrow.svg) no-repeat 50% 50%;
  margin: auto 0;

}
.at_mi-head:hover .at-mi-clicker,a.at_mi-link:hover .at-mi-clicker {
background-color: var(--gold);
}


.menu-open>.at_mi-head .at-mi-clicker {
  transform: rotateZ(90deg);
}

#at_menu   li.level-1{
padding:6px;
font-size: clamp(1.125rem, 0.6964rem + 0.6696vw, 1.5rem);
font-weight:400;
}

.at_mi-head{
display:flex;
justify-content:space-between;
}
.at_mi-head,a.at_mi-link{
color:white;
}
.at_mi-head:hover,a.at_mi-link:hover{
color:var(--gold);
cursor: pointer;
}
li.current-menu-parent .at_mi-head{
color:var(--gold);
}
li.current-menu-item>a{
color:var(--gold);
}

#at_menu-contacts{
  display: flex;
  line-height:1.3;
  flex-direction: column;
  align-items: center;
color:white;
  padding: calc(var(--headerHeight) + 30px) 20px 20px;
/* font-family:"Helvetica Neue",sans-serif; */
text-align:center;
}
#at_menu-contacts a:hover{
color: var(--gold);
}
#at_menu-contacts a{
color: white;
}

#at_menu-contacts .at_menu-logo img{
width:clamp(9.375rem, 6.41vw + 7.933rem, 15.625rem);
}
.at_menu-socials a {
  padding: 10px;
}

span.at_menu-contact-title {
  color: white;
  font-weight: bold;
  /* font-family: 'Helvetica Neue', sans-serif; */
}
/* Desktop Sub Menus */
@media (min-width: 1366px) {
#at_menu .at_menu-wrap li:hover ul.sub-menu{
display:block;
columns: 2;
padding: 20px 0;
margin: 0;
}
#at_menu .at_menu-wrap li:hover {
/* background-color:red; */
}

.at-mi-clicker {
display:none;

}
#at_menu li.level-0{
  position:absolute;
  left:var(--menuColWidth);
  padding-left:var(--menuColPadding);
  padding-top:8px;
  top:0;
  height:100%;
  }

#at_menu li.level-0>ul{
position:absolute;
left:var(--menuColWidth);
padding-left:var(--menuColPadding);
padding-top:8px;
top:0;
height:100%;
}
}

@media (max-width: 1024px) {
  #at_menu-contacts {
    /* display:none!important; */
  }
  #at_menu-container{
    grid-template-columns: 1fr;
  }
  #at_menu-contacts {
    display: flex;
    line-height: 1.3;
    flex-direction: column;
    align-items: center;
    color: white;
    padding: 50px 20px 20px;
    /* font-family: "Helvetica Neue",sans-serif; */
    text-align: center;
}
}


@media (max-width: 768px) {
  #at_topbar nav.at_nav {
    line-height: 1!important;
  }

nav.at_nav .at_menu-text{
display:none;
}


#at_topbar #at_quick-links ul {
  padding: 15px 0px 15px 6px;
}

#at_menu.submenu-open ul#menu-main-menu-1>li.menu-closed {
  display: none;
}
#at_menu.submenu-open li.menu-open {
  display: block;
  position:relative;
}
/* display under to item */
#at_menu.submenu-open li.menu-open>ul.sub-menu{
  display: block;
  position:relative;
  left:0;
columns:1;

}



/* reverse so arrow on the left */
#at_menu.submenu-open li.menu-open>.at_mi-head{
  flex-direction:row-reverse;
  justify-content: flex-end;
  gap:8px;
}
#at_menu.submenu-open li.menu-open>.at_mi-head>.at-mi-clicker{
  transform: rotateZ(180deg);
  
}
}/* little-tweaks */

/* BG IMage on home section - chevrons */
.oc_chevron-bg:before {
    content: "";
    /* background-color: var(--e-global-color-primary); */
    background-image: url(/wp-content/uploads/2023/10/oc-angle-graphic-1.jpg);
    background-position: center left;
    background-repeat: no-repeat;
    background-size: contain;
    transform: scaleX(-1);
    position: absolute;
    width: 100%;
    height: 100%;
    inset: 0;
}
@media (max-width: 768px) {
    .oc_chevron-bg:before {
        display:none;
    }
}/* Related Pages */

#oc-related article{
  position:relative;
}
#oc-related .elementor-post__text{
  position: absolute;
    bottom: var(--outsidePad) ;
    left: var(--outsidePad);
    /* transform: translate(-50%, -50%); */
}

#oc-related .elementor-post__text a{
  text-align:center;
  color:#fff;
}

/* #related-pages .elementor-post__title {
  padding: var(--outsidePad);

} */

#related-pages .elementor-post__thumbnail:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
	background:transparent linear-gradient(180deg, 	
rgb(0,0,0, 0) 0%, 	
rgb(0,0,0, 0.5) 100%) 0% 0% no-repeat padding-box
/*     background:transparent linear-gradient(180deg, 	
rgb(0,31,100, 0.5) 0%, 	
rgb(4,144,195, 0.5) 100%) 0% 0% no-repeat padding-box; */
}

#related-pages .elementor-post__thumbnail:hover {
	background: none!important;
}

/* end related items*/