.texto{ font-size: 9pt}
.titulosecundario{ font-size: 10pt}
.titulomasimp{ font-size: 12pt}

.im img { width: 100%; 
max-height: 100%} 

.textovioleta{ color:#A75086 }
.textoamarillo{ color: #F3A317}
.textoazul{ color: #0D8FC5}
 .textoverde{ color: #69B037}
 .textorojo{ color: #E5364A}
.textonegro{ color:black}
.textogrisclaro{ color:#C6C4C2}
.textogris{ color:grey}
     



*{ font-family:  'Martel Sans', sans-serif; }
    body{
    margin:0;
        background-color: #F1EBE5;
    }
    
    #contenedor{ width: 811pt; 
        margin: auto; 
        background-color: #F1EBE5;
        ; 
    }



    ul{ margin: 0; 
    padding: 0 }

    a { text-decoration: none}
    
    li { list-style: none;
    display: inline-block}
    
    header{
        float: left;
        width: 811pt;
    }
    #navegador1{ background-color: #DEDBD4 ;
    width: 100%; 
    float: left;
        padding-bottom: :2px}
        
    


#navegador1 {
  background-color: #DEDBD4;
  width: 100%;
  float: left;
  PADDING-BOTTOM: 2PX}

#navegador1 nav {
  width: 811pt;
  margin: auto;}

   
  #navegador1 ul {
  margin-left: 1%;
  width: 305px;
  float: left}

    #navegador1 li {
  font-size: 9pt;
  padding-bottom: 1%;
  margin-left: 2%;
  color: rgb(168, 167, 167);
  padding-left: 4px;
  padding-right: 4px;
  padding-top: 2px;
    border:solid 2px #DEDBD4 }

#navegador1 li:hover{ border: solid 2px rgb(212, 207, 207);
    color:white}
    
.lineacolores{ width: 100%;
    float:left}


    #logo img { 
    width: 100%;
    max-width: 100%; }
    
#logo { margin-left: 2%;
    margin-bottom: 2%;
    float: left; 
    margin-top:2%;
    clear: left;
    width:26% ; }
    
 #redes { float: right;
    margin-right: 2%;
    margin-top: 4%;
      }

    #arriba2 {
        float: left;
        width: 96%;
        margin:0 2%;
    }
  #arriba2 nav {
  float: left;
  width: 100%;
  clear: both;
  background-color: #DEDBD4;
  padding-top: 1pt;
  padding-bottom: 1pt;
  margin-top: 1%;
  margin-bottom: 1%;}


    #arriba2 li { font-size: 11pt;
    margin-left: 2%;
    display: inline-block}

    .navseleccion {
    width: 12%;
    float: left; 
  text-align: center;
        color: #787A78;}


    .navvioleta:hover{ border-bottom: solid 3px #A84E84;
    color: #A84E84}
     .navvioletaf{ border-bottom: solid #A84E84 3px ;
    color: #A84E84}

    .navamarillo:hover{ border-bottom: solid 3px #F3A218;
    color: #F3A218}
    .navamarillof{ border-bottom: solid 3px #F3A218;
    color: #F3A218}

    .navazul:hover{ border-bottom: solid 3px #0491C6;
    color: #0491C6}
    .navazulf{ border-bottom: solid 3px  #0491C6;
    color:  #0491C6}

    .navverde:hover{ border-bottom: solid 3px #68AF36;
    color: #68AF36}
    .navverdef{ border-bottom: solid 3px #68AF36 ;
    color: #68AF36}

    .navrojo:hover{ border-bottom: solid 3px  #E5364A;
    color:  #E5364A}
    .navrojof{ border-bottom: solid 3px  #E5364A ;
    color:  #E5364A}
    

   .centro {
  margin-top: 2%;
  width: 100%;
  float: left;
  margin-bottom: 3%;}

  .color1 {
  width: 12%;
  border: 0;
      height: 1%;
  float: left;
  padding-left: 2px;
  width: 10%;
  padding-left: 2%}

    main { 
        margin-left: 2%;
        margin-right: 2%;  
        width: 96%;
        float: left;
    }


    section { width: 61%;
    float: left; }
    
    #imagen { width:  76%;
    float: left;
    }
    #imagen img { margin-top: 5%;
        float: left;
    max-width: 100%;
    width: 100% ; 
    }

    #doscuadrados { float: right;
    width: 24%; 
      margin-top: 4%;
      }

    #superior { background-color: #F3A218;
        padding-top: 0;
        float: left; 
        width: 100% ;
        height: 131px;
        color: white}
    

#superior:hover{ background-color:#C4BFB8}

    #inferior{ background-color: #A84E84;
    padding-top:1%; 
    float: left; 
    width: 100%;
    height:135px;
    color:white}
    
#inferior:hover{ background-color:#C4BFB8}

    #partearriba { font-size: 8pt; 
    color: white ;
    float: left; 
    width: 100% }

    #parteabajo{ clear:both;
    float: left; 
    width: 100% }
    
    #partearriba p { 
    margin-right: 5%;
    margin: 0;
    margin-top: 5%;
    margin-left: 5%;}
    
    #parteabajo { font-size: 8pt;
            color:white;}

    #parteizq { width: 25%; 
        float: left; }
    
    #parteizq h3 { margin-top: 24%;
    text-align: center;
    font-size: 20pt; }

    #cuadradoazul { 
    float: left; 
    width: 100%; 
    background-color: #0491C6;
      padding-top: 2px;
        color:white }
#cuadradoazul:hover{ background-color:#C4BFB8}

   
    #cuadradovioleta { background-color: #A84E84; 
    float: left;
    width: 100%; 
   padding-top: 8px;
    height: 124px;
        color:white;  }  

#cuadradovioleta:hover{ background-color:#C4BFB8}

    #parteizq p { 
    margin:0; 
    margin-right: 5%; 
    margin-left: 5%;
    margin-top: 5% ; }

    
    #partederecha { float: left;
    width: 75% }
    
    #imagen2 { width: 68%; 
    float:left; } 
   
    #imagen2 img { max-width: 100%; 
    width: 100%; 
    }
    
    #derechaderecha { float: right;
    width: 32%}

    #cuadradoverde { background-color: #69B037;
    float: left; 
    width: 100% ;
    padding-bottom: 2%;
    color:white}
#cuadradoverde:hover{ background-color:#C4BFB8}

    
    #cuadradoverde p { 
    margin: 0; 
    margin-right: 5%;
    margin-left: 5%; 
    margin-top: 5% ; }


    #imderechaderecha { float: left; 
        width: 100% }
  
    #imderechaderecha img { width: 100%;
    max-width: 100% }

    #mas1 { float: right;
    margin-right: 7%;
      margin-bottom: -2px;
  margin-top: -2px;
    color: white}
    
    #mas2 { float: right;
    margin-right: 7%;
    margin-bottom:-2px;
    margin-top: -16px;
        color:white }
    
    #mas3 { float: right;
    margin-right: 7%;
    margin-top: -7px;
    color: white}
    
    #mas4 { float: right;
      margin-top: -10%;
  margin-bottom: -3px; 
    margin-right: 6%;
    color:white }
    
    
    .maslink{font-size: 25pt;
    color: white}

    

    #colaborar { float: left; 
    width: 100%; 
    background-color: #0491C6;
    margin-top: 2%; 
    }
    
    #colaborartitulo { width: 97%; 
    float: left; 
    margin-left: 3%; }
    
    #colaborartitulo p { font-size: 10pt; 
    color: white;
    margin: 0;
    margin-top: 2%;
    margin-bottom: 1%; }
    
    #formascolaborar{ width: 98%; 
    float: left; 
    }
    
    #formascolaborar p { font-size:  7pt;
    color: white ; 
    margin: 0 ;
    margin-bottom: 11%; 
     }
    
    .team { float: left; 
    width: 17% ;
    margin-left: 3%; 
    text-align: center; }

    #teamim1 { float: left; 
    width: 37%;
    margin-left: 32%; 
   }
    
     #teamim2 { float: left; 
     width: 33%;
     margin-left: 35%; }

     #teamim3 { float: left; 
     width: 33%;
     margin-left: 35%; }

     #teamim4 { float: left; 
     width: 40%;
     margin-left: 31%; }

     #teamim5 { float: left; 
     width: 27%;
     margin-left: 36%; }


    
    #formascolaborar a { width: 100%;
        float: left; }
    
    
    #colaborar img { width: 100%; 
    max-width: 100%;
    margin: auto }
    #colaborar img:hover{ background-color: rgb(118, 187, 233)}

    .teamt { float: right;
        width: 100% }



    footer { clear: both; }

    main article { width: 35%; 
    float: right;
    margin-top: 1%;
     
     }
    #noticias { float: left;
    width: 100%;
    margin-top: 4%;
    }

    #cuadradonoticias{ background-color: #69B037; 
    float: left; 
    width: 100%; 
    text-align: center; }

    #cuadradonoticias p { color: white;
     }
    
    #cuerponoticias { float: left; 
    width: 100%;
    margin-top: 3% }

    article p { margin: 0 }

    .texton { color: #9DA59D; 
    font-size: 9pt } 
    
    .fecha { color: #69B037; 
    font-size: 8pt; 
    margin-top: 2%}

    .lineanoticias { float: left; 
    width: 100%; 
    border: 1px dotted #9DA59D;
    margin-top: 0%; 
    }

    .texton a:link { color:black;}
    .texton a:visited { color: black;}
    .texton a:hover { color: #69B037; }


    #agenda { width: 100%; 
    float: left;
    margin-top: 9% }

    #cuadradoagenda { width: 100%; 
    float: left;
    background-color: #F3A218; 
    text-align: center;
    }

    #cuadradoagenda p { color: white; }


    #cuerpoagenda { float: left;
    width: 100%; 
    margin-top: 2%} 

    .textoa {  
    font-size: 9pt; }

    .textoa a:link { color:#8F938F;}
    .textoa a:visited { color: #8F938F;}
    .textoa a:hover { color:#F3A218 ; }

    .tituloa { color: #F3A218; 
    font-size: 10pt ; }


    footer { width: 100%; 
    float: left; 
    margin-right: 0%;
    margin-left: 0%; 
    margin-top: 4%; 
    background-color: #DFDAD4;
    padding-bottom: 1%; 
    }

    #foot{ 
    float: left;
    width: 98%;
    margin-left: 2%; 
    margin-top: 1%; 
    margin-bottom: -1%; }

    .footerimg{ width: 10%; 
    float: left;
    margin-right: 3%}

    .footerimg img { width: 100%; 
    max-width: : 100%;} 

    footer nav li { font-size: 7pt; }
    
    #foot nav{ float: left; }

    footer a:link { color: black;}
    footer a:visited { color: black ;}
    footer a:hover { color: white ; }

    #lineafooter{ border: 1px solid grey; 
    clear: both;
    margin-left: 2%; 
    margin-right: 2%; 
    float: left;
    width: 96%;
        margin-top: 2px;}
    }

#parteizq h3 a {
  color: white;}

.footerimg1 {
  float: left;
  width: 11%;
  margin-top: 7px;}

.textoobligatoriof {
  float: left;
  width: 96%;
  padding-left: 2%;
  font-size: 11px;}

#inferior {
  background-color: #A84E84;
  padding-top: 1%;
  float: left;
  width: 97%;
  height:  132px;
  padding-right: 3%;}

#cuadradovioleta a {
  color: white;
}






 /*aca termina el css de index y empieza el de colaborar*/


.fondovioleta { background-color:#A75086;
color:white;
border: 2px solid #A75086}

.fondoamarillo { background-color: #F3A317;
color:white;
border: 2px solid #F3A317;
}

.fondoazul { background-color: #0D8FC5;
color:white;
border: 2px solid  #0D8FC5;}

.fondoverde { background-color: #69B037; 
color: white; 
border: 2px solid #69B037;}

.fondorojo{ background-color: #E5364A;
border: 2px solid #E5364A;
color: white;} 


.bordevioleta { border: 2px solid #A75086;
color: #A75086}
.bordevioleta:hover{ background-color: #A75086  ;
    color:white}

.bordeamarillo { border: 2px solid #F3A317;
color:#F3A317 }
.bordeamarillo:hover{ background-color:  #F3A317 ;
    color:white}

.bordeazul { border: 2px solid  #0D8FC5;
color: #0D8FC5}
.bordeazul:hover{ background-color:  #0D8FC5 ;
    color:white}

.bordeverde { border: 2px solid #69B037;
color:#69B037 }
.bordeverde:hover{ background-color:#69B037  ;
    color:white}

.borderojo { border: 2px solid #E5364A;
color: #E5364A}
.borderojo:hover{ background-color: #E5364A ;
    color:white }




   #colaborarmain{ float:left;
    width: 100% ; 
        margin-top: 4% ; }
        
    #colaborarart { ; 
        float: left;
        width: 23%;
        margin-left: 2%}
    
    #colaborarart nav{ width: 100%; 
    float: left; }


    #colaborarart li{ margin-bottom: 5%;
    width: 100%;
    float: left; 
    text-align: center;
    font-size: 11pt 
    }
    .donuno{ float: left; 
        width: 100% ; 
        padding-bottom: 1%;
        padding-top: 2%;
        }
        
  

 #colaborarsec { width: 67%;
        float: right; 
    margin-right: 5%
    }

    #imagencolaborar img { width: 100%;
    max-width: 100% }

    #imagencolaborar { float:left;
    width: 5%}
    
    
    #colaborarmain li {  list-style: none;}

    #cajac { float: left; 
    width: 100% ;
    background-color: #DFDAD4; 
    padding-left: 2%;
    padding-right: 2%;
    padding-top: 2%;
    padding-bottom: 1%}
   
    #textoc {
    width: 100%;
    float: left }

    #textoc p { font-size: 9pt;
    margin: 0 } 

.pesado{ font-family:  'Martel Sans', sans-serif;
    font-weight: 700;font-size: 13px;}

.titulocolaborar { 
    float: left;
    margin-top: 3%;
    width: 100%;
    margin-bottom: 0%;}

    #lineac{ 
    width: 100%;
    float: left;
    height: 1%;
    border: 1px solid #9DA59D; }

 #fotoscolaborar{ float:left;
        width: 100%;
 margin-top: 3%}
 #fotoscolaborar img { width: 100%;
        max-width:100%}

#fotounoc { 
width: 36%;
    float: left}

#fotodosc{ width: 36%;
    float: right;
margin-right: 23% }

.mailcolaborar {
  float: left;
    width: 100%;}
    
.mailcolaborar { font-size: 9pt;
    color: #5190C2
}

/*aca termina colaborarcomun y colaborarnuevooo */


.textoarribadon {
  float: left;
  width: 91%;
  margin-bottom: 1%;}

.columnascolab {
  float: left;
  width: 100%;}

.columnacolab {
  float: left;
  background-color: #CBBDD2;
  width: 32%;
  margin-left: 14px;}

.recuadrotitulocolab {
  float: left;
  width: 95%;
  border: 0;
  padding-left: 5%;
  font-size: 13px;
  padding-top: 6px;
  padding-bottom: 5px;}

.colaborarsec p { margin:0}

.recuadrotitulocolab p {
  margin: 0;}


.textocolumnasc {
  float: left;
  width: 90%;
  padding-left: 5%;
  padding-right: 5%;
  padding-top: 6%;}

.textocolumnasc p {
  margin: 0}

.cadaparrafocc {
  float: left;
  width: 100%;
  margin-bottom: 7%;}

.imagencolaborar1 {
  float: left;
  width: 90%;
  padding-left: 5%;
  padding-right: 5%;}

.columna1colab {
  float: left;
  margin: 0;}

.imagencolab2 {
  float: left;
  /* width: 91%; */
  margin-top: 21px;}

.mailcolaborar {
  font-size: 9pt;
  color: #5190C2;
  border: 1px solid;
  margin-top: 3%;
  margin-bottom: 2%;
  padding-left: 2%;
  width: 98%;
  float: left;}

.artabajo p {
  color: #A9DE7F;
  margin: 0;
  margin-bottom: 3%;}

.artabajo {
  float: left;
  width: 94%;
  color: #A9DE7F;
  opacity: 7px;
  border: 1px solid;
  padding-left: 3%;
  padding-right: 3%;
  padding-top: 5%;
  padding-bottom: 5%;
  margin-top: 29%;}



/*aca termina colaborar y empieza villa jardin */



#mainvj p { margin: 0}


#mainvj { width: 96%;
    margin-left: 2%;
    margin-right: 2%; 
float: left;
margin-top: 3%}


#artvj { float: left; 
width: 35%; 
  margin-right: 4%;
}

#cajavj1 { float: left; 
width: 100%;
    margin-bottom: 3%
    
} 

#cajavj1 p { font-size: 12pt;
margin-left: 2%;

}

#textovj1{ float: left; 
width: 100%;
font-size: 9pt;
margin-bottom: 6% }



.titulovj{ font-size: 10pt; 
  margin-bottom: 2%;
  width: 100%;
  float: left;}



    #parte1vj { float: left;
width: 60%;
margin-right: 2%;
font-size: 9pt;
    color: #9E9E9E}
    

#textovj1 p { margin-bottom: 1%}

#imagenesvj { float: left; 
width: 100%; 
margin-top: 4%
}

#imagenvj1{ float: left; 
width: 47%;
margin-left: 2%;
}

#imagenvj2{ float: right; 
width: 40%} 

  #secmapavj{ background-color: #E9C6DC;
  float: left;
  width: 95%;
  padding-left: 5%;
  padding-bottom: 3%;
  padding-top: 2%}

    #mapavj { width: 70%;
    float: left}

#secmapavj .titulovj {
  color: #A75086;}

.webvj {
  float: left;
  width: 100%;
  color: #959695;
  font-size: 8pt;
  margin-top: 2%}
      
#secvj { float: right;
    width: 61%;
}

.titulosecvj{ color: #0D8FC5;
margin-bottom: 1%;
    margin-top: 4%; 
float: left;
width: 100%}

.titulovj{color: black}

#parte2vj{ width: 34%;
    background-color: #B6E1F2;
    float: right}


.titulovj1{ color:#0491C6;
    margin-bottom: 2%;
  width: 100%;
  float: left;
font-size: 10pt; 
  text-align: center;
  margin-top: 3%;} 


#galeriavj { float: left; 
width: 80%;
margin-left: 10%;
    margin-right: 10%}

.galeria1vj { width: 100%;
float: left}

#masvj {
  width: 54%;
  float: right;
  padding: 0;
  margin: 0;
  font-size: 34pt;
color: #F3A218}

#masvj p:hover { color: white;}

/*aca termina el css de villa jardiiiin y empieza el de talleresss principal */

#mainta p { margin: 0}

#mainta{ 
  width: 96%;
  float: left;
  margin-top: 3%;
  margin-left: 20px;
margin-bottom: 7%;}

#secta{  width: 70%;
  float: left;
  margin-bottom: 4%; }

.titulot {
  width: 100%;
  float: left;
margin-bottom: 2%;}

.textota{ width: 100%;
    float: left}

.textota p { margin:0}

#buscadorta { float: left; 
    width: 26%;
  margin-left: 4%;
}

#filtrota{ width: 100%;
    float: left;
font-size: 9pt;
border: 1px solid  #F3A317;
color: #F3A317;
}

#filtrota p {
  margin-left: 2%;
  width: 100%;
  float: left;}

#filtrota1{ width: 48%;
    margin-right: 1%;
    float: left;
font-size: 8pt;
margin-top: 2% }

#filtrota2{ width: 48%;
    float: right;
font-size: 8pt;
margin-top: 2% }


#talleresmenu {
 
  clear: both;
  width: 100%;
  float: left;
  MARGIN-TOP: 6%;}

#talleresmenuarriba{ width: 100%;
float: left}

#talleresmenuabajo {
  width: 100%;
  float: left; }

.cuadraditot {
  width: 25%;
  float: left;
  border: 0}

.cuadraditot:hover {
  background-color: #C4BFB8}
    
.contcuadradito { width: 100%;
    text-align: center;
    float: left;
      padding-bottom: 14%;
}

#cont1 {
  width: 36%;
  margin-top: 18%;
 margin-left: 32%;
  padding-bottom: 7px;
float: left}

#cont2 { 
  width: 36%;
  float: left;
  margin-left: 30%;
  margin-top: 17%;
  padding-bottom: 9px;}

#cont3 {
  width: 38%;
  float: left;
  margin-left: 30%;
  margin-top: 18%;
  margin-bottom: 3px;}

#cont4 {
  width: 38%;
  margin-left: 30%;
  margin-top: 18%;
  float: left;
  margin-bottom: 3px;}

#cont5 {
  width: 35%;
  margin-top: 18%;
  margin-left: 33%;
  float: left;
  margin-bottom: 5px}

#cont6 {
  width: 33%;
  float: left;
  margin-left: 34%;
  margin-top: 18%;
  margin-bottom: 8px;}
#cont7 {
  width: 32%;
  float: left;
  margin-top: 18%;
  margin-left: 33%;
 margin-bottom: 9px}

#cont8 {
  width: 47%;
  MARGIN-LEFT: 26%;
  float: left;
  margin-top: 18px;
 } 

.cct { width: 100%;
    text-align: center; 
float: left;
font-size: 12px}

#infota {
  float: left;
  width: 100%;
  margin-top: 25%;
  border: solid 1px;}

#infota p {
  width: 90%;
  float: left;
  font-size: 10pt;
  margin-left: 7%;
  margin-top: 1%;
  margin-bottom: 6%;}


.tituloinfot {
  margin-left: 7%;
  margin-top: 5%;
  float: left;
  width: 100%;}

/*aca termina el css de talleres princila y empieza el de agenda principal */

#mainagenda{ 
  width: 96%;
  float: left;
  margin-top: 3%;
  margin-left: 20px;}

#mainagenda p { margin: 0}

#mesagenda{ width: 100%;
    float: left;
padding-top: 2%; 
border:0}

#arribaagenda{ width: 50%;
    float:left}

.flecha1 {
  width: 6%;
  float: left;
  margin-left: 2%;
  }

.flecha2 img:hover {
  background-color: #F2BB72;}

.flecha1 img:hover {
  background-color: #F2BB72;}

.nombremes {
  width: 53%;
  float: right;
  font-size: 27px;
  margin-right: 34%;
  margin-top: -2%;}

#arribaagenda2{ width: 40%;
    float: right}

#calendarioa {
  float: left;
  width: 50%;
  margin-left: 22%;}


.diasa{ width: 100%;
    float: right  ;
        font-size: 11px;}

.diasa p {
  width: 14%;
  float: left;
  margin-left: 6%;}

.lineacalendario {
  width: 90%;
  float: left;
  border: white solid 1px;}

.dias2a {
  width: 100%;
  float: right;
  font-size: 10px}

.dias2a p {display: inline-block ;
  float: left;
  width: 22px;}

.flecha2 {
  width: 31px;
  float: right;
  margin-right: 3%}

.seccionagenda{width: 100%;
    float: left}
.fechacuadradolinea{ width: 100%;
    float: left}

.diayfecha {
  float: left;
  padding-left: 2%;
  width: 500px;
  padding-top: 4px;
  border-right: 0;}

.rellenotitulo {
  float: right;
  width: 513px;
  height: 33px;
  border-left: 0;}

.lineaagenda{ float: left;
    width: 100%;
  border-left: 0;
  border-right: 0}

.infoyfotoa{ width: 100%;
    float: left;
padding-top: 3%}

.tituloagenda {
  float: left;
  width: 100%;
margin-bottom: 1%}

.infoa {
  width: 58%;
  float: left}

.lugara {
  width: 100%;
  float: left;
  font-size: 13px;
  color: #848382;
  margin-top: 2%;}

.fotoagenda {
  width: 39%;
  float: right;}


.diayfecha p { margin-left:2%}



.flechasagenda {
  width: 71%;
  float: left;
  font-size: 9pt;
  margin-left: 42%;
  margin-top: 3%;}


.botonagenda{  width: 18px; 
    float:left;
    border: solid #F4D6AE 1px;
color: #F3A317;
margin-left: 1%;
text-align: center;
  border-radius: 3px;}

.botonagendas {
  width: 10%;
  float: left;
  border: solid #F4D6AE 1px;
  color: #F3A317;
  margin-left: 1%;
  text-align: center;
  border-radius: 3px;}

.agendabotonselec{ color: white; 
    border: solid #F3A218 1px;
background-color:#F3A218 }

.botonagenda:hover{ color:white;
     border: solid #F3A218 1px;
background-color: #F3A218}

.botonagendas:hover{ color:white;
     border: solid #F3A218 1px;
background-color: #F3A218}
    






/*aca termina el css de agenda princila y empieza el de teatro */

#mainteatro p { margin: 0}

.maintodos{ width: 96%;
  float: left;
  margin-top: 2%;
  margin-left: 20px;}

.maintodos p{ margin:0}

#mainteatro{ 
  width: 96%;
  float: left;
  margin-top: 2%;
  margin-left: 20px;}

.titulosupt {
  width: 100%;
  float: left;
  padding-top: 2%;
  padding-bottom: 1%;
border:0}

.titulosuptexto {
  width: 50%;
  float: left;
  color: white;
  font-size: 17pt;
  margin-left: 5%;
  margin-top: 1%;}

.iconoteatro {
  width: 6%;
  float: right;
  margin-right: 5%;}

.teatrocont {
  float: left;
  width: 96%;
  background-color: #DFDAD4;
  margin-top: 2%;
  padding-left: 2%;
  padding-right: 2%;
  padding-top: 2%;}

.infoteatro {
  float: left;
  width: 76%;
  padding-bottom: 3%}

.cuadradotituloteatro {
  float: left;
  width: 98%;
  border: #A75086 solid 2px;
  PADDING-LEFT: 2%;
  PADDING-TOP: 4PX;
  font-size: 14px;}

.arribainfoteatro {
  width: 100%;
  float: left;
  padding-top: 2%;}

.telefonoteatro {
  width: 100%;
  float: left;
  padding-top: 1%}

.lineateatro { width: 100%;
    float: left; 
border: 1px dotted #A75086; 
margin-top: 1%;
margin-bottom: 1%}

.modalidadteatro {
  width: 100%;
  float: left;
  margin-top: 2%}

.modalidadizq {
  float: left;
  width: 64%;
}

.cuadradoadultost {
  width: 98%;
  float: left;
  padding-left: 3%;
  margin-bottom: 3%;
}

.diasydirec {
  float: left;
  width: 100%;
  margin-top: 4%;}

.textogris{ color: #74687A}

.modalidadder {
  float: right;
  width: 33%;}

.tituloprofteatro {
  width: 96%;
  float: left;
  border: solid 1px;
  padding-left: 4%;
  padding-top: 2px;
  margin-bottom: 5%;}

.fichateatro {
  float: left;
  width: 97%;
  background-color: #CBBDD2;
  margin-bottom: 6%;
  padding-left: 4%;
  padding-top: 4%;}

.imagenficha {
  float: left;
  width: 34%;
  margin-right: 5%;}

.textoficha {
  float: right;
  width: 61%;}

.textoficha {
  float: right;
  width: 61%;
  font-size: 11px;
  margin-top: 3%;}

#imagenesteatro {
  float: right;
  background-color: #C99CB5;
  width: 17%;
  padding-left: 2%;
  padding-right: 2%}

#galeriateatro {
  width: 100%;
  float: left;
  margin-top: 5%;}

.tituloimagenest {
  font-size: 12pt;}

#imagenesteatro {
  float: right;
  background-color: #C99CB5;
  width: 17%;
  padding-left: 2%;
  padding-right: 2%;
  padding-top: 7pt;
  text-align: center;}

#masteatro {
  width: 100%;
  float: left;
  font-size: 39px;
color:#A75086}

#masteatro p {
  color: #A75086;}

#masteatro p:hover { color: white}







/*aca termina el css de teatro y empieza el de galeriaaaaaaaaa */

.cuadradogaleria {
  float: left;
  width: 1017px;
  padding-left: 21px;
  padding-top: 3px;
  padding-top: 3px;
  font-size: 17px;
  margin-top: 2%;
  border: 0;}

.galeriateatro1 {
  width: 100%;
  float: left;
  margin-top: 3%;}

.recuadrofotosg {
  float: left;
  width: 1038px;
  background-color: #DFDAD4;
  padding-bottom: 2%;
  margin-bottom: 3%}

.botoneragaleria {
  float: left;
  width: 100%;}

.botoneragaleria nav {
  float: left;
  width: 100%;}

.botoneragaleria ul {
  float: left;
  width: 100%;}

.botoneragaleria a {
  float: left;
  width: 346px}

.botoneragaleria2 {
  float: left;
  width: 100%;
  text-align: center;
  border: 0;
  padding-top: 5px;
  padding-bottom: 1%;}

.galeriaizq {
  float: left;
  width: 100%;}

.galeriafotitos {
  float: right;
  width: 33%;
  
  padding-top: 2px;}

.galeriaparteabajo {
  float: left;
  width: 745pt;
  /* padding-bottom: 2%; */
  padding-top: 3%;
  padding-left: 2%;
  padding-right: 2%}

.galeriaizq {
  float: left;
  width: 475pt;}

.galeriafotitos {
  float: right;
  /* padding-top: 2%; */
  width: 31%}

.galeriafotitoscaja {
  float: left;
  width: 86px;
  margin-left: 5%;
  margin-bottom: 2px;}

.galeriaselectoramarillo { color:#F3A218; 
background-color: #DFDAD4
}


.galeriaselectorverde { color:#69B037; 
background-color: #DFDAD4
}


.galeriaselectorvioleta { color:#A84E84; 
background-color: #DFDAD4
}


.linkverde:hover{ color:#69B037; 
background-color: #DFDAD4;}


.linkvioleta:hover{ color:#A84E84; 
background-color: #DFDAD4 ;
    border-left: 2px solid  #A84E84
}

.linkamarillo:hover{ color:#F3A218; 
background-color:#DFDAD4;
border-left: 2px solid #F3A218 
}

.galeriafotitoscaja img {
  border: #DFDAD4 2px solid;}

.galeriafotitoscaja img:hover {
  border: solid #14BEF2 2px;}

.eventosgal:hover {
  width: 98%;}

.galeriaizq im {
  float: left;
  width: 653px;
  height: 486px;}

    



/*aca termina el css de galeriay empieza el de aguaaaaaaa */

.izqagua {
  float: left;
  width: 40%;
  margin-right: 3%}

.izqbotonesa {
  float: left;
  width: 100%;
margin-top: 5%}

.botonagua {
  float: left;
  width: 98%;
  padding-left: 2%;
  margin-bottom: 4%;
  padding-top: 6px;
  padding-bottom: 5px;}


.evitaragua {
  float: left;
  width: 90%;
  padding-left: 5%;
  padding-right: 5%;
  border: solid 2px green;
  padding-top: 4%;
  margin-top: 5%;}

.evitartitulo {
  float: left;
  width: 100%;
  margin-bottom: 4%;
  font-size: 14px;
margin-top: 2%}

.textoagua {
  float: left;
  width: 100%;
  margin-top: 4%;
  margin-bottom: 3%}


.derechaagua {
  float: right;
  width: 56%;
  margin-top: 2%;
  padding-right: 5px;}

.cuadradotituloa {
  float: left;
  width: 98%;
  background-color: white;
  padding-left: 2%;
  padding-top: 3px;
  margin-bottom: 4%;}

.textoagua2 {
  float: left;
  width: 100%;}

.textoagua2p {
  float: left;
  width: 100%;
  margin-bottom: 3%}

.pesadosolo { font-weight: 700}


.textoagua p {
  margin-bottom: 5%;}

.fotoagua2 {
  width: 100%;
  float: left;
  margin-top: 1%}

.fondoagua {
  float: left;
  width: 95%;
  padding-left: 2%;
  padding-right: 2%;
  padding-top: 1%;
  margin-top: 2%}


.fondoagua p {
  margin-bottom: 1%;}

.aguacont{ padding-bottom: 2%}


/*aca termina el css de aguaaaaaa empieza el de reciclado */

.recicladoizq {
  float: left;
  width: 59%;
  padding-left: 0%;
  padding-right: 2%}

.queesrec {
  float: left;
  width: 100%;}



.procesorec {
  float: left;
  width: 100%;}

.cuadradoquees {
  padding-left: 2%;
  padding-top: 1%;
  padding-bottom: 4px;
  margin-bottom: 2%}

.cuadradoqueest {
  float: left;
  width: 100%;
  margin-top: 1%;
  margin-bottom: 5%}

.botonrec {
  padding-left: 2%;
  width: 96%;
  float: left;
  padding-right: 2%;
  margin-bottom: 2%;
  padding-top: 1%;}

.iconorec {
  float: left;
  width: 100%;}


.numerorec {
  float: left;
  width: 14pt;
  background-color:#F3A218;
  font-size: 8pt;
  text-align: center;
  border-radius: 100%;
  margin-top: 3%;}

.iconorec {
  float: left;
  width: 15%}
    

    .iconorec2 {
  float: right;
  width: 65%;}

.palabrasrec {
  float: left;
  width: 96%;
  border: solid 2px #F3A218;
  padding-left: 2%;
  padding-right: 2%;
  padding-bottom: 2%;
  padding-top: 2%;
  margin-top: 2%;}


.textoetapasrec {
  float: right;
  width: 81%;
  font-size: 8pt}


.recicladoderecha {
  float: right;
  width: 34%;
  padding-left: 2%;
  padding-right: 2%;
  padding-bottom: 1%;
  border: #69B037 solid 3px;}

.cuadradotallerrec {
  float: left;
  width: 98%;
  background-color: white;
  margin-top: 4%;
  padding-top: 1%;
  padding-left: 2%;
  margin-bottom: 5%;}


.textorecnegro {
  color: black;
  margin-bottom: 3%;
  float: left;
  width: 100%}

.titulorec1 {
  float: left;
  width: 100%;
  margin-bottom: 1%;}

.textotallerrec p {
  margin-bottom: 3%;
  margin-bottom: 5%;
    color:black}

.dondecuandorec {
  float: left;
  width: 100%;
  margin-top: 3%;
  margin-bottom: 4%;}

.aguareciclado {
  padding-bottom: 2%;}

/*aca termina el css de recicladoooooooooo empieza el de musicaaaaaaaaa */



.arribamusica {
  float: left;
  width: 100%;
  margin-bottom: 3%;}

.titulomusica {
  border: 2px solid;
  padding-left: 2%;
  float: left;
  width: 98%;
  padding-top: 4px;
  margin-bottom: 13px;}

.textoarribamusica {
  float: left;
  width: 55%;
  margin-top: 3px;}

.musicaarriba2 {
  float: left;
  width: 100%}

.talleresmusicals {
  background-color: #CBBDD2;
  width: 23%;
  float: left;
  margin-left: 2%;}

.talleresmusicals {
  background-color: #CBBDD2;
  width: 24%;
  float: left;
  margin-left: 13px;}

.titulotalleresmusicales {
  /* padding-left: 2%; */
  padding-top: 2px;
  text-align: center;}

.textocajatalleres {
  float: left;
  width: 94%;
  padding-left: 3%;
  padding-right: 3%;
  margin-top: 2%;}


.cadaparrafomusica {
  float: left;
  width: 100%;
  margin-top: 3%}

.talleresmusicales1 {
  margin-left: 0;
  padding-bottom: 53px;}

.titulocuadraditoo {
  float: left;
  width: 96%;
  background-color: #DEDBD4;
  padding-left: 4%;
  padding-top: 2%;
  padding-bottom: 1%;}

.talleresmusicales2 {
  float: left;
  /* width: 95%; */
  padding-bottom: 1%}

.talleresmusicales3 {
  padding-bottom: 1%;}


.talleresmusicales4 {
  padding-bottom: 53px;}

.musicaarriba2 {
  float: left;
  width: 100%;
  margin-bottom: 29px;}

.abajomusica {
  float: left;
  padding-bottom: 3%;}

.abajoizqmusica {
  float: left;
  width: 60%;
  padding-left: 1%;
  padding-right: 1%;
  padding-top: 1%;
  padding-bottom: 2%}

.tituloabajomusica {
  float: left;
  width: 100%;
  margin-bottom: 1%;}

.parrafo1musica {
  float: left;
  width: 100%;
  margin-bottom: 2%}

.parrafo1musica {
  float: left;
  width: 100%;
  margin-bottom: 2%}


.abajoderechamusica {
  float: right;
  width: 35%;
}

.abajoderechamusica2 {float:left;
    width: :100%;
    border: solid 2px #0491C6;
padding: 2%;
  padding-top: 9px;
  text-align: center;}

.titulorecuadromusica {
  margin-bottom: 6px;
  float: left;
  width: 100%}

.masreciclado {
  float: left;
  width: 100%}

.imagenesrecuadro2 {
  float: left;
  width: 47%;
  margin-left: 5%;
  margin-bottom: 2%}

.cambiopaddingm{ margin-left:0}

.masmusica {
  float: left;
  width: 10%;
  /* text-align: center; */
  /* margin: auto; */
  margin-left: 44%;
  font-size: 42px}

.masmusica p:hover{ color:#F29612}

.inscripcionesmuscia {
  float: left;
  width: 95%;
  border: 2px solid;
  margin-top: 77px;
  padding: 4% 2% 4% 2%}

.imagen1musica {
  float: left;
  width: 100%}

.parrafoporquemusica {
  float: left;
  width: 100%;
  margin-bottom: 2%;}

.talleresmusicales1 {
  float: left;
  /* width: 100%; */
  padding-bottom: 10px }



/*aca termina el css de musicaaaaaaaaaa empieza el de participantessssss */
    

.partictitulo {
  font-size: 19px;
  width: 100%;
  float: left;
  margin-top: 1%;
  margin-bottom: 2%;}

.contenidopartic {
  width: 100%;
  float: left;}

.participantesizq {
  float: left;
  width: 38%;}

.quienessomosp {
  float: left;
  width: 92%;
  padding-left: 4%;
  padding-right: 4%;
  padding-top: 2%;
  padding-bottom: 2%;}

.quienessomost {
  font-size: 15px;
  float: left;
  width: 100%;
  margin-bottom: 1%;}

.textoquienessomos {
  float: left;
  width: 100%}

.textoquienessomos p {
  float: left;
  width: 100%;
  margin-top: 2%;}


.cadaunoparticip {
  float: right;
  width: 58%;
  margin-left: 2%;}

.partearribapart {
  float: left;
  width: 100%;
  border: 0;}

.triangulopart {
  float: left;
  width: 5%;
  margin-top: 33px;
  margin-left: -3px;}

.iconoytextopart {
  float: left;
  width: 95%}

.iconoytextpart1 {
  float: right;
  width: 15%;
  margin-left: 18%;
  }

.iconopart {
  width: 56%;
  float: left;}


.iconoytextpart1 {
  float: left;
  width: 16%;
  margin-left: 8%;
  }

.iconoytextparte2 {
  margin-left: 12%;
  padding-top: 11pt;
  padding-left: 10px;
  padding-right: 14px;
  text-align: center;
  padding-bottom: 1px}

.iconoparte2 {
  float: left;
  width: 105%;
  margin-bottom: 6%;
  padding-top: 6px;}

.iconoparte1 {
  float: left;
  width: 61%;}

.iconoytextparte3 {
  float: left;
  width: 13%;
  margin-left: 11%;
  padding-top: 14px;
  text-align: center;
  padding-left: 11px;
  padding-right: 11px;}



.iconoparte1 {
  float: left;
  width: 61%;
  margin-left: 16%;
  padding-top: 13%;}


.iconoytextparte1 {
  float: left;
  width: 13%;
  margin-left: 50px;
  padding-left: 2%;
  padding-top: 6px;
  padding-right: 2%;
}

.iconoytextparte1:hover{ background-color: #0491C6;
    }
.iconoytextparte1 p:hover{ 
    }

.iconoytextparte2:hover{ background-color: #0491C6;
   }

.iconoytextparte3:hover{ background-color: #0491C6;
    }

.iconoytextparte4:hover{ background-color: #0491C6;
    }

.fijopartic{ background-color:#0491C6;
    }

.textopart {
  float: left;
  width: 100%;
  color: white}
    
.iconoparte3 {
  float: left;
  width: 56%;
  margin-left: 20%;}
    

    .textocadaunop {
  float: left;
  width: 96%;
  /* padding-left: 2%; */
  padding: 2%;
  padding-top: 4%;
  background-color: #DEDBD4;
  padding-bottom: 3%;}

.cadaparrafopart {
  margin-bottom: 2%;}


.mailpartic {
  width: 94%;
  float: left;
  border: 2px solid #0491C6;
  margin-top: 5%;
  padding-top: 4%;
  padding-bottom: 4%;
  padding-left: 3%;
  padding-right: 3%;}

.mailpartic a{ color:grey}

.mailpartic a:hover{color:#0491C6}



/*aca termina el css de participantes empieza el de objetivosssssssssssssss */

.objetivocont {
  float: left;
  width: 100%;
  padding-top: 2%;}

.izqobjetivos {
  float: LEFT;
  width: 62%;}

.tituloobjetivos {
  float: left;
  width: 98%;
  border: 2px solid;
  padding-left: 2%;
  padding-top: 3px;
  margin-bottom: 2%;}

.textoobjetivos {
  float: left;
  width: 100%;}

.imagenobjetivo {
  float: left;
  width: 100%;
  margin-top: 2%;
  margin-bottom: 2%;}

.cadaparrafoobjetivo {
  float: left;
  width: 100%;
  margin-bottom: 3%;}

.tituloabajoo {
  float: left;
  width: 100%;
  margin-bottom: 1%;}

.objetivoderecha {
  float: right;
  width: 32%}
.cuadradoejeso{ float:left;
    width: 100%}

.cuadradoejeso p {
  float: left;
  width: 98%;
  border: 2px solid;
  padding-left: 2%;
  padding-top: 5px;}

.cadacuadraditoo {
  float: left;
  width: 100%;
  margin-top: 7%;
  margin-bottom: 2%;}

.cuerpocadacuadraditoo {
  float: left;
  width: 92%;
  border: 0;
  padding-top: 3%;
  padding-left: 4%;
  padding-right: 4%;
  padding-bottom: 6%;}

.textocuerpoco {
  float: left;
  width: 100%;}



.textocuadaditologos {
  float: left;
  width: 73%;
  padding-left: 13%;
  padding-right: 16%;}

.textocuadraditologo1 {
  float: left;
  width: 50%;
  margin-top: 14%;}


.textocuadraditologo2 {
  float: right;
  width: 50%;
  padding-top: 32px;}

.logodelcuadradito {
  float: left;
  width: 41%}

.textodelcuadradito {
  float: left;
  width: 100%;
  font-size: 11px;
  text-align: center;}

.logocc1 {
  float: left;
  /* width: 36%; */
  margin-left: 27%;}

.logocc2 {
  float: left;
  margin-left: 31%;}

.logocc3 {
  float: left;
  /* width: 51%; */
  margin-left: 28%;}

.logocc4 {
  float: left;
  margin-left: 26%;}

.logocc5 {
  float: left;
  margin-left: 28%;}

.logocc6 {
  float: left;
  margin-left: 24%;}


.cuerpoabajocuadradito {
  float: left;
  width: 92%;
  background-color: #DEDBD4;
  padding-left: 4%;
  padding-right: 4%;
  padding-top: 3%;
padding-bottom: 3%;}


/*aca termina el css de objetivo empieza el de contactoooooooooooo */

.contcontacto{ float: left;
    width: 100%;
    }

.recuadrotitulocont {
  float: left;
  width: 98%;
  padding-left: 2%;
  border: 0;
  padding-bottom: 6px;
  padding-top: 9px;
  margin-top: 2%;}

.textocontacto {
  float: left;
  width: 50%;
  margin-top: 2%;}

.textocontacto p {
  margin-bottom: 2%;}

form {
  float: left;
  width: 67%;
  border-left: solid 1px #E5364A;
  border-right: solid 1px #E5364A;
  border-top: 5px solid #E5364A;
  border-bottom: 5px solid #E5364A;
  padding-left: 2%;
  padding-right: 2%;
  padding-top: 3%;
  padding-bottom: 2%;
  margin-top: 15px;
  margin-bottom: 6%;}

.formularioarriba {
  float: left;
  width: 100%;}

.imagenform1 {
  float: left;
  width: 17px;
  margin-right: 14px;
  margin-top: 15px;}

.textareaa1 {
  float: right;
  width: 94%;
  background-color: #F1EBE5}

.formulariomedio {
  float: left;
  width: 100%;}

.formmedioizq {
  float: left;
  width: 49%;}


.formmedioder {
  float: right;
  width: 49%;}

.formuladio11 {
  float: left;
  width: 100%;
margin-top: 6%;}


.textarea2 {
  float: right;
  width: 88%;
  background-color: #F1EBE5;}

.imagenform2 {
  float: left;
  width: 18px;
margin-top: 5%;}


.formabajo {
  width: 100%;
  margin-top: 22px;
  float: left;
  margin-bottom: 4%;}


.botonenviarc {
  float: left;
  width: 100%;
  margin-left: 44%;}

.nada{ BACKGROUND-COLOR: #E5374A;
  padding-left: 4%;
  padding-right: 4%;
  padding-top: 3px;
  color: white;
border:2px solid #F1EBE5}

.nada:hover{  border:2px solid #CBBDD2}

.textareamens {
  float: left;
  width: 94%;
  margin-left: 3px;
  padding-bottom: 47px;}



/*aca termina el css de contacto y empieza el de festivaaaaaaaaaaaaaaaaaaaaaal */


.bannerf {
  float: left;
  width: 100%;
  margin-top: 2%;
  margin-bottom: 2%}

.textofestival {
  float: left;
  width: 100%}

.textoizqf {
  float: left;
  width: 59%;}

.titulofestivaaal {
  float: left;
  width: 100%;
  font-size: 22px;}


.textoizqf {
  float: left;
  width: 100%;}

.textoizqf {
  float: left;
  width: 59%;}


.textoizqf2 {
  float: left;
  width: 100%;
  margin-bottom: 2%;
  font-size: 15px;}


.cadaparrafofes {
  float: left;
  width: 100%;
  margin-bottom: 8px}


.inscripcionfest {
  float: left;
  width: 96%;
  margin-top: 3%;
  border: 2px solid #A75086;
  padding-left: 2%;
  padding-right: 2%;
  padding-top: 2%;
  padding-bottom: 2%}

.inscripcionesfestival1 {
  float: left;
  width: 97%;
  padding-left: 2%;
  padding-top: 2px;
  margin-bottom: 3%;}

.textoinscripcionesss {
  float: left;
  width: 100%;
  padding-bottom: 2%;}

.textoderechafest {
  float: right;
  width: 38%;}

.cajasumatef {
  float: left;
  width: 100%;
  background-color: #CBBDD2}

.titulocajasum {
  float: left;
  width: 100%;
  text-align: center;
  border: 0;
  padding-top: 4px;}

.textocajasumate {
  float: left;
  width: 94%;
  padding: 2%;
  padding-top: 3%;
  padding-left: 3%;
  padding-right: 3%;}

.cajagaleriaf {
  float: left;
  width: 100%;}


.recuadrpgaleriaf {
  FLOAT: LEFT;
  WIDTH: 97%;
  BORDER: 0;
  margin-top: 12%;
  padding-left: 3%;
  padding-top: 4px;}

.imagenfestival2 {
  float: left;
  width: 100%;
  margin-bottom: -3%;}

.abajogaleriaf {
  float: left;
  width: 100%;}

.abajogaleriaizq {
  float: left;
  width: 50%;}

.abajogaleriader {
  float: right;
  width: 197px;
  text-align: center;
  padding-top: 68px;
  font-size: 33px;
  padding-bottom: 58px;
  border: 0;
  color: white;}

.abajogaleriader:hover{ background-color:#C4BFB8}

.linkverde{ background-color: #69B037;
    color: white}




/*aca termina el css de festival y empieza el de responsiveeeeee */

 @media only screen and (max-width:400px){
 
#navegador1{ display: none;  }
     
#contenedor { 
  width:100%;
    margin:0}
 
     #arriba2 li {
  font-size: 11pt;
  display: block;
         width: 100%
     }
     
     #arriba2 li:hover{ background-color: #CBBDD2}
     
     #partearriba img{ display: none}
     
     #doscuadrados{ float:left;
         width: 100%}
    
     #noticias { display: none}
     
     article{ display: none}
     #agenda{ display: none}
     
     #partizq{ float:left;
     width:100%}
     
     #partederecha img{ display: none}
     
     #superior{ width: 48%;
         float:left}
     #inferior{ width: 47%;
         float:right}
     
     #cuadradovioleta{display: none}
     
     section{ width: 100%}
     
     #derechaderecha{ width: 133%;
     float: left;
     margin-top: 2%;
         margin-bottom: 2%
     }
     
     #cuadradoazul{ display: none}
     
     .footerimg{ display: none}
     
     .textoobligatoriof{display: none}
     
     #arriba2 li {
  font-size: 11pt;
  margin-left: 0%;}
     
     .teamt{ display: none}
}