/*

    Theme Name: Acosta

    Theme URI: 

    Author: Cesar Tapia - Guillermo Larraín

    Author URI: https://boot-ti.cl/

    Description: Theme Designed for Ignacio Acosta Site

    Version: 1.1

    License: GNU General Public License v2 or later

    License URI: http://www.gnu.org/licenses/gpl-2.0.html

    Tags: Acosta, works, art

    Text Domain: acosta

*/


@import url("https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap");

.head-menu {
  position: sticky;

  top: 0px;

  background-color: #fff;

  z-index: 999999;

  /*height: 45px;*/
}

.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12 {
  padding-right: 0.438rem;

  padding-left: 0.438rem;
}

.bg-white {
  background-color: #fff;
}

/* Estilos Escalables */

h1 {
  color: #0000c2;

  font-size: clamp(3rem, 4vw, 4.6875rem); /* 48px - 75px */

  font-family: "Work Sans", sans-serif;

  font-optical-sizing: auto;

  font-weight: 500;

  font-style: normal;

  line-height: clamp(3rem, 4vw, 4.375rem); /* 48px - 70px */

  padding-bottom: 25px;
}

h2,
h3,
h4,
h5 {
  color: #0000c2;

  font-size: clamp(1.5rem, 2.5vw, 2.25rem); /* 24px - 36px */

  font-family: "Work Sans", sans-serif;

  font-optical-sizing: auto;

  font-weight: 500;

  font-style: normal;

  line-height: clamp(1.875rem, 2.8vw, 2.8125rem); /* 30px - 45px */

  /*padding-bottom: -10px;*/
}

p,
p.about,
p.bajada-foto,
p.bajada-foto-texto,
p.bajada-titulo {
  color: #0000c2;

  font-size: clamp(1rem, 2vw, 2.25rem); /* 16px - 36px */

  font-family: "Work Sans", sans-serif;

  font-optical-sizing: auto;

  font-weight: 500;

  font-style: normal;

  line-height: clamp(1.5rem, 2.5vw, 2.8125rem); /* 24px - 45px */

  /*margin-bottom: -12px;*/
}

p.bajada-foto {
  font-style: italic;

  margin-bottom: 0px;
}

p.bajada-titulo {
  margin-bottom: 0px;
}

/******  CARD FONTS *****/

h5.card-title {
  /*font-size: clamp(0.8rem, 2vw, 1.4rem);*/ /* 32px - 42px */

  font-size: 26px;

  line-height: 31px;

  text-decoration: none;

  font-family: "Work Sans", sans-serif;

  font-optical-sizing: auto;

  font-weight: 500;

  font-style: normal;

  /*line-height:clamp(1.1rem, 2vw, 2.2rem);*/ /* 40px - 50px */

  padding-top: 10px;

  left: 4px;

  position: relative;
}

p.bajada-card {
  /*font-size: clamp(0.7rem, 1.5vw, 0.9rem);*/ /* 16px - 24px */

  font-size: 15px;

  text-decoration: none;

  font-family: "Work Sans", sans-serif;

  font-optical-sizing: auto;

  font-weight: 500;

  font-style: normal;

  line-height: 1.2;

  position: absolute;

  bottom: 0px;

  left: 18px;

  padding-right: 20px;
}

/****** CIERRE CARD FONTS *****/

a.menu {
  color: #0000c2;

  font-size: clamp(1rem, 2vw, 2.25rem); /* 16px - 36px */

  text-decoration: none;

  font-family: "Work Sans", sans-serif;

  font-optical-sizing: auto;

  font-weight: 500;

  font-style: normal;

  padding-right: 8px;
}

.text-right {
  text-align: right;
}

small {
  color: #0000c2;

  font-size: clamp(0.875rem, 1vw, 1.25rem); /* 14px - 20px */

  font-family: "Work Sans", sans-serif;

  font-optical-sizing: auto;

  font-weight: 500;

  font-style: normal;

  line-height: 50px;
}

a.nombre {
  padding-top: 10px;
}

a.nombre:hover {
  color: #0000c2 !important;
}

a.menu:hover {
  color: #ddddf4;
}

a.menu.active {
  text-decoration: underline;
}

a {
  color: #0000c2;

  text-decoration: none;

  font-family: "Work Sans", sans-serif;

  font-optical-sizing: auto;

  font-weight: 500;

  font-style: normal;
}

.accordion {
  border-radius: 0px !important ;
}

.accordion-button {
  border-radius: 0px !important ;

  padding-bottom: 25px;
}

.nav-item {
  margin-top: -12px;
}

.menuPad {
  padding: 0px !important;
}

a:hover {
  color: #c4c4c4;
}

.link {
  text-decoration: underline;

  color: #0000c2;

  text-decoration-color: #0000c2 !important;
}

.link:hover {
  text-decoration: underline;
}

.work-grilla {
  padding-bottom: 13px;
}

.work-grilla img {
  /*padding:0px;*/
}

.container-fluid {
  padding-right: calc(var(--bs-gutter-x) * 1.5);

  padding-left: calc(var(--bs-gutter-x) * 1.5);
}

.white {
  color: #fff;
}

/**********  CARD WORKS *********/

.card-img-top {
  border-radius: none !important;
}

.custom-card {
  position: relative;

  overflow: hidden;

  transition: transform 0.3s ease-in-out;

  border: none;
}

.custom-card:hover {
  transform: scale(1);
}

.custom-card img {
  width: 100%;

  height: auto;

  transition: opacity 0.3s ease-in-out;

  border-radius: 0px;
}

.custom-card .card-overlay {
  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background-color: #0000c2;

  color: white;

  display: flex;

  justify-content: center;

  opacity: 0;

  transition: opacity 0.1s ease-in-out;

  border-radius: 8px;
}

.custom-card:hover img {
  opacity: 0;
}

.custom-card:hover .card-overlay {
  opacity: 1;
}

.card-img,
.card-img-top {
  border-radius: 0px;
}

.card {
  border-radius: 0px;
}

/**********  CIERRE CARD WORKS *********/

img {
  border-radius: 0px !important ;
}

/**********  ACORDEON *********/

.accordion-button::after {
  display: none !important;
}

.accordion-button:not(.collapsed) {
  color: #fff;
}

.accordion-item {
  background-color: #fff;

  border-radius: 0px;

  border-top: 1px solid #0000c2;

  border-right: 1px solid #fff;

  border-bottom: 1px solid #0000c2;

  border-left: 1px solid #fff;
}

.accordion-item.accordion-header .accordion-button {
  background-color: #fff;

  border: 1px solid #0000c2;
}

.accordion-button:not(.collapsed) {
  background-color: #fff;

  box-shadow: none;
}

.accordion-button:focus {
  box-shadow: none;
}

.accordion-header p {
  margin-bottom: -10px;
}

/********** CIERRE ACORDEON *********/

/* Móviles pequeños */

@media (max-width: 320px) {
  /* Ejemplo: iPhone 5, Galaxy Fold */

  .container-fluid {
    padding-right: calc(var(--bs-gutter-x) * 0.6);

    padding-left: calc(var(--bs-gutter-x) * 0.6);
  }

  a.nombre {
    font-size: 14px;

    top: 10px;

    position: relative;
  }
}

/* Móviles estándar */

@media (min-width: 321px) and (max-width: 480px) {
  /* Ejemplo: iPhone SE, Galaxy S9 */

  .container-fluid {
    padding-right: calc(var(--bs-gutter-x) * 1);

    padding-left: calc(var(--bs-gutter-x) * 1);
  }

  a.nombre {
    top: 10px;

    position: relative;
  }
}

/* Móviles grandes */

@media (min-width: 481px) and (max-width: 576px) {
  /* Ejemplo: iPhone 12 Pro Max, Galaxy Note */

  .container-fluid {
    padding-right: calc(var(--bs-gutter-x) * 1.5);

    padding-left: calc(var(--bs-gutter-x) * 1.5);
  }

  a.nombre {
    top: 10px;

    position: relative;
  }
}

/* Tablets en retrato */

@media (min-width: 577px) and (max-width: 768px) {
  /* Ejemplo: iPad Mini, Galaxy Tab A */

  .container-fluid {
    padding-right: calc(var(--bs-gutter-x) * 1.5);

    padding-left: calc(var(--bs-gutter-x) * 1.5);
  }

  h5.card-title {
    /*font-size: clamp(0.8rem, 2vw, 1.4rem);*/ /* 32px - 42px */

    font-size: 18px;

    line-height: 22px;
  }

  p.bajada-card {
    /*font-size: clamp(0.7rem, 1.5vw, 0.9rem);*/ /* 16px - 24px */

    font-size: 12px;
  }

  a.nombre {
    top: 10px;

    position: relative;
  }
}

/* Tablets en paisaje */

@media (min-width: 769px) and (max-width: 1024px) {
  /* Ejemplo: iPad Air en horizontal */

  .container-fluid {
    padding-right: calc(var(--bs-gutter-x) * 1.5);

    padding-left: calc(var(--bs-gutter-x) * 1.5);
  }

  h5.card-title {
    /*font-size: clamp(0.8rem, 2vw, 1.4rem);*/ /* 32px - 42px */

    font-size: 18px;

    line-height: 22px;
  }

  p.bajada-card {
    /*font-size: clamp(0.7rem, 1.5vw, 0.9rem);*/ /* 16px - 24px */

    font-size: 12px;
  }

  a.nombre {
    top: 10px;

    position: relative;
  }
}

@media (min-width: 1441px) and (max-width: 1920px) {
  /* Ejemplo: iPad Air en horizontal */

  h5.card-title {
    font-size: 35px;

    line-height: 40px;
  }

  p.bajada-card {
    font-size: 18px;
  }
}

@media (min-width: 1921px) and (max-width: 2560px) {
  /* Ejemplo: iPad Air en horizontal */

  h5.card-title {
    font-size: 38px;

    line-height: 43px;
  }

  p.bajada-card {
    font-size: 22px;
  }
}

@media (min-width: 2561px) and (max-width: 3440px) {
  /* Ejemplo: iPad Air en horizontal */

  h5.card-title {
    font-size: 45px;

    line-height: 52px;
  }

  p.bajada-card {
    font-size: 28px;
  }
}

@media (min-width: 3441px) and (max-width: 5120px) {
  /* Ejemplo: iPad Air en horizontal */

  h5.card-title {
    font-size: 45px;

    line-height: 52px;
  }

  p.bajada-card {
    font-size: 28px;
  }
}

@media (min-width: 3441px) and (max-width: 5120px) {
  /* Ejemplo: iPad Air en horizontal */

  h5.card-title {
    font-size: 45px;

    line-height: 52px;
  }

  p.bajada-card {
    font-size: 28px;
  }
}

.navbar-expand-lg {
  display: inline-block !important;

  flex-basis: auto;
}

/***************************  MODAL LIGTHBOX  *************************************/

/* The Modal (background) */

.modal {
  display: none;

  position: fixed;

  z-index: 1;

  padding-top: 20px;

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  overflow: auto;

  background-color: #fff;

  z-index: 999999999999999999;
}

/* Modal Content */

.modal-content {
  position: relative;

  background-color: #fefefe;

  margin: auto;

  padding: 0;

  width: 100%;

  max-width: 1200px;

  border: none;

  height: 90%;
}

.mySlides {
  text-align: center;
}

.mySlides img {
  max-height: calc(100% - 20px);
}

/* The Close Button */

.close {
  color: #0000c2;

  position: absolute;

  top: 5px;

  right: 6%;

  font-size: 40px;

  font-weight: bold;

  font-family: "Work Sans", sans-serif;

  z-index: 999999999999999999999999999999;
}

.close:hover,
.close:focus {
  color: #999;

  text-decoration: none;

  cursor: pointer;
}

.mySlides {
  display: none;
}

.img-slide {
  max-height: calc(100% - 20px) !important;
}

.cursor {
  cursor: pointer;
}

/* Next & previous buttons */

.prev,
.next {
  cursor: pointer;

  position: absolute;

  width: auto;

  padding: 16px;

  margin-top: 20%;

  color: #0000c2;

  font-weight: bold;

  font-size: 40px;

  transition: 0.6s ease;

  border-radius: 0 3px 3px 0;

  user-select: none;

  -webkit-user-select: none;

  font-family: "Work Sans", sans-serif;
}

/* Position the "next button" to the right */

.next {
  right: 0;

  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */

.prev:hover,
.next:hover {
  color: #0000c2;
}

/* Number text (1/3 etc) */

.numbertext {
  color: #f2f2f2;

  font-size: 12px;

  padding: 8px 12px;

  position: absolute;

  top: 0;
}

img {
  margin-bottom: -4px;
}

.caption-container {
  background-color: #fff;

  padding: 2px 16px;

  font-family: "Work Sans", sans-serif;
}

.demo {
  opacity: 0.6;
}

.active,
.demo:hover {
  opacity: 1;
}

#caption {
  font-size: 16px;

  line-height: 40px;
}

.column-none {
  display: none;
}

/***************************  CIERRE  MODAL LIGTHBOX  *************************************/

.collapse {
  transition: height 0.1s ease !important; /* Cambia 0.5s al tiempo que desees */
}

.custom-accordion .collapse {
  transition: height 0.1s ease !important; /* Ajusta el tiempo específico */
}

.navbar-nav .nav-link.active {
  color: #0000c2;
}

.nav-link {
  transition: none !important;
}

.navbar {
  padding: 5px;
}

.navbar > .container-fluid {
  display: block;
}

.navbar-toggler {
  color: #0000c2;

  border: none;

  border-radius: 0px;
}

::selection {
  background: #ccfff4;
}

.navbar-toggler {
  transition: transform 0s ease-in-out;
}

.navbar-toggler:focus {
  box-shadow: none;
}

.navbar-toggler-icon {
  background-size: cover; /* Ajusta la imagen para que cubra el contenedor */

  background-position: center; /* Centra la imagen en el contenedor */

  background-repeat: no-repeat; /* Evita que la imagen se repita */
}

.navbar-nav .nav-item:not(:last-child) .nav-link::after {
  content: ",";

  margin-left: 1px;
}

.img-destacada {
  max-width: 100%;

  height: auto;
}

.leyenda {
  color: #0000c2;
  font-size: clamp(0.875rem, 1vw, 1.25rem); /* 14px - 20px */
  font-family: "Work Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  line-height: 50px;
  text-decoration: none !important;
}