/*############################################ Import ############################################*/
/* Fuentes de letras */
@import url("includes/fonts.css");
/* Head */
@import url("includes/head.css");
/* Botones */
@import url("includes/botones.css");
/* Alerta */
@import url("includes/alerta.css");
/* Redes Sociales */
@import url("includes/redes-sociales.css");

*{
    margin: 0px;
    padding: 0px;
}

body{
    background-image: url(../materiales/galeria/fondo/pattern.png);
}

.wrap{
    width: 100%;
    height: auto;
    margin: auto;
}

.clearfix{
    float: none;
    clear: both;
}

.ir-arriba {
        position: fixed;
        right:30px;
        top: -2px;
        font-size:20px;
        padding:20px;
        color:#fff;
	background:#0f7ab8;
	cursor:pointer;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        box-shadow: 0px 1px 10px rgba(255, 255, 255, 0.5);
}

/*########################################################################################*/
        /*############################ CABECERA #######################################*/
/*########################################################################################*/
#header{
    width: 100%;
    height: 70px;
}
/*########################################################################################*/
        /*############################ ARTICLE #######################################*/
/*########################################################################################*/
#articles{
    width: 825px;
    height: auto;
}


#articles h2,
#articlesOpciones h2{
        display: block;
        font-family: "RobotoBold";
        background: #282828;
        background-image: url(../materiales/galeria/fondo/pxgray.png);
        color: white;
        border-right: 1px solid #282828;
        border-bottom: 1px solid #282828;
        box-shadow: 1px 2px 0px #7E7E7E , 1px 2px 0px #7E7E7E , 2px 1px 0px #7E7E7E, 3px 3px 0px #7E7E7E;
        margin: 0px auto;
        margin-bottom: 25px;
        margin-top: 10px;
}

#articlesProductos h2{
        font-family: "RobotoBoldItalic";
}

/*########################################################################################*/
        /*############################ INICIO #######################################*/
/*########################################################################################*/

/*======== Video de presentación ========*/
#contenedor .CajaVideo{
        display: block; /*<---- Para ocultar el video */
}

.CajaVideo .modal{      
        display: block;
	position: fixed;
        margin: auto;	
	animation: modal 2s 3s forwards;
	visibility: hidden;
	opacity: 0;
}

.CajaVideo .contenido{
	background: transparent;
}

#cerrar{
	display: none;
}

#cerrar + label {
        position: fixed;
	color: #fff;
	background: darkred;
	border-radius: 50%;
	cursor: pointer;
        text-align: center;
	animation: modal 2s 3s forwards;
	visibility: hidden;
	opacity: 0;
}

#cerrar + label:hover {
        color: darkred;
        background-color: transparent;
}
#cerrar:checked + label, 
#cerrar:checked ~ .modal{
	display: none;
}

@keyframes modal{
	100%{
		visibility: visible;
		opacity: 1;
	}
}

/*======== INFORMACIÓN ========*/
#contenido{
        height: auto;
}

.imagen{
        display: block;
        transition: all 1s;
        border-radius: 20px;
}

/*--IMAGEN--*/
.imagen  .img1{
        display: block;
        border-radius: 15px;
}

/*--Animacion--Animacion para coner los colores en forma de neon*/
@keyframes blick{
        0%{
            border: 4px solid #37bcf9;
        }
        25%{
            border: 4px solid #7E7E7E;
        }
        50%{
            border: 4px solid #282828;
        }
        75%{
            border: 4px solid #7E7E7E;
            }
        100%{
            border: 4px solid #37bcf9;
        }
}

/*======== PRODUCTOS ========*/
#productos{
        height: auto;
        margin: auto;
}

.contenedor,
.contenedor-2{
        display: inline-block;
        width: 250px;
        height: 250px;
        margin-right: 15px;
        -webkit-perspective: 700;
}

.carta{
        height: 100%;
        width: 100%;
        position: relative;
        transform-style: preserve-3d;
        transition: 2s;
        background-color: #606060c0;
        border-radius: 30px;
}

.carta:hover{
        transform: rotateY(180deg);
}

#productos .lado,
#producto .lado{
        width: 100%;
        height: 100%;
        text-align: center;
        backface-visibility: hidden;
        position: absolute;
}

.frente{
        border-radius: 40px;
        margin: auto;

}

.frente span{
        display: block;
        position: absolute;
        border-bottom-left-radius: 6px;
        border-top-left-radius: 6px;
        font-family: "RobotoBold";
        color: white;
        background-color: rgba(11, 109, 8, 0.705);
}
.imagenLogo{
        display: block;
        position: absolute;
        height: 52px;
        left: 30px;
        top: -2px;
        
}
.frente p{
        display: block;
        position: absolute;
        font-family: "RobotoLightItalic";
        color:white;
        font-weight: bold;
        text-shadow: 2px 2px 1px #0f0f0f;
        letter-spacing: 1px;
        line-height: 23px;
        border-bottom-left-radius: 30px;
        border-bottom-right-radius: 30px;
}

.atras{
        border-radius: 30px;
        background: #282828;
        transform: rotateY(180deg);
}

.lado h1{
        margin: auto;
        font-family: "RobotoBold";
        color: white;
        text-shadow: 2px 2px 1px #000;
        border-top-left-radius: 30px;
        border-top-right-radius: 30px;
}

.atras p{
        margin: auto;
        font-family: "RobotoLightItalic";
        color: white;
        border-bottom-left-radius: 30px;
        border-bottom-right-radius: 30px;
}

.lado img{
        margin-left: -4px;
        border-radius: 30px;
        width: 100%;
        height: 100%;
}

/*########################################################################################*/
        /*############################ PRODUCTOS #######################################*/
/*########################################################################################*/
.menuPro{
    display: inline-block; 
    border-right: 1px solid #282828;
    border-bottom: 1px solid #282828;
    box-shadow: 0px 1px 2px #282828, 1px 1px 1px #282828, 2px 2px 2px #1b1b1b, 2px 2px 1px #1b1b1b;
    background:white;
    overflow: hidden;
    cursor: pointer;
    transition: all 300ms;
   
}

.menuPro:hover{
    background: #282828;
    background-image: url(../materiales/galeria/fondo/pxgray.png);
}


.menuPro .caja_producto{
    font-family: "RobotoBold";
    text-align: center;
    color: #0f7ab8;
    transition: all 300ms;
}
   
    .menuPro:hover .caja_producto, .menuPro:hover .caja_producto p{
        display: block;
        color: white;
    }

/*============ CAJAHIJO ============*/
#cajaPadre .caja{
    display: inline-block;
}

/*============TEXTO ============*/
#cajaPadre .caja p{
    display: block;
    position: relative;
    font-family: "RobotoLightItalic";
    font-weight: bold;
    text-align: center;
}

/*########################################################################################*/
        /*############################ HISTORIA #######################################*/
/*########################################################################################*/
/*------ INICIO --- HISTORIA ------*/
#foto-1{
        margin: auto;
        padding-bottom: 10px;
}

#textoH{
        width: 100%;
        height: auto;
        margin-bottom: 25px;
}

#textoH p{
        font-family: "RobotoLightItalic";
        font-size: 20px;
        text-align: center;
}

#foto-2{
        margin: auto;
}

/*########################################################################################*/
        /*############################ CONTACTO #######################################*/
/*########################################################################################*/
#articles article h4{
        display: block;
        font-family: "RobotoBoldItalic";
        text-align: center;
        background-color: transparent;
}

#articles article{
        background: white;
        color: black;
        background-color: transparent;
}

/*------- Linea Horizontal ------*/
.linea-H,
.linea-H-carrito{
        display: block;
        position: relative;
        margin: auto;
}

.linea-H img,
.linea-H-carrito img{
        display: block;
        margin: auto;
}

#cajaPadre-correo, #cajaPadre-correo{
        width: 100%;
        height: auto;
        background-color: transparent;
}

#cajaPadre-correo{
        width: 100%;
        height: auto;
        background-color: transparent;
}

#cajaPadre-correo p,
#cajaPadre-correo p{
        font-family: "RobotoLightItalic";
        text-align: center;
}


/*########################################################################################*/
        /*############################ ADMINISTRACION Y VENTAS #######################################*/
/*########################################################################################*/
#texto-general{
        font-family: "RobotoLightItalic";
        text-align: center;
    
}
/*------ INICIO --- Formulario ------*/
.formulario{
        display: block;
        margin: auto;
}

.textarea-msj{
        display: block;
        margin: auto;
}

.formulario label{
        display: block;
        font-family: "RobotoBoldItalic";
        font-size: 20px;
        color: #000;
        font-weight: bold;
}

.formulario .nombre,
.formulario .apellido,
.formulario .cuit,
.formulario .email,
.formulario .localidad,
.formulario .telefono,
.formulario .asunto,
.textarea-msj .mesaje,
.formulario .descuento,
.formulario .password{
        font-family: "RobotoLight";
        font-size: 20px;
        text-align: center;
        border: none;
        box-shadow: 4px 4px 6px 0px #cacacc;
}

.textarea-Rubros{
        box-shadow: 4px 4px 6px 0px #cacacc;
}

.textarea-Rubros textarea{
        resize: none;
}

.textarea-Rubros .rubro{
        font-family: "RobotoLight";
        font-size: 20px;
        text-align: center;
        border: none;
}

/*------ INICIO --- Mensaje ------*/
.textarea-msj textarea{
        resize: none;
  
}

.textarea-msj .mesaje{
        border: none;
        box-shadow: 4px 4px 6px 0px #cacacc;
}


/*########################################################################################*/
        /*############################ LISTAS #######################################*/
/*########################################################################################*/
#productos{
        text-align: center;
        font-family: "RobotoLightItalic";
    }

    #productos .mensaje{
        color: red;
        font-weight: bold;
        font-family: "RobotoLightItalic";
        font-size: 18px;
        letter-spacing: 2px;
    }

    /*TODOS LOS PRODUCTOS*/
    #productos .CajaPadre-L{
        display: block;
        box-shadow: 1px 1px 2px rgb(252, 252, 252);
        transition: all 1s;
        border: 3px solid white;
        animation: blick 15s infinite linear;
    }

    /*CAJA PADRE*/
    .CajaPadre-L .data{
        position:relative;
        transition: all 1s;
        background: #0f7ab8;
        animation: blicks 15s infinite linear;
    }

    /*--Animacion--Animacion para coner los colores en forma de neon*/
    @keyframes blicks{
        0%{
            border-top: 2px solid #37bcf9;
            border-left: 2px solid #37bcf9;
            border-right: 2px solid #37bcf9;
        }
        25%{
            border-top: 2px solid #7E7E7E;
            border-left: 2px solid #7E7E7E;
            border-right: 2px solid #7E7E7E;
        }
        50%{
            border-top: 2px solid #282828;
            border-left: 2px solid #282828;
            border-right: 2px solid #282828;
        }
        75%{
            border-top: 2px solid #7E7E7E;
            border-left: 2px solid #7E7E7E;
            border-right: 2px solid #7E7E7E;
            }
        100%{
            border-top: 2px solid #37bcf9;
            border-left: 2px solid #37bcf9;
            border-right: 2px solid #37bcf9;
        }
}
    .CajaPadre-L .data span{
        margin: 1px;
    }

    /*CAJA HIJO*/
    .CajaHijo-L{
        border-radius: 25px;
    }

    /*CAJA 1 */
    .CajaHijo-L .Caja1{
        display: inline-block;
        text-align: center;
        border-radius: 30px;
    }

    .CajaPadre-L .CajaHijo-L .Caja1 h6,
    .CajaPadre-L .CajaHijo-L .Caja2 h6,
    .CajaPadre-L .CajaHijo-L .Caja3 h6,
    .CajaPadre-L .CajaHijo-L .Caja4 h6,
    .CajaPadre-L .CajaHijo-L .Caja5 h6{
        text-align: center;
        font-family: "RobotoBoldItalic";
        letter-spacing: 2px;
        font-size: 16px;
    }

    .Caja1 p,
    .Caja2 p{
        font-family: "RobotoLightItalic";
        font-size: 18px;
        letter-spacing: 2px;
    }

    /*CAJA 2*/
    .CajaHijo-L .Caja2{
        text-align: center;
        border-radius: 30px;
    }

    /**CAJA 3**/
    .CajaHijo-L .Caja3{
        text-align: center;
        border-radius: 30px;
    }

    /**CAJA 4**/
    .CajaHijo-L .Caja4{
        text-align: center;
        border-radius: 30px;
    }

    /**CAJA 5**/
    .CajaHijo-L .Caja5{
        text-align: center;
        border-radius: 30px;
    }


    /*Iconos*/

    /*DISPONIBLE*/
    .bi-bookmark-check{
        color:green !important;
    }

    /*NO-DISPONIBLE*/
    .bi-bookmark-x{
        color:red !important;
    }

    /*SE PUEDE DESCARGAR Y VER*/
    .icone{
        color: #000 !important;
    }

    /*NO SE PUEDE DESCARGAR Y VER*/
    .icone-D{
        color: #585858 !important;
    }

    /*ALGUN PROBLEMA EN LA PARTE DE DESCARGAR O DE VER*/
    .icone-E{
        color: #992 !important;
    }

/*########################################################################################*/
        /*############################ LISTA CON Y SIN PRECIO #######################################*/
/*########################################################################################*/
#titulo h4{
        width: 100%;
        text-align: center;
        font-family: "RobotoBoldItalic";
        font-size: 25px;
        font-weight: normal;
        letter-spacing: 2px;
        margin: auto;
    }

/*------- Linea Horizontal ------*/
#titulo .lineas-H{
        display: block;
        position: relative;
        margin: auto;
        width: 550px;
        height: 5px;
        top: -3px;
}

#titulo .lineas-H img{
        display: block;
        width: 95%;
        height: 95%;
        margin: auto;
}

#titulo hr{
        border-radius: 30px;
        transition: all 1s;
}

#titulo p{
        text-align: center;
        font-family: "RobotoLightItalic";
        font-weight: normal;
}


/*########################################################################################*/
        /*############################ Opciones #######################################*/
/*########################################################################################*/

#articlesOpciones p,
#articlesMiPedido P{
        text-align: center;
        font-family: "RobotoLightItalic";
        letter-spacing: 1.6px;
        font-weight: normal;
        font-size: 18px;
}

#articlesOpciones hr,
hr,
#articlesMiPedido hr{
        border-radius: 30px;
        transition: all 1s;
        border: 1px solid white;
        animation: blick 9s infinite linear;
}

/*Animacion*/
@keyframes blick{
        0%{
                border: 1px solid #37bcf9;
        }
        25%{
                border: 1px solid #7E7E7E;
        }
        50%{
                border: 1px solid #282828;
        }
        75%{
                border: 1px solid #7E7E7E;
        }
        100%{
                border: 1px solid #37bcf9;
        }
}


/*########################################################################################*/
        /*############################ CARRITO PRODUCTOS #######################################*/
/*########################################################################################*/

    /***Txt-Pedido****/  
    .card-body h2{
        text-align: center;
        font-family: "RobotoBold";
        font-weight: normal;
    }

    .card-body p{
        text-align: center;
        font-family: "RobotoLightItalic";
        font-weight: normal;
    }

    #agregarnuevosdatosmodal .modal-content,
    #agregarMedioDeRetiro .modal-content,
    #modalEditar .modal-content,
    #modalEditarRetiro .modal-content{
        background-image: url(../materiales/galeria/fondo/pattern.png);
        background-color: #eee8e8;
    }

    #agregarnuevosdatosmodal .modal-header,
    #agregarMedioDeRetiro .modal-header,
    #modalEditar .modal-header,
    #modalEditarRetiro .modal-header{
        background-color: #37bcf9;
    }

    #agregarnuevosdatosmodal .modal-header h5,
    #agregarMedioDeRetiro .modal-header h5,
    #modalEditar .modal-header h5,
    #modalEditarRetiro .modal-header h5{
        font-family: "RobotoBoldItalic";
        font-weight: bold;
    }

    #agregarnuevosdatosmodal .modal-body p,
    #agregarMedioDeRetiro .modal-body p,
    #modalEditar .modal-body p{
        font-family: "RobotoLightItalic";
        font-weight: normal;
        text-align: center;
    }

    #agregarnuevosdatosmodal .modal-body label,
    #agregarMedioDeRetiro .modal-body label,
    #modalEditar .modal-body label,
    #modalEditarRetiro .modal-body label{
        font-family: "RobotoBoldItalic";
        font-weight: bold;
    }

    #agregarnuevosdatosmodal #modal-footer,
    #agregarMedioDeRetiro #modal-footer,
    #modalEditar #modal-footer,
    #modalEditarRetiro #modal-footer{
            background-color: #2D2E2D;
    }


/*########################################################################################*/
        /*############################ MI PEDIDO #######################################*/
/*########################################################################################*/

#articlesMiPedido article{
        display: inline-block;
        width: auto;
        text-align: center;
    }

#articlesMiPedido article .data1,
#articlesMiPedido article .data2{
    background: #393d3f;
    color: #fff;
    border-radius: 20px;
    width: auto;
    height: auto;
    font-family: "RobotoLight";
    font-weight: bold;
}

#articlesMiPedido article .data1 span,
#articlesMiPedido article .data2 span{
    text-shadow: black 0.1em 0.1em 0.2em
}

/*Detalle del Pedido*/
#articlesPedido .retiro span{
        color: #393d3f;
        border-radius: 5px;
        width: auto;
        height: auto;
        background-color: rgba(57, 61, 63, 0.3);
        font-family: "RobotoLightItalic";
        font-weight: bold;
        text-shadow: white 0.1em 0.1em 0.2em;
}

/*##########################################################################################################################################################*/
        /*################################################## RESPOSIVE #############################################################*/
/*##########################################################################################################################################################*/
/*Para monitores medianos*/
@media (max-width: 1920px), (max-width: 1366px), (max-width: 1024px), (max-width: 768px){
        .linea-H img,
        .linea-H-carrito img{
                width: 95%;
                height: 95%;
        }
        
/*========================================================================================*/
        /*================================ ARTICLE ==================================*/
/*=======================================================================================*/
        #articles{
                width: 845px;
                height: auto;
        }

        #articles h2,
        #articlesOpciones h2{
                width: 620px;
                height: 75px;
                line-height: 75px;
                font-size: 35px;
                letter-spacing: 2px;
        }

       
        #articlesProductos h2{
                display: block;
                text-align: center;
                font-size: 25px;
                letter-spacing: 2px;
        }

/*========================================================================================*/
        /*================================ Video de presentación ==================================*/
/*=======================================================================================*/

.CajaVideo .modal{      
	width: 60%;
}

.CajaVideo .contenido{
	width: 800px;
}

.CajaVideo .contenido video{
	width: 100%;
	height: 450px;
}

video{
	width: 100%;
	height: 500px;
        margin-top: 90px;
}

#cerrar + label {
        height: 40px;
	width: 40px;
	line-height: 40px;
	right: 213px;
	top: 68.5px;
	font-size: 25px;
	z-index: 50;
}

/*========================================================================================*/
        /*================================ INICIO ==================================*/
/*=======================================================================================*/

        /*----- INFORMACIÓN -----*/
        #contenido{
                width: 100%;
        }
        .imagen{
                margin: auto;
                width: 558px;

        }

        /*--IMAGEN--*/
        .imagen  .img1{
                width: 100%;
                margin-bottom: 15px;
        }

        /*----- Productos -----*/
        #productos{
                width: 795px;
        }

        .frente span{
                left: 199px;
                top:25px;
                font-size: 15px;
                padding-left: 3px;
                padding-right: 3px;
        }

        .frente p{
                width: 98%;
                font-size: 17px;
                top:200px;
        }

        .lado h1{
                width: 250px;
                padding-top: 10px;
                padding-bottom: 5px;
                font-size: 18px;
                letter-spacing: 2px;
        }

        .atras p{
                width: 242px;
                font-size: 16.5px;
                letter-spacing: 2px;
        }

/*========================================================================================*/
        /*================================ PRODUCTOS ==================================*/
/*=======================================================================================*/
        /*----- MENU PRODUCTOS -----*/
        #menu_productos{
                width: 100%;
                margin: auto;
                padding-top: 12px;
                padding-bottom: 12px;
        }

        .menuPro{
   
                width: 250px;
                height: 30px;
                line-height: 30px;
                margin-right: 5px;
                border-radius: 25px;
        }

        .menuPro .caja_producto{
                width: 100%;
                height: 25px;       
        }

        .menuPro .caja_producto p{
                font-size: 18px;
                font-weight: bold;
        }

/*----- CAJAHIJO -----*/
        #cajaPadre .caja{
                width: 257px;
                height: 128px;
                margin-top: 2px;
                margin-right: 10px;
                margin-left: 10px;
                margin-bottom: 2px;
        }

        /*----- TEXTO -----*/
        #cajaPadre .caja p{
                top:-15px;
                font-size: 18px;
                letter-spacing: 4px;
        }

        /*----- IMAGEN -----*/
        #cajaPadre .caja a img{
                margin-left: -6px;
        }

        #cajaPadre .caja img{
                margin-left: -4px;
        }

/*========================================================================================*/
        /*================================ HISTORIA ==================================*/
/*=======================================================================================*/
        #foto-1{
                width: 588px;
                height: auto;
        }

        #foto-1 img,
        #foto-2 img{
                width: 100%;
                height: auto;
        }

        #foto-2{
                width: 588px;
                height: auto;
                padding-top: 10px;
                padding-bottom: 10px;
        }

/*========================================================================================*/
        /*================================ UBICACION ==================================*/
/*=======================================================================================*/
        #ubicacion{
                padding-left: 5px;
                padding-right: 5px;
        }


/*========================================================================================*/
        /*================================ CONTACTO ==================================*/
/*=======================================================================================*/
        #articles article h4{
                font-size: 23px;
                letter-spacing: 2px;
                margin-top: 15px;
        }
        #articles article{
                width: 100%;
                height: auto;
        }

        .linea-H{
                width: 550px;
                height: 5px;
                top: -10px;
        }

        #cajaPadre-correo p,
        #cajaPadre-correo p{
                font-size: 18px;
                letter-spacing: 4px;
        }


/*========================================================================================*/
        /*================================ ADMINISTRACION Y VENTAS ==================================*/
/*=======================================================================================*/
        #texto-general{
                font-size: 20px;
                letter-spacing: 4px;
        }

        .formulario{
                width: 500px;
                height: auto;
        }

        .formulario label{
                margin-left: 33px;
                margin-bottom: -20px;
        }

        .formulario .nombre,
        .formulario .apellido,
        .formulario .cuit,
        .formulario .email,
        .formulario .localidad,
        .formulario .telefono,
        .formulario .asunto,
        .formulario .mesaje,
        .formulario .descuento,
        .formulario .password{
                width: 430px;
                height: 35px;
                margin-bottom: 10px;
                margin-left: 33px;
        }
        .textarea-Rubros{
                width: 435px;
                margin-bottom: 15px;
                margin-left: 33px;
                padding-left: 6px;
        }
        .textarea-Rubros .rubro{
                width: 430px;
        }

        /*------ INICIO --- Mensaje ------*/
        .textarea-msj{
                width: 430px;
        }

       .textarea-msj p{
                display: block;
                font-family: "RobotoBoldItalic";
                font-size: 20px;
                margin-bottom: -12px;         
                color: #000;
                font-weight: bold;
                text-align: left;       
        }

        .textarea-msj .mesaje{
                width: 100%;
                height: 250px;
                margin-top: 20px;
                margin-left: 0px;
        }

/*========================================================================================*/
        /*================================ LISTAS ==================================*/
/*=======================================================================================*/
    /*TODOS LOS PRODUCTOS*/
    #productos .CajaPadre-L{
        border-radius: 25px;
        width: 790PX;
        margin: auto;
        margin-top: 5px;
        margin-bottom: 25px;

    }

    /*CAJA PADRE*/
    .CajaPadre-L .data{
        top: -2px;
        margin-left: 15px;
        border-radius: 25px;
        height: auto;
        margin-bottom: 5px;
        line-height: 6px;
        
    }
/*CAJA PADRE*/
    .CajaPadre-L .data{
        width: 750px;
    }

    /*CAJA 1 */
    .CajaHijo-L .Caja1{
        width: 53%;
        margin-bottom: 5px;
    }

    /*CAJA 2*/
    .CajaHijo-L .Caja2{
        display: block;
        width: 15%;
        float: left;
        margin-bottom: 5px;
    }

    /**CAJA 3**/
    .CajaHijo-L .Caja3{
        display: block;
        width: 15%;
        float: right;
        margin-right: 5px;
        margin-left: 5px;
    }

    /**CAJA 4**/
    .CajaHijo-L .Caja4{
        display:inline-block;
        width: 15%;
        margin-right: 5px;
        margin-left: 15px;
        margin-bottom: 5px;
    }

    /**CAJA 5**/
    .CajaHijo-L .Caja5{
        display:inline-block;
        width: 15%;
        margin-right: 5px;
        margin-left: 5px;
        margin-bottom: 5px;
    }

/*========================================================================================*/
        /*================================ CARRITO PRODUCTOS ==================================*/
/*=======================================================================================*/
        .card-body h2{
                width: 50%;
                font-size: 25px;
                letter-spacing: 2px;
                margin: auto;
        }

        .card-body p{
                letter-spacing: 1.6px;
                font-size: 18px;
        }
        .linea-H-carrito{
                width: 350px;
                height: 5px;
                top: -4px;
        }

        /***Txt-Pedido****/


        #agregarnuevosdatosmodal .modal-header h5,
        #agregarMedioDeRetiro .modal-header h5,
        #modalEditar .modal-header h5{
                letter-spacing: 1.6px;
                font-size: 20px;
        }

        #agregarnuevosdatosmodal .modal-body p,
        #agregarMedioDeRetiro .modal-body p,
        #modalEditar .modal-body p{
                letter-spacing: 1.6px;
                font-size: 18px;
        }

        #agregarnuevosdatosmodal .modal-body label,
        #agregarMedioDeRetiro .modal-body label,
        #modalEditar .modal-body label{
                letter-spacing: 1.6px;
                font-size: 17px;
        }

/*========================================================================================*/
        /*================================ MI PEDIDO ==================================*/
/*=======================================================================================*/
        #articlesMiPedido article{
                margin-left: 10px;
                margin-bottom: 15px;
        }

        #articlesMiPedido article .data1,
        #articlesMiPedido article .data2{
                line-height: 25px;
                font-size: 14px;
                letter-spacing: 2px;
        }

        #articlesMiPedido article .data1 span,
        #articlesMiPedido article .data2 span{
                margin: 6px;
        }

        /*Detalle del Pedido*/
        #articlesPedido .retiro span{
                padding: 5px;
                margin-bottom: 10px;
                line-height: 25px;
                font-size: 13px;
                letter-spacing: 2px;
        }
}

/*Para celular*/
@media (max-width: 480px){

        /*========================================================================================*/
        /*================================ ARTICLE ==================================*/
/*=======================================================================================*/

#articles{
        width: 100%;
        height: auto;
        float: left;
/* --------------------------------- background-color: red; --------------------------------- */
}

#articles h2,
#articlesOpciones h2{
        width: 100%;
        height: 35px;
        margin-top: 0px;
        line-height: 35px;
        font-size: 20px;
        letter-spacing: 1px;    
}

#articlesProductos {
        width: 100%;
        height: auto;
}
#articlesProductos h2{
        display: inline-block;
        width: 100%;
        text-align: center;
        font-size: 20px;
        letter-spacing: 2px;    
}

/*========================================================================================*/
/*================================ Video de presentación ==================================*/
/*=======================================================================================*/
#contenedor .CajaVideo{
        display: none; /*<---- Para ocultar el video */
}

/*========================================================================================*/
        /*================================ INICIO ==================================*/
/*=======================================================================================*/

        /*----- INFORMACIÓN -----*/
        #contenido{
                width: 100%;
        }
        .imagen{
                margin: auto;
                width: 100%;
        }

        /*--IMAGEN--*/
        .imagen  .img1{
                width: 100%;
                margin-bottom: 15px;
        }

        /*----- Productos -----*/
        #productos{
                width: 100%;
        }

        .frente span{
                left: 199px;
                top:25px;
                font-size: 15px;
                padding-left: 3px;
                padding-right: 3px;
        }

        .frente p{
                width: 98%;
                font-size: 17px;
                top:200px;
        }

        .lado h1{
                width: 250px;
                padding-top: 10px;
                padding-bottom: 5px;
                font-size: 18px;
                letter-spacing: 2px;
        }

        .atras p{
                width: 242px;
                font-size: 16.5px;
                letter-spacing: 2px;
        }

/*========================================================================================*/
        /*================================ PRODUCTOS ==================================*/
/*=======================================================================================*/
        /*----- MENU PRODUCTOS -----*/
        #menu_productos{
                width: 100%;
                text-align: center;
        }

        .menuPro{
                width: 250px;
                height: 30px;
                line-height: 30px;
                margin-right: 5px;
                margin-bottom: 10px;
                border-radius: 25px;         
        }

        .menuPro .caja_producto{
                width: 100%;
                height: 25px;       
        }

        .menuPro .caja_producto p{
                font-size: 18px;
                font-weight: bold;
        }

/*----- CAJAHIJO -----*/
        #cajaPadre {
                display: block;
                text-align: center;
        }
        #cajaPadre .caja{
                width: auto;
                height: 128px;
        }

        /*----- TEXTO -----*/
        #cajaPadre .caja p{
                top:-15px;
                font-size: 18px;
                letter-spacing: 4px;
        }

        /*----- IMAGEN -----*/
        #cajaPadre .caja a img{
                margin: auto;
                margin-left: 0px;
        }

        #cajaPadre .caja img{
                margin: auto;
                margin-left: 0px;
        }

        .linea-H img, .linea-H-carrito img {
                width: 100%;
                margin: initial;
            }

            #producto{
                text-align: center;
            }
/*========================================================================================*/
        /*================================ HISTORIA ==================================*/
/*=======================================================================================*/
        #foto-1{
                width: 100%;
                height: auto;
        }

        #foto-1 img,
        #foto-2 img{
                width: 100%;
                height: auto;
        }

        #foto-2{
                width: 100%;
                height: auto;
                padding-top: 10px;
                padding-bottom: 10px;
        }

/*========================================================================================*/
        /*================================ CONTACTO ==================================*/
/*=======================================================================================*/
      #articles article h4{
                font-size: 23px;
                letter-spacing: 2px;
                margin-top: 15px;
        }
        #articles article{
                width: 100%;
                height: auto;
        }

        .linea-H{
                width: auto;
                height: 5px;
                top: -10px;
                text-align: -webkit-center;
        }

        #cajaPadre-correo p,
        #cajaPadre-correo p{
                font-size: 18px;
                letter-spacing: 4px;
        }

/*========================================================================================*/
        /*================================ ADMINISTRACION Y VENTAS ==================================*/
/*=======================================================================================*/
        .formulario{
                width: 100%;
                height: auto;
        }

        .formulario label{
                width: 100%;
                text-align: center;
                margin-left: 0px !important;
        }

        .formulario .nombre,
        .formulario .apellido,
        .formulario .cuit,
        .formulario .email,
        .formulario .localidad,
        .formulario .telefono,
        .formulario .asunto,
        .formulario .mesaje,
        .formulario .descuento,
        .formulario .password{
                width: 100%;
                height: 35px;
                margin-bottom: 10px;
                margin-left: 0px !important;
                text-align: center;
        }
        .textarea-Rubros{
                width: 435px;
                margin-bottom: 15px;
                margin-left: 33px;
                padding-left: 6px;
                background-color: teal;
        }
        .textarea-Rubros .rubro{
                width: 430px;
        }

        /*------ INICIO --- Mensaje ------*/
        .textarea-msj{
                width: 100%;
        }

        .textarea-msj p{
                margin-left: 0px !important;
                margin-bottom: 10px;
                font-weight: bold;
                text-align: center;
        }

        .textarea-msj .mesaje{
                width: 100%;
                height: 250px;
                text-align: center;
                margin-top: -5px !important;
                margin-left: 0px;
        }

/*========================================================================================*/
        /*================================ LISTAS ==================================*/
/*=======================================================================================*/
    /*TODOS LOS PRODUCTOS*/
    #productos .CajaPadre-L{
        border-radius: 25px;
        width: 100%;
        margin: auto;
        margin-top: 5px;
        margin-bottom: 15px;
    }

    /*CAJA PADRE*/
    .CajaPadre-L .data{
        top: -2px;
        border-radius: 25px;
        height: auto;
        margin-bottom: 5px;
        line-height: 6px;
    }
/*CAJA PADRE*/
    .CajaPadre-L .data{
        width: 90%;
    }

    /*CAJA 1 */
    .CajaHijo-L .Caja1{
        width: 60%;
        margin-bottom: 5px;
    }

    /*CAJA 2*/
    .CajaHijo-L .Caja2{
        display: block;
        width: 40%;
        float: left;
        margin-bottom: 5px;
    }

    /**CAJA 3**/
    .CajaHijo-L .Caja3{
        display: block;
        width: 40%;
        float: right;
        margin-right: 5px;
        margin-left: 5px;
    }

    /**CAJA 4**/
    .CajaHijo-L .Caja4{
        display:none;
    }

    /**CAJA 5**/
    .CajaHijo-L .Caja5{
        display:inline-block;
        width: 40%;
        margin-right: 5px;
        margin-left: 5px;
        margin-bottom: 5px;
    }

/*========================================================================================*/
        /*================================ MI PEDIDO ==================================*/
/*=======================================================================================*/
        #articlesMiPedido article{
                width: 100%;
                margin-left: 10px;
                margin-bottom: 15px;
                text-align: center;
        }

        #articlesMiPedido article .data1,
        #articlesMiPedido article .data2{
                line-height: 25px;
                font-size: 14px;
                letter-spacing: 2px;
        }

        #articlesMiPedido article .data1 span,
        #articlesMiPedido article .data2 span{
                margin: 6px;
        }

}