/* Skate Canada Info Centre - Cassiopeia child template styles */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap');

/* ---- Carried over unchanged from the Joomla 3 Protostar user.css ---- */
/* Site-wide ordered list style convention */
ol {
  list-style-type: lower-alpha;
}
ol ol {
  list-style-type: lower-roman;
}
ol ol ol {
  list-style-type: upper-alpha;
}
ol ol ol ol {
  list-style-type: lower-greek;
}

/* Custom header level styles to make it clear which level it is at */
h1 {
  font-variant: small-caps;
  font-size: 30px;
  line-height: 32px;
  margin-top: 30px;
  border-bottom: 3px solid #C0C0C0;
}
h3 {
  color:#808080;
}

/* Set headers to clear all floating elements */
h1, h2, h3, h4, h5, h6 {
  clear: both;
}

/* Set bottom spacing below images */
img {
  margin-bottom: 20px;
}

/* Increase body text size and increase paragraph spacing accordingly */
body {
  //font-size: 14px;
  //line-height: 19px
}
p {
  margin: 0 0 11px;
}

/* Increase spacing around autotoc tables so text doesn't push up right against it */
div.autotoc {
  margin: 10px 0 0 10px;
}

/* Hide horizontal lines, since we're going to use them to break physical pages */
hr {
  display:hidden;
  height:0px;
}


/* Customizations to print layout */
@media print {
  @page {
	margin: 1cm;
  }
  div.autotoc {
    float: none!important;
  }
  div.autotoc a:after {
    content: "";
  }
  abbr:after {
    content: ""!important;
  }
  ul.tags a:after {
    content: "";
  }
  dd.category-name a:after{
    content: "";
  }
  div.version-history {
    display: none;
  }
  
  hr {
    page-break-before: always;
  }
  
  table {
    //page-break-inside: avoid;
  }
  
  div.item-page:before {
    content: "DISCLAIMER: Please be advised that the printed version is accurate as of the date of printing only.  Remember to check the authoritative online version for any updates. AVERTISSEMENT: Veuillez noter que la version imprimée n’est exacte qu’à la date d’impression. N’oubliez pas de vérifier la version en ligne, qui fait autorité, pour toute mise à jour.";
  }
}


/* Right-align and adaptive align pull-right box */
.header div.header-search {
  text-align: right;
}
.header div.pull-right {
  text-align: right;
}

@media (max-width: 768px) {
  .header .nav.pull-right,
  .header-search,
  .header .nav.pull-right .custom p {
    text-align: center!important;
  }
}

/* Fix navigation menu border */
.navigation {
  border-top: 1px solid #F5F5F5;
  border-bottom: 1px solid #F5F5F5;
}

/* Add padding to body cells */
div.item-page td {
  padding: 5px;
}

/* Prevent Version History from showing on Home Page */
body.itemid-105 div.version-history {
  display:none;
}

body.itemid-104 div.version-history {
  display:none;
}

/* Hide terms defined listing in online version of article */
body.site div.aglossary-terms-used {
  display:none;
}

/* Create more consistency on the autotoc bubble */
div.autotoc {
  max-width: 50%
}
div.autotoc li {
  //padding-left:22px;
  //text-indent:-22px;
}

img[width],
img[height] {
  max-width: none;
}

/* Add some padding around images */
div.item-page img {
  padding:10px;
}

/* Fix bulleted lists displaced by left-floating images */
ul {
  list-style-position:inside;
}

header img {
  width:200px!important;
}


/* ---- Joomla 3 (Protostar) look on Cassiopeia ---- */
:root {
  --cassiopeia-color-primary: #a80101;
  --cassiopeia-color-link: #a80101;
  --cassiopeia-color-hover: #7a0000;
  --cassiopeia-font-family-body: "Open Sans", Helvetica, Arial, sans-serif;
  --cassiopeia-font-family-headings: "Open Sans", Helvetica, Arial, sans-serif;
}
body {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  background: #fff;
  color: #333;
}
a {
  color: #a80101;
}
a:hover,
a:focus {
  color: #7a0000;
}
.btn-primary {
  background-color: #a80101;
  border-color: #a80101;
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: #7a0000;
  border-color: #7a0000;
}

/* Header: white, red top line, logo left, search group top right, menu below */
.container-header {
  position: relative;
  background: #fff;
  background-image: none;
  border-top: 3px solid #a80101;
  box-shadow: none;
}
.container-header .navbar-brand {
  padding: 0.75rem 0 0.25rem;
}
.container-header .navbar-brand img {
  max-height: 60px;
}
.container-header .container-nav {
  border-bottom: 1px solid #eee;
  padding-bottom: 0.5rem;
}
.container-header .container-search {
  text-align: right;
  font-size: 0.85rem;
}
.container-header .container-search p {
  margin: 0 0 0.25rem;
}
.container-header .container-search a {
  color: #a80101;
}
.container-header .mod-finder__search {
  margin-bottom: 0.25rem;
}
.container-header .mod-finder .form-control {
  border-radius: 1rem 0 0 1rem;
  font-size: 0.85rem;
  min-width: 18rem;
}
.container-header .mod-finder .btn {
  font-size: 0.85rem;
}
.container-header .mod-languages ul {
  margin: 0;
}

/* Menu: red text, active item as a red pill (Protostar nav-pills) */
.container-header .metismenu.mod-menu .metismenu-item > a,
.container-header .metismenu.mod-menu .metismenu-item > button {
  color: #a80101;
  font-size: 0.85rem;
  padding: 0.4rem 0.7rem;
  border-radius: 4px;
}
.container-header .metismenu.mod-menu .metismenu-item > a:hover,
.container-header .metismenu.mod-menu .metismenu-item > a:focus {
  background: #eee;
  color: #7a0000;
  text-decoration: none;
}
.container-header .metismenu.mod-menu .metismenu-item.active > a {
  background: #a80101;
  color: #fff;
}
.container-header .metismenu.mod-menu .metismenu-item.active > a::after {
  display: none;
}
.container-header .metismenu.mod-menu .mm-collapse {
  background: #fff;
  border: 1px solid #ddd;
}
.container-header .metismenu.mod-menu .mm-toggler::after {
  border-top-color: #a80101;
}

@media (min-width: 992px) {
  .container-header .container-search {
    position: absolute;
    top: 0.75rem;
    right: 1rem;
  }
}

/* Sidebar boxes like Protostar's grey "well" */
.container-sidebar-right .card {
  background: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
}
.container-sidebar-right .card-header {
  background: transparent;
  border: 0;
  font-weight: 400;
}
.container-sidebar-right ul {
  padding-left: 1.2rem;
  font-size: 0.8rem;
}

/* Breadcrumbs: plain grey bar under the content */
.container-main-bottom .breadcrumb {
  background: #f5f5f5;
  padding: 0.5rem 1rem;
  font-size: 0.8rem;
  border-radius: 4px;
}

/* Footer: white, small text, like the Joomla 3 site */
.container-footer {
  background: #fff;
  background-image: none;
  color: #333;
  border-top: 1px solid #ddd;
  font-size: 0.8rem;
}
.container-footer a {
  color: #a80101;
}

/* Protostar (Bootstrap 2) text size: 13px with 18px line height */
.site-grid,
.container-footer {
  font-size: 13px;
  line-height: 18px;
}
a {
  text-decoration: none;
}
a:hover,
a:focus {
  text-decoration: underline;
}

/* Menu items packed to the left like Protostar's nav-pills */
.container-header .metismenu.mod-menu {
  justify-content: flex-start;
  flex-wrap: wrap;
}
.container-header .metismenu.mod-menu .metismenu-item {
  flex: 0 0 auto;
  padding: 0 0.1rem;
}

/* Protostar heading sizes (the carried-over rules above still set h1 to 30px and h3 grey) */
.site-grid h1, .site-grid h2, .site-grid h3, .site-grid h4, .site-grid h5, .site-grid h6 {
  font-family: inherit;
  font-weight: bold;
  margin: 9px 0;
}
.site-grid h1 { font-size: 30px; line-height: 32px; }
.site-grid h2 { font-size: 22px; line-height: 24px; }
.site-grid h3 { font-size: 18px; line-height: 20px; }
.site-grid h4 { font-size: 14px; line-height: 16px; }
.site-grid h5 { font-size: 13px; line-height: 16px; }
.site-grid h6 { font-size: 12px; line-height: 14px; }
.container-sidebar-right .card-header { font-size: 18px; }

/* No underlines on header/content/footer links (Cassiopeia underlines them) */
.container-header a,
.site-grid a,
.container-footer a {
  text-decoration: none;
}
.container-header a:hover,
.site-grid a:hover,
.container-footer a:hover {
  text-decoration: underline;
}

/* Sidebar lists keep their bullets, as on the Joomla 3 site */
.container-sidebar-right ul.mod-list,
.container-sidebar-right ul {
  list-style: disc;
  list-style-position: inside;
  padding-left: 0.5rem;
}
.container-sidebar-right ul li {
  list-style: disc;
}

/* Article titles like Protostar's page heading (plain, no small caps or rule) */
.site-grid .page-header h1,
.site-grid .page-header h2 {
  font-variant: normal;
  border-bottom: 0;
  font-size: 22px;
  line-height: 24px;
  font-weight: normal;
  margin-top: 0;
}
.site-grid .page-header {
  border-bottom: 1px solid #eee;
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
}

/* Version History button like the Joomla 3 bordered button */
.version-history .btn {
  background: #f5f5f5;
  border: 1px solid #ccc;
  color: #333;
  font-size: 12px;
}
.version-history .btn:hover {
  background: #e6e6e6;
  color: #333;
}

/* Article tags as Bootstrap 2 labels (Joomla 5 renders them as small buttons) */
.tags .label {
  display: inline-block;
  padding: 2px 4px;
  font-size: 10.15px;
  font-weight: bold;
  line-height: 14px;
  color: #fff;
  background-color: #999;
  border: 0;
  border-radius: 3px;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  vertical-align: baseline;
}
.tags .label-info {
  background-color: #3a87ad;
}
.tags .label:hover,
.tags .label:focus {
  color: #fff;
  text-decoration: none;
}