body {
    padding-top: 7rem;
}

pre {
    padding: 1rem;
}

#sidebar .list-group, #sidebar .list-group-item {
    background-color: transparent;
}

/* for list-groups nested within a list-group-item, reset the bottom margin */
/* TODO: Commented, as nested list-group-items should not occur after sidebar transition to individual cards
.list-group-item > .list-group {
    margin-bottom: 0px;
}
*/

/* for list-group-items nested within a list-group-item, reset the bottom
   padding of the last item, b/c the containing item has paddimg already
 */
 /* TODO: Commented, as nested list-group-items should not occur after sidebar transition to individual cards
.list-group-item .list-group-item:last-child {
    padding-bottom: 0px;
}
*/

.list-group-item {
    border: none;
}

#aboutme {
    padding-top: 0px;
    padding-bottom: 5px;
    -ms-word-break: normal;
    word-break: normal;
}

#sidebar {
    padding-top: 0px;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

.icon-label {
    margin-left: 10px;
}

/* Example for how to control spacing between icon and label in specific
   lists in the sidebar. To change, override in your CUSTOM_CSS           */
#sidebar #social i {
    margin-right: 3px;
}

/* TODO: Commented, as completely messing with bootswatch color scheme - no idea what purpose this has
a, a:hover {
    color: inherit;
}
*/

.entry-content a {
    text-decoration: none;
    border-bottom: 1px dotted;
}

.entry-content a:hover {
    text-decoration: none;
    border-bottom: 1px solid;
}

.entry-content figcaption, .caption {
    font-size: small;
    margin-bottom: 2px;
}

.floatright, .align-right {
    float: right;
}

.floatleft, .align-left {
    float: left;
}

.floatcenter, .align-center {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

figure.floatright, .align-right {
    margin-left: 4px;
}

figure.floatleft, .align-left {
    margin-right: 4px;
}

figure.floatcenter, .align-center {
    margin-bottom: 11px;
}

.highlighttable pre {
    /* Removes bootstrap default margin-bottom */
    margin-bottom: 0px;
}

.highlighttable {
    /* Adds them margin-bottom to highlightable instead of <pre> */
    margin-bottom: 11px;
}

.highlighttable {
    width: 100%;
}

#categories ul, #tags ul {
    list-style: none;
    padding: 0;
    margin-left: 0;
}

.docutils.footnote td.label {
    display: table-cell;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    color: inherit;
    text-align: inherit;
    white-space: inherit;
    border-radius: inherit;
}

.categories-timestamp {
    color: #AAAAAA;
    font-size: 0.9em;
    margin-right: 10px;
}

.tagcloud li {
    padding: 0px;
}

#banner {
    background-repeat: no-repeat;
    background-position: top center;
    background-attachment: scroll;
    background-size: cover;
    background-color: #C4C4C4;
    margin: 0 0 20px;
    padding: 70px 0; /*controls padding around inner text*/
    position: relative;
}

#banner .copy {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7);
    display: inline;
    float: left;
    max-width: 600px;
    padding: 20px;
    position: relative;
    z-index: 1;
}

#banner h1 {
    color: #fff;
    font-family: "HelveticaNeue-CondensedBold","Helvetica Neue CE 600 Condensed","Helvetica Neue LT Condensed","Helvetica Neue 600 Condensed","HelveticaNeue-BoldCondensed","Helvetica Neue BoldCondensed","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 60px;
    font-stretch: condensed;
    font-weight: 700;
    line-height: 0.9;
    margin: 0;
    text-transform: uppercase;
}
#banner .intro {
    color: #fff;
    font-size: 21px;
    line-height: 1.33;
    opacity: 0.75;
}
#banner .btn, #banner .intro {
    margin-left: 4px;
}

/* Solutions for mobile and small screens  */
@media (max-width: 650px) {
    #banner h1{
       font-size: 30px; /* !important;*/
    }
    #banner .intro{
        font-size: 16px;
    }
}

:target:before {
  content:"";
  display:block;
  height:50px;
  /* fixed header height*/

  margin:-50px 0 0;
  /* negative fixed header height */
}

/* TODO: Commented, as only gap-right was used in navbar brand, gap-left unused, and both superfluous, as Bootstrap 4 offers m-*|p-* utility classes for this purpose
.gap-right {
    margin-right: 10px;
}

.gap-left {
  margin-left: 10px;
}
*/

.article-list article + hr:last-child {
    display: none;
}

/* Utoolity uweb adjustments */

/* Tweak navbar */
nav.navbar {
    padding: 0 1rem;
}
.navbar-nav .nav-link  {
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus,
.navbar-brand:hover,
.navbar-brand:focus,
.navbar-toggler:hover,
.navbar-toggler:focus  {
    background-color: #ecf0f1;
}
.navbar-brand {
    margin-right: 0rem;
    padding: 0.5rem 1rem 0.5rem 0;
}
/* Kludge for anchor targets - prevent our fixed navbar overlapping them */
html, body {
    scroll-padding-top: 80px; /* should be exact height of sticky header, but using the official 56 still result in overlap, hence approximated higher number */
}
/* Tweak main footer */
/* NOTE/REVIEW: Standard bootstrap sticky footer handling assumes fixed height, going with solution from https://stackoverflow.com/a/40528045/46149 instead */
html, body {
    height: 100%;
}
body {
    display: flex;
    flex-flow: column;
}
footer.uweb-main-footer {
    margin-top: auto;
    background-color: #58595B;
}
footer.uweb-main-footer a {
    color: #FFF;
}
footer.uweb-main-footer a:hover {
    color: #FF8300;
}
footer.uweb-main-footer div.container {
    padding-top: 1rem;
}
.uweb-text-muted {
    font-size: 0.75rem;
}

/* KLUDGE/REVIEW: Hide title on home page */
.uweb-home .entry-title {
    display: none;
}

/* KLUDGE/REVIEW: Reapplying the Bootstrap 4 alpha blockquote styling, as we want the distinct bar, and no idea why they dropped it for the
    current, hardly discernable approach - to be refined down the road, e.g. made text smaller */
blockquote {
    border-left: .25rem solid #eceeef;
    padding: .5rem 1rem;
    font-size: .9rem;
}

/* Ensure tag links don't break on hyphens */
span.tags a {
    white-space: nowrap;
}

/* Tweak sidebar elements */
#sidebar section.card {
    margin-bottom: 32px;
}
#sidebar a {
    color: inherit;
}
#sidebar a:hover {
    color: #FF8300;
}
#sidebar .list-group-item {
    padding: 0.2rem 0rem;;
}
.uweb-sidebar-logo {
    width: 180px;
    margin: 0;
}
#uweb-atlassian-partner-badge {
    clear: both;
    margin-top: 10px;
}
#uweb-aws-partner-badge {
    /* NOTE: The AWS partner marketing guidelines require clear space around the badge that matches their logo height! */
    margin: 32px;
    width: 60%;
}

/* TODO/REVIEW: Reapplied custom product list and page styling from before bootstrap 4 update, might be achievable more easily using new classes in markup? */
ul.uweb-promo-list,
ul.uweb-product-list,
ul.uweb-partner-list {
    list-style: none;
    padding: 0;
}
ul.uweb-product-list li,
ul.uweb-partner-list li {
    display: inline-block;
    margin-bottom: 22px;
    padding: 11px;
    background-color: #ECF0F1
}
ul.uweb-promo-list li {
    display: inline-block;
    padding: 11px;
    background-color: #ECF0F1
}
.uweb-list-image {
    float: right;
    margin-left: 10px;
}
.uweb-product-image {
    width: 50%;
}
.uweb-marketplace-vendor-image {
    float: right;
    width: 170px;
    margin-bottom: 1.4em;
}

/* Tweak support link sections */
div.uweb-support-container,
div.uweb-trust-container {
    text-align: center;
    padding: 20px 40px;
}
div.uweb-support-container i {
    display: block;
}
div.uweb-support-container img.uweb-marketplace-image {
    float: none;
    padding: 0 0 10px 0;
}
div.uweb-support-container ul {
    list-style: none;
    padding: 0;
}
img.uweb-marketplace-image {
    float: left;
    padding-right: 10px;
}
/* TODO: We tweak the standalone support page entries slightly different from the ones on the product pages, but this might be removable down the road */
.uweb-support div.uweb-support-container {
    padding: 20px 40px 20px 0px;
}
.uweb-support-icon,
.uweb-trust-icon {
    width: 30%;
    display: block;
    margin: 0 auto;
    padding: 0 0 10px 0;
}

/* Tweak the tag-cloud */
ul.tagcloud {
    display: inline-block;
}
.tagcloud li.list-inline-item {
    display: inline;
    white-space: nowrap;
}
.tag-1 {
    font-size: 1.2rem;
}
.tag-2 {
    font-size: 1rem;
}
.tag-3 {
    font-size: 0.8rem;
}
.tag-4 {
    font-size: 0.6rem;
}

/* Images */
/* Ensure standard bootstrap .img-fluid behavior for all images in main content area */
.uweb-main-content img {
    max-width: 100%;
    height: auto;
}
/* Unconditionally clear floats on all h1-h3 in main content, mainly targetting at image floats */
.uweb-main-content h1,
.uweb-main-content h2,
.uweb-main-content h3 {
    clear: both;
}
/* Define default image formatting classes (most will have media query dependent overrides later on) */
.uweb-img-auto {
    width: auto !important;
}
.uweb-img-full {
    width: 100%;
    margin: 0 0 1em 0;
}
.uweb-img-half {
    width: 100%; /* To be adjusted to 50% for larger screen sizes only */
    margin: 0 0 1em 0;
}
.uweb-img-eigth {
    width: 12.5%;
    float: right;
    margin: 0 0 1em 1em;
    display: none !important; /* To be enabled for larger screen sizes only */
}

/* Logo layout */
/* NOTE/KLUDGE: We need to declare a min-width to prevent SVG collapsing to zero, and a max for the smallest media query size, 
 where we switch to column style display and do not want overly large images. We remove the specific max-width again firther below.
 These behaviors are not fully understood yet, i.e. not obvious why they collapse to zero in the first place. */
img.uweb-customer-logo {
    min-width: 96px;
    max-width: 192px;
    max-height: 120px;
}
img.uweb-customer-logo-small {
    min-width: 96px;
    max-width: 192px;
    max-height: 60px;
}
h3.uweb-customer-logos {
    margin-top: 3em;
}
h4.uweb-customer-logos {
    margin-top: 2.5em;
}
/* KLUDGE: Make embedded YouTube iframes responsive (adapted from more or less canonical approach with unclear original source) */
.uweb-videowrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
  }
.uweb-videowrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
/* NOTE: media query dependent declarations, included for easy tweaking, but all entries here should be moved to our
 customized bootswatch/bootstrap theme sooner or later to prevent e.g. media breakpoints getting out of sync
 KLUDGE/NOTE: Looks like we are already out of sync, bt do not use the changed bootswatch theme yet, which defines
 smaller breakpoints, but is not applied atm - this needs to be resolved soon*/
@media (min-width: 576px) {
    img.uweb-customer-logo {
        max-width: 100%;
    }
    img.uweb-customer-logo-small {
        max-width: 100%;
    }
    .uweb-img-eigth {
        display: block !important;
    }
    .uweb-img-half {
        width: 50%; /* Adjusted down from 100% used for smaller screen sizes */
        float: right;
        margin: 0 0 1em 1em;
    }
}
@media (min-width: 768px) {
}
@media (min-width: 992px) {
}
@media (min-width: 1200px) {
}