/* corpo logo e linguagens */
div.header { display: block; position: relative; width: 1200px; height: 71px; margin: 17px auto 0 auto; }

@media all and ( max-width: 1099px )
{
	div.header { position: fixed; top: 0; left: 0; width: 100%; height: 50px; background-color: #000000; margin: 0; z-index: 400; }
}

/* logotipo */
div.header a.logo { display: block; position: absolute; top: 0; left: 30px; width: 347px; height: 71px; margin: 0; background: transparent url(../../../../src/img/logos/logo.png) no-repeat; }

@media all and ( max-width: 1099px )
{
	div.header a.logo { left: 10px; top: 5px; width: 195px; height: 40px; background-size: cover; }
}

/* menu responsivo */
div.header span.responsive { display: none; }
div.responsive { display: none; }

@media all and ( max-width: 1099px )
{
	div.header span.responsive { display: block; position: absolute; top: 12px; right: 10px; width: 42px; height: 25px; margin: 0; background: transparent url(../../../../src/img/responsive_icon.png) no-repeat 0 0; cursor: pointer; }
	div.header span.responsive.open { background-position: 0 -25px; }
	div.responsive { display: block; position: fixed; top: -100%; left: 0; width: 100%; background-color: #101010; z-index: 350; }
	div.responsive
	{
		height: 100%;
		height: -webkit-calc( 100% - 50px );
		height: -moz-calc( 100% - 50px );
		height: calc( 100% - 50px );
	}
		div.responsive a.menu:first-child { margin: 30px auto 0 auto; }
		div.responsive a.menu { display: block; position: relative; width: 100%; margin: 10px auto; text-align: center; font-size: 16px; line-height: 30px; font-weight: bold; text-decoration: none; }

		div.responsive div.bg { display: block; position: relative; width: 80%; margin: 25px auto 0 auto; padding: 15px 0; background-color: #1A1B16; }
			div.responsive div.bg a { display: block; position: relative; width: 100%; margin: 10px auto; text-align: center; font-size: 16px; line-height: 30px; font-weight: bold; text-decoration: none; }

		div.responsive div.languages { display: block; position: relative; width: 100%; margin: 15px auto 0 auto; padding: 0; text-align: center; }
			div.responsive div.languages a { display: inline-block; position: relative; font-size: 16px; line-height: 30px; font-weight: bold; color: #ffffff; padding: 0 10px; text-decoration: none; }
			div.responsive div.languages a.selected { background-color: #282828; border-radius: 5px; color: #1C48FF; }
}

/* linguagens */
div.header div.languages { display: block; position: absolute; top: 0; right: 0; height: 49px; width: 100px; }
	div.header div.languages a { display: block; font-size: 18px; font-weight: bold; color: #ffffff; float: right; text-decoration: none; padding: 7px; }
	div.header div.languages a:hover { color: #1c49ff; }
	div.header div.languages a.selected { color: #1c49ff; background-color: #282828; border-radius: 5px; }

@media all and ( max-width: 1099px )
{
	div.header div.languages { display: none; }
}

/* corpo menus */
div.headerMenus { display: block; position: absolute; top: 65px; left: 45%; width: 55%; height: 100px; background: transparent url(../../../../src/img/bg/menu.png) repeat-x; }
	div.headerMenus div.menu { display: block; position: relative; float: left; height: 100px; margin: 0 0 0 -1px; background: transparent url(../../../../src/img/bg/menu.png) repeat-x; overflow: hidden; }
	div.headerMenus div.menu:first-child { margin: 0 0 0 -35px; }
	div.headerMenus div.menu:hover { background: #F8EB00 none; }
		div.headerMenus div.menu:hover a { color: #1D4BFB; }
		div.headerMenus div.menu a { display: block; position: relative;  text-align: center; padding: 0 25px; font-size: 16px; font-weight: bold; line-height: 100px; text-decoration: none; }
		div.headerMenus div.menu a.selected { color: #ec1c24; }

	/* skews cross browser */
	div.headerMenus div.menu
	{
		transform: skew( -30deg, 0 );
		-webkit-transform: skew( -30deg, 0 );
		-moz-transform:    skew( -30deg, 0 );
     	-o-transform:      skew( -30deg, 0 );
	}

	div.headerMenus div.menu a
	{
		transform: skew( 30deg, 0 );
		-webkit-transform: skew( 30deg, 0 );
		-moz-transform:    skew( 30deg, 0 );
     	-o-transform:      skew( 30deg, 0 );
	}

	/* gradiente da borda */
	div.headerMenus div.menu
	{
		border-width: 1px;
		border-bottom-width: 3px;
		-webkit-border-image: -webkit-gradient( linear, 0 100%, 0 0, from( #6e6f70 ), to( #101010 ) ) 1 100%;
    	-webkit-border-image: -webkit-linear-gradient( bottom, #6e6f70, #101010 ) 1 100%;
    	-o-border-image: -o-linear-gradient( bottom, #6e6f70, #101010 ) 1 100%;
    	-moz-border-image: -moz-linear-gradient( bottom, #6e6f70, #101010 ) 1 100%;
	}

@media all and ( max-width: 1099px )
{
	div.headerMenus { display: none; }
}