/* ------------------------- NAV  ---------------------------- */

.navContainer {
                width:300px;
                /*background-color:lavender;*/
             }


/* The side navigation menu */
.sidenav {
        height: 100%;
        width: 300px;
        position: fixed;            /* Stay in place */
        z-index: 1;
        top: 0;
        left: -200px;
        background-color: black;
        overflow-x: hidden;         /* Disable horizontal scroll */
        padding-top: 60px;
        transition: 0.5s;           /*slide in the sidenav */
        }


/*  content to be pushed container*/
#main {
    position:relative;
    transition: margin-left .5s;
    height: 100vh;
    width: calc(100% - 100px);
    margin-left:100px;
    opacity: 1;
    /*overflow-x:hidden;           !*fix for horizontal pushable content *!*/
}


/* ------------------------- BUTTON  ---------------------------- */

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
                    position: absolute;
                    top: 6px;
                    right: 26px;
                    visibility: hidden;
                    font-size: 60px;
                    color: #c4617e;
                    margin-left: 50px;
                    font-weight:bold;
                 }

#menuButton {
            display: inline-block;
            position: absolute;
            top: 21px;
            right: 35px;
            visibility: visible;
            margin-left: 50px;
             }

.bar {
    width: 35px;
    height: 3px;
    background-color: #c4617e;
    margin: 6px 0;
    }


/*------------- CONTAINER:  logo ---------------------------*/

.logoContainer{
                margin-top:10px;
                margin-bottom:135px;
                margin-left:75px;
                text-align:center;
                }

.logoImg    {
            /*margin: 0 auto;*/
            display: block;
            }


#menuBlok {
            /*background-color:#ecd6dc;*/
            width:200px;
            }

/*---------------ACCORDION-------------------- Level 1 : menu items ----------------------------*/

.navContainer .menuheader 	{
                            font-family: 'Vidaloka', serif;
                            font-size: 1em;
                            color: #c4617e;
                            text-align:left;
                            font-weight: lighter;
                            text-transform: uppercase;
                            display: block;
                            transition: 0.3s;
                      /*      padding-left:50px;
                            padding-top:20px;
                            padding-bottom: 20px; */ 
                            border-top: 1px solid #1c1c1c;
                            border-bottom: 1px solid #1c1c1c;
                            }

/* When you mouse over the navigation links, change their color */
.menuheader:hover	{
                    background-color: #2d1920;
                    border-top: 1px solid #5d3543;
                    border-bottom: 1px solid #5d3543;
                   }


.menuheader a:link, .menuheader a:visited, .menuheader a:active{
        color: #c4617e;
    padding-left: 50px;
    padding-top: 20px;
    padding-bottom: 20px;
    display: block;
        }


#menuBlok .active a {
    color:#d5b3bf;
}


/*---------------ACCORDION--------------------- Level 2 : menu sub items - currently unused ----------------------------*/

/*CSS for UL of each sub menu*/
.navContainer ul    {
                    list-style-type: none;
                    margin: 0;
                    padding: 0;
                     }

.navContainer ul li	{
                    /*padding-bottom: 200px;    !*bottom spacing between menu items*!*/
                    padding-left:50px;
                    }


.navContainer ul li a	{
                        color: #9966ff;
                        font: 1.2em calibri;
                        /*font-variant: small-caps;*/
                        display: block;
                        padding: 0 0;
                        line-height:25px;
                        text-decoration: none;
                        /*margin-bottom: 8px; !*bottom spacing between each UL and rest of content*!*/
                      }


.navContainer ul li a:visited	{
                                 color: #9966ff;
                                 }


.navContainer ul li a:hover	{
                            /*hover state CSS*/
                            color: #ff90b1;
                            background-color: #F3F3F3;
                          }




/*mobile turned horizontal*/
@media (max-height: 400px) {

                        .logoContainer{
                            display:none;

                        }

}