/* CSS For Using an image in the header.  Don't forget to edit header.txt in doc root*/
.myheaderbg {
    /* background-image: url("images/header.png");*/
    background-color: #ffffff;
    background-attachment: fixed;
    background-size: cover;
    width: 100%;
    margin: 0 auto;
    padding: 20px 0 0 0;
}

/* This removes the site title when using a custom logo*/
/*
.cust-help .header__inner {
    display: none;
}
.myheaderwrapper {
    background-color: #fff
}
*/

/* Knowledgebase callout CSS */
.note-callout {
    border-left: 6px solid #2c5cc5 !important;
}
.note-callout {
    margin: 0;
    padding: 12px 16px;
    background-color: #ebedf0;
    border: 1px solid #ebedf0;
    border-left: 6px solid;
    border-radius: 4px;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}
.tip-callout {
    border-left: 6px solid #2CC590 !important;
}
.tip-callout {
    margin: 0;
    padding: 12px 16px;
    background-color: #ebedf0;
    border: 1px solid #ebedf0;
    border-left: 6px solid;
    border-radius: 4px;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}
.warning-callout {
    border-left: 6px solid #C52C2C !important;
}
.warning-callout {
    margin: 0;
    padding: 12px 16px;
    background-color: #ebedf0;
    border: 1px solid #ebedf0;
    border-left: 6px solid;
    border-radius: 4px;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}

/* To enable youtube videos to span across the whole kb article */
.video-container {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}

/* Then style the iframe to fit in the container div with full height and width */
.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}