/*----------------------------------------------------------------------------------*/
/*Horizontal Multi-Level Drop Down Menu with Pure CSS*/
/*https:// www.cssscript.com/create-a-multi-level-drop-down-menu-with-pure-css*/
/*----------------------------------------------------------------------------------*/

ul 
{
    list-style: none;
    padding: 0;
    margin: 0;
    /*background:#FFFFFF;*/ /*#1bc2a2;*/
}

ul li 
{
    display: block;
    position: relative;
    float: left;
    /*background: #FFFFFF;*/

    font-family:Arial, Tahoma, Verdana; /*Main & Sub items font*/
    font-size:17px;

    z-index:1000;
}

/* This hides the dropdowns */

li ul 
{
    display: none;
}

ul li a 
{
    display: block;

    /*Padding for items main & sub*/
    /*padding: 10px;*/ /*1em;*/
    padding-top:8px;
    padding-bottom:8px;
    padding-left:10px;
    padding-right:10px;

    text-decoration: none;
    white-space: nowrap;
    /*color: #fff;*/
    color: #867465 !important; /*#3C3C3C !important;*/
}

ul li a:hover 
{
    text-decoration: none; /*Main & Sub item no undeline of link when hover*/

    /*background: #FFFFFF;*/ /*#FFFFD4;*/ /*Main item background hightlight when hover*/

    /*border:1px solid #D5C3AA;*/ /*#E4E4E4;*/ /*Main item border when hover*/

    color:#B22222 !important; /*Main & Sub Text Color when hover */
}

/* Display the dropdown */

li:hover > ul 
{
    display: block;
    position: absolute;

    /*width:350px;*/ /*SubMenu Item Box Width, if not set is auto fix*/
    min-width:250px;
    border:1px solid #D5C3AA; /*#E4E4E4;*/ /*SubMenu Box All Outer Border*/
}

li:hover li 
{
    float: none;

    background: #FFFFFF; /*Sub item background*/

    border-bottom:1px dotted #D5C3AA; /*#E4E4E4;*/ /*Sub item serparate border*/
}

li:hover a 
{
    /*background: #FFFFFF;*/ /*#F2F2F2;*/ /*Sub all menu box background*/
}

li:hover li a:hover 
{
    background: #E9E2D5; /*#FFFFD4;*/ /*#F2F2F2;*/ /*Sub item background highlight when hover*/
}

.main-navigation li ul li 
{
    border-top: 0;
}

/* Displays second level dropdowns to the right of the first level dropdown */

ul ul ul 
{
    left: 100%;
    top: 0;
}

/* Simple clearfix */

ul:before,
ul:after 
{
    content: " "; /* 1 */
    display: table; /* 2 */
}

ul:after 
{
    clear: both;
}