@import url('css/tipografias.css');

/*   
Theme Name: MEMORIA COPEC 2014
Theme URI: 
Description: 
Author: 
Author URI: 
Version: 1
*/

.filiales h3 {
 margin-left: 30px !important;
}
html, body {
	margin: 0 auto 0 auto;
	padding: 0;
    /*width:100%;*/
	width: 1280px;
    height:100%;
	font-family: "foundrymonolineregular", sans-serif;
}

a {
	text-decoration: none;
}

.slide 
{
    width:100%;
    height: 100%;
}

#slide-1 
{    
	/*background: url('images/portada.jpg') no-repeat fixed top;*/
    /*background-size: cover;*/
	/*background-color: red;*/
}
#nuves {
    background: url('images/bg-nubes.jpg') no-repeat fixed center;
    height: 100%;
    background-size: cover;
}
#icon-next-offset
{
	position: absolute;
    top: 85%;
	left: 50%;
}
#icon-next
{
	position: relative;
	left: -50%;
	
}
#icon-next img
{
	display: block;
	margin: 0px auto 0px auto;
	
}
#icon-next p
{
	margin: 10px;
	color: #bcbcbc;
	text-align: center;
}
#icon-next:hover
{
	cursor: pointer;
}

#portada-2014 {
    background: url('images/portada-transparente.png') no-repeat center center;
    height: 100%;
    background-size: cover;
}

#slide-2 
{
	position: relative;
	background: url('images/utilidades.jpg') no-repeat center top;
	height: 755px !important;
	padding-top: 120px;
    /*background: url('../images/utilidades.jpg') no-repeat center center;*/
    /*background-size: cover;*/
	/*background-color: green;*/
}
#mouse-offset
{
	position: absolute;
	top: 570px;
	left: 50%;
}
#mouse
{
	position: relative;
	left: -50%;
	
}
#mouse img
{
	display: block;
	margin: 0px auto 0px auto;
	
}
#mouse p
{
	margin: 10px;
	color: #2E3373;
	text-align: center;
}

#slide-3
{
	
	box-sizing: border-box;
	/*padding-top: 30px;*/
}

.slide-rect 
{
    width:100%;
    height:370px;
    transition: height 1s;
}
.right-panel-content p
{
    margin: 20px 0px 20px 0px;
}
.right-panel-content h1
{
    margin: 20px 0px 20px 0px;
}
.right-panel-content
{
	display: none;
}
.slide-rect:hover .right-panel-content
{
	display: block;
}

/*.right-panel:hover*/
.slide-rect:hover .right-panel
{
	background-color: rgba(0,0,0,0.6);
}
.slide-rect:hover
{
	cursor: pointer;
}
.slide-rect:hover #nosotros
{
	display: block;
}
#rect-1
{    
	background: url('images/nosotros.jpg') no-repeat center bottom;
}
#nosotros
{
	display: none;
	float: right;
	box-sizing: border-box;
	width: 530px;
	text-align: right;
	color: white;
	margin-right: 60px;
	font-size: 0.9em;
	margin-top: 110px;
	/*background-color: rgba(0,0,0,0.6);*/
	/*transition: display 1s;*/
}
#nosotros p
{
	margin: 20px 0px 20px 0px;
}
#nosotros-right-panel:hover #nosotros
{
	display: block;
}
#nosotros-right-panel:hover
{
	background-color: rgba(0,0,0,0.6);
}
#nosotros-right-panel:hover #nosotros
{
    display: block;
}
#cifras
{
    display: none;
}
#cifras-right-panel:hover #cifras
{
    display: block;
}
#hitos
{
    /*display: none;*/
}
#hitos-right-panel:hover #hitos
{
    display: block;
}
#negocios
{
    display: none;
}
#negocios-right-panel:hover #negocios
{
    display: block;
}
 
.right-panel:hover
{
    background-color: rgba(0,0,0,0.6);
}
#rect-2
{    
	background: url('images/cifras.jpg') no-repeat center bottom;
}
#rect-3
{    
	background: url('images/hitos.jpg') no-repeat center bottom;
}
#rect-4
{    
	background: url('images/negocios.jpg') no-repeat center bottom;
}
#rect-5
{    
	background: url('images/internacional.jpg') no-repeat center bottom;
}
#rect-6
{    
	background: url('images/sustentabilidad.jpg') no-repeat center bottom;
}
#rect-7
{    
	background: url('images/nuestra_gente.jpg') no-repeat center bottom;
}
#rect-8
{    
	background: url('images/filiales.jpg') no-repeat center bottom;
}
.hide-now
{
    display:  none !important;
}
.div-top-bar
{
    height: 120px !important;
    background-position-y: center !important;
    /*opacity: 0.6 !important;*/
}
.opaque-on-top
{
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0);
}
.opaque-now
{
    background-color: rgba(0,0,0,0.6) !important;
}
 
.top-bar
{
    display: none;
    width:100%;
    height: 120px;
    position: relative;
}
.top-bar a
{
    bottom: 40%;
    color: white;
    position: absolute;
    right: 20px;
    text-decoration: none;
}
.show-now
{
    display: block !important;
}
 
.content
{
    width: 100%;
    height: 0px;
    transition: height 1.5s;
    overflow: hidden;
}
.content iframe
{
    width: 100%;
    /*height: 100%;*/
    height: 100%;
}

/** custom iframes height here **/
#rect-1-content.show-rect-now {height: 600px !important;}
#rect-2-content.show-rect-now {height: 578px !important;}
#rect-3-content.show-rect-now {height: 1180px !important;}
#rect-4-content.show-rect-now {height: 605px !important;}
#rect-5-content.show-rect-now {height: 600px !important;}
#rect-6-content.show-rect-now {height: 576px !important;}
#rect-7-content.show-rect-now {height: 594px !important;}
#rect-8-content.show-rect-now {height: 580px !important;}

.left-panel
{
	float: left;
	height: 100%;
	width: 330px;
	/*opacity: 0.6;*/
	background-color: rgba(0,0,0,0.6);
	color: white;
	position: relative;
}

.rect-title
{
	position: absolute;
	bottom: 40px;
}
.rect-title h2
{
	/*opacity: 1;*/
	z-index: 10;
	font-size: 1.9em;
	margin: 10px 0 0 27px;
	color: white;
	font-weight: normal;
}

.chapter-number 
{
	border-bottom: 3px solid white;
	padding-bottom: 4px;
	width: 32px;
}

.right-panel
{
	float: left;
	height: 100%;
	width: 950px;
	/*opacity: 0.6;
	background-color: black;*/
	/*background-color: rgba(0,0,0,0.6);*/
	display: block;
	transition: background-color 1s;
}
.right-panel-content
{
    float: right;
    box-sizing: border-box;
    width: 530px;
    text-align: right;
    color: white;
    margin-right: 60px;
    font-size: 0.9em;
    margin-top: 110px;
}
#logo-mem_copec {
  width: 94px;
  height: 33px;
  background: url('images/memoria-2014.png') no-repeat;
  margin: 15px 0;
}
.mem_copec {
  float: left;
  width: 140px;
  height: 70px;
  margin-left: 30px;
}

.sepMenu {
  display: block;
  width: 1px;
  height: 38px;
  background-color: #D1D2D4;
  float: right;
  margin-top: -50px;
}

.mem_copec h1 
{
	margin: 5px auto 5px auto;
	font-size: 1.4em;
	color: #0c68a6;
	font-family: "foundrymonolinebold", sans-serif;
	font-weight: normal !important;
}
.mem_copec h1 span{
	font-family: "foundrymonolinelight", sans-serif;
}

#top-menu a:hover {
    color: black;
}

.menu 
{
	width: 1280px;
	height:70px;
	background-color: #ffffff;
	/*position: relative;*/
	position: absolute;
	bottom: 0px;
	opacity: 0;
	transition: all 0.25s ease;
	
}
.menu-fixed 
{
	z-index: 100;
	position: fixed;
	top: 0;
	opacity: 1;
	transition:all 0.25s ease;
}

.menu ul 
{
    height: auto;
    padding: 0px;
    margin: 0px;
}

.menu ul li 
{
	float: left;
	display: inline;
	text-align: center;
	line-height: 70px;
	font-size: 0.9em;
	margin: 0 25px;
}

.menu ul li a 
{
	/*width: 110px;*/
	display: block;
	text-decoration: none;
	color: grey;
	font-family: "foundrymonolinelight", sans-serif;
	font-size: 13px;
}

.logo 
{
	width: 70px;
	height: 21px;
	float: right;
	background-image: url('images/logo-copec-header.png');
	background-repeat: no-repeat;
	background-position: center center;
	margin: 28px;
}

.year-div 
{
	width: 160px;
	text-align: center;
	margin: 0;
}
.year-span 
{
	font-size: 4em;
	display: block;
}

#y2012
{
	position: absolute;
	height: 370px;
	top: 230px;
	left: 160px;
	color: white;
}
#y2013 
{
	position: absolute;
	height: 300px;
	top: 148px;
	left: 356px;
	color: white;
}
#y2014
{
	position: absolute;
	height: 280px;
	top: 116px;
	left: 752px;
	color: #2b2f70;
}

.white-back
{
	background-color: white;
}
.blue-back
{
	background-color: #2b2f70;
}

.circle 
{
	position:absolute;
	bottom: 0px;
	left: 72px;
    width: 14px;
    height: 14px;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
	border: 1px solid;
}

.circle-border
{
	width: 22px;
    height: 22px;
    -webkit-border-radius: 13px;
    -moz-border-radius: 13px;
    border-radius: 13px;
	border: 2px solid;
	position: relative;
	top: -6px;
	left: -6px;
}
.bar-top-line
{
	position: absolute;
	top: 98px;
	left: 75px;
	height: 2px;
	width: 10px;
	margin: 0px auto 0px auto;
	display: none;
}
.display-block
{
	display: block;
}

.bar-container
{
	position: absolute;
	width: 2px;
	/*background-color: green;*/
	top: 100px;
	bottom: 20px;
	left: 79px;
}

.bar {
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 100%;
	height: 1%;
}
.bar-animation
{
	transition: height 2s;
	height: 100%;
}

#footer
{
	position: relative;
	width: 100%;
	height: 75px;
	background-color: #151719;
	color: white;
}
#left-logo
{
	margin: 25px 0px 0px 50px;
}
#footer .center 
{
	position: absolute;
	left: 50%;
	top: 10px;
}
#footer #back-to-top
{
	position: relative;
	left: -50%;
}
#footer #back-to-top img
{
	display: block;
	margin: 0px auto 0px auto;
}
#footer #back-to-top:hover
{
	cursor: pointer;
}
#right-logo
{
	float: right;
	margin: 25px 50px 0px 0px;
}

/*NOSOTROS*/

h2.tituloItemSubMenu {
    margin: 0 0 16px;
}

#volver-nosotros{
	width: 100%;
	height: 115px;
	background: url('images/volver-nosotros.jpg') bottom;
	margin-top: 70px;
}
#volver-nosotros a{
	bottom: 40%;
    color: white;
    position: absolute;
    right: 20px;
    text-decoration: none;
}
#velo-negro {
    background: rgba(0, 0, 0, 0.6) none repeat scroll 0 0;
    height: 115px;
    overflow: hidden;
    width: 100%;
}
.rect-title-nosotros{
	position: absolute;
	bottom: 0;
}
.rect-title-nosotros h2{
	color: white;
    font-size: 1.9em;
    font-weight: normal;
    margin: 10px 50px;
    z-index: 10;
}
#contenido-lightbox {
  float: left;
  width: 400px;
  margin-left: 310px;
  font-size: 14px;
}
#contenido-lightbox a{
	color: #4565ab;
}
#carta-presidente, #patricioReyes {
    float: left;
    width: 664px;
    padding-left: 45px;
    font-size: 14px;
}

#carta-presidente h3 {
    margin-left: 50px;
}

#img-presidente{float: right;position: fixed;}

#imagen-lightbox {
  position: fixed;
  right: 0;
  top: 0;
  width: 450px;
}	

#contenido-nosotros{
	width: 427px;
	height: 460px;
}
#contenido-carta {
    width: 520px;
    margin-left: 50px;
    font-family: Sentinel-Light;
}
#contenido-carta strong{
	font-family: 'foundrymonolinebold';
}
#contenido-patricio{
	width: 500px;
	/*height: 460px;*/
}
.nosotros h3{font-family: 'foundrymonolinemedium';font-weight: normal;color: #4565ab;margin: 30px 0 0;}
#img-patricio {
    float: right;
    margin-left: 12px;
    position: fixed;
}
#menu-nosotros {
  width: 200px;
  height: 100%;
  background: #b9babd;
  float: left;
  position: fixed;
}
#menu-nosotros ul{padding: 0px;margin: 30px;}
#menu-nosotros li{list-style: none;margin: 12px 0;display: block;}
#menu-nosotros a{text-decoration: none;color: #414042;font-family: 'foundrymonolinelight';font-weight: normal;}
#menu-nosotros a:hover{color: #0b6cb2;}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #0b6cb2 !important; }

.link-slide{cursor: pointer;}
.clear{clear: both;}

/*HOME 3 COLUMNAS*/
.columnas{width: auto !important;text-align: left !important;}
.col_1_3{width: 240px;float: left;margin-left: 50px;}
.col_2_3{width: 240px;float: left;margin-left: 50px;}
.col_3_3{width: 240px;float: left;margin-left: 50px;}
.col_2_2{width: 356px;float: left;margin-left: 50px;}
.col_2_2 p{width: 300px !important;}
.columnas h3{text-transform: uppercase;font-family: 'foundrymonolinebold', sans-serif;font-size: 14px;font-weight: normal;margin: 0;}
.columnas h1{font-family: 'foundrymonolinemedium'; font-weight: normal;font-size: 18px;margin: 20px 0;font-size: 50px;}
.columnas p{margin: 0 !important;width: 180px;}
#separador-right-panel {
    background: white none repeat scroll 0 0;
    display: block;
    height: 5px;
    width: 36px;
      margin: 10px 0 0;
}

/*TOOLTIPS DIRECTORIO*/
#mapa-directorio {
    display: block;
    /*float: left;*/
    height: 593px;
    overflow: hidden;
    width: 1039px;
    /*margin: 8px auto;*/
}
img[usemap], map area{
    outline: none;
}
#carlos{margin-left: 14px;position: absolute;top: 192px;}
#eduardo{position: absolute;margin-left: 180px;top:78px;}
#jose{position: absolute;top:210px;margin-left: 385px;}
#jorgeB{position: absolute;top:104px;margin-left: 460px;}
#roberto {
    position: absolute;
    top: 233px;
    margin-left: 560px;
    width: 121px;
}#jorgeA{position: absolute;top:127px;margin-left: 645px;}
#bernardo{position: absolute;top:200px;margin-left: 790px;}

.tooltip{display: none;color: white;font-size: 12px;font-family: 'foundrymonolinelight';font-weight: normal;text-align: right;position: absolute;}
.tooltip strong{font-family: 'foundrymonolinebold';font-weight: normal;}
.mostrar-tooltip{display: block;}
/*TOOLTIPS ADMINISTRACION*/
#mapa-administracion{
    display: block;
    /*float: left;*/
    height: 579px;
    overflow: hidden;
    width: 1039px;
   /* margin: 14px auto;*/
}
#gloria{margin-left: 680px;text-align: left;top: 156px;}
#lorenzo {margin-left: 375px;top: 235px;}
#ramiro {margin-left: 110px;top: 232px;}
#frederic {margin-left: 680px;top: 156px;}
#andres {margin-left: 575px;top: 100px;}
#lorena {margin-left: 355px;top: 151px;}
#jorge {margin-left: 745px;top: 247px;}
#leonardo {margin-left: 370px;text-align: left;top: 102px;}
#angel {margin-left: 50px;top: 147px;}
#eduardo2 {margin-left: 540px;top: 264px;}

#administracion-contenido {
    background: #0b6cb2 none repeat scroll 0 0;
    color: white;
    float: left;
    width: 844px;
    padding-left: 195px;
}
#administracion-contenido h2{
	text-transform: uppercase;
	font-weight: normal;
}
.administracion {
    background: #0b6cb2;
    overflow: hidden;
    padding: 0 150px;
}
/*HISTORIA*/
#contenido-historia{width: 940px;/*float: left;*/padding: 0 50px;/*margin: 40px auto;*/position: absolute;top: 50px;left: 120px;}
.owl-item{padding: 30px;width: 176px !important;}
#contenido-historia h3 {
    color: #414042;
}
#contenido-historia p {
    font-family: Sentinel-Light;
    font-size: 14px;
}

#contenido-historia img {
  box-shadow: 5px 5px 10px rgba(0,0,0,0.3);
  -moz-box-shadow: 5px 5px 10px rgba(0,0,0,0.3);
  -webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.3);
}

/*LIGHTBOX HITOS*/
#info-adicional{
	color: white;
}

.c-numero, .c-titulo
{
	color: white;
	left: 30px;
}
.c-numero {
    position: absolute;
    top: 16px;
    font-size: 1.8em;
    padding-bottom: 2px;
    border-bottom: 3px solid #fff;
    font-family: "foundrymonolinemedium";
}
.c-titulo
{
	position: absolute;
	top: 66px;
	font-size: 1.6em;
	font-family: "foundrymonolinelight";
}

/* HITOS */

.fancybox-skin {
    padding: 0 !important;
}

.fancybox-iframe {
	max-height: 610px;
}

#info-adicional {
  margin-top: 53px;
  margin-left: 38px;
}

#info-adicional h2 {
  font-size: 14px;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
  padding: 10px 0;
}

#info-adicional h1 {
    font-size: 38px;
    margin: 0;
    font-family: "foundrymonolinemedium";
}

#info-adicional p {
    font-size: 14px;
    margin: 0;
    padding-right: 20px;
}
.separador-hojeo{border-bottom: 1px solid white;padding-bottom: 20px;}

#info-adicional ul {
    border: 1px solid #fff;
    padding: 10px 0;
    border-left: none;
    border-right: none;
    font-size: 20px;
    margin: 0;
    line-height: 1;
}

#contenido-lightbox p {
    font-size: 13px;
    font-family: "Sentinel-Book";
}

#contenido-lightbox ul {
    font-family: Sentinel-Book;
    font-size: 13px;
    margin: 0;
    padding: 15px;
}

#contenido-lightbox ul li {
margin-bottom: 5px;  
}

#hitos h3 {
    font-size: 20px;
    text-transform: uppercase;
}

#hitos h5 {
    margin: 0 0 30px;
    font-size: 13px;
}

#hitos blockquote {
    margin: 20px 0 0 !important;
}

#hitos blockquote p{
    margin: 0 0 40px;
    padding: 0;
    color: #4565AB;
    font-size: 14px;
    line-height: 1.3;
    font-family: "foundrymonolinemedium";
}

#hitos h4 {
    color: #4565AB;
    font-size: 16px;
    font-family: "foundrymonolinebold";
}

.aligncenter {
    display: block;
    margin: auto;
}
.back-link{display: block;width: 23px;height: 23px;background: url('images/x.png');margin-right: 30px;}

/* =WordPress Core
-------------------------------------------------------------- */
.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float:right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.wp-caption {
    background: #fff;
    border: 1px solid #f0f0f0;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 5px 3px 10px;
    text-align: center;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}

/* Text meant only for screen readers. */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}