* {
    text-shadow: none !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    font-weight: normal !important;
    /* needed to prevent IE native swipe right action = history back */
    /*-ms-touch-action: none;*/
}

strong, b, strong *, b * {
    font-weight: bold !important;
}

html, body {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
}

body {
    font-family: helvetica, sans-serif;
}

.side {
    position: absolute !important;
    width: 100%;
    height: 100%;
}

.ui-content {
    padding: 0;
}

.fa {
    font-family: 'FontAwesome';
    width: 22px;
}

#right_menu .ui-controlgroup-controls a {
    width: 12px;
}

.ui-panel-wrapper, #online {
    background: transparent !important;
    z-index: 1;
}

.ui-mini, .ui-btn {
    margin: 0;
}

.custom-fieldset {
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;    
}

.custom-fieldset .ui-controlgroup-controls {
    width: 100% !important;
}

.custom-fieldset .ui-controlgroup-controls .ui-select {
    width: 30% !important;
}

.custom-fieldset .ui-controlgroup-controls .ui-select:last-child {
    width: 40% !important;
}

.ui-select .ui-btn {
    background: transparent;
}

.ui-checkbox-on:after,
.ui-select .ui-btn:after {
    font-family: 'FontAwesome';
    background-color: transparent;
}

.ui-select .ui-btn:after {
    content: "\f078" !important;
}

.ui-checkbox-on:after  {
    content: "\f00c" !important;
    text-align: center;
    line-height: 18px;
    text-shadow: none !important;
}

#page {
    background-repeat: repeat-y;
    background-size: 100% auto;
    background-position: top left;
    -webkit-overflow-scrolling: touch;
}

#onlinecontent {
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: top left;
}

.logo-container,
.markcomm-wrapper {
    position: relative;
}

h1, h2, h3, h4, h5, h6, p {
    margin: 0;
}

#header a {
    font-size: 16px;
    padding: 8px;
}

#header .fa {
    width: auto;
}

#header [data-iconpos="left"] .fa {
    padding-right: 8px;
}

body.androidchrome {
    margin: 0;
}

.installNumber {
    position: absolute;
    top: 0;
    left: min(15px, 4.1666%);
    width: min(52px, 14.444%);
    z-index: 10;
    font-size: min(25px, 6vw);
    color: white;
    text-align: center;
}

#androidchrome_installation, #wp_installation, #ios_installation {
    text-align: right;
    position: relative;
}

#androidchrome_installation #bg,
#androidedge_installation #bg,
#androidsamsung_installation #bg,
#wp_installation #bg,
#ios_installation #bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

#androidedge_installation,
#androidsamsung_installation,
#ios_installation {
    padding-top: 16px;
    
}

#androidchrome_installation .tap-here,
#androidedge_installation .tap-here,
#androidsamsung_installation .tap-here,
#wp_installation .tap-here,
#ios_installation .tap-here {
    padding-right: 30px;
    font-size: 64px;
    color: #ffffff;
}

#wp_installation .tap-here {
    position: fixed;
    bottom: 0;
    right: 0;
    line-height: 0;
}

#androidedge_installation .tap-here,
#ios_installation .tap-here {
    position: fixed;
    bottom: -5px;
    left: 0;
    width: 100%;
    text-align: center;
    padding-right: 0;
    z-index: 1;
}

#androidsamsung_installation .tap-here {
    position: fixed;
    bottom: -5px;
    right: 5px;
    width: 100%;
    text-align: right;
    padding-right: 0;
    z-index: 1;
}

#androidedge_installation .tap-here i,
#androidsamsung_installation .tap-here i,
#ios_installation .tap-here i {
    width: inherit;
}

#androidchrome_installation .tap-here .fa:before,
#androidedge_installation .tap-here .fa:before,
#androidsamsung_installation .tap-here .fa:before,
#wp_installation  .tap-here .fa:before,
#ios_installation .tap-here .fa:before{
    text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
}

#androidchrome_installation #instructions-wrapper,
#androidedge_installation #instructions-wrapper,
#androidsamsung_installation #instructions-wrapper,
#wp_installation #instructions-wrapper,
#ios_installation #instructions-wrapper {
    -webkit-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.3) !important;
    box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.3) !important;
    margin: 0 16px;
    background: #ffffff;
}

#wp_installation #instructions-wrapper {
    margin-right: 32px;
    margin-top: 16px;
}

#androidedge_installation #instructions-wrapper,
#androidsamsung_installation #instructions-wrapper,
#ios_installation #instructions-wrapper {
    height: calc(100% - 60px);
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
}

#androidedge_installation #instructions-wrapper #wrapper-scroll,
#androidsamsung_installation #instructions-wrapper #wrapper-scroll,
#androidchrome_installation #instructions-wrapper #wrapper-scroll,
#wp_installation #instructions-wrapper #wrapper-scroll,
#ios_installation #instructions-wrapper #wrapper-scroll {
    width: 100%;
    height: 100%;
    overflow-y: scroll;
}

#androidchrome_installation #instructions-wrapper div:first-child,
#androidedge_installation #instructions-wrapper div:first-child,
#androidsamsung_installation #instructions-wrapper div:first-child,
#wp_installation #instructions-wrapper div:first-child,
#ios_installation #instructions-wrapper div:first-child {
    background: #ffffff;
}

#androidchrome_installation #instructions-wrapper div,
#androidedge_installation #instructions-wrapper div,
#androidsamsung_installation #instructions-wrapper div,
#wp_installation #instructions-wrapper div,
#ios_installation #instructions-wrapper div {
    padding: 32px 16px;
    text-align: center;
    background: #f4f4f4;
}

#androidchrome_installation #instructions-wrapper hr,
#androidedge_installation #instructions-wrapper hr,
#androidsamsung_installation #instructions-wrapper hr,
#wp_installation #instructions-wrapper hr,
#ios_installation #instructions-wrapper hr {
    margin: 0;
    border: none;
    border-top: 2px solid #ffffff;
    border-bottom: 1px solid #d5d5d5;
}

#androidchrome_installation img,
#androidedge_installation img,
#androidsamsung_installation img,
#wp_installation img,
#ios_installation img {
    padding-bottom: 8px;
}

#androidchrome_installation h1, #androidchrome_installation h2,
#androidedge_installation h1, #androidedge_installation h2,
#androidsamsung_installation h1, #androidedge_installation h2,
#wp_installation h1, #wp_installation h2,
#ios_installation h1, #ios_installation h2 {
    color: #20c4f4;
    padding-bottom: 8px;
}

#androidchrome_installation p,
#androidedge_installation p,
#androidsamsung_installation p,
#wp_installation p,
#ios_installation p {
    color: #000000;
}

#androidchrome_installation p.apptitle,
#androidedge_installation p.apptitle,
#androidsamsung_installation p.apptitle,
#wp_installation p.apptitle,
#ios_installation p.apptitle {
    margin-bottom: 16px;
}

#androidedge_installation #instructions-wrapper,
#androidsamsung_installation #instructions-wrapper {
    position: absolute;
}

#online #distribute {
    height: 100%;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    box-orient: vertical;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
}

#online #distribute div {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

#online #distribute img {
    max-height: 100%;
    width: auto;
}

#online #distribute p {
    height: inherit;
}

#online #distribute .img {
    -webkit-box-flex: 4;
    -moz-box-flex: 4;
    -webkit-flex: 4;
    -ms-flex: 4;
    flex: 4;
}

#online #distribute .wide {
    -webkit-box-flex: 8;
    -moz-box-flex: 8;
    -webkit-flex: 8;
    -ms-flex: 8;
    flex: 8;
}

#online #distribute div.qr {
    -webkit-box-flex: 3;
    -moz-box-flex: 3;
    -webkit-flex: 3;
    -ms-flex: 3;
    flex: 3;
}

#online #bottom {
    position: absolute;
    bottom: 0;
    padding-bottom: 5%;
    width: 100%;
}

#online table {
    width: 100%;
}

#online table th {
    text-align: center;
}

#online table td {
    text-align: left;
}

#online table th,
#online table td {
    vertical-align: top;
}

.comm-box.front,
.comm-box.front thead,
.comm-box.front tbody,
.comm-box.front tfoot,
.comm-box.front tr,
.comm-box.front th,
.comm-box.front td {
    border-collapse: collapse;
    margin: 0;
    padding: 0;
    border: none;
    border-collapse: inherit;
    border-spacing: 0;
    border-color: inherit;
    vertical-align: inherit;
    font-weight: inherit;
    -webkit-border-horizontal-spacing: 0;
    -webkit-border-vertical-spacing: 0;
}

#header .ui-controlgroup-controls a,
#online button,
#online #dialogbutton {
    border: none;
}

img {
    max-width: 100%;
    vertical-align: top;
}

img[alt="qr"] {
    max-width: 30%;
    min-width: 10mm;
    min-height: 10mm;
}

.logo-container {
    text-align: center;
    overflow: hidden;
}

.logo-container img {
    vertical-align: top;
}

.markcomm-wrapper {
    padding-bottom: 16px;
    padding-bottom: 4vw;
    margin: 0 16px 8px 16px;
    margin: 0 4vw 2vw 4vw;
}

.markcomm-wrapper a {
    text-decoration: none;
}

.markcomm-wrapper .comm-image {
    height: 100px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: 50% 50%;
    background-color: transparent;
}

.markcomm-wrapper h3,
.markcomm-wrapper .caption {
    margin: 0;
    padding: 16px 16px 0 16px;
    padding: 4vw 4vw 0 4vw;
}

.markcomm-wrapper .caption {
    font-size: 14px;
    font-size: 3.5vw;
    line-height: normal;
    padding-top: 0;
}

.comm-box {
    padding: 16px 0;
    padding: 4vw 0;
    margin: 16px;
    margin: 4vw;
    overflow: hidden;
    position: relative;
}

.comm-box.front {
    background: none !important;
    margin: 0;
    padding: 5% 0;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    overflow: hidden;
}

.comm-box h1,
.comm-box h2,
.comm-box h3,
.comm-box h4,
.comm-box h5,
.comm-box h6,
.comm-box p,
.comm-box small,
.comm-box table {
    padding: 0 16px;
    padding: 0 4vw;
}

.comm-box h1, .comm-box h1 span {
    font-size: 2em;
    font-size: 8vw;
    line-height: normal;
}

.comm-box h2, .comm-box h2 span {
    font-size: 1.5em;
    font-size: 6vw;
    line-height: normal;
}

.comm-box h3, .comm-box h3 span {
    font-size: 1.17em;
    font-size: 4.8vw;
    line-height: normal;
}

.comm-box h4,
.comm-box p,
.comm-box span,
.comm-box a,
.comm-box em,
.comm-box th,
.comm-box td {
    font-size: 1em;
    font-size: 4vw;
    line-height: normal;
}

.comm-box th,
.comm-box td {
    padding: 0;
}

.comm-box .wide {
    padding: 0;
}

.comm-box fieldset.ui-controlgroup {
    margin: 0;
}

.comm-box.rss  {
    padding: 16px;
    padding: 4vw;
}

.comm-box.rss * {
    padding: 0;
}

.comm-box.rss a {
    text-decoration: none;
}

.comm-box.rss a:after {
    content: " \25B8";
}

.comm-box .comm-box-mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .75
}

.ui-popup-screen.in,
.panel-mask,
#overlay {
    opacity: .6;
}

.ui-popup {
    text-align: center;
    padding: 16px;
    padding: 4vw;
}

#popup-dialog-popup {
    width: 86%; /* fallback */
    width: calc(100% - 16vw);
}

.item-used {
    border: 1px solid black;
    text-align: center;
    margin: 0 15px;
    padding: 8px !important;
    padding: 2vw !important;
}

.ui-grid-a {
    padding: 16px;
    padding: 4vw;
}

.ui-block-a, .ui-block-b {
    cursor: pointer;
    text-align: center;
    margin-bottom: 16px;
    margin-bottom: 4vw;
}

.grid .cont a {
    text-decoration: none;
}

.grid div.img-cont {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 100%;
}

.grid div.img-cont img {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    max-height: 100%;
}

.grid div.txt-cont {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 4px;
    padding: 1vw;
}

.ui-block-a .cont {
    margin-right: 8px;
    margin-right: 2vw;
}

.ui-block-b .cont {
    margin-left: 8px;
    margin-left: 2vw;
}

.subcat1 {
    cursor: pointer;
    margin: 0 16px 16px 16px;
    margin: 0 4vw 4vw 4vw;
    padding: 8px;
    padding: 2vw;
}

.subcat1:first-child {
    margin-top: 16px;
    margin-top: 4vw;
}

.subcat1 div {
    display: inline-block;
    vertical-align: middle;
}

.subcat1 .txt-cont {
    width: 80%;
    margin-right: 5%;
}

.subcat1 .txt-cont h6 {
    word-wrap: break-word;
    font-size: 16px;
    font-size: 4vw;
    max-height: 20px;
    max-height: 5vw;
    overflow: hidden;
}

.subcat1 .img-cont {
    width: 15%;
}

.stamp {
    font-size: 24px;
    font-size: 10vw;
}

.stamp.not-used {
    opacity: .35;
}

.stamp:nth-child(even) div {
    margin-left: 8px;
    margin-left: 2vw;
}

.stamp:nth-child(odd) div {
    margin-right: 8px;
    margin-right: 2vw;
}

#settings {
    display: none;
}

#settings fieldset {
    padding: 16px;
    padding: 4vw;
}

#settings label {
    float: left;
    margin-top: 2px;
    width: 72%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#settings .ui-flipswitch {
    opacity: .5;
}

#settings .ui-flipswitch-active {
    opacity: 1;
}

#settings .fa {
    width: auto;
}

#settings #push-error {
    clear:both;
    display:none;
}

#settings #push-error h4 {
    display: table;
}

#settings #push-error h4 * {
    display: table-cell;
    vertical-align: middle;
}

#settings #push-error i {
    font-size: 150%;
    padding-right: 8px;
    padding-right: 2vw;
}

#settings #read-eula, #settings #close-eula {
    cursor: pointer;
}

#settings #eula {
    display: none;
}

#settings .title {
    font-weight: bold !important;
    font-size: 16px !important;
}

#settings #eula p {
    font-size: 14px;
}

#orientation_image {
    position: absolute;
    display: none;
    top: 0;
    left: 0;
    text-align: center;
    height: 100%;
    width: 100%;
    background-color: #ffffff;
}

#orientation_image div {
    width: 220px;
    height: 106px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -53px;
    margin-left: -110px;
}

#overlay {
    top: 0;
    left: 0;
    display: none;
    z-index:9999;
    position: fixed;
    height: 100%;
    width: 100%;
}

#overlay img {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 128px;
    width: 128px;
    margin-top: -64px;
    margin-left: -64px;
}

#qrPopup {
    padding: 0;
}

#qrPopup #qrPopupImg {
    width: 40mm;
    height: 40mm;
}

.network-error {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    padding: 5%;
    top: 0;
    left: 0;
    z-index: 99999;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    opacity: .9;
}

.network-error.alert  {
    display: table;
}

.network-error .error-container {
    display: table-cell;
    vertical-align: middle;
}

.network-error .error-box {
    background-color: #ffffff;
    padding: 10px;
    margin-bottom: 5px;
    text-align: center;

    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.network-error .error-box.acknowledge {
    -moz-box-shadow:0 2px 0 #0086ad;
    -webkit-box-shadow:0 2px 0 #0086ad;
    box-shadow:0 2px 0 #0086ad;
    cursor: pointer;
}

.network-error .error-box:first-child {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADkAAAA5CAYAAAH7H7MTAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAU9SURBVFhH7ZlLiBxVFIbbJ1FQ8YGQOOnqGYMjARFxI7gILkR3AXUlqBsDLl0IbiSouyzUVcCFuHDjA7JQNxEjY7qq2wgNKooRBR+IUUkcZrqqM6Iy5Tm3/+rcW/VXd1V3ddI99Ac/03XPf865t7teU1UrRSMIOypsZmkEUazCpksSzDUNNaSDiUzQ88NnWVClMWOqBi2Jjy6mXzN6ghqSwUzQZFlBx5AMNJrdA05wECAyhrGQn/Y/fCzHWO2X2tvXaILnR3/qtnQ/o9s6bgx5eEH4Vrqjva1xY0xjmwZmP3yJjSOlDzOI1k3Mj/4isX6BpXbvNhYcpb1Bb48pUCleq3unCpvFSaaFzWLo3nRhTSX2LE2Qn+VXVeGuSSdsFpvysh8+mJeoMQxlSUws0R5zkMC6bbq3E1/lrcW77DGR2ascUoZcwd6HGeRQ+1qOji9ZzCTVT24t5wYFFtOcwlNMS87cUZcFhklzMKGdjL1kDE2Pur9xo90wkY7DUi1ydD/OGibSOKzVIAWPDxr44TaGDanGxzE8GXLS27ILqxAypGPqR2g8sgX7QtjA4iqES/BefAUrlAguA4sn0jqwDcdrRfewAo7kRsl4g/ABGrek9UzhPOTK/gpLnFhSFy1cZNa/0AQipBhYnEnrI6UPMw2T14we1rwiX29aYzWsQqbxgplAzrttFTanizR6c7AjyGcMT4k4vtze61Q6hmj1eEF0Nt1QxxCuFjll3Z1uNpDEYKsO2sgSbNUgV/wjdnHZflFW9UJq7Ajsk2MXNrfPoBFsrtoxDE+G7Po/DStqx9SL4fFotM57TkFR/WS0G+HaSiu8NR3XHITLkykmSi5TSqMVPcQ8CJdDdornWLFGM3oelpp+ph7JhaU4tJDKj96GRf+Deod6RLAUQ378L1gRIz/6FjZt+B31qKQGbMNZam/cRAtYgjX/W4D2fL55M6z5yMy2WbItWEc21FqwcuTrepImZnVCbqY+JONZSU2Uz0ITKhDKu8hl5mNmZloOoqdl5k+xGJPWRps+uzvxtczItDfYuB1pNe+zrQbzMGkPpOnqwr+Zicm5wpM7gDxpD5OjpypmyJMcexsmUZCv9Rzz5MmcFllgmrr4DWUPepcFpiHthV9jwYIFyh1r3VuSlzkXFJ7RcVjmG8/v3ecuzpXGYZ1PZBGH0ovK0SGkzBcy8aOphYzSUaTOAXF8mdwnNMkiRkrzNB+VZpPV4Ox1cgv+G1tAYUm+1kHJ2UKfA3h++A+buP5CK531G2A17Dt17nq5G2xxv9bZXIV1NmgEvYNssn2FP8JG0afYPE/VOwjbpUUmczg7OVcH1uIrYXeR40++BOvlOdVhuC8NMoFjqQlR5b1lWW6HdzE/0TGkXDz0zbwcT6fJZLjkH1ykOsh40ccAWuO09kXqdNFHcnIiKffm3Y9eRbqDxF7LeIdI+9qPBKdCvdm9nzUfKT/6BCUc5B+9T6l/hHQeKFEtXtB7hjUsIlkMfU0gv8wm8xeRzgdlqkFO86+zRmW071RvCeUMK/75OvOVkc4L5SZAT/H6Low0KC3rWbAil443qK+s9D3duLeC5o4kCH+nhWdMstv/ofPF1IshB/Z+2RX+ZQVnVTpfnTeWMJx60H2UFZlQJ7y1eBdaGPZ/E18t96gfEe9EWm51H0MLjnwbL7PESSQL+RnlKRpneZNI14HyLtLsfZZQhTy/+wjaOAy/sZ9MstAP0Aa7TRB9z4xVS/p8JX/lfjfspGPTkK5L16cX5B+YYadI16f3j0E6sMMUYKddMOfUav8D8rd9BboybZcAAAAASUVORK5CYII=);
    background-position: 50% 1%;
    background-repeat: no-repeat;
}

.network-error .error-box  h1 {
    color: #20c4f4;
    font-size: 16px;
    font-size: 4vw;
    margin: 0;
}

.network-error .error-box:first-child h1 {
    margin-top: 62px;
}

.network-error .error-box  p {
    font-size: 14px;
    font-size: 3.5vw;
    color: #454545;
    margin: 5px 0 0 0;
}
