@font-face {font-family:acen; src:url(../fonts/acens.ttf) format("truetype"); font-weight:normal; font-style:normal;}
@font-face {font-family:antipasto; src:url(../fonts/antipasto.ttf) format("truetype"); font-weight:normal; font-style:normal;}
@font-face {font-family:arkitech; src:url(../fonts/arkitech_light.ttf) format("truetype"); font-style:normal; font-weight:normal;}
@font-face {font-family:denmark; src:url(../fonts/denmark.ttf) format("truetype"); font-style:normal; font-weight:normal;}
@font-face {font-family:asesina; src:url(../fonts/asesina.ttf) format("truetype"); font-style:normal; font-weight:normal;}
@font-face {font-family:bisq; src:url(../fonts/bisque.woff) format("woff"); font-weight:normal; font-style:normal;}
@font-face {font-family:opensans; src:url(../fonts/opensans.ttf) format("truetype"); font-style:normal; font-weight:normal;}
:root{
    --z-fondo:-10;
    --z-normal:1;
    --z-tips:10;
    --z-fixed:100;
    --z-modal:1000;
}
body {
    margin: 0;
    padding: 0;
    font-family: "antipasto";
    overflow-x: hidden;

    background: url(../img/fnd-bod01.jpg);
    background-attachment:fixed;
    text-rendering: geometricPrecision optimizeLegibility;
}


h1, h2, h3, h4, p {font-weight:normal; padding:0; margin:0;}
a {margin:0; padding: 0; text-decoration: none;}
ul {list-style:none;}
* {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    text-decoration: none;
    width: 100%;
    box-sizing: border-box;
}
.oculto {
    visibility: hidden;
}


@media screen and (min-width:640px){
    .solo-cel{
        visibility: hidden;
    }
    .encabezado{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 145px;
        background: #515969;
    }
    .img-fondo{
        position: absolute;
        top:0;
        left: 0;
        width: 50%;
        height: 145px;
    }
    .logo{
        position: absolute;
        top: 10px;
        left: 20px;
        width: 23%;
    }
    .fecha-act{
        position: absolute;
        top: 5px;
        right: 20px;
        width: 400px;
        color: #fff;
        font-size: 1vw;
        letter-spacing: 1px;
        text-align: right;
    }
    .tit-pagdetails{
        position: absolute;
        top: 20%;
        right: 5%;
        width: 40%;
        font-family: "denmark";
        color: #b5bec6;
        font-size: 3.3vw;
        text-align: right;
    }
    .frj-infencab{
        position: absolute;
        top: 16vh;
        left: 0;
        width: 100%;
        height: 30px;
        background: #b5bec6;
    }
    .lnk-inicio{
        display: block;
        position: absolute;
        top: 10%;
        right: 2%;
        width: 7%;
        height: 80%;
    }
    .lnk-inicio .ico-homedetails{
        position: absolute;
        background: url(../img/ico-home-details.png)no-repeat;
        top: 5%;
        width: 16%;
        height: 100%;
        background-position: center;
        background-size: contain;
    }
    .lnk-inicio span{
        position: absolute;
        top: 10%;
        left: 25%;
        font-size: 1.2vw;
        color: #515969;
        letter-spacing: 1px;;
    }
    .lnk-inicio:hover span{
        color: #fff;
    }
    .lnk-inicio:hover .ico-homedetails{
        background: url(../img/ico-home-details2.png)no-repeat;
        background-position: center;
        background-size: contain;
    }
    main{
        position: absolute;
        top: 20vh;
        left: 0;
        width: 210vw;
        height: 150vh;

    }
    .numeros-telf{
        position: absolute;
        right: 2%;
        top: 1%;
        font-family: "antipasto";
        letter-spacing: 1px;
        font-size: 1vw;
        width: auto;
    }
    .lnk-facebookdetails{
        display: block;
        position: absolute;
        left: 2%;
        top: 1%;
        font-family: "antipasto";
        letter-spacing: 1px;
        font-size: 1vw;
        color: #515969;
        width: 20%;
    }
    .lnk-facebookdetails img{
        width: 5%;
        padding-right: 2%;
    }
    .contenprin{
        position: absolute;
        top: 9%;
        left: 0;
        width: 100%;
        height: 90vh;
    }
    .tit-prindetails{
        position: absolute;
        top: 0;
        left: 2%;
        font-family: "bisq";
        font-size: 3.4vw;
        color: #515969;
    }
    .tit-underline{
        position: relative;
        top:9%;
        left: 2%;
        width: 6%;
        border-top: 2px solid #ffac05;
    }
    .parraf-prin {
        position: relative;
        top: 100px;
        left: 2%;
        width: 15%;
        padding-bottom: 0.5em;
        font-size:1em;
        z-index: var(--z-tips); color: #00375d;
    }
    .parraf-prin a{
        color: #007ebb;
        transition: 0.3s;
    }
    .parraf-prin a:hover{
        color: #cb7b58;
        transition: 0.3s;
    }
    .contendetails01{
        position: absolute;
        top: 16%;
        left: 12%;
        width: 38%;
        font-size: 1.35vw;
        color: #515969;
        font-family: "antipasto";
        letter-spacing: 1px;
    }
    .img-details{
        position: absolute;
        top: 8%;
        right: 7%;
        width: 35%
    }
    .lnk-infadicional{
        display: block;
        position: absolute;
        bottom: 26%;
        left: 10%;
        width: 13%;
        height: 7%;
        background: rgba(255,255,255,0.4);
        border: 1px solid #515969;
        font-family: "bisq";
        color: #515969;
        font-size: 1.vw;
        text-align: center;
        outline: 1px solid;
        outline-color: rgba(81, 89, 105, 0.4);
        transition: all 1s cubic-bezier(0.19, 1, 0.22, 1);
        transition: all 0.6s ease;
    }
    .lnk-infadicional span{
        position: absolute;
        left: 0;
        top: 52%;
        transform: translateY(-50%);
    }
    .lnk-infadicional:hover{
        transform: scale(0.95);
        color: #ffc148;
        background: #515969;
        border: 1px solid #ffc148;
        font-weight: bold;
        box-shadow: 0 0 20px #505969;
        outline-color: rgba(255, 255, 255, 0);
        outline-offset: 80px;
    }
    .sec-infadicional{
        position: absolute;
        top: 180vh;
        left: 5%;
        width: 90%;
        height: 10vh;
    }
    .tit-adicionales{
        position: absolute;
        bottom: 12%;
        left: 0;
        width: 40vw;
        font-family: "denmark";
        font-size: 1.5vw;
        color: #afafaf;
        text-align: right;
    }
    .lnk-pagexternas:hover{
        transform: scale(0.93);
        transition: all 0.5s ease;
    }
    .lnk-sunass{
        position: absolute;
        bottom: 5%;
        left: 42.5vw;
        width: 4.7vw;
        transition: all 0.5s ease;
    }
    .lnk-otass{
        position: absolute;
        bottom: 5%;
        left: 48vw;
        width: 7.3vw;
        transition: all 0.5s ease;
    }
    .lnk-minviv{
        position: absolute;
        bottom: 5%;
        left: 56vw;
        width: 9.6vw;
        transition: all 0.5s ease;
    }
    .lnk-osce{
        position: absolute;
        bottom: 5%;
        left: 66.4vw;
        width: auto;
        width: 4.8vw;
        padding-top: 1px;
        transition: all 0.5s ease;
    }
    .lnk-infobras{
        position: absolute;
        bottom: 5%;
        left: 72vw;
        width: 7.2vw;
        transition: all 0.5s ease;
    }
    .lnk-cgr{
        position: absolute;
        bottom: 4%;
        right: 0;
        width: 10.1vw;
        transition: all 0.5s ease;
    }
    footer{
        position: absolute;
        top: 210vh;
        left: 0;
        width: 100%;
        height: 15.7vw;
        background: #000;
        overflow: hidden;
    }
    .pie{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }
}
@media screen and (max-width:639px){
    .cel-oculto{
        visibility: hidden;
    }
    header{
        position: absolute;
        top: 0;
        left: 0;
        width: 100vw;
        height: 18vh;
        background: #515969;
    }
    .logo{
        position: absolute;
        top: 10px;
        left: 12%;
        width: 74%;
    }
    .frj-infencab{
        position: absolute;
        top: 14vh;
        left: 0;
        width: 100%;
        height: 4vh;
        background: #b5bec6;
    }
    .tit-pagdetails{
        position: absolute;
        top: 14.1vh;
        left: 0;
        width: 100%;
        text-align: center;
        font-family: "denmark";
        font-size: 6vw;
        color: #fff;
        z-index: 1;
    }
    main{
        position: absolute;
        top: 18vh;
        left: 0;
        width: 100vw;
        height: 72vh;
        color: #515969;
    }
    .numeros-telf{
        position: absolute;
        top: 1vh;
        left: 2%;
    }
    .contenprin{
        position: absolute;
        top: 6vh;
        left: 5%;
        width: 90%;
        height: 66vh;
    }
    .tit-prindetails{
        font-family: "bisq";
        font-size: 8vw;
    }
    .tit-underline{
        position: relative;
        top:0;
        left: 0;
        width: 12vw;
        border-top: 2px solid #ffac05;
    }
    .contendetails01{
        position: relative;
        top: 4%;
        left: 0;
        width: 100%;
        height: auto;
        font-size: 4.5vw;
    }
    .lnk-infadicional{
        display: block;
        position: absolute;
        bottom: 5%;
        left: 20%;
        width: 60%;
        height: 10%;
        background: #515969;
        border: 1px solid #ffc148;
        font-family: "bisq";
        color: #ffc148;
        font-size: 1.vw;
        text-align: center;
    }
    .lnk-infadicional span{
        position: absolute;
        left: 0;
        top: 52%;
        transform: translateY(-50%);
    }
    
    footer{
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 10vh;
        background: #000;
    }
    .logopie{
        position: absolute;
        top: 5%;
        left: 3%;
        width:50vw;
    }
    .correo-pie{
        position: absolute;
        top:2%;
        right: 0;
        width: 40%;
        height: 20px;
        text-align: right;
        font-size: 3vw;
        color: #fff;
        letter-spacing: 1px;
    }
    .correo-pie img{
        padding-left: 5px;
        padding-top: 3px;
        width: 1.2vw;
    }
    .copyr{
        position: absolute;
        bottom: 1%;
        left: 0;
        width: 100%;
        height: auto;
        text-align: center;
        letter-spacing: 1px;
        color: #fff;
        font-size: 3vw;
    }
}
