  
  
     * { box-sizing: border-box; } 
    html, body {
      width:100%; 
       -webkit-appearance: none;
       appearance: none;        
    }
    html{scroll-behavior: smooth !important;}
    body {
      margin:0;      
      font: 300 22px "Gotham", sans-serif; 

      opacity: 1;
      /* background-color:#eaeaea; */
      /* background: linear-gradient(180deg, rgba(239,241,146,1) 0%, rgba(238,242,249,1) 100%); 
      border:1px solid yellow
      */      
      background-attachment: fixed;
      color: #53565A;
      overflow-x: hidden;
      overflow-y: scroll !important;
    }

    @media(min-width:2000px){
      /* body{ zoom:1.3; }      */
    }

    
    * { line-height:120%; font-weight:400; }
       a { text-decoration:none; color:inherit; font-family:inherit; font-weight: inherit;} 

      .upper { text-transform: uppercase;}
      .bggr { background: #003E2F;background: linear-gradient(120deg, rgba(0, 62, 47, 1) 0%, rgba(0, 24, 18, 1) 100%);}
      .bgwh { background-color: #FFFFFF; }
      .bggray { background-color:#f2f2f2;  }
      .bgbl { background-color:#0033A0;  }

      .bggr_gray { background-color: #E3E829; }
      .bggray_gr { background-color: #f2f2f2; }

      .dkgr { color:#003D2E;}

      @media(max-width:1100px){
        .bggr_gray { background-color: #f2f2f2; }
        .bggray_gr { background-color: #E3E829; }
      }

      input, * { font-family: 'Gotham', serif; }

      .Dingos { font-family:'Dingos' !important; }

      a, .link1 {text-decoration:none;}

      h1 { font-weight:600; font-size:2.5em; line-height:125%;}
      @media(max-width:800px){
        h1 { font-size:1.6em; line-height:115%;}
      }
      h1, h2, h3, h4, h5, h6 {
        text-wrap: pretty;
      }

      @media(max-width:1100px){
        body {font-size:19px;}
      }
    
      p, div { line-height:130%; text-wrap:pretty; font-weight:400}

      b { font-weight:700 !important; }

      div {position:relative;}

    .flex1{
      display: flex; flex-flow: row wrap; justify-content:space-between;
    }

    .flex2{
      display: flex; flex-flow: column wrap; justify-content:space-between;
    }

    .flex3{
      display: flex; flex-flow: row wrap; justify-content: flex-start;
    }

    .flex4{
      display: flex; flex-flow: row wrap; justify-content:center;
    }

    .flex5{
      display: flex; flex-flow: column wrap; justify-content:center;
    }
    .flex6{
      display: flex; flex-flow: column wrap; justify-content:flex-end;
    }
    .flex7{
      display: flex; flex-flow: row wrap; justify-content:flex-end;
    }
    .flex8{
      display: flex; flex-flow: row wrap; justify-content:center;
    }
    .flex9 {
      display: flex;  justify-content: flex-start; align-items: center;
    }
    .flex10 {
      display: flex;  justify-content: flex-end; align-items: center;
    }
    .flex11 {
      display: flex; flex-flow: row wrap; justify-content:space-around;
    }
    
    
  [data-aos='rotate-round'] {
    transform: rotate(-360deg);
    transition-property: transform;
   }
   [data-aos='rotate-round'].aos-animate {
      transform: rotate(0deg);
   }

   .w5 { width:5%; }
   .w10 { width:10%; }
   .w20 { width:20%; }
   .w23 { width:23%; }
   .w25 { width:25%; }
   .w30 { width:30%; }
   .w32 { width:32%; }
   .w33 { width:33%; }
   .w35 { width:35%; }
   .w40 { width:40%; }
   .w45 { width:45%; }
   .w48 { width:48%; }
   .w49 { width:49%; }
   .w50 { width:50%; }
   .w55 { width:55%; }
   .w60 { width:60%; }
   .w65 { width:65%; }
   .w70 { width:70%; }
   .w75 { width:75%; }
   .w80 { width:80%; }
   .w85 { width:85%; }
   .w90 { width:90%; }
   .w100 { width:100%; }
   .w5,.w10,.w20,.w23,.w25,.w30,.w32,.w33, .w35,.w40, .w45, .w48, .w49, .w50, .w55, .w60, .w65, .w70, .w75, .w80, .w85, .w90, .w100 { 
    position:relative;
   }
   @media(max-width:800px){
    .w5,.w10,.w20,.w23, .w25,.w30,.w32,.w33,.w35,.w40, .w45, .w48, .w49, .w50, .w55, .w60, .w65, .w70, .w75, .w80, .w85, .w90 { 
      width:100%;
    }
    .topnumbers { width:40%; max-width:260px; margin:0.5em; border:0px solid pink; }
    .em28 { font-size:1.8em; }
   }


   .w32a { width:32%; }
   @media(max-width:1200px){ .w32a { width:48%; } }
   @media(max-width:800px){ .w32a { width:100%; } }

   .ww10 { width:10%; }
   .ww18 { width:18%; }
   .ww20 { width:20%; }
   .ww23 { width:23%; }
   .ww25 { width:25%; }
   .ww30 { width:30%; }
   .ww33 { width:33%; }
   .ww35 { width:35%; }
   .ww40 { width:40%; }
   .ww45 { width:45%; }
   .ww48 { width:48%; }
   .ww50 { width:50%; }
   .ww55 { width:55%; }
   .ww60 { width:60%; }
   .ww60i { width:60% !important; }
   .ww65 { width:65%; }
   .ww70 { width:70%; }
   .ww75 { width:75%; }
   .ww80 { width:80%; }
   .ww85 { width:85%; }
   .ww90 { width:90%; }
   .ww93 { width:93%; }
   .ww95 { width:95%; }
   .ww100 { width:100%; }
   .ww10,.ww18,.ww20,.ww23,.ww25,.ww30,.ww33,.ww35,.ww40, .ww45, .ww48, .ww50, .ww55, .ww60, .ww65, .ww70, .ww75, .ww80, .ww85, .ww90 { 
    position:relative;
   }
   /*
   @media(max-width:1100px){
    .ww10,.ww20,.ww25,.ww30,.ww35,.ww40, .ww45, .ww48, .ww50, .ww55, .ww60, .ww65, .ww70, .ww75, .ww80, .ww85, .ww90 { 
      width:100%;
    }
   }
   */


   .em07 { font-size:0.7em; }
   .em075 { font-size:0.75em; }
   .em08 { font-size:0.8em; }
   .em085 { font-size:0.85em; }
   .em09 { font-size:0.9em; }
   .em095 { font-size:0.95em; }
   .em10 { font-size:1em; }
   .em11 { font-size:1.1em; }
   .em12 { font-size:1.2em; }
   .em13 { font-size:1.3em; }
   .em14 { font-size:1.4em; }
   .em15 { font-size:1.5em; }
   .em16 { font-size:1.6em; }
   .em17 { font-size:1.7em; }
   .em18 { font-size:1.8em; }
   .em19 { font-size:1.9em; }
   .em20 { font-size:2em; }
   .em21 { font-size:2.1em; }
   .em22 { font-size:2.2em; }
   .em23 { font-size:2.3em; }


   .em11i { font-size:1.1em !important; }
   .em12i { font-size:1.2em !important; }
   .em13i { font-size:1.3em !important; }
   .em14i { font-size:1.4em !important; }

   .fw100 { font-weight:100 !important;; }
   .fw200 { font-weight:200 !important;; }
   .fw300 { font-weight:300 !important;; }
   .fw400 { font-weight:400 !important;; }
   .fw500 { font-weight:500 !important;; }
   .fw600 { font-weight:600 !important;; }
   .fw700 { font-weight:700 !important;; }
   .fw800 { font-weight:800 !important;; }

   .mt05 { margin-top:0.5em; }
   .mt06 { margin-top:0.6em; }
   .mt1 { margin-top:1em; }
   .mt2 { margin-top:2em; }
   .mt3 { margin-top:3em; }

   .mt06neg { margin-top:-0.6em; }
   .mt1neg { margin-top:-1em; }
   .mt2neg { margin-top:-2em; }
   .mt3neg { margin-top:-3em; }

   .mb1 { margin-bottom:1em;  }
   .mb2 { margin-bottom:2em; }
   .mb3 { margin-bottom:3em; }

   .bl { color: #0033A0 !important; }
   .wh { color: #ffffff !important; }
   .gr { color: #E3E829 !important; }
   .gry { color: #53565A !important; }


   .org { color: #EB6427 !important; }
/* .dgrn { color: #003D2E !important; } */
   .dgrn { color: #327452 !important; }
   .mgrn { color: #067755 !important; }
  /* .lgrn { color: #007B5A !important; } */
   .lgrn { color: #019E3E !important; }

   
   .bg-org { background-color: #EB6427 !important; }
   .bg-dgrn { background-color: #327452 !important; }
   .bg-lgrn { background-color: #019E3E !important; }
   .bg-wh { background-color: #fff !important; }
   


   @media(max-width:500px){
    .topnumbers { width:80%;}
   }




   @media(min-width:800px){
      .em12desk { font-size:1.2em; font-weight:300;}
      b.em12desk { font-size:1.23em;}
       
      .em14desk { font-size:1.4em; font-weight:200;}
      .em16desk { font-size:1.6em; font-weight:200;}
      .em18desk { font-size:1.8em; font-weight:200;}
      .em28desk { font-size:2.8em; font-weight:200;}

      .em12deskB { font-size:1.2em; font-weight:600;}
      .em14deskB { font-size:1.4em; font-weight:600;}
      .em16deskB { font-size:1.6em; font-weight:600;}
      .em18deskB { font-size:1.8em; font-weight:600;}
      .em28deskB { font-size:2.8em; font-weight:600;}

   }
   

   .num1 {width:95%}
   @media(max-width:500px){
    .num1 {width:80%}
   }
   .txtlabel { color: #0033A0; font-weight:400; }
   input[type=text],input[type=number] { 
    background-color:FBFCFE; border:1px solid #C9D4EB; color:#525252; padding:1em; border-radius:0.5em; margin-top:0.3em; margin-bottom:0.6em;
    width:94%;
  }

  .shadowClass {  filter: drop-shadow(0 0.4rem  0.7rem rgba(0,0,0,0.1)); transform: translateZ(0); }
  .shadow1 { filter: drop-shadow(0 0.2rem 0.4rem rgba(0,0,0,0.25)); transform: translateZ(0); }


/* calcula:  */

  .topbox { width:70%; margin-left:20%; position:relative; border:0px solid cyan;}
  .topinner { width:49%; position:relative; border:0px solid orange;}

  .greenbox1 { width:90%; margin-left:10%; height:90px; background-color: #E3E829; color:#0033A0; border-radius:0px 17px 0px 0px; position:relative; }
  /* width:calc(100% - 45px); */
  .inner1 { width:95%; margin-left:5%; padding:1.4em; border:3px solid  #E3E829; border-width:0px 3px 0px 3px; background-color:white }
  .icon1 {width:100%; filter:unset;}
  /*calc(100% - 45px);  */

  .doubledown { width:90%; color:#0033A0; font-weight:600; margin-left:10%; border:3px solid  #E3E829; 
    border-radius:0px 0px 20px 20px; background-color:#ffffff; }

  .doubledown2 { width:95%; color:#0033A0; font-weight:600; margin-left:5%; border:3px solid  #E3E829; 
    border-radius:0px 0px 20px 20px; background-color:#ffffff;}    

  .button01 {
    width:50%; border-right:3px solid  #E3E829; padding:1.4em; text-align:center;cursor:pointer;z-index:2;        
  }
  .button01:hover {background-color:#f0f0f0;}

  .button1 {
    /* width:fit-content; */
    filter: drop-shadow(0 0 0.3em rgba(0,0,0,0.25));
     padding:0.6em 3em; color:#0033A0; background-color: #E3E829;  border-radius:3em; 
    cursor:pointer;  
    border:0;
    /*  display: flex; flex-flow: column wrap; justify-content:center;  */
    text-align:center;
    transform: translateZ(0);
   /*  will-change: filter;  --- transform-gpu --- backdrop-blur-0 (backdrop-filter: blur(0); */
  }

  .button2 {
    width:fit-content; padding:1em 3em; color:#0033A0; background-color: #E3E829;  border-radius:2em; 
    cursor:pointer;  filter: drop-shadow(0 0.2rem 0.4rem rgba(0,0,0,0.25)); border:0;
  }
  .button2:hover, .button1:hover, .button2a:hover {
    background-color: #D0D449
  }
  .button2a {
    padding:0.6em 1.2em !important; color:#0033A0; background-color: #E3E829; border:0; border-radius:2em; 
    cursor:pointer; text-align: center; width:96%; margin:0px auto; line-height:105%;
    height:auto;
    display: flex; flex-flow: column wrap; justify-content:center;
    font-weight:500;
  }
  


  .button01 a, .button1  a {text-decoration: none;}

  /*width:fit-content;*/
  .button3 {
     padding:1em 3em !important; color:#fff; background-color: #0033A0; border:0; border-radius:2em; 
    cursor:pointer; text-align: center;
  }
  .button3a {
    padding:0.5em 1em !important; color:#fff; background-color: #0033A0; border:0; border-radius:2em; 
    cursor:pointer; text-align: center; width:96%; margin:0px auto; line-height:105%;
    height:100%;
    display: flex; flex-flow: column wrap; justify-content:center;
  }

  .button4 {
    padding:0.6em 4.5em !important; color:#0033A0; background-color: #E3E829; border:0; border-radius:2em; 
    cursor:pointer; text-align: center; width:96%; margin:0em auto; line-height:105%;
    height:100%; font-size:0.95em; font-weight:600; text-align:left;    
    background-repeat:no-repeat; background-position: right 1em center; background-image:url('im/blueboxarr.svg');
  }

  .dblock { display:block; }

  @media(max-width:1200px){
    .button3, .button3a, .button2a { margin-bottom:1em; border-radius: 2em; padding:0.6em 0.8em !important; border-radius:1.2em;}
    .button4 { padding:1em 2.3em 1em 1em !important; }
    /*
    .button4 { width:100%; border-radius: 1em; margin-bottom:1em;padding:1em 3em 1em 2em !important; }
    */
  }

  .button3:hover,.button3a:hover { background-color: #022A80; }

  .icon2 {width:90%; max-width:18px; min-width:15px; filter:unset; margin-top:15px;}
  .icon3 {width:100%; max-width:60px; filter:unset; margin-top:10px; }
  .icon4 {width:90%; max-width:18px; min-width:15px; filter:unset; margin-top:20px;}
  .icon3box { width:12%; text-align:center } .icon3box2 { width:87%; }
  .icon4box { width:18%; }
  .icon4 { width:100%; margin-top:0em; max-width:70px;}
  .iconbox1 { width:4% } .iconbox2 { width:94% }
  .iconbox3 { width:2% } .iconbox4 { width:96% }
  .calcula-icon { width:120px; height:160px;}
  

  .calc-top { width:60%; margin:0px auto; border:0px solid orange; }
  .calcP { width:calc(100% - 170px); }
  .greenBack { background-image:url('../im/greenback-2.png'); height:330px; background-size:1600px; }
  .greenHeader { cursor:pointer;width:100%; border-radius:17px 17px 0px 0px; color:#0033A0; background-color: #E3E829; padding:1.2em 3em; font-size:1.6em }
  .radiobox{ width:31%; min-width:24px; display:flex;margin-bottom:0.5em; }

  #mobileMenu { display:none; position:fixed; top:100px;left:0px; width:95%;max-width:500px; filter: drop-shadow(0 0 0.5rem rgba(0,0,0,0.3)); cursor:pointer; }

  .snow {  background: linear-gradient(180deg, rgba(255,255,255,1) 0%,  rgba(255,255,255,1) 20%, rgba(255,255,255,0) 100%); }
  

  #deskMenuWrap { z-index:5; width:100%; display:none; position:fixed; top:84px; left:0; height:84px; text-align:center; }
  #deskMenu { position:relative; margin:10px auto; width:90%; max-width:1400px; filter: drop-shadow(0 0 0.5rem rgba(0,0,0,0.3)); cursor:pointer; 
    background-color:rgba(255,255,255,0.99); border-radius:7px; padding:0.3em 1em 0.3em 1em;  border:1px solid white; color:silver; font-size:0.85em;
  }
  .pp {display:none;}
  .ppview {display:block;}

  @media(max-width:1000px){
    #deskMenuWrap, #deskMenuWrap, .snow { display:none; }
  }

  

  .topMspacer {width: 100%; height:18px; border:0px solid red}
  .small .topMspacer {width: 100%; height:6px; border:0px solid red}
  
  .topMtitle{text-align:center; width:18%; font-weight:600;}
  .small .topMtitle{font-size:0.85em;}
  .ttsel { color:#4EC3E0; margin-bottom:26px;}
  .small .ttsel { color:#4EC3E0; margin-bottom:6px;}
  .topMroad { background-color: rgba(221,221,221,1); width:20%; text-align: center; margin-top:10px; margin-bottom:10px;}
  .small .topMroad {  margin-top:0px; margin-bottom:0px;}
  .topMcircle { width:7px; height:7px; margin:auto; background-color:#999; border-radius:50%; }
  .topMr { border-radius:0px 6px 6px 0px; }
  .topMl { border-radius:6px 0px 0px 6px; }
  .full1 { background: #00AEC7 }
  .half1 { background: linear-gradient(90deg, #00AEC7 49%, rgba(221,221,221,1) 49%); }
  .half1:before{
    content:'';background-image:url('../im/here.svg');background-size:cover;width:30px;height:33px;background-repeat: no-repeat;position:absolute; 
    bottom:10px;left:calc(50% - 14px);
  }
  .small .half1:before{ display:none; background-image:''; width:0px; height:0px; }
  .half1 .topMcircle { width:16px; height:16px; background-color:#00AEC7; border:2px solid white; margin-top:0px; position:absolute; left:calc(50% - 5px); top:-4px}
  .full1 .topMcircle {  background-color: white; }
  .full2 { color:#99DFE9; }

.Desk, #mainDesk, #etapasDesk   {    display:block; }
.DeskF {    display:flex; }
.MobileF, .Mobile, .Mobile5 {    display:none; }
.Mobile7, .Mobile7F {    display:none; }

.nutin, .Mobile, #mainMobile, #etapasMobile {    display:none; }

  .logo1, .logo2 { height:45px; }
  .topBar { position:fixed;width:100%; padding:17px 40px;background-color:white; border-bottom:4px solid #00AEC7; top:0px; z-index:4;  }
  .divider {width:30px; height:45px; border-right:1px solid #525252; margin-right:30px;}




@media(max-width:800px)
  {
    .Mobile7  {    display:block; }
    .Mobile7F  {    display:flex; }
  }

@media(max-width:800px){
  .icon4box { width:14%; } .icon4 { margin-top:0em; max-width:50px;}
  .iconbox1 { width:5% } .iconbox2 { width:90% }
  .iconbox3 { width:5% } .iconbox4 { width:90% }
  .logo1, .logo2 { height:37px; }
  .Desk, .DeskF, #mainDesk, #etapasDesk   {    display:none;  }
  .nutin, .Mobile, #mainMobile, #etapasMobile {    display:block; }
  .MobileF {    display:flex; }
  .topbox { width:90%; margin-left:5%;}
  .topinner { width:100%;}
  .inner1 { width:90%; margin-left:10%;}
  .doubledown2 { width:90%; margin-left:10%;}
  .greenBack { background-image:url('../im/greenback-mobile.png'); height:230px; background-size:cover; }
  .greenHeader { width:100%; border-radius:17px 17px 0px 0px; color:#0033A0; background-color: #E3E829; padding:1.2em 1em; font-size:1.6em; }
  .calc-top { width:90%; margin:30px auto; }
  .calcP { width:calc(100% - 80px); }
  .calcula-icon { width:60px; height:77px; }
  .radiobox{ width:90%; display:flex;margin-bottom:0.5em; padding-left:1em }
  .button1, .button2 {
    position:relative; display:inline-block; 
    padding:0.6em 1.2em;border-radius:1.2em; 
  }
  
}

@media(max-width:600px){
  .iconbox1 { width:6% } .iconbox2 { width:90% }
  /*.logo1, .logo2 { height:30px; }*/
}
  

  .mleft { position:relative;   width:14%; border:0px solid orange; height:40px; max-width:70px;}
  .mright { position:relative;  width:84%; border:0px solid red; height:40px; padding-top:10px; text-align:left; color:silver; font-size:1.2em}

  .mroad { position:absolute;   width:28%; height:40px; margin-left:36%; }

  .solid { font-size:1.2em; font-weight:600; color:gray;}

  .sel { color:#00AEC7; }

/*
  .full { background: rgb(153,223,233); }
  .half { background: linear-gradient(180deg, rgba(153,223,233,1) 49%, rgba(221,221,221,1) 49%); }
  .half:before{
    content:'';
    background-image:url('../im/here.svg');
    background-size:cover;
    width:40px;height:44px;
    background-repeat: no-repeat;
    position:absolute;
    bottom:31px;
    left:-12px;
  }
  .empty { background: #dddddd; }

  .topfull { background: linear-gradient(180deg, white 49%, rgba(153,223,233,1) 49%); }
  .topempty { background: linear-gradient(180deg, white 49%, #dddddd 49%); }

  .full .dot{ position:absolute; width:7px;height:7px;border-radius:4px; background-color:white; bottom:16px; left:calc(50% - 3.5px); }
  .dot{ position:absolute; width:7px;height:7px;border-radius:4px; background-color:silver; bottom:16px; left:calc(50% - 3.5px); }
  .topfull .dot, .topfull .bdot { position:absolute; width:20px;height:20px;border-radius:10px; background-color:rgba(153,223,233,1); bottom:11px; left:calc(50% - 10px); border:3px solid white }

  .half .dot, .half .bdot{ position:absolute; width:20px;height:20px;border-radius:10px; background-color:#00AEC7; bottom:11px; left:calc(50% - 10px); border:3px solid white }

  .bdot{ position:absolute; width:18px;height:18px;border-radius:9px; background-color:gray; bottom:10px; left:calc(50% - 9px); border:3px solid white }
  .bottom { border-radius:0px 0px 15px 15px; }
  .mright a { color:inherit; }
  .mright a:hover { color:#00AEC7; }
  
  .rows{width:100%}
*/

  #mobileMenu { position:fixed;width:90%; background-color:white;height:90vh;border-radius:0px 17px 17px 0px; border:3px solid  #E3E829; border-left:0px; z-index:3;} 
  .mobileMenuWindow {width:90%;  margin-top:40px; height:calc(100vh - 220px); overflow:none; overflow-y:scroll;}
  .mobileMenuInner {width:100%; position:relative; margin-top:35px;}
  #mobileMenu a { text-decoration:none;}

  .blueOl li { font-weight: 600; color: #0033A0; padding-bottom:0.8em; margin-left:0; padding-left:0;}
  .blueOl { margin-left:0; padding-left:1em;}

  .listTitle { width:31%; margin-left:1%;  padding:0.7em; }
  .listItem { width:31%; margin-left:1%; padding:2em 1.1em; }

  .listBoxM { width:100%; background-color:#EAF5FB;font-size: 1.4em; color: #0033A0; font-weight:600; border-radius:11px 11px 0px 0px; }
  .listTitleM { width:91%; margin-left:3%;  padding:0.7em; }
  .listItemM { width:91%; margin-left:3%; padding:1.7em 1.1em;  border-bottom:1px solid #0033A0; }
  .svgimg { width:70%;margin:auto; margin-top:-10%;  }
  @media(max-width:800px){
    .svgimg { width:60%; margin:20px auto;}
  }

  .bubble { display:none;position:absolute; border:1px solid #00AEC7;  top:9px; text-align:left; 
    left:-50px;min-width:120px; padding:0em 0.4em 0em 0.4em; opacity:0.9; background-color:white; border-radius: 5px; }
  .bubbleUl { padding:0em 0.2em 0em 0.4em;  color:#99DFE9; padding-inline-start:20px; list-style-type: disc !important;}
  .bubbleUl li  {list-style-type: disc !important; }
  .bubbleUl li { padding-bottom:0.4em; font-size:0.8em;}
  .bubbleUl li a { text-decoration: none; color:silver;}
  .bubbleUl li a.sel { color:#00AEC7;}
  
    .bottomButtons {width:90%; margin-left:5%; text-align:left; margin-top:80px; margin-bottom:60px;}

  .descargar { margin-left:10px; margin-bottom:20px; width:340px; height:60px; border-radius:30px; text-align:left; border:2px solid #E3E829; background-color:white; cursor:pointer}
  .descargar:hover { background-color: #fafafa;}
  .adown { color:#0033A0; font-size:1.1em;font-weight:600; text-decoration: none;}
  .down { width:60px; margin-left:-10px; vertical-align: middle; margin-top:-1px;}
  .downdiv {display:inline-block;width:280px; text-align:center;}

  /*-- calcula 3 --*/

  .lblue { width:100%; min-height:46em; border-bottom:1px solid #EDF8FB; background-color: #EDF8FB; border-radius:17px 17px 0px 0px;}
  .tab { padding:0.7em 3em; width:fit-content; text-align:center; border-radius:2em 2em 0 0; cursor:pointer; }
  .tab:hover{ text-decoration: underline;}
  .seltab { background-color: #E3E829; color:#0033A0;  font-weight:600;}
  @media(max-width:1000px){
    
    .tab { font-size:0.8em; padding:0.5em 1em; }
  }
  @media(max-width:800px){
    .lblue { min-height:20em;}
  }
  @media(max-width:600px){        
    .tab { font-size:0.7em; padding:0.5em 0.5em;}
  }
   /* #info1 { transition: all 2s linear 1s; } */

   .sp05 {width:100%; height:0.5em;}
   .sp10 {width:100%; height:1em;}
   .sp15 {width:100%; height:1.5em;}
   .sp20 {width:100%; height:2em;}

   .cen { text-align:center !important;; }
   .left { text-align:left !important; }
   .right { text-align:right !important; }
   .mw450 {max-width:450px;}
   .mw600 {max-width:600px;}
   .mw700 {max-width:700px;}
   .mw800 {max-width:800px;}
   .mw900 {max-width:900px;}
   .mw1000 {max-width:1000px;}
   .mw1100 {max-width:1100px;}
   .mw1200 {max-width:1200px;}
   .mw1300 {max-width:1300px;}
   .mw1400 {max-width:1400px;}

   .lh110 { line-height:110%; }
   .lh120 { line-height:120%; }
   .lh130 { line-height:130%; }
   .mauto { margin:0px auto }
   .wauto { width:fit-content; }

   .h1em { height:1em; }
   .h2em { height:2em; max-width:100%}
   .h3em { height:3em;  max-width:100%}
   .h4em { height:4em; }
   .h5em { height:5em; }
   .h6em { height:6em; }
   .h7em { height:7em; }
   .h8em { height:8em; } 


   .spacer1 { width:100%; height:1em; }
   .spacer2 { width:100%; height:2em; }
   .spacer3 { width:100%; height:3em; }
   .spacer4 { width:100%; height:4em; }
   .spacer5 { width:100%; height:5em; }
   .spacer6 { width:100%; height:6em; }
   .spacer7 { width:100%; height:7em; }
   .spacer8 { width:100%; height:8em; }
   .spacer9 { width:100%; height:9em; }


   .mr5p { margin-right:5%; }
   .mr10p { margin-right:10%; }
   .mr15p { margin-right:15%; }
   .mr20p { margin-right:20%; }
   .mr25p { margin-right:25%; }
   .mr30p { margin-right:30%; }
   .mr35p { margin-right:35%; }
   .mr40p { margin-right:40%; }
   .mr45p { margin-right:45%; }
   .mr50p { margin-right:50%; }

   .ml5p { margin-left:5%; }
   .ml8p { margin-left:8%; }
   .ml10p { margin-left:10%; }
   .ml15p { margin-left:15%; }
   .ml20p { margin-left:20%; }
   .ml25p { margin-left:25%; }
   .ml26p { margin-left:26%; }
   .ml27p { margin-left:27%; }
   .ml30p { margin-left:30%; }
   .ml35p { margin-left:35%; }
   .ml40p { margin-left:40%; }
   .ml43p { margin-left:43%; }
   .ml44p { margin-left:44%; }
   .ml45p { margin-left:45%; }
   .ml50p { margin-left:50%; }
   .ml55p { margin-left:55%; }
   .ml60p { margin-left:60%; }
   .ml61p { margin-left:61%; }
   .ml65p { margin-left:65%; }
   .ml70p { margin-left:70%; }
   .ml75p { margin-left:75%; }
   .ml78p { margin-left:78%; }
   .ml80p { margin-left:80%; }
   .ml85p { margin-left:85%; }
   .ml90p { margin-left:90%; }

/* --- bootstrap --- */

   .mb-1 { margin-bottom:0.25em; }
   .mb-2 { margin-bottom:0.5em; }
   .mb-3 { margin-bottom:1em; }
   .mb-4 { margin-bottom:1.5em; }
   .mb-5 { margin-bottom:3em; }


   .hauto { margin:0em auto; }

  .topheader { width:100%; background-color:white; border-top:1px solid white;
      position:fixed; border-bottom:4px solid #00aec7; top:0px; left:0px; z-index: 5;}
  .topheader-inner { width:80%;  margin:25px auto; position:relative;}
  .logo { width:100px; margin-bottom:-10px; cursor: pointer;}
  .hamburger { width:26px; position:absolute; right:0; top:4px; vertical-align:middle; }
  #hamburger { height:1em; position:absolute; top:0.5em; left:0; cursor:pointer; }
  
  .topspacer { width:100%; height:84px; }
  .inner { width:90%; margin:0px auto; }

  .menu { display:none; position:fixed;width:100%;top:80px; z-index:5;}
  .menu1 { text-align:left; filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.3)); padding:1em;z-index:5; border-radius:0em 0em 1em 1em; background-color:#F7F7F7;}
  .menu a { text-decoration:none !important; }

@media(max-width:1100px)
  {
    .menu1 { background-color:white; }
  }


  .menublue { width:100%; padding:1em 2em; border-radius:1em; background-color: #0033A0;}
  .menuitem { width:90%; margin:0em auto; padding:0.4em 1.8em 0.3em  0.3em; color: #0033A0; border-bottom:1px solid #0033A0; background-image:url('im/menuarr.svg');
    background-repeat:no-repeat; background-position: right 1em center;}
  .menuitem:hover {cursor:pointer; background-color: #f2f2f2;}
  

    

  .wbox { background-color:white; border:1px solid #0033A0; border-radius: 0.7em; padding:0.5em 1.4em;}
  .wbox2 { background-color:white; border:0px; border-radius: 0.7em; padding:1em; position:relative; filter: drop-shadow(0 0.2rem 0.4rem rgba(0,0,0,0.25));}
  .wbox2-inner {width:88%; margin:0em auto;}
  /* .ill { height:100%; width:auto; border:1px solid red;  } height:10em; */
  .ill {background-repeat:no-repeat; background-position: center; background-size: contain; max-height:3.7em;}
  @media(max-width:800px){
    .ill { width:100%; height:auto; }
  }

  .btn1 { display:inline-block; width:fit-content; padding:0.5em 2em; margin:0em 0.3em; 
      color:#525252;border:2px solid #C9D4EB; border-radius:0.6em; font-size:0.9em }    

  .gen1 { padding:0.4em 0.6em; font-weight:300;}

      @media(max-width:1000px){
        /* .btn1 {  width:90%; margin-bottom:0.4em} */
        .btn1 {  margin-bottom:0.4em;  } /* top:0.6em; */
      }

  .btn1:hover { background-color: #F5FAFC; cursor: pointer;}
  input[type=text],input[type=number]{border:2px solid #C9D4EB; padding:0.4em 1em; margin-bottom: 0.5em; margin-top: 0.5em; font-size:0.9em}
  input::placeholder {  color: #555; font-size: 1em; font-weight:300 }
  .nodecor, a.nodecor, .nodecor a { text-decoration:none !important; }

  .arr {width:2.4em;}
  .toparr {width:1.1em; position:absolute; top:1em; right:1em}

  .borange { border:1px solid orange }
  .bred { border:1px solid red }
  .blime { border:1px solid lime }
  .bblue { border:1px solid blue }
  .bcyan { border:1px solid cyan }
  .bpurple { border:1px solid purple }

  .bullet1 { font-size:1.8em; font-weight:600; width:65%; background-color: #E3E829; color:#0033A0; padding:0.5em 1em 0.5em 0em;  margin-left:0; margin-top:1em; border-radius:0em 3em 3em 0em; filter: drop-shadow(0 0.2rem 0.4rem rgba(0,0,0,0.25)); }
  .bullet2 { color: #E3E829; background-color:#0033A0; padding:0.5em 2em; width:40vw; margin-left:0; margin-top:1em; border-radius:0em 3em 3em 0em; filter: drop-shadow(0 0.2rem 0.4rem rgba(0,0,0,0.25)); }

  @media(max-width:1000px)
    {.bullet1, .bullet2 {  font-size:1.4em; width:77vw; border-radius:0em 0.6em 0.6em 0em;  }
  }


  .bullet1 { padding-left: 10%; } 
  
  @media(min-width:1700px){
     .bullet1 { padding-left: calc((100vw - 1400px) * .5); } 
  }


  @media(min-width:2000px){
    .bullet1 { padding-left: calc((100vw - 1400px) * .25);} 
    /* .bullet1 { padding-left: calc((100vw - 1000px) * .193); background-color:silver; } */
  }

  .midline{ width:100%; margin-left:0% }
  
  .midline:before {
    background-color: #0033A0;
    content: "";
    display: block;
    height: 1px;
    width: 100%;
    position: absolute;
    z-index: -1;
    left: 0;
    top: calc(50% - 1px);
  }

  .circle { width:2em; height:2em; border-radius:2em; margin:0;  position:relative; text-align:center; font-size:1.2em; font-weight:600;}
  .circle1 { width:1em; height:1em; border-radius:1em; margin:0;  position:relative; text-align:center; font-size:0.8em; font-weight:600;}
  .circle:hover { cursor:pointer; border:1px solid #dddddd;  }
  .circle1:hover { cursor:pointer; opacity:0.5  }
  .cgray { background-color:#E3E829; color: #0033A0;}
  .cblue { background-color:#0033A0; color: #f2f2f2;}

  .cgray1 { background-color:#f2f2f2; border:2px solid #f2f2f2; }
  .cblue1 { background-color:#0033A0; border:2px solid #f2f2f2;}

  .slides01 { width:100%; min-height:450px; text-align:center; margin-top:1em;}
  .slides001 { width:100%; min-height:150px; text-align:center; margin-top:1em;}
  .slidesblue { width:100%; margin-left:0%; min-height:400px; background-color:#0033A0; border-radius: 0.7em;}
  .slidestop { width:100%; height:2em; position:relative;  margin-bottom:-0.4em; text-align:left;}
  .bluetriangle { height:2em;position:relative; }
  .semicircle { position:absolute; bottom:0px; width:80%; right:10%; z-index:0;}
  .semicircle2 { position:absolute; left:0px; height:90%; top:5%; z-index:0;}
  .blueslideh1 { color: #E3E829;font-size:1.4em; font-weight:500; width:85%; margin:0em auto 1em auto; z-index:1; line-height: 100%;}
  .blueslidep { color:white;margin-top:1em; width:85%; margin:0em auto; z-index:1; font-weight:200;}

    @media(min-width:800px){      
      .slidesblue { width:100%; margin-left:0%; }
      .bluetriangle { height:1.6em; margin-bottom:-1em}
      /* .midline{ width:60%; margin-left:0% } */
      .blueslideh1 {  text-align:left}
      .blueslidep {  text-align:left}
    }

    @media(min-width:1100px){     
      .midline{ width:60%; margin-left:0% } 
    }
  
  .slide1-img { width:30%; margin:1em auto; z-index:1;}
  .slide2-img { width:13%; margin:1em auto; z-index:1;}
  .slide3-img { width:20%; margin:1em auto; z-index:1;}

  .slide-img { width:90%; margin:1em auto; z-index:1;}
  .slide-img-D { width:75%; margin-left:20%; z-index:1;}
  .slide-img-Dsm  { width:50%; margin-left:20%; z-index:1;}
  .slide-img-Dsm2 { width:45%; margin-left:20%; z-index:1;}

  .blueul { text-align:left; margin-top:1.3em; }
  .blueul li {  
    color:white; 
    list-style-image: url("im/bullseye.svg");    
    padding-left:0.6em;
    padding-top:-0.4em;
    padding-bottom:0.6em;
    line-height:130%;
  }

  .h1em { height:1em; }
  .h2em { height:2em; }
  .h3em { height:3em; }
  .h4em { height:4em; }
  .h5em { height:5em; }
  .h5em { height:6em; }

  .bluebox { background-color:#0033A0; width:100%; padding:1em 1em 0.5em 1em; text-align:center;}
  .bbclosed {  margin-bottom:1em; border-radius:1em;cursor:pointer; }
  .bbopen {  margin-bottom:0em; border-radius:1em 1em 0em 0em;cursor:pointer;}

  .bbclosed4 {  margin-bottom:1em; border-radius:1em;background-repeat:no-repeat; background-position: right 1em center; background-image:url('im/blueboxarr.svg'); }
  .bbopen4 {  margin-bottom:0em; border-radius:1em 1em 0em 0em; background-repeat:no-repeat; background-position: right 1em center; background-image:url('im/blueboxarr-up.svg');}

  

  .blueboxh1 { color: #E3E829;font-size:1.3em; font-weight:500; width:90%; margin-left:5%; z-index:1; line-height: 100%; }

  .blueboxarr { width:1em; margin:0.5em auto; }

  .grbox { background-color:#E3E829; border-radius:1em; width:100%; padding:1em 2em 0.5em 2em; text-align:center;}
  .grbox2 { background-color:#E3E829; border-radius:1em; padding:1em 1em 0.5em 1em; text-align:center;}

  .taleft { text-align:left; }

  

  .stretch {  align-items: stretch;  display: flex; flex-flow: row wrap; justify-content:space-between; }

  .br1em { border-radius:1em; }

  @media(max-width:1000px)
  {  
    .blueboxh1 { font-size:1.1em;}
    .stretchM {  align-items: stretch;  display: flex; flex-flow: row wrap; justify-content:space-between; }
    .slides01 {  min-height:500px;}
    .slidesblue { min-height:450px; }
  }

  .w100mob { width:100%; }
    @media(min-width:1000px)
  {  
    .w100mob { width:fit-content; }
  }


  .stretchD { margin-bottom:0em; margin-top:0em; }
  
  @media(min-width:1100px){
    .stretchD {  display: flex; flex-flow: row wrap; margin-bottom:1em; justify-content: center;}
  }


  .graybox { background-color:#F2F2F2; border-radius:0em 0em 1em 1em; width:100%; padding:1em 1em 0.5em 1em; text-align:center; margin-bottom:1em; 
    filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.2));
    display:none;
  }
  .graybox2 { background-color:#F2F2F2; border-radius:0em 0em 1em 1em; width:100%; padding:1em 1em 0.5em 1em; text-align:left; margin-bottom:1em; 
    filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.2));
  }
  .whbox { background-color:#FFF; border-radius:0em 0em 1em 1em; width:96%; margin-left:2%; padding:1em 1em 0.5em 1em; text-align:left; margin-bottom:1em; 
    filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.1));
    display:none; color:#0033A0; font-weight:300;
  }

  .whbox3 { background-color:#FFF; border-radius:1em; width:31%;  padding:1em ; text-align:left; margin-bottom:1em; 
    filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.1));
    font-weight:300; margin-left:2%;
  }
  .whbox3m { background-color:#FFF; border-radius:1em; width:100%;  padding:1em ; text-align:left; margin-bottom:1em; 
    filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.1));
    font-weight:300; margin-left:2%;
  }

  .rotate-180 {transform: rotate(180deg);}

  .w25med { width:37%; }
  .w60med { width:60%; font-size:0.9em}
  .w25med .ill { width:100%; height:auto;}
  @media(max-width:395px){
    .w25med { width:60%; margin:1em auto; min-height:3.5em}    
    .w60med { width:100%; }
  }


  .mm { width:248px; }
  .menu1 .Desk .mm img {width:18%;}

  .mm:hover {opacity: 0.8;}
  

  .homeIcon { width:1.2em; margin-right:0.4em }

  .dnone { display:none; }
  .twrap-w { text-wrap:wrap !important; }
  .titulo { width:90%;margin-left:5%; border:1px solid purple; }
  .ictop { width:50%; margin:0em auto; position:relative; }
  .ictopsm { width:40%; margin:0em auto; position:relative; }
  @media(max-width:800px){
    .ictop { width:90%;}
    .ictopsm { width:75%;}
  }
  @media(max-width:800px){
    .ictop { width:40%; margin:0em  auto 1em auto;}
    .ictopsm { width:40%; margin:0em  auto 1em auto;}
  }

  .sec, .sea { cursor:pointer; }

  .svideo, .svideo100 { border:2px solid #0033A0; aspect-ratio:640 / 360;  }
  .vervideo { display:none;position:relative; top:-70%; left:1em; width:10em;text-align:center; z-index:4; font-size:1em; height:2em; padding-top:0.47em;  border-radius:2em; color:#0033A0; background-color: #E3E829;  filter: drop-shadow(0 0.4rem  0.5rem rgba(0,0,0,0.3)); transform: translateZ(0);  }
  @media(max-width:1100px){
    .svideo { border:6px solid silver; margin:1px 5%; width:90% }
    .svideo100 { border:6px solid silver; margin:1px 0%; width:100% }
    .vervideo { position:relative; top:-70%; left:3em; width:10em;text-align:center; z-index:4; font-size:1em; height:2em; padding-top:0.47em;  border-radius:2em; color:#0033A0; background-color: #E3E829;  filter: drop-shadow(0 0.4rem  0.5rem rgba(0,0,0,0.3)); transform: translateZ(0);  }
  }
  .vervideo:hover{  background-color: #e9e9e9;  cursor:pointer; }
  .videoModal0 { position:fixed; z-index:5; width:100vw; height:100vh; top:0vh; left:0vw; background-color:rgba(0,0,0,0.5);}
  .videoModal { position:relative; width:90vw; height:90vh; top:1vh; left:5vw;  filter: drop-shadow(0 0.2rem 0.4rem rgba(0,0,0,0.5)); transform: translateZ(0);  }

  #expediente { display:none; }
  .vertbars { width:14em; max-width:100%; }
  .iphoneDesk { position:absolute; bottom:15%;left:-10%;width:120%;text-align:center; 
    font-size:1.4em; height:2em; padding-top:0.47em; 
    border-radius:2em; color:#0033A0; background-color: #E3E829;  filter: drop-shadow(0 0.4rem  0.5rem rgba(0,0,0,0.3)); transform: translateZ(0);  }
  .iphoneDesk:hover { cursor:pointer; color:#0033A0; background-color: #e9e9e9;  }

  .tras_ic { width:6em; margin:0em auto 1em auto;  }
        .tras_tit { font-size:1.07em; font-weight:600; color:#0033A0; text-align:center; width:80%; margin:0em auto 0.5em auto; }
        .tras_txt { font-size:1em; font-weight:300; color:#53565A; text-align:center; width:80%; margin:0em auto; min-height:7em;}
        

.container_ap {position:relative; width:30px;}
  .container_ap input {
    position:relative;
    opacity: 0;
    height: 0;
    width: 0;
  }
  .checkmark_ap {
    position: absolute;
    top: 0; 
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #eee;
    border: 2px solid #ccc;
    border-radius: 4px; /* Optional: for rounded corners */
  }
  .container_ap input:checked ~ .checkmark_ap {
    background-color: #2196F3; /* Blue background when checked */
  }
  .checkmark_ap:after {
    content: "";
    position: absolute;
    display: none; /* Hide by default */
    /* Add styles to create the checkmark shape (e.g., using borders and transform: rotate) */
    left: 9px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    transform: rotate(45deg);
  }

  .container_ap input:checked ~ .checkmark_ap:after {
      display: block; /* Show when checked */
  }

  .star { font-size:1.4em; margin-left:0.3em; color:silver; font-family: "Yomogi"; font-weight: 400; font-style: normal; cursor:pointer;}

  .megaMenu {position:fixed; z-index:10; width:100vw; background:#007B5A; top:0;left:0; display:none}
  .MenuTxts { line-height:90%; color:white;}
  .menuTxt { display:inline-block; width:100%;padding:0em 0em 0.6em 0em; border-bottom:1px solid rgba(250,250,250,0.4); font-family:'Dingos'; font-weight:600; 
    color: #fff; font-size:0.9em; text-decoration: none}
  .menuTxt:hover {  color: #fff; cursor: pointer; opacity:0.4}
  .x { width:1.1em; }
  .x:hover { cursor:pointer; opacity:0.5; }
  .mmlogo { height:2.5em; }
  .mmlogo:hover { cursor:pointer; opacity:0.5; }
  .flexEnd {  display: flex; justify-content: flex-end; }

  .mmItem { aspect-ratio:25/15; border-radius:1em; background-size:cover; position:relative; overflow: hidden; cursor:pointer;}
  .mmItem2 { position:absolute; top:0; left:0; width:100%; height:100%; }
  .mmphoto1 { background-image:url('im/megamenu-1.jpg'); }
  .mmphoto2 { background-image:url('im/megamenu-2.jpg'); }
  .mmphoto3 { background-image:url('im/megamenu-3.jpg'); }
  .grad1 { background: #EB6427; background: linear-gradient(180deg, rgba(235, 100, 39, 0) 0%, rgba(241, 100, 39, 1) 100%); }
  .grad2 { background: #EB6427; background: linear-gradient(180deg, rgba(235, 100, 39, 0) 0%, rgba(7, 119, 85, 1) 100%); }
  .grad3 { background: #EB6427; background: linear-gradient(180deg, rgba(235, 100, 39, 0) 0%, rgba(4, 150, 77, 1) 100%); }
  .grad1:hover { background: #EB6427; background: linear-gradient(180deg, rgba(235, 100, 39, 0) 0%, rgba(241, 100, 39, 0) 100%); }
  .grad2:hover { background: #EB6427; background: linear-gradient(180deg, rgba(235, 100, 39, 0) 0%, rgba(7, 119, 85, 0) 100%); }
  .grad3:hover { background: #EB6427; background: linear-gradient(180deg, rgba(235, 100, 39, 0) 0%, rgba(4, 150, 77, 0) 100%); }
  .mmTxt { font-family:'Dingos'; font-weight:600; color: #fff; font-size:0.8em; 
    text-decoration: none; text-align:center; }
    
    .mmItem2 .mmTxt {  margin-bottom: -30%; transition: margin-bottom 0.8s cubic-bezier(.25,1.4,.5,1);}
    .mmItem2:hover  .mmTxt {  margin-bottom: 0;  }


  .extraItem { aspect-ratio:15/25; height:auto; border-radius:15vw; background-size:cover; position:relative; overflow: hidden; cursor:pointer;}
  .extraItem2 { position:absolute; top:0; left:0; width:100%; height:100%; }
  .extraphoto1 { background-image:url('im/ir-foto-1.jpg'); }
  .extraphoto2 { background-image:url('im/ir-foto-2.jpg'); }
  .extraphoto3 { background-image:url('im/ir-foto-3.jpg'); }
  .grad01 { background: #EB6427; background: linear-gradient(180deg, rgba(235, 100, 39, 0) 0%, rgba(241, 100, 39, 1) 100%); }
  .grad02 { background: #EB6427; background: linear-gradient(180deg, rgba(235, 100, 39, 0) 0%, rgba(7, 119, 85, 1) 100%); }
  .grad03 { background: #EB6427; background: linear-gradient(180deg, rgba(235, 100, 39, 0) 0%, rgba(4, 150, 77, 1) 100%); }
  .extraTxt { font-family:'Dingos'; font-weight:600; color: #fff; font-size:1.3em; text-decoration: none; text-align:center; }
    
  .extraItem2 .extraTxt {  margin-bottom: -30%;transition: margin-bottom 0.8s cubic-bezier(.25,1.4,.5,1);}
  .extraItem2:hover  .extraTxt {  margin-bottom: 0; }
    
  .grad01:hover { background: linear-gradient(180deg, rgba(241, 100, 39, 0.6) 0%, rgba(241, 100, 39, 0.6) 100%); }
  .grad02:hover { background: linear-gradient(180deg, rgba(7, 119, 85, 0.6) 0%, rgba(7, 119, 85, 0.6) 100%); }
  .grad03:hover { background: linear-gradient(180deg, rgba(4, 150, 77, 0.6) 0%, rgba(4, 150, 77, 0.6) 100%); }

  .Descargas { width:100%; max-width:1400px; }

  .descargas1 { width:90%; border-radius: 0.8em; }

  .menuBox { width:100%; }

  @media(max-width:800px){
    .extraItem { aspect-ratio:30/11.5; height:auto; border-radius:30vw; background-size:cover; position:relative; overflow: hidden; cursor:pointer; margin-bottom:2.3em}
    .extraItem2 { position:absolute; top:0; left:0; width:100%; height:100%; }
    .extraphoto1 { background-image:url('im/ir-foto-1-m.jpg'); }
    .extraphoto2 { background-image:url('im/ir-foto-2-m.jpg'); }
    .extraphoto3 { background-image:url('im/ir-foto-3-m.jpg'); }

    .extraphoto4 { background-image:url('im/acerca-ph-horiz.jpg'); }
    .extraphoto5 { background-image:url('im/director-ph-horiz.jpg'); }

    .grad01 { background: #EB6427; background: linear-gradient(90deg, rgba(235, 100, 39, 0) 0%, rgba(241, 100, 39, 0.6) 60%, rgba(241, 100, 39, 1) 75%); }
    .grad02 { background: #EB6427; background: linear-gradient(90deg, rgba(235, 100, 39, 0) 0%, rgba(7, 119, 85, 0.6) 60%, rgba(7, 119, 85, 1) 75%); }
    .grad03 { background: #EB6427; background: linear-gradient(90deg, rgba(235, 100, 39, 0) 0%, rgba(4, 150, 77, 0.6) 50%, rgba(4, 150, 77, 1) 65%); }
    .grad04 { background: linear-gradient(90deg, rgba(235, 100, 39, 0) 0%, rgba(7, 119, 85, 0.6) 70%, rgba(7, 119, 85, 1) 85%); }
    .extraItem2 .extraTxt {  position:relative; width:57%; left:40%; 
      font-size: clamp(0.9rem, -1.4rem + 7vw, 1.7rem); text-align:left}
       /* display:flex;justify-content: flex-end; 
    .extraItem2 .extraTxt img { width:55%; } */
      
    /* .extraItem2 .extraTxt { margin-left:17%; margin-bottom:0; margin-right: 0%; transition: margin-right 0.8s cubic-bezier(.25,1.4,.5,1); position:relative;} */
    .extraItem2 .extraTxt { margin-top:0%; margin-left:0; margin-bottom:0; margin-right: 0%; transition: padding-left 0.8s cubic-bezier(.25,1.4,.5,1); position:relative;}
    .extraItem2:hover  .extraTxt {  margin-top:0%; padding-left: 0%; }
      
    .grad01:hover { background: #EB6427; background: linear-gradient(90deg, rgba(235, 100, 39, 0) 0%, rgba(241, 100, 39, 1) 50%); }
    .grad02:hover { background: #EB6427; background: linear-gradient(90deg, rgba(235, 100, 39, 0) 0%, rgba(7, 119, 85, 1) 50%); }
    .grad03:hover { background: #EB6427; background: linear-gradient(90deg, rgba(235, 100, 39, 0) 0%, rgba(4, 150, 77, 1) 50%); }

    .Descargas {  text-align:center; }
    .descargas1 { width:80% }

    .menuBox { width:90%; margin-left:5%; text-align:center; max-height:88vh; overflow-y:scroll; }
    .MenuTxts { line-height:90%; }
    .menuTxt { font-family:'Dingos'; font-weight:600; font-size:1.1em; text-decoration: none}
    .mmItem { margin-bottom:1em;  aspect-ratio:25/10; }

  }

    .eng { color:white; border:1px solid white; width:fit-content; padding:0.2em 1em;  border-radius:0.3em;  font-weight:300; left:3em; top:0.4em; font-size:0.8em; position:absolute; }
    .enggr { border:1px solid #007B5A; color:#007B5A; width:fit-content; padding:0.2em 1em; border-radius:0.3em; font-weight:300; left:3em; top:0.4em; font-size:0.8em; position:absolute; }

    .rel { position:relative }

    
	.feather-circle {
		position:absolute; top:0;left:0;
	    width:100%;
	    height:100%;
	    scale:1;
	    background-image: url('im/gradient.jpg');
	    background-size: cover;
	    border-radius: 50%;
	    overflow: hidden;
	    filter: blur(6px);
	    opacity:1;
	}

	.masked-image {
		position:absolute; top:-10%;left:-10%;
		width:120%;
		height:120%;
	  /* Specify the PNG mask image */
	  mask-image: url("im/swirl-mask.png");
	  /* For older browser compatibility */
	  -webkit-mask-image: url("im/swirl-mask.png");

	  /* Prevent the mask from repeating */
	  mask-repeat: no-repeat;
	  -webkit-mask-repeat: no-repeat;

	  /* Position the mask (e.g., center, top left, etc.) */
	  mask-position: center;
	  -webkit-mask-position: center;

	  /* Size the mask (e.g., cover the entire image) */
	  mask-size: cover;
	  -webkit-mask-size: 87%;
	}	
	.wh100 {
		position:relative;
		scale:1; 
		height:80vh;		
		width:80vh;
		margin:0px;
		border:0px solid red;		
	}
	.grow-fade {
		opacity:0;
	    animation: growFade 1s ease-out 0.5s forwards;
	    transform-origin: center center;
	}
	.grow-fade-rotate {
		opacity:0;
	    animation: growFadeRotate 1.5s ease-out 0.3s forwards;
	    transform-origin: center center;
	}
	.despachador-anim {
  		animation: slideAndFade 1s ease-out 1.5s both;
	}
	.hombre-anim {
  		animation: slideAndFadeH 1.3s ease-out 1.5s both;
	}
	.mujer-anim {
		opacity:0;	animation: slideAndFadeM 2s ease-out 1.5s both;
	}

	@keyframes growFadeRotate {
	    0% {	transform: scale(0.3) rotate(-120deg); 	opacity: 0;	}
	    100% {	transform: scale(1) rotate(0deg);	opacity: 1;	}
	}
	@keyframes growFade {
	    0% {	transform: scale(0.3);	opacity: 0;	}
	    100% {	transform: scale(1);	opacity: 1;	}
	}
	@keyframes slideAndFade {
	  0% {	transform: translateX(-50%);	opacity: 0;	}
	  100% {	transform: translateX(0%);	opacity: 1;	}
	}	
	@keyframes slideAndFadeH {
	  0% {	transform: translateX(30%);	opacity: 0;	}
	  100% {	transform: translateX(0%);	opacity: 1;	}
	}

	@keyframes slideAndFadeM {
	  0% {	opacity: 0;	}
	  100% {	opacity: 1;	}
	}


	.cot-anim {
		opacity:0;	animation: slideAndFadeTxt 2s ease-out 2s both;
	}
	.extra-anim {
		opacity:0;	animation: slideAndFadeTxt 1.5s ease-out 2s both;
	}
	.informe-anim {	opacity:0;	animation: slideAndFadeM 2.7s ease-out 2.2s both;	} 
	@keyframes slideAndFadeTxt {
	  0% {	transform: translateX(30%);	opacity: 0;	}
	  100% {	transform: translateX(0%);	opacity: 1;	}
	}

	.despachador { position:absolute; height:70%; bottom:11.3%; left:-6.5%; }
	.mujer { position:absolute; height:85%; bottom:-5%; left:44%; }
	.hombre { position:absolute; height:85%; bottom:0%; left:84%; }
	.cotidiano {position:absolute; width:30%; top:17%; left:-95%; z-index:2;}
	.extraordinario {position:absolute; width:177%; top:38.5%; left:-95%; z-index:2;}

	.cotidianoM {position:relative; width:30vw; margin-top:1vh; margin-left:5vw;}
	.extraordinarioM {position:relative; width:90vw; margin-top:1vh; margin-left:5vw;}
	.informe {position:relative; width:28vw; margin-top:1vh; margin-left:5vw; } 


	.ir {		

	  mask-image: url("im/ir-mask.png");
	  -webkit-mask-image: url("im/ir-mask.png");
	  mask-repeat: no-repeat;
	  -webkit-mask-repeat: no-repeat;
	  mask-position: center;
	  -webkit-mask-position: center;
	  mask-size: cover;
	  -webkit-mask-size: 98%;
	  transition: transform 0.5s ease;
	  transform-origin: 50% 50%; 
	}	
	.ir:hover { 
		opacity:0.85; cursor:pointer; 
		transform: scale(1.1);
	}

	.gotas1 { position:absolute; width:34vw; left:0; top:2vw; z-index:2;}
	.gotas1m { position:relative; width:80vw; left:5vw; top:5vw; z-index:2;}
	
  	.photoCircle { width:100%; height:auto;aspect-ratio:1; border-radius:100%; background-color:#222; background-size: cover;}
	.circleText { font-family:'Dingos'; font-size:1.2em; font-weight:600; color:#003D2E; margin-top:0.5em }

.vermas {
    position: relative;
    width: 10em;
    background-color: #A3D7C5;
    color: #003D2E;
    border-radius: 0.5em;
    padding: 0.6em 1.4em 0.5em 1.4em;
    font-size: 0.6em;
    font-weight: 500;
    margin-top: -1.3em;
}
.vermas:hover, .vermas2:hover {
    background-color: #067755;
    color: #fff;
    cursor: pointer;
}

.vermas2 {
  position: relative;
    width: 18em;
    background-color: #EB6427;
    color: #fff;
    border-radius: 0.5em;
    padding: 0.6em 1.4em 0.5em 1.4em;
    font-size: 0.6em;
    font-weight: 500;
    margin-top: -1.3em;
}

.vermas5a {
  position: relative; width: 16em;  background-color: #fff;  color: #000; text-align:right;
  border-radius: 0.5em; padding: 0.6em 1.2em 0.5em 1.2em; font-size: 0.6em; font-weight: 500; 
}
.vermas5b {
  position: relative; width: 16em;  background-color: #fff;  color: #000; text-align:left;
  border-radius: 0.5em; padding: 0.6em 1.2em 0.5em 1.2em; font-size: 0.6em; font-weight: 500; 
  float:right;
}

@media(max-width:700px){
  .vermas5a, .vermas5b { width: 100%; } 
}

.vermas4a {
  position: relative; width: 16em;  background-color: #fff;  color: #000; text-align:right;
  border-radius: 0.5em; padding: 0.6em 1.2em 0.5em 1.2em; font-size: 0.6em; font-weight: 500; 
}
.vermas4b {
  position: relative; width: 16em;  background-color: #fff;  color: #000; 
  border-radius: 0.5em; padding: 0.6em 1.2em 0.5em 1.2em; font-size: 0.6em; font-weight: 500; 
}

.vermas3a {
  position: relative; width: 16em;  background-color: #DDF0F4;  color: #003D2E; text-align:right;
  border-radius: 0.5em; padding: 0.6em 1.2em 0.5em 1.2em; font-size: 0.6em; font-weight: 500; 
}
.vermas3b {
  position: relative; width: 16em;  background-color: #DDF0F4;  color: #003D2E; 
  border-radius: 0.5em; padding: 0.6em 1.2em 0.5em 1.2em; font-size: 0.6em; font-weight: 500; 
}

.arrmas {
    position: absolute;	top: 0.7em;	right: 1.4em;	width: 0.9em;	height: 0.9em;
    mask-image: url('im/mini-arr.svg');	-webkit-mask-image: url('im/mini-arr.svg');
    mask-size: contain;	-webkit-mask-size: contain;	mask-repeat: no-repeat;	-webkit-mask-repeat: no-repeat;
    background-color: #003D2E; 
}
.arrmas2 {
    position: absolute;	top: 0.7em;	right: 1.4em;	width: 0.9em;	height: 0.9em;
    mask-image: url('im/mini-arr.svg');	-webkit-mask-image: url('im/mini-arr.svg');
    mask-size: contain;	-webkit-mask-size: contain;	mask-repeat: no-repeat;	-webkit-mask-repeat: no-repeat;
    background-color: #fff; 
}
.arrmas3a {
    position: absolute;	top: 0.7em;	left: 1.4em;	width: 0.9em;	height: 0.9em;
    mask-image: url('im/mini-arr.svg');	-webkit-mask-image: url('im/mini-arr.svg');
    mask-size: contain;	-webkit-mask-size: contain;	mask-repeat: no-repeat;	-webkit-mask-repeat: no-repeat;
    background-color: #003D2E;  transform: rotate(180deg);
}
.arrmas3b {
    position: absolute;	top: 0.7em;	right: 1.4em;	width: 0.9em;	height: 0.9em;
    mask-image: url('im/mini-arr.svg');	-webkit-mask-image: url('im/mini-arr.svg');
    mask-size: contain;	-webkit-mask-size: contain;	mask-repeat: no-repeat;	-webkit-mask-repeat: no-repeat;
    background-color: #003D2E; 
}

.vermas:hover .arrmas, .vermas2:hover .arrmas2, .vermas3a:hover .arrmas3a, .vermas3b:hover .arrmas3b {
    background-color: white;
}
 .vermas3a:hover , .vermas3b:hover {
    background-color: #003D2E; cursor: pointer; color:wheat
}


.downl {
    position: relative;	width: 90%;
    background-color: #A3D7C5;	color: #003D2E;	border-radius: 0.8em;
    padding: 1em 1.6em 0.9em 1.6em;
    font-size: 0.7em;	font-weight: 500;	margin-top: 1.3em; text-align:left
}
.downl:hover {
    background-color: #003D2E;	color: #fff;	cursor: pointer;
    opacity:0.85; margin-top:1em
}
.arrdw {
    position: absolute;	top: 0.7em;	right: 1em;	width: 2.1em;	height: 1.2em;
    mask-image: url('im/downl.svg?v=1');	-webkit-mask-image: url('im/downl.svg?v=1');
    mask-size: contain;	-webkit-mask-size: contain;	mask-repeat: no-repeat;	-webkit-mask-repeat: no-repeat;
    background-color: #003D2E; 
}
.downl:hover .arrdw {	background-color: white;	}



@media(max-width:700px){
	.circleText{ font-size:0.9em }
	.downl { margin-left:5%; margin-top: 2em; font-size:0.8em;  }
}


@media(max-width:500px){
  .slider .Mobile { display:none; }   
  .slider .MobileF { display:none; }  
  .slider .Mobile7 { display:none; } 
  .slider .Mobile7F { display:none; } 
  .Mobile5 {    display:block; }
}

/*  --------------- slider:       */

	.slider-wrapper {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.slider {
    display: flex;
    scroll-snap-type: x mandatory;
    overflow-x: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
}

.slide {
    flex: 0 0 100%;
    /* height: 250px; 
    font-size: 2rem;
    background: #ddd;*/
    scroll-snap-align: start;
    display: flex;
    justify-content: center;
    align-items: center;
    
    border-right: 2px solid #fff;
}

.arrow {	
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    background: rgba(7, 119, 85, 0.4);
    border-radius:4em;
    color: white;
    border: none;
    padding: 6px 15px 10px 15px;
    font-size: 2rem;
    cursor: pointer;
}
.arrow:hover {
	background: rgba(7, 119, 85, 0.7);
}

.arrow.left { left: 10px; }
.arrow.right { right: 10px; }

@media(min-width:1500px){
 .arrow.left { left: calc(47vw - 700px); } 
 .arrow.right { right: calc(47vw - 700px); } 
}

.pagination {
     /* display: flex; */
    display: none;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: 15px;
    width: 100%; /* NEW: ensures it spans full width */
}


.dot {
    display: block; /* NEW */
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(7, 119, 85, 0.2);
    cursor: pointer;
    transition: background 0.3s ease;
}


.dot.active {
    background: rgba(7, 119, 85, 0.7);
}

.slideBox { position:relative; width:90%; margin:0px auto 50px auto; max-width:1400px; background-color:white; border-radius:1em; padding:4vh 5vh }

	.pill { color: #003D2E; border:1px solid #003D2E; width:fit-content; padding:0.5em 1em; border-radius:2em; font-size:0.6em; }
	.bigN { font-size:1.8em; font-weight:600; font-family: 'Dingos'; }

	.ic { height:4.5em; vertical-align: middle; margin-right:0.5em; }
	.ic-text { font-size:1.4em; letter-spacing:0.15em}
	@media(max-width:700px){
		.ic { height:5em; vertical-align: middle; margin:0em auto 1em auto}
		.ic-text { font-size:1.4em;}
		.pill, .bigN{ margin:0em auto; text-align:center; display:block;  }
		.bigN { font-size:1.7em;}
		.slideBox .em09  { margin:-1.4em auto 1em auto; text-align:center; display:block; font-size:0.8em;}
	}


  .w1em { width:1em; }
  .w2em { width:2em; }
  .w3em { width:3em; }
  .w4em { width:4em; }
  .w5em { width:5em; }
  .w6em { width:6em; }
  .w7em { width:7em; }
  .w8em { width:8em; }
  .w9em { width:9em; }
  .w10em { width:10em; }
  .w11em { width:11em; }
  .w12em { width:12em; }
  .w13em { width:13em; }
  .w14em { width:14em; }
  .w15em { width:15em; }
  .w16em { width:16em; }
  .w17em { width:17em; }
  .w18em { width:18em; }
  .w19em { width:19em; }
  .w20em { width:20em; }

  /* 

  <div class="mmItem w23 mmphoto3"> 
      <div class="mmItem2 flex5 grad1">
        <div class="mmTxt">PRODUCTO</div>
      </div>
    </div>


  .blueul { bluellet.png } */

 

/*

 .blueul {
    list-style: none;
    padding-left: 0; 
  }

.blueul li {
  padding-left: 25px;
  position: relative;
}
.blueul li::before {
  content: "★"; 
  color: #ff0000;
  font-size: 1em; 
  position: absolute;
  left: 0; 
  top: 50%; 
  transform: translateY(-50%); 
}
*/


.people {
	  mask-image: url("im/people.png");
	  -webkit-mask-image: url("im/people.png");
	  mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat; 
    mask-position: center;  -webkit-mask-position: center;
    mask-size: cover; -webkit-mask-size: 100%;	
}
.personas-ph-1 {
		margin-top:-12em; 
		width:100%; 
	  mask-image: url("im/personas-ph-1.png");
	  -webkit-mask-image: url("im/personas-ph-1.png");

	  mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat;
	  mask-position: center;  -webkit-mask-position: center;
	  mask-size: cover; -webkit-mask-size: 100%;
}	

.groceries {		
		width:100%; 
	  mask-image: url("im/groceries.png");
	  -webkit-mask-image: url("im/groceries.png");
	  mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat;
	  mask-position: center;  -webkit-mask-position: center;
	  mask-size: cover; -webkit-mask-size: 100%;
}	
.cafe {		
		width:100%; 
	  mask-image: url("im/cafe.png");
	  -webkit-mask-image: url("im/cafe.png");
	  mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat;
	  mask-position: center;  -webkit-mask-position: center;
	  mask-size: cover; -webkit-mask-size: 100%;
}	

.arrows { width:100%; color:white; background-color:#017B5A;background-image: url('im/leaves-03.svg'); background-size: cover;}
.arrows2 { width:100%; color:wblack; background-color:#F2F2F2;}
	.leftarr { width:0.8em; margin-right:0.4em; }
	.rightarr { width:0.8em; margin-left:0.4em; transform: rotate(180deg);}

  .bgPhoto {
    background-size:cover; background-position: center; background-repeat: no-repeat;
  }
  .brad1 { border-radius:1em; }
  .brad2 { border-radius:2em; }
  .brad3 { border-radius:3em; }

  .pad1 { padding:1em; }
  .pad2 { padding:2em; }
  .pad3 { padding:3em; }
  .pad4 { padding:4em; }


    .descargar-capitulo { height:1.4em; position:absolute; top:0.4em; right:6.2em; } 
    .esp-eng { height:1.4em; position:absolute; top:0.4em; right:1.8em; } 
    .descargar-capitulo:hover, .esp-eng:hover { opacity:0.8; cursor:pointer; }
  @media(max-width:700px){
    .descargar-capitulo { height:1em; position:absolute; top:0em; right:2em; } 
    .esp-eng { height:1em; position:absolute; top:1.2em; right:2em; } 
  }

  .hamb { width:1.2em; position:absolute;right:0; top:0.6em; cursor:pointer;}
  .pointer:hover { cursor: pointer; opacity:0.8}
  .aspect1 { aspect-ratio:1 !important; }

  .extraElement{ position: relative; width:100%; height:4em; border:0px solid pink}
		.extraElement{ display:none;}
		@media(max-width:1000px){	.extraElement{ display:block;}	}
		@media(max-width:800px){	.extraElement{ display:none;}	}