/* CSS Document */
@charset "utf-8";

/*
#000000 rgba(0, 0, 0, 0.5) Negro
#FFFFFF rgba(255, 255, 255, 0.5) Blanco
*/

/*******************************************************************************************************/
/* RESET */
	*, header, main, footer, div, section, article, figure, aside, nav, ul, li, a, img, p, span, cite, h1, h2, h3, h4, h5, h6, form, label, iframe, input, textarea, button {
		box-sizing:border-box;
		-moz-box-sizing:border-box;
		-webkit-box-sizing:border-box;
	}
	figure{ margin:0; }
	a { text-decoration: none; }
	img{
		width: 100%;
		margin: 0 auto;
		vertical-align: top;
	}
	table { border-collapse: collapse; }
	table, th, td { border: 2px solid #000; }
	td { vertical-align:middle; }
	ul { margin: 0 auto; padding: 0 2em; list-style-type: circle; text-align: left; }
	li { margin: 0; padding: 0.3em 0; }
	input, textarea, select {
		border-radius: 0.3em 0.3em 0.3em 0.3em;
		-moz-border-radius: 0.3em 0.3em 0.3em 0.3em;
		-khtml-border-radius: 0.3em 0.3em 0.3em 0.3em;
		-webkit-border-radius: 0.3em 0.3em 0.3em 0.3em;
	}
	p { margin: 0; padding: 1em; line-height: 150%; }

/*******************************************************************************************************/
/* ESTRUCTURA BASE */
	@font-face { font-family: Exo; src: url(../lib/exo.ttf); }
	@font-face { font-family: MyriadProBold; src: url(../lib/MyriadProBold.ttf); }
	html { background: #f5f5f5; }
	body {
		font-family: 'MyriadProBold', Verdana, Geneva, sans-serif;
		font-size: 12px;
		text-decoration: none;
		color: #000;
		overflow-x: hidden;
		overflow-y: scroll;
		margin: 0;
		padding: 0 0.3em;
	}
	header, nav, main, footer {
		display: block;
		background: #fff;
		border-radius: 0.5em;
		width:100%;
		max-width: 1900px;
		margin: 0.2em auto;
	}
	main { padding: 1em; text-align: center; }
	a 		{ color: #000;  font-weight: bold;}
	a:hover { color: #777; }
	/* SCROLL */
		body::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 0px rgba(0,0,0,0.5); }
		body::-webkit-scrollbar { background-color: #fff; width: 13px; }
		body::-webkit-scrollbar-thumb { border-radius: 3px;background-color: #777;}
	/* FIN SCROLL */
	p {
		text-align: justify;
		padding: 0 1em;
		margin: 0;
		margin-bottom: 1em;
		}
	cite {
		display: inline-block;
		width: 100%;
		padding: 0 0.6em;
		margin-bottom: 1em;
		font-family: "Trebuchet MS", Helvetica, sans-serif;
		font-size: 1.2em;
		color: #555;
		text-shadow: 0.03em 0.06em 0px #aaa;
		text-align: center;
		}

/*******************************************************************************************************/
/* HEADER */
		header {
			background-color: #fff;
			min-height: 1em;
			text-align: center;
		}
		header>figure, header>section {
			display: inline-block;
			margin:0;
			padding:0;
			min-height:1em;
			vertical-align: bottom;
			text-align: middle;
		}
		header>figure { width: 60%;}
		header>section { width: 100%; text-align: center; }
		header a img { width: 50%; max-width: 2.5em; margin: 0em 1.75em 0.75em 0em; }
/* FOOTER */
		footer { padding: 0; background: #fff; margin-bottom: 2em; }
		footer section h1 { margin: 1em 0 0.5em 0; }
		footer section img { width: 50%; max-width: 4em; margin: 0 1em; }
		footer figure img{ width:50%; margin:3.5em 0; }
		footer p { text-align: center; margin:1.5em; }
/* MAIN */
	#cartelera {
		border-top: 5px solid #000;
		border-bottom: 5px solid #000;
		padding:1em 0;
		text-align: left;
	}
	#cartelera figure {
		display: inline-block;
		width:99%;
		margin:0.9%;
		border: 1px solid #555;
	}
	#cartelera a {
		background-color: #eee;
		display: inline-block;
		width: 50%;
		padding: 0.5em 0.5em;
	}
	#cartelera a p {display: inline-block; width: 88%; margin: 0; vertical-align:middle;}
	#cartelera a p:first-child {text-align: right;}
	#cartelera a img {display: inline-block; width: 12%; vertical-align: middle;}


/*******************************************************************************************************/
/* MEDIA QUERY */

/******************** Formato mayor de 440 ********************/
	@media only screen and (min-width : 440px) {
		header>figure { width: 24%; padding:2em; }
		header>section { width: 38%; text-align: right; }
		#cartelera figure { width:31.5%;}
		footer figure img{ width:20%; }
	#cartelera a { padding: 0.5em 1em;}
		#cartelera a p { width: 85%;}
		#cartelera a img {width: 15%;}
	} /* Fin @media */