*{margin: 0; padding: 0; text-decoration: none; list-style:none; font-family: 'Montserrat', sans-serif; box-shadow: none; }
*::-webkit-scrollbar{
    -webkit-appearance: none;
    width:5px;   
}
::-webkit-scrollbar-thumb{
    background-color: #8b92e3;
    border-radius: 20px;
}
body{
    background-color: #d3cece; /*fondo*/
    display: block;
    transition-duration: 500ms;
    cursor: url(/media/cursorTextoChico.svg),text; 
    height: 100vh;
}
footer{
    height: 5vh;
    background-image: linear-gradient(#ffff, #bdbdbd);
    text-align: center;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}
footer .logos{
    margin-top: 1vh;
    height: 3vh;
}
.logos{
    height: 4vh;
}

a, a:hover, a:visited, button{
    color: #262626;
    cursor: pointer;
}
h1{
    font-size: 2.5vw;
}
h2{
    font-family: 'Raleway', sans-serif;
    font-weight: 900;
    font-size: 2vw;
}
h3{
    font-family: 'Raleway', sans-serif;
    font-weight: 800;
    font-size: 1.9vw;
    margin-bottom: 2vh;
}
h4{
    font-family: 'Raleway', sans-serif;
    font-weight: 800;
    font-size: 1.2vw; 
}
p, button a p{
    font-size: 2vh;
}

/*header*/
header{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.divEncabezado{
    height: 100vh;
    width: 100%;
    z-index: -1;
    position: fixed;
    margin-bottom: 100vh;
}
.logo{
    width: 65vh;
    min-width: 400px;
    opacity: 0;
    animation: aparecer 1800ms;
    transition: opacity 1800ms linear;
    opacity: 1;
    position: absolute;
    top:36vh;
    left: calc(45vw - 200px);
}
.fraseHeader{
    width: 100%;
    position: absolute;
    top: 75vh;
    opacity: 0;
    animation: mover 2000ms;
    transition: opacity 1800ms linear;
    opacity: 1;
    text-align: center;
}
.divBtnMiniMenu{
    width: 5vw;
    font-size: 5vh;
    position: fixed;
    top: 45%;
    right: 4vw;
}
.divBtnMiniMenu img{
    width: 100%;
    animation: visualizar 1800ms;
}
.btnLogoVistasMobile{
    display: none;
}
.miniMenu{
    display: none;
    animation: visualizar 1500ms;
}
.btnCerrarMiniMenu{
    position: relative;
    right: -2vh;
}
.listaMiniMenu{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    position: absolute;
    top: 30vh;
    right: 6vw;
    height: 30vh;
    width: 15vw;
    background-color: #9F9391;
    padding: 0vh 3vw 5vh 3vw;
}
.menu{
    display: grid;
    grid-template-columns: 33% 33% 33%;
    grid-template-areas: "indicador indicador indicador" "about servicios clientes" "noticias blog contacto";
    justify-content: center;
    height: 100vh;
    margin-top: 97vh;
    z-index: 1;
}
.itemMenu{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    background-color: #d3cece;
    text-align: center;
    height: 99vh;
    width: 33vw;
}
.itemMenu a{
    height:  100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.divIndicador{
    grid-area: indicador;
    background-color: #bdbdbd9c;
    display: flex;
    text-align: center;
    justify-content: center;
}
.divIndicador img{
    height: 2.5vh;
    border-radius: 50%;
    background: #8b92e3;
    width: 2.5vh;
}
.divAbout{
    grid-area: about;
    border-bottom: solid 1px #8b92e3;
}
.divServicios{
    grid-area: servicios;
    border-bottom: solid 1px #8b92e3;
    border-left: solid 1px #8b92e3;
}
.divClientes{
    grid-area: clientes;
    border-bottom: solid 1px #8b92e3;
    border-left: solid 1px #8b92e3;
}
.divContacto{
    grid-area: contacto;
    border-left: solid 1px #8b92e3;
}
.divNoticias{
    grid-area: noticias;
}
.divBlog{
    grid-area: blog;
    border-left: solid 1px #8b92e3;
}
.divServicios:hover, .divClientes:hover, .divAbout:hover, .divContacto:hover, .divBlog:hover, .divNoticias:hover, .auditoria:hover, .auditoria:hover, .gestion:hover, .copy:hover, .guia:hover, .planes:hover{
    transition: background-color 1500ms linear;
    background-color: #8b92e3;
}
.divServicios:hover h2, .divClientes:hover h2, .divAbout:hover h2, .divContacto:hover h2, .divBlog:hover h2, .divNoticias:hover h2, .auditoria:hover h3, .gestion:hover h3, .copy:hover h3, .guia:hover h3, .planes:hover h3{
    transition: font-size 1500ms;
    font-size: 6vh;
}
/*vistas*/
.headerVistas{
    height: 10vh;
    padding: 1vh;
    overflow: hidden;
} 
.asideVistas{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    position: absolute;
    right: 2vw;
}
.headerVistas img{
   height: 10vh;
   padding-right: 2vw;
}
.fraseHeaderVistas{
    position: absolute;
    left: 4vw;
}
.fraseHeaderVistas h1{
    font-size: 15px;
}
.menuVistas{
    display: none;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    position: absolute;
    right: 0vw;
    top: 15vh;
    text-align: right;
    animation: visualizar 1500ms;
}
.menuVistas li{
    margin: 2vh;
}
.menuVistas li:hover{
    font-weight: 800;
}
main{
    height: 83vh;
}
.aboutBody{
    background-image: url(../media/imgBgAbout.jpg);
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
}
.aboutCuerpo{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: left;
    padding-left: 5vw;
}
.aboutCuerpo div{
    width: 30vw;
    text-align: center;
    padding-top: 5vh;
}
.aboutCuerpo section{ 
    display: flex;
    height: 60%;
    flex-direction: column;
    justify-content: space-around;
    align-items: left;
    padding-bottom: 15vh;
}
.serviciosCuerpo{
    display: grid;
    grid-template-columns: 30% 30% 30%;
    grid-template-areas: ". auditoria gestion" "copyw guia planes";
    z-index: 1;
}   
.auditoria{
    grid-area: auditoria;
}
.gestion{
    grid-area: gestion;
}
.copy{
    grid-area: copyw;
}
.guia{
    grid-area: guia;
}
.planes{
    grid-area: planes;
}

/*SERVICIOS*/
.divServicio{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    height: 40vh;
    resize: none;
    text-align: center;
}
.divServicio h3{
    cursor: pointer;
}
.indicardorVista{
    position: absolute;
    top:18vh;
    left: 3vw;
}
.servicioSeleccionado{
    display: none;
    z-index: 2;
    position: fixed;
    height: 30vh;
    top: 14vh;
    left: 2vw;
    right: 2vw;
    padding: 20vh 2vw;
    background-color: rgb(246, 242, 242);
    opacity: 0;
    animation: aparecer 1000ms;
    transition: opacity 800ms linear;
    opacity: 1;
}
.servicioSeleccionado img{
    height: 100%;
}
.servicioTexto{
    width: 40vw;
    text-align: center;
    font-size: 1.5vw;
}
.textoI{
    position: absolute;
    left: 10vw;
    top: 20vh;
}
.textoD{
    position: absolute;
    right: 10vw;
    top: 20vh;
}
.auditoriaDetalle, .gestionDetalle, .copyDetalle, .guiaDetalle, .planesDetalle{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100%;
}
.auditoriaDetalle .servicioFotoI{
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    width: 80%;
    z-index: -1;
    clip-path: polygon(0 0, 55% 0, 32% 100%, 0% 100%);
}
.gestionDetalle .servicioFotoD{
    position: absolute;
    height: 100%;
    right: 0;
    top: 0;
    z-index: -1;
    clip-path: polygon(100% 0, 100% 100%, 0% 100%, 25% 50%, 0% 0%);
}
.copyDetalle .servicioFotoI{
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    z-index: -1;
    clip-path: polygon(0 0, 67% 0, 100% 100%, 0% 100%);
}
.guiaDetalle .servicioFotoD{
    position: absolute;
    height: 100%;
    right: 0;
    top: 0;
    z-index: -1;
    clip-path: polygon(100% 0, 100% 100%, 0% 100%, 25% 50%, 0% 0%);
}
.planesDetalle .servicioFotoI{
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    z-index: -1;
    clip-path: polygon(0 0, 67% 0, 100% 100%, 0% 100%);
}
/*Carrusel clientes*/
.items{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    user-select: none;
}  
.items .item {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 18vw;
    height: 18vw;
    border-radius: 100%;
    overflow: hidden;
    transition: all 300ms ease-in-out;
    z-index: -1;
    opacity: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.item img {
    height: 125%;
    width: 125%;
}
.item.active {
    opacity: 1;
    z-index: 99;
    box-shadow: 0px 0px 105px -35px rgba(0, 0, 0, 0.75);
}
.item.prev {
    z-index: 2;
    opacity: 0.25;
    transform: translate(-125%, -60%);
}
.item.next {
    z-index: 2;
    opacity: 0.25;
    transform: translate(25%, -60%);
}
.items .buttonContainer {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 30vw;
    z-index: 100;
}
.buttonContainer .button {
    color: #fff;
    position: relative;
    opacity: 0.5;
    transition: all 300ms ease-in-out;
}
.buttonContainer .button:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 20vw;
    height: 20vw;
    border-radius: 50%;
    z-index: -99;
}
.buttonContainer .button:nth-child(1) {
    float: left;
  }
.buttonContainer .button:nth-child(2) {
    float: right;
}

/*NOTICIAS*/
.divIndicadorBajar{
    display: block;
    position: absolute;
    left: 49vw;
    bottom: 6vh;
    height: 2vh;
}
.divIndicadorBajar img, .divBtnSubir img{
    height: 2.5vh;
    border-radius: 50%;
    background: #8b92e3;
    width: 2.5vh;
}
.seccionNoticias{
    display: flex;
    height: 68vh;
    padding: 10vh 6vw 0vh 6vw;
    flex-direction: row;
    justify-content: space-around;
    flex-wrap: wrap;
    overflow-y: scroll;
}
.muestraNoticia:nth-child(even){
    margin: 4vh;
    width: 20%;
    height: fit-content;
    background-color: #ffff;
    overflow: hidden;
    border-bottom: 1px  black;
}
.muestraNoticia:nth-child(odd){
    margin: 4vh;
    width: 20%;
    height: fit-content;
    background-color: #ffff;
    overflow: hidden;
}
.seccionNoticias::-webkit-scrollbar-thumb, .blogCuerpo::-webkit-scrollbar-thumb{
    background-color: #8b92e3;
    border-radius: 20px;
}
.seccionNoticias::-webkit-scrollbar, .blogCuerpo::-webkit-scrollbar{
    -webkit-appearance: none;
    width:5px;
}
.contenedorNoticia{
    padding: 4vh;
}
.noticiaTitulo h4{
    font-size: 2.2vh;
}
.muestraNoticia:nth-child(odd) .noticiaTitulo{
    height: 5.3vh;
    overflow: hidden;
}
.muestraNoticia:nth-child(odd) .noticiaCopete{
    height: 12.4vh;
    overflow: hidden;
}
.muestraNoticia:nth-child(odd) .noticiaCopete p{
    overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-line-clamp: 4;
   -webkit-box-orient: vertical;
}
.muestraNoticia:nth-child(even) .noticiaTitulo{
    height: 5.3vh;
    overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.muestraNoticia:nth-child(even) .noticiaCopete{
    height: 17.9vh;
    overflow: hidden;
}
.muestraNoticia:nth-child(even) .noticiaCopete p{
    overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-line-clamp: 6; 
   -webkit-box-orient: vertical;
}

.btnLeerMas{
    margin: 1vh 0vh;
    text-align: left;
}
.contenedorImagen{
    height: 25vh;
    overflow: hidden;
}
.contenedorImagen img{
    display: block;
    min-height:25vh;
    max-width: 140%;
}
.fuente{
    margin-top: 2vh;
}
/*CONTACTO*/
.contactoCuerpo{
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 85vh;
    overflow: hidden;
}
.imgContacto{
    z-index: -1;
    position: absolute;
    top: 0vh;
    height: 100vh;
    clip-path: polygon(0 0, 55% 0, 100% 100%, 0% 100%);
}
.articuloContacto{
    position: absolute;
    left: 25vw;
    top: 28vh;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    width: 20vw;
    height: 30vh;
    padding: 5vh;
    text-align: center;
}
.infoContacto{
    width: 65vh;
    position: absolute;
    right: 10vw;
    top: 17vh;
    align-self: center;
    text-align: center;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
}
.infoContacto div{
    margin: 5vh;
    color: #262626;
}
.devo{
    position: absolute;
    right: 1vw;
    bottom: 1vh;
    display: flex;
    height: 4.5vh;
    width: fit-content;
    min-width: 150px;
    gap: 10px;
    text-align: center;
}
.devo p{
    font-size: 12px;
    opacity: .6;
}
/*BLOG*/
.blogCuerpo{
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: fit-content;
    min-height: 83vh;
    overflow: hidden;
}
.blogCuerpo .divIndicadorBajar, .divBtnSubir{
    display: none;
    z-index: 2;
}
.divBtnSubir{
    position: fixed;
    left: 92vw;
    bottom: 10vh;
    transform: rotate(180deg);
}
.articulosBlog{
    width: 76vw;
    display: flex;
    flex-wrap: wrap;
    padding: 0 10vw;
    justify-content: space-evenly;
}
.contenedorArtBlog{
    height: 40vh;
    width: 30vw;
    overflow: hidden;
    background-color: #ffff;
    border: solid #fff 0.5vh;
    margin: 4vh 1vw;
    cursor: pointer;
}
.tituloArticulo{
    padding-left: 0;
    height: 2.8vw;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2; 
    -webkit-box-orient: vertical;
}
.cuerpoArticulo li{
    padding-top: 1.2vh;
}
.autora{
    display: none;
}
.cuerpoArticulo ul{
    height: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}
.contenedorImgBlog{
    height: 20vh;
    overflow: hidden;
}
.contenedorImgBlog img{
    width: 30vw;
}
.destacadoArt{
    display: none;
}
.active{
    height: 85vh;
    width: 66vw;
    background-color: #ffff;
    overflow-y:scroll;
    position: fixed;
    top: 10vh;
    left: 17vw;
    padding: 2vh;
    margin: 0;
    cursor: url(/media/cursorTexto.svg), text;
}
.active .autora{
    display: block;
    font-size: 1.6vh;
    font-style: italic;
}
.active ul{
    padding: 0vh 3vw;
    display: block;
}
.active .contenedorImgBlog{
    float: top;
    margin: 0 0.5vw 0.5vw 0;
    height: fit-content;
    width: 100%;
    text-align: center;
}
.active .contenedorImgBlog img{
    height: 70vh;
    width: auto;
}
.active .contenedorMediaBlog{
    margin: 1vw;
    height: fit-content;
    width: 100%;
    text-align: center;
}
.active .contenedorMediaBlog img{
    width: 40vw;
}
.active .contenedorMediaBlog video{
    height: 60vh;
}
.active .tituloArticulo{
    text-align: center;
    height: fit-content;
    margin-bottom: 3vh;
    margin-top: 2vh;
}
.active h4{
    font-size: 1.9vw; 
}
.contFlechaAtrasArt{
    display: none;
    position: absolute;
    left: 14vw
}
.active .entradillaArt{
    font-style: italic;
    font-family: 'Raleway', sans-serif;
    font-weight: 800;
}
.active .entradillaArt p{
    font-size: 2.2vh;
}
.active .destacadoArt{
    display: block;
    height: fit-content;
    background-color: #9F9391;
    padding: 2vw;
    margin: 3vh;
    font-family: 'Raleway', sans-serif;
    font-style: italic;
    text-align: center;
}

/*Botones*/
.btnMiniMenu{
    height: fit-content;
}
.btnCerrarMiniMenu{
    font-family: 'Raleway', sans-serif;
    font-size: 3vh;
    margin-left: 80%;
}
button{
    background-color: transparent;
    border: none;
}
.seleccionado{
    font-style: italic;
}
.ingreso{
    display: block;
    position: absolute;
    right: 2vw;
    top: 2vh;
}
.btnCerrarServicio{
    position: absolute;
    right: 5vh;
    top: 5vh;
    font-size: larger;
    font-weight: 900;
    color: #9F9391;
}
.btnCambioServicio{
    position: absolute;
    top: 50%;
    display: flex;
    justify-content: space-between;
    width: 97%;
    cursor: pointer;
    font-size: larger;
    font-weight: 900;
    color: #9F9391;
}
.btnCerrarMenuVistas{
    position: relative;
    right: 35%;
}

/*Animaciones*/
  @keyframes aparecer{
    from{
      margin-top: 50vh;
      opacity: 0;
    }
    to{
      margin-top: 0vh;
      opacity: 1;
    }
  }
  @keyframes mover{
    from{
        opacity: 0;
        margin-left: 30vw;
    }
    to{
        opacity: 1;
        margin-left: 0vw;
    }
  }
@keyframes visualizar {
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
} 

@media only screen and (max-width: 600px){
    main{
        min-height: fit-content;
        height: 83vh;
    }
    .logo{
        width: 30vh;
        min-width: 0;
        margin: 0;
        left: calc(50vw - 15vh);
    }
    .divEncabezado{
        height: 100vh;
        z-index: -1;
        position: fixed;
        margin-bottom: 100vh;
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        align-items: center;
    }
    .divBtnMiniMenu{
        position: absolute;
        top: 6vh;
        right: 4vh;   
    }
    .listaMiniMenu{
        position: absolute;
        top: 10vh;
        right: 2vw;
        height: 15vh;
        width: 37vw;
    }
    .listaMiniMenu p{
        font-size: 1.5vh;
        margin-top: 1.4vh;
    }
    h1{
        font-size: 2.5vh;
    }
    h2{
        font-size: 3vh;
    }
    h3{
        font-size: 2.5vh;
    }
    h4{
        font-size: 1.2vh; 
    }
    p, button a p{
        font-size: 2vh;
    }
    .btnLogoVistasMobile{
        display: block;
    }
    .btnLogoVistasDesk{
        display: none;
    }
    .menu{
        display: flex;
        flex-direction: column;
        height: 100vh;
        width: 96vw;
    }
    .fraseHeader h1{
        font-size: 3.5vw;
        display: inline-block;
        overflow: visible;
        white-space: nowrap;
    }
    .itemMenu{
        width: 100%;
    }
    .divAbout, .divServicios, .divClientes, .divNoticias, .divBlog, .divContacto{
        border:none;
        border-bottom: #8b92e3 solid 0.5px;
        border-left:  #8b92e3 solid 0.5px;
        border-right:  #8b92e3 solid 0.5px;
    }
    .divServicios:hover h2, .divClientes:hover h2, .divAbout:hover h2, .divContacto:hover h2, .divBlog:hover h2, .divNoticias:hover h2, .auditoria:hover h3, .gestion:hover h3, .copy:hover h3, .guia:hover h3, .planes:hover h3{
        font-size: 3.5vh;
    }
    /*vistas*/
    .headerVistas{
        height: 10vh;
    } 
    .fraseHeaderVistas{
        position: absolute;
        left: 4vw;
    }
    .headerVistas img{
        height: 8vh;
        padding-right: 2vw;
     }
    .fraseHeaderVistas h1{
        font-size: 2.9vw;
    }
    .menuVistas{
        top: 10vh;
        z-index: 2;
    }
    .menuVistas li{
        font-weight: 800;
    }
    .indicardorVista{
        position: absolute;
        top: 12vh;
        left: 3vw;
    }
    /*ABOUT*/
    .aboutCuerpo{
        padding-left: 3vw;
        background-color:#fffcfc8f;
        font-weight: 500;
        min-height: fit-content;
        height: 83vh;
    }
    .aboutCuerpo div{
        width: 60vw;
        padding-top: 0;
    }
    .aboutCuerpo section{ 
        justify-content: space-evenly;
        padding-bottom:3vh;
    }
    /*SERVICIOS*/
    .serviciosCuerpo{
        display: flex;
        flex-direction: column;
        padding-top: 6vh;
    }
    .divServicio{
        height: 15vh;
        background-color: rgba(255, 255, 255, 0.377);
        margin: 1px;
    }
    .divServicio h3{
        font-size: 2.4vh;
    }
    .servicioSeleccionado{
        height: 83vh;
        top: 12vh;
        left: 0vw;
        right: 0vw;
        padding: 0;
        overflow: hidden;
        text-align: center;
    }
    .servicioSeleccionado img{
        height: 55%;
        overflow: hidden;
        text-align: center;   
    }
    .servicioTexto{
        width: 85%;
    }
    .textoI{
        position: absolute;
        left: auto;
        top: 10vh;
    }
    .textoD{
        position: absolute;
        right: auto;
        top: 50vh;
    }
    .auditoriaDetalle, .gestionDetalle, .copyDetalle, .guiaDetalle, .planesDetalle{
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        width: 95vw;
        margin: 0 2.5vw;
        z-index: 1;
    }
    .auditoriaDetalle .servicioFotoI, .copyDetalle .servicioFotoI, .planesDetalle .servicioFotoI{
        position: absolute;
        left: auto;
        top: 0vh;
        width: 100vw;
        z-index: -1;
        clip-path:none;
    }
    .gestionDetalle .servicioFotoD, .guiaDetalle .servicioFotoD {
        position: absolute;
        right: auto;
        top: 40vh;
        z-index: -1;
        clip-path: none;
        width: 100vw;
    }
    .auditoriaDetalle .btnCambioServicio, .copyDetalle .btnCambioServicio, .planesDetalle .btnCambioServicio{
        top: 70%;
    }
    .gestionDetalle .btnCambioServicio, .guiaDetalle .btnCambioServicio{
        top: 20%;
    }
    .auditoriaDetalle .btnCerrarServicio, .copyDetalle .btnCerrarServicio, .planesDetalle .btnCerrarServicio{
        right: 5vh;
        top: 55%;
    }
    /*CLIENTES*/
    .items .item {
        width: 30vw;
        height: 30vw;
        border-radius: 10%;
    }
    .item img {
        height: 140%;
        width: 140%;
    }
    .item.prev {
        z-index: 2;
        opacity: 0.25;
        transform: translate(-50%, -150%);
    }
    .item.next {
        z-index: 2;
        opacity: 0.25;
        transform: translate(-50%, 50%);
    }
    .buttonContainer .button:nth-child(1){
        position: absolute;
        top: -30vw;
        left: 15vw;
    }
    .buttonContainer .button:nth-child(2){
        position: absolute;
        top: 30vw;
        left: 15vw;
    }

    /*NOTICIAS*/
    .noticiasCuerpo{
        height: fit-content;
    }
    .divIndicadorBajar{
        display: block;
        position: fixed;
        z-index: 1;
        left: 49vw;
        bottom: 6vh;
        height: 2vh;
    }
    .seccionNoticias{
        height: fit-content;
        padding: 4vh 1vw;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .muestraNoticia:nth-child(even), .muestraNoticia:nth-child(odd){
        margin: 2vh 0;
        width: 95%;
    }
    .noticiaTitulo {
        height: 5.3vh;
        font-size: 20vw;
    }
    /*BLOG*/
    .blogCuerpo{    
        justify-content: center;
    }
    .contFlechaAtrasArt{
        display: none;
        left: 92vw;
        top: 20vh;
    }
    .contFlechaAtrasArt img{
        width: 4vw;
    }
    
    .articulosBlog{
        flex-direction: column;
        margin: 6vh 0 0 0;
        padding: 0;
        width: 90vw;
        align-items: center;
    }
    .contenedorArtBlog{
        height: 39vh;
        width: 80vw;
        overflow: hidden;
        padding: 0;
        margin-bottom: 1vh;
        text-align: center;
    }
    .tituloArticulo{
        padding-left: 0;
        height: 6vh;
        overflow: hidden;
        text-align: left;
        text-overflow: none;
        display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
    }
    .tituloArticulo h4{
        font-size: 2.5vh;
    }
    .cuerpoArticulo ul{
        height: 100%;
        overflow: none;
        text-overflow: none;
        display: -webkit-box;
        -webkit-line-clamp: 4;
         -webkit-box-orient: vertical;
    }
    .cuerpoArticulo li{
        padding-top: 1.2vh;
        text-align: left;
    }
    .contenedorArtBlog img{
        height: 26vh;
        width: auto;
    }
    .active img{
        float: left;
        margin: 0 0.5vw 0.5vw 0;
    }
    .activeMobile{
        height: fit-content;
    }
    .activeMobile .tituloArticulo{
        height: fit-content;
        overflow: hidden;
        display: block;
        text-align: center;
    }
    .activeMobile .autora{
        display: block;
        font-size: 1.6vh;
        font-style: italic;
    }
    .activeMobile ul{
        display: inline;
    }
    .activeMobile .entradillaArt{
        font-style: italic;
        font-family: 'Raleway', sans-serif;
        font-weight: 800;
    }
    .activeMobile .entradillaArt p{
        font-size: 2.1vh;
    }
    .activeMobile .destacadoArt{
        display: block;
        height: fit-content;
        background-color: #9F9391;
        padding: 2vw;
        margin: 2vh;
        font-family: 'Raleway', sans-serif;
        font-style: italic;
        text-align: center;
    }
    .activeMobile .contenedorMediaBlog{
        margin: 1vh 0vh;
    }
    .activeMobile video{
        width: 100%;
        height: auto;
    }
    /*CONTACTO*/
    .contactoCuerpo{
        display: flex;
        flex-direction: column;
        justify-content: center;
        height: 85vh;
        overflow: none;
        overflow: hidden;
    }
    .imgContacto{
        display: none;
    }
    .articuloContacto{
        position: inherit;
        width: 80vw;
        height: 50vh;
        margin-top: 0;
        padding: 5vh;
        text-align: center;
        font-weight: 600;
    }
    .infoContacto{
        width: 65vh;
        position: inherit;
        align-self: center;
        text-align: center;
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: space-around;
        align-items: center;
        height: fit-content;
    }
    .infoContacto div{
        margin: 1vh;
        color: #262626;
        display: flex;
        width: 89vw;
        flex-direction: row;
        justify-content: space-between;
    }
    .devo{
        position: inherit;
        margin-top: 3vh;
        display: flex;
        height: fit-content;
        width: 90vw;
        gap: 10px;
        text-align: center;
        justify-content: end;
    }
}
@media only screen and (min-width:600px) and (max-width: 992px){
    main{
        min-height: fit-content;
        height: 83vh;
    }
    .ingreso{display: none;}
    .logo{
        width: 30vh;
        margin: 0;
    }
    .divBtnMiniMenu{
        position: absolute;
        top: 6vh;
        right: 4vh;   
    }
    .listaMiniMenu{
        position: absolute;
        top: 10vh;
        right: 2vw;
        height: 15vh;
        width: 37vw;
    }
    .listaMiniMenu p{
        font-size: 1.5vh;
        margin-top: 1.4vh;
    }
    h1{
        font-size: 2.5vh;
    }
    h2{
        font-size: 3vh;
    }
    h3{
        font-size: 2.5vh;
    }
    h4{
        font-size: 1.2vh; 
    }
    p, button a p{
        font-size: 2vh;
    }
    .btnLogoVistasMobile{
        display: block;
    }
    .btnLogoVistasDesk{
        display: none;
    }
    .menu{
        display: flex;
        flex-direction: column;
        height: 100vh;
        width: 96vw;
    }
    .fraseHeader h1{
        font-size: 3.5vw;
        display: inline-block;
        overflow: visible;
        white-space: nowrap;
    }
    .itemMenu{
        width: 100%;
    }
    .divAbout, .divServicios, .divClientes, .divNoticias, .divBlog, .divContacto{
        border:none;
        border-bottom: #8b92e3 solid 0.5px;
        border-left:  #8b92e3 solid 0.5px;
        border-right:  #8b92e3 solid 0.5px;
    }
    .divServicios:hover h2, .divClientes:hover h2, .divAbout:hover h2, .divContacto:hover h2, .divBlog:hover h2, .divNoticias:hover h2, .auditoria:hover h3, .gestion:hover h3, .copy:hover h3, .guia:hover h3, .planes:hover h3{
        font-size: 3.5vh;
    }
    /*vistas*/
    .headerVistas{
        height: 10vh;
    } 
    .fraseHeaderVistas{
        position: absolute;
        left: 4vw;
    }
    .headerVistas img{
        height: 8vh;
        padding-right: 2vw;
     }
    .fraseHeaderVistas h1{
        font-size: 2.9vw;
    }
    .menuVistas{
        top: 10vh;
        z-index: 2;
    }
    .menuVistas li{
        font-weight: 800;
    }
    .indicardorVista{
        position: absolute;
        top: 12vh;
        left: 3vw;
    }
    /*ABOUT*/
    .aboutCuerpo{
        padding-left: 3vw;
        background-color:#fffcfc8f;
        font-weight: 500;
        min-height: fit-content;
        height: 83vh;
    }
    .aboutCuerpo div{
        width: 60vw;
        padding-top: 0;
    }
    .aboutCuerpo section{ 
        justify-content: space-evenly;
        padding-bottom:3vh;
    }
    /*SERVICIOS*/
    .serviciosCuerpo{
        display: flex;
        flex-direction: column;
        padding-top: 6vh;
    }
    .divServicio{
        height: 15vh;
        background-color: rgba(255, 255, 255, 0.377);
        margin: 1px;
    }
    .divServicio h3{
        font-size: 2.4vh;
    }
    .servicioSeleccionado{
        height: 83vh;
        top: 12vh;
        left: 0vw;
        right: 0vw;
        padding: 0;
    }
    .servicioSeleccionado img{
        height: 55%;
        width: 100%;
    }
    .servicioTexto{
        width: 85%;
    }
    .textoI{
        position: absolute;
        left: auto;
        top: 10vh;
    }
    .textoD{
        position: absolute;
        right: auto;
        top: 50vh;
    }
    .auditoriaDetalle, .gestionDetalle, .copyDetalle, .guiaDetalle, .planesDetalle{
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        width: 95vw;
        margin: 0 2.5vw;
        z-index: 1;
    }
    .auditoriaDetalle .servicioFotoI, .copyDetalle .servicioFotoI, .planesDetalle .servicioFotoI{
        position: absolute;
        left: auto;
        top: 0vh;
        z-index: -1;
        clip-path:none;
    }
    .gestionDetalle .servicioFotoD, .guiaDetalle .servicioFotoD {
        position: absolute;
        right: auto;
        top: 30vh;
        z-index: -1;
        clip-path: none;
        height: 75vh;
    }
    .auditoriaDetalle .btnCambioServicio, .copyDetalle .btnCambioServicio, .planesDetalle .btnCambioServicio{
        top: 70%;
    }
    .gestionDetalle .btnCambioServicio, .guiaDetalle .btnCambioServicio{
        top: 20%;
    }
    .auditoriaDetalle .btnCerrarServicio, .copyDetalle .btnCerrarServicio, .planesDetalle .btnCerrarServicio{
        right: 5vh;
        top: 55%;
    }
    /*CLIENTES*/
    .items .item {
        width: 30vw;
        height: 30vw;
        border-radius: 10%;
    }
    .item img {
        height: 140%;
        width: 140%;
    }
    .item.prev {
        z-index: 2;
        opacity: 0.25;
        transform: translate(-50%, -150%);
    }
    .item.next {
        z-index: 2;
        opacity: 0.25;
        transform: translate(-50%, 50%);
    }
    .buttonContainer .button:nth-child(1){
        position: absolute;
        top: -30vw;
        left: 15vw;
    }
    .buttonContainer .button:nth-child(2){
        position: absolute;
        top: 30vw;
        left: 15vw;
    }

    /*NOTICIAS*/
    .noticiasCuerpo{
        height: fit-content;
    }
    .divIndicadorBajar{
        display: block;
        position: fixed;
        z-index: 1;
        left: 49vw;
        bottom: 6vh;
        height: 2vh;
    }
    .seccionNoticias{
        height: fit-content;
        padding: 4vh 1vw;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .muestraNoticia:nth-child(even), .muestraNoticia:nth-child(odd){
        margin: 2vh 0;
        width: 60%;
    }
    .noticiaTitulo {
        height: 5.6vh;
        font-size: 20vw;
    }
    /*BLOG*/
    .blogCuerpo{    
        justify-content: center;
    }
    .contFlechaAtrasArt{
        display: none;
        left: 92vw;
        top: 20vh;
    }
    .contFlechaAtrasArt img{
        width: 4vw;
    }
    .articulosBlog{
        flex-direction: column;
        margin: 6vh 0 0 0;
        padding: 0;
        width: 90vw;
        align-items: center;
    }
    .contenedorArtBlog{
        height: 39vh;
        width: 60vw;
        overflow: hidden;
        padding: 0;
        margin-bottom: 1vh;
        text-align: center;
    }
    .tituloArticulo{
        padding-left: 0;
        height: 6vh;
        margin: 1vw;
        overflow: hidden;
    }
    .tituloArticulo h4{
        font-size: 2.5vh;
    }
    .cuerpoArticulo li{
        padding-top: 1.2vh;
        text-align: left;
    }
    .contenedorArtBlog img{
        width: 100%;
    }
    .active img{
        float: left;
        margin: 0 0.5vw 0.5vw 0;
    }
    .activeMobile{
        height: fit-content;
    }
    .activeMobile .autora{
        display: block;
        font-size: 1.6vh;
        font-style: italic;
    }
    .activeMobile ul{
        display: inline;
    }
    .activeMobile .contenedorMediaBlog{
        margin: 1vh 0vh;
    }
    .activeMobile video{
        width: 100%;
        height: auto;
    }

    /*CONTACTO*/
    .contactoCuerpo{
        display: flex;
        flex-direction: column;
        justify-content: center;
        height: 85vh;
        overflow: none;
        overflow: hidden;
    }
    .imgContacto{
        display: none;
    }
    .articuloContacto{
        position: inherit;
        width: 80vw;
        height: 50vh;
        margin-top: 0;
        padding: 5vh;
        text-align: center;
        font-weight: 600;
    }
    .infoContacto{
        width: 65vh;
        position: inherit;
        align-self: center;
        text-align: center;
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: space-around;
        align-items: center;
        height: fit-content;
    }
    .infoContacto div{
        margin: 1vh;
        color: #262626;
        display: flex;
        width: 89vw;
        flex-direction: row;
        justify-content: space-between;
    }
    .devo{
        position: inherit;
        margin-top: 2vh;
        display: flex;
        height: fit-content;
        width: 90vw;
        gap: 10px;
        text-align: center;
        justify-content: end;
    }
}
@supports (-webkit-touch-callout: none){
        /*INDEX*/
        .headerIOS{
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            height: 50vh;
            width: 99vw;
        }
        .divEncabezado{
            height: 40vh;
            display: flex;
            flex-direction: column;
            justify-content: space-evenly;
            align-items: center;
            margin-bottom: 0vh;
        }
        .logo{
            width: 30vh;
            opacity: 0;
            animation: aparecer 1800ms;
            transition: opacity 1800ms linear;
            opacity: 1;
        }
        .fraseHeader{
            width: fit-content;
            position: absolute;
            top: 60vh;
            opacity: 0;
            animation: mover 2000ms;
            transition: opacity 1800ms linear;
            opacity: 1;
        }
        .divBtnMiniMenu{
            position: absolute;
            top: 6vh;
            right: 4vh;   
        }
        .listaMiniMenu{
            position: absolute;
            top: 10vh;
            right: 2vw;
            height: 15vh;
            width: 37vw;
        }
        .menu{
            display: flex;
            flex-direction: column;
            height: 100vh;
            margin-top: 206vh;
        }
        .itemMenu{
            height: 15%;
            width: 95vw;
        }
        /*SERVICIOS*/
        .servicioSeleccionado{
            top: 10vh;
        }
        /*BLOG*/
        .cuerpoArticulo ul{
            height: 100%;
            overflow: hidden;
            text-overflow: none;
            display: inline;
        }
        .activeMobile{
            height: fit-content;
        }
}