* {
	box-sizing: border-box;
	font-family: -apple-system, BlinkMacSystemFont, "segoe ui", roboto, oxygen, ubuntu, cantarell, "fira sans", "droid sans", "helvetica neue", Arial, sans-serif;
	font-size: 12px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
body {}
a {color: inherit;text-decoration: inherit;}
section {border: 1px solid #00000047;margin-bottom: 10px;padding: 5px;border-radius: 10px;}
input {border-radius: 5px;}
.row {
	position: relative;
	width: 100%;
	display:inline-block;
	height: auto;
}
.col {
	float: left;
	width: auto;
	display: block;
	height: auto;
}
.login {
	width: 400px;
	background-color: #ffffff;
	box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.3);
	margin: 100px auto;
}
.login h1 {
	text-align: center;
	color: #5b6574;
	font-size: 24px;
	padding: 20px 0 20px 0;
	border-bottom: 1px solid #dee0e4;
}
.login form {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding-top: 20px;
}
.login form label {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 50px;
	height: 50px;
	background-color: #3274d6;
	color: #ffffff;
}
.login form input[type="password"], .login form input[type="text"] {
	width: 310px;
	height: 50px;
	border: 1px solid #dee0e4;
	margin-bottom: 20px;
	padding: 0 15px;
}
.login form input[type="submit"] {
	width: 100%;
	padding: 15px;
	margin-top: 20px;
	background-color: #3274d6;
	border: 0;
	cursor: pointer;
	font-weight: bold;
	color: #ffffff;
	transition: background-color 0.2s;
}
.login form input[type="submit"]:hover {
	background-color: #2868c7;
		transition: background-color 0.2s;
}
.top-menu-normal-btn {
	padding: 7px 8px;
	background: #1c4a9e;
	color: #fff;
	border-radius: 12px;
}
.top-menu-logout-btn {
	padding: 7px 8px;
	background: #e51919;
	color: #fff;
	border-radius: 12px;
}

#hora {font-size: 15px;font-weight: bold;font-family: sans-serif;}
.title_categorie {width: 100%;padding: 10px 20px;font-weight: bold;font-size: 14px;background: #f1f1f1;}
.title_supermarket {width: 100%;background: #790000a1;padding: 4px 13px;color: #fff;font-size: 20px;font-family: cali;border-radius: 5px;margin-bottom: -8px;}
.btn_select_product {position: absolute;bottom: 0;left: 19px;background: #f7fff5;border-radius: 10px;}
.btn_remove_product {position: absolute;bottom: 0;left: 0;background: #a50000;color:#fff;border-radius: 0px 10px 10px 0px;cursor: pointer;}
.btn_visit_product {position: absolute;top: 0;left: 0;background: #f7fff5;border-radius: 0px 4px 10px;padding: 5px;border: 1px solid #f1f1f1;}
.product_general_resume {width:33%;}
.task_options_link {position: absolute;bottom:0;padding: 10px 20px;background: #fff;border: 1px solid #aba7a7;}
.supermarket_name {position: absolute;border-radius: 0px 0px 0px 10px;padding: 5px;border: 1px solid #f1f1f1;}

/* ASOCIATE PRODUCTS*/
.btn_select_product_to_asociate{position: absolute;bottom: 0;left: 19px;background: #f7fff5;border-radius: 10px;}
.btn_select_product_to_asociate_already{position: absolute;bottom: 0;left: 19px;background: #a50000;color:#fff;border-radius: 10px;}
.btn_select_product_to_asociate_waiting {position: absolute;bottom: 0;left: 19px;background: #fff700;color:#000;border-radius: 10px;}

/* CART STYLE */

.remove_item {padding: 17px 2px;background: #f00;border-radius: 5px 5px 5px 5px;color: #fff;opacity: 0.5;cursor: pointer;}

.adding_cart_div {width: 50%;top: 0;right: 0;height: 100%;z-index: 10;background: #d6d6d6;position: absolute;}
.btn_add_to_cart {position: absolute;left: 100px;top: 0;background: #fff;border: 0px;padding: 2px;border-radius: 50%;cursor: pointer;}
.btn_add_to_cart i {font-size: 1em;color: #1abb68;border: 3px solid #1abb68;padding: 5px;border-radius: 50%;}
.btn_add_to_cart i.active {color: #125a35; border-color: #125a35;}
.item_in_cart {border-bottom: 1px solid #d0d0d0;padding: 10px 5px;}
.buy_btn {right: 10px;background: #9c4949;border-radius: 5px;color: #fff;padding: 4px 6px;position: absolute;}


.btn_config_product {position: absolute;left: 103px;bottom: 0;background: #fff;border: 0px;padding: 2px;border-radius: 50% 0;cursor: pointer;}
.btn_config_product i {font-size: 1.2em;color: #ff0101;padding: 5px;border: 1px solid #ff0101;border-radius: 10px 0px 0px 0px;border-width: 1px 0px 0px 1px;}
.reduce_quantity_cart{padding: 0px 5px 0px 5px;;background: #fff;border: 2px solid #f00;border-radius: 5px;font-weight: bold;font-size: 1.2em;color: #f00;cursor:pointer;margin-top: 4px;}
.increase_quantity_cart{padding: 0px 5px 0px 5px;;background: #fff;border: 2px solid #0cb529;border-radius: 5px;font-weight: bold;font-size: 1.2em;color: #0cb529;cursor:pointer;}
.disabled {opacity: 0.3;cursor:not-allowed !important;}
.quantity_add_to_cart {font-size: 1.6em;font-weight: 500;}
.view_add_cart_actual_stock {font-size: 1.2em;font-weight: 500;}
.view_add_cart_sugerido_stock {font-size: 1.2em;font-weight: 500;}
.view_add_cart_info_dif_stock {font-size: 1.2em;}
.title_stock_view_product_cart {font-size: 1em;}


.side_bar_container {width: 20%;position: fixed;top: 0;right: 0;background: #d0d0d0;height: 100%;z-index: 1000;}
.cart_container {width: 95%;margin: 2.5%;background: #fff;border-radius: 5px;overflow: auto;height: 70%;}
.title_cart_total {width: 95%;margin: 2.5% 2.5% 0px 2.5%;background: #fff;border-radius: 5px 5px 0px 0px;overflow: auto;height: 20px;overflow: hidden;}
.cart_total {width: 95%;margin: 0px 2.5% 0px 2.5%;background: #fff;border-radius: 0px 0px 5px 5px;overflow: auto;height: 40px;overflow: hidden;}
.show_modal_progress{width: 40px;height: 40px;position: fixed;z-index: 1000;border: 2px solid;background: #637eaf;border-radius: 10px 0px 0px 10px;color: #fff;cursor: pointer;}
.open_side_bar_btn{width: 40px;height: 40px;position: fixed;top: 20px;right: 0;z-index: 1000;border: 2px solid #f5cf18;background: #e2a701;border-radius: 10px 0px 0px 10px;color: #fff;}
.open_side_bar_btn i {font-size: 30px;}

.resumen_product_product_name {font-family: revert;font-size:1.2em;padding: 0px 10px;}
.resumen_product_brand {font-family: revert;font-size:1.2em;padding: 0px 10px;}
.close_side_bar_btn {position: absolute;top: 5px;height: 45px;left: 10px;background: #fff;border: 0;}
.close_side_bar_btn i {font-size: 30px;}
.cart_number_alert {position: absolute;left: -16px;font-size: 1.2em;top: -10px;background: #d20000;border-radius: 50%;padding: 3px 7px;}

.top_menu_bar {position: fixed;z-index: 1;background: #fff;padding: 0px;left:0;top:0;border: 0;}
#options_cart_continue {position: absolute;height: 100%;background: #128603;width: 95%;border-radius: 5px;z-index: 1;display: none;}
#options_cart_continue button {display: block;background: #fff;border: 1px solid #fff;border-radius: 5px;padding: 5px 10px;width: 70%;margin: 0px auto 10px auto;cursor: pointer;}

.notif_cart {position: absolute;top: 17px;right: 18px;background: #53b77294;border-radius: 5px;color: #fff;padding: 3px 7px;}
.notif_progress {position: absolute;top: 9px;left: 18px;background: #53b77294;border-radius: 5px;color: #fff;padding: 3px 7px;}


.modal_progress {display: block;width: 100%;position: fixed;z-index: 10000;background: #dcdcdcd9;height: 100%;top: 0;padding-top: 20px;}
.modal_progress iframe {display:block;margin: auto; width: 95%;height: 95%;background: #fff;border: 0;border-radius: 5px;}


.tutorial {
  width: 100%;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  background-color: #f9f9f9;
  overflow-x:auto;
}
.tutorial .slider {
  width: 100%;
  height: 300px;
  background-color: #F03861;
}
.tutorial .information {
  width: 100%;
  padding: 20px 50px;
  margin-bottom: 30px;
  font-family: "Open Sans", sans-serif;
}
.tutorial .information h1 {
  color: #333;
  font-size: 1.5rem;
  padding: 0px 10px;
  border-left: 3px solid #F03861;
}
.tutorial .information h3 {
  color: #e0e0e0;
  font-size: 1rem;
  font-weight: 300;
  padding: 0px 10px;
  border-left: 3px solid #F03861;
}
.tutorial .information p {
  padding: 10px 0px;
}
.tutorial ul {
  font-size: 0;
  list-style-type: none;
  white-space: nowrap;
  margin-left: -30px;
}
.tutorial ul li {
  font-family: "Open Sans", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  color: #333;
  display: inline-block;
  padding: 15px;
  position: relative;
}
.tutorial ul li ul {
  display: none;
}
.tutorial ul li:hover {
  cursor: pointer;
  background-color: #f2f2f2;
}
.tutorial ul li:hover ul {
  display: block;
  margin-top: 15px;
  width: 200px;
  left: 0;
  position: absolute;
}
.tutorial ul li:hover ul li {
  display: block;
  background-color: #e7e7e7;
}
.tutorial ul li:hover ul li span {
  float: right;
  color: #f9f9f9;
  background-color: #F03861;
  padding: 2px 5px;
  text-align: center;
  font-size: 0.8rem;
  border-radius: 3px;
}
.tutorial ul li:hover ul li:hover {
  background-color: #e0e0e0;
}
.tutorial ul li:hover ul li:hover span {
  background-color: #ee204e;
}
.tutorial ul li.active {background: #e6e6e6;}
.top_menu_mobile {width: 100%;display: block;}


@media only screen and (min-width: 1px) {
  /* For mobile phones: */
  #container_products_list {width: 100%;}
  .top_menu_bar {width: 100%;}
  .product_general_resume {width: 100%;}
  .product_general_resume_asociate {width: 100%;}
  .initial_family_image {width: 98%;}
  .tareas_opciones_container {width: 98%;margin: 0 auto;}
  .side_bar_container {width: 100%;display: none;}
  .close_side_bar_btn{display: block;}
  .open_side_bar_btn{display: block;}
  .show_modal_progress{top: 60px;right: 0;}
  .modal_progress iframe {width: 95%;}
}
@media only screen and (min-width: 550px) {
  /* For mobile phones: */
  #container_products_list {width: 100%;}
  .top_menu_bar {width: 100%;}
  .initial_family_image {width: 48%;}
  .tareas_opciones_container {width: 50%;margin: 0 auto;}
  .side_bar_container {width: 100%;display: none;}
  .close_side_bar_btn{display: block;}
  .open_side_bar_btn{display: block;}
  .show_modal_progress{top: 60px;right: 0;}
  .modal_progress iframe {width: 92%;}
}
@media only screen and (min-width: 750px) {
  /* For mobile phones: */
  #container_products_list {width: 50%;}
  .top_menu_bar {width: 50%;}
  .product_general_resume {width: 100%;}
  .product_general_resume_asociate {width: 100%;}
  .initial_family_image {width: 31%;}
  .tareas_opciones_container {width: 31%;margin: 0 auto;}
  .side_bar_container {width: 50%;display: block;}
  .close_side_bar_btn{display: none;}
  .open_side_bar_btn{display: none;}
  .show_modal_progress{top: 60px;right: 50%;}
  .modal_progress iframe {width: 75%;}
}
@media only screen and (min-width: 990px) {
  /* For mobile phones: */
  #container_products_list {width: 60%;}
  .top_menu_bar {width: 60%;}
  .product_general_resume {width: 50%;}
  .product_general_resume_asociate {width: 100%;}
  .initial_family_image {width: 31%;}
  .tareas_opciones_container {width: 31%;margin: 0 auto;}
  .side_bar_container {width: 40%;display: block;}
  .close_side_bar_btn{display: none;}
  .open_side_bar_btn{display: none;}
  .show_modal_progress{top: 60px;right: 40%;}
  .modal_progress iframe {width: 70%;}
}

@media only screen and (min-width: 1250px) {
  /* For mobile phones: */
  #container_products_list {width: 70%;}
  .top_menu_bar {width: 70%;}
  .product_general_resume {width: 33.3%;}
  .product_general_resume_asociate {width: 100%;}
  .initial_family_image {width: 31%;}
  .tareas_opciones_container {width: 31%;margin: 0 auto;}
  .side_bar_container {width: 30%;display: block;}
  .close_side_bar_btn{display: none;}
  .open_side_bar_btn{display: none;}
  .show_modal_progress{top: 60px;right: 30%;}
  .modal_progress iframe {width: 65%;}
}

@media only screen and (min-width: 1800px) {
  /* For mobile phones: */
  #container_products_list {width: 80%;}
  .top_menu_bar {width: 80%;}
  .product_general_resume {width: 25%;}
  .product_general_resume_asociate {width: 50%;}
  .initial_family_image {width: 31%;}
  .tareas_opciones_container {width: 31%;margin: 0 auto;}
  .side_bar_container {width: 20%;display: block;}
  .close_side_bar_btn{display: none;}
  .open_side_bar_btn{display: none;}
  .show_modal_progress{top: 60px;right: 20%;}
  .modal_progress iframe {width: 50%;}
}