/* CSS Document */




/***************** home ****************/

.resalte {font-weight: 500}



.pdf-descarga-home a {

    background-image: url(https://recursos.march.es/web/musica/jovenes/musica-pintura-conectar-sentidos/guia/img/layout/ico-pdf-home.png);
    background-repeat: no-repeat;
    font-family: BrownStd, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 18px;
    font-weight: 100;
}



.banner-reservas-curso {
	background-image: url(//recursos.march.es/web/musica/jovenes/musica-pintura-conectar-sentidos/guia/img/musica-pintura-obras-fondo-home.jpg);
}
 @media only screen and (max-width: 1219px) {
.banner-reservas-curso {
	background-size: 100%;
}
}
 @media only screen and (max-width: 1219px) and (min-width: 768px) {
.text-top, .text-bottom {
	padding: 3.55vw;
	margin-left: 25.7vw;
}
}
 @media only screen and (min-width: 1220px) {
.main-content-area-banner {
	box-shadow: -3660px 0 0#030303, -2440px 0 0#030303, -1220px 0 0#030303, 1220px 0 0 #030303, 2440px 0 0 #030303, 3660px 0 0 #030303;
	position: relative;
}
.text-top, .text-bottom {
	width: 888px;
	display: block;
	overflow: hidden;
	margin: 2px 0 0 314px;
	padding: 43px;
	box-sizing: border-box;
}
}
 @media only screen and (min-width: 768px) {
	 
	 .title-pdf h2 {
    width: 700px;
}
.main-content-area-banner {
	height: 680px;
}

.text-inline-elements {
	width: 960px;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	}

.pdf-descarga-home {
    align-items: flex-end;
    color: #000000;
    display: flex;
    width: 260px;
    margin: 0 0 32px 0px;
}

.pdf-descarga-home a, .pdf-descarga-inner a {
    border: solid 1px #000;
    border-radius: 6px;
    background-image: url(https://recursos.march.es/web/musica/jovenes/musica-pintura-conectar-sentidos/guia/img/layout/ico-pdf-home.png);
    background-repeat: no-repeat;
    background-position: 12px center;
    padding: 15px 15px 12px 50px;
    font-family: BrownStd, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 18px;
    font-weight: 100;
}

.pdf-descarga-home a span {
    font-size: 13px;
    line-height: 17px;
    font-weight: 100;
	display: block;
}


.title-pdf {
    
    overflow: hidden;
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
}


.title-pdf-2 { 

display: block;
    text-align: left;
    float: right;
    margin: -59px 52px 0 0;
}
display: block }

.pdf-descarga-inner {
    width: 320px;
    height: 3rem;
    margin: 30px 0 0 0px;
}



.pdf-descarga-inner a {
    background-image: url(https://recursos.march.es/web/musica/jovenes/crear-con-el-cuerpo/guia/img/layout/ico-pdf-inner.png);
    background-repeat: no-repeat;
    background-position: 12px top;
    color: #f02530;
    font-family: BrownStd, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 15px;
    line-height: 20px;
    font-weight: 400;
    padding: 0 0 0 46px;
    display: block;
	border: none;
}



}
 @media only screen and (max-width: 768px) {
.main-content-area-banner {
	height: 70vw;
}


.pdf-descarga-home {
    margin: 0 0 15px 0px;
}

.content-regular h2 {
    padding: 0;
    display: block;
    width: 100%;
	
}

}

.main-content-area-banner {
	background-position: left top;
	background-repeat: no-repeat;
	display: flex;
	width: 100%;
	margin-bottom: 50px;
	flex-direction: column;
}
.text-bottom {
	margin-top: 65px;
}
.text-bottom {
	font-family: BrownStd, "Helvetica Neue", Helvetica, Arial, sans-serif;
	display: flex;
	flex-direction: column;
	width: 340px;
  
}
.text-bottom__item-bottom, .text-bottom__item-top {
	align-content: space-between;
}
.text-bottom__item-bottom {
	margin-top: -30px;
}
.text-bottom__item-top {
	padding-bottom: 100px;
}
.text-bottom .tit {
	font-size: 22px;
	line-height: 20px;
	font-weight: 700;
	color: #808285;
	font-family: BrownStd, "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-transform: uppercase;
}
.text-bottom .subtit {
	font-size: 20px;
	line-height: 18px;
	font-weight: 300;
	color: #000;
	font-family: BrownStd, "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-transform: uppercase;
	margin-top: 6px;
}
.text-bottom .autores {
	font-family: Noe-Text, Times, "Times New Roman", serif;
	font-size: 15px;
	line-height: 22px;
	font-weight: 400;
	letter-spacing: 0.3px;
}
.text-top h1 {
	font-family: Noe-Display;
	font-weight: 400;
	font-size: 78px;
	line-height:78px;
	color: #fff;
	margin: 20px 0 0 0;
	padding: 0;
}
/******* cuerpo home ******/


.content-home-item {
	border-top: solid 1px #606264;
	width: 100%;
	display: flex;
}
.content-home-item__tit {
	width: 300px;
	height: auto;
}
.content-home-item__tit h2 {
	font-family: Noe-Display;
	font-weight: 400;
	font-size: 25px;
	line-height: 30px;
	text-align: left;
}
.content-home-item__parrafo {
	font-family: Noe-Text, Times, "Times New Roman", serif;
	font-size: 17px;
	line-height: 25px;
	width: 800px;
	height: auto;
	text-align: left;
}
.home-button-start, .home-button-double {
	display: inline-block;
	background-color: #f76a32;
	width: 380px;
	vertical-align: middle;
	text-align: left;
	color: #ffffff;
	font-family: BrownStd, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 20px;
	border: solid 1px #f02530;
	border-radius: 4px;
	padding: 16px 41px;
	box-sizing: border-box;
	margin: 40px 0;
	text-align: center;
}
.home-button-double {
	width: 360px;
	padding: 26px 41px;
}
.center {
	text-align: center
}
.right {
	float: right;
}
.left {
	float: left;
}
.region_multimedia {
	margin: 30px 0;
}
blockquote {
	font-family: Noe-Text, Times, "Times New Roman", serif;
    font-size: 20px;
    line-height: 24px;
    width: 695px;
    text-align: center;
    box-sizing: border-box;
    margin: 30px auto 70px auto;
    display: block;
}
blockquote span {
    color: #000;
    float: right;
    font-size: 17px;
    line-height: 25px;
    display: block;
    width: 100%;
    margin-top: 10px;
    text-align: right;
}

blockquote span.except {margin-top: 10px;}

.cita-derechos {
	clear: right;
	font-family: BrownStd, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 14px;
	line-height: 16px;
	width: 546px;
	text-align: center;
	margin: 0 auto;
	display: block;
	padding: 56px 0 0 0;
}
/*********************************/

body {
	margin: 0;
	padding: 0;
	background-color: #ffffff;
}
 @media only screen and (min-width: 780px) {
footer, header, main {
	margin: 0 auto;
	max-width: 1220px;
	position: relative;
}

main {
	padding-top: 73px;
}

main#home {

		padding-top: 70px;
}

}

header {
	box-shadow: -3660px 0 0 #fc0d1b, -2440px 0 0 #fc0d1b, -1220px 0 0 #fc0d1b, 1220px 0 0 #f6d12f, 2440px 0 0 #f6d12f, 3660px 0 0 #f6d12f;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fc0d1b+0,f6d12f+100 */
	background: #fc0d1b; /* Old browsers */
	background: -moz-linear-gradient(left, #fc0d1b 0%, #f6d12f 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #fc0d1b 0%, #f6d12f 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #fc0d1b 0%, #f6d12f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fc0d1b', endColorstr='#f6d12f', GradientType=1 ); /* IE6-9 */
	z-index: 1;
	height: 70px;
	display: flex;
	align-items: center;
	transform: translateX(50%);
	width: 100%;
	right: 50%;
	position: fixed;
}
.submenu {
	display: none;
}
.trigger {
	display: none;
}
.content-programa ul li a, sup a {
	color: #f02530;
}
sup a {
	font-size: 130%;
}
#nota-pie::before {
	background-color: #a7a9ac;
	content: '';
	display: block;
	height: 1px;
	margin-bottom: 10px;
	width: 150px;
}
.margin-top {
	margin-top: 40px;
}
#nota-pie {
	margin: 70px 0;
	font-size: 14px;
	line-height: 20px;
}
#nota-pie span {
	display: block;
}
.subrayado {
	text-ecoration: underline;
}
.borde {
	border: 1px solid #ccc
}
.lista-actividades {
	list-style-type: circle;
	padding: 0 0 0 60px;
}
.lista-actividades li {
	padding-bottom: 7px;
	font-family: Noe-Text, Times, "Times New Roman", serif;
	font-size: 17px;
	line-height: 25px;
	font-weight: 400;
}
.img-center {
	width: 100%;
	height: auto;
	display: block;
	overflow: hidden;
	text-align: center;
	margin: 50px auto 30px auto
}
.recuadro {
	font-family: BrownStd, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 17px;
	line-height: 22px;
	border: solid 1px #f02530;
	padding: 12px;
	text-align: center;
}
	  
	  
	  


/*************************** MEMU DESKTOP ****************************/


@media only screen and (min-width: 1025px) {
nav {
	display: inline-block;
	width: 90%;
	vertical-align: center;
}
.menu__item {
	width: auto;
	padding: 0 3px;
	color: #ffffff;
	display: inline-block;
	font-size: 19px;
	line-height: 22px;
}
.menu__item:after { 
 content: url('https://recursos.march.es/web/musica/jovenes/crear-con-el-cuerpo/guia/img/layout/flecha-menu-ico.png');
 padding: 0 0 0 11px;
 display: inline-block;
 width: 10px;
 height: 18px;
}

.menu__item:last-child::after {content:""}
.menu  {
	list-style: none;
	padding-left: 36px;
}

.submenu { padding-left: 0; list-style: none;}



/*
.trigger:checked ~ .menu {
	width: 75%;
	font-weight: 700;
	font-family: BrownStd;
	display: inline-block;}
	
.trigger:checked ~ .submenu {
	display: block;
}*/


/* encabezado */


.submenu {
	background: transparent;
}
.submenu__item {
	border-bottom: solid 1px #393939;
	background-color: #f76a32;
	padding: 10px 10px;
	font-size: 16px;
}
.menu__item:hover .submenu, .submenu:hover {
	display: block;
	position: absolute;
	padding-top: 24px;
}
label.hamburguesa {
	display: none
}
span.mobile {
	display: inline-block;
	width: 52px;
	height: 60px;
	overflow: hidden;
	margin: 0;
	padding: 14px 0 0 0;
	text-indent: -999em;
	background: url('../img/layout/ico-menu-mobile.png') no-repeat left 7px;
}
}

/*************************** MEMU MOBILE ****************************/


@media only screen and (max-width: 1024px) {
#menuToggle input {
	display: none;
}
/*
 * Just a quick hamburger
 */
	
#menuToggle .hamb-button {
	display: block;
	width: 45px;
	height: 45px;
	position: absolute;
	top: 12px;
	right: 20px;
	cursor: pointer;
	z-index: 2;
	padding: 10px;
	box-sizing: border-box;
}
#menuToggle .hamb-button span {
	display: block;
	width: 25px;
	height: 2px;
	margin-bottom: 9px;
	position: relative;
	background: #f02530;
	z-index: 1;
	transform-origin: 4px 0px;
	transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), opacity 0.55s ease;
}
 #menuToggle input:checked ~ .hamb-button {
position: fixed;
}
#menuToggle .hamb-button span:first-child {
	transform-origin: 0% 0%;
}
#menuToggle .hamb-button span:nth-last-child(2) {
	transform-origin: 0% 100%;
}
/* 
 * Transform all the slices of hamburger
 * into a crossmark.
 */
#menuToggle input:checked ~ .hamb-button span {
 opacity: 1;
 transform: translateY(-25px) rotate(45deg);
 background: #fff;
}
/*
 * But let's hide the middle one.
 */
#menuToggle input:checked ~ .hamb-button span:nth-last-child(3) {
 opacity: 0;
 transform: rotate(0deg) scale(0.2, 0.2);
}
/*
 * Ohyeah and the last one should go the other direction
 */
#menuToggle input:checked ~ .hamb-button span:nth-last-child(2) {
 transform: rotate(-45deg);
}
/* Bloque de menu */	
	
	
.menu {
	background-color: #d00;
	overflow: hidden;
	position: fixed;
	right: 0;
	top: 0;
	transition: 250ms width;
	width: 0%;
	display: flex;
	height: 100vh;
	overflow: auto;
	flex-direction: column;
	z-index: 1;
}
.menu, .submenu {
	list-style: none;
	padding-left: 0;
}
.trigger {
	display: none;
}
.trigger ~ .submenu {
 display: none;
}
.trigger:checked ~ .menu {
 width: 80%;
}
.trigger:checked ~ .submenu {
 display: block;
}
.menu__item {
	font-size: 14px;
	line-height: 20px;
	color: #ffffff;
	text-transform: uppercase;
	border-top: solid 1px #393939;
}
.menu__item:first-child {
	border-top: none;
}
.menu__item:last-child {
	border-bottom: solid 1px #006473;
}
.submenu {
	background-color: #781218
}
.submenu .submenu__item {
	border-top: solid 1px #006473;
}
.menu__item a {
	padding: 14px 10px 12px 20px;
	display: block
}
#menuToggle .hamburguesa {
	padding: 13px 15px;
	position: absolute;
	right: 20px;
	font-size: 44px;
	font-weight: 100;
}
a.menu__link {
	display: inline-block;
	text-align: left;
}

/* drop down menu */
/* su comportamiento es presentarse */

#menuToggle .trigger:checked ~ .hamburguesa .hamb-on, #menuToggle .trigger:not(:checked) ~ .hamburguesa .hamb-off {
display: none
}
/* encabezado título de página */

span.mobile {
	display: block;
	width: 260px;
	margin: 0 0 0 10px;
	padding: 0px 0 0 56px;
	color: #ffffff;
	font-family: Noe-Display;
	font-weight: 400;
	font-size: 22px;
	line-height: 24px;
	background: url(../img/layout/ico-menu-mobile.png) no-repeat left 0px;
}

.text-bottom {
     margin-top: 0;
}

.text-top h1 {
    font-family: Noe-Display;
    font-weight: 400;
    font-size: 74px;
    line-height: 75px;
    color: #fff;
    margin: 1px 0 0 0;
    padding: 0;
}

.main-content-area-banner {
    height: 560px;
}

.content-home { width: 90%; margin: 0 auto;}

}
/************ CUERPO *************/

main {
	background-color: #fff;
	padding-bottom: 80px;
	z-index: 0;
	position: relative;
}
/* obras */

.profundidad {
	width: 100%;
	text-align: left;
	padding: 22px 0 20px 0;
	font-size: 14px;
	line-height: 100%;
	font-weight: 400;
	font-family: BrownStd;
	display: inline-block;
	text-transform: uppercase;
	border-bottom: solid 1px #ccc;
}
.profundidad.bordernone {
	border-bottom: none;
}
.borde {
	border: solid 1px #ccc;
	box-sizing: border-box;
}
 @media only screen and (max-width: 780px) {
.profundidad {
	display: none;
}
}
.content-lead {
	display: block;
	padding: 20px 30px 20px 65px;
	background-color: #fae897;
	width: 100%;
	height: auto;
	box-shadow: -3660px 0 0 #fae897, -2440px 0 0 #fae897, -1220px 0 0 #fae897, 1220px 0 0 #fae897, 2440px 0 0 #fae897, 3660px 0 0 #fae897;
	position: relative;
	display: flex;
	align-items: center;
}
.content-lead .numero-indice {
	font-family: Noe-Display;
	font-weight: 400;
	font-size: 183px;
	display: inline;
	vertical-align: middle;
}
 @media only screen and (min-width: 780px) {
.content-lead .lead {
	padding: 0 0 0 40px;
}

.content-lead.que-es-margin {
	padding: 0 0 0 50px;
}


}
.content-lead-level-bottom .lead {
	padding: 0 0 0 15px;
}
/* navegación obras - inner */

.content-lead-level-bottom {
	display: block;
	padding: 7px 7px 7px 0;
	background-color: #fae897;
	width: 100%;
	height: auto;
	box-shadow: -3660px 0 0 #fae897, -2440px 0 0 #fae897, -1220px 0 0 #fae897, 1220px 0 0 #fae897, 2440px 0 0 #fae897, 3660px 0 0 #fae897;
	position: relative;
	display: flex;
	align-items: center;
}
.content-lead-level-bottom .numero-indice {
	font-family: Noe-Display;
	font-weight: 400;
	font-size: 60px;
	display: inline;
	vertical-align: middle;
	padding-left: 0;
}
.lead h1 {
	padding: 0;
	font-family: Noe-Display;
	font-weight: 400;
	font-size: 36px;
	margin-bottom: 0;
	line-height: 100%;
}

h1.cabecera-secc {
font-size: 48px; } 

.content-lead-level-bottom .lead h1 {
	    padding: 14px 0 20px 15px;
}
.lead p {
	font-family: Noe-Text, Times, "Times New Roman", serif;
	font-weight: 400;
	font-size: 17px;
	line-height: 25px;
}
/* flechas de navegación en obra */


.navigation-inner ul {
	list-style-type: none;
	float: right;
	padding: 3px 0;
}
.navigation-inner ul li {
	display: inline;
}
.arrow-right {
	-ms-transform: rotate(180deg); /* IE 9 */
	-webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
	transform: rotate(180deg);
	margin-left: 10px;
}
/* cuerpo  */
.content-regular {
	width: auto;
	margin: 59px 0 0 210px;
	border-top: solid 1px #ccc;
}

.content-regular.bordernone { border-top: none; }

.content-bibliografia {
	width: auto;
	margin: 59px 0 0 210px;
	border: none;
}
 @media only screen and (min-width: 780px) {
.content-que-es, .content-programa {
	width: auto;
	margin: 36px 0 0 201px;
}
.content-programa.navigation {
	border-top: solid 1px #ccc;
	margin-top: 59px;
	padding-top: 20px
}
.content-que-es.top-space {
	margin-top: 30px;
}
.content-listado {
	border-top: solid 1px #ccc;
	margin-top: 59px;
	padding-top: 20px
}
}
.content-programa ul {
	text-align: center;
	margin-top: 40px;
	list-style-type: none;
	padding-left: 0;
}
ul.programa {
	text-align: left;
}
.content-que-es p, .content-programa li {
	font-family: Noe-Text, serif;
	font-size: 17px;
	line-height: 25px;
}
.margin-low {
	margin-bottom: 30px;
}
.margin-top {
	margin-bottom: 30px;
}
.content-regular h2, .content-programa .objetivos-tit, .content-programa h2 {
	font-family: Noe-Display, serif;
	font-weight: 400;
	font-size: 30px;
	line-height: 38px;
	margin-bottom: 40px;
}
.content-regular h2.tit-actividad {
	margin-bottom: 20px;
}
.picture {
	padding: 0;
}
.picture-activities {
	display: flex;
	padding: 30px 0;
}
h3 {
	font-family: Noe-Text, Times, "Times New Roman", serif;
	font-size:24px;
	line-height: 30px;
	font-weight: 400;
	padding: 0;
	margin: 0
}
.info-central {
	display:flex;
}
.texto-picture {
	overflow: hidden;
	height: auto;
	padding: 0;
	width: 100%;
}
.left-position {
	padding-right: 30px;
}
.right-position {
	padding-left: 30px;
}
.info-central p {
	font-family: Noe-Text, Times, "Times New Roman", serif;
	font-size:17px;
	line-height: 25px;
	font-weight: 400;
	width: 380px;
}
.img-portrait {
	width: 620px;
	height: auto;
	box-sizing: border-box
}
.img-landscape {
	width: 940px;
	height: auto;
	box-sizing: border-box
}
.img-activities {
	width: auto;
	height: auto;
	box-sizing: border-box
}
.img-activities img {
	width: 100%;
	height: auto;
}
.ancho0 {
	width: 180px;
	height: auto;
}
.ancho1 {
	width: 280px;
	height: auto;
}
.ancho2 {
	width: 293px;
	height: auto;
}
.ancho3 {
	width: 650px;
	height: auto;
}
.ancho4 {
	width: 470px;
	height: auto;
}
.img-portrait span, .img-landscape span, .img-center span, .double-img span, .img-activities span, .three-img span {
	font-family: Noe-Text, Times, "Times New Roman", serif;
	color: #606264;
	font-size: 17px;
	line-height: 20px;
	padding-top: 7px;
	display: block;
}
.double-img span {
	display: block;
	text-align: center;
}
.img-left {
	padding-right: 30px;
}
.img-center span {
	display: block;
	text-align: center;
}
/* bloque de tres imagenes */


.three-img {
	display: flex;
	width:100%;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 20px 0;
}
.img-1 {
	width: 212px;
	height: auto;
}
.img-2 {
	width: 407px;
	height: auto;
}
.img-3 {
	width: 349px;
	height: auto;
}
.img-1, .img-2, .img-3 {
	justify-content: around;
}
.audio {
	padding: 10px 105px 40px 0;
	margin-top: 40px;
}
.central-actividad {
	padding: 10px 0 40px 0;
	margin-top: 0;
}
.audio::before {
	background-color: #a7a9ac;
	content: '';
	display: block;
	height: 1px;
	margin-bottom: 30px;
	width: 50px;
}
.audio p, .central-actividad p {
	font-family: Noe-Text, Times, "Times New Roman", serif;
	font-size: 17px;
	line-height: 25px;
	font-weight: 400;
}
.ico-play {
	background: 0 15px url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAADTklEQVRYhd2ZS2gTQRiAv6SxrTaP1Ypi9VQWqyDmIIhQEOpBD4oHD2IrPSjqQVGxIBQPxYNCBe1FBLUSSrTNQYtYwQcK1UJAhB5WBBUWT1Kx+Fhtah8aI2MnpcnENtvsptXvlv2Xf75Mdmfm/+NhFlh6eAFQC9QBG4C1wHKgQmYbBj4Ar4B+oBeIa6bxw+5otgQtPawDR4EGYKnNsT4CXcBFzTRMJfoX8hK09PAKoBXYC5QoN9gjCXQCzZppvC9Y0NLDB4A2IKAEC2MIaNJM49p0Wf4qaOnhciAC1CtBZ4kB+zXTGM2VNaegpYdDQA+wWQm6Qx+wUzONrzMKypl7WES5NEJyW/ZMepXbJn7WYsshx4xkX8wQlC+E28/cdNRLh0kmf2K5lLxx4W21i3i7a9JL0NQZbJ0HckiH1vSHPzMod4jXeS3CZaUwNq5cdhixmK8RO056Bo/mu0MEG/cQ6rjMwtqNSsxBSqQTXrnxN9jKXbuJ0o6rhLpvULF1CymPslo5QYNw88pTid2Nf4L16/BdakO7141/1w48vkK36QyEU61XHpkKQ6+m5NwZgo/vEmjcg2dhmVOSdV55nnOGlVV4W5oJ9t4ndPggnkBFoWk3eOVh01kql8CJIwSfPiR08jgllYtnm36tEFymXHaKgB8O7cP/5AGh06dYsKrKbuJlQtCvXHaa8jLYu5tFj3oInT9L6erqfAfw5zoszCt8QML1WRwdg+47fL/WwY93A0p4GhJCcNA1waEExG6SiERJfvqihPNg0CdLw7wfirz49BmiMb5d7yI1NFxIplc+WbduV0Kz4d0AvyJRErdukxoZcyJjv08W1S1KyA7mW5LtEYZ77pP6mXTku0p6hWBcFtX29+MXL/l5JULiUS+eVEoJF4hwivtEO8LSw6LiP5Z3vvgzxtsjjMSf//noylkGuoTbv3Fglb2STuW2XLgvJ+hM92+m7iTNsmCZa4akCxmCsopqmgeCTVObSsrzLV+YuaqNY5ppZJQfuQ4L+2Ubotj0ybEzUARlb2RnkSXTzSOlw6UIMiEpukzbZGvMbWKyaaR0tsj1DGZj6eGDwIW5amDmnMGpaKbRLnolQFQuoIWSlLlqZpLjv2miZ1O0vyGA32XtBpyZwx6xAAAAAElFTkSuQmCC') no-repeat;
	background-size: 40px 40px;
	display: block;
	padding: 24px 20px 20px 48px;
	color: #f02530;
	font-family: BrownStd;
	font-size: 16px;
	line-height: 20px;
	font-weight: 700;
	display: inline-block;
	width: auto;
}

/************************************************/



.navigation-bottom {
	overflow: hidden;
	width: 100%;
	height: auto;
}
.navigation-bottom ul,
.navigation-bottom p {
	padding: 0;
	margin: 0;
	color: #f02530;
}
.navigation-bottom li {
	display: block
}
.navigation-bottom li a,
.navigation-bottom p {
	font-family: BrownStd;
	font-size: 16px;
	line-height: 20px;
	font-weight: 700;
	color: #f02530;
	cursor: pointer;
}

.navigation-bottom p {
	border-bottom: solid 1px #ccc;
	margin-bottom: 17px;
    padding-bottom: 24px;	
	display: block;
	 }



.navigation-bottom ul { overflow:hidden;  width: 100%; height: auto; display: block }


.navigation-bottom ul li { 
		width: 50%;
		display: inline-block;
		overflow: hidden;
		margin-bottom: 10px;
		padding-bottom: 20px;
	}
.navigation-bottom ul li:first-child {

	text-align: left;
	    float: left;
		    padding-top: 4px;
}
.navigation-bottom ul li:last-child {

	text-align: right;
	    float: right;
}
.navigation-bottom.activities-nav ul li.single { padding-top: 10px}




.navigation-bottom ul li:last-child::after {
	content: url('https://recursos.march.es/web/musica/jovenes/musica-pintura-conectar-sentidos/guia/img/layout/arrow-left.png');
	padding-right: 10px;
	display: inline-block;
	-ms-transform: rotate(180deg); /* IE 9 */
	-webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
	transform: rotate(180deg);
	cursor: pointer;
	
}
.navigation-bottom ul li:first-child::before {
	content: url('https://recursos.march.es/web/musica/jovenes/musica-pintura-conectar-sentidos/guia/img/layout/arrow-left.png');
	display: inline-block;
    vertical-align: sub;
    padding-right: 10px;
 
	cursor: pointer;

}



.navigation-bottom ul li.no-continue-back  { float: left; text-align: left; display: block; width: 100%; }
.navigation-bottom ul li.no-continue-forward { float: right; text-align: right; display: block; width: 100%; }

.navigation-bottom ul li.no-continue-forward:first-child::before,
.navigation-bottom ul li.no-continue-back:first-child::after {
content: "";
}

.navigation-bottom ul li.no-continue-forward:last-child::after {
content: url('https://recursos.march.es/web/musica/jovenes/musica-pintura-conectar-sentidos/guia/img/layout/arrow-left.png');
	display: inline-block;
    vertical-align: sub;
    padding-right: 10px;
 	    line-height: 10px;
	cursor: pointer;
}

.navigation-bottom ul li.no-continue-back:last-child::before {
	
	content: url('https://recursos.march.es/web/musica/jovenes/musica-pintura-conectar-sentidos/guia/img/layout/arrow-left.png');
	display: inline-block;
    vertical-align: sub;
    padding-right: 10px;
 
	cursor: pointer; }


	
	
	
	
/***********************************************************************/	
	
	
	
	
.tema-section {
	font-family: BrownStd;
	font-size: 16px;
	line-height: 30px;
	font-weight: 700;
	color: #606264;
	display: inline-block;
	width: auto;
	text-transform: uppercase;
}
.tema-section::after {
	background-color: #a7a9ac;
	content: '';
	display: block;
	height: 1px;
	padding-botom: 7px;
	margin: 0 0 10px 0;
	width: 50px;
}
.link-to-obra {
	color: #f02530;
}
.objetivivos-act-zone {
	background-color: #fef4f5;
	padding: 20px;
	line-height: 21px;
	display: block;
	overflow: hidden;
	font-size: 15px;
	margin: 30px 0 0 0;
}
.double-img {
	width: 100%;
	display: flex;
	margin: 30px 0;
}
.img-left, img-right {
	width: auto;
	overflow: hidden;
}
	


/* cuerpo central mobile - OBRAS */

@media only screen and (max-width: 780px) {
main img {
	width: 100%;
	height: auto;
}
main-content-area-banner {
	width: 104%;
	margin: 0 -2%;
}
.text-top {
	display: none;
}
main {
	background-color: #fff;
	padding: 0 2% 2rem 2%;
	width: 100%;
	box-sizing:border-box;
}
.content-lead {
	display: block;
	padding: 20px 0;
	background-color: #ffffff;
	width: 100%;
	height: auto;
	display: flex;
}
.content-lead .numero-indice {
	font-family: Noe-Display;
	font-weight: 400;
	font-size: 27px;
	line-height: 30px;
	display: inline;
	vertical-align: top;
}
.info-central {
	flex-wrap: wrap;
}
.content-regular h2 {
	margin-bottom: 10px;
}
.info-central p {
	width: 100%;
	height: auto;
}
.content-lead .lead {
	padding: 0;
}
.content-lead-level-bottom .lead {
	padding: 0 0 0 3px;
}
.content-lead-level-bottom {
	padding: 20px 0 0 0;
	background-color: #fff;
}
.content-lead-level-bottom .numero-indice {
	font-size: 27px;
	line-height: 30px;
	padding-left: 0;
	color: #808285;
}
.navigation-inner {
	overflow:hidden;
	border-bottom: solid 1px #ccc;
}
.navigation-inner ul {
	list-style-type: none;
	float: right;
	padding: 0 17px 7px 0;
	margin: 0;
}
.navigation-inner img {
	width: auto;
}
.arrow-right {
	-ms-transform: rotate(180deg); /* IE 9 */
	-webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
	transform: rotate(180deg);
	margin-left: 10px;
}
.content-lead-level-bottom .numero-indice::after {
	content: ".";
}
.lead h1 {
	padding: 0;
	font-family: Noe-Display;
	font-size: 27px;
	line-height: 30px;
	color: #808285;
	color: #808285;
}
.content-lead-level-bottom .lead h1 {
	padding: 0;
	color: #808285;
}
.lead p {
	font-family: Noe-Text, Times, "Times New Roman", serif;
	font-weight: 400;
	font-size: 17px;
	line-height: 25px;
}
.content-regular {
	width: auto;
	margin: 0;
	border-top: none;
}
.content-regular h2 {
	font-family: Noe-Display, serif;
	font-weight: 400;
	font-size: 22px;
	line-height: 26px;
	padding: 0 0 10px 0;
	border: none;
}

.pdf-descarga-inner {
    width: 90%;
    display: block;
    margin: 1.5rem 0;
}

.pdf-descarga-inner a {
    background-image: url(https://recursos.march.es/web/musica/jovenes/crear-con-el-cuerpo/guia/img/layout/ico-pdf-inner.png);
    background-repeat: no-repeat;
    background-position: left top;
    color: #f02530;
    font-family: BrownStd, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 15px;
    line-height: 20px;
    font-weight: 400;
     padding: 4px 0 10px 34px;
    display: block;
    border: none;
}



.audio {
	padding: 10px 0 20px 0;
	margin-top: 10px;
}
.navigation-inner ul li {
	display: inline;
	margin: 0 0 0 7px;
}
/* que es musica */

.content-que-es {
	width: 100%;
	padding: 0 2%;
	box-sizing: border-box;
}
.content-que-es blockquote {
	width: 100%;
	padding: 0;
	margin: 1rem 0;
}
.texto-picture.right-position.ipad {
	width: 68%
}
.texto-picture.left-position.ipad {
	width: 68%
}
}
/************ tabla de objetivos **********************/

table {
	border-bottom: solid 1px #ccc;
}
table tr:nth-child(2n+1) {
	background-color: #eeeeee;
}
table caption {
	display: none;
}
table.objetivos {
	width: 1220px;
	height: auto;
	margin-top: 30px;
}
table.objetivos tr th, table.objetivos tr td {
	width: 150px;
	text-align: left;
	padding: 10px;
}
table.objetivos tr th {
	padding: 5px;
	border-right: 1px solid #ffffff;
}
.oculto-desktop {
	display: none;
}
 @media only screen and (max-width: 780px) {
table {
	border-bottom: solid 1px #eee;
}
table.objetivos {
	width: 100%;
	height: auto;
}
table.objetivos tr {
	display: block;
	width: 100%;
	padding: 12px;
	box-sizing: border-box;
}
table.objetivos tr th, table.objetivos tr td {
	display:block;
	text-align: left;
	width: 98%;
}
table.objetivos tr th {
	padding: 5px;
	display:none;
}
.oculto-desktop {
	font-weight: bold;
	display: inline;
}
table td {
	font-size: 16px;
	line-height: 21px;
	padding-bottom: 12px;
}
/******* banner home ***********/

.main-content-area-banner {
	width: 104%;
	margin: 0 -2%;
}
.text-bottom {
	margin-top: 42vw;
}
/******* cuerpo home ************/

.content-home-item {
	width: 100%;
	display: block;
}
.content-home-item__tit {
	width: 100%;
	display: block;
}
.content-home-item__parrafo {
	display: block;
	width: 100%;
	overflow: hidden;
}
.home-button-start, .home-button-double {
	margin: 1rem auto;
}
.cita-derechos {
	width: 80%;
	margin-top: 2rem
}
h1.numero-que-es::before {
	content:"1. "
}
h1.numero-concierto::before {
	content:"2. "
}
h1.numero-obras::before {
	content:"3. "
}
h1.numero-actividades::before {
	content:"4. "
}
h1.numero-profesor::before {
	content:"5. "
}
h1.numero-bibliografia::before {
	content:"6. "
}
.content-lead .numero-indice {
	display: none;
}
.content-regular h2 {
	padding: 0;
	margin-bottom: 0;
	display: block;
	width: 100%
}

.title-pdf {
    display: block;
}

.img-portrait {
	width: 50%;
}
.img-landscape {
	width: 50%;
}
.texto-picture {
	width: 48%;
}
/* bloque de tres imagenes */


.three-img {
	justify-content: space-around;
}
.img-1, .img-2, .img-3 {
	justify-content: left;
	padding-bottom: 2rem;
}
.mondrian {
	width: 50%;
	height: auto
}
.content-bibliografia {
	margin: 10px 0 0 30px;
}
header {
	box-shadow: -3660px 0 0 #fc0d1b, -2440px 0 0 #fc0d1b, -1220px 0 0 #fc0d1b, 1220px 0 0 #f6d12f, 2440px 0 0 #f6d12f, 3660px 0 0 #f6d12f;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fc0d1b+0,f6d12f+100 */
	background: #fc0d1b; /* Old browsers */
	background: -moz-linear-gradient(left, #fc0d1b 0%, #f6d12f 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #fc0d1b 0%, #f6d12f 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #fc0d1b 0%, #f6d12f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fc0d1b', endColorstr='#f6d12f', GradientType=1 ); /* IE6-9 */
	z-index: 1;
	height: 70px;
	display: flex;
	align-items: center;
	position: fixed;
	width: 100%;
}
main {
	padding-top: 5rem;
}
}
 @media only screen and (max-width: 480px) {
	 main {
	padding-top: 4rem;
}
	 
.text-bottom {
	margin-top: 39vw;
	margin: 40vw 0 0 28vw;
}
.text-bottom__item-top {
	margin: 0 0 0 3vw;
}
.main-content-area-banner {
	height: 95vw;
}
.text-bottom__item-top {
	padding-bottom: 18vw;
}
.img-portrait, .img-landscape, .texto-picture {
	width: 100%;
}
.right-position {
	padding: 0;
	margin-top:2rem;
}
.button-mobile {
	overflow: hidden;
	margin: 0 auto;
	tex-align: center;
}
.right, .left {
	float: none;
}
.home-button-start, .home-button-double {
	display: block;
	width: 90%;
	margin: 0 auto 2rem auto;
}
.content-programa h3 {
	background-color: #f2f2f2;
	padding: 8px;
	font-size: 22px;
}
.content-programa ul {
	margin: 2rem 0;
	padding:0;
}
.content-listado {
	padding-top: 2rem;
}
.picture-activities {
	display: block;
	padding: 30px 0 0 0;
}
.double-img {
	width: 100%;
	display: block;
}
.double-img .img-left, .double-img .img-right {
	display: block;
	width:100%;
}
.img-left {
	padding-right: 0;
	margin-bottom: 2rem;
}
.lista-actividades {
	padding: 0 0 0 2rem;
}
.ancho0 {
	width: 100%;
	height: auto;
}
.mondrian {
	width: 100%;
	height: auto;
	float: left;
}
.texto-picture.right-position.ipad, .texto-picture.left-position.ipad {
	width: 100%
}
.left-position {
	padding-right: 0;
}
.content-bibliografia {
	margin: 0 0 0 20px;
}
.content-home-item__tit h2 {
	margin-bottom: 0
}

.pdf-descarga-home {
	
	margin: 2vw 0 0 28vw;
	}
	
.pdf-descarga-home a {
	background-position: left center;
    padding: 15px 15px 12px 34px;
	display: block;}	
	.pdf-descarga-home a span { display: block}
}