/* para 980px o menos */
@media screen and (max-width: 980px) {
	
    .banner {
		width: 82%;
		padding-top: 80px;
	}
    .bannerimagen {
		width: 82%;
	}
    .programa {
		width: 82%;
	}
    .fotito {
		width: 30%;
	}
	#content {
		width: 94%;
	}
	#menucaja {
		width: 94%;
	}
	.fotoinicio {
		width: 94%;
	}
	.fotoinicio li {
		width: 30%;
        margin-right: 22px; 
        margin-left: -18px; 
	}

    .galeria {
		width: 94%;
	}
	.galeria li {
		width: 30%;
        margin-right: 22px; 
        margin-left: -18px; 
	}

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

    .texto {
     	margin-right: 180px;
	    margin-top: 40px;
	    margin-left: 20px;
    }
    #cajafoot {
		width: 94%;
	}
    .fotoindex {
		width: 94%;
	}

}

/* para 768px o menos */
@media screen and (max-width: 700px) {

	#logo {
	height: 120px;
	}
	.banner {
		width: 82%;
		float: none;
	}
	.bannerimagen {
		width: 82%;
		float: none;
	}
    .fotito {
		width: 35%;
	}
    .programa {
        height: 120px;
        margin-bottom: 0px;
    }
	#content {
		width: auto;
		float: none;
	               margin-top: 0px;
	}
	#menucaja {
                                    display: none; 
	}
	#menucontenedor {
                                    display: none; 
	}
	.myclass {
                                    display: none; 
	}
	.menumovil {
                                    display: block; 
		width: 82%;
		float: none;
	}
                  .texto {
     	                 margin-right: 30px;
	                 margin-top: 40px;
	                 margin-left: 10px;
                    }
                  .galeria li { 
	                  font-size: 0.9em;
                    }
	h1 {
		font-size: 2em;
		margin-bottom: 10px;
	}
	h3 {
		font-size: 1.3em;
	    margin-bottom: 0px;
	}
	#cajafoot {
		width: auto;
		float: none;
	}
	.fotoindex {
		width: auto;
		float: none;
	}
            

}

/* para 480px o menos */
@media screen and (max-width: 480px) {

	#logo {
	height: 100px;
	}
	.banner {
                                    background-position: center;
		width: 90%;
	}
	.bannerimagen {
                                    background-position: center;
		width: 90%;
                                    display: none; 
	}
  
                    .programa {
                                   height: 100px;
                                   margin-bottom: 0px;
                    }
	#content {
		width: auto;
		float: none;
	               margin: auto;
	}
	.myclass {
                                    display: none; 
	}
	.menumovil {
                                    display: block; 
		width: 90%;
	}

	h1 {
		font-size: 1.4em;
		margin-bottom: 0px;
	}
	h2 {
		font-size: 1.6em;
	}
                
                  .texto {
     	                 margin-right: 10px;
	                 margin-top: 10px;
	                 margin-left: 10px;
                 }
}