@font-face {
    font-family: "calibri";
    src: url('/font/calibri-regular.ttf');
}

body {
    font-family: 'calibri';
    font-size: 62.5%;
    text-align: center;
}

pre {
    font-size: 20px;
    font-size: 2.0rem;
    text-align: left;
    display: inline-block;
    margin: 0 auto;
}

body.caisse button,
body.caisse select {
    background-color: #03989e;
    color: white;
}

.green {color: green;}
.red {color: red;}

#menu {
    margin: 0;
}

#menu > a {
    float: left;
    cursor: pointer;
    display: block;
}

#menu .user {
    float: right;
    height: 50px;
    font-size: 20px;
    font-size: 2.0rem;
    line-height: 50px;
    margin-right: 15px;
    color: #03989e;
    font-weight: bold;
}

#menu > a > .button {
    margin: 0 5px;
    border-left: 3px solid black;
    border-top: 3px solid black;
    border-right: 3px solid black;
    border-radius: 20px 20px 0 0;
    background-color: lightgrey;
}

#menu.basket > #basket > .button {
    border-bottom: 3px solid white;
    background-color: #FFFFFF;
}

#menu.register > #register > .button {
    border-bottom: 3px solid white;
    background-color: #FFFFFF;
}

#menu.edit > #edit > .button {
    border-bottom: 3px solid white;
    background-color: #FFFFFF;
}

#menu.shopping > #shopping > .button {
    border-bottom: 3px solid white;
    background-color: #FFFFFF;
}

#menu.payslip > #payslip > .button {
    border-bottom: 3px solid white;
    background-color: #FFFFFF;
}

#menu.export > #export > .button {
    border-bottom: 3px solid white;
    background-color: #FFFFFF;
}

#menu.history_click > #history_click > .button {
    border-bottom: 3px solid white;
    background-color: #FFFFFF;
}

#menu.secure > #secure > .button {
    border-bottom: 3px solid white;
    background-color: #FFFFFF;
}

#menu .user img {
    width: 35px;
    vertical-align: sub;
    cursor: pointer;
}

#content {
    border-top: 3px solid black;
    margin: 6px;
}

#content #basket_list_product {
    float: left;
    clear: both;
}

#content #basket_content_take,
#content #basket_content_donation,
#content #basket_content_contribution,
#content #basket_content_entry {
    float: right;
    border-left: 1px solid black;
}

#content #basket_content_basket {
    float: right;
}

#content #basket_content_basket.left {
    float: left;
    clear: both;
}

#content #basket_list_product .product,
#content #basket_content_basket .product {
    border: 2px solid black;
    border-radius: 10px;
    margin-bottom: 3px ;
    padding: 1px;
    cursor: pointer;
}

#content #basket_list_product .product .text {
    background-color: white;
    width: 90%;
    margin: 0 auto;
    border-width: 0 2px 0 2px;
    border-color: black;
    border-style: solid;
    position: relative;
    text-align: left;
}

#content #basket_list_product .product .text .name {
    padding-left: 10px;
}

#content #basket_list_product .product .text .price {
    position: absolute;
    right: 0;
    padding-right: 10px;
}

#content #basket_list_product > div > div:hover,
#content #basket_content_basket > div > div:hover {
    background-color: lightblue;
}

#content #basket_list_product .title h1 {
    display: inline-block;
}

#content #basket_list_product .title img {
    border: 2px solid black;
    border-radius: 10px;
    cursor: pointer;
    float: right;
}

#content #basket_list_product .title.nosort img {
    background: #F0FFF0;
}

#content #basket_list_product .title.price img#sort_by_alpha {
    background: lightGrey;
}

#content #basket_list_product .title.price img#sort_by_price {
    background: lightGreen;
}

#content #basket_list_product .title.alpha img#sort_by_alpha {
    background: lightGreen;
}

#content #basket_list_product .title.alpha img#sort_by_price {
    background: lightGrey;
}

#content #basket_content_basket .button button,
.button.block button {
    width: 100%;
}

#list_ticket {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

#list_ticket .element {
    border: 1px solid black;
    width: 350px;
    height: 115px;
    padding: 10px;
}

#list_ticket .element .ticket {
    height: 50px;
    padding: 8px 0 8px 0px;
    border: 1px solid black;
    border-radius: 20px;
    cursor: pointer;
    line-height: 50px;
    font-size: 14px;
    font-size: 1.4rem;
    margin-top: 6px;
}

#list_ticket .price {
    align-items: center;
    justify-content: center;
    font-size: 50px;
    font-size: 2.0rem;
    text-align: center;
    margin-top: 6px;
}

#list_ticket .price input {
    width: 100px;
    font-size: 16px;
    font-size: 1.6rem;
}

#list_ticket .price img {
    width: 29px;
    vertical-align: bottom;
    cursor: pointer;
    vertical-align: sub;
    margin-left: 10px;
}

.remove_ticket {
    margin-top: 30px;
    border-top: 1px solid black;
}

.remove_ticket .list_products {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.remove_ticket .list_products .product {
    font-size: 14px;
    font-size: 1.4rem;
    border: 1px solid black;
    border-radius: 10px;
    padding: 5px 20px;
}

.remove_ticket p {
    font-size: 12px;
    font-size: 1.2rem;
    font-style: italic;
    color: #555555;
}

.list_tickets_for_print {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
}

#edit_list_print_ticket .ticket,
.list_tickets_for_print .ticket_for_print {
    text-align: center;
    width: 347px;
    height: 50px;
    line-height: 50px;
    padding: 8px 0;

    border: 1px solid black;
    border-radius: 20px;
    vertical-align: middle;
    cursor: pointer;
    font-size: 14px;
    font-size: 1.4rem;
}

#edit_list_print_ticket .ticket {
    margin: 0 auto;
}

#edit_list_print_ticket .param_cols_rows {
    font-size: 14px;
    font-size: 1.4rem;
}

#edit_list_print_ticket .param_cols_rows span {
    font-weight: bold;
}

#edit_list_print_ticket .param_cols_rows img {
    width: 32px;
    vertical-align: middle;
    cursor: pointer;
}

#edit_list_print_ticket table.print_page {
    margin: 0 auto;
    height: 300px;
    width: 212px;
    border: 1px solid black;
    padding: 10px;
}

#edit_list_print_ticket table.print_page td {
    border: 1px solid #888888;
    border-radius: 5px;
    font-size: 6px;
    font-size: 0.6rem;
}

.edit_print {
    display: flex;
    justify-content: center;
    gap: 20px;
}

.edit_print .block {
    width: 40%;
    border: 1px solid black;
    margin: 20px 0;
    padding-bottom: 20px;
}

.message .ticket {
    padding: 0;
    margin: 0 4px 4px 0;
    border: 1px solid black;
    border-radius: 15px;
    display: inline-block;
}

.message button {
    display: block;
    margin: 0 auto;
    padding: 0 20px;
    cursor: pointer;
    margin-top: 20px;
}

.message button.opened {
    display: block;
    width: 100%;
}

button.cancel {
    background-color: red;
}

#content .edit.button {
    padding-top: 30px;
}

#content .edit.button button,
#content .shopping .add_think_to_by button {
    display: block;
    width: 40%;
    margin: 0 auto 10px auto;
}

#content .shopping .add_action button,
#content .shopping .delete button {
    display: block;
    margin: 10px auto 6px auto;
    padding: 10px 15px;
    cursor: pointer;
}

#content .title_shopping h1 img {
    width: 60px;
    vertical-align: bottom;
    cursor: pointer;
}

#content .shopping .qr_code {
    margin-top: 50px;
}

#list_ticket br,
#edit_list_product .category br {
    clear: both;
}

#list_ticket .ticket img {
    height: 50px;
}

#actions {
    float:left;
    width: 100%;
    border-top: solid black 1px;
    padding-top: 30px;
}

table.register {
    clear: both;
    margin: 50px auto;
    font-size: 14px;
    font-size: 1.4rem;
    border-collapse: collapse;
    border: 4px solid black;
    width: 90%;
}

table.register > tbody > tr > th,
table.register > tbody > tr > td {
    border: 2px solid black;
    padding: 0 10px;
}

table.command {
    border-collapse: collapse;
    width: 100%;
    margin-top: 10px;
}

table.command > tbody > tr > th,
table.command > tbody > tr > td {
    border: 1px solid black;
    padding: 0 10px;
}

table.command > tbody > tr > th {
    width: 1000px;
    font-weight: normal;
    text-align: right;
    padding-right: 10px;

}
table.register > tbody > tr > td.command {
    width: 1000px;
}

table.register > tbody > tr > .command img {
    width: 32px;
    vertical-align: bottom;
    cursor: pointer;
}

table.register .bill {
    text-align: right;
    margin: 0 2px 10px 0;
}

table.register > tbody > tr > td.command table.command {
    float: right;
}

table.register > tbody > tr > td.command:hover .show {
    text-decoration: underline;
}

table.register > tbody > tr > td.command .name {
    font-weight: bold;
}

table.register > tbody > tr.total {
    border: 4px solid black;
}

table.register > tbody > tr.total th {
    text-align: right;
    font-size: 20px;
    font-size: 2.0rem;
}

table.register > tbody > tr.total td {
    font-size: 20px;
    font-size: 2.0rem;
    font-weight: bold;
}

table.register .donation {
    color: grey;
}

table.register button {
    margin: 5px 5px 15px 5px;
    padding: 0 20px;
}

table.register button.yes {
    background: red;
}

#content #edit_list_product,
#content #category_sortable,
#content .list_user {
    font-size: 16px;
    font-size: 1.6rem;
}

#content .list_user .name {
    border: 1px solid black;
    width: 80%;
    margin: 10px auto 10px auto;
}

#content .list_user .name input {
    text-align: center;
    width: 99%;
    font-size: 16px;
    font-size: 1.6rem;
}

#content #edit_list_product .category {
    margin-bottom: 10px;
}

#content #edit_list_product .product,
#content #edit_list_product .title_product,
#content #category_sortable .category {
    clear: both;
    border: 1px solid black;
    border-radius: 10px;
    margin-bottom: 5px;
}

#content #edit_list_product .handle,
#content #edit_list_category .handle {
    float: left;
    text-align: left;
    background: no-repeat url("/img/move.png") center center;
}

#content #edit_list_product .nohandle {
    float: left;
    text-align: left;
}

#content #edit_list_product .name,
#content #edit_list_category .name {
    float: left;
    width: 38%;
    text-align: left;
}

#content #edit_list_product .title_product,
#content #edit_list_product .product {
    height: 52px;
}

#content #edit_list_product .title_product .name,
#content #edit_list_product .title_product .price,
#content #edit_list_product .product .name,
#content #edit_list_product .product .price,
#content #edit_list_product .product .forsale {
    line-height: 52px;
}

#content #edit_list_product .title_product .ticket,
#content #edit_list_product .product .ticket {
    line-height: 42px;
}

#content #edit_list_product .product .handle {margin-top: 11px;}
#content #edit_list_product .product .forsale input {margin: 9px 0 0 0;}

#content #edit_list_product .name input {
    text-align: left;
    width: 100%;
    font-size: 16px;
    font-size: 1.6rem;
}

#content #edit_list_product div.price {
    width: 20%;
    float: left;
}

#content #edit_list_product div.ticket {
    width: 30%;
    float: left;
    border-radius: 10px;
    margin-top: 3px;
}

#content #edit_list_product div.ticket img {
    width: 20px;
}

#content #edit_list_product div.ticket img.btn,
#content #edit_list_product div.price img.btn {
    width: 30px;
    margin: 0 0 3px 10px;
    vertical-align: bottom;
}

#content #edit_list_product div.ticket input,
#content #edit_list_product div.price input {
    width: 40%;
    font-size: 16px;
    font-size: 1.6rem;
    text-align: center;
}

#content #edit_list_ticket .edit_ticket {
    font-size: 14px;
    font-size: 1.4rem;
}

#content #edit_list_ticket .edit_ticket .text input {
    text-align: center;
}

#content #edit_list_ticket .print_ticket {
    display: flex;
    justify-content: center;
    gap: 20px;
}

#content #edit_list_ticket .print_ticket .box {
    width: 40%;
    height: 200px;
    justify-content: center;
}

#content #edit_list_ticket .print_ticket .box h2 {
    display: inline-block;
}

#content #edit_list_ticket .print_ticket .box .ticket {
    display: block;
    height: 100px;
    border: 1px solid black;
    border-radius: 20px;
    line-height: 100px;
    font-size: 20px;
    font-size: 2.0rem;
}

#content #edit_list_ticket .button_ticket {
    height: 60px;
    font-size: 16px;
    font-size: 1.6rem;
    border-bottom: 1px solid black;
}

#content .add_ticket {
    padding-top: 20px;
}

#content #edit_list_ticket .button_ticket button,
#content .remove_ticket button,
#content .add_ticket button {
    font-size: 16px;
    font-size: 1.6rem;
    padding: 5px 20px;
    margin: 5px 10px 0 0;
}

#content #edit_list_ticket .button_ticket button.ok {
    background-color: lightGreen;
}

#content button.remove {
    background-color: red;
}

#content #edit_list_ticket .button_ticket button.ko {
    background-color: lightGrey;
}

#content #edit_list_product .forsale {
    width: 8%;
    float: left;

}

#content #edit_list_product .forsale input {
    width: 32px;
    height: 32px;
    padding: 0;
}

#content #edit_list_product .forsale img {
    width: 42px;
    height: 42px;
    margin-bottom: -8px;
    margin-left: 4px;
    cursor: pointer;
}

#content #edit_list_product .category-so15able {
}

#content .list_envelope button {
    width: 90%;
    margin: 30px auto;
    padding: 50px 0;
}

.show {
    margin-left: 32px;
}

.show:hover {
}

#cash_question_money img {
    cursor: pointer;
}

#basket_content_take h1,
#basket_content_donation h1,
#basket_content_contribution h1,
#basket_content_entry h1 {
    padding-bottom: 20px;
}

#basket_content_take h1 img,
#basket_content_donation h1 img,
#basket_content_contribution h1 img,
#basket_content_entry h1 img {
    vertical-align: bottom;
    cursor: pointer;
}

#taked {
    border: 1px solid black;
}

#taked, #cash_question_money .button.block {
    margin-left: 14px;
}

#cash_question_check h1 {
    padding-bottom: 0 !important;
}

.receive,
.receive_entry {
    border: 1px solid black;
    font-weight: bold;
    clear: both;
}

.receive {
    margin: 0 auto 10px 14px;
}

.receive_entry {
    margin: 0 auto 0 14px;
}

.keyb,
.keyb_entry {
    margin-left: 14px;
}

.keyb .small, .keyb .large,
.keyb_entry .small, .keyb_entry .large {
    float: left;
}

.keyb .small {
    width: 33.3333333333%;
}

.keyb_entry .small {
    width: 16.66666666666666666666%;
}

.keyb .large {
    width: 100%;
}

.keyb_entry .large {
    width: 33.33333333333333333333%;
}

.keyb .small div, .keyb .large div,
.keyb_entry .small div, .keyb_entry .large div {
    border: 1px solid black;
    border-radius: 10px;
    margin: 3px;
}

div.user { font-size: 16px; font-size: 1.6rem; }
.alert b {
    color: red;
    text-decoration: underline;
}

.visit.adult {
    float: left;
    width: 50%;
}

.visit.child {
    float: right;
    width: 50%;
}

.visit img.type {
    width: 35px;
}

.visit img.action {
    width: 50px;
}

.bill_for_print {
    font-size: 14px;
    font-size: 1.4rem;
}

.bill_for_print .emeteur {
    border: 3px solid black;
    float: left;
    padding: 20px;
}

.bill_for_print .emeteur span {
    display: block;
    text-align: left;
}

.bill_for_print .customer {
    text-align: left;
    clear: both;
    float: right;
}

.bill_for_print .customer .cadre {
    border: 3px solid black;
    height: 150px;
    width: 500px;
}

.bill_for_print .transaction,
.bill_for_print .date_today,
.bill_for_print .method,
.bill_for_print .date_bill {
    text-align: left;
    clear: both;
}

.bill_for_print .taxe_info {
    text-align: right;
    font-size:  12px;
    font-size:  1.2rem;
    float: right;
    margin-right: 22px;
}

.bill_for_print table {
    margin: 0 auto;
    width: 100%;
}

.bill_for_print table th {
    background: #027276;
    color: white;
}

.bill_for_print table tr.color_1 {
    background: #EEEEEE;
}

.bill_for_print table tr.color_2 {
    background: #CCCCCC;
}

.bill_for_print table td.price {
    width: 200px;
}

.bill_for_print table td.name,
.bill_for_print table td.price {
    border: 1px solid black;
}

.bill_for_print table tr.total td.total_text {
    text-align: right;
}

.bill_for_print table tr.total td.total_text span {
    background: #027276;
    color: white;
    display: block;
    float: right;
    padding: 10px 20px;
}

.bill_for_print .legal {
    display: none;
}

.bill_for_print .button {
    padding: 20px;
}

.bill_for_print .button button {
    padding: 0 20px;
}

/* caisse 1920 x 904 */
@media (min-width: 1401px) {
    h1 {font-size: 24px; font-size: 2.4rem; margin: 5px 0;}
    h1.height_with_button {height: 60px; line-height: 60px;}
    h2 {font-size: 20px; font-size: 2.0rem; margin: 30px 0 0 0;}
    #menu a img { width: 50px; }
    #menu { height: 50px; }
    .alert {font-size: 24px; font-size: 2.4rem; margin: 20px 0 0 0;}
    div.select_date {font-size: 16px; font-size: 1.6rem; }
    #menu > a {width: 5%;}
    #content #basket_list_product, #content #basket_content_take { width: 57%; }
    #content #basket_content_basket, #basket_content_donation, #basket_content_contribution, #basket_content_entry { width: 42%; }
    #content #basket_list_product, #content #basket_content_basket, #content #basket_content_take { font-size: 16px; font-size: 1.6rem; }
    #content #basket_content_basket .total, #content #basket_content_take .total { font-weight: bold; margin: 30px; font-size: 30px; font-size: 3.0rem; }
    #content button, .keyb, .keyb_entry, .receive, .receive_entry, .add_product button, .remove button { font-size: 24px; font-size: 2.4rem; border-radius: 20px;}
    .keyb, .keyb_entry {height: 170px;}
    #content #basket_list_product > .category { padding-bottom: 30px; }
    #content #basket_list_product .column {column-count: 2; column-gap: 5px;}
    #content #basket_list_product .category br {clear: both; display: block; content: ""}
    #basket_content_take input, #basket_content_basket input{width: 250px;}
    #content #edit_list_product .handle, #content #edit_list_product .nohandle, #content #category_sortable .handle { width: 2%; }
    #basket_content_basket table > tbody > tr > th, #basket_content_basket table > tbody > tr > td { padding: 0 2px; }
    #basket_content_basket table .sum {padding-right: 55px;}
    #basket_content_take h1 img, #basket_content_donation h1 img, #basket_content_contribution h1 img, #basket_content_entry h1 img { width: 46px; }
    #content #basket_content_entry button { margin-left: 14px; width: 779px; }
    .confirm {font-size: 24px; font-size: 2.4rem;}
    #content #basket_content_basket .button { padding-top: 30px; }
    #content #basket_content_basket .button button, .button.block button { margin-bottom: 15px; padding: 10px 0}
    #cash_question_money img { width: 70px; }
    .keyb .small div, .keyb .large div { padding: 20px 0; }
    .keyb button { margin-top: 5px; }
    .void_basket {height: 105px; line-height: 105px;}
    #basket_cash_float .content_cash_float, #basket_cash_float .edit_cash_float {height: 85px;}
    .message .ticket {width: 120px; height: 40px; line-height: 40px; font-size: 8px; font-size: 0.8rem;}
    #content #edit_list_product .title_product .forsale {line-height: 52px;}
    .list_category_for_filter div.category div {margin-right: 20px; padding: 5px 0;}
    .list_category_for_filter {margin-right: 1px; height: 65px;}
    .list_category_for_filter { margin: 0 -19px 0 2px; }
    #content #basket_list_product .title h1 { margin-left: 115px; }
    #content #basket_list_product .title img { margin: 5px 0 0 15px; width: 40px; }
    div.info_for_close { display: inline-block; width: 32.7%; }
    div.info_for_close.left { text-align: left; }
    div.info_for_close.center table { margin: 0 auto;}
    div.info_for_close.right table { float: right; }
    table.info_for_close { width: 90%; }
    #add_to_visible div img, #set_money.big div.money img, #set_money div.add img { height: 130px; }
    #set_money.tiny div.money img { height: 80px;}
    #keyb_money_calculator { height: 100px;}
    #keyb_money_calculator table { height: 80px; border-spacing: 30px 0px; }
    #keyb_money_calculator table td { font-size: 30px; font-size: 3.0rem; }
    .count { font-size: 30px; font-size: 3.0rem; }
    .shopping_list {max-width: 80%;}
    .shopping_list .chopping_item .detail { grid-template-columns: 350px 120px 150px 420px 420px; font-size: 16px; font-size: 1.6rem; }
    .msrc, .tscr {display: none !important;}
    #add_user input, #input_name {width: 400px; }
    #add_user button, #edit button, #remove button { width: 400px; }
    .shopping_list .chopping_item .top-row { display: flex; align-items: center; width: 100%; }
    .shopping_list .chopping_item .name { flex-grow: 1; text-align: center; }
    .choice_user { column-count: 4; }
    .shopping_list .chopping_item .name { font-size: 20px; font-size: 2.0rem; }
    .shopping_list .chopping_item .action .step { font-size: 16px; font-size: 1.6rem; }
    .shopping_list .chopping_item .detail > div { display: flex; flex-wrap: wrap; }
    .list_category_for_filter div.category { font-size: 20px; font-size: 2.0rem; }
}

/* tablette horizontal 1280 x 672 */
@media (min-width: 851px) and (max-width: 1400px) {
    h1 { font-size: 22px; font-size: 2.2rem; margin: 5px 0; }
    h1.height_with_button {height: 55px; line-height: 55px;}
    h2 {font-size: 18px; font-size: 1.8rem; margin: 30px 0 0 0;}
    #menu a img { width: 50px; }
    #menu { height: 50px; }
    .alert { font-size: 22px; font-size: 2.2rem; margin: 20px 0 0 0;}
    div.select_date {font-size: 16px; font-size: 1.6rem; }
    #menu > a {width: 7%;}
    #content #basket_list_product, #content #basket_content_take { width: 57%; }
    #content #basket_list_product, #content #basket_content_take { width: 71%; }
    #content #basket_content_basket, #basket_content_donation, #basket_content_contribution, #basket_content_entry { width: 28%; }
    #content #basket_list_product, #content #basket_content_basket, #content #basket_content_take { font-size: 16px; font-size: 1.6rem; }
    #content #basket_content_basket .total, #content #basket_content_take .total { font-weight: bold; margin: 30px; font-size: 22px; font-size: 2.2rem; }
    #content button, .keyb, .keyb_entry, .receive, .receive_entry, .add_product button, .remove button { font-size: 22px; font-size: 2.2rem; border-radius: 15px; }
    .keyb, .keyb_entry {height: 122px;}
    #content #basket_list_product > .category { padding-bottom: 13px; }
    #content #basket_list_product .product { font-size: 14px; font-size: 1.4rem;}
    #content #basket_list_product .column {column-count: 2;}
    #content #basket_list_product .category br {clear: both; display: block; font-size: 0;}
    #basket_content_take input, #basket_content_basket input {width: 200px;}
    #content #edit_list_product .handle, #content #edit_list_product .nohandle, #content #category_sortable .handle { width: 3%; }
    #basket_content_basket table > tbody > tr > th, #basket_content_basket table > tbody > tr > td { padding: 0 8px; }
    #basket_content_basket table .sum {padding-right: 9px;}
    #basket_content_basket table .name .price {display: none;}
    #basket_content_take h1 img, #basket_content_donation h1 img, #basket_content_contribution h1 img, #basket_content_entry h1 img { width: 40px; }
    #content #basket_content_entry button { margin-left: 14px; width: 334px; }
    .confirm {font-size: 22px; font-size: 2.2rem;}
    #content #basket_content_basket .button { padding-top: 0px; }
    #content #basket_content_basket .button button, .button.block button { margin-bottom: 2px; padding: 0px 0}
    #cash_question_money img { width: 70px; }
    .keyb .small div, .keyb .large div { padding: 15px 0; }
    .keyb button { margin-top: 5px; }
    .void_basket {height: 139px; line-height: 139px;}
    #basket_cash_float .content_cash_float, #basket_cash_float .edit_cash_float {height: 65px;}
    .message .ticket {width: 120px; height: 40px; line-height: 40px; font-size: 8px; font-size: 0.8rem;}
    #content #edit_list_product .title_product .forsale {line-height: 52px;}
    .list_category_for_filter div.category div {margin-right: 16px; padding: 5px 0;}
    .list_category_for_filter {margin-right: 0px; height: 65px;}
    .list_category_for_filter { margin: 0 -19px 0 2px; }
    #content #basket_list_product .title h1 { margin-left: 115px; }
    #content #basket_list_product .title img { margin: 5px 0 0 15px; width: 36px; }
    #basket_content_basket table .add, #basket_content_basket table .decrease {display: none;}
    div.info_for_close { display: inline-block; width: 32.7%; }
    div.info_for_close.left { text-align: left; }
    div.info_for_close.center table { margin: 0 auto;}
    div.info_for_close.right table { float: right; }
    table.info_for_close { width: 90%; }
    #add_to_visible div img, #set_money div.money img, #set_money div.add img { height: 90px; }
    #keyb_money_calculator { height: 100px;}
    #keyb_money_calculator table { height: 80px; border-spacing: 10px 0px; }
    #keyb_money_calculator table td { font-size: 30px; font-size: 3.0rem; }
    .count { font-size: 25px; font-size: 2.5rem; }
    .shopping_list .chopping_item .detail { grid-template-columns: 270px 120px 150px 270px 400px; font-size: 14px; font-size: 1.4rem; }
    .msrc, .tscr {display: none !important;}
    #add_user input, #input_name {width: 400px; }
    #add_user button, #edit button, #remove button { width: 400px; }

    .shopping_list .chopping_item .top-row { display: flex; align-items: center; width: 100%; }
    .shopping_list .chopping_item .name { flex-grow: 1; text-align: center; }

    .choice_user { column-count: 4; }
    .shopping_list .chopping_item .name { font-size: 20px; font-size: 2.0rem; }
    .shopping_list .chopping_item .action .step { font-size: 16px; font-size: 1.6rem; }
    .shopping_list .chopping_item .detail > div { display: flex; flex-wrap: wrap; }
    .list_category_for_filter div.category { font-size: 20px; font-size: 2.0rem; }
}

/* tablette vertical 800 x 1152 */
@media (max-width: 850px) {
    h1 { font-size: 18px; font-size: 1.8rem; margin: 5px 0; }
    h2 {font-size: 16px; font-size: 1.6rem; margin: 30px 0 0 0;}
    #menu a img { width: 40px; }
    #menu { height: 41px; }
    .alert { font-size: 18px; font-size: 1.8rem; margin: 20px 0 0 0; }
    div.select_date {font-size: 13px; font-size: 1.3rem; }
    #menu > a {width: 9%;}
    #content #basket_list_product, #content #basket_content_take { width: 57%; }
    #content #basket_list_product, #content #basket_content_take { width: 56%; }
    #content #basket_content_basket, #basket_content_donation, #basket_content_contribution, #basket_content_entry { width: 42%; }
    #content #basket_list_product, #content #basket_content_basket, #content #basket_content_take { font-size: 13px; font-size: 1.3rem; }
    #content #basket_list_product .product .text {padding: 3px 0;}
    #content #basket_content_basket .product {padding: 4px 0;}
    #content #basket_content_basket .total, #content #basket_content_take .total { font-weight: bold; margin: 30px; font-size: 18px; font-size: 1.8rem; }
    #content button, .keyb, .keyb_entry, .receive, .receive_entry, .add_product button, .remove button { font-size: 18px; font-size: 1.8rem; border-radius: 10px;}
    .keyb, .keyb_entry {height: 122px;}
    #content #basket_list_product > .category { padding-bottom: 20px; }
    #content #basket_list_product .category br {clear: both; display: block; font-size: 0;}
    #basket_content_take input, #basket_content_basket input {width: 150px;}
    #content #edit_list_product .handle, #content #edit_list_product .nohandle, #content #category_sortable .handle {width: 4%; }
    #basket_content_basket table > tbody > tr > th, #basket_content_basket table > tbody > tr > td { padding: 0 2px; }
    #basket_content_basket table .sum {padding-right: 9px;}
    #basket_content_take h1 img, #basket_content_donation h1 img, #basket_content_contribution h1 img, #basket_content_entry h1 img { width: 34px; }
    #content #basket_content_entry button { margin-left: 14px; width: 307px; }
    .confirm {font-size: 18px; font-size: 1.8rem;}
    #content #basket_content_basket .button { padding-top: 30px; }
    #content #basket_content_basket .button button, .button.block button  { margin-bottom: 15px; padding: 10px 0}
    #cash_question_money img { width: 70px; }
    .keyb .small div, .keyb .large div { padding: 20px 0; }
    .keyb button { margin-top: 15px; }
    .void_basket {height: 410px; line-height: 410px;}
    #basket_cash_float .content_cash_float, #basket_cash_float .edit_cash_float {height: 55px;}
    .message .ticket {width: 120px; height: 40px; line-height: 40px; font-size: 8px; font-size: 0.8rem;}
    #content #edit_list_product .title_product .forsale {line-height: 27px;}
    .list_category_for_filter div.category div {margin-right: 10px; padding: 5px 0;}
    .list_category_for_filter {height: 65px; margin: 0 -10px 0 2px; }
    #content #basket_list_product .title h1 { margin-left: 75px; }
    #content #basket_list_product .title img { margin: 3px 0 0 10px; width: 32px; }
    #basket_content_basket table .add, #basket_content_basket table .decrease {display: none;}
    table.info_for_close { width: 100%; margin: 0 0 20px 0;}
    #add_to_visible div img, #set_money div.money img, #set_money div.add img { height: 100px; }
    #set_money > div.add {padding: 0 28px;}
    #keyb_money_calculator { height: 70px;}
    #keyb_money_calculator table { height: 60px; border-spacing: 5px 0px; }
    #keyb_money_calculator table td { font-size: 20px; font-size: 2.0rem; }
    .count { font-size: 20px; font-size: 2.0rem; }
    .shopping_list .chopping_item .detail { grid-template-columns: 180px 540px; font-size: 12px; font-size: 1.2rem; }
    #add_user input, #input_name {width: 300px; }
    #add_user button, #edit button, #remove button { width: 300px; }
    .shopping_list .chopping_item .top-row { justify-content: center; }
    .shopping_list .chopping_item .top-row .name { text-align: center; font-weight: bold; margin-bottom: 5px; }
    .shopping_list .chopping_item .top-row .view_detail, .top-row .view_action { display: inline-block;}
    .shopping_list .chopping_item .top-row .view_detail, .top-row .view_delete { display: inline-block;}
    .choice_user { column-count: 4; }
    .shopping_list .chopping_item .name { font-size: 20px; font-size: 2.0rem; }
    .shopping_list .chopping_item .action .step { font-size: 16px; font-size: 1.6rem; }
    .list_category_for_filter div.category { font-size: 16px; font-size: 1.6rem; }
}

@media (min-width: 800px) and (max-width: 850px) {
    .lsrc, .tscr {display: none !important;}
    .shopping_list .chopping_item .detail > div { display: flex; flex-wrap: wrap; }
}

@media (max-width: 799px) {
    .shopping_list .chopping_item .top-row { justify-content: center; }
    .shopping_list .chopping_item .top-row .name { text-align: center; font-weight: bold; margin-bottom: 5px; }
    .shopping_list .chopping_item .top-row .view_detail, .top-row .view_action { display: inline-block;}
    .lsrc, .msrc {display: none !important;}
}

@media (min-width: 701px) and (max-width: 799px) {
    .choice_user { column-count: 3; }
    .shopping_list .chopping_item .detail { font-size: 12px; font-size: 1.2rem; }
    .shopping_list .chopping_item .name { font-size: 20px; font-size: 2.0rem; }
    .shopping_list .chopping_item .action .step { font-size: 16px; font-size: 1.6rem; }
}

@media (min-width: 601px) and (max-width: 700px) {
    .choice_user { column-count: 3; }
    .shopping_list .chopping_item .detail { grid-template-columns: 550px; font-size: 12px; font-size: 1.2rem; }
    .shopping_list .chopping_item .name { font-size: 20px; font-size: 2.0rem; }
    .shopping_list .chopping_item .action .step { font-size: 16px; font-size: 1.6rem; }
}

@media (min-width: 501px) and (max-width: 600px) {
    .choice_user { column-count: 2; }
    .shopping_list .chopping_item .detail { grid-template-columns: 450px; font-size: 12px; font-size: 1.2rem; }
    .shopping_list .chopping_item .name { font-size: 20px; font-size: 2.0rem; }
    .shopping_list .chopping_item .action .step { font-size: 16px; font-size: 1.6rem; }
    .shopping_list .chopping_item .action .step { font-size: 16px; font-size: 1.6rem; }
    #content .shopping .add_action button, #content .add_action input, #content .shopping .delete button { font-size: 20px; }
}

@media (min-width: 401px) and (max-width: 500px) {
    .choice_user { column-count: 2; }
    .shopping_list .chopping_item .detail { grid-template-columns: 350px; font-size: 12px; font-size: 1.2rem; }
    .shopping_list .chopping_item .name { font-size: 20px; font-size: 2.0rem; }
    .shopping_list .chopping_item .action .step { font-size: 16px; font-size: 1.6rem; }
    #content .shopping .add_action button, #content .add_action input, #content .shopping .delete button { font-size: 18px; }
}

@media (min-width: 301px) and (max-width: 400px) {
    .choice_user { column-count: 1; }
    .shopping_list .chopping_item .detail { grid-template-columns: 250px; font-size: 12px; font-size: 1.2rem; }
    .shopping_list .chopping_item .name { font-size: 12px; font-size: 1.2rem; }
    .shopping_list .chopping_item .action .step { font-size: 12px; font-size: 1.2rem; }
    #content .shopping .add_action button, #content .add_action input, #content .shopping .delete button { font-size: 16px; }
}

@media (min-width: 101px) and (max-width: 300px) {
    .choice_user { column-count: 1; }
    .shopping_list .chopping_item .detail { grid-template-columns: 160px; font-size: 12px; font-size: 1.2rem; }
    .shopping_list .chopping_item .name { font-size: 12px; font-size: 1.2rem; }
    .shopping_list .chopping_item .action .step { font-size: 10px; font-size: 1.0rem; }
    #content .shopping .add_action button, #content .add_action input, #content .shopping .delete button { font-size: 12px; }
}

input.date,
select.date,
select.envelope {
    font-size: 22px;
    font-size: 2.2rem;
    text-align: center;
}

input.date {
    width: 80%;
}

select.ticket {
    font-size: 16px;
    font-size: 1.6rem;
    text-align: center;
    border: 0;
}

table.payslip {
    clear: both;
    margin: 20px auto 0 auto;
    font-size: 14px;
    font-size: 1.4rem;
    border-collapse: collapse;
    border: 4px solid black;
    width: 98%;
}
table.payslip > tbody > tr > th,
table.payslip > tbody > tr > td {
    border: 2px solid black;
    padding: 0 10px;
}

table.payslip .donation {
    background-color: lightgrey;
    color: #333333;
}

table.payslip .total {
    font-size: 20px;
    font-size: 2.0rem;
}

table.payslip .total th {
    border-top-width: 4px;
}

table.payslip .header th,
table.payslip th.header {
    border-bottom-width: 4px;
}

#content .payslip.button button {
    display: block;
    width: 40%;
    margin: 40px auto 20px auto;
}

table.export {
    clear: both;
    margin: 50px auto;
    font-size: 12px;
    font-size: 1.2rem;
    border-collapse: collapse;
    border: 4px solid black;
    width: 100%;
}
table.export > tbody > tr > th,
table.export > tbody > tr > td {
    border: 2px solid black;
    padding: 0 10px;
}

table.export > tbody > tr > th.title {
    text-align: left;
    border: 0;
}

table.export .recette_cafe,
table.export .adhesions,
table.export .dons {
    background-color: #d9d9d9;
}

table.export .total_jour {
    background-color: #46bdc6;
}

table.export .change_date {
    color: blue;
    cursor: pointer;
}

table.export input.change_date {
    text-align: center;
    font-size: 12px;
    font-size: 1.2rem;
    margin: 10px 0;
    color: red;
}

table.export .print_date button {
    margin: 0 5px 10px 5px;
    padding: 0 20px;
    font-size: 12px !important;
    font-size: 1.2rem !important;
}

table.daily_summary_cash_register_sheet_title {
    clear: both;
    margin: 30px auto 0 auto;
    font-size: 12px;
    font-size: 1.2rem;
    border-collapse: collapse;
    width: 100%;
}

table.daily_summary_cash_register_sheet_title > tbody > tr > th,
table.daily_summary_cash_register_sheet_total_day > tbody > tr > th {
    text-align: left;
    font-weight: bold;
}

table.daily_summary_cash_register_sheet_total_day {
    clear: both;
    border: 4px solid black;
    margin: 30px auto 0 auto;
    font-size: 12px;
    font-size: 1.2rem;
    border-collapse: collapse;
    width: 100%;
    background-color: #46bdc6;
}

table.daily_summary_cash_register_sheet_total_day > tbody > tr > th,
table.daily_summary_cash_register_sheet_total_day > tbody > tr > td {
    border: 2px solid black;
    padding: 0 10px;
}


table.daily_summary_cash_register_sheet {
    clear: both;
    margin: 0px auto;
    font-size: 12px;
    font-size: 1.2rem;
    border-collapse: collapse;
    border: 4px solid black;
    width: 100%;
}
table.daily_summary_cash_register_sheet > tbody > tr > th,
table.daily_summary_cash_register_sheet > tbody > tr > td {
    border: 2px solid black;
    padding: 0 10px;
}

table.daily_summary_cash_register_sheet > tbody > tr > th.title {
    text-align: left;
    border: 0;
}

table.daily_summary_cash_register_sheet > tbody > tr.subtotal {
    background-color: #d9d9d9;
}

table.daily_summary_cash_register_sheet > tbody > tr.subtotal th {
    text-align: left;
}

table.daily_summary_cash_register_sheet > tbody > tr.subtotal td {
    text-align: right;
}

table.daily_summary_cash_register_sheet_total_day .hour ,
table.daily_summary_cash_register_sheet .hour {
    width: 4%;
}

table.daily_summary_cash_register_sheet_total_day .user ,
table.daily_summary_cash_register_sheet .user {
    width: 20%;
}

table.daily_summary_cash_register_sheet_total_day .name ,
table.daily_summary_cash_register_sheet .name {
    width: 28%;
}

table.daily_summary_cash_register_sheet_total_day .cash ,
table.daily_summary_cash_register_sheet .cash {
    width: 8%;
}

table.daily_summary_cash_register_sheet_total_day .credit_card ,
table.daily_summary_cash_register_sheet .credit_card {
    width: 8%;
}

table.daily_summary_cash_register_sheet_total_day .check ,
table.daily_summary_cash_register_sheet .check {
    width: 8%;
}

table.daily_summary_cash_register_sheet_total_day .total ,
table.daily_summary_cash_register_sheet .total {
    width: 8%;
}

table.daily_summary_cash_register_sheet_total_day .total_day {
    width: 52.3%;
    text-align: center;
}

table.daily_summary_cash_register_sheet_total_day {
    font-weight: bold;
    font-size: 20px;
    font-size: 2.0rem;
    color: black;
}

.message {
    margin: 50px 0;
    font-size: 22px;
    font-size: 2.2rem;
    text-align: center;
}

.message .bill {
    padding-top: 10px;
}

#basket_content_take .input {
    padding-bottom: 30px;
}

#basket_content_take input, #basket_content_basket input {
    font-size: 22px;
    font-size: 2.2rem;
    text-align: center;
}

#basket_content_take {
    padding-bottom: 30px;
}

#basket_content_basket table {
    border-collapse: collapse;
    border: 4px solid black;
    width: 100%;
}

#basket_content_basket table td.name {
    text-align: left;
}

#basket_content_basket table th.name {
    text-align: right;
}

#basket_content_basket input {
    border: 3px solid black;
}

#basket_content_basket table > tbody > tr > th,
#basket_content_basket table > tbody > tr > td {
    border: 2px solid black;
}

#basket_content_basket table > tbody > tr > td.ticket {
    font-size: 7px;
    font-size: 0.7rem;
    font-weight: bold;
}

#basket_content_basket table .sum {
    text-align: right;
}

#basket_content_basket table img {
    width: 32px;
    vertical-align: bottom;
}

.bold {
    font-weight: bold !important ;
}

#add_user, #add_user input, #add_user button, #input_name {
    font-size: 20px;
    font-size: 2.0rem;
}

#add_user input,
#input_name {
    display: block;
    margin: 10px auto;
    text-align: center;
}

.add_think_to_by input,
.add_action input {
    display: block;
    margin: 0 auto;
    width: 80%;
    text-align: center;
    font-size: 20px;
    font-size: 2.0rem;
    box-sizing: border-box;
}

.add_think_to_by h2 {
    margin-top: 10px;
}

.choice_user {
    padding-bottom: 50px;
}

.choice_user button {
    width: 90%;
    margin-bottom: 10px;
}

#add_user button,
#edit button,
#remove button {
    margin-bottom: 10px;
}

.print {
    display: none;
}

div.select_date {
    display: inline-block;
    padding: 0 10px;
}

#version,
#name_user,
#param_user {
    margin: 0 auto;
    text-align: left;
    width: 95%:
}

#version {
    font-size: 20px;
    font-size: 2.0rem;
    color: #999999;
    text-align: right;
    padding-right: 20px;
    height: 50px;
    line-height: 50px;
}

#name_user div,
#param_user div,
#name_user input {
    font-size: 20px;
    font-size: 2.0rem;
}

#param_user div input[type="checkbox"] {
    width: 30px;
    height: 30px;
}

#param_user div.page {
    margin-top: 30px;
}

#param_user div.element {
    margin-left: 50px;
}

table.history_click {
    clear: both;
    margin: 50px auto;
    font-size: 16px;
    font-size: 1.6rem;
    border-collapse: collapse;
    border: 4px solid black;
    width: 95%;
}

table.history_click > tbody > tr > th,
table.history_click > tbody > tr > td {
    border: 2px solid black;
    padding: 10px 10px;
}

#basket_cash_float .content_cash_float,
#basket_cash_float .edit_cash_float {
    border-bottom: 3px solid black;
    padding-top: 10px;
}

#basket_cash_float input,
#basket_cash_float h1,
#basket_cash_float button {
    display: inline-block;
}

#basket_cash_float button {
    padding: 0 20px;
    margin-left: 20px;
}

#basket_cash_float input {
    margin-left: 20px;
}

#basket_cash_float input {
    font-size: 24px; font-size: 2.4rem;
    height: 40px;
    width: 60px;
    text-align: center;
}

table.log {
    clear: both;
    margin: 50px auto;
    font-size: 18px;
    font-size: 1.8rem;
    border-collapse: collapse;
    border: 4px solid black;
    width: 98%;
}

table.log > tbody > tr > th,
table.log > tbody > tr > td {
    border: 2px solid black;
    padding: 10px;
}

table.log td.date {
    white-space: nowrap;
}

table.log td.comment {
    text-align: left;
}

table.log tr:nth-child(2n+2){
  background-color:#EEEEEE;
}

table.log tr:nth-child(0n+2){
    font-weight: bold;
}

.list_category_for_filter {
    clear: both;
}

.list_category_for_filter div.category {
    float: left;
    width: 20%;
}

.list_category_for_filter div.category div {
    border: 1px ridge black;
    border-radius: 10px;
    cursor: pointer;
}

.list_category_for_filter div.category div.all_visible {
    background-color: #F0FFF0;
}

.list_category_for_filter div.category div.visible {
    background-color: lightGreen;
}

.list_category_for_filter div.category div.masked {
    background-color: lightGrey;
}

.add_product {
    padding-top: 40px;
}

.add_product button {
    padding: 5px 40px;
}

.add_product input {
    font-size: 22px;
    font-size: 2.2rem;
    text-align: center;
    width: 50%;
    border: 2px solid black;
}

.add_product .input .button {
    padding-top: 20px;
}

.add_product .input .button button {
    margin: 0 10px;
}

.remove button {
    margin: 10px;
    padding: 5px 30px;
}

#payslip_content ul {
   font-size: 16px; font-size: 1.6rem; margin: 0;
   margin: 0 auto;
   text-align: left;
   display: inline-block;
}

#payslip_content .element {
    border-bottom: 1px solid black;
    padding-bottom: 30px;
}

#payslip_content .element.first {
    border-top: 1px solid black;
    margin-top: 30px;
}

#payslip_content button {
    padding: 0px 50px;
    margin: 30px 15px 0 15px;
}

#edit_list_recipe button {
    padding: 5px 40px;
}

#list_product_without_recipe {
    margin: 0 0 10px 0;
}

#list_product_with_recipe .product,
#list_product_without_recipe .product,
#add_ingredient .product {
    font-size: 18px;
    font-size: 1.8rem;
    border: 1px solid black;
    border-radius: 10px;
    margin-bottom: 10px;
}

#list_product_without_recipe .product,
#add_ingredient .product {
    cursor: pointer;
}


#list_product_with_recipe .product img {
    width: 35px;
    vertical-align: bottom;
    cursor: pointer;
}

#list_product_with_recipe .product .name_product {
    font-weight: bold;
    text-decoration: underline;
}

table.info_for_close {
    text-align: center;
    font-size: 18px;
    font-size: 1.8rem;
    border-collapse: collapse;
    border: 4px solid black;
}

div.info_for_close.center table {
    background: lightGreen;
}

table.info_for_close td {
    padding: 0px 20px;
    border: 2px solid black;
}

table.secure {
    text-align: center;
    font-size: 18px;
    font-size: 1.8rem;
    margin: 0 auto;
    border-collapse: separate;
    border-spacing: 0;
    clear: both;
    width: 95%;
}

table.secure tr.content td {
    padding: 10px 20px;
}

table.secure tr.top td {
    border-radius: 30px 30px 0 0;
    border-width: 3px 3px 1px 3px;
    border-color: black;
    border-style: solid;
}

table.secure tr.middle td {
    border-width: 0px 3px 1px 3px;
    border-color: black;
    border-style: solid;
}

table.secure tr.bot td {
    border-radius: 0 0 30px 30px;
    border-width: 0px 3px 3px 3px;
    border-color: black;
    border-style: solid;
}

table.secure tr td input {
    width: 60%;
    font-size: 20px;
    font-size: 2.0rem;
    text-align: center;
    display: block;
    margin: 0 auto;
}

table.secure .open td {
    background: lightGreen;
}

table.secure .close td {
    background: tomato;
}

.visits_for_mobile ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 20px;
    font-size: 2.0rem;
}

td.shaded,
button.shaded,
.money_calculator tr.shaded img {
    filter: grayscale(100%);
    opacity: 0.33;
}

.money_calculator tr.shaded {
    color: grey;
}

.money_calculator tr.input td.nb {
    background: lightblue;
    color: blue;
    font-weight: bold;
}

#keyb_money_calculator table {
    margin: 40px auto 0 auto;
    border-collapse: separate;
}

#keyb_money_calculator table td {
    border: 3px solid blue;
    border-radius: 20px;
    width: 146px;
    font-weight: bold;
    color: blue;
    cursor: pointer;
    background: lightblue;
}

.money {
    position: relative;
}

#add_to_visible > div,
#set_money > div.money {
    display: inline-block;
    cursor: pointer;
    border: 1px solid black;
    margin: 0 5px 10px 5px;
}

#set_money > div.money.shaded .nb,
#set_money > div.money.shaded img,
#set_money > div.money.shaded .sum {
    filter: grayscale(100%);
    opacity: 0.33;
}

#set_money > div.money.edit {
    background: lightblue;
}

#set_money > div.add {
    display: inline-block;
    cursor: pointer;
    margin: 0 5px;
}

#set_money > div > div.nb,
#set_money > div > div.sum {
    font-size: 30px;
    font-size: 3.0rem;
}

#set_money > div > div.remove {
    width: 40px;
    font-size: 20px;
    font-size: 2.0rem;
    font-weight: bold;
    color: red;
    position: absolute;
    right: -5px;
    top: 55px;
}

#set_money > div.money > div.nb {
    border-bottom: 1px solid black;
}

#set_money > div.money > div.sum {
    border-top: 1px solid black;
}

#set_money > div > div.nonb {
}

#set_money,
#add_to_visible {
    padding-top: 50px;
}

#set_money div img {
    margin: 0 20px;
}

#set_money .add {
    height: 200px;
}

.update {
    padding: 20px 0 10px 0;
    border-radius: 30px;
}

.update.color_0 { background-color: #FFFFFF; }
.update.color_1 { background-color: #00FF00; }
.update.color_2 { background-color: #44FF44; }
.update.color_3 { background-color: #88FF88; }
.update.color_4 { background-color: #BBFFBB; }
.update.color_5 { background-color: #CCEECC; }
.update.color_6 { background-color: #CCDDCC; }
.update.color_7 { background-color: #CCD4CC; }
.update.color_8 { background-color: #CCCCCC; }

#delay {
    display: none;
}

#basket_cash_float_calculator_for_open .total {
    padding-top: 20px;
    font-size: 30px;
    font-size: 3.0rem;
}

.link_print {
    font-size: 20px;
    font-size: 2.0rem;
}

td.method.click {
    color: blue;
    cursor: pointer;
}

.button_horizontal button {
    margin: 0 10px;
    padding: 0 30px;
}

.button_vertical button,
input.change_hour {
    width: 80%;
    margin: 10px;
}

input.change_hour {
    font-size: 20px;
    font-size: 2.0rem;
    text-align: center;
}

.print_hour.link {
    color: #0404ff;
    cursor: pointer;
}

.print_hour.link:hover {
    text-decoration: underline;
}

tr.select {
    background-color: lightblue;
}

.choice_envelope {
    padding: 20px 0 0 0;
    font-size: 16px;
    font-size: 1.6rem;
}

.choice_envelope button {
    padding: 0 10px;
    font-size: 14px;
    font-size: 1.4rem;
    cursor: pointer;
}

.choice_envelope button.selected {
    background-color: lightGreen;
}

.list-pseudo {
    display: inline-flex;
    flex-direction: column;
}

.list-pseudo .pseudo img {
    width: 40px;
    height: 40px;
    cursor: pointer;
}

.list-pseudo .pseudo_name {
    font-size: 24px;
    font-size: 2.4rem;
}

.list-pseudo .pseudo {
    height: 60px;
    position: relative;
    margin: 0 auto;
    display: flex;
    padding-right: 250px;
}

.list-pseudo .pseudo .edit_pseudo,
.list-pseudo .pseudo .delete_pseudo {
    position: absolute;
    top: 0;
    border: 1px solid black;
    border-radius: 10px;
    height: 40px;
    width: 40px;
    padding: 5px;
}

.list-pseudo .pseudo .edit_pseudo {
    left: 0;
}

.list-pseudo .pseudo .delete_pseudo {
    left: 60px;
}

.list-pseudo .pseudo_name {
    position: absolute;
    left: 120px;
    text-align: left;
}

#edit_pseudo, #remove_pseudo {
    margin-top: 10px;
}

#edit_pseudo button, #remove_pseudo button {
    display: block;
    margin: 10px auto;
    width: 400px;
    cursor: pointer;
}

.shopping_list {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin: 0 auto;
    padding-top: 20px;
}

.shopping_list .chopping_item {
    border: 2px solid black;
    border-radius: 30px;
    padding: 10px;
    box-sizing: border-box;
    min-height: 50px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.shopping_list .chopping_item.active {
    background-color: lightGreen;
}

.shopping_list .chopping_item.unactive {
    background-color: lightGrey;
    color: grey;
    font-size: italic;
}

.shopping_list .chopping_item .view_detail,
.shopping_list .chopping_item .view_action,
.shopping_list .chopping_item .view_delete {
    width: 50px;
    background-color: lightGrey;
    border: 1px solid blue;
    border-radius: 15px;
    margin-left: 10px;
    text-align: center;
    cursor: pointer;
}

.shopping_list .chopping_item .view_detail.selected,
.shopping_list .chopping_item .view_action.selected,
.shopping_list .chopping_item .view_delete.selected {
    background-color: white;
}

.shopping_list .chopping_item .view_detail img,
.shopping_list .chopping_item .view_action img,
.shopping_list .chopping_item .view_delete img {
    width: 40px;
    margin: 5px;
}

.shopping_list .chopping_item .action {
    display: flex;
    flex-direction: column; 
    align-items: center; 
    width: 100%; 
    background-color: white;
    border-radius: 20px;
}

.shopping_list .chopping_item .delete {
    align-items: center; 
    width: 100%; 
    background-color: white;
    border-radius: 20px;
    padding: 10px 0; 
}

.shopping_list .chopping_item .add_action {
    background-color: white;
    border-radius: 20px;
}

.shopping_list .chopping_item .add_action h2 {
    margin: 0;
}

.shopping_list .chopping_item .action .step img {
    width: 30px;
    margin-right: 5px;
}

.shopping_list .chopping_item .action .status_list {
    display: flex;
    flex-direction: column; 
    align-items: flex-start; 
    width: auto; 
    margin: 0 auto; 
    padding: 10px 0; 
}

.shopping_list .chopping_item .action .status_list .step {
    display: flex; 
    align-items: center; 
    justify-content: flex-start; 
    width: 100%; 
    padding: 5px 0; 
    cursor: pointer;
}

.shopping_list .chopping_item .detail {
    display: grid;
    margin: 0 auto;
    grid-gap: 4px;
}

.shopping_list .chopping_item .view_detail img, 
.shopping_list .chopping_item .view_action img, 
.shopping_list .chopping_item .view_delete img { 
    width: 40px; 
    cursor: pointer; 
}

.shopping_list .chopping_item .detail > div {
    padding: 10px;
    border: 1px solid black;
    text-align: center;
    background-color: white;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
}

.shopping_list .chopping_item .detail > div:nth-child(-n+5) {
    font-weight: bold;
}

.hide {
    display: none !important;
}

.big .product .text {font-size: 32px; font-size: 3.2rem;}