/*SIDE NAVBAR colors on hover*/
.sideNav .nav-stacked > li:hover, .sideNav .nav-stacked > li > a:hover {
    color: #b81400;
    background: white;
}

.sideNav .nav-stacked > li:focus, .sideNav .nav-stacked > li > a:focus {
    color: #b81400;
    background: white;
}

.sideNav .nav-stacked > li:active, .sideNav .nav-stacked > li > a:active {
    color: #b81400;
    background: white;
}




/*EVERYTHING BELOW IS ABOUT THE MAIN NAVBAR ON TOP*/

/*color of letters of menu items, commenting out because needs to be overriden by bootstrap css, so added to layout.*/
    .navbar-inverse .navbar-nav > li,.navbar-inverse .navbar-nav > li > a {
        color: white;
    } 

    /*color of letters and background of menu items on hover*/
    .navbar-inverse .navbar-nav > li:hover, .navbar-inverse .navbar-nav > li > a:hover {
        color: white;
    } 

    .navbar {
        margin-bottom: 0px;
    }

    /*color of navbar background*/
    /*.navbar-inverse {
        background: #7e8c9a;
        border-color: #657381;
    }*/

    /* Dropdown Button */
    /*a.dropbtn {
        color: white;
        padding: 16px;
        font-size: 16px;hover
        border: none;
        cursor: pointer;
    }*/

    /* The container <div> - needed to position the dropdown content, color of dropdown item in the menu when not hovered. */
    /*li.dropdown {
        position: relative;
        display: inline-block;
    }*/

    /* Dropdown Content (Hidden by Default) */
    .dropdown-content {
        display: none;
        position: absolute;
        background-color: #f9f9f9;
        min-width: 160px;
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    }

    /* Links inside the dropdown, commenting out because needs to be overriden by bootstrap css, so added to layout. */
    .dropdown-content a {
        color: #3c3c3c;
        padding: 10px 16px;
        text-decoration: none;
        display: block;
    }

    /* Change color of dropdown items on hover */




    /* Change the background color of the dropdown button when the dropdown content is shown. If commented out, color stays the hovered one when you are hovering over menu items */
    /*li a:hover, .dropdown:hover .dropbtn {
        background-color: #3c3c3c;
    }*/

a:link{
    text-decoration: none;
}

.correctPositionOfSubmenu{
    padding-left:0px;
}

/* Actual navmenu CSS */


#myNavBar, #myNavBar li{
    display: block;
    list-style: none;
    position: relative;
}
    #myNavBar > li{
        float: left;
    }
    
        #myNavBar a{
            display: block;
            line-height: 40px;
            position: relative;
            color: white;
        }
            #myNavBar a:hover, #myNavBar a:focus{
                color: #fff;
            }

        #myNavBar ul a {
            padding-left: 10px;
        }
    

        /* Subnav Menu, background is colour of dropdown */
        #myNavBar .submenu{
            display: none;
            position: absolute;
            z-index: 80;
            background: repeat-x left top #353535;
            border: 1px solid #000;
        
            left: 0px;
            top: 37px;
            min-width: 100%;
        }
            #myNavBar .submenu li {
                display: block;
                /*line-height: 27px !important;*/
            }
                /*background color when hovering over dropdown items*/
                #myNavBar .submenu li:hover, #myNavBar .submenu li:focus {
                    background: #444 repeat-x top left;
                }
            
                /*line height is distance between dropdown items*/
                #myNavBar .submenu a {
                    display: block;
                    line-height: 27px !important;
                    white-space: nowrap;
                }
            
                /* show submenu when hovering over listitem that has a submenu */
                #myNavBar > li:hover .submenu,  #myNavBar > li:focus .submenu {
                    display: block;
                }
                    /* Hide next level of subnavigation */
                    #myNavBar > li:hover > .submenu .submenu, #myNavBar > li:focus > .submenu .submenu{
                        display: none;
                    }

    
        /*  Third-level Subnavigation */
            #myNavBar .submenu .submenu {
                position: absolute;
                left: 100%;
                top: -1px;
            }
                #myNavBar .submenu .submenu .padding {
                    width: 150%;
                    top: -35%;
                    height: 170%;
                }

                /*  Show subnavigation */
                #myNavBar > li:hover .submenu li:hover > .submenu, #myNavBar > li:focus .submenu li:focus > .submenu {
                    display: block;
                    z-index: 70 !important;
                }




/*side navbar*/