/* This displays the menu by using hover on the navbar and for mobile hover to open/close and */
/* click for multilevel menus (currentlu css3 aloows onlt 2 sub levels)*/

.mynav .toggle, [id^=drop] {
    display: none;
}

/*Added in dah*/
.mynav .toggle, [id^=mydrop] {
    display: none;
 }

.mynav {
    margin: 0;
    padding: 0;
    /*background-color: #254441;*/
    /*background-color: #e8e4e4;*/ /*lightgrey*/
    background-color: #f8f8d5; /*pale yellow*/
    width: 100%; /*Added In*/
    position: sticky; /*Added In*/
    top: 0px; /*Added In*/
 }

#logo {
    display: block;
    padding: 0 30px; /*WAS 30*/
    float: left;
    font-size: 18px;
    line-height: 60px; /*WAS 60*/
    color: #fff;
    background-color:#000
}

/*Font Sizes Added dah*/
.mynav ul li a {
    font-size:18px;
}

.mynav ul li ul li a {
    font-size: 16px;
    color: #fc1313;
    /*color: #000;*/
    line-height: 40px;
    background-color: #fcfce9; /*lightish yellow*/
}

.mynav:after {
    content: "";
    display: table;
    clear: both;
}

.mynav ul {
    float: right;
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative;
}

    .mynav ul li {
        margin: 0px;
        display: inline-block;
        float: left;
        /*background-color: #254441;*/
        background-color: #e8e4e4; /*medium grey*/
     }

.mynav a {
    display: block;
    padding: 0 20px; /*WAS 20*/
    /*color: #FFF;*/
    color: #000;
    /*font-size: 18px; dah*/
    line-height: 60px; /*WAS 60*/
    text-decoration: none;
}

.mynav ul li ul li:hover {
    /*background: #000000;*/
    background-color: #c1bbbb; /*dark grey*/
 }

.mynav a:hover {
    /*background-color: #000000;*/
    background-color: #c1bbbb; /*dark grey*/
}

.mynav ul ul {
    display: none;
    position: absolute;
    top: 60px;
}

.mynav ul li:hover > ul {
    display: inherit;
}

/*Resize Added DAH*/
/*.mynav .drop1 ul {
    width: 320px;
}*/
.mynav .drop1 ul li{
    width: 290px;
}


.mynav ul li {
    background-color: #f8f8d5; /*pale yellow*/
}
/*Finish*/


.mynav ul ul li {
    width: 170px;
    float: none;
    display: list-item;
    position: relative;
}

.mynav ul ul ul li {
    position: relative;
    top: -60px;
    left: 170px;
}

.mynav li > a:after {
    content: ' +';
}

.mynav li > a:only-child:after {
    content: '';
}


/* Media Queries
--------------------------------------------- */

@media all and (max-width : 1260px) {

.menu {
    width: 100%;
}
/*Resize Added DAH (Only required as resized above)*/
.mynav .drop1 ul {
    width: 100%;
}

.mynav .drop1 ul li {
    width: 100%;
}

.mynav ul li {
    background-color: #f8f8d5; /*pale yellow*/
}
/*Finish*/


#logo {
    /*display: block;dah */
    display: block;
    padding: 0;
    width: 100%;
    text-align: center;
    float: none;
    background-color:#000;
    color:#fff;
}

    .mynav {
        margin: 0;
        width: 100%;
        max-height: 96vh;
        overflow-y: scroll;
    }

.mynav .toggle + a, .menu {
    display: none;
}

/*Added line height for mobile (vertical menu)*/
.mynav a {
        line-height: 40px; /*WAS 60*/
}

   
.mynav .toggle {
    display: block;
    /*background-color: #254441;*/
    background-color: #f8f8d5; /*light yellow*/
    padding: 0 20px; /*WAS 20*/
    /*color: #FFF;*/
    color: #000;
    /*font-size: 20px; dah*/
    line-height: 40px; /*Changed from 60 to 40 for mobile (vertical)*/
    text-decoration: none;
    border: none;
  
}   

.mynav .toggle:hover {
    background-color: #c1bbbb; /*dark grey on Menu and + entries*/
}

/*Displays the Menu*/
.mynav [id^=mydrop]:checked + ul {
    display: block;
}

.mynav [id^=drop]:checked + ul {
    display: block;
    visibility: visible;
    opacity: 1;
}

/*Allows menu open/close on hover*/
  /*  .mynav:hover .menu {*/
  /*      display: block;*/
  /*      visibility: visible;*/
  /*      opacity: 1;*/
 /*}*/

.mynav ul li {
    display: block;
    width: 100%;
    background-color: #f8f8d5; /*light yellow*/
}

.mynav ul ul .toggle {
    padding: 0 40px;
}

.mynav ul ul a
{
    padding: 0 40px;
}


.mynav ul ul ul a {
    padding: 0 80px;
}

.mynav a:hover {
    background-color: #fbfc90; /*yellow*/
}

.mynav ul ul ul a {
    /*background-color: #71e63a;*/ /*light green*/
    background-color: #fff; /*white*/
}


.mynav ul li ul li .toggle {
    /*background-color: #c1bbbb;*/ /*dark grey*/
    background-color: #f8f8d5; /*light yellow*/
}

.mynav ul ul a {
    /*background-color: #1249e2*/ /*blue*/
    background-color: #fff; /*white*/
}

.mynav ul ul {
    float: none;
    position: static;
    color: #ffffff;
}

/*This allows multi level menu to open/close via hover*/
.mynav ul ul li:hover > ul, .mynav ul li:hover > ul {
    display: none; /*changed from none to block ---------------------*/

}


.mynav ul ul li {
    display: block;
    width: 100%;
}

.mynav ul ul ul li {
    position: static;
}
}


@media all and (max-width : 330px) {

.mynav ul li {
    display: block;
    width: 94%;
}
}