/*----------------------------------------------------------------*/
/*                   Background/Border/Display                    */
/*----------------------------------------------------------------*/

/* background */

#superfish-main-accordion li.sf-expanded,
ul.sf-accordion li,
#superfish-main--2 .okpud-menu-item ul,
#superfish-main--2 {
	background: var(--menu-main-color) !important;
}
#superfish-main--2 li {
	 background: var(--menu-main-color);
}

.sf-expanded li.sf-depth-2 {
	background: #355fb5 !important;
}

.sf-expanded li.sf-depth-3 {
    background: #435d94 !important;
}

#superfish-main-toggle.sf-expanded,
li.sf-expanded > span {
	background: var(--color-blue) !important;
}

/* boxshadow */
#superfish-main--2.okpud-menu,
.okpud-menu-item ul,
.okpud-menu-link ul { 
	-webkit-box-shadow: var( --shadow-black); 
	        box-shadow: var( --shadow-black);
}

/* Other settings */ 
 #superfish-main-accordion {
	overflow: hidden;
	border-top-left-radius: 8px;
	border: 3px solid var(--color-blue);
}

.sf-accordion-toggle .sf-expanded {
	border-top-left-radius: 8px;
	height: 35px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center; 
}
.sf-expanded li.sf-depth-2:last-child,
.sf-expanded li.sf-depth-3:last-child  {
	border-bottom: 2px solid #ffea00;
}
.sf-expanded li.sf-depth-2:last-child li.sf-depth-3:last-child {
 border-bottom: none;
}
.sf-expanded li.sf-depth-2:first-child,
.sf-expanded li.sf-depth-3:first-child {
    border-top: 2px solid #ffea00;
}

/*----------------------------------------------------------------*/
/*                             Layout                             */
/*----------------------------------------------------------------*/
/*li.sf-depth-1.okpud-menu-item {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
}*/

.sf-depth-2.sf-expanded span, .sf-depth-2.sf-expanded ul li{
    padding-left: 15px !important;
}

#superfish-main-accordion li.sf-clone-parent svg {
	display: none;	
}
#superfish-main--2 li#main-standardfront-page--2 {
    display: none;
}
/*flex Box*/
#superfish-main--2.okpud-menu,
#superfish-main--2 .okpud-menu-link.sf-depth-1,
#superfish-main--2 .okpud-menu-item,
#superfish-main-accordion .okpud-menu-link,
#superfish-main-toggle{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

#superfish-main--2 .sf-depth-1.okpud-menu-item,
#superfish-main--2 .okpud-menu-link.sf-depth-1 *,
#superfish-main--2 .okpud-menu-link.sf-depth-1,
#superfish-main-accordion .okpud-menu-link span,
#superfish-main-toggle {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
}

#superfish-main--2 .okpud-menu-link.sf-depth-1 {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
    -webkit-box-align:    center;
        -ms-flex-align:    center;
            align-items:    center;
    text-align:     center;
}

#superfish-main--2 .okpud-menu-item {
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
    -webkit-box-align:     center;
        -ms-flex-align:     center;
            align-items:     center;
}

#superfish-main--2.okpud-menu {
    -ms-flex-line-pack: stretch;
        align-content: stretch;
    -ms-flex-wrap:     nowrap;
        flex-wrap:     nowrap;
}

#superfish-main-accordion .okpud-menu-link,
#superfish-main-toggle {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

#superfish-main-accordion .okpud-menu-link svg{
	-webkit-box-flex:0;
	    -ms-flex:0 0 15%;
	        flex:0 0 15%;
}


/* Other layout Settings */
.block-superfish, 
.block-superfish .content, 
#superfish-main, 
#superfish-main--2.okpud-menu {
    width:  100%;
    height: 100%;
}
#superfish-main--2 .okpud-menu-link {
	width:      100%;
}

#superfish-main--2.okpud-menu {
    padding:    0px;
    margin:     0px !important;
}

.sf-depth-2.okpud-menu-item.menuparent ul {
	left: 98%;
    top:  0 !important;
}

.okpud-menu-item ul,
.okpud-menu-link ul {
    width: 100% !important;
    top:   100% !important;
}

#superfish-main-accordion {
	width: calc(100% + 4px);
}

#superfish-main-accordion li a {
	padding-top:    10px;
	padding-bottom: 10px;
}

.sf-accordion-toggle a {
	padding: 7px 0px 7px 10px !important;

}

.sf-accordion-toggle {
	margin-left: 90px;
	width:       calc(100% - 80px);
	-webkit-transition:  all 500ms;
	-o-transition:  all 500ms;
	transition:  all 500ms;
}

.sf-accordion li li a {
	padding-left: 10px
}

#superfish-main-accordion li.sf-clone-parent a {
    margin-left: -2px;
}
.sf-depth-2.okpud-menu-link,
.sf-depth-3.okpud-menu-link {
	padding: 8px 8px 8px 8px !important;
}

.okpud-menu-link.sf-depth-1 svg {
    padding-bottom: 5px;
}

/*----------------------------------------------------------------*/
/*                              Text                              */
/*----------------------------------------------------------------*/


#superfish-main-accordion .okpud-menu-link svg{
	font-size: 12px;
}
li.sf-expanded .sf-expanded span.menuparent {
	color: #ffea00
}

.sf-depth-2.okpud-menu-link,
.sf-depth-3.okpud-menu-link {
    font-size: 12px;
	font-weight: normal;
	font-stretch: extra-expanded;
}

#superfish-main-accordion .okpud-menu-link span,
#superfish-main-accordion li a {
 font-size: 12px;
}

.okpud-menu-link.sf-depth-1 span {
    font-stretch: ultra-expanded;
	font-size: 12px;
	font-weight: bold;
}

 .okpud-menu-link.sf-depth-1 svg {
    font-size: 2vw;
}

/*----------------------------------------------------------------*/
/*                        User Interaction                        */
/*----------------------------------------------------------------*/

*:focus{
	outline: none !important;
}

/* Home Button Popup */
#superfish-main-accordion .smooth-hover {
	-webkit-transform: none;
	    -ms-transform: none;
	        transform: none;
}

.titleimg.smooth-hover.smooth-hover-img:hover:before {
	border-radius: 50px;
    box-shadow: 0px 0px 20px 20px #00000075, inset 0px 0px 15px 14px #00000075;
	content: 'Home Page';
	color: #ffffff;
    position: absolute;
    font-size: 20px;
    font-weight: bold;
	text-shadow: 0px 0px 10px black;
	transform: translate(25px, 80px);
	transition: all 300ms ease-in-out !important;
	-o-transition: all 300ms ease-in-out !important;
	-webkit-box-shadow: 0px 0px 20px 20px #00000075, inset 0px 0px 15px 14px #00000075;
	-webkit-transition: all 300ms ease-in-out !important;
    -webkit-transform: translate(25px, 80px);
    -ms-transform: translate(25px, 80px);
}
.sf-depth-2.menuparent {
    cursor: default;
}

/*
----------------------------------------------------------------
Expand Box animation
----------------------------------------------------------------
*/

.sf-depth-2.smooth-hover-active.menuparent {
	margin-left: 0 !important;
	margin-right:0 !important;
}
#superfish-main--2 li.sf-depth-1.sfHover{
	background: var(--menu-active-color) !important;
	box-shadow: var(--shadow-black);
	color: inherit;
	width: 15vw;
    -webkit-box-shadow: var(--shadow-black);
	-webkit-transition: width .4s ease;
    -o-transition: width .4s ease;
	transition: width .4s ease;
}
#superfish-main--2 li.sf-depth-1 {
	-webkit-transition: width .4s ease;
    -o-transition: width .4s ease;
    transition: width .4s ease;        
    width: 11vw;
}

/*remove button text*/
li.sf-depth-1.sfHover .link-text{
  	font-size:inherit;
	color: transparent;
	display:none !important;
}
#superfish-main--2 li.sf-depth-1:hover .link-text{
color:transparent;
}
li.sf-depth-1 .link-text{
	-webkit-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
	font-size:inherit;
    color: inherit;
    display: unset;
}
/* grow svg */
li.sf-depth-1.sfHover svg{
	font-size: 2vw;
    margin: auto;
	-webkit-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
li.sf-depth-1.sfHover svg{
	font-size: 4vw;
    margin: auto;
    -webkit-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

/*----------------------------------------------------------------*/
/*                        misc. animation                        */
/*----------------------------------------------------------------*/

.smooth-hover-active > .okpud-menu-link {
    background: transparent !important;
    font-size: 12px !important;
	font-weight: 700 !important;
}

li.sf-depth-2.sfHover span{ 
	color: #ffea00 !important;
}
li.active-trail.okpud-menu-item > a {
    color: gray !important;
}
a.is-active.okpud-menu-link {
    color: gray !important;
    background: var(--color-blue) !important;
}
li.sf-depth-2.sfHover{
	background: var(--menu-active-color) !important;
    -webkit-box-shadow: var(--shadow-black);
            box-shadow: var(--shadow-black);
}

.sfHover svg {
	color: #ffea00;
}
.okpud-menu-item:not(.sfHover, .sf-depth-1):hover {
	-webkit-box-shadow: var(--shadow-black);
	        box-shadow: var(--shadow-black);
	background: var(--menu-active-color) !important;
}

.sf-depth-1.sfHover.okpud-menu-item:hover > * {
	 color: #ffea00;
}
.is-active.okpud-menu-link {
	color: transparent !important;
	cursor: default !important;
	pointer-events: none;
}
.okpud-menu-link {
    cursor: pointer;
}


.active-trail.smooth-hover, .active-trail.smooth-hover:hover {
    cursor: default !important;
    background: var(--color-blue) !important;
}
.active-trail.smooth-hover svg,
.active-trail.smooth-hover .link-text{
	 color: #ffea00;
}
