:root {
--width__side-menu: 250px;
--width__side-menu-hide: 60px;
--color__side-menu-background: #FFFFFF;
--color__side-menu-border: #E8E8E8;
--color__side-menu-nav-default: #1C1C1E;
--color__side-menu-logo: #383838;
}
.beeteam368-side-menu {
position: fixed;
top: 0;
left: 0;
bottom: 0;
z-index: 20;
overflow: hidden;
background-color: var(--color__side-menu-background);
width: 0;
}
@media (min-width: 576px) {
.beeteam368-side-menu {
width: var(--width__side-menu-hide);
border-right: 1px solid var(--color__side-menu-border);
}
}
.beeteam368-side-menu .beeteam368-side-menu-body {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
padding-top: var(--height__top-bar);
padding-left: 0;
padding-right: 0;
padding-bottom: 25px;
}
.side-close-btn .layer-show {
line-height: 0;
}
.svg-side-btn {
fill: var(--color__icon);
}
.svg-side-btn svg {
display: block;
width: 20px;
height: 20px;
margin: 8px auto;
}
.ctrl-show-hidden-elm .layer-hidden {
display: none;
flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
}
.ctrl-show-hidden-elm .layer-show {
width: var(--width__side-menu-hide);
text-align: center;
}
.side-nav-default {
padding-top: 5px;
padding-bottom: 5px;
}
.side-nav-default .ctrl-show-hidden-elm {
padding-top: 10px;
padding-bottom: 10px;
text-decoration: none;
}
.side-nav-default .ctrl-show-hidden-elm .category-menu {
color: var(--color__side-menu-nav-default);
}
.side-nav-default .ctrl-show-hidden-elm:hover .beeteam368-icon-item, .side-nav-default .ctrl-show-hidden-elm.side-active .beeteam368-icon-item {
background-color: var(--color__main);
color: #FFFFFF;
}
.side-nav-default .ctrl-show-hidden-elm:hover .category-menu, .side-nav-default .ctrl-show-hidden-elm.side-active .category-menu {
color: var(--color__main);
}
.side-top-heading {
display: inline-block;
padding: 5px 17px;
color: var(--color__side-menu-logo);
border: 1px solid var(--color__side-menu-logo);
}
.beeteam368-logo-wrap.elm-logo-side {
text-align: left;
}
.side-menu-mode .beeteam368-site-wrap-parent {
margin-left: 0;
}
@media (min-width: 576px) {
.side-menu-mode .beeteam368-site-wrap-parent {
margin-left: var(--width__side-menu-hide);
}
}
.side-menu-mode .elementor-top-section.elementor-section-stretched[style*="width"],
.side-menu-mode .elementor-section.elementor-top-section[style*="width"] {
padding-left: 0;
}
@media (min-width: 576px) {
.side-menu-mode .elementor-top-section.elementor-section-stretched[style*="width"],
.side-menu-mode .elementor-section.elementor-top-section[style*="width"] {
padding-left: var(--width__side-menu-hide);
}
}
.side-menu-mode .side-menu-close {
display: block;
}
.side-menu-mode .side-menu-open {
display: none;
}
@media (min-width: 1366px) {
.side-menu-mode.sidemenu-active .beeteam368-side-menu {
overflow: visible;
width: var(--width__side-menu);
}
.side-menu-mode.sidemenu-active .beeteam368-side-menu .beeteam368-side-menu-body {
padding-left: 25px;
padding-right: 25px;
}
.side-menu-mode.sidemenu-active .ctrl-show-hidden-elm .layer-hidden {
display: block;
}
.side-menu-mode.sidemenu-active .ctrl-show-hidden-elm .layer-hidden + .layer-show {
margin-left: 20px;
}
.side-menu-mode.sidemenu-active .ctrl-show-hidden-elm .layer-show {
width: auto;
}
.side-menu-mode.sidemenu-active .ctrl-show-hidden-elm .layer-show + .layer-hidden {
margin-left: 20px;
}
.side-menu-mode.sidemenu-active .side-menu-close {
display: none;
}
.side-menu-mode.sidemenu-active .side-menu-open {
display: block;
}
.side-menu-mode.sidemenu-active .beeteam368-site-wrap-parent {
margin-left: var(--width__side-menu);
}
.side-menu-mode.sidemenu-active .elementor-top-section.elementor-section-stretched[style*="width"],
.side-menu-mode.sidemenu-active .elementor-section.elementor-top-section[style*="width"] {
padding-left: var(--width__side-menu);
}
.side-menu-mode.sidemenu-active .oc-btn:hover .top {
transform: rotateZ(-45deg) translate(-9px, -6px);
-webkit-transform: rotateZ(-45deg) translate(-9px, -6px);
-ms-transform: rotateZ(-45deg) translate(-9px, -6px);
width: 12px;
}
.side-menu-mode.sidemenu-active .oc-btn:hover .middle {
transform: translateX(0);
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
}
.side-menu-mode.sidemenu-active .oc-btn:hover .bottom {
transform: rotateZ(45deg) translate(-9px, 6px);
-webkit-transform: rotateZ(45deg) translate(-9px, 6px);
-ms-transform: rotateZ(45deg) translate(-9px, 6px);
width: 12px;
}
.side-menu-mode:not(.sidemenu-active) .side-row:not(.side-row-show) {
display: none;
}
.side-menu-mode:not(.sidemenu-active) .side-nav-default .ctrl-show-hidden-elm:not(:hover) .beeteam368-icon-item {
background-color: transparent;
transition: none;
-webkit-transition: none;
}
.side-menu-mode:not(.sidemenu-active) .side-nav-default .ctrl-show-hidden-elm:not(:hover).side-active .beeteam368-icon-item {
background-color: var(--color__main);
}
}
@media (max-width: 1365px) {
.side-menu-mode.sidemenu-active-mobile .beeteam368-side-menu {
overflow: visible;
width: var(--width__side-menu);
}
.side-menu-mode.sidemenu-active-mobile .beeteam368-side-menu .beeteam368-side-menu-body {
padding-left: 25px;
padding-right: 25px;
}
.side-menu-mode.sidemenu-active-mobile .ctrl-show-hidden-elm .layer-hidden {
display: block;
}
.side-menu-mode.sidemenu-active-mobile .ctrl-show-hidden-elm .layer-hidden + .layer-show {
margin-left: 20px;
}
.side-menu-mode.sidemenu-active-mobile .ctrl-show-hidden-elm .layer-show {
width: auto;
}
.side-menu-mode.sidemenu-active-mobile .ctrl-show-hidden-elm .layer-show + .layer-hidden {
margin-left: 20px;
}
.side-menu-mode.sidemenu-active-mobile .side-menu-close {
display: none;
}
.side-menu-mode.sidemenu-active-mobile .side-menu-open {
display: block;
}
.side-menu-mode.sidemenu-active-mobile .oc-btn:hover .top {
transform: rotateZ(-45deg) translate(-9px, -6px);
-webkit-transform: rotateZ(-45deg) translate(-9px, -6px);
-ms-transform: rotateZ(-45deg) translate(-9px, -6px);
width: 12px;
}
.side-menu-mode.sidemenu-active-mobile .oc-btn:hover .middle {
transform: translateX(0);
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
}
.side-menu-mode.sidemenu-active-mobile .oc-btn:hover .bottom {
transform: rotateZ(45deg) translate(-9px, 6px);
-webkit-transform: rotateZ(45deg) translate(-9px, 6px);
-ms-transform: rotateZ(45deg) translate(-9px, 6px);
width: 12px;
}
.side-menu-mode:not(.sidemenu-active-mobile) .side-row:not(.side-row-show) {
display: none;
}
.side-menu-mode:not(.sidemenu-active-mobile) .side-nav-default .ctrl-show-hidden-elm:not(:hover) .beeteam368-icon-item {
background-color: transparent;
transition: none;
-webkit-transition: none;
}
.side-menu-mode:not(.sidemenu-active-mobile) .side-nav-default .ctrl-show-hidden-elm:not(:hover).side-active .beeteam368-icon-item {
background-color: var(--color__main);
}
}
.side-menu-mode.sidemenu-right .beeteam368-sidemenu-btn {
order: 999;
}
.side-menu-mode.sidemenu-right .oc-btn:hover .top {
transform: rotateZ(-45deg) translate(-9px, -6px);
-webkit-transform: rotateZ(-45deg) translate(-9px, -6px);
-ms-transform: rotateZ(-45deg) translate(-9px, -6px);
width: 12px;
}
.side-menu-mode.sidemenu-right .oc-btn:hover .middle {
transform: translateX(0);
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
}
.side-menu-mode.sidemenu-right .oc-btn:hover .bottom {
transform: rotateZ(45deg) translate(-9px, 6px);
-webkit-transform: rotateZ(45deg) translate(-9px, 6px);
-ms-transform: rotateZ(45deg) translate(-9px, 6px);
width: 12px;
}
.side-menu-mode.sidemenu-right .beeteam368-side-menu {
left: auto;
right: 0;
border-right: none;
border-left: 1px solid var(--color__side-menu-border);
}
.side-menu-mode.sidemenu-right .beeteam368-site-wrap-parent {
margin-right: 0;
}
@media (min-width: 576px) {
.side-menu-mode.sidemenu-right .beeteam368-site-wrap-parent {
margin-left: 0;
margin-right: var(--width__side-menu-hide);
}
}
.side-menu-mode.sidemenu-right .elementor-top-section.elementor-section-stretched[style*="width"],
.side-menu-mode.sidemenu-right .elementor-section.elementor-top-section[style*="width"] {
padding-right: 0;
}
@media (min-width: 576px) {
.side-menu-mode.sidemenu-right .elementor-top-section.elementor-section-stretched[style*="width"],
.side-menu-mode.sidemenu-right .elementor-section.elementor-top-section[style*="width"] {
padding-left: 0;
padding-right: var(--width__side-menu-hide);
}
}
.side-menu-mode.sidemenu-right .side-menu-close {
display: none;
}
.side-menu-mode.sidemenu-right .side-menu-open {
display: block;
}
@media (min-width: 1366px) {
.side-menu-mode.sidemenu-right.sidemenu-active .beeteam368-side-menu {
border-right: none;
border-left: 1px solid var(--color__side-menu-border);
}
.side-menu-mode.sidemenu-right.sidemenu-active .side-menu-close {
display: block;
}
.side-menu-mode.sidemenu-right.sidemenu-active .side-menu-open {
display: none;
}
.side-menu-mode.sidemenu-right.sidemenu-active .beeteam368-site-wrap-parent {
margin-left: 0;
margin-right: var(--width__side-menu);
}
.side-menu-mode.sidemenu-right.sidemenu-active .elementor-top-section.elementor-section-stretched[style*="width"],
.side-menu-mode.sidemenu-right.sidemenu-active .elementor-section.elementor-top-section[style*="width"] {
padding-left: 0;
padding-right: var(--width__side-menu);
}
.side-menu-mode.sidemenu-right.sidemenu-active .oc-btn:hover .top {
transform: rotateZ(45deg) translate(9px, -6px);
-webkit-transform: rotateZ(45deg) translate(9px, -6px);
-ms-transform: rotateZ(45deg) translate(9px, -6px);
width: 12px;
}
.side-menu-mode.sidemenu-right.sidemenu-active .oc-btn:hover .middle {
transform: translateX(0);
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
}
.side-menu-mode.sidemenu-right.sidemenu-active .oc-btn:hover .bottom {
transform: rotateZ(-45deg) translate(9px, 6px);
-webkit-transform: rotateZ(-45deg) translate(9px, 6px);
-ms-transform: rotateZ(-45deg) translate(9px, 6px);
width: 12px;
}
}
@media (max-width: 1365px) {
.side-menu-mode.sidemenu-right.sidemenu-active-mobile .beeteam368-side-menu {
border-right: none;
border-left: 1px solid var(--color__side-menu-border);
}
.side-menu-mode.sidemenu-right.sidemenu-active-mobile .side-menu-close {
display: block;
}
.side-menu-mode.sidemenu-right.sidemenu-active-mobile .side-menu-open {
display: none;
}
.side-menu-mode.sidemenu-right.sidemenu-active-mobile .oc-btn:hover .top {
transform: rotateZ(45deg) translate(9px, -6px);
-webkit-transform: rotateZ(45deg) translate(9px, -6px);
-ms-transform: rotateZ(45deg) translate(9px, -6px);
width: 12px;
}
.side-menu-mode.sidemenu-right.sidemenu-active-mobile .oc-btn:hover .middle {
transform: translateX(0);
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
}
.side-menu-mode.sidemenu-right.sidemenu-active-mobile .oc-btn:hover .bottom {
transform: rotateZ(-45deg) translate(9px, 6px);
-webkit-transform: rotateZ(-45deg) translate(9px, 6px);
-ms-transform: rotateZ(-45deg) translate(9px, 6px);
width: 12px;
}
}
.admin-bar .beeteam368-side-menu .beeteam368-side-menu-body {
padding-top: calc(32px + var(--height__top-bar));
}
@media (max-width: 782px) {
.admin-bar .beeteam368-side-menu .beeteam368-side-menu-body {
padding-top: calc(46px + var(--height__top-bar));
}
}
.admin-bar .beeteam368-side-menu .os-host-resize-disabled.os-host-scrollbar-horizontal-hidden > .os-scrollbar-vertical {
top: calc(32px + var(--height__top-bar) + 15px);
}
@media (max-width: 782px) {
.admin-bar .beeteam368-side-menu .os-host-resize-disabled.os-host-scrollbar-horizontal-hidden > .os-scrollbar-vertical {
top: calc(46px + var(--height__top-bar) + 15px);
}
}
.side-menu-navigation {
list-style: none;
margin: 10px 0;
padding: 12px 0;
border-top: 1px dashed var(--color__side-menu-border);
border-bottom: 1px dashed var(--color__side-menu-border);
text-transform: capitalize;
}
.side-menu-navigation ul, .side-menu-navigation li {
list-style: none;
margin: 0;
padding: 0;
}
.side-menu-navigation a {
text-decoration: none;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
color: var(--color__side-menu-nav-default);
transition: color 0.3s, background-color 0.3s, opacity 0.3s;
-webkit-transition: color 0.3s, background-color 0.3s, opacity 0.3s;
}
.side-menu-navigation a:hover {
opacity: 0.88;
}
.side-menu-navigation > li {
margin: 6px 0;
}
.side-menu-navigation > li > a {
position: relative;
padding: 5px 0 5px 56px;
}
.side-menu-navigation > li > a:before {
font-family: "Font Awesome 5 Free";
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
content: "\f35a";
font-size: 17px;
font-style: normal;
font-variant: normal;
text-rendering: auto;
font-weight: normal;
line-height: 1;
text-align: center;
display: block;
position: absolute;
width: 36px;
height: 16px;
left: 0;
top: 50%;
margin-top: -9px;
}
.side-menu-navigation > li > a.arrow-down:before {
content: "\f358";
}
.side-menu-navigation > li ul {
font-weight: normal;
padding-left: 25px;
}
.side-menu-navigation > li ul a {
padding: 5px 0;
}
.side-menu-navigation > li > ul {
display: none;
padding-left: 56px;
}
.side-menu-navigation > li.active-sub-menu > ul {
display: block;
}