@import "main.css?v=1.1";

.titulo-banner {
    font-size: 2.4em;
    font-weight: 600;
    text-align: right;
    color: #ff6b00;
}

.cambio-color {
    color: #ff6b00;
}

/*Seccion 1 Banner */

.seccion-1-ayuda{
    padding: 0 60px;
    background-image: url(../img/cntro-ayuda.jpg);
    background-position-x: center;
    background-position-y: top;
    background-size: auto;
    background-repeat: no-repeat;
    background-attachment: fixed;
    height: 360px;
    width: 100%;
    display: flex; 
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
}

.contenido-secc-1-ayuda{
    padding-top: 9.3rem;
}

.titulo-ayuda{
    font-weight: 700;
    font-size: 48px;
    color: #002A6F;
}

.breadcrumb{
    justify-content: center;
}

.breadcrumb-item a{
    text-decoration: none;
    color: #002A6F;
    font-weight: 600;
}

.breadcrumb-item a:hover{
    text-decoration: none;
    color: #165fbe;
    font-weight: 600;
}


.breadcrumb-item .active{
    background-color: transparent;
}

@media (width > 1450px) {
    .seccion-1-ayuda{
        background-size: contain;
    }
 
}

@media (max-width: 768px){
    .titulo-ayuda{
        font-weight: 700;
        font-size: 18px;
        color: #002A6F;
        text-align: center;
    }

    .title{
        font-size: 24px !important;
        font-weight: 600 !important;
        color: #002A6F;
    }   
    
    .contenedor-principal{
        height: 700px !important;
    }

}

@media screen and (max-width: 1227px) {
    
    .contenido-secc-1-ayuda {
        margin-top: -2em;
        margin-right: 1em;
    }

    .grid-secc-1-ayuda {
        margin: 1em 0em 0 1em;
        text-align: center;
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
    }

    .grid-secc-1-ayuda img {
        margin-left: 0;
        text-align: center;
        max-width: 99%;
    }
}

/* Seccion 2 Temas */

.temas{
    padding-top: 100px;
    padding-bottom: 50px;
}

.justify-content-left{
    justify-content: center !important;
}

.temas .section-titulo-tema{
    margin-bottom: 60px;
}

.section-titulo-tema{
    gap: 10px ;
}

.title{
    font-size: 38px;
    font-weight: 600;
    color: #002A6F;
}

.divider-temas{
    width: 290px;
    height: 6px;
    background-color: #FF6900;
    margin-top: 16px;
    border-radius: 2px;
}

.row-general{
    display: flex;
    flex-wrap: wrap;
}

.info-card {
    background: #fff;
    padding: 36px 40px 36px 55px;
    border-radius: 10px;
    position: relative;
}

.info-card:hover .overlay {
    transition: all .5s ease-out;
    opacity: .72;
}


.info-card.style-two{
    padding: 46px;
    height: 473px;
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 12px;
    top: 0;
    z-index: 2;
    transition: all .5s ease-out;
    overflow: hidden;
    margin-bottom: 24px;
    border: 1px solid #dfe2e9;
}

.info-card.style-two:hover{
    transition: all .5s ease-out;
    top: -10px;
}

.info-card.style-two:before{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 50%;
    left: 50%;
    background-color: #fff;
    z-index: -1;
    content: "";
    transform: translate(-50%, -50%) rotate(0deg);
    transition: .8s;
}

.info-card.style-two:hover::before{
    visibility: hidden;
    opacity: 0;
    transition: .8s;
}

.info-card-inner{
    display: flex;
    flex-direction: column;
    gap: 30px;
    height: 100%;
}

.info-card .contenido-wrapper{
    position: relative;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
}

.info-card.style-two .title-wrapper{
    flex-direction: row;
    border-bottom: 3px solid #FF6900;
    align-items: center;
}

.info-card .title-wrapper{
    display: flex;
    gap: 35px;
    padding-bottom: 40px;
    transition: all .6s ease;
}

.info-card.style-two .title-wrapper .icon{
    width: 97px;
    height: 97px;
    background: linear-gradient(#EFEFEF, #BFCCE0);
}

.info-card .title-wrapper .icon{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 10px;
    transform-style: preserve-3d;
    transition: all 0.5s ease;
}



.info-card .icon img{
    transition: all .5s ease-out;
}

.info-card.style-two .title-wrapper .titulo-contenido{
    line-height: 36px;
}

.info-card .title-wrapper .titulo-contenido{
    font-size: 22px;
    font-weight: 700;
    margin: 0;
    color: #002A6F;
    transition: all .6s ease;
}

.info-card .contenido{
    display: flex;
    flex-direction: column;
}

.info-card.style-two .contenido .desc{
    line-height: 26px;
}

.info-card.style-two .contenido .desc{
    transition: all .6s ease;
    font-size: 16px;
    font-weight: 500;
    margin-top: 10px;
    color: #002A6F;
    text-align: justify;
}

.info-card .contenido .read-more{
    display: flex;
    justify-content: start;
    gap: 18px;
}

.info-card .contenido .read-more a{
    display: flex;
    align-items: center;
    font-size: 16px;
    line-height: 36px;
    font-weight: 700;
    text-transform: capitalize;
    margin-bottom: 0;
    color: #002A6F;
    text-decoration: none;
    gap: 10px;
}

.info-card .contenido .read-more a .icon{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ff6731;
    gap: 18px;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50px;
    z-index: 2;
}

.info-card.style-two:after{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #fff;
    z-index: -2;
    content: "";
    transition: all .5s ease-out;
    border: 0;
}

.info-card.style-two:hover:after{
    background: #002b6fb4;
    background: linear-gradient(135deg rgba(1, 83, 159, 0.397) 0%, #002A6F 100%);
    transition: all .5s ease-out;
}

.info-card.style-two:hover .title-wrapper {
    border-bottom: 3px solid #fff;
}

.info-card.style-two:hover .title-wrapper .titulo-contenido {
    color: #fff;
}

.info-card.style-two:hover .title-wrapper .icon {
    background: linear-gradient(65deg,#e30008 0%,#faae00 100%);
    transform: rotateY(180deg);
}

.info-card.style-two:hover .contenido .desc {
    color: #fff;
}

.info-card.style-two:hover .read-more p {
    color: #fff;
}

.info-card.style-two:hover .contenido-wrapper .content-area {
    visibility: visible;
    opacity: 1;
    transition: .6s;
}

.info-card.style-two:hover .contenido-wrapper .content-area .contenido {
    margin-top: 20px;
}


.info-card .contenido .read-more p{
    margin-top: 5px;
    padding-top: 10px;
    font-weight: 500;
    font-size: 18px;
    color: #002A6F;
}

@-webkit-keyframes arrow-an {

    0%,
    100% {
        transform: translateX(65px);
    }

    50% {
        transform: translateX(80px);
    }
}

@keyframes arrow-an {

    0%,
    100% {
        transform: translateX(65px);
    }

    50% {
        transform: translateX(80px);
    }
}

#arrow img {
    max-width: 1.1em;
}

.info-tema:hover {
    transition: .3s;
    border-radius: 1.5rem;
    box-shadow: 6px 6px 20px rgba(0, 0, 0, 0.1),
        -6px -6px 20px rgba(0, 0, 0, 0.1);
}

.info-tema:hover #h41 {
    transition: .3s;
    color: #ff6b00;
}

.info-tema:hover #arrow {
    transition: .3s;
    visibility: visible;
}

@media screen and (max-width: 1227px) {
    .temas-relevantes {
        display: flex;
        flex-direction: column;
        margin-left: .6em;
        justify-content: center;
        width: 90%;
    }

    .info-tema {
        margin-bottom: 1em;
        width: 70%;
        margin-left: 18%;
    }

    .titulo-secc {
        text-align: center;
    }

    #arrow {
        visibility: visible;
    }

    .animated-arrow {
        animation: 2s arrow-an infinite ease;
        -webkit-animation: 2s arrow-an infinite ease;
    }
    
    @-webkit-keyframes arrow-an {
    
        0%,
        100% {
            transform: translateX(60px);
        }
    
        50% {
            transform: translateX(70px);
        }
    }
    
    @keyframes arrow-an {
    
        0%,
        100% {
            transform: translateX(60px);
        }
    
        50% {
            transform: translateX(70px);
        }
    }
    
    #arrow img {
        max-width: 1.1em;
    }
}

/* Seccion 3 Paqueterias */

.secc-paqueterias {
    width: 100%;
    background-color: #004788;
}

.contenedor-principal{
    padding: 10px;
    height: 400px;
}

.titulo-secc{
    padding: 60px 65px;
    font-size: 36px;
    font-weight: 600;
    text-transform: uppercase;
    color: white;
}

.divider-paqueterias{
    width: 280px;
    height: 6px;
    background-color: #FF6900;
    margin-top: 16px;
    border-radius: 2px;
}

.contenedor-paqueterias {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    margin-top: 20px;
    margin-bottom: 30px;
}

.contenedor-paqueterias img {
    max-width: 11em;
}

.box-img {
    filter: brightness(0) invert(1);
}

.box-paqueteria-paquetexpress {
    padding: 20px 20px;
    border-radius: 1rem;
    transition: ease-out;
}

.box-paqueteria-paquetexpress:hover {
    transition: .3s;
    border-radius: 1rem;
    padding: 20px 20px;
    background-color: white;
    filter: none !important;
    box-shadow: 6px 6px 20px rgba(0, 0, 0, 0.1),
        -6px -6px 20px rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

.box-paqueteria-paquetexpress:hover .box-img {
    filter: none !important;
}

.box-paqueteria-fedex{
    padding: 20px 20px;
    border-radius: 1rem;
    transition: ease-out;
}

.box-paqueteria-fedex:hover {
    transition: .3s;
    border-radius: 1rem;
    padding: 20px 20px;
    background-color: white;
    filter: none;
    box-shadow: 6px 6px 20px rgba(0, 0, 0, 0.1),
        -6px -6px 20px rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

.box-paqueteria-fedex:hover .box-img {
    filter: none !important;
}

.box-paqueteria-estafeta{
    padding: 20px 20px;
    border-radius: 1rem;
    transition: ease-out;
}

.box-paqueteria-estafeta:hover {
    transition: .3s;
    border-radius: 1rem;
    padding: 20px 20px;
    background-color: white;
    filter: none;
    box-shadow: 6px 6px 20px rgba(0, 0, 0, 0.1),
        -6px -6px 20px rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

.box-paqueteria-estafeta:hover .box-img {
    filter: none !important;
}

.box-paqueteria-redpack{
    padding: 20px 20px;
    border-radius: 1rem;
    transition: ease-out;
}

.box-paqueteria-redpack:hover {
    transition: .3s;
    border-radius: 1rem;
    padding: 20px 20px;
    background-color: white;
    filter: none;
    box-shadow: 6px 6px 20px rgba(0, 0, 0, 0.1),
        -6px -6px 20px rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

.box-paqueteria-redpack:hover .box-img {
    filter: none !important;
}

.box-paqueteria-dhl{
    padding: 20px 20px;
    border-radius: 1rem;
    transition: ease-out;
}

.box-paqueteria-dhl:hover {
    transition: .3s;
    border-radius: 1rem;
    padding: 20px 20px;
    background-color: #ffffff;
    filter: none;
    box-shadow: 6px 6px 20px rgba(0, 0, 0, 0.1),
        -6px -6px 20px rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

.box-paqueteria-dhl:hover .box-img {
    filter: none !important;
}

@media screen and (max-width:1227px) {
    .contenedor-paqueterias {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .box-paqueteria {
        text-align: center;
        margin-bottom: .8em;
    }
}

/* Seccion 4 Enlaces Rápidos */

.secc-enlaces {
    width: 100%;
}

.titulo-enlaces{
    font-size: 2em;
    font-weight: 600;
    color: #ff6b00;
    padding: 50px 40px;
}

.cont-enlaces {
    display: flex;
    justify-content: space-evenly;
    margin: -1em 0 0 4em;
}

.cont-enlaces h3{
    color: #002A6F;
}

.columna-enlaces {
    width: 50%;
}

.columna-enlaces a {
    text-decoration: none;
    color: #07326b;
    font-size: 16px;
    font-weight: 500;
}

.columna-enlaces a:hover {
    text-decoration: underline;
    color: #1c72e2;
}

@media screen and (max-width: 1227px) {
    .secc-enlaces {
        width: 100%;
    }
    .cont-enlaces {
        display: flex;
        flex-direction: column;
        padding-right: 3em;
    }
    .columna-enlaces {
        width: 100%;
    }
}

.main-table {
    align-items: center;
    justify-content: space-between;
    display: flex;
    margin-top: 130px;
    padding: 120px;
    width: 100%;
    height: 90px;
    font-weight: 900;
    line-height: normal;
    letter-spacing: normal;
    color: #ff6b00;
  }

.horarios {
    width: 100%;
    height: 30px;
    font-size: 20px;
    font-weight: 900;
    line-height: normal;
    letter-spacing: normal;
    color: #ff6b00;
  }

  .horarios:hover {
      color: #07326b;
  }

  .izquierdo {
    display: flex;
    width: 2px;
    height: 62px;
    background-color: #ff6b00;
  }

  .cargos {
    width: 100%;
    height: 30px;
    font-size: 20px;
    font-weight: 900;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ff6b00;
  }

  .cargos:hover {
      color: #07326b;
  }

  .enmedio {
    display: flex;
    width: 2px;
    height: 62px;
    background-color: #ff6b00;
  }

  .articulos {
    display: flex;
    width: 100%;
    height: 30px;
    font-size: 20px;
    font-weight: 900;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ff6b00;
    line-break: normal;
  }

  .articulos:hover {
    color: #07326b;
}

  .preguntas {
    justify-content: space-between;
    width: 100%;
    height: 30px;
    font-size: 20px;
    font-weight: 900;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ff6b00;
  }

  .preguntas:hover {
      color: #07326b;
  }

  .columna-txt {
    width: auto;
    text-align: left;
    margin-left: 2%;
}

.columna-txt li {
    font-size: 1.3em;
}

.columna-txt a {
    text-decoration: none;
    color: #07326b;
    font-size: 1.2em;
}

.columna-txt a:hover {
    text-decoration: underline;
    color: #165fbe;
}

.enlaces-titu2 {
    color: #ff6b00;
    font-size: 1.1em;
    font-weight: 600;
}
.enlaces-titu2:active {
    color: #07326b;
    text-decoration: none;
    font-size: 1.1em;
    font-weight: 600;
    margin: 10px;
}

.enlaces-activos {
    color: #07326b;
    text-decoration: none;
    font-size: 1.1em;
    font-weight: 600;
    margin: 10px;

}

.enlaces-titulos {
    color: #ff6b00;
    text-decoration: none;
    font-size: 1.1em;
    font-weight: 600;
    margin: 10px;
    

}

@media screen and (max-width: 1227px) {
    .enlaces-titulos {
        color: #ff6b00;
        text-decoration: none;
        font-size: 1.1em;
        font-weight: 600;
        margin: 10px;
        margin-left: 20px;
        text-align: center;
    }

    .enlaces-titulos:hover {
        color: #165fbe;
        text-align: center;
    }
    
}

.enlaces-titulos:hover {
    color: #165fbe;
}

.tabla-contorno {
    border-collapse: collapse;
    width: 100%;
}

td, th, tr {
    border: 2px solid #ff6b00;
    text-align: center;
    padding: 8px;
}

/* COLAPSABLES */

.collapsible {
    background-color: #fff;
    color: #666;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
  }
  
  .collapsible:after {
    content: '\002B';
    color: #666;
    font-weight: bold;
    float: right;
    margin-left: 5px;
  
  }
  
  .content {
    padding: 0 18px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
  }

  .secc-mapa1 {
    position: relative;
    display: flex;
    align-items: center;
}


.titulo-mapa1 {
    display: flex;
    margin: 5px;
    padding: 5px;
    text-align: left;
    font-weight: 600;
    color: #ff6b00;
}

.ul-opciones {
    /* left: 0; */
    opacity: 0;
    visibility: hidden;
    position: absolute;
    z-index: 10000;
    border: 1px solid rgb(208, 208, 208);
    border-radius: 5px;
    padding: 0px !important;
    margin-top: 20px;
    transition: all 0.2s ease;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    box-shadow: 5px 5px 20px rgb(0 0 0 / 36%) !important;
    
}

.ul-opciones li {
    list-style: none;
    width: 100%;
    height: 6vh;
    display: flex;
    align-items: center;
    justify-content: center;
    /* padding: 0px; */
    /* margin: 1vh 0px; */
}

.ul-opciones li a:hover {
    background-color: #DAE2EE;
}

.ul-opciones li a {
    padding: 1vh 0.5vw;
    width: 100%;
    height: 100%;
    text-decoration: none;
    font-weight: 550;
    color: #002A6F;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.divider {
    margin: 0px !important;
    height: 2px!important;
    overflow: hidden;
    width: 100%;
    background-color: #FFD7BB;
}

.box-paqueteria-paquetexpress:hover ul.ul-opciones {
    opacity: 1;
    visibility: visible;
}

.box-paqueteria-fedex:hover ul.ul-opciones {
    opacity: 1;
    visibility: visible;
}

.box-paqueteria-estafeta:hover ul.ul-opciones {
    opacity: 1;
    visibility: visible;
}

.box-paqueteria-redpack:hover ul.ul-opciones {
    opacity: 1;
    visibility: visible;
}   

.box-paqueteria-dhl:hover ul.ul-opciones {
    opacity: 1;
    visibility: visible;
}

.temas .div-flotante {
    right: 20vw;
    width: 280px;
    margin-top: 120px;
}

.secc-enlaces .div-flotante {
    margin-top: 30px;
}

/* .secc-enlaces .div-flotante {
    margin-top: 106vh;
} */

@media (max-width:1035px) {
    .secc-enlaces .div-flotante {
        margin-top: 600px;
    }
}

@media (max-width:991px) {
    .temas .div-flotante {
        right: 40vw;
        margin-top: 380px !important;
    }
}

@media (max-width:768px) {
    .temas .div-flotante {
        right: 20vw;
    }
}

@media (max-width:691px) {
    .secc-enlaces .div-flotante {
        display: none;
    }
}


@media (max-width:450px) {
    .temas .div-flotante {
        right: 10vw;
    }
}

@media (max-width:330px) {
    .temas .div-flotante {
        right: 5vw;
        left: 5vw;
    }
}