2021-02-13 02:50:15 +00:00
|
|
|
.joe_dropdown{position:relative}.joe_dropdown__link{display:flex;align-items:center}.joe_dropdown__link-icon{transition:-webkit-transform 0.35s;transition:transform 0.35s;transition:transform 0.35s, -webkit-transform 0.35s}.joe_dropdown__menu{position:absolute;left:50%;visibility:hidden;z-index:999;border-top:3px solid var(--theme);-webkit-transform-origin:top;transform-origin:top;background:var(--background);box-shadow:0 0 10px rgba(0,0,0,0.15);border-radius:0 0 var(--radius-inner) var(--radius-inner);padding:10px 0;opacity:0;-webkit-transform:translateX(-50%) perspective(600px) rotateX(-45deg);transform:translateX(-50%) perspective(600px) rotateX(-45deg);transition:opacity 0.35s, visibility 0.35s, -webkit-transform 0.35s;transition:opacity 0.35s, visibility 0.35s, transform 0.35s;transition:opacity 0.35s, visibility 0.35s, transform 0.35s, -webkit-transform 0.35s}.joe_dropdown__menu::before{content:'';position:absolute;top:-10px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid var(--theme)}.joe_dropdown.active .joe_dropdown__link-icon{-webkit-transform:rotate(-180deg);transform:rotate(-180deg)}.joe_dropdown.active .joe_dropdown__menu{visibility:visible;opacity:1;-webkit-transform:translateX(-50%) perspective(600px) rotateX(0);transform:translateX(-50%) perspective(600px) rotateX(0)}.joe_mask{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.65);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);opacity:0;visibility:hidden;transition:visibility 0.35s, opacity 0.35s;z-index:888}.joe_mask.active{visibility:visible;opacity:1}.joe_header{position:-webkit-sticky;position:sticky;top:0;z-index:1000;background:var(--background);box-shadow:0 2px 10px 0 rgba(0,0,0,0.1)}.joe_header__above{position:relative;z-index:998;background:var(--background)}.joe_header__above .joe_container{align-items:center}.joe_header__above-slide{display:none;position:relative;width:20px;height:20px;cursor:pointer;margin-right:10px}.joe_header__above-slide .line{position:absolute;height:2px;width:20px;opacity:1;left:0;top:0;-webkit-transform:rotate(0deg);transform:rotate(0deg);background-color:var(--routine);border-radius:1px;transition:top 0.35s ease, opacity 0.35s, -webkit-transform 0.35s;transition:top 0.35s ease, transform 0.35s, opacity 0.35s;transition:top 0.35s ease, transform 0.35s, opacity 0.35s, -webkit-transform 0.35s}.joe_header__above-slide .line:nth-child(2){top:9px}.joe_header__above-slide .line:nth-child(3){top:18px}.joe_header__above-slide.active .line:nth-child(1){top:9px;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.joe_header__above-slide.active .line:nth-child(2){opacity:0}.joe_header__above-slide.active .line:nth-child(3){top:9px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.joe_header__above-logo{position:relative;display:flex;align-items:center;height:60px;padding-right:15px;margin-right:15px}.joe_header__above-logo img{max-width:150px;max-height:50px;-o-object-fit:cover;object-fit:cover}.joe_header__above-logo svg{display:none}.joe_header__above-logo::after{content:'';position:absolute;top:50%;right:0;width:1px;height:20px;background:var(--classC);-webkit-transform:translateY(-50%);transform:translateY(-50%)}.joe_header__above-nav{display:flex;align-items:center}.joe_header__above-nav .item{position:relative;height:60px;line-height:60px;font-size:15px;padding:0 8px;margin-right:15px;transition:color 0.35s;white-space:nowrap;color:var(--main)}.joe_header__above-nav .item:last-child{margin-right:0}.joe_header__above-nav .item::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;transition:opacity 0.5s, -webkit-transform 0.5s;transition:opacity 0.5s, transform 0.5s;transition:opacity 0.5s, transform 0.5s, -webkit-transform 0.5s;border-radius:6px 6px 0 0;opacity:0;-webkit-transform:scaleX(0.25);transform:scaleX(0.25);background:var(--theme)}.joe_header__above-nav .item.active,.joe_header__above-nav .item:hover{color:var(--theme)}.joe_
|
