#top-breadcrumb { border-bottom: var(--divider); }

#header-image-container img { margin-top: var(--size-4-6); width: 100%; height: 300px; object-fit: cover; object-position: center; border-radius: var(--radius-m); animation: water-border-radius 18s ease-in-out infinite; }

@media (max-width: 968px) { #header-image-container img { height: 200px; } }

#contents { --layout-sidebar-width: 250px; --layout-sidebar-space: var(--size-4-8); display: flex; flex-direction: row-reverse; justify-content: space-between; }

#contents main { width: calc(100% - var(--layout-sidebar-width) - var(--layout-sidebar-space)); }

#contents main > section:first-of-type, #contents main > article:first-of-type { --section-spacing-top: var(--size-4-12) !important; }

@media (max-width: 1400px) { #contents main > section:first-of-type, #contents main > article:first-of-type { --section-spacing-top: var(--size-4-8) !important; } }

#contents .sidebar { width: var(--layout-sidebar-width); padding-top: var(--section-spacing-top); padding-bottom: var(--section-spacing-bottom); padding-right: var(--section-spacing-left); }

@media (max-width: 1400px) { #contents .sidebar { display: none; } }

@media (max-width: 1400px) { #contents { display: block; } #contents main { width: 100%; } }

@keyframes water-border-radius { 0% { border-radius: var(--size-4-16) var(--radius-l) var(--size-4-16) var(--radius-l); }
  20% { border-radius: var(--radius-l) var(--size-4-16) var(--radius-l) var(--size-4-16); }
  40% { border-radius: var(--size-4-14) var(--size-4-16) var(--size-4-16) var(--size-4-14); }
  60% { border-radius: var(--size-4-16) var(--size-4-14) var(--size-4-14) var(--size-4-16); }
  80% { border-radius: var(--radius-l) var(--size-4-16) var(--size-4-16) var(--radius-l); }
  100% { border-radius: var(--size-4-16) var(--radius-l) var(--size-4-16) var(--radius-l); } }