@charset "UTF-8";

.menuFixo {
	position: fixed;
	top: 0;
	z-index: 99;
}

.nav-usuario {
	width: 100%;
	margin-bottom: 6px;
	font-size: 14px;
	float: right;
	text-align: right;
}
.nav-usuario a { text-decoration: none; }

/*Mobile View*/
@media (max-width: 454px){
	.nav-usuario { margin-top: 20px; }

	.title {
		padding: 0px;
		font-weight: bold;
		width: 100%;
	}
	header { 
		width: 100%; 
		margin-bottom: 0px;
		box-shadow: 0px 2px 5px black; 
		height: var(--param_header_height_mobile);
	}
	header .title {
		width: 100%;
		margin: auto;
		padding: 0px;
		background-image: var(--param_header_title_background_image);
		background-repeat: no-repeat;
		background-position: var(--param_header_title_background_position);
		background-size: var(--param_header_title_background_size);
		height: var(--param_header_title_height);
	}

    .nav-bar {
        display: block;
        width: 100%;
        position: fixed;
        top: 0;
        margin-bottom: 56px;
		background: var(--param_nav_bar_background);
        z-index: 10;
    }
    .nav-bar span {
        float: left;
        font-size: 20px;
        padding: 16px;
        color: var(--param_header_nav_ul_li_a_color);
    }
    .nav-bar .fa-bars {
        display: block;
        padding: 16px;
        color: var(--param_header_nav_ul_li_a_color);
        overflow: hidden;
        font-size: 24px;
        font-weight: bold;
        text-decoration: none;
        float: right;
    }
    header nav {
        background: var(--param_header_nav_background);
        z-index: 1000;
        width: 80%;
        margin: auto;
        position: fixed;
        right: 100%;
        top : 56px;
        overflow: hidden;
        height: 100%;
    }
    header nav ul { 
        list-style: none; 
        width: 100%;
        margin: auto;
    }
    header nav:after {
        content: "";
        display: block;
        clear: both;
    }
    header nav ul li {
        float: left;
        position: relative;
        display: block;
        border-bottom: 1px solid var(--param_header_nav_ul_li_a_color);
        width: 100%;
    }
    header nav ul li a {
        color: var(--param_header_nav_ul_li_a_color);
        display: block;
        padding: 16px;
        font-size: 20px;
        text-decoration: none;
        font-family: tahoma;
    }
    header nav ul li:hover { background: var(--param_header_nav_ul_li_hover_background); }
    header nav ul li:hover i { color: var(--param_header_nav_ul_li_i_color); }
    header nav ul li i { 
        color: var(--param_header_nav_ul_li_i_color); 
        margin-right: 10px; 
    }
    header nav ul li:hover .children { display: none; }
    header nav ul li .children {
        background: var(--param_header_nav_background);
        z-index: 1000;
        width: 100%;
        position: relative;
        display: none;
        overflow: hidden;
    }
    header nav ul li .children li {
        display: block;
        width: 100%;
        border-bottom: 1px solid var(--param_header_nav_ul_li_a_color);
        padding: 10px;
    }
    header nav ul li .children li a { margin-left: 30px; }
    header nav ul li .fa-angle-down {
        position: relative;
        top: 3px;
    }
    header {margin-bottom: 10px;}
    header ul li a { display: block; }
    header nav ul li ul li:first-child { border-top: 1px solid var(--param_header_nav_ul_li_a_color); }
    header nav ul li .children a {
        margin-left: 10px;
        padding: 5px 0;
    }
    header nav ul li .children span {
		display: inline-block;
		margin-right: 10px;
    }

}

/*Desktop View*/
@media (min-width: 455px){
	.nav-usuario { margin-top: 4px; }

	.title {
		background-position: right 0px;
		color: white;
		padding: 0px;
		font-weight: bold;
		width: 100%;
	}
	header { 
		background-image: var(--param_header_background_image);
		background-repeat: repeat;
		width: 100%; 
		margin-bottom: 16px;
		box-shadow: 0px 5px 10px black;
	}
	header .title {
		width: 900px;
		margin: auto;
		padding: 0px;
		background-image: var(--param_header_title_background_image);
		background-repeat: no-repeat;
		background-position: var(--param_header_title_background_position);
		height: var(--param_header_title_height);
	}

    .nav-bar { display: none; }
    header nav {
        background: var(--param_header_nav_background);
        z-index: 1000;
        width: 100%;
        margin: auto;
    }
    header nav ul { 
        list-style: none; 
        width: 900px;
        margin: auto;
    }
    header nav:after {
        content: "";
        display: block;
        clear: both;
    }
    header nav ul li {
        float: left;
        position: relative;
    }
    header nav ul li a {
        color: var(--param_header_nav_ul_li_a_color);
        display: block;
        /*define a largura da barra de menu*/
        height: 42px;
        padding: 10px;
        font-size: 16px;
        /*fim da definição*/
        text-decoration: none;
        font-family: tahoma;
        cursor: pointer;
    }
    header nav ul li:hover { background: var(--param_header_nav_ul_li_hover_background); }
    header nav ul li:hover i { color: var(--param_header_nav_ul_li_i_color); }
    header nav ul li i { 
        color: var(--param_header_nav_ul_li_i_color); 
        margin-right: 10px; 
    }
    header nav ul li:hover .children { display: block; }
    header nav ul li .children {
        background: var(--param_header_nav_background);
        z-index: 1000;
        width: var(--param_header_nav_ul_li_children_width);
        position: absolute;
        display: none;
        box-shadow: 0px 3px 7px black;
    }
    header nav ul li .children li {
        display: block;
        width: 100%;
        border-bottom: 1px solid var(--param_header_nav_ul_li_a_color);
    }
    header nav ul li .children li a { margin-left: 30px; }
    header nav ul li .fa-angle-down {
        position: relative;
        top: 3px;
    }
    header { 
        width: 100%; 
        margin-bottom: 16px;
    }
	header nav ul li .children span { 
		display: none; 
	}
}