

 
/* Large screens ----------- */
@media only screen and (min-width : 1400px) {
 
}

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

/* Desktops and laptops ----------- */
@media only screen and (min-width : 1224px) {

}


/* ------------------------------
tablets APAISADO
------------------------------ */


@media screen  and (max-width:1024px) {
	section {
    position: relative;
    padding: 60px 40px 60px;
}
.header-section {
	padding: 0 40px;
}
#atributos .txt {
    padding: 15px 10px;
}
 h2 {
    font-size: 48px;
		line-height: 60px;
	}
	
 .box-skill {
	 padding:25px;
 }
 .modulo {
    width: 45%;
	padding: 20px;
 }
 
 
 
}

/*iphone X apaisado*/
@media screen and (min-width:737px) and (max-width:812px) {

}


/* ------------------------------
tablets VERTICAL
------------------------------ */
@media screen  and (max-width:768px) {

 .header-section,
 .header-section .container .row,
 .header-section .container {
	 min-height: 420px;
 }
 .content-box,
 .content-skills {
	 flex-wrap:wrap;
 }
 
 .box-skill{
	 width: 47%;
    margin: 1.5%;
    max-width: none;
 }

 .funnel .texto {
	 padding-right:0;
 }
 
 h2 {
    font-size: 38px;
    line-height: 48px;
}
.caption p {
    margin: 20px 0;
    font-size: 16px;
}
.call-to-action h3 {
    font-size: 21px;
    font-weight: 700;
}
#atributos .row:nth-child(2) .txt, 
#atributos .row:nth-child(2) .txt p, 
#atributos .row:nth-child(2) .txt h4 {
    text-align: left;
}

.modulo {
    width: 100%;
    padding: 20px;
min-height: auto;
}
.modulo.dos {
margin-top: 50px;}


.box {
    padding: 30px 20px;
    width: 32%;
    margin: 1.5%;
    max-width: none;
    min-height: 220px;
}

h4.parrafo {
font-size: 18px;}

.content-footer {
    display: flex;
    justify-content: space-between;
    flex-wrap:wrap;
}
.footer-col:nth-child(2){
	width:90%;
	margin-left:5%;
	margin-right:5%;
	border-top:1px solid red;
	margin-top:5%;
	padding-top:5%;
}
.footer-col:nth-child(1){
	width:30%;
	margin-left:5%;
}

.footer-col:nth-child(3){
	width:60%;
	margin-left:5%;
	
}
}

/* ------------------------------
mobile APAISADO
------------------------------ */

/*iphone 6 PLUS apaisado*/
@media screen and (min-width:668px) and (max-width:736px) {

}



/*iphone 6 apaisado*/
@media screen and (min-width:569px) and (max-width:667px) {

}


/*iphone 5 apaisado*/
@media screen and (min-width:501px) and (max-width:568px) {


}
/* ------------------------------
mobile VERTICAL
------------------------------ */



/*mobile generico*/
@media screen and (min-width:200px) and (max-width:599px) {
	nav#header-scroll {
    height: 85px;
		    padding: 0 20px;
}
 section {
    position: relative;
    padding: 60px 20px 60px;
}
#menu ul {
	top:85px;
}
nav#header-scroll .brand{
	width: 170px;
    height: 50px;
}

.header-section {
	margin-top: 85px;
	padding:20px;
}
 .box-skill {
    width: 100%;
    margin: 20px 0;
    max-width: none;
		box-shadow: 0px 0px 20px 9px #D6D6D6;
}
 .box-medium {
    padding: 30px 20px;
    width: 100%;
    margin: 20px 0;
		box-shadow: 0px 0px 14px 3px #D6D6D6;

	}
 .box {
    padding: 30px 20px;
    width: 97%;
    margin: 1.5%;
    max-width: none;
    min-height: 190px;
    margin-bottom: 14px;
}

	.box-lead .inner-tit {
			    padding: 10px 20px 0;
	}
	.funnel {
		flex-direction: column;
	}
	.funnel .texto,
	.funnel .imagen {
		width: 100%;
	}
	.funnel .imagen {
		margin-top:30px;
	}
	
	.call-to-action {
		flex-direction:column;
	}
	
	.call-to-action h3 {
    text-align: center;
	}
footer {
    width: 100%;
    background: #F7F8F9;
    min-height: 200px;
    padding: 40px 0 80px;
    text-align: center;


}
	 .content-footer {

			flex-direction: column;
	}
	.footer-col:nth-child(1), 
	.footer-col:nth-child(2), 
	.footer-col:nth-child(3) {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
}
.footer-col ul li a {
	font-size:14px;
}

.call-to-action.deco {
    padding-left: 40px;
    position: relative;
    padding-bottom: 220px;
}
.call-to-action.deco:after {
	left:0;
}

.modo h4 {
    text-align: center;
    font-size: 16px;
    padding-left: 0;
    margin-bottom: 10px;
    padding-top: 50px;
}
.modo.wapp h4 {
    background: url(../images/wapp.svg) no-repeat center top;
}
.modo.correo h4 {
    background: url(../images/mail.svg) no-repeat center top;
}

}

 
/*iphone 6 PLUS vertical*/
@media screen and (min-device-width : 414px)  and (max-device-width : 735px){ 


}
/*iphone 6 vertical*/
@media screen and (min-width:321px) and (max-width:414px) {

}

/*iphone X vertical*/
@media screen and (min-width:375px) and (max-width:399px) {


}
/*iphone 5s vertical*/

@media screen and (min-width:200px) and (max-width:340px) {
	 
}


iframe {
    max-width: 100%;
    max-height: auto;
	align-items: center;
}

