/* ------------------------------------------------------------------------------------------------------------------ */
/* corpo */

div#projectCargoDetails { display: block; position: relative; width: 100%; margin: 0 auto; padding: 0; }


/* ------------------------------------------------------------------------------------------------------------------ */
/* coluna esquerda */

div#projectCargoDetails div.left { display: block; position: relative; width: 200px; background-color: #e5e6e9; margin: 15px 0 0 0; padding: 0 0 35px 0; float: left; overflow: hidden; }
	div#projectCargoDetails div.left a.title { display: block; position: relative; margin: 0; padding: 0 4px; background-color: #003B5C; color: #ffffff; text-align: left; font-family: 'ArialNarrow', sans-serif; font-size: 14px; line-height: 22px; text-decoration: none; text-transform: uppercase; }
	div#projectCargoDetails div.left a.title:hover { color: #f0f0f0; }
	div#projectCargoDetails div.left hr { display: block; position: relative; width: 98%; height: 0; border: none; border-bottom: 1px dotted rgb(142,144,144); margin: 2px auto 10px auto; }
	div#projectCargoDetails div.left a.top { display: block; position: relative; margin: 0 25px 0 0; padding: 0 4px; color:#003B5C; text-align: left; font-family: 'ArialNarrow', sans-serif; font-size: 14px; line-height: 22px; text-decoration: none; text-transform: uppercase; }
	div#projectCargoDetails div.left a.top:hover { text-decoration: underline; }

	div#projectCargoDetails div.left a.children { display: block; position: relative; margin: 6px 0 6px 4px; padding: 0 0 0 0; color:#003B5C; text-align: left; font-family: 'ArialNarrow', sans-serif; font-size: 14px; line-height: 22px; text-decoration: none; }
	div#projectCargoDetails div.left a.children:hover { text-decoration: underline; }
		div#projectCargoDetails div.left a.children span { display: inline-block; position: relative; margin: 0 5px 0 0; width: 10px; height: 10px; background: transparent url(../src/img/menuArrowLeft.png) no-repeat center center; background-size: cover; vertical-align: middle; }

	div#projectCargoDetails div.left a.grandson { display: block; position: relative; margin: 3px 0 3px 35px; padding: 0 0 0 0; color:#003B5C; text-align: left; font-family: 'ArialNarrow', sans-serif; font-size: 14px; line-height: 22px; text-decoration: none; }
	div#projectCargoDetails div.left a.grandson:hover { text-decoration: underline; }
		div#projectCargoDetails div.left a.grandson span { display: inline-block; position: relative; margin: 0 5px 0 0; width: 10px; height: 10px; background: transparent url(../src/img/menuArrowLeft.png) no-repeat center center; background-size: cover; vertical-align: middle; }

	div#projectCargoDetails div.left a.selected { background-color:#003B5C; color: #ffffff; }

@media all and ( max-width: 904px )
{
	div#projectCargoDetails div.left { display: none; }
}
@media all and ( min-width: 905px ) and ( max-width: 1199px )
{
	div#projectCargoDetails div.left { margin: 15px 0 0 15px; }
}


/* ------------------------------------------------------------------------------------------------------------------ */
/* coluna direita */

div#projectCargoDetails div.right { display: block; position: relative; width: 700px; margin: 15px 0 0 0; float: right; }

@media all and ( max-width: 904px )
{
	div#projectCargoDetails div.right { width: 95%; float: none; margin: 15px auto 0 auto; text-align: center; padding: 15px 0 0 0; }
}
@media all and ( min-width: 905px ) and ( max-width: 1199px )
{
	div#projectCargoDetails div.right { margin: 15px 15px 0 25px; padding: 15px 0 0 0; }
	div#projectCargoDetails div.right
	{
		width: 100%;
		width: calc( 100% - 200px - 25px - 15px - 15px );
		width: -webkit-calc( 100% - 200px - 25px - 15px - 15px );
		width: -moz-calc( 100% - 200px - 25px - 15px - 15px );
	}
}


/* ------------------------------------------------------------------------------------------------------------------ */
/* titulo e texto */

div#projectCargoDetails div.right div.titleText { display: block; position: relative; width: 100%; max-width: 699px; background-color: rgb(0, 58, 93); min-height: 51px; margin: 16px 0 0 0; padding: 0 0 10px 0; border: none; }
	div#projectCargoDetails div.right div.titleText span { display: block; position: absolute; top: -16px; left: 0; width: 700px; height: 51px; background: transparent url(../src/img/projectsBannerTop.png) no-repeat; }
	div#projectCargoDetails div.right div.titleText h1 { display: block; position: relative; font-family: 'ArialBold', sans-serif; color: #ffffff; font-size: 18px; margin: 0 auto; width: 600px; line-height: 35px; }
	div#projectCargoDetails div.right div.titleText p { display: block; position: relative; font-family: 'ArialNarrow', sans-serif; color: #ffffff; font-size: 14px; margin: 5px auto 0 auto; width: 600px; line-height: 25px; }

@media all and ( max-width: 1199px )
{
	div#projectCargoDetails div.right div.titleText { margin: 16px auto 0 auto; }
		div#projectCargoDetails div.right div.titleText span { width: 100%; }
		div#projectCargoDetails div.right div.titleText h1 { width: 70%; margin: 0 auto; font-size: 16px; line-height: 30px; }
		div#projectCargoDetails div.right div.titleText p { width: 95%; font-size: 12px; margin: 15px auto 0 auto; line-height: 20px; }
}


/* ------------------------------------------------------------------------------------------------------------------ */
/* fotos e blocos */

div#projectCargoDetails div.right div.photosBlocks { display: block; position: relative; width: 696px; border: 1px solid rgb( 0,58,93); min-height: 50px; margin: 15px auto 0 auto; text-align: left; padding: 0; }
	div#projectCargoDetails div.right div.photosBlocks div.block { display: block; position: relative; width: 232px; height: 252px; margin: 0; padding: 0; float: left; }
	div#projectCargoDetails div.right div.photosBlocks div.block:nth-child(2) { width: 464px; }
		div#projectCargoDetails div.right div.photosBlocks div.block a { display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
		div#projectCargoDetails div.right div.photosBlocks div.block h2 { display: block; position: relative; width: 90%; max-height: 90px; text-align: center; margin: 0 auto; font-family: 'ArialBold', sans-serif; color: #003B5C; font-size: 14px; line-height: 20px; overflow: hidden; }
		div#projectCargoDetails div.right div.photosBlocks div.block p { display: block; position: relative; width: 90%; max-height: 160px; text-align: center; margin: 20px auto 0 auto; font-family: 'ArialNarrow', sans-serif; color: #003B5C; font-size: 14px; line-height: 20px; overflow: hidden; }

@media all and ( max-width: 509px )
{
	div#projectCargoDetails div.right div.photosBlocks { border: none; width: auto; text-align: center; font-size: 0; }
		div#projectCargoDetails div.right div.photosBlocks div.block { display: inline-block; float: none; vertical-align: top; margin: 5px; background-color: #EDEAE9; }
		div#projectCargoDetails div.right div.photosBlocks div.block:nth-child(2) { display: inline-block; width: 232px; height: 126px; }
}
@media all and ( min-width: 510px ) and ( max-width: 903px )
{
	div#projectCargoDetails div.right div.photosBlocks { border: none; width: auto; text-align: center; font-size: 0; }
		div#projectCargoDetails div.right div.photosBlocks div.block { display: inline-block; float: none; vertical-align: top; margin: 5px; background-color: #EDEAE9; }
		div#projectCargoDetails div.right div.photosBlocks div.block:nth-child(2) { display: inline-block; width: 474px; height: 252px; }
}
@media all and ( min-width: 904px ) and ( max-width: 949px )
{
	div#projectCargoDetails div.right div.photosBlocks { border: none; width: auto; text-align: center; font-size: 0; }
		div#projectCargoDetails div.right div.photosBlocks div.block { display: inline-block; float: none; vertical-align: top; margin: 5px; background-color: #EDEAE9; }
		div#projectCargoDetails div.right div.photosBlocks div.block:nth-child(2) { display: inline-block; width: 232px; height: 126px; }
}


/* ------------------------------------------------------------------------------------------------------------------ */
/* topicos */

div#projectCargoDetails div.right div.topics { display: block; position: relative; width: 100%; max-width: 699px; background-color: rgb(0, 58, 93); min-height: 51px; margin: 31px 0 0 0; padding: 0 0 10px 0; }
	div#projectCargoDetails div.right div.topics span { display: block; position: absolute; top: -16px; left: 0; width: 700px; height: 51px; background: transparent url(../src/img/projectsBannerTop.png) no-repeat; }
	div#projectCargoDetails div.right div.topics div.container { display: block; position: relative; width: 660px; margin: 0 0 0 40px; padding: 0; font-size: 0; }
	div#projectCargoDetails div.right div.topics div.block { display: inline-block; position: relative; width: 150px; min-height: 20px; margin: 10px 7px 25px 6px; padding: 0; vertical-align: top; }
		div#projectCargoDetails div.right div.topics div.block h2 { display: block; position: relative; width: 100%; text-align: left; margin: 0 auto; font-family: 'ArialBold', sans-serif; color: #ffffff; font-size: 14px; line-height: 20px; }
		div#projectCargoDetails div.right div.topics div.block p { display: block; position: relative; width: 100%; text-align: left; margin: 5px auto 0 auto; font-family: 'ArialNarrow', sans-serif; color: #ffffff; font-size: 14px; line-height: 20px; }

@media all and ( max-width: 1199px )
{
	div#projectCargoDetails div.right div.topics { margin: 16px auto 0 auto; }
		div#projectCargoDetails div.right div.topics span { width: 100%; }
		div#projectCargoDetails div.right div.topics div.container { width: 100%; padding: 25px 0 0 0; margin: 0 auto; text-align: center; }
}


/* ------------------------------------------------------------------------------------------------------------------ */