/* ################################################################################### RoyalArt(R) Newslettersystem Entwicklungsstand: 15.05.2025 Version 5.16 RoyalArt - Agentur fuer Softwaregestaltung https://www.newslettersystem.com https://www.royalart.de https://www.shopsoftware.com https://www.chat-software.eu (c) Copyright by Dipl. Des. (FH) Sven Scholz - RoyalArt Agentur Copyrightvermerke duerfen NICHT entfernt werden! ------------------------------------------------------------------------ Bei Verstoss gegen die Lizenzbedingungen kann die Lizenz jederzeit entzogen werden. Der Kaufpreises wird nicht erstattet. Wer gegen die Lizenzbedingungen verstoesst, muss mit einer Vertragsstrafe von 50.000 Euro je Einzeldelikt rechnen! ------------------------------------------------------------------------ Dieses Programm ist eine Software von Dipl. Des. (FH) Sven Scholz, RoyalArt Agentur. Diese Software darf nicht veroeffentlicht, weitergeben und/oder modifizieren werden. Es gelten die Ihnen mitgeteilten Lizenzbestimmungen. Diese Software/Website ist eine Einzellizenz und fuer den Betrieb auf einem Speicherplatz (Webspace) berechtigt. Die Veroeffentlichung dieses Programms erfolgt OHNE IRGENDEINE GARANTIE, sogar ohne die implizite Garantie der MARKTREIFE oder der VERWENDBARKEIT FUER EINEN BESTIMMTEN ZWECK. ################################################################################## Copyrightvermerke duerfen NICHT entfernt werden! */ /* raleway-300 - latin_latin-ext */ @font-face { font-family: 'Raleway'; font-style: normal; font-weight: 300; src: url('../webfonts/raleway-v12-latin_latin-ext-300.eot'); /* IE9 Compat Modes */ src: local('Raleway Light'), local('Raleway-Light'), url('../webfonts/raleway-v12-latin_latin-ext-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../webfonts/raleway-v12-latin_latin-ext-300.woff2') format('woff2'), /* Super Modern Browsers */ url('../webfonts/raleway-v12-latin_latin-ext-300.woff') format('woff'), /* Modern Browsers */ url('../webfonts/raleway-v12-latin_latin-ext-300.ttf') format('truetype'), /* Safari, Android, iOS */ url('../webfonts/raleway-v12-latin_latin-ext-300.svg#Raleway') format('svg'); /* Legacy iOS */ } * { margin:0; padding:0; border:0; font-family:Raleway, arial, sans-serif; font-size:17px; } .title { font-family:"Times New Roman", serif; font-size:25px; font-weight:600; font-style:italic; } a { width: 100%; height:auto; position: relative; display: inline-block;text-decoration:none; } .ib { display:inline-block; position:relative; vertical-align:top; } .clear { clear:both; } img { vertical-align:top; } body { display:block !important; } :root { --line-heightPC : 35px; --line-heightPC-style : 35px; --font-sizePC : 21px; --font-sizePC-list : 19px; } /* ********** Farben *********************************************** */ a { color:#888888; } .title { color:#444444; } .color_blue { color:#006198; } .button_red, .button_green, .button_grey { color:#555555; } #menu li.menu_item:hover { color:#ffffff; } #menu li.menu_item:hover a { color:#ffffff; } #menu li.menu_item.active, #menu li.menu_item.active a { color:#ffffff; } #menu li.menu_item { color:#333333; } #menu li.menu_item a { color:#575252; } #menu .menu_sub li { color: #333333; } #menu .menu_sub li a { color:#333333 !important; } #menu .menu_sub li a { background-color:#ffffff !important; } #menu .logout a { color:#333333; } #home, #kunden { color:#555555 } #title { background-color:#eeeeee; } #menu { background-color:#f1f1f1; } #menu li.menu_item.active, #menu li.menu_item.active a { background-color:#006198; } #menu li.menu_item:hover { background-color:#006198; } #menu ul.menu_sub { background-color:#ffffff; } #menu .menu_sub li { background-color:#ffffff; } #menu li.menu_subitem.active a { background-color:#f3f3f3 !important; } #menu .menu_subitem a:hover { background-color:#e8e8e8 !important; } #menu .menu_sub li { background-color:#ffffff; } .msg_error { color:#ee0000; font-weight:900; } .msg_warning { color:orange; font-weight:900; } .msg_ok { color:green; font-weight:900; } /** GRAPHS **/ #graphs .graphs_all {background-color: #f5f5f5; } #graphs .graphs_title {background-color: #f5f5f5; } .w100 { width:100px; } .w120 { width:120px; } .w200 { width:200px; } .w400 { width:400px; } #feedback { min-width:940px; display:none; height:32px; line-height:32px; text-align:center; } .pointer { cursor:pointer; } .button_red, .button_green, .button_grey { width:90px; height:22px; line-height:22px; text-align:center; font-size: 11px; font-weight: bold; } .button_red { background-image:url(../img/buttons.png); background-position:0 0; cursor: pointer; } .button_green { background-image:url(../img/buttons.png); background-position:0 22px; cursor: pointer; } .button_grey { background-image:url(../img/buttons.png); background-position:0 48px; cursor: pointer; } input[type="text"], input[type="password"], textarea { height:32px; display:inline-block; vertical-align:top; border:1px solid #cccccc; padding:0 10px; border-radius:3px; box-shadow: inset 1px 2px 4px 1px rgba(0, 0, 0, 0.10); box-sizing:border-box; cursor:pointer; } input[type="text"]:hover, input[type="password"]:hover, textare:hover { box-shadow: inset 1px 2px 4px 1px rgba(0, 0, 0, 0.15); } input[type="checkbox"] { opacity:0; cursor:pointer; width:19px; height:19px; display:inline-block; position:relative; top:3px; margin-right:3px; } input[type="checkbox"] + span.checkbox { vertical-align:top; display:inline-block; position:relative; top:3px; margin-right:3px; } input[type="checkbox"] + span.checkbox:before { width: 17px; height: 17px; border: 1px solid #cccccc; background-color: #ffffff; display:inline-block; margin-left:-19px; content:''; pointer-events:none; box-shadow: inset 1px 2px 4px 1px rgba(0, 0, 0, 0.10); } input[type="checkbox"] + span.checkbox:before:hover { border-color:#888888; box-shadow: inset 1px 2px 4px 1px rgba(0, 0, 0, 0.15 ); } input[type="checkbox"]:checked + span.checkbox:after { content: '\2714'; color:#333333; font-size:20px; font-weight:900; position:absolute; margin-top:-3px; margin-left:-18px; pointer-events:none; } span.checksim { width:20px; height:20px; border:1px solid #cccccc; margin-right:3px; margin-top:3px; cursor:pointer; box-shadow: inset 1px 2px 4px 1px rgba(0, 0, 0, 0.10); } span.checksim:hover { border-color:#a0a0a0; box-shadow: inset 1px 2px 4px 1px rgba(0, 0, 0, 0.15);} span.checksim.active:after { content: '\2714'; color:#333333; font-size:23px; font-weight:900; position:absolute; margin-top:-4px; margin-left:0; pointer-events:none; } span.checksim.preactive:after { content: '\2714'; color:#cccccc; font-size:23px; font-weight:900; position:absolute; margin-top:-4px; margin-left:0; pointer-events:none; } span.checksim.postactive:after { content: '\2714'; color:#cc0000; font-size:23px; font-weight:900; position:absolute; margin-top:-4px; margin-left:0; pointer-events:none; } span.select_wrapper { display: inline-block; position:absolute; left:0; right:0; top:0; height:30px; border:1px solid #cccccc; padding:0; background-color:#ffffff; } span.select_wrapper:hover { border-color: #a0a0a0; } span.selectbox { display:inline-block; line-height:30px; position:absolute; left:0; right:0; height:32px; } span.selectbox:before { content:''; right:0; top:0px; width:20px; height:30px; background:#ffffff; position:absolute; pointer-events:none; display:block; } span.selectbox:after { content:'▼'; font:16px "Consolas", monospace; color:#888888; right:10px; top:5px; padding:0 0 0 4px; border-left:1px solid #888888; position:absolute; pointer-events:none; } span.selectbox select { height:30px; border:0; cursor:pointer; width:100%; } @media screen and (-webkit-min-device-pixel-ratio: 0) { /* Safari and Chrome */ /* Safari only override */ ::i-block-chrome, span.selectbox:before { -webkit-appearance: none; height:28px; top:2px; } ::i-block-chrome, span.selectbox select { -webkit-appearance: none; } } span.selectbox option { padding: 0 5px; } .abstand15 { position:relative; height:15px; clear:both; } .abstand30 { position:relative; height:30px; clear:both; } .abstand38 { position:relative; height:38px; clear:both; } .abstand40 { position:relative; height:40px; clear:both; } /* ******************** Login ************************ */ .login_body { position:absolute; top:50%; margin-top:-150px; width:100%; max-width:100%; } .login_wrapper { position:relative; margin:auto; width:470px; max-width:100%; padding:0 10px; box-sizing:border-box; } .login_wrapper input[type="text"], .login_wrapper input[type="password"] { display:inline-block; vertical-align:top; width:calc(100% - 2px); height:48px; border:1px solid #cccccc; padding:0 10px; box-sizing:border-box; } .login_logo { position:relative; width:450px; max-width:100%; height:150px; background-image:url(../img/logo.png); background-position: center; background-size: 100%; background-repeat:no-repeat; } .login_input { position:relative; margin-top:10px; width:450px; max-width:100%; height:50px; white-space: nowrap; } .login_name { width:48.5%; margin-right:3%; } .login_pass { width:48.5%;} .login_ok { position:relative; width:100%; height:50px; line-height:50px; text-align:center; margin-top:20px; color:#ffffff; background-color:#000000; cursor:pointer;} .login_err { position: absolute; top: -33px; text-align: center; left: 0; right: 0; color:#cc0000; border: 1px solid red; padding: 5px 0; } .site_wrapper {} .site_wrapper .input_2 { width:50%; float:left; margin-top:5px; line-height:32px; } .site_wrapper .input_2.left { padding-right: 10px; } .site_wrapper .input_2.right { padding-left: 10px; } .site_wrapper label {width:100%; } #config input[type="text"], .site_wrapper input[type="password"] { width:100%; } /* ******************** Menü ************************ */ #title { position:relative; text-align:center; padding:12px 25px; } #title .element_wrapper { width:100%; max-width:100%; text-align:right; height:50px; display:block; } #title .logo { width:500px; height:50px; background-image:url(../img/logo_admin.png); background-repeat:no-repeat; background-position:center ; background-size:contain; display:block; position:absolute; margin: 0 auto } #menu { position:relative; text-align:center; height:60px; padding:0 25px; box-shadow:0 7px 7px -3px #a0a0a0; z-index:20; } #menu .element_wrapper { width:100%; max-width:100%; } #menu li.menu_item { cursor:pointer; } #menu a { cursor:pointer; } #menu ul.menu_main { position:absolute; top:0; left:0; } #menu li.menu_item { display:inline-block; position:relative; width:120px; height:60px; line-height:60px; text-align:center; } #menu li.menu_item a { font-size:20px; } #menu li.menu_item span { font-size:20px; } #menu ul.menu_sub { position:absolute; top:60px; left:0; height:0; overflow:hidden; transition:all, 0.5s; opacity:0; z-index:10; } #menu li.menu_item:hover ul.menu_sub { height:auto; opacity:1; transition:all, 0.5s; box-shadow:2px 2px 5px 1px #666666; } #menu .menu_sub li { width:260px; height:32px; line-height:32px; text-align:left; z-index:20; } #menu .menu_sub li a { font-size:14px; padding-left:10px; height:32px; width:100%; box-sizing:border-box; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } #menu .logout { position:absolute; right:20px; top:0; height:60px; line-height:60px; width:120px} #menu .logout .text{ font-size:20px; padding:0 10px; } /* Menu icons */ .menu_icon_logout { width:25px; display:flex; align-items: center; justify-content: center; margin:0 auto; background-image:url(../img/icon_logout.png); background-repeat: no-repeat; background-position: center; background-size: 25px 25px;} .menu_icon_home { width:25px; display:flex; align-items: center; justify-content: center; margin:0 auto; background-image:url(../img/icon_home_ovr.png); background-image:url(../img/icon_home.png); background-repeat: no-repeat; background-position: center; background-size: 25px 25px;} .menu_icon_home:hover { background-image:url(../img/icon_home_ovr.png); background-repeat: no-repeat; background-position: center; background-size: 25px 25px;} .menu_icon_home_active { width:25px; display:flex; align-items: center; justify-content: center; margin:0 auto; background-image:url(../img/icon_home_ovr.png); background-repeat: no-repeat; background-position: center; background-size: 25px 25px;} .menu_icon_kunden { width:25px; display:flex; align-items: center; justify-content: center; margin:0 auto; background-image:url(../img/icon_kunden_ovr.png); background-image:url(../img/icon_kunden.png); background-repeat: no-repeat; background-position: center; background-size: 25px 25px;} .menu_icon_kunden:hover { background-image:url(../img/icon_kunden_ovr.png); background-repeat: no-repeat; background-position: center; background-size: 25px 25px;} .menu_icon_kunden_active { width:25px; display:flex; align-items: center; justify-content: center; margin:0 auto; background-image:url(../img/icon_kunden_ovr.png); background-repeat: no-repeat; background-position: center; background-size: 25px 25px;} .menu_icon_style1 {width: 25px;} .menu_icon_style1_active {width: 25px;} .menu_icon_style2 {width: 25px;} .menu_icon_style2_active{width: 25px;} .menu_icon_config_page { width:25px; display:flex; align-items: center; justify-content: center; margin:0 auto; background-image:url(../img/btn_einstellungen_ovr.png); background-image:url(../img/btn_einstellungen.png); background-repeat: no-repeat; background-position: center; background-size: 25px 25px;} .menu_icon_config_page:hover { background-image:url(../img/btn_einstellungen_ovr.png); background-repeat: no-repeat; background-position: center; background-size: 25px 25px;} .menu_icon_config_page_active { width:25px; display:flex; align-items: center; justify-content: center; margin:0 auto; background-image:url(../img/btn_einstellungen_ovr.png); background-repeat: no-repeat; background-position: center; background-size: 25px 25px;} /* hide icons */ #menu li.menu_item .icon, .logout .icon { display:none} #menu li.menu_item .menu_icon_config_page, #menu li.menu_item .menu_icon_config_page_active { display: inline-block; } /* ******************** Home ********************************* */ #home .list_rahmen { padding:10px; } #home .title {padding-bottom:10px;} #home .button_block { position:relative; height:60px; } #home .button_block .left { position:absolute; left:0; top:0; text-align:left; } #home .button_block .middle { position:absolute; left:50%; margin-left:-150px; top:0; text-align:left; height:22px; line-height:22px; background-image:url(../img/lupe.gif); background-repeat:no-repeat; background-position:left center; } #home .button_block .middle input { margin-left:21px; width:150px; height:22px; } #home .button_block .right { position:absolute; right:0; top:0; text-align:right; } #home .button_line { margin-bottom: 5px; } #home .rahmen { min-width:1100px; max-width:1900px; position:relative; margin:0 auto; padding:20px; margin-top:20px } #home .title_line * { font-size: var(--font-sizePC-list); line-height: var(--line-heightPC); } #home .title_line {font-size: var(--font-sizePC-list); width: 100%; height:var(--line-heightPC);border-top:1px dashed #888888; border-bottom:1px dashed #888888; margin:0 -10px; padding:10px 10px; text-align: center; } #home .title_line span {font-size: var(--font-sizePC-list); height:var(--line-heightPC); line-height: var(--line-heightPC); float:left; position:relative; font-weight:600; } #home #user_block { max-height:300px; overflow: auto; overflow-x: hidden;} #home .user_line * { font-size: var(--font-sizePC-list); line-height: var(--line-heightPC); } #home .user_line { font-size: var(--font-sizePC-list); width:100%; height:var(--line-heightPC); line-height:var(--line-heightPC); margin:0 -10px; padding:0 10px; background-color:#ffffff;} #home .user_line:nth-child(odd) { background-color:#f5f5f5; } #home .user_line span { height:var(--line-heightPC); line-height: var(--line-heightPC); float:left; position:relative; overflow:hidden; box-sizing:border-box; padding-right:2px; background-position: center center; background-repeat:no-repeat; white-space:nowrap; text-overflow:ellipsis; } #home .ib { text-align: center;} #home .datum { width:10%; } #home .uhrzeit { width:5%; } #home .betreff { width:20%; } #home .style { width:5%; } #home .kundengruppen { width:15%; } #home .kundengruppen span { width:50%; text-align:center; } #home .empfanger { width:12%; } #home .versendet { width:12%; } #home .nichtempfanger { width:15%;} #home .nichtempfanger .ne_number { width: 50%; text-align: right; padding-right: 15px;} #home .nichtempfanger .edit { width: 50%; } #home .nichtempfanger .edit::before {font-size: 19px; display: block; text-align: left; cursor:pointer; } #graphs { margin-top: 20px; padding:20px; overflow: auto; max-width: 1900px; margin: 0 auto;} #graphs .graphs_title {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; margin: 0px -20px 0 -20px;} #graphs .neue_anmeldung::before {content: "\2022"; color:#33aa33; font-size:31px; font-weight:900; height: 100%; vertical-align: middle; margin-right: 5px;} #graphs .neue_anmeldung {border-bottom: 2px solid #33aa33; padding:8px; margin-right: 10px; border-radius: 0 0 4px 4px;} #graphs .abmeldung::before {content: "\2022"; color:#018dcb; font-size:31px; font-weight:900; height: 100%; vertical-align: middle; margin-right: 5px;} #graphs .abmeldung {border-bottom: 2px solid #018dcb; padding:8px; border-radius: 0 0 4px 4px;} #graphs .graphs_search {display: flex; align-items: center; justify-content: space-between; flex-wrap: nowrap; margin:0 auto ; padding-top:20px} #graphs .graphs_search span {margin: 2px 10px; display: flex; align-items: center; } #graphs .graphs_search input {height: 24px; border-radius: 5px; border: 1px groove #333333; padding: 2px 5px; margin-left:6px; } #graphs .button { color: #ffffff; font-weight: 900; background-color: #d62f2f; display: inline-block; margin-right: 5px; box-sizing: border-box;position: relative; vertical-align: top; height: 30px; border-radius: 5px; line-height: 30px; text-align: center; padding: 0 2px; min-width: 60px; cursor: pointer; } #graphs .button_los { color: #ffffff; background-color: #006198; display: inline-block; box-sizing: border-box;position: relative; vertical-align: top; height: 30px; border-radius: 5px; line-height: 30px; text-align: center; padding: 0 2px; min-width: 60px; cursor: pointer; } #graphs .button_graphs { color: #ffffff; font-weight: 900; display: inline-block; box-sizing: border-box;position: relative; vertical-align: top; height: 30px; border-radius: 5px; line-height: 30px; text-align: center; padding: 0 2px; min-width: 60px; cursor: pointer; } #graphs .button_graphs::after { content: '\f201'; width: 20px; height: 22px; color:#000000; line-height: 20px; font-size: 18px; font-family: 'Font Awesome 5 Free'; font-weight: 900; text-align: center;z-index: 12; } #graphs .button_bar { color: #ffffff; font-weight: 900; display: inline-block; box-sizing: border-box;position: relative; vertical-align: top; height: 30px; border-radius: 5px; line-height: 30px; text-align: center; padding: 0 2px; min-width: 60px; cursor: pointer; } #graphs .button_bar::after { content: '\f080'; width: 20px; height: 22px; color:#000000; line-height: 20px; font-size: 18px; font-family: 'Font Awesome 5 Free'; font-weight: 900; text-align: center;z-index: 12; } #graphs .graphs_all {position:relative ; margin: 0px -20px 0 -20px; padding: 0 20px} #graphs .graphs_group {position:relative ; width:32% ;padding-top:20px} #graphs .graphs_groups_div {display: flex; flex-wrap: wrap; justify-content: space-between; } #graphs .graphs_all .graphs_switch { position: absolute; top: 25px; right: 40px;} #graphs .graphs_all canvas {padding:20px 0 } #graphs .canvas_group {min-width: 100%; margin-top: 10px} #graphs .graphs_legend_alle p { font-size: 17px; font-weight: lighter; color: #333333; padding-bottom: 10px;} #graphs .graphs_legend_alle ul { display: flex; flex-direction: row; margin: 0; padding: 0;} #graphs .graphs_legend_alle ul li{ align-items: center; cursor: pointer; display: flex; flex-direction: row; margin-right: 10px;} #graphs .graphs_legend_alle ul li span {width: 40px; height: 20px; display: inline-block; margin-right: 10px} #graphs .graphs_group_legend p { font-size: 15px; font-weight: lighter; color: #333333; padding-bottom: 5px;} #graphs .graphs_group_legend ul { display: flex; flex-direction: row; margin: 0; padding: 0;} #graphs .graphs_group_legend ul li { align-items: center; cursor: pointer; display: flex; flex-direction: row; margin-right: 10px;} #graphs .graphs_group_legend ul li span {width: 30px; height: 15px; display: inline-block; margin-right: 10px} #graphs .graphs_group .graphs_switch { position: absolute; top: 38px; right: 20px;} #graphs .graphs_group .button_graphs { height: 25px; line-height: 25px; padding: 0 2px; min-width: 50px; margin-right: 4px;} #graphs .graphs_group .button_graphs::after { width: 20px; height: 20px; line-height: 20px; font-size: 14px; } #graphs .graphs_group .button_bar { height: 25px; line-height: 25px; padding: 0 2px; min-width: 50px; } #graphs .graphs_group .button_bar::after { width: 20px; height: 20px; line-height: 20px; font-size: 14px; } #graphs .graphs_message {display:flex; justify-content:center; margin: 0 auto; background-color: #f5f5f5; padding:3px} /* ******************** Einstellungen ************************ */ #config { padding-bottom:50px; overflow: auto; color: #555555} #config .element_wrapper { position:relative; min-width:940px; max-width:1900px; margin:auto; padding:0 20px;} #config .element_wrapper { display:flex; } #foreign_content { padding:35px 0 10px 0; background-color:#ffffff; } #foreign_content .titel1 { margin-bottom:5px; } #foreign_content .element_wrapper { display:flex; } #foreign_content .foreign_left { position:relative; flex:1 1 50%; width:50%; padding:15px 12px 0 0; box-sizing:border-box; } #foreign_content .foreign_left span { height:30px; line-height:30px; } #foreign_content .foreign_right { position:relative; flex:1 1 50%; width:50%; padding:15px 0 0 12px; box-sizing:border-box; } #foreign_content .foreign_right span { height:30px; line-height:30px; } #foreign_content iframe { position:relative; height:210px; width:100%; overflow:hidden; } #system { background-color:#f7f7f7; padding:15px 0; } #system .titel_system { padding-bottom:24px; } #system .element_wrapper { display:flex; } #system .system_left {position:relative; flex:1 1 50%; width:50%; padding:15px 12px 0 0; box-sizing:border-box; } #system .system_right {position:relative; flex:1 1 50%; width:50%; padding:15px 0 0 12px; box-sizing:border-box; } #system .system_right .send_button { width:146px; height:43px; background-image:url(../img/btn_speichern.jpg); cursor:pointer; } #system .input_2.left { padding-right:7px; box-sizing:border-box; } #system .input_2.right { padding-left:7px; box-sizing:border-box; } #system .email_smtp { position:relative; padding-right:100px; } #system .smtp { display:inline-block; position:absolute; right:0; width:90px; text-align:center; cursor:pointer; font-family: Raleway, sans-serif; font-size: 15px; color: #333333; background-color: #eeeeee; border-radius:32px; } #system .smtp_active { color: #ffffff; background-color: #006198; } #system label { padding-left:11px; } #system textarea { width:100%; height:200px; border:1px solid #aaaaaa;} #system .bestaetigungslink { height:32px; line-height:32px; position:relative; } #system .bestaetigungslink label { width:50%; float:left; padding:0; } #system .bestaetigungslink input { width:50%; float:left; } #website {} #website .element_wrapper { display:flex; } #website .website_left {position:relative; flex:1 1 50%; width:50%; padding:15px 12px 0 0; box-sizing:border-box; } #website .website_right {position:relative; flex:1 1 50%; width:50%; padding:15px 0 0 12px; box-sizing:border-box; } /* #website .website_right span { background-image:url(../img/btn_speichern.jpg); } */ #website .code { font-family: monospace; font-size: 14px; overflow: auto; scrollbar-width: none;} #website .code * { font-family: monospace; font-size: 14px; } #website .code::selection, #website .code *::selection { background-color:#000000; color:#ffffff; } #website .code::-moz-selection, #website .code *::-moz-selection { background-color:#000000; color:#ffffff; } #website .default_gruppe { position:relative; width:50%; margin-top:10px; } #website textarea { width: 100%; height: 130px; resize: none; padding:10px; } #web_colors { position:relative; } #web_colors .col_1 { width:50%; float:left;} #web_colors .col_1 .colors_1 { text-align:left; } #web_colors .col_1 .colors_2 { text-align:right; padding-right:14px; box-sizing:border-box; } #web_colors .col_2 { width:50%; float:left;} #web_colors .col_2 .colors_1 { padding-right:7px; box-sizing:border-box; } #web_colors .col_2 .colors_2 { padding-left:7px; box-sizing:border-box; } #web_colors .colors_1 { width:50%; position:relative; float:left; height: 32px; line-height:32px; margin-bottom:5px; } #web_colors .colors_2 { width:50%; position:relative; float:left; height: 32px; line-height:32px; margin-bottom:5px; } #web_colors input { width:100% !important; max-width:100%; padding-left:10px; font-size:0.9em; height:32px; } #web_colors .minicolors-theme-default .minicolors-swatch { top: 0; left: 0; width: 30px; height: 30px; } #web_colors .minicolors-theme-default.minicolors-position-right .minicolors-swatch { left: auto; right: 0; } #web_colors .minicolors-theme-default.minicolors { vertical-align:top; } #web_colors .minicolors-theme-default.minicolors { width:100%; } /* ******************** Styles allgemein ************************ */ #site_top { margin:15px 0 0 0; color:#555555} #site_top .element_wrapper { position:relative; min-width:780px; max-width:1900; margin:auto; display:flex; align-items: center;} #site_top .element_wrapper .w120 { width:150px; line-height:var(--line-heightPC-style); text-align:right; box-sizing:border-box; padding-right:10px; } .element_wrapper .col_right { position:relative; min-width:720px; max-width:1900; margin:0 auto} #site_top .element_wrapper:first-child .col_right .kundengruppen .checks { display: flex; flex-wrap:nowrap; align-items: center; width:100%; } #site_top .element_wrapper:first-child .col_right .kundengruppen .checks .checks-group{ display: flex; align-items: center;} #site_top .element_wrapper .col_right .kundengruppen-mail { display: flex; align-items: center; width:100%; } #site_top .mail {line-height: var(--line-heightPC-style); padding:10px 0; background-color:#eeeeee; border-bottom:1px solid #ffffff; } #site_top .element_wrapper .col_right .kundengruppen-cronjob { display: flex; align-items: center; width:100%; } #site_top .style_senden { margin-left: auto; width:146px; height:43px; background-image:url(../img/btn_versenden.jpg); z-index:10; cursor:pointer; } #site_top .style_speichern { margin-left:auto; width:146px; height:43px; background-image:url(../img/btn_speichern.jpg); z-index:10; cursor:pointer; } #site_top .help_cron { color:#006198; font-size:16px; } #site_top .refresh_cron { padding:0 5px; color:#006198; font-size:16px; cursor:pointer; } #site_top .delete_cron { padding-left:5px; font-size:16px; line-height:var(--line-heightPC-style); cursor:pointer; } #count_mails { color:#006198; } .btn_pic_up { display:inline-block; position:relative; vertical-align:top; width:19px; height:19px; margin-right:2px; background-image:url(../img/btn_pic_up.png); cursor:pointer; } .btn_pic_del { display:inline-block; position:relative; vertical-align:top; width:19px; height:19px; margin-right:2px; background-image:url(../img/btn_pic_del.png); cursor:pointer; } .btn_pic_del2 { display:inline-block; position:relative; vertical-align:top; width:19px; height:19px; margin-right:2px; background-image:url(../img/btn_pic_del2.png); cursor:pointer; } .btn_pic_link { display:inline-block; position:relative; vertical-align:top; width:19px; height:19px; margin-right:2px; background-image:url(../img/btn_pic_link.png); cursor:pointer; } .mail_wrapper {overflow: auto; width:auto} #mail1 { position:relative; min-width: 1150px} #mail1 .margin19 { margin-left:19px; margin-right:19px; } #mail1 .margin20 { margin-left:20px; margin-right:20px; } #mail1 .padding15 { padding:15px 20px; } #mail1 .element_inner { position:relative; background-color:#ffffff; width:625px; margin:auto; } #mail1 .logobanner1 { position:relative; background-color:#ffffff; width:625px; margin:auto; } #mail1 .logobanner1 .padding15 { min-height:10px; } #mail1 .element_inner680 { position:relative; width:680px; margin:auto; } #mail1 .element_inner625 { position:relative; width:625px; margin:auto; } #mail1 .element_inner1200 { position:relative; max-width:1200px; margin:auto; } #mail1 .element_footer { position:relative; background-color:#ffffff; width:625px; margin:auto; padding:10px 0; } #mail1 .oben { position:relative; max-width:1020px; margin:auto; } #mail1 .unten { position:relative; max-width:1020px; margin:auto; } #mail1 #style_show { position:relative; width:40px; height:30px; background-image:url(../img/show.png); cursor:pointer; display:none; } #mail1 #style_edit { position:relative; width:40px; height:30px; background-image:url(../img/edit.png); cursor:pointer; } #mail1 #edit_show { position:absolute; top:28px; right:0; width:auto; height:30px; } #mail1 #color_oben { position:absolute; top:28px; left:0; width:auto; height:30px; display:none; } #mail1 #round_oben { position:absolute; top:65px; left:-45px; width:auto; height:30px; display:none; } #mail1 #round_oben input {width: 20px; padding:2px; margin-left:5px; line-height: 20px;} #mail1 #foto1 a {text-align: center;} #mail1 .color_unten_div {position:relative; max-width:1020px; margin:auto; } #mail1 #color_unten { position:absolute; top:0; left:0; width:auto; height:30px; display:none; } #mail1 .bild_wrapper { position:relative; width:282px; text-align:left; float:left; } #mail1 .bild_wrapper img { max-width:282px; } #mail1 .bild_wrapper_right { margin-left:21px; } #mail1 .no_img1 { margin-left:303px !important; } #mail1 #abbestellen_oben { margin:25px 0 10px; width:100%; text-align:center; font-size:11px; color:#999999; display:none; font-family:arial, sans-serif; } #mail1 #abbestellen_oben2 { padding:25px 0 10px; width:100%; height:32px; line-height:32px; text-align:center; color:#999999; font-size:11px; font-family:arial, sans-serif; } #mail1 #abbestellen_unten { margin:10px 0 25px 0; width:100%; text-align:center; font-size:11px; color:#999999; display:none; font-family:arial, sans-serif; } #mail1 #abbestellen_unten2 { padding:10px 0 25px 0; width:100%; height:32px; line-height:32px; text-align:center; color:#999999; font-size:11px; font-family:arial, sans-serif; } #mail2 { position:relative; min-width: 1150px} #mail2 .margin25 { margin-left:25px; margin-right:25px; } #mail2 .element_inner { position:relative; background-color:#ffffff; width:680px; margin:auto; } #mail2 .element_inner680 { position:relative; width:680px; margin:auto; } #mail2 .element_inner1200 { position:relative; max-width:1200px; margin:auto; } #mail2 .element_footer { position:relative; background-color:#ffffff; width:630px; margin:auto; padding:25px; } #mail2 .oben { position:relative; max-width:1020px; margin:auto; } #mail2 .unten { position:relative; max-width:1020px; margin:auto; } #mail2 #style_show { position:relative; width:40px; height:30px; background-image:url(../img/show.png); cursor:pointer; display:none; } #mail2 #style_edit { position:relative; width:40px; height:30px; background-image:url(../img/edit.png); cursor:pointer; } #mail2 #edit_show { position:absolute; top:28px; right:0; width:auto; height:30px; } #mail2 #color_oben { position:absolute; top:28px; left:0; width:auto; height:30px; display:none; } #mail2 #round_oben { position:absolute; top:65px; left:-45px; width:auto; height:30px; display:none; } #mail2 #round_oben input {width: 20px; padding:2px; margin-left:5px; line-height: 20px;} #mail2 .color_unten_div {position:relative; max-width:1020px; margin:auto; } #mail2 #color_unten { position:absolute; top:0; left:0; width:auto; height:30px; display:none; } #mail2 .bild_wrapper { position:relative; width:200px; float:left; text-align:left; } #mail2 .bild_wrapper img { max-width:183px; } #mail2 .text_wrapper { position:relative; width:430px; float:left; } #mail2 .text_wrapper.full { width:100%; } #mail2 #abbestellen_oben { margin:25px 0 10px; width:100%; text-align:center; font-size:11px; color:#999999; display:none; font-family:arial, sans-serif; } #mail2 #abbestellen_oben2 { padding:25px 0 10px; width:100%; height:32px; line-height:32px; text-align:center; color:#999999; font-size:11px; font-family:arial, sans-serif; } #mail2 #abbestellen_unten { margin:10px 0 25px 0; width:100%; text-align:center; font-size:11px; color:#999999; display:none; font-family:arial, sans-serif; } #mail2 #abbestellen_unten2 { padding:10px 0 25px 0; width:100%; height:32px; line-height:32px; text-align:center; color:#999999; font-size:11px; font-family:arial, sans-serif; } #mail3 { position:relative; min-width: 1150px} #mail3 .margin25 { margin-left:25px; margin-right:25px; } #mail3 .element_inner { position:relative; background-color:#ffffff; width:680px; margin:auto; } #mail3 .element_inner680 { position:relative; width:680px; margin:auto; } #mail3 .element_inner1200 { position:relative; max-width:1200px; margin:auto; } #mail3 .element_footer { position:relative; background-color:#ffffff; width:630px; margin:auto; padding:25px; } #mail3 .oben { position:relative; max-width:1020px; margin:auto; } #mail3 .unten { position:relative; max-width:1020px; margin:auto; } #mail3 #style_show { position:relative; width:40px; height:30px; background-image:url(../img/show.png); cursor:pointer; display:none; } #mail3 #style_edit { position:relative; width:40px; height:30px; background-image:url(../img/edit.png); cursor:pointer; } #mail3 #edit_show { position:absolute; top:28px; right:0; width:auto; height:30px; } #mail3 #color_oben { position:absolute; top:28px; left:0; width:auto; height:30px; display:none; } #mail3 #round_oben { position:absolute; top:65px; left:-45px; width:auto; height:30px; display:none; } #mail3 #round_oben input {width: 20px; padding:2px; margin-left:5px; line-height: 20px;} #mail3 .bild_wrapper a {text-align: center}; #mail3 .color_unten_div {position:relative; max-width:1020px; margin:auto; } #mail3 #color_unten { position:absolute; top:0; left:0; width:auto; height:30px; display:none; } #mail3 #abbestellen_oben { margin:25px 0 10px; width:100%; text-align:center; font-size:11px; color:#999999; display:none; font-family:arial, sans-serif; } #mail3 #abbestellen_oben2 { padding:25px 0 10px; width:100%; height:32px; line-height:32px; text-align:center; color:#999999; font-size:11px; font-family:arial, sans-serif; } #mail3 #abbestellen_unten { margin:10px 0 25px 0; width:100%; text-align:center; font-size:11px; color:#999999; display:none; font-family:arial, sans-serif; } #mail3 #abbestellen_unten2 { padding:10px 0 25px 0; width:100%; height:32px; line-height:32px; text-align:center; color:#999999; font-size:11px; font-family:arial, sans-serif; } #mail4 { position:relative; min-width: 1150px} #mail4 .margin25 { margin-left:25px; margin-right:25px; } #mail4 .element_inner { position:relative; background-color:#ffffff; width:680px; margin:auto; } #mail4 .element_inner680 { position:relative; width:680px; margin:auto; } #mail4 .element_inner1200 { position:relative; max-width:1200px; margin:auto; } #mail4 .element_footer { position:relative; background-color:#ffffff; width:630px; margin:auto; padding:25px; } #mail4 .oben { position:relative; max-width:1020px; margin:auto; } #mail4 .unten { position:relative; max-width:1020px; margin:auto; } #mail4 #style_show { position:relative; width:40px; height:30px; background-image:url(../img/show.png); cursor:pointer; display:none; } #mail4 #style_edit { position:relative; width:40px; height:30px; background-image:url(../img/edit.png); cursor:pointer; } #mail4 #edit_show { position:absolute; top:28px; right:0; width:auto; height:30px; } #mail4 #color_oben { position:absolute; top:28px; left:0; width:auto; height:30px; display:none; } #mail4 #round_oben { position:absolute; top:65px; left:-45px; width:auto; height:30px; display:none; } #mail4 #round_oben input {width: 20px; padding:2px; margin-left:5px; line-height: 20px;} #mail4 .color_unten_div {position:relative; max-width:1020px; margin:auto; } #mail4 #color_unten { position:absolute; top:0; left:0; width:auto; height:30px; display:none; } #mail4 #logobanner { margin: auto} #mail4 #logobanner .banner_div {display:flex; margin-left: 25px; } #mail4 #logobanner .text_wrapper {position:relative; width:310px; float:left; margin:25px 5px 0 0} #mail4 #logobanner .bild_wrapper { width:335px; display: flex; justify-content: flex-end; margin:0 0 0 5px; align-items: start;} #mail4 #logobanner .bild_wrapper a { text-align: right;} #mail4 #logobanner .bild_wrapper a img { width:unset; max-width:100%;} #mail4 #logobanner .control {display:none; position:absolute; top:5px; width:auto; height:19px; z-index:10; right:31px; left:unset} #mail4 .margin25_flex { display: flex; margin-left:25px; margin-right:25px;} #mail4 .margin25_flex_flipped {flex-direction: row-reverse; margin-left:25px; margin-right:25px;} #mail4 .control_flipped {right:31px; left:unset} #mail4 .bild_wrapper { width:50%; display: flex; justify-content: flex-start; margin:0 5px 0 0; align-items: start;} #mail4 .bild_wrapper_flipped { justify-content: flex-end; margin:0 0 0 5px} #mail4 .bild_wrapper_flipped a { text-align: right;} #mail4 .bild_wrapper img { width: unset; max-width: 100%; } #mail4 .text_wrapper { position:relative; width:50%; float:left; margin:0 0 0 5px} #mail4 .text_wrapper.full { width:100%; margin-left:0} #mail4 .text_wrapper_flipped { margin:0 5px 0 0} #mail4 .editor p, #mail4 .editor div {padding:0} #mail4 .text_wrapper iframe {min-height:204px;} #mail4 .banner_div iframe {min-height:380px;} #mail4 #abbestellen_oben { margin:25px 0 10px; width:100%; text-align:center; font-size:11px; color:#999999; display:none; font-family:arial, sans-serif; } #mail4 #abbestellen_oben2 { padding:25px 0 10px; width:100%; height:32px; line-height:32px; text-align:center; color:#999999; font-size:11px; font-family:arial, sans-serif; } #mail4 #abbestellen_unten { margin:10px 0 25px 0; width:100%; text-align:center; font-size:11px; color:#999999; display:none; font-family:arial, sans-serif; } #mail4 #abbestellen_unten2 { padding:10px 0 25px 0; width:100%; height:32px; line-height:32px; text-align:center; color:#999999; font-size:11px; font-family:arial, sans-serif; } .minicolors-theme-default .minicolors-swatch { top: 1px; left: 0; width: 22px; height: 22px; } .minicolors-theme-default.minicolors-position-right .minicolors-swatch { left: auto; right: 4px; } .minicolors-theme-default.minicolors { vertical-align:top; } .minicolors_bg, .minicolors_footer_bg { border-color:#ffffff !important; height:26px !important; width:100px !important; padding-left:5px; margin-right:3px; } #oben { position:relative; height:30px;} #unten { position:relative; height:50px;} #round_oben input {text-align: center;} .element_inner .control { display:none; position:absolute; top:5px; left:31px; width:auto; height:19px; z-index:10; } .element_inner .control_double { left:3px; } .element_inner .control_padding15 { top:20px; left:23px; } .logobanner1 .control_padding15 { position:absolute; top:20px; left:23px; z-index:10; } .element_inner .control_check { display:none; position:absolute; top:5px; left:-32px; width:19px; height:19px; z-index:10; } .element_inner .control_check.active { background-image:url(../img/aktiv.png); cursor:pointer; } .element_inner .control_check.inactive { background-image:url(../img/inaktiv.png); cursor:pointer; } .element_inner.icon_line .control_check.inactive { background-image:url(../img/inaktiv_line.png); cursor:pointer; } .element_inner.icon_bildtext .control_check.inactive { background-image:url(../img/inaktiv_bildtext.png); cursor:pointer; } .element_inner.icon_bildtext2 .control_check.inactive { background-image:url(../img/inaktiv_bildtext2.png); cursor:pointer; } /* .element_inner .control_text { display:none; position:absolute; top:5px; left:3px; width:19px; height:19px; z-index:10; } */ .element_inner .show_on_hide { height:28px; } .element_inner a[href=""] { pointer-events:none; } .top_radius {min-height:28px;} .editor.show { min-height:30px; cursor:pointer; } .editor {color:#555555; } .editor p, .editor h1, .editor h2, .editor h3, .editor h4, .editor h5, .editor h6{ padding:5px 0; font-family: Raleway,arial, sans-serif; word-break:break-word; color: #555555;} .editor h1 { font-size: 2em; } .editor h1 * { font-size: unset } .editor h2 { font-size: 1.5em; } .editor h2 * { font-size: unset } .editor h3 { font-size: 1.17em; } .editor h3 * { font-size: unset } .editor h4 { font-size: 1em; } .editor h4 * { font-size: unset } .editor h5 { font-size: 0.83em; } .editor h5 * { font-size: unset } .editor h6 { font-size: 0.67em; } .editor h6 * { font-size: unset } .editor a { display: inline; } .style_editor { display:none; } .mce-container { display:none; } .trennlinie { width:100%; height:15px; padding:8px 0; } #mail1 .trennlinie.show { height:15px; background-image:url(../img/nl-linie1.jpg); background-position:left center; background-repeat:repeat-x; } #mail2 .trennlinie.show { height:15px; background-image:url(../img/nl-linie1.jpg); background-position:left center; background-repeat:repeat-x; } #mail3 .trennlinie.show { height:15px; background-image:url(../img/nl-linie1.jpg); background-position:left center; background-repeat:repeat-x; } #mail4 .trennlinie.show { height:15px; background-image:url(../img/nl-linie1.jpg); background-position:left center; background-repeat:repeat-x; } /* .schatten { display:none; width:100%; height:30px; background-image:linear-gradient(to bottom, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);} */ .schatten { display:none; width:100%; height:30px; background-image:url(../img/nl-grafikschatten.png);} .schatten.show { display:block; } /* ******************** Popup Editor ************************ */ #box_disabled { position:fixed; top:0; left:0; width:100%; height:100%; background-color:#000000; z-index:10000; } #box_link { position:fixed; height:auto; max-width:90%; background-color:#ffffff; z-index:10001; padding:54px 0; box-shadow:3px 5px 5px 3px #444444; } .overlay_box .head, #box_link .head { position:absolute; top:0; left:0; right:0; height:54px; background-color:#f3f3f3; } .overlay_box .title, #box_link .title { height:54px; line-height:54px; padding-left:20px; } .overlay_box .close, #box_link .close { position:absolute; top:0; right:0; height:54px; width:58px; background-image:url(../img/btn_close.png); cursor:pointer; } .overlay_box .mitte, #box_link .mitte { position:relative; width:360px; padding:10px 0; } #box_link .k_line { position:relative; padding:0 20px 0 60px; margin:15px 0; box-sizing:border-box; width:100%; height:32px; line-height:32px; } #box_link label { position:absolute; left:20px; top:0; width:45px; text-align:left; } #box_link .k_line input[type="text"] { width:100%; } .overlay_box .footer, #box_link .footer { position:absolute; bottom:0; left:0; right:0; height:54px; line-height:54px; text-align:center; font-size:18px; color:#ffffff; background-color:#006198; cursor:pointer; } #box_confirm { position:fixed; width:250px; height:150px; max-width:90%; max-height:100%; background-color:#cccccc; z-index:10001; } #box_progress { position:fixed; width:250px; height:150px; max-width:90%; max-height:100%; background-color:#cccccc; z-index:10001; } #show_progress { position:relative; width:200px; height:50px; } #progress { position:relative; width:200px; height:50px; top:50px; left:25px; background-color:#cccccc; } progress::-moz-progress-bar { background-color:#33aa33;} progress::-webkit-progress-bar { background-color:#33aa33;} /* ******************** Kunden ************************ */ #kunden .list_rahmen { border:1px solid #cacaca; padding:10px;} #kunden .button_block { position:relative; height:60px; } #kunden .button_block .left { position:absolute; left:0; top:0; text-align:left;} #kunden .button_block .left h1 { font-size: var(--font-sizePC-list)} #kunden .button_block .middle { position:absolute; left:50%; margin-left:-150px; top:0; text-align:left; height:22px; line-height:22px; background-image:url(../img/lupe.gif); background-repeat:no-repeat; background-position:left center; } #kunden .button_block .middle input { margin-left:21px; width:150px; height:22px; } #kunden .button_block .right { position:absolute; right:0; top:0; text-align:right; } #kunden .button_line { margin-bottom: 5px; } #kunden .rahmen { min-width: 1100px; max-width:1900px; position:relative; margin:0 auto; padding:20px; } #kunden .title_line * { font-size: var(--font-sizePC-list); line-height: var(--line-heightPC); } #kunden .title_line { width:100%; height:var(--line-heightPC); border-bottom:1px dashed #888888; margin:0 -10px; padding:0 10px; } #kunden .title_line span { height:var(--line-heightPC); line-height: var(--line-heightPC); float:left; position:relative; font-weight:600; } #kunden .user_line * { font-size: var(--font-sizePC-list); line-height: var(--line-heightPC); } #kunden .user_line { width:100%; height:var(--line-heightPC); line-height:var(--line-heightPC); margin:0 -10px; padding:0 10px; background-color:#ffffff; } #kunden .user_line:nth-child(odd) { background-color:#f5f5f5; } #kunden .user_line span { height:var(--line-heightPC); line-height: var(--line-heightPC); float:left; position:relative; overflow:hidden; box-sizing:border-box; padding-right:2px; background-position: center center; background-repeat:no-repeat; white-space:nowrap; text-overflow:ellipsis; } #kunden .icons { width:9%; } #kunden .icons .edit { width:25%; } #kunden .icons .edit::before {font-size: 15px; display: block; text-align: center; cursor:pointer;} #kunden .icons .active { width:25%; } #kunden .icons .active::before {content: "\2714"; color:#7d9800; font-size:19px; font-weight:900; cursor: pointer; display: block; text-align: center;} #kunden .icons .inactive { width:25%; background-image:url(../img/btn_nein.png); cursor:pointer; } #kunden .icons .verified_header { position: absolute; left:49%; width:25%;} #kunden .icons .verified_header::before {content: "V"; font-weight:900; pointer-events:none; display: block; text-align: center; } #kunden .icons .verified { width:25%; } #kunden .icons .verified::before {content: "\2714"; color:#333333; font-size:19px; font-weight:900; pointer-events:none; display: block; text-align: center;} #kunden .icons .unverified { width:25%; } #kunden .icons .delete { width:25%; } #kunden .icons .delete::before {font-size: 15px; display: block; text-align: center; cursor:pointer;} #kunden .id { width:4%; } #kunden .datum { width:7%; } #kunden .anrede { width:7%; } #kunden .vorname { width:10%; } #kunden .nachname { width:14%; } #kunden .mail { width:17%; } #kunden .sonstiges { width:12%; } #kunden .gruppen { width:20%; display: flex;} #kunden .text_line .gruppen span { text-align:center; width: 25px} #kunden .user_line .gruppen span { width: 25px;} #kunden .select_all { background-image:url(../img/alle_aktiv.gif); width:100%; height:19px; background-position:37% center; background-repeat:no-repeat; cursor:pointer; } #kunden .deselect_all { background-image:url(../img/alle_inaktiv.gif); width:100%; height:19px; background-position:37% center; background-repeat:no-repeat; cursor:pointer; } .sort_dir { width:15px; float:none !important; } .sort_asc { background-image:url(../img/dir_asc.gif); background-repeat:no-repeat; background-position:bottom 8px center; } .sort_desc { background-image:url(../img/dir_desc.gif); background-repeat:no-repeat; background-position:bottom 8px center; } #seiten { position:relative; margin-bottom:5px; } #seiten span{ line-height: var(--line-heightPC); height:var(--line-heightPC); font-size: var(--font-sizePC-list) } .seiten { width:45px; border:1px dotted #cccccc; cursor:pointer; text-align: center;} .seiten.active { border-color:#888888; background-color:#aeb3ad; cursor:default; } #counter { position:absolute; right:0; top:0; text-align:right; } .counter { height:30px; line-height:30px; margin-left:8px; } .counter.active { border-color:#888888; cursor:pointer; } .counter.min { background-image:url(../img/btn_left2_no.png); width:40px; background-size:40px 30px; background-repeat: no-repeat; background-position: center;} .counter.minus { background-image:url(../img/btn_left1_no.png); width:40px; background-size:40px 30px; background-repeat: no-repeat; background-position: center;} .counter.plus { background-image:url(../img/btn_right1_no.png); width:40px; background-size:40px 30px; background-repeat: no-repeat; background-position: center;} .counter.max { background-image:url(../img/btn_right2_no.png); width:40px; background-size:40px 30px; background-repeat: no-repeat; background-position: center;} .counter.min.active { background-image:url(../img/btn_left2.png); width:40px; background-size:40px 30px; background-repeat: no-repeat; background-position: center;} .counter.minus.active { background-image:url(../img/btn_left1.png); width:40px; background-size:40px 30px; background-repeat: no-repeat; background-position: center;} .counter.plus.active { background-image:url(../img/btn_right1.png); width:40px; background-size:40px 30px; background-repeat: no-repeat; background-position: center;} .counter.max.active { background-image:url(../img/btn_right2.png); width:40px; background-size:40px 30px; background-repeat: no-repeat; background-position: center;} .vonbis { margin-left:8px; line-height:30px; } /* ******************** Popup Statistik ************************ */ #box_statistik { position:fixed; height:auto; max-width:90%; background-color:#ffffff; z-index:10001; padding:54px 0; box-shadow:3px 5px 5px 3px #444444; } #box_statistik .head { position:absolute; top:0; left:0; right:0; height:54px; background-color:#f3f3f3; } #box_statistik .title { height:54px; line-height:54px; padding-left:20px; } #box_statistik .close { position:absolute; top:0; right:0; height:54px; width:58px; background-image:url(../img/btn_close.png); cursor:pointer; } #statistik_popup { position:relative; margin:15px 0; } #statistik_popup .select_all { background-image:url(../img/alle_aktiv.gif); width:100%; height:19px; background-position:37% center; background-repeat:no-repeat; cursor:pointer; position:relative; top:5px; left:8px } #statistik_popup .deselect_all { background-image:url(../img/alle_inaktiv.gif); width:100%; height:19px; background-position:37% center; background-repeat:no-repeat; cursor:pointer; position:relative; top:5px; left:8px } #box_statistik #mitte { overflow: auto; height:400px;} #box_statistik .k_line { position:relative; padding:0 20px 0 20px; margin-bottom:5px; box-sizing:border-box; width:100%; height:32px; line-height:32px; } #box_statistik .statistik_title { padding:0 20px 0 20px; margin-bottom:5px; box-sizing:border-box; height:32px; line-height:32px; display:flex; justify-content: flex-start; min-width: fit-content; min-width: -moz-fit-content; max-width: 1500px;} #box_statistik .statistik_item { padding:0 20px 0 20px; margin-bottom:5px; box-sizing:border-box; height:32px; line-height:32px; display:flex; justify-content: flex-start; min-width: fit-content; min-width: -moz-fit-content; max-width: 1500px;} #box_statistik .check { width:17px; cursor: pointer; margin-right: 10px;} #box_statistik .name { width:200px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; margin-right: 10px;} #box_statistik .email {width:200px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; margin-right: 10px;} #box_statistik .meldung {width:fit-content ; width: -moz-fit-content; max-width:1000px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;} #box_statistik .statistik_item:nth-child(odd) { background-color:#f5f5f5; } #box_statistik .check_wrapper { position:absolute; left:20px; width:25px; } #box_statistik .footer { position:absolute; bottom:0; left:0; right:0; height:54px; line-height:54px; text-align:center; font-size:18px; color:#ffffff; background-color:#892223; cursor:pointer; } #box_statistik #statistik_msg { text-align: center; color: #cc0000; margin-top: 50px; } /* ******************** Popup Kunden ************************ */ #box_kunden { position:fixed; height:auto; max-width:90%; background-color:#ffffff; z-index:10001; padding:54px 0; box-shadow:3px 5px 5px 3px #444444; } #box_kunden .head { position:absolute; top:0; left:0; right:0; height:54px; background-color:#f3f3f3; } #box_kunden .title { height:54px; line-height:54px; padding-left:20px; } #box_kunden .close { position:absolute; top:0; right:0; height:54px; width:58px; background-image:url(../img/btn_close.png); cursor:pointer; } #kunden_popup { position:relative; margin:15px 0; min-width:800px; width:800px } #import_popup { position:relative; margin:15px 0; width:300px; padding:20px; word-wrap: break-word;} #import_popup .import_name { width:25px; } #box_kunden .mitte { position:relative; } #box_kunden #mitte { overflow-y: hidden; overflow-x: scroll;} #box_kunden .spalte_links { width:50%;float:left; } #box_kunden .k_line { position:relative; padding:0 20px 0 100px; margin-bottom:5px; box-sizing:border-box; width:100%; height:32px; line-height:32px; } #box_kunden label { position:absolute; left:20px; top:0; width:100px; text-align:left; } #box_kunden .k_line input[type="text"] { width:100%; } #box_kunden .k_line .checkbox { left:-3px; } #box_kunden .k_line .verified { margin-left: 60px; } #box_kunden .k_line .verified .check::before{ content: '\2714'; color:#333333; font-size:20px; font-weight:900; position:absolute; margin-left:-18px; pointer-events:none; } #box_kunden .v_line { position:relative; padding-left:20px; height:32px; line-height:32px; margin:20px 0; } #box_kunden .v_line span { position:absolute; right:20px; top:4px; } #box_kunden .spalte_rechts { width:50%; float:left; } #box_kunden .group_line { position:relative; padding:0 20px 0 70px; margin-bottom:5px; box-sizing:border-box; width:100%; height:32px; line-height:32px; } #box_kunden .check_wrapper { position:absolute; left:20px; width:25px; } #box_kunden .gruppe_check { } #box_kunden .gruppe { position:absolute; left:42px; width:24px; text-align:center; } #box_kunden .gruppe_name { position:relative; box-sizing:border-box; width:100%; } #box_kunden .spalte { position:relative; width:50%; float:left; } #box_kunden .footer { position:absolute; bottom:0; left:0; right:0; height:54px; line-height:54px; text-align:center; font-size:18px; color:#ffffff; background-color:#006198; cursor:pointer; } #box_kunden #kunden_msg { text-align: center; color: #cc0000; margin-top: 50px; } #box_xmlupload { position:fixed; height:auto; max-width:90%; background-color:#ffffff; z-index:10001; padding:54px 0 108px; box-shadow:3px 5px 5px 3px #444444; } #box_xmlupload .mitte { position:relative; width:300px; height:80px; line-height:40px; padding:20px; font-size:20px; text-align:center; } #box_xmlupload .footer1 { position:absolute; bottom:54px; left:0; right:0; height:54px; line-height:54px; text-align:center; font-size:18px; color:#ffffff; background-color:#882222; cursor:pointer; } #box_xmlupload .footer1:hover { color:#ffffff; background-color:#882222; } #box_xmlupload .footer2 { position:absolute; bottom:0; left:0; right:0; height:54px; line-height:54px; text-align:center; font-size:18px; color:#ffffff; background-color:#006198; cursor:pointer; } #box_xmlupload .footer2:hover { color:#cc0000; background-color:#ffffff; } /* ********* Multibox ********** */ #multibox_bg { position:fixed; top:0; right:0; bottom:0; left:0; opacity:0; z-index:20000; background-color:#2b2b2b; } .multibox_padding { padding-right:17px; } .multibox_open { overflow: hidden !important; } .multibox_open #page { pointer-events:none; } .multibox_open #bg_wrapper { pointer-events:none; } #multibox { position:fixed; height:auto; max-width:90%; border: 1px solid #000000; padding: 13px; background-color: #ffffff; box-sizing:border-box; z-index:20001; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); transition: width, height, top, left 0.3s; } #multibox #multibox_close { position:absolute; width:36px; height:36px; top:-18px; right:-18px; z-index: 10; cursor:pointer; background-image:url(../img/btn_multibox_close.png); } #multibox .multibox_inner { position:relative; width:100%; max-height:100%; box-sizing:border-box; overflow-y:auto; background-color:#f0f0f0; } #multibox h1 { position:relative; height:30px; } #multibox h2 { position:relative; height:30px; line-height:30px; margin:0 0 20px 0; font-size:20px; } #multibox .close { position:absolute; top:0; right:0; } #multibox_content_wrapper { position:relative; height:100%; padding:14px; } #multibox_content { position:relative; line-height: var(--line-heightPC-style); } #multibox img { max-width:100%; vertical-align:top; } #popup_smtp .title { margin-bottom: 20px; } #multibox .buttonzeile { position:relative; width:100%; margin:20px 0 10px 0; text-align:center; } #multibox .button_left { display:inline-block; width:120px; margin-right:5px; text-align:center; background-color:#e0e0e0} #multibox .button_right { display:inline-block; width:120px; margin-left:5px; text-align:center; } #popup_smtp .smtp { margin-bottom:3px; } #popup_smtp .smtp_left { width: 150px; float: left; font-size: 0; } #popup_smtp .smtp_right { width: calc(100% - 150px); float: left; } #popup_smtp .check { display: inline-block; width: 20px; } #popup_smtp .smtp_text1 { margin: 0 0 20px 20px; line-height: 20px; font-size: 0.8em; } #popup_smtp .smtp .pass {position: relative;} #popup_smtp .smtp .pw_auge_show{ position: absolute; top:16px; right:15px;transform: translateY(-50%);} #popup_smtp .smtp.imap_title {padding:5px 0; font-weight: 600;} #popup_smtp .smtp .smtp_rcheck {margin-right: 0;} #popup_smtp input[type="radio"].newdesign {display:none; } #popup_smtp input[type="radio"].newdesign + label:before { display:inline-block; content:'\f111'; font-family:'Font Awesome 5 Free'; margin-right:5px; font-size:16px; cursor:pointer; font-weight:normal; } #popup_smtp input[type="radio"].newdesign:checked + label:before { content:'\f058'; } #popup_smtp select { width:calc( 100% - 1px); } #popup_smtp .selectbox30 { display: inline-block !important; position: relative !important; line-height: 30px !important; width: 100%; height: 30px !important; border-radius: 4px; box-sizing: border-box !important; background-color: #ffffff; vertical-align: top; border: 1px solid #cccccc; width:208px; } #popup_smtp .selectbox30::before { content: ''; position: absolute; right: 1px; top: 1px; width: 24px; height: 26px; pointer-events: none; display: block; background-color: #ffffff; z-index: 11; line-height: 30px !important; } #popup_smtp .selectbox30::after { content: '\f0d7'; position: absolute; right: 0; top: 4px; width: 20px; height: 22px; line-height: 20px; font-size: 18px; font-family: 'Font Awesome 5 Free'; font-weight: 900; text-align: center; pointer-events: none; z-index: 12; color: #888888;border-left: 1px solid #cccccc; } #popup_smtp .button_right { color: #ffffff; background-color: #006198; display: inline-block; width: 132px; margin-right: 5px; box-sizing: border-box;position: relative; vertical-align: top; height: 32px; border-radius: 32px; line-height: 32px; text-align: center; padding: 0 20px; min-width: 60px; cursor: pointer; } #popup_smtp .button_left { color: #333333; background-color: #eeeeee; display: inline-block; width: 132px; margin-right: 5px; box-sizing: border-box;position: relative; vertical-align: top; height: 32px; border-radius: 32px; line-height: 32px; text-align: center; padding: 0 20px; min-width: 60px; cursor: pointer; } #popup_smtp .button_left:after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 30px; border: 1px solid #aaaaaa; border-radius: 15px; } /*** Footer **/ .footer-link {display:flex; justify-content: space-between; padding: 20px; background-color:#eeeeee; color:#555555} .footer-link a {font-size: 15px} .footer-link .footer-center{text-align: center;} .footer-link .footer-right{text-align: right;} /************************* Media Query **********************/ @media screen and (max-width: 1200px) { /* change link menu width, hide text and display icons */ :root { --menu-height : 50px; --font-sizePC : 15px; --font-sizePC-list : 15px; --line-heightPC : 30px; --line-heightPC-style : 25px; } #kunden { overflow: auto; overflow-y: hidden;} #home { overflow: auto; overflow-y: hidden;} .title {font-size: 21px;} #menu { height: var(--menu-height); } #menu li.menu_item { width: 50px; height:var(--menu-height); line-height: var(--menu-height); } #menu ul.menu_sub { top:50px;} #menu li.menu_item .text { display:none} #menu li.menu_item .icon { display:inline-block} #menu .logout { height:var(--menu-height); line-height: var(--menu-height); width:50px } .logout .icon { display:inline-block} .logout .text { display:none} /** GRAPHS **/ #graphs .graphs_all canvas {padding:10px 0 } #graphs .graphs_all .graphs_switch { top: 18px;} #graphs .graphs_group {width:49%} #graphs .graphs_legend_alle span * { font-size: 15px;} #graphs .graphs_legend_alle p { padding-bottom: 5px;} #graphs .graphs_search span {margin: 10px 10px 5px 10px; } /********** CONFIG ****************/ #config .titel1 {font-weight: 600;} #config .element_wrapper{ flex-direction: column; min-width: 90%; max-width: 90%; padding: 0 20px} #config .element_wrapper .foreign_left { width: 100%; padding-right: 0 } #config .element_wrapper .foreign_right { width: 100%; padding-left: 0 } #system .element_wrapper .system_left { width: 100%; padding-right: 0 } #system .element_wrapper .system_right { width: 100%; padding-left: 0 } #system .element_wrapper .left { padding-right: 0} #system .element_wrapper .right { padding-left: 0} #website .element_wrapper .website_left { width: 100%; padding-right: 0} #website .element_wrapper .website_right { width: 100%; padding-left: 0} #system .system_right { position: unset} #system .system_right .send_button { position:absolute; top:12px; right:25px} /************* Style ************/ #site_top { overflow: auto ; overflow-y: hidden; } /* checks */ span.checksim { width:17px; height:17px; } span.checksim.active:after { font-size:21px; } span.checksim.preactive:after { font-size:21px; } span.checksim.postactive:after { font-size:21px;} #mail1, #mail2, #mail3, #mail4 { overflow: auto;} @media screen and (max-width: 900px) { #graphs .graphs_group {width:100%} #graphs .graphs_legend_alle span ul li p{ display: none;} } @media screen and (max-width: 600px) { :root { --menu-height : 50px; } .hide-s {display: none !important;} #menu { height: var(--menu-height); } #menu li.menu_item { width: 50px; height:var(--menu-height); line-height: var(--menu-height);} #menu .logout { height:var(--menu-height); line-height: var(--menu-height); } #title { padding:5px 10px; } #title .logo { width: calc(100% - 50px);} /*** CONFIG ****/ .site_wrapper .input_2 { width: 100% } #system .system_right .send_button { width:100px; height:30px; background-size:contain; background-repeat: no-repeat;} /* POPUP SMTP*/ #popup_smtp .title { margin-bottom: 10px; } #popup_smtp .smtp_text1 { margin-bottom: 5px; } #popup_smtp .smtp { display: flex; flex-direction: column;} #popup_smtp .smtp input {width: 100%;} #popup_smtp .smtp_left { width:100%} #popup_smtp .smtp_right { width: 100%; } #popup_smtp .rucklaufer { display: flex; flex-direction: row;} #popup_smtp .rucklaufer .smtp_left { width:50%} #popup_smtp .rucklaufer .smtp_right { width: 50%; } #popup_smtp .rucklaufer .smtp_right .smtp_rcheck{ width: unset } #popup_smtp .selectbox30 { width:100% } /* Graphs */ #graphs {padding-top: 5px;} #graphs .graphs_search { flex-direction: column; justify-content: center;} #graphs .graphs_search span {width:225px; margin: 7px 0} #graphs .graphs_search span input {width:165px;} #graphs .button_los {width: 200px; margin:0 auto} /** POPUP Statistik **/ #box_statistik .title { height:40px; line-height:40px; font-size:17px} #box_statistik .head {height: 40px} #box_statistik .close {height: 40px; width: 42px; background-size: contain;} #box_statistik .footer { height: 40px; line-height:40px; font-size:17px;} /** POPUP KUNDEN **/ #box_kunden .title { height:40px; line-height:40px; font-size:17px} #box_kunden .head {height: 40px} #box_kunden .close {height: 40px; width: 42px; background-size: contain;} #box_kunden .footer { height: 40px; line-height:40px; font-size:17px;} /** Footer **/ .footer-link { flex-direction: column; padding: 10px 20px} .footer-link a { padding: 5px 0 5px 0; } .footer-link .footer-left { text-align: center; } .footer-link .footer-center { text-align: center;} .footer-link .footer-right { text-align: center;} } @media screen and (max-width: 340px) { /* POPUP SMTP*/ #popup_smtp .button_left { width: 100% ; margin: 0;} #popup_smtp .button_right { width: 100% ; margin: 10px 0 0 0;} } }