@media only screen and (max-width: 1279px) {  

/*------------------------------------------------------*/
/*      MOBILE VERSION START                            */
/*------------------------------------------------------*/

/*------------------------------------------------------*/
/*      Login                                           */
/*------------------------------------------------------*/
.bodylogin { margin-top:0;
              margin-left:0;
              margin-right:0;
              margin-bottom:0;
              width:100%;
              height:100%;
              font-size:1em; }
            
.logininput { padding:15px;
              margin:0px 0px 10px 0px;
              border: solid 2px #a0a0a0;
              box-shadow: inset 0 0 0 1px #808080;
              transition:border 0.3s;
              font-size:20px; }     
            
#ID_INT_DV_INFO { text-align:center;
                position: absolute;
                bottom:0;
                left:0;
                right:0;
                height:10%;                    
                vertical-align:middle; }
                                      
#ID_INT_DIV_LOGIN { position: absolute;
                    top:10%;                    
                    height:80%;}
                    
#ID_INT_DIV_LOGO { position: absolute;
                  top:0;
                  left:0;
                  right:0;
                  height:10%;}
                  
.LoginEingabe_button { background:#00519E;
                      height: auto; 
                      color:#fff; }

/*------------------------------------------------------*/
/*      Hauptmenue                                      */
/*------------------------------------------------------*/


#ID_INT_DIV_HM { background-color: #00519E;                 
                 position: fixed;
                 float: top;                          
                 top: 0px;
                 left: 0px;
                 height: 12%;
                 width: 100%;
                 z-index: 99999;
                 margin: 0 auto;
                 border-bottom-left-radius: 20%;
                 border-bottom-right-radius: 20%;
                 -webkit-box-shadow: 0px 5px 3px 0px rgba(0,0,0,0.75);
                 -moz-box-shadow: 0px 5px 3px 0px rgba(0,0,0,0.75);
                 box-shadow: 0px 5px 3px 0px rgba(0,0,0,0.75); }

#ID_INT_DIV_HM_LOGO { position: absolute;
                      left: 10px;
                      top: 10px;
                      height: 10vh;
                      width: 20vh; }
/*
#ID_INT_DIV_HM_BUTTON { position: absolute;
                        top: 10px;
                        left: 35vw;
                        right: 35vw;
                        height: 7vh;
                        width: 30vw;
                        text-align: center;
                        background-color: #00519E; }
*/
#ID_INT_DIV_HM_UM { position: absolute;
                    top: 10px;
                    right: 10px;
                    height: 7vh;
                    width: 11vh;
                    text-align: center; }

/*------------------------------------------------------*/
/*      Anzeige                                         */
/*------------------------------------------------------*/

.ui-icon-myicon:after { background-image: url("/cptsale30A/sys/image/btn_tab_untermenue.png");
                        background-size: 18px 18px; }

.kd_info_ueberschrift1 {
    font-family: 'Arial';
    font-size: 1.6em;
    line-height: 100%;
    margin: 0px;
    padding: 0px;
}

.kd_info_ueberschrift2 {
    font-family: 'Arial';
    font-size: 1.4em;
    line-height: 100%;
    margin: 0px;
    padding: 0px;
}

.kd_info_ueberschrift3 {
    font-family: 'Arial';
    font-size: 1.2em;
    line-height: 100%;
    margin: 0px;
    padding: 0px;
}

.kd_info_ueberschrift4 {
    font-family: 'Arial';
    font-size: 1em;
    line-height: 100%;
    margin: 0px;
    padding: 0px;
}

.kd_info_ueberschrift5 {
    font-family: 'Arial';
    font-size: 0.8em;
    line-height: 100%;
    margin: 0px;
    padding: 0px;
}

.kd_info_ueberschrift1b {
    font-family: 'Arial';
    font-size: 1.6em;
    font-weight: bold;
    line-height: 100%;
    margin: 0px;
    padding: 0px;
}

.kd_info_ueberschrift2b {
    font-family: 'Arial';
    font-size: 1.4em;
    font-weight: bold;
    line-height: 100%;
    margin: 0px;
    padding: 0px;
}

.kd_info_ueberschrift3b {
    font-family: 'Arial';
    font-size: 1.2em;
    font-weight: bold;
    line-height: 100%;
    margin: 0px;
    padding: 0px;
}

.kd_info_ueberschrift4b {
    font-family: 'Arial';
    font-size: 1em;
    font-weight: bold;
    line-height: 100%;
    margin: 0px;
    padding: 0px;
}

.kd_info_ueberschrift5b{
    font-family: 'Arial';
    font-size: 0.8em;
    font-weight: bold;
    line-height: 100%;
    margin: 0px;
    padding: 0px;
}


/*------------------------------------------------------*/
/*      Verzweigung                                     */
/*------------------------------------------------------*/
#ID_INT_DIV_VZG   { background-color: #00519E;
                    position: fixed;                    
                    height: 95%;
                    width: 70%;                          
                    bottom: 0%;
                    right: 0%;
                    text-align: center;
                    overflow: auto;
                    border-radius: 5px 0px 0px 5px;                    
                    -webkit-box-shadow: -3px -3px 6px 0px rgba(0,0,0,0.75);
                    -moz-box-shadow: -3px -3px 6px 0px rgba(0,0,0,0.75);
                    box-shadow: -3px -3px 6px 0px rgba(0,0,0,0.75); }
                    
#ID_INT_divEmpfaenger { position: fixed;
                        top:0;
                        left:0;
                        height: 100%;
                        width: 100%;
                        z-index: 1; }
/*------------------------------------------------------*/
/*      Frames                                          */
/*------------------------------------------------------*/
.menueFrame             { background-color: #00519E;
                          position: fixed;                          
                          top: 15%;
                          bottom:13%;
                          left: 5%;
                          right: 5%;
                          height: 72%;
                          width: 90%;
                          border: 0;
                          overflow: auto;                                                    
                          -webkit-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.75);
                          -moz-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.75);
                          box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.75);
                          border-radius: 10px 10px 10px 10px;
                          -moz-border-radius: 10px 10px 10px 10px;
                          -webkit-border-radius: 10px 10px 10px 10px; }
/*                          
#ID_INT_IFRAME_ANZEIGE { border:0;
                         height: 100%;
                         width: 100%;
                         overflow: auto; }
*/


@media ( min-width: 1em ) {
	/* Show the table header rows and set all cells to display: table-cell */
	.ui-responsive1em td,
	.ui-responsive1em th,
	.ui-responsive1em tbody th,
	.ui-responsive1em tbody td,
	.ui-responsive1em thead td,
	.ui-responsive1em thead th {
		display: table-cell;
		margin: 0;
	}
	/* Hide the labels in each cell */
	.ui-responsive1em td .ui-table-cell-label,
	.ui-responsive1em th .ui-table-cell-label {
		display: none;
	}
}    
                          
                          
                           
/*------------------------------------------------------*/
/*      Buttons                                         */
/*------------------------------------------------------*/ 
.btnHauptmenue          { background-color: #00519E;
                          position: absolute;
                          border: 0;
                          top: 0%;
                          left: 15%;
                          height: 100%;  
                          width: 70%;
                          text-align: center;   
                          font-size: 4vh; }
                          
.btnHauptmenue:active { background-color: #074590;
                        border-radius: 173px 173px 173px 173px;
                       -moz-border-radius: 173px 173px 173px 173px;
                       -webkit-border-radius: 173px 173px 173px 173px;
                        border: 0px solid #000000; }                          


.btnVerzweige           { background-color: #00519E;
                          position: absolute;
                          border: 0;
                          left: 15%;
                          top: 30%;
                          width: 70%;
                          height: 70%;
                          text-align: center; }
                          
.btnFKT { background-color: #00519E;
          position: absolute;
          border: 0;
          top: 0%;
          right: 15%;
          height: 100%;  
          width: 70%; }
  
.btnFKT:active { background-color: #074590;
                 border-radius: 173px 173px 173px 173px;
                -moz-border-radius: 173px 173px 173px 173px;
                -webkit-border-radius: 173px 173px 173px 173px;
                 border: 0px solid #000000; }
              
.btnohnerahmen { border: 0;}
         
/*------------------------------------------------------*/
/*      Listen                                          */
/*------------------------------------------------------*/

nav,                     
  nav ul,
  nav li {   
    list-style: none; 
    margin: 0; 
    padding: 0.8;
    border: 0;
  }
  nav ul {
    margin-left: auto;
    margin-right: auto;    
    width: 90%;
    padding: 0.8em;
    border: 0px;
    background-color: transparent;
  }
  nav li {
    text-align: center;
    margin-left: auto;
    margin-right: auto;         
    display: block;
    margin-bottom: 0.6em;
    margin-top: 0.6em;
    padding: 0.6em;
    text-decoration: none;
    font-weight: bold;    
    border-radius: 10px;    
    background: #074590;
    color: white;
  }
  
  nav a {
    text-align: center;
    text-decoration: none; 
    font-weight: bold;
    font-size: 3.5vh;
    color: white;
  }
  
  nav a:focus,
  nav a:hover,
  nav a:active {    
    color: #222;
  }


.selectvzg {
  /*width: 70px;*/
}
.selectvzgbtn {
  /*width: 20px;*/
}
/*------------------------------------------------------*/
/*      MOBILE VERSION ENDE                             */
/*------------------------------------------------------*/

.MeldungErfolg          {font-family:'Arial';
                         font-size:12px;
                         font-weight:bold;
                         color:green !important;
                         background-color:#FFFFFF;
                         text-align:center;
                         padding-left:5px;
						 padding-top:0px;
						 padding-bottom:10px;}

.MeldungFehler          {font-family:'Arial';
                         font-size:12px;
                         font-weight:bold;
                         color:red !important;
                         background-color:#FFFFFF;
                         text-align:center !important;
                         padding-left:5px;
						 padding-top:0px;
						 padding-bottom:10px;}

.MeldungInfo            {font-family:'Arial';
                         font-size:12px;
                         font-weight:bold;
                         color:black !important;
                         background-color:#FFFFFF;
                         text-align:center !important;
                         padding-left:5px;
						 padding-top:0px;
						 padding-bottom:10px;}

    .MobilInaktiv { display:none; }
    .MobilAktiv { display:block; }
    .Mobil_HM_BTN { display:block; }                    
    .Mobil_HM_ICON { display:block; }   
    .HM_BTN { display:none; }              
    .HM_ICON { display:none; }   
    
/*    input[type=text] { height:30px; } */
    input.menge:focus {background:#80FF80;}
    .LoginBox			{ width:80%;	}
    
    #ID_INT_benutzer_id,
    #ID_INT_kennwort_id {	background:#D9D9D9;border:1px solid #666666;
                            -webkit-border-radius: 5px 5px 5px 5px;
                            -moz-border-radius: 5px 5px 5px 5px;
                            border-radius: 5px 5px 5px 5px;
                            padding-left:3px;
                            font-size:14px;height:18px;max-width:80%;}
    
    #ID_INT_BODY,
    #ID_INT_BODY_ZENTRALE { overflow:hidden; }     
    
  /*#ID_INT_DIV_Bauch table { max-width:99.9%;    }*/
    
        
/*------------------------------------------------------*/
/*  Wird im Block für die Mobile Version angesprochen   */
/*------------------------------------------------------*/

    #ID_INT_DIV_HM { height:100%;width:100%;
                    padding:0;margin:0;z-index:9999; 
                    border-bottom:2px solid #00519E;
                    padding-top:10px;
                   }        

    #ID_INT_DIV_HMLogo { display:none; }

    #ID_INT_DIV_HM_BUTTON { height:40px;width:100%;
                           background:#00519E; text-align:center;
                           font-size:24px;font-weight:bold;color:#fff;
                           cursor:pointer;padding-top:16px;
                           position:fixed;z-index:9999;
                    
                           }
    
    #ID_INT_DIV_HM_BUTTON span { padding-left:5px;}
    #ID_INT_DIV_HM_BUTTON img { margin-right:5px;}

    #ID_INT_DIV_BENUTZERANZEIGE { padding-top:40px;padding-left:20px;color:#00519E;font-size:14px; }
    
    div#ID_INT_DIV_Menue ul { padding:10px;font-size:14px; }
    div#ID_INT_DIV_Menue ul ul,
    div#ID_INT_DIV_Menue ul ul li    { padding:10px;padding-left:20px;font-size:14px; }
    
    
    #ID_INT_DIV_TABS	{ width:100%;height:98%;overflow:hidden; padding-top:55px;margin:0px;	}
    
    #ID_INT_DIV_TABS.BereichAnzeige { width:96%;height:auto;
                                      padding-left:2%;padding-right:2%;
                                    }
    
    #ID_INT_DIV_TABS iframe { width:100%; height:94%; }
    
    /*
    #ID_INT_DIV_UM { position:fixed;right:0;top:0;z-index:initial;
                    height:100%;padding:0;margin:0;
                    display:block;background:#fff;
                    border-top:1px solid grey;border-bottom:1px solid grey;
                    opacity:0.95;
                    -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=0.95)';
                    }*/
    /*
    #ID_INT_DIV_AufZu { height:100%;width:20px;padding:0;margin:0;
                        float:left;vertical-align:middle;
                        text-align:center;background:#fff; }
    
    #ID_INT_BTN_AufZu { height:100%;width:20px;padding:0;margin:0;  
                       border:1px solid grey;font-weight:bold;font-size:34px;
                       text-align:center;    
                       }
    
    .UM_ZU { width:20px; }
    .UM_AUF { width:222px; }*/
    
    
    #ID_INT_DIV_UM_AKTIV { border-bottom:1px solid #00519E;z-index:9950; }
    #ID_INT_DIV_UM_AKTIV iframe { width:242px; }
    
    
    #ID_INT_DIV_BLOCKIEREN,
    #ID_INT_DIV_WARTEANZEIGE { position:fixed; }
    
    #ID_INT_DIV_BTNLST { width:100%;height:auto;padding:0;margin:0;background:#fff;float:left;padding-top:10px;padding-bottom:10px; }
    #ID_INT_DIV_BTNLST div{ padding:0;height:auto; }
    #ID_INT_DIV_BTNLST select { height:40px; }

    #ID_INT_DIV_BTNLST_ICONS { width:auto;height:40px;float:left;padding:0;margin:0;text-align:left;vertical-align:middle;}
    #ID_INT_DIV_BTNLST_SEITENANGABEN { width:auto;height:40px;float:right;padding:0;margin:0;vertical-align:middle;}
    #ID_INT_DIV_BTNLST_VERZWEIGEN { width:100%;height:40px;float:left;padding:0;margin:0;margin-top:2px;margin-bottom:2px;text-align:right;vertical-align:middle;}
    #ID_INT_DIV_BTNLST_VERZWEIGEN select { float:left;max-width:80%;vertical-align:middle; }
    #ID_INT_DIV_BTNLST_VERZWEIGEN button {float:right;vertical-align:middle; }
    
    span#ID_INT_FILTERBUTTON { margin-top:5px; }
    
    div#ID_INT_DIV_FilterFunktionen	{	background:#FFF;padding:5px;
                                        height:40px;border:1px solid #666;}
    
    div#ID_INT_DIV_FILTER { width:96%;min-width:96%; }
    
    #ID_INT_DIV_FILTER #ID_INT_DIV_TABS { margin-top:5px; }
    
    #ID_INT_DIV_FILTER #ID_INT_DIV_TABS li.TabAktiv,
    #ID_INT_DIV_FILTER #ID_INT_DIV_TABS li.TabInaktiv { min-width:100px;max-width:100px; }
    
    span#ID_Ueberschrift  { color:#00519E;
                          font-size:24px;
                          font-weight:bold;
                          vertical-align:middle;
                          padding-left:5px;
                         }
    #ID_INT_DIV_Artikeldetaildaten td { vertical-align:top; }
    
    #ID_INT_DIV_Artikeldetaildaten { padding-left:5px;width:98%;height:auto; }
    #ID_INT_DIV_Artikelbeschreibung { padding-left:0; }
    #ID_INT_DIV_Artikeldetaildaten #ID_INT_DIV_TABS li.TabAktiv,
    #ID_INT_DIV_Artikeldetaildaten #ID_INT_DIV_TABS li.TabInaktiv { min-width:100px;max-width:30%; }
    
    #ID_INT_DIV_Artikeldetaildaten #ID_INT_DIV_TABS div.rahmen	{	width:95%;
                                                                height:auto;
                                                                padding:5px;
                                                                padding-top:15px;
                                                                padding-left:10px;
                                                                padding-right:10px;}
    
    div.Kachel,
    div.KachelOK,
    div.KachelFehler    { width:46%; }
    
    button { margin:0; }
    
    .SBStandard {   width:40px;
                    height:40px;
					cursor:pointer;
					background-color:#F2F3F8;
                    /*background-size:30px 30px;*/
                    background-repeat:no-repeat;
                    background-position:center center;
					vertical-align:middle;
                    }
/* Für App rausgenommen, 04.03.2021, VW    
    #ID_INT_Zurueck.SBStandard,
    #ID_INT_Zeigen.SBStandard,
    #ID_INT_Neu.SBStandard,
    #ID_INT_Aendern.SBStandard,
    #ID_INT_Speichern.SBStandard,
    #ID_INT_SpeichernUndSchliessen.SBStandard,
    #ID_INT_Loeschen.SBStandard,
    #ID_INT_Drucken.SBStandard,
    #ID_INT_Rueckwaerts.SBStandard,
    #ID_INT_Aktualisieren.SBStandard,
    #ID_INT_Vorwaerts.SBStandard,
    #ID_INT_Verzweige.SBStandard,
    #ID_INT_FilterAnwenden.SBStandard,
    #ID_INT_Schliessen.SBStandard,
    #ID_INT_Kalender.SBStandard	 {width:48px;
                             height:30px; 
                             background-color:transparent;
                             background-repeat:no-repeat;
                             background-position:center center;
                             border:1px solid #00519E;
                             cursor:pointer;
                             -webkit-border-radius: 3px;
                             -moz-border-radius: 3px;
                             border-radius: 3px;
                             filter: progid:DXImageTransform.Microsoft.gradient(
                                startColorstr=#00FFFF, endColorstr=#00FFFF
                            );
                             }	
    #ID_INT_Rueckwaerts.SBStandard { margin-right:2px; }
    #ID_INT_Vorwaerts.SBStandard { margin-left:2px; }
*/                             
    .HGGeradeZeile,
    .HGGeradeZeile td,
    .HGUngeradeZeile,
    .HGUngeradeZeile td,
    .HGSelektierteZeile,
    .HGSelektierteZeile td { min-height:100px; }
    
/*------------------------------------------------------*/
/*  aus formate.css für O.einkaufsliste                 */
/*------------------------------------------------------*/   
    
th.HGUeberschrift       { padding-top:0px;padding-bottom:5px;}

.HGUeberschrift         {background-color:#00519E;color:#fff;border:none;height:10px;
                        font-size:12px;}
                        
/*------------------------------------------------------*/
/* Um Zeilen wechselweise mit einem Hintergrund zu bel. */
/* FFF2D3                  gerade = FFE19C              */
/*------------------------------------------------------*/

.HGGeradeZeile        {background-color:#F2F3F8;max-height:80px;}
.HGGeradeZeile td	{border:1px solid #F2F3F8;font-size:12px;word-wrap:normal;
							/*word-break:break-all;*/}

.HGUngeradeZeile 		{background-color:#FFF/*#D9D9D9*/;max-height:80px;}
.HGUngeradeZeile td		{border:1px solid #FFF;font-size:12px;word-wrap:normal;  }
.HGSelektierteZeile 		{background-color:#80FF80;max-height:80px;}
.HGSelektierteZeile td	{border:1px solid #80FF80;font-size:12px;word-wrap:normal;}                          
    
}

@media all and (orientation:portrait) {
.loginDIV {  position:absolute;
          height:60%;
          width:100%;
          top:0%;
          left:0%;                
          text-align:center;}
         
.loginDIVIMG { position:fixed;            
            height:40%;
            width: 100%;                        
            bottom:0;
            left:0;     
            text-align:center;}
.loginIMG { border: none;
            height: 70%;
            margin-left: auto;
            margin-right: auto;
            vertical-align:middle;}
            
.fontsize1 {font-size: 4vw;}
.buttonsize {height:7vw;
            width:7vw;}
                       
}
@media all and (orientation:landscape) {            
.loginDIV {  position:absolute;
              height:100%;
              width:50%;
              top:0%;
              right:0%;              
              text-align:center;}
         
.loginDIVIMG { position:fixed;            
                height: 100%;
                width: 50%;                        
                top:0%;
                left:0%;  
                text-align:center;}
                 
.loginIMG { border: none;
            height: 50%;
            margin-left: auto;
            margin-right: auto;
            vertical-align:middle;}   
            
.fontsize1 {font-size: 5vh;}
.buttonsize {height:8vh;
            width:8vh;}
                                       
}

@media only screen and (max-width: 399px) {  
    
    #ID_INT_REITER_PLUS { display:none; }
    div#ID_INT_DIV_FILTER { width:96%;min-width:96%; }
    
}