.container-nav:before,
.container-nav:after{ content: '.'; display: block; overflow: hidden; visibility: hidden; font-size: 0; line-height: 0; width: 0; height: 0;}

.container-nav:after{ clear:both;}

.container-nav{
    position: relative;
    margin  : 0 auto;
    padding-left : 15px;
    padding-right: 15px;
    max-width: 1170px;
}
@media (min-width: 768px) { .container-nav{ width:750px}}
@media (min-width: 992px) { .container-nav{ width:970px}}
@media (min-width: 1200px){ .container-nav{ width:1170px}}


/**============================================================================
 * DaisyNav
 *
 * DaisyNav v1.0.0 | (c) 2013 CircleWaves (support@circlewaves.com)
 * https://github.com/circlewaves/daisynav
 *
 * @section nav
*/

.nav-main{
    position: relative;
    padding: 5px 0;
    margin: 0 auto 10px auto;
    width: 100%;
    text-shadow: none;
    z-index: 100;
    background-color: #444;
}


/**============================================================================
 * 
 * menu-toggle-button
 * 
*/

.menu-toggle-button {
    display: none;
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 20px;
    font-family: FontAwesome;
    cursor: pointer;
    text-align: right;
    color: #eee;
    border-radius: 4px;
    background-color: #444;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.menu-toggle-button.active { color: #3498DB;}


/**============================================================================
 * 
 * ul.menu-list
 * 
*/
ul.menu-list {
    float: left;
    list-style: none;
    position: relative;
    display: inline-table;
    padding: 0;
    margin: 0;
    height: 100%    
}

ul.menu-list li { 
    position: relative;
    float: left; 
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

ul.menu-list li a{ display: block;}


/**============================================================================
 * 
 * submenu
 * 
*/
ul.menu-list ul {
    display: none;
    padding: 0;
    margin: 0;
    position: absolute;
    top: 100%;
    left: 0;
    list-style: none;
    z-index: 700
}

ul.menu-list ul li {
    position: relative;
    float: none;
    padding: 0;
    margin: 0;
}

ul.menu-list ul ul {
    position: absolute;
    top: 0px;
    left: 100%;
    z-index: 700;
}

ul.menu-list li:hover>ul { display: inline-block;}


/**============================================================================
 * 
 * menu-expand - style - All levels
 * 
*/

/* Fix for IE7 */
ul.menu-list li:hover>ul { background: #fff!ie;}

/* Submenu Expand Icon */
ul.menu-list li.has-submenu>a>span.menu-expand { font-size: 10px; margin-left: 10px;}

/* Fix for IE9 and below */
ul.menu-list li.has-submenu>a>span.menu-expand { float: none\9;}

/* Level 1 */
ul.menu-list>li.has-submenu>a>span.menu-expand:after { content: '\25BC';}

/* Level 2 */
ul.menu-list li li.has-submenu>a>span.menu-expand:after {
    float: right;
    margin-top: 3px;
    margin-right: 5px;
    content: '\25BA';
}

/**============================================================================
 * 
 * ul.menu-list - style - All levels
 * 
*/

/* You can manage with of elements by width of a-tag */
ul.menu-list li a{ 
    text-decoration: none; 
    padding: 5px 10px;
    font-size: 14px; 
    color: #fff;
}

/* Level 1 */
ul.menu-list>li  { margin:0 5px 0 0; background-color: #444;}
ul.menu-list>li:hover>a{ background-color: #333;}

/* Level 2 */
ul.menu-list>li>ul>li      { background-color: #555; border-bottom: 1px solid #4f4f4f;}
ul.menu-list>li>ul>li:hover{ background-color: #333;}
ul.menu-list>li>ul>li>a    { width: 250px;}

/* Level 3 */
ul.menu-list>li>ul>li>ul>li{ background-color: #666; border-bottom: 1px solid #4f4f4f;}
ul.menu-list>li>ul>li>ul>li:hover{ background-color: #333;}

ul.menu-list>li>ul>li>ul>li>a { width: 250px;}
ul.menu-list>li>ul>li>ul>li:hover>a{}
ul.menu-list>li>ul>li>ul>li>a:hover{}

ul.menu-list li a.active{ 
    color: #fff; 
    background-color: #009335;
}


/* RESPONSIVE MEDIA QUERIES */

@media screen and (max-width:768px) {
    .nav-main { padding: 0;}

    /* Init Logic */
    .menu-toggle-button { display: block;}

    .show-for-devices { display: block !important;}

    /**============================================================================
     * 
     * Submenu Expand Icon 
     * 
    */
    ul.menu-list li.has-submenu>a>span.menu-expand {
        padding: 0 10px 0 0;
        line-height: 1em;
        position: absolute;
        right: 0;
        z-index: 700;
        width: 100%;
        height: 100%;
        text-align: right;
    }

    ul.menu-list>li.has-submenu>a>span.menu-expand {}

    /**============================================================================
     * 
     * Submenu Expand Icon - style - All levels
     * 
    */
   
    /* Level 1 */
    ul.menu-list li li.has-submenu>a>span.menu-expand { padding: 0 6px 0 0;}

    /* Level 2 */
    ul.menu-list li li.has-submenu>a>span.menu-expand:after { content: '\25BC';}

    /**============================================================================
     * 
     * ul.menu-list 
     * 
    */
    ul.menu-list{ 
        display: none; 
        float: none;
        padding-bottom: 15px;
    }

    ul.menu-list li { clear: both; float: none;}

    /* Handling Submenu */
    ul.menu-list ul    { display: none; position: relative;}
    ul.menu-list ul ul { position: relative; top: 100%; left: 0;}

    ul.menu-list li:hover>ul { display: none;}

    /* Fix for IE7 */
    ul.menu-list li:hover>ul { background: #fff!ie;}

    /**============================================================================
     * 
     * ul.menu-list - style - All levels
     * 
    */
    ul.menu-list li a {
        position: relative;
        text-align: left;
    }

    /* Level 1 */
    ul.menu-list>li {
        margin: 0;
        border: none;
        border-bottom: 1px solid #4f4f4f;
    }
    ul.menu-list>li:hover>a{ color: #fff; background-color: #333;}


    /* Level 2 */
    ul.menu-list li li>a   { width: auto;}
    ul.menu-list>li>ul     { border: none;}
    ul.menu-list>li>ul>li  { padding-left: 2%;}
    ul.menu-list>li>ul>li>a{ width: 98%;}

    /* Level 3 */
    ul.menu-list>li>ul>li>ul { border: none;}

    ul.menu-list>li>ul>li>ul>li  { padding-left: 2%;}
    ul.menu-list>li>ul>li>ul>li>a{ width: 98%;}
}












/* Novas Classes */



/* Classe para altera posicao para rigth de apenas um bloco */
ul.menu-list ul.sub-list-right   { left: inherit; right: 0;}
ul.menu-list ul.sub-list-right ul{ left: inherit; right: 100%;}
ul.menu-list ul.sub-list-right li.has-submenu>a>span.menu-expand:after,
ul.menu-list ul.sub-list-right li li.has-submenu>a>span.menu-expand:after { float: left; content: '\25C4';}

ul.menu-list.nav-right{
    float: right;
    margin-top: 20px;
}

ul.menu-list li a i { margin-right: 10px;}


@media screen and (max-width:768px) {

    /* Classe para altera posicao para rigth de apenas um bloco */
    ul.menu-list ul.sub-list-right   { left: 0; right: inherit;}
    ul.menu-list ul.sub-list-right ul{ top: 100%; left: 0; right: inherit;}
    ul.menu-list ul.sub-list-right li.has-submenu>a>span.menu-expand:after,
    ul.menu-list ul.sub-list-right li li.has-submenu>a>span.menu-expand:after { float: right; content: '\25BC';}


    ul.menu-list.nav-right{
        float: none;
        margin-top: 0;
    }

}