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

div#products { display: block; position: relative; width: 100%; margin: 0 auto; padding: 0; }
	div#products div.container { display: block; position: relative; padding: 35px 35px 0 35px; }
		div#products div.container div.content { display: block; position: relative; width: 100%; background-color: #ffffff; }

@media all and ( max-width: 1199px )
{
    div#products div.container { padding: 0; }
		div#products div.container div.content { padding: 0 10px 25px 10px; width: auto; }
}

/* ------------------------------------------------------------------------------------------------------------------ */
/* voltar */

div#products div.container div.content a.close { display: block; position: absolute; top: 10px; right: 10px; width: 35px; height: 35px; background: transparent url(../src/img/products_close.png) no-repeat; z-index: 10; }
div#products div.container div.content a.close:hover { background-position: 0 -35px; }

@media all and ( max-width: 1199px )
{
    div#products div.container div.content a.close { display: none; }
}


/* ------------------------------------------------------------------------------------------------------------------ */
/* fotos */

div#products div.container div.content div.photos { display: block; position: relative; width: 50%; float: left; overflow: hidden; }
div#products div.container div.content div.photos
{
	height: 200px;
	height: -webkit-calc( 100vh - 85px );
	height:    -moz-calc( 100vh - 85px );
	height:         calc( 100vh - 85px );
}
	div#products div.container div.content div.photos span.banner { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
	div#products div.container div.content div.photos span.banner
	{
		height: 100%;
		height: -webkit-calc( 100% - 50px );
		height:    -moz-calc( 100% - 50px );
		height:         calc( 100% - 50px );
	}
	div#products div.container div.content div.photos span.banner[data-actual="true"] { left: 0; z-index: 2; }
	div#products div.container div.content div.photos span.banner[data-actual="false"] { left: -100%; z-index: 1; }

	div#products div.container div.content div.photos span.arrows { display: block; position: absolute; bottom: 10px; left: 50%; width: 52px; height: 26px; background: transparent url(../src/img/products_slide_arrows.png) no-repeat; z-index: 5; cursor: pointer; }
	div#products div.container div.content div.photos span.arrows.prev { background-position: 0 0; left: 50%; margin: 0 0 0 -100px; }
	div#products div.container div.content div.photos span.arrows.prev:hover { background-position: 0 -26px; }
	div#products div.container div.content div.photos span.arrows.next { background-position: -52px 0; right: 50%; margin: 0 -100px 0 0; }
	div#products div.container div.content div.photos span.arrows.next:hover { background-position: -52px -26px; }

@media all and ( max-width: 1199px )
{
    div#products div.container div.content div.photos { width: 100%; float: none; }
    div#products div.container div.content div.photos
    {
	    height: 200px;
    	height: -webkit-calc( 200px );
    	height:    -moz-calc( 200px );
    	height:         calc( 200px );
    }
		div#products div.container div.content div.photos span.banner
		{
			height: 200px;
			height: -webkit-calc( 200px );
			height:    -moz-calc( 200px );
			height:         calc( 200px );
		}
    	div#products div.container div.content div.photos a.IDSGallery{ display: none; height: 200px; margin: 0; }
    	div#products div.container div.content div.photos a.IDSGallery:first-child { display: block; }

	    div#products div.container div.content div.photos span.arrows { display: none; }
}


/* ------------------------------------------------------------------------------------------------------------------ */
/* texto */

div#products div.container div.content div.text { display: block; position: relative; width: 50%; float: right; background-color: #f4f5f6; overflow: hidden; padding: 0 0 50px 0; }
div#products div.container div.content div.text
{
	min-height: 200px;
	min-height: -webkit-calc( 100vh - 135px );
	min-height:    -moz-calc( 100vh - 135px );
	min-height:         calc( 100vh - 135px );
}

	div#products div.container div.content div.text h1 { display: block; position: relative; width: 90%; margin: 100px auto 0 auto; font-family: 'bold1', sans-serif; font-size: 20px; line-height: 30px; text-align: center; }
	div#products div.container div.content div.text h2 { display: block; position: relative; width: 90%; margin: 50px auto 25px auto; font-family: 'bold1', sans-serif; font-size: 20px; line-height: 30px; text-align: center; }
	div#products div.container div.content div.text p.text { display: block; position: relative; width: 80%; margin: 25px auto 0 auto; font-size: 16px; line-height: 25px; text-align: center; }

	div#products div.container div.content div.text div.row { display: block; position: relative; width: 80%; border-top: 1px solid #9fa0a1; margin: 0 auto; padding: 5px 10px }
	div#products div.container div.content div.text div.row:last-child { border-bottom: 1px solid transparent; }
		div#products div.container div.content div.text div.row h3 { display: block; position: relative; width: 50%; font-size: 16px; line-height: 25px; float: left; }
		div#products div.container div.content div.text div.row p { display: block; position: relative; width: 50%; font-size: 16px; line-height: 25px; float: right; }

@media all and ( max-width: 1199px )
{
    div#products div.container div.content div.text { width: 100%; float: none; padding: 0; margin: 15px 0 0 0; }
    div#products div.container div.content div.text
    {
	    min-height: 0;
    	min-height: -webkit-calc( 0px );
    	min-height:    -moz-calc( 0px );
    	min-height:         calc( 0px );
    }
        div#products div.container div.content div.text h1 { width: auto; margin: 20px 0 0 0; }
    	div#products div.container div.content div.text h2 { width: auto; margin: 15px 0 0 0; }
    	div#products div.container div.content div.text p.text { width: auto; margin: 25px auto 35px auto; }

	    div#products div.container div.content div.text div.row { width: auto; padding: 5px 10px; margin: 0 10px; }
	        div#products div.container div.content div.text div.row h3 { font-size: 10px; line-height: 20px; }
	        div#products div.container div.content div.text div.row p { font-size: 10px; line-height: 20px; }
}


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