/* ================================================================================================================== */
/* corpo */
/* ================================================================================================================== */

div#index { display: block; position: relative; width: 100%; min-height: 100vh; padding:0; margin: 0 auto; font-size: 0; }


/* ================================================================================================================== */
/* slide */
/* ================================================================================================================== */

div#slide { display: block; position: relative; width: 1600px; height: 100vh; padding: 0; z-index: 1; margin: 0 auto; }
div#slide *
{
	transition-duration: 1000ms;
	-webkit-transition-duration: 1000ms;
	-moz-transition-duration: 1000ms;
}
	div#slide .slide { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; overflow: hidden; }
	div#slide .slide[data-status="true"] { opacity: 1; z-index: 2; height: 100%; }
	div#slide .slide[data-status="false"] { opacity: 0; z-index: 1; height: 0; }
	div#slide div.left { display: inline-block; position: relative; width: 390px; height: auto; padding: 0; margin: 0 auto; font-size: 0; vertical-align: middle; }
		div#slide div.left span.logo { display: block; position: relative; width: 100%; height: 135px; margin: 0 auto 10px auto; background: transparent url(../images/logo.png) no-repeat center center; background-size: contain; }
		div#slide div.left p { display: block; position: relative; font-size: 18px; line-height: 25px; }
		div#slide div.left p.text { margin: 25px 0 0 0; }
			div#slide div.left p a { display: inline-block; position: relative; font-size: 18px; line-height: 25px; text-decoration: none; }
			div#slide div.left p a:hover { text-decoration: underline; }
		div#slide div.left h1 { display: block; position: relative; font-size: 25px; line-height: 30px; margin: 25px 0 0 0; }
		div#slide div.left a.social_networks { display: inline-block; position: relative; width: 24px; height: 24px; margin: 10px 10px 0 0; background: transparent url(../images/social_networks.png) no-repeat; }
		div#slide div.left a.social_networks:hover { background-position-y: -24px; }
		div#slide div.left a.social_networks.facebook { background-position-x: 0; }
		div#slide div.left a.social_networks.instagram { background-position-x: -24px; }
		div#slide div.left a.social_networks.magazine { width: 97px; background-position-x: -48px; }
	div#slide div.right { display: inline-block; position: relative; width: 1100px; height: auto; padding:0; margin: 0 0 0 110px; font-size: 0; vertical-align: middle; }
		div#slide div.right div.block { display: block; position: relative; width: 100%; height: auto; }
			div#slide div.right div.block span { display: none; position: relative; vertical-align: top; }

			div#slide div.right div.block._1 span:nth-child(1) { display: block; width: 100%; height: 90vh; }

			div#slide div.right div.block._2 span:nth-child(1) { display: block; width: 100%; height: 400px; }
			div#slide div.right div.block._2 span:nth-child(2) { display: block; width: 100%; height: 400px; margin: 20px 0 0 0; }

			div#slide div.right div.block._3 span:nth-child(1) { display: block; width: 100%; height: 400px; }
			div#slide div.right div.block._3 span:nth-child(2) { display: inline-block; width: 540px; height: 400px; margin: 20px 20px 0 0; }
			div#slide div.right div.block._3 span:nth-child(3) { display: inline-block; width: 540px; height: 400px; margin: 20px 0 0 0; }

			div#slide div.right div.block._4 span:nth-child(1) { display: inline-block; width: 540px; height: 400px; margin: 0 20px 0 0; }
			div#slide div.right div.block._4 span:nth-child(2) { display: inline-block; width: 540px; height: 400px; margin: 0 0 0 0; }
			div#slide div.right div.block._4 span:nth-child(3) { display: inline-block; width: 540px; height: 400px; margin: 20px 20px 0 0; }
			div#slide div.right div.block._4 span:nth-child(4) { display: inline-block; width: 540px; height: 400px; margin: 20px 0 0 0; }

@media all and (min-width: 1200px) and (max-width: 1599px)
{
	div#slide { width: 100%; }
		div#slide div.right
		{
			width: 700px;
			width: -webkit-calc(100% - 390px - 110px);
			width:    -moz-calc(100% - 390px - 110px);
			width:         calc(100% - 390px - 110px);
		}

			div#slide div.right div.block._3 span:nth-child(2),
			div#slide div.right div.block._3 span:nth-child(3) {
				width: -webkit-calc(50% - 10px);
				width:    -moz-calc(50% - 10px);
				width:         calc(50% - 10px);
			}

			div#slide div.right div.block._4 span:nth-child(1),
			div#slide div.right div.block._4 span:nth-child(2),
			div#slide div.right div.block._4 span:nth-child(3),
			div#slide div.right div.block._4 span:nth-child(4) {
				width: -webkit-calc(50% - 10px);
				width:    -moz-calc(50% - 10px);
				width:         calc(50% - 10px);
			}
}

@media all and (max-height: 820px)
{
	div#slide div.right div.block._1 span:nth-child(1) { height: 100vh; }

	div#slide div.right div.block._2 span:nth-child(1),
	div#slide div.right div.block._2 span:nth-child(2)
	{
		height: 700px;
		height: -webkit-calc(100vh  / 2 - 10px);
		height:    -moz-calc(100vh  / 2 - 10px);
		height:         calc(100vh  / 2 - 10px);
	}

	div#slide div.right div.block._3 span:nth-child(1),
	div#slide div.right div.block._3 span:nth-child(2),
	div#slide div.right div.block._3 span:nth-child(3)
	{
		height: 700px;
		height: -webkit-calc(100vh  / 2 - 10px);
		height:    -moz-calc(100vh  / 2 - 10px);
		height:         calc(100vh  / 2 - 10px);
	}

	div#slide div.right div.block._4 span:nth-child(1),
	div#slide div.right div.block._4 span:nth-child(2),
	div#slide div.right div.block._4 span:nth-child(3),
	div#slide div.right div.block._4 span:nth-child(4)
	{
		height: 700px;
		height: -webkit-calc(100vh  / 2 - 10px);
		height:    -moz-calc(100vh  / 2 - 10px);
		height:         calc(100vh  / 2 - 10px);
	}
}

@media all and (max-width: 1200px)
{
	div#slide { width: 100%; height: auto; }
		div#slide .slide { position: relative; height: auto; min-height: 100%; }
		div#slide div.left { width: 100%; text-align: center; }
		div#slide div.right { width: 100%; margin: 25px 0 0 0; }

			div#slide div.right div.block._1 span:nth-child(1),
			div#slide div.right div.block._2 span:nth-child(1),
			div#slide div.right div.block._2 span:nth-child(2),
			div#slide div.right div.block._3 span:nth-child(1),
			div#slide div.right div.block._3 span:nth-child(2),
			div#slide div.right div.block._3 span:nth-child(3),
			div#slide div.right div.block._4 span:nth-child(1),
			div#slide div.right div.block._4 span:nth-child(2),
			div#slide div.right div.block._4 span:nth-child(3),
			div#slide div.right div.block._4 span:nth-child(4) { display: block; height: 250px; margin: 10px; width: auto; }
}