/* ===============================================================
   FONT FACE
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@font-face {
    font-family: 'stigma_serif';
    src: url('fonts/stigma_display_typeface-webfont.woff2') format('woff2'),
         url('fonts/stigma_display_typeface-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
	}
 
/* ===============================================================
   GENERAL
   ============================================================ */
	body {
	margin: 0px;
	padding: 0px;
	width: 100%;
	font-family: 'Barlow', sans-serif;
	font-weight: 300;
	background-color:#FFF;
	overflow-x: hidden;
	height: 100%;
	/*background-image: url(img/encabezado.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;*/
	}
	html {
	font-family: 'Barlow', sans-serif;
	font-size: 18px;
	line-height:30px;
	font-weight:300;
	color:#000; 
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%; 
	height: 100%;
	scroll-behavior: smooth;
	}
	
	* {
	margin: 0;
	padding: 0;
	}
	img {
	border: 0;
	-ms-interpolation-mode: bicubic;
	vertical-align: middle;
    }
	a {
	text-decoration: none;
	}
	table {
	border-collapse: collapse;
	border-spacing: 0;
	border:none;
	}
	p {
	margin: 0;
	padding: 0;
	}
	.main {
	width:100%;
	}
	* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	}
	strong {
	font-weight:700;
	}
	.vacia {
	position:relative;
	}


/* General ***************************/
	.main {
	width: 1000px;
	margin:0 auto;
	}
	h1 {
	display:block;
	font-family: 'stigma_serif', 'Barlow', sans-serif;
	font-size:55px;
	font-weight: normal;
	line-height:normal;
	color:#fff;
	margin: 0px;
	padding: 0px;
	}
	.centrar {
	text-align:center;
	overflow:hidden;
	}


/* ===============================================================
   LANDING
   ============================================================ */
header {
	width: 100%;
	}
.bot-contact {
	float:right;
	background-color:#fff;
	color:#5C8EC5;
	font-size:16px;
	line-height:normal;
	font-weight:500;
	padding:10px 70px 12px 70px;
	-webkit-border-bottom-right-radius: 25px;
	-webkit-border-bottom-left-radius: 25px;
	-moz-border-radius-bottomright: 25px;
	-moz-border-radius-bottomleft: 25px;
	border-bottom-right-radius: 25px;
	border-bottom-left-radius: 25px;
	margin-right:60px;
	}
.bot-contact a {
	color:#5C8EC5;
	}
.logo {
	width: 1000px;
	margin:0 auto;
	text-align:center;
	padding:160px 0px 350px 0px;
	}
#inicio {
	width:100%;
	background-image: url(img/encabezado.jpg);
	background-size: 100% auto;
	background-repeat: no-repeat;
	background-position: center top;
	color:#fff;
	padding:0px 0px 150px 0px;
	}
.columna {
	width:50%;
	text-align:left;
	float:left;
	min-height:100%;
	}
.columna img {
	width:100%;
	height:auto;
	}
	
.padding-der {
	padding-right:40px;
	}
.padding-izq {
	padding-left:40px;
	}

.ceo {
	text-align:center;
	color:#132754;
	}

.destacado-txt {
	border:1px solid #8e9fb6;
	-webkit-border-top-left-radius: 25px;
	-moz-border-radius-topleft: 25px;
	border-top-left-radius: 25px;
	padding:60px 40px;
	}
.quienes {
	padding-top:150px;
	}
.quienes h1 {
	padding-left:40px;
	}
#como {
	width:100%;
	background-attachment: fixed;
	background-image: url(img/como-hacemos.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	text-align:center;
	padding:150px 0px;
	}
#como .txt {
	margin:0 auto;
	width:75%;
	}
#como .txt h1,
#productos h1 {
	color:#101F49;
	}
#como .txt span {
	font-weight:600;
	color:#132754;
	}

#productos {
	width:100%;
	background-image: url(img/productos-servicios.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	text-align:center;
	padding:180px 0px;
	}
#productos .destacado1 {
	-webkit-border-bottom-right-radius: 25px;
	-moz-border-radius-bottomright: 25px;
	border-bottom-right-radius: 25px;
	background-image: url(img/transp.png);
	padding:60px;
	}
#productos .destacado2 {
	-webkit-border-top-right-radius: 25px;
	-moz-border-radius-topright: 25px;
	border-top-right-radius: 25px;
	padding:45px 60px;
	font-size:17px;
	background-color:#fff;
	}
#productos ul {
	margin: 0;
	list-style: none;
	}
#productos ul li::before {
	content: "\2022";
	color:#5C8EC5;
	font-weight: bold;
	display: inline-block; 
	width: 1em;
	margin-left: -1em;
	}
#productos .destacado3 {
	-webkit-border-top-left-radius: 25px;
	-moz-border-radius-topleft: 25px;
	border-top-left-radius: 25px;
	padding:45px 60px;
	font-size:17px;
	background-color:#fff;
	margin-top:150px;
	}

#contact {
	width:100%;
	padding:120px 0px;
	overflow:hidden;
	background-color:#101F49;
	}
#contact .titular {
	text-align:center;
	padding:0px 0px 120px 0px;
	}
#contact .columna2 {
	width:50%;
	text-align:right;
	float:left;
	min-height:100%;
	}
footer {
	position:relative;
	width:100%;
	background-color:#1A1A1A;
	color:#5C8EC5;
	clear: both;
	font-size:14px;
	padding:0px;
	text-align:center;
	padding:12px 0px;
	}
#up {
	position: absolute;
	bottom:0px;
	right:20px;
	}

/* ===============================================================
   FORMULARIO
   ============================================================ */
input, select, textarea {
	font-family: 'Barlow', sans-serif;
	font-size:16px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	line-height:normal;
	font-weight: 400;
	outline: none;
	border: 0;
	border-radius: 0px;
	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;
	}
.campo {
	background-color:transparent;
	width:95%;
	padding:10px 0px;
	color:#fff;
	margin-bottom:20px;
	border-bottom:1px solid #586380;
	-webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
	}
::placeholder {
	color: #fff;
	opacity: 0.9;
	}
.enviar {
	color:#101F49;
	background-color:#FFF;
	padding:15px 120px;
	font-size:18px;
	font-weight:700;
	border:none;
	text-align:center;
	margin-top:70px;
	cursor:pointer;
	-webkit-appearance: none;
	-webkit-border-radius: 40px;
	-moz-border-radius: 40px;
	border-radius: 40px;
	}









/* ===============================================================
   ============================================================ */

@media only screen and (min-width : 1750px) {
	.logo img {
		width:500px;
		height:auto;
	}
	.logo {
	  padding: 350px 0px 350px 0px;
	}

}

@media only screen and (min-width : 1500px) and (max-width : 1749px) {
	.logo {
	  padding: 160px 0px 450px 0px;
	}

}

@media only screen and (min-width : 1024px) and (max-width : 1459px) {
	.logo {
	  padding: 160px 0px 250px 0px;
	}

}

@media only screen and (min-width : 768px) and (max-width : 1023px) {
	.logo, .main { width: 90%;	}
	#inicio { background-size: cover; }
	h1 { font-size:40px; }
	

}


@media only screen and (min-width : 481px) and (max-width : 767px) {
	.logo, .main { width: 90%;	}
	.bot-contact { margin-right: 30px; }
	#inicio { background-size: cover; }
	h1 { font-size:50px; }
	.columna {
		width:100%;
		margin:0 auto !important;
		}
	.padding-der { padding-right:0px; }
	.padding-izq { padding-left:0px; }
	.quienes { padding-top: 70px; }
	#productos .destacado3 {
		margin-top:70px;
		}
	#contact .columna2 {
		width:100%;
		text-align:left;
		}
	.campo { width:100%; }

}


@media only screen and (max-width : 480px) {
	body, html {
		font-size:16px;
		line-height:25px;
		}
	h1 { font-size:40px; }
	.logo, .main { width: 90%;}
	.logo img {
		width: 300px;
		height:auto;
		}
	.bot-contact {
		font-size:14px;
		font-weight:500;
		padding:10px 40px 12px 40px;
		-webkit-border-bottom-right-radius: 20px;
		-webkit-border-bottom-left-radius: 20px;
		-moz-border-radius-bottomright: 20px;
		-moz-border-radius-bottomleft: 20px;
		border-bottom-right-radius: 20px;
		border-bottom-left-radius: 20px;
		margin-right:20px;
		}
	#inicio { background-size: cover; }
	.columna {
		width:100%;
		margin:0 auto !important;
		}
	.padding-der { padding-right:0px; }
	.padding-izq { padding-left:0px; }
	.quienes { padding-top: 70px; }
	.destacado-txt { width:98%;	}
	#productos .destacado3 {
		margin-top:70px;
		}
	#contact .columna2 {
		width:100%;
		text-align:left;
		}
	#contact .titular {
		text-align: center;
		padding: 0px 0px 70px 0px;
		}
	.campo { width:100%; }
	.enviar { width:100%; }
	footer { padding:5px; }

}


