*, *::before, after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    height: 100vh;
    /*font-family: OpenSans-Regular;
    background-color: rgb(235,235,235);*/
    font-family: Mon-Regular;
    font-weight: bold;
    background-color: rgb(235,235,235);
}

a {
    text-decoration: none;
}
/*/////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////*/
.xTextBottom1 {
    line-height: 150%;
}

.xLogoBottom {
    width: 280px;
}

.xFleteTextUbicacion {
    font-family: OpenSans-Regular;
    font-weight: bold;
    font-size: 12pt;
}

.xFleteText {
    font-family: OpenSans-Regular;
    font-weight: bold;
    font-size: 15pt;
}
.xFleteTextSub {
    font-family: OpenSans-Regular;
    font-weight: bold;
    font-size: 10pt;
}

.xFleteTextSubUbicacion {
    font-size: 10pt;
    line-height: 150%;
}


.xUbicacion{
    border: 2px solid #3F51B5;
    border-radius: 50%;
    width: 50px;
    margin-bottom:15px;
}

.xFlete {
    border: 2px solid #3F51B5;
    border-radius: 50%;
    width: 130px;
    margin:30px 0 10px 0;
}
.xG1 {
    margin-top:-15px;
    width:102%
}
.xTresColumnas {
    border: 0px solid purple; width: 100%; margin-top:-5px; display:flex;
}
.xmapGM {
    border: 0px solid green;
    width: 250px;
    height: 250px;
    border-radius: 10px;
}
.xvidYT {
    border: 0px solid green;
    width: 250px;
    height: 150px;
    border-radius: 10px;
    margin-bottom:10px;
}
.xFondoPPro {
    background-image: url("../images/banner1-1chico.jpg");
    height: 88px;
    width: 100vw;
    background-size: cover;
    margin:0px;
}



.xbtnFU {
    font-size: 13px;
    width: 300px;
    margin-top:25px;
    margin-bottom:25px;    
}


.xQuiSom2-11 {
    font-family: Oswald-Bold ;
    font-size: 25px;
    text-align: center;
    padding: 0px;
}

.xWList {
    border: 0px solid red;
    width: 100%;
    height:100%;
}
.xLlenatodo {
}
    .xLlenatodo::after {
        content: "";
        display: table;
        clear: both;
    }

.xAncho {
    width: 1366px;
}

.xMenuBarras {
    display: none;
}

.xProsan {
    font-size: 8pt;
    color: blue;
}

.triangle {
    width: 100%;
    height: 0px;
    background-image: linear-gradient(to bottom right, transparent 50%, white 0), linear-gradient(to top right, red 0%, transparent 0);
    background-repeat: no-repeat;
    background-position: left, right;
    margin-top: -0px;
}

.xImgTel {
    width: 50px;
    height: auto;
    margin-right: 30px;
}

.xTelyW {
    z-index: 1100;
    position: fixed;
    margin-top: 70px;
    height: 100px;
    width: 100%;
    text-align: right;
    border: 0px solid red;
}

.xFondoP {
    background-image: url("../images/banner1-1.jpg");
    height: 100vh;
    width: 100vw;
    background-size: cover;
    animation: zoomInOut 18s ease-in-out infinite;
}

/* Keyframes for zooming in and out */
@keyframes zoomInOut {
    0% {
        background-size: 120%;
    }

    50% {
        background-size: 130%;
    }

    100% {
        background-size: 120%;
    }
}



.xFondoPQS {
    background-image: url("../images/QSomos.jpg");
    height: 100vh;
    width: 100vw;
    background-size: cover;
}

.xFondoPQSVid {
    height: 100vh;
    width: 100vw;
    background-size: cover;
}

#moodvideo, #alternative {
    width: 100vw; /* Could also use width: 100%; */
    height: 100vh;
    object-fit: cover;
    /*position: fixed;*/ /* Change position to absolute if you don't want it to take up the whole page */
    left: 0px;
    top: 0px;
    z-index: -100;
}


.xVerFotos {
    font-family: Mon-Regular;
    font-size: 9pt;
    padding: 10px;
}

.xPdf {
    Width: 8%;
}

.xCol1Prod {
    border: 0px solid red;
    margin: 15px;
    display: flex;
}

.xCol1Prod2 {
    border: 0px solid red;
    margin: 15px;
    padding-left:50px;
}

.xProds9 {
    display: flex;
    width: 100%;
    border: 5px solid red;
}

.x2Logos {
    width:400px;
    display: flex;
    margin: auto;
    margin-top: 25px;
}

#xBarraDos {
}

{
}

.xGMaps {
    border-radius: 8px;
    border: 1px solid gray;
    margin: 0px;
    padding: 0px;
}

.xListCla {
    border:0px solid red;
    align-content:center;
    text-align:center;
    font-family: Mon-Regular;
    font-size: 15pt;
    width: 100%;
    margin-bottom:50px;
}

.xProd1 {
    position: relative;
    margin-top: 6.2rem;
}

.xTxtGrid {
    font-family: Mon-Regular;
    font-size: 16px;
}

.xImg0 {
    border-radius: 6px;
    z-index: 2500;
}

.xSha {
    border: 0px solid red;
    box-shadow: 0px 0px 100px white;
}

.xEspaciado {
    line-height: 250%;
}

.xT3 {
    font-family: Oswald-Regular;
    font-size: 50px;
    color: white;
    text-align: left;
    text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.2em black;
}

.xT1 {
    font-family: 'PoiretOne-Regular';
    font-size: 70px;
    /*text-shadow: black 1px 0 20px;*/
    text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.2em black;
    color: white;
    text-align: left;
    line-height: 15 0%;
    font-weight: normal;
}

.xT1-1 {
    font-family: 'PoiretOne-Regular';
    font-size: 45px;
    /*text-shadow: black 1px 0 20px;*/
    text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.2em black;
    color: white;
    text-align: left;
    line-height: 15 0%;
    font-weight: normal;
}

.xT2 {
    font-family: Oswald-Regular;
    font-size: 25px;
    color: white;
    text-align: left;
    line-height: 140%;
    text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.2em black;
}

header {
    width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
    border: 0px solid red;
}

video {
    width: 100%;
}

.absolute {
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    position: absolute;
    /*text-align:left;*/
    display: flex;
    /*justify-content:left;
    align-items:center;*/
    padding-left: 5%;
    padding-top: 12%;
}

h1 {
    font-size: 80px;
    font-weight: 900;
    z-index: 100;
    color: white;
    margin-bottom: 30px;
}

    h1::after {
        display: block;
        width: 30%;
        height: 10px;
        content: "";
        margin: auto;
        background: white;
    }

.overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    background: rgba(0,0,0,0.3);
}

.overlayNavBar {
    width: 100%;
    height: 100%;
    position: absolute;
    background: rgba(0,0,0,0);
    z-index: 100;
}

.nav {
    border-bottom: 0px solid red;
    position: fixed;
    width: 100%;
    box-shadow: 0px 0px 30px white;
    z-index: 101;
    background: rgba(0,0,0,.2);
    padding: 20px;
    /**/
}

.xNavProd {
    border-bottom: 0px solid red;
    position: fixed;
    width: 100vw;
    box-shadow: 0px 0px 30px white;
    z-index: 101;
    background: rgba(0,0,0,.7);
    /**/
}

.nav a {
    color: white;
}



/**********************************/
.nav_list {
    text-shadow: 2px 2px 1px black;
    z-index: 101;
    color: white;
    /*-----*/
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 2rem;
    margin: 0 2rem;
    border: 0px solid red;
    width: 90%;
    /**/
    font-family: Mon-Regular;
    font-size: 13px;
    font-weight: bold;
    list-style: none;
    position: relative;
    padding: 0rem 1rem;
    cursor: pointer;
}

    .nav_list a:hover {
        text-decoration: none;
    }

        .nav_list a:hover::before {
            width: 3rem;
            margin-left: .15rem;
        }

    .nav_list a::before {
        content: "";
        width: 0;
        height: 3px;
        background-color: green;
        position: absolute;
        border: 0px solid red;
        bottom: 0.5rem;
        transition: .25s;
    }

.nav_listlogo {
    list-style: none;
    margin-right: auto;
    cursor: pointer;
}

.xImgLogo {
    width: 80px;
    height: auto;
    cursor: pointer;
}

.xArrow {
    width: 50px;
    padding-top: 0%;
}
/*/////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////*/
.xFondo1 {
    background-color: black;
}

.xTextoDetalle {
    font-family: Mon-Regular;
    color: white;
    font-size: 15pt;
    line-height: 45px;
}

.xTextoDetalle1 {
    font-family: Mon-Regular;
    color: white;
    font-size: 13pt;
    line-height: 30px;
}

.xTextoDetalle1Nombre {
    font-family: Mon-Regular;
    color: white;
    font-size: 17pt;
    line-height: 30px;
}

.xImagen {
    width: 40%;
    border: 0px solid white;
    border-radius: 15px;
    margin-top: 20px;
    overflow: hidden;
}

.xImagen2 {
    width: 100%;
    border: 0px solid white;
    border-radius: 15px;
    margin-top: 20px;
    overflow: hidden;
}



.xComComR {
    color: brown;
}

.xLogoSB {
    width: 30%;
}

.xFooter {
    height: auto;
    background-color: lightgray;
    padding: 60px 30px;
    font-family: Mon-Regular;
    font-size: 12px;
    line-height: 5px;
    font-weight: normal;
    color: black;
}

.xFooter1 {
    color: black;
    font-weight: normal;
    padding-top: 20px;
    font-size: 13pt;
    line-height: 7px;
}

.xLogoCE {
    width: 200px;
    border: 0px solid blue;
}

.xPrincipal {
    /*background-color:rgb(253,227,102) ; original */
    /*background-color: rgb(251,238,193); ok1 */
    background-color: gainsboro;
    width: 100%;
    height: auto;
    padding-top: 10px;
    border: 0px solid red;
}

.xLineaNav1 {
    border: 0px solid red;
    padding: 10px 0 0px 0;
    width: 85%;
    display: flex;
}

.xBuscar {
    width: 300px;
    border-radius: 3px 0px 0px 3px;
    margin-left: 5rem;
}

.xImagenNav {
    width: 500px;
    padding-left: 0px;
}

.xSearchAlto {
    height: 35px;
    width: auto;
}

.xnavColor {
    border: 0px solid green;
}
/*********************************************************************************/
.xNav {
    font-size: 13px;
    margin-left: 85px;
    margin-top: -15px;
    background-color: rgb(255,239,91);
    height: auto;
    border: 0px solid red;
    padding: 0;
}





















/*********************************************************************************/
/*********************************************************************************/
/*********************************************************************************/
/*********************************************************************************/
@font-face {
    font-family: OpenSans-Regular;
    src: url(../fonts/Open_Sans/OpenSans-Regular.ttf);
}

@font-face {
    font-family: Oswald-Regular;
    src: url(../fonts/Oswald/Oswald-Regular.ttf);
}

@font-face {
    font-family: Oswald-Bold;
    src: url(../fonts/Oswald/Oswald-Bold.ttf);
}

@font-face {
    font-family: Mon-Regular;
    src: url(../fonts/Mon/Montserrat-Regular.ttf);
}

@font-face {
    font-family: PoiretOne-Regular;
    src: url(../fonts/Poiret_One/PoiretOne-Regular.ttf);
}










#xd1 {
    padding-left: 15px;
}

#xd2 {
    margin-top: 0px;
    position: absolute;
    border-radius: 3px;
    border: 0px solid green;
    /*visibility: hidden;*/
    display: none;
}

#xd1:hover #xd2 {
    display: block;
    /*visibility: visible;*/
}

ul li ul.dropdown {
    /**/
    min-width: 100%; /* Set width of the dropdown */
    background: #f2f2f2;
    display: none;
    position: absolute;
    z-index: 999;
    left: 0;
}

ul li:hover ul.dropdown {
    top: 25px;
    width: 250px;
    font-size: 12px;
    position: absolute;
    padding: 0 0 0 0px;
    margin: 0;
    background-color: rgb(47, 47, 47);
    opacity: 1;
    border-radius: 3px;
    background-color: black;
    padding: 10px 0px;
    /**/
    display: block; /* Display the dropdown */
}

ul li ul.dropdown li {
    display: block;
}

/********MENU PRINCIPAL 1*******************************/

.xul {
    width: 100%;
    border: 0px solid red;
    margin-top: 0px;
    /*margin-left: 55px;*/
    list-style: none;
    /*background: #f2f2f2;*/
}

    .xul .xli {
        display: inline-block;
        position: relative;
        line-height: 13px;
        text-align: left;
    }

        .xul .xli .xa {
            font-size: 13px;
            display: block;
            padding: 8px 5px;
            color: black;
            text-decoration: none;
        }

            .xul .xli .xa:hover {
                color: cornflowerblue;
                /*background: #939393;*/
            }

        .xul .xli .xul.dropdown {
            min-width: 100%; /* Set width of the dropdown */
            background: #f2f2f2;
            display: none;
            position: absolute;
            z-index: 999;
            left: 0;
        }

        .xul .xli:hover .xul.dropdown {
            display: block; /* Display the dropdown */
        }

        .xul .xli .xul.dropdown .xli {
            display: block;
        }
/********FIN MENU PRINCIPAL 1*******************************/



/********SLIDE*******************************/
.xFleTam {
    border: 0px solid red;
    margin-top: -30px;
    font-size: 40px;
}

.xTexto5 {
    text-shadow: 0 0 3px BLACK;
    font-family: Oswald-Regular;
    color: white;
    font-size: 30px;
    font-weight: bold;
    line-height: 40px;
    opacity: 1;
    margin-top: 10px;
    margin-left: 0px;
    max-width: 1000px;
}

.xTextoQS {
    text-shadow: 0 0 3px BLACK;
    font-family: Oswald-Regular;
    color: white;
    font-size: 45px;
    font-weight: bold;
    line-height: 60px;
    opacity: 1;
    margin-left: 200px;
    max-width: 800px;
    line-height: 25px;
    padding-top: 130px;
}

.xTextoQS1 {
    text-shadow: 0 0 3px BLACK;
    font-family: Oswald-Regular;
    color: white;
    font-size: 30px;
    font-weight: bold;
    line-height: 60px;
    opacity: 1;
    margin-left: 200px;
    max-width: 700px;
    line-height: 35px;
}

.xTextoQS2 {
    text-shadow: 0 0 3px BLACK;
    font-family: Oswald-Regular;
    color: white;
    font-size: 50px;
    font-weight: bold;
    line-height: 60px;
    opacity: 1;
    margin-left: 200px;
    max-width: 700px;
    line-height: 35px;
}

.xTexto3 {
    text-shadow: 0 0 3px BLACK;
    font-family: Oswald-Regular;
    color: white;
    font-size: 45px;
    font-weight: bold;
    line-height: 60px;
    opacity: 1;
    margin-left: 200px;
    max-width: 900px;
}

.xTexto4 {
    text-shadow: 0 0 3px BLACK;
    font-family: Oswald-Regular;
    color: blue;
    font-size: 60px;
    font-weight: bold;
    line-height: 60px;
    opacity: 1;
    margin-left: 0px;
    max-width: 0px;
}

.xTable123 {
    width: 90%;
    font-family: Mon-Regular;
    font-size: 15px;
    align-content: center;
    text-align: center;
    z-index:10000;
}

.xTexto {
    text-shadow: 2px 3px 10px BLACK;
    font-family: Oswald-Regular;
    color: white;
    font-size: 55px;
    font-weight: bold;
    line-height: 60px;
    opacity: 1;
    margin-left: 200px;
    max-width: 600px;
}

.xTexto1 {
    text-shadow: 0 0 3px BLACK;
    font-family: Oswald-Regular;
    color: white;
    font-size: 55px;
    font-weight: bold;
    line-height: 60px;
    opacity: 1;
    margin-left: 200px;
    max-width: 1000px;
}

.xTexto2 {
    text-shadow: 0 0 3px BLACK;
    font-family: Oswald-Regular;
    color: white;
    font-size: 30px;
    font-weight: bold;
    line-height: 60px;
    opacity: 1;
    margin-left: 0px;
    max-width: 1000px;
}

.xNexPre {
    background-size: 30px;
    height: 50px;
    width: 30px;
}

.xMarcas {
    max-width: 85%;
    padding-bottom: 30px;
}

.xQuiSom {
    font-size: 15px;
    max-width: 80%;
}

.xQuiSom1 {
    font-family: Oswald-Bold;
    font-size: 40px;
    text-align: center;
}

.xQuiSom11 {
    font-family: Oswald-Bold;
    font-size: 25px;
    text-align: center;
}

.xQuiSom2 {
    font-family: Mon-Regular;
    font-size: 16px;
    text-align: center;
    padding: 30px;
}

.xQuiSom3 {
    font-family: Oswald-Bold;
    font-size: 20px;
    text-align: center;
}

.xComCom {
    font-size: 14px;
    text-indent: 3em;
}


/*.txtJustificado {
    text-align: justify;
    text-justify: inter-word;
}
*/
.txtMarcas {
    font-family: Oswald-Regular;
    font-size: 20px;
}

.xSurtimos {
    margin-top: 20px;
    font-family: Arial;
    font-size: 18px;
    text-align: center;
    font-weight: normal;
    align-content: center;
    vertical-align: central;
}

.xAlgDeNue {
    height: auto;
    border-radius: 6px 6px 6px 6px;
    max-width: 80%;
}

.xClases {
    display: flex;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

.xTarjeta {
/*    display: flow;
*/    transition: box-shadow .7s;
    width: 210px;
    margin: auto;
    margin-bottom: 35px;
    height: auto;
    min-height: 350px;
    max-height: 480px;
    padding: 0px;
    border: 0px solid lightgray;
    border-radius: 8px;
}

    .xTarjeta:hover {
        box-shadow: 0 0 50px rgba(33,33,33,.9);
    }

.xDesOfer {
    color: blue;
}

.xSubTit {
    font-family: Mon-Regular;
    font-size: 12px;
    color: black;
    text-align: center;
    margin-bottom: 10px;
    border: 0px solid red;
    margin: 0px 5px 0px 5px;
}

.card {
    padding: 0px;
}

.xPasos {
    border-radius: 50%;
    padding: 0;
    background-color: limegreen;
    width: 30px;
    height: 30px;
}

.xCto {
    width: 50%;
    margin-left: 5px;
    padding-left: 4px;
}

.xProdMarco {
    background-position: center center;
    width: 100%;
    border-top: 0px solid gray;
    background-repeat: no-repeat;
    left: 0px;
    position: relative;
    top: 0px;
    font-family: tahoma;
    border: 5px solid red;
}
/*********************************************************/
.xProdTitulo {
    height: 5px;
    line-height: 40px;
    font-weight: bold;
    font-size: 15pt;
    color: gray;
    text-align: left;
    width: 100%;
    padding-left: 20px;
}

.xProdClases {
    color: white;
    font-size: 15pt;
    font-family: Mon-Regular;
    font-weight: bold;
    border: 0px solid red;
}

.xProdClases1 {
    color: white;
    font-size: 10pt;
    font-weight: bold;
}

.xProdTable {
    width: 100%;
    border: 0px solid pink;
    display: flex;
}

/*********************************************************/
.xProdTable01 {
    width: 20%;
    border: 5px solid black;
    vertical-align: top;
}

.xProdTable02 {
    width: 100%;
    vertical-align: top;
    height: 80px;
    border: 0px solid green;
}

.xProdTable1 {
    width: 20%;
    height: 100%;
    border: none;
    border: 0px solid green;
}

.xProdTitTable1 {
    width: auto;
    text-align: center;
    background-color: #336699;
    height: 90px;
    border: 0px solid red;
}
/*********************************************************/
.xProdTable02 {
    width: 80%;
    vertical-align: top;
    height: 80px;
    border: 5px solid red;
    display: flex;
}

.xProdTable2 {
    width: 100%;
    height: 100%;
    border: none;
    border: 0px solid red;
}

.xProdTitTable2 {
    /*display: flex;*/
    width: 100%;
    /*background-color: #572A62;*/
    background-color: #4E6785;
    font-family: Mon-Regular;
    font-size: 15px;
    /***/
    height: 95px;
}
/*********************************************************/
.xClasesText {
    font-size: 9pt;
    border:0px solid red;
}

.xMenuIz {
    border-bottom: 1px solid lightslategray;
    width: 100%;
    margin-top: 0px;
}

.xTitTotalYOrden {
    text-align: center;
/*    border-top: 1px solid #999999;
    border-bottom: 1px solid #999999;
*/    font-family: Mon-Regular;
    font-size: 9pt;
}

.xImageClass {
    width: 85px;
    height: auto;
    border: 0px solid #336699;
    border-radius: 6px;
    overflow: hidden;
}

.xImagenProductos {
    height: auto;
    width: 250px;
    border-radius: 10px;
    border:1px solid lightgray;
    margin-top:20px;
}

.xTablaProductos {
    border: 0px solid green;
    background-color: white;
    border-radius: 10px;
    margin-bottom: 10px;
    display:flex;
}

    .xTablaProductos:hover {
        box-shadow: 0 0 15px rgba(33,33,33,.3);
    }


.xTablaProductos1 {
    border: 0px solid green;
    margin-left: 0px;
    margin-top: 20px;
    margin-bottom: 15px;
    width: 100%;
    background-color: white;
    border-radius: 7px 0px 0px 7px;
    height: auto;
}

    .xTablaProductos1:hover {
        /*box-shadow: 0 0 15px rgba(33,33,33,.3);*/
    }

.xTablaProductos2 {
    border: 0px solid green;
    margin-left: 0px;
    margin-top: 20px;
    margin-bottom: 15px;
    width: 80%;
    background-color: white;
    border-radius: 7px 0px 0px 7px;
    height: auto;
}

    .xTablaProductos2:hover {
        /*box-shadow: 0 0 15px rgba(33,33,33,.3);*/
    }


.xGridProd {
    border: 1px solid red;
    width: 95%;
    margin: auto;
    position: relative;
    height: 100%;
}

.xDescripcionProductos {
    color: black;
    font-weight: bold;
    font-family: Mon-Regular;
    font-size: 11pt;
}
.xDescripcionProductosPrecio {
    color: forestgreen;
    font-weight: bold;
    font-family: Mon-Regular;
    font-size: 15pt;
}

.xDescripcionProductosNombre {
    color: black;
    font-weight: bold;
    font-family: Mon-Regular;
    font-size: 14pt;
}

.xEtiquetaProducto {
    color: black;
    font-size: 10pt;
    font-weight: normal;
    font-family: Mon-Regular;
}

.xRowProducto {
    width: 350px;
    vertical-align: central;
    padding-top: 25px;
    padding-left: 50px;
    padding-right: 50px;
    padding-bottom: 20px;
    border: 1px solid pink;
}

.xDivClases {
    border-bottom: 2px solid lightslategray;
    width: 90%;
    text-align: left;
}

.nav_list2 {
    text-decoration: none;
    color: black;
    line-height: 250%;
    padding: 0px 0px 0px 0px;
    font-family: Mon-Regular;
    font-size: 13px;
    font-weight: bold;
    list-style: none;
    cursor: pointer;
}

    .nav_list2 a:hover {
        text-decoration: none;
    }

/********FIN*******************************/




/**********RESPONSIVE**************************************/
@media screen and (min-width: 768px) and (max-width: 1023px) {
    /*css*/
    .xArrow {
        width: 50px;
        padding-top: 0px;
        margin-top: -200px;
    }

    .xFondoP {
        background-image: url("../images/banner1-1.jpg");
        height: 100vh;
        width: 112vw;
        background-size: cover;
        animation: zoomInOut2222 6s ease-in-out infinite;
    }

    /* Keyframes for zooming in and out */
    @keyframes zoomInOut2222 {
        0% {
            background-size: 120%;
        }

        50% {
            background-size: 130%;
        }

        100% {
            background-size: 120%;
        }
    }



    .xT2 {
        font-family: Oswald-Regular;
        font-size: 30px;
        color: white;
        text-align: left;
        line-height: 140%;
        text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.2em black;
    }

    .xT1 {
        font-family: 'PoiretOne-Regular';
        font-size: 40px;
        text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.2em black;
        color: white;
        text-align: left;
        line-height: 100%;
        font-weight: normal;
    }

    .xT1-1 {
        font-family: 'PoiretOne-Regular';
        font-size: 30px;
        text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.2em black;
        color: white;
        text-align: left;
        line-height: 100%;
        font-weight: normal;
    }

    .xTelyW {
        z-index: 1100;
        position: fixed;
        margin-top: 55px;
        height: 100px;
        width: auto;
        text-align: right;
        border: 0px solid red;
    }

    .nav_list {
        /*background-color: red;*/
    }

    .xImgLogo {
        border: 0px solid green;
        width: 80px;
        height: auto;
        cursor: pointer;
    }

    .xBuscar {
        width: 200px;
        border-radius: 3px 0px 0px 3px;
        margin-left: 1rem;
    }
    /********************/
    .nav_list {
        text-shadow: 2px 2px 1px black;
        z-index: 101;
        color: white;
        /*-----*/
        display: flex;
        justify-content: flex-end;
        align-items: center;
        gap: 2rem;
        margin: 0 2rem;
        border: 0px solid red;
        width: 100%;
        /**/
        font-family: Mon-Regular;
        font-size: 10px;
        font-weight: bold;
        list-style: none;
        position: relative;
        padding: 0rem 1rem;
        cursor: pointer;
    }

        .nav_list a:hover {
            text-decoration: none;
        }

            .nav_list a:hover::before {
                width: 3rem;
                margin-left: .15rem;
            }

        .nav_list a::before {
            content: "";
            width: 0;
            height: 3px;
            background-color: green;
            position: absolute;
            border: 0px solid red;
            bottom: 4px;
            transition: .25s;
        }

    .nav_listlogo {
        list-style: none;
        margin-right: auto;
        cursor: pointer;
    }
}

/****MOBILE*************************/
@media screen and (max-width: 767px) {
    .xTitTotalYOrden {
        text-align: center;
        border-bottom-style: solid;
        border-bottom-width: 1px;
        border-bottom-color: #999999;
        border-top-style: solid;
        border-top-width: 1px;
        border-top-color: #999999;
        font-family: Mon-Regular;
    }

    .xTresColumnas {
        border: 0px solid red;
        width: 100%;
        margin-top: 0px;
        display:flex;
    }


    .xCol1Prod2 {
        border: 1px solid red;
        margin: 15px;
        padding-left: 10px;
        width:100%;
    }

    .xmapGM {
        border: 0px solid green;
        width: 200px;
        height: 350px;
        border-radius: 10px;
    }

    .xvidYT {
        border: 0px solid green;
        width: 200px;
        height: 200px;
        border-radius: 10px;
    }

    .xImagenProductos {
        height: auto;
        width: 200px;
        border-radius: 10px;
        border: 1px solid lightgray;
        margin-top: 10px;
    }

    .xTextoDetalle1 {
        font-family: Mon-Regular;
        color: white;
        font-size: 10pt;
        line-height: 30px;
    }
    .xTextoDetalle1Nombre {
        font-family: Mon-Regular;
        color: white;
        font-size: 14pt;
        line-height: 30px;
    }
    .xTextoDetalle {
        font-family: Mon-Regular;
        color: white;
        font-size: 20pt;
        line-height: 45px;
    }

    /*123*/
    .xText1{
        display:none;
    }



    .xDivClases {
        border-bottom: 2px solid lightslategray;
        width: 95%;
        text-align: left;
        margin-bottom: 15px;
    }
    .xClasesText {
        font-size: 8pt;
        margin-bottom:10px;
        border:0px solid red;
    }

    .xMenuIz {
        border-bottom: 1px solid lightslategray;
        width: 100%;
        margin-top: 10px;
    }



    .xFondoPPro {
        background-image: url("../images/banner1-1mobile.jpg");
        height: 85px;
        width: 100vw;
        background-size: cover;
    }

    
    .xQuiSom2-11 {
        font-family: Mon-Regular;
        font-size: 12px;
        text-align: center;
        padding: 0px;
    }

    .xWList {
        border: 0px solid red;
        width: 100%;
    }

    .nav_listitem2 {
        line-height: 350%;
        padding: 0px 20px 0px 20px;
    }

    .nav_list2 {
        text-decoration: none;
        color: black;
        line-height: 50%;
        padding: 0px 0px 0px 0px;
        font-family: Mon-Regular;
        font-size: 13px;
        font-weight: bold;
        list-style: none;
        cursor: pointer;
    }

        .nav_list2 a:hover {
            text-decoration: none;
        }

    .xMenuBarras {
        display: block;
    }


    .xSurtimos {
        margin-top: 10px;
        font-family: Arial;
        font-size: 15px;
        text-align: center;
        font-weight: normal;
        align-content: center;
        vertical-align: central;
    }

    .xFondoP {
        background-image: url("../images/banner1-1mobile.jpg");
        height: 100vh;
        width: 110vw;
        background-size: cover;
    }


    .xImgTel {
        width: 50px;
        height: auto;
        margin-right: 30px;
        margin-top: -10px;
    }

    .nav_listitem {
        display: none;
    }

    .nav_listlogo {
        border: 0px solid red;
    }

    .xImgLogo {
        width: 80px;
        height: auto;
        cursor: pointer;
        border: 0px solid green;
        margin-left: -30px;
    }

    .xBuscar {
        width: 150px;
        border-radius: 3px 0px 0px 3px;
        margin-left: 1rem;
    }

    .form-control {
        font-size: 12px;
        height: 25px;
    }

    .input-group-text {
        font-size: 15px;
        height: 25px;
    }

    /****/
    .xCel {
        margin-top: 450px;
    }

    .xT1 {
        font-family: PoiretOne-Regular;
        font-size: 40px;
        text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.2em black;
        color: white;
        text-align: left;
        line-height: 90%;
    }
    .xT1-1 {
        font-family: PoiretOne-Regular;
        font-size: 30px;
        text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.2em black;
        color: white;
        text-align: left;
        line-height: 90%;
    }


    .xT2 {
        font-family: Oswald-Regular;
        font-size: 18px;
        color: white;
        text-align: left;
        line-height: 5px;
        margin-top: 20px;
        text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.2em black;
    }

    .xT3 {
        font-family: Oswald-Regular;
        font-size: 30px;
        color: white;
        text-align: left;
        text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.2em black;
    }

    .xHR {
        margin: 5px 5px 20px 0px;
    }

    .xEspaciado {
        margin-top: 40px;
    }

    .xTextoQS {
        text-shadow: 0 0 3px BLACK;
        font-family: Oswald-Regular;
        color: white;
        font-size: 18px;
        font-weight: bold;
        line-height: 10px;
        opacity: 1;
        margin-left: 60px;
        max-width: 800px;
        line-height: 25px;
        padding-top: 60px;
    }


    .x2Logos {
        display: flex;
        margin: auto;
        margin-top: 25px;
        width: 90%;
    }

    .xQuiSom {
        font-size: 15px;
        max-width: 80%;
        padding: 15px 15px;
    }

    .xQuiSom1 {
        font-family: Oswald-Bold;
        font-size: 20px;
        text-align: center;
        padding-bottom: 20px;
    }

    .xQuiSom2 {
        font-family: Mon-Regular;
        font-size: 16px;
        text-align: center;
        padding: 5px;
    }

/*    .xFooter {
        height: auto;
        background-color: lightgray;
        padding: 60px 30px;
        font-family: Mon-Regular;
        font-size: 12px;
        line-height: 15px;
        font-weight: normal;
        color: black;
    }
*/
    .xTexto {
        margin-top: 5px;
        text-shadow: 2px 3px 10px BLACK;
        font-family: Oswald-Regular;
        color: white;
        font-size: 13px;
        font-weight: bold;
        line-height: 15px;
        opacity: 1;
        margin-left: 50px;
        max-width: 500px;
    }

    .xTexto3 {
        text-shadow: 0 0 3px BLACK;
        font-family: Oswald-Regular;
        color: white;
        font-size: 13px;
        font-weight: bold;
        line-height: 15px;
        opacity: 1;
        margin-left: 50px;
        max-width: 500px;
    }

    .xQuiSom2-1 {
        font-family: Mon-Regular;
        font-size: 15px;
        text-align: center;
        padding: 0px;
    }

    .xTable123 {
        width: 90%;
        font-family: Mon-Regular;
        font-size: 13px;
    }

    .xbtnFU {
        font-size: 13px;
        margin-top: 25px;
        margin-bottom: 25px;
        width:200px;
    }

    .xCto {
        width: 100%;
        margin-left: 5px;
        padding-left: 4px;
        height:30px;
    }   
    /***Responsive productos**/
    .xProds9 {
        display: block;
        width: 100%;
        border: 0px solid red;
    }

    .xTablaProductos {
        border: 0px solid green;
        background-color: white;
        border-radius: 10px;
        margin-bottom: 10px;
        display: flex;

        margin-left: -15px;
        margin-top: 0px;
        margin-bottom: 10px;
        width: 125%;
        background-color: white;
        border-radius: 6px;
        height: auto;
        display: flex;
    }

    /*cabecera 3 columnas*/
    .xProdClases {
        color: white;
        font-size: 8pt;
        font-family: Mon-Regular;
        font-weight: bold;
        text-align: center;
    }

    .xListCla {
        border: 0px solid red;
        align-content: center;
        text-align: center;
        font-family: Mon-Regular;
        font-size: 9pt;
        width: 100%;
        margin-bottom: 50px;
    }

    .xTotal {
        font-family: Mon-Regular;
        font-size: 8pt;
        padding: 0px;
    }

    .xProdClases1 {
        color: white;
        font-size: 8pt;
        font-weight: bold;
    }

    /**descripciones productos*/
    .xDescripcionProductos {
        color: black;
        font-weight: bold;
        font-family: Mon-Regular;
        font-size: 11pt;
    }

    .xDescripcionProductosPrecio {
        color: forestgreen;
        font-weight: bold;
        font-family: Mon-Regular;
        font-size: 12pt;
    }


    .xTablaProductos1 {
        border: 0px solid green;
        margin-left: 0px;
        margin-top: 20px;
        margin-bottom: 15px;
        width: 100%;
        background-color: white;
        border-radius: 7px 0px 0px 7px;
        height: auto;
        padding-top: 20px;
    }

    .xTablaProductos2 {
        border: 0px solid green;
        margin-left: 10px;
        margin-top: 20px;
        margin-bottom: 15px;
        width: 80%;
        background-color: white;
        border-radius: 7px 0px 0px 7px;
        height: auto;
    }

    .xPdf {
        Width: 15%;
    }

    .xGridProd {
        /*display: flex;*/
        border: 0px solid red;
        width: 95%;
        vertical-align: top;
        clear: both;
    }


    /*********************/
    .xImagen2 {
        width: 100%;
        border: 0px solid white;
        border-radius: 15px;
        margin-top: 20px;
        overflow: hidden;
    }
}

.xTest {
    width: 100%;
    border: 0px solid red;
    display: flex;
    align-items: center;
    justify-content: center;
}