install: name1

Proposed css
/* Allgemein ================================================================== */ /* height 102% to force a scrollbar to prevent page jumping */ html { height:102%; margin: 0 0 0 0; padding:0 0 0 0; } @media (max-width: 838px) { html { height:100%;} } /* * {margin:0;padding:0;} */ * {margin:0;} * {padding-top:0; padding-right:0; padding-bottom:0; } #background { width:100%; height:100%; position: absolute; z-index: -1; top: 0; left:0; } #adminbar {visibility:hidden;height:25px;position:fixed;z-index:105;top:0;} #preload { display: none; } #preload img { height: 0; width: 0; border: none; position: absolute; bottom: 0; left: 0; z-index: -30; } /* @font-face { font-family: 'arial-black'; src: url("../site_fonts/arial-black.eot"); src: url("../site_fonts/arial-black.otf") format("opentype"); src: url("../site_fonts/arial-black.eot?#iefix") format('embedded-opentype'), url("../site_fonts/arial-black.woff") format("woff"), url("../site_fonts/arial-black.ttf") format("truetype"); } */ .wichtig,.getinfo,.hide { display:none; } .show { display:block; } .block { text-align:justify; } .bold { font-weight: bold; } .normal { font-weight: normal; } .italic { font-style:italic; } .red { color: red; } .green { color: green; } .black { color: black; } .white { color: white; } .sbig { font-size: 110.01%; } .errmsg { color: #b5124b; font-weight: bold; } .grad img { height: 13px; width: 19px; border: 0; z-index: 0;} body[id="Administration"] #maincont_inner .errmsg { display:none; } body[id="Administration"] #maincont_inner div.textblock .errmsg { display:block; } .okmsg { color: green; font-weight: bold; } .filefmt { color: black; font-weight: normal; font-style:italic; } .aboutright { border: 0px solid blue; width:300px;margin-left:430px; } .aboutright2 { border: 0px solid blue; width:400px;margin-left:330px; } .aboutright3 { border: 0px solid blue; width:500px;margin-left:230px; } .tright { text-align:right; } .eeven { background-color:#eeeeee; } .thbg { background-color:#dddddd;padding-left:10px; } .delfile { width:600px; border: 0px solid blue; } .upld { width:400px; border: 0px solid blue; } .outlined { border: 2px solid #6F6F6F; } .frame_left, .left { text-align:left; float:left; margin: 15px 20px 20px 0px;} .frame_right, .right, .frame_right_mob { text-align:right; float:right; margin: 15px 0px 20px 20px;} .frame_center, .center { text-align:center; margin: 15px 0px 20px 0px;} @media (max-width: 838px) {.frame_right_mob { text-align:left; float:left; margin: 15px 0px 20px 0px;}} #map_canvas { width:50%;height:300px; } @media (max-width: 838px) { #map_canvas { width:100%;height:300px; }} body { margin: 0; padding: 0; font: 90.01% Verdana, arial, helvetica, sans-serif; color: #565656; background-color: rgb(0,140,198); text-align: center; } div { text-align: left; /* text-align:center wieder aufheben, damit DIV-Inhalte linksbündig ausgerichtet sind */} h1, h2, h3 {font-weight: normal; background-color:transparent;color:#565656; /*dunkelgrau*/ font-family: Verdana, arial, helvetica, sans-serif; } h1 {font-size: 140.01%; font-size: 2.25em; letter-spacing: .1em; ;padding-bottom:15px; font-weight:600; padding-top:20px; text-transform: uppercase; letter-spacing: 1.5px!important;} h2 {font-size: 130.01%; color:rgb(0,140,198); font-size: 1.75em; letter-spacing: .2em; line-height: 2;text-transform: uppercase;} h3 {font-size: 110.01%; color:rgb(0,140,198); padding-bottom:7px; letter-spacing: .2em; } h4 {font-size: 110.01%; color:rgb(0,140,198); padding-bottom:7px; letter-spacing: .1em; color:black; font-weight:600;} a {background-color:transparent;color:rgb(0,140,198); outline: none; font-weight: normal; } p {margin-bottom: 15px; } img {border: 0; } ul {list-style-image:url(../site_images/list10x10-kugel15.gif);} br {clear: left;} @media (max-width: 904px) { h1 {font-size:2.05em; } h2 {font-size:1.35em; }} @media (max-width: 565px) { h1 {font-size:1.35em; } h2 {font-size:1.25em; }} @media (max-width: 390px) { h1 {font-size:1.15em; } h2 {font-size:1.05em; }} @media (max-width: 325px) { h1 {font-size:1.1em; } h2 {font-size:1.0em; }} #container { margin: 0 auto; margin-top: 0px; background: transparent;} * html #container {height:1%; } #scroll { font-size: 1px; } .gesamt_breite_aussen { width: 1024px; min-width: 320px; } .dynamic .gesamt_breite_aussen { width: 100%; min-width: 320px;} .inner_width { width: 924px; } /* innerer Platz des Containers: gesamt_breite_aussen - rahmen dicke */ .dynamic .inner_width { width: 90%; } @media (max-width: 910px) {.dynamic .inner_width { width: 100%; }} /* ############################ [Rahmen-Definitionen] ######################### */ /* Rahmen: Breite */ /* hier rahmen breite links und rechts einstellen */ .left_border_width { margin-left: 0px; } .right_border_width { margin-right: 0px; } .border_high { height: 0px; } .border_corner_width{ width: 0px; } #wrap_header_area {} #wrap_main_and_left { background-color: white; border: 0px solid #dddddd;} /* clearfix zum Aufheben der Floatumgebung */ .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix {display: inline-block;} /* Hides from IE-mac \*/ * html .clearfix {height: 1%;} .clearfix {display: block;} /* End hide from IE-mac */ .header_mid_high { height: 150px; } #header1 {position:fixed;width:100%; background-color:rgb(0,140,198);z-index:99;} /* gleiche Farbe wie body color */ nav {height:150px;} /* um den header zu kompensieren */ body[id=""] .header_mid_high { height:0;} /* für Startseite und Slideshow als Abstandhalter, gleiche Werte Höhe wie aus index.php 400, 320, 220 */ body[id=""] nav {height:400px; background-color:#666;} /* den 666 Hintergrund sieht man, wenn die Seite lädt oder JS abgeschaltet ist */ @media (max-width: 990px) {body[id=""] nav {height:320px;}} /* siehe dazu auch site_no_script.css */ @media (max-width: 640px) {body[id=""] nav {height:220px;}} div.langswitch { position: absolute; right: 0; top: 18px; padding: 3px 8px; font-size: 80%; text-align: right; border: 0px solid white; float: right; display: inline; background: transparent url(../images/transp_grey.png) left top repeat-x; } a.langswitch { display: inline; outline: none;} a.langswitch {color: #7d7d7d; text-decoration:none; font-weight: bold;outline: none;} a.langswitch:hover {color: #2D5EAE; /* blue */ text-decoration:none; font-weight: bold;} .spact, .spact:hover {color: #9d9d9d; text-decoration:none; font-weight: bold; text-transform: lowercase;cursor:default;} .spact {background: transparent url(../images/transp_grey.png) left top repeat-x;z-index:5;} img.langswitch { position:relative;float:left;padding-left:5px;border:0; } .DE { background: transparent url(../images/DE.gif) left top no-repeat; position:relative;width:19px;height:13px;display:inline;}.EN { background: transparent url(../images/EN.gif) left top no-repeat; position:relative;width:19px;height:13px;display:inline;}.RU { background: transparent url(../images/RU.gif) left top no-repeat; position:relative;width:19px;height:13px;display:inline;}.IT { background: transparent url(../images/IT.gif) left top no-repeat; position:relative;width:19px;height:13px;display:inline;} #headerrinc__ { position: relative; margin-left: 60px; width: 157px; height: 261px; z-index: 44; border: 0px solid yellow; float: left; } #logo, #slogo { /*background: transparent url(../site_images/Logo-gabriele-2.png) center top no-repeat;*/ position: fixed; left: 5%; top: 30px; width: 200px; height: 98px; background-size: 200px 98px; z-index: 109; -webkit-filter: drop-shadow(-2px 5px 5px #222); filter: drop-shadow(-2px 5px 5px #222) } #logo:hover {filter: drop-shadow(-2px 2px 15px #fff);} #schrift { position: fixed; top: 10px; bottom: 0px; right: 0px; width: 500px; height: 50px; border: 0px solid red; z-index: 150; left: calc(50% - 250px); text-align: center; color: white; -webkit-filter: drop-shadow(-2px 3px 3px #222); filter: drop-shadow(-2px 3px 3px #222); font: 42px Verdana, arial, helvetica, sans-serif; } body[id=""] #schrift {position:absolute;} @media (max-width: 500px) { #schrift {width: 460px;left: calc(50% - 230px);} } @media (max-width: 460px) { #schrift {font-size: 35px; width: 400px;left: calc(50% - 200px);} } @media (max-width: 400px) { #schrift {font-size: 30px; width: 360px;left: calc(50% - 180px);} } #statusbar, #statusbar1 { /* Statusbar, optional */ position: relative; height: 25px; background-color: red; font-size: 14px; font-weight: bold; color: white; border-top: 2px solid black; border-bottom: 2px solid black; /* oben rechts unten links */ padding: 3px 20px 1px 20px; overflow: hidden; clear: both; } /* mleft (18) + menubar (822) + mright (186) = mwrap (1026) px */ #mwrap { background: rgba(0,0,0,0.45) url(../site_images/head-grafik-3.jpg) center top no-repeat; height: 90px; clear: both; overflow: hidden; border-top: 2px solid rgb(214,247,239); border-bottom: 2px solid rgb(0,140,198); top: 30px; z-index: 99; width: 100%; position: fixed; } body[id=""] #mwrap {background-image: none;} #mleft, #mright { background-color: transparent;} #menubar, #menubar2, #menubar_leer { /* menubar: Menu */ position: relative; border:0; padding:0; border-top: 0px solid gray; background-color: transparent; font-size: 0px; } #menubar2, #menubar_leer { background-color: transparent; } #menubar { padding-right:16%; padding-left:16%; padding-top:25px; height:65px;} @media (max-width: 1080px) {#menubar { padding-right:5%; padding-left:5%; }} #mainbox { border:0; margin:0; padding:0; height: 100%; background-color: transparent; } #contents { overflow: hidden; padding: 0; margin: 0; /* 3-COLUMN */ z-index: 4; width: 100%; } #inner { height:1%;} /* to avoid the IE6 3 pixel jog bug - sonst ist text nach float um 3px versetzt */ /* ######### begin: 3-column design main area */ /* column container */ .colmask { position: relative; /* This fixes the IE7 overflow hidden bug */ clear: both; float: left; width: 100%; /* width of whole page */ overflow: hidden; /* This chops off any overhanging divs */ z-index: 5; } /* common column settings */ .colright, .colmid, .colleft { float: left; width: 100%; /* width of page */ position: relative; } .maincont, .lfa, .rechts { float: left; position: relative; padding: 0 0 1em 0; /* no left and right padding on columns, we just make them narrower instead only padding top and bottom is included here, make it whatever value you need */ overflow: hidden; } .lfa, .maincont, #maincont_inner { z-index:4; top:0px; } /* Basis von: http://matthewjamestaylor.com/blog/perfect-3-column.htm */ /* 3 Column settings */ .threecol { background:white; /* right column background colour */ } body[id="login"] .threecol, body[id="Administration"] .threecol { background:white; } /* Attention: the colum setting is found in the followings files: lfa.css - 2 columns, left:15%, middle: 85%, right:0% no_lfa.css - 1 column, left:0%, middle:100%, right:0% 3col.css - 3 columns, left:15%, middle: 70%, right:15% (this layout is not used) */ /* column setting for the 3col case */ .colmid { background:white; /* center column background colour */ } body[id="login"] .colmid, body[id="Administration"] .colmid { background:white; } .threecol .colmid { right:16%; /* width of the right column */ } body[id=""] .threecol .colmid { /* andere LFA Breite, individuell o.a. */ } @media (max-width: 838px) {.threecol .colmid {right:0;}} .threecol .colleft { right:68%; /* width of the middle column */ background:white; /* left column background colour */ border-right: 0px solid #bbb; } body[id="login"] .threecol .colleft, body[id="Administration"] .threecol .colleft { background:white; } @media (max-width: 838px) {.threecol .colleft {right:100%;}} .threecol .maincont { width:68%; /* width of center column content (column width minus padding on either side) */ left:100%; /* 100% plus left padding of center column */ } @media (max-width: 838px) {.threecol .maincont {width:100%;}} .threecol .lfa { width:16%; /* Width of left column content (column width minus padding on either side) */ left:16%; /* width of (right column) plus (center column left and right padding) plus (left column left padding) */ } @media (max-width: 838px) {.threecol .lfa {width:0;left:0;}} .threecol .rechts { width:16%; /* Width of right column content (column width minus padding on either side) */ left:84%; /* Please make note of the brackets here: (100% - left column width) plus (center column left and right padding) plus (left column left and right padding) plus (right column left padding) */ } @media (max-width: 838px) {.threecol .rechts {width:0;left:100%;}} /* ######### end: 3-column design main area */ #maincont_inner { position: relative; margin: 0 auto; height: 100%; width: 100%; /* if #lfa_ctl:3%, then here 97% */ float: left; padding: 0; display: inline-block; border: 0px solid green; color: black; } div.textblock, div.textblock2, div.smid { /* oben rechts unten links */ margin: 10px 25px 20px 25px; display: block; padding: 0; text-align: left; /* wegen Anna */ -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; -o-hyphens: auto; hyphens: auto; } div.textblock2 { margin: 10px 0px 20px 0px; } div.textblock2 ul, div.textblock ul { line-height: 1.5em; text-indent: 2px; list-style-position: outside; /*list-style-type: disc;*/ margin-left: 15px; } div.textblock2 h2, div.textblock h2 { padding-bottom: 10px; padding-top: 15px; } /* Menue Definitionen ========================================================= */ /* Es gibt insgesamt 4 Menue-Arten: 1) Hauptmenu, oben, horizontal ==> (mainnav) 2) 2.Menue-Ebene, oben, horizontal, direkt unter Hauptmenue (wird zur Zeit nicht benutzt) ==> (mainnav2) 3) 3.Menue-Ebene, links, wird als Submenue benutzt, wenn Hauptmenue horizontal ist ==> (menu) 4) komplettes Accordeon-Menue links, beinihaltet Hauptmenue + Submenue (3.Ebene), hierfür gibt es 2 Anwendungsfaelle: ==> (cssmenu) A) in menu.php als 'mobiles Menue' B) fuer Webseiten mit vertikalem Menue */ /* ###################### Menue oben, Hauptmenue ################### */ /*.menubar_height { height: 25px; } */ /* .menu_item_width { width: 19%; } */ /* innere_width dividiert durch Anzahl der Menuepunkte, z.B. 800/5=160 */ div.mainnav, div.mainnav2 { position: relative; padding-top: 3px; padding-bottom: 0px; margin-right: 0px; margin-left: 0px; overflow: hidden; font-size: 16px; border: 0; display: flex; justify-content: center; align-items: center; } /* Menue oben + 2.Ebene */ a.mainnav, a.mainnav2, #nav10 { /* oben rechts unten links */ margin: 0px 0 0px 0; /* oben/unten links/rechts */ padding: 8px 0px; font-size: 16px; font-weight: normal; font-family: veranda,Arial, Helvetica, sans-serif; font-family: Trebuchet MS, veranda, Arial, Helvetica, sans-serif; text-align: center; text-decoration:none; color: white; border: 0px solid black; float: left; display: inline; outline: none; text-transform: uppercase; } a.mainnav, #nav10 { top: 0px; margin-left: 5px; /* sorgt für gleichen Abstand */ margin-right: 5px; } a.mainnav { top: 0px; } a.mainnav:link, a.mainnav:visited { background-color: transparent; border-top: 0px solid #000066; border-bottom: 0px solid #000066; } #nav10:hover, a.mainnav:hover { border: 0px solid red; color: #999; cursor:pointer;} #nav10 {user-select:none;} a.mainnav2 { padding-bottom: 4px; padding-top: 25px; width: auto; font-size: 100.01%; float: right; font-weight: normal; color: black; } a.mainnav2:link, a.mainnav2:visited { background-color: transparent; border-top: 0px solid #000066; border-bottom: 0px solid #000066; } a.mainnav2:hover { background-color: transparent; border: 0px solid black; color: #ec7405; /* orange */ } /* Menue-Tags, Ebene 1, oben - wenn selected */ #menu #nav10 a, body[id^=""] #nav11 a, body[id^=""] #nav12 a, body[id^=""] #nav13 a, body[id^=""] #nav14 a, body[id^=""] #nav15 a, body[id^=""] #nav16 a, body[id^=""] #nav17 a, body[id^=""] #nav18 a, body[id^=""] #nav19 a, body[id^=""] #nav110 a { color: #00CED1; /* DarkTurquoise */ background-color: transparent; cursor: default; float: left; } #nav10 { display: none; height: 30px; } @media (max-width: 838px) { span[id^="nav1"] {display:none;} span[id^="lnav"] {display:none;} #nav10 {display:inline;} } #mobnav10 {display:none;} .mainnav #menu0 {padding-left:35px;} /* Menue-Tags, Ebene 2, oben - wenn selected */ #dummy #dummnav { color: #2D5EAE; /* blau */ background-color: transparent; cursor: default; /*width: 170px;*/ float: right; } /* ######################### Menue links, Submenue ########################## */ a.menu { font-family: veranda, Arial, Helvetica, sans-serif; text-align: right; text-decoration: none; font-weight: normal; display: block; outline: none; padding: 10px; color: rgb(99,99,99); font-size: 13px; text-transform: capitalize; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; background-color: #efefef; background-image: linear-gradient(to right, #efefef 0%, white 100%); background-image: -webkit-linear-gradient(right, #efefef 0%, white 100%); margin: 3px 10px 3px 10%; -moz-transition-property:all; -moz-transition-duration:500ms; -webkit-transition-property:all; -webkit-transition-duration:500ms; -o-transition-property:all; -o-transition-duration:500ms; -ms-transition-property:all; -ms-transition-duration:500ms; } .left_sub {margin-top:80px;position:fixed;width:16%;} /* breite wie linke spalte */ .vis_no,.vis_no span, a.vis_no {height:0 !important;font-size:0;padding:0; } .vis_,.vis_ span, a.vis_ {height:0 !important;font-size:0;padding:0; } a.eodd { background: #f4f4f4; border:0; border-bottom: 1px solid #e0e0e0;} a.eeven { background: #fff; border:0; border-bottom: 1px solid #e0e0e0;} a.menu:hover { color:black;background-color: rgb(214,247,239)} /* Menue-Tags (Ebene 2 oder 3), links - wenn selected */ #dumm #dummxx a { color: #00CED1; /* DarkTurquoise */ cursor: default; font-weight: bold; background-color: rgb(214,247,239); } /* ######################### Menue links, Accordeon-Menue ########################## */ /* design of left jquery accordeon menu ==> Gesamtmenü, welche links genutzt wird für menu.php und für verticales Seitemenü */ /* design ist ähnlich wie linkes Menü bei horizontalen Seiten */ #cssmenu { width: 100%;} #cssmenu, #cssmenu ul, #cssmenu li, #cssmenu a { margin: 0; padding: 0; border: 0; list-style: none; font-weight: normal; text-decoration: none; line-height: 1; font-size: 14px; position: relative; } #cssmenu a { line-height: 1.3; -moz-transition-property:all; -moz-transition-duration:500ms; -webkit-transition-property:all; -webkit-transition-duration:500ms; -o-transition-property:all; -o-transition-duration:500ms; -ms-transition-property:all; -ms-transition-duration:500ms; } #cssmenu > ul > li > a { padding-right: 40px; font-size: 25px; font-weight: bold; display: block; background: rgb(0,165,198); /* noch dunkleres rot von 'Nummern-Box', rechts im 1st level menu */ color: white; border-bottom: 1px solid #5e071b; /* dunkles lila, Linie unten 1st level menu */ text-transform: uppercase; position: relative; } #cssmenu > ul > li > a > span { background: rgb(0,140,198); /* dunkles rot, left 1st level menu */ padding: 10px; display: block; font-size: 13px; font-weight: 300; } #cssmenu > ul > li > a:hover { text-decoration: none; } #cssmenu > ul > li > a > span:hover { color:black; background-color: rgb(214,247,239); /* altrosa fuer hover, 1st level menu */ } #cssmenu > ul > li.active { border-bottom: none; } #cssmenu > ul > li.active > a { color: white; } #cssmenu > ul > li.active > a span { background: rgb(0,165,198); /* dunkleres rot, wie Nummern-Box */ } #cssmenu span.cnt { position: absolute; top: 8px; right: 15px; padding: 0; margin: 0; background: none; } #cssmenu ul ul { display: none; background-color:#ddd;} #cssmenu ul ul li { border: 1px solid #e0e0e0; border-top: 0;} #cssmenu ul ul a { padding: 10px; display: block; color: rgb(0,140,198); /* dunkles rot, wie von left 1st level menu */ font-size: 13px; text-transform: capitalize; } #cssmenu ul ul a:hover { color: white; background-color: rgb(214,247,239); /* altrosa fuer hover, 2nd level menu */ } #cssmenu ul ul li.odd { background: #f4f4f4; } #cssmenu ul ul li.even { background: white; } body[id^=""] #mobnav11 > span, body[id^=""] #mobnav12 > span, body[id^=""] #mobnav13 > span, body[id^=""] #mobnav14 > span, body[id^=""] #mobnav15 > span, body[id^=""] #mobnav16 > span, body[id^=""] #mobnav17 > span, body[id^=""] #mobnav18 > span, /* Achtung: hier irgendwo noch impressum + datenschutz eintragen statt dummy02 */ body[id^=""] #mobnav19 > span, body[id^=""] #mobnav110 > span { color: #EEA2AD; /* LightPink2 */ cursor: default; background: rgb(0,165,198); /* dunkleres rot, wie Nummern-Box */ } /*sphider search*/ .ssearchbox { position:relative; height:39px; width:185px; border:0px solid red; padding-top:12px; padding-left:42px; cursor:pointer; } .input1 { color:white; font-size: 14px; line-height: 1.5; border: 0px solid black; background-color: #777777; } /* die Class 'button' wird auch im CMS verwendet, nicht nur auf der Website selbst */ .button, .button:hover { border: none; padding: 2px 8px; width: 180px; height: 35px; text-align: center; font-size: 100.01%; color: white; background-image: linear-gradient(to bottom, #2e434f 0%, #4a6c7f 100%); background-image: -webkit-linear-gradient(top, #2e434f 0%, #4a6c7f 100%); border-radius: 5px; border: 1px solid #dadae5; } .button:hover { background-image: linear-gradient(to top, #2e434f 0%, #afc4d0 100%); background-image: -webkit-linear-gradient(bottom, #2e434f 0%, #afc4d0 100%); cursor: pointer; } .button:active, .button:focus { background-image: linear-gradient(to top, #2e434f 0%, #66a3ff 100%); background-image: -webkit-linear-gradient(bottom, #2e434f 0%, #66a3ff 100%); color: #ccc; } .button::-moz-focus-inner {border: 1px dotted transparent;} /* column classes for markdown tables */ .mrktab { width:800px; border-spacing: 5px; margin-left:5%; } .colcl_0 { width:20%; } .colcl_1 { width:80%; } /* alignment for markdown tables */ .align_left { text-align:left; } .align_right { text-align:right; } .align_center { text-align:center; } /* contact form */ .cont_form form { background-color: #fff; margin: 10px auto; width: 90%; } .cont_form > noscript > p { color: #b5124b; font-weight: bold; } @media (max-width: 948px) { .cont_form form {width:100%; } } #myForm fieldset { border: 2px solid #aaa; min-width: 290px; background-color: #eee; position: relative; margin: 0; padding: 5px; border-radius: 5px; } #myForm fieldset .fbody { background-color : #eee; padding: 22px; margin: 15px 0 0; } #myForm fieldset.okmsg2 { border: 2px solid #99CC00;} #myForm fieldset.errmsg2 { border: 2px solid #FF8181;} #myForm legend { background-color:transparent;position : absolute;} #myForm ol { list-style-type: none; margin: 0; padding: 0; } #myForm li { float: left; padding: 0; width:100%; } #myForm li.last { float: none; clear: both; text-align: center; } #myForm label { display: block; cursor: pointer; font-weight: bold; line-height: 24px; text-align: left; } #myForm input[id='company'], #myForm input[id='phone'], #myForm input[id='phone_wide'], #myForm input[id='firstname'], #myForm input[id='lastname'], #myForm input[id='captcha'], #myForm input[id='address'], #myForm input[id='email'], #myForm input[id='fupld'], #myForm textarea { background-color: #fff; color: #4d4d4d; border: 1px solid #c4c4c4; font: 13px Helvetica, Arial, "Nimbus Sans L", FreeSans, sans-serif; padding: 5px 8% 5px 2%; width: 90%; border-radius: 5px; box-shadow: 2px 2px 5px #e2e2e2, inset 2px 2px 5px #e2e2e2; } #myForm textarea { overflow:auto;} #myForm input.valid, #myForm textarea.valid { border-color: #99CC00; /* green */ box-shadow: 1px 1px 3px #99CC00, inset 1px 1px 3px #99CC00; background: #fff url(../images/tick.png) 98% 3px no-repeat; } #myForm input[id='company'].valid, #myForm input[id='phone'].valid, #myForm input[id='phone_wide'].valid, #myForm input[id='firstname'].valid, #myForm input[id='lastname'].valid, #myForm input[id='fupld'].valid {background-position: 97% 3px;} #myForm input.error, #myForm textarea.error { border-color: #FF8181; /* red */ box-shadow: 1px 1px 3px #FF8181, inset 1px 1px 3px #FF8181; background: #fff url(../images/wrong.png) 98% 3px no-repeat; } #myForm label.error { color: #c50a1f; /* red */ font-weight:normal; padding:0;margin:0; width:89%;float:left; line-height: 12px; font-size:10px; overflow:hidden;white-space:nowrap;} #myForm label[id='datenschutz-error'].error {float:none; width:auto;} #myForm label[id='datenschutz-error'].valid {float:left !important; } #dslink {text-decoration:none;color:green; font-weight:bold;} #myForm input[id='company'].error, #myForm input[id='phone'].error, #myForm input[id='phone_wide'].error, #myForm input[id='firstname'].error, #myForm input[id='lastname'].error, #myForm input[id='fupld'].error {background-position: 97% 3px;} #myForm input[id='company']:focus, #myForm input[id='phone']:focus, #myForm input[id='phone_wide']:focus, #myForm input[id='firstname']:focus, #myForm input[id='lastname']:focus, #myForm input[id='captcha']:focus, #myForm input[id='address']:focus, #myForm input[id='email']:focus, #myForm input[id='fupld']:focus, #myForm textarea:focus { border-color: #3399FF; /* blue */ box-shadow: 1px 1px 3px #3399FF, inset 1px 1px 3px #3399FF; background-image: none; } #myForm input[id='company'], #myForm input[id='phone'], #myForm input[id='phone_wide'], #myForm label[for='company'], #myForm label[for='phone'], #myForm label[for='phone_wide'], #myForm input[id='firstname'], #myForm input[id='lastname'], #myForm label[for='firstname'], #myForm label[for='lastname'] {width:90%;} #myForm li[id='comp'], #myForm li[id='phon'], #myForm li[id='fname'], #myForm li[id='lname'] {width:49%;} #myForm input[id='captcha'] {width:60px;position:relative;float:left;} #myForm label[for='captcha'] {clear:both;padding-top:5px;} #myForm li[id='phon'], #myForm li[id='lname'] {padding-left:2%;} @media (max-width: 948px) { #myForm li, #myForm li[id='comp'], #myForm li[id='phon'], #myForm li[id='fname'], #myForm li[id='lname'] {width:90%;padding:0px 8% 0px 2%;min-width:270px;} } .place_holder1 {width:1%;height:24px;} .place_holder2 {width:1%;height:65px;} /* footer area ############################################################# */ /* potentielle footer Links, wenn aktiv */ #agb #navagb a, #banner #navban a, #partner #navpart a, #about4 #navjobs a, #impressum #navimpr a, #datenschutz #navdat a { color: black; font-weight: bold; text-decoration:none; cursor: default; } #footer, #footer_pre { clear: both; height: 45px; border-top: 1px solid gray; font-weight: bold; font-size: 11px; font-family: veranda, Arial,Helvetica; text-decoration:none; text-align: center; color: rgb(214,247,239); padding-top: 3px; padding-right: 15px; padding-left: 15px; padding-bottom: 5px; overflow: hidden; z-index: 3; } #footer_pre { border-top: 0px solid gray; padding: 0; /* 3-COLUMN */ height: 0px; } #footer { position: relative; top: 0px; border-top: 0px solid gray; background-color: transparent; } @media (max-width: 910px) { #footer {top:15px;height:95px;} } @media (max-width: 838px) { #footer { visibility: hidden; } } #footer a, #footer_left a {outline: none;font-weight:bold;font-family:Veranda,Arial,Helvetica;text-decoration:none;background-color:transparent;color:rgb(214,247,239);vertical-align:bottom;} #footer a:hover, #footer_left a:hover {background-color:transparent;color:#00CED1; /* DarkTurquoise */font-weight:bold;} #footer_left { float: left; text-align: left; padding-left: 15px; padding-bottom: 5px; } /* Facebook plugin */ .fb_post { clear:both; overflow:hidden; border: 2px solid #aaa; margin: 10px; padding: 10px; background-color: #eee; border-radius: 5px; } #cookiedingsbums a {color:#000; text-decoration:none;font-weight:bold;} #cookiedingsbums a:hover {text-decoration:underline;} #cookiedingsbums div {padding:10px; padding-right:40px;} #cookiedingsbums span { color:black; } #cookiedingsbums { left:0; outline: 1px solid #7b92a9; text-align:right; border-top:1px solid #fff; background: #d6e0eb; background: -moz-linear-gradient(top, #d6e0eb 0%, #f2f6f9 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d6e0eb), color-stop(100%,#f2f6f9)); background: -webkit-linear-gradient(top, #d6e0eb 0%,#f2f6f9 100%); background: -o-linear-gradient(top, #d6e0eb 0%,#f2f6f9 100%); background: -ms-linear-gradient(top, #d6e0eb 0%,#f2f6f9 100%); background: linear-gradient(to bottom, #d6e0eb 0%,#f2f6f9 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6e0eb', endColorstr='#f2f6f9',GradientType=0 ); position:fixed; bottom:0px; z-index:10000; width:100%; font-size:12px; line-height:16px;} #cookiedingsbumsCloser { color: #777; font: 14px/100% arial, sans-serif; position: absolute; right: 5px; text-decoration: none; text-shadow: 0 1px 0 #fff; top: 5px; cursor:pointer; border-top:1px solid white; border-left:1px solid white; border-bottom:1px solid #7b92a9; border-right:1px solid #7b92a9; padding:4px; background: #ced6df; /* Old browsers */ background: -moz-linear-gradient(top, #ced6df 0%, #f2f6f9 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ced6df), color-stop(100%,#f2f6f9)); background: -webkit-linear-gradient(top, #ced6df 0%,#f2f6f9 100%); background: -o-linear-gradient(top, #ced6df 0%,#f2f6f9 100%); background: -ms-linear-gradient(top, #ced6df 0%,#f2f6f9 100%); background: linear-gradient(to bottom, #ced6df 0%,#f2f6f9 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ced6df', endColorstr='#f2f6f9',GradientType=0 ); } #cookiedingsbumsCloser:hover {border-bottom:1px solid white; border-right:1px solid white; border-top:1px solid #7b92a9; border-left:1px solid #7b92a9;} /* für Kalendereintrag */ .calentry > i { font-size:200%; color:#ff9900;position:relative;float:left;line-height:75px;padding:0 25px 0 0; clear:both;margin-left:20%;} @media (max-width: 500px) { .calentry > i {margin-left:0;}} @media (max-width: 400px) { .calentry > h3 {font-size:90.01%;} .caladdress {font-size:80.01%;} } @media (max-width: 370px) { .calentry > h3 {font-weight:normal;font-size:80.01%;} .calentry > i {padding:0 10px 0 0;line-height:70px;} .caladdress {font-size:70.01%;}} h3 { padding-top:20px;} .caladdress { position: relative; top:5px; } /* Openstreetmap */ iframe { border: none; overflow: hidden; margin-top: 0; margin-bottom: 0; } /* eingebettetes Youtube-Video via CMS Editor eingefuegt */ .embedvideo-wrapper { max-width: 100%; left: 0; right: 0; margin: auto; } @media only screen and (max-width: 600px) { .embedvideo-wrapper {width:100% !important;}} div.embedvideo { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; box-shadow: 0px 10px 12px 0px rgba(49, 49, 49, 0.4); border:0; } .embedvideo iframe { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } #mob_menu {display:none;position:fixed;z-index:99;width:100%;top:125px;} .fversion {font-size:12px;margin-left:15px;}

Current .htaccess
AddType x-mapp-php5 .php AddHandler x-mapp-php5 .php Options +FollowSymLinks RewriteEngine on ### automatischer language switch in Abhaengigkeit der eingestellten browser sprache AddType application/x-type-map var Options +MultiViews DirectoryIndex index.var ### eigene Error Pages installieren ## Multiple Choices 1und1 ErrorDocument 300 /error404.php ## nichtauthorisierter zugriffsversuch ErrorDocument 401 /name1/Kunstpsychologie/error401.php ## nichtauthorisierter zugriffsversuch ErrorDocument 403 /name1/Kunstpsychologie/error403.php ## angeforderte seite nicht gefunden ErrorDocument 404 /name1/Kunstpsychologie/error404.php ## wir haben seite geloescht ErrorDocument 410 /name1/Kunstpsychologie/error410.php ## wenn andere Browsersprachen eingestellt sind, die nicht unterstuetzt werden, z.B. spanisch - error406.php ist eine Kopie von index_en.php ErrorDocument 406 /name1/Kunstpsychologie/error406.php redirect 301 /error406.php https://www.gabrielevonende.de/index.php?lang=en ### alles auf HTTPS umbiegen, wenn SSL RewriteEngine On RewriteCond %{HTTPS} off RewriteRule (.*) https://%{HTTP_HOST}/$1 [R=301,L] ### doppelter Content weg RewriteCond %{HTTP_HOST} ^www\.gabriele-von-ende-pichler\.de$ [NC] RewriteRule (.*) http://www.gabrielevonende.de/$1 [R=301] ### doppelter Content weg RewriteCond %{HTTP_HOST} ^gabriele-von-ende-pichler\.de$ [NC] RewriteRule (.*) http://www.gabrielevonende.de/$1 [R=301] ### doppelter Content weg RewriteCond %{HTTP_HOST} ^gabrielevonende\.de$ [NC] RewriteRule (.*) http://www.gabrielevonende.de/$1 [R=301] ### und alles auf das unterverzeichnis umbiegen RewriteCond %{HTTP_HOST} ^www\.gabrielevonende\.de$ [NC] RewriteCond %{REQUEST_URI} !^/name1/Kunstpsychologie/ RewriteRule (.*) /name1/Kunstpsychologie/$1 [L] RewriteCond %{REQUEST_URI} !robots\.txt [NC] RewriteCond %{REQUEST_URI} !sitemap\.xml RewriteRule \.(log|ini|xml|inc|bak)$ - [R=404] # Deflate Compression by FileType <IfModule mod_deflate.c> AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE text/javascript AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/atom_xml AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/x-shockwave-flash </IfModule> # turns cache on for 1 month <IfModule mod_expires.c> ExpiresActive On ExpiresByType text/css "access plus 1 month" ExpiresByType text/javascript "access plus 1 month" ExpiresByType text/html "access plus 1 month" ExpiresByType application/javascript "access plus 1 month" ExpiresByType image/gif "access plus 1 month" ExpiresByType image/jpeg "access plus 1 month" ExpiresByType image/png "access plus 1 month" ExpiresByType image/x-icon "access plus 1 month" </IfModule> <ifmodule mod_headers.c> <filesmatch "\\.(ico|jpe?g|png|gif|swf)$"> Header set Cache-Control "max-age=2592000, public" </filesmatch> <filesmatch "\\.(css)$"> Header set Cache-Control "max-age=604800, public" </filesmatch> <filesmatch "\\.(js)$"> Header set Cache-Control "max-age=216000, private" </filesmatch> </ifmodule> # uid: test14, pw: test142018 (bsp.) #AuthType Basic #AuthName "Passwortgeschützter Bereich" #AuthUserFile /kunden/homepages/20/d273623727/htdocs/test03/name1/.htpasswd #require valid-user

Proposed htaccess
AddType x-mapp-php5 .php AddHandler x-mapp-php5 .php ##Options +FollowSymLinks RewriteEngine on ### automatischer language switch in Abhaengigkeit der eingestellten browser sprache AddType application/x-type-map var Options +MultiViews DirectoryIndex index.var ### eigene Error Pages installieren ## Multiple Choices 1und1 ErrorDocument 300 /error404.php ## nichtauthorisierter zugriffsversuch ErrorDocument 401 /name1/blabla/error401.php ## nichtauthorisierter zugriffsversuch ErrorDocument 403 /name1/blabla/error403.php ## angeforderte seite nicht gefunden ErrorDocument 404 /name1/blabla/error404.php ## wir haben seite geloescht ErrorDocument 410 /name1/blabla/error410.php ## wenn andere Browsersprachen eingestellt sind, die nicht unterstuetzt werden, z.B. spanisch - error406.php ist eine Kopie von index_en.php ErrorDocument 406 /name1/blabla/error406.php ### alles auf HTTPS umbiegen, wenn SSL #RewriteEngine On #RewriteCond %{HTTPS} off #RewriteRule (.*) https://%{HTTP_HOST}/$1 [R=301,L] ### doppelter Content weg RewriteCond %{HTTP_HOST} ^kommunikationmitkunst\.de$ [NC] RewriteRule (.*) http://www.kommunikationmitkunst.de/$1 [R=301] ### und alles auf das unterverzeichnis umbiegen RewriteCond %{HTTP_HOST} ^www\.kommunikationmitkunst\.de$ [NC] RewriteCond %{REQUEST_URI} !^/name1/blabla/ RewriteRule (.*) /name1/blabla/$1 [L] RewriteCond %{REQUEST_URI} !robots\.txt [NC] RewriteCond %{REQUEST_URI} !sitemap\.xml RewriteRule \.(log|ini|xml|inc|bak)$ - [R=404] # Deflate Compression by FileType <IfModule mod_deflate.c> AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE text/javascript AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/atom_xml AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/x-shockwave-flash </IfModule> # turns cache on for 1 month <IfModule mod_expires.c> ExpiresActive On ExpiresByType text/css "access plus 1 month" ExpiresByType text/javascript "access plus 1 month" ExpiresByType text/html "access plus 1 month" ExpiresByType application/javascript "access plus 1 month" ExpiresByType image/gif "access plus 1 month" ExpiresByType image/jpeg "access plus 1 month" ExpiresByType image/png "access plus 1 month" ExpiresByType image/x-icon "access plus 1 month" </IfModule> <ifmodule mod_headers.c> <filesmatch "\\.(ico|jpe?g|png|gif|swf)$"> Header set Cache-Control "max-age=2592000, public" </filesmatch> <filesmatch "\\.(css)$"> Header set Cache-Control "max-age=604800, public" </filesmatch> <filesmatch "\\.(js)$"> Header set Cache-Control "max-age=216000, private" </filesmatch> </ifmodule> # uid: test14, pw: test142018 (bsp.) #AuthType Basic #AuthName "Passwortgeschützter Bereich" #AuthUserFile [doc_root]/name1/.htpasswd #require valid-user