/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 22/08/2022, 11:50:14
    Author     : Omar Flores
*/
*{box-sizing: border-box;font-family:Arial, Helvetica, sans-serif}
.logo{font-family: Bradley Hand ITC;font-size: 30px;color: #000080;font-weight: bold;text-shadow: 1px 1px #00c6fb;}
.caja-mnu-principal{display: flex;justify-content: space-between;align-items: center;width: 100%;padding: 1%;background-image: linear-gradient(to top, #00c6fb 0%, #005bea 100%);}
.caja-submnu-principal{display: flex;justify-content: flex-start;align-items: center;width: 25%}
.caja-mnu-menu{display: flex;justify-content: space-around;align-items: center;width: 40%;}
.caja-mnu-menu-updt{display: block;width: 40%;}
.caja-mnu-menu-left {display:none; width:45%}
.caja-mnu-menu-right{display:flex;width:100%;align-items:center;justify-content:space-around}
.caja-mnu-menu-on{display: flex};
.caja-mnu-menu-off{display: none};
.opcion-menu{color:#fff;background: transparent;font-size:16px;cursor:pointer}
.opcion-menu-a{color:#fff;background: transparent;font-size:16px;cursor:pointer;text-decoration: none;border: none;}
.opcion-menu:hover{color: #000080;}
.noreg{display: none;}
.fa-letra{font-size: 20px}
/*
    Cuando el usuario hace login
*/
.opcion-menu-login{position: relative;display:flex;justify-content:flex-start;align-items:center;color:#fff;background: transparent;font-size:16px;cursor:pointer;min-width:45%}
.fa-letra-login{color:#fff;font-size: 20px;margin-right:5px}
.caja-mnu-login {display:none;position: absolute;width: 102%;top: 110%;left:-1px;color: #000080;background: #fff;border: #00c6fb solid 1px;}
.op-mnu-login{padding: 5%;text-align: left;}
.op-mnu-login:hover{background:#1a73e8;color:#fff}
.op-mnu-login-btn {width: 100%;background: transparent;border: none;font-size: 16px;color: #000080;text-align:left;padding: 0}
.op-mnu-login-btn:hover{color: #fff;}
/*
    FIN .... Cuando el usuario hace login
*/


.img-mnu-logo {width: 100%;object-fit: fill;float: left;margin-right: 15px;border-radius: 5px;}
.btn-mnu-main-responsive{display:none;background: transparent;border: none;color: #fff;padding: 0;margin: 0 2%;font-size: 25px;}
.caja-principal{display: flex;justify-content: center;align-items: center;flex-wrap:wrap;border: none;width:70%;margin: 0 15%}
.caja-parcial{display: flex;justify-content:flex-start;align-items: center;flex-wrap:wrap;border: none;width:100%;background-image: linear-gradient(to top, #00c6fb 0%, #005bea 100%)}
.caja-titulo {
	height: 90px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	background: #fff;
	color: #000;
	border-top: solid 1px #f2f2f2;
        cursor: pointer;
        width: 100%;
}
.caja-titulo-buscar-celular{width:100%;display: none;justify-content:flex-start;align-items: center;}
.caja-btn-buscar,.caja-btn-publicaciones{border-bottom: none;margin-right: 25px}
.caja-marca-select,.caja-modelo-select{border:none;margin-right: 25px}
.select-marcas,.select-modelos{border: none;width: 100%;height: 40px;font-size: 16px;background:#fff;color:#000080;cursor:pointer}
.select-marcas option{background: #fff}
.caja-ico-celular, .caja-ico-post {
	width: 32%;
	border: none;
	display: flex;
	margin: 2% 0;
	flex-direction: column;
	border: solid 1px #f2f2f2;
}
.btn-titles{border: none;background:transparent;color:#fff;font-size: 16px;width: 100%;text-align: left;padding: 20px 10px;cursor: pointer}
.btn-titles:hover{font-weight:bold;font-size:17px;text-shadow:1px 1px #000080}
.btn-titles-activo{font-weight:bold;font-size:17px;text-shadow:1px 1px #000080}
.caja-principal-tarjetas{width:100%;display:flex;flex-wrap: wrap; justify-content:space-between;align-items: center}
.imagen {
	width: 100%;
	object-fit: fill;
	max-height: 205px;
}
.titulo-celular{padding: 5px;font-size: 25px;text-align: left}
.titulo-img-post{padding: 5px;font-size: 18px;text-align: left}
.subtitulo-img-post{padding:1px;font-size: 12px;text-align: right}
.img-post{width:50%;object-fit:fill;float: left;margin-right: 15px}
.caja-principal-post{position: relative;display: flex;justify-content: center;align-items: center;flex-wrap:wrap;border: solid 1px #ccc;width:60%;margin: 1% 20%}
.ico-close-post{position: absolute;top: 0;right: 0;padding:5px 10px;font-size: 30px;background: transparent;color:#595d69;cursor:pointer}
.ico-close-buscar{position: absolute;top: 0;right: 35px;padding:10px;font-size: 20px;background: transparent;color:#6c757d;cursor:pointer}
.subtitulo-post{font-size:12px}
.titulo-post{font-size:30px}
.titulo-post-acercade {width: 100%;float: left;margin-bottom: 1%;}
.caja-post{padding:10px 20px}
.caja-post-detalle{font-size:15px;text-align: justify}
.caja-buscar-blog-noticia{display:none;width: 100%}
/*.buscar-blog-noticia {display:block;background: #fff;border-radius: 50px;width: 50%;margin: 1% 25%;border:solid 1px #005bea;color:#000080;font-size: 16px;padding: 10px 20px}*/
.buscar-blog-noticia {display: flex;background: #fff;border-radius: 50px;width: 50%;margin: 1% 25%;border:solid 1px #005bea;color: #000080;font-size: 16px;position: relative;height: 40px;align-items: center;justify-content: flex-start;}
/*input{border: none;font-size: 16px; color: #000080;margin-left: 10px;outline: none;width: 93%}*/
input {border: none;font-size: 16px;color: #000080;margin-left: 10px;outline: none;width: 75%;height: 100%;}
.btn-buscar-publicacion {border: none;border-radius: 0;background: #005bea;width: 5%;height: 40px;position: absolute;top: 0;right: 0;border-top-right-radius: 50px;border-bottom-right-radius: 50px;width: 40px;cursor: pointer;}
.menu-mnu-principal {border:none;width: 100%;display: none;align-items: center;justify-content: space-around;padding: 10px;background-image: linear-gradient(to top, #cfd9df 0%, #e2ebf0 100%)}
.menu-mnu-submenu {border:none;width: 100%;display: flex;align-items: center;justify-content: space-around;padding: 10px}
.btn-mnu-main{border: none;background: transparent;color: #000080;cursor: pointer;position:relative}


.parrafoDetalle{line-height: 20px}
.caja-lateral{float: left;display: block;width: 50%;padding-top: 10px;}
.derecha {padding-left: 10px;}
.parrafoAtributoT{margin:0;padding:0;line-height: 14px;font-size:14px;font-weight:bold;color: #4c5357}
.parrafoAtributoC{margin:0;padding:0;line-height: 15px;font-size:12px;margin: 5px 0 10px;color: #4c5357}
/*
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
                aqui va el loader
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/
.loader {border: 5px solid #000080;border-radius: 50%;border-top: 5px solid #2874a6;width: 30px;height: 30px;
         -webkit-animation: spin 1s linear infinite; /* Safari */
         animation: spin 1s linear infinite;margin: 20px auto;}
/* Safari */
@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
/*
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
                fin loader
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/
#divFijo {position: fixed;bottom: 0;left: 0;width: 100%;/*background-color: #333;*/color: #fff;padding: 10px;text-align: center;display: block; /* Oculto por defecto */
            background: #F3F6F8;box-shadow: 0px -4px 8px -2px rgba(0, 0, 0, 0.1);}
        #cerrarBoton {cursor: pointer;color: #fff;font-weight: bold;}
        .txtPolicies{font-size:12px;color:rgb(32,33,36);}
        .closePolicies{position:fixed;bottom:10px;right:10px;font-size:12px;color:rgb(32,33,36);cursor: pointer;}
        
@media (max-width: 600px) {
    body{padding:0;margin:0;}
    .caja-submnu-principal{width: 44%}
    /*.caja-mnu-menu{width: 55%;justify-content:space-around;}*/
    .caja-mnu-menu{width: 40%;justify-content:flex-end;flex-direction: column;position:relative;}
    .caja-mnu-menu-left {display: flex;width:100%;justify-content:flex-end;color:#fff}
    .caja-mnu-menu-right{display: none;flex-direction: column;align-items: flex-start;position: absolute;top: 100%;left:0;color:#000080;background: #fff}
    
    .opcion-menu-a{font-size: 13px;padding: 12px;color: inherit}
    .opcion-menu{font-size: 13px;font-weight:bold;}
    .btn-mnu-main-responsive{display:block;cursor: pointer}
    .caja-principal{width: 100%;margin: 0;margin-bottom: 1%}
    .select-marcas, .select-modelos{height: 25px;font-size: 14px}
    .caja-btn-buscar,.caja-btn-publicaciones{border-bottom: none;margin: 3% 2%}
    .btn-titles{padding:0;font-size:15px}
    .btn-titles-activo{font-size:15.5px}
    .caja-ico-post{margin: 0;width: 50%;padding: 1px 2px}
    /*
    .caja-titulo{width: calc(100% - 4px);left: 2px;background: rgba(0, 0, 0, 0.4);}
    */
    .titulo-img-post{font-size: 12px;padding: 1%}
    .subtitulo-img-post{font-size: 10px}
    .buscar-blog-noticia{width: 98%;margin: 1%;font-size: 12px;height: 30px}
    input{font-size: 12px}
    .ico-close-buscar{padding: 5px;height: 30px}
    .btn-buscar-publicacion{height: 30px;width: 35px}
    .caja-principal-post{width: 100%;margin: 0}
    .ico-close-post{font-size: 20px}
    .titulo-post{font-size: 18px;font-weight: bold}
    .subtitulo-post{font-size: 12px}
    .img-post{width: 45%}
    .caja-post-detalle{font-size: 16px}
    .parrafoDetalle{line-height:22px;text-align: left}
    .caja-post{padding: 5px}
    .caja-lateral{width:40%}
    .derecha{width:60%;padding-left: 5%}
    .parrafoAtributoT{font-size: 12px}
    .menu-mnu-principal{flex-wrap: wrap;justify-content: flex-start}
    .btn-mnu-main{margin: 2%;padding:0;font-size:14px;}
    .btn-mnu-main::after{content:"";background-color: #000080;position:absolute;left:0;top:100%;width: 100%;height:3px;opacity: 0}
    .btn-mnu-main.activo::after{opacity: 1}
    .fa-letra{font-size: 14px}
    span#nombre_usuario,.op-mnu-login,.op-mnu-login-btn {font-size:12px}
    
}