@media screen and (max-width: 1330px){
	section#destacados{width: 100%; margin: 0px auto;}
	section#destacados .item{margin: 20px 0px;}
	section#news{width: 100%;}
	#introPage{width: 90%; margin: 0px auto;}
	section#certificados{width: 90%;}

	#content{width: 100%;}

	#proyectos{
		width: 100%;
	}
}

@media screen and (max-width: 1200px){
	#servicios .slick-prev{
		left: 10px;
		z-index: 1!important;
	}
	
	#servicios .slick-next{
		right: 25px;
		z-index: 1!important;
	}
	#servicios .slick-prev:before, #servicios .slick-next:before{
		color: #fff;
	}
}

@media screen and (max-width: 1160px){
	#accesos{
		margin: 20px auto 50px;
	}
}



@media screen and (max-width: 1050px){
	.infoSlide{
		top: 80px;
	}

	section#destacados .titulo{display: block;}
	#introPage{background: none!important;}
	#introPage .descripcion p{width: 100%;}

		#infoTop{text-align: center;}

	#buscador {text-align: center;}

	#contenido{width: 100%;}
	section#right{width: 100%; text-align:  center;}
	section#right .item{width: 48%; display: inline-block; vertical-align: top;}
	#infoTop{padding: 0px 0px 0px 30px;}
	#redes{width: 100%;}
	
	section#mapa{width: 100%; margin: 0px auto; display: block; padding: 0px 0px 0px 0px;}
	section#mapa iframe{width: 100%;}
	#categoryDesc .imagecat{display: block; width: 100%;}
	#categoryDesc .descripcion{display: block; width: 100%;}
	section#destacados{ width: 100%;}
	#introText{width: 100%;}
	#introText .item{width: 90%; margin: 0px auto;}
}

@media screen and (max-width: 1000px){
	.contentHeader{width: 100%;}
	#contfooter{width: 100%;}

	#banner .original-banner{
		display: none;
	}

	#banner .responsive-banner{
		display: block;		
		height: 450px;
		object-fit: cover;
		object-position: top;
		width: 100%;
	}
}

@media screen and (max-width: 992px){

	#container-header{
		flex-direction: column;
		gap: 5px;
	}

	#contmenu{
		width:100%;
	}

	.nav{
		text-align: center;
	}
	
	.formularibanner{
		background-size: auto;
		padding: 50px 0px;
	}

	.formularibanner .descripcion p{
		font-size: 18px;
		line-height: 30px;
	}
	.formularibanner strong{
		font-size: 24px;
	}
	
	
	.contentHeader .container{
		width: 100%;
	}

	#proyectos .image{
		height: 200px;
	}
}
@media screen and (max-width: 950px){

	.content{
		display: block;
	}

	.personal-data{
		width: 100%;
		margin: 20px auto;
	}

	#table_title{
		width: 100%;
	}

	#servicios{
		width: 95%;
		text-align: left;
		margin: 0px auto;
	}

	#servicios h1{
		text-align: center;
	}

	#servicios .item{
		width: 48%;
	}
}

@media screen and (max-width: 900px){
	.infoSlide{
		top: 50px;
	}
	#banner .item{
		display: table-cell;
		height: 450px;
		vertical-align: middle;
	}
}

@media screen and (max-width: 770px){
	nav{
		width: 96%;
	}
	.navbar-default .navbar-toggle{
		right: -20px;
	}
	.navbar-toggle{
		margin-right: 0px;
	}

	.navbar-header{
		position: absolute;
	    top: -15px;
	    right: 40px;
	}

	.nav>li>a:hover{
		background-color: #f2f1f1;
		border-radius: 4px;
		color: #858585;
	}
	
	.col-xs-4.contbus {
    	width: 100%;
	}
	.col-xs-6.infotop {
    	display: none;
	}

	.navbar-nav li ul {display: block;box-shadow: none;border: none;margin-left: 20px;float: none;position: initial; width: 100%;}
	
	.navbar-nav>li>a{font-size: 14px;}
	

	.navbar-default .navbar-toggle .icon-bar{background-color: #fff;}
	.navbar {min-height: 32px!important; position: fixed;top: 0px; width: 100%; z-index: 999999999; background: none;}
	
	.slideDesc, .slideDesc a{font-size: 16px;}
	
	section#destacados .item{width: 90%;}

	section#destacados .image{height: 390px}

	#news .item{margin: 30px 0px;}
	section#news .title a{min-height: 32px;}

	div#subsubcategories .itemBloock{width: 33%!important;}
	

	#introText{ padding: 90px 0px 110px 0px;}
	body.home .contRedes{text-align: center;}
	footer p{text-align: center;}

	.infotop{width: 100%;}
	
	#gracias{width: 100%;}

	section#video{width: 100%;}

	#contParalax{
		height: 650px;
	}

	.busc{
		width: 100%;
	}

	#proyectos .image{
		height: 160px;
	}

}

@media screen and (max-width: 765px){
	nav ul{
		float: none !important;
		width: 100%;
		border: none;
		padding: 10px 0px;
	}
	nav ul li{
		display: block !important;
		padding: 0px;
	}
	nav ul li ul{
		display: block; 
		position: initial; 
		box-shadow: none;
		margin: 0px 0px 0px 20px!important;
		background: #fff;
	}
	nav ul li{border: none;}
	nav ul li a{
		text-align: left;
		border: none;
	}
	nav ul li:last-child a{border: none;}
	
	.navbar-collapse{
		z-index: 999999999999999;
		position: absolute;
		background: #fff;
		width: 85%;
		border-radius: 10px;
		box-shadow: 1px 1px 10px rgba(0,0,0,0.3);
		top: -20px;
	}
	.navbar-default .navbar-collapse, .navbar-default .navbar-form{
		border-color: transparent;
	}
	#pse{
		display: none;
	}

	.navbar-default{
		position: absolute;
	}
	#container-header{
		align-items: baseline;
	}

	#footer{
		flex-direction: column;
		gap: 0px;
	}
	#logofooter{
		display: none;
	}
	#cont-redes{
		width: 90%;
		margin: 10px auto;
	}
	
	#contIntroPage,#contactohome {
		width: 90%;
		border-bottom: 1px solid #fff;
		margin: 10px auto;
	}
	#redes li{
		width: 25%;
	}
}

@media screen and (max-width: 650px){
	#accesos{
		background: transparent;
		box-shadow: none;
		margin: 30px 0px;
	}

	#accesos ul{
		height: auto;
		gap: 20px;
	}

	#accesos ul li{
		border-radius: 10px;
		width: 90%;
		box-shadow: 4px 4px 20px rgb(0 0 0 / 15%);
		background: #fff;
	}

	#accesos ul li a::after{
		display: none;
	}

	#how{
		flex-direction: column;
		align-items: center;
		padding: 20px 0px;
		width: 90%;
	}

	#how .imghow{
		width: 50%;
	}

	#how .infohow{
		width: 90%;
	}

	#pse-section{
		flex-direction: column-reverse;
		width: 90%;
		padding: 20px 0px;
		margin: 0px auto 30px;
	}

	#infopse{
		padding: 0px;
		width: 90%;
	}

	#imgpse {
		width: 65%;
	}

	#container-header{
		gap: 0px;
	}
	
	#introText{
		padding: 40px 0px 110px 0px;
	}

	.infoSlide{
		top: 100px;
		width: 350px;
		margin: 0px 0px 0px 120px;
	}

	#banner .slick-prev{
		left: 5px!important;
	}

	#banner .slick-next {
		right: 20px!important;
	}

	#contenidoPago .video{
		width: 100%;
	}

	#contenidoPago .desc{	
		width: 100%!important;	
	}

	
	#proyectos .image{
		height: 150px;
	}

	#contacto-footer ul{
		flex-wrap: wrap;
	}

	#contacto-footer ul li{
		width: 90%;
	}

	#asociados{
		width: 100px;
	}

}
@media screen and (max-width: 583px){
	.formularibanner {
    	width: 100%;
	}

	#galerias ul li{ 
		width: 45%!important;
	}
	section#images-main{
		width: 100%;
		float: none;
		padding: 0px;
		margin: 10px 0px;
	}
}
@media screen and (max-width: 550px){

	.infoSlide{
		top: 180px;
		margin: 0px 0px 0px 50px;
		width: 300px;
	}
	.infoSlide h3{
		font-size: 16px;
	}
	.infoSlide h1{
		font-size: 20px;
	}
	.infoSlide a{
		text-align: center;
		display: block;
	}	

	section#right .item{width: 90%;}
	#allCategories .itemBloock{width: 90%;}
	div#subsubcategories .itemBloock{width: 90%!important;}
	
	
	section#news h2{margin: 20px 0px 20px 20px!important;}
	body.internal .contRedes,
	.servicioshome .item{
		padding: 0px 0px 20px 0px;
	}

	.infotop .ubicacion{display: none;}

	.formularibanner .titulo p{ font-size: 22px; }

	.clean{ bottom: 10px; width: 120px; }

	#btn-shop-group{text-align: center;}

	.infotop .telefono{margin: 0px auto; display: block;}

	

	#itemProd .details{margin: 20px auto; text-align: center;}
	#itemProd .image {
		width: 90%;
	}
	
}

@media screen and (max-width: 494px){
	
	.formularibanner{
		width: 100%;
		
		padding-left: 0px;
    	padding-right: 0px; 
	}
	.formularibanner .container{
		padding-left: 0px;
    	padding-right: 0px; 	
	}

	#logInCont{
		width: 100%;
	}

	#PerfilCont{
		width: 100%;
	}

	.bgFooter{
		background: url("../images/parallax.jpg") -200px -400px no-repeat;
	}

	#contenido .titlePage h1{
		font-size: 22px;
	}

	.contDesc h3{
		font-size: 20px;
	}

	#proyectos .image{
		height: 120px;
	}


	#proyectos .image img{
		width: 240px;
		margin: 0px 0px 0px -30px;
	}

	#formProyecto{
		width: 95%;
	}

	#formProyecto h3{
		font-size: 18px;
		text-align: center;
	}
}
@media screen and (max-width: 370px){
	.infoSlide{top: -50px;  padding: 0px;}

}

@media screen and (max-width: 480px){
	#redes{width: 100%;}
	.contDesc img{
		width: 90%!important; 
		margin: 0px auto 20px; 
		display: block;
		height: auto!important;
    	float: none!important;
	}
	

	#allCategories .itemBloock{
		min-height: 100px;
	}
	#clasesDestacado{
		margin: 30px auto;
	}
}


@media screen and (max-width: 400px){
	section#destacados .image{height: 250px}
}