body {

    background-color: #F3F3F3;
    color: #50504F;
    font-family: 'Lato', sans-serif;
}

.l {

    text-align: left;
}

.c {

    text-align: center;
}

.r {

    text-align: right;
}

.firstLinePaddingRight::first-line {

    padding-right: 50px !important;
}

.productGitHubDownloadSpacer {

    margin-bottom: 5px;
}

img.sitLinkLogo {

    height: 19px;
    vertical-align: center;
    width: 35px;
}

img.sitBuchtippsLogo {

    height: 19px;
    vertical-align: center;
    width: 58px;
}

img.gitHubLinkLogo {

    height: 19px;
    vertical-align: center;
    width: 19px;
}

#ytilsNavContainerInner {

    display: none;
    margin-top: 0;
    padding-top: 15px;
}

#ytilsNavContainerInner nav ul {

    list-style-type: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

#ytilsNavContainerInner nav ul.topMargin {

    list-style-type: none;
    margin-top: 15px;
    margin-bottom: 0;
    padding-bottom: 0;
}

li.subNavLi {

    color: #009EC7;
    padding-left: 4px;
}

.bottomMarginDiv {

    margin-bottom: 20px;
}

div.devApiParamTable a,
div#mainContent div.mainContentInner ul li a,
div#mainContent div.mainContentInner p a,
#ytilsNavContainerInner nav ul li a {

    color: #009EC7;
    font-size: 16px;
    text-decoration: none;
}

div.devApiParamTable a:hover,
div.devApiParamTable a:focus,
div#mainContent div.mainContentInner ul li a:hover,
div#mainContent div.mainContentInner ul li a:focus,
#ytilsNavContainerInner nav ul li a:hover,
#ytilsNavContainerInner nav ul li a:focus,
div#mainContent div.mainContentInner p a:hover,
div#mainContent div.mainContentInner p a:focus {

    color: #009EC7;
    text-decoration: underline;
}

div.devApiParamTable th.codeDocTable,
div.devApiParamTable td.codeDocTable {

    font-family: "Courier New", Courier, monospace;
}

#ytilsNavToggler:checked + #ytilsNavContainerInner {

    display: block;
}

#ytilsNavToggler {

    display: none;
}

#ytilsNavContainer {

    padding-top: 5px;
}

img#ytilsNavMenu {

    cursor: pointer;
    height: 40px;
    width: 40px;
}

img#ytilsMenu {

    cursor: pointer;
    height: 45px;
    width: 45px;
}

h1#ytilsLogo {

    background: url(../img/Ytils-logo-yellow-50p.png) no-repeat center;
    background-size: 100%;
    display: inline-block;
    height: 45px;
    /* margin: auto; */
    padding: 0;
    width: 90px;
}

h1#ytilsLogo a {

    display: block;
    overflow: hidden;
    text-indent: -10000px;
}

h1#ytilsLogo img {

    width: 40px;
}

h2 {

    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 24px;
    margin-bottom: 16px;
}

.forceStripedLightBgColor {

    background-color: #F3F3F3 !important;
}

div#ytilsLogoAbsoluteContainer {

    background: none;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
}

div#ytilsLogoAbsoluteContainerInner {

    background: none;
    margin: auto;
    max-width: 120px;
    padding: 25px 0 0 25px;
    pointer-events: none;
}

div.noticeSection {

    background-color: rgba(114, 144, 77, 0.7);
    border: 1px solid #72904D;
    border-radius: 15px;
    color: #FFF;
    margin: 0 15px 15px 15px;
    padding-top: 15px;
}

div.noticeSection a:link,
div.noticeSection a:visited {

    color: #FFF !important;
    text-decoration: underline !important;
}

div.noticeSection a:hover,
div.noticeSection a:active,
div.noticeSection a:focus {

    color: #FFF !important;
    text-decoration: none !important;
}

div.noticeSectionHome {

    background-color: rgba(114, 144, 77, 0.7);
    border: 1px solid #72904D;
    border-radius: 15px;
    color: #FFF;
    margin: 0 15px 0 15px;
    padding-top: 15px;
}

div.noticeSectionHome a {

    color: #FFF !important;
    text-decoration: underline !important;
}

div.noticeSectionHome a:hover,
div.noticeSectionHome a:focus {

    color: #FFF !important;
    text-decoration: none !important;
}

div.noticeSection p {

    color: #FFF !important;
}

div#mainNavFixLogo {

    padding: 0 20px 0 20px;
    width: 100%;
}

div#mainNavFix {

    background-color: #F3F3F3;
    padding: 0 20px 0 20px;
    width: 100%;
}

div#mainNavFixLogo {

    position: absolute;
    z-index: 1000;
}

div#mainNavLogo,
div#mainNav {

    margin-top: 25px;
}

div#mainNavContentContainerLogo,
div#mainNavContentContainer {

    border-bottom: 1px solid #50504F;
    margin: auto;
    max-width: 980px;
    padding: 0 15px 15px 15px;
}

div#mainContent {

    padding-top: 20px;
}

div#mainContent div.mainContentInner {

    margin: auto;
    max-width: 980px;
    padding: 0 35px 0 35px;
}

div#mainContent div.mainContentInner div.stdSpacing {

    height: 15px;
}

div#mainContent div.mainContentInner img.screenshot {

    border: 1px solid #50504F;
    max-width: 100%;
}

div#mainContent div.mainContentInner div.screenshotSubline {

    font-size: 14px;
    margin-bottom: 15px;
    text-align: right;
}

div#mainContent div.mainContentInner div.screenShotNumberLegend {

    background: #72904D;
    border-radius: 50%;
    color: #F3F3F3;
    font-size: 24px;
    height: 36px;
    margin: auto;
    padding: 0 8px 8px 8px;
    text-align: center;
    width: 36px;
}

div#mainContent div.mainContentInner div.backOrForward {

    /* background: #72904D; */
    background: #009EC7;
    border-radius: 50%;
    color: #F3F3F3;
    cursor: pointer;
    display: inline-block;
    font-size: 16px;
    height: 24px;
    margin: 0 0 0 15px;
    padding: 0 0 8px 2px;
    text-align: center;
    width: 24px;
}

div#mainContent div.mainContentInner div.backOrForwardR {

    /* background: #72904D; */
    background: #009EC7;
    border-radius: 50%;
    color: #F3F3F3;
    cursor: pointer;
    display: inline-block;
    font-size: 16px;
    height: 24px;
    margin: 0 15px 0 0;
    padding: 0 0 8px 2px;
    text-align: center;
    width: 24px;
}

div#mainContent div.mainContentInner div.paginationRow {

    margin-bottom: 16px;
}

div#mainContent div.mainContentInner div.backOrForward a,
div#mainContent div.mainContentInner div.backOrForwardR a {

    color: #FFF;
    cursor: pointer;
    text-decoration: none;
}

div#mainContent div.mainContentInner a.backOrForwardLink {

    /* color: #72904D; */
    color: #009EC7;
    text-decoration: none;
}

div#mainContent div.mainContentInner a.backOrForwardLink:hover,
div#mainContent div.mainContentInner a.backOrForwardLink:focus {

    /* color: #72904D; */
    color: #009EC7;
    text-decoration: underline;
}

div#mainContent div.mainContentInner div.screenShotNumberLegendBottom {

    margin-bottom: 16px;
}

div#mainContent div.mainContentInner div.screenShotNumberLegendText {

    display: inline-block;
}

div#mainContent div.mainContentInner div.screenShotNumberLegendText p {

    font-size: 16px;
}

div#mainContent div.mainContentInner p.supDeclaration {

    color: #72904D;
    font-weight: bold;
}

div#mainContent div.mainContentInner h2 {

    font-size: 36px;
    font-weight: 300;
    margin-bottom: 16px;
    padding: 0 15px 0 15px;
}

div#mainContent div.mainContentInner div.githubMark {

    padding-top: 8px;
}

div#mainContent div.mainContentInner img.documentationMark,
div#mainContent div.mainContentInner img.githubMark {

    border: none;
    height: 28px;
    width: 28px;
}

div#mainContent div.mainContentInner img.downloadImage {

    border: none;
    margin-right: 5px;
    height: 28px;
    vertical-align: center;
    width: 28px;
}

div#mainContent div.mainContentInner h3 {

    font-size: 28px;
    font-weight: 300;
    margin-bottom: 16px;
    padding: 0 15px 0 15px;
}

div#mainContent div.mainContentInner h3.flwH2 {

    font-size: 28px;
    font-weight: 300;
    margin-top: -16px;
    margin-bottom: 16px;
    padding: 0 15px 0 15px;
}

div#mainContent div.mainContentInner h3.flwH2Sm {

    font-size: 20px;
    font-weight: 300;
    margin-top: -16px;
    margin-bottom: 16px;
    padding: 0 15px 0 15px;
}

div#mainContent div.mainContentInner h3 a {

    color: #009EC7;
    font-size: 28px;
    font-weight: 300;
    padding: 0 15px 0 15px;
    text-decoration: none;
}

div#mainContent div.mainContentInner h3 a:hover,
div#mainContent div.mainContentInner h3 a:focus {

    color: #009EC7;
    font-size: 28px;
    font-weight: 300;
    padding: 0 15px 0 15px;
    text-decoration: underline;
}

div#mainContent div.mainContentInner h4 {

    font-size: 22px;
    font-weight: 300;
    margin-bottom: 16px;
    padding: 0 15px 0 15px;
}

div#mainContent div.mainContentInner .devApiHl h3,
div#mainContent div.mainContentInner .devApiHl h4 {

    background: #72904D;
    color: #FFF;
    font-size: 22px;
    margin: 0 15px 0 15px;
    padding: 10px 15px 10px 15px;
}

div#mainContent div.mainContentInner div.devApiParamTable table th {

    font-size: 18px;
}

div#mainContent div.mainContentInner div.devApiParamTable table td {

    font-size: 16px;
}
div#mainContent div.mainContentInner div.devApiParamTable table td.codeDocTable {

    font-size: 14px;
}

div#mainContent div.mainContentInner div.devApiParamTable table {

    margin-bottom: 0;
}

div#mainContent div.mainContentInner div.subDocTablePadding {

    padding: 5px 5px 0 5px;
}

div#mainContent div.mainContentInner div.devApiParamTable tr.subDocTable {

    background-color: #72904D;
    color: #FFF;
}

span.typedefType {

    background-color: #FFF;
    border: #72904D solid 1px;
    color: #72904D;
    font-family: "Courier New", Courier, monospace;
    padding: 2px;
}

div#mainContent div.mainContentInner .devApiParamTable {

    border: #72904D solid 1px;
    overflow-x: auto;
    margin: 0 15px 0 15px;
    padding: 0;
    width: auto;
}

div#mainContent div.mainContentInner h4.flwH3 {

    font-size: 22px;
    font-weight: 300;
    margin-top: -16px;
    margin-bottom: 16px;
    padding: 0 15px 0 15px;
}

div#mainContent div.mainContentInner h4.flwH3Sm {

    font-size: 20px;
    font-weight: 300;
    margin-top: -16px;
    margin-bottom: 16px;
    padding: 0 15px 0 15px;
}

div#mainContent div.mainContentInner h5 {

    font-size: 18px;
    font-weight: 300;
    margin-bottom: 16px;
    padding: 0 15px 0 15px;
}

div#mainContent div.mainContentInner h5.flwH3 {

    font-size: 18px;
    font-weight: 300;
    margin-top: -16px;
    margin-bottom: 16px;
    padding: 0 15px 0 15px;
}

div.productSubline {

    border-top: 1px solid #50504F;
    margin-top: 10px;
    padding-top: 10px;
}

div#mainContent div.mainContentInner p {

    font-size: 16px;
    padding: 0 15px 0 15px;
}

div#mainContent div.mainContentInner p.noMarginBottom {

    font-size: 16px;
    margin-bottom: 0;
    padding: 0 15px 0 15px;
}

div#mainContent div.mainContentInner p.code {

    font-family: "Courier New", Courier, monospace;
    font-size: 16px;
    padding: 0 15px 0 15px;
}

div#mainContent div.mainContentInner ol,
div#mainContent div.mainContentInner ul {

    margin-left: 15px;
}

div#mainContent div.mainContentInner .preCode {

    /* margin-bottom: -15px; */
}

div#mainContent div.mainContentInner .afterCode {

    margin-top: -30px;
}

div#mainContent div.mainContentInner .afterCode15 {

    margin-top: -15px;
}

div#mainContent div.mainContentInner .afterCodeNoMarginBottom {

    margin-top: -30px;
    margin-bottom: 0;
}

div#mainContent div.mainContentInner pre {

    padding: 0 10px 0 10px;
}

div#mainContent div.mainContentInner div.screenShotNumberLegendText p {

    font-size: 16px;
    padding: 5px 15px 0 15px;
}

div#mainContent div.mainContentInner div.screenShotNumberLegendText strong {

    font-weight: 700;
}

div#mainContent div.mainContentInner .code {

    background-color: #FFF;
    border: 1px solid #50504F;
    font-family: "Courier New", Courier, monospace;
    font-size: 14px;
    padding: 0 3px 0 3px;
    text-transform: uppercase;
}

div#mainContent div.mainContentInner .codeEol {

    background-color: #FFF;
    border: 1px solid #50504F;
    font-family: "Courier New", Courier, monospace;
    font-size: 14px;
    margin: 0 1px 0 0;
    padding: 0 3px 0 3px;
    text-transform: uppercase;
}

div#mainContent div.mainContentInner .codeCs {

    background-color: #FFF;
    border: 1px solid #50504F;
    font-family: "Courier New", Courier, monospace;
    font-size: 14px;
    padding: 0 3px 0 3px;
}

div#mainContent div.mainContentInner .codeCsNoWrap {

    background-color: #FFF;
    border: 1px solid #50504F;
    font-family: "Courier New", Courier, monospace;
    font-size: 14px;
    padding: 0 3px 0 3px;
}

div#mainContent div.mainContentInner .codeCs20 {

    background-color: #FFF;
    border: 1px solid #50504F;
    font-family: "Courier New", Courier, monospace;
    font-size: 18px;
    padding: 0 3px 0 3px;
}

div#mainContent div.mainContentInner .codeCsEol {

    background-color: #FFF;
    border: 1px solid #50504F;
    font-family: "Courier New", Courier, monospace;
    font-size: 14px;
    margin: 0 1px 0 0;
    padding: 0 3px 0 3px;
}

.wsPre {

    white-space: pre;
}

.wsNoWrap {

    white-space: nowrap;
}

div.contentDividerLine {

    padding: 0 40px 0 40px;
}

div.contentDividerLineInner {

    border-top: 1px solid #50504F;
    padding-top: 15px;
    margin: auto;
    max-width: 980px;
}

div.mainContentInner img.one3rd {

    height: 210px;
    margin-bottom: 15px;
    width: 210px;
}

div.stdSpacer {

    height: 15px;
}

div.bottomSpacer {

    height: 40px;
}

div.bottomSpacer15 {

    height: 15px;
}

div.bottomMargin15ForProductIcon {

    margin-bottom: 15px;
}

/** Yupput Demo area */
label#yupputDemoEventLabel {

    display: none;
}

div#yupputDemoEventContainer {

    border: #72904D solid 1px;
    padding: 15px;
}

div#yupputDemoEventContainer input#yupputDemoEvent {

    background: none;
    border: none;
    color: #50504F;
    font-size: 22px;
    outline: none;
    width: 100%;
}

th.cmdDescription {

    border-bottom: 0;
    background-color: #F3F3F3 !important;
    background-image: none;
}

td.cmdDescription {

    background-color: #F3F3F3 !important;
    background-image: none;
}

th.cmdDescriptionBorder {

    border-top: #212529 solid 1px !important;
}

td.cmdDescriptionBorder {

    border-top: #212529 solid 1px !important;;
}

.fwNormal {

    font-weight: normal;
}

.fsStd {

    font-size: 16px;
}

div.hOverflw {

    max-width: 100%;
    overflow-x: scroll;
}

div.hOverflwAsP {

    max-width: 100%;
    overflow-x: scroll;
    padding: 0 15px 15px 15px;
}

span#noSpamLegalNoticeEmailAddress {

    color: #009EC7;
    cursor: pointer;
    text-decoration: none;
}

span#noSpamLegalNoticeEmailAddress:hover,
span#noSpamLegalNoticeEmailAddress:active {

    color: #009EC7;
    cursor: pointer;
    text-decoration: underline;
}

/** Yupput overrides */
div#ytilsYupputOuterContainer {

    position: fixed;
}