*{
 margin:0;
 padding:0; 
}
.main_productos
{
 margin: 0 auto;
 width:100%;
 height:100vh;
 box-sizing: border-box;
 overflow: hidden;
 background: #f2f2f2;
}
.btn_wsp
{
  position: fixed;
  width: 55px;
  height: 55px;
  line-height: 55px;
  bottom: 30px;
  right: 30px;
  background: #0df053;
  color: white;
  border-radius: 50px;
  text-align: center;
  font-size: 30px;
  box-shadow: 0px 1px 10px rgba(0,0,0,0.3);
  z-index: 100;
}
.btn_wsp:hover
{
  text-decoration: none;
  color:#0df053;
  background: white;

}
.btn_sho
{
  position: fixed;
  width: 55px;
  height: 55px;
  line-height: 55px;
  bottom: 90px;
  right: 30px;
  background: #0d91f0;
  color: white;
  border-radius: 50px;
  text-align: center;
  font-size: 30px;
  box-shadow: 0px 1px 10px rgba(0,0,0,0.3);
  z-index: 100;
}
.btn_sho:hover
{
  text-decoration: none;
  color:#0d91f0;
  background: white;

}
.main_cuenta
{
 display: block;
 float: left;   
 width:100vw;
 height:100vh;
 overflow-x: hidden;
 background: #F8F8FF;
}
.cuerpo
{
 display: block;
 float: left;
 margin-top: 9%;
 margin-left: 30%;
 width: 40%;
 height: 60%;
 border-radius: 5px;
 border: 1px solid #D3D3D3;
 box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
 background: white;
}
.cuerpo p#titulodeta
{
 display: block;
 float: left;
 margin-left: 0.5%;
 margin-top: 0.58%;
 padding-left: 5px;
 width: 60%;
 height: 20px;
 font-weight: 600;
 font-size: 12px;
 font-family: "Open Sans", sans-serif;
 font-optical-sizing: auto;
 text-align: left;
 color:black;
}
.contenido
{
 display: grid;
 float: left;
 margin-left: 0.5%;
 margin-top: 0.5%; 
 width: 99%;
 height: 90%;
 grid-template-columns: repeat(1fr, 1fr);
 grid-auto-rows: auto;
 grid-gap: 5px;
 grid-auto-rows: minmax(auto, auto);
 background: transparent;
 overflow-y: scroll;
}
.contenido > div 
{
 border: solid #CACACA 1px;
 border-radius: 3px;
 padding: 5px;
 font-family: "Open Sans", sans-serif;
 font-optical-sizing: auto;
 background-color: white;
}
.burbuja img
{
 display: block;
 float: left;
 margin-left: 0.5%;
 width: 80px;
 height: 80px;   
 background: white;
}
.nombre
{
 display: block;
 float: left; 
 width: 82%; 
 height: auto;
 margin-left: 5px;
 font-size: 11px;
 text-align: left;
 font-family: "Open Sans", sans-serif;
 font-optical-sizing: auto;
 color:black;
 /* background: pink; */
}
.prelst
{
 display: block;
 float: left;
 width: 82%; 
 height: auto;
 margin-left: 5px;
 font-size: 14px;
 text-align: left;
 font-family: "Open Sans", sans-serif;
 font-optical-sizing: auto;
 font-weight: 600;
 color:black;
 /* background: rgb(207, 192, 255); */
}
.btn_carbot 
{
 display: block;   
 float: right;
 width: 60px;
 height: 20px;
 margin-right: 0.5%;
 margin-top: 3%;
 text-align: center;
 line-height: 30px;
 font-family: "Open Sans", sans-serif;
 font-optical-sizing: auto;
 border: 1px solid #D3D3D3 !important;
 border-radius: 3px;
}
.btn_carbor 
{
 display: block;   
 float: right;
 width: 60px;
 height: 20px;
 margin-right: 1%;
 margin-top: 3%;
 text-align: center;
 line-height: 30px;
 font-family: "Open Sans", sans-serif;
 font-optical-sizing: auto;
 border: 1px solid #FA8072 !important;
 border-radius: 3px;
}
.totales
{
 display: block;
 float: left;
 margin-top: 0.5%;
 margin-left: 30%;
 width: 40%;
 height: 10%;
 border-radius: 5px;
 border: 1px solid #D3D3D3;
 box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
 background: white;
}
.totales p#titulototal
{
 display: block;
 float: left;
 margin-left: 0.5%;
 margin-top: 0.58%;
 padding-left: 5px;
 width: 40%;
 height: auto;
 font-weight: 600;
 font-size: 12px;
 font-family: "Open Sans", sans-serif;
 font-optical-sizing: auto;
 text-align: left;
 color:black;
 /* background: red; */
}
.totales p#titulonumero
{
 display: block;
 float: left;
 margin-left: 0.5%;
 padding-left: 5px;
 width: 48%;
 height: auto;
 font-weight: 600;
 font-size: 28px;
 font-family: "Open Sans", sans-serif;
 font-optical-sizing: auto;
 text-align: left;
 color:black;
 /* background: red; */
}
.totales p#titulominim
{
 display: block;
 float: right;
 margin-top: 0.58%;
 padding-right: 5px;
 width: 48%;
 height: auto;
 font-weight: 400;
 font-size: 12px;
 font-family: "Open Sans", sans-serif;
 font-optical-sizing: auto;
 text-align: right;
 color:black;
 /* background: pink; */
}
.totales a#btn_finalizar 
{
 display: block; 
 float: right;
 margin-top: 1%;
 margin-right: 0.5%;
 width:20%;
 height: 30px;
 text-align: center;
 line-height: 2;
 font-size: 12px;
 border-radius: 2px;
 border:1px solid #0000FF;
 background: #0000FF;
 color:white;
}
@media only screen and (min-device-width : 320px) and (max-device-width : 480px)
{
 .btn_wsp
 {
  bottom: 20px;
  right: 10px;
 }
 
 .cuerpo
 {
  margin-top: 25%;
  margin-left: 0.5%;
  width: 99%;
  height: 60%;
 }
 .totales
 {
  margin-top: 0.5%;
  margin-left: 0.5%;
  width: 99%;
 }
 .totales a#btn_finalizar 
 {
  margin-right: 1%;
  width:40%;
 }

}