1
.header-container-wrapper{top:0;z-index:9}
2
.header{padding:.0rem 0;background-color:#f5f2f5}
3
.header__container{
display:flex;justify-content:space-between}
4
.header__left{
display:flex;padding:1.5rem 0;flex:1}
5
.header__right-mob{display:none}
6
.header__logo{
display:flex;align-items:center;margin:0;max-width:15rem;flex:1}
7
.header__nav__menu,.header__nav__submenu{margin:0;padding:0;list-style:none;min-width:20rem}
8
.header__nav__link{font-size:1.6rem;font-weight:500;transition:all .25s ease-in-out .15s;appearance:none;text-align:left}
9
@media only screen and (min-width:961px){.header__nav__li{position:relative}
10
.header__nav__link{
display:flex;align-items:center;color:#41284e;font-weight:500;padding:0 1.8rem;border-radius:0;text-decoration:none !important;line-height:1;position:relative;z-index:1;appearance:none;background:0}
11
.header__nav__menu{height:100%}
12
.header__nav__li--depth-1{display:inline-block;height:100%;margin-right:.5rem}
13
.header__nav__li--depth-1:last-of-type{margin-right:0}
14
.header__nav__li--depth-1>.header__nav__link{height:100%}
15
.header__nav__li--depth-1.header__nav__li--has-submenu>.header__nav__link{box-sizing:content-box;border-bottom-right-radius:0;border-bottom-left-radius:0}
16
.header__nav__li--depth-1>.header__nav__link:focus{background:#f5f2f5;color:#9c5fa4;transition:all .25s ease-in-out 0s}
17
.header__nav__li--depth-1.header__nav__li--has-submenu>.header__nav__link::after{content:'';position:absolute;top:100%;left:0;width:100%;height:.0rem;transition:inherit;transition:background .25s ease-in-out .25s}
18
.header__nav__li--depth-1:focus-within>.header__nav__link::after{background:#f5f2f5;transition:background .25s ease-in-out 0s}
19
.header__nav__submenu{position:absolute;z-index:2;top:calc(100% + 0.0rem);background:#FFF;visibility:hidden;opacity:0;transition:opacity .25s ease-in-out .25s,box-shadow .25s ease-in-out .25s,visibility 0s linear .5s}
20
.header__nav__li--depth-1:focus-within>ul{opacity:1;visibility:visible;transition:opacity .25s ease-in-out,box-shadow .25s ease-in-out,visibility 0s linear 0s;box-shadow:0px 0px 2rem rgba(0,0,0,0.16)}
21
.header__nav__submenu .header__nav__link{color:#41284e;min-height:5rem;padding-top:.9em;padding-bottom:.9em;border-radius:0}
22
.header__nav__submenu--level-2 .header__nav__li:focus-within>.header__nav__link{background:#41284e;color:#FFF;transition:all .25s ease-in-out 0s}
23
.header__nav__submenu--level-3{top:0;left:100%;background:#FFF;transition:opacity .25s ease-in-out,visibility 0s linear .25s}
24
.header__nav__submenu--level-2>li:focus-within>ul{opacity:1;visibility:visible;transition:opacity .25s ease-in-out,visibility 0s linear 0s;box-shadow:0px 0px 2rem rgba(0,0,0,0.16)}
25
.header__nav__li.header__nav--mob-only{display:none}
26
.header__right{
display:flex}
27
.header__buttons{
display:flex;align-items:center;align-self:center}
28
.header__buttons .btn{margin-left:1rem;background:#FFF;color:#41284e;border:0;transition:all .25s ease-in-out}
29
.header__buttons .btn:hover{background:#41284e;color:#FFF;border:0}
30
}
31
@media only screen and (max-width:1024px) and (min-width:961px){.header__nav{margin-left:1.2rem}
32
.header__nav__li--depth-1{margin-left:0;margin-right:.5rem}
33
.header__nav__link{padding-left:1rem;padding-right:1rem}
34
}
35
@media only screen and (max-width:960px){.header{padding:.0rem 0}
36
.header__buttons{display:none}
37
.header__logo{max-width:10rem}
38
.header__right-mob{
display:flex;align-items:center}
39
.header__hamburger-container{width:3rem;height:3rem;position:relative;cursor:pointer;background:0;padding:0}
40
.header__hamburger::before,.header__hamburger,.header__hamburger::after{content:'';position:absolute;display:block;background:#9c5fa4;height:4px;width:100%;border-radius:2px}
41
.header__hamburger::before{top:-8px;transition:top .1s linear .1s,transform .1s linear}
42
.header__hamburger{top:50%;transform:translate(0,-50%);transition:all .1s linear .1s}
43
.header__hamburger::after{bottom:-8px;transition:bottom .1s linear .1s,transform .1s linear}
44
.header__hamburger.active::before{top:0;transform:rotate(45deg);transition:top .1s linear,transform .1s linear .1s}
45
.header__hamburger.active{background:rgba(255,255,255,0);transition:all .1s linear}
46
.header__hamburger.active::after{bottom:0;transform:rotate(-45deg);transition:bottom .1s linear,transform .1s linear .1s}
47
.header__nav{background:#9c5fa4;position:fixed;top:var(--headerHeight,5.5rem);bottom:0;right:0;width:40rem;transform:translate(100%);visibility:hidden;transition:transform .25s linear,visibility 0s linear .25s}
48
.header__nav.active{transform:translate(0);visibility:visible;transition:transform .25s linear,visibility 0s linear 0s}
49
.header__nav__menu,.header__nav__submenu{
display:flex !important;background:#9c5fa4;height:100%;flex-direction:column;padding:1.5rem 3rem;overflow:auto}
50
.header__nav__menu.overflow-hidden{overflow:hidden}
51
.header__nav__li{margin:1rem 0}
52
.header__nav__link__child-toggle-icon{display:none}
53
.header__nav__link{
display:flex;color:#FFF;background:#9c5fa4;align-items:center;text-decoration:none !important;line-height:1;padding:.6em 1.2em;width:100%;cursor:pointer}
54
.header__nav__li--has-submenu>.header__nav__link{justify-content:space-between}
55
.header__nav__li--has-submenu>.header__nav__link::after{content:'\f04b';font-family:'Font Awesome 5 Free';font-weight:900;font-size:1.4rem}
56
.header__nav__menu-back>.header__nav__link{background:0;font-weight:600}
57
.header__nav__menu-back>.header__nav__link::before{content:'\f04b';font-family:'Font Awesome 5 Free';font-weight:900;transform:rotate(180deg);margin-right:1.5rem;font-size:1.4rem}
58
.header__nav__li>.header__nav__link:hover{background:#FFF;color:#9c5fa4}
59
.header__nav__submenu{position:absolute;top:0;bottom:0;left:100%;width:0;min-width:0;padding:0;visibility:hidden;transition:transform .25s ease-in-out,visibility 0s linear .25s,padding 0s linear .25s,width 0s linear .25s}
60
.header__nav__submenu.active{visibility:visible;transform:translate(-100%);width:100%;padding:1.5rem 3rem;transition:transform .25s ease-in-out,visibility 0s linear 0s}
61
.nav-50-50{
display:flex;justify-content:space-between}
62
.nav-50-50 a{width:calc(50% - 0.7rem);background:#FFF;color:#41284e;border:0}
63
.nav-50-50 a:hover{background:#9c5fa4;color:#FFF;border:0}
64
}
65
@media only screen and (max-width:767px){.header__nav{width:100%}
66
}