.padsidestwenty { 
    padding-left: 20px; 
    padding-right: 20px; 
}

pre {
    overflow-x: auto; /* Use horizontal scroller if needed; for Firefox 2, not needed in Firefox 3 */
    white-space: pre-wrap; /* css-3 */
    white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
    white-space: -o-pre-wrap; /* Opera 7 */
    word-wrap: break-word; /* Internet Explorer 5.5+ */
}

px {
    background:yellow;
}

.ui-block-a#x1 {
    width: 45%;
}

.ui-block-b#x1 {
    width: 45%;
    float: right;
    margin-right: 5px;
}

.ui-block-a#x2 {
}

.ui-block-b#x2 {
    float: right;
    margin-right: 5px;
}

.ui-block-a#x3 {
    width: 40%;
    margin-left: 5px;
}

.ui-block-b#x3 {
    width: 40%;
    float: right;
    margin-right: 5px;
}

.cbox_level .ui-checkbox .ui-btn {
    text-align: right;
}

.cbox_level {
    float: right;
    width: 90%;
}

.cbox_level_left {
    width: 90%;
}

.cbox_timer .ui-checkbox .ui-btn {
    text-align: right;
}

.cbox_timer {
    float: right;
    width: 90%;
}

.cbox_timer_left {
    width: 90%;
}

.cbox_switch_left {
    width: 95%;
}

.containing-element .ui-slider-switch {
    width: 80%;
}

.offline-icon {
    background-image: url('../image/offline.png') !important;
    background-repeat: no-repeat;
    background-position: 5px 50%;
}

.online-icon {
    background-image: url('../image/online.png') !important;
    background-repeat: no-repeat;
    background-position: 5px 50%;
}

.ServerOnline {
    color: white;
}

.ServerOffline {
    color: red;
}

.myOffline {
    content: url('../image/offline.png');
}

.pic123 {
    float: left;
    margin: -10px 0 0 -10px;
    width: 80px;
    height: 80px;
    margin-right: 18px;
}

.ui-focus {
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

[data-role="collapsible"] .ui-btn-inner {
    background: transparent !important;
}

[typ='status'] .ui-li-thumb, .ui-li-icon {
    left: 20px;
    max-height: 80px;
    max-width: 80px;
    position: absolute;
    top: 37%;
}

.ui-header .ui-navbar li a:active {
    color: #FFFFFF;
}

.mechanically_active {
    color: #000000 !important;
    background: none !important;
    background-color: red !important;
}

.sensor_added {
    color: #FFFFFF !important;
    font-size: 100% !important;
    background: none !important;
    background-color: red !important;
}

.timer_active {
    color: #000000 !important;
    background: none !important;
    background-color: orange !important;
}

/*
li.timer_active {
    color: #ffffff !important;
    background-color: #4d4d4d !important;
}

li.autoOff_active {
    background-color: #737373 !important;
}

li.server_config {
    background-color: #404040 !important;
}
*/

.slider_autoOff_active .ui-slider .ui-btn-active {
    background-image: linear-gradient(orange, red);
}

.slider_timer_active .ui-slider .ui-btn-active {
    background-image: linear-gradient(orange, orange);
}

.slider_mechanically_active .ui-slider .ui-btn-active {
    background-image: linear-gradient(red, red);
}

.ui-mobile .ui-dialog {
    top: 0px;
    left: 0px !important;
}​

.companyTextColor {
    color: #31B404;
}

.errorTxt {
    color: red;
}

.infoTxt {
    color: white;
}

.warnTxt {
    color: yellow;
}

.raspberry-block {
    /* background-color: lightgray; */
    /* border: 1px solid black; */
    height: 100%;
    font-weight: bold;
    /* text-align: center; */
    /* padding: 40px; */
    padding: 20px;
}

.rasp_err {
    background: #FF3300 !important;
}

.wol .ui-input-text {
    width: 95%;
}

tr {
    border-bottom: 1px solid #d6d6d6;
}

tr:nth-child(even) {
    /* background: #e9e9e9; */
    /* background: #424242; */
}

.ui-select .ui-btn>span:not(.ui-li-count) {
    white-space: normal !important;
}

.disableSelect .ui-select .ui-btn  {
    background: red !important;
}

.standard[name='buttonRelaisTime'].ui-btn {
    height: 10px; 
    margin-top: 3px; 
    border: 1px solid;  
    border-color: #585858 !important;
}

.profile[name='buttonRelaisTime'].ui-btn {
    height: 10px; 
    margin-top: 3px; 
    border: 1px solid;  
    border-color: #00b51a !important;
}

[data-role="content"].content-primary {
    /* Styles */
    height:100%;
    /* width: 100%; */
}

.ui-collapsible-heading-toggle {
    white-space : normal;
}

body .ui-footer .ui-title {
    white-space: normal;
}

.box--responsive {
  width: 85%;
  text-overflow:ellipsis;
  white-space:nowrap;
  overflow:hidden;
}

#timeouts {
 height: 1px;
 background-color: #00b51a;
 width: 100%;
}

#startpageleft .content_height_left {
  height: 20px;
}

.content_height_left {
  height: 80px;
}

.dseries {
  font-weight: normal;
  margin     : 5px;
  font-size  : 9pt;
}

p .mylogging {
  white-space: normal;  
}

.ui-field-contain div.ui-slider-switch, .ui-field-contain.ui-hide-label div.ui-slider-switch {
    width: 100%;
}

@media only screen and (device-width: 768px) {
  /* For general iPad layouts */
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
  /* For portrait layouts only */
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
  /* For landscape layouts only */
}

/* #### Mobile Phones Portrait #### */
@media screen and (max-device-width: 480px) and (orientation: portrait) {
  /* some CSS here */
}

/* #### Mobile Phones Landscape #### */
@media screen and (max-device-width: 640px) and (orientation: landscape) {
  /* some CSS here */
}

/* #### Mobile Phones Portrait or Landscape #### */
@media screen and (max-device-width: 640px) {
  /* some CSS here */
}

/* #### iPhone 4+ Landscape #### */
@media screen and (min-device-width: 320px) and (-webkit-min-device-pixel-ratio: 2) and (orientation:landscape) {
  /* some CSS here */
}

/* #### iPhone 4+ Portrait or Landscape #### */
@media screen and (min-device-width: 320px) and (-webkit-min-device-pixel-ratio: 2) {
  /* some CSS here */
}

/* #### iPhone 5 Portrait or Landscape #### */
@media (device-height: 568px) and (device-width: 320px) and (-webkit-min-device-pixel-ratio: 2) {
  /* some CSS here */
}

/* #### iPhone 6 and 6 plus Portrait or Landscape #### */
@media (min-device-height: 667px) and (min-device-width: 375px) and (-webkit-min-device-pixel-ratio: 3) {
  /* some CSS here */
}

/* #### Tablets Portrait or Landscape #### */
@media screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  /* some CSS here */
}

/* #### Desktops #### */
@media screen and (min-width: 1024px) {
  /* some CSS here */
}
