@charset "utf-8";
/* CSS Document */

@media only screen and (min-width: 0px) {
	
	root { 
		display: block;
	}

	* {
		margin: 0;
		padding: 0;
	}

	body {
		text-align: center;
		background:#fff;
		font:14px Verdana, Geneva, sans-serif;
		color: #1d232a;
		line-height:2em;
	}

	#header { display:block; }

	#cabecera {
		background: #fff;
		position:relative;
	}
	
	#divFrase {
		font: 28px Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-align: center;
		padding: 1em;
	}
	
	#video {
		font-size:20px;
		font-weight:bold;
	}
	
	.logo_red_social {
		float:right;
		padding:0 10px;
	}

	#contenido {
		margin-top:0;
		padding-bottom:10px;
		background: #fff;
	}

	div#menu {
		background: #1d232a;
		padding: 20px 15px 15px 15px;
		color:#ff3288;
		text-align:center;
	}

	div#menu li {
		list-style: none;
		font: 18px Arial, Helvetica, sans-serif;
		font-weight:bold;
	}

	a{
		color:#ff3288;
		text-decoration:none;
	}
	a:hover{
		color:#ff3288;
		text-decoration:underline;
	}
	a.activo{
		color:#ff3288;
		text-decoration:underline;
	}
	div#menu a:hover{
		color:#fff;
		text-decoration:underline;
	}
	div#menu a.activo{
			color:#fff;
	}
	b {color:#1d232a; }
	bm {color:#ff3288; font-weight:bold; }
	h1 {color:#ff3288; }
	p {text-align: justify; }

	#seccion {
		min-height:300px;
		margin: 20px 10px;
		background: #fff;
		padding:20px;
		position:relative;
		text-align: left;
	}

	#pie {
		margin:10px 10px 0;
		height:50px;
		clear: both;
		text-align: right;
	}

	.negrita { font-weight:bold; }
	.resaltado { color:#000; font-weight:bold; }

	img { border:0; }

	#sitemap { padding-left:120px; }
	#sitemap li { list-style:none; }

}

@media only screen and (max-width: 699px) {
	
	#wrap {
		width: 100%;
	}
	
	#divLogo {
		display: block;
	}
	
	#divVideo {
		display: block;
	}
	
	#divFrase {
		display: block;
	}
	
	#seccion img {
		display: table-cell;
		margin-bottom: 3em;
		padding: 0;
	}
	
	#seccion p#texto {
		display: table-cell;
	}
	
	img#menu {
		display: block;
		width: 20px;
		margin: 2em;
		cursor: pointer;
	}
	
	div#menu {
		display: none;
	}
	
	div#menu li {
		padding: 15px;
	}
	
	#div_foto {
		text-align: center;
	}
	
	#imagen_texto {
		width: 90%;
		max-width: 400px;
	}
}

@media only screen and (min-width: 700px) {

	#wrap {
		width: 100%;
	}
	
	#cabecera {
		text-align: center;
		width: 100%;
	}
		
	#divLogo {
		display: table-cell;
		width: 33%;
		vertical-align: middle;
	}
	
	#divVideo {
		display: table-cell;
		width: 33%;
		vertical-align: middle;
	}
	
	#divFrase {
		display: table-cell;
		width: 33%;
		vertical-align: middle;
		text-align: right;
	}
	
	img#menu {
		display: none;
	}
	
	div#menu li {
		display:inline-block;
		padding: 0 15px;
	}
	
	#imagen_texto {
		width: 400px;
		float: right;
		padding-left: 20px;
	}
}