:root {

    --negro: #000000;

    --blanco: #FFFFFF;

    --trans: transparent;

    --azul: #003B64;

    --amarillo: #E3AB00;

    --beige: #F4F1EA;

    --fuentePrin: 'Helvetica Neue', sans-serif;

    --fuenteSec: 'BenHand';

}





/*quitar*/

.color {

    background-color: rgba(187, 161, 161, 0.367);

}



body {

    color: var(--beige);

    font-family: var(--fuentePrin);

}







/* bloque 1

--------------------------------------------- */

.sec1_inte {



    background-color: var(--azul);

}



.sec1_inte .fondo-sec {

    width: 100%;

    height: 100%;

    background-size: cover;



    background-repeat: no-repeat;

}

.sec1_inte::after {

    content: "";

    position: absolute;

    width: 100%;

    height: 50%;

    background-image: url('https://intemares.entorno-desarrollo.es/wp-content/uploads/2023/09/Radial-azul.svg');

    background-repeat: no-repeat;

    top: 0;

    left: 0;



}



.sec1_inte .fondoFade {

    height: 100%;

    background-size: 120%;

    background-position-y: bottom;

    background-repeat: no-repeat;

}



.sec1_inte .fondoFade .container {

    height: 100%;

}



.sec1_inte .top-header {

    height: 100%;

    padding-top: 265px;

    padding-bottom: 70px;

    z-index: 2;

    position: relative;

}



.sec1_inte .top-header .col1 {

    width: 100%;

}



.top-header .tit {

    color: var(--beige);

    font-size: 67px;

    font-style: normal;

    font-weight: 700;

    line-height: 100%;

    margin-bottom: 40px;

}



.top-header .parr {

    grid-column: 2;

    column-width: 30em;

    gap: 5%;

}





.top-header .parr p {

    margin: 0px;

    /*font-size: 26px;*/
    font-size: 18px;

    font-style: normal;

    font-weight: 400;

    line-height: 140%;

    margin-bottom: 35px;

}



.top-header .parr a,

.top-header .parr a:hover,

.top-header .parr a:visited {

    text-decoration: underline;

    color: var(--beige);

    font-weight: 700;

}





.explorar-btn,

.explorar-btn:hover,

.explorar-btn:visited {

    text-decoration: none;

    width: 130px;

    color: var(--beige);

}



.explorar-btn:visited {

    color: var(--beige);

}



.explorar-btn .img-btn {

    width: 20px;

    height: 20px;

    margin-right: 15px;

}



.explorar-btn .txt-btn {

    font-size: 20px;

    font-style: normal;

    font-weight: 500;

    line-height: 100%;



}







@media (max-width:1399px) {

    .top-header .parr p {

        font-size: 22px;

    }

    .sec1_inte .fondoFade {

        background-size: 200%;

    }

}



@media (max-width:1199px) {

    .sec1_inte .top-header {

        padding-bottom: 20px;

    }

}













@media (max-width:991px) {

    .top-header .tit {

        font-size: 62px;

    }



    .sec1_inte .fondo-sec {

        background-repeat: no-repeat;

        background-position: center top;

        background-size: 1500px 500px;

    }



    .sec1_inte::before {

        content: "";

        position: absolute;

        width: 100%;

        height: 500px;

        background-size: 100%;

        background-position: bottom;

        background-image: url('/wp-content/uploads/2023/08/fondo-trans.svg');

        background-repeat: no-repeat;

    }





    .fondoFade {

        background-image: unset;

    }



}



@media (max-width:500px) {



    .top-header .tit {

        font-size: 59px;

    }



    .top-header .parr p {

        font-size: 16px;

        margin-bottom: 25px;

    }



    .sec1_inte .top-header {

        padding-top: 200px;

        padding-bottom: 140px;

        padding-bottom: 30px;

    }



    .explorar-btn .txt-btn {

        font-size: 17px;

    }



    .sec1_inte .fondo-sec {

        background-position: right top;

    }

    .sec1_inte::before {

        background-size: 250%;

    }

}



@media (max-width:300px) {

    .top-header .tit {

        font-size: 45px;

    }



    .sec1_inte .top-header {

        padding-bottom: 80px;

    }

}





/* bloque 2 y bloque 3

--------------------------------------------- */

.fondo-azul {

    background-color: var(--azul);

}





/* bloque 2

--------------------------------------------- */

.sec2_inte {

    min-height: 200px;

    z-index: 2;

    position: relative;

    padding-top: 160px;

}



.acciones-gal {

    align-items: flex-start;

    flex-wrap: wrap;

    gap: 2%;

}



.box-img {

    width: 365px;

    height: 487px;

    border-radius: 16px;

    overflow: hidden;

    position: relative;

    margin-bottom: 30px;

}



.box-img a {

    text-decoration: none;

}



.box-img:hover .img-hover {

    opacity: 1;

    transition: all 0.4s linear;

    cursor: pointer;

}





.box-img .img-gal {

    width: 100%;

    height: 100%;

    background-size: cover;

}



.fondo-osc {

    width: 100%;

    height: 100%;

    padding: 25px;

    background-image: url('/wp-content/uploads/2023/08/fondo-gal-1.png');

    background-size: 110%;

    background-position-y: calc(100% + 2px);

    background-repeat: no-repeat;

    align-items: flex-end;

}





.box-img .gal-btn {

    width: 100%;

    min-height: 85px;

    justify-content: space-between;

    align-items: flex-end;

}



.box-img .gal-btn .txt {

    color: var(--blanco);

    font-size: 26px;

    font-style: normal;

    font-weight: 500;

    line-height: 139.83%;

    width: 88%;

}



.box-img .gal-btn img {

    width: 24px;

    height: 24px;

}





.img-hover {

    width: 100%;

    height: 100%;

    position: absolute;

    backdrop-filter: blur(25px);

    opacity: 0;

    top: 0;

    left: 0;

    justify-content: center;

    align-items: center;

}



.img-hover .link-expl {

    border: 1px solid var(--blanco);

    border-radius: 100%;

    width: 270px;

    height: 270px;

    justify-content: center;

    align-items: center;

}



.img-hover .txt-expl {

    color: var(--blanco);

    text-align: center;

    font-size: 20px;

    font-style: normal;

    font-weight: 500;

    line-height: 100%;

    margin-right: 15px;

}



.img-hover img {

    width: 18px;

    height: 16px;

}



@media (max-width:1699px) {

    .box-img {

        width: 310px;

        height: 413px;

    }



    .img-hover .link-expl {

        width: 250px;

        height: 250px;

    }



    .img-hover .txt-expl {

        font-size: 18px;

    }

}



@media (max-width:1399px) {

    .box-img {

        width: 260px;

        height: 346px;

    }



    .img-hover .link-expl {

        width: 200px;

        height: 200px;

    }







}



@media (max-width:1199px) {

    .box-img {

        width: 300px;

        height: 399px;

    }



    .box-img .gal-btn .txt {

        font-size: 22px;

        width: 86%;

    }





}



@media (max-width:991px) {

    .box-img {

        width: 230px;

        height: 306px;

    }



    .box-img .gal-btn .txt {

        font-size: 16px;

    }



    .img-hover .link-expl {

        width: 170px;

        height: 170px;

    }

}



@media (max-width:767px) {

    .box-img {

        width: 250px;

        height: 334px;

    }



    .acciones-gal {

        gap: 4%;

    }

}



@media (max-width:550px) {

    .col1 {

        width: 360px;

        margin: 0 auto;

    }



    .acciones-gal {

        justify-content: center;

    }



    .box-img {

        width: 358px;

        height: 477px;

        margin-bottom: 20px;

    }



    .box-img .gal-btn .txt {

        font-size: 22px;

    }



    .img-hover .link-expl {

        width: 270px;

        height: 270px;

    }

    .sec2_inte {

        padding-top: 140px;

    }

}





@media (max-width:400px) {

    .col1 {

        width: 100%;

    }



    .box-img {

        width: 100%;

    }



    .img-hover .link-expl {

        width: 200px;

        height: 200px;

    }

}



@media (max-width:350px) {

    .box-img {

        height: 350px;

    }



    .sec2_inte {

        margin-bottom: 30px;

    }



    .box-img .gal-btn .txt {

        font-size: 18px;

    }

}







/* bloque 3

--------------------------------------------- */

.sec3_inte {

    border-radius: 0px 0px 64px 64px;

    overflow: hidden;

    z-index: 1;

    position: relative;

    background-size: cover;

    margin-top: -100px;

}



.sec3_inte::before {

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    background-image: url('/wp-content/uploads/2023/09/gradiente-sec3.svg');

    background-size: 100%;

    background-repeat: no-repeat;

    height: 100%;

    width: 100%;

}



.sec3_inte .col1 {

    width: 620px;

    padding-top: 400px;

    padding-bottom: 360px;

}



.sec3_inte .txt,

.sec3_inte .txt p {

    color: var(--beige);

    font-size: 26px;

    font-style: normal;

    font-weight: 500;

    line-height: 140%;

    margin: 0px;

    margin-bottom: 35px;

}



.sec3_inte .autor {

    color: var(--blanco);

    font-size: 16px;

    font-style: normal;

    font-weight: 500;

    line-height: 120%;

}



@media (max-width:1199px) {

    .sec3_inte .col1 {

        width: 400px;

    }



    .sec3_inte {

        background-position: calc(50% + 200px) bottom;

        background-size: cover;

        background-repeat: no-repeat;



    }

}



@media (max-width:991px) {



    .sec3_inte .txt,

    .sec3_inte .txt p {

        font-size: 22px;

        margin-bottom: 30px;

    }



    .sec3_inte .col1 {

        width: 300px;

        padding-top: 300px;

        padding-bottom: 300px;

    }



}



@media (max-width:730px) {

    .sec3_inte {

        margin-top: 0px;

    }



    .sec3_inte .col1 {

        padding-top: 120px;

        padding-bottom: 0px;

        width: 70%;

        margin: 0 auto;

    }



    .sec3_inte .txt,

    .sec3_inte .txt p {

        text-align: center;



    }



    .sec3_inte .autor {

        color: var(--blanco);

        text-align: center;

    }



    .sec3_inte {

        background-position: center bottom;

        height: auto;

        background-size: 1200px;

        background-repeat: no-repeat;

        padding-bottom: 485px;

    }

}



@media (max-width:500px) {



    .sec3_inte .txt,

    .sec3_inte .txt p {

        font-size: 18px;

    }



    .sec3_inte .col1 {

        width: 100%;

    }

}

