/* CargoNews Diesel Monitor: consistent right rail on internal pages.
 * Draft-theme only. Home has its own existing .cn-diesel-home placement.
 * This file is included after legacy + responsive theme CSS.
 */
@media screen and (min-width: 1003px) {
  /* 930px content area: 660px editorial content + 270px diesel rail. */
  #content > article#single {
    box-sizing: border-box !important;
    width: 660px !important;
    max-width: 660px !important;
    padding: 0 30px !important;
    float: left !important;
  }
  #content > .category-archive {
    box-sizing: content-box !important;
    width: 600px !important;
    max-width: 600px !important;
    padding: 0 30px 64px !important;
    float: left !important;
  }
  .category-archive .category-card:first-of-type,
  .category-archive .category-card {
    grid-template-columns: 240px minmax(0, 1fr) !important;
    gap: 19px !important;
  }
  .category-archive .category-card:first-of-type .category-card-image,
  .category-archive .category-card-image {
    width: 240px !important;
  }
  .category-archive .category-card:first-of-type h2 a {
    font-size: 23px !important;
  }
  #content > article#page {
    box-sizing: border-box !important;
    width: 660px !important;
    max-width: 660px !important;
    float: left !important;
    padding: 0 30px 30px !important;
    overflow-wrap: break-word;
  }
  #content > .error-page {
    width: 600px !important;
    max-width: 600px !important;
    padding: 18px 30px 72px !important;
    box-sizing: content-box !important;
  }
  #content > .error-page .error-page-copy {max-width: 100%;}
  #content > .error-page h1 {font-size: 35px;}
  #content > aside.right-sidebar,
  #content > article#single + aside.right-sidebar,
  #content > .category-archive + aside.right-sidebar,
  #content > .search-archive + aside.right-sidebar,
  #content > article#page + aside.right-sidebar,
  #content > .error-page + aside.right-sidebar {
    display: block !important;
    position: relative !important;
    width: 270px !important;
    min-width: 0 !important;
    max-width: 270px !important;
    float: right !important;
    clear: none !important;
    margin: 0 !important;
    padding: 0 0 28px !important;
    box-sizing: border-box !important;
  }
  #content > aside.right-sidebar .widget,
  #content > article#single + aside.right-sidebar .widget,
  #content > article#single + aside.right-sidebar #secondary {
    max-width: 270px !important;
  }
}
#content > aside.right-sidebar .cn-diesel {
  width: 100% !important;
  max-width: 100%;
  margin: 0 0 24px;
}
#content > aside.right-sidebar .cn-diesel-prices {
  display: block !important;
}
#content > aside.right-sidebar .cn-diesel-country {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 7px !important;
  min-height: 46px !important;
}
#content > aside.right-sidebar .cn-diesel-countryname {
  flex: 1 !important;
  min-width: 0 !important;
}
#content > aside.right-sidebar .cn-diesel-value {
  text-align: right !important;
}
#content > aside.right-sidebar .cn-diesel-change {
  display: block !important;
  margin: 0 !important;
}
@media screen and (max-width: 1002px) {
  /* Mobile sites have no side rail. Keep the vertical card below the article/list. */
  #content > aside.right-sidebar {
    display: block !important;
    visibility: visible !important;
    position: static !important;
    float: none !important;
    clear: both !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 760px !important;
    padding: 5px 0 24px !important;
    margin: 0 auto !important;
  }
  #content > aside.right-sidebar .cn-diesel {
    max-width: 420px !important;
    margin: 0 auto 20px !important;
  }
  #content > article#page {
    display: block;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 760px !important;
    padding: 0 0 28px !important;
    float: none !important;
    margin: 0 auto;
  }
  #content > .error-page + aside.right-sidebar,
  #content > .category-archive + aside.right-sidebar {
    display: block !important;
  }
}