@charset "UTF-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/

invalid {
color:#ff0000;
}

.cleare				{ display: block; clear:both; }
a					{ outline: 0; text-decoration:none; }

body				{ font-family: 'Titillium Web', sans-serif; color: #58585b; line-height: 23px; background: #fff; }

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

/* IE 6 does not support max-width so default to width 100% */
.ie6 img 			{ width:100%; }

/* Mobile Layout: 480px and below. */
.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; }

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

.item .caption{
	position: absolute;
	font-size: 50px;
	width: 580px;
	line-height: 50px;
	left: 33%;
	margin: -50px -200px;
	height: 100px;
	top: 50%;
	color: #fff;
	}

#contacto_home span		{ padding: 35px 0px 0 80px; }

.cuadros p{
	padding: 20px 20px 0 120px;
	line-height: 20px;
	}

.h1 { color: #0078c1; font-size: 24px; font-weight: 400; display: block; width: 100%; padding-bottom: 20px }

.submenu_flotante_ser ul				{ padding: 0; margin: 0}
.submenu_flotante_ser ul li 			{ background: url(../images/flechita.png) no-repeat right center;}
.submenu_flotante_ser ul li a			{ color: #808284; display: block; padding: 10px 15px; font-size: 15px; border-bottom: 1px solid #ccc; }
.submenu_flotante_ser ul li a:hover		{ color: #fff; background: url(../images/flechita_over.png) no-repeat right center #00adef; }
.submenu_flotante_ser ul li a.activo	{ color: #fff; background: url(../images/flechita_over.png) no-repeat right center #00adef; }

#ruta								{ background: #082e4c; position:relative; width: 100%; padding: 10px 0; top: -13px; color: #fff; }
#ruta a								{ color: #fff; padding:0 20px}

[data-accordion] [data-content] 	{ overflow: hidden max-height: 0; }
[data-accordion] 					{ line-height: 1; }
[data-control]						{ padding: 15px; background: #00adef; border: 0; color: #fff; width: 100%; text-align:left; border-bottom: 1px solid #ccc; }
[data-control]:hover 				{ background: #0095cd; color: #fff; }
.active 							{ color: #fff; background-color: #00adef; }
article								{ padding: 15px 30px; background: #f1f2f2; border: 0; color: #808284; width: 100%; text-align:left; border-bottom: 1px solid #ccc; }
article a							{ color: #808284; }
article:hover						{ background: #e6e7e8; }
[data-content] [data-accordion] 	{ border: 0; padding: 0;background: #f1f2f2;}
[data-accordion] [data-control] 	{ position: relative; padding-right: 40px;}
[data-accordion] > [data-control]:after {content: ""; position: absolute; right: 10px; top: 12px; font-weight: 200; color: #444; height: 15px; width: 24px; background-size: 50%;}
[data-accordion].open > [data-control]:after {-webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg); }

#logos_prod								{ margin: 0; padding:0; background: #f1f1f2; margin: 10px 0 0 0; border: 6px solid #e6e7e8; }
#logos_prod li							{	display: inline-block; *display: block; zoom: 1; width: 24%;}

#lista ul li						{ list-style:inside url(../images/dot.png); }




@media only screen and (min-width: 320px) {
body{ background: #002543;}
#espacios			{ display: none; }
.gridContainer 				{ width: 100%; padding-left: 0; padding-right: 0; }
.LayoutDiv1					{ clear: both; float: left; margin-left: 0; width: 100%; display: block;}

#logo						{ width: 100%; text-align:center; margin-left: 20px;}
#menu, #redes_idioma		{ display: none; }
#demo						{ top: 0; }
.owl-theme .owl-controls	{ margin: -40px 0 0 -200px; position:relative; z-index: 9; width: 100px; left: 220px; display:none; }
.item .caption				{ font-size: 15px; width: 260px; line-height: 20px; left: 0; margin: -30px 20px; height: 100px; top: 60%; text-shadow: 0 0 5px rgba(0,0,0,0.9); -moz-text-shadow: 0 0 5px rgba(0,0,0,0.9); -ms-text-shadow: 0 0 5px rgba(0,0,0,0.9); -o-text-shadow: 0 0 5px rgba(0,0,0,0.9); -webkit-text-shadow: 0 0 5px rgba(0,0,0,0.9); }

#w_welcome					{ background: url(../images/bg_welcome.png) no-repeat center;background-size: cover; padding: 5% 0;color: #fff;font-size: 14px;position: relative; line-height: 20px}
#txt_welcome				{ display: none; }
#txt_intro					{ max-width: 100%; padding-left:2%; text-align: left; }

.navigation 				{ width: 200px; height: 100%;position: absolute; top: 0; bottom: 0;left: 0;z-index: 0;background: #002543;list-style: none; padding:0 0 50px 0; margin:0; display:block; }
.navigation li 				{ border-bottom: 1px solid #003c5f; text-align: center; color: #fff; }
.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;background: #002543;color: white;text-align:center;font-size: 1.2em;text-decoration: none;transition: color 0.2s, background 0.5s;}

.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%;}

.nav-trigger 				{position: absolute;clip: rect(0, 0, 0, 0);display: none;}
label[for="nav-trigger"] 	{ 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'/><rect y='24' width='30' height='6'/><rect y='12' width='30' height='6'/></svg>");background-size: contain;
}

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

body								{overflow-x: hidden;}

#centro_home			{ padding: 0; background: none; width: 100%; margin:0 }
.cuadros				{ width: 100%; margin: 0 1% 0 0;  position:relative; height: 61px; font-size: 16px; }
.cuadros p				{ display: none; }
.cuadros h1				{ color: #fff; font-size: 18px; padding: 20px 0 0 20px; display:block; }
#productos_home			{ background: url(../images/bg_productos_home_iphone.png) no-repeat left bottom; }
#services_home			{ background: url(../images/bg_services_home_iphone.png) no-repeat left bottom }
#contacto_home			{ background: url(../images/bg_contacto_home_iphone.png) no-repeat left bottom #e21a22; color: #fff; }
#contacto_home p,
#contacto_home span		{ display: none;}
.btn_mas				{ display: none; }

#bg_imagen_full, #mapa	{ display:none; }
#footer					{ display: none; }
#footerIphone			{ display: block; width: 100%; background: #002543; padding: 15px 0; color:#fff; font-size: 11px; }
.bg_imagen_full_top		{ position: relative; width: 100%; height: 25px; background: url(../images/bg_franja.jpg) no-repeat; background-size: cover; color: #fff; font-size: 30px; text-align: left; padding: 40px 10px; top: -13px;}

#bg_about_azul			{ background: #0078c1; color: #fff; position:relative; top: -13px; padding: 50px 20px 60px; }
.txt_flotante_ab		{ padding-left: 20px; padding-right: 20px; margin-top: 20px}
#bg_facilities			{  width: 100%; background: #f1f1f2; padding: 50px 20px; }
.flotantes_ciudades		{ padding: 20px }

#bg_anti				{  width: 100%; background: #f1f1f2; padding: 50px 20px; }
#bg_anti p				{ -webkit-column-count: 3;-moz-column-count: 3; column-count: 3; }

#ciudades				{ background: #e6e7e8; }
#safety					{ padding: 50px 20px; width: 90%; }

.submenu_flotante_ser					{ width: 100%; margin: 0px 10px 70px 0;background:#f1f1f2;}
.submenu_flotante_ser ul li 			{ background: url(../images/flechita.png) no-repeat right center;}
.submenu_flotante_ser ul li a			{ color: #808284; display: block; padding: 10px 15px; font-size: 15px; border-bottom: 1px solid #ccc; }
.submenu_flotante_ser ul li a.activo	{ color: #fff; background: url(../images/flechita_over.png) no-repeat right center #00adef; }

#multiple								{ margin: 50px 0 20% 0; padding-left: 20px; padding-right: 20px; }
#upstream								{ margin: 40px 0}
.lista_up								{ position: relative; width: 100%; margin: 20px 0; padding: 0 }
.lista_up li							{ width: 44%; color: #fff; height: 43px; float:left; margin: 0 1% 10px 0; font-size: 16px; text-align:center; padding: 100px 0 0 0}
#exploration							{ background: url(../images/up_exploration.png) no-repeat center; background-size: cover; }
#production								{ background: url(../images/up_production.png) no-repeat center; background-size: cover; }
#gathering								{ background: url(../images/up_gathering.png) no-repeat center; background-size: cover; }
#processing								{ background: url(../images/up_processing.png) no-repeat center; background-size: cover; }
#transmission							{ background: url(../images/up_transmission.png) no-repeat center; background-size: cover; }
#natural								{ background: url(../images/up_natural.png) no-repeat center; background-size: cover; }
#gas									{ background: url(../images/up_gas.png) no-repeat center; background-size: cover; }
#lng									{ background: url(../images/up_lng.png) no-repeat center; background-size: cover; }

#oil									{ background: url(../images/down_oil.png) no-repeat center; background-size: cover; }
#petrochemical							{ background: url(../images/down_petrochemical.png) no-repeat center; background-size: cover; }
#refining								{ background: url(../images/down_refining.png) no-repeat center; background-size: cover; }
#power									{ background: url(../images/down_power.png) no-repeat center; background-size: cover; }
#pulp									{ background: url(../images/down_pulp.png) no-repeat center; background-size: cover; }
#pharmaceutical							{ background: url(../images/down_pharmaceutical.png) no-repeat center; background-size: cover; }
#food									{ background: url(../images/down_food.png) no-repeat center; background-size: cover; }

#logos_prod li							{	display: inline-block; *display: block; zoom: 1; width: 45%;}

#bg_anti p					{ -webkit-column-count: 1;-moz-column-count: 1; column-count: 1; padding-right: 30px }

#bg_about_red				{ background: #e54a21; color: #fff; position:relative; top: -13px; padding: 50px 20px 60px 20px;}
.content 					{ padding-left: 30px; padding-right: 30px; }
.content .h1				{ margin-bottom: 5px; margin-top: 20px; }

#tab-1, #tab-2, #tab-3, #tab-4,
#tab-5, #tab-6, #tab-7, #tab-8,
#tab-9, #tab-10, #tab-11, #tab-12,
#tab-13, #tab-14, #tab-15, #tab-16{ display: none;}

.tab-label-1, .tab-label-2, .tab-label-3, .tab-label-4,
.tab-label-5, .tab-label-6, .tab-label-7, .tab-label-8,
.tab-label-9, .tab-label-10, .tab-label-11, .tab-label-12,
.tab-label-13, .tab-label-14, .tab-label-15, .tab-label-16 { display: none; }

/*----------------------------contacto-------------------------------------*/
#w_contaco					{ padding: 0 20px }
.flotante_contacto			{ width: 85%; padding: 0 4% 0 0; }
.flotante_contacto span		{ color: #e54a21; font-size: 18px; }
.flotante_contactor			{ float:left; width: 68%; padding: 0 2% 0 0; }

.input_contact				{ background: #f1f2f2; padding: 10px; border: 0; width: 100%; margin-bottom: 5px; color: #000 }
.input_contact:hover		{ background: #e6e7e8; }
#noflotante_iphone			{ clear:both; width: 90%; }
#disclaimers				{ width: 80%; font-size: 11px; line-height: 15px; color: #999; padding: 20px 0 }
#mapa.verIphone				{ position:relative; width: 100%; height: 360px; z-index: 1; display:block; }
#map_canvas					{ position:absolute; width: 100%; height: 100%; }
#direccion_mapa 			{ position: absolute; z-index: 99999; width: 500px; height: 122px; top: 20px; left: 10%; }
#txt_map					{ width: 237px; float:left; background: #fff; padding: 20px; font-size: 15px; }
#img_pin_mapa				{ width: 73px; float:left; }

.privacy					{ margin: 0px 20px;}
.privacy span				{ color: #e54a21; font-size: 17px;}

.imgalign 					{ text-align:center; }
.btn_brochure				{ margin: 20px 0 20px 0; margin: 0 auto; padding: 0 0 20px 10%; }
}






@media only screen and (min-width: 1023px) {
label				{ display: none; }
#iphonesub			{ display: none; }
#espacios			{ display: block; }
.gridContainer 		{ width: 88.5%;max-width: 1232px;padding-left: 0.75%;padding-right: 0.75%;margin: auto; }
.LayoutDiv1 		{ clear: both;float: left;margin-left: 0;width: 100%;display: block; }
#top				{ background: url(../images/bg_top_menu.png) no-repeat left top ;position: relative;width: 100%;z-index:999; display: block; }

.navigation 		{ display: none; }

.top_flotante		{float: left;}
#logo				{ width: 25%;padding: 10px 2.5% 0 2.5%;}
#menu				{ width: 48%;margin: 4px 0 0 0;padding: 0;position:relative; display:block; }
#menu ul 			{ padding: 0;margin: 0 ;list-style:none; }
#menu ul li			{ display: inline-block;*display: block;zoom: 1;}
#menu ul li a		{ color: #082e4c;font-weight: 400;font-size: 15px;height: 80px;display:inline-block;padding: 35px 12px 0px;background:url(../images/bg_menu_blanca.png) no-repeat top center; 
					-webkit-transition: all 0.3s ease-in 0s;-moz-transition: all 0.3s ease-in 0s;-ms-transition: all 0.3s ease-in 0s;-o-transition: all 0.3s ease-in 0s;transition: all 0.3s ease-in 0s;}

#menu ul li.bg_btn_menu:hover a			{ background:url(../images/bg_menu_1.png) no-repeat top center; color: #fff; }
#menu ul li.bg_btn_menu a.activo		{ background:url(../images/bg_menu_1.png) no-repeat top center; color: #fff; }
#menu ul li.sinpadding					{ padding-right: 0;}

#redes_idioma					{ float:right;width: 20%;text-align:right;padding: 20px 0 0 0; display:block; }
#redes_idioma ul				{ margin: 10px 0 0 0;padding: 0;}
#redes_idioma ul li 			{ float: left;}
#redes_idioma ul li a 			{ border-right: 1px solid #e6e7e8;
								-webkit-transition: all 0.3s ease-in 0s;-moz-transition: all 0.3s ease-in 0s;-ms-transition: all 0.3s ease-in 0s;-o-transition: all 0.3s ease-in 0s;transition: all 0.3s ease-in 0s;}

#redes_idioma #bg_linkedin			{ background: url(../images/linkedin.png) no-repeat 50%; width: 35px; height: 35px; display:inline-block; }
#redes_idioma #bg_face				{ background: url(../images/face.png) no-repeat 50%;  width: 35px; height: 35px; display:inline-block; }
#redes_idioma #bg_twitter			{ background: url(../images/twitter.png) no-repeat 50%;  width: 35px; height: 35px; display:inline-block;}

#redes_idioma #bg_linkedin:hover	{ background: url(../images/linkedin_color.png) no-repeat 50%; width: 35px; height: 35px; display:inline-block; }
#redes_idioma #bg_face:hover		{ background: url(../images/face_color.png) no-repeat 50%;  width: 35px; height: 35px; display:inline-block; }
#redes_idioma #bg_twitter:hover		{ background: url(../images/twitter_color.png) no-repeat 50%;  width: 35px; height: 35px; display:inline-block;}

#btn_idiomas{
	color: #fff; background: #e54a21; display:inline-block; padding: 5px 15px; top: 5px; margin-right: 10px; position:relative; }

#btn_idiomas:hover					{ background: #00adef; }
#redes_idioma ul li.sin_border		{ border: 0; margin: 0 0 0 7%; }
#demo								{ position: relative; top: -13px; }
.item .caption						{ position: absolute; font-size: 40px; width: 500px; line-height: 50px; left: 28%; margin: -50px -200px; height: 100px; top: 50%; color: #fff; }

#w_welcome							{	background: url(../images/bg_welcome.png) no-repeat center; background-size: cover; padding: 50px 0; color: #fff; font-size: 16px; position: relative; top: -15px; }
#txt_welcome						{ display: block; font-size: 40px; float: left; width: 20%; }
#txt_intro							{	float: right; text-align:left; max-width: 75%; padding-left: 5%; background: url(../images/diagonal.png) no-repeat left top; }
#centro_home						{ padding: 70px 0 80px; background: #e6e7e8; }

.cuadros							{ width: 32%; margin: 0 1% 0 0; float:left; position:relative; height: 217px; font-size: 14px; }
.cuadros p				{ display:block; }
.cuadros a				{ color: #58585b}

#productos_home			{ background: url(../images/bg_productos_home.png) no-repeat left bottom #f1f1f2; }
#services_home			{ background: url(../images/bg_services_home.png) no-repeat left bottom #f1f1f2; }
#contacto_home			{ background: url(../images/bg_contacto_home.png) no-repeat left bottom #e21a22; color: #fff;  }

#contacto_home p		{ display:block; }
#contacto_home span		{ display: inline;}

.cuadros h1{
	color: #082e4c;
	background: url(../images/bg_cuadros_lineas.png) no-repeat left bottom #fff;
	font-size: 22px;
	padding: 15px 0 20px 20px;
	}

.btn_mas{
	position:absolute;
	width: 100%;
	text-align:center;
	bottom: -15px;
	display: block;
	}

#bg_imagen_full{
	position: relative;
	width: 100%;
	height: 25px;
	background: url(../images/bg_franja.jpg) no-repeat;
	background-size: cover;
	color: #fff;
	font-size: 30px;
	text-align:right;
	padding: 40px 0;
	display:block;
	}

.bg_imagen_full_top{
	position: relative;
	width: 100%;
	height: 25px;
	background: url(../images/bg_franja.jpg) no-repeat;
	background-size: cover;
	color: #fff;
	font-size: 30px;
	text-align: left;
	padding: 40px 0;
	top: -13px;
}

.bg_imagen_full_top p	{ padding: 0 0 0 40px; }
#bg_imagen_full p	{ padding: 0 40px 0 0}

#mapa				{ position:relative; width: 100%; height: 360px; z-index: 1; display:block; }
#map_canvas			{ position:absolute; width: 100%; height: 100%; }
#direccion_mapa 	{ top: 40px; left: 13%; }
#img_pin_mapa		{ width: 73px; float:left; }
#txt_map			{ width: 237px; float:left; background: #fff; padding: 20px; font-size: 17px; }

#footerIphone		{ display: none; }
#footer				{ background: url(../images/bg_footer.png) no-repeat 36% 0 #002543; color: #fff; font-size: 11px; position:relative; display:block; }
#logo_footer		{ float: left; width: 40%; padding: 20px 0; }
#txt_footer			{ float:left; width: 60%; padding: 20px 0; margin: 1px 0 0 0;}
#txt_footer ul li	{ display:inline-block; *display: inline; zoom: 1; padding: 0 15px}
#privacidad			{ padding: 10px; background: #002543; color: #fff;}

/*-----------------------------------About-------------------------------------*/

#bg_about_azul{
	background: #0078c1;
	color: #fff;
	position:relative;
	top: -13px;
	padding: 50px 0 60px 0;
	}

#bg_about_azul p{
	font-size: 16px;
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
	}

#bg_img_chica{
	height: 36px;
	width: 100%;
	position: relative;
	top: -13px;
	background: url(../images/bg_img_chica.png) no-repeat;
	background-size: cover;
	}

.txt_flotante_ab{
	float:left;
	width: 48%;
	padding: 50px 2% 80px 0;
	}

.txt_flotante_ab p{
	-webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
	}



#bg_facilities{
	position: relative;
	width: 100%;
	background: #f1f1f2;
	padding: 50px 0;
	margin: 0;
	}

.Flotante_facilities{
	float:left;
	width: 35%;
	padding: 0 2% 0 0;
	}

#republica{
	width:60%;
	float:right;
	text-align:center;
	}

#ciudades{
	position: relative;
	width: 100%;
	background: #e6e7e8;
	padding: 50px 0;
	}

.flotantes_ciudades{
	float: left;
	width: 30%;
	margin: 0 2% 0 0;
	padding:0;
	}

#safety{
	padding: 50px 0;
	}

#safety p{
	-webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
	width: 70%;
	float:left;
	}

#safety span{
	color: #003c5f;
	font-weight: 700;
	padding: 5px;
	background: #f1f2f2;
	display:block;
	margin-bottom: 5px;
	}

#bg_anti p					{ -webkit-column-count: 3;-moz-column-count: 3; column-count: 0; padding-right: 0px }

/*--------------------servicios----------------------------------------------*/

#bg_about_red{
	background: #e54a21;
	color: #fff;
	position:relative;
	top: -13px;
	padding: 50px 0 60px 0;
	}

#bg_about_red p				{ font-size: 18px;}

#txt_ser{
	float: right;
	width: 70%;
	padding: 50px 0;
	}

.tabs {
    position: relative;
	margin: 40px auto;
}

.tabs input#tab-2			{left: 120px;}
.tabs input#tab-3			{left: 240px;}
.tabs input#tab-4			{left: 360px;}
.tabs input#tab-5			{left: 480px;}
.tabs input#tab-6			{left: 600px;}
.tabs input#tab-7			{left: 720px;}
.tabs input#tab-8			{left: 840px;}
.tabs input#tab-9			{left: 1000px;}
.tabs input#tab-10			{left: 1120px;}
.tabs input#tab-11			{left: 1240px;}
.tabs input#tab-12			{left: 1360px;}
.tabs input#tab-13			{left: 1480px;}
.tabs input#tab-14			{left: 1600px;}
.tabs input#tab-15			{left: 1720px;}
.tabs input#tab-16			{left: 1840px;}
.tabs input#tab-17			{left: 1960px;}
.tabs input#tab-18			{left: 2080px;}
.tabs input#tab-19			{left: 2200px;}
.tabs input#tab-20			{left: 2320px;}

.tabs input {
	position: absolute;
	z-index: 1000;
	width: 28%;
	left: 0px;
	top: 0px;
	opacity: 0;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
	cursor: pointer;
}
.tabs input#tab-2			{top: 40px;}
.tabs input#tab-3			{top: 80px;}
.tabs input#tab-4			{top: 120px;}
.tabs input#tab-5			{top: 160px;}
.tabs input#tab-6			{top: 200px;}
.tabs input#tab-7			{top: 240px;}
.tabs input#tab-8			{top: 280px;}
.tabs input#tab-9			{top: 160px;}
.tabs input#tab-10			{top: 200px;}
.tabs input#tab-11			{top: 240px;}
.tabs input#tab-12			{top: 280px;}
.tabs input#tab-13			{top: 320px;}
.tabs input#tab-14			{top: 360px;}
.tabs input#tab-15			{top: 400px;}
.tabs input#tab-16			{top: 440px;}
.tabs input#tab-17			{top: 480px;}
.tabs input#tab-18			{top: 520px;}
.tabs input#tab-19			{top: 560px;}
.tabs input#tab-20			{top: 600px;}

.tabs label {
	background: #f1f1f2;
	font-size: 15px;
	position: relative;
	padding: 10px 0px 10px 20px;
	display: block;
	width: 28%;
	color: #808284;
	float: left;
	clear: both;
	border-bottom: solid 1px #ccc;
	
	-webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    transition: all linear 0.3s;
}

.tabs label:after {
    content: '';
	position: absolute;
	right: -2px;
	top: 0;
	width: 2px;
	height: 100%;
}

.tabs input:hover + label {
	background: #00adef;
	color: #fff;
}

.tabs label:first-of-type 	{z-index: 20;}
.tab-label-2 				{z-index: 19;}
.tab-label-3 				{z-index: 18;}
.tab-label-4 				{z-index: 17;}
.tab-label-5 				{z-index: 16;}
.tab-label-6			 	{z-index: 15;}
.tab-label-7 				{z-index: 14;}
.tab-label-8 				{z-index: 13;}
.tab-label-9 				{z-index: 12;}
.tab-label-10 				{z-index: 11;}
.tab-label-11 				{z-index: 10;}
.tab-label-12				{z-index: 9;}
.tab-label-13				{z-index: 8;}
.tab-label-14				{z-index: 7;}
.tab-label-15			 	{z-index: 6;}
.tab-label-16				{z-index: 5;}
.tab-label-17				{z-index: 4;}
.tab-label-18				{z-index: 3;}
.tab-label-19			 	{z-index: 2;}
.tab-label-20				{z-index: 1;}

.tabs input:checked + label {
    background: #00adef;
	z-index: 6;
	color:#fff;
}

.clear-shadow {
	clear: both;
}

.content {
    width: 60%;
	margin: -250px 0 0 120px;
	z-index: 5;
	height: 800px;
	top: 0;
	overflow: hidden;
	z-index: 99;
}

.content .h1						{ border-bottom: 1px solid #ccc; margin-bottom: 25px; margin-top: 0; }
.content .flotante_man				{ float: left; width: 48%; padding-right: 2%; line-height: 20px; }
.content .btn_brochure				{ margin: 20px 0 0 0; margin: 0 auto; padding: 0 0 0 15%; }

.content div {
    position: absolute;
	top: 0;
	padding: 0px 40px;
	z-index: 1;
    opacity: 0;
    -webkit-transition: all linear 0.5s;
    -moz-transition: all linear 0.5s;
    -o-transition: all linear 0.5s;
    -ms-transition: all linear 0.5s;
    transition: all linear 0.5s;
}

.content div{
	-webkit-transform: translateY(-30px);
	-moz-transform: translateY(-30px);
	-o-transform: translateY(-30px);
	-ms-transform: translateY(-30px);
	transform: translateY(-30px);
}

.content-1 ul li{ list-style-image: url(../images/dot.png); list-style-position:inside; background: #f1f2f2; padding: 5px 10px; width: 350px }

.tabs input.tab-selector-1:checked ~ .content .content-1,
.tabs input.tab-selector-2:checked ~ .content .content-2,
.tabs input.tab-selector-3:checked ~ .content .content-3,
.tabs input.tab-selector-4:checked ~ .content .content-4,
.tabs input.tab-selector-5:checked ~ .content .content-5,
.tabs input.tab-selector-6:checked ~ .content .content-6,
.tabs input.tab-selector-7:checked ~ .content .content-7,
.tabs input.tab-selector-8:checked ~ .content .content-8,
.tabs input.tab-selector-9:checked ~ .content .content-9,
.tabs input.tab-selector-10:checked ~ .content .content-10,
.tabs input.tab-selector-11:checked ~ .content .content-11,
.tabs input.tab-selector-12:checked ~ .content .content-12,
.tabs input.tab-selector-13:checked ~ .content .content-13,
.tabs input.tab-selector-14:checked ~ .content .content-14,
.tabs input.tab-selector-15:checked ~ .content .content-15,
.tabs input.tab-selector-16:checked ~ .content .content-16,
.tabs input.tab-selector-17:checked ~ .content .content-17,
.tabs input.tab-selector-18:checked ~ .content .content-18,
.tabs input.tab-selector-19:checked ~ .content .content-19,
.tabs input.tab-selector-20:checked ~ .content .content-20{
    -webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-o-transform: translateY(0px);
	-ms-transform: translateY(0px);
	transform: translateY(0px);
    z-index: 100;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-transition: all ease-out 0.3s 0.3s;
    -moz-transition: all ease-out 0.3s 0.3s;
    -o-transition: all ease-out 0.3s 0.3s;
    -ms-transition: all ease-out 0.3s 0.3s;
    transition: all ease-out 0.3s 0.3s;
}

.clear-shadow {
	clear: both;
}

.content {
   height: 450px;
    margin: -170px 0 0 120px;
    overflow: hidden;
    padding: 0;
    top: 0;
    width: 60%;
    z-index: 99;
}

.content .h1						{ border-bottom: 1px solid #ccc; margin-bottom: 25px }
.content .flotante_man				{ float: left; width: 48%; padding-right: 2%; line-height: 20px; }
.content .btn_brochure				{ margin: 20px 0 0 0; margin: 0 auto; padding: 0 0 0 15%; }

.tabs label 						{ width: 28%; }
.content div {
	position: absolute;
	padding: 0px 40px;
	z-index: 1;
    opacity: 0;
    -webkit-transition: all linear 0.5s;
    -moz-transition: all linear 0.5s;
    -o-transition: all linear 0.5s;
    -ms-transition: all linear 0.5s;
    transition: all linear 0.5s;
}

/*-----------------------------producto-------------------------------------*/

.submenu_flotante_ser					{ width: 27%;float:left; margin: 50px 10px 70px 0;background:#f1f1f2;}


#upstream								{ margin: 40px 0}
#upstream h1.h1							{ background: url(../images/bg_upstream.png) no-repeat left center; height: 40px; padding: 10px 0 0 90px; width: 94%; }
.lista_up								{ position: relative; width: 100%; margin: 20px 0; padding: 0 }
.lista_up li							{ width: 24%; color: #fff; height: 43px; float:left; margin: 0 1% 10px 0; font-size: 16px; text-align:center; padding: 100px 0 0 0}
#downstream								{ margin: 40px 0}
#downstream h1.h1						{ background: url(../images/bg_downstream.png) no-repeat left center; height: 40px; padding: 10px 0 0 90px; width: 94%; }
#exploration							{ background: url(../images/up_exploration.png) no-repeat center; background-size: cover; }
#production								{ background: url(../images/up_production.png) no-repeat center; background-size: cover; }
#gathering								{ background: url(../images/up_gathering.png) no-repeat center; background-size: cover; }
#processing								{ background: url(../images/up_processing.png) no-repeat center; background-size: cover; }
#transmission							{ background: url(../images/up_transmission.png) no-repeat center; background-size: cover; }
#natural								{ background: url(../images/up_natural.png) no-repeat center; background-size: cover; }
#gas									{ background: url(../images/up_gas.png) no-repeat center; background-size: cover; }
#lng									{ background: url(../images/up_lng.png) no-repeat center; background-size: cover; }

#oil									{ background: url(../images/down_oil.png) no-repeat center; background-size: cover; }
#petrochemical							{ background: url(../images/down_petrochemical.png) no-repeat center; background-size: cover; }
#refining								{ background: url(../images/down_refining.png) no-repeat center; background-size: cover; }
#power									{ background: url(../images/down_power.png) no-repeat center; background-size: cover; }
#pulp									{ background: url(../images/down_pulp.png) no-repeat center; background-size: cover; }
#pharmaceutical							{ background: url(../images/down_pharmaceutical.png) no-repeat center; background-size: cover; }
#food									{ background: url(../images/down_food.png) no-repeat center; background-size: cover; }

#logos_prod li							{	display: inline-block; *display: block; zoom: 1; width: 24%;}

#multiple							{ margin: 50px 0 20% 0; width: 65%; float: right; padding-left: 0; padding-right: 0; }
#multiple .h1						{ background:url(../images/bg_top_menu.png) no-repeat bottom left; }
#multiple p.dosc					{  -webkit-column-count: 2; -moz-column-count: 2; column-count: 2;}



/*----------------------------contacto-------------------------------------*/
#w_contaco					{ padding: 50px 0; }
.flotante_contacto			{ float:left; width: 28%; padding: 0 4% 0 0; }
#noflotante_iphone			{ width: 28%; }
.flotante_contacto span		{ color: #e54a21; font-size: 18px; }
.flotante_contactor			{ float:left; width: 68%; padding: 0 2% 0 0; }

.input_contact				{ background: #f1f2f2; padding: 10px; border: 0; width: 100%; margin-bottom: 5px; color: #000 }
.input_contact:hover		{ background: #e6e7e8; }
#disclaimers				{ float: right; width: 70%; font-size: 11px; line-height: 15px; color: #999 }


/*------------------------------privacy------------------------------------*/

.privacy{
	margin: 60px 0;
	}

.privacy span{
	color: #e54a21;
	font-size: 17px;
	}

/*-----------------------------producto detalle--------------------------------*/

.h1						{ border-bottom: 1px solid #ccc; margin-bottom: 25px }
.flotante_man			{ float: left; width: 48%; padding-right: 2%; line-height: 200px; }
.btn_brochure			{ margin: 20px 0 0 0; margin: 0 auto; padding: 0 0 0 15%; }

}






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


#logo				{ width: 240px; }
#top				{ display:block;}
#menu				{ width: 687px; display:block; }
#menu ul li a		{ font-size: 17px; padding: 35px 20px 0px; }
#redes_idioma		{ width: 200px;}

.item .caption						{ font-size: 48px; width: 580px; }


#contacto_home p		{ font-size: 15px }

.cuadros			{ width: 32%;
	margin: 0 1% 0 0;
	float:left;
	position:relative;
	height: 217px; }

.content .h1						{ border-bottom: 1px solid #ccc; margin-bottom: 25px }
.content .flotante_man				{ float: left; width: 48%; padding-right: 2%; line-height: 20px; }
.content .btn_brochure				{ margin: 20px 0 0 0; margin: 0 auto; padding: 0 0 0 15%; }
.content div 						{left:28%;}

#footer								{ background: url(../images/bg_footer.png) no-repeat center top #002543;}
}