Na}{

File Content: _mobile.scss

.pxl-header-mobile-transparent{
    position: absolute;
    left: 0;
    right: 0;
    z-index: 2;
}
 
.pxl-header-mobile-sticky{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: #fff;
    z-index: 99;
    @include transform(translateY(-100%));
    opacity: 0;
    visibility: hidden; 
    @include transition(all 0.3s cubic-bezier(0, 0, 0.55, 0.78)) ;
    &.mh-fixed {
        @include transform(translateY(0%));
        opacity: 1;
        visibility: visible;
        @include box-shadow(0 3px 18px rgba(#02154e, 0.09));
        @include animation(0.95s cubic-bezier(0, 0, 0.55, 0.78) 0s normal forwards 1 running headerSlideDown);
    }
}
.pxl-header-mobile-main-sticky{
    &.mh-fixed {
        position: fixed;
        left: 0;
        top: 0;
        right: 0;
        z-index: 9;
        @include box-shadow(0 3px 18px rgba(#02154e, 0.09));
        @include animation(0.95s cubic-bezier(0, 0, 0.55, 0.78) 0s normal forwards 1 running headerSlideDown); 
    }
}
.logged-in{
    .pxl-header-mobile-sticky,
    .pxl-header-mobile-main-sticky{
        &.mh-fixed{
            top: 32px;
            @media screen and (max-width: 782px) {
                top: 46px;
            }
            @media screen and (max-width: 600px) {
                top: 0;
            }
        }
    }
}

.main-menu-mobile {
    .btn-nav-mobile {
        display: inline-block;
        width: 72px;
        height: 14px;
        position: relative;
        text-decoration: none;
        cursor: pointer;
        span{
            position: absolute;
            width: 100%;
            height: 1px;
            background-color: #000000;
            @include transition(all .5s ease);
        }
        .hover.top{  
            width: 0;
            top: 3px;
            bottom: auto;
            @include transform(translateX(-150%));
            opacity: 0;
            visibility: hidden;
        }
        .hover.bottom{
            width: 0;
            top: 10px;
            bottom: auto;
            @include transform(translateX(150%));
            opacity: 0;
            visibility: hidden;
        }
        .default.top{  
            width: 100%;
            top: 3px;
            bottom: auto;
        }
        .default.bottom{
            width: 100%;
            top: 10px;
            bottom: auto;
        }
        &:hover{
            .hover.top{  
                width: 100%;
                @include transform(translateX(0));
                opacity: 1;
                visibility: visible;
            }
            .hover.bottom{
                width: 100%;
                @include transform(translateX(0));
                opacity: 1;
                visibility: visible;
            }
            .default.top{  
                width: 0;
                @include transform(translateX(150%));
                opacity: 0;
                visibility: hidden;  
            }
            .default.bottom{
                width: 0;
                @include transform(translateX(-150%));
                opacity: 0;
                visibility: hidden;
            }
        }
         
    }
}

@media (max-width: $lg_max){
	.pxl-header-mobile{
		.header-main-mobile{
			position: relative;
			@include box-shadow(0 5px 8px rgba(0, 0, 0, 0.02));
			background-color: #fff;
		}
        .mobile-menu-toggle{
            .bars{
                line-height: 1;
                cursor: pointer;
                span{
                    width: 30px;
                    height: 3px;
                    background-color: $second_color;
                    display: block;
                    @include transition();
                    &:nth-child(2){
                        margin: 7px 0;
                    }
                }
                &:hover{
                    span{
                        background-color: $primary_color;
                    }
                }
            }
        }
        
	}
	 
	.header-mobile-content{
		@include d-flex();
		align-items:center;
	}
}

Name	Size	Permission	Action
_mobile.scss	4196 bytes	0644
header.scss	309 bytes	0644