@media (max-width: 480px) {
    .in-blogujeme li > h3 { width: initial !important;}
    .in-blogujeme h3 { width: initial !important;}
    .in-blogujeme ol { padding-left: 20px;}
}

@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) {
    #navigation { margin-left: 0px; margin-right: 0px;}
    .menu-helper { bottom: 15px; top: unset; right: 20px;}
    #header .search { margin-bottom: 50px; flex: 0 1 40%;}
    #header .navigation-buttons { margin-bottom: 60px; flex: 0 1 25%;}
    .header-top>div:first-child { flex: 0 1 30%;}
    #header .c-header-bottom .container .row { margin-left: auto; margin-right: auto;}
    .site-msg.information { margin-top: 0px;}
}

@media all and (device-width: 1024px) and (device-height: 768px) and (orientation:landscape) {
    .ipad-landscape { color: blue; } /* your css rules for ipad landscape */
}

@media (min-width: 768px){
.navigation-in>ul>li.ext>ul>li>div>a { padding: 5px 5px;}
.top-navigation-bar .container>div { flex: 1 1 100%;}
/*.fitted .navigation-in ul { justify-content: space-between;}*/
}

@media (min-width: 478px) and (max-width: 992px) {
    .timer-right { width: 50%; float: right;}
    .timer-left { width: 50%; float: left;}
}
    
@media screen and (max-width: 478px){
    .timer-left { text-align: center !important; font-size: 14px !important; line-height: 17px}
    .timer-right { text-align: center !important; font-size: 15px !important; line-height: 17px}
    .infobanner { padding-top: 7px; padding-left: 0px; padding-right: 0px;}
    .top-wrapper{ height: 50px; padding-bottom: 20px;}
}

@media screen and (max-width: 767px){
  body {
    /*--ji-container-padding: 13px;*/
    --ji-so-bar-height: 41px;
    --ji-top-bar-height: 0px;
    --ji-header-top-height: 81px;
    --ji-navigation-height: 0px;

    --ji-so-bar-bottom: calc(var(--ji-so-bar-height) - 0.5px);
    --ji-top-bar-bottom: calc(var(--ji-so-bar-bottom) + var(--ji-top-bar-height) - 0.5px);
    --ji-header-top-bottom: calc(var(--ji-top-bar-bottom) + var(--ji-header-top-height) - 0.5px);
    --ji-navigation-bottom: calc(var(--ji-header-top-bottom) + var(--ji-navigation-height));
  }
  body:not(:has(.ji-so-bar)) {--ji-so-bar-height:0px;}

  /* Layout */
  .overall-wrapper {padding-top:var(--ji-so-bar-height);}

  /* Delivery bar */
  .ji-so-bar {position: fixed;top:0;z-index: 10;}
  .ji-so-bar .container {padding-block: 5px;}
  .ji-so-bar__title {padding-right: 15px;}
  .ji-so-bar__method {padding-inline: 15px;font-size: 13px;}

  /* Header */
  .top-navigation-bar {background: #fff!important;}
  .top-navigation-bar a {color: #2a314a !important;}
  body.search-window-visible .header-top .search {display: block;position: fixed;top: calc(var(--ji-header-top-bottom) + 5px);left: 0;width: 100%;z-index: 999;}
  .search-window-visible #header .search-form {margin: 0 10px;z-index:1;}
  .popup-widget.login-widget { top: 110px !important;}
  .popup-widget.cart-widget { top: var(--ji-header-top-bottom);}
  .timer-right {padding-bottom: 5px;}
  .top-wrapper {margin-bottom: 10px;}
  .top-navigation-bar .top-nav-button-login, .top-navigation-bar .top-nav-button-account {display: none !important;}
  .top-navigation-bar .responsive-tools a[data-target="login"] {flex-flow: row;justify-content: center;}
  .top-navigation-bar .responsive-tools a[data-target="login"]::before {background: unset;width:unset;height:unset;flex:unset;margin:0;font-size: 23px;}
  .top-navigation-bar .responsive-tools a[data-target="login"]::after {content:unset;}
  .top-navigation-bar .responsive-tools>a[data-target="navigation"]::before {color: #fff;background-color: #2bb947;font-size: 18px;}
  .responsive-tools>a[data-target="search"]::before {font-size: 22px;}

  #header {margin-top:calc(-1 * var(--ji-header-top-height));height:var(--ji-header-top-height);position: relative;display:flex;background: unset;margin-bottom: 0;box-shadow: 0px 3px 10px -8px rgba(120, 120, 120, 0.53);pointer-events: none;}
  #header::before, #header::after {content:unset;}
  #header>* {pointer-events: auto;}
  #header .site-logo {margin:0;position:absolute;top:0;left: 110px;height:100%;display:flex;align-items: center;}
  #header .site-name a img {margin: 0 auto;max-height:35px;max-width: 150px;}
  .header-top .navigation-buttons {position:absolute;top:0;height:100%;right:70px;display:flex;flex-flow:row;gap:15px;align-items: center;}
  .header-top .oblibeneBtn {position: relative;top:unset;right:unset;left:unset;margin:0;}
  .header-top .oblibeneBtn::before {margin:0;}
  .header-top #dkLabComparerHeaderWrappper {display: contents;}
  .header-top #dkLabComparerHeaderIconBtn::before {font-size: 23px;top:unset;margin:0;}
  #header .cart-count {position: relative;top:unset;right:unset;left:unset;margin:0;}
  #header .cart-count::before {margin-right: 5px;}

  #header .c-phone {display: none;}
  .header-top {height:0;}

  .ordering-process .site-name {display: block;}
  .ordering-process .responsive-tools>a[data-target=navigation] {top:unset;position:absolute;right:16px;width:40px;height:40px;line-height: 1;}
  .ordering-process .responsive-tools>a[data-target=navigation]::before {vertical-align: unset;}
  ol.cart-header {margin-top:0;}
  .ordering-process #content-wrapper {margin-top:0;}

  .breadcrumbs {clear:both;float:none;margin-top:10px;}

  .subcategories li a {height: 58px;}
  .subcategories li a .text {max-height: 48px !important;font-size: 14px;line-height: 16px;}
}

@media (max-width: 479px) {
  #header .site-logo {left: 65px;}
  .top-navigation-bar .responsive-tools a[data-target="login"] {display: none;}
}