
@font-face{
	font-family: "Montserrat";
	src: url(../fonts/Montserrat-Regula.ttf);
	font-display: swap;
}
@font-face{
	font-family: "Roboto";
	src:url(../fonts/Roboto-Regular.ttf);
	font-display: swap;
}

/*-------------estilos base----------------*/
*{
box-sizing: border-box;
font-family: 'Montserrat',sans-serif;
padding: 0;
	margin: 0;
	
}

body{
	margin: 0;
}
img{
	display: block;
	width: 100%;
	max-height: 100%;
}

h1,h2,h3,h4,h5,h6,a {
	
	font-family: 'Roboto',sans-serif;
	margin: 0;
}



.container{
	width: 100%;
	margin: auto;
	
}
.container--flex{
	
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	
	overflow: hidden;
}

.column{
	
	width: 100%;
}

.whirlpool{
	
	color: #ECAF12;
}



.border {
    border-bottom: 1px solid #cbd1d5;
}

.color-gris{

background-color: #f7f9fa;
}

.line{
	border:none;
	margin-top: -0px;
	width: 50px;
	height: 4px;
	background: #ECAF12;
	margin-left: auto;
	margin-right: auto;
}


/*-------------estilos header----------------*/
.header1{
background:#f7f9fa;
}

.main-header{
	
	width: 100%;
	
}

.logo{

width: 135px;
height: 70px;
margin: 5px;
margin-left: 2px;



 }
.logo-container{
	
display: flex;

	
	
}
.logo, .icon-menu{
	
	padding: 5px;
}

	.header2 .logo{
		  
		width: 120px;
		  height: 50px;
		
	}
	
	.header2 .menu{
	 	
	margin-top:-56px;
		z-index: 2000;
		
	}


/*--------- estilos del menu-----*/
.icon-menu{
	

position: absolute;
display: block;
width: 45px;
height: 45px;
font-size:40px;
cursor: pointer;
top: 20px	
}
.menu{
padding: 30px;
top: 60px;
left: 0;
width: 100%;
padding: 0;
margin: 0;
list-style: none;
background: #f7f9fa;
text-align: center;
height: 0;
overflow: hidden;
transition: height .3s linear;
	
}
.mostrar2{
	
height: 20px;
}

.menu__link{
display: block;
padding: 15px;
color: black;
text-decoration: none;
}

.menu__link:hover{
	
color: #f5a700;
}
	

.menu__link__select{
	
	
	color: #f5a700;
	
}

.menu__item{
	
	text-align: center;
}
.ul__submenu{
list-style: none;
background: #f7f9fa;
text-align: center;
height: 0;	
overflow: hidden;
transition: height .3s linear;
	
}

.mostrar3{
	height: 120px;

}

.mostrar2{
 height: 200px;	
	
}




	
	.li__submenu{
		text-align: center;
		padding: 10px;
		cursor: pointer;
		
		
		
	
	}


.mostrar4{
	
	height: 304px;
}
	
	.a__submenu:hover{
		color: #f5a700 
	}
	
	.a__submenu{
		
		text-decoration: none;
		color: black;
		
	}






/*--------- estilos del baner-----*/


.banner__content span{
	
position: absolute;
}

.bogota{
	
margin-left: -400px;
opacity: 0;
animation-name:bogota;
animation-duration: 18s;
animation-delay: 0s;
animation-iteration-count: infinite;
	
}
@keyframes bogota{
	0%{margin-left:-400px;
	opacity: 0;}
	5%{ opacity: 1;
		margin-left: -80px; }
	10%{ margin-left:-80px;
	}
	15%{ opacity: 0;}
	25%{opacity: 0;}
    100%{opacity: 0; 
		}
	
	
}

.ibague{
	
margin-left: -400px;
	opacity: 0;
animation-name:ibague;
animation-duration: 18s;
animation-delay: 0s;
animation-iteration-count: infinite;
animation-delay: 3s;
	
}
@keyframes ibague{
	
    0%{ opacity: 0;
		margin-left:-400px }
	
	5%{ opacity: 1;
		margin-left: -70px; }
	10%{ margin-left:-70px; }
	15%{ opacity: 0; 
		 }
	30%{opacity: 0;}
    100%{ opacity: 0;}
}

.nevera{
	
margin-left: -500px;	
animation-name:nevera;
	opacity: 0;
animation-duration: 18s;
animation-delay: 0s;
animation-iteration-count: infinite;
animation-delay: 6s;
	
}
@keyframes nevera{
	
	0%{margin-left:-500px;
	    opacity: 0;}
	5%{ opacity: 1;
		margin-left: -80px; }
	10%{ margin-left:-80px; }
	15%{ opacity: 0; }
	30%{opacity: 0;}
    100%{ opacity:0;}
	
}


.lavadora{
	
margin-left: -550px;
	opacity: 0;
animation-name:lavadora;
animation-duration: 18s;
animation-delay: 0s;
animation-iteration-count: infinite;
animation-delay: 9s;
	
}
@keyframes lavadora{
	
	0%{margin-left:  -550px;
	  opacity: 0;}
	5%{ opacity: 1;
		margin-left: -120px; }
	10%{ margin-left:-120px;}
	15%{ opacity: 0; }
	30%{opacity: 0;}
    100%{ opacity: 0;}
	
}


.secadora{
	
margin-left: -500px;
	opacity: 0;
animation-name:secadora;
	opacity: 0;
animation-duration: 18s;
animation-delay: 0s;
animation-iteration-count: infinite;
animation-delay: 12s;
	
}
@keyframes secadora{
	
	0%{margin-left:  -500px;
	opacity: 0;}
	5%{ opacity: 1;
		margin-left: -120px; }
	10%{ margin-left:-120px; }
	15%{ opacity: 0; }
    25%{opacity: 0;}
	100%{ opacity: 0;}
	
}

.nevecones{
	
margin-left: -600px;	
	opacity: 0;
animation-name:nevecones;
animation-duration: 18s;
animation-delay: 0s;
animation-iteration-count: infinite;
animation-delay: 15s;
	
}
@keyframes nevecones{
	
	0%{margin-left:  -600px;
	opacity: 0;}
	5%{ opacity: 1;
		margin-left: -120px; }
	10%{ margin-left:-120px; }
	15%{ opacity: 0; }
		25%{opacity: 0;}
    100%{ opacity: 0; }
	
}


.title__banner{
	color: #ECAF12;
	font-size: 40px
	
}
	
	

.pa__banner{
	
    font-size: 16px;
	margin-top:100px;
	
}
.banner__pri{
position: relative;
	
}


.banner__pri:before{
	
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.7);
}
.img__valores{
	width: 100%;
	height: 300px;
	object-fit: cover;
	
}
.banner__content{
	
width: 90%;
color: white;
text-align: center;
position: absolute;
z-index: 1500px;
top:30%;
left: 50%;
transform: translateX(-50%);
	
}







	
	


/*--------- estilos quienes somos -----*/


.boton{
	
text-decoration: none;
padding: 15px;
font-size: 16px;
background:#f5a700; 
color: white;
cursor: pointer;
margin: 5px auto;
	
	
	
}
.boton:hover{
	background:#f57a00; 
	color: white
	
}

.main__title{
	margin-top: 30px;
	text-align: center;
	font-size: 30px;
	margin-bottom: 30px;
}

.main__txt
{
	
	font-size: 17px;
	padding-left:20px;
	line-height:1.5; 
	
}
.mover1{
	top:929px;
	
}
.main__img{
	
	animation: opacidad 2s 1 ;
}
@keyframes opacidad{
	
	0%{margin-left: -300px;}
	
	
	
	
}





/*--------- estilos servicios -----*/
.column__line{
	margin-left: auto;
	margin-right: auto;
margin-top: -25px;
	margin-bottom: 14px;
width: 40px;
background: #ECAF12;
height: 3px;
border: none;
}


.column:hover hr{
	
	background:white;
}
.group__main__about__descrition{
padding: 20px;
margin-left: auto;
 margin-right: auto;

}

.container-s{
margin-left: auto;
margin-right: auto;	
	
text-align: center;
border: 2px solid #bab8b8;
  padding: 15px;
  margin-bottom: 30px;
animation-name:container;
animation-duration: 2s;
animation-delay: 0s;
animation-iteration-count: 1;
}

@keyframes container{
	
	0%{opacity: 0;}
	10%{transform: scale(0.2);}
	
}

.title_servi{
	
	text-align: center;
	font-size: 30px;
}
.p__servi{
	
	margin-top: 30px;
	text-align: center;
	margin-bottom:30px;
	padding: 10px;
	line-height:1.5; 

}


.column__title{
	
 text-align: center;
 margin-bottom: 30px;
	
}

.column__txt{
	
	text-align: center;
	margin-bottom: 30px; 
	font-size: 16px;
}

.icon-servi{
display: flex;
color:white;
justify-content: space-between;
justify-content: center;
align-items: center;
font-size: 2em;
width: 100px;
height: 100px;
background:  #202020;
border-radius: 50%;
margin-left: auto;
margin-right: auto;

		
}


.column__boton{	
text-decoration: none;
color: white;
background:  #f5a700;
padding: 5px;
text-align: center;
}

.column__boton:hover{
	
background:#f57a00;	
	
}
.column:hover .icon-servi{
	background:white;
	color: #202020;
  
}





.column:hover.container-s{
	
	color:white;
	background: #202020; 
}







/*--------- estilos promo -----*/

.title--promo{
	
 padding-left: 30px;
}



/*--------- estilos ventajas -----*/
.group__ventajas{
	
	padding-top: 10px;
padding-bottom: 40px;
}
.group__title{
	
text-align: center;
padding: 50px;
	
}
.ventajas__img{
	
	display: block;
	margin: auto;
	max-width: 350px;
	height: 50px;
	width: 50px;
	font-size: 45px;
	color: #f5a700;
	margin-top: 30px;
	
}



.ventajas__title{
	text-align: center;
	padding:40px;
	font-weight: 1000;

}

.column--50-25{
	width: 100%;
	
}

/*--------- estilos pago-contac -----*/

.banner--pago
{
	margin-top: -39px;
	position: relative;
}
.banner--pago:before{
	content:'';
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.2);
	z-index: 1000;
	top: 0;
	}

.banner--img{
	width: 100%;
	height :1000px;
	object-fit: cover;
	
}
.title{
	
	width: 100%;
	color: white;
	text-align: center;
	position: absolute;
	z-index: 1500;
	top: 110px;
	
}

.div_pago{
	width: 100%;
	color: white;
	text-align: center;
	position: absolute;
	top: 300px;
}



.title__pago{
padding: 10px;
font-size: 25px;

z-index: 1500;
}
.div_pago .title__pago{

	margin-top: -340px;
}



.img__pago{
	
	margin-top: 30px;

	height: 100px;
	}
	.div_pago .img__pago{
		margin-top: -150px;
	}
.div_contact{
	width: 100%;
   text-align: center;
	position: absolute;
	top: 400px;
	z-index: 1000;
	margin-bottom: 30px;
	
}
.title__contac{
	
	color: white;
	font-size: 25px;
	margin-top: -30px;

	
	
}

.pa__contac{
	margin-top: 20px;
	color:white;
	margin-bottom: 10px;
	font-size:20px; 
	
	
	
}
.div_contact .pa__contac{

	line-height: 20px;
}   

.pas__contac{
color: white;
font-size:16px; 
}

.contacs{
font-size:25px;
margin-top:30px; 
	
	

	
	
}

.div_formu{
	width: 100%;
   text-align: center;
	position: absolute;
	top: 800px;
	z-index: 1500;
	margin-bottom: 30px;
	padding-left: 30px;
	padding-right: 30px;
	
	
}
form{
margin-left:  auto;
margin-right: auto;
background:rgba(0,0,0,.2);
padding: 20px;

}

input{
	border: 1px solid white; 
	width: 100%;
	background: transparent ;
	width: 100%;
	margin-bottom: 20px;
	padding: 10px;
	
	
	
}
textarea{
	border: 1px solid white; 
	padding: 8px;
	background: transparent ;
	width: 100%;
	
}


	
.btn--contac{
color: white;
background: #ECAF12;
border:none;
margin-top:15px; 	
	
}

.btn--contac:hover{
	
	background:#f57a00; 
	
}

.banner--pagos{
	
	z-index: 2000;
}





/*---- estilos placeholder-----*/

.div_formu input[type=text]{
	padding-left: 30px;
	
	
}

.div_formu input[type=mail]{
	padding-left: 30px;
	
}

.div_formu textarea{
	padding-left: 30px;
}



.icon-contac{
	
position: absolute;
margin-top: -46px;
left: 56px;
color: white;
width: 16px;
height: 16px;
font-size: 16px;
	
}
.icon-mensaje{
top:250px;


}

.icon-enviar{
	
	margin-left: -50px;
	left: auto;
	
	
}

input::-webkit-input-placeholder {
  color: white;
	
}
input:-moz-placeholder {
  color: white; 
}
input:-ms-input-placeholder { 
  color: white; 
}
textarea::-webkit-input-placeholder {
  color: white;
}

/*--------- estilos footer -----*/

.main-footer{

    background:#0F172A;

    color:white;

    padding:70px 20px 25px;

}

.footer-grid{

    max-width:1200px;

    margin:auto;

    display:grid;

    grid-template-columns:2fr 1fr 1fr;

    gap:60px;

}

.footer-grid h3{

    color:#ECAF12;

    margin-bottom:20px;

}

.footer-grid p{

    color:#d6d6d6;

    line-height:1.8;

    font-size:17px;

}

.footer-grid ul{

    list-style:none;

    padding:0;

}

.footer-grid li{

    margin-bottom:12px;

    font-size:17px;

}

.footer-grid a{

    color:#d6d6d6;

    text-decoration:none;

    transition:.3s;

    font-size:17px;

}

.footer-grid a:hover{

    color:#ECAF12;

}

.footer-copy{

    border-top:1px solid rgba(255,255,255,.1);

    margin-top:45px;

    padding-top:25px;

    text-align:center;

    color:#999;

}

@media(max-width:992px){

.footer-grid{

    grid-template-columns:1fr;

    text-align:center;

}

} 

.div__a{

	width:100%;
	margin-left: auto;
  margin-right: auto;
  margin-top: 50px;
 
  
	
}
.botons{

 

	text-decoration: none;
	color: white;
	padding: 25px;
	background:none;
	font-size: 20px;
	width: 300px;
   text-align: center;
	cursor:pointer;
	z-index: 1500;
	font-size: 24px;
    border: 3px solid white;
	transition: 0.4s;
	font-weight: 600;



	
	
 
}
.botons:hover{
	background: #ECAF12;
	border: none;
	transform:scale(1.04);
	
}




/*---- estilos boton flotante _____*/





@media screen and  (min-width:480px){
	
	.group--color .column--50 {
		
		width: 50%;
	}

	
	.main__img{
		
		padding-top: 60px;
		width: 300px;
		object-fit: cover;
		
		
	}
	
	.group__title{
		
		margin-left: auto;
		margin-right: auto;
	}
	.column--50-25{
		
		width: 50%;
		
	}
	
}
	
	

@media screen and (min-width:768px){	
	.logo{
		
		margin-left: -30px;
		margin-right: auto;
		
	}
	
	
	.main__title{
		
		font-size: 40px;
	}
	
	.main__txt{
		
		font-size: 20px;
		padding-top: 2px;
		
	}
		
	
	.main__img{
		
		width: 500px;
	}
	
	.boton{
		
		margin-top: 30px;
		
	}
	
	
	.bogota{
	
margin-left: -400px;
		opacity: 0;
animation-name:bogota;
animation-duration: 18s;
animation-delay: 0s;
animation-iteration-count: infinite;
	
}
@keyframes bogota{
	0%{ opacity: 0;
		margin-left:-400px;
	}
	5%{ opacity: 1;
		margin-left: -100px; }
	10%{ margin-left:-100px; }
	15%{ opacity: 0;}
		25%{opacity: 0;}    
		100%{ opacity: 0;}
	}
	
	


.ibague{
	
margin-left: -600px;
	opacity: 0;
animation-name:ibague;
animation-duration: 18s;
animation-iteration-count: infinite;
animation-delay: 3s;
	
}
@keyframes ibague{
	
    0%{opacity: 0;
		margin-left:-600px; }
	5%{ margin-left: -70px; }
	10%{ margin-left:-70px; }
	15%{ opacity: 0; }
	25%{opacity: 0;} 
    100%{ opacity: 0; ;}
}

.nevera{
	
margin-left: -650px;
	opacity: 0;
animation-name:nevera;
animation-duration: 18s;
animation-iteration-count: infinite;
animation-delay: 6s;
	
}
@keyframes nevera{
	
	0%{ opacity: 0;
		margin-left:-650px;}
	5%{ opacity: 1;
		margin-left: -80px; }
	10%{ margin-left:-80px; }
	15%{ opacity: 0; }
	25%{opacity: 0;} 
    100%{ opacity: 0;}
	
}


.lavadora{
	
margin-left: -700px;
	opacity: 0;
animation-name:lavadora;
animation-duration: 18s;
animation-iteration-count: infinite;
animation-delay: 9s;
	
}
@keyframes lavadora{
	
	0%{ opacity: 0;
		margin-left:  -700px; }
	5%{ opacity: 1;
		margin-left: -120px; }
	10%{ margin-left:-120px; }
	15%{ opacity: 0;  }
	25%{opacity: 0;} 
    100%{ opacity:0 ;}
	
}


.secadora{
	
margin-left: -700px;
	opacity: 0;
animation-name:secadora;
animation-duration: 18s;
animation-iteration-count: infinite;
animation-delay: 12s;
	
}
@keyframes secadora{
	
	0%{opacity: 0;
		margin-left:  -700px; }
	5%{ margin-left: -120px; }
	10%{ margin-left:-120px; }
	15%{ opacity: 0; }
	25%{opacity: 0;} 
    100%{ opacity: 0;}
	
}

.nevecones{
	
margin-left: -700px;
	opacity: 0;
animation-name:nevecones;
animation-duration: 18s;
animation-iteration-count: infinite;
animation-delay: 15s;
	
}
@keyframes nevecones{
	
	0%{ opacity: 0;
		margin-left:  -700px; }
	5%{ opacity: 1;
		margin-left: -120px;}
	10%{ margin-left:-120px; }
	15%{ opacity: 0; }
	25%{opacity: 0;} 
    100%{ opacity: 0;}
	
}
	.banner__img{
		
		height: 400px;
	} 

	
.title__banner{
	margin-top:-10px; 
	color: #ECAF12;
	font-size: 50px;
	
}
	
	

.pa__banner{
	
    text-align: center;
	font-size: 16px;
	margin-top:80px;
	
}
	

	
	.column--80{
		
		width: 80%;
	}
	
	.column--20{
	 width:20%;	
		
	}
	
	.panel{
		
		height: 1300px;
		
	}
	
	

	.container-s{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	border-bottom: 1px solid #cbd1d5;
	overflow: hidden;
	margin-left: auto;
	margin-right:auto;
	width: 650px;
	height: 250px;	
		
	
		
		
	}
	
	.title_servi{
		margin-top:20px; 
		font-size: 35px;
	}
	
	.p__servi{
    
    margin-top: 30px;
	margin-bottom:30px;
	padding: 10px;
	line-height:1.5; 

}
	

	.icon-servi{
		
		margin-top: -90px;
		width: 80px;
      height: 80px;
		
		
	}
	
	.column__boton{
		
		padding: 7px;
	
	}
	
	.column--50s{
		
		width:50%;
		
	}
	
	.title--promo{
	line-height: 30px;
	margin-top: -90px;
	font-size: 30px;
	}
	
	
	.group__title
	{
		
		font-size: 30px;
		
		}
	
	.column--50-25{
		
		width: 24%;
		
		
	}
	.div_pago .title__pago{

	margin-top: -300px;
	padding-top: 30px;
	font-size: 40px;
}





	
	
	.banner--pago:before{
	content:'';
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.5);
	z-index: 100;
	top: 0;
	}
	
	.banner--pago{
	 height: 1000px;
	}
	.div_pago{
		height: 300px;
		
		margin-top:-100px; 
	}
	
	.div_contact{
		
		margin-top: -100px
	}
	
	
	
	.div_pago .img__pago{
	display: block;
    margin: 0 auto;
    width: 700px;
    height: auto;
	object-fit: unset;
	margin-top: -80px;
	
		
	}
	.title__contac{
		
		margin-top:  30px;
				font-size: 30px;
	}
	
	.pa__contac,.pas__contac{
		margin-top:40px;
	 font-size: 17px;
		
	}
	
	
	
	
	
	.contacs{
		padding: 0;
		font-size: 35px;
		z-index: 1000;
	}
	
	
	

	
	.botons{

    
	margin-top: -140px;
	
 
}

	
	
	}
	
	
	

@media screen and  (min-width:1024px){
	
	
	
	.ul__submenu {
		margin-left: -30px;
		list-style: none;
	    position: absolute;
		position: fixed;
		z-index: 1500;
		background: #f7f9fa;
        overflow: hidden;
         height:0; 



	}
	

	
	
		
	
	
	.li__submenu{
		
		padding: 10px;
		cursor: pointer;
		
		
	}
	
	
	
	.a__submenu{
		
		text-decoration: none;
		color: black;
	}
	


	
	.container .menu :hover .ul__submenu{
		
		height: 120px;
	}
	
	
	.main-header{
		
		position:fixed;
		z-index: 1500;
	} 

	
	.icon-menu{
		
		display: none;
	}
	.logo{
	margin-left: -450px;
		
	}
	
	.menu{
	    margin-top: -45px;
		display: flex;
		position: absolute;
	     height:50px;
		margin-left: 600px;
		margin-top:-30px
		
	}
	
	.menu__item{
		
		float: right;
	}
	
	
	.bogota{
	
margin-left: -500px;
		opacity: 0;
animation-name:bogota;
animation-duration: 18s;
animation-delay: 0s;
animation-iteration-count: infinite;
	
}
@keyframes bogota{
	0%{opacity: 0;
		margin-left:-550px; }
	5%{ opacity: 1;
		margin-left: -150px; }
	10%{ margin-left:-150px; }
	15%{opacity: 0;} 
	25%{opacity: 0;} 
	100%{opacity: 0;} 
	
	
}

.ibague{
	
margin-left: -800px;
	opacity: 0;
animation-name:ibague;
animation-duration: 18s;
animation-iteration-count: infinite;
animation-delay: 3s;
	
}
@keyframes ibague{
	
    0%{opacity: 0;
		margin-left:-800px; }
	5%{ opacity: 1;
		margin-left: -170px; }
	10%{ margin-left:-170px; }
	15%{opacity: 0;} 
	25%{opacity: 0;} 
	100%{opacity: 0;} 
}

.nevera{
	
margin-left: -900px;
	opacity: 0;
animation-name:nevera;
animation-duration: 18s;
animation-iteration-count: infinite;
animation-delay: 6s;
	
}
@keyframes nevera{
	
	0%{ opacity: 0;
		margin-left:-900px; }
	5%{ opacity: 1;
		margin-left: -180px; }
	10%{ margin-left:-180px; }
	15%{opacity: 0;} 
	25%{opacity: 0;} 
	100%{opacity: 0;} 
	
}


.lavadora{
	
margin-left: -1000px;
opacity: 0;
animation-name:lavadora;
animation-duration: 18s;
animation-iteration-count: infinite;
animation-delay: 9s;
	
}
@keyframes lavadora{
	
	0%{opacity: 0;
		margin-left:  -1000px; }
	5%{ opacity: 1;
		margin-left: -200px; }
	10%{ margin-left:-200px; }
	15%{opacity: 0;} 
	25%{opacity: 0;} 
	100%{opacity: 0;} 
	
}


.secadora{
	
margin-left: -1000px;
	opacity: 0;
animation-name:secadora;
animation-duration: 18s;
animation-iteration-count: infinite;
animation-delay: 12s;
	
}
@keyframes secadora{
	
	0%{opacity: 0;
		margin-left:  -1000px; }
	5%{ opacity: 1;
		margin-left: -200px; }
	10%{ margin-left:-200px; }
	15%{opacity: 0;} 
	25%{opacity: 0;} 
	100%{opacity: 0;} 
	
}

.nevecones{
	
margin-left: -1000px;
	opacity: 0;
animation-name:nevecones;
animation-duration: 18s;
animation-iteration-count: infinite;
animation-delay: 15s;
	
}
@keyframes nevecones{
	
	0%{opacity: 0;
		margin-left:  -1000px; }
	5%{ opacity: 1;
		margin-left: -150px; }
	10%{ margin-left:-150px; }
	15%{opacity: 0;} 
	25%{opacity: 0;} 
	100%{opacity: 0;} 
	
}
	
	.banner__img{
		
		height: 500px;
		
	} 

.title__banner{
	margin-top:90px; 
	color: #ECAF12;
	font-size: 80px;
	
}
	
	

.pa__banner{
	
    text-align: center;
	font-size: 20px;
	margin-top:195px;
	
}
	
	.main__title{
		
	font-size: 	35px;
		
	}
	.main__txt{
		
		font-size: 20px;
		line-height: 34.5px;
	}
	
	.title_servi{
	position: relative;
		margin-top: 30px;
	
   }
	.line{
		
	margin-top:-50px;
	margin-bottom: 30px;	
	}
	

	

	
	
	
	
	
	
	.panel{
		
		width:1000px;
		height: 800px;
		
		padding-right: 50px;
		
	}
	
	.container-s{
	 
		width: 450px;
		height: 300px;
		
	}
	
	.column__title{
		
		font-size: 15px;
		margin-bottom: 30px;
		
	}
	
	.group__unir{
		padding: 20px;
		width: 1024px;
		margin-left: auto;
		margin-right: auto;
		
	}
	
	.img--promo{
		margin-left: 30px;
		
		
		
	}
	
	.column--50s{
		margin-left: -30px;
		width: 100%;
	}
	
	.column--sa{
		padding:10px; 
		width: 48%;
		height: 670px;
		
	}
	
	.group__title{
		margin-top:-50px;
		margin-left: 50px;
		
		}
	
	
	.separar{
	
	margin-left: 30px;
	}
	
	.column--50-25{
		
		
		
		width: 50%;
	}
	
.ventajas__img{
		
	font-size: 	55px;
	width: 55px;
	height: 55px;
	}
	
	.ventajas__title{
		font-size:20px;
		font-weight: 1000;
		
		
	}
	
		
	.title--promo{
		
	 margin-top: 	30px;
	}
	
	
	
	
	.title__pago{
		
		margin-top: -150px;
		font-size: 35px;
		
	}
	
	.img__pago{
		
		margin-top: 60px;
		
	}
	.title__contac{
	 font-size: 35px;
	}
	
	.pa__contac{
	margin-top: 20px;
	font-size: 	16px;
	
	}
	.pa__contac:nth-child(3){
		
		margin-bottom: 50px
	}
	
	form{
		
		width: 750px;
		height: 350px;
		padding-top: 120px;
	}
	.div-sepa{
	width:33%
		
		
	}
	
	textarea{
	width:390px;
	margin-left:-50px; 	
		
	}
	
	.btn--contac{
		
	   height: 40px;
		padding:1px;
		
	}
	
	.icon-contac{
		
		margin-left: -100px;
		
		
	}
	
	.icon-mensaje{
		
		margin-left:-203px 
	}
	
	.icon-enviar{
		margin-top: -50px;
		margin-left: -53px
	 
	}
	
	
	
	
		
	}
	

	
@media screen and  (min-width:1366px){
	
	
	.line{
	margin-top: 50px;
	height: 5px;
	margin-bottom: -30px;	
		
		
	}
	.banner__img{
		
		height: 600px;
		
	}
	
		.bogota{
	
margin-left: -1000px;
opacity: 0;			
animation-name:bogota;
animation-duration: 24s;
animation-delay: 0s;
animation-iteration-count: infinite;
	
}
@keyframes bogota{
	0%{opacity: 0;
		margin-left:-1000px;}
	5%{ opacity: 1;
		margin-left: -100px; }
	10%{ margin-left:-100px; }
	15%{opacity: 0;} 
	25%{opacity: 0;} 
	100%{opacity: 0;} 
	
}

.ibague{
	
margin-left: -1200px;
	opacity: 0;
animation-name:ibague;
animation-duration: 24s;
animation-iteration-count: infinite;
animation-delay: 4s;
	
}
@keyframes ibague{
	
    0%{opacity: 0;
		margin-left:-1200px; }
	
	5%{ opacity: 1;
		margin-left: -100px; }
	10%{ margin-left:-100px; }
	15%{opacity: 0;} 
	25%{opacity: 0;} 
	100%{opacity: 0;} 
}

.nevera{
	
margin-left: -1200px;
	opacity: 0;
animation-name:nevera;
animation-duration: 24s;
animation-iteration-count: infinite;
animation-delay: 8s;
	
}
@keyframes nevera{
	
	0%{opacity: 0;
		margin-left:-1200px; }
	5%{ opacity: 1;
		margin-left: -100px; }
	10%{ margin-left:-100px; }
	15%{opacity: 0;} 
	25%{opacity: 0;} 
	100%{opacity: 0;} 
	
}


.lavadora{
	
margin-left: -1300px;
	opacity: 0;
animation-name:lavadora;
animation-duration: 24s;
animation-iteration-count: infinite;
animation-delay: 12s;
	
}
@keyframes lavadora{
	
	0%{opacity: 0;
		margin-left:  -1300px; }
	5%{ opacity: 1;
		margin-left: -200px; }
	10%{ margin-left:-200px; }
	15%{opacity: 0;} 
	25%{opacity: 0;} 
	100%{opacity: 0;} 
	
}


.secadora{
	
margin-left: -1300px;
	opacity: 0;
animation-name:secadora;
animation-duration: 24s;
animation-iteration-count: infinite;
animation-delay: 16s;
	
}
@keyframes secadora{
	
	0%{opacity: 0;
		margin-left:  -1300px; }
	5%{ opacity: 1;
		margin-left: -250px; }
	10%{ margin-left:-250px; }
	15%{opacity: 0;} 
	25%{opacity: 0;} 
	100%{opacity: 0;} 
	
}

.nevecones{
	
margin-left: -12000px;
	opacity: 0;
animation-name:nevecones;
animation-duration: 24s;
animation-iteration-count: infinite;
animation-delay: 20s;
	
}
@keyframes nevecones{
	
	0%{opacity: 0;
		margin-left:  -1200px; }
	5%{ opacity: 1;
		margin-left: -250px; }
	10%{ margin-left:-250px; }
	15%{opacity: 0;} 
	25%{opacity: 0;} 
	100%{opacity: 0;} 
	
}
	
	
	.banner__img{
		
		height: 550px;
		
	} 

.title__banner{
	margin-top:100px; 
	color: #ECAF12;
	font-size: 80px;
	
}
	
	

.pa__banner{
	
    text-align: center;
	font-size: 25px;
	margin-top:195px;
	
}
	
	.main__title{
		
	font-size: 	45px;
		
	}
	.main__txt{
		margin-left:30px; 
		font-size: 25px;
		line-height: 36.5px;
	}
	
	.main__img{
		padding-left: 30px;
		width: 600px;
		
	}
	
	.boton{
		margin-top: 70px;
		font-size:18px;
		text-align: center;
		width: 300px;
	}
	
	.pa__banner{
	
    text-align: center;
	font-size: 20px;
	margin-top:205px;
	
}
	
	.main__title{
		
	font-size: 	45px;
		
	}
	.main__txt{
		
		font-size: 25px;
		line-height: 34.5px;
	}
	
	.title_servi{
	margin-top: 70px;	
	margin-bottom: -40px;
	
		
	}
	
	.p__servi{
	margin-top: 60px;	
		
	}
	
	
	.panel{
		
		width:1100px;
		height:900px;
		padding-left: 50px;
		
		padding-right: 50px;
		
	}
	
	.container-s{
	    
		width: 470px;
		height: 300px;
		
	}
	
	.column__title{
		
		font-size: 15px;
		margin-bottom: 30px;
		
		
	}
	
	.title__pago{
	 font-size: 40px;
	}
	.title__contac{
		font-size: 40px;
		
	}
	.pa__contac{
		font-size: 20px; 
		
	}
	
	
}	






