@charset "utf-8";
/* CSS Document */
body,
html {
  font-family : 'Montserrat', sans-serif;
  margin      : 0;
  padding     : 0;
}
img {
  border : none
}
article, aside, figure, footer, header, hgroup, nav, section {
  display : block;
}
textarea {
  resize : none;
}
h2 {
  text-align     : center;
  text-transform : uppercase;
  color          : #0A1E40;
  letter-spacing : 2px;
}
p {
  line-height : 30px;
}
ul {
  list-style : none;
  padding    : 0px;
}
.ms-view {
  background-color : #FFF !important;
}
/* Layout */
.clear {
  width : 100%;
  clear : both;
}
.left {
  float : left;
}
.right {
  float : right;
}
.none {
  display : none;
}
.text-center {
  text-align : center;
}
.text-left {
  text-align : left;
}
.text-right {
  text-align : right;
}
.container {
  width     : 100%;
  display   : block;
  max-width : 1200px;
  margin    : 0 auto;
}
.title {
  text-align : center;
  display    : block;
}
.link {
  color           : #0A1E40;
  text-decoration : none;
  font-weight     : 500;
  transition      : 0.25s;
  float           : right;
}
.link:hover {
  color : #FFF;
}
/* Grid */
.col25 {
  width   : 25%;
  display : inline-block;
  float   : left;
}
.col33 {
  width   : 33%;
  display : inline-block;
  float   : left;
}
.col40 {
  width   : 40%;
  display : inline-block;
  float   : left;
}
.col50 {
  width   : 50%;
  display : inline-block;
  float   : left;
}
.col60 {
  width   : 60%;
  display : inline-block;
  float   : left;
}
/*
Al seleccionar un campo de ingreso de texto, o un select, en browser realiza un zoom. (iphone)
http://stackoverflow.com/questions/2989263/disable-auto-zoom-in-input-text-tag-safari-on-iphone
*/
@media screen and (-webkit-min-device-pixel-ratio : 0) {
  select, textarea, input {
    font-size : 16px !important;
  }

  input[type="button"],
  input[type="submit"] {
    -webkit-appearance : none;
  }
}
/* Video Background */
.videoWrapper {
  position       : relative;
  /* 16:9 */
  padding-bottom : 56.25%;
  /* 4:3 */
  /*padding-bottom : 75%; */
  padding-top    : 0;
  height         : 0;
}
.videoWrapper iframe {
  position : absolute;
  top      : 0;
  left     : 0;
  width    : 100%;
  height   : 100%;
}
input[type=password].verificado, input[type=text].verificado {
  border     : none;
  box-shadow : 0 0 7px green;
}
input[type=password].incorrecto, input[type=text].incorrecto {
  border        : 1px solid red;
  border-radius : 2px;
  box-shadow    : 0 0 7px red
}
.backCover {
  background-position : center;
  background-size     : cover;
  background-repeat   : no-repeat;
}
.aspectRatio43,
.aspectRatio1,
.aspectRatio169 {
  position : relative;
  display  : block;
}
.aspectRatio43:before,
.aspectRatio1:before,
.aspectRatio169:before {
  display : block;
  content : " ";
  width   : 100%;
}
.aspectRatio43:before {
  /* padding-top : calc((3 / 4) * 100%); */
  padding-top : 75%;
}
.aspectRatio1:before {
  padding-top : 100%;
}
.aspectRatio169:before {
  /* padding-top : calc((9 / 16) * 100%); */
  padding-top : 56.25%;
}
/* Portada - Slider */
.caption {
  position    : absolute;
  font-size   : 1.5em;
  top         : 0;
  left        : 15px;
  border      : 1px solid;
  color       : orange;
  text-shadow : 2px 2px 1px #000;
  padding-top : 60vh;
}
/* Portada - Novedades */
.novedades {
  background-color : #C7C7C7;
  padding          : 15px 0px;
  color            : #0A1E40;
}
.contenedorListadoNoticias {
  text-align : center;
}
.boxNovedad {
  width           : 300px;
  display         : inline-block;
  text-align      : left;
  position        : relative;
  margin          : 0 20px 40px 20px;
  text-align      : left;
  text-decoration : none;
  color           : #000;
}
.boxNovedad .thumbnail {
  display             : block;
  background-size     : cover;
  background-repeat   : no-repeat;
  background-position : center center;
  border              : 0;
  margin              : 0 auto;
}
.boxNovedad .tituloNoticiaListado {
  font-weight : 500;
  font-size   : 18px;
  line-height : 20px;
  height      : 109px;
  overflow    : hidden;
  display     : block;
  box-sizing  : border-box;
  padding     : 5px;
  margin      : 0;
}
.boxNovedad .subtitulo {
  display     : block;
  padding     : 5px;
  font-size   : 14px;
  line-height : 16px;
  height      : 71px;
  overflow    : hidden;
  box-sizing  : border-box;
}
.boxNovedad .fecha {
  border-bottom : 1px dotted #000;
  display       : block;
  width         : 100%;
  box-sizing    : border-box;
  padding       : 2px 5px 0 5px;
  font-size     : 12px;
  line-height   : 16px;
}
/* Portada - Areas de Negrocios */
.areasDeNegocios {
  display   : block;
  width     : 98%;
  max-width : 1400px;
  margin    : 0 auto;
}
.boxArea {
  width               : 100%;
  max-width           : 310px;
  display             : inline-block;
  height              : 200px;
  margin              : 10px;
  background-color    : #0A1E40;
  vertical-align      : top;
  position            : relative;
  background-position : center;
  background-size     : cover;
  background-repeat   : no-repeat;
  overflow            : hidden;
}
.boxArea div {
  background-image      : url(imagenes/backSliderDerecha.png);
  background-repeat     : no-repeat;
  height                : 200px;
  width                 : 350px;
  background-position-x : -135px;
  background-position-y : -50px;
}
.boxArea span {
  color           : #FFF;
  text-decoration : none;
  position        : absolute;
  bottom          : 20px;
  right           : 20px;
  font-size       : 20px;
  font-weight     : 500;
  text-align      : right;
  transition      : 0.25s;
}
.plusSmall {
  font-size           : 45px;
  font-weight         : 300;
  margin-left         : 25px;
  right               : -57px;
  position            : absolute;
  top                 : -29px;
  background-size     : cover;
  background-repeat   : no-repeat;
  background-position : center;
  height              : 90px;
  width               : 170px;
  line-height         : 80px;
  padding-right       : 3px;
}
.plus {
  font-size           : 45px;
  font-weight         : 300;
  margin-left         : 25px;
  right               : -57px;
  position            : absolute;
  top                 : -15px;
  background-size     : cover;
  background-repeat   : no-repeat;
  background-position : center;
  height              : 90px;
  width               : 170px;
  line-height         : 80px;
  padding-right       : 3px;
}
.plusLarge {
  font-size           : 45px;
  font-weight         : 300;
  margin-left         : 25px;
  right               : -57px;
  position            : absolute;
  top                 : -3px;
  background-size     : cover;
  background-repeat   : no-repeat;
  background-position : center;
  height              : 90px;
  width               : 170px;
  line-height         : 80px;
  padding-right       : 3px;
}
.boxArea:hover span {
  right : 70px;
}
.background1 {
  background-image : url(imagenes/cabezalAgenciaMaritimaB.jpg);
}
.background2 {
  background-image : url(imagenes/cabezalBunkersSupplyB.jpg);
}
.background3 {
  background-image : url(imagenes/cabezalTerminalesPortuariasB.jpg);
}
.background4 {
  background-image : url(imagenes/cabezalOperadoresPortuariosB.jpg);
}
.background5 {
  background-image : url(imagenes/cabezalOffshoreB.jpg);
}
.background6 {
  background-image : url(imagenes/cabezalShippingB.jpg);
}
.background7 {
  background-image : url(imagenes/cabezalCargasProyectoB.jpg);
}
.background8 {
  background-image : url(imagenes/cabezalOperacionesFerroviariasB.jpg);
}
/* Portada - Logos Clientes */
.logosClientes {
  border-top  : 2px solid #0A1E40;
  padding-top : 25px;
  margin-top  : 25px;
  text-align  : center;
}
.logosClientes img {
  width     : 100%;
  max-width : 150px;
}
#logoPositivo {
  width            : 100%;
  max-width        : 200px;
  margin-top       : -70px;
  background-color : #FFF;
  padding          : 0px 25px;
  margin-bottom    : 25px;
}
/* Header */
header {
  background-color    : #0A1E40;
  background-image    : url(imagenes/backHeader.png);
  display             : block;
  background-position : center;
  background-size     : 100%;
  background-repeat   : no-repeat;
  height              : 98px;
}
header nav {
  display : block;
  height  : 98px;
}
.logoHeader {
  display     : block;
  float       : left;
  max-width   : 125px;
  padding     : 15px 10px;
  margin-left : 20px;
}
.logoHeader img {
  display   : block;
  width     : 100%;
  max-width : 125px;
  padding   : 0;
}
header nav ul {
  display       : inline-block;
  float         : right;
  list-style    : none;
  margin-top    : 30px;
  margin-bottom : 0px;
  margin-right  : 100px;
}
header nav ul li {
  display : inline-block;
}
header nav ul li a {
  display         : block;
  color           : #FFF;
  text-decoration : none;
  padding         : 10px 15px;
  transition      : all 0.3s;
}
header nav ul li a:hover, header nav ul li:hover .dropbtn {
  cursor           : pointer;
  background-color : #0159A0;
}
header nav ul li a.seccionActiva {
  background-color : #0159A0;
}
.linkIdioma {
  position         : absolute;
  top              : 10px;
  right            : 0px;
  padding          : 5px 10px;
  background-color : #0A1E40;
  border-radius    : 4px 0 0 4px;
  color            : #FFF;
  text-decoration  : none;
  font-size        : 10px;
}
.linkIdioma:hover {
  background-color : #0B2551;
}
.linkIdioma2 {
  position         : absolute;
  top              : 34px;
  right            : 0px;
  padding          : 5px 10px;
  background-color : #0A1E40;
  border-radius    : 4px 0 0 4px;
  color            : #FFF;
  text-decoration  : none;
  font-size        : 10px;
}
.linkIdioma2:hover {
  background-color : #0B2551;
}
.linkIdioma3 {
  position         : absolute;
  top              : 60px;
  right            : 0px;
  padding          : 5px 10px;
  background-color : #0A1E40;
  border-radius    : 4px 0 0 4px;
  color            : #FFF;
  text-decoration  : none;
  font-size        : 10px;
}
.linkIdioma3:hover {
  background-color : #0B2551;
}
header nav > ul > li > a {
  padding     : 24px 16px;
  box-sizing  : border-box;
  line-height : 20px;
  height      : 68px;
}
.dropbtn {
  background-color : transparent;
  color            : white;
  padding          : 24px 16px;
  box-sizing       : border-box;
  line-height      : 20px;
  height           : 68px;
  font-size        : 16px;
  border           : none;
  cursor           : pointer;
  font-family      : 'Montserrat', sans-serif;
  transition       : all 0.3s;
}
.dropdown {
  position : relative;
  display  : inline-block;
}
.dropdown-content {
  display          : none;
  position         : absolute;
  background-color : rgba(0, 57, 120, 0.95);
  min-width        : 300px;
  z-index          : 999;
  top              : 68px;
  left             : 0;
}
.dropdown-content a {
  color           : #FFF;
  padding         : 12px 14px;
  text-decoration : none;
  display         : block;
  font-size       : 14px;
  text-align      : center;
}
.dropdown-content a:hover {
  background-color : #0A1E40;
}
.dropdown:hover .dropdown-content {
  display : block;
}
/* Footer */
footer {
  background-color    : #0A1E40;
  background-image    : url(imagenes/backFooter.png);
  background-position : right;
  background-repeat   : no-repeat;
  background-size     : cover;
  color               : #FFF;
  padding             : 50px 0px;
}
footer .col33 {
  max-width : 300px;
  margin    : 0px 35px;
}
footer .col33 p {
  font-size   : 14px;
  line-height : 22px;
}
footer .col33 a {
  display         : block;
  text-decoration : none;
  color           : #FFF;
  margin-bottom   : 5px;
  font-size       : 14px;
}
/* Quienes somos */
#quienesSomos h2 {
  padding-top : 25px;
}
#quienesSomos h3, 
#quienesSomos h2 {
  color: #003978;
}
#quienesSomos .col40 span {
  text-align : center;
  font-size  : 14px;
  display    : block;
}
#quienesSomos .col40 img {
  position  : relative;
  width     : 100%;
  padding   : 20px;
  max-width : 440px;
}
#quienesSomos .col60 p {
  padding       : 0px 30px;
  margin-bottom : 30px;
  line-height   : 30px;
}
#quienesSomos #logos {
  width     : 100%;
  position  : relative;
  max-width : 980px;
  margin    : 0 auto;
  display   : block;
}
/* Áreas de Negocios */
.navAreaNegocio {
  display    : block;
  margin     : 0;
  padding    : 0;
  text-align : center;
}
.navAreaNegocio .divider {
  color : #003978;
}
.navAreaNegocio li {
  display    : inline-block;
  font-size  : 16px;
  text-align : center;
}
.navAreaNegocio li a {
  color           : #929292;
  text-decoration : none;
  padding         : 10px;
  display         : block;
  font-weight     : 500;
  font-size       : 14px;
}
.navAreaNegocio li a:hover {
  color : #003978;
}
/* Agencia Marítima */
#agenciaMaritima .cabezal {
  display             : block;
  position            : relative;
  width               : 100%;
  height              : 300px;
  background-image    : url(imagenes/cabezalAgenciaMaritima.jpg);
  background-repeat   : no-repeat;
  background-position : center;
  background-size     : cover;
  margin-bottom: 50px;
}
#agenciaMaritima .cabezal h1 {
  background-image    : url(imagenes/backSliderDerecha.png);
  background-repeat   : no-repeat;
  background-position : right;
  padding-right       : 150px;
  height              : 220px;
  line-height         : 200px;
}

#agenciaMaritima strong,
#agenciaMaritima h3 {
  color : #003978;
}
/* Bunkers Supply */
#bunkersSupply .cabezal {
  display             : block;
  position            : relative;
  width               : 100%;
  height              : 300px;
  background-image    : url(imagenes/cabezalBunkersSupply.jpg);
  background-repeat   : no-repeat;
  background-position : center;
  background-size     : cover;
  margin-bottom: 50px;
}
#bunkersSupply .cabezal h1 {
  background-image    : url(imagenes/backSliderDerecha.png);
  background-repeat   : no-repeat;
  background-position : right;
  padding-right       : 150px;
  height              : 220px;
  line-height         : 200px;
}
#bunkersSupply strong,
#bunkersSupply h3 {
  color : #003978;
}
/* Compliance */
#listaCompliance {
  text-align: center;
}
  #listaCompliance li {
    background-color: #0d5b9f;
    padding: 10px;
    width: 50%;
    margin: 5px auto;
    color: #fff;
  }  
    #listaCompliance .fa.fa-angle-double-right {
      margin-right: 5px;
    }

/* Cargas Proyecto */
#cargasProyecto .cabezal {
  display             : block;
  position            : relative;
  width               : 100%;
  height              : 300px;
  background-image    : url(imagenes/cabezalCargasProyecto.jpg);
  background-repeat   : no-repeat;
  background-position : center;
  background-size     : cover;
}
#cargasProyecto .cabezal h1 {
  background-image    : url(imagenes/backSliderDerecha.png);
  background-repeat   : no-repeat;
  background-position : right;
  padding-right       : 150px;
  height              : 220px;
  line-height         : 200px;
  margin-bottom: 50px;
}
#cargasProyecto strong,
#cargasProyecto h3 {
  color : #003978;
}
/* División Offshore */
#divisionOffshore .cabezal {
  display             : block;
  position            : relative;
  width               : 100%;
  height              : 300px;
  background-image    : url(imagenes/cabezalOffshore.jpg);
  background-repeat   : no-repeat;
  background-position : center;
  background-size     : cover;
  margin-bottom: 50px;
}
#divisionOffshore .cabezal h1 {
  background-image    : url(imagenes/backSliderDerecha.png);
  background-repeat   : no-repeat;
  background-position : right;
  padding-right       : 150px;
  height              : 220px;
  line-height         : 200px;
}
#divisionOffshore strong,
#divisionOffshore h3 {
  color : #003978;
}
/* Operadores Portuarios */
#operadoresPortuarios .cabezal {
  display             : block;
  position            : relative;
  width               : 100%;
  height              : 300px;
  background-image    : url(imagenes/cabezalOperadoresPortuarios.jpg);
  background-repeat   : no-repeat;
  background-position : center;
  background-size     : cover;
  margin-bottom: 50px;
}
#operadoresPortuarios .cabezal h1 {
  background-image    : url(imagenes/backSliderDerecha.png);
  background-repeat   : no-repeat;
  background-position : right;
  padding-right       : 150px;
  height              : 220px;
  line-height         : 200px;
}
#operadoresPortuarios strong,
#operadoresPortuarios h3 {
  color : #003978;
}
/* Servicios Logisticos Integrados */
#serviciosLogisticosIntegrados .cabezal {
  display             : block;
  position            : relative;
  width               : 100%;
  height              : 300px;
  background-image    : url(imagenes/cabezalServiciosLogisticosIntegrados.jpg);
  background-repeat   : no-repeat;
  background-position : center;
  background-size     : cover;
  margin-bottom: 50px;
}
#serviciosLogisticosIntegrados .cabezal h1 {
  background-image    : url(imagenes/backSliderDerecha.png);
  background-repeat   : no-repeat;
  background-position : right;
  padding-right       : 150px;
  height              : 220px;
  line-height         : 200px;
}
#serviciosLogisticosIntegrados strong,
#serviciosLogisticosIntegrados h3 {
  color : #003978;
}
/* Shipping */
#shipping .cabezal {
  display             : block;
  position            : relative;
  width               : 100%;
  height              : 300px;
  background-image    : url(imagenes/cabezalShipping.jpg);
  background-repeat   : no-repeat;
  background-position : center;
  background-size     : cover;
  margin-bottom: 50px;
}
#shipping .cabezal h1 {
  background-image    : url(imagenes/backSliderDerecha.png);
  background-repeat   : no-repeat;
  background-position : right;
  padding-right       : 150px;
  height              : 220px;
  line-height         : 200px;
}
#shipping strong,
#shipping h3 {
  color : #003978;
}
/* Terminales Portuarias */
#terminalesPortuarias .cabezal {
  display             : block;
  position            : relative;
  width               : 100%;
  height              : 300px;
  background-image    : url(imagenes/cabezalTerminalesPortuarias.jpg);
  background-repeat   : no-repeat;
  background-position : center;
  background-size     : cover;
  margin-bottom: 50px;
}
#terminalesPortuarias .cabezal h1 {
  background-image    : url(imagenes/backSliderDerecha.png);
  background-repeat   : no-repeat;
  background-position : right;
  padding-right       : 150px;
  height              : 220px;
  line-height         : 200px;
}
#terminalesPortuarias strong,
#terminalesPortuarias h3 {
  color : #003978;
}
/* Áreas de Negocios */
.fotos img {
  display: block;
  width: 100%;
  max-width: 550px;
  position: relative;
  text-align: center;
  margin: 25px auto;
}
.cabezal h1 {
  margin         : 0px;
  position       : absolute;
  bottom         : 0;
  color          : #FFF;
  font-size      : 40px;
  font-weight    : 400;
  text-transform : uppercase;
  padding        : 40px;
}
/* Sectores de Actividad */
#sectoresDeActividad h2 {
  margin-top : 45px;
}
#sectoresDeActividad h3 {
  color          : #003978;
  padding-bottom : 40px;
  border-bottom  : 2px solid #003978;
  font-weight    : 500;
  font-size      : 25px;
}
#sectoresDeActividad h3 img {
  display      : inline-block;
  width        : 50px;
  margin-right : 15px;
  opacity      : 0.55;
}
/* Mision Vision Valores */
#listaValores {
  text-align: center;
}
  #listaValores li {
    display: inline-block;
    width: 20%;
    max-width: 150px;
    vertical-align: top;
    padding: 20px;
    background-color: #0d5b9f;
    color: #fff;
    height: 150px;
    margin: 15px;
  }
    #listaValores li strong {
      display: block;
      color: #fff;
    }
/* Contacto */
#contacto_form {
  width     : 100%;
  max-width : 500px;
  margin    : 0 auto;
  display   : block;
}
#contacto_form_cont h2 {
  padding-top : 25px;
}
form label {
  width         : 100%;
  max-width     : 500px;
  font-size     : 16px;
  color         : #0C5A9E;
  margin-bottom : 10px;
}
form label input,
form label select  {
  width         : 100%;
  margin-bottom : 5px;
  border        : 1px solid #DDD;
  height        : 30px;
  text-align    : left;
  font-family   : 'Montserrat', sans-serif;
}
form label textarea {
  width         : 100%;
  margin-bottom : 5px;
  border        : 1px solid #DDD;
  height        : 60px;
  text-align    : left;
  padding-top   : 10px;
  font-family   : 'Montserrat', sans-serif;
}
#btn_enviar_contacto {
  background-color : #0C5A9E;
  border           : none;
  color            : #FFF;
  width            : 100%;
  max-width        : 100px;
  float            : right;
  padding          : 10px;
  margin-right     : -3px;
  margin-bottom    : 30px;
  transition       : 0.25s;
  font-family      : 'Montserrat', sans-serif;
}
#btn_enviar_contacto:hover {
  background-color : #0A1E40;
}

/* Operaciones Ferroviarias */
#operacionesFerroviarias .cabezal {
  display             : block;
  position            : relative;
  width               : 100%;
  height              : 300px;
  background-image    : url(imagenes/cabezalOperacionesFerroviarias.jpg);
  background-repeat   : no-repeat;
  background-position : center;
  background-size     : cover;
}
#operacionesFerroviarias .cabezal h1 {
  background-image    : url(imagenes/backSliderDerecha.png);
  background-repeat   : no-repeat;
  background-position : right;
  padding-right       : 150px;
  height              : 220px;
  line-height         : 200px;
}
#operacionesFerroviarias strong,
#operacionesFerroviarias h3 {
  color : #003978;
}


/****** html estaticos ******/
.listaComun {
  list-style : none;
}
.listaComun li {
  display       : block;
  position      : relative;
  padding-left  : 20px;
  line-height   : 20px;
  margin-bottom : 30px;
}
.listaComun li i {
  display     : block;
  position    : absolute;
  font-size   : 14px;
  width       : 20px;
  line-height : 20px;
  height      : 20px;
  text-align  : center;
  left        : 0;
  top         : 0;
}
/* Backward */
.hvr-backward {
  display                     : inline-block;
  vertical-align              : middle;
  -webkit-transform           : perspective(1px) translateZ(0);
  transform                   : perspective(1px) translateZ(0);
  box-shadow                  : 0 0 1px rgba(0, 0, 0, 0);
  -webkit-transition-duration : 0.3s;
  transition-duration         : 0.3s;
  -webkit-transition-property : transform;
  transition-property         : transform;
}
.hvr-backward:hover {
  -webkit-transform : translateX(-8px);
  transform         : translateX(-8px);
}
/* Mobile */
.overlay {
  height           : 100%;
  width            : 0;
  position         : fixed;
  z-index          : 11;
  top              : 0;
  right            : 0;
  background-color : rgba(0, 57, 120, 85);
  overflow-x       : hidden;
  transition       : 0.5s;
}
.overlay-content {
  position   : relative;
  width      : 100%;
  text-align : center;
  margin-top : -9px;
}
.overlay-content span {
  color : #FFF;
}
.overlay a, .overlay span {
  padding         : 0;
  text-decoration : none;
  font-size       : 18px;
  color           : #FFF;
  display         : block;
  transition      : 0.3s;
  font-weight     : 500;
  margin-bottom   : 8px;
}
.overlay .closebtn {
  position    : relative;
  font-size   : 60px;
  /* float: right; */
  display     : inline;
  /* margin-right: -5px; */
  height      : 30px;
  padding     : 0;
  line-height : 48px;
}
.cont_closebtn {
  text-align : right;
}
.subLink {
  font-weight : 300 !important;
  padding     : 0 !important;
  font-size   : 16px !important;
}
.submenu_group {
  margin-bottom : 20px;
}
.mid-html {
  text-align : justify;
}


/* Mediaqueries */
.openNav {
  display : none;
}
@media (max-width : 1200px) {
  .container {
    width : 1000px;
  }

  .fotos img {
    display    : block;
    width      : 100%;
    max-width  : 450px;
    margin-top : 25px;
    position   : relative;
  }

  .cabezal h1 {
    font-size : 30px;
  }

  #quienesSomos .col40 img {
    position  : relative;
    width     : 100%;
    padding   : 20px 20px 20px 0px;
    max-width : 440px;
  }
}
@media (max-width : 1024px) {
  .logoHeader {
    padding-top    : 3px;
    padding-bottom : 0;
  }

  .logoHeader img {
    max-width  : 100px;
    margin-top : 8px;
  }

  .conMargenMobile {
    margin-bottom : 25px !important;
  }

  header {
    height : 75px;
  }

  header nav {
    display : block;
    height  : 75px;
  }

  header nav ul {
    display : none;
  }

  header nav a img {
    display   : inline-block;
    width     : 100%;
    max-width : 90px;
    padding   : 13px 33px;
  }

  .openNav {
    display      : block;
    float        : right;
    font-size    : 45px;
    color        : #FFF;
    margin-right : 5px;
    margin-top   : 5px;
    cursor       : pointer;
    z-index      : 999;
  }

  .container {
    max-width : 1000px;
    width     : 90%;
  }

  .openNav {
    display : block;
  }

  #logoPositivo {
    max-width  : 100px;
    margin-top : -50px;
  }

  footer {
    text-align : center;
  }

  footer .col33 {
    max-width : 300px;
    margin    : 0px auto;
    width     : 100%;
    display   : block;
    float     : none;
  }

  footer .col33 iframe {
    width  : 100%;
    height : 250px;
  }

  .col50 {
    width   : 90%;
    display : block;
    float   : none;
    margin  : 0 auto;
  }

  .fotos img {
    display    : block;
    width      : 100%;
    max-width  : none;
    margin-top : 25px;
    position   : relative;
  }
}
@media (max-width : 768px) {
  .boxArea {
    display : block;
    margin  : 10px auto;
  }

  #contacto_form {
    width     : 100%;
    max-width : 300px;
    margin    : 0 auto;
    display   : block;
  }

  .title {
    text-align    : center;
    display       : block;
    font-size     : 20px;
    margin-bottom : 0px;
  }

  #quienesSomos {
    text-align : center;
  }

  #quienesSomos .col40 img {
    padding : 20px;
  }

  .col40 {
    width      : 100%;
    display    : block;
    margin     : 0 auto;
    float      : none;
    text-align : center;
  }

  .col60 {
    width      : 100%;
    margin     : 0 auto;
    text-align : center;
  }
}
@media (max-width : 495px) {
  .cabezal h1 {
    font-size   : 24px !important;
    line-height : 34px !important;
  }
}

.paginacion {
  margin     : 20px 0;
  text-align : center;
}
.paginacion a {
  text-decoration : none;
  color           : #0A1E40;
}
.paginacion a, .paginacion span {
  margin  : 0 5px;
  border  : 1px solid;
  padding : 5px;

}
.paginacion a:hover,
.paginacion span {
  background-color : #0A1E40;
  color            : #FFF;
  border-color     : #000;
}
.headerArticulo {
  text-align : center;
  margin     : 45px 0 25px 0;
}
.fechaAmpliado {

}
.tituloAmpliado {
  margin-bottom : 10px;
  margin-top    : 0;
}
.subtituloAmpliado {

}

.cont700 {
  max-width : 700px;
  margin    : 0 auto;
}
.cont900 {
  max-width : 900px;
  margin    : 0 auto;
}