.alto_svg{
    display:none;
}
.ancho_svg{
    display:none;
}
canvas{
    touch-action:auto;
}
#medidas_neon{
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
}
#changesub{
    transition: background-color 0.5s ease;
}
#altoneon, #anchoneon{
    background: #161616;
    color:white;
    padding: 1%;
    border: none;

}



.icono-letra, .icono-letra-luz{
    font-size: 24px; /* Tamaño de la 'A' */
    font-family: Arial, sans-serif; /* Fuente de la 'A' */
    position: absolute;
    display: inline-block;
    color: white; /* Color de la letra 'A', por defecto negro */
    width: 100%;
    top: 0;
    left: 0;
    bottom: 0;

}

/* Crear la rayita debajo usando ::after */
.icono-letra-luz::after{
    content: '';
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: -1px; /* Ajusta la distancia de la rayita respecto a la letra */
    height: 4px; /* Grosor de la rayita */

   /* background-color: currentColor; *//* La rayita toma el color actual del texto */
   background-color: var(--rayita-color, white);
}

.icono-letra::after{
    content: '';
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: -1px; /* Ajusta la distancia de la rayita respecto a la letra */
    height: 4px; /* Grosor de la rayita */
 
   /* background-color: currentColor; *//* La rayita toma el color actual del texto */
   background-color: var(--rayita-color-solido, white);
}

#close-popup-btn {
    background: none;
    border: none;
    font-size: 20px;
    font-weight: bold;
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
    border-radius: 20px;
    color: white;
    background-color: #d41676;
}

.colorescorporeas{
    width: auto;
    padding: 2%;
    border-radius: 10px;
    color: white;
    float: left;
    background-color: #F7EA48;
    min-width: 110px;
    text-align: center;
    margin: 5px;
}
.viniloscorporeas{
    width: 100%;
    float: left;
    color: #726d6d;
  
    font-size: 15px;
}

#altoneon:focus,
#altoneon:active {
    outline: none; /* Elimina el borde de enfoque predeterminado */
    background-color: #000; /* Mantén el fondo negro */
    color: #fff; /* Mantén el texto blanco */
    border: 1px solid #fff; /* Mantén el borde blanco */
}

#anchoneon:focus,
#anchoneon:active {
    outline: none; /* Elimina el borde de enfoque predeterminado */
    background-color: #000; /* Mantén el fondo negro */
    color: #fff; /* Mantén el texto blanco */
    border: 1px solid #fff; /* Mantén el borde blanco */
}

.selectBox {
    border: 1px solid #55aaff;
    background-color: rgba(75, 160, 255, 0.3);
    position: fixed;
}
#canvacontainer {
    cursor: crosshair;
}

.botonera img{
    border-radius: 10px;
    margin-bottom:10px;
}
.coloresMove{
    display: none;
}

.paletaColor{
    width: 80%;
    float: left;
    display: inline-flex;
}

.canvaContainer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background:#000000bd; /* Fondo semitransparente */
    justify-content: center;
    align-items: center;
    z-index: 1;
    opacity: 0; /* Inicialmente completamente transparente */
    transition: opacity 0.5s, transform 0.5s; /* Agrega una transición suave a la opacidad y la transformación */
    pointer-events: none; /* Desactiva la interacción con el "pop-up" oculto */
    display: flex;
    transform: scale(0.8); /* Inicialmente reducido de tamaño */
    overflow:hidden;



}

.coloreLetrasCorporeas{
    width: 100%;
    float: left;
    border: 1px solid whitesmoke;
    border-radius: 20px;
    margin-bottom: 20px;
    background-color: #f8f8f8;
}

.canvaContainer.active {
    opacity: 1;
    transform: scale(1);
    pointer-events: auto;
}


.closeCanvaContainer{
    position: absolute;
    top: 1%;
    /* right:20%;*/
}


/* Estilos del botón de cierre con la clase .closeCanvasContainer */
.closeCanvaContainer.close-button {
    background: #e73b81;
    border: none;
    cursor: pointer;
    padding: 6px;
    font-size: 15px;
    position: absolute;
    top: 7%;
    /*  right: 22%;*/
    border-radius: 8px;
    color: white;
}
.contenedor-cerrar #closeButton:hover{
    color: black;
}

/* Estilos del icono de la cruz (blanco por defecto) */
.closeCanvaContainer .icon {
    color: white;
}

/* Estilos del texto "Cerrar" (oculto por defecto) */
.closeCanvaContainer .text {

    color: white;
    font-size: 15px;
    margin-left: 5px;
}

/* Cambia el color del icono y muestra el texto al pasar el cursor sobre el botón */
.closeCanvaContainer:hover .icon {
    color: black; /* Cambia el color de la cruz cuando se coloca el cursor sobre el botón */
}

.closeCanvaContainer:hover .text {
    color: black; /* Cambia el color de la cruz cuando se coloca el cursor sobre el botón */
}


.canvaContainerIzda{
    position: relative;
    width: 70%;
    background: #1b1b1b;
    height: 80vh;
    margin-top: 10%;
    margin-bottom: 10%;
    margin-left: 2%;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    max-height: 700px;
}

.canvaContainerDcha{
    position: relative;
    width: 200px;
    background: #2d2d2dc9;
    height: 80vh;
    /* margin-top: 10%;
     margin-bottom: 10%;
     margin-left: 2%;*/


    /* padding-top: 1%;*/
    box-shadow:2px 2px 4px rgba(0, 0, 0, 0.5);
    max-height: 700px;
}

#topDcha{
    position: relative;
    /*overflow: hidden;*/

    width: 100%;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
    padding: 1%;
    background: #252222;
    height: auto;
    /*padding-bottom:12%;*/
}

#medidas{
    width: 100%;
    float: left;
}

#bodyDcha{
    /*overflow-y: scroll;
    overflow-x: hidden;*/
    position: relative;
    height: 40%;
    float: left;
    width: 100%;

    background: #323232;


}

#bottomDcha{
    background: #1e1d1d;
    padding: 5%;
    display: block;
    float: left;
    width: 100%;
    bottom: 0;
    position: absolute;
    height: 10%;
    overflow: hidden;
}

li.optionsSvg.attribute_radiosvg{

    color: #fff; /* Texto blanco */
    padding: 10px 20px; /* Espaciado interno */
    border: none; /* Sin borde */
    border-radius: 5px; /* Esquinas redondeadas */
    cursor: pointer; /* Cambiar el cursor al pasar el mouse */
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); /* Sombreado */
    transition: background-color 0.3s, box-shadow 0.3s; /* Transi */
    border:none !important;
    margin-right: 5px;
    width: 75px !important;
    height: 115px;
}

#canvaheight{
    height: auto !important;
    width:100% !important;
}


label.attribute_label {
    color: rgb(172 172 172);
    font-weight: 100;
    /*   width: 100%;
      text-align: center;*/

}

button.exclusive2.svgPriceBut.cartblack{
    background: #db1d7d;
}

#zoomButton{
    background: #db1d7d;
    border: none;
    width: 50%;
    padding: 1%;
    border-radius: 5px;
    color: white;
    margin-left: 10px;
}


/* Ocultar los input radio */
.tipoSvg {
    display: none;
}

/* Estilos para las pestañas */


/****************/

.tab-label {
    display: inline-block;
    padding: 10px 20px;
    background-color: #696969;
    border: 1px solid #ccc;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.tab-label:hover {
    background-color: #e0e0e0;
}

/* Estilos para las pestañas activas */
.tab-label.active {
    background-color:#242222;
    color: #fff;
    border-bottom: 0;
}

/* Estilos para el contenido de las pestañas */
.tab-content {
    display: none;
    padding: 20px;
    border: 1px solid #ccc;
    border-top: none;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    background-color: #f9f9f9;
}

/* Mostrar el contenido de la pestaña activa */
.tab-label.active + .tab-content {
    display: block;
}
.canvapop{
    padding-left: 0 !important;
}
div.uploader{
    margin-top:2px !important;
}

#lucchetto{
    display: block;

    z-index: 9999999;
    right: 2px !important;
}

#coloresneon{
    height: 5vh;
}

.tab-label.active.fondolabelactive{
    background-color:rgb(38 38 38);
    color: white;
}
.tab-label.fondolabel{
    background-color:#acabab;
    color:#333;
}

#leftProduct.contenedorcrea{
    height: 210px ;
}
.mvadapt{
    height: 340px ;
    overflow: hidden;
    border-radius: 0;
}
.col-md-4.minh.font-select > span{
    border-radius: 0px;
}

#svgPrice2.priceneon {
    top: 220px;
}
.form-group.col-lg-6.neoncart{
    top: 265px;

}
.inputNeon.form-group{
    border-radius: 0px;
}
.font-select > span{
    /* border-radius: 0 !important;*/
    height: 31px !important;
}


.canvaContainer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background:rgb(0 0 0 / 72%); /* Fondo semitransparente */
    justify-content: center;
    align-items: center;
    z-index: 1;
    opacity: 0; /* Inicialmente completamente transparente */
    transition: opacity 0.5s, transform 0.5s; /* Agrega una transición suave a la opacidad y la transformación */
    pointer-events: none; /* Desactiva la interacción con el "pop-up" oculto */
    display: flex;
    transform: scale(0.8); /* Inicialmente reducido de tamaño */
}

.cotasalto{

    width: 20% !important;
    left: 0;
    margin-bottom: 10px;

}

.cotasancho{
    width: 20% !important;
    z-index: 1;
    right: 0;
}

#cotasneon{
    position: absolute;
    bottom: 21vh;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;


}

#infolineas{
    position: absolute;
    width: 90%;
    bottom: 0vh;
    height: 8vh;
    background: #343232;
    margin-left: 5%;
    margin-bottom: 3.5%;
    padding: 1%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow:2px 2px 4px rgba(0, 0, 0, 0.5)
}

#infolineasIzda, #infolineasDcha {
    width: 50%;
    float: left;
    height: 6vh;
}

#imgif, #imgifDcha{
    width: 30%;
    float: left;
    background: #444040;
    height: 6vh;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3%;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
#imgif img, #imgifDcha img{
    max-height: 5vh;
}
#textimg, #textimgDcha{
    width: 70%;
    float: left;
    padding: 1%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 6vh;
}

#titgig{
    font-size: 1.6rem;
    color: #c1bebe;
    padding:5%;
}

.popup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 2;
    transition: opacity 0.5s ease-in-out;
}

.popup-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    padding: 20px;
    text-align: center;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}

.close {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    font-size: 24px;
}

.clearfix.CL1{
    display: none !important;
}

label.attribute_label[for="Colores"] {
    display: none;
}

.testocanva{
    float: left;
}
#fuentecanva{
    float: unset;
}
#altoresponsive{
    width: 101px;float: left;
}

.ia3d{
    background-color: #0f0f0f;
}

#colorsPalete{
    width: 100%;
    z-index: 99;
}
.cambio{
    display: flex;
    justify-content: center;
    align-items: center;
}
.colorSeleccionado, .colorSeleccionado2{
    display: flex;
    align-items: center;
    margin-left: 15px;
}

.colorSeleccionado2 #colorMapChosed2{
    display: none !important;
}

#colorsPalete #colorMap .color_to_pick_list{
    margin-bottom:0;
}
.svgLeft .attribute_list .color_to_pick_list li{
    margin-top: 0;
}

.colorSel {
    width: 100% !important;
    display: flex;
    justify-content: center;
    /* align-items: center; */
    background: #0e0e0ede !important;
    padding: 2%;
    margin-top: 0 !important;
}

.mvadapt{
    background-color: #101010e8 !important;
    border-radius: 0 !important;
}
.crea.mvadapt{
    height: 230px;
}
.footmv{
    background-color: #2c2c2c !important;
    border-top: 0 !important;
    height: 96px;
}
.row .footmv{
    height: 89px;
}
#svgPrice2{
    color: white !important;
    font-weight: 100 !important;
}


.exclusive2.svgPriceBut.aplicaradapt{
    float: left;
    width: 40%;
    background: #db1d7d;
    border-radius: 0;
}

.exclusive2.svgPriceBut.cartblack{
    width: 100%;
    border-radius: 0;
    background: #db1d7d;
}
#svgPrice2.priceneon{
    width:176px;
}
.form-group.col-lg-6.neoncart{
    width: 28%;
}
#comercial{
    border: none;position: absolute;bottom: 0;background: #2c2c2c;left: 15px;z-index: 1;color:#333;
}
#thumbs_list_frame{
    max-width: 750px !important;
}

#restart{
    display: none;
}
div.uploader span.action{
    width: 150px !important;
    background: #db1d7c !important;
}

label[for="fileSvg"].active + #restart {
    display: none; /* Ocultar cuando la etiqueta tiene el atributo "for" igual a "fileSvg" y la clase "active" */
}

.color_pick:hover{
    color: rgb(215, 215, 215);
}

#creaSvg #okSVG{
    height: 200px;
    min-height: unset;
}

#theGroz{
    width: 25%;
}
#svgSettings .form-inline .renderatt #selectors .svgLeft{
    width: 98%;
    padding: 2%;
    margin-right: 0px;
    background: transparent;
    border-bottom: 1px solid #dadada;

}



#piesvg{
    position: absolute;
    bottom: 0;
    height: 82px;
    background: #e6e6e6;
    z-index: 9;
    width: 100%;
    padding-top: 1.5%;
    border-top: 1px solid #cccccc;
}
.medidaSVG{
    width: 40%;float: left;
}

#svgPrice.probamos {
    position: relative;
    float: right;
    font-weight: 600;
    font-size: 22px;
    color: #5C5B5B;
    margin-right: 0px;
    display: block;
    right: 0;
    width: 100%;
    text-align: center;
}
#testoSVG{
    float: left;
}
/* Móviles */
#topDcha{
    max-height: 40vh;
    /* overflow: scroll;*/
}


.color-option {
    display: inline-block;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin: 5px;
    cursor: pointer;
    transition:all 0.4s ease-in;;
}

#herramientas {
    width: 100%;
    float: left;
    position: absolute;
    top: 0;
    /* display:flex;*/
    display: none;
    align-items:center;
    background:black;
}


#colorPicker
{
    width: auto;
    /* position: relative;*/
    top: 0;
    text-align: center;
    z-index: 9;
    padding: 1%;
    float: left;
    display: none;
}

#colorOptionsContainer {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: white;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

#moveOption, #paintOption, #eraseOption, #paintOptionAll, #paintOptionLuz{
    background-size: cover;
    background-repeat:none;
    width: 25px;
    height: 25px;
    float: left;
    display: none;
    background-color:transparent;
    border: none;
}

#paintOptionLuz img, #paintOption img{
    width: 90%;
    height: 90%;
    max-width: unset;
    /*position: absolute;*/
    top: 0;
    left: 0;
}

#eraseOption{
    width: 25px;
    height: 25px;
}
#paintOption, #paintOptionAll{
    background-image: url('/3dNow/icons/iconos-neon-19.png');
}
#moveOption, #eraseOption{
    background-image: url('/3dNow/icons/iconos-neon-15.png');
}
#eraseOption{
    background-image: url('/3dNow/icons/borrar.png');
}
.herramienta.active #paintTool {
    cursor: url('/3dNow/icons/icono-00.png'), auto; /* Cambia el cursor a una imagen personalizada para la herramienta de pintura */
}

#moveTool.active {
    cursor: url('/3dNow/icons/iconos-neon-15.png'), auto; /* Cambia el cursor a una imagen personalizada para la herramienta de movimiento */
}

.color-option:hover {
    transform: scale(1.1);
    box-shadow: 0 0 10px rgba(80, 80, 80, 0.5);
    width: 42px;
    height: 42px;

}

.color-option-container .color-option.selected, #auxiliarButton {
    border: 1px solid rgb(96, 96, 96) !important;
    width: 43px;
    height: 43px;
    background-color: rgba(0, 0, 0, 0.5); /* Fondo gris semi-transparente */
    box-shadow: 0 1px 2px 2px rgb(0 0 0 / 13%);
    border: 1px solid #333333;
    border-radius: 12px;
    /* Cambia el borde para indicar que está seleccionado */
}

.color-picker-container {
    display: flex;
}

.color-option-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-right: 10px;
    /* Espacio entre cada par de círculo y nombre */
    float:left;
}

.color-name {
    margin-top: 5px;
    /* Espacio entre el círculo y el nombre */
    color:white;
}
#overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0); /* Fondo transparente por defecto */
    z-index: 999;
    transition: background-color 0.5s ease; /* Transición suave de color */
    pointer-events: none; /* Permite clics a través del overlay */
}
#incanvas{
    background-color: #000000c9;
    border-radius: 0.5rem;
    padding: 0.1%;
    padding-bottom: 0.5%;
}
.herramienta{
    padding:0.5%;
    cursor:pointer;
}
.herramienta {
    background-color: transparent; /* Fondo transparente por defecto */
    transition: background-color 0.5s ease; /* Transición suave de color */
    box-shadow: none;
    border: none;
    border-radius: none;
    margin-right:10px;
    position: relative;
    width: 40px;
    height: 40px;
}
#colorOptionsContainer {display: block;
    position: relative;
    background: transparent;
    transform: none;
    top: 0;
    left: 0;
    padding: 0;
    border: 0px;
}

.herramienta.active {
    /*   background-color: rgba(0, 0, 0, 0.5);*/ /* Fondo gris semi-transparente */
    background-color: unset;
    box-shadow: 0 1px 2px 2px rgb(0 0 0 / 13%);
   border: 1px solid #333333;
    border-radius: 12px;
}
#auxiliarButton {
    display: none;
    background-color: transparent;
    border: none;
    width: 35px;
    height: 35px;
    cursor: pointer;
}

/*#auxiliarButton img {
   width: 100%;
    height: 100%;
    border-radius: 50%;
}*/

.show-color-options {
    display: flex !important;
    opacity: 1;
    transition: opacity 0.5s ease;
}

.centerinline, .nuevasMedidas{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
    text-align: center;
}

.nuevasMedidas{
    margin-top: 0;width: 25%; display: block;height: 65px;

}

#piesvg #cartmv #svg_add_to_cart{padding-bottom: 0px;display: none;}
@media only screen and (max-width: 991px ) {
    #piesvg #cartmv #svg_add_to_cart{padding-bottom: 0px;display: block;}
    .nuevasMedidas{
        width: 100%;
    }
    .centerinline{
        display: block;
    }
    #precio-svg-canva{
        display: none;
    }
    #container-mobile{
        position: sticky;
        top: 0;
        z-index: 10000;
        /*   height: 350px;
           border: 10px solid #232323;*/

    }
    #herramientas{
        padding: 1%;
    }
    .color-option{
        width: 25px;
    }
    .color-option-container .color-option.selected{
        width:35px;
        height:auto;
    }
    .color-name{
        display:none;
    }
    #moveOption, #paintOption{
        width:20px;height:20px;
    }

    .color-option {
        display: none;
        opacity:0;
        transition: opacity 0.5s ease;
    }


    #colorPicker{
        width:auto;
    }

    #auxiliarButton {
        /*LANDING*/
        display: none;
    }
}

@media (max-width:480px){


    .closeCanvaContainer.close-button{
        right: 1%;
        z-index: 2;
    }
    .canvaContainer{
        justify-content: unset;
        align-items: unset;
        display: unset;
        z-index: 2;
    }

    .canvaContainerIzda{
        width: 100%;
        height: 40vh;
        margin-bottom: 0;
    }
    .canvaContainerDcha{
        width: 100%;
        height: 60vh;
        overflow: scroll;
    }
    #bottomDcha{
        position: fixed;
        padding: 2%;
    }

}

.newStyle{
    border-radius: 21px;
    background-color:transparent;
    width: 100%;
    padding-top: 3px;
    padding-bottom: 3px;
    justify-content: center;
    align-items: center;
    display: flex;
}


@media (max-width:767px){

    #svgSettings .form-inline .renderatt #selectors .svgLeft{
        width: 100%;
        /* padding: 2%; */
        margin-right: 0px;
        background: transparent;
        /*   border: 1px solid #404040;

           border-radius: 20px;*/
        justify-content: center;
        margin-bottom: 10px;
        display: flex;
        align-items: center;
        padding: 3%;
        margin-left: 0px;
        padding-bottom: 0;
    }


    .marginCanva{
        margin-top:70px;
    }

    #canvacontainer{
        /*    display: flex !important;
           align-items: center;
           justify-content: center;*/
        height: 200px;
    }
    #herramientas{
        padding: 1%;
        padding-bottom: 3%;
        border-bottom: 1px solid #383838;
        padding-top: 3%;
    }
    #testoSVG{
        float: unset;
    }
    /*  #svgcanva {
        margin-top: -20vh;
        margin-bottom: -20vh;
        position: relative;
    }*/

    #piesvg{height: 100px;}

    #piesvg #cartmv{

        top: unset;
        bottom: 0;background: transparent;
        padding-bottom: 1.9%;
    }
    #piesvg #changemv{
        top: 0px;background: transparent;left: 0;width:50%;
    }

    #piesvg #changemv .getsvg{
        top: unset;bottom: 0;background: transparent;width: 100%;
    }
    #piesvg  #svgPrice.probamos{
        margin-right: 0px;
        display: block;
        right: 0;
        top: 5px;
        width: 100%;
    }
    #piesvg{
        border-top: 1px solid #dfdfdf;background: whitesmoke;
    }
    #svgSettings{
        padding-bottom: 10%;
        /* LANDING: En la landing móvil no mostramos las diferentes opciones*/
        display: none;
    }
    #piesvg #pricesvgmv{border-top: none;}
    div#texto_faldon{display: none !important;}
    #svgSettings .form-inline .renderatt #selectors .svgLeft{
        /*background: #1b1b1b;
         LANDING: En la landing móvil no mostramos las diferentes opciones*/
        display: block;
    }

    .product_attributes, .box-cart-bottom{
        padding-left: 0px !important;
    }
    #okSVG {
        scrollbar-width: thin; /* Para navegadores Firefox */
        scrollbar-color: #656565 #3d3d3d; /* Color del pulgar y de la pista (Firefox) */
    }

    /* Para navegadores basados en WebKit (Chrome, Safari, Edge) */
    #okSVG::-webkit-scrollbar {
        width: 12px; /* Ancho de la barra de desplazamiento */
    }

    #okSVG::-webkit-scrollbar-thumb {
        background-color: #e73b81; /* Color del pulgar */
        border-radius: 10px; /* Bordes redondeados */
    }

    #okSVG::-webkit-scrollbar-track {
        background-color: #0c0c0c !important; /* Color de la pista */
    }


    .form-group.col-lg-12.renderatt{
        display: block;
    }
    #creaSvg #okSVG {

        /*height: 590px; */
        /*LANDING : tamaño auto para que sólo muestre lo fundamental*/
        height: auto;
        overflow: hidden;
    }
    #okSVG{
        min-height: 200px !important;
    }
    .closeCanvaContainer.close-button{
        z-index: 99;
    }
    #theGroz{
        width: 45%;
        float: left;
    }
    #cantidadesSvg{
        width: 45%;
        float: left;
    }
    #inputNeon .getsvg{
        bottom: 25px;
    }
    .renderatt{
        display: block;
    }

    .canvaContainerIzda{
        width: 100%;
        height: 35vh;
        margin-bottom: 0;
    }

    .canvaContainer{
        flex-direction: column;
    }

    #svgcanva{
        /*margin-top:100px ;*/
        bottom:0;
    }

    .canvaContainerDcha{
        width: 100%;
    }

    .col-md-12.persSVG, .col-md-12.form-inline{
        float: left;
        width: 100%;

    }

    .canvaContainerIzda #okSVG{
        height: 300px;
    }

    .canvaContainerIzda #buttons{
        height: auto; width: 7% !important;
    }

    #alSVG,#anSVG {
        width: 40%;float: left;
    }
    #cartmv{top: 0;}
    #sticky-contenedor {
        position: relative;
        margin-top: -10vh;
        /* background: #c4c4c4;*/
        /* bottom: 0; */
        z-index: 9999;
    }
    /*.form-group.col-lg-12#cartmv{
      top:60px;
    }*/
    .primary_block #leftProduct{
        width: 100%;
        padding-right: 0;
    }

    .crea.mvadapt {
        height: 280px;
    }
    #leftProduct .contenedorcrea{
        height: 280px;
    }

    .crea.mvadapt #atributoscanva{
        margin-top: 0;
    }
    .contenedorcrea #getPng{
        margin-left: 10px;
        margin-right: 0;
        float: left;
        width: 40%;


    }

    .contenedorcrea #getPng button.exclusive2.svgPriceBut.aplicaradapt{
        width: 100%;
    }
    .form-group.col-lg-6.neoncart{
        width: 50%;
    }

    #svgPrice2{
        right: 0 !important;
    }
    #restart{display: none !important;}

    li.optionsSvg.attribute_radiosvg {
        /* box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5) !important;*/
        transition: background-color 0.3s, box-shadow 0.3s;
    }

    .alto_svg, .ancho_svg{
        width: 40%;float: left;
    }
    .herramienta{
        margin-right: 3px;
    }
    .centerinline, .nuevasMedidas{
        margin-top: 10px;
    }

}



#cartmv{
    position: relative;
    bottom: 0;
    margin-bottom: 0px !important;
    right: 0;
    float: right;
    height: auto;
    width: 25%;

}

#changemv {
    /* display: block;
     position: absolute;
     bottom: 14%;
     right: 24%;*/
    position: absolute;
    bottom: 10px;
    right: 20%;
    width: 100%;
    float: left;
}
/* Tablets y portátiles*/

@media (max-width: 1199px ) and (min-width: 768px){


    .color-option{
        width: 22px;
        height: 22px;
    }
    .color-option-container .color-option.selected, #auxiliarButton{
        width: 22px;
        height: 22px;
    }
    #moveOption, #paintOption{
        width: 22px;
        height: 22px;
    }
    #topDcha{
        max-height: unset;
    }
    #piesvg{
        background: #dbdbdb;
        padding: 5%;
    }
    #svgPrice.probamos{
        width: 100%;bottom: 25px;
    }
    #fontSVG{
        float: left;
    }
    #creaSvg{
        padding-bottom: 90px;
    }

    #alSVG, #anSVG{
        width: 40%; float: left;
    }
    #creaSvg #okSVG{
        height: 210px;
    }

    #theGroz, #cantidadesSvg{
        width: 40%;float: left;
    }
    #cartmv, #changemv{
        width: 100%;
    }
    .closeCanvaContainer.close-button{
        /* right: 22%;*/
        z-index: 1;
    }

    .canvaContainer{
        justify-content: center;
        align-items: center;
        display: flex;
        z-index: 1;
    }
    .canvaContainerIzda{
        width: 70%;
        height: 95vh;
        margin-bottom: 0px;
        margin-top: 0px;
        max-height: 700px;

    }
    .canvaContainerDcha{
        width: 30%;
        height: 95vh;
        overflow: hidden;
        margin-bottom: 0px;
        margin-top: 0px;
        min-width: 300px;
    }
    #bottomDcha{
        position: absolute;
        padding: 2%;
    }
    .crea.mvadapt{
        height: 270px;
    }
    #leftProduct .contenedorcrea{
        height: 340px;
    }

    .row .footmv{
        height: 100px;
    }
    .contenedorcrea #getPng{
        margin-left: 10px;
        margin-right: 0;
        float: left;
        width: 40%;

    }

    .contenedorcrea #getPng button.exclusive2.svgPriceBut.aplicaradapt{
        width: 100%;
    }

    .form-group.col-lg-6.neoncart{
        width: 55%;
    }
    #restart{display: none !important;}
    /*  #svgPrice2{
       right: 0 !important;
     }*/

}
@media (max-width: 991px ){
    /*#canvaheight{
       height: 80vh !important;
      }*/

    #colorOptionsContainer {
        display: none;
        position: absolute;
        /*  top: 50%;
          left: 50%;
        transform: translate(-50%, -50%);*/
        left: 0;
        background-color: transparent;
        padding:5px;
        /*  border-bottom: 1px solid #383838;*/
        border-radius: 5px;
        transition: transform 0.3s ease;
        width: 100%;

        /*LANDING*/
        top: 0;
        width: 80%;
        right: 2px;
        left: unset;
        height: 40px;
        padding-top: 3%;
    }
    .color-option-container{
        margin-right: 2px;
    }
    #cartmv, #changemv{
        width: 50%;
    }
    #changemv {
        display: block;
        /* right: 40%;*/
        width: 100%;
    }
    .primary_block .container{
        max-width: 100%;
    }

    #svgPrice.probamos {
        width: 100%;
        bottom: 10px;
    }

    .canvaContainerDcha {
        width: 200px;
        height: 95vh;
        overflow: hidden;
        max-width: 400px;
        min-width: 300px;
    }
    #topDcha {
        max-height: unset;
        /* overflow: scroll; */
    }
    .canvaContainerIzda {
        width: 70%;
        height: 95vh;
        margin-bottom: 0;
        max-width: 400px;
        min-width: 400px;
        margin-top: 0;
    }

}




@media (min-width: 1200px){

    #svgcanva{
        width: 100% !important;
        height: auto !important;
    }


    #topDcha{
        max-height: unset;
    }
    #svgPrice2.priceneon{
        top: 140px;
    }
    .form-group.col-lg-6.neoncart{
        top: 180px;
    }
    #leftProduct .contenedorcrea{
        height: 230px;
    }
    .contenedorcrea #getPng{
        top:180px;
    }


    .closeCanvaContainer.close-button{
        /*  right: 22%;*/
        z-index: 1;
    }
    .canvaContainer{
        justify-content: center;
        align-items: center;
        display: flex;
        z-index: 1;
    }

    .canvaContainerIzda{
        width: 70%;
        height: 80vh;
        margin-bottom: 10%;
        max-width: 900px;
        min-width: 700px;
    }
    .canvaContainerDcha{
        width: 200px;
        height: 80vh;
        overflow-y: scroll;
        max-width: 300px;
        min-width: 200px;
    }

    #bottomDcha{
        position: absolute;
        padding: 5%;height: auto;
    }

}

input#size , input#sizeAncho{
    /* background: #353333 !important;
     border: none;*/

    color: #b9b3b3;
    width: 39%;
    margin-left: 1%;
}
#restart{display: none ;}
.persSVG{
    margin-top: 2%;
    float: left;
    padding: 0;
}
#tuTexto,
#tusvg {
    flex: 1;
    background-color: #f1f1f1;
    padding: 10px;
    text-align: center;
    border: 1px solid #ccc;
    cursor: pointer;
    display: none;

}

#tuTexto:checked + label,
#tusvg:checked + label {
    background-color: #f6f6f6 !important;
    border: 1px solid #00c6ff;
    color: #232323 !important;
}

.canvaContainer.active .canvaContainerDcha #topDcha .persSVG .col-md-12 .pestanya  #tuTexto:checked + label,
.canvaContainer.active .canvaContainerDcha #topDcha .persSVG .col-md-12 .pestanya #tusvg:checked + label {
    background-color: #8b8b8b;
}




label[for="tuTexto"],
label[for="tusvg"] {
    display: inline-block;
    padding: 5px;
    text-align: center;
    /* border: 1px solid #ccc;*/
    border-bottom: none;
    cursor: pointer;
    border-radius: 20px;
    /*background: #e3e3e3;*/
    color: white;
    margin-bottom: 0;
}
.pestanya{
    float: left;
}

label{
    color:#333;
}

#alSVG .inputNeon#size{
    background: #ffffff !important;
    color: #333;
}

#anSVG .inputNeon#sizeAncho{
    background: #ffffff !important;
    color: #333;
}

.noOnText{
    float: left;
}


#acmat {
    border: none;
    box-shadow: 1px 1px 4px rgb(0 0 0 / 8%);
    padding: 2%;
    text-align: center;
    font-size: 16px;
    color: #636363;
}

.uploadSvg{
    margin-bottom: 0px !important;
    padding-left: 10px;
    padding-right: 10px;
    color:#433f3f;
}

.card.card-personalizador{
    width: 68px;
    min-width: unset;
}
.card-title{
    color: #4e4b4b;
    font-weight: 600;
    width: 120px;
    height: 100%;
    position: absolute;
    top: 0;
    float: left;
    display: flex;
    text-align: center;
    align-items: center;
    display: none;
}
.scrolling-wrapper.card-group#scrolling{
    transition: all 0.5s,opacity 2s;
    margin-top: -25px;
    background:#c8c8c8e8;

}

#scrolling::-webkit-scrollbar {
    height: 6px;display: none;
}

#scrolling::-webkit-scrollbar-thumb {
    background-color: darkgray;
    border-radius: 10px;

}

#scrolling::-webkit-scrollbar-track {
    background-color: lightgray;
    border-radius: 15px;

}

/* Estilos para la barra de desplazamiento en navegadores basados en Firefox */
#scrolling {
    scrollbar-width: thin;
    scrollbar-color: darkgray lightgray;
    background: transparent;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory; /* Puedes ajustar según sea necesario */
    scroll-snap-destination: 0% 50%; /* Puedes ajustar según sea necesario */
    scroll-snap-points-x: repeat(100%);
    scroll-snap-stop: always;
    transition-duration: 0.5s; /

}
#changematerialname{
    position:relative;
    float: left;
    text-align: center;
    align-items: center;
    width: 100%;
    color:whitesmoke;
    font-size: 15px;
    padding: 1%;
    background:#8f8f8f;
    cursor: pointer;
    /* background:#c2c2c2;
     background: #999999db;*/


}
/*#changematerialname:hover{
  background:#e73b81;
}*/
.mdsp{
    display: none !important;
}
.materiales.btn.btn-outline-primary{
    padding: 4px;
}

.canvaContainerIzda #buttons{
    width: 100%;
    text-align: center;
    top: 0;
    /* background: rgb(243 243 243 / 17%);
     background: #999999db;*/
}

.canvaContainerIzda #buttons .botonera{
    width: 40px;
    padding: 0.1%;
}

.scrolling-wrapper {
    position: relative;

}

/*

.scrolling-wrapper-controls {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  display: flex;
  justify-content: space-between;
  z-index: 2; 
  height: 100%;
}

#scroll-left,
#scroll-right {
  background-color: transparent;
  border: none;
  font-size: 18px;
  cursor: pointer;
  color: #000; 
}
*/
#sticky-contenedor{
    position: relative;
    margin-top: -5px;
    /* background:#c4c4c4;*/
}


#scroll-left{
    position:absolute;
    height: 100%;
    left: 0; top: 0; border: none;background-color: #b1b1b1f0;color: white;width: 40px;
}

#scroll-right {
    position: absolute;
    height: 100%;
    right: 0;top: 0;border: none;background-color: #b1b1b1f0;color: white;width: 40px;

}

#valoresSVG{
    width: 100%;
    float: left;
    margin-bottom: 10px;
}
#valoresSVG #cantidadesSvg {
    width: 50%;
    float: left;
    text-align: center;
}

#valoresSVG #theGroz{
    width: 50%;
    float: left;
    padding-left: 0px; text-align: center;
}

#comercial{
    background: transparent !important;
}

#precio-svg-canva{
    width: 100%;
    float: left;margin-bottom: 2px;
}

#info-iva-envio{
    width: 50%;
    float: left;
}

#info-iva-envio #ivaletras, #info-iva-envio #enviogratis{
    width: 100%;
    float: right;
    color: #ea0b87;
    font-weight: 600;
}
#preciobottom{

    float: left;
    width: 48%;
    font-size: 19px;
    color: #5c5b5b;
    font-weight: 600;
    text-align: right;
    padding: 0.5%;
}
#bottomDcha #cartmv{
    float: left;
    width: 100%;
    margin-bottom: 0px !important;
}

#info-entrega{
    float:right;
    width: 100%;
    color: #5c5b5b;

}

#deliveryOptions{
    width: 50%;
    float: right;
}

#info-entrega #enviogratis{
    float: left;font-size: 11px;
}

#svgPrice{
    display: none;
}




.svgLeft .attribute_list .color_to_pick_list .optionsSvg p {
    transform: scale(1);
    transition: transform 0.3s ease; /* Ajusta la duración y la función de la transición según tus preferencias */
    height: 40px;
}

.svgLeft .attribute_list .color_to_pick_list .optionsSvg:hover p {
    transform: scale(1.05); /* Ajusta el factor de escala que desees al pasar el ratón sobre el elemento */
    color: #da1780;
}

.attribute_list .color_to_pick_list li{
    transform: scale(1);transition: transform 0.3s ease;margin-bottom: 5px;
}

.attribute_list .color_to_pick_list li:hover{
    transform: scale(1.05); /* Ajusta el factor de escala que desees al pasar el ratón sobre el elemento */

}
.attribute_list .color_to_pick_list li:hover img{
    box-shadow: 2px 2px 4px rgb(77 77 77 / 68%);

}



.attribute_list .color_to_pick_list li:hover p{
    color:#da1780 ;

}
.attribute_list .color_to_pick_list li.selected img{

    border-radius: 15px;
}
.attribute_list .color_to_pick_list li.selected img{

    box-shadow: 2px 2px 4px rgb(77 77 77 / 68%);
    border: 1px solid #e73b81d6;

}

.attribute_list .color_to_pick_list li.selected p{

    color:#da1780 ;
    margin-top: 5px !important;transition: transform 0.3s ease;


}

.attribute_list .color_to_pick_list a img{

    border-radius: 15px;
    padding: 10%;
    background: white;
}

.svgLeft .attribute_list .color_to_pick_list li{
    box-shadow: none;
}
.popup-colors {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    background-color: #fff;
    border: 1px solid #ccc;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    z-index: 1000;
}

.persSVG{
    margin-bottom: 0px;
}

.canvaContainerDcha{
    background: #e3e3e3;
    width: 25%;
    overflow-y: scroll;
    overflow-x: hidden;
}
#cantidadesSvg{width:25%;}


.crea#crea{
    height: unset !important;margin-top: 0;
}
#canvacontainer{
    display: none;
}
#ancho-alto-svg{
    width: 100%;float: left;
}

#creaSvg{
    background: whitesmoke;padding-bottom: 80px;
}
.grossCant{
    display: block;
    width: 100%;
    float: left;
    margin-bottom: 1%;
}



#cartmv #svg_add_to_cart{
    margin: 0 auto;
    max-width: 200px;
    padding-bottom: 0px;
    right: 0;
    position: relative;
    width: 100%;
    bottom: 10px;
}
#priceSVG300 #svgPrice{
    display: block;font-size: 22px;
}
.getsvg #getPng{
    position: relative;
}
.getsvg{
    position: relative;  width: 50%; float: right;
}

#bottomDcha #cartmv #svg_add_to_cart {

    width: 100%;
    position: relative;
    padding-bottom: 0px;
}

#okSVG #cartmv #svg_add_to_cart {
    padding-bottom: 10px;
}
.hideatributtes{
    display: none;
}
#creaSvg #okSVG.oksvgpost{
    height: auto !important;

}

#inputNeon{
    float: left;
    width: 100%;
    position: relative;
}

/*#piesvg{
  width: 100%;
    height: 60px;
    float: left;
    position: absolute;
    background-color: grey;
    bottom: 0;
}*/



#piesvg #cartmv{
    position: absolute;
}
.form-inline.noOnText{
    width: 100%;
}

.uploadSvg h4{
    margin-top: 0px;
    text-align: center;
}

.canvaContainerDcha #topDcha .noOnText #theGroz
{
    width: 50%;
}
.hideatributtes{
    float: left;width: 100%;
}
.hideatributtes .medidaSVG{
    width: 50%;
}

#valoresSVG{
    padding-left: 10px;
}
span#enviogratis{position: absolute;}


@media (min-width: 1199px ) and (max-height: 800px) {

    .canvaContainerDcha {
        width: 200px;
        height: 100vh;
        overflow-y: scroll;
        max-width: 400px;
        min-width: 300px;
        margin-bottom:0;

    }
    #topDcha {
        max-height: unset;    height:auto;overflow: scroll;
    }

    #bodyDcha{
        height: 35%;overflow: scroll;
    }
    #bottomDcha{
        height: 10%;overflow: scroll;
    }
    .canvaContainerIzda {
        width: 70%;
        height: 100vh;
        margin-bottom: 0;
        max-width: 900px;
        min-width: 700px;
        margin-top: 0;
        margin-bottom: 0;
        height: 100vh;
    }

}

.closeCanvaContainer.close-button{
    top: 0;
    right: 1%;
}
#bodyDcha{
    height: auto;

    display: flex;
    text-align: center;
    align-items: center;
}

#bottomDcha {
    height: 90px;

    position: sticky;
    bottom: 0;
}



.canvaContainerDcha::-webkit-scrollbar {
    width: 7px; /* Ancho de la barra de desplazamiento */
}

.canvaContainerDcha::-webkit-scrollbar-track {
    background-color: #f1f1f1; /* Color de fondo de la pista */
}

.canvaContainerDcha::-webkit-scrollbar-thumb {
    background-color: rgb(178 178 178); /* Color del asa de la barra de desplazamiento */
    border-radius: 6px; /* Radio de borde del asa */
}

.canvaContainerDcha::-webkit-scrollbar-thumb:hover {
    background-color: #555; /* Color del asa al pasar el ratón por encima */
}

.canvaContainerDcha::-ms-scrollbar {
    width: 7px; /* Ancho de la barra de desplazamiento */
}

.canvaContainerDcha::-ms-scrollbar-track {
    background-color: #f1f1f1; /* Color de fondo de la pista */
}

.canvaContainerDcha::-ms-scrollbar-thumb {
    background-color: #888; /* Color del asa de la barra de desplazamiento */
    border-radius: 6px; /* Radio de borde del asa */
}

.canvaContainerDcha::-ms-scrollbar-thumb:hover {
    background-color: #555; /* Color del asa al pasar el ratón por encima */
}

#colorMap .attribute_label{
    color: #333 !important;
}

div.uploader span.filename{
    width: auto !important;
    float: left;
}

.personalizaturotulo{
    display: block;
    background-color: #292828;
    width: 100%;

    padding: 1%;
    text-align: center;
    /* display: flex; */
    /* align-items: center; */
    color: #dedede;
    padding: 2%;
    font-size: 25px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.pb-left-column #views_block{
    height: 55px !important;
}

.contenedor-cerrar{
    position: sticky;
    top: 0;
    float: right;
    width: 100%;
    z-index: 9;
    background: #838383de;
    text-align: right;
    padding: 1%;
    box-shadow: 2px 2px 4px rgb(128 128 128 / 68%);
}
.contenedor-cerrar #closeButton{
    position: relative;
}


#overlaySvgCartCanva{
    left: 0;
    top: 0;
    z-index: 100;
    width: 100%;
    display: none;
    background: rgba(0,0,0,0.6);
    position: fixed;
    height: 100%;
    z-index: 1;
}

#overlaySvgCartCanva .cv-spinner3 {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    bottom: 0;
    width: 100%;
    top: 0;
}

#overlaySvgCartCanva h3 {
    font-size: 18px;
    position: absolute;
    top: 40%;
}
#depth.form-group.col-lg-12{
    margin-bottom: 0px !important;
}
@media (min-width: 1800px ) {
    .canvaContainerIzda{

        width: 70%;
        height: 90vh;
        max-width: 1200px;
        max-height: 1000px;
    }

    .canvaContainerDcha {
        background: #e3e3e3;
        width: 40%;
        height: 90vh;
        max-width: 400px;
        max-height: 1000px;

    }

}

#overlaySvg{
    opacity: 1 !important;
    z-index: 99999 !important;
    top: 30%;
}


.contenedorBotones{
    width: auto;
    background-color: #857c7c;
    border-radius: 21px;
    padding-top: 3px;
    padding-bottom: 3px;
}



.medidasbackground{
    background-color: #867d7c;
    border-radius: 21px;
    float: left;
    width: 60%;
    height: 31px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.botonesAlAn{
    height: unset !important;
    line-height: 25px;
    padding: 0 !important;
    margin: 0 !important;
    width: 50% !important;
}
.land{
    color: black !important;
}

.centrado{
    display: flex;
    justify-content: center;
    align-items: center;
}

.selected {
    background-color: #f6f6f6;
    border: 1px solid #00c6ff;
    color: #232323;
}

/* Estilos generales de los labels */
label[for="size"], label[for="sizeAncho"] {
    display: inline-block;
    text-align: center;
    border-radius: 20px;
    cursor: pointer;
    color: white;
    margin-bottom: 0;
    width: 90%;
}

/* Estilo cuando el input asociado está enfocado */
.inputNeon:focus + label {
    background-color: #f6f6f6;
    border: 1px solid #00c6ff;
    color: #232323;
}

.font-select > span{text-align: left;}
.attribute_list .color_to_pick_list li{background-color: transparent;}
li.optionsSvg.attribute_radiosvg.selected {
    background: transparent;
}

.ajustado{padding-left: 3px !important;}


#labelanchoSVG, #labelaltoSVG{
    color: white; width: 100%;text-align: center;
}
.uploader #uniform-uploadText{
    display:flex;
    justify-content: center;
}

.uploadSvg .uploader{
    display: flex !important;
    justify-content: center;
}

div.uploader span.filename{
    border-radius: 10px;
}

div.uploader span.action{
    border-radius: 10px;
}