/* ng-cloak */
  .benefit-tmp, [ng\:cloak],[ng-cloak],[data-ng-cloak],[x-ng-cloak],.ng-cloak,.x-ng-cloak{visibility:hidden;}

/* grid */
  .grid-cols > .grid-row > div, .grid-cols > section, .formular > section {float: left; clear: none; padding: 15px 0;}

/* commons */
  .unicode-cancel::before {content:'\02717';}

  /* float right */
  .switch .label, .button span.icon:last-child, #navbar ol, ol.actions, .box footer > ol, .price, footer > ol {float:right;}

  /* float left */
  .switch .css-icon, .form-big .field-submit .button + .messages, .toolbar .form, .ecard-about > div, .announcement > *, .announcement li, .icons li, #budget-about-info > div, .thumb, .calc-button span, .calc-button strong, .toolbar, .actions, .toolbar-search .field, .toolbar .control, .toolbar-search .field .label, #navbar > div, #navbar > ul, #navbar li, footer > ul, footer > ul > li, .box footer > ul, .box footer > ul li, .box footer > ol li, .box header > h2, .box header > h3, .box header > div, .actions li, .price-button {float:left;}

  /* inline block */
  .calc-button > a, .button, .icon-important, .form-big .field {display:inline-block;}

  /* borders */
  .button, .thumb, .icon, .box header, .box footer, .form input, .form textarea, .form select, .actions li > a:not(.button) {border:1px solid transparent;}

  /* display:block;width:100%;clear:both;float:left; */
  .fields-row, .field .messages, .budget, .grid-cols, .content-list-item, .announcement, .toolbar-search .field-string input, .fields, .budget-sliders, .field-rules, .budget-sliders .budget-slider, #bottombar, .price strong, .price small, .width-100, #benefits-list, #filters, .toolbar {display:inline-block;width:100%;}
  body > header, #navbar, #content, body > footer {width: 100%; float: left; clear: both;}

  /* display: table; */
  .dcm-form header, .benefit > header > a, .benefit > header > span, #benefit-order-basics > form {display: table; width: 100%; height: 100%;}
  .dcm-form header > span, .budget-sliders .budget-slider > div, .actions li > a:not(.button), .actions li > div, .benefit > header > a > span, .benefit > header > span > div, #benefit-order-basics > form > div, #home-categories .icons a span, .field-rules .field-rule .control, .field-rules .field-rule .label {display: table-cell; vertical-align: middle;}

  .news-item .news-date {padding-bottom: 5px; display: inline-block;}
  .news-item .text, video[href] {cursor: pointer;}

/* text */
  .text .description {font-size:18px;line-height:29px;}
  .text > *:not(:first-child) {margin-top:17px;}
  .text p, .text li {font-size:15px;line-height:21px;}
  .text sup,.text sub {line-height:5px;font-size:10px;}
  .text i,.text em {font-style:italic;}
  .text h1 {font-size:31px;line-height:49px;}
  .text h2 {font-size:21px;line-height:29px;}
  .text h3 {font-size:19px;line-height:29px;}
  .text h4 {font-size:17px;line-height:25px;}
  .text h5 {font-size:15px;line-height:19px;}
  .text h6 {font-size:13px;line-height:15px;}
  .text blockquote {margin:30px 0;text-indent:20px;font-style:italic;}
  .text table {margin-bottom:20px;}
  .text table, .text table th, .text table td {border: 1px solid #dedede; padding: 13px;}
  .text table th {background-color: #f9f9f9;}
  .text table p {line-height: inherit;}
  .text ul li, .content-details ul:not(.vouchers) li {clear:both;list-style-type:disc;list-style-position:inside;}
  .text ul li, .content-details ul:not(.vouchers) li, .content-details-cart p {margin-top:5px;}
  .text ul li li {padding-left:16px;}
  .text ul ul, .txt ol ol {margin-top:0;margin-bottom:0;padding:0;}
  .text ol {list-style-type:decimal;list-style-position:inside;}
  .text ol li {margin-top:5px;}
  .text ol li li {padding-left:18px;}

  /* text-simple-list */
  .text-simple-list h3:not(:first-child) {border-top:1px dotted #d9dee4; padding-top: 17px;}
  .text-simple-list h3 {margin-bottom: -17px;}

/* margins */
  .box .icon {margin:-1px -1px 0 0;}
  .box footer li .button {margin:-1px -1px 0 0;}
  .box header h2 > .icon {border:0;margin-left:-14px;}

  .box header > div {padding:8px 17px 1px 17px;}
  .box header > div > ul li {float: left;}
  .box header > div > ul li:not(:first-child) {padding-left: 5px;}
  .box header > div > ul li:not(:last-child) {padding-right: 5px;}

  .box footer > ul, .box footer > ol {margin-bottom: -1px;}
  .box .content:not(.scroll):not(.content-video) {padding:10px;width:100%;float:none;}
  .box .content:not(.scroll) > .text:not(.hr):not(:first-child) {padding-top:10px;}
  .toolbar-filters .field-string input, .toolbar-filters .field-select select, .box:not(.form-login) .content input, .box .content textarea, .box .content select {padding: 8px 16px; border-width: 3px; border-style: solid; font-size: 15px; font-weight: 500; background-color: #fcfcfc; border-color: #d9dee4; transition: background-color 0.2s linear, border-color 0.2s linear;}
  .toolbar-filters .field-string input, .toolbar-filters .field-select select {padding: 8px;}
  .toolbar-filters .field-string input {padding-top: 9px; padding-bottom: 10px;}

  .box .content select {padding-top: 7px; padding-bottom: 7px;}
  .box:not(.form-login) .content input[disabled], .box:not(.form-login) .content textarea[disabled], .box:not(.form-login) .content select[disabled] {cursor:not-allowed; border-color: transparent;}

  .box .content td:hover input, .box .content td:hover textarea, .box .content td:hover select,
  .box .content .control:hover input:not([disabled]), .box .content .control:hover textarea:not([disabled]), .box .content .control:hover select:not([disabled])  {border-color: #fbd260;}

  .toolbar-filters .field-string input:focus, .toolbar-filters .field-select select:focus, .box .content input:focus, .box .content textarea:focus, .box .content select:focus {background-color: #fff; border-color: #fbd260;}

  .box footer {clear: both;z-index: 1;position: relative;}
  .box footer > .button {margin:-1px 0 0 -1px;width:calc(100% + 2px);text-align:center;}

  .actions .icon {margin:-16px 0 0 -18px;border-right:0;border-bottom:0;}
  .actions-tabs .icon {margin:-1px 0 -1px -18px;}
  .actions .active > a:not(.button) {border-bottom-color: transparent;}
  .actions li {margin-top:-1px; display:table; height: 100%;}
  ol.actions {margin-right:-1px;}
  .actions .disabled:hover, .actions .disabled a:hover, .button[disabled] {cursor: not-allowed;}
  .actions .disabled {color: #dedede;}
  .actions li .button {margin-right: -1px;}

  .actions li > a:not(.button), .actions li > div {text-align: center; padding: 0 7px;}

  .actions-budgets li > span, .actions-budgets li > a:not(.button) {line-height:17px;}

  .price small, .price strong {text-align:right;}
  .price > span, .actions .price > span {border-left: 0;}
  .price-button {padding: 13px 15px 0 0; font-size: 13px; line-height: 15px;}

/* grid */
  html {position:relative;min-height:100%;}
  body {margin-bottom:123px; display: inline-block; width: 100%;font-size:13px;line-height:17px;}

  #home-promo, #home-promo > footer ul, #home-promo.slides-count-1 > footer li, .form-big .field, .calc table select, .grid-toolbar, .toolbar-filters li select, .toolbar-filters li input, .control .field-string input, .control .field-select select {width: 100%;}
  #content {padding: 10px 5px;}

  #bottombar, .visitor #navbar, .page-error .text * {text-align:center;}
  #home #bottombar {margin-bottom: 29px;}
  .page-error .text li {list-style-type: none;}

/* body > footer */
  body > footer li a, body > footer li a:hover {transition: opacity 0.2s linear;}
  body > footer li a:hover {opacity: 0.8;}
  
  body > footer > ul, body > footer > ol {margin:28px;float:left;}
  body > footer > ul li a, body > footer > ul li a:hover {display:block;width:108px;height:39px;background:transparent url(../img/sodexo-select.svg) 0 0 no-repeat;background-size:100%;overflow:hidden;text-indent:100%;white-space:nowrap;float:left;text-align:center;padding:0;margin:0;}
  body > footer > ol {float:right;margin-top:44px;}
  body > footer > ol li.copy {clear:both;float:right;text-align:right;}
  body > footer {z-index: 600;}

/* navbar */
  #navbar .home {padding:0 5px;border:0;}
  #navbar a:not(.icon) {border-left:1px solid transparent;border-right:1px solid transparent;display:block;float: left;position: relative;}
  #navbar > ol > li:not(:last-child) .icon {border-color:transparent;}
  #navbar > ol > li > a, #navbar > ol > li > a:hover {padding-left:0;}
  #navbar li {position:relative;}
  #navbar li ul {position:absolute;display:none;margin-top: 48px;}
  #navbar ul li ul {left:-1px;}
  #navbar ol li ul {right:0;}
  #navbar li:hover ul {display:block;z-index:99;}
  #navbar li li a {white-space:nowrap;text-align:left;display:block;float:left;width:100%;}
  #navbar ol li li a {text-align:right;float:left;}
  #navbar li li {clear:both;float:left;border-top:1px solid transparent;width:100%;}
  #navbar ol li li {float:right;}
  #navbar sup {position: absolute;line-height:13px;border-color: #dfa507;padding: 3px 5px; border-radius: 5px;}
  #navbar sup.promoted {border-color: #dfa507;background-color: #fbd260;color: #353f49;border-width: 1px; border-style: solid;}

/* searchbar */
  .toolbar .control, .actions li, #navbar > ul > li > a:not(.icon), #navbar > ol > li > a:not(.icon), .box footer > ul > li {margin-left:-1px;}
  .toolbar .control {width: 150px;}
  .toolbar .actions li {margin-top:0; margin-right: 2px;}
  .toolbar .actions li:not(:last-child) {margin-top:0;}
  .toolbar .icon, #toolbar nav .icon {margin:0;}

/* toolbar */
  #toolbar {width:48px;}
  #toolbar li {float:left;margin-bottom:-1px;}

/* categories */
  .categories li div {position:absolute;top:0;left:48px;visibility:hidden;opacity:0;z-index:3;padding-bottom: 17px;min-width: 300px;}
  .categories:not(.categories-toolbar) li div {min-height: 505px;}
  .categories li div > big {white-space:nowrap;}
  .categories li div > ul {padding:1px 0 10px;display: inline-block; width: 100%;}
  .categories li div li, .page-login .box .content input, .form-login .field-string {width:100%;}
  .categories li div li input, .actions li input {position: absolute; visibility: hidden;}
  .categories li div li input + label, .actions li input + label {position: relative; width: 100%;text-align: left;}
  .categories li div li input + label {white-space: nowrap;padding: 5px 21px 6px 38px;display: block; float: left; clear: both;line-height: 19px;white-space: pre;}
  .categories li div li input + label::before, .actions li input + label::before {content: ''; display: block; width: 15px; height: 15px; background: #fff;margin-right: 8px;position: absolute;}
  .actions li input + label {display: table-cell; vertical-align: middle; height: 100%;}
  .categories li div li input:checked, .actions li input:checked {background: #f0f;}
  .categories li div li input:checked + label::after, .actions li input:checked + label::after  {content: ''; position: absolute;  background: #000; width: 2px; height: 2px; box-shadow: 2px 0 0 #000, 4px 0 0 #000, 4px -2px 0 #000, 4px -4px 0 #000, 4px -6px 0 #000; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg);}
  .categories li div li input:checked + label::after {left: 25px; top: 13px;}
  .categories li div li input + label::before {margin-left: -24px;}

  .categories-toolbar.current > li:hover > .icon.current {display: none;}
  .categories-toolbar.current > li:hover > .switch.hidden {display: block;position: relative;}
  .categories-toolbar.current > li:hover > .switch > .css-icon {position: absolute; margin: 0; left: 14px;top: 14px;}

  .form-login .messages {margin: 5px 0; display: inline-block; }
  .box {min-width:300px;width:100%;margin: 0 auto 10px auto;}

/* benefit */
  .benefit, .content-list .content-list-item:not(:last-child), #home-promo {margin-bottom: 10px;}
  .benefit {width:300px;max-width: 450px;}
  #home .benefit {max-width: 450px;min-width: 300px;}
  .benefit > header {text-align:center;overflow:hidden;position:relative;}
  .benefit > header > a::after, .benefit > header > a::before, .benefit > header > span::after, .benefit > header > span::before {width:11px;height:calc(100% - 2px);display:block;content:'';position:absolute;top:1px;}
  .benefit > header > a::before, .benefit > header > span::before {left:0;}
  .benefit > header > a::after, .benefit > header > span::after {right:0;}
  .benefit > header span > small {margin-top:2px;}
  .benefit > header strong, .benefit > header small {width: 100%; clear: both;display: block;}
  .benefit > .content {position: relative;height: 300px; overflow: hidden;}
  .benefit > .content > .img, .benefit > .content > .description {position: absolute; top:0; left:0; z-index: 1;width:100%;height:100%;text-align:center;padding:0;overflow: hidden;}
  .benefit > .content > .img, .benefit:hover > .content > .img {background-repeat: no-repeat; background-position: 50% 50%;text-indent: 100%; white-space: nowrap;}
  .benefit > .content > .img a, .benefit > .content > .img a:hover {width:100%;height: 100%; display: block;}
  .benefit > .content > .description {z-index: 2; cursor: pointer;}
  .benefit > .content > .description > div { padding: 21px; position: relative; top: 50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);  }
  .benefit > footer ul li {margin-right:1px;}
  .benefit-description-shortened {font-size: 17px; line-height: 29px; font-weight: 400;}
  .benefit-description-extended {font-size: 14px; line-height: 19px; font-weight: 300; margin-top: 10px;}
  #benefit-order {margin-right: 0;}
  #benefit .benefit, #page-benefit #benefit .benefit {margin-left: 0; margin-right: 0;}
  #benefit-order-basics > form {min-height: 246px;}

/* budget */
  .budget > span, .budget > big > strong {font-size:21px;line-height:29px;}
  .budget > span, .table-budget td:nth-child(1) {float:left;width:165px;}
  .budget > span > small {font-size:11px;line-height:17px;display:block;}
  .budget > big, .table-budget td:nth-child(2) {float:right;width:90px;padding:0 0 5px 0;}
  .budget > big > span {font-size: 11px; line-height: 13px;}
  .budget > a {font-weight: 700; display: inline-block; width: 100%;}
  .budget > a, .budget > small {clear: both; display: block;}
  .budgets-1 .budget, .budgets-2 .budget {margin-top:21px;}
  .budgets-3 .budget:not(:last-child) {margin-bottom:13px;}
  .budgets-3 .budget:first-child {margin-top:11px;}
  .budgets-4 .budget > big, .budgets-4 .table-budget td:nth-child(2) {padding-bottom: 0;}

  #budget-about .content-tabs {width:calc(100% - 318px);}
  #budget-about > .content {padding: 0; clear:both;float: left;width: 100%; border-top: 0;}
  #budget-about > .content .content {border: 0;}
  #budget-about-datas, #budget-about-basics, #budget-about h2 {width:100%;}

  .budget-sliders {margin:19px -10px; width: calc(100% + 20px);}
  .budget-sliders .budget-slider {border-top:1px dotted #d9dee4;padding:27px;display:table;}
  .budget-sliders .budget-slider > div {width:30%;padding: 18px 50px 0 0;}
  .budget-sliders .budget-slider > .slider {padding-top: 0;}
  .budget-sliders .amount input {width: 50%; max-width: 100px; margin-right: 5px;}
  .budget-sliders .amount .currency { margin-top: 1px;}

  .table > table {width:100%;margin-bottom:15px;float:left;}
  .table > table th {padding:5px 15px;}
  .table > table > tbody > td {vertical-align:middle;padding:15px;}
  .table > table > tbody > tr > td, .table > table > tbody > tr > th {border-right:1px dotted transparent;border-left:1px dotted transparent;border-bottom:1px solid transparent;border-top:1px solid transparent;}

  .table > table > tbody > tr:nth-child(odd) > td {background-color: #f9f9f9;}
  .table > table > tbody > tr:nth-child(even) > td {background-color: #f7f7f7;}

  .table-budget {margin-top:27px;}
  .table-budget .date, .table-budget .amount {font-size:17px;}
  .table-budget td:nth-child(1)::after {content:":";}

  #budget-about-info > .content:first-child {width:calc(100% - 320px);min-width:320px;}
  #budget-about-basics, #budget-about-info .content:first-child {border-right:1px dotted transparent;}
  #budget-about .content-tabs {border-left:1px dotted transparent;margin:0 -1px;}

  .field-datepicker.empty .moment-picker + .clear-field-control-input, .button-more-benefits, .content-tabs > .content:not(.ng-show), .page-login .label {display:none;}
  .button-mini {padding: 5px 13px;}
  .cartitem .content {display: block;}

/* attachments */
  .text .attachments {margin-top: 0;}

/* calc */
  .calc table th, .calc table td {padding:5px 13px;}
  .calc table td {vertical-align:middle;}
  .calc table tr:last-child td, .calc table th td:last-child, .calc table tr td:last-child {border-color: transparent;}
  .calc-action {width:28px;height:28px;border:1px solid transparent;background-color:#d9dee4;text-align:center;font-size:19px;line-height:27px;}
  .calc button.calc-action {margin: 6px 4px;}
  .calc-action[disabled] {cursor: not-allowed;}
  .calc-quantity .calc-action, .calc-quantity input {float:left;display:block;}
  .calc-quantity {width: 133px;}
  .calc-quantity input {width: 50px; text-align: center;}
  .form-big .field, .form-big .message {text-align:center;}
  .form-big .message {margin-top: 5px;display: block;text-align: left;}
  .calc-button strong {font-weight:normal;line-height:29px;padding-left:7px;}
  .calc-actions > .calc-button { display: inline-block;}
  .calc-actions > span  {float: left; line-height: 43px; padding-left: 13px;}

  /*.form input:focus::-webkit-input-placeholder, .form input:focus:-moz-placeholder, .form input:focus::-moz-placeholder, .form input:focus:-ms-input-placeholder {color:transparent;}*/
.page-login .field-submit button { clear:both; }

.form-login .field-submit .errName {display: none;float: left; width: 100%; text-align: left; margin-bottom: 25px; }
.form-login .field-submit .errName.errShow {display: block; }
@media screen and (min-width: 767px){
  .form-login .field-submit .errName.errShow { max-width: 100%; }
}

  .errName { width: 200px;}

  .field-checkbox .control input, .field-radio .control input {float:left;margin:2px 7px 2px 0;}

  .page-login .field-string input {width:310px;}

  .announcement > div > div {margin:11px 27px 11px 9px;max-width: 100%; float: left;}
  .news-item:not(:last-child), .announcement:not(:last-child) {border-bottom: 1px dotted #d9dee4; padding-bottom: 13px; margin-bottom: 13px;}

/* home */
  #home-categories .icons {overflow: hidden;padding-top: 1px; margin-bottom: -19px;}
  #home-categories .icons li {width:100%;margin-bottom:19px;font-size:13px;line-height:19px;}
  #home-categories .icons a {display:table;width:90%;}
  #home-categories .icons a span:last-child {text-align:left;width:100%;}
  #home-categories .icons .icon {margin-right:15px;}

  .price strong {font-size:19px;line-height:19px;}
  .price small, .box header small {font-size:11px;line-height:13px;}

  .ecard::before {content:' ';width:33px;height:40px;background:transparent url(../img/ecard.gif) 0 0 no-repeat;margin-right:13px;display:inline-block;vertical-align:middle;}
  .ecard-about > div:nth-child(2) {padding:27px;}


/* switch button */

  .css-icon-close::before {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
  .css-icon-close::after {-webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }
  .css-icon-close::before, .css-icon-close::after {height: 1px;margin-top: -2px;content: ''; position: absolute; width: 9px; top: 12px; left: 6px; background: #000; }

  .switch > .label {margin: 2px 0 0 8px;}
  .switch > .css-icon {position: relative; display: inline-block; width: 20px; height: 20px; overflow: hidden;margin-top: 1px; background: #fff;}

/*! angularjs-slider - v5.4.3 -
 (c) Rafal Zajac <rzajac@gmail.com>, Valentin Hervieu <valentin@hervieu.me>, Jussi Saarivirta <jusasi@gmail.com>, Angelin Sirbu <angelin.sirbu@gmail.com> -
 https://github.com/angular-slider/angularjs-slider -
 2016-08-07 */
  .rzslider {position:relative;display:inline-block;width:100%;height:4px;margin:35px 0 15px 0;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;}
  .rzslider.with-legend {margin-bottom:40px;}
  .rzslider[disabled] {cursor:not-allowed;}
  .rzslider[disabled] .rz-pointer {cursor:not-allowed;background-color:#d9dee4;}
  .rzslider span {position:absolute;display:inline-block;white-space:nowrap;}
  .rzslider .rz-base {width:100%;height:100%;padding:0;}
  .rzslider .rz-bar-wrapper {left:0;z-index:1;width:100%;height:20px;padding-top:10px;margin-top:-10px;box-sizing:border-box;}
  .rzslider .rz-bar-wrapper.rz-draggable {cursor:move;}
  .rzslider .rz-bar {left:0;z-index:1;width:100%;height:4px;background:#f4f4f4;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;}
  .rzslider .rz-bar.rz-selection {z-index:2;background:#d9dee4;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;}
  .rzslider .rz-pointer {transition:left 0.05s ease-out, box-shadow 0.1s linear;top:-8px;z-index:3;width:20px;height:20px;cursor:pointer;background-color:#d9dee4;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:16px;}
  .rzslider .rz-pointer:hover {box-shadow:0 0 0 5px rgba(217,222,228,0.3);}
  .rzslider .rz-pointer:focus {box-shadow:0 0 0 5px rgba(217,222,228,0.5);}
  .rzslider .rz-pointer.rz-active {z-index:4;}
  .rzslider .rz-pointer.rz-active::after {background-color:#d9dee4;}
  .rzslider .rz-bubble {bottom:15px;padding:1px 3px;cursor:default;}
  .rzslider .rz-bubble.rz-selection {top:11px;}
  .rzslider .rz-ticks {position:absolute;top:-3px;left:0;z-index:1;display:-webkit-flex;display:-ms-flexbox;display:flex;width:100%;height:0;padding:0 11px;margin:0;list-style:none;box-sizing:border-box;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;}
  .rzslider .rz-ticks .rz-tick {width:10px;height:10px;text-align:center;cursor:pointer;background:#d9dee4;border-radius:50%;}
  .rzslider .rz-ticks .rz-tick.rz-selected {background:#d9dee4;}
  .rzslider .rz-ticks .rz-tick .rz-tick-value {position:absolute;top:-30px;transform:translate(-50%, 0);}
  .rzslider .rz-ticks .rz-tick .rz-tick-legend {position:absolute;top:24px;max-width:50px;white-space:normal;transform:translate(-50%, 0);}
  .rzslider .rz-ticks.rz-ticks-values-under .rz-tick-value {top:initial;bottom:-40px;}
  .rzslider.rz-vertical {position:relative;width:4px;height:100%;padding:0;margin:0 20px;vertical-align:baseline;}
  .rzslider.rz-vertical .rz-base {width:100%;height:100%;padding:0;}
  .rzslider.rz-vertical .rz-bar-wrapper {top:auto;left:0;width:20px;height:100%;padding:0 0 0 10px;margin:0 0 0 -10px;}
  .rzslider.rz-vertical .rz-bar {bottom:0;left:auto;width:4px;height:100%;}
  .rzslider.rz-vertical .rz-pointer {top:auto;bottom:0;left:-8px !important;}
  .rzslider.rz-vertical .rz-bubble {bottom:0;left:10px !important;margin-left:3px;}
  .rzslider.rz-vertical .rz-bubble.rz-selection {top:auto;left:10px !important;}
  .rzslider.rz-vertical .rz-ticks {top:0;left:-3px;z-index:1;width:0;height:100%;padding:11px 0;-webkit-flex-direction:column-reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse;}
  .rzslider.rz-vertical .rz-ticks .rz-tick {vertical-align:middle;}
  .rzslider.rz-vertical .rz-ticks .rz-tick .rz-tick-value {top:initial;left:22px;transform:translate(0, -28%);}
  .rzslider.rz-vertical .rz-ticks .rz-tick .rz-tick-legend {top:initial;right:24px;max-width:none;white-space:nowrap;transform:translate(0, -28%);}
  .rzslider.rz-vertical .rz-ticks.rz-ticks-values-under .rz-tick-value {right:12px;bottom:initial;left:initial;}

/* formular */
  .formular .field .control {clear: both;}
  .formular .field .label {float: left; font-size: 15px; line-height: 19px; padding: 5px 0;}
  .formular .field:not(.field-checkbox):not(.field-radio) .label label::after {content:':';}

  .fields-deliverer > .deliverer, .deliverer > *  {float: left;}
  .fields-deliverer > .deliverer, .fields-budgets {margin: 29px;}
  .deliverer label {display: block;width:110px;padding-top:60px; text-align: center; background-repeat: no-repeat;background-position: 0 0;}
  .deliverer input {margin: 18px 7px 0 0;}
  .deliverer--dpd label {background-image: url(../img/deliverer/dpd.gif);}
  .deliverer--poczta-polska label {background-image: url(../img/deliverer/poczta-polska.gif);}

  .fields-budgets label {margin-left: 7px;}
  .fields-budgets .field-radio:not(:last-child) {margin-bottom: 13px;}

  .field-rules .field-rule > div:not(.messages) {display:table;margin:27px 0 10px;}
  .field-rules .field-rule > div:not(.messages) > .control {width:26px;padding-left:5px;}

  .field-datepicker input {width: 140px;}
  .field-datepicker .control {position: relative;}
  .field-datepicker .control a {display: block; position: absolute; top: 12px; left: 121px; opacity: 0.5; transition: opacity 0.1s linear;}
  .field-datepicker .control a:hover {opacity: 1;color: #ec2224;}

  .fields-row .field {float: left; margin-top: 13px; margin-right: 41px;}
  .full-width-fields-row .field input, .full-width-fields-row .field {width: 100%}

  /* dmd dcm content-benefit-order */
  .dcm-form header {font-weight: bold; font-size: 15px; line-height: 17px;}
  .dcm-form header > span {padding: 0 5px;}
  .dcm-form h1, .dcm-form h2, .dcm-form h3, .fields-row h1, .fields-row h2, .fields-row h3 {line-height: 51px; margin: 11px 0; border-bottom: 1px dotted #d9dee4; clear: both;}
  .dcm-form h1, .fields-row h1 {font-size: 25px;}
  .dcm-form h2, .fields-row h2 {font-size: 21px;}
  .dcm-form h3, .fields-row h3 {font-size: 17px;}

  .dcm-form .moment-picker {text-shadow: none !important;}
  .dcm-form .moment-picker .moment-picker-container {padding: 0;}
  .dcm-form .moment-picker .year-view td {vertical-align: middle;}
  .dcm-form .moment-picker td.highlighted, .moment-picker .header-view th:hover {background: #2a295c; color: #fff;}
  .dcm-form .moment-picker td, .moment-picker th {line-height: 29px; text-shadow: none; font-weight: normal; border-radius: 0;}

  .dcm-input-date td, .dcm-input-date th {padding: 5px; border-radius: 0;}

  .dcm-form dcm-object {display: inline-block;}

  .field--place-of-residence-zip-code input, .field--place-of-residence-house-number input, .field--place-of-residence-flat-number input, .field--zip_code input, .field--house_no input, .field--apartment_no input, .field--area_code_spouse input, .field--area_code input {width: 100px;}
  .field--pesel input {width: 144px;}
  .field--e-mail input {width: 375px;}
  .field--place-of-residence-street input, .field--place-of-residence-city input, .field--e-mail_spouse input, .field--city input, .field--street input, .field--surname_spouse input, .field--surname input {width: 275px;}

  /* formular colors */
  .field .errName {color: #ec2224;}

  /* grid-cols */
  .grid-cols > .grid-row:not(:first-child) > .width-100 {border-top-width: 1px;}

/* box content form */
  #terms-obligatory.errName {font-size: 14px; font-weight: bold; margin-top: 20px; margin-bottom: 15px}
  .box .content .messages span {text-align: left; font-size: 13px; line-height: 15px; display: block;}
  .box:not(.form-big) .content .messages span {font-size: 11px; width: calc(100% - 20px); clear: both;}

  .icon-cart {position: relative;}
  .icon-cart > .userCartCount {position: absolute; top: 0; left: 0; z-index: 5; text-indent: 0; font-size: 9px; line-height: 15px; text-align: center; width: 100%; padding-top: 5px;}

/* icon-loading */
  .icon-loading {text-align: center;}

/* page-loading */
  .page-loading body::before, .icon-loading::before {width: 33%; height: 33%; margin: 34% auto; border: 1px solid rgb(0,0,0); border-radius: 50%; border-left-color: transparent; border-right-color: transparent; animation: spin 575ms infinite linear; -webkit-animation: spin 575ms infinite linear; content: ' ';display: block;}
  .page-loading body::before {width: 26px; height: 26px; margin: 3% auto;}
  .page-loading body::before {margin: 10% auto;}

  .field--dcm--employee_extended_datalanguage, .orders-current .button-details-show, .page-login.page-loading body > header, .page-login.page-loading body > div, .page-login.page-loading body > footer {display: none;}
  .orders-current .content-details-show {display: block;}

/* others */
  div.price, .box footer > ol .price {padding:7px 15px 6px 0; max-width: 111px;}
  .thumb {width:48px;margin:-1px 0 0 -1px;}

/* transitions */
  a {transition: color 0.2s linear;}
  .actions a, .actions li input + label, html, body, .calc-action, .categories li div, #toolbar li div li label, nav a, #navbar li, .benefit > .content > .img a {transition: background-color 0.2s linear;}
  .button, .icon {transition: box-shadow 0.2s ease-in, border-color 0.2s linear, background-color 0.2s linear;}
  #toolbar li:hover div, .categories::before, .categories li div {transition: opacity 0.2s linear;}

/* font weights */
  #navbar a:not(.icon), #navbar a:not(.icon):hover, .button, .button:hover, .form input, #navbar li li a, #navbar h2, .budget > span, .announcement li > span {font-weight:300;}
  .text p, .text li, #toolbar big, .box header h2 {font-weight: 400;}
  .text h1, .text h2, .text h3, .text h4, .text h5, .text h6, .content-details h4, .icon-cart > .userCartCount, strong, .box header h3, .announcement h3 {font-weight: 700;}

/* scroll */
  #terms-of-service-rules .content {margin-top: -4px;}
  #terms-of-service-rules .scroll-y {margin: -2px 0 -4px 0; position: relative; display: inline-block; padding: 0; width: 100%;}
  #terms-of-service-rules .scroll-y > .text { overflow-x: hidden; overflow-y: scroll; height: 200px; padding: 19px;}

/* page-service */
  .page-service #content {width: 300px; margin:0 auto;float: none;}
  .page-service .text p, .page-service .text li {font-size: 13px; line-height: 17px;}

/* ask & questions */
  #ask #field_type {width: 200px;}
  #ask #field_subject {width: 300px;}
  .questions ol.actions .author span {text-align: right;}

/* lunch */
  #lunch-searchbar .actions-filters li:not(:first-child) {margin-left: 1px;}
  .actions .lunch-searchbar-name > div {text-align: left; padding-left: 0; border-bottom-width: 1px; border-bottom-style: solid;}
  .categories-categories::after, #navbar > ol:last-child::before { display: none; content: "\e912";position:absolute;left:0;top:0;width:48px;height:48px;font-family: 'sodexo-select-icons' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 49px; font-size: 19px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: center;}

/* toptoolbar */
  #toptoolbar {position: fixed; margin-left: 50%; z-index: 900;overflow: visible; top: 0;}
  #toptoolbar- {position: relative; right: 0; margin-left: -50%; width: auto;float: left; background: #353f49; border-radius: 0 0 5px 5px; }
  #toptoolbar li, #toptoolbar li a, #toptoolbar li a:hover {color: #fff;float: left;font-family: Arial, sans-serif; font-size: 13px; line-height: 17px;}
  #toptoolbar li {padding: 9px;}
  #toptoolbar li a, #toptoolbar li a:hover {border-left: 1px dotted #dedede;padding-left: 9px;}
  #toptoolbar li a:hover {border-style: solid;}

/* vouchers */
  .content-details-vouchers .button {margin: 7px 7px 7px 0;}
  .content-details-vouchers .vouchers li {float: right;}
  .content-details-vouchers .vouchers {display: inline-grid;}

/* flexitool */
  .benefit--type--flexi > header > a > span {display: table; width: 100%;height: 100%;}
  .benefit--type--flexi > header > a > span > div {display: table-cell; vertical-align: middle; width: 100%; height: 100%; text-align: left;}
  .benefit--type--flexi-content {text-align: center; padding: 21px 0; font-size: 13px; line-height: 19px;}
  .benefit--type--flexi .content .img a::after {content: attr(data-discount); display: block; width: 100%;height: 100%;position: absolute;bottom: -170px;right: -50px;opacity: 0.02;text-indent: 0;font-size: 150px; line-height: 180px; font-weight: bold; color: #000; transition: transform 0.2s ease-in;}
  .benefit--type--flexi:hover .content .img a::after {transform: scale(1.03);}
  .benefit--type--flexi-table {border: 1px solid #d9dee4; height: 64px; display: table; margin: 31px auto 0 auto;}
  .benefit--type--flexi-table > div {display: table-cell;}
  .benefit--type--flexi-discount {background-color: #f9f9f9; width: 64px; border-right: 1px solid #d9dee4; vertical-align: middle;}
  .benefit--type--flexi-description > table {top:0; transform: translateY(0); overflow-y: auto; max-height: 100%; min-height: 100%; display: block;font-size: 13px; line-height: 17px; }
  .benefit--type--flexi-description > table td {width: 50%;vertical-align: middle; text-align: center; padding: 21px;}
  .benefit--type--flexi-description > table td:last-child > span:not(:last-child) {margin-bottom: 7px;}
  .benefit--type--flexi-description > table td:last-child span span {width: auto;}
  .benefit--type--flexi-description small {font-size: 13px;}
  .benefit--type--flexi-description strong, .benefit--type--flexi-description span, .benefit--type--flexi-discount strong, .benefit--type--flexi-discount span {width: 100%; line-height: 19px; text-align: center;display: inline-block;}
  .benefit--type--flexi-description strong, .benefit--type--flexi-discount strong {font-size: 15px;}
  .benefit--type--flexi-logo {width: 128px;background: transparent url(../img/flexitool.gif) 50% 50% no-repeat;}

  .categories-flexi.current > li > .icon {border-color: transparent;}
  .categories-flexi.current > li:hover > .icon {background-color: transparent;}
  .categories-flexi.current:hover::before, .categories-flexi.current li:hover div {display: none;}

  .sodexo-select-userguide-video {width: 100%; border: 0;}
  .sodexo-select-userguide-video td:last-child {text-align: right;}

  /* benefit animation slideIn */
  .form-big:not(.searchbar-input), .benefit, .benefit .description-shortened {position: relative; animation: benefitOnLoad 0.5s;}
  .toolbar-filters {position: relative; animation: toolbarFilterOnLoad 0.2s;}

  #home-promo .content {overflow:hidden;position: relative;width: 100%;height: auto;}
  #home-promo .content img {width: 100%;height: auto;}
  #home-promo .content > div > a, #home-promo .content > div > a:hover {width: 100%;height: 100%;display: block;float: left;}
  #home-promo .content > div {width: 100%;height: 100%;position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: block;
      animation-duration: 24s;
      animation-iteration-count: infinite;
      animation-timing-function: linear;
      animation-delay: 0s;
      transition: visibility 2s linear;
      visibility: hidden;
  }
  #home-promo .content > div:nth-child(1) {animation-name: home-promo-1;z-index: 1;}
  #home-promo .content > div:nth-child(2) {animation-name: home-promo-2;z-index: 2;}
  #home-promo .content > div:nth-child(3) {animation-name: home-promo-3;z-index: 3;}

  #home-promo.playing .content > div, #home-promo.playing > footer li::before {animation-play-state: paused;}

  #home-promo > footer {border:0;}
  #home-promo > footer li {margin:0;}
  #home-promo > footer {border:0;}
  #home-promo > footer li {margin:0;}
  #home-promo.slides-count-2 > footer li {width: 50%;}
  #home-promo.slides-count-3 > footer li {width: 33.33%;}
  #home-promo.slides-count-4 > footer li {width: 25%;}

  #home-promo > footer li {position: relative;}
  #home-promo > footer li::before {content:'';display: block;position: absolute;width: 0;height: 100%;background-color: #d9dee4;z-index: -1;
      animation-duration: 24s;
      animation-iteration-count: infinite;
      animation-timing-function: linear;
      animation-delay: 0s;
  }

  #home-promo > footer li:nth-child(1)::before {animation-name: home-promo-li-1;}
  #home-promo > footer li:nth-child(2)::before {animation-name: home-promo-li-2;}
  #home-promo > footer li:nth-child(3)::before {animation-name: home-promo-li-3;}
  
  #home-promo-2 {background: #000; text-align: center;}
  #home-promo-2-video {margin: 0 auto; float: none; width: auto; height: 95%; margin-top: 8px;}
  #home-promo > footer li > a {background-color: transparent;}
  #home-promo > footer li > a:hover {background-color: rgba(217,222,228,0.5);}

  .box .payment footer li .button {margin: 0;}

  .content-details-order .persons .width-100 > button.unicode-add {margin-left: 263px;width: 66px; margin-top:2px;}
  #benefit-order .content-tabs #benefit-order-forms .benefit-order-form .content-benefit-order .content-persons div:first-of-type {display: contents}
  #benefit-order .content-tabs #benefit-order-forms .benefit-order-form .content-benefit-order .content-persons div {margin-top:5px;}



/*
  .order-item-status--sent {}
  .order-item-status--approved_hr {}
  .order-item-status--approved_sodexo {}
  .order-item-status--rejected {}
  .order-item-status--processing {}
  .order-item-status--completed {}
  .order-item-status--in_basket {}
  .order-item-status--cancellation {}
  .order-item-status--cancellation_to_approve {}
  .order-item-status--pending_payment {}
  .order-item-status--delivery_send_failed {}
  .order-item-status--delivery_completion_failed {}
  .order-item-status--sent_upgrade {}
  .order-item-status--cancellation_upgrade {}
  .order-item-status--sent_without_cancellation {}
*/



/* rwd */
  @media (min-width: 375px) {
    .page-service #content {width: 350px;}
    .box .content:not(.scroll):not(.content-video), #content {padding: 10px;}
    #navbar .home {padding:0 5px 0 10px;}
  }

  @media (max-width:479px) {
    #navbar {height: 48px;}
    #navbar > ol:last-child {position: relative;}
    #navbar > ol:last-child::before {display: block; right: 59px; left: auto;z-index: 5;}
    #navbar > ol:last-child:hover > li {display: block;clear: both;float: right;width: 100%;}
    #navbar > ol:last-child:hover > li > ul {display: block;}
    .actions-budgets, #navbar > ol > li:not(.cart), #navbar > ol:last-child:hover > li > a {display: none;}
    #navbar > ol:last-child:hover > li > ul {display: block;position: relative;z-index: 6;}
    #navbar > ol:last-child:hover > li:not(:first-child) > ul {margin-top: 0;}
    #navbar > ol:not(:last-child) {position: absolute;right: 0;z-index: 7;}
    .sodexo-select-userguide-video, .sodexo-select-userguide-video td {display: block; text-align: center; width: 100%;}
  }

  @media (min-width:480px) {
    #home-categories .icons li {width:50%;}
    #navbar > ol:not(:last-child) > li:last-child {border-right:1px solid transparent;padding-right:5px;}
    .sodexo-select-userguide-video td {width: 50%;}
  }

  @media (max-width:639px) {
    #navbar li .label, #navbar li .label:hover, .button:not(.button-mini), .button:not(.button-mini):hover, #navbar li li a, .box header h2, #navbar h2, #toolbar big, .announcement ol li span {font-size:15px;line-height:49px;height:48px;padding:0 10px;}
    #toolbar .categories li div > big {line-height: 47px;}
    .form-big input.small {font-size: 11px;}
    .categories-categories::after {display: block; border-width:1px; border-style: solid;}
    .categories-categories:not(:hover) li {display: none;}
    .categories-categories li:first-child {margin-top: 47px;}
    .categories {position: absolute; top: 0; left: 0; z-index: 5;}
    .categories-toolbar {left: 53px;}
    .toolbar {margin-bottom: 10px;}
    .toolbar-filters li {clear:none;float: left;width: 50%;}
    .toolbar-filters li:nth-child(2n+1) {clear: both;}
    .toolbar-search .actions-tools {left: 1px;}
    #cart .box > footer ul:not(:first-child), .toolbar .actions-filters {display: none;}
    .client-panel, #page-benefit {position: relative;}
    #toolbar {position: absolute;top: 0;left: 0;}
    .navigator {position: absolute;top: -58px;left: 0;}
    #home-promo .content {height: 52vw;}
    @keyframes toolbarFilterOnLoad {from {height: 0; } to {transform: height(100%); } }
    #home-promo > footer {visibility: hidden;}
  }

  @media (min-width:640px) {
    body > footer {position:absolute;left:0;bottom:0;}
    .page-service #content {width: 500px;}
    .grid-toolbar {margin-right: 0;float:right;width:calc(100% - 61px);}
    #benefits, .toolbar .control {width:calc(100% - 48px);}
    #benefits .benefit {margin:0 0 13px 13px;}
    #content {padding: 13px;}
    .box .content:not(.scroll):not(.content-video) {padding: 19px;}
    .box {margin-bottom:13px;}
    .toolbar {margin-bottom:12px;}
    .content-list + .announcement, .order-item:not(:first-child) {margin-top: 12px;}
    #lunch-searchbar .actions-filters li:not(:first-child), #benefits > .announcement, #home #budgets-info, #bottombar, .toolbar-search {margin-left: 13px;}
    #home #bottombar {margin-left: 0;}
    #navbar .home {padding:0 13px;}
    .button span.icon:last-child {margin-right: -13px;}
    .button span.icon:first-child {margin-left: -13px;}
    .page-login .field-string input {padding-left: 13px;}
    #navbar > ol:not(:last-child) > li:last-child {padding-right:12px;}
    .content-list .content-list-item:not(:last-child), #toolbar nav > ul {margin-bottom: 13px;}
    .categories::before {content:'';position:absolute;top:0;left:48px;visibility:hidden;opacity:0;z-index:1;}
    .categories:hover::before, .categories li:hover div {min-width: 300px;min-height: 100%;box-sizing: content-box; padding-bottom: 1px;visibility: visible;opacity: 1;z-index: 10;}
    #toolbar nav > ul {float:left;position: relative;}
    #ask #field_description, #questions #question {width: 541px; height: 150px;}
    #home-promo {width: 534px;}
    #home-promo .content {width: 100%;height: 300px;}
    #budgets-basics .content {height: 237px;overflow-y: auto;margin-top: -2px;}
    @keyframes toolbarFilterOnLoad {from {width: 0; } to {transform: width(100%); } } 
    .categories li.category--zakupy-online:hover div {width: 380px;}
    .categories li.category--zakupy-online div li {width: 50%;}
  }

  @media (min-width: 640px) and (max-width:767px) {
    .toolbar-search {width: calc(100% - 15px);}
    .toolbar-search .actions-tools {left: -60px;}
  }

  @media (min-width: 640px) and (max-width:1023px) {
    #navbar li .label, #navbar li .label:hover, .button:not(.button-mini), .button:not(.button-mini):hover, #navbar li li a, .box header h2, #navbar h2, #toolbar big, .announcement ol li span {font-size:17px;line-height:47px;height:48px;padding:0 13px;}
    .form-big input {font-size:17px;height:48px;padding:0 13px;}
    .form-big input.small {font-size: 13px}
    .toolbar-filters ul {padding: 5px 0 10px 10px;}
    .toolbar-filters li {clear:none;float: left;width: 33%;}
    .toolbar-filters li:nth-child(3n+1) {clear: both;}
    #home .box:not(#home-basics) .content {min-height: 300px}
    #searchbar-input {width: 120px;}
  }

  @media (min-width: 640px) and (max-width: 1199px) {
    #promoted-benefits {width:calc(100% - 321px);}
    #home #budgets-basics {float: left;}
  }

  @media (min-width: 640px) and (max-width:1023px) {
    #navbar li .label, #navbar li .label:hover, .button:not(.button-mini), .button:not(.button-mini):hover, #navbar li li a, .box header h2, #navbar h2, #toolbar big, .announcement ol li span {font-size:17px;line-height:47px;height:48px;padding:0 13px;}
    .form-big input {font-size:17px;height:48px;padding:0 13px;}
    .form-big input.small {font-size: 13px}
    .toolbar-filters ul {padding: 5px 0 10px 10px;}
    .toolbar-filters li {clear:none;float: left;width: 33%;}
    .toolbar-filters li:nth-child(3n+1) {clear: both;}
    #home .box:not(#home-basics) .content {min-height: 300px}
    #searchbar-input {width: 120px;}
  }

  @media (min-width: 640px) and (max-width: 1199px) {
    #promoted-benefits {width:calc(100% - 321px);}
    #home #budgets-basics {float: left;}
  }

  @media (max-width:767px) {
    #navbar sup {font-size: 11px; position: absolute; right: 15px; top: -12px;}
    #navbar > ul > li .label, #navbar > ol > li .label {display:none;}
    .announcement ol, .announcement ol li {margin-top: 5px; width: 100%; clear: both; float: left; text-align: center;}
    .content-list .content-list-item header {height: auto; overflow: hidden;}
    .announcement > div {width: calc(100% - 48px);}
    .page-login .field-string input {text-align: center;}
    #budgets-basics > footer > a {max-width: 250px; float: right;}
    .benefit {width: auto; min-width: 302px;}
    .toolbar-filters ul, .grid-cols > .grid-row, .grid-cols > .grid-row > div {width: 100%;}
    .toolbar-filters {height: auto;}
    .toolbar-search {position: relative;}
    .toolbar-search #searchbar, .toolbar-search #searchbar > div, .toolbar-search #searchbar > ul {float: right;}
    .toolbar-search .searchbar-input .control {display: none;position: absolute; left: 0;top: 0;z-index: 10;}
    .toolbar-search .searchbar-input .field:hover .label {float: right;}
    .toolbar-search .searchbar-input .field:hover .control {display: block; width: calc(100% - 96px); margin-left: 53px;}
    .toolbar-search .searchbar-input .field:hover .control input {width: calc(100% - 13px); float: left;}
    .toolbar-search .actions-tools {float: right;position: absolute;z-index: 6;top: 0;}
    .button:not(.button-mini), .button:not(.button-mini):hover {line-height:45px;}
    #faq-video {width: 100%; margin-bottom: 13px;}
  }

  @media (min-width:768px) {
    .box-w320 {width:302px;max-width:450px;}
    #faq-video {width: 640px;margin-bottom: 21px;}
    .width-10 {width:9%;} .width-15 {width:14%;} .width-20 {width:19%;} .width-25 {width:24%;} .width-30 {width:29%;} .width-33 {width:33%;} .width-35 {width:34%;} .width-40 {width:39%;} .width-45 {width:44%;} .width-50 {width:49%;} .width-55 {width:54%;} .width-60 {width:59%;} .width-65 {width:64%;} .width-70 {width:69%;} .width-75 {width:74%;} .width-80 {width:79%;} .width-85 {width:84%;} .width-90 {width:89%;} .width-95 {width:94%;} .width-100 {width:100%;}
    .grid-cols > .grid-row {display: table;width: 100%;}
    .grid-cols > .grid-row > div {padding:15px;border-style: dotted;display: table-cell; float: none;}
    .grid-cols > .grid-row > div:not(:first-child) {border-left-width: 1px;}
    .content-details .grid-cols > .grid-row > div {padding-right: 28px;}
    .content-details .grid-cols > .grid-row > div:not(:first-child) {border-left-width: 1px; border-left-style: dotted; padding-left: 28px;}
    .content-details-cart .grid-cols > .grid-row > div {width: 20%;}
    .grid-cols > .grid-row.financing-grid-row {width: auto;}
    .content-details .grid-cols  > .grid-row > div.financing-col {padding: 0px; padding-right: 4px; padding-left: 0px; border-style: dotted;display: table-cell; float: none;}
    .content-details .grid-cols  > .grid-row > div.financing-col.financing-tooltip-col {vertical-align: middle;}
    .content-details .grid-cols  > .grid-row span.order-benefit-details-data {font-weight: bold;}
    .content-details .grid-cols  > .grid-row span.order-benefit-details-data.anonymized-code {font-weight: normal; color: #4f4f4f}
    #navbar sup {font-size: 11px; right: 7px; top: -10px;z-index: 1;}
    .grid-toolbar {width:calc(100% - 61px);}
    .box {margin:0 13px 13px 0; float: left;}
    .content-list + .announcement, .order-item:not(:first-child) {margin-top: 18px;}
    #lunch-searchbar .actions-filters li:not(:first-child), #benefits > .announcement, #home #budgets-info, #bottombar, .toolbar .actions:not(:first-child) {margin-left: 14px;}
    #home #bottombar {margin-left: 0;}
    #navbar .icobar .label {padding-left: 0;}
    #navbar li:not(.home):not(.icobar):not(.cart) .icon {display:none;}
    .page-login .field-string input {padding-left: 19px;}
    body {margin-bottom:95px;}
    body > footer > ol li {float:right;margin-right:47px;}
    #toolbar .categories li div > big {line-height: 62px;}
    .icon, #toolbar li:hover div::after {width:64px;height:64px;font-size:24px;line-height:65px;}
    .icon-cart-remove, .icon-cart-add, .icon-cart {font-size:32px;}
    body > footer > ul li a, body > footer > ul li a:hover {width:124px;height:45px;}
    .box header .h2-two-lines {line-height:19px;padding-top:13px;}
    .box header .h2-two-lines small {font-size:11px;}
    .table-budget, #budget-about > div > div {float:left;}
    #home-categories .icons {margin-bottom:-27px;}
    #home-categories .icons li {width:33%;margin-bottom:27px;font-size:15px;line-height:21px;}
    .categories-toolbar.current > li:hover > .switch > .css-icon {left: 20px;top: 20px;}
    #home-basics .content {padding-left: 19px; padding-right: 19px; margin-top: 0;}
  }

  @media (max-width:1023px) {
    .actions li input + label {padding: 0 17px 0 37px;}
    .actions li input + label::before {top:17px;left: 13px;}
    .actions li input:checked + label::after {left: 16px; top: 24px;}
    .categories li div li input:checked + label::after {left: 17px; top: 11px;}
    body {font-size: 11px; line-height: 13px;}
    #navbar > ol > li > a, #navbar > ol > li > a:hover {padding:0;}
    .box header, .box footer, .thumb, .actions:not(.actions-tabs) {height:48px;}
    .icon, #toolbar li:hover div::after {width:48px;height:48px;font-size:19px;line-height:49px;}
    .benefit header small, .calc {font-size:11px;line-height:13px;}
    .benefit-order-form > header > span, .toolbar-filters .field-select select, .toolbar-filters .field-string input, .benefit header strong, .calc table strong, .box header h3, .announcement h3 {font-size:13px;line-height:13px;}
    .actions-tabs li span, .actions-tabs li > a:not(.button) {font-size: 11px; line-height: 46px; padding: 0 9px;}
    .page-benefit-details .benefit, .page-benefit-details .benefit > header {max-width: 100%; width: 100%; text-align: center;}
    #budget-about header .actions-tabs, .page-benefit-details .benefit .content, .page-benefit-details .benefit footer {display: none;}
    .form-login .field, .field-rules {margin-bottom:13px;}
    .form-login .field-submit {margin-bottom:13px;}
    .content-tabs, #budget-about .content-tabs, #budget-about-info > .content:first-child {width: 100%;}
    #budget-about-basics, #budget-about-info .content:first-child {border: 0;}
    #home-promo {clear: both;float: none;margin-left: auto;margin-right: auto;}
    #navbar > ol > .icobar .label {display:none;}
    .form-big input {font-size:15px;height:48px;padding:0 10px;}
  }

  @media (min-width:1024px) {
    .actions li > a:not(.button), .actions li > div {padding: 0 17px;}
    .button:not(.button-mini), .button:not(.button-mini):hover, .box header h2, #navbar h2, #toolbar big, .announcement ol li span {font-size:21px;height:64px; line-height: 65px;padding:0 19px;}
    .toolbar-filters {height: 48px;}
    .toolbar-filters ul {display: table; height: 100%;}
    .toolbar-filters li {display: table-cell; vertical-align: middle;}
    .control .field-string input, .control .field-select select {width: 200px;}
    .categories li div li input + label {padding-left: 47px;}
    .actions li input + label {padding: 0 17px 0 50px;}
    .actions li input + label::before {top:22px;left: 17px;}
    .actions li input:checked + label::after {left: 22px; top: 31px;}
    .categories li div li input:checked + label::after {left: 24px; top: 13px;}
    .form-login .field, .field-rules {margin-bottom:27px;}
    .form-login .field-submit {margin-bottom:21px;}
    .page-service #content {width: 600px;}
    #navbar sup {right: 7px; top: 7px;}
    .grid-toolbar {width:calc(100% - 76px);}
    #benefits, .toolbar .control {width:calc(100% - 64px);}
    #benefit-order, #budgets-info, #home-categories, #news-notification-news {width:calc(100% - 315px);margin-right: 0;}
    #benefit-order {margin-left: 13px;}
    .button span.icon:last-child {margin-right: -19px;}
    .button span.icon:first-child {margin-left: -19px;}
    #navbar span:not(.icon):not(.userCartCount) {font-size:21px;height:64px; line-height: 64px;padding:0 13px;}
    #navbar .icobar .label {margin-left: -27px;}
    #navbar li ul {margin-top: 64px;}
    #toolbar {width:64px;}
    .thumb {width:64px;}
    .page-login .field-string input {padding-left: 27px;}
    .toolbar-filters, .box header, .box footer, .thumb, .actions:not(.actions-tabs) {height:64px;}
    .categories::before, .categories li div {left: 64px;}
    #questions > .box > .content, #budgets .content, #orders > .box > .content, .content-tabs > .content, #news-notification .box > .content {min-height: 300px;}
    .form-big input {font-size:21px;height:64px;padding:0 27px;}
    .form-big input.small {font-size: 15px;}
    .announcement > div {width: calc(100% - 64px);}
    .announcement > div > div {margin:16px 27px 12px 9px;}
    .content:not(.content-details-show) > .announcement:first-child {padding-top: 13px;}
    .announcement:not(:last-child) {padding-bottom: 29px; margin-bottom: 29px;}

    /* font-size */
    .benefit-description-shortened {font-size: 21px; line-height: 39px;}
    .benefit-description-extended {font-size: 17px; line-height: 29px;}

    .benefit header small, .calc, .budget > big {font-size: 13px; line-height: 15px;}
    .toolbar-filters .field-select select, .toolbar-filters .field-string input, .benefit header strong, .calc table strong, .box header h3, .announcement h3 {font-size:15px;line-height:19px;}

    .price strong {font-size:21px;line-height:23px;}

    .icon-cart > .userCartCount {font-size: 13px; text-align: center; padding-top: 7px;}
    .actions-tabs li span, .actions-tabs li > a:not(.button) {font-size: 21px; line-height: 62px;}
    .box header > div {padding-top: 15px;}
    .categories li div li input + label::before, .actions li input + label::before {width: 20px; height: 20px;}
    .categories li div li input + label::before {margin: -1px 0 0 -28px;width: 20px; height: 20px;}
    .table-budget tr {display: inline-block;float: none;}
    .table-budget tr:not(:last-child) {margin-bottom:27px;}
    .table-budget td:nth-child(1) {padding-top:4px;}
    .table-budget td:nth-child(2) {padding-top:1px;}
  }

  @media (min-width: 1024px) and (max-width: 1199px) {
    #budget-about-datas, #budget-about-basics, #budget-about h2 {width:218px;}
    #home-basics, #home-categories {width:calc(100% - 548px);float:left; margin-bottom: 0;}
    #home .box .content {min-height: 300px}
    #home #bottombar {text-align: right; padding-right: 20px;}
    div.price, .box footer > ol .price {padding:15px 8px 1px 0;}
    #home #home-promo {margin-right: 0;}
  }

  @media (max-width:1199px) {
    .toolbar-filters .field-string input, .toolbar-filters .field-select select {padding-left: 8px;padding-right: 8px;padding-top: 8px;}
  }

  @media (min-width:1200px) {
    div.price, .box footer > ol .price {padding:15px 15px 1px 0;}
    #home #budgets-basics {margin-right: 0;}
    .page-service #content {width: 700px;}
    #home-categories {width:calc(100% - 662px);}
    .grid-toolbar {width:calc(100% - 76px);}
    #promoted-benefits {width:calc(100% + 13px);}
    .content-list + .announcement, .content-list + .announcement, .order-item:not(:first-child) {margin-top: 28px;}
    #home #bottombar {margin-left: 0;}
    #navbar > ol > li:not(.icobar):not(.cart) .icon {display:none;}
    .toolbar:not(.toolbar-filters) {width: calc(100% - 13px);}
    .box header h2 > .icon {margin-left:-19px;}
    .toolbar-filters {padding-left: 19px;}
    .calc-quantity input {width: 100px;}
    .calc-quantity {width: 230px;}
    #budget-about-datas, #budget-about-basics, #budget-about h2 {width:318px;}
    #home-basics > footer > .button {margin-left: 13px;}
    #home .content {min-height: 236px;}
    #home-basics {width: calc(100% - 849px); margin-left: -14px; min-width: 262px;}
    #home-basics .content {min-height: 300px;}
    #home-basics p big {font-size: 19px; line-height: 25px;}
  }

  @media (max-width:1365px) {
    .actions-tools .switch .label {display: none;}
    .actions-tools li > a:not(.button) {padding-left: 13px; padding-right: 13px;}
  }

  @media (min-width:1366px) {
    .calc table td {padding:10px 27px 10px 13px;}
    .calc table th {margin-top: 13px;}
    #home-basics {min-width: 302px}
    #home-basics p big {font-size: 21px; line-height: 31px;}
  }

  @media (min-width:1600px) {
    .toolbar-filters li {padding: 0 11px 0 8px;}
    #content {padding:29px;}
    .box {margin:0 29px 29px 0;}
    #benefits .benefit {margin:0 0 29px 29px;}
    .content-list .content-list-item:not(:last-child):not(.content-list-item-payment), #toolbar nav > ul {margin-bottom: 29px;}
    .toolbar {margin-bottom: 28px;}
    #navbar .home {padding:0 29px;}
    #lunch-searchbar .actions-filters li:not(:first-child), #benefits > .announcement, #home #budgets-info, #bottombar, #benefit-order, .toolbar:not(.toolbar-filters), .toolbar .actions:not(:first-child) {margin-left: 29px;}
    #navbar > ol:not(:last-child) > li:last-child {padding-right:29px;}
    .toolbar:not(.toolbar-filters) {width: calc(100% - 31px);}
    .grid-toolbar {width:calc(100% - 93px);}
    #home-basics {width: calc(100% - 880px);margin-left: -30px;}
    #promoted-benefits {width:calc(100% + 29px);}
    #home-basics {width: calc(100% - 865px);}
    #benefit-order, #budgets-info, #home-categories, #news-notification-news {width:calc(100% - 332px);}
    #benefit-order, #home-basics > footer > .button {margin-left: 29px;}
    #home-basics .content {padding-left: 29px; padding-right: 29px; margin-top: 0;}
    /*#home .benefit {width: calc(100% - 29px);}*/
  }

  
  .navigator .icon-top, .sticky .navigator .icon-prev {display: none;}
  .sticky .navigator .icon-top {display: block;}

/*
.sticky #toolbar, .sticky .toolbar {position:fixed;top:27px;z-index:99;}
.sticky #hentry {margin-top:30px;}
.sticky body::before {content:'';position:fixed;z-index:2;background-color:#f4f4f4;top:0;width:100%;height:120px;left:0;}
*/



.actions span.ng-binding {white-space: pre;}

/* Add this attribute to the element that needs a tooltip */
.form .control {position: relative;}

/* Hide the tooltip content by default */
.form .control input[type="password"].capslock-on:focus + .tooltip::before, .form .control input[type="password"].capslock-on:focus + .tooltip::after {display: block; pointer-events: none; bottom: 110%; left: 40%; position: absolute;}

/* Position tooltip above the element */
.form .control input[type="password"].capslock-on:focus + .tooltip::before {margin-bottom: 5px; margin-left: -80px; padding: 7px; border-radius: 3px; background-color: #353f49; background-color: hsla(0, 0%, 20%, 0.9); color: #fff; content: attr(data-capslock); text-align: center;}

/* Triangle hack to make tooltip look like a speech bubble */
.form .control input[type="password"].capslock-on:focus + .tooltip::after {margin-left: -5px; width: 0; border-top: 5px solid #353f49; border-top: 5px solid hsla(0, 0%, 20%, 0.9); border-right: 5px solid transparent; border-left: 5px solid transparent; content: " "; font-size: 0; line-height: 0;}

.cyclic-row {background-color: #f0f0f0;}

.icon-no-indent, .icon-no-indent:hover {text-indent: 0; font-size: 13px; line-height: 15px; display: table-cell; vertical-align: middle; white-space: normal; float: none; }

/* TODO ake: DEV-CSS */
.transparent-box {
  background: transparent !important;
}

/* TODO: delete after complete flexi */
/*.categories-flexi {display: none;}*/


/* animiations */
  @keyframes spin {100%{ transform: rotate(360deg);} }

  @keyframes benefitOnLoad {from {opacity:0; transform:  translateY(-3px); } to {opacity:1; transform: translateY(0); } } 

  @keyframes home-promo-1 {0% {visibility: visible;z-index: 2; } 33% {visibility: visible;z-index: 2; } 34% {visibility: hidden;z-index: 1; } 100% {visibility: hidden;z-index: 1;}}
  @keyframes home-promo-2 {0% {visibility: hidden;z-index: 1; } 33% {visibility: hidden;z-index: 1; } 34% {visibility: visible;z-index: 2; } 66% {visibility: visible;z-index: 2; } 67% {visibility: hidden;z-index: 1; } 100% {visibility: hidden;z-index: 1; }}
  @keyframes home-promo-3 {0% {visibility: hidden;z-index: 1; } 65% {visibility: hidden;z-index: 1; } 66% {visibility: visible;z-index: 2; } 100% {visibility: visible;z-index: 1; }}

  @keyframes home-promo-li-1 {0% {width:0; } 33% {width:100%; } 34% {width:0;}}
  @keyframes home-promo-li-2 {33% {width:0; } 66% {width:100%; } 67% {width:0; }}
  @keyframes home-promo-li-3 {66% {width:0; } 99% {width:100%; } 100% {width:0; }}

#my-agreements .formular .fields-row .text {
  overflow-y: scroll;
  max-height: 200px;
}

#token-invalid-info {
  padding: 10px;
}