
img, object, embed, video	{ max-width: 100%;}
.ie6 img 					{ width:100%;}

.cleare			{ display: block;clear: both;}

@font-face {
    font-family: 'klavika_bdbold';
    src: url('../font/klavika-bold-opentype-webfont.eot');
    src: url('../font/klavika-bold-opentype-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/klavika-bold-opentype-webfont.woff2') format('woff2'),
         url('../font/klavika-bold-opentype-webfont.woff') format('woff'),
         url('../font/klavika-bold-opentype-webfont.ttf') format('truetype'),
         url('../font/klavika-bold-opentype-webfont.svg#klavika_bdbold') format('svg');
    font-weight: normal;
    font-style: normal;

}

.gridContainer	{margin-left: auto;margin-right: auto;width: 87.36%;padding-left: 1.82%;padding-right: 1.82%;}
	
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}

body{
	/*font-family: 'klavika_bdbold';*/
	font-family: 'Titillium Web', sans-serif;
	background: #f1f1f2;
	}

.rotator ul li a{
    height: 34px;
    line-height:52px;
    font-size:20px;
}

.rotator{
    height: 320px;
}

#top{
	background: #fff none repeat scroll 0 0;
    height: 133px;
    position: relative;
    width: 100%;
	z-index:999;
	border-top: 5px solid #002855;
	box-shadow: 0 0 15px rgba(0,0,0,0.5);
	}

.zindex{
	z-index: 2;
	position: relative;
	}

/*#bg_logo{
	background: rgba(0, 0, 0, 0) url("../images/bg_logo.png") no-repeat scroll 0% 0;
	height: 40px;
    left: 0%;
    position: absolute;
    top: 132px;
    width: 100%;
    z-index: 1;
	}
*/

#logo {
    background: rgba(0, 0, 0, 0) url("../images/bg_logo.png") no-repeat scroll right bottom;
    height: 193px;
    max-width: 300px;
    min-width: 110px;
    padding-left: 5%;
    width: 100%;
}

#logo img					{ margin-left: 30px; }

#w_logo{
	left: 0;
    position: absolute;
    width: 100%;
	}

#w_datos{
	font-size: 14px;
    position: absolute;
    right: 0;
    top: 0;
    width: 62%;
	z-index: 3;
	display: none;
	}

#txt_datos{
	position: relative;
	height: 53px;
	}

#txt_datos ul{
	padding: 10px 5% 0 0;
	text-align: right;
	}

#txt_datos ul li{
	display: inline;
	*display: inline-block;
	zoom: 1;
	color: #fff;
	padding: 0 1%;
	position: relative;
	z-index:2;
	}

#bg_azul{
	 background: rgba(0, 0, 0, 0) url("../images/bg_azul.png") no-repeat scroll right top;
    height: 55px;
    position: absolute;
    width: 100%;
	top: -1px;
	}

#btns_menu li{
	display:inline;
	*display: inline-block;
	zoom: 1;
	}

#titulo_slide{
	color: #0fa0db; left: 12%; margin-top: 0; position: absolute; top: -30px; z-index: 100; font-size: 22px;
	}

#btns_menu a{
	border-bottom: 4px solid #fff;
    color: #00a0df;
    display: inline-table;
    font-size: 20px;
   	padding: 25px 2.5%;
	outline: none;
	
	-webkit-transition: all .3s ease-in 0s;
	-moz-transition: all .3s ease-in 0s;
	-ms-transition: all .3s ease-in 0s;
	-o-transition: all .3s ease-in 0s;
	transition: all .3s ease-in 0s;
	}

#btns_menu a:hover, #btns_menu a.activo{
	color: #002855;
	border-bottom: 4px solid #00a0df;
	}

/* Dropdown Button */
.dropbtn {
    color: #00a0df ;
    border: none;
    cursor: pointer;
	background: none;
}

/* Dropdown button on hover & focus */
/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #002855;
    min-width: 100%;
	left:0;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
	width: 95%;
}

#btns_menu .dropdown a.activo{
	color: #002855;
	border-bottom: 4px solid #00a0df;
	}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #00a0df;}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {display:block;}

#demo{
	position: relative;
	z-index: 1;
	top: 40px;
	}

.item .caption{
    background: rgba(0, 40, 86, 0.5) none repeat scroll 0 0;
    bottom: 25%;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    left: 0;
    line-height: 19px;
    padding: 2%;
    position: absolute;
    width: 98%;
	margin: 0px;
	}

#bajar{
	position: relative;
	top: -6px;
	z-index:10;
	}

#eslogan{
	height: 134px;
	background: rgba(0, 0, 0, 0) url("../images/bg_eslogan.png") no-repeat scroll -728px 1px;
	text-align: center;
	}

#eslogan img {
    padding: 46px 0;
    width: 83%;
}

#bienvenidos {
    background: #00a0df url("../images/montanas.png") no-repeat scroll center bottom / cover ;
    color: #fff;
    font-size: 20px;
    padding: 0 0 150px;
}

.h1{
	font-size: 26px;
	}

#h1_flotante {
    float: left;
    text-align: left;
    width: 100%;
}

#bienvenidos p {
    float: left;
    width: 100%;
	}

#carrusel{
	background: #f1f1f2;
	position: relative;
	padding: 0px 0 100px 0;
	height: 300px;
	display: none;
	}

#lista_lineas{
	display: block;
	background: #f1f1f2;
	}

#lista_lineas h1{
	color: #0fa0db;
	padding: 20px;
	margin:0;
	}

#lista_lineas ul li{
	padding: 15px 20px;
	}

#lista_lineas ul li:nth-child(even){
	background: #fff;
	}

#lista_lineas a{
	font-size: 18px;
	}

#distri{
	height: auto;
	}

.flotante {
    float: none;
    height: 350px;
    width: 100%;
}

#dis_img{
	background: url(../images/img_distr.jpg) no-repeat left top / cover;
	}

#dis_txt{
	background: #e6e7e8 url(../images/bg_lineas.png) no-repeat right top / cover;
	}

#dis_txt h1 {
    color: #0fa0db;
    font-weight: 300;
    margin: 0;
    padding: 5% 10%;
}

#dis_txt p{
	color: #939597;
	font-size: 16px;
	padding: 0 10%;
	}

#logitos{
	background: #fff;
	text-align: center;
	padding: 50px 0;
	}

#w_contacto{
	color: #fff;
	}

#ofis{
	background: #002855 url(../images/bg_ofis.png) no-repeat right top / cover;
	padding: 200px 0;
	position: relative;
	}

.ofi_floatd {
    float: left;
    font-size: 16px;
    margin: 0 7%;
    width: 100%;
}

.ofi_floatd:nth-child(2){
	margin-left: 30px
	}

.ofi_float {
    float: left;
    font-size: 16px;
    margin-right: 5%;
    position: absolute;
    top: 0;
    width: 100%;
}

.ofi_float h1, .ofi_floatd h1{
	font-weight: 300;
	color: #00a0df;
	}

.canvas_w {
    bottom: 0;
    height: 50%;
    position: absolute;
    right: 0;
    width: 100%;
	}

#cont_form{
	background: #001b3e url(../images/bg_montas.png) repeat-x center bottom ;
	padding: 100px 0;
	}

.form_float{
	color: #00a0df;
    float: left;
    font-size: 18px;
    padding-right: 2%;
    width: 100%;
	}

.input{
	border: 0;
	background: #072347;
	color: #00a0df;
	font-size: 14px;
	width: 90%;
	padding: 15px 10px;
	margin: 0 0 8px 0;
	}

#cont_form h1{
	font-weight: 300;
	text-align: center;
	padding: 20px 0 0 0;
	display: block;
	}

#cont_form a{
	font-weight: 300;
	text-align: center;
	display: block;
	color: #00a0df;
	font-size: 25px;
	}

#footer{
	position: relative;
	background: #fff;
	display: none;
	}

#ft_logo{
	padding: 20px 0 10px 10%;
	color: #00a0df;
	width: 30%;
	float: left;
	}

#ft_logo img{
	float: left;
	}

#ft_datos{
	float:left;
	background: #f1f1f2;
	width: 55%;
	padding: 30px 5% 30px 0;
	text-align: right;
	font-size: 14px;
	}

#ft_datos ul li{
	display: inline;
	*display: inline-block;
	zoom: 1;
	color: #6d6e70;
	}

#bg_ft{
	background: url(../images/bg_ft.png) no-repeat left top;
	width: 258px;
	height: 22px;
	position: absolute;
	top: -18px;
	left: 0;
	}

/*--------------------conocenos----------------------------*/

.aqui{
	position: relative;
	width: 100%;
	padding: 120px 0;
	background: #00a0df;
	top: 0;
	}

.aqui h1{
	color: #fff;
	margin: 0 13%;
	}

#conocenos{
	background: url(../images/bg_conocenos.png) no-repeat center bottom / cover;
	}

#txt_cono{
	background: #fff;
	}

#txt_cono p{
	color: #00a0df;
	font-size: 18px;
	padding: 5% 20% 0;
	}

#con_img{
	background: url(../images/bg_cono.png) no-repeat top center / cover;
	}

.full_img{
	position: relative;
	width: 100%;
	height: 180px;
	}

#bg_full_1{
	background: url(../images/bg_full1.png) no-repeat center / cover;
	}

.diagonal_img{
	position: absolute;
	right: -150px;
	bottom: 0;
	background: url(../images/bg_diagonal.png);
	width: 342px;
	height: 29px;
	}

#frase_cono{
	background: #002855 url(../images/bg_ofis.png) center;
	padding: 100px 0;
	color: #fff;
	text-align: center;
	font-size: 18px;
	position: relative;                
	}

#w_mision{
	position: relative;
	background: url(../images/bg_bicolor.jpg) repeat-y center;
	}

#mision{
	background: #fff none repeat scroll 0 0;
    color: #6d6e70;
    float: left;
    font-size: 15px;
    padding: 7% 10% 20% 0;
    width: 100%;
	}

#vision {
    background: #f1f1f2 none repeat scroll 0 0;
    color: #6d6e70;
    float: left;
    font-size: 15px;
    padding: 7% 0 40% 10%;
    width: 90%;
}

#mision h1, #vision h1 {
	color: #00a0df;
	}

#bg_montanas{
	position: absolute;
	z-index: 1;
	width: 100%;
	height: 200px;
	bottom: 0;
	background: url(../images/montanas.png) no-repeat bottom / cover;
	}

#manifiesto{
	color: #fff;
	background: #0fa0db url(../images/bg_lineas2.png) no-repeat bottom center;
	padding: 80px 0 200px 0;
	font-size: 15px;
	position: relative;
	}

#manifiesto p{
	column-count: 1;
	-webkit-column-count: 1;
	-moz-column-count: 1;
	-ms-column-count: 1;
	}

#oso{
	position: absolute;
	bottom: -25px;
	right: 5%;
	z-index: 3;
	}

#eslogan_int{
	background: #002855;
	padding: 80px 0;
	text-align: center;
	}

#eslogan_int img{
	width: 90%;
	}

/*------------------clientes---------------*/

#clientes{
	background: url(../images/bg_clientes.png) no-repeat center / cover;
	}

#w_clientes{
	background: #e6e7e8;
	padding: 100px 0;
	}

.c_flotante{
	width: 46%;
	margin: 0 2% 2% 0;
	background: #fff;
	text-align: center;
	float: left;
	}

#bg_diagonal_gris {
    background: rgba(0, 0, 0, 0) url("../images/bg_gris.png") no-repeat scroll 0 0;
    bottom: 0;
    height: 29px;
    position: absolute;
    right: -160px;
    width: 100%;
}

/*----------------lineas------------------*/

.w_lineas_a{
	position: relative;
	background: #002855 url(../images/bg_lineas2.png) repeat-x center bottom;
	height: auto;
	}

.txt_lineas{
	color: #fff;
	font-size: 14px;
	width: 100%;
	float: left;
	padding: 5% 0;
	}

.txt_lineas2{
	color: #fff;
	font-size: 14px;
	width: 100%;
	float: left;
	padding: 5% 0;
	}

.lista_lineas li {
	list-style: outside url(../images/dot.png) ; 
	}

.bg_diagonal{
	position: absolute;
	left: -1px;
	top: -20px;
	background: url(../images/bg_ft.png) no-repeat;
	width: 342px;
	height: 29px;
}

.bg_diag_blanca{
	position: absolute;
	right: 0px;
	bottom: -20px;
	background: url(../images/bg_blanco.png) no-repeat;
	width: 280px;
	height: 21px;
	z-index: 4;
	}

#eslogan_int_img{
	background: #002855 url(../images/bg_lineas_1.jpg) no-repeat scroll 0 18% / cover;
	padding: 15% 0;
	text-align: center;
	position: relative;
	}

.slide_lineas {
    background: #ccc none repeat scroll 0 0;
    float: right;
    height: 100%;
    width: 100%;
}

#camion_img{
	height: 320px;
    left: 0%;
    position: absolute;
    top: -130px;
    width: 1000px;
	z-index: 9;
	}

.site-wrap 					{ min-height: 100%;min-width: 100%;background-color: white; position: relative;top: 0;bottom: 100%;left: 0;z-index: 1;background-size: 200%;}

.navigation 				{ width: 260px; height: 100%;position: absolute; top: 5px; bottom: 0;left: 0;z-index: 0;background: #002855;list-style: none; padding:0 0 50px 0; margin:0; display:block }
.navigation li 				{ border-bottom: 1px dotted #ccc; text-align: center; color: #7f0029; }
.navigation li.float		{ padding-left: 40px }
.navigation li.float a		{ display: inline-block; zoom: 1; *display: inline; }
.navigation li a 			{ display: block;padding: 1em 0 1em 30px;color: #00a0df;text-align: left;font-size: 1.2em;text-decoration: none;transition: color 0.2s, background 0.5s;}
.navigation li a.activo		{ color: #7f0029; }

.nav-trigger 				{ position: absolute;clip: rect(0, 0, 0, 0);display: none;}
label[for="nav-trigger"] 	{ display: block; position: absolute;left: 15px; top: 15px;z-index: 2; height: 30px;width: 30px;cursor: pointer;background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' x='0px' y='0px' width='30px' height='30px' viewBox='0 0 30 30' enable-background='new 0 0 30 30' xml:space='preserve'><rect width='30' height='6' fill='MidnightBlue'/><rect y='24' width='15' height='6' fill='MidnightBlue'/><rect y='12' width='30' height='6' fill='MidnightBlue'/></svg>");background-size: contain;
}

/*para abrir */
.nav-trigger + label, .site-wrap 	{transition: left 0.2s;}
.nav-trigger:checked + label 		{left: 290px;}
.nav-trigger:checked ~ .site-wrap 	{left: 260px;box-shadow: 0 0 5px 5px rgba(0,0,0,0.2);}

/*body								{overflow-x: hidden;}*/
.d-flex{display: flex; justify-content: space-between; flex-direction: column;}
.txt_lineas--2{width: 100%; color: #fff;font-size: 16px;width: 100%;float: left;line-height: 23px; padding: 70px 0;}

@media only screen and (min-width: 1023px) {

.txt_lineas--2				{width: 48%;}
.d-flex						{flex-direction: row;}
.navigation 				{ display: none }
label[for="nav-trigger"] 	{ display: none;}
.gridContainer 				{ width: 90.675%; padding-left: 1.1625%; padding-right: 1.1625%; }
#LayoutDiv1 				{ clear: both; float: left; margin-left: 0; width: 100%; display: block; }
#btns_menu a				{ padding: 25px 2% ; }
#manifiesto p				{ column-count: 3; -webkit-column-count: 3; -moz-column-count: 3; -ms-column-count: 3;}
.txt_lineas					{ font-size: 16px; }

.rotator					{ height: 240px;}
.rotator ul li a 			{ font-size: 18px;height: 28px;line-height: 48px;}
#top						{ position: fixed;}
#w_datos					{ display: block; }
#logo 						{ width: 390px; }
#logo img					{ margin-left: 0; }
#demo						{ top: 130px; }
#eslogan					{ background: url(../images/bg_eslogan.png) no-repeat center}
.item .caption				{ font-size: 40px; line-height: 40px; width: 510px; margin: -40px 0px;}
#bajar						{ top: 110px;}
#bienvenidos				{ padding: 50px 0 200px;}
#h1_flotante				{ width: 30%; float: left; text-align: right; }
#eslogan img				{ padding: 36px 0; width: auto; }
#bienvenidos p				{ width: 60%; float: right;}
#carrusel					{ display: block; }
#lista_lineas				{ display: none; }
#distri						{ height: 350px;}
.flotante					{ width: 50%;float:left;height: 350px;}
.ofi_float, .ofi_floatd		{ width: 21%; position:relative;}
.form_float					{ width: 31%;}
#footer						{ display: block; }

.aqui						{ top: 138px; }
.diagonal_img				{ right: 0px;}
#mision						{ width: 40%;}
#vision						{ padding: 7% 0 20% 10%;width: 40%;}
#eslogan_int img			{ width: auto;}
#bg_diagonal_gris			{ width: 342px; right: 0;}
.c_flotante					{ width: 23%; }
#ofis						{ padding: 100px 0;}
.canvas_w					{ right: 18%; top: 5%; width: 46%; height: 90%;}

.txt_lineas					{ width: 36%;}
.w_lineas_a					{ height: auto;}
.w_lineas_a.w_lineas_a--2	{ height: auto;}
.slide_lineas				{ width: 540px;}
.txt_lineas2				{ width: 40%;}
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 1232px) {
	
.gridContainer			{ width: 88.2%; max-width: 1232px; padding-left: 0.9%; padding-right: 0.9%; margin: auto; }
#LayoutDiv1 			{ clear: both; float: left; margin-left: 0; width: 100%; display: block; }
#btns_menu a			{ padding: 25.5px 3.5% ;}
.h1						{ font-size: 36px;}
.rotator ul li a		{ height: 40px;line-height:52px;font-size:20px;}
.rotator				{ height: 400px;}
.txt_lineas				{ font-size: 16px;}
#camion_img				{ left: 25%;}
#logo					{ padding-left: 12%;}
#titulo_slide			{ top: -19px; font-size: 30px;}

}

@media only screen and (min-width: 1919px) {

.gridContainer 			{ width: 88.2%; max-width: 1232px; padding-left: 0.9%; padding-right: 0.9%; margin: auto; }
#LayoutDiv1 			{ clear: both; float: left; margin-left: 0; width: 100%; display: block; }
#btns_menu a			{ padding: 25.5px 5.5% ;}

}