@font-face { font-family: 'Bootstrap-Icons'; src: url('/fonts/bootstrap-icons.woff2') format('woff2'); font-display: swap; font-style: normal; }

@media screen and (max-width: 1099px) { /* Mobile */
    #drawer-menu, .k-drawer-content { display: block; }
    #menu { display: none; }
    .st-nav .logo { display: block; margin: 19px auto 19px 50px; }
    .footer-s { width: 0; }
    .down-ds { max-width: 360px; margin: 0 auto; }
    .down-ds .inner { padding: 20px; }
    .down-con { display: flex; flex-wrap: wrap; max-width: 320px; }
    .error-box { max-width: 290px; }
    .help-con .inner > div { padding: 20px; }
    .help-con .inner { width: calc(100% - 80px); }
    .help-con .imgr { margin-bottom: 10px; }
    .disc-con .inner { padding: 20px; margin: 0 40px; }
}

@media screen and (min-width: 1100px) { /* Desktop */
    #drawer-menu, .k-drawer-content { display: none; }
    #menu { width: 915px; padding-right: 5px; margin-left: auto; display: flex; }
    #menu > a { line-height: 70px; color: rgba(255, 255, 255, 0.75); font-weight: 300; display: block; margin: 0 15px; border-bottom: 3px solid #013348; white-space: nowrap; }
    #menu > a:hover { color: rgba(255, 255, 255, 1); border-bottom: 3px solid #7898C2; }
    .st-nav .selected { border-bottom: 3px solid #7898C2 !important; }
    .st-nav .logo { display: block; margin: 19px 20px; }
    .footer-s { width: 40px; }
    .down-ds { max-width: 1080px; margin: 0 auto; }
    .down-ds .inner { padding: 40px; }
    .down-con { display: flex; flex-wrap: wrap; max-width: 960px; }
    .error-box { max-width: 1010px; }
    .help-con .inner > div:first-child { width: calc(65% - 120px); }
    .help-con .inner > div:last-child { width: 35%; padding-left: 0; }
    .help-con .inner > div { padding: 40px; }
    .help-con .imgr { float: right; }
    .disc-con .inner { padding: 40px; }
}

* { font-family: "Segoe UI", Roboto, Arial, sans-serif; }
html { font-size: 1em; }
body { margin: 0; padding: 0; background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url('/img/bg11.jpg') no-repeat center top; background-size: cover; }
h1 { font-weight: 300; padding: 0; margin: 0; color: #000; }
a { color: #0D6EFD; text-decoration: none; }
a:hover { color: #2D2DB2; }
.s20 { padding-top: 20px; }
.s40 { padding-top: 40px; }
.s100 { padding-top: 100px; }
.h2 { font-size: 36px; padding-bottom: 10px; line-height: 40px; }
.h3 { font-size: 20px; padding-bottom: 10px; line-height: 1.5em; font-weight: 500; }
.p2 { font-size: 20px; padding-bottom: 10px; line-height: 40px; font-weight: 300; }
.p2 a { font-weight: 500; color: rgba(255, 255, 255, 1); }
.p2 a:hover { color: rgba(255, 255, 255, 0.75); }
.p2 a:visited { color: rgba(255, 255, 255, 1); }
.p3 { line-height: 1.5em; font-weight: 300; }
.cnt { text-align: center; margin: 0 auto; }
.cntw { text-align: center; margin: 0 auto; color: #fff; }
.sep40 { width: 100%; height: 1px; border-bottom: solid 1px #D9D9D9; margin: 40px 0; }
.sep20 { width: 100%; height: 2px; border-bottom: solid 1px #D9D9D9; margin: 20px 0; }
.sep10 { width: 100%; height: 1px; border-bottom: solid 1px #D9D9D9; margin: 20px 0; }
.error-box { background: rgba(202, 19, 63, 1); padding: 20px 15px; margin: 40px auto 0 auto; font-size: 24px; line-height: 40px; font-weight: 300; }
.bld { font-weight: 500; }
.maxl { max-width: 1040px; margin: 0 auto; }
.cbtn { background-color: #19536b; border-color: #19536b; }
.cbtn:hover { background-color: #00405b; border-color: #00405b; }
.tbtn { background-color: #57adb3; border-color: #57adb3; color: #fff; }
.tbtn:hover { background-color: #4e9ba1; border-color: #4e9ba1; color: #fff; }

/* Layout */
.st-nav { width: 100%; height: 70px; position: fixed; top: 0; background: #013348; display: flex; z-index: 99; }
section { width: 100%; margin-top: 70px; }
#button-push { border-radius: 0; border: 0; background: #013348; color: #fff; width: 70px; height: 70px; }
#button-push:before { font-family: Bootstrap-Icons; content: "\F479"; font-size: 2em; }
.k-drawer-content { flex: none; }
.disclaimer { font-size: 0.8em; }
.disclaimer p { padding-top: 0; margin-top: 0; }
.disclaimer .title { overflow-x: hidden; overflow-y: scroll; height: 190px; max-height: 190px; padding-right: 10px; }
.disclaimer .bcon { width: 250px; margin: 30px auto 0 auto; }
.disclaimer button { width: 120px; }
.disclaimer button:first-child { margin-right: 10px; }
.pre-footer { padding-bottom: 40px; display: flex; flex-wrap: wrap; justify-content: center; min-width: 360px; max-width: 720px; margin: 0 auto; }
.pre-footer > div { color: #fff; padding-top: 40px; }
.pre-footer .inner { display: flex; }
.pre-footer .ic { width: 40px; height: 40px; padding-right: 20px; }
.pre-footer .tx { width: 260px; }
.pre-footer .ic-help:before { font-family: Bootstrap-Icons; content: "\F504"; font-size: 2em; }
.pre-footer .ic-error:before { font-family: Bootstrap-Icons; content: "\F3E2"; font-size: 2em; }
.pre-footer .head { font-size: 36px; padding-bottom: 10px; line-height: 40px; }
.pre-footer .text { line-height: 1.5em; font-weight: 300; font-size: 0.8em; }
footer { background: #0F1116; padding: 40px 0; }
footer > div { width: 320px; color: rgba(255, 255, 255, 0.4); margin: 0 auto; line-height: 1.7em; font-weight: 300; font-size: 0.7em; text-align: center; }
footer a { font-weight: 500; color: rgba(255, 255, 255, 0.4); }
footer a:hover { color: rgba(255, 255, 255, 0.4); }
footer a:visited { color: rgba(255, 255, 255, 0.4); }
#loader-download { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #666666; opacity: .8; z-index: 1000; }

/* Home */
.tile-con { display: flex; flex-wrap: wrap; justify-content: center; min-width: 360px; max-width: 1080px; margin: 0 auto; }
.tile-con > div { width: 320px; height: 450px; margin: 40px 20px 0 20px; background: #fff; border-radius: 10px; }
.tile-con .inner { padding: 20px; text-align: center; }
.tile-con img { display: block; border-top-left-radius: 10px; border-top-right-radius: 10px; }
.tile-con .details { height: 212px; max-height: 212px; overflow: hidden; }
.tile-con .details a { display: block; font-weight: 500; line-height: 1.5em; color: #19536b; }
.tile-con .details a:hover { color: #00405b; }
.tile-con p { line-height: 1.5em; font-weight: 300; }
.tile-con .btn:hover { color: #fff; }
.tile-con .ic { width: 19px; height: 24px; }
.tile-con .ic-cright:before { font-family: Bootstrap-Icons; content: "\F285"; }

.tile-con .k-listview-content { overflow: hidden; }
.tile-con .k-listview:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

/* Planning Scheme */
.tile-con-p { display: flex; flex-wrap: wrap; justify-content: center; min-width: 360px; max-width: 1080px; margin: 0 auto; }
.tile-con-p > div { width: 320px; height: 285px; margin: 40px 20px 0 20px; background: #fff; border-radius: 10px; }
.tile-con-p .inner { padding: 20px; text-align: center; }
.tile-con-p img { display: block; border-top-left-radius: 10px; border-top-right-radius: 10px; }
.tile-con-p .details { height: 47px; max-height: 212px; overflow: hidden; }
.tile-con-p .details a { display: block; font-weight: 500; line-height: 1.5em; }
.tile-con-p p { line-height: 1.5em; font-weight: 300; }
.tile-con-p .btn:hover { color: #fff; }

/* Downloads */
.down-ds { margin: 0 auto; }
.down-ds .inner { text-align: center; background: #fff; margin: 40px 20px 0 20px; background: #fff; border-radius: 10px; }
#button-dcdb-download:hover { color: #fff; }
#button-dcdb-download:visited { color: #fff; }
.ic-download:after { font-family: Bootstrap-Icons; content: "\00a0\F30A"; }
.down-con > div { line-height: 1.5em; width: 300px; padding: 40px 20px 20px 0; text-align: left; border-bottom: solid 1px #D9D9D9; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }

/* Help */
.help-con { max-width: 1120px; margin: 40px auto 0; }
.help-con .inner { display: flex; flex-wrap: wrap; border-radius: 10px; background: #fff; margin: 0 40px; }
.help-con .question { color: #0DCAF0; font-style: italic; line-height: 1.5em; font-weight: 400; }
.help-con .p2b { padding-bottom: 10px; line-height: 1.5em; font-weight: 300; }
.help-con .p2b a { color: #0D6EFD; }
.help-con .p2b a:hover { color: #2D2DB2; }
.help-con .p2i { padding-bottom: 10px; line-height: 1.5em; font-weight: 300; font-size: 0.8em; }
.help-con .p2i a { color: #0D6EFD; }
.help-con .p2i a:hover { color: #2D2DB2; }
.help-con .ahead { display: block; line-height: 1.5em; }
.help-con .imgr { display: block; }

/* Disclaimer */
.disc-con { max-width: 1040px; margin: 0 auto; }
.disc-con .inner { border-radius: 10px; background: #fff; }
.disc-con .p2b { padding-bottom: 10px; line-height: 1.5em; font-weight: 300; }

/* Staff */
.titlest { text-align: center; color: #fff; font-weight: 100; font-size: 2.4em; padding: 40px 0 3px; margin: 0; }
.tile-const { display: flex; flex-wrap: wrap; justify-content: center; min-width: 360px; margin: 0 auto; }
.tile-const > div { width: 320px; height: 310px; margin: 40px 20px 0 20px; background: #fff; border-radius: 10px; }
.tile-const .inner { padding: 20px; text-align: center; }
.tile-const img { display: block; border-top-left-radius: 10px; border-top-right-radius: 10px; }
.tile-const .details { height: 212px; max-height: 212px; overflow: hidden; }
.tile-const .details a { display: block; font-weight: 500; line-height: 1.5em; color: #19536b; }
.tile-const .details a:hover { color: #00405b; }
.tile-const p { line-height: 1.5em; font-weight: 300; }
.tile-const .btn:hover { color: #fff; }
.tile-const .ic { width: 19px; height: 24px; }
.tile-const .ic-cright:before { font-family: Bootstrap-Icons; content: "\F285"; }