@charset "utf-8";
/* CSS Document */
body {
	margin: 0em auto;
	overflow-x:hidden;
    background-color:#1f5e90;
	width:auto;
    padding: 0;
    margin: 0;

}



@font-face {
    font-family: "hevelBold";
    src: url(../fonts/hevelBold.otf) format("opentype")
}

@font-face {
    font-family: "helvelLig";
    src: url(../fonts/helvelLig.otf) format("opentype")
}



@font-face {
    font-family: "Roboto-Light";
    src: url(../fonts/Roboto-Light.ttf) format("truetype")
}

@font-face {
    font-family: "Roboto-Bold";
    src: url(../fonts/Roboto-Bold.ttf) format("truetype")
}


a {
    text-decoration: none;
    color: #000;
	font-family: "hevelBold";
}




h1 {
    font-family: "hevelBold";
    font-weight: 900
}

h2 {
    font-family: "Roboto-Light";
    font-weight: 900
}

h3 {
    font-family: "Dulcelin";
}

p {
    font-family: "helvelLig";
}

button{
	font-family: "helvelLig";
}



#capa1Body{
	position: relative;
	width: 100%;
	height: auto;
    background-color: #498cb7;

}

	.fila1Capa1Body{
		position: relative;
		width: 100%;
		height: 50px;
		
	}

		.txt1Capa1Body{
			position: relative;
			text-align: center;
			width: 100%;
			margin-left: auto;
			margin-right: auto;
			display: inline-table;
			font-size: 4em;
            color: #fff;
			
		}

	.fila2Capa1Body{
		position: relative;
		display: inline-table;
		margin-left: 10%;
		margin-right: 10%;
		width: 80%;
		height: auto;
		
	}

		.col1Capa1Body{
			float: left;
			width: 30%;
			height: 400px;
			background-color: #202020;
			background-image: url(../imagenes/fotocat1.png);
		
		}

			.img1Capa1Body{
				position: relative;
				width: 30%;
				height: auto;
				display: block;
				margin-left: auto;
				margin-right: auto;
				padding-top: 80px;
			}

			.txt2Capa1Body{
				position: relative;
				text-align: center;
				width: 80%;
                margin-left: 10%;
                margin-right: 10%;
				font-size: 2.2em;
				color: #fff;
				
			}

		.col2Capa1Body{
			float: left;
			width: 5%;
			height: 50px;
		
		}


#capa2Body{
	position: relative;
	width: 100%;
	height: auto;

	background-size: cover;
	background-color: #ef8434;
}

	.fila1Capa2Body{
		position: relative;
		width: 100%;
		height: auto;
		display: inline-table;
	}

		.col1Capa2Body{
			float: left;
			width: 50%;
			height: 700px;
			background-image: url(../imagenes/motor2.jpg);
			background-size: cover;
			background-repeat: no-repeat;
		}

		.col2Capa2Body{
			float: left;
			width: 50%;
			height: 700px;
		}

			.txt1Capa2Body{position: relative; text-align: center;  display: block; margin-left: auto; margin-right: auto; width: 80%; font-size: 4em; padding-top: 30px; color: #fff;}
			.txt2Capa2Body{position: relative; text-align: center;  display: block; margin-left: auto; margin-right: auto; width: 80%; font-size: 2em; padding-top: 10px; color: #fff; }
			.btn1Capa2Body{position: relative; display: block; margin-left: auto; margin-right: auto; width: 40%; font-size: 1.6em; height: 80px;  
				color: #fff; background-color: #1f5e90; border: none; outline: none;}
	





/*Celular portrait*/
@media screen and (min-width: 1px) and (max-width: 360px){

    .txt1Capa1Body{font-size: 2em;}
    .txt2Capa1Body{font-size: 1.4em;}

	
	.col1Capa2Body{position: relative;	width: 100%;height: 300px;}
	.col2Capa2Body{position: relative;width: 100%;height: auto;}
		.txt1Capa2Body{width: 100%; font-size: 1.8em; padding-top: 20px;}
		.txt2Capa2Body{ width: 100%; font-size: 1.2em; padding-top: 5px; }
			
	




									   
				   
}
	
	/*Celular landscape*/
@media screen and (min-width: 361px) and (max-width: 640px) {

    .txt1Capa1Body{font-size: 2em;}
    .txt2Capa1Body{font-size: 1.8em;}

	.col1Capa2Body{position: relative;	width: 100%;height: 300px;}
	.col2Capa2Body{position: relative;width: 100%;height: auto;}
		.txt1Capa2Body{width: 100%; font-size: 1.8em; padding-top: 20px;}
		.txt2Capa2Body{ width: 100%; font-size: 1.2em; padding-top: 5px; }



 
 
	
	
}
			
	
	
	/*tablet 7.1 portrait*/
@media screen and (min-width: 641px) and (max-width: 960px) {


    .txt1Capa1Body{font-size: 2.2em;}
    .txt2Capa1Body{font-size: 2.4em;}

	.col1Capa2Body{position: relative;	width: 100%;height: 300px;}
	.col2Capa2Body{position: relative;width: 100%;height: auto;}
		.txt1Capa2Body{width: 100%; font-size: 1.8em; padding-top: 20px;}
		.txt2Capa2Body{ width: 100%; font-size: 1.2em; padding-top: 5px; }


 
 
				
		
	
}
	
	
	
	
/*tablet 7.1 landscape se puede utilizer las medidas iniciales*/
@media screen and (min-width: 961px) and (max-width: 1210px) {
	.txt1Capa2Body{position: relative; text-align: center;  display: block; margin-left: auto; margin-right: auto; width: 80%; font-size: 2.5em; padding-top: 30px; color: #fff;}
	.txt2Capa2Body{position: relative; text-align: center;  display: block; margin-left: auto; margin-right: auto; width: 80%; font-size: 1.2em; padding-top: 10px; color: #fff; }
	.btn1Capa2Body{position: relative; display: block; margin-left: auto; margin-right: auto; width: 40%; font-size: 1.2em; height: 80px;  
		color: #fff; background-color: #1f5e90; border: none; outline: none;}


 
		
}
	
	
	
	
	