:root {
  --azul: #0802A3; 
  --amarillo: #FFCD4B;
  --naranja: #F95B26;
  --negro: #000;
  --fucsia: #FE0062; 
}

body {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    /*font-family: 'Oswald', sans-serif !important;*/
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    margin: 0;
  }
  /*
  .welcome {
    font-family: "Oswald", sans-serif;
  }
  */
  
  #footer {
    margin-top: auto;
  }
  
  .bg-hero {
  background-image: url(img/20220429151503-ac3663f6-xl.jpg);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:70% 50%;
  height:500px;  
  }
  
.bg-azul {
  background-color: var(--azul);
}

  a {color: #f95b26;
  font-weight: bold;
text-decoration: none;}
  a:hover {color: #ffad91;
  text-decoration: underline;}

  .text-bg-orange {
    background-color: #f95b26;
    color: #F5F5F5;
  }


  .container-fluid.bg-inscripciones {
    background-color: #136358;
  }
  
  .btn.btn-white {
    color: white;
    border-color: white;
    padding: 10px;
  }
  
  .btn.btn-white:hover {
    background-color: #4A0007;
    border-bottom: #4A0007;
  }
  
  .btn.btn-wine {
    color: white;
    background-color: #4A0007;
    border-color: #4A0007;
    padding: 5px;
  }
  
  .btn.btn-wine:hover {
    background-color: #B63B47;
    border-bottom: #B63B47;
  }
  
  .btn.btn-wine-pale {
    background-color: #B63B47;
    border-bottom: #B63B47;
    color:aliceblue;
  }
  
  .btn.btn-wine-pale:hover {
    background-color: #fa98a2;
    border-bottom: #fa98a2;
    color:#303030;
  }
  
  
  table.table tbody tr td b {
    color: #981E29;
  }
  
  a.link-wine {
    color: #B63B47;
    font-weight: 700;
  
  }
  
  
  a.link-wine:hover {
    color: #4A0007;
    font-weight: 700;
  
  }
  
  .link-wine {
      color: #4A0007;
      font-weight: 700;
    
    }
  
  /*
  .navbar .collapse li a:hover {
    color: rgb(168, 168, 168);
  }
  */
  
  .navbar .collapse li a:focus {
    color: #303030 !important;
    text-decoration: none;
  }

  nav .collapse ul li a {
    color: #ffffff !important;
    font-weight: bold
  }
  
  
  .navbar-toggler {
    
    border-color: 660066;
  }
  
  nav .collapse ul li a {
    font-size: 0.78em;
  }
  
  a.nav-link.dropdown-toggle.show {
    color: rgb(168, 168, 168);
  }
    
  
  ul.dropdown-menu.show {
    border: none;
  }
  
  .dropdown-menu {
    background-color: #f95b26;
  }

  .dropdown-menu.show a.dropdown-item:active {
    color:#f95b26 !important;
  }

 
  .dropdown-menu.show a.dropdown-item {
   color: #fdfdfd !important;
   background-color: none ;
   text-decoration: none ;
  }
 
  .dropdown-menu.show a.dropdown-item:hover {
    color: #000 !important;
  }



  .hover-brand:hover {
    opacity: 0.6;
    transform: scale(1.2);
  }
  
  h1.font-wine {color: #792020;}
  
  h2.font-wine {
    color: #303030;
  }
  
  h3.font-wine {
    color: #303030;
  }
  
  h4.font-wine {
    color: #303030;
  }
  
  
  .font-wine p {
    color: #303030;
  }
  
  a.font-wine {
    color: #4A0007;
    font-weight: 700;
  }
  
  a.font-wine:hover {
    color: #B63B47;
  }
  
  
  .accordion-button:not(.collapsed) {
    color: #ffffff;
    background-color: #4A0007;
    ;
    box-shadow: inset 0 calc(-1* var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
  }
  
  /* medias */
  
  @media (max-width: 767px) {
    img.img-fluid.brand {
      width: 120px !important;
    }
  }
  
  
  @media (max-width: 767px) {
    .col-xs {
      padding-right: 2em;
      padding-left: 2em;
    }
  }
  
  
  
    @media only screen and (min-width: 1920px) { 
      nav .collapse ul li a {
        font-size: 0.88em;
      }
    }  
  



  /* */
  /* hamburger menu */
  .menu {
    background-color: transparent;
    border: none;
    cursor: pointer;
    display: flex;
    padding: 0;
  }
  
  .menu.navbar-toggler:focus {
    box-shadow: none;
  }
  
  .line {
    fill: none;
    stroke: #4A0007;
  
    stroke-width: 6;
    transition: stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1),
      stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
  }
  
  .line1 {
    stroke-dasharray: 60 207;
    stroke-width: 6;
  }
  
  .line2 {
    stroke-dasharray: 60 60;
    stroke-width: 6;
  }
  
  .line3 {
    stroke-dasharray: 60 207;
    stroke-width: 6;
  }
  
  .opened .line1 {
    stroke-dasharray: 90 207;
    stroke-dashoffset: -134;
    stroke-width: 6;
  }
  
  .opened .line2 {
    stroke-dasharray: 1 60;
    stroke-dashoffset: -30;
    stroke-width: 6;
  }
  
  .opened .line3 {
    stroke-dasharray: 90 207;
    stroke-dashoffset: -134;
    stroke-width: 6;
  }
  
  .navbar-toggler {
    border: none !important;
    font-size: 1em !important;
  }
  
  h2.timeline {
    text-align: start;
  }
  
  @media only screen and (max-width: 768px) {
    h2.timeline {
      text-align: center;
    } 
  }
  /*hr */
  
  /* Glyph, by Harry Roberts */
  
  hr.alt {
    overflow: visible; /* For IE */
    padding: 0;
    border: none;
    border-top: medium double #7b7b7b;
    color: #888888;
    text-align: center;
  }
  hr.alt:after {
    content: "§";
    display: inline-block;
    position: relative;
    top: -0.7em;
    font-size: 1.5em;
    padding: 0 0.25em;
    background: white;
  }
  
  
  /*sticky */
  .sticky-reg  {
    
    bottom: 25vw;
    right: 5vw;
    position: fixed;
    height: 5rem;
    width:5rem;
    border: 1px solid #981E29;
    color:aliceblue;
    background-color: #981E29;
    border-radius: 80%;
    text-align: center;
    z-index: 99999;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    animation: breathe  2s ease-in-out infinite;
  }
  
  @keyframes 
  
  breathe {
    
  0% {
      box-shadow: 0 0 0 0 #fa98a2;
    }
    70% {
      box-shadow: 0 0 0 15px rgba(37, 211, 102, 0);
    }
    100% {
      box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    }
  }
  
  /*Estilos de animacion del icono latiendo*/
  @keyframes beat {
    0% {
      transform: scale(1);
    }
    50% {
      transform: scale(1.2);
    }
    100% {
      transform: scale(1);
    }
  }
  
  .sticky-reg:hover {
    background-color: #fa98a2;
    border-color: #fa98a2;
    color: #303030 !important;
    ;
  }
  
  .ives-img {
    position: relative;
    left: 14em;
    bottom: 3.4em;
  }
  
  @media (max-width:768px) {
    .ives-img {
      position: relative;
      left: 12em;
      bottom: 3.3em;
    }
  }
  
  @media (max-width:425px) {
    .ives-img {
      position: relative;
      left: -1.5em;
      bottom: 0.1em;
      }
      .ives-img img {
        width: 150px;
      }
  }
  
  .fca-img {
    position: relative;
    left: 13em;
    bottom: 3.4em;
  }
  
  @media (max-width:768px) {
    .fca-img {
      position: relative;
      left: 11em;
      bottom: 3.2em;
    }
  }
  
  @media (max-width:425px) {
    .fca-img {
      position: relative;
      left: -1.5em;
      bottom: 0.1em;
      }
      .fca-img img {
        width: 50px;
      }
  }
  
  @media (min-width: 2559px) {
  
  span.new {
    position: absolute;
    top: 17em;
    left: 54.2em;
  }
  }
  
  @media (max-width:1920px) {
  
    span.new {
      position: absolute;
      top: 17.5em;
      left: 38em;
    }
    }
  
  @media (max-width:1440px) {
  
  span.new {
    position: absolute;
    top: 17em;
    left: 26.2em;
  }
  }
  
  @media (max-width:1024px) {
  
    span.new {
      position: absolute;
      top: 17em;
      left: 18em;
    }
    }
  
  @media (max-width:768px) {
    span.new {
      position: absolute;
      top: 19.5em;
      left: 13.2em;
  }
  }
  
  @media (max-width:425px) {
   
  span.new {
    position: absolute;
    top: 24.5em;
    left: 5.8em;
  }
  }
  
  @media (max-width:375px) {
   
    span.new {
      position: absolute;
      top: 25.5em;
      left: 4em;
    }
    }
  
    @media (max-width:320px) {
   
      span.new {
        position: absolute;
        top: 25.2em;
        left: 2.8em;
      }
      }
     
    /* Featurettes
  ------------------------- */
  
  .featurette-divider {
    margin: 5rem 0;
    /* Space out the Bootstrap <hr> more */
  }
  
  @media (max-width: 767px) {
    .featurette-divider {
      margin: 2rem 0;
      /* Space out the Bootstrap <hr> more */
    }
  }
  
  /* Thin out the marketing headings */
  /* rtl:begin:remove */
  .featurette-heading {
    letter-spacing: -.05rem;
  }
  
  /* rtl:end:remove */
  
  
  @media (min-width: 40em) {
  
     .featurette-heading {
        font-size: 50px;
    }
  }
  
  @media (min-width: 62em) {
    .featurette-heading {
        margin-top: 4rem;
    }
  }
  
  @media (min-width: 40em) {
  
    .featurette-heading-alt {
       font-size: 50px;
   }
  }
  
  @media (min-width: 62em) {
   .featurette-heading-alt {
       margin-top: 4rem;
   }
  }
  
  ul.check {
    list-style: none;
  }
  
  ul.check li:before {
    content: '✓';
    margin-right: 1em;
  }
  
  /*fonts */
  @import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');
  
  @import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');
  
  
  /*scrollbar style */
  ::-webkit-scrollbar-track
  {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
  }
  
  ::-webkit-scrollbar
  {
    width: 6px;
    background-color: #F5F5F5;
  }
  
  ::-webkit-scrollbar-thumb
  {
    background-color: #f95b26;
  }
  

  .tematica {
    font-family: Oswald, sans-serif;
    }

    .bg-mes {
      background-color: #f95b26 !important;
    }

  /*anim color*/

  .anim-color {
    background-color: #FE0062;
   animation-name: cambiocolor;
   animation-duration: 4s;
   animation-iteration-count: infinite;
  }
  
  @keyframes cambiocolor {
    0% {background-color: #FE0062;}
    30% {background-color: #ff3030;}
    100% {background-color: #FE0062;}
  }
  


  /*mes pin*/

  .mes-pin.agosto {
    min-height: 100%;
    background: url(img/fondo-agosto.webp) /* rgb(254, 0, 97)*/;
    background-position: 50% 10%;
    background-size:contain;
    background-repeat: repeat;
}


  .mes-pin.julio {
    min-height: 100%;
    background: url(img/fondo-julio.webp) /* rgb(254, 0, 97)*/;
    background-position: 50% 10%;
    background-size:contain;
    background-repeat: repeat;
}

  .mes-pin.junio {
    min-height: 100%;
    background: url(img/fondo-junio.webp) /* rgb(254, 0, 97)*/;
    background-position: 50% 10%;
    background-size:contain;
    background-repeat: repeat;
}


  
  .mes-pin.mayo {
    min-height: 100%;
    background: url(img/fondo-mayo.webp) /* rgb(254, 0, 97)*/;
    background-position: 50% 10%;
    background-size:cover;
}


  
  .mes-pin.abril {
    min-height: 100%;
    background: url(img/fondo-abril-web-08.webp) /* rgb(254, 0, 97)*/;
    background-position: 50% 50%;
    background-size:contain;
}


  .mes-pin.marzo {
    min-height: 100%;
    background: url(img/1x/ddhh.webp)  rgb(254, 0, 97);
    background-position: 50% 20%;
    background-size:cover;
    background-blend-mode:multiply;
}


  .mes-pin a {
    color: #F5F5F5;
  }