.bg-about{
    /* background: url(/img/slider/hersa/conocenos/conocenos-05.png) 50% 0 no-repeat; */
    background-repeat: no-repeat !important;
    background-position: 50% 0px !important;
    background-size: cover !important;
    height: 100vh;
  }
  
.infra-font{
  font-size: var(--font-global);
  color: white;
}
.our-history-about{
  color: white;
  background-color: var(--azul-deg-hersa);
  font-size: 5vmin;
  text-align: center;
}

.tab-content>div>h2,p{
  /* font-size: 2.5vmin; */
  font-size: 18px;
  /* color: white; */
}
.tab-content>div>h1{
  /* color: white; */
  text-align: center;
}
.nav-tabs>a{
  color: white;
}

.nav-tabs {
  border-bottom: 1px solid #ddd;
}
.nav-tabs>li>a {
  margin-right: 0px;
  line-height: 1.42857143;
  border: 1px solid transparent;
  border-radius: 0px 0px 0 0;
  color: white;
}
  
.nav>li>a.nopad  {
  position: relative;
  display: block;
  padding: 0px; 
}

.fondo-tab{
  background-color: #f2f2f2;
  padding:10vmin 5vmin;
  margin-top:3vmin ;
}
.fondo-tab-text{
  background: gray;
  color: white;
  padding-bottom: 3vmin;
  padding-top: 1.5vmin;
  
}
.centrar-img{
  display:block;
  margin:auto;
  }
.altura10{
  padding-top: 4vmin !important;
  padding-bottom: 4vmin !important;
}
.paddinginfra{
  padding-left: 10vmin;
  padding-right: 10vmin;
  padding-top: 3vmin;
  padding-bottom: 3vmin;
}
.history-yellow{
  background-color: #fdbb12;
  transition: all ease-in 0.5s !important;
}
.history-yellow:hover{
  background-color: white;
}
.history-orange{
  background-color: #f48022;
  transition: all ease-in 0.5s !important;
}
.history-red{
  background-color: #ee4b24;
  transition: all ease-in 0.5s !important;
}
.history-violet{
  background-color: #4b4b67;
  transition: all ease-in 0.5s !important;
}
.history-blue{
  background-color: #096fa6;
  transition: all ease-in 0.5s !important;
}
.history-sky{
  background-color: #24bcee;
  transition: all ease-in 0.5s !important;
}

.history-yellow:hover,.history-orange:hover, .history-red:hover, .history-violet:hover, .history-blue:hover, .history-sky:hover{
  background-color: white;
  color: black;
}

  /*MISION VISION LOGROS*/
  .mvl-col{
    padding:5vmin 3vmin;
    /* background: linear-gradient(180deg,#f2f2f2, white); */
    background: #f2f2f2;
    margin-top: 7vmin;
    min-height: 326px;
    color: var(--azul-deg-hersa);
    font-weight: 700;
    border-radius: 5px;
    font-size: var(--font-global);
    transition: all ease-in 0.5s !important;
  }
  .mvl-col > p {
    font-size: 14px;
    font-weight: 400;
    text-align: center;
  }
  .mvl-col > p.centrador{
    color: black;  
    /* font-size: 5vmin; */
    font-size: 30px;
    font-weight: 700;
    margin-bottom:0 ;
    transition: all ease-in 0.5s;
  }
  
  .mvl-col:hover{
    color: white;
    background: var(--azul-deg-hersa);
  }
  .mvl-col:hover >p.centrador{
    color: yellow;
  }

  .centrar-h-v{
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .row-pad-mvl{
    padding-left: 10vmin;
    padding-right: 10vmin;
  }

.owl-carousel.owl-theme.owl-our-history
  .owl-nav button {
    position: absolute !important;
    top: 13px;
    background-color: var(--azul-deg-hersa);
    color: white;
    opacity: 1;
    padding: 4px 15px !important;
    border-radius: 0;
    font-size: 12px;
  }

  .owl-carousel.owl-theme.owl-our-history
  .owl-nav button.owl-prev {
    left: -5px;
  }

  .owl-carousel.owl-theme.owl-our-history
  .owl-nav button.owl-next {
    right: -5px;
  }
  .owl-carousel.owl-theme.owl-our-history .owl-dots .owl-dot.active span {
    background: #869791;
  }
  .owl-carousel.owl-theme.owl-our-history .owl-dots .owl-dot span {
    background: var(--azul-deg-hersa);
    width: 18px;
    height: 18px;
  }


  /*---------------*/
/***** Oscar *****/
/*---------------*/

figure.effect-oscar {
	/* background: -webkit-linear-gradient(45deg, #22682a 0%, #9b4a1b 40%, #3a342a 100%); */
	/* background: linear-gradient(45deg, #22682a 0%,#9b4a1b 40%,#3a342a 100%); */
  /* background: -webkit-linear-gradient(180deg ,#f2f2f2, white); */
	background: #f2f2f2;
  -webkit-transition: all 0.35s;
	transition: all 0.35s;
  margin-top: 7vmin;
  min-height: 300px;
}
figure.effect-oscar:hover {
  background:  var(--ng-deg-hersa);
  -webkit-transition: all 0.35s;
	transition: all 0.35s;
}
figure.effect-oscar img {
	/* opacity: 0.9; */
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
  width: 150px;
}

figure.effect-oscar figcaption {
	padding: 1em 1.5em;
	/* background-color: rgba(58,52,42,0.7); */
	-webkit-transition: background-color 0.35s;
	transition: background-color 0.35s;
  text-align: center;
  height: 100%;
}

figure.effect-oscar figcaption::before {
	position: absolute;
	top: 30px;
	right: 30px;
	bottom: 30px;
	left: 30px;
	/* border: 1px solid #fff; */
	content: '';
}

figure.effect-oscar h2 {
  color: black;
	/* margin: 10px 0 10px 0; */
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0,200%,0);
	transform: translate3d(0,200%,0);
  text-transform: initial;
  text-align: center;
  -webkit-transition: all 0.35s;
	transition: all 0.35s;
}
figure.effect-oscar i {
  -webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0,40%,0);
	transform: translate3d(0,40%,0);
  font-size: 100px;
  display: inline-block;
}
figure.effect-oscar:hover i {
  -webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0,-16%,0);
	transform: translate3d(0,-16%,0);
  color: white;
}
figure.effect-oscar:hover img {
  -webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0,-52%,0);
	transform: translate3d(0,-52%,0);
  color: white;
}

figure.effect-oscar:hover h2 {
  -webkit-transition: all 0.35s;
	transition: all 0.35s;
  color: #e6e924;
}

figure.effect-oscar figcaption::before,
figure.effect-oscar p {
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: scale(0);
	transform: scale(0);
}
figure.effect-oscar p {
  font-size: 15px;
  text-align: center;
  color: white;
  -webkit-transform: translate3d(0,-1%,0);
	transform: translate3d(0,-1%,0);
  margin-top: -60px;
  min-height: 190px;
  margin-bottom: 8px;
}
figure.effect-oscar:hover h2 {
	-webkit-transform: translate3d(0,-20%,0);
	transform: translate3d(0,-20%,0);
}

figure.effect-oscar:hover figcaption::before,
figure.effect-oscar:hover p {
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1);
  
}

figure.effect-oscar:hover figcaption {
	background-color: rgba(58,52,42,0);
}

figure.effect-oscar:hover img {
	opacity: 0.4;
}

.section-content-map {
  margin-top: 0;
}



@keyframes rebote {
  0%   {left:0px; top:0px;}
  50%  {left:0px; top:-6px;}
  100% {left:0px; top:0px;}
}

.esfera {
  position: absolute;
  cursor: pointer;
}
.esfera > img {
  width: 20px;
  height: auto;
}
.esfera:hover > img {
  position: relative;
  -webkit-animation-name: rebote; /* Chrome, Safari, Opera */
  -webkit-animation-duration: 600ms; /* Chrome, Safari, Opera */
  -webkit-animation-iteration-count: infinite; /* Chrome, Safari, Opera */
  -webkit-animation-direction: reverse; /* Chrome, Safari, Opera */
  animation-name: rebote;
  animation-duration: 600ms;
  animation-iteration-count: infinite;
  animation-direction: reverse;
  animation-timing-function: ease-in-out;
}

.rebote {
  position: relative;
  -webkit-animation-name: rebote; /* Chrome, Safari, Opera */
  -webkit-animation-duration: 600ms; /* Chrome, Safari, Opera */
  -webkit-animation-iteration-count: infinite; /* Chrome, Safari, Opera */
  -webkit-animation-direction: reverse; /* Chrome, Safari, Opera */
  animation-name: rebote;
  animation-duration: 600ms;
  animation-iteration-count: infinite;
  animation-direction: reverse;
  animation-timing-function: ease-in-out;
}


.card-location {
  border-radius: 10px;
  background: white;
  box-shadow: 5px 5px 15px -5px rgba(0,0,0,0.6);
  transition: 0.5s ease;
  position: absolute;
  top: 0%;
  right: 5%;
  /* min-height: 300px; */
  min-height: auto;
  width: 300px;
  background: linear-gradient(135deg, #ffff, #efefef);
  padding: 0 1.5em 1.8em;
  opacity: 0;
  z-index: -1;
}

.card-location.usa {
  background: linear-gradient(
135deg, #083853, #08111b);
}

.card-location h2 {

}
.card-location h3 {

}
.card-location h3 small {
  color: #3a3a3a;

}
.card-location ul li {
  color: #3d3d3d;
}


.card-location.usa {
  background: linear-gradient( 
    135deg, #2189ca, #0f567f);
}
.card-location.usa h2 {
  color: #fff;
}
.card-location.usa h3 {
  color: #fff;
}
.card-location.usa h3 small {
  color: #fff;

}
.card-location.usa ul li {
  color: #fff;
}

.card-location.show {
  top: 25%;
  opacity: 1;
  transition: all 500ms ease-in-out;
  z-index: 1;
}

@media (max-width:768px){

  .cruz::after{
    content: 'X';
    top: 5px;
    position: absolute;
    right: 10px;
    color: gray;
    font-size: 17px;
    font-weight: 700;
  }
  .card-location.usa > .cruz::after{
    color: white;
  }
}


.ct-bar {
  stroke-width: 110px !important;
  stroke: #031324 !important;
}

.container-graph {
  display: flex;
  width: 100%;
  height: 400px;
  justify-content: space-evenly;
  align-items: flex-end;
}
.container-graph .column {
  width: 100px;
  position: relative;
}
.container-graph .column .bar {
  width: 120px;
  height: 90%;
  background: #031324;
  /* align-self: flex-end; */
}
.container-graph .column.c1 {
  height: 8%;
}
.container-graph .column.c2 {
  height: 12%;
  bottom: -2px;
}
.container-graph .column.c3 {
  height: 90%;
  bottom: -33px;
}
.container-graph .column.c4 {
  height: 6%;
}
.container-graph .column.c5 {
  height: 10%;
  bottom: -2px;
}
.container-graph .column.c6 {
  height: 6%;
}
.container-graph .column.c7 {
  height: 10%;
  bottom: -2px;
}


.container-chart-maquinado {
  position: relative;
  /* The image used */
  background-image: url("/img/know-us/graph/background-grafica.png");

  /* Set a specific height */
  /* min-height: 500px; */

  /* Create the parallax scrolling effect */
  /* background-attachment: fixed; */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}


@media (max-width: 400px) { 
  .container-chart-maquinado .img-maquinado {
    position: absolute;
    top: 0%;
    right: 0;
    width: 100px;
  }

}
@media (min-width: 401px) and (max-width: 575.98px) { 
  .container-chart-maquinado .img-maquinado {
    position: absolute;
    top: 0%;
    right: 0;
    width: 140px;
  }

}

/* Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) and (max-width: 767.98px) { 
  .container-chart-maquinado .img-maquinado {
    position: absolute;
    top: 0%;
    right: 0;
    width: 200px;
  }
}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) { 
  .container-chart-maquinado .img-maquinado {
    position: absolute;
    top: 0%;
    right: 0;
    width: 200px;
  }
}

/* // Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) { 
  .container-chart-maquinado .img-maquinado {
    position: absolute;
    top: 0%;
    right: 0;
    width: 300px;
  }
}

/* // Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
  .container-chart-maquinado .img-maquinado {
    position: absolute;
    top: 0%;
    right: 0;
    width: 400px;
  }
}