/*
Copyright (c) 2010-2025 schulmenueplaner.de GmbH. Alle Rechte vorbehalten.

Dieser Quellcode ist das geistige Eigentum der schulmenueplaner.de GmbH und
unterliegt dem Urheberrecht. Er darf ohne vorherige schriftliche Zustimmung
der schulmenueplaner.de GmbH weder ganz noch teilweise reproduziert, modifiziert,
veröffentlicht oder in irgendeiner Form weitergegeben werden.

Die in diesem Quellcode enthaltenen Informationen sind vertraulich und dürfen
nur für den internen Gebrauch verwendet werden.
*/

.btn:focus {
    outline: none;
}

.nopadding {
    padding: 0;
}

.navbar-toggle-left {
  float: left;
  margin-left: 15px;
}

.item-switch{
    width: 100%;
    position: relative;
    text-align: center;
    height: 3em;
}

.item-switch-previous,
.item-switch-next{
    text-decoration: none;
    color: #909090;
    font-size: 2em;
    height: 100%;
    line-height: 1.5em;
}

.item-switch-previous:hover,
.item-switch-next:hover{
    text-decoration: none;
}

.item-switch-previous{
    position: absolute;
    left: 0px;
}

.item-switch-next{
    position: absolute;
    right: 0px;
}

.item-switch-item{
    font-size: 1.5em;
    line-height: 2em;
}

.day{
    width: 100%;
    text-align: center;
    height: 3em;
}

.day .name{
    float: left;
    height: 100%;
    color: #fff;
    background-color: #8c8c8c;
    border-radius: 30px;
    width: 2.7em;
    height: 2.7em;
    line-height: 2.7em;
    text-align: center;
    margin: 0px 1em 0px 0px;
}

.day .breakfast{
    float: left;
    width: 10%;
    line-height: 2.7em;
}

.day .short-description{
    float: left;
    width: 50%;
    line-height: 2.7em;
}

.day .snack{
    float: left;
    width: 10%;
    line-height: 2.7em;
}

.client-blue{
    background-color: blue;
    color: #fff;
}

.client-blue a.navbar-brand{
    color: #fff;
}

.header,
.content{
    max-width: 1000px;
    margin: 0px auto;
}

.content{
    padding: 10px 25px 50px 25px;
}

.container-fluid {
    padding: 0;
}


.index-site-mealplan { margin-top: 1em; }


/***** Food order table ******/

.table .order-button-cell{
    vertical-align: middle;
    border-top: 0px;
    border-right: 1px solid #ddd;
}
.table .order-button-cell p {
    margin-bottom: 1px;
}
.table .order-button-cell:last-child{
    border-right: 0px;
}

.food-order th,
.menu-cell{
    border-right: 1px solid #ddd;
}
.food-order th:last-child,
.menu-cell:last-child{
    border-right: 0px;
}
.food-order .last-row > td {
    height: 0;
    padding: 0;
}
.panel-mealplan .panel-body {
    padding: 0 0 15px 0;
}
.panel-mealplan .mealplan-bottom {
    padding: 10px 15px 0;
}
.food-order .menu-meal {
    border-right: 1px solid #ddd;
    vertical-align: middle;
    font-size: 0.9em;
    font-weight: bold;
    background-color: #eee;
    padding-left: 15px;
}
.food-order th.menu-meal {
    background-color: inherit;
}

.table.food-order{
    margin-bottom: 0px;
    font-size: 13px;
    border-bottom: 1px solid #ccc;
    table-layout: fixed;
    overflow-wrap: break-word;
}

.menu-allergens-panel {font-size: 80%;}

.menu-actions {
    width: 60%;
    margin: 0 auto;
}
.menu-actions .btn,
.menu-actions input[name=quantity] {
    height: 28px;
}
.menu-actions .btn {
    padding: 4px 8px;
}
.menu-actions input[name=quantity] {
    background-color: #fff;
    min-width: 43px;
    padding-left:8px;
    padding-right:8px;
}
.menu-actions .btn.disabled {
  color: #aaa;
}
.menu-attribute-logos {
    text-align: right;
}
.menu-attribute-logos img {
    height: 22px;
}

.dependent-msg .glyphicon:before {
  line-height: 21px;
}
.dependent-msg {
  display: none;
  text-align: center;
}
.not-available {
  background-color: #eee;
}
.small_view .not-available {
  background-color: transparent;
}
.not-available > form,
.not-available > .menu-order-status {
  display: none;
}
.not-available .dependent-msg {
  display: block;
}

.food-order .allergy-meal > span {
  color: #aaa;
  font-style: italic;
}

.small_view .menu-actions .quantity-step span {
    margin: 2px;
}
.small_view .menu-actions{width:auto;}

td.menu-ordered {
    background-color: #deffdd;
}
.menu-ordered .order-confirmed {
    display: block;
    color: gray;
    font-size: 0.8em;
    padding-top: 5px;
    text-align: center;
}
.order-confirmed {
    display: none;
}

.small_view .menu-ordered .order-quantity {
  background-color: #fff;
}
.small_view .menu-actions > button {
  width: 50px !important;
  padding: 0;
  margin: 0;
  height: 35px;
}
.small_view .menu-actions > button:first-child {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
.small_view .menu-actions > button:last-child {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.small_view .menu-actions > input {
  width: 50px !important;
  margin-top: -1px;
  margin-bottom: -1px;
  padding: 2px 0;
  height: 30px;
  border: 1px solid #ccc;
}

table.food-order td.menu-ordered {
  vertical-align: middle;
}

/* center text in food order table where food is ordered and can't be canceled. Past order table cell */
.menu-order-status {
  text-align: center;
}

/***** End Food order table ******/

/**** START Toggle style ****/
.toggle{
    display: none;
    position: absolute;
    width: 48px;    /* 44px / 16px */
    height: 48px;
    text-decoration: none;
    padding: 0;
    font-size: 30px;
    line-height: 1.8em;
}

.toggle.for-navigation{
    left: 0px;
    top: 0px;

}

.toggle.for-auth{
    right: 0px;
    top: 0px;
}

/**** END Toggle style ****/


/**** START Switch style ****/
.switch{
    height: 2.75em;
    position: relative;
    padding: 0px 2.75em;
    margin: 0 0 0.2em;
}

.switch .left,
.switch .right{
    font-size: 2.75em;
    color: #337AB7;
    /*width: 2.75em;
    height: 2.75em;*/
    position: absolute;
    top: 0px;
    text-decoration: none;
    outline: none;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 10;
}

.switch .left{
    left: 0px;
}

.switch .right{
    right: -0.85em;
}

.switch span.right,
.switch span.left,
.switch .right.disabled,
.switch .left.disabled
{
    color: #909090;
}

.week-switch{
    margin-bottom: 1em;
}

.switch .item{
    text-align: center;
    line-height: 2.2em;
    font-size: 1.3em;
    color: #464646;
    overflow: hidden;
    height: 100%;
}

.table.small-menu td{
    border-top: solid 1px #f3f3f3;
}

.table.small-menu {
    width: 100%;
}
.table.small-menu td.text-left {
    overflow: hidden;
    text-overflow: ellipsis;
}
.table.small-menu td.vert-align {
    width: calc(100% - 108px);
}
.table.small-menu td.vert-buttons {
    width: 60px;
}

.day-meal {
    height: 4.2em;
    margin: 0 0 0.2em;
    position: relative;
    display: block;
    padding: 5px 0px 0px 0px;
    border-top: solid 1px #ddd;
    color: #333;
}
.day-meal,
.day-meal:link,
.day-meal:hover {
    text-decoration: none;
}
.day-meal .menu-expand {
    position: absolute;
    right: 15px;
    top: 15px;
    color: gray;
}
.day-meal .brief-order-status {
    padding: 0px 4em 0px 10px;
    font-size: 1em;
    height: 2em;
    overflow: hidden;
    display: flex;
}
.brief-order-status .ordered-mealtime {
    text-align: center;
    display: inline-block;
    border: 1px solid gray;
    height: 26px;
    width: 26px;
    line-height: 26px;
    border-radius: 5px;
    font-size: 0.8em;
    margin-right: 3px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background-color: #eee;
    flex: 0 0 auto;
    align-self: center;
}
.brief-order-status:empty {
    text-align: center;
}
.brief-order-status:empty:before {
    content: 'Keine Bestellung';
    text-decoration: none;
    color: gray;
    flex: 1;

}
.brief-order-status .lunch-desc {
    padding-left: 5px;
    font-size: 0.8em;
    flex: 1 1 auto;
}

.day-meal .day-wrapper {
    float: left;
    height: 3em;
}
.day-meal .short-date {
    margin-top: 2px;
    margin-left: 15px;
    font-size: 0.8em;
    color: black;
}
.day-meal.collapsed .glyphicon-chevron-down,
.day-meal:not(.collapsed) .glyphicon-chevron-up {
    display: block;
}
.day-meal.collapsed .glyphicon-chevron-up,
.day-meal:not(.collapsed) .glyphicon-chevron-down {
    display: none;
}

.day-meal .day{
    background-color: #585858;
    color: #FFF;
    text-align: center;
    border-radius: 5px;
    margin: 0px 0.5em 0px 0.7em;
    width: 2.75em;
    display: block;
    height: 2.75em;
    font-size: 1em;
    line-height: 2.8em;
    font-weight: bold;
}

.day-meal .breakfast{
    width: 2.75em;
    height: 2.75em;
    float: left;
    background: url(../images/breakfast.png) no-repeat center center;
    position: relative;
}

.day-meal .breakfast .red-cross,
.day-meal .snack .red-cross
{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: url(../images/red_cross.png) no-repeat center center;
    display: block;
}

.day-meal .breakfast.ordered .red-cross,
.day-meal .snack.ordered .red-cross{
    display: none;
}

.day-meal .spacer{
    float: left;
    margin: 0.375em 0.4em 0;
    height: 2em;
    width: 1px;
    overflow: hidden;
    background-color: #a6a6a6;
}

.day-meal .spacer.right{
    position: absolute;
    right: 3.45em;
    top: 0px;
}

.day-meal .snack{
    top: 0px;
    position: absolute;
    right: 0.7em;
    width: 2.75em;
    height: 2.75em;
    background: url(../images/lunch.png) no-repeat center center;
}

/**** END Switch style ****/


/**** START Header style ****/
.header{
    position: relative;
    min-height: 50px;
}

.header-account-balance {
    margin-top: 1em;
}

/**** END Header style ****/


/**** START User box style ****/
.header .user-box{
    position: absolute;
    top: 0px;
    right: 0px;
}
/**** END User box style ****/


/**** START Auth box style ****/
.header .auth-box{
    position: absolute;
    top: 0px;
    right: 0px;
}

.auth-box ul li{
    float: left;
    margin: 0 0 0 0.5em;
    line-height: 1.8em;
    list-style: none;
}

.auth-box label{
    display: block;
    font-size: 0.8125em;    /* 13px / 16px */
    color: #136f60;
    padding: 0 0 0.2em;
}

.auth-box input{
    width: 12.5em;    /* 200px / 16px */
    border: solid #d6d6d6 1px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 0.8125em;    /* 13px / 16px */
    padding: 0.4em;
    color: #a5a5a5;
}

.auth-box button{
    /*font-size: 0.8125em;    /* 13px / 16px */
    /*padding: 0.4em;
    border: medium none;
    background-color: #337AB7;
    color: #fff;
    font-weight: bold;*/
}

.auth-box .forgot-password{
    display: block;
    color: black;
    padding: 0.2em 0 0;
    text-decoration: none;
    font-size: 0.75em;    /* 12px / 16px */
    text-decoration: underline;
    position: absolute;
    top: 27px;
    right: 93px;
}

.auth-box .modal_close{
    display: none;
    font-weight: bold;
    font-size: 1em;
    color: #000;
    text-decoration: none;

}

.auth-form{
    position: relative;
}

.auth-box .user-info{
    position: relative;
    top: 10px;
    right: 7px;
    text-align: right;
}
/**** END Auth box style ****/

.right-panel {
  margin-top: 20px;
}

/**** START Navigation style ****/
.navigation{
    margin: 1.5em 0 0 0;
    background-color: #fff;
}
/**** END Navigation style ****/



.table.days th .small-day{
    display: none;
}

table.receipt-details {
    width: 70%;
    margin-left: 50px;
    margin-bottom: 10px;
    font-size: 0.85em;
    color: #777;
}
table.receipt-details th,
table.receipt-details td {
    width: 30%;
}


/**** START Footer style ****/
.footer{
    color: #000;
    font-size: 0.8em;    /* 12px / 16px */
    background-color: #ececec;
    padding: 2em 3em;
    line-height: 1.5em;
    margin: 1em auto 0;
    max-width: 1000px;
}

.footer a{
    color: black;
}

.footer .block{
    float: left;
    height: 5.5em;    /* 120px / 16px */
    margin: 0 0 0.5em 0;
}

.footer .block .title{
    display: block;
    font-weight: bold;
    border-bottom: solid #3587c6 2px;
    padding: 0 0 0.3em;
    margin: 0 0 0.7em;
    font-size: 1.2em;
}

.footer .block .highlighted{
    font-weight: bold;
    color: black;
}

.footer .block.contacts{
    width: 50%;
    margin: 0 10% 0 0;
}

.footer .block.system{
    width: 40%;
}

.footer .left-block{
    margin: 0 3em 0 0;
    float: left;
    height: 5.5em;
    width: 10.3125em; /* 165px / 16px */
}
/**** END Footer style ****/

.customer_view_compact .headerTopContainer,
.customer_view_compact .footer,
.customer_view_compact .plain-hidden {
    display: none;
}

/*** Hide small view **/
.small_view{
    display: none;
}

/** Food order small view Loading **/
.loading{
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0.8;
    background-color: white;
    z-index: 100;
    background-image: url(../images/ajax-loader.gif);
    background-position: center center;
    background-repeat: no-repeat;
}

/*Bootstrap form-inline*/
.form-inline input{margin-bottom: 0}
.form-inline{margin-bottom:5px}

/**** START Middle view style ****/
@media screen and (max-width: 750px){
    .header .navigation{
        text-align: center;
    }

    .header .auth-box{
        position: absolute;

        display: none;
        background-color: #fff;

        width: 100%;
        top: 10em;
        left: 0px;
        z-index: 110;

    }

    .auth-form{
        height: 8em;
        padding: 0;
    }

    .header .auth-box .inner-box{
        position: relative;
        margin: 4em;
        height: 9.2em;
    }

    .header .auth-box .user-info{
        padding-top: 1em;
        padding-right: 1em;
    }

    .header .auth-box .modal_close{
        display: block;
        position: absolute;
        top: -2em;
        right: -2em;
    }

    .header .auth-box .username-box,
    .header .auth-box .password-box{
        width: 100%;
        margin: 0 0 1em;
    }

    .header .auth-box .forgot-password-box,
    .header .auth-box .login-button-box{
        position: absolute;
        bottom: 0px;
        width: 100%;
        text-align: center;
        left: 0px;
    }

    .header .auth-box .forgot-password-box{
        font-size: 1.2em;
        bottom: -2em;
    }

    .header .auth-box .username-box .input-group-sm,
    .header .auth-box .password-box .input-group-sm{
        width: 80%;
        margin: 0px auto;
    }

    .header .auth-box .forgot-password-box a{
        display: inline;
        padding: 0;
        position: relative;
        top: 0px;
        right: 0px;
    }

    .header .auth-box.show{
        display: block;
    }

    #overlay.show{
        display: block;
        opacity: 0.7;
    }

    .auth-box ul li{
        text-align: left;
    }

    .header .toggle.for-auth{
        display: block;
        top: 0.2em;
        right: 0.2em;
    }

    .footer .block.contacts,
    .footer .block.system{
        float: none;
        margin: 0px auto;
        width: 31.25em; /* 450px / 16px */
    }

    .footer .left-block{
        margin: 0 2em 0 0;
    }

    table.receipt-details {
        width: 90%;
        margin-left: 20px;
    }
}
/**** END Middle view style ****/

/**** START Almost small view style ****/
@media screen and (max-width: 580px){
    /*** Show small view **/
    .content {
        padding-bottom: 15px;
    }

    .small_view{
        display: block;
        position: relative;
    }

    /*** Hide big view **/
    .big_view{
        display: none;
    }

    .table.days th .small-day{
        display: inline;

    }

    .table.days th .big-day{
        display: none;

    }

    .menu-attribute-logos {
        text-align: right;
    }
    .menu-attribute-logos img {
        height: 22px;
    }
}

/**** START Small view style ****/
@media screen and (max-width: 450px){

    .header{
        min-height: 3.95em;
    }

    .header .actions{
        z-index: 51;
        position: relative;
    }

    .header .logo{
        display: block;
        width: 65%;
        margin: 0 auto;
    }

    .header .logo img{

        width: 100%;
    }

    .header .auth-box{
        position: absolute;

        display: none;
        background-color: #fff;

        width: 100%;
        top: 5em;
        left: 0px;
        z-index: 110;
    }

    .header .auth-box .inner-box{
        position: relative;
        margin: 4em;
        height: 10.2em;
    }

    .header .auth-box .modal_close{
        display: block;
        position: absolute;
        top: -2em;
        right: -2em;
    }

    .header .auth-box.show{
        display: block;
    }

    .header .auth-box .username-box,
    .header .auth-box .password-box{
        width: 100%;
        margin: 0 0 1em;
    }

    .header .auth-box .username-box .input-group-sm,
    .header .auth-box .password-box .input-group-sm{
        width: 100%;

    }

    .header .auth-box input{
        width: 90%;
        font-size: 1em;
    }

    .header .auth-box .forgot-password-box,
    .header .auth-box .login-button-box{
        position: absolute;
        width: 96%;
        text-align: center;
        left: -4%;
    }

    .header .auth-box .forgot-password-box{
        bottom: -2em;
        font-size: 1em;
    }

    .header .auth-box .login-button-box{
        bottom: 0;
    }

    .header .auth-box .login-button-box button{
        font-size: 0.9em;
    }

    .header .toggle{
        display: block;
        top: 0.2em;
    }

    .header .toggle.for-navigation{
        left: 0.2em;
    }

    .header .toggle.for-auth{
        right: 0.2em;
    }



    .header .navigation{
        display: none;
        position: absolute;
        width: 100%;
        top: 3em;
        z-index: 50;
    }

    .header .navigation li{
        float: none;
    }

    .header .navigation.show{
        display: block;
    }

    table.invoices a{
        display: block;
        width: 130px;
        overflow: hidden;
    }

    .footer{
        padding: 1em;
    }

    .footer .block.contacts,
    .footer .block.system{
        float: none;
        margin: 0px auto;
        width: 21em;
        height: auto;
    }

    .footer .block.contacts{
        margin-bottom: 1em;
    }

    .footer .block .left-block,
    .footer .block .block{
        width: 100%;
    }

    .footer .block.system .left-block{
        margin-bottom: 1.2em;
    }

}
/**** END Small view style ****/


/**** START Super Small view style ****/
@media screen and (max-width: 320px){

    .header .logo{
        width: 60%;
    }
}
/**** END Super Small view style ****/


/**** START Lean modal style ****/
#overlay {
    position: fixed;
    z-index:100;
    top: 0px;
    left: 0px;
    height:100%;
    width:100%;
    background: #000;
    display: none;
    opacity: 0;
}
/**** END Lean modal style ****/


/**** START Misc style ****/

.clear{
    clear: both;
}

.hidden{
    display: none;
}

.show-block{
    display: block;
}

.table tr>td.vert-align{
    vertical-align: middle;
}
.menu-mobile{
    display: block;
    width: inherit;
    text-overflow: ellipsis;
    overflow: hidden;
}

/** Used in client registration to set AGB text as red if don't accept rules because default bootstrap set border color
    and checkbox don't show border color **/
.has-error .agb{
    color: #a94442;
}

/** Used in kunde_guthaben_include as ban account number part. Need this to add space between 4 chars **/
.number-part {
    margin-right: 0.4em;
}

.table.invoices{
    width: auto;
}

.table .menu-price,
.table .menu-allergens{
    border-top: 0px solid #ddd;
    border-right: solid 1px #ddd;
    padding: 1px 8px;
}

.table .menu-allergens{
    font-size: 80%;
}

.menu-price:last-child,
.menu-allergens:last-child{
    border-right: 0px;
}


table.absence-records {
  margin: 5px 0;
  border: 1px solid #ddd;
  border-top: none;
}

.absence-records .actions > button,
.absence-records .actions > button {
  margin-left: 10px;
}

.pagination {
  margin: 10px 0;
  font-size: 0.9em;
}

.step-links > .current {
  border: 1px solid #ccc;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  padding: 4px 5px;
  line-height: 1.5;
}

.field-errors .errorlist  {
    font-size: 0.9em;
    color: #a94442;
}

.small-text {
    font-size: 12px;
}

.facility-record {
    font-size: 1em;
    margin-bottom: 10px;
    color: #424141;
    position: relative;
}

.facility-record.active {
    font-size: 1em;
    color: #0052bd;
}

.facility-record .glyphicon {
    font-size: 0.8em;
    margin-right: 5px;
}

.facility-record .action {
    position: absolute;
    right: 0px;
    top: 0px;
    height: 30px;
    width: 30px;
    background-color: #eee;
    padding: 6px 10px;
    border: 1px solid #ccc;
    cursor: pointer;
    color: gray;
}

.facility-record.active .action {
    top: 12px;
}

.day-holiday {
    background-color: #daedf6;
}

.day-closed {
    background-color: #fcf8e5;
}

/**** End Misc style ****/

.alert-notice {
    color: #383d41;
    background-color: #e2e3e5;
    border-color: #d6d8db;
}

.notice-title {
  font-size: 120%;
  font-weight: bold;
}


.errorlist li{list-style: none;}

.notice .hide-alert {
    right: 5px; position: absolute; top: 5px;
}


.nobr{white-space: nowrap;  hyphens: none;  }

@media screen and (max-width: 767px) {
    table.food-order th,
    table.food-order .menu-cell {
        white-space: normal !important;
    }
}


a.black-link {
    color: #000;
}

.mb-5 {
    margin-bottom: 5px;
}

.mb-10 {
    margin-bottom: 10px;
}

.mb-15 {
    margin-bottom: 15px;
}

.p15 {
    padding: 15px;
}

.focus-visible:focus {
  outline: 2px solid #4d90fe !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 2px rgba(77, 144, 254, 0.5) !important;
  border-color: #4d90fe !important;
}
a.skip-link{
	font-weight: 600;
	font-size: larger;
	margin: 0 auto;
	position: absolute;
	z-index: 20;
	left: 0;
	right: 0;
	top: 0.5em;
	width: 10em;
	opacity: 1;
	transition: transform 0.1875s ease-out, opacity 0.1875s ease-out;
}
a.skip-link:not(:focus):not(:hover) {
	transform: translateY(-4em);
	opacity: 0;
}
.order-quantity{display:none}
.price{text-align:center}
/* Focus visibility - enhanced for WCAG 2.2 AA compliance */
a:focus, button:focus, input:focus, select:focus, textarea:focus {
    outline: 3px solid #1976D2;
    outline-offset: 2px;
    box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.5);
}
/* Ensure focus is highly visible on all elements */
*:focus {
    outline: 3px solid #1976D2 !important;
    outline-offset: 2px !important;
}
/* Support for users who need more time - animation timing and control */
.transition-control {
    transition-duration: 0.5s; /* Slow down animations */
}
@media (prefers-reduced-motion: reduce) {
    *, ::before, ::after {
        animation-duration: 0.001s !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001s !important;
        scroll-behavior: auto !important;
    }
}

.messagelist {
    padding: 0;
    margin: 0;
}

.messagelist .message {
    display: block;
    font-weight: 400;
    font-size: 13px;
    padding: 10px 10px 10px 65px;
    margin: 0 0 10px 0;
    background: #dfd url(../img/icon-yes.svg) 40px 12px no-repeat;
    background-size: 16px auto;
    color: #333;
}

.messagelist .warning {
    background: #ffc url(../img/icon-alert.svg) 40px 14px no-repeat;
    background-size: 14px auto;
}

.messagelist .error {
    background: #ffefef url(../img/icon-no.svg) 40px 12px no-repeat;
    background-size: 16px auto;
}