@import url('https://fonts.googleapis.com/css2?family=Archivo&display=swap');


* {
    z-index: 10;
}



a, 
.ui-widget-content a {
    color: #279c0e;
    text-decoration: underline;
    font-weight: normal;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    font-size: 12px;
} 

a:hover,
.ui-widget-content a:hover {
    text-decoration: none;
}



header {
    position: fixed;
    top: 0;
    width: 100%;
    height: 65px;
    box-shadow: -2px -2px 5px 0 #333;
    background-color: #FFFFFF;/*rgba(255, 255, 255, 0.97);*//*004c56*/
    z-index: 1000;
}

header nav {
    width: 940px;
    margin: 0 auto;
    /*background: silver;*/
    z-index: 1000;
    position: relative;
}

header nav ul {
    float: right;
    z-index: 1000;
}

header nav ul li {
    float: left;
    z-index: 1000;
}

header nav ul li a {
    border-top: 3px solid transparent;
    display: block;
    padding: 23px 0;
    margin-left: 25px;  /* vormals 35px martin 19.2.2020 */
    color: #004c56;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    font-size: 14px;
    text-decoration: none;
}

header nav ul li.active a,
header nav ul li a:hover {
    border-top: 3px solid #279c0e;
    display: block;
    padding: 23px 0;
    margin-left: 25px;  /* vormals 35px martin 19.2.2020 */
    color: #279c0e;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    font-size: 14px;
    text-decoration: none;
}

header nav ul li a#link_password_forgotten {
    padding: 0;
    margin: 0;
    font-size: 11px;
    display: inline;
    margin: 0 0 0 75px;
}

header nav ul li.active a#link_password_forgotten,
header nav ul li a#link_password_forgotten:hover {
    border-top: 0;
    color: #279c0e;
}

header nav ul li#logo {
    float: none;
    position: absolute;
    top: 5px;
    left: 0;
}

header nav ul li#logo a {
    padding: 0;
    margin: 0;
    border: 0;
}

/* ----------------------------------------------------- */


#headline {
    margin-top: 65px;
    background-color: #5f8489;
    /*background-image: url("images/page_title_bg.png");*/
    background-size: auto auto;
    border-bottom: solid 1px #d2d3d4;
    height: 87px;
}


#headline-content {
    width: 940px;
    margin: 0 auto;
    color: white;
}

#headline h1 {
    float: left;
    padding-top: 33px;
    width: 300px;
    font-size: 18px;
    line-height: normal;
    font-weight: normal;
    color: #FFFFFF;
    text-align: left;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/

}

#headline p#countdown {
    float: right;
    text-align:right;
    width: 145px;
    font-size: 10px;    
    line-height: normal;
    font-weight: normal;
    color: #FFFFFF;
    text-align: right;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    padding-top: 10px;
    text-align: center;

}

#headline p#countdown span {
    font-weight: bold;
    display: block;
    font-size: 22px;
}

/* Mitte, zentriert im grauen Balken */
#switchdesign-fake-center {
    width: 300px;
    display: inline-block;
    text-align:center;
    padding-top: 30px;
    font-size: 14px;
    color: #333333;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
}
/* Links unterhalb des Headers (Seiten-Überschrift) */
#switchdesign-fake-left {
    font-size: 14px;
    color: #333333;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/

    position: relative;
    left: -300px;
    top: 58px;
    display: inline;
    text-align:left;
    padding-top: 0px;
}


/* ----------------------------------------------------- */

footer {
    position: fixed;
    width: 100%;
    background: none #09141e;/*#282a2b;*/
    padding: 18px 0;
    text-align: center;
    color: #ffffff;/*#747474;*/
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    font-size: 12px;
    text-shadow: 1px 2px 1px #000;
    bottom: 0;
}

body div#container {
    width: 940px;
    margin: 0 auto 60px auto;
}

body div#container h2 {
    font-size: 13px;
    font-weight: bold;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    line-height: 140%;
    color: #747474;
    margin-top: 15px;
}

body div#container h3 {
    font-size: 13px;
    font-weight: bold;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    line-height: 140%;
    color: #747474;
    margin-top: 15px;
}

body div#container p,
p.popup {
    font-size: 13px;
    font-weight: normal;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    line-height: 140%;
    color: #747474;
    margin-top: 5px;
}

body div#container .textlist {
    margin-top: 5px;
    margin-bottom: 20px;
}

body div#container ul.textlist li {
    font-size: 13px;
    font-weight: normal;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    line-height: 100%;
    color: #747474;
    margin-top: 5px;
    list-style-type: disc;
    margin-left: 30px;
}

body div#container ol.textlist li {
    font-size: 13px;
    font-weight: normal;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    line-height: 100%;
    color: #747474;
    margin-top: 5px;
    list-style-type: decimal;
    margin-left: 30px;
}

#container nav ul li a {
    color: #279c0e;
}

#container nav ul li a:hover,
#container nav ul li.active a {
    color: #279c0e;
    border-top: 3px solid #279c0e;
}

ul#login {
    width: 400px;
    margin: 50px auto;
}

ul#login li {
    margin: 10px auto;
}

ul#login li label {
    display: block;
    width: 195px;
    float: left;
    color: #333;
    font-size: 30px;
    font-weight: normal;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    margin-right: 20px;
    text-align: right;
}

ul#login li input {
    border: 0;
    background-color: rgba(255, 255, 255, 0.97);
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);
    padding: 10px 15px;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    font-size: 12px;
}

ul#login li input:focus {
    box-shadow: 0 0 5px 2px rgba(160, 206, 78, 1);
}

ul#login li input[type="submit"] {
    background: none rgba(160, 206, 78, 1);
    padding: 5px;
    margin-left: 215px;
    color: #fff;
    font-weight: bold;
}

body>div>nav ul li {
    float: left;
}

body>div>nav ul li a {
    border-top: 3px solid transparent;
    display: block;
    padding: 23px 0;
    margin-right: 35px;
    color: #333;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    font-size: 12px;
    text-decoration: none;
}

body>div>nav ul li a:hover {
    color: #279c0e;
}

br {
    clear: both;
}

/* Neu seit 5.12.2019. martin */
div.ordertypes-container {
    border: 0px solid black;
    padding: 0px;
    margin: 0px -1px 0px -1px;
    display: inline-block;
    position: relative;
    height:   520px;
}


ul.ordertypes {
    float: left;
    width: 283px;
    margin: 20px 10px 20px 0;
    padding: 10px 10px 0 10px;
    border-radius: 5px;
    background: none #e3e3e3;
}

ul.ordertypes li {
    float: left;
    margin-bottom: 10px;
}


/*
    Positionierungen, von links oben nach rechts unten (Nicht-KFO somit als Letztes)
    Musste die Positionen auf absolute setzen, da es mit den nach unten verlängerten Boxen ansonsten hakte.
    Dies muss in manchen Fällen jedoch wieder aufgehoben werden, z.B. wenn Zubehör-Formular nicht aktiv ist, siehe Template ordertype_select.php.
    GILT EBENFALLS FÜR FOLGEFORMULARE, siehe confirm.php.
    martin 6.12.2019
	Neuerung 9.8.21 wegen 5-zeiligem Text für Praxisbedarf.
	Von 465 auf 482 px geändert. Hat keine Auswirkungen auf Folgeformulare (wenigstens bisher, da dort Praxisbedarf nie freigegeben, betrifft eh nur Aesthetic Liner)
	Diese Änderung betrifft ebenfalls nicht den Fall, wenn Praxisbedarf gar nicht angezeigt wird.
	Height wird dann in der ordertype_select.php manuell überschrieben.
*/

ul.ordertypes#kfo-classic {
    height:     482px;		/* 465px bis 9.8.21 */
    position:   absolute;
    left:       0px;
    top:        0px;
}

ul.ordertypes#kfo-aesthetic {
    position:   absolute;
    left:       315px;
    top:        0px;
}

ul.ordertypes#praxisbedarf {
    position:   absolute;
    left:       315px;
    top:        310px;
}

ul.ordertypes#nicht-kfo {
    height:     482px;		/* 465px bis 9.8.21 */
    position:   absolute;
    left:       630px;
    top:        0px;
}

/* Für die 5 Zeilen der Praxisbedarf-Beschreibung (alle anderen sind fest auf 4 Zeilen eingestellt. martin 9.8.21 */
ul.ordertypes#praxisbedarf li p {
	height:			92px;
}

/*
ul.folgeformular {
    height:     auto;
    position:   static;
    left:       auto;
    top:        auto;
}
*/


/*
Ohne Important wird es vom "normalen" <h3> überschrieben, bzw. "body div#container h3"
Klappte vorher nur, weil es eine ID und eine Klasse war, ID ist höherwertig.
Scheinbar Mastered-te die ID #container nun alles über den Haufen.
Mir gefällt das mit dem !important überhaupt nicht, aber es klappte im FF, CH und IE.
martin 30.9.2019
https://wiki.selfhtml.org/wiki/CSS/Tutorials/Einstieg/Kaskade
http://blog.gordon-adams.com/html-css/wertigkeit-spezifitaet-von-css-selektoren-klassen-und-ids.html

/* Alte Zeilen bis 30.9.2019
ul.ordertypes li h3 {
    color: #279c0e;
    font-size: 20px;
    margin-top: 0;
}

*/
ul.ordertypes li h3 {
    color: #279c0e !important;
    font-size: 20px !important;
    margin-top: 0 !important;
}

ul.ordertypes li p {
    height: 75px;
}

/*
Wegen den beiden Folgenden musste ich überall ID und Class tauschen, wo #ordertypes angegeben war.
Hatten alle Boxen dieselbe ID, somit ließ sich nicht auf eine bestimmte zugreifen.
Ist Phillip und mir Anfang September schon aufgefallen, aber seine Kurz-Änderung brachte nicht den gewünschten Erfolg.
Haben somit alles Rückgängig gemacht und es dann alleine geradegebogen.
Die zwei hier schieben und zwängen die Aufträge-Box "Verschiedenes" nach oben und bisl zusammen, damit sie Bündig neben KFO-Classic passt.
martin 30.9.2019

http://blog.gordon-adams.com/html-css/wertigkeit-spezifitaet-von-css-selektoren-klassen-und-ids.html

ul.ordertypes#verschiedenes li p {
ul.ordertypes#verschiedenes {
ul.ordertypes#praxisbedarf_zweizeilig_hiermit_auskommentiert li p {


*/
ul.ordertypes#praxisbedarf_auskommentiert li p {
    height:     22px; /* 2-zeiliger Text */
    height:     55px; /* 3-zeiliger Text */
}
ul.ordertypes#praxisbedarf {
    margin-top: -12px;
}




ul.ordertypes li a {
    display: block;
    width: 283px;
    text-align: center;
    color: #747474;
    font-size: 16px;
    text-decoration: none;
    padding: 12px 0 12px 0;
    border-radius: 5px;
    background-color: #fff;
    border-bottom: 3px solid #b5b5b5;
    border-right: 3px solid #b5b5b5;
    font-weight: bold;
}

ul.ordertypes li.error a {
    background-image: url("images/icons/error.png");
    background-repeat: no-repeat;
    background-position: top right;
}

ul.ordertypes li a:hover {
    color: #fff;
    background-color: #279c0e;
}

.ordertypes li.beratungschreibdienst a {
    padding: 20px 0 20px 0;
}

.ordertypes li.aestheticliner a,
.ordertypes li.aestheticliner22 a {
    padding: 5px 0 5px 0;
}

.ordertypes li.aestheticliner a:hover,
.ordertypes li.aestheticliner22 a:hover
 {
    background-color: #bebebe;
    color: #000;
}

.ordertypes li.swissretain3r a {
    padding: 5px 0 4px 0;
}

/* Neu 8.12.21 martin */
.ordertypes li.deinaligner a {
    padding: 5px 0 4px 0;
}
.ordertypes li.retainer a {
    padding: 5px 0 4px 0;
}


.ordertypes li.deinaligner a:hover {
    background-color: #bebebe;
    color: #000;
}
.ordertypes li.retainer a:hover {
    background-color: #bebebe;
    color: #000;
}

/* ... */

.ordertypes li.zubehoer a {
    padding: 20px 0 20px 0;
}


.ordertypes li.swissretain3r a:hover {
    background-color: #bebebe;
    color: #000;
}

.ordertypes li.beratungschreibdienst a:hover {
    background-color: #da9e4e;
}

.ordertypes li.elastokfopositioner a:hover {
    background-color: #e6007e;
}

.ordertypes li.festsitzendeapparaturen a:hover {
    background-color: #009fe3;
}

.ordertypes li.herausnehmbarekfo a:hover {
    background-color: #ffed00;
    color: #000;
}


.ordertypes li.inmanaligner a {
    padding: 16px 0;
}

.ordertypes li.inmanaligner a:hover {
    background-color: #8f8188;
    background-color: #bebebe;
}

.ordertypes li.kissystem a:hover {
    background-color: #007e62;
}

.ordertypes li.medisleep a {
    padding: 4px 0 4px 0;
}

.ordertypes li.medisleep a:hover {
    background-color: #bebebe;
    color: #000;
}

.ordertypes li.knirscherschiene a:hover {
    background-color: #ba624e;
}

.ordertypes li.panthera img{
    width: 80%;
    height: auto;
    background-size: contain;
}
.ordertypes li.panthera a{
    padding: 8px 0;
}
ul#login_small {
    margin-top: 21px;
    display: block;
}

ul#login_small li label {
    font-size: 11px;
    font-weight: normal;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    margin: 0 5px 0 15px;
    color: #747474;
    float: none;
    display: inline;
}

ul#login_small li input {
    border: 1px solid #747474;
    color: #747474;
    font-size: 11px;
    font-weight: normal;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    padding: 2px 3px;
}

ul#login_small li input:focus {
    border: 1px solid #279c0e;
    color: #279c0e;
}

ul#login_small li input#sender {
    border: 1px solid #279c0e;
    background: none #279c0e;
    color: #fff;
    font-weight: bold;
    padding: 1px 1px;
    margin-left: 5px;
}

div#sessionwarning {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 202349874235763458;
    background-color: rgba(0, 0, 0, 0.8);
}

div#sessionwarning h1 {
    color: white;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    font-weight: bold;
    text-align: center;
    margin: 0 auto;
    width: 100%;
    position: absolute;
    top: 40%;
}

div#sessionwarning p {
    text-align: center;
    margin: 0 auto;
    width: 100%;
    position: absolute;
    top: 50%;
}

#privacy_acception_checkbox input[type=submit] {
    border-radius: 4px;
    color: #fff;
    font-weight: bold;
    border: none;
    padding: 5px 10px;
    margin: 0 21px 1px 0;
}

#privacy_acception_checkbox input[type=submit]:hover {
    margin: 1px 20px 0 1px;
}

#privacy_acception_checkbox #sender_off {
    background: none #f23c0f;
}

#privacy_acception_checkbox #sender_on[disabled] {
    background: none #eee;
}

#privacy_acception_checkbox #sender_on {
    background: none #279c0e;
}

input#sender {
    border-radius: 4px;
    color: #fff;
    font-weight: bold;
    border: none;
    padding: 5px 10px;
    margin: 0 21px 1px 0;
    background: none #279c0e;
    float: right;
    cursor: pointer;
}

input#sender:hover {
    margin: 1px 20px 0 1px;
}

input#sender[disabled] {
    background: none #eee;
}

input#parking {
    border-radius: 4px;
    color: #fff;
    font-weight: bold;
    border: none;
    padding: 5px 10px;
    margin: 0 21px 1px 0;
    background: none #0858c0;
    float: right;
    cursor: pointer;
}

input#parking:hover {
    margin: 1px 20px 0 1px;
}

div.welcomebox {
    width: 470px;
    float: left;
    font-weight: normal;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    line-height: 100%;
    color: #747474;
    font-size: 13px;
}

.welcomebox ol li {
    list-style-type: decimal;
    font-size: 13px;
    font-weight: normal;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    line-height: 100%;
    color: #747474;
    margin-bottom: 5px;
}

body div#container div.welcomebox h3 {
    margin-bottom: 10px;
    font-size: 15px;
}

div#welcome_leftbox a {
    border-radius: 4px;
    color: #fff;
    font-weight: bold;
    border: none;
    padding: 6px 10px 5px 10px;
    margin: 20px 21px 1px 0;
    background: none #279c0e;
    cursor: pointer;
    text-decoration: none;
    font-size: 13px;
    clear: both;
    float: none;
}

ul#steps li {
    background: none #e3e3e3;
    font-size: 13px;
    font-weight: normal;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    line-height: 100%;
    color: #747474;
    list-style-position: inside;
    width: 313px;
    float: left;
}

ul#steps li br {
    clear: none;
}

ul#steps li span.bullet {
    display: block;
    float: left;
    padding: 30px 40px 34px 8px;
    font-size: 28px;
    font-weight: bold;
    background: url("images/bullet.png") 0 0 no-repeat transparent;
    color: #fff;
}

ul#steps li span.text {
    display: block;
    margin-top: 10px;
}


/* Neu vom lieben Ma */


#headline div.notices_teaser {
    margin-top: -60px;
    position: absolute;
    left: 200px;
    width: 600px;
    height: 75px;

    border: 0px solid black;
    text-align: center;
    vertical-align:bottom;

    font-size: 10px;
    line-height: normal;
    font-weight: normal;
    color: #333333;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/

}
#headline div.notices_teaser_content {
    display: inline-block;
    top: 5px;
    border: 0px solid black;
    text-align:left;
    width: auto;

}
.notices_teaser_content_header {
    display: block;
    top: 0px;
    font-size: 14px;
    padding-bottom: 5px;

}

div.notices_entry_header {
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    font-size:  20px;

}
div.notices_entry_date {
    font-family:    'Archivo', sans-serif;/*Arial, sans-serif;*/
    font-size:      12px;
    margin-top:     10px;
    margin-bottom:  10px;

}
div.notices_entry_text {
    font-family:    'Archivo', sans-serif;/*Arial, sans-serif;*/
    font-size:      13px;

}


/*
Brauchts um den Anker unter dem Portal-Header hervorzuzaubern (der Menüleiste ganz oben, die fix und stetig präsent ist).
Ansonsten würde der Notice-header nach Klick auf einen Überschrift-Link immer verdeckt sein.
Klappte, nachdem ich den <a name="xx">-Anker rausgeschmissen und dem Div die passende ID gegeben habe.
martin 24.9.2019
https://css-tricks.com/hash-tag-links-padding/
https://wiki.selfhtml.org/wiki/HTML/Tutorials/Links/Gestaltung_mit_CSS#externe_und_interne_Links_kennzeichnen
*/
div.notices_entry_header::before { 
    display: block; 
    content: " "; 
    margin-top: -70px; 
    height: 70px; 
    visibility: hidden; 
    pointer-events: none;
    border: 0px solid green;
}





/*
    Alles für die neue Design-Umstellung (nach April 2020)
    6.4.2020
*/

.headerbox {
    width: 280px;
    display: inline-table;

	border:				2px solid darkgrey;
	background-color:	#eee;
    margin:		10px;
    margin-bottom: 30px;
	
	/* https://www.w3schools.com/CSSref/css3_pr_box-shadow.asp */
    box-shadow:			0 13px 16px rgba(0, 0, 0, 0.5);    
    
    font-size: 13px;
    font-weight: normal;
    font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
    line-height: 140%;
    color: #747474;


}

.headerbox .header {
    font-size: 22px;
    color: black;
    padding: 10px;
}

.headerbox .pic {
    height: 150px;
    border: 0px dotted green;
    padding: 0px;
    margin-bottom: 10px;
}

.headerbox .textlink-link {
    width:          100px;
    /* display:    inline-table; */
    display:        flow-root;
    margin:         5px;
    margin-bottom:      8px;
}

.headerbox .textlink-text {
    width: 150px;
    display:    inline-table;
    margin: 5px;
}
.headerbox .headerpic {
    text-align: center;
    padding: 0px;
    width: 270px;    height: 150px;
    /* width: 250px;    height: 139px; */
    /* width: 270px;    height: 162px; */
    /* width: 250px;    height: 150px; */

    border: 1px solid darkgrey;
    cursor:     pointer;

}
.headerbox .headerlinks {
    font-size:          15px;
}

.headerbox p
{
    margin: 5px;
}


.headerbox .hints {
    font-size:          11px;
    display:            inline;
    color:              #ffffff;
    font-weight:        bold;
    vertical-align:     bottom;
    padding:            2px 4px 2px 4px;
    border-radius:      25px;
    /* xxborder:             2px solid #ff4444; */
    background-color:   #ff4444;
}

.hints-header {
    font-size:          10px;
}


.lock-text {
    width:              700px;
    line-height:        20px;
    display:            inline-block;
    text-align:         center;
    font-family:        'Archivo', sans-serif;/*Arial, sans-serif;*/
    font-size:          15px;
    padding:            5px;
    margin:             10px 0px 0px 0px;
    border-radius:      10px;
    border:             2px solid black;

}
.lock-text-red {
    background-color:   #ec2424;
    color:              #ffffff;
    border-color:       black;
}
.lock-text-black {
    background-color:   #cccccc;
    color:              #000000;
    border-color:       #ff0000;
}



.icon-button {
	width:			26px;
	height:			26px;
	padding:		2px;
    border-radius:	3px;
	border-width:	2px;
	text-align:		center;
	vertical-align:	middle;
	
}
.icon-button-green {
	background-color: #279c0e;/*#029938;*/
}
.icon-button-orange {
	background-color: #fea134;
}
.icon-button-grey {
	background-color: #c6c6c6;
}
.icon-button-white {
	background-color: white;
}
.icon-button > img
{
	width: 18px;
	height: 18px;
}


/*
    Sub-Popups
	Erstmal angedacht für alle "kleinen" Popups mit diversen Auswahlmöglichkeiten.
	Als "große" Popups werden die Navi-Pops angesehen, die bei Klick auf die Menüs oben angezeigt werden.
	Subpops sind erstmal nur aus der Auftragsliste zu öffnen und sollen helfen, Aktionen aus der Liste auszulagern und sie schmaler zu gestalten.
    6.4.2020
*/

.subpop-client {
	color: black;
	font-size: 	15px;
	padding: 3px;
	text-align:		left;
	vertical-align: top;
}
.subpop-client-text {
	color: #888888;
	font-size: 	17px;
	padding: 3px;
	margin-bottom: 10px;
}


.subpop-item {
	border: 1px dashed green;
	color: black;
	font-size: 	12px;
	display: inline-table;
	/* display: inline-table; */
	padding: 3px;
	margin-right: 10px;

	border:				2px solid darkgrey;
	background-color:	#fafafa;

    box-shadow:			5px 13px 6px rgba(0, 0, 0, 0.5);    

}

.subpop-item-header {
	font-weight: bold;
	text-align: center;
	border: 0px solid red;
	padding: 3px;
}
.subpop-item-text {
	border: 0px solid orange;
	width: 150px;
	height: 100px;
	padding: 3px;
}
.subpop-item-pic {
	border: 2px solid black;
	padding: 0px;
	margin: 0px;
	display: flex;
}

/*
	https://www.w3schools.com/cssref/css3_pr_filter.asp
	https://www.w3schools.com/css/css3_images.asp
*/
.subpop-item-pic > img {
	width: 150px;
	height: 112px;
}

.subpop-item-pic > img.inactive {
	filter: grayscale(100%) blur(1.5px) brightness(120%) contrast(70%);
}

.subpop-item-pic > img.active:hover {
	filter: brightness(130%);
}

/* Ab hier dett für das neue Design von MK 21.05.21 */

.subpop-texts {
	display: 		inline-block;
	border:			0px solid black;
	width:			500px;
	vertical-align:	top;

}

.subpop-buttons {
	display: 	inline-block;
	border:		0px solid black;
	width: 		250px;
	text-align: center;
}

.subpop-onebutton {
	border-radius:	4px;
	color:			#fff;
	font-weight:	bold;
	border:			none;
	padding:		5px 10px;
	background:		none #279c0e;/*#66cc66;*/
	cursor:			pointer;
	float:			none;
	width:			200px;
	height:			30px;
	margin-bottom:	6px;
}


.subpop-onebutton[disabled] {
	background:		none #eee;
}

.subpop-table-left {
	font-weight: bold;
	display: inline-block;
	width: 180px;
	min-height: 30px;
	font-size: 18px;
}
.subpop-table-left::after  {content: ":";}

.subpop-table-right {
	display: inline-block;
	width: auto;
	min-height: 30px;
	font-size: 18px;

}


/*
	Soll die Header-Zeile in den Confirm-Boxen hervorheben.
	Hoffe das hat keine Nebenwirkungen auf andere Popup-Arten.
	martin 10.6.21
*/
.dx-popup-title.dx-toolbar {
	background-color: #dddddd;
}


/*
	Dokumenten-Liste - Filter-Buttons über der Liste
	Design nur rudimentär, muss wohl noch angepasst werden.
*/

.document-list-filter {
	display:		inline-block;
	text-align:		center;
	vertical-align: middle;
	border-radius:	4px;
	color:			#fff;
	font-weight:	bold;
	border:			none;
	padding:		7px 10px;
	background:		none #279c0e;
	cursor:			pointer;
	float:			none;
	width:			163px;
	height:			20px;
	margin-bottom:	10px;

}

.document-list-filter-choosen {
	color: black;
}


/*
	Formular Kunden-Neuregistrierung
	Frisch gebaut ab dem 31.1.2022
*/


.newreg_box
{
	margin-bottom: 40px;
}
h2.newreg
{
	font-weight: bold;
	font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
	line-height: 140%;
	color: #747474;
	font-size: 18px !important;
	margin-top: 20px;
	margin-bottom: 20px;
}

.newreg_left
{
	border: 0px solid red;
	display:	table-cell;
	width: auto;
	padding: 20px;
}
.newreg_right
{
	border: 0px solid green;
	display:	table-cell;
	width:		500px;
	padding: 20px;
}

.newreg_input
{
	width: 400px;
	padding: 5px;
	font-size: 15px;

}

.newreg_input.error
{
	border: 2px solid #ee0000;

}
.newreg_form_table
{
	border: 0px solid black;
	display: table;
}
.newreg_form_row
{
	border: 0px solid black;
	display: table-row;
}

/* Die beiden DIV-Boxen um die Elemente */
.newreg_form_label
{
	margin-top: 10px;
	border: 0px solid black;
	xxdisplay: table-cell;
	display: 	block;
	font-size: 15px;
	xxcolor: #000;
	xxfont-weight: bold;	
}
.newreg_form_input
{
	border: 0px solid black;
	xxdisplay: table-cell;
	display: 	block;
}

/* geklaut von: ul#login_small li input#sender */
input.newreg_send
{
    border-radius: 4px;
    color: #fff;
    font-weight: bold;
    border: none;
    padding: 5px 10px;
    margin: 15px 21px 1px 0;
    background: none #279c0e;
    float: right;
    cursor: pointer;
	margin:		40px 0px 0px 90px;
}
.newreg_left,
.newreg_right
{
	font-size: 13px;
	font-weight: normal;
	font-family: 'Archivo', sans-serif;/*Arial, sans-serif;*/
	line-height: 210%;
	color: #747474;
	margin-top: 5px;
}

.newreg_right > ol,
.newreg_right > ul
{
	list-style:auto;
	margin-left: 15px;
	line-height: 18px;
}

.newreg_right > ol > li
{
	margin-bottom: 10px;
}

.newreg_msg_error
{
	display:			block;
	background-color:	#fee;
	border:				2px solid #a00;
	color: 				#a00;
	font-size:			18px;
	padding:			30px;
	text-align:			center;
	margin-bottom:		30px;
	line-height:		1.5em;	
}
.newreg_msg_success
{
	display:			block;
	background-color:	#ccffcc;
	border:				2px solid #009900;
	color: 				#009900;
	font-size:			18px;
	padding:			30px;
	text-align:			center;
	margin-bottom:		50px;
	line-height:		1.5em;	
}


.webview_action {
	display: inline;
	float:left;
	font-size: 20px;
	width: 200px;
	height: 100px;
	margin-left: 20px;
}

/*
	geklaut von: ul#login_small li input#sender
	Den so gestalten, damit er ab jetzt von möglichst vielen Buttons verwendet werden kann.
	martin 1.3.22
*/
input.greenbutton_new
{
    border-radius: 4px;
    color: #fff;
    font-weight: bold;
    border: none;
    padding: 5px 10px;
    margin: 15px 21px 1px 0;
    background: none #279c0e;/*#66cc66;*/
    cursor: pointer;
}
/*jv*/
.iframe_checkbox{
    width: 100%;
    margin-left: 0%;
    padding-left: 0%;
    font-size: 15px;
    font-weight: normal;
    font-family: 'Archivo', sans-serif;
}

/* Klappt nur per important, da fileuploader.css später geladen wird */
.fileuploader-items .fileuploader-item .progress-bar2 .fileuploader-progressbar {
	width: 93% !important;
}

.fileuploader-items .fileuploader-item .progress-bar2 .fileuploader-progressbar .bar
{
	background: rgba(104,159,219,0.3) !important;
}