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

#index { display: block; position: relative; width: 100%; margin: 0; padding: 0 0 50px 0; }
	#index div.container { display: block; position: relative; width: auto; margin: 0; padding: 0; text-align: right; }
		#index div.container div.square { display: inline-block; position: relative; width: 50%; height: 385px; top: -57px; right: -150px; background-color: #3ec5f3; text-align: right; padding: 50px 300px 0 0; }
			#index div.container div.square div.pattern { display: block; position: absolute; top: 0; left: 50%; margin: 0 0 0 -40%; width: 80%; height: 90vh; background: transparent url(../images/pattern.png) repeat; z-index: 1; }
			#index div.container div.square a { display: block; position: relative; width: auto; text-decoration: none; z-index: 2; }
			#index div.container div.square a:hover { text-decoration: underline; }

@media all and ( max-width: 1200px ) {
	#index { padding: 0 0 25px 0; }
		#index div.container div.square { display: block; width: 100%; top: 0; right: 0; height: 200px; padding: 25px 100px 0 0; }
			#index div.container div.square div.pattern { left: 0; margin: 0; width: 100%; height: 200px; }
}

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

#index div.slide_container { display: block; position: relative; width: auto; margin: -300px 150px 0 150px; height: 645px; z-index: 1; }
	#index div.slide_container .slide { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; text-align: left; background: transparent no-repeat center center; background-size: cover; text-decoration: none; }
	#index div.slide_container .slide[data-status="false"] { z-index: 1; opacity: 0; }
	#index div.slide_container .slide[data-status="true"] { z-index: 2; opacity: 1; }
		#index div.slide_container .slide div.text { display: block; position: relative; width: 100%; height: 100%; z-index: 1; left: -100px; }
			#index div.slide_container .slide div.text div.inside { display: inline-block; position: relative; vertical-align: middle; width: auto; }
			#index div.slide_container .slide div.text h1 { display: inline-block; position: relative; margin: 0; font-size: 5.625em; line-height: 1em; overflow: hidden; background-color: #ececec; padding: 0 20px 0 0; }
			#index div.slide_container a.slide:hover div.text h1 { color: #3ec5f3; }
			#index div.slide_container .slide div.text h2 { display: inline-block; position: relative; margin: 0; background-color: #ececec; padding: 0 10px 0 0; }
			#index div.slide_container a.slide:hover div.text h2 { color: #3ec5f3; }

@media all and ( max-width: 1200px ) {
	#index div.slide_container { height: 350px; margin: -100px 15px 0 15px }
		#index div.slide_container .slide div.text { padding: 25px; left: auto; }
			#index div.slide_container .slide div.text h1 { font-size: 4em; }
}

/* ================================================================================================================== */
/* categorias */
/* ================================================================================================================== */

#index div.categories { display: block; position: relative; width: 100%; text-align: center; margin-top: 25px; }
	#index div.categories div.inside { display: inline-block; position: relative; width: auto; }
	#index div.categories a { display: block; position: relative; width: auto; color: #aeadb6; font-size: 1.5em; line-height: 1.2em; margin: 0; padding: 0; text-decoration: none; }
	#index div.categories a:hover { color: #3ec5f3; }
