/* CSS CHC-online - Dreispaltig - Breite 1006px (gesamt) */ /* SLIDER über dem Fuss*/ .markenslider {float:none; clear:both; display:inline-block; width: 94%; margin: 2em auto 1em auto; padding: 1.5em 0 1em 0; border:1px solid rgba(0,0,0,.1);} .markenslider ul {display:table;} .markenslider li {display:table-cell; width: 10%; margin: 0 2%; padding: .25em;} .markenslider li a {text-decoration:none;} .markenslider li a p {font-size:.65em; line-height: 1.2em; color: #d8d8d8; margin: .5em 0; padding:0;} .markenslider li a img {width:auto; height:auto; max-height:44px;} /* ========== Tabellen ========== */ #TextBox table, #TextBox2 table {font-size: .98em; color: #5a5a5a; width: 100%; max-width: 563px; height:auto;} th h2 {color: #7A858B; font-weight:normal; margin: 0 0 .38em 0;} td h2 {font-size: 1.35em; color: #F79F19; font-weight: normal; margin: 0 0 .38em 0;} /*td {padding: .14em; border:none; margin:0;}*/ table.trendclick {font-size: 100%; color: #8c999f;} table.thead {font-size: 100%; margin: 0 0 1px 0; width: 100%;} table.subnavlogin {color: #95A0A6;} table#referenz {border: 2px solid aqua;} td.title a {font-size: 95%; color: #7B858B; font-weight:bold; line-height: 1.2em; margin:0; padding:0; text-decoration:underline;} /* Haupttabelle Hosting ------------------------------------------------------------------ */ table#tarife {color: #7A858B; width: 100%; max-width: 772px; margin:0; padding:0; border-radius: .7em; background-color: #f2f2f2; border: 1px solid #f9fafb; box-shadow: #cccccc 1px 1px;} /* Die beiden Klassen formatieren den Tableheader mit hellgrauem Hintergrund */ table#tarife th {color: #0000B4; text-align:center; padding: .35em .35em .35em .35em;} table#tarife th h3 {font-size: 1.1em; color: #778491; margin:0; padding: .45em 0 .31em 0; line-height: 1.1em;}/* Tabellenüberschrift grau*/ table#tarife td { margin:0; padding: 0.75em; line-height: 1.6em; border-bottom: 1px solid #F4F6F7; } /* Formatiert die Preise in der letzten Spalte rechts, zusammen mit den SPAN-Klassen */ table#tarife td.preis {line-height: 1.6em; margin:0; padding: .38em .63em 5px .38em;} /* Beide Klassen formatieren die Tarife in der ersten Spalte, "td.title" enthält das Hintergrundbild */ table#tarife td.title {color: #778491; font-size: .9em; width: 50%; margin:0; padding: .85em 0 .75em .953em; line-height: 1.2em;}/* background: url("pics/ly_bg_td_tarife.gif"); */ table#tarife td a {color: #0000b4; font-size: 1.35em; font-weight:bold; text-decoration:none; margin:0;} /*SOLVA Tarif links, blau*/ table#tarife td a.desc1 {color: #778491; font-size: 1em; font-weight:normal; text-decoration:underline; margin:0;} /* Zweite Tabelle Hosting ---------------- */ table#tarife2 {color: #7A858B; width: 558px; margin:0; padding:0; background:#EFEFF0;border-top-left-radius:.7em;border-top-right-radius:.7em;} /* Die beiden Klassen formatieren den Tableheader mit hellgrauem Hintergrund */ table#tarife2 th {color: #0000B4; font-size: 90%; margin:0; padding: 3px; border-right: 1px solid #f9fafb;} table#tarife2 th:first-child {padding: .3em .3em .3em 1.2em; width:50%} table#tarife2 th h3 {color: #778491; font-size: 110%; margin:0; padding: .5em .2em .35em .2em; line-height: 1.1em;} table#tarife2 td {line-height: 1.6em; margin:0; padding: 2px 0 0 3px; border-bottom: 1px solid #F4F6F7; border-right: 1px solid #F4F6F7;} table#tarife2 td.preis {line-height: 1.6em; margin: 0; padding: .45em .75em .45em .45em;} /* Beide Klassen formatieren die Tarife in der ersten Spalte, "td.title" enthält das Hintergrundbild */ table#tarife2 td.title {color: #0000b4; font-size: .97em; margin:0; padding: .75em .95em .75em 1.5em; line-height: 1.2em; background: url("pics/ly_bg_td_tarife.gif");} table#tarife2 td a {color: #0000b4; font-size: 110%; font-weight:normal; text-decoration:none; margin:0; padding: 3px 3px 3px 0;} /*Domaincheck in der rechten Infospalte ----------------*/ table#whois {color: #7A858B; padding:0; margin:0;} table#whois td.title {font-size: 130%; color: #0000b4; padding: 7px 0 7px 0;} table#whois td {font-size: 100%; color: #7A858B; padding: 7px 0 7px 0;} table#whois td h2 {font-size: 130%; color: #7A858B; font-weight:normal; margin:0;} table#whois td.small {font-size: 80%; color: #7A858B; padding: 7px 0 7px 0;} td.print_webspace, td.print_webspace2, td.print_webspace3, td.print_webspace4, td.print_webspace5 { font-family: 'Roboto'; font-size: 7pt; background-color: #ffffff; } table.print_article, td.print_article, td.print_article_cat, td.print_article2, td.print_article3, td.print_article4 { font-family: 'Roboto'; font-size: 8pt; background-color: #ffffff; } table.print_webspace, table.print_article {border: 1px solid #000;} td.print_webspace, td.print_article{border-bottom: 1px solid #000;} td.print_webspace2 {border-bottom: 0px solid #000;} td.print_webspace3, td.print_article2 {border-bottom: 1px solid #000; border-right: 1px solid #000;} td.print_webspace4, td.print_webspace5, td.print_article3 {border-bottom: 0px solid #000; border-right: 1px solid #000;} td.print_article_cat {color: #000; border-style: none; border-bottom: 1px solid #000; border-top: 0px solid #000;} td.print_article4 {border-bottom: 0px solid #000; border-right: 0px solid #000;} /* Listen ---------------- */ ul {list-style-image:none; margin:0; padding:0;} li {margin:0; padding:0; line-height: 1.2em;} .Infobox ul.cat, .Infobox ul.down, .Infobox ul.event, .Infobox ul.extlink, .Infobox ul.info, .Infobox ul.intlink, .Infobox ul.news, .Infobox ul.rect, .Infobox ul.misc {margin: 1.2em 0 .25em 1.6em; padding:0;} ul.cat, ul.down, ul.extlink, ul.info, ul.intlink, ul.misc, ul.news, ul.rect, ul.misc {margin: 1.2em 0 .25em 1.6em; padding:0;} li.cat {list-style: url("pics/ico_arrow.gif"); line-height: 1.3em;} ul.check {margin: 1.2em 0 .25em 2.15em; padding:0;} li.check {list-style-image: url("pics/ico_check.gif"); margin: 0 0 .25em .5em; padding:0; line-height: 1.2em;} li.down {list-style-image: url("pics/ico_down.gif"); margin: 0 0 .25em 0;} li.downpdf {list-style-image: url("pics/ico_down.gif"); margin: 0 0 .25em 0;} li.extlink {list-style: url("pics/ico_extlink.gif"); margin: 0 0 3px 0;} li.faq {list-style: url("pics/ico_arrow_5.gif"); margin: 5px 0 5px 0;} ul.home {list-style: none; margin: 5px 0 8px -17px; text-align: left;} li.home {list-style: url("pics/ico_square.gif"); margin: 0 0 .25em .63em; padding:0;} li.info {list-style: url("pics/ico_info.gif"); margin: 0 0 13px 0;} li.intlink {list-style: url("pics/ico_arrow.gif"); margin: 0 0 .25em 0;} li.news {list-style: url("pics/ico_news.gif"); margin: 0 0 .25em 0;} ul.pdf {list-style-image: url("pics/ico_pdf.gif"); margin: 5px 0 0 30px; line-height: 14px;} ul.page {margin: 0 0 3px 20px;} ul.pagesub {margin: 0 0 3px 30px;} li.rect {list-style: url("pics/ico_arrow.gif");} ol {margin: 0 0 0 27px;} /* border-radius: 10em / 5em; border-top-left-radius: 10em 5em; border-top-right-radius: 2em 5em; border-bottom-left-radius: 5em 5em; border-bottom-right-radius: 10em 5em; */ #TextBox ul.catyear {float:left; display:block; width: 100%; height: 3em; margin: 0 0 .75em 0; padding:0; height:auto;} #TextBox li.catyear {float:left; display:block; list-style:none; margin: 0 .3em .3em 0; padding: 0; line-height: 1.4em; min-width: 10%;} li.catyear a {float:left; display:block; color: #7A858B; text-decoration:none; font-size: 1.21em; font-weight:bold; margin:0; padding: .58em 1.05em .58em 1.05em; background-color: #EEEFF0;} li.catyear a:hover, li.catyear a.active {color: #ff9900;} ul.PBSubSubNav, li.PBSubSubNav {margin:0; padding:0;} /* Sitemap ---------------- */ .sitemap {float:none; clear:both; font-size: .8em; text-align:left; display:block; width: 100%; max-width: 600px; height:auto; margin:0; padding: 1.55em 0 1.55em 0; } ul.sitemap {display:block; margin: 0 0 0 1.75em; padding:0; height:auto; width: 100%;} ul.sitemap li ul {margin:0; padding:0; list-style:none;} ul.sitemap ul ul {margin:0; padding:0;} ul.sitemap li {list-style: url("pics/ico_arrow.gif"); line-height:1.2em; margin:0; padding: .1em 0 .1em 0;} ul.sitemap li li {margin: 0 0 0 1.3em;} ul.sitemap li li li {list-style-type:none; margin: 0 0 0 1.5em; font-size: 0.98em;} ul.sitemap li li li li {list-style-type:none; margin: 0 0 0 1.7em; font-size: 0.98em;} ul.sitemap li li li li li {list-style-type:none; margin: 0 0 0 1.9em; font-size: 0.98em;} .sitemap a{color: #525A6C; font-size: 1.2em; line-height: 1.2em; text-decoration:none; padding: .1em .2em .1em 0;} .sitemap a.active, .sitemap li li a.active, .sitemap li li li a.active {text-decoration:underline; list-style-type:none;} .sitemap a:hover {text-decoration:underline;} ul.symbol { float:left; display:block; list-style-type:none; width:100%; max-width: 960px; margin: 1.2em 0 1.25em 0; padding:0; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; border-bottom:1px solid rgba(0,0,0,.51); } ul.symbol li { list-style-type:none; float:left; min-height:60px; height:auto; max-width: 47%; margin: .4em .75em .4em 0; padding:0; -webkit-flex-grow: 1;flex-grow: 1;-webkit-flex-basis:auto; flex-basis:auto; background-color:rgba(246,246,246,.0); } ul.symbol li img {float:left; clear:none; width:20%; max-width:50px; height:auto; margin: 0 0 .0em 0; padding: 0 1em .1em 0;} ul.symbol li h2 {float:left; clear:none; color:#000099; line-height: 1.2em; text-decoration:none; max-width:70%; height:auto; margin:0; padding: .5em 0 .35em 0;} ul.symbol li h3 {float:left; clear:none; color:#000099; line-height: 1.2em; text-decoration:none; max-width:70%; height:auto; margin:0; padding: .5em 0 .35em 0;} ul.symbol li p {float:left; clear:none; min-height:50px; height:auto; max-width:70%; padding: 0 .25em .25em 0; margin:0;} /* Formulare ----------------------------- CHC ------------------------------------------------------------------------------------------------- */ input, select {outline:none;} input.form, input.formsearch, input.formloginnav, textarea.form, select.form, input#Ort, input#PLZ, input#Senden, input.domain, select.domain form.form_faq_search input#search { font-family: 'Roboto'; background-color: #fff; border-left: 1px solid #CBD7DE; border-top: 1px solid #CBD7DE; border-right: 1px solid #E9F3F9; border-bottom: 1px solid #E9F3F9; } form {margin: .5em 0 .5em 0; padding:0;} form.trendclick {margin: 0;} /* Kontaktformular ---------------- */ form#Kontakt {width: 90%;} form#Kontakt label {float:left; display:block; width: 25%; max-width: 120px; margin-right: 0.5em; line-height: 1.5em;} form#Kontakt input.form {font-size: 1em; line-height: 1.55em; height: 1.65em; width: 60%; max-width: 350px; margin: 0 0 0.55em 0; } form#Kontakt label.radio {display:block; width: 25%; max-width: 120px; margin: 0 0 .5em 0;} .clear {float:none; clear:both;} form#Kontakt input#PLZ {width: 10%; max-width: 50px; margin: 0 .15em 0 0;} form#Kontakt input#Ort {min-width:200px; width: 44%; max-width: 265px;} form#Kontakt input#Land {width: 10%; max-width: 20px;} form#Kontakt select.form {font-size: 100%; line-height: 24px; width: 60%; max-width: 355px; height: 1.7em; margin: 0 0 0.5em 0;} input:required, input.form:required {background: url("pics/ex.gif")top right no-repeat; background-color: rgba(255,255,255,1);} textarea:required, textarea.form:required {background: url("pics/ex.gif")top 2px right 20px no-repeat;} :invalid {outline:none; box-shadow:none;} label {float:left; display:block; width: 25%; max-width: 120px; margin-right: 0.5em; line-height: 1.5em;} textarea.form, select.form {border-left: 1px solid #CBD7DE; border-top: 1px solid #CBD7DE; border-right: 1px solid #E9F3F9; border-bottom: 1px solid #E9F3F9;} textarea.form {font-family: 'Roboto'; font-size: 1em; width: 60%; max-width: 350px;} form.form_faq_search {clear:both; float:none; margin: 0 0 1.25em 0; min-width: 60%; width: 100%; max-width: 400px;} form.form_faq_search label {width: 20%;} form.form_faq_search input#search {line-height: 1.4em; width: 70%; max-width: 300px; height:auto; margin:0; padding: .25em; background-color: #fff;} /* ----------- Buttons -------*/ form#Kontakt input#Senden, button#Info, .button, input#Pruefen { color: #fff; cursor:pointer; font-size: 1.13em; line-height: 1.4em; text-decoration:none; white-space:pre; display:inline-block; min-width: 3em; width:auto; height:auto; border-radius: .55em; border-left: 1px solid #F29100; border-top: 1px solid #F29100; border-right: 1px solid #CC7A00; border-bottom: 1px solid #CC7A00; } .button {height: 1.6em; margin:.5em .15em .75em .15em; padding: .15em 1.6em .1em 1.6em;} form#Kontakt input#Senden, button#Info, input#Senden{height: 2em; margin: .5em .15em .75em .15em; padding: .15em 1.6em .4em 1.6em;} /* ----------- Domaincheck -------*/ form.form_whois input {width: 96%; height: 1.8em;} form.form_whois input#Pruefen {height: 1.8em; width: 96%; margin: .5em .15em .75em .15em; padding: .15em 0 .2em 0;} #tarife a.button { font-size: 1.015em; color: #fff; line-height: 1.2em; font-weight:normal; text-decoration:none; border-radius: .35em; box-shadow: 0px 4px 10px #4053D5 inset, 0px 1px 2px #999; padding: .15em .95em .15em .95em; border-left: 1px solid #0000cc; border-top: 1px solid #0000cc; border-right: 1px solid #000099; border-bottom: 1px solid #000099; background-image: linear-gradient(to top, #000099 0%, #0000CC 72%); background-image: -o-linear-gradient(bottom, #000099 0%, #0000CC 72%); background-image: -moz-linear-gradient(bottom, #000099 0%, #0000CC 72%); background-image: -webkit-linear-gradient(bottom, #000099 0%, #0000CC 72%); background-image: -ms-linear-gradient(bottom, #000099 0%, #0000CC 72%); background-image: -webkit-gradient(linear, bottom left, top left, color-stop(0, #000099),color-stop(0.72, #0000CC)); } /* Ueberschriften ------------- */ h1 {font-size: 1.98em; color: rgba(122,133,139,1); font-weight:normal; line-height: 1.2em; margin: .1em 0 .35em 0;} h1 a {text-decoration:none; color: #ff9900;} h1 a:hover {text-decoration:underline;} h1.home {font-size: 2.41em; color: rgba(251,151,0,1); font-weight:normal; line-height: 1.2em; margin: 0 0 .25em 0; text-align: left;} h2 {font-size: 1.35em; color: #7A858B; font-weight:normal; line-height: 1.2em; margin: 0 0 .38em 0;} h2.home {font-size: 1.5em; color: #7A858B; font-weight:normal; line-height: 1.2em; margin: 0 0 1.75em 0; text-align: left;} h3 {font-size: 1.1em; color: rgba(251,151,0,1); font-weight:normal; line-height: 1.2em; margin: 0 0 .5em 0;} li.home h3 {font-size: 95%; color: #5a5a5a; font-weight: normal; margin: 0 0 1px 0; padding: 0 0 0 3px;} h4 {font-size: 1.15em; border-bottom: 1px solid #e3e3e3; line-height: 1.2em;} h5 {font-size: .95em; color: #ff9900; font-weight: normal; margin:0; line-height: 1.2em;} /*Absatz ---------------- */ p {font-size: 100%;} p.just {font-size: 100%; text-align:justify;} p.small {font-size: 0.75em;} /* Links ---------------- */ a {text-decoration: underline; color: #5a5a5a;} a.boxlink {text-decoration: none; color: #5a5a5a;} a.boxlink:hover {text-decoration: underline; color: #8c999f;} a.foot {text-decoration: none; color: #ACBFCA;} /* Span ---------------- */ span.sollogo {color: #0000cc; font-weight: normal;} span.solprod {color: #808080; font-weight: normal;} span.contentsm {text-align: justify; font-size: .8em;} span.tarif {font-size: 1.3em; font-weight:normal; color: #5F8EB7; text-align:center; line-height: 1.6em; margin:0; padding:0;} span.preis {font-size: 1.7em; font-weight:bold; color: #5F8EB7; text-align:center; line-height: 1.6em; margin:0; padding:0;} span.preis2 {font-size: 1.1em; font-weight:bold; color: #7B858B; text-align:center; line-height: 1.1em; margin:0; padding:0;} /*Preis rechts*/ span.preis3 {font-size: .8em; font-weight:normal; color: #7B858B; text-align:center; line-height: .95em; margin:0; padding:0;} span.desc1 {font-size: .885em; font-weight: normal; color: #7B858B; text-align: center; margin:0;} /* Span -- spezielle Textformatierung ----------------*/ span.title {color: lime; font-weight:normal; font-size: 130%;} span.title2 {font-size: 1.35em; color: #7A858B; font-weight:normal; margin: 0 0 .38em 0;} span.title3 {color: pink; font-weight:bold; font-size: 90%;} span.content {color:MediumTurquoise; text-align:justify;} /* Linie ----------------*/ hr.home {border: 1px solid #fff; height: 1px;} hr.col {border:0; border-bottom: 1px solid #F79F19; margin: 0 0 10px 0; height: 1px;} /* ========== Rahmen um die Bilder ========== */ .picright {float:right; padding:0; margin:.5em;} .picleft {float:left; padding:0; margin: 0 0 0 0;} .center {width:100%; text-align:center;} /* Druckansicht */ #WrapInfoPrint {visibility:hidden;display:none;width:0;height:0;margin:0;padding:0;} #FotobannerPrint {visibility:hidden;display:none;width:0;height:0;margin:0;padding:0;} #PBackground2Print {visibility:hidden;display:none;width:0;height:0;margin:0;padding:0;} #SubNavBoxPrint {visibility:hidden;display:none;width:0;height:0;margin:0;padding:0;} #PCPrint {background-color:#fff} #PBPrint {width:100%; background: #fff;text-align:left;} #PBPrint #TextBox {width:100%;} #PBPrint #TextBox2 {width:100%;} /* Pfeile ----------------*/ .arrow {border: 6px solid #fff; font-size:0; line-height:0; height:0; width:0; padding:0; margin: 4px 0 0 8px; display:inline-block;} .arrow.right {border-top-color:transparent; border-right-color:transparent; border-bottom-color:transparent;} .arrow.left {border-top-color:transparent; border-bottom-color:transparent; border-left-color:transparent;} .arrow.up {border-top-color:transparent; border-right-color:transparent; border-left-color:transparent;} .arrow.down {border-right-color:transparent; border-bottom-color:transparent; border-left-color:transparent;} /*=========================================================================================================================================================== --- Screen --- Breite in der Mitte zentriert auf 1006 --- CHC-online ==========================================================================================================================================================*/ /* @media only screen and (min-width: 990px){ */ /* END MEDIA QUERIE } */ /* ========== SLIDER ========== this container is just to ensure the background color stretches all the way across on bigger screens */ #PBackground1 {width: 100%; height:auto; margin: 140px 0 0 0; padding:0;} #sequence {color:#fff; margin: 0 auto 0 auto; padding:0; width: 100%; min-height: 300px; height:100%; position:relative; overflow:hidden;} #sequence > .sequence-canvas {height: 100%; width: 100%; margin:0; padding:0; } #sequence > .sequence-canvas > li {position: absolute; width: 100%; height: 100%; z-index: 1; top: 0;} #sequence > .sequence-canvas > li img {height:auto; width:100%; top:0;} #sequence > .sequence-canvas li > * {/* only cause the left and opacity properties to transition */ position:absolute; -webkit-transition-property: left, opacity; -moz-transition-property: left, opacity; -ms-transition-property: left, opacity; -o-transition-property: left, opacity; transition-property: left, opacity; } .sequence-next, .sequence-prev {color:white; cursor:pointer; display:none; font-weight:bold; padding:0; position:absolute; top:0; z-index: 1000; height: 0px; margin-top:0; } .sequence-pause {bottom:0; cursor:pointer; position:absolute; z-index: 1000;} .sequence-paused {opacity: .1;} .sequence-prev {left: 3%;} .sequence-next {right: 3%;} .sequence-prev img, .sequence-next img {display:none; height:0%; width:0; z-index:500;} #sequence-preloader {background: #d9d9d9;} .sequence-pagination { bottom: 33px; left:48%; display:none; position:absolute; z-index: 10; -webkit-transition-duration: .5s; -moz-transition-duration: .5s; -ms-transition-duration: .5s; -o-transition-duration: .5s; transition-duration: .5s; } .sequence-pagination li {display:inline-block; height: 15px;/* Hack for IE7 and below as they don't support inline-block */} .sequence-pagination li img { cursor:pointer; opacity: 0.5; -webkit-transition-duration: 1s; -moz-transition-duration: 1s; -ms-transition-duration: 1s; -o-transition-duration: 1s; transition-duration: 1s; -webkit-transition-property: margin-bottom, opacity; -moz-transition-property: margin-bottom, opacity; -ms-transition-property: margin-bottom, opacity; -o-transition-property: margin-bottom, opacity; transition-property: margin-bottom, opacity; } .sequence-pagination li img:hover {margin-bottom:0; -webkit-transition-duration: .3s; -moz-transition-duration: .3s; -ms-transition-duration: .3s; -o-transition-duration: .3s; transition-duration: .3s;} .sequence-pagination li.current img {opacity: 1;} .sequence-next, .sequence-prev {position:absolute; opacity: .6; -webkit-transition-duration: 1s; -moz-transition-duration: 1s; -ms-transition-duration: 1s; -o-transition-duration: 1s; transition-duration: 1s;} .sequence-next:hover, .sequence-prev:hover {opacity: 1; -webkit-transition-duration: 1s; -moz-transition-duration: 1s; -ms-transition-duration: 1s; -o-transition-duration: 1s; transition-duration: 1s;} #PBackground1 li h2 {font-size: 2.5em; text-align:left; font-family: "Roboto"; color: #7A858B; font-weight:600; line-height:1.2em; margin: 0 0 .1em 0; opacity: 1;} #PBackground1 li h3 {text-align:left; font-family: "Roboto"; font-weight: normal; color: #7A858B; font-size: 1.75em; line-height: 1.2em; margin: 0 0 .1em 0; padding:0; } #PBackground1 li a {font-family: "Roboto"; color: #7A858B; font-size: 1.15em; line-height: 1.2em; padding:0;} .text {left: 100%; text-align:left; bottom: 83px; width:auto; max-width:600px; padding: .75em 1.5em 1.25em 1.5em; z-index: 500; background-color: rgba(255,255,255,.85);} .animate-in .text {left: 19%; opacity: 1;} .animate-out .text {left: 19%; opacity: .2;} .animate-in .text, .animate-out .text {-webkit-transition-duration: .001s; -moz-transition-duration: .001s; -ms-transition-duration: .001s; -o-transition-duration: .001s; transition-duration: .001s;} /* prevents the model from shrinking when the browser is resized *//* max-height: 568px !important; */ .model {left: -0%; bottom: -48%; opacity: 0; position:relative; height:auto !important; width: 100%; min-width: 800px; height:auto;} .animate-in .model {left: 0%; opacity: 1; -webkit-transition-duration: 1s; -moz-transition-duration: 1s; -ms-transition-duration: 1s; -o-transition-duration: 1s; transition-duration: 1s;} .animate-out .model {left: 0%; opacity: 0; -webkit-transition-duration: .5s; -moz-transition-duration: .5s; -ms-transition-duration: .5s; -o-transition-duration: .5s; transition-duration: .5s;} /* ========== BODY | Content ========== */ img {border:0; -ms-interpolation-mode:bicubic; vertical-align:middle;} html {font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;} body {font-family: 'Roboto'; font-size: 100%; font-style:normal; color: #5a5a5a; height:101%; margin:0; padding:0; background-color: rgba(111,120,125,1); } #PBody {display:inline-block; margin: 0 auto 0 auto; text-align:center; padding:0; width:100%; min-height:101%; background-color: #fff; position:relative;} /* ========== Pagehead ========== */ #PH, form#Kontakt input#Senden, button#Info, .button, input#Senden, input#Pruefen { background-image: linear-gradient(#CC7A00 0%, #F29100 1%, #FFB23E 100%); background-image: -o-linear-gradient(bottom, #CC7A00 0%, #F29100 1%, #FFB23E 100%); background-image: -moz-linear-gradient(bottom, #CC7A00 0%, #F29100 1%, #FFB23E 100%); background-image: -webkit-linear-gradient(bottom, #CC7A00 0%, #F29100 1%, #FFB23E 100%); background-image: -ms-linear-gradient(bottom, #CC7A00 0%, #F29100 1%, #FFB23E 100%); background-image: -webkit-gradient(linear, bottom left, top left, color-stop(0, #CC7A00), color-stop(0.01, #F29100), color-stop(1, #FFB23E) ); } #PH {margin:0; padding:0; width: 100%; height: 140px; border-bottom: 1px solid #FFCA79; box-shadow: #b5b5b5 1px 1px 1px; position:fixed; z-index: 1500;} #PHTop {float:none; clear:both; margin: 0 auto 0 auto; padding:0; width: 100%; height: 144px;} #LogoBox {float:left; clear:none; width:auto; height:auto; margin: 2.15em 0 0 2%; padding:0;} #WrapPH, .move #PH, #LogoBox, #LogoBox img, #PHTop, #MainNav ul, #MainNav, #MainNav>li, #MainNav>li>a, #PBSubNavLoginBox, #PBSubNavSearchBox, #PBSubNavSearchBox form#form_search, #LoginBox {transition: all 0.9s ease-in;} #WrapPH.move {} .move #PH {height: 60px; z-index:3000;} .move #PHTop {height: 60px;} .move #LogoBox {transform:scale(.8); margin: .75em 0 .15em 1.8%; padding:0; width:140px; height:auto;} .move #LogoBox img {width:98%; height:auto;} .move #FuncNav {width: 190px; max-width:190px; height:auto; margin: .75em 2% .5em 0; padding:0;} .move #FuncNav li {display:table-cell; text-align:right; transform:scale(.9); min-width:20px; width:.85%;} .move #FuncNav li:first-child {min-width:20px; width: 20%; margin: .25em 0 0 0;} .move #FuncNav a .visibility, .move #FuncNav a.phone {display:none; font-size:0em;} .move #LoginBox {width:100%; top:60px;} .move #PBSubNavSearchBox {width:100%; max-width: 100%; right:0px; top: 60px; padding:0;} .move #PBSubNavSearchBox form#form_search {margin: .45em 0 .45em 0;} .move #PBSubNavSearchBox form#form_search input {float:left; clear:none; line-height: 1.05em; margin:0; padding: 0 0 .1em 0;} .move #PBSubNavSearchBox form#form_search input.formsearch {font-size: 1.1em; width: 80.2%; margin:0;} .move #PBSubNavSearchBox form#form_search input#Arrow {padding: 0 .25em; font-size: 1.6em;} .move #MainNavBox {float:left; clear:none; width: 48%; margin: .95em .1em 0 0; padding: .1em 0 0 0;} .move #MainNav {float:left; clear:none;} .move ul#MainNav {display:inline-block; width:100%; max-width: 900px;} .move #MainNav>li { margin: 0; padding:0; min-width:80px; width:3.65%;} .move ul#MainNav>li:nth-child(1){min-width:250px; margin: 0 2% 0 0;} .move #MainNav>li>a {font-size: 1.2em; line-height: 1.25em; height: 1.95em; margin:0; padding: .05em .7241em .05em .741em;} .move ul#MainNav li ul>li>a{font-size: .95em; line-height: 1.15em; padding: .18em 0 .18em .95em; margin: 0 0 .1em 0; width: 100%;} .move ul#MainNav>li:hover>ul{display:block; margin:0; padding: .75em .75em .6em .55em;} /* Funktions Navigation - Head oben rechts ------------------------------------------------------------------------------------------------- */ #FuncNav {float:right; clear:none; text-align:left; width: 69%; height:auto; margin: .1em 3% .5em 0; padding: .25em 0 0 0;} #FuncNav ul {float:right; display:table; height:auto; width: 95%; margin:0; padding:0;} #FuncNav li {display:table-cell; vertical-align:middle; text-align:right; list-style:none; margin:0; padding:0; min-width:150px; width:4.5%;} #FuncNav li:first-child {min-width:170px; width: 20%; margin: .25em 0 0 2%;} #FuncNav a {display:inline-block; text-decoration:none; font-size: 1.11em; font-weight:normal; color: #ffffff; width:auto; padding:0;} #FuncNav a:hover {text-decoration:underline; font-weight:normal; color: #ffffff;} #FuncNav a img {width:auto; height:auto; margin: 0 .65em 0 0;} #suche_einblenden, #login_einblenden { transition: all 0.5s ease-in; visibility:visible; display:block; float:right; position:relative; font-size:2em; line-height:1em; font-weight:bold; text-decoration:none; color: #194B8C; width:auto; height:auto; margin: .1em .25em 0 0; padding:0; z-index:1000; } /* Suche - wird eingeblendet*/ #PBSubNavSearchBox {display:none; float:right; clear:none; width:100%; top: 140px; padding:0; position:absolute; background-color: #FCC87A; border-top: 0px solid #F9A21F; border-left: 0px solid #F9A21F; border-bottom: 1px solid #F29201; border-right: 0px solid #F29201; z-index:2500;} #PBSubNavSearchBox form#form_search {clear:none; float:right; width: 100%; max-width: 400px; height:35px; margin: .45em 1.5% .45em 0; padding:0;} #PBSubNavSearchBox form#form_search input { float:left; clear:none; line-height: 1.05em; height:36px; margin:0; padding: 0 0 .1em 0; background-color: rgba(255,255,255,1); border-top: 1px solid rgba(253,166,34,1); border-bottom: 1px solid rgba(253,166,34,1); border-right: 1px solid rgba(253,166,34,1); border-left: 0px solid rgba(253,166,34,1); } #PBSubNavSearchBox form#form_search input.formsearch { font-size: 1.1em; width: 85.2%; height:23px; margin:0; padding: .3em; color:rgba(21,72,158,1); border-top: 1px solid rgba(253,166,34,1); border-bottom: 1px solid rgba(253,166,34,1); border-left: 1px solid rgba(253,166,34,1); border-right: 0px solid rgba(253,166,34,1); } #PBSubNavSearchBox form#form_search input#Arrow {height:36px; padding: 0 .35em; font-size: 1.7em; color: rgba(248,148,3,1);} /* ========== NAVIGATION horizontal ========== */ #MainNavBox {float:right; clear:both; height:auto; width: 100%; margin: .5em 0 0 0; padding:0;} #MainNav {float:right; display:inline-block; height:auto; text-align:right; width:100%; margin:0; padding:0;} /* erste Ebene */ ul#MainNav {display:inline-block; width:95%; max-width: 950px; margin:0; padding:0;} ul#MainNav>li {display:table-cell; list-style-type:none; text-align:center; width:20%; padding:0; margin:0; min-height:1.55em;} /*Listpunkte erste Ebene (Bereiche) */ ul#MainNav>li:nth-child(1){min-width:300px; margin: 0 2% 0 0;} #MainNav>li>a {display:block; font-size: 1.55em; color: rgba(255,255,255,1); text-decoration:none; line-height: 1.55em; font-weight:500; margin:0; padding:0;} ul#MainNav>li:hover>a {color: rgba(255,255,255,1)!important; text-decoration:underline;} /* hovert den Link der ersten Ebene */ ul#MainNav>li>a.active {text-decoration:underline;} /* ausgewählter Link */ /*hovert die zweite Ebene (das Untermenü) */ /* Aufklappmenue - Rahmen und BG float:left;*/ ul#MainNav ul {display:none; margin:0; padding:0; position:absolute;} ul#MainNav>li:hover>ul{ display:block; margin:0; padding: .15em .75em .6em .95em; min-width: 220px; width:auto; background-color: #F29301; border-top: 1px solid #F29301; border-left: 1px solid #FFB23E; border-right: 1px solid #DF8600; border-bottom: 1px solid #DF8600; border-bottom-left-radius: .4em; border-bottom-right-radius: .4em; box-shadow: rgba(90,111,165,1) 1px 1px 2px; z-index: 500; } /* ul#MainNav>li:last-child:hover>ul{right:0;} */ .touch ul#MainNav>li:hover>ul{display:block;} /* zweite Ebene */ ul#MainNav li ul>li{float:none; list-style-type:none; text-align:left; padding:0; margin:0; height:auto;} ul#MainNav>li:first-child ul li {padding:0} ul#MainNav>li:first-child ul li a {padding: 0 0 0 .85em; margin: .15em 0 .35em 0; width: 100%;} ul#MainNav li ul>li>a{ display:block; color: #fff; font-size: .995em; line-height: 1.2em; text-decoration:none; background: url("pics/ly_bt_main_down.png") top left no-repeat; padding-left: .85em; margin: 0 0 .35em 0; width: 100%; } ul#MainNav li ul>li>a.active, ul#MainNav li ul>li>a:hover{text-decoration:underline; color: #fff; background: url("pics/ly_bt_main_down_active.png") top left no-repeat; z-index: 500;} /* weitere Ebenen */ ul#MainNav>li ul>li:hover>ul{ display:block; margin: -1.95em 0 0 218px; padding: 1.75em .75em .95em .75em; min-width: 215px; width:auto; height:auto; z-index: 500; background-color: #F29301; border-left: 1px solid #FFB23E; border-right: 1px solid #DF8600; border-bottom: 1px solid #DF8600; border-radius: .4em; box-shadow: #DF8600 -1px 1px; z-index: 500; } ul#MainNav>li ul>li:last-child:hover>ul{right:218px;} ul#MainNav>li ul>li>ul>li>a {padding: 0 0 0 .85em; margin:0; width:100%; display:block;} /* clearfix */ #MainNav:after {content: "."; display:block; clear:both; visibility:hidden; line-height:0; height:0;} html[xmlns] #MainNav {display:block; z-index: 500;} /* ========== Ausgeblendet auf Screen und Tablet ========== */ #MobBox, #SubNavMobHead, #SubNavMob {visibility:hidden; display:none; width:0; height:0; margin:0; padding:0;} /* ========== SUBNAVIGATION vertikal ========== */ #SubNavBox {position:relative; float:left; text-align:left; margin: 3.36em 1% 0 2.1%; padding:0; width: 20%; max-width: 215px; height:auto;} #SubNav {display:block; width: 95%; margin: 0 .38em 0 0; padding:0;} #SubNav ul{display:block; margin:0; padding:0; height:auto; width: 100%;} ul#SubNav li ul, ul#SubNav ul ul {margin:0; padding:0;} ul#SubNav li {list-style-type:none; display:block; margin: 0 0 .45em 0; padding:0;} ul#SubNav li:last-child {padding: 0 0 .9em 0;} ul#SubNav li li {list-style-type:none; margin: 0 0 0 .95em;} ul#SubNav li li:first-child {padding-top: .25em;} ul#SubNav li li:last-child {padding-bottom: .25em;} ul#SubNav li li li {list-style-type:none; margin: 0 0 0 1em;} #SubNav a {display:block; color: #7B858B; font-weight:normal; text-decoration:none; font-size: 1em; line-height: 1.2em; margin:0; padding: 0 0 0 .75em;background: url("pics/ly_bt_subnav.png") top left no-repeat;} #SubNav a.active, #SubNav li li a.active, SubNav li li li a.active {color: #FF9900; background: url("pics/ly_bt_subnav_active.png") top left no-repeat;} #SubNav a:hover {color: #FF9900; background: url("pics/ly_bt_subnav_active.png") top left no-repeat; text-decoration:underline;} /* ========== Contentbereich ========== */ #PC { float:left; clear:none; text-align:center; min-height: 400px; height:auto; width: 100%; margin:0; padding:0; position:relative; border-top: 1px solid #DBE8F0; background: url("pics/ly_bg_pbody_2px.png") repeat-x; } /* -- Drucken -- */#PBPrint {font-size: 100%; margin: 10px 0 0 15px; position: relative; background-color:#fff;} /* -- Drucken -- */#TextBoxPrint {font-size: 75%; width: 740px; margin: -175px 0 0 0; padding: 0 0 25px 0; float:left;} #PBackground2 {width:100%; height:auto; margin: 140px 0 0 0; background-image: linear-gradient(to right, #FFFFFF 50%, #E7F1F8 50%);} #Fotobanner {width: 100%; height:auto; text-align:right; margin: 0 auto 0 auto;} #Fotobanner img {width:auto; height:auto; margin:0;} #stopper { position:absolute; width:65px; height:auto; top:200px; right:0px; margin:0; padding: .15em 10px 0 5px; background-color: rgba(255,255,255,.0); color: black; transition: all 0.5s ease-in; z-index:200; text-align:left; } #stopper p {display:table-row; font-weight:bold; width:auto; height:42px; margin: 0 .35em .5em 0; padding: 0 .05em 0 0;} #stopper p a{display:inline-block; width:auto; margin: 0 0 .15em 0; color: rgba(255,255,255,.9); font-size: 1.21em; line-height: 1.6em; text-decoration:none; vertical-align:middle;} #stopper p img {float:left; vertical-align:middle; width:auto; height:auto; padding: .65em .5em; margin:0; background-color: rgba(241,241,239,.65);} #stopper p a img:hover {background-color: rgba(255,255,255,1);} #PB {float:none; clear:both; display:inline-block; text-align:center; color: #5a5a5a; padding: 2.65em 0 0 0; margin: 0 auto 0 auto; height:auto; width: 100%;} #TextBoxHome {display:inline-block; height:auto; text-align:left; line-height:1.22em; width: 98%; margin: 0 auto 2.9em 1%; padding: 0 0 .75em 0;} #TextBox, #TextBox2 {text-align:left; float:left; clear:none; line-height:1.22em; margin: 0 0 2.9em 0; padding: 0 0 .75em 0; height:auto;} #TextBoxHome h1 {font-size: 2.325em; color: #A2AAB0; font-weight:normal; text-align:center; width:100%; margin: 0 0 20px 0;} #TextBoxHome h2 {text-align:center; width:80%; margin: 0 auto 1.5em auto;} #WrapTextInfo {float:left; clear:none; width:65%; margin: 0 0 0 2%;}/* Box für Aktuellen Meldungen Startseite - WrapInfoBox bleibt sonst unten! */ #TextBoxHome .TextInfoBox {float:left; clear:none; display:inline-block; text-align:left; margin: 2.5em 0 0 0; padding: 0 0 1.15em 0; width:100%; border-bottom: 1px solid #E8EEF4;} #TextBoxHome .TextInfoBox h2 {font-family: 'Roboto Condensed', sans-serif; font-weight: 400; text-align:left; width:100%; margin: 0 0 .5em 0; padding:0;} #TextBoxHome .TextInfoBox h2 a {text-decoration:none; font-size: 1.315em; color: rgba(251,151,0,.8); margin: 0 0 2.25em 0;} #TextBoxHome .TextInfoBox h2 a:hover {text-decoration: underline;} #TextBoxHome .TextInfoBox p {margin: 0 0 0 .25em; padding: 3px 0 8px 0; text-align: left; line-height: 1.2em;} #TextBoxHome .TextInfoBox ul {margin: 0 0 0 1.6em; padding:0;} #TextBox {padding:0; width: 60%;} #TextBox span.sollogo, #TextBox2 span.sollogo {color: #0000cc; font-weight:normal;} #TextBox span.solprod, #TextBox2 span.solprod {color: #808080; font-weight:normal;} .picleft {float:left; clear:none; width:auto; margin: .25em .5em .5em .5em; padding: .05em;} .picright {float:right; clear:none; width:auto; margin: .25em .5em .5em .5em; padding: .05em;} /* IMAGES ----------------*/ table img, table img a {width:auto; height:auto;} input.image {width:auto; height:auto;} /* ========== Infobox innerhalb des Contentbereiches-Mitte ========== */ .TextInfoBox {float:left; display:block; margin: 1.5em 0 1.5em 0; padding: 0 0 1.5em 0; width: 100%; height:auto; border-bottom: 0px solid #E8EEF4;} .TextInfoBox h2 {text-decoration: none; font-size: 1.2em; color: #ff9900; font-weight:normal; margin: 0 0 .95em 0;} /* ========== Textbox ohne Infobox ========== */ #TextBox2 {text-align:left; padding:0; margin:0; width: 79%; height:auto;} #TextBox2 table{font-size: .95em; min-width: 80%; width: 100%;} /* #TextBox table img, #TextBox2 table img {width:auto; height:auto;}*/ #TextBox ul.extlink, #TextBox2 ul.extlink {margin: 5px 0 8px .75em; padding:0; text-align:left;} #TextBox ul.extlink li, #TextBox2 ul.extlink li {margin: 0 0 .25em .75em; padding:0;} .flexbox {width:97%; display: -webkit-flex; display:flex; -webkit-flex-direction:row; flex-direction:row; -webkit-flex-wrap:wrap; flex-wrap:wrap; margin: 0 0 1.5em 2%;} /* Content Home - 3 Spalten ------------------------------------------------------------------------------ */ #Col1, #Col2, #Col3, #Col4, #Col5, #Col6 { -webkit-flex-grow: 1; flex-grow: 1;-webkit-flex-basis:auto; flex-basis:auto; float:left; text-align:center; width: 29.6%; height:auto; margin: 0 1.75% 2em 0; padding: 1.5em 0 0 0; background-color: rgba(255,255,255,1); border-left:1px solid rgba(173,181,183,.7); border-top:1px solid rgba(173,181,183,.7); border-right:1px solid rgba(173,181,183,.7); } /* #Col3, #Col6 {margin: 0 0 2em 0;}*/ #Col1 h2, #Col2 h2, #Col3 h2, #Col4 h2, #Col5 h2, #Col6 h2 {margin: 1em .5em .5em .5em; padding:0; width:100%;} #Col1 h2 a, #Col2 h2 a, #Col3 h2 a, #Col4 h2 a, #Col5 h2 a, #Col6 h2 a { font-family: 'Roboto Condensed', sans-serif; float:none; text-align:center; display:block; font-size: 2.25vw; min-height: 1em; width:auto; color: rgba(122,133,139,1); font-weight:300; line-height: 1.2em; margin:0; padding:0; text-decoration:none; } #Col1 a, #Col2 a, #Col3 a,#Col4 a, #Col5 a, #Col6 a {width:96%; text-align:center; margin:0; padding:0;} #Col1 a img, #Col2 a img, #Col3 a img, #Col4 a img, #Col5 a img, #Col6 a img {width:auto; height:auto; margin: 1em auto .5em auto; padding:0;} #Col1 p, #Col2 p, #Col3 p, #Col4 p, #Col5 p, #Col6 p {font-size: 1em; text-align:center; line-height: 1.2em; margin: 0 auto 1.5em auto; padding:0; width: 80%; min-height: 5em;} #Col1 a.button, #Col2 a.button, #Col3 a.button, #Col4 a.button, #Col5 a.button, #Col6 a.button {float:none; display:block; font-size: 1.65vw; line-height: 1.75em; width:100%; margin: 0 auto 0 auto; padding: .05em .0em .15em .0em; border-radius:0;} #Col4 a.button, #Col5 a.button, #Col6 a.button {border:1px solid #0000CC; background-image: linear-gradient(#000099 0%, #0000CC 72%); background-image: -o-linear-gradient(bottom, #000099 0%, #0000CC 72%); background-image: -moz-linear-gradient(bottom, #000099 0%, #0000CC 72%); background-image: -webkit-linear-gradient(bottom, #000099 0%, #0000CC 72%); background-image: -ms-linear-gradient(bottom, #000099 0%, #0000CC 72%); background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #000099),color-stop(0.72, #0000CC));} .PBCFormBoxLeft {float:left; width: 220px; text-align: right; padding: 0 1em 0 0; margin:0; color: #666;} .BoxRight {width: 280px; text-align:left; padding:0; margin:0; float:right;} /* Auswahlfelder(Button) auf Übersichtsseite / Bestellung ----- und ---- Übersichtsseite Leistungen Box mit Icon ----------------------------------------------- */ .TextInfoBox .flex { float:left; clear:none; width:100%; margin: .5em 0 .5em 0; padding:0; display:-webkit-flex; display:flex; -webkit-flex-direction:row; flex-direction:row; -webkit-flex-wrap:wrap; flex-wrap:wrap; } /* Übersichtsseite Leistungen Box mit Icon ---------------------------------------------------------------- */ #TextBox .TextInfoBox ul.flex {margin: 0; padding:0; width:100%;} .TextInfoBox .flex li { float:left; clear:none; list-style-type:none; font-weight:normal; margin: 0 .75em .75em 0; padding:0; width: 29%; /*min-height:92px;*/ min-width:200px; -webkit-flex-grow: 1; flex-grow: 1;-webkit-flex-basis:auto; flex-basis:auto; z-index:400; height:100px; background: rgba(48,117,146,.1); background-image: url("pics/ico_show.png"); background-position: bottom 5px right 46%; background-repeat: no-repeat no-repeat; background-attachment:inherit;} /* position:absolute; z-index: 1500;*/ .TextInfoBox .flex li a {text-decoration:none;} /* .TextInfoBox .flex li:nth-child(3), .TextInfoBox .flex li:nth-child(6), .TextInfoBox .flex li:nth-child(9) {margin: 0 0 .75em 0; } */ .TextInfoBox .flex li h2 {font-size:1.4vw; font-family: 'Roboto Condensed', sans-serif; color: rgba(122,133,139,1); font-weight:500; min-height: 2.55em; margin: .5em .35em .5em 0;} .TextInfoBox .flex li h2 a {color: rgba(122,133,139,1);} .TextInfoBox .flex li img, .TextInfoBox .flex li img {float:left; margin: .5em .5em 0 .5em; max-width: 28%;} .TextInfoBox .flex li p {opacity:.0; margin: 0 auto .75em auto; padding:0; width:88%; height:0; transition: all 0.2s ease-in;} .TextInfoBox .flex li:hover {background-image:none; height:auto;} .TextInfoBox .flex li:hover p { opacity:1; margin: 0 auto .75em auto; padding:0; width:88%; height:120px; overflow:hidden; -webkit-transition: height 0.8s; -moz-transition: height 0.8s; transition: height 0.8s; } /* Auswahlfelder(Button) auf Übersichtsseite / Bestellung ---------*/ .TextInfoBox .flex .green, .TextInfoBox .flex .orange, .TextInfoBox .flex .blue { float:left; clear:none; color:rgba(255,255,255,1); list-style-type:none; font-weight:normal; margin:0; padding:0; min-width: 270px; width:100%; max-width: 360px; min-height:92px; -webkit-flex-grow: 1; flex-grow: 1;-webkit-flex-basis:auto; flex-basis:auto; z-index:400; } .TextInfoBox .flex div.tarifbox { margin: .5em 1em .5em 0; padding:0; width:auto; min-width: 270px; width: 46%; max-width: 46%; -webkit-flex-grow: 1; flex-grow: 1;-webkit-flex-basis:auto; flex-basis:auto; z-index:400; } .TextInfoBox .flex div.tarifboxtext {display:inline-block; width:99.4%; margin: .15em 0 0 0; padding:0; border:1px solid rgba(221,230,230,1);} .TextInfoBox .flex div.tarifbox p {display:inline-block; margin:.5em; } .TextInfoBox .flex div {} .TextInfoBox .flex div a h3 span.tarifkl { color:rgba(255,255,255,1); display:inline-block; font-weight:300; font-size: 1.132em; line-height: .95em; height:auto; min-width:50%; max-width: 60%; width:auto; margin: .65em 0 0 0; padding:0; } .TextInfoBox .flex div a h3 span.tarifhead { color:rgba(255,255,255,1); display:inline-block; font-family: 'Roboto Condensed', sans-serif; font-size: 1.995vw; line-height: 1.1em; height:auto; min-width:60%; max-width: 61%; width:auto; margin: 0 .5em 0 0; padding:0; } .TextInfoBox .flex div a {margin: 0 .5em 0 .5em; padding: .5em 0 0 0; text-decoration:none; display:inline-block; line-height:1.2em; color:rgba(255,255,255,1);} .TextInfoBox .flex div a img {float:left; display:block; margin: 0 .65em .5em .25em; padding:0; min-width:70px; height:auto;} .TextInfoBox .flex div.orange a img {margin: .35em.65em .5em .25em;} .TextInfoBox .green{ background-image: linear-gradient(#72B91C 0%, #87D922 72%); background-image: -o-linear-gradient(bottom, #72B91C 0%, #87D922 72%); background-image: -moz-linear-gradient(bottom, #72B91C 0%, #87D922 72%); background-image: -webkit-linear-gradient(bottom, #72B91C 0%, #87D922 72%); background-image: -ms-linear-gradient(bottom, #72B91C 0%, #87D922 72%); background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #72B91C),color-stop(0.72, #87D922)); } .TextInfoBox .orange{ background-image: linear-gradient(#EF8F01 0%, #FEA31A 72%); background-image: -o-linear-gradient(bottom, #EF8F01 0%, #FEA31A 72%); background-image: -moz-linear-gradient(bottom, #EF8F01 0%, #FEA31A 72%); background-image: -webkit-linear-gradient(bottom, #EF8F01 0%, #FEA31A 72%); background-image: -ms-linear-gradient(bottom, #EF8F01 0%, #FEA31A 72%); background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #EF8F01),color-stop(0.72, #FEA31A)); } .TextInfoBox .blue{ background-image: linear-gradient(#7BA9EE 0%, #96C0F5 72%); background-image: -o-linear-gradient(bottom, #7BA9EE 0%, #96C0F5 72%); background-image: -moz-linear-gradient(bottom, #7BA9EE 0%, #96C0F5 72%); background-image: -webkit-linear-gradient(bottom, #7BA9EE 0%, #96C0F5 72%); background-image: -ms-linear-gradient(bottom, #7BA9EE 0%, #96C0F5 72%); background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #7BA9EE),color-stop(0.72, #96C0F5)); } /* ========== Infobox rechts ========== */ #WrapInfoHome{float:right; clear:none; display:inline-block; height:auto; width: 30%; max-width: 250px; margin: 1.5em 2.75% 0 0; padding:0;} #WrapInfo{float:right; clear:none; display:inline-block; height:auto; width: 23%; max-width: 250px; margin: 3.4em 2.5% 0 0; padding:0;} /* Anmeldung Kundenkonto rechte Spalte */ #LoginBox { display:inline-block; position:relative; float:left; clear:none; color: rgba(149,160,166,1); font-weight:normal; line-height:1.2em; text-align:left; width:100%; max-width: 235px; min-height:60px; height:auto; right:0; top:0; padding: 0.5em .7em .85em .05em; border: 1px solid rgba(221,230,230,1); background: rgba(247,249,249,0); z-index:200; /* background: url("pics/logo_mysolva_sm.png"); */ background-repeat: no-repeat no-repeat; background-size: auto; background-position: top 20px left 15px; } #LoginBox a {margin: 0 0 .4em .65em; width:auto; max-width: 220px;} #LoginBox a img {float:none; clear:both; width:auto; height:auto; display: inline-block; margin: 0 0 0 .15em; padding:0; background-color: rgba(255,255,255,.0);} #LoginBox ul.login {float:none; width:100%; margin: 0 0 .25em 1.05em;} #LoginBox li.login {float:left; list-style-image: url("pics/ico_arrow_6.gif"); margin: 0 1.95em .25em 0px; padding: 0; } #LoginBox li.login a {color: rgba(149,160,166,1); margin:0;} #LoginBox hr.subnavlogin {border-bottom: 1px solid rgba(0,0,198,1); height:1px;} #LoginBox form.loginnav {width: 100%; margin:.5em 0 0 .15em; padding:0; background-color: rgba(255,255,255,.0);} #LoginBox input {float:left; margin: .25em 0 0 0; padding:0;} #LoginBox input.formloginnav { float:left; font-size: 1.05em; min-width: 150px; height:1.6em; margin: 0 .5em .5em .65em; padding:.25em; width:auto; color: rgba(149,160,166,1); border:1px solid rgba(208,219,234,1); } #LoginBox form.loginnav a {float:none; clear:both; display:block; width: 100%;} #LoginBox input#Arrow {height:1.2em; padding: 0 .25em; font-size:1.4em; font-weight:normal; color: rgba(115,184,20,1); background-color: rgba(255,255,255,0); border:none;} /*Kontakt*/ #Hotline{ float:left; clear:none; line-height: 1.2em; color: #8C999F; font-weight:normal; text-align:left; width: 100%; max-width: 250px; height:auto; margin: 1em 0 .9em 0; padding: 1.05em 0 0 0; border: 1px solid rgba(221,230,230,1); background: url("pics/ly_bg_hotline.png"); background-color: rgba(247,249,249,0); background-repeat: no-repeat no-repeat; background-size: 235px; background-position: top 30px left 30px; overflow:hidden; display:-webkit-flex; display:flex;-webkit-flex-direction:row; flex-direction:row; -webkit-flex-wrap:wrap; flex-wrap:wrap; } #Hotline h2 {font-size: 2.12em; color: rgba(168,194,215,.6); width:50%; margin: 0 0 0 .25em; padding: 0 0 .2em 0;} #Hotline p.hotline {text-align:left; font-size: 1.785em; margin: 0 0 0 .35em; padding: 125px 0 0 0; width: 99%; min-height: 35px;} #Hotline p.hotline a {color: #ABB4B8;} /*========== Infobox ==========*/ #WrapInfo .InfoBox { float:left; clear:both; font-size: .995em; color: #8C999F; font-weight:normal; line-height: 1.2em; text-align:left; width: 100%; max-width: 226px; height:auto; margin: 1em 0 .9em 0; padding: .75em .5em 1.2em .85em; background-color: #F9FAFB; border: 1px solid rgba(221,230,230,1); box-shadow: #bababa 0px 0px 0px 0px; } #WrapInfo .InfoBox h2, .TextInfoBox .InfoBox h2 {font-size: 1.22em; color: #8c999f; padding: .15em 0 .4em 0; margin: 0 0 .4em 0; border-bottom: 1px solid #abb3B8;} #WrapInfo .InfoBox form h2{font-size: 1.15em; padding: 1.05em 0 .013em .5em; border-bottom: 0px solid #abb3B8;} #WrapInfo .InfoBox p{color: #95A0A6; line-height: 1.1em; margin: 1em 0 .5em .5em; padding:0;} #WrapInfo .InfoBox ul {margin: 1em 0 .5em 1.75em; padding:0;} #WrapInfo .InfoBox p.just{line-height: 2.1em;} /* Facebook */ #Facebook {float:left; clear:both; width: 95%; max-width: 240px; height:auto; background-color: #F9FAFB; margin: 1em 0 .9em 0; padding: 1.05em 0 1.2em .85em; box-shadow: #bababa 1px 1px 1px 0;} .fb-like-box { border:0px solid #F9FBFD; width:208px; height: 298px; overflow:hidden; position:relative; top:-1px; left:-2px;} .rahmen_fb-like-box {background-color: #F9FBFD; width:208px; height: 298px; overflow:hidden; margin-left: 3px;} .PBCInfoContentBox2 {font-weight: normal;text-align: left;margin: 0 0 20px 0;padding: 0 4px 5px 0; overflow:hidden;} .PBCInfoContentBox2 div {margin: -5px 0 -6px -4px;} /* Hosting */ .PBCHostingFoot {font-size: .78em; color: #95A0A6; line-height: 1.165em; width: 95%;} /* Page Foot ----------------------------------------------------------------------------------------------------------------- */ #PF a {color: rgba(255,255,255,1); text-decoration:none;} #PF a:hover {text-decoration:underline;} #PF { display:inline-block; color: rgba(255,255,255,1); text-align:center; width: 100%; min-height: 370px; height:auto; margin:0; padding: 1em 0 2em 0; background-color: rgba(111,120,125,1); background-image: url('pics/pic_foot.png'); background-repeat: no-repeat no-repeat; background-attachment:inherit; background-size: 100%; background-position: bottom 0 left 0; } #PFContent {display:inline-block; text-align:center; font-size: .85em; width: 94%; min-height: 9em; height:auto; margin: 1em 2.5% 0 2.8%; padding: .2em 0 0 0;} #PFLeft {float:left; text-align:left; width: 19%; min-height: 3em; margin: .63em .75% .13em 0; padding:0;} #PFLeft p {margin: 0 0 2em 0;} #PFLeft img {margin: 0 0 .35em 0;} #PFMitte{float:left; text-align:left; width: 56%; min-height: 3em; margin: .63em 0 .63em 0; padding:0;} .PFText {float:left; text-align:left; width: 22.65%; min-height: 96px; margin: 0 1.5% .31em 0;} #PFRight {float:right; text-align:center; margin: .63em 0 2px 0; padding:0; width: 23%; min-height: 125px;} #PFTextSocialFB {display:inline-block; margin: 0 0 2em 0; padding: 0 0 0 0; width: 100%; min-height: 36px;} #PFTextSocialFB a {display:inline-block; text-align:center; width:auto; margin: 0 .3em .35em 0 ; padding:.1em;} #PFTextSocialFB a:last-child {margin: 0 0 .35em 0;} #footnav {float:none; clear:both; display:block; width:100%; margin: 3.5em 0 1em 0; padding:0;} #footnav ul {display:table; width:85%; height: 2em; margin:0 auto; } #footnav li {display:table-cell; display:inline-block; margin: 0 1% 0 1%;} #footnav li a {padding: 0 .5em; line-height: 1.3em;} .PFCopy {float:left; text-align:center; font-size:.85em;width: 99.8%; min-height: 1.25em; margin: .65em auto .63em auto; padding:0;} .PFCopy a{margin: 0 .75em 0 0;} /*=========================================================================================================================================================== --- 1600 - 995 --- CHC-online ==========================================================================================================================================================*/ @media (min-width: 1280px) and (max-width: 1600px) { #TextBox {padding:0; width: 58%;} #TextBox2 {padding:0; width: 76%;} /* SLIDER über dem Fuss*/ .markenslider {width: 96%;} } @media (min-width: 995px) and (max-width:1280px) { #TextBox {padding:0; width: 50%;} #TextBox2 {padding:0; width: 76%;} .markenslider {width: 98%;} #Col1 p, #Col2 p, #Col3 p, #Col4 p, #Col5 p, #Col6 p {min-height: 6.05em;} /* Übersichtsseite Leistungen Box mit Icon ---------------------------------------------------------------- */ .TextInfoBox .flex li h2 {font-size:1.75vw;} .TextInfoBox .flex li img {max-width: 35%; margin: .5em .5em .5em .5em;} .TextInfoBox .flex li:hover p {height:135px;} } /*=========================================================================================================================================================== --- Tablet --- CHC-online ==========================================================================================================================================================*/ @media (min-width: 760px) and (max-width: 995px) { /* ========== SLIDER im Head ========== */ #PBackground1 {width: 100%; height:auto; max-height: 440px; margin: 130px 0 0 0; padding:0;} #sequence {min-height: 200px; height:100%;} #sequence .sequence-next, #sequence .sequence-prev {height: 60px; margin-top: -30px;} #sequence .model {height:auto; width:100%;} .sequence-pagination { bottom: 10px; left:48%; display:none; position:absolute; z-index: 10; -webkit-transition-duration: .5s; -moz-transition-duration: .5s; -ms-transition-duration: .5s; -o-transition-duration: .5s; transition-duration: .5s; } #PBackground1 li h2 {font-size: 2.25em;} #PBackground1 li h3 {text-align:left;} #PBackground1 li h3 a {font-size: 1.09em;} .text {left: 100%; bottom: 43px; width:auto; max-width: 450px; min-height: 100px; height:auto; max-height:190px; padding: .75em .75em 1.25em 1.5em;} .animate-in .text {left: 11%; opacity: 1;} .animate-out .text {left: 15%; opacity: .2;} /* ========== Header ========== */ #PH {height: 130px; margin:0; padding:0;} #PHTop {float:none; margin: 0 auto 0 auto; padding:0; height: 130px; width: 100%;} #LogoBox {margin: 2.45em 0 0 2%;} #LogoBox img {max-width:220px; height:auto;} #WrapPH.move {} .move #PH {height: 60px; z-index:3000;} .move #PHTop {height: 60px;} .move #LogoBox {transform:scale(.8); margin: .75em 0 .15em 1.8%; padding:0; width:140px; height:auto;} .move #LogoBox img {width:98%; height:auto;} .move #PH {height: 85px; z-index:3000;} .move #PHTop {height: 85px; margin:0; padding:0;} .move #LogoBox {transform:scale(.8); margin: .75em 0 .15em 0; padding:0; max-width: 190px; height:auto;} .move #LogoBox img {width: 98%; height:auto; margin:0;} .move #FuncNav {transform:scale(.99); max-width:220px; height:auto; margin: .75em .5% .25em 0; padding:0;} .move #LoginBox {} .move #PBSubNavSearchBox {width:100%; top: 60px; padding:.3em;} .move #PBSubNavSearchBox form#form_search {clear:none; float:right; width: 100%; max-width: 320px; height:35px; margin: .25em 0 .25em 0;} .move #PBSubNavSearchBox form#form_search input {} .move #PBSubNavSearchBox form#form_search input.formsearch {font-size: 1.1em; width: 84.5%; height: 23px; margin:0; padding: .25em;} .move #PBSubNavSearchBox form#form_search input#Arrow {padding: 0 .2em; font-size: 1.6em;} .move #MainNavBox {float:left; clear:none; width: 98%; margin: 0 .1em 0 0; padding: .1em 0 0 0;} .move #MainNav {float:left; clear:none; width:80%;} .move ul#MainNav {float:left; display:inline-block; width:100%; max-width: 800px;} .move #MainNav>li {margin: 0; padding:0; min-width:50px; width:auto;} .move ul#MainNav>li:nth-child(1){min-width:200px;} .move #MainNav>li>a {font-size: 1.05em; line-height: 1.05em; height: 1.15em; margin:0; padding: .05em .45em .05em .45em;} .move ul#MainNav li ul>li>a{font-size: .95em; line-height: 1.15em; padding: .18em 0 .18em .95em; margin: 0 0 .1em 0; width: 100%;} .move ul#MainNav>li:hover>ul{display:block; margin:0; padding: .75em .75em .6em .55em; min-width: 170px;} /* ========== MainNav ========== */ #MainNavBox {margin: .5em 0 0 0; width:86%;} #MainNav {height:auto; margin:0; padding:0;} #MainNav ul{margin: .1em 0 0 0; padding:0; width:auto;} /*hovert die zweite Ebene (das Untermenü) */ ul#MainNav>li:hover>ul{display:block; margin:0; padding: 0 .75em .6em .65em; min-width: 170px; width:auto;} ul#MainNav>li{height: 1em; text-align:center; min-width:100px; width:20%; padding:0; margin:0; min-height:1.55em;} /* Listpunkte erste Ebene (Bereiche) */ ul#MainNav>li:nth-child(1){min-width:250px;} ul#MainNav>li>a {font-size: 1.32em; line-height: 1.5em; height: 1.6em;} ul#MainNav>li ul>li:hover>ul{display:block; margin: -1.45em 0 0 182px; padding: .65em .75em .6em .75em; min-width: 175px; width:auto; height:auto; z-index: 500;} ul#MainNav>li ul>li:last-child:hover>ul{right:182px;} /* Funktions Navigation - Head oben rechts ------------------------------------------------------------------------------------------------- */ #FuncNav {float:right; clear:none; text-align:left; width: 65%; height:auto; margin: .1em 2.5% .5em 0; padding: .25em 0 0 0;} #FuncNav ul {float:right; display:table; height:auto; width: 95%; margin:0; padding:0;} #FuncNav li {display:table-cell; vertical-align:middle; text-align:right; list-style:none; margin:0; padding:0; min-width:120px; width:4.25%;} #FuncNav li:first-child {min-width:180px; width: 20%; margin: .25em 0 0 3%;} #FuncNav a {display:inline-block; text-decoration:none; font-size: .951em; font-weight:normal; color: #ffffff; width:auto; padding:0;} #FuncNav a:hover {text-decoration:underline; font-weight:normal; color: #ffffff;} #FuncNav a img {width:auto; height:auto; margin: 0 .65em 0 0;} /* ========== SucheBox - innerhalb der MainNav ========== */ #PBSubNavSearchBox {width: 100%; max-width: 130px; margin:0; padding:0;} #PBSubNavSearchText {font-size: 95%; color: #FF9900; margin:0; padding: .23em .19em .06em .5em; max-width: 130px;} /* ========== SUBNAVIGATION vertikal - Ausgeblendet!!! */ #SubNavBox, #SubNav, #SubNav ul, #SubNav li {visibility:hidden;display:none;width:0;height:0;margin:0;padding:0;} #PBackground2 {width:100%; height:auto; margin: 130px 0 0 0; background-image: linear-gradient(to right, #FFFFFF 50%, #E7F1F8 50%);} #Fotobanner {width: 100%; height:auto; margin: 0 auto 0 auto;} #Fotobanner img {width:100%; height:auto;} /* ========== Contentbereich ========== */ #PB {width:100%; height:auto; padding: .75em 0 0 0; margin: 0;} #stopper {width:65px; height:auto; top:145px; right:0px; margin:0; padding: .15em 5px 0 5px; background-color: rgba(255,255,255,.0);} #stopper p {height:42px; margin: 0 .35em .5em 0; padding: .0em .05em .0em .0em;} #stopper p a {margin: 0 0 .15em 0;} #stopper p img {padding: .45em .35em; margin: 0 .5em 0em .15em;} #TextBoxHome {width: 100%; margin: 1em auto 2.9em auto; padding: 0 0 .75em 0;} #TextBoxHome h1 {font-size: 2.125em; color: #A2AAB0; font-weight: normal; text-align:center; width:100%; margin: 0 0 20px 0;} #TextBoxHome h2 {text-align:center; width:94%; margin: 0 auto 1.5em auto;} #TextBoxHome .TextInfoBox {float:none; clear:both; display:inline-block; text-align:left; font-size: .925em; width:100%; margin: 1.75em 0 0 0; padding: 0 0 .65em 0;} #TextBoxHome .TextInfoBox h2 {line-height: 1.2em;} #TextBoxHome .TextInfoBox h2 a {text-decoration:none; font-size: 1.275em; margin: 0 0 2.25em 0;} #TextBoxHome .TextInfoBox h2 a:hover {text-decoration: underline;} #TextBoxHome .TextInfoBox p {margin: 0 0 0 .25em; padding: 3px 0 8px 0; text-align:left; line-height: 1.2em;} #TextBoxHome .TextInfoBox ul {margin: 0 0 0 1.6em; padding:0;} #TextBoxHome .TextInfoBox img {width:auto; max-width: 500px; height:auto;} #TextBox, #TextBox2 {line-height:1.22em; margin: 0 0 2.9em 2%; padding: 0 0 .75em 0; height:auto;} #TextBox {padding:0; width:63%;} #TextBox2 {width: 95%;} #WrapTextInfo {float:left; clear:none; width:65%; margin: 0 0 0 2%;} /* Box für Aktuellen Meldungen Startseite - WrapInfoBox bleibt sonst unten kleben!!! */ #TextBox .picleft img{float:left; width:auto; height:auto;} #TextBox .picright img{float:right; width:auto; height:auto;} /*Home Spalte 1 + 2 + 3*/ #Col1, #Col2, #Col3, #Col4, #Col5, #Col6 {float:left; text-align:center; width: 31.75%; height:auto; margin: 1em 1.35% 2em 0; padding: 1em 0 0 0; background-color: rgba(247,249,249,0);} #Col1 h2, #Col2 h2, #Col3 h2, #Col4 h2, #Col5 h2, #Col6 h2 {margin: .75em auto .5em auto; padding:0; width:95%; min-height: 2.95em;} #Col1 h2 a, #Col2 h2 a, #Col3 h2 a, #Col4 h2 a, #Col5 h2 a, #Col6 h2 a {font-size: 1.255em; min-height: 1em; width:auto; margin:0; padding:0; } #Col1 a, #Col2 a, #Col3 a,#Col4 a, #Col5 a, #Col6 a {width:96%; text-align:center; margin:0; padding:0;} #Col1 a img, #Col2 a img, #Col3 a img, #Col4 a img, #Col5 a img, #Col6 a img {height:auto; width:auto; max-width:90px; margin: .5em auto .35em auto; padding:0;} #Col1 p, #Col2 p, #Col3 p, #Col4 p, #Col5 p, #Col6 p {font-size: 1em; line-height: 1.2em; margin: 0 auto 1.15em auto; padding:0; width: 85%; min-height: 6.01em;} #Col1 a.button, #Col2 a.button, #Col3 a.button, #Col4 a.button, #Col5 a.button, #Col6 a.button { float:none; font-size: 1.235em; line-height: 1.75em; padding: 0 .6em 0 .6em; width:100%; margin: 0 auto 0 auto; padding: .05em .0em .15em .0em; border-radius:0;} /* Tarife Auswahlfelder(Button) auf Übersichtsseite / Bestellung ---------------------------------------------------------------------------------------------- */ .TextInfoBox .flex { float:left; clear:none; width:100%; margin: .5em 0 .5em 0; padding:0; display:-webkit-flex; display:flex; -webkit-flex-direction:row; flex-direction:row; -webkit-flex-wrap:wrap; flex-wrap:wrap;} /* Übersichtsseite Leistungen Box mit Icon ---------------------------------------------------------------- */ .TextInfoBox .flex li { margin: 0 .5em .5em 0;} .TextInfoBox .flex li h2 {font-size:1.28em;} .TextInfoBox .flex li img {max-width: 25%; margin: .5em .5em .5em .5em;} .TextInfoBox .flex li:hover p {height:155px;} /* Tarife Auswahlfelder(Button) auf Übersichtsseite / Bestellung ---------------------------------------------------------------------------------------------- */ .TextInfoBox .flex div.tarifbox {margin: .5em .85em .5em 0; padding:0; width:auto; min-width: 200px; width: 100%; max-width: 260px;} .TextInfoBox .flex .green, .TextInfoBox .flex .orange, .TextInfoBox .flex .blue {margin:0; padding:0; min-width: 200px; width:100%; max-width: 100%; min-height:80px;} .TextInfoBox .flex div a h3 span.tarifkl {display:inline-block; font-weight:300; font-size: 1.132em; height:auto; min-width:50%; max-width: 65%; width:auto; margin: .65em 0 0 .55em; padding:0;} .TextInfoBox .flex div a h3 span.tarifhead {font-size: 1.3935em; line-height: 1.1em; height:auto; min-width:50%; max-width: 50%; width:auto; margin: 0 .5em 0 .5em; padding:0;} .TextInfoBox .flex div a {margin: 0 .5em 0 .5em; padding: .5em 0 0 0; text-decoration:none; display:inline-block; line-height:1.2em; color:rgba(255,255,255,1);} .TextInfoBox .flex div a img {float:left; display:block; margin: 0 .45em .5em .15em; padding:0; min-width:45px; max-width:55px; height:auto;} /* ========== Infobox rechts ========== */ #WrapInfoHome{float:right; clear:none; display:inline-block; height:auto; width: 42%; max-width: 235px; margin: 1.5em 2.5% 0 0; padding:0;} #WrapInfo{float:right; clear:none; display:inline-block; height:auto; width: 42%; max-width: 235px; margin: 3.4em 2.5% 0 0; padding:0;} /* Anmeldung Kundenkonto rechte Spalte */ #LoginBox {width:100%; max-width: 220px; min-height:60px; height:auto; right:0; top:0; padding: .5em .7em .85em .5em;} /*Kontakt*/ #Hotline{width: 240px; max-width: 240px; height:auto; margin: 1em 0 .9em 0; padding: 1.05em 0 0 0;} #Hotline h2 {font-size: 2.02em; color: rgba(168,194,215,.6); width:50%; margin: 0 0 0 .25em; padding: 0 0 .2em 0;} #Hotline p.hotline { font-size: 1.685em; margin: 0 0 0 .35em; padding: 125px 0 0 0;} /*========== Infobox ==========*/ #WrapInfo .InfoBox {width:100%; max-width: 220px; font-size: .995em; color: #8C999F; margin: 1em 0 .9em 0; padding: .75em .5em 1.2em .85em;} /* Facebook */ #Facebook {float:left; clear:both; width: 97%; max-width: 240px; height:auto; background-color: #F9FAFB; margin: 1em 0 .9em 0; padding: 1.05em 0 1.2em .85em; box-shadow: #bababa 1px 1px 1px 0;} .fb-like-box { border:0px solid #F9FBFD; width:208px; height: 298px; overflow:hidden; position:relative; top:-1px; left:-2px;} .rahmen_fb-like-box {background-color: #F9FBFD; width:208px; height: 298px; overflow:hidden; margin-left: 3px;} /* Slider für die Logos */ #markenslider {text-align:center; width:94%; height:110px; margin: 2.5em auto .5em auto; padding:0; border:1px solid rgba(0,0,0,.1); } #markenslider h2 {} #markenslider div.carousel {text-align:center; width:100%; margin: 0 auto 0 auto; padding: 1.25em 0 .25em 0; vertical-align:middle; border: 0px solid aqua;} #markenslider div.carousel div.pic {text-align:center; width:auto; max-width: 185px; margin: 0 .5% 0 0; padding:0; border: 0px solid magenta;} #markenslider div.carousel div.pic img {display:inline-block; margin: 0 auto 0 auto; padding: 0 .45em; max-height:40px; width:auto;} .markenslider {display:inline-block; width: 96%; margin: 2em auto; border:1px solid rgba(0,0,0,.1);} .markenslider ul {display:table;} .markenslider li {display:table-cell; width: 12%; margin: 0 1%; padding: .15em;} .markenslider li a p {font-size:.63em; color: #d8d8d8; margin: .35em 0 0 0; padding:0;} .markenslider li a img {width:auto; max-width: 140px; ;height:auto; max-height: 38px;} /* ========== Page Foot ========== */ #PF {min-height: 255px; height:auto;} #PFContent {width: 98%; margin:auto; padding: .13em 0 0 1%;} #PFLeft {margin: .63em 0 2px 0; width: 70%;} #PFLeft img {max-width: 150px;} #PFLeft p {float:left; width: 47%;margin: 0 1em 0 0;} #PFMitte {float:left; width: 99%; min-height: 125px; margin: 1.63em 0 .85em 0; padding:0;} .PFText {float:left; text-align:left; width: 23.5%; margin: 0 .5em .31em 0; padding:0;} #PFRight {position: absolute; right:0; padding:0; min-height:75px; width: 27.8%;} #PFTextSocialFB {text-align:left; margin: 0 0 .13em 0; padding: .63em 0 .3em 0; width: 100%;} #PFTextSocialFB a img {float:left; max-width: 28px;} .PFCopy {float:none; clear:both; width: 100%; max-width: 325px; margin: .75em auto .5em auto; padding:0;} /* ========== Überschriften, Absätze, Formulare, Tabellen ========== */ h1 {font-size: 1.85em; line-height: 1.2em; margin: .1em 0 .35em 0;} h1.home {font-size: 2.05em; color: #7A858B; font-weight:normal; line-height: 1.2em; margin: .3em 0 .15em 0; padding:0; text-align:left;} h2 {font-size: 1.35em; margin: 0 0 .38em 0;} h2.home {font-size: 1.35em; color: #7A858B; font-weight:normal; line-height: 1.2em; margin: 0 0 1.5em 0; padding:0; text-align:left;} td h2 {font-size: 1.35em; margin: 0 0 6px 0;} h3 {font-size: 1.15em; margin: 0 0 .5em 0;} form#Kontakt input#Ort {min-width:100px; width: 43%; max-width: 245px;} /* ========== Domaincheck ========== */ form.domain {margin: 0.3765625% 0 0.9765625% 0; width: 94%;} input.domain {float:left; height: 1.7em; margin: .4em 0 1em .1em; width: 40%;} select.domain {height: 1.7em; margin: .4em .8em 0 0;} /* ========== Suche - wird über den Link "Suche" unterhalb der FunkNav eingeblendet ========== */ form#form_search {display:none; clear:none; float:right; width: 70%; height: 1.63em; margin: 1.65em 0 0 0; padding:0;} input.formsearch {width: 100%; max-width: 100px;} /* ========== Suche FAQ ========== */ form.faq_search {clear:both; float:none; margin: 0; width: 100%; max-width: 400px;} input.faq_search {width: 80%; max-width: 300px;} /* ========== Tabellen ========== */ #TextBox table {font-size: 100%; color: #5a5a5a; min-width: 10em; width: 100%; max-width: 500px; height:auto;} } /* END MEDIA QUERIE TABLET */ /*================================================================================================================================================================ Smartphone - Mobile CHC-online =============================================================================================================================*/ @media (max-width: 765px) { /* ========== SLIDER im Head ========== */ /* #sequence, #sequence .sequence-next, #sequence .sequence-prev, #sequence .model, .text, .animate-in .text, .animate-out .text {visibility:hidden; display:none;width:0%; height:0; margin:0; padding:0;} */ #PBackground1 {width: 100%; height:auto; max-height: 120px; padding:0; margin: 50px auto 0 auto;} #sequence {min-height: 120px; height:100%; margin:0 auto 0 auto; } #sequence .sequence-next, #sequence .sequence-prev {height: 20px; margin-top: -20px;} #sequence .model {height:auto; width:100%;} #sequence > .sequence-canvas > li img {height:auto; width:100%; top:-60px;} .sequence-pagination {visibility:hidden; bottom: 5px; left:25%; display:none; position:absolute; z-index: 10; -webkit-transition-duration: .5s; -moz-transition-duration: .5s; -ms-transition-duration: .5s; -o-transition-duration: .5s; transition-duration: .5s; } #PBackground1 li h2 {font-size: .95em;} #PBackground1 li h3 {font-size: .79em; text-align:left;} #PBackground1 li h3 a, #PBackground1 li a {font-size: .79em;} .text {left: 10px; top: 51px; width:auto; max-width: 360px; min-height: 52px; height:auto; max-height:52px; padding: .5em .75em .5em .5em;} .animate-in .text {left: 5%; opacity: 1;} .animate-out .text {left: 15%; opacity: .2;} .model {left: -0%; bottom: -48%; opacity: 0; position:relative; height:auto !important; width: 40%; min-width: 200px; height:auto; border-radius:0%;}/**/ /* ========== Ausgeblendet ========== #FuncNavBox, #FuncNav, #FuncNav li, */ #MainNav, #MainNav ul, #MainNav li, #MainNav li a, #SubNavBox, #SubNav, #SubNav ul, #SubNav li, #DeskBox, #LoginBox, #LoginBox ul, #LoginBox li {visibility:hidden; display:none; min-width:0;width:0;max-width:0;height:0; margin:0;} /* ========== Inhalt ========== */ .move #PH, #PH {min-height: .75em; height: 3em; margin:0; padding:0; display:block;} .move #PHTop, #PHTop {min-height: .75em; height: 3em; width: 100%; margin: 0 auto 0 auto; padding:0;} .move #LogoBox, #LogoBox {transform:scale(1); float:left; clear:none; margin: .5em 0 .25em 1.5%; width: 125px; min-height: .85em; height:auto;} .move #LogoBox img, #LogoBox img {float:left; width: 97%; height:auto; margin-left: .1em;} /* #Fotobanner {visibility:hidden; display:none; width:0; max-width:0; min-height:0; height:0; max-height:0;} */ #PBackground2 {width:100%; height:auto; margin: 50px 0 0 0; background-image: linear-gradient(to right, #FFFFFF 50%, #E7F1F8 50%);} #Fotobanner {width: 100%; height:auto; margin: 0 auto 0 auto;} #Fotobanner img {width: 100%;height:auto; margin: 0 0 0 0;} /* ``` HAUPTAVIGATION !!! Rahmen MainNav wird nicht ausgeblendet, er bestimmt die Position SubNavMov !!! ```````````````````` */ /* ========== Funktions Navigation - Head oben rechts ------------------------------------------------------------------------------------------------- */ #FuncNav, .move #FuncNav {float:right; width:55%; max-width:153px; height:auto; margin: .5em 2.65em .5em .1%; padding:0;} #FuncNav li, .move #FuncNav li, #FuncNav li:first-child, .move #FuncNav li:first-child { display:inline-block; text-align:center; transform:scale(1); min-width:16px; width:auto; margin: 0 1% 0 0; padding: 0 .1em 0 0; } /* #FuncNav li:nth-child(4), .move #FuncNav li:nth-child(4) {visibility:hidden; display:none; font-size:0em;} */ #FuncNav a .visibility, #FuncNav a.phone, .move #FuncNav a .visibility, .move #FuncNav a.phone {display:none; font-size:0em;} #FuncNav a img, .move #FuncNav a img {width:auto; height:auto; padding: 0 .25em; margin: 0 .1em 0 .1em;} #FuncNav a {display:inline-block; text-decoration:none; font-size:0; font-weight:normal; color: #ffffff; width:auto; padding:0;} #FuncNav a:hover {text-decoration:underline; font-weight:normal; color: #ffffff;} .move #MainNavBox, #MainNavBox {float:none; clear:both; text-align:right; margin: .95em 0 0 0; padding:0; height: 3px; width: 100%; z-index: 900;} /* Suche - wird über den Link "Suche" unterhalb der FuncNav eingeblendet display:none; */ .move #PBSubNavSearchBox, #PBSubNavSearchBox {height:auto; width:100%; top:49px; padding:0; position:absolute; z-index:2500;} #PBSubNavSearchBox form#form_search {float:none; clear:both; display:block; width: 90%; height:35px; margin: .1em 0 .25em .5em; padding: .15em .25em .25em .25em; } #PBSubNavSearchBox form#form_search input {height:35px; line-height: 1.05em; height: 1.9em; margin:0; padding: 0 0 .1em 0; } #PBSubNavSearchBox form#form_search input.formsearch {height:35px; font-size: 1.125em; width: 75%; height:auto; margin:0; padding: .25em; } #PBSubNavSearchBox form#form_search input#Arrow {height:35px; font-size: 1.55em; padding: 0 .5em 0 .5em; margin:0;} /* ========== Navigation ==========*/ #SubNavMobHead { visibility:visible; position:relative; float:right; clear:none; display:block; text-align:right; width: 32px; padding:.15em; margin: -2.35em 1% 0 0; height:auto; z-index: 800; background-color: rgba(210,126,0,.21); border-radius:.45em; } #SubNavMobHead a {font-size: 1.02em; line-height: 1.6em; text-decoration:none; display:block; color: #fff;} #SubNavMobHead img {padding:0; margin:0; float:left;} #SubNavMobDiv {visibility:visible; position:absolute; width:99%; max-width: 318px; margin:0; padding:0; z-index:600; } #SubNavMob {visibility:visible; position:absolute; text-align:left; width:100%; height:100%; margin: .45em 1em 0 0; padding: 0 0 .8em 0; z-index:500;} #SubNavMob ul { float:left; visibility:visible; position:relative; display:block; width:100%; max-width:309px; margin:0; padding: 0 .65em .25em 0; list-style-type:none; border-top: 1px solid #FEA41D; border-left: 1px solid #E6E7E8; background-color: #F29101; z-index:650; } #SubNavMob ul ul, #SubNavMob ul ul ul, #SubNavMob ul ul ul ul {margin:0; display:none; border-top: 1px solid #FEA41D;} #SubNavMob ul ul {padding: 0 .65em .25em 0; border-left:none;} #SubNavMob ul ul ul {padding:0; border-bottom: 1px solid #FEA41D;} #SubNavMob ul ul ul ul {padding:0;} #SubNavMob li, #SubNavMob li li, #SubNavMob li li li {list-style-type:none; line-height: 2.15em; margin:0; padding:0; border-bottom: 1px solid #FEA41D; display:block;} #SubNavMob li:last-child {margin:0; padding:0; border-bottom: 0px solid #FFF;} #SubNavMob span.plus {float:right; position:relative; padding:0; margin: 0 .3em 0 0; width:auto; height:auto; cursor:pointer;} #SubNavMob span.plus img{padding:0; margin:0; width:auto; height:auto;} #SubNavMob a { font-size: .985em; line-height: 2em; color: #fff; font-weight:normal; text-decoration:none; line-height:.75em; width: 78%; height:auto; margin: 0 0 0 .75em; padding: .65em .1em .65em .85em; display:inline-block; background: url("pics/ly_arrow_mob.png"); background-repeat:no-repeat; background-position: 1% 35%; }/* display:table-row;*/ #SubNavMob li li a {width: 74%; margin: 0 0 0 1.5em; } #SubNavMob li li li a {width: 70%; margin: 0 0 0 2.35em;} #SubNavMob li li li li a {width: 68%; margin: 0 0 0 2.75em;} #SubNavMob a.active, #SubNavMob a.noactive:hover {color: #fff; background: url("pics/ly_arrow_mob_active.png"); background-repeat:no-repeat; background-position: 1% 35%;} /* ========== Contentbereich ========== */ #PB {float:none; clear:both; margin: 0 auto 0 auto; padding:0; width: 100%; max-width: 320px; height:auto;} #stopper {width:38px; height:auto; top:52px; right:0px; margin:0; padding: .15em 5px 0 5px; background-color: rgba(255,255,255,.0);} #stopper p {float:left; display:table-cell; font-weight:bold; width:auto; height:auto; margin: 0 .1em 0 0; padding:0; border:1px solid rgba(111,120,125,.5);} #stopper p a{display:inline-block; width:auto; margin:0; padding:0; font-size: 1.01em; line-height: 1.2em;} #stopper p img {float:left; vertical-align:middle; width:auto; max-width:30px; height:auto; padding: .35em .35em; margin:0;} #TextBoxHome {float:none; clear:both; margin: .6em auto .75em auto; padding:0; width: 100%; max-width: 320px; height:auto;} #TextBoxHome h1 {font-size: 1.35em; text-align:center;} #TextBoxHome h2 {font-size: 1.05em;text-align:center; width:94%; margin: 0 auto 1.5em auto;} #WrapTextInfo {float:left; clear:none; width:100%;} /* Box für Aktuellen Meldungen Startseite - WrapInfoBox bleibt sonst unten! */ /* ========== Infobox ========== */ #TextBoxHome .TextInfoBox {float:none; clear:both; display:inline-block; text-align:left; font-size: .925em; width:100%; margin: 1.75em 0 0 0; padding: 0 0 .65em 0;} #TextBoxHome .TextInfoBox h2 {line-height: 1.2em;} #TextBoxHome .TextInfoBox h2 a {text-decoration:none; font-size: 1.275em; margin: 0 0 2.25em 0;} #TextBoxHome .TextInfoBox h2 a:hover {text-decoration: underline;} #TextBoxHome .TextInfoBox p {margin: .25em 0 0 .25em; padding: 3px 0 8px 0; text-align:left; font-size: .95em; line-height: 1.2em;} #TextBoxHome .TextInfoBox ul {margin: 0 0 0 1.6em; padding:0;} #TextBoxHome .TextInfoBox img {width: 98%; max-width: 500px; height:auto;} #TextBox, #TextBox2 {clear:both; float:none; margin: 1.8em auto .5em auto; width: 96%; max-width: 320px; text-align:left; height:auto;} #TextBox img, #TextBox2 img {width:auto; height:auto; max-width:320px; margin:0;} #TextBox .picleft img{float:left; width:auto; height:auto;} #TextBox .picright img{float:right; width:auto; height:auto;} #TextBox {padding:0; width:100%; margin: 0 0 .5em 0;} #TextBox2 {width: 100%;} .picleft {float:none; clear:both; width:100%; margin: .25em 0 .5em 0; padding:0;} .picright {float:none; clear:both; width:100%; margin: .25em 0 .5em 0; padding:0;} .TextInfoBox {margin: .5em 0 1.5em 0; padding: 0 0 1.05em 0; width: 100%; border-bottom: 1px solid #E8EEF4;} .TextInfoBox h2 {font-size: 1.35em; line-height:1.2em;} /*Home Spalte 1 + 2 + 3*/ #Col1, #Col2, #Col3, #Col4, #Col5, #Col6 {float:left; text-align:center; width: 99%; height:auto; max-width:320px; margin: .75em 0 1em 0; padding: .35em 0 0 0;} #Col1 h2, #Col2 h2, #Col3 h2, #Col4 h2, #Col5 h2, #Col6 h2 {margin: .25em auto .5em auto; padding:0; width:95%; min-height: .95em;} #Col1 h2 a, #Col2 h2 a, #Col3 h2 a, #Col4 h2 a, #Col5 h2 a, #Col6 h2 a {font-size: 1.255em; min-height: .5em; width:auto; margin:0; padding:0; } #Col1 a, #Col2 a, #Col3 a,#Col4 a, #Col5 a, #Col6 a {width:96%; text-align:center; margin:0; padding:0;} #Col1 a img, #Col2 a img, #Col3 a img, #Col4 a img, #Col5 a img, #Col6 a img {height:auto; width:auto; max-width:60px; max-height: 40px; margin: .35em auto .35em auto; padding:0;} #Col1 p, #Col2 p, #Col3 p, #Col4 p, #Col5 p, #Col6 p {font-size: 1em; line-height: 1.2em; margin: 0 auto 1.15em auto; padding:0; width: 85%; min-height: .5em;} #Col1 a.button, #Col2 a.button, #Col3 a.button, #Col4 a.button, #Col5 a.button, #Col6 a.button { float:none; font-size: 1.235em; line-height: 1.75em; padding: 0 .6em 0 .6em; width:100%; margin: 0 auto 0 auto; padding: .05em .0em .15em .0em; border-radius:0; } /* Übersichtsseite Leistungen Box mit Icon ---------------------------------------------------------------- */ .TextInfoBox .flex li {text-align:left; margin: 0 0 .5em 0; padding:0; min-width: 140px; width: 80%;} .TextInfoBox .flex li h2 {font-size:1.35em; min-height: 2.45em; margin: .25em .35em .25em .95em; width:75%;} .TextInfoBox .flex li img, .TextInfoBox .flex li a img {float:left; clear:none; margin: 0 .5em .5em .5em; padding: .5em .75em .15em .5em; max-height:50px;} .TextInfoBox .flex li p, .TextInfoBox .flex li p a {text-align:left; margin: 0 .35em .75em .95em; padding:0; width:88%;} /* Tarife Auswahlfelder(Button) auf Übersichtsseite / Bestellung ---------------------------------------------------------------------------------------------- */ .TextInfoBox .flex .green, .TextInfoBox .flex .orange, .TextInfoBox .flex .blue {margin:0; padding:0; min-width: 270px; width:100%; max-width: 320px; min-height:80px;} .TextInfoBox .flex div.tarifbox {margin: .5em 1em .5em 0; padding:0; width:auto; min-width: 270px; width: 100%; max-width: 100%;} .TextInfoBox .flex div.tarifboxtext {display:inline-block; width:99.4%; margin: .15em 0 0 0; padding:0; border:1px solid rgba(221,230,230,1);} .TextInfoBox .flex div.tarifbox p {display:inline-block; margin: .5em;} .TextInfoBox .flex div a h3 span.tarifkl {display:inline-block; font-weight:300; font-size: 1.132em; height:auto; min-width:50%; max-width: 60%; width:auto; margin: .65em 0 0 .55em; padding:0;} .TextInfoBox .flex div a h3 span.tarifhead {font-size: 1.3935em; line-height: 1.1em; height:auto; min-width:50%; width:auto; max-width: 60%; margin: 0 .5em 0 .5em; padding:0;} .TextInfoBox .flex div a {margin: 0 .5em 0 .5em; padding: .5em 0 0 0; text-decoration:none; display:inline-block; line-height:1.2em; color:rgba(255,255,255,1);} .TextInfoBox .flex div a img {float:left; display:block; margin: 0 .65em .5em .25em; padding:0; min-width:65px; height:auto;} .TextInfoBox .flex div.orange a img {margin: .35em .65em .5em .25em;} ul.symbol {width:100%; max-width: 320px; margin: 1em 0 1em 0; padding:0;} ul.symbol li {min-height:40px; height:auto; max-width: 100%; margin: .4em .15em .4em 0; padding:0;} ul.symbol li a img {float:none; clear:both; display:block; width:20%; max-width:30px; height:auto; margin:0; padding: 0 .5em .25em 0;} ul.symbol li h2 a {float:left; clear:none; color:#000099; text-decoration:none; max-width:98%; height:auto; margin:0; padding: .15em 0 0 0;} ul.symbol li h3 a {float:left; clear:none; color:#000099; text-decoration:none; max-width:85%; height:auto; margin:0; padding: .15em 0 0 0;} ul.symbol li p {float:left; clear:none; min-height:50px; height:auto; max-width:99%; margin: 0; padding: 0 .25em .25em 0;} /* ========== Infoboxen ========== */ #WrapInfoHome {float:right; width: 100%; max-width: 320px; margin: .5em 0 .75em 0; padding:0;} #WrapInfo {float:right; height:auto; width: 100%; max-width: 320px; margin: .5em 0 1.5em 0; padding:0;} #Hotline, #Facebook {float:none; clear:both; min-height: 2.25em; height:auto; margin: 1em auto .5em auto; min-width: 270px; max-width: 320px; border: 1px solid rgba(221,230,230,1);} #Hotline {padding:0; width:99.9%; background-size: 50%; padding: .5em 0 0 0;background-position: bottom -25px right -10px;} #Hotline h2 {text-align:left; font-size: 1.572em; margin: .5em .5em .3em .5em; padding:0;} #Hotline p.hotline {font-size: 1.372em; margin: 0 0 0 .5em; padding: 1.03em 0 0 0; width: 100%; min-height: 25px;} #Facebook{width:95%; } #WrapInfo .InfoBox {float:none; clear:both; min-height: 2.25em; height:auto; margin: 1em auto 0 auto; padding: 1.05em 0 .5em 0; width:100%; max-width: 315px;} #WrapInfo .InfoBox h2 {padding: .1em 0 .4em 0; margin: 0 1.4em .4em 1em; border-bottom: 1px solid #abb3B8;} #WrapInfo .InfoBox ul {margin: 0 1em .4em 1em; padding: .25em 0 .5em 1.5em;} /* Facebook */ #Facebook {width: 100%; height:130px; margin: 1.5em 0 .9em 0; padding:0; border: 1px solid rgba(221,230,230,1); overflow:hidden;} .fb-like-box {border:none; margin:0 auto; padding:0; width:100%; height:auto; overflow:hidden; position:relative; outline:none;} .rahmen_fb-like-box {min-height:10px; height:auto; width:100%; margin: 0 auto; padding:0; overflow:hidden;} .markenslider {float:none; clear:both; display:block; width: 100%; max-width:320px; margin: 1em auto; border:1px solid rgba(0,0,0,.1);} .markenslider ul {display:inline-block; margin:0; padding:0;} .markenslider li {float:left; display:inline; text-align:left; width:45%; min-height: 50px; margin: .15em .35em .15em .35em; padding:0;} .markenslider li a p {margin:0; padding:0;} .markenslider li a img {height:auto; max-height:35px; width:auto; max-width: 130px;margin:0; padding:0;} /* Page Foot ------------------------------------------------------------------------------------------------- */ #PF {width:100%; min-height: 10px; height:auto; text-align:center; margin: 0 auto 0 auto; padding:0;} #PFContent {width: 100%; max-width: 300px; font-size:.75em; text-align:center; margin: 0 auto 0 auto; padding: 0.13em 0 1em 0; height:auto;} #PFLeft, #PFMitte, #PFRight {float:none; clear:both; width:100%; max-width: 310px; height:auto; margin: 0.63em auto 0.63em auto; padding: 0;} #PFMitte {text-align:center; min-height: 10px; border-left: 0px solid #D2E1EC; border-right: 0px solid #F4F8FB;} #PFRight {width:100%; padding:0; margin:0; min-height: 10px;} #PFRight img#adobe {visibility:hidden; display:none; width:0; height:0;} #PFTextSocialFB {margin: .75em 0 .9em 0; width: 100%; height:auto; min-height: 10px;} #footnav {float:left; clear:none; display:block; width:100%; margin: .05em 0 1em 0; padding:0;} #footnav ul {display:table; width:100%; height: 2em; margin:0 auto; } #footnav li {display:table-cell; display:inline-block; margin: 0 .45% 0 .45%; } #footnav li a {padding: 0 .25em; line-height: 1.5em;} #PFTextSocial, #PFLeft, .PFText {visibility:hidden; display:none; width:0; height:0;margin:0;padding:0;} .PFCopy {float:none; clear:both; text-align:center; font-size:.725em; width: 99.8%; min-height: 1.25em; margin: .65em auto .63em auto; padding:0;} .PFCopy a{margin: 0 .75em 0 0;} /* ========== Überschriften, Absätze, Formulare, Tabellen ========== */ input#Senden, button#Info {font-size: 1.2em; height: 2.1em; margin: .5em .1em .75em .1em; padding: .2em .75em .3em .75em;} .button {font-size: 1.2em; height: 1.7em; margin:.5em .15em .75em .15em; padding: .2em .75em .1em .75em;} h1 {font-size: 1.52em; margin: .1em 0 .25em 0;} h1.home {font-size: 1.65em; color: #7A858B; font-weight:normal; line-height: 1.2em; margin: .3em 0 .25em .31em; padding:0; text-align:left;} h2 {font-size: 1.25em; margin: 0 0 .18em 0; letter-spacing:0;} h2.home {font-size: 1.15em; color: #7A858B; font-weight:normal; line-height: 1.2em; margin: 0 0 1.1em .31em; padding:0; text-align:left;} p.hotline { margin-right: 0.5em; padding: 137px 0 0 .31em; width: 90%; } span.preis2 {font-size: 90%; } /*Preis rechts*/ ul.home {list-style:none; margin: 5px 0 .25em -17px; text-align:left;} /* Tabellen */ table th {line-height: 1.1em;} table.float td {float:left} td {float:left} /* #TextBox table {font-size: 1em;} */ table#tarife th {visibility:hidden;display:none;width:0; height:0;margin:0;padding:0;} table#tarife td {margin:0; padding: .15em; line-height: 1.6em; border-bottom: 0px solid #F4F6F7;} table#tarife td {float:left;} table#tarife td:first-child {width:95%;background-image:none;padding:1em;} table#tarife td:last-child {width:95%;padding:0 1em 1em 0;border-bottom: 1px solid #F4F6F7;} /* Zweite Tabelle Hosting ------------------------------------------------------------------ */ table#tarife2 {width: 100%; margin:0; padding:0;} /* Die beiden Klassen formatieren den Tableheader mit hellgrauem Hintergrund */ table#tarife2 th {margin:0; padding: 3px;} table#tarife2 th h3 {font-size: 1em; margin:0; padding: 6px 2px 4px 2px;} table#tarife2 td {line-height: 1.6em; margin:0; padding: 2px 0 0 3px; } table#tarife2 td.preis {line-height: 1.6em; margin: 0; padding: 5px 8px 5px 5px;} /* Beide Klassen formatieren die Tarife in der ersten Spalte, "td.title" enthält das Hintergrundbild */ table#tarife2 td.title {margin:0; padding: .6em .5em .6em .85em;} table#tarife2 td a {font-size: .975em; margin:0; padding: 3px 3px 3px 0;} table#reference_list td {float:left; width:90%;} table#reference_detail td {float:left; width:90%;} /* Formulare */ /* Domaincheck - Auswahl ---------------- */ form.domain {margin: .9765625% 0 .9765625% 0; width: 98%; } input.domain {float:left; min-height: 2em; height:auto; width: 65%; margin: 0 0 1em 0;} select.domain { margin: 0 .3em 0 0;} form.form_whois input.form {width: 100%;} /* Log In rechts in der Info-Spalte ---------------- */ form.loginnav {text-align:left; margin:0; width: 98%; line-height: 1.2em;} form.loginnav a {color: #95A0A6;} input.formloginnav {float: left; width: 22.5%; margin: .2em .5em .15em .5em; height: 1.28em;} form.loginnav input.form {} form.loginnav label {float:left; width: 4.05em; margin:0; padding:0;} /* Log In im Inhaltsbereich der Seite ---------------- */ input.form {width: 80%; max-width: 180px;} form.login label {line-height: 2em; margin: .9em 0 0 0;} form.login input.form {width: 100%;} /* FAQ ---------------- */ form.form_faq_search {clear:both; float:none; margin: 0 0 .75em 0; min-width: 60%; width: 100%; max-width: 300px;} form.form_faq_search label {width: 30%;} form.form_faq_search input#search {line-height: 1.4em; width: 65%; max-width: 160px; height:auto; margin:0; padding: .15em; background-color: #fff;} /* Kontaktformular ---------------- */ textarea.form {width: 89%; } select.form {width: 89%; height: 1.8em; margin: 0 0 0.4em 0;} input.form {width: 89%; height: 1.8em; margin: 0 0 0.4em 0;} } /* END MEDIA QUERIE } */ /* @media (max-width: 410px) { #stopper {width:149px; height:auto; top:165px; right:27%; margin:0; padding:0;} } */ /* END MEDIA QUERIE */