/* Joomla 6 glue for the Bootstrap 3 based Dipula design.
   Joomla 6 core markup is Bootstrap 5 flavoured; these rules cover the gaps. */

/* Main menu: mod_menu outputs ul.mod-menu.nav inside the collapse container */
nav#main-nav .navbar-collapse > ul.nav { margin-bottom: 0; }
@media (min-width: 769px) {
  nav#main-nav .navbar-collapse > ul.nav { float: right; }
}
nav#main-nav ul.nav > li.current > a,
nav#main-nav ul.nav > li.active > a { background: #4E535D; color: #ffffff; }
nav#main-nav ul.nav ul.mod-menu__sub { display: none; }
nav#main-nav .mod-menu__toggle-sub { display: none; }

/* System messages sit below the (absolutely positioned) nav */
#system-message-container { position: relative; z-index: 130; }
#system-message-container:not(:empty) { padding: 100px 15px 0; background: #ffffff; }
@media (max-width: 768px) {
  #system-message-container:not(:empty) { padding-top: 15px; }
}

/* Bootstrap 5 helper classes used by Joomla core layouts */
.visually-hidden { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.d-none { display: none !important; }
.form-select { display: block; width: 100%; height: 34px; padding: 6px 12px; font-size: 14px;
  color: #555; background: #fff; border: 1px solid #ccc; border-radius: 4px; }
.mb-3 { margin-bottom: 15px; }

/* Wrapper added by the html5 module chrome should not affect layout */
#content { display: block; }