/* FLECHA DESPLAZAMIENTO MENUS 4, 5, 6 */


    .flechaMenuPrincipal{
        position: absolute;
        top: 60%;    
        display: block;
    }
    
    .flechaMenu{
        position: absolute;
        top: 60%;    
        display: none;
    }
    
    .flechaMenuBack{
        position: absolute;
        top: 60%;    
        display: none;        
    }
    

/*  CIERRE */     


    .img-contenedor {
        width:100%;
        height:65%; 
        overflow:hidden;
        border-radius: 5px;
    }
    
    /*
    Crear M-Query Para Imagenes Responsivas 
    */

    @media (max-width: 1220px) {

        .img-contenedor img {
            height: 275px;
            width: 275px;
        }
        .img-contenedor:hover img {
            -webkit-transform:scale(1.05);
            -moz-transform:scale(1.05);
            -ms-transform:scale(1.05);
            -o-transform:scale(1.05);
            transform:scale(1.05);
        }        
            
    }
    
    @media (max-width: 990px) {

        .img-contenedor img {
            height: 225px;
            width: 225px;
        }
    }    
    
    @media (max-width: 765px) {
        
        .MenuEscritorio{
            display: none;        
        }
        #intro{
            display: none;
        }
        
    }    


    /* menu lateral */
    /* ------------ */
    .texto-vertical-menu {
        writing-mode: vertical-lr;
        position:absolute;
        top: 45%;
    }
    
    a {
        color: white;
        text-decoration: none;
    }
    a:hover {
        text-decoration: none;
        color: #e58d21;
    }
    h1{
        margin: 0;
        padding: 0;
    }
        
    header {
        position: fixed;
        top: 10px;
        left: 10px;
        z-index: 20;
    }
    section {
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        color: #EFEFEF;
    }
    .full-screen {
        display: flex;
        width:300vw;
        max-width:calc(1920px * 3 );
        max-height:100%;
        overflow:hidden;
        height: 100%; /* makes panels the entire window height */
    }
    
    /*   MENU TARJETAS DE CONTENIDO WEB   */
    .MenuPresentacion{
        background:#505051;  
        box-shadow: inset 20px 0px 25px 0px #000000;
        height: 100%;
        position: relative;
        font-weight: normal;
        font-size:14px;
        text-align: justify;
        padding: 52px;
    }
    
    /*   ------------------------------   */
    /*   menu lateral */
    .menuVertical {
        height: 100%;
        width: 3%;
        position: fixed;
        z-index: 1;
        top: 0;
        left: 97%;
        background-color: orange;
        overflow-x: hidden;
        padding-top: 20px;
        
        background-image: linear-gradient(#d17400, #eda50a);
        -webkit-box-shadow: -10px 0px 20px 0px rgba(0,0,0,0.31);
        -moz-box-shadow: -10px 0px 20px 0px rgba(0,0,0,0.31);
        box-shadow: -10px 0px 20px 0px rgba(0,0,0,0.31);    
        
    }
    #scroll{
        position: fixed;
        top: 0%;
        left: 96%;
        z-index: 100;
    }
    
    #menu-servicios, #menu{
        z-index:3;
    }
    
    /*
    .menuVertical:hover {
        cursor: pointer;
        width:3.5%;
        left:96.5%;
    }
    */



/*  IMAGENES TARJETA DE MENU SERVICIOS  */

        .imgSobretdmx{
    	    background-image: url("../img/menu/tdmx01.png");      
            position: relative;
            /* background-repeat: no-repeat; */
            max-width: 100%;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
            height: 100%;
            width: 100%;  
        }
        .imgSobretdmx:hover {
    	    background-image: url("../img/menu/tdmx.png");      
        }        
        
        .imgProductos{
    	    background-image: url("../img/menu/productos01.png");
            position: relative;
            max-width: 100%;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
            height: 100%;
            width: 100%;            
        }   
        .imgProductos:hover{
            background-image: url("../img/menu/productos02.png");
        }
        .imgServicios{
    	    background-image: url("../img/menu/servicios01.png");
            position: relative;
            max-width: 100%;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
            height: 100%;
            width: 100%;            
        }
        .imgServicios:hover{
            background-image: url("../img/menu/servicios02.png");
        }
        .imgClientes{
    	    background-image: url("../img/menu/clientes01.png");
            position: relative;
            max-width: 100%;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
            height: 100%;
            width: 100%;             
        }
        .imgClientes:hover{
            background-image: url("../img/menu/clientes02.png");
        }
        .imgBlog{
    	    background-image: url("../img/menu/blog01.png");
            position: relative;
            /* background-repeat: no-repeat; */
            max-width: 100%;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
            height: 100%;
            width: 100%;          
        }
        .imgBlog:hover{
            background-image: url("../img/menu/blog02.png");
        }
        .imgContacto{
    	    background-image: url("../img/menu/CONTACTO01.png");
            position: relative;
            max-width: 100%;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
            height: 100%;
            width: 100%;              
        }        
        .imgContacto:hover{
            background-image: url("../img/menu/contacto02.png");
        }

/*  CIERRE DE IMAGENES TARJETA DE MENU SERVICIOS  */