/*remove elements*/
    html.html_av_admin_bar_active{
        margin-top: 0 !important;
    }
    #wpadminbar{
        display: none ;
    }
    #footer{
        width: 0;
        height: 0;
        margin: 0;
        padding:0; 
    }

    #main,
    #main > .main_color{
        background-color: transparent;
    }
    #header{
        z-index: 0 !important;
    }
    #header_main_alternate,
    #scroll-top-link{
        display: none;
    }


/*header background*/
    #header_main{
        position: fixed;
        padding-top: var(--space);
        width: 100%;
    }
    body:not(.home) #header_main{
        height: var(--header_height_search);   
        background-image: url(../images/bg_header.png);
        background-size: cover;
        background-position: bottom;
        background-repeat: no-repeat;
        border-bottom-left-radius: calc( var(--space) * 1.5 );
        border-bottom-right-radius: calc( var(--space) * 1.5 ); 
    }
    body.page-id-119 #header_main,
    body.page-id-283 #header_main,
    body.page-id-1230 #header_main{
        height: var(--header_height_detail);   
    }


    /*Logo*/
    #header_main .logo{
        width: var(--logo-width);
        height: auto;
    }
    #header_main .logo a,
    #header_main .logo img{
        max-height: unset !important;
    }
    #header_main .logo img{
        width: 100%;
        height: auto;
    }
    /*move main container cause it is hiding the logo - elements in main are position fixed anyway*/
    #main{
        margin-top: 600px;
    }



/*time info right top*/
    #date-time{
        position: fixed;
        right: var(--space);
        top: var(--space);
        font-size: var(--date-time-size);
        line-height: calc( var(--date-time-size) * 1.5 );
        color: var(--text-color);
        font-weight: bold;
        padding: 0;
    }

/*backbutton left top - not on home*/
    body:not(.home) .header_back_btn{
        position: fixed;
        padding: 10px;
        left: var(--space);
        top: var(--space);
    }
    body:not(.home) .header_back_btn a{
        margin:0;
        font-size: var(--header-font-size);
        line-height: var(--header-font-size);
        color: var(--text-color);
    }
    body:not(.home) .header_back_btn a::before{
        content:"";
        background-image: url(../images/icons/icon_back_dark.png);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        display: inline-block;
        width: calc( var(--header-font-size) + 10px );
        height: calc( var(--header-font-size) + 10px );
        margin-right: var(--header-font-size);
        margin-bottom: -10px;
    }

/*bottombar - not on home*/
body:not(.home) .bottom-bar a{
    position: fixed;
    bottom: var(--space);
    background: var(--highlight-pink);
    font-size: var(--nav-btn-small-font);
    color: #fff;
    line-height: var(--small-btn-height);
    text-align: center;
    border-radius: 20px;
    padding-left: var(--space);
}
body:not(.home) .bottom-bar a::before{
    content: "";
    width: var(--small-btn-height);
    height: var(--small-btn-height);
    background-size: contain;
    background-position: center ;
    background-repeat: no-repeat;
    position: absolute;
    left: calc(0.5 * var(--space));
    top: 50%;
    transform: translate(0 , -50%);
}
body:not(.home) .bottom-bar .footer_back_btn{
    left: var(--space);
}
body:not(.home) .bottom-bar .footer_back_btn::before{
    background-image: url(../images/icons/icon_back_white.png);
}
body:not(.home) .bottom-bar .back_to_home{
    right: var(--space);
}
body:not(.home) .bottom-bar .back_to_home::before{
    background-image: url(../images/icons/icon_home.png);
}

/*dont know why this was set to display none, need to display it again*/
#custom_html-4{
    display: block;
}
/*
Portrait Mode
*/
@media only screen and (orientation:portrait){
    /******
    *sizes
    *******/
    body:not(.home) .bottom-bar a{
        width: calc( ( 100vw - var(--space) * 3 ) * 0.5 );
    }
}

/*
Landscape Mode
*/
@media only screen and (orientation:landscape){

    body.page-id-119 .bottom-bar a{
        width: calc( (50vw - var(--space) * 5) * 0.5 );
    }
    body.page-id-119 .bottom-bar .footer_back_btn{
        left: calc( 50vw + var(--space) * 3 );
    }
}


