@font-face {
    font-display: block;
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: bold;
    src: local("IBM Plex Sans Bold"), local("IBMPlexSans-Bold"), url(../fonts/IBMPlexSans-Bold.ttf) format("truetype");
}

@font-face {
    font-display: block;
    font-family: "IBM Plex Sans";
    font-style: italic;
    font-weight: bold;
    src: local("IBM Plex Sans Bold Italic"), local("IBMPlexSans-BoldItalic"), url(../fonts/IBMPlexSans-BoldItalic.ttf) format("truetype");
}

@font-face {
    font-display: block;
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 200;
    src: local("IBM Plex Sans ExtraLight"), local("IBMPlexSans-ExtraLight"), url(../fonts/IBMPlexSans-ExtraLight.ttf) format("truetype");
}

@font-face {
    font-display: block;
    font-family: "IBM Plex Sans";
    font-style: italic;
    font-weight: 200;
    src: local("IBM Plex Sans ExtraLight Italic"), local("IBMPlexSans-ExtraLightItalic"), url(../fonts/IBMPlexSans-ExtraLightItalic.ttf) format("truetype");
}

@font-face {
    font-display: block;
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 300;
    src: local("IBM Plex Sans Light"), local("IBMPlexSans-Light"), url(../fonts/IBMPlexSans-Light.ttf) format("truetype");
}

@font-face {
    font-display: block;
    font-family: "IBM Plex Sans";
    font-style: italic;
    font-weight: 300;
    src: local("IBM Plex Sans Light Italic"), local("IBMPlexSans-LightItalic"), url(../fonts/IBMPlexSans-LightItalic.ttf) format("truetype");
}

@font-face {
    font-display: block;
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 500;
    src: local("IBM Plex Sans Medium"), local("IBMPlexSans-Medium"), url(../fonts/IBMPlexSans-Medium.ttf) format("truetype");
}

@font-face {
    font-display: block;
    font-family: "IBM Plex Sans";
    font-style: italic;
    font-weight: 500;
    src: local("IBM Plex Sans Medium Italic"), local("IBMPlexSans-MediumItalic"), url(../fonts/IBMPlexSans-MediumItalic.ttf) format("truetype");
}

@font-face {
    font-display: block;
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 400;
    src: local("IBM Plex Sans"), local("IBMPlexSans"), url(../fonts/IBMPlexSans-Regular.ttf) format("truetype");
}

@font-face {
    font-display: block;
    font-family: "IBM Plex Sans";
    font-style: italic;
    font-weight: 400;
    src: local("IBM Plex Sans Italic"), local("IBMPlexSans-Italic"), url(../fonts/IBMPlexSans-Italic.ttf) format("truetype");
}

@font-face {
    font-display: block;
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 600;
    src: local("IBM Plex Sans SemiBold"), local("IBMPlexSans-SemiBold"), url(../fonts/IBMPlexSans-SemiBold.ttf) format("truetype");
}

@font-face {
    font-display: block;
    font-family: "IBM Plex Sans";
    font-style: italic;
    font-weight: 600;
    src: local("IBM Plex Sans SemiBold Italic"), local("IBMPlexSans-SemiBoldItalic"), url(../fonts/IBMPlexSans-SemiBoldItalic.ttf) format("truetype");
}

@font-face {
    font-display: block;
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 100;
    src: local("IBM Plex Sans Thin"), local("IBMPlexSans-Thin"), url(../fonts/IBMPlexSans-Thin.ttf) format("truetype");
}

@font-face {
    font-display: block;
    font-family: "IBM Plex Sans";
    font-style: italic;
    font-weight: 100;
    src: local("IBM Plex Sans Thin Italic"), local("IBMPlexSans-ThinItalic"), url(../fonts/IBMPlexSans-ThinItalic.ttf) format("truetype");
}

@font-face {
    font-family: system;
    font-style: normal;
    font-weight: 300;
    src: local(".SFNSText-Light"),
         local(".HelveticaNeueDeskInterface-Light"),
         local(".LucidaGrandeUI"),
         local("Ubuntu Light"),
         local("Segoe UI Light"),
         local("Roboto-Light"),
         local("DroidSans"),
         local("Tahoma");
}

html, body {
    height: 100%;
    margin: 0;
    overflow: hidden;
    -webkit-text-size-adjust: 100%;
}

body {
    font-family: "IBM Plex Sans", "system" !important;
    font-size: 14px !important;
    line-height: 20px !important;
}

*, *::before, *::after {
    box-sizing: border-box;
}

h6, h5, h4, h3, h2, h1 {
    margin-top: 0;
    margin-bottom: .5rem;
    font-weight: 500;
    line-height: 1.2;
}

.app { height: 100%; }

.dm-mobile .app { height: calc(100% - 47px) }

.dm-app {
    box-sizing: border-box;
    height: 240px;
    left: 50%;
    margin: -120px 0 0 -150px;
    position: absolute;
    text-align: left;
    text-align: center;
    top: 50%;
    width: 300px;
}

.dm-app-header {
    background: url(../img/icon/desktop/mstile-150x150.png) no-repeat top center;
    box-sizing: border-box;
    height: 200px;
    padding: 150px 0 0 0;
}

.dm-app-intro { font-size: large; }

div#root { height: 100%; }

.dm-logo {
    background: url('../img/logo.png') no-repeat left center;
    margin-top: 15px;
    padding-left: 40px;
}