
/************************************************************** panels ********/
.absolute {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
}

.icon-hamburger {
    background: url(data:image/svg+xml;base64,PHN2ZyBhcmlhLWhpZGRlbj0idHJ1ZSIgZm9jdXNhYmxlPSJmY…E2IDcuMTYzLTE2IDE2djQwYzAgOC44MzcgNy4xNjMgMTYgMTYgMTZ6Ij48L3BhdGg+PC9zdmc+);
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 42%;
}

.app-header {
    /* layout */
    position: absolute;
    top: 0; left: 0; right: 0; height: 48px;
    white-space: nowrap;

    /* colors */
    background-color: #48AD4D;
    color: white;
}

.app-header > button {
    display: inline-block;
    margin: 0;
    padding: 0;
    height: 48px;
    width: 48px;
    border: none;
    color: white;
    background: url('data:image/svg+xml;base64,PHN2ZyBhcmlhLWhpZGRlbj0idHJ1ZSIgZm9jdXNhYmxlPSJmYWxzZSIgZGF0YS1wcmVmaXg9ImZhcyIgZGF0YS1pY29uPSJiYXJzIiBjbGFzcz0ic3ZnLWlubGluZS0tZmEgZmEtYmFycyBmYS13LTE0IiByb2xlPSJpbWciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDQ0OCA1MTIiPjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik0xNiAxMzJoNDE2YzguODM3IDAgMTYtNy4xNjMgMTYtMTZWNzZjMC04LjgzNy03LjE2My0xNi0xNi0xNkgxNkM3LjE2MyA2MCAwIDY3LjE2MyAwIDc2djQwYzAgOC44MzcgNy4xNjMgMTYgMTYgMTZ6bTAgMTYwaDQxNmM4LjgzNyAwIDE2LTcuMTYzIDE2LTE2di00MGMwLTguODM3LTcuMTYzLTE2LTE2LTE2SDE2Yy04LjgzNyAwLTE2IDcuMTYzLTE2IDE2djQwYzAgOC44MzcgNy4xNjMgMTYgMTYgMTZ6bTAgMTYwaDQxNmM4LjgzNyAwIDE2LTcuMTYzIDE2LTE2di00MGMwLTguODM3LTcuMTYzLTE2LTE2LTE2SDE2Yy04LjgzNyAwLTE2IDcuMTYzLTE2IDE2djQwYzAgOC44MzcgNy4xNjMgMTYgMTYgMTZ6Ij48L3BhdGg+PC9zdmc+');
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 42%;
    cursor: pointer;
}

.app-header > .title {
    /* layout */
    display: inline-block;
    vertical-align: top;
    padding-top: 8px;
    font-size: 20px;

    /* colors */
    color: white;

    /* extra */
    padding-left: 24px;
    background: -16px center no-repeat;
    background-image: url("img/breadcrumb-separator.png");
    height: 100%;
    max-width: 40%;
    overflow: hidden;
    text-overflow: ellipsis;
}

.app-header > .title:nth-child(2) {
    background: none;
    padding-left: 0;
}

.app-panel {
    position: absolute;
    top: 48px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    overflow: auto;
}

.center-buttons {
    text-align: center;
    padding-top: 16px;
}

/*************************************************************** flybox *******/
.flybox {
    max-width: 900px;
    margin: 32px auto;
    padding: 16px;
    border: solid #e7e7e7 1px;
    box-shadow: 4px 4px 16px rgba(0,0,0,0.4);
}

.flybox-small {
    max-width: 600px;
}

@media (max-width: 600px) {
    .flybox {
        margin-top: 0;
        box-shadow: none;
        border:none;
    }
}

.fade-enter-active, .fade-leave-active {
    transition: opacity 2s;
}
.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
    opacity: 0;
}

/******************************************************************************/
[component="app"] {
    font-family: sans-serif;
}

[component="app"] > .frame {
    /* layout */
    position: absolute;
    top:0;
    left: 0;
    bottom: 0;
    right: 0;
    overflow-y: auto;
}

@media print {

    [component="app"] > .frame {
        /* layout */
        position: static;
        top:0;
        left: 0;
        bottom: 0;
        right: 0;
        overflow-y: auto;
    }

}

[component="app"] > .release {
    /* layout */
    position: fixed;
    left: 0;
    bottom: 0;

    /* colors */
    color: gray;
    font-size: 9px;
}

/************************ stickers-item-editor ***********************/
[page="stickers-item"]  .sticker-image{
    filter: blur(4px);
}


[page="stickers-item"].btn-pleason {
    border: none;
    background: none;
    cursor: pointer;
    padding: 0;
    border-radius: 20%;
    overflow: hidden;
    margin: 4px;
}
[page="stickers-item"] .btn-pleason:focus {
    outline: none;
}
[page="stickers-item"] .btn-pleason img {
    width: 50px;
}

/************************ menus-item-editor ***********************/
[page="menus-item"] .section {
    min-height: 150px;
}

[page="menus-item"] .section .item {
    display: inline-block;
    height: 230px;
    width: 300px;
    margin: 8px;
    overflow: hidden;
    border: 1px solid rgba(0,0,0,.125);;
    border-radius: 3px;
    overflow: hidden;
    cursor: pointer;
    box-shadow: 4px 4px 8px rgba(0,0,0,0.2);
    background-color: white;
}

[page="menus-item"] .section .item-txt {
    overflow: hidden;
    border-bottom: solid #666666 1px;
    padding: 6px 26px 6px 10px;
    background: url('img/right-arrow.png') no-repeat center right;
}

[page="menus-item"] .section .item-txt:active {
    background-color: #007bff;
}

[page="menus-item"] .section .item-txt:last-child {
    /*border-bottom: none;*/
}

[page="menus-item"] .section .item-txt .name {
    color: black;
    font-size: 16px;
    font-weight: bold;
}

[page="menus-item"] .section .item-txt .price {
    font-size: 24px;
    font-weight: bold;
    color: darkblue;
}



@media (max-width: 680px) {
    [page="menus-item"] .section .item {
        width: 100%;
        margin: 0;
    }
}

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 10px;
}

::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background-color: rgba(0,0,0,.5);
    -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
}



[page="menus-item"] .section .item:hover {
    transition: box-shadow 0.3s ease-in-out;
    box-shadow: 8px 8px 16px rgba(0,0,0,0.2);
}

[page="menus-item"] .section .item.item-disabled {
    filter: grayscale(1);
}

[page="menus-item"] .section .item.item-disabled .item-image{
    filter: blur(4px);
}

[page="menus-item"] .price-protection {
    color: red !important;
}

[page="menus-item"] .allergen {
    opacity: 0.5;
    filter: grayscale(1);
}

[page="menus-item"] .allergen-active {
    opacity: 1;
    filter: grayscale(0);
}

/******************************************************************************/
[component="root"] {

}

[component="root"] .menuitem {
    padding: 8px;
    color: #333333;
    cursor: pointer;
}

[component="root"] .menuitem:hover {
    text-shadow: 0 0 2px rgba(0,0,0,0.5);
}

[component="root"] .menu .active {
    color: dodgerblue;
}

[component="root"] > .menu {
    /* layout */
    position: absolute;
    top: 0; left: 0; bottom: 0; width: 70vw;
    transform: translate3d(-80vw, 0, 0);
    overflow-y: auto;

    /* transition */
    transition: transform 0.2s ease-in-out;

    /* colors */
    color: #333333;
    background-color: white;
    box-shadow: 4px 0 32px rgba(0,0,0,0.2);
}

[component="root"].showmenu > .menu {
    transform: translate3d(0, 0, 0);
}

[component="root"] > .workspace {
    /* layout */
    position: absolute;
    top: 0; left: 0; bottom: 0; right: 0;

    /* 3d acceleration trick: */
    transform: translate3d(0, 0, 0);

    /* animation */
    transition: transform 0.2s ease-in-out;

    /* colors */
    background-color: white;
    /*box-shadow: 0px 0 8px black;*/
}

[component="root"] > .workspace > .overlay {
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,0);
    transition: background-color 0.2s ease-in-out;
    z-index: 9;
}

[component="root"].showmenu > .workspace > .overlay {
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.6);
}

/******************************************************** view animation ******/
.slide-left-enter-active,
.slide-left-leave-active,
.slide-right-enter-active,
.slide-right-leave-active {
    transition-duration: 0.2s;
    transition-property: height, opacity, transform;
    transition-timing-function: ease-out;
    overflow: hidden;
}

.slide-left-enter,
.slide-right-leave-active {
    opacity: 0;
    transform: translate(10em, 0);
}

.slide-left-leave-active,
.slide-right-enter {
    opacity: 0;
    transform: translate(-10em, 0);
}

/************************************************************ prettylist ******/
.prettylist {
    /* layout */
    display: block;
    margin: 0;
    padding: 0;
}

.prettylist li {
    /* layout */
    display: block;
    margin: 0;
    padding: 16px;
    border-bottom: solid #F4F4F4 1px;
    height: 72px;

    /* colors */
    cursor: pointer;
}

.prettylist li:hover {
    background-color: #F8F8FF;
}

.prettylist .prettylist-image {
    /* layout */
    display: inline-block;
    width: 40px;
    height: 40px;
    overflow: hidden;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 50%;
    float: left;
    margin-right: 16px;
}

.prettylist .prettylist-text {
    /* layout */
    overflow: hidden;
    background: center center no-repeat;
    background-size: cover;
    line-height: 40px;
}

@media screen and (min-width: 900px) {

    [component="root"] > .menu {
        transform: translate3d(0, 0, 0);
        width: 300px;
        transition: none;
    }

    [component="root"] > .workspace {
        left: 300px;
        z-index: 1;
        box-shadow: 4px 0 32px rgba(0,0,0,0.2);
    }

    .prettylist {
        max-width: 600px;
        margin: auto;
    }
}

/*  sticker print */
[component="stickers-item-print"] {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
}

/* nice buttons */

.btn {
    display: inline-block;
    font-weight: 400;
    /*color: #212529;*/
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    /*background-color: transparent;*/
    /*border: 1px solid transparent;*/
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

/* pleasons */

.btn-pleason {
    border: none;
    background: none;
    cursor: pointer;
    padding: 0;
    border-radius: 20%;
    overflow: hidden;
    margin: 4px;
}
.btn-pleason:focus {
    outline: none;
}
.btn-pleason img {
    width: 18vw;
}
.btn-pleason[animation="go-big"] {
    transition: all 0.3s ease;
    transform: scale(2);
    box-shadow: 4px 4px 8px;
}

.btn.disabled, .btn:disabled {
    opacity: .65;
}

.btn-primary {
    color: #fff;
    background-color: #007bff;
    border-color: #007bff;
}

.btn-conversion {
    color: #fff;
    background-color: #D11317;
    border-color: #D11317;
}

.btn-green {
    color: #fff;
    background-color: #219653;
    border-color: #219653;
}

.btn-outline-secondary {
    color: #6c757d;
    border-color: #6c757d;
}

.btn-outline-primary {
    color: #007bff;
    border-color: #007bff;
}

.btn-outline-danger {
    color: #dc3545;
    border-color: #dc3545;
}

.btn-primary.disabled, .btn-primary:disabled {
    color: #fff;
    background-color: #007bff;
    border-color: #007bff;
}

.btn-toggle {
    color: #fff;
    background-color: #17a2b8;
    border-color: #17a2b8;
}

.btn-outline-toggle {
    color: #17a2b8;
    border-color: #17a2b8;
}

[component="SpaceStickerPrint"] .faces img {
    width: 10.5vh;
    margin: 0 1vh;
}

/* btn google */

.btn-google {
    background-image: url('img/google-sign-in.png');
    background-size: contain;
    background-repeat: no-repeat;
    font-weight: bold;
}

/* timeline */
[page="sentiment-timeline"] .btn-pleason {
    cursor: initial;
    margin: 2px;
}

[page="sentiment-timeline"] .btn-pleason img {
    width: 36px;
    height: 36px;
}

[page="sentiment-timeline"] .btn-pleason.big {
    transform: scale(1.5);
    box-shadow: 2px 2px 3px rgba(0,0,0,0.8);
}



/*  pleason-conversation */


[page="pleason-conversation"] .btn-pleason {
    cursor: initial;
    margin: 2px;
}

[page="pleason-conversation"] .btn-pleason img {
    width: 36px;
    height: 36px;
}

[page="pleason-conversation"] .btn-pleason.big {
    transform: scale(1.5);
    box-shadow: 2px 2px 3px rgba(0,0,0,0.8);
}



[page="pleason-conversation"] .message-area {
    margin: 0 auto;
    max-width: 800px;
    padding: 0 20px;
    //height: 65vh;
    overflow-y: scroll;
    //background-color: pink;
    border: 1px solid silver;
    position: absolute;
    bottom: 0;
    left:0;
    right:0;
    top: 100px;

}


[page="pleason-conversation"] .message-area::-webkit-scrollbar {
    -webkit-appearance: none;
}

[page="pleason-conversation"] .message-area::-webkit-scrollbar:vertical {
    width: 11px;
}

[page="pleason-conversation"] .message-area::-webkit-scrollbar:horizontal {
    height: 11px;
}

[page="pleason-conversation"] .message-area::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 2px solid white; /* should match background, can't be transparent */
    background-color: rgba(0, 0, 0, .5);
}

[page="pleason-conversation"] .message-container {

    border: 2px solid #dedede;
    background-color: #f1f1f1;
    border-radius: 5px;
    padding: 10px;
    margin: 10px 0;
    font-size: 0.8rem;
}

[page="pleason-conversation"]  .darker {
    border-color: #ccc;
    background-color: #ddd;
}

[page="pleason-conversation"] .message-container::after {
    content: "";
    clear: both;
    display: table;
}

[page="pleason-conversation"] .message-container img {
    float: left;
    width: 40px;
    height: 40px;
    margin-right: 20px;
    border-radius: 50%;
    overflow : hidden;
}

[page="pleason-conversation"] .message-container img.right {
    float: right;
    margin-left: 20px;
    margin-right:0;
}

[page="pleason-conversation"] .time-right {
    float: right;
    color: #aaa;
    font-size: 0.6rem;
}

[page="pleason-conversation"] .time-left {
    float: left;
    color: #999;
    font-size: 0.6rem;
}


/*
[page="pleason-conversation"] .chat-area {
    //border: 1px solid #ccc;
    background: white;
    height: 40vh;
    padding: 1em;
    overflow: auto;
    max-width: 350px;
    //margin: 0 10px;
    text-align: center;
    display: inline-block;
    justify-content: center;
    box-shadow: 2px 2px 5px 2px rgba(0, 0, 0, 0.3);
    background-image: url(img/chatbackground.png);
}

[page="pleason-conversation"] .message {
    max-width: 85%;
    border-radius: 10px;
    border: solid 2px #ccc;
    padding: 0.2em .5em;
    margin-bottom: .4em;
    font-size: .8em;

    overflow-wrap: break-word;
    hyphens: auto;
    clear: both;
    text-align: left;
}

[page="pleason-conversation"] .message-out {
    background: #407FFF;
    border-color: #204FaF;
    color: white;
    float: right;
}
[page="pleason-conversation"] .message-in {
    background: #F1F0F0;
    color: black;
    float: left;
}
[page="pleason-conversation"] .chat-inputs {
    display: block;
    justify-content: center;
    max-width: 350px;
//margin: 0 0px;
    text-align: center;

}

[page="pleason-conversation"] .you-input {
    padding: .5em;
    width: 95%;

    box-shadow: 2px 2px 5px 2px rgba(0, 0, 0, 0.3);

    border: solid 2px #ccc;
}
*/
@media print {

    @page {
        size: landscape;
        margin: 0;
    }

}

.price-box {
    border: solid gray 1px;
    background:dimgrey;
    color: white; width: 70px;
    text-align: center;
    margin-left:2px;
    margin-right: 2px;

}

/*********************************************************** icons ************/
.icon {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.icon-plus {
    background-image: url('data:image/svg+xml;base64,DQo8c3ZnIGFyaWEtaGlkZGVuPSJ0cnVlIiBmb2N1c2FibGU9ImZhbHNlIiBkYXRhLXByZWZpeD0iZmFzIiBkYXRhLWljb249InBsdXMtY2lyY2xlIiBjbGFzcz0ic3ZnLWlubGluZS0tZmEgZmEtcGx1cy1jaXJjbGUgZmEtdy0xNiIgcm9sZT0iaW1nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNMjU2IDhDMTE5IDggOCAxMTkgOCAyNTZzMTExIDI0OCAyNDggMjQ4IDI0OC0xMTEgMjQ4LTI0OFMzOTMgOCAyNTYgOHptMTQ0IDI3NmMwIDYuNi01LjQgMTItMTIgMTJoLTkydjkyYzAgNi42LTUuNCAxMi0xMiAxMmgtNTZjLTYuNiAwLTEyLTUuNC0xMi0xMnYtOTJoLTkyYy02LjYgMC0xMi01LjQtMTItMTJ2LTU2YzAtNi42IDUuNC0xMiAxMi0xMmg5MnYtOTJjMC02LjYgNS40LTEyIDEyLTEyaDU2YzYuNiAwIDEyIDUuNCAxMiAxMnY5Mmg5MmM2LjYgMCAxMiA1LjQgMTIgMTJ2NTZ6Ij48L3BhdGg+PC9zdmc+');
}

.icon-enabled {
    background-image: url('data:image/svg+xml;base64,DQo8c3ZnIGFyaWEtaGlkZGVuPSJ0cnVlIiBmb2N1c2FibGU9ImZhbHNlIiBkYXRhLXByZWZpeD0iZmFzIiBkYXRhLWljb249ImV5ZSIgY2xhc3M9InN2Zy1pbmxpbmUtLWZhIGZhLWV5ZSBmYS13LTE4IiByb2xlPSJpbWciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDU3NiA1MTIiPjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik01NzIuNTIgMjQxLjRDNTE4LjI5IDEzNS41OSA0MTAuOTMgNjQgMjg4IDY0UzU3LjY4IDEzNS42NCAzLjQ4IDI0MS40MWEzMi4zNSAzMi4zNSAwIDAgMCAwIDI5LjE5QzU3LjcxIDM3Ni40MSAxNjUuMDcgNDQ4IDI4OCA0NDhzMjMwLjMyLTcxLjY0IDI4NC41Mi0xNzcuNDFhMzIuMzUgMzIuMzUgMCAwIDAgMC0yOS4xOXpNMjg4IDQwMGExNDQgMTQ0IDAgMSAxIDE0NC0xNDQgMTQzLjkzIDE0My45MyAwIDAgMS0xNDQgMTQ0em0wLTI0MGE5NS4zMSA5NS4zMSAwIDAgMC0yNS4zMSAzLjc5IDQ3Ljg1IDQ3Ljg1IDAgMCAxLTY2LjkgNjYuOUE5NS43OCA5NS43OCAwIDEgMCAyODggMTYweiI+PC9wYXRoPjwvc3ZnPg==');
}

.icon-disabled {
    background-image: url('data:image/svg+xml;base64,DQo8c3ZnIGFyaWEtaGlkZGVuPSJ0cnVlIiBmb2N1c2FibGU9ImZhbHNlIiBkYXRhLXByZWZpeD0iZmFzIiBkYXRhLWljb249ImV5ZS1zbGFzaCIgY2xhc3M9InN2Zy1pbmxpbmUtLWZhIGZhLWV5ZS1zbGFzaCBmYS13LTIwIiByb2xlPSJpbWciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDY0MCA1MTIiPjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik0zMjAgNDAwYy03NS44NSAwLTEzNy4yNS01OC43MS0xNDIuOS0xMzMuMTFMNzIuMiAxODUuODJjLTEzLjc5IDE3LjMtMjYuNDggMzUuNTktMzYuNzIgNTUuNTlhMzIuMzUgMzIuMzUgMCAwIDAgMCAyOS4xOUM4OS43MSAzNzYuNDEgMTk3LjA3IDQ0OCAzMjAgNDQ4YzI2LjkxIDAgNTIuODctNCA3Ny44OS0xMC40NkwzNDYgMzk3LjM5YTE0NC4xMyAxNDQuMTMgMCAwIDEtMjYgMi42MXptMzEzLjgyIDU4LjFsLTExMC41NS04NS40NGEzMzEuMjUgMzMxLjI1IDAgMCAwIDgxLjI1LTEwMi4wNyAzMi4zNSAzMi4zNSAwIDAgMCAwLTI5LjE5QzU1MC4yOSAxMzUuNTkgNDQyLjkzIDY0IDMyMCA2NGEzMDguMTUgMzA4LjE1IDAgMCAwLTE0Ny4zMiAzNy43TDQ1LjQ2IDMuMzdBMTYgMTYgMCAwIDAgMjMgNi4xOEwzLjM3IDMxLjQ1QTE2IDE2IDAgMCAwIDYuMTggNTMuOWw1ODguMzYgNDU0LjczYTE2IDE2IDAgMCAwIDIyLjQ2LTIuODFsMTkuNjQtMjUuMjdhMTYgMTYgMCAwIDAtMi44Mi0yMi40NXptLTE4My43Mi0xNDJsLTM5LjMtMzAuMzhBOTQuNzUgOTQuNzUgMCAwIDAgNDE2IDI1NmE5NC43NiA5NC43NiAwIDAgMC0xMjEuMzEtOTIuMjFBNDcuNjUgNDcuNjUgMCAwIDEgMzA0IDE5MmE0Ni42NCA0Ni42NCAwIDAgMS0xLjU0IDEwbC03My42MS01Ni44OUExNDIuMzEgMTQyLjMxIDAgMCAxIDMyMCAxMTJhMTQzLjkyIDE0My45MiAwIDAgMSAxNDQgMTQ0YzAgMjEuNjMtNS4yOSA0MS43OS0xMy45IDYwLjExeiI+PC9wYXRoPjwvc3ZnPg==');
}

.icon-external-link {
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTIiIGhlaWdodD0iMTIiPg0KCTxwYXRoIGZpbGw9IiNmZmYiIHN0cm9rZT0iIzM2YyIgZD0iTTEuNSA0LjUxOGg1Ljk4MlYxMC41SDEuNXoiLz4NCgk8cGF0aCBmaWxsPSIjMzZjIiBkPSJNNS43NjUgMUgxMXY1LjM5TDkuNDI3IDcuOTM3bC0xLjMxLTEuMzFMNS4zOTMgOS4zNWwtMi42OS0yLjY4OCAyLjgxLTIuODA4TDQuMiAyLjU0NHoiLz4NCgk8cGF0aCBmaWxsPSIjZmZmIiBkPSJNOS45OTUgMi4wMDRsLjAyMiA0Ljg4NUw4LjIgNS4wNyA1LjMyIDcuOTUgNC4wOSA2LjcyM2wyLjg4Mi0yLjg4LTEuODUtMS44NTJ6Ii8+DQo8L3N2Zz4NCg==');
}

.icon-subscriptions {
    background-image: url('data:image/svg+xml;base64,DQo8c3ZnIGFyaWEtaGlkZGVuPSJ0cnVlIiBmb2N1c2FibGU9ImZhbHNlIiBkYXRhLXByZWZpeD0iZmFzIiBkYXRhLWljb249InJlY2VpcHQiIGNsYXNzPSJzdmctaW5saW5lLS1mYSBmYS1yZWNlaXB0IGZhLXctMTIiIHJvbGU9ImltZyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgMzg0IDUxMiI+PHBhdGggZmlsbD0iY3VycmVudENvbG9yIiBkPSJNMzU4LjQgMy4yTDMyMCA0OCAyNjUuNiAzLjJhMTUuOSAxNS45IDAgMCAwLTE5LjIgMEwxOTIgNDggMTM3LjYgMy4yYTE1LjkgMTUuOSAwIDAgMC0xOS4yIDBMNjQgNDggMjUuNiAzLjJDMTUtNC43IDAgMi44IDAgMTZ2NDgwYzAgMTMuMiAxNSAyMC43IDI1LjYgMTIuOEw2NCA0NjRsNTQuNCA0NC44YTE1LjkgMTUuOSAwIDAgMCAxOS4yIDBMMTkyIDQ2NGw1NC40IDQ0LjhhMTUuOSAxNS45IDAgMCAwIDE5LjIgMEwzMjAgNDY0bDM4LjQgNDQuOGMxMC41IDcuOSAyNS42LjQgMjUuNi0xMi44VjE2YzAtMTMuMi0xNS0yMC43LTI1LjYtMTIuOHpNMzIwIDM2MGMwIDQuNC0zLjYgOC04IDhINzJjLTQuNCAwLTgtMy42LTgtOHYtMTZjMC00LjQgMy42LTggOC04aDI0MGM0LjQgMCA4IDMuNiA4IDh2MTZ6bTAtOTZjMCA0LjQtMy42IDgtOCA4SDcyYy00LjQgMC04LTMuNi04LTh2LTE2YzAtNC40IDMuNi04IDgtOGgyNDBjNC40IDAgOCAzLjYgOCA4djE2em0wLTk2YzAgNC40LTMuNiA4LTggOEg3MmMtNC40IDAtOC0zLjYtOC04di0xNmMwLTQuNCAzLjYtOCA4LThoMjQwYzQuNCAwIDggMy42IDggOHYxNnoiPjwvcGF0aD48L3N2Zz4=');
}

.icon-spot {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yNyAxNUMyNi41MTIxIDkuNzAxMTcgMjIuMzAxMiA1LjUxMTMzIDE3IDUuMDVWMkgxNVY1LjA1QzkuNzE4MjcgNS41MzQxNCA1LjUzNDE0IDkuNzE4MjcgNS4wNSAxNUgyVjE3SDUuMDVDNS41MTEzMyAyMi4zMDEyIDkuNzAxMTcgMjYuNTEyMSAxNSAyN1YzMEgxN1YyN0MyMi4zMTgzIDI2LjUzNSAyNi41MzUgMjIuMzE4MyAyNyAxN0gzMFYxNUgyN1pNMTYgMjVDMTEuMDI5NCAyNSA3IDIwLjk3MDYgNyAxNkM3IDExLjAyOTQgMTEuMDI5NCA3IDE2IDdDMjAuOTcwNiA3IDI1IDExLjAyOTQgMjUgMTZDMjUgMTguMzg2OSAyNC4wNTE4IDIwLjY3NjEgMjIuMzY0IDIyLjM2NEMyMC42NzYxIDI0LjA1MTggMTguMzg2OSAyNSAxNiAyNVpNMTYgMTJDMTMuNzkwOSAxMiAxMiAxMy43OTA5IDEyIDE2QzEyIDE4LjIwOTEgMTMuNzkwOSAyMCAxNiAyMEMxOC4yMDkxIDIwIDIwIDE4LjIwOTEgMjAgMTZDMjAgMTMuNzkwOSAxOC4yMDkxIDEyIDE2IDEyWk0xNiAxOEMxNC44OTU0IDE4IDE0IDE3LjEwNDYgMTQgMTZDMTQgMTQuODk1NCAxNC44OTU0IDE0IDE2IDE0QzE3LjEwNDYgMTQgMTggMTQuODk1NCAxOCAxNkMxOCAxNy4xMDQ2IDE3LjEwNDYgMTggMTYgMThaIiBmaWxsPSIjM0MzQzNCIi8+Cjwvc3ZnPgo=');
}

.icon-qr {
    background-image: url('data:image/svg+xml;base64,DQo8c3ZnIGFyaWEtaGlkZGVuPSJ0cnVlIiBmb2N1c2FibGU9ImZhbHNlIiBkYXRhLXByZWZpeD0iZmFzIiBkYXRhLWljb249InFyY29kZSIgY2xhc3M9InN2Zy1pbmxpbmUtLWZhIGZhLXFyY29kZSBmYS13LTE0IiByb2xlPSJpbWciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDQ0OCA1MTIiPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZD0iTTAgMjI0aDE5MlYzMkgwdjE5MnpNNjQgOTZoNjR2NjRINjRWOTZ6bTE5Mi02NHYxOTJoMTkyVjMySDI1NnptMTI4IDEyOGgtNjRWOTZoNjR2NjR6TTAgNDgwaDE5MlYyODhIMHYxOTJ6bTY0LTEyOGg2NHY2NEg2NHYtNjR6bTM1Mi02NGgzMnYxMjhoLTk2di0zMmgtMzJ2OTZoLTY0VjI4OGg5NnYzMmg2NHYtMzJ6bTAgMTYwaDMydjMyaC0zMnYtMzJ6bS02NCAwaDMydjMyaC0zMnYtMzJ6Ij48L3BhdGg+PC9zdmc+');
}

.icon-menu {
    background-image: url('data:image/svg+xml;base64,DQo8c3ZnIGFyaWEtaGlkZGVuPSJ0cnVlIiBmb2N1c2FibGU9ImZhbHNlIiBkYXRhLXByZWZpeD0iZmFzIiBkYXRhLWljb249InV0ZW5zaWxzIiBjbGFzcz0ic3ZnLWlubGluZS0tZmEgZmEtdXRlbnNpbHMgZmEtdy0xMyIgcm9sZT0iaW1nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0MTYgNTEyIj48cGF0aCBmaWxsPSJjdXJyZW50Q29sb3IiIGQ9Ik0yMDcuOSAxNS4yYy44IDQuNyAxNi4xIDk0LjUgMTYuMSAxMjguOCAwIDUyLjMtMjcuOCA4OS42LTY4LjkgMTA0LjZMMTY4IDQ4Ni43Yy43IDEzLjctMTAuMiAyNS4zLTI0IDI1LjNIODBjLTEzLjcgMC0yNC43LTExLjUtMjQtMjUuM2wxMi45LTIzOC4xQzI3LjcgMjMzLjYgMCAxOTYuMiAwIDE0NCAwIDEwOS42IDE1LjMgMTkuOSAxNi4xIDE1LjIgMTkuMy01LjEgNjEuNC01LjQgNjQgMTYuM3YxNDEuMmMxLjMgMy40IDE1LjEgMy4yIDE2IDAgMS40LTI1LjMgNy45LTEzOS4yIDgtMTQxLjggMy4zLTIwLjggNDQuNy0yMC44IDQ3LjkgMCAuMiAyLjcgNi42IDExNi41IDggMTQxLjguOSAzLjIgMTQuOCAzLjQgMTYgMFYxNi4zYzIuNi0yMS42IDQ0LjgtMjEuNCA0OC0xLjF6bTExOS4yIDI4NS43bC0xNSAxODUuMWMtMS4yIDE0IDkuOSAyNiAyMy45IDI2aDU2YzEzLjMgMCAyNC0xMC43IDI0LTI0VjI0YzAtMTMuMi0xMC43LTI0LTI0LTI0LTgyLjUgMC0yMjEuNCAxNzguNS02NC45IDMwMC45eiI+PC9wYXRoPjwvc3ZnPg==');
}

.icon-trash {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0iI2RjMzU0NSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTIwLjAwMDIgNS4wMDAwNFY2LjAwMDA2SDI4LjAwMDNWOC4wMDAwOEgyNi4wMDAzVjI3LjAwMDNDMjYuMDAwMyAyOC42NTcyIDI0LjY1NzEgMzAuMDAwNCAyMy4wMDAzIDMwLjAwMDRIOS4wMDAwN0M3LjM0MzE5IDMwLjAwMDQgNi4wMDAwMyAyOC42NTcyIDYuMDAwMDMgMjcuMDAwM1Y4LjAwMDA4SDRWNi4wMDAwNkgxMi4wMDAxVjUuMDAwMDRDMTIuMDAwMSAzLjM0MzE2IDEzLjM0MzMgMiAxNS4wMDAyIDJIMTcuMDAwMkMxOC42NTcxIDIgMjAuMDAwMiAzLjM0MzE2IDIwLjAwMDIgNS4wMDAwNFpNMTQuOTk5OSAzLjk5OTc2QzE0LjQ0NzYgMy45OTk3NiAxMy45OTk5IDQuNDQ3NDggMTMuOTk5OSA0Ljk5OTc3VjUuOTk5NzlIMTcuOTk5OVY0Ljk5OTc3QzE3Ljk5OTkgNC40NDc0OCAxNy41NTIyIDMuOTk5NzYgMTYuOTk5OSAzLjk5OTc2SDE0Ljk5OTlaTTIzLjk5OTYgMjYuOTk5N0MyMy45OTk2IDI3LjU1MiAyMy41NTE5IDI3Ljk5OTcgMjIuOTk5NiAyNy45OTk3SDguOTk5NDRDOC40NDcxNSAyNy45OTk3IDcuOTk5NDMgMjcuNTUyIDcuOTk5NDMgMjYuOTk5N1Y3Ljk5OTQ1SDIzLjk5OTZWMjYuOTk5N1pNMTEgMTEuOTk5N0gxM1YyMy45OTk5SDExVjExLjk5OTdaTTE3LjAwMDMgMTEuOTk5N0gxNS4wMDAzVjIzLjk5OTlIMTcuMDAwM1YxMS45OTk3Wk0yMSAxMS45OTk3SDE4Ljk5OTlWMjMuOTk5OUgyMVYxMS45OTk3WiIvPjwvc3ZnPgo=');
}

.icon-trash:active,
.icon-trash:hover {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0id2hpdGUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yMC4wMDAyIDUuMDAwMDRWNi4wMDAwNkgyOC4wMDAzVjguMDAwMDhIMjYuMDAwM1YyNy4wMDAzQzI2LjAwMDMgMjguNjU3MiAyNC42NTcxIDMwLjAwMDQgMjMuMDAwMyAzMC4wMDA0SDkuMDAwMDdDNy4zNDMxOSAzMC4wMDA0IDYuMDAwMDMgMjguNjU3MiA2LjAwMDAzIDI3LjAwMDNWOC4wMDAwOEg0VjYuMDAwMDZIMTIuMDAwMVY1LjAwMDA0QzEyLjAwMDEgMy4zNDMxNiAxMy4zNDMzIDIgMTUuMDAwMiAySDE3LjAwMDJDMTguNjU3MSAyIDIwLjAwMDIgMy4zNDMxNiAyMC4wMDAyIDUuMDAwMDRaTTE0Ljk5OTkgMy45OTk3NkMxNC40NDc2IDMuOTk5NzYgMTMuOTk5OSA0LjQ0NzQ4IDEzLjk5OTkgNC45OTk3N1Y1Ljk5OTc5SDE3Ljk5OTlWNC45OTk3N0MxNy45OTk5IDQuNDQ3NDggMTcuNTUyMiAzLjk5OTc2IDE2Ljk5OTkgMy45OTk3NkgxNC45OTk5Wk0yMy45OTk2IDI2Ljk5OTdDMjMuOTk5NiAyNy41NTIgMjMuNTUxOSAyNy45OTk3IDIyLjk5OTYgMjcuOTk5N0g4Ljk5OTQ0QzguNDQ3MTUgMjcuOTk5NyA3Ljk5OTQzIDI3LjU1MiA3Ljk5OTQzIDI2Ljk5OTdWNy45OTk0NUgyMy45OTk2VjI2Ljk5OTdaTTExIDExLjk5OTdIMTNWMjMuOTk5OUgxMVYxMS45OTk3Wk0xNy4wMDAzIDExLjk5OTdIMTUuMDAwM1YyMy45OTk5SDE3LjAwMDNWMTEuOTk5N1pNMjEgMTEuOTk5N0gxOC45OTk5VjIzLjk5OTlIMjFWMTEuOTk5N1oiLz48L3N2Zz4K');
}

/*********************************************************** others ************/
.redball {
    background-color: #ef4b4b;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    vertical-align: 7px;
    margin-left: -2px;
    position: absolute;
}

/********************************************** spinner (c&p bootstrap 4.4) ***/
@keyframes spinner-border {
    to { transform: rotate(360deg); }
}
.text-primary {
    color: #007bff!important;
}
.spinner-border {
    display: inline-block;
    width: 2rem;
    height: 2rem;
    vertical-align: text-bottom;
    border: .25em solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    -webkit-animation: spinner-border .75s linear infinite;
    animation: spinner-border .75s linear infinite;
}

/**************************************************** saving bar **************/
/* inspiration: https://material.io/components/progress-indicators#usage */

@keyframes indeterminated {
    0% {
        left: 0;
        width: 0;
    }
    50% {
        left: 0;
        width: 100%;
    }
    100% {
        left: 100%;
        width: 0;
    }
}

.saving {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    height: 6px;
    z-index: 9999;

    background-color: #ded1f3;
}

.saving .indeterminated {
    background-color: #b64af8;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 20%;
    right: 70%;
    animation: indeterminated 2s linear infinite;
}

.saving-text {
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    right: 0;
    height: 0;
    text-align: center;
}

.saving-text .border {
    display: inline-block;
    background-color: #ded1f3;
    margin: 3px auto;
    padding: 3px 8px;
    border-radius: 3px;
    font-weight: bold;
    box-shadow: 1px 1px 8px rgba(0,0,0,0.3);
}

/* Editable field */
.editable {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzJweCIgaGVpZ2h0PSIzMnB4IiB2aWV3Qm94PSIwIDAgMzIgMzIiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+PGRlZnM+PGZpbHRlciBpZD0iZmlsdGVyLTEiPjxmZUNvbG9yTWF0cml4IGluPSJTb3VyY2VHcmFwaGljIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwLjEyNjE0MiAwIDAgMCAwIDAuNDgxMzQwIDAgMCAwIDAgMC4yMDMxMzcgMCAwIDAgMS4wMDAwMDAgMCI+PC9mZUNvbG9yTWF0cml4PjwvZmlsdGVyPjwvZGVmcz48ZyBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48ZyBpZD0iT3V0bGluZWQvVUkvZWRpdCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTg1MS4wMDAwMDAsIC00MDczLjAwMDAwMCkiIGZpbHRlcj0idXJsKCNmaWx0ZXItMSkiPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDg1MS4wMDAwMDAsIDQwNzMuMDAwMDAwKSI+PHBhdGggZD0iTTI5LjEyLDYuMDQ5OTk5OTcgTDI2LDIuODc5OTk5OTYgQzI0LjgyODcyOTgsMS43MTAxODY0NCAyMi45MzEyNzAyLDEuNzEwMTg2NDQgMjEuNzYsMi44Nzk5OTk5NiBMNi4yODk5OTk5NywxOC4yOSBDNS45NjMxMzY5NSwxOC42MjMyNjY0IDUuNzE2ODUzNjIsMTkuMDI2ODk3NCA1LjU2OTk5OTk3LDE5LjQ3IEwyLjA3OTk5OTk2LDI5LjkyIEwxMi41NCwyNi40MyBDMTIuOTc4MjIyNCwyNi4yNzkwMDI5IDEzLjM3NzcyMjEsMjYuMDMzMTU3IDEzLjcxLDI1LjcxIEwyOS4xMiwxMC4yOSBDMzAuMjg5ODEzNiw5LjExODcyOTc5IDMwLjI4OTgxMzYsNy4yMjEyNzAxNiAyOS4xMiw2LjA0OTk5OTk3IFogTTguMTE5OTk5OTgsMTkuMzMgTDE2Ljg3LDEwLjU5IEwxOC40NSwxMi4xNyBMOS42Njk5OTk5OCwyMC45MiBMOC4xMTk5OTk5OCwxOS4zMyBaIE0xOC4yNCw5LjE2OTk5OTk4IEwxOS44Myw3LjU4OTk5OTk3IEwyNC40MSwxMi4xNyBMMjIuODMsMTMuNzYgTDE4LjI0LDkuMTY5OTk5OTggWiBNNy4wOTk5OTk5NywyMS4xOSBMMTAuODIsMjQuOSBMNS4yNDk5OTk5NywyNi43NSBMNy4wOTk5OTk5NywyMS4xOSBaIE0xMi42NywyMy45MiBMMTEuMDgsMjIuMzMgTDE5LjgzLDEzLjU5IEwyMS40MSwxNS4xNyBMMTIuNjcsMjMuOTIgWiBNMjcuNjcsOC45MTk5OTk5OCBMMjUuNzksMTAuOCBMMjEuMjQsNi4xNjk5OTk5NyBMMjMuMTIsNC4yODk5OTk5NiBDMjMuMzA4NzE4OSw0LjEwMjgxMzQ1IDIzLjU2NDE5NywzLjk5ODQ2MzIgMjMuODMsMy45OTk5ODMyMyBDMjQuMDk1ODAzLDMuOTk4NDYzMiAyNC4zNTEyODEyLDQuMTAyODEzNDUgMjQuNTQsNC4yODk5OTk5NiBMMjcuNzEsNy40Njk5OTk5NyBDMjcuODk0NzQ0Miw3LjY1NjI2MDYxIDI3Ljk5ODg5NTQsNy45MDc2NjAxIDI4LjAwMDAxNjgsOC4xNjk5OTk5OCBDMjguMDAxNTM2OCw4LjQzNTgwMjk2IDI3Ljg5NzE4NjYsOC42OTEyODExNSAyNy43MSw4Ljg3OTk5OTk4IEwyNy42Nyw4LjkxOTk5OTk4IFoiIGlkPSJTdHlsZSIgZmlsbD0iIzI1MkMzMiI+PC9wYXRoPjwvZz48L2c+PC9nPjwvc3ZnPg==');
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center right;
    border: none;
}

.editable:focus {
    background-image: none;
}

.editable-big {
    background-size: 30px;
}

.editable-top {
    background-position: right top;
}


.form-control {
    background-color: #F2F2F2;
    border: none;
    border-bottom: solid 1px #3C3C3B;
    border-radius: 0;
}

/* pretty checkbox */

.pretty-checkbox {
    position: absolute; opacity: 0;
}

.pretty-checkbox:before {
    content: ' ';
    display: inline-block;
    width: 30px;
    height: 30px;
    border: solid black 2px;
}

/* Shake effect */
@keyframes shake {
    10%, 90% {
        transform: rotate(-1deg);
    }

    20%, 80% {
        transform: rotate(2deg);
    }

    30%, 50%, 70% {
        transform: rotate(-4deg);
    }

    40%, 60% {
        transform: rotate(4deg);
    }
}

@keyframes tada {
    0% {
        -webkit-transform:scaleX(1);
        transform:scaleX(1);
    }
    10%,20% {
        -webkit-transform:scale3d(.9,.9,.9) rotate(-3deg);
        transform:scale3d(.9,.9,.9) rotate(-3deg);
    }
    30%,50%,70%,90% {
        -webkit-transform:scale3d(1.05,1.05,1.05) rotate(3deg);
        transform:scale3d(1.05,1.05,1.05) rotate(3deg);
    }
    40%,60%,80% {
        -webkit-transform:scale3d(1.05,1.05,1.05) rotate(-3deg);
        transform:scale3d(1.05,1.05,1.05) rotate(-3deg);
    }
    to{
        -webkit-transform:scaleX(1);
        transform:scaleX(1);
    }
}


.section-selector {
    text-align: center;
    display: inline-block;
    border: solid #5E5E5E 1px;
    border-radius: 6px;
    padding: 6px;
}

.section-selector-checked {
    border-color: #48AD4D;
    background: no-repeat top right url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAXCAYAAAD3CERpAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH5AkNAiwpxnxuNAAAAXNJREFUSMfF1TFPwkAUB/D/uwaBoEE3RhaCI2644WKq6VBiDLOfwPgJLJ9A/QR1M7EkJerQzW5+B8LAZBgMgjpgSO8ctImQtNBylDde7/rLe6+vRwCgWloNjEwARawmegCazsnjLQCQv6raehHce14hDDAynPpDk2bXj1ratSA6l+XwMcdk6CFdSOEvywtldlP3vuOUGuURAFUG+Gq+IbWjIF3Y8NEqBR1Yttw+mN/PYauSm65y0CGn3u6BKQcQwpUJTn1IYaFamgFGlzLA0Eynsj59MgCcCWA4+2z48oXv/mRhcOFMw/rMxxz9uwHy1U28ux9zwcgoANRsfTvLPVMA+n944H4iW0wjt5uZ+w6KOw5R+iwNBYDDlqYzoquoY0XL/gDizDNbFnXq7d6YKXskxE1imcbps1QUAI5tvcK5Z4eVWzrq91kIbpMQlcTQeeVWVol2rY5bapRH4vc6yySSadBYsSRQ/5okoI11hGppxlrgH7lql/37wDSXAAAAAElFTkSuQmCC');
}


/*
@keyframes shake {
    10%, 90% {
        transform: translate3d(-1px, 0, 0);
    }

    20%, 80% {
        transform: translate3d(2px, 0, 0);
    }

    30%, 50%, 70% {
        transform: translate3d(-4px, 0, 0);
    }

    40%, 60% {
        transform: translate3d(4px, 0, 0);
    }
}


*/

/* pretty-checkbox.css*/
.pretty-checkbox {
    width: 0;
    height: 0;
    position: absolute;
    top: -1000px;
    left: -1000px;
}

.pretty-checkbox-label {
    display: block;
    padding: 3px;
}

.pretty-checkbox-text {
    vertical-align: middle;
}

.pretty-checkbox + .pretty-checkbox-mark {
    display: inline-block;
    width: 26px;
    height: 26px;
    border: solid #3C3C3B 2px;
    vertical-align: middle;
    margin-right: 6px;
    cursor: pointer;
}

.pretty-checkbox:checked + .pretty-checkbox-mark {
    border-color: #BDBDBD;
    background-color: #219653;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMjIiIHZpZXdCb3g9IjAgMCAyMiAyMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik02Ljg3NDg0IDE3LjU4NjRDNi4zMjkgMTcuNTg3OCA1LjgwNDg5IDE3LjM3MjcgNS40MTczNCAxNi45ODgzTDIuMjYxNzIgMTMuODMyN0wzLjIzNzk3IDEyLjg2MzNMNi4zODY3MiAxNi4wMTJDNi41MTU4MSAxNi4xNDIyIDYuNjkxNTMgMTYuMjE1NCA2Ljg3NDg0IDE2LjIxNTRDNy4wNTgxNiAxNi4yMTU0IDcuMjMzODggMTYuMTQyMiA3LjM2Mjk3IDE2LjAxMkwxOC43NjE3IDQuNjEzMjhMMTkuNzM4IDUuNTgyNjZMOC4zMzIzNCAxNi45ODgzQzcuOTQ0OCAxNy4zNzI3IDcuNDIwNjggMTcuNTg3OCA2Ljg3NDg0IDE3LjU4NjRaIiBmaWxsPSJ3aGl0ZSIvPgo8L3N2Zz4K");
    background-repeat: no-repeat;
    background-position: center center;
}


.invoice-box {
    max-width: 800px;
    margin: auto;
    padding: 30px;
    border: 1px solid #eee;
    box-shadow: 0 0 10px rgba(0, 0, 0, .15);
    font-size: 16px;
    line-height: 24px;
    font-family: 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif;
    color: #555;
}

.invoice-box table {
    width: 100%;
    line-height: inherit;
    text-align: left;
}

.invoice-box table td {
    padding: 5px;
    vertical-align: top;
}

.invoice-box table tr td:nth-child(2) {
    text-align: right;
}

.invoice-box table tr.top table td {
    padding-bottom: 20px;
}

.invoice-box table tr.top table td.title {
    font-size: 45px;
    line-height: 45px;
    color: #333;
}

.invoice-box table tr.information table td {
    padding-bottom: 40px;
}

.invoice-box table tr.heading td {
    background: #eee;
    border-bottom: 1px solid #ddd;
    font-weight: bold;
}

.invoice-box table tr.details td {
    padding-bottom: 20px;
}

.invoice-box table tr.item td{
    border-bottom: 1px solid #eee;
}

.invoice-box table tr.item.last td {
    border-bottom: none;
}

.invoice-box table tr.total td:nth-child(2) {
    border-top: 2px solid #eee;
    font-weight: bold;
}

@media only screen and (max-width: 600px) {
    .invoice-box table tr.top table td {
        width: 100%;
        display: block;
        text-align: center;
    }

    .invoice-box table tr.information table td {
        width: 100%;
        display: block;
        text-align: center;
    }
}

/** RTL **/
.rtl {
    direction: rtl;
    font-family: Tahoma, 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif;
}

.rtl table {
    text-align: right;
}

.rtl table tr td:nth-child(2) {
    text-align: left;
}


/* Alert button close */
.alert-dismissible .btn-close {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    padding: 1.25rem 1rem;
    cursor: pointer;
}

.btn-close {
    box-sizing: content-box;
    width: 1em;
    height: 1em;
    padding: .25em .25em;
    color: #000;
    background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
    border: 0;
    border-radius: .25rem;
    opacity: .5;
}

/* surprise */
.surprise {
    overflow: hidden;
}

.surprise > * {
    margin-top: -300px;
    transition: margin-top 0.8s ease-in-out;
}

.surprise-show > * {
    margin-top: 0 !important;
}
