/* Estilos Pagina ZACHIN */



body {
    background-image: url(images/fondo2-01.png);
	background-attachment: fixed;
    background-repeat: repeat;
	margin: 0 auto;
    font-size: 10pt;
    font-family: dosis, sans-serif;
    
}

a {
    text-decoration: none}

div#pagina{
    margin: auto;
    position: relative;
    width: 960px;
}


/* HEADER */

header {
    height: 3rem;
    width: 100%;
    background-color: rgb(206, 206, 206);
    font-size: 1.2em;
    position:fixed;
    z-index: 1;
    } 

header #barra #logo-header a{
	padding-top: 0.5rem;
	float:left;}

header #barra {
	width:60rem;
    margin: 0 auto;
    }

#barra nav {
    height: 3rem;
	float: right;
    margin-top: 0rem;
	margin-left: 0rem;
    margin-right: 1em;
    }

#barra nav ul li {  
    display: inline;
    list-style: none;
	} 
 
#barra ul li a { 
	text-decoration: none; 
	padding: .5em 1em;
    color: rgb(0, 0, 0)
	} 
#barra ul li a:hover{ 
    color: rgba(255, 255, 255, 0)
	} 
#barra ul li a#casa:hover{
    background-image: url(images/home%20simbolo.svg);
    background-repeat: no-repeat;
    background-position: center;
    }
#barra ul li a#catedra:hover{
    background-image: url(images/catedra%20simbolo.svg);
    background-repeat: no-repeat;
    background-position: center;
    }
#barra ul li a#alumnos:hover{
    background-image: url(images/Alumnos%20simbolo.svg);
    background-repeat: no-repeat;
    background-position: center;
    }
#barra ul li a#calendario:hover{
    background-image: url(images/calendario.svg);
    background-repeat: no-repeat;
    background-position: center;
    }
#barra ul li a#preguntas:hover{
    background-image: url(images/Faq%20simbolo.svg);
    background-repeat: no-repeat;
    background-position: center;
    }
#barra ul li a#contacto:hover{
    background-image: url(images/Contacto%20simbolo.svg);
    background-repeat: no-repeat;
    background-position: center;
    }


 
/* FOOTER */



#contenidofoot p{
    padding: 10px;
    width: 75%;
    margin: 0 auto;
    text-align: center;
    font-size: 0.8em;
    }

footer#index {
    width: 100%;
    background-color: rgb(206, 206, 206);
    position: relative fixed;
    bottom: :0;
    float: left;
    margin-top: 10px;
   
    }



/* CONTENIDO */



section#caja{
    width: 60rem;
    padding-top: 3.75rem;
    padding-bottom: 0.625rem;
    margin-left: 3.75rem;
    position: relative;
            }

#contenedor {
    width: 88%;
    background-color: rgb(247, 247, 247);
    border: 1px solid rgb(240, 240, 240);
    padding: 17px;
    padding-top: 1.5rem;
    padding-left: 2.5rem;
    padding-bottom: 4rem;
    box-sizing: border-box;
    top: 60px;
    float: left;
    margin: auto;
          }


    

#contenedorsolidario {
     width: 88%;
    background-color: rgb(255, 255, 255);
    border: 1px solid rgb(240, 240, 240);
    padding: 17px;
    padding-top: 1.5rem;
    padding-left: 2.5rem;
    padding-bottom: 4rem;
    box-sizing: border-box;
    top: 60px;
    float: left;
    margin: auto;

             }


/* CONTACTO */

#contenedorcontacto {
    width: 62%;
        background-color: rgb(247, 247, 247);
    border: 1px solid rgb(240, 240, 240);
    padding: 17px;
    padding-top: 1.5rem;
    padding-left: 2.5rem;
    padding-bottom: 4rem;
    box-sizing: border-box;
    top: 60px;
    float: left;
    margin: auto;
  
           }

#contenedorcontactofadu {
    width: 13rem;
    background-color: rgb(247, 247, 247);
    border: 1px solid rgb(240, 240, 240);
    padding: 17px;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    box-sizing: border-box;
    top: 60px;
    float: left;
    margin-left: 1rem;
          }

p#aulas{
 font-family: dosis; 
    font-size: 1rem;
    font-weight: 600;
    text-align: center;
    color: rgb(154, 154, 154);
    line-height: 1.2rem;
        }

i#edificio{
   position: relative;
    margin-left: 36%;
    color: rgba(229, 0, 126, 0.62);
      }

p#nivel1{
    font-family: dosis;
    font-weight: 600;
    text-align: center;
    background-color: rgb(247, 247, 247);
    color: rgb(255, 87, 184);
        }


form {
    font-weight: 500;
    font-size: 1.2rem;  
    color: rgb(198, 197, 197);
    }

h1{
    font-size: 2rem;
    font-weight: 600;
    color: rgba(229, 0, 126, 0.74); 
    background-color: rgb
    
     }



textarea{
    width: 80%;
    height: 150px;
         }

p#contacto{
      font-family:open sans, sans-serif;
       margin-top: -2%;
       margin-bottom: 2.5%;
    line-height: 1.3rem;
       width: 95%;
    }

input#enviar{
    float: right;
    margin-right: 19%;
    background-color: rgba(229, 0, 126, 0.74);
    font-family: dosis;
    font-weight: 500;
    font-size: 1rem;
    color: rgb(250, 250, 250);
    width: 11%;
    height: 10%;
        }

form {
line-height: 1.7rem;
}

input#nombrecontacto {
margin-left: 1rem;
}

input#apellidocontacto{
margin-left: 0.4rem;
}

input#mailcontacto{
margin-left: 1.6rem;
}

input#asuntocontacto{
margin-left: 1.2rem;
}






/* SANTI POZZI */

p#intro{
    font-family: open sans, sans-serif;
    font-style: italic;
    line-height: 132%;
    margin-right: 3%;
    font-size: 0.9rem;
    color: rgb(137, 136, 136);
    margin-top: 4%;
           }

div#rectangulomagenta{
    width: 88%;
    background-color: rgba(242, 131, 196, 0.16);
    height: 3.5rem;
    margin-left: -4.2%; 
    margin-top: 2%;
    position: absolute;
                }

div#rectangulomagenta1{
    width: 88%;
    background-color: rgba(242, 131, 196, 0.16);
    height: 3.5rem;
    margin-left: -4.2%; 
    margin-top: 2%;
    position: absolute;
                }

h2 {
    color: rgba(230, 0, 126, 0.56);
    font-size: 1.6em;
    font-weight: 500;
    }    
    
#textosantipozzi1{ 
    font-family: open sans,sans-serif;
    line-height: 135%;
    width: 48%;
    position: relative;
    margin-top: -0%;
    float: right;
    margin-right: 1.1rem;
                 }

#textosantipozzi2{ 
    font-family: open sans,sans-serif;
    line-height: 135%;
    width: 47%;
    margin-right: 4%;
    position: relative;
    margin-top: -2%;
                 }

section #imagenessanti{
    width:96%;
    height:17rem;
    background-color: rgb(239, 239, 239);
      
         }


section #imagenessanti img{
      padding:1rem;
      float: right;
    width: 20%;
   
    
         }

 p#poster{
    color: rgb(129, 129, 129);
    margin-left: 1%;
    margin-top: -2.8%; 
    font-weight: 400;
    float: none;
     text-align: center;
     width: 90%;
     }

p#vermas{
    font-weight: 800;
    font-size: 1.5rem;
    color: rgb(147, 147, 147);
    margin-left: 22rem;
    margin-top: 2rem;
         }



/* ALUMNOS */

div#alumnos img{
       position: relative;
       margin-bottom: -3%;
       margin-top: 1%;
       }

 div#alumnos h1{
     margin-bottom: 0.5%; 
             }



div#alumnos p{
      font-family: open sans, sans-serif;
      line-height: 150%;
      margin-top: 3%;
      margin-bottom: -2%;
            }

div#alumnos h3{
    margin-bottom: -3%;
    font-size: 1.1em;
    }

div#alumnos h2{
    margin-bottom: -2.5%;
    font-weight: 700;
             }

div#estructura{ 
  width: 45%;
    float: right;
    margin-right: 4%;
}

div#asistencia{
   width: 45%;
       }

div#condicionesentrega{  
     width: 45%;
    float: right;
     margin-right:4%;
           }

div#condicionesaprobar{
    width: 45%;
           }



p#recomendaciones{
      width: 77%;
    float: right;
   
    
            }


i#texto{
    margin-left:0%;
    position: absolute;
    margin-top: 3rem;
    color: rgb(255, 99, 204);
             }

i#lapiz {
    margin-left:5rem;
    margin-top: 3rem;
    color: rgb(255, 99, 204);
    float:left;
                }


/* PARA MI ZACHIN */



h3#cita{
    font-style: italic;
    font-family: open sans, sans-serif;
    font-weight: 600;
     text-align: center;
    background-color: rgb(250,250,250);
    border: 0.1rem dotted rgb(255, 66, 226);
    padding:1.2rem;
    position: relative;
             }



ul#zacho li{
list-style: none;
margin-left: -2.2rem;    
   }

p#zachin1{
 font-family: open sans,sans-serif;
    line-height: 135%;
    width: 32%;
    float: right;
    hyphens: auto;
    margin-top: -0rem;
    
        }

p#zachin2{
  font-family: open sans,sans-serif;
    line-height: 135%;
    width: 32%;
    float: right;
    hyphens: auto;
    margin-right: 1rem;
    margin-top: -0rem;
          }


p#zachin3{
    font-family: open sans,sans-serif;
    line-height: 135%;
    width: 32%;  
    hyphens: auto;
        }


article#noches img{
        }

article#noches h2{
  
    line-height: 1.5rem;
}

article#noches{
   background-color: rgb(255, 255, 255);
    padding: 1.5rem;
    width: 40%;
    float:right;
    border: 0.1rem dotted rgb(255, 73, 205);
}

article#noches1{
    background-color: rgb(255, 255, 255);
    padding: 1rem;
    width: 46.5%;
    border: 0.1rem dotted rgb(255, 73, 205);
    float: right bottom;
    
     }

article#noches3{
    background-color: rgb(255, 255, 255);
    padding: 1rem;
    width: 46.5%;
    border: 0.1rem dotted rgb(255, 73, 205);
    margin-top: 1.5rem;
   
         }

h4 {
    color: rgba(230, 0, 126, 0.56);
    font-size: 1.3em;
    font-weight: 500;
    }

/* JORNADA SOLIDARIA */

p#solidario{
    float: right;
    width: 18.5rem;
    font-family: open sans,sans-serif;
    margin-right:1rem;
    position: relative;
    margin-top: -1%;
    margin-right: 3rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: rgb(160, 159, 159);
             }

#contenedorsolidario iframe{
            margin-bottom: 1rem;
}

h1#solidario{
    color: rgb(55, 193, 255);
    text-align: center;
}


div#calendario1{
     width: 31%;
     border: 1px dotted rgb(77, 180, 255);
    background-color: rgb(242, 242, 242);
    height:auto;
    padding: 1rem;
    float: right;
            }

div#calendario1 p{
       width:100%;
    text-align: center;
    font-family: open sans,sans-serif;
    margin-top: -0.6rem;
    }


div#calendario1 img{
          width: 100%;

}
h5{
    color: rgb(62, 173, 255);
    font-family:dosis, sans-serif;
    font-weight: 500;
    font-size: 1rem;
    margin: 0.5rem;
             }


div#calendario2{
     width: 58%;
     border: 1px dotted rgb(77, 180, 255);
    background-color: rgb(242, 242, 242);
    height:auto;
    padding: 1rem;
    
                }


div#calendario2 p{
       width:100%;
    font-size: 0.8rem;
    font-family: open sans,sans-serif;
    margin-top: -0.6rem;
    
    }

div#calendario2 img{
          width: 45%;
    float: right;
    padding: 1rem;
    background-color: rgba(73, 185, 255, 0.21);
    padding:0.5rem;
    margin-left: 1rem;
    
}


div#calendario3{
     width: 58%;
     border: 1px dotted rgb(77, 180, 255);
    background-color: rgb(242, 242, 242);
    height:auto;
    padding: 1rem; 
    
    float: right bottom;
    margin-top: 1rem;
            }


div#rectangulocyan{
    width: 88%;
    background-color: rgba(142, 207, 255, 0.16);
    height: 5.8rem;
    margin-left: -4.2%; 
    margin-top: 2%;
    position: absolute;
    
                }

div#haciendocamino{
    width: 58%;
     border: 1px dotted rgb(77, 180, 255);
    background-color: rgb(242, 242, 242);
    height:auto;
    padding: 1rem; 
    float: right bottom;
    margin-top: 1rem;
     }

#haciendocamino p{
       
    font-family: open sans, sans-serif;
    width: 80%;
    margin-left: 20%;
     margin-top: -0.3rem;
   }

#haciendocamino h5{
    float:left;
   

}

#haciendocamino h5 i{
    float:left bottom;
    text-align:center;
   

}




/* REDES */
    
section#redes {
    width: 3%;
    margin-right: 2% ;
    float: right;
    position: absolute fixed;
    }
section#redes ul {
    list-style: none;
    padding: 0;
    margin: 0;
    }
section#redes ul li img {
    width: 100%;
    margin-bottom: 6px;
    }












/* MEDIA */




@media all and (max-width:320px) {
    
    
    header #barra #logo-header a{
	float:none;}

    #barra nav {
	float: none;
    margin-top: -2rem;
    }
    
   #barra nav ul li {  
    display:flex;
    list-style: none;
         	} 
                 
    header {
        position: relative;
    height: 17rem;
           } 
    
    /* CONTENIDO */



section#caja{
    width: 31%;
    padding-top: 1rem;
    padding-bottom: 0.625rem;
    margin-left:0rem;
                }

#contenedor {
    width: 100%;
    background-color: rgb(247, 247, 247);
    border: 1px solid rgb(240, 240, 240);
    padding: 17px;
    padding-top: 1rem;
    padding-left:1rem; ;
    padding-bottom: 1rem;
    box-sizing: border-box;
    float:none;
             }
    
    h1{
    font-size: 1.5rem;
    }
    
    div#rectangulomagenta{ 
    width: 100%;
    height: 5rem;  
      
    }
    
    
    p#zachin1{
    width: 100%;
    hyphens: auto;
    float: none;
        }
    
    p#zachin2{
    width: 100%;
    margin-top: 0rem;
    float: none;  
    }
    
    p#zachin3{
    width: 100%;
    float: none;
    }
    
    article#noches{
    position: relative;
    padding: 1rem;
    width: 90%;
    margin-bottom: 1rem;
    float: none;
    }
    
    
    article#noches1{
    width: 90%;
    float:none;
    margin-top:  0rem;
    padding-bottom: 1rem; 
         }

article#noches3{
    padding: 1rem;
    width: 90%;
    margin-top: 1rem;
    
         }

h4 {
    color: rgba(230, 0, 126, 0.56);
    font-size: 1.3em;
    font-weight: 500;
    }
    

  section#redes {
    width: 7%;
    margin-right: 7% ;
   float: none; 
  }
    
    
    
    /* CONTACTOOO */
    
    #contenedorcontacto {
    width: 100%;
    padding: 1rem;
    padding-top: 1rem;
    padding-left: 1.5rem;
    padding-bottom: 4rem;
    float: none;
    margin-bottom: 1rem;
    
           }

#contenedorcontactofadu {
    width: 100%;
    float: none;
    margin-left: 0rem;
    padding-bottom: 8%;
          }
    
    input#enviar{
    float: right;
    margin-right: 19%;
    width: 30%;
            }
    
    p#aulas{
     text-align: center;
   
        }

i#edificio{
   position: none;
    margin-left: 14%;
    float: left; 
    margin-top: -3%;
      }
    
    
p#nivel1{
   float: right;
    padding: 1.5rem;
    padding-top: -0rem;
    padding-bottom: 0.5rem;
}
    
    
    /* SANTIPOZZIIIIII */
    
    #textosantipozzi1{ 
       
    width: 100%;
    position: relative;
    margin-top: -5%;
    float: none;
    margin-right: 1.1rem;
          }

#textosantipozzi2{ 
    width: 100%;
    margin-right: 4%;
    position: none
            }

section #imagenessanti{
    width:100%;
    height:23rem;
    background-color: rgb(239, 239, 239);
    padding-bottom: 2.5rem;
      
         }


section #imagenessanti img{
      padding:0.1rem;
    padding-left: 1rem;
    padding-top: 1rem;
      float: none;
       width: 40%;

}
    
     p#poster{
    margin-left: 5%;
    margin-top: -22%; 
    
     }

    
    p#vermas{
    font-size: 1rem;
    margin-left: 0rem;
    margin-top: 2rem;
         }
    
    div#rectangulomagenta1{
    width: 100%;
    height: 7.1rem;
    margin-left: -6%; 
               }
    
    
    
    
    /* ALUMNOS */
    
    
    div#estructura{ 
  width: 100%;
    float: none;
    margin-right: 4%;
          }

div#asistencia{
   width: 100%;
       }

div#condicionesentrega{  
     width: 100%;
    float: none;
     margin-right:4%;
           }

div#condicionesaprobar{
    width: 100%;
           }
    
p#recomendaciones{
      width: 100%;
    float: none;
         }
    
    div#alumnos img{
       width: 100%;
       margin-bottom: -3%;
       margin-top: 7%;
       }
    
    i#lapiz{
    margin-right: 7%;
    }
    
    
    


/* JORNADAS SOLDARIAS */
    
    #contenedorsolidario {
    width: 100%;
    padding: 1rem;
    padding-top: 1rem;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-bottom: 4rem;
    float: none;
                 }
    
    p#solidario{
    float: none;
    width: 100%;
    font-weight: 600;
    margin-bottom: 0.5rem;
             }

#contenedorsolidario iframe{
            margin-bottom: 1rem;
            width: 100%;
                }
    
    
div#rectangulocyan{
    width: 100%;
    height: 9rem;
    margin-left: -8%; 
                }


div#calendario1{
     width: 100%;
    float: none;
    margin-bottom: 1rem;
    
            }

div#calendario1 p{
       width:100%;
    text-align: center;
    font-family: open sans,sans-serif;
    margin-top: -0.6rem;
    }


div#calendario2{
     width: 100%;
    float: none;
          }
    
    
    
    div#calendario2 h5{
    float: none;
        margin-top: 1rem;
              }


div#calendario2 p{
       width:100%;
    font-size: 0.8rem;
    font-family: open sans,sans-serif;
    margin-top: -0.6rem;
               }
    

div#calendario2 img{
          width:95%;
    margin-bottom: 1rem;
               }


div#calendario3{
     width:100%;
    float: none;
              }



div#haciendocamino{
    width: 100%;
    margin-right: 5%;
    float: none;
    padding-bottom: 0.5rem;
        }

#haciendocamino p{
       
    font-family: open sans, sans-serif;
    width: 80%;
    margin-left: 20%;
     margin-top: -0.3rem;
   }

#haciendocamino h5{
    float:left;
    margin-bottom: 5rem;
   

}

#haciendocamino h5 i{
    float:left bottom;
    text-align:center;
   

}

                                         }




@media all and (min-width:320px) and (max-width: 640px) {
    
    header #barra #logo-header a{
	float:none;}

    #barra nav {
	float: none;
    margin-top: -2rem;
    }
    
         
    header {
     position: relative;
     height: 5rem; 
             }
    
     /* CONTENIDO */



section#caja{
    width: 62%;
    padding-top: 1rem;
    padding-bottom: 0.625rem;
    margin-left:1rem;
    margin-right: 1rem;
                }

#contenedor {
    width: 100%;
    background-color: rgb(247, 247, 247);
    border: 1px solid rgb(240, 240, 240);
    padding: 15px;
    padding-top: 1rem;
    padding-left:1rem; ;
    padding-bottom: 1rem;
    float:none;
             }
    
    h1{
    font-size: 2rem;
    }
    
    div#rectangulomagenta{ 
    width: 100%;
    background-color: rgba(242, 131, 196, 0.16);
    height: 4rem;
    margin-left: -3%; 
    position: absolute;
   
      
    }
    
    
    p#zachin1{
    width: 100%;
    hyphens: auto;
        }
    
    p#zachin2{
    width: 100%;
    margin-top: 0rem;
    
    float:none;
    margin right: 0;
    
    }
    
    p#zachin3{
    width: 100%;
    margin-left: 0rem;
    margin-top: 0rem;    
    }
    
    article#noches{
    position: relative;
    padding: 1rem;
    width: 94%;
    margin-bottom: 1rem;
    float:none;
  
    }
    
    
    article#noches1{
    width: 38%;
        float:right;
    
    margin-top:  0rem;
    padding-bottom: 1rem; 
         }

article#noches3{
    background-color: rgb(255, 255, 255);
    padding: 1rem;
    width: 47%;
    border: 0.1rem dotted rgb(255, 73, 205);
    margin-top: 1.5rem;
    float:none;
    margin-top:  0rem;
          }

h4 {
    color: rgba(230, 0, 126, 0.56);
    font-size: 1.3em;
    font-weight: 500;
    }
    

  section#redes {
    width: 5%;
    margin-right: 1% ;
    float: right; 
    margin-top: 2.5%;  
  }
    
    
    
    
    
    /* CONTACTOOO */
    
    #contenedorcontactofadu {
    padding-bottom: 3%;
          }
    
    input#enviar{
    float: right;
    margin-right: 19%;
    width: 30%;
            }
    
    
    
    
    /* SANTI POZZI */
    
    section #imagenessanti img{
      padding:0rem;
    padding-left: 1rem;
    padding-top: 1rem;
      float: none;
       width: 21%;
        }
    
    
     p#poster{
    margin-left: 3%;
    margin-top: -6%; 
     }

    
    p#vermas{
    font-size: 1.5rem;
    margin-left: 11.5rem;
    margin-top: 2rem;
         }
    
    div#rectangulomagenta1{
    width: 100%;
    height: 7.1rem;
    margin-left: -3%; 
               }
    
    section #imagenessanti{
    width:99%;
    height:14.5rem;
    background-color: rgb(239, 239, 239);
      
         }
    
    
    
        /* ALUMNOS */
    
    
    div#estructura{ 
    width: 45%;
    float: right;
    margin-right: 4%;
          }

div#asistencia{
   width: 45%;
    
       }

div#condicionesentrega{  
     width: 45%;
     margin-right:0%;
    float:left;
    margin-top: 2%;
    margin-bottom: 5%;
           }

div#condicionesaprobar{
    width: 45%;
    float: right;
    margin-right: 4%;
     margin-top: 2%;
    margin-bottom: 5%;
    
           }
    
p#recomendaciones{
      width:100%;
    float: none;
         }
    
    div#alumnos img{
       width: 80%;
       margin-bottom: -3%;
       margin-top: 7%;
       }
    
    i#texto{
    margin-left:0%;
    float:left;
    position: absolute;
    margin-top: 3rem;
    color: rgb(255, 99, 204);
             }

i#lapiz {
    margin-left:5rem;
    margin-top: 3rem;
    margin-right: 1rem;
    margin-bottom: 3rem;
    color: rgb(255, 99, 204);
    float: left;
                }
    
    
    
    
    
    /* JORNADAS SOLDARIAS */
    
    #contenedorsolidario {
    width: 100%;
    padding: 1rem;
    padding-top: 1rem;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-bottom: 4rem;
    float: none;
                 }
    
    p#solidario{
    float: none;
    width: 100%;
    font-weight: 600;
    margin-bottom: 0.5rem;
             }

#contenedorsolidario iframe{
            margin-bottom: 1rem;
            width: 100%;
                }
    
    
div#rectangulocyan{
    width: 100%;
    height: 9rem;
    margin-left: -3%; 
                }

    div#calendario1{
     width: 28%;
     border: 1px dotted rgb(77, 180, 255);
    background-color: rgb(242, 242, 242);
    height:auto;
    padding: 1rem;
    float: right;
            }

}