/** * Skinng styles * @project Webgo24 * @version 1.0 * @copyright 2009 * * @colordef #F4F4F4 Hellgrau (Hintergrund) * @colordef #111 Quasi-Schwarz (Text) * @colordef #FAFAFA Quasi-Weiß (Box-Hintergründe) * @colordef #FFF Weiß (Box-Border) * @colordef #BF2811 Rot (Standard-Rot von Logo etc) * @colordef #001 Blauschwarz (Links) * @colordef #1E5A9E Dunkelblau (Link-Unterstreichungen, Link-Hover etc) * @colordef #0A4991 Tiefes Dunkelblau (Button-Hover) * @colordef #F00 Knallrot (Aktive Links) * @colordef #E3E3E3 Leichtes Grau (Borders, Trenner in Linklisten) * @colordef #DDD Grau (Tabellenrahmen) * @colordef #F0F4FA Hellblau (Hervorhebungen) * @colordef #F2F2B8 Gelb (Zusatz-Hintergründe) * @colordef #A00 Dunkelrot (Fehlermeldungen) * */ /** * Basics * @section basics */ #wrapper { background:url(../img/body-bg.png) top center repeat-x; } body { background:#F4F4F4 url(../img/content-bg.png) center center repeat-y; color:#111; font-size:12px; line-height:1.75; font-family:Verdana, Arial, sans-serif; } strong, b { font-weight:bold; } em, i { font-style:italic; } blockquote { font-style:italic; } q { font-style:italic; } q:before, blockquote p:before { content:"\201E"; font-family:Arial, sans-serif; font-size:1.1em; } q:after, blockquote p:after { content:"\201C"; font-family:Arial, sans-serif; font-size:1.1em; } q q:before, blockquote p q:before { content:"\201A"; font-family:Arial, sans-serif; font-size:1.1em; } q q:after, blockquote p q:before { content:"\2018"; font-family:Arial, sans-serif; font-size:1.1em; } q em, blockquote p em { font-style:normal; } del, strike { text-decoration:line-through; } a { text-decoration:none; padding:1px 0; } a:link { color:#001; border-bottom:1px solid #1E5A9E; } a:visited { color:#001; border-bottom:1px solid #1E5A9E; } a:hover { color:#0A4991; border-bottom:1px solid transparent; } a:active { color:#F00; border-bottom:1px solid transparent; } div.imagelink a, a.imagelink { border:none !important; } a.important { font-weight:bold; border-width:2px; } a.important:before { content:'» '; border-bottom:4px solid #FAFAFA; } h2 a:visited{ color:#FFFFFF; } h2 a:link{ color:#FFFFFF; } h2 a:active{ color:#FFFFFF; } /** * Layout * @subsection layout */ #seitenanfang { } #headwrapper { background:url(../img/header.png) bottom center no-repeat; } #header { height:272px; text-align:left; } #header h1 a { float:left; background-image:url(../img/logo.png); display:block; width:360px; height:68px; margin:48px 32px; padding:0; } #header h1 a:link, #header h1 a:visited { background-position:top left; } #header h1 a:hover, #header h1 a:active { background-position:bottom left; } #header h1 a span { display:block; height:0; width:0; overflow:hidden; } #header ul#quicklinks { margin-right:12px; margin-top:12px; } #content { position:relative; z-index:1; } #main { } #main .rowwrapper { position:relative; border:2px solid #FFF; background:#FFF; margin:0 0 16px 0; } #side { } #footnotes { color:#666; background:#F4F4F4; padding:1px 44px 16px 44px; margin:0 -12px; } #footnotes-nl { color:#666; padding:1px 44px 16px 44px; margin:0 -12px; } /** * Sonderbox * @subsection specialbox */ #special {background:#FFF; background-position: 1px 3px;background-repeat: no-repeat; position:absolute; width:448px; top:0; right:2px; z-index:1337; height:156px; border:1px solid #FFF; border-top:none !important; } /*#special {background:#FFF; background-image:url(http://www.webgo24.de/assets/images/webhostaktion.jpg); background-position: 1px 3px;background-repeat: no-repeat; position:absolute; width:448px; top:0; right:2px; z-index:1337; height:156px; border:1px solid #FFF; border-top:none !important; }*/ #special h2 { font-size:1.55em; line-height:1.25; margin:12px 12px 8px 12px; } #special .bigtext{ font-size:1.25em; } #special .button { font-size:1.25em; padding-left:12px; padding-right:12px; } #special .border { height:4px; background:#1E5A9E; } /** * Quicklinks in Header und Footer * @subsection quicklinks */ #header #quicklinks, #footer2 ul { text-align:right; margin:0; padding:12px 32px 8px 32px; } #header #quicklinks li, #footer2 ul li { display:inline; background:none; border-left:1px solid #E3E3E3; margin-left:8px; padding-left:8px; } #header #quicklinks li { border-color:#EEE; } #header #quicklinks li.first, #footer2 ul li.first { border:none; } #header div.full { } /* * Box-Schatten und sonstige Deko * @subsection shadows */ .shadowed { position:relative; } .shadowed .box { position:relative; z-index:1337; } .rowwrapper .boxshadow1, .slideshow .boxshadow1 { background:url(../img/shadow-bigbox-top.png) top center no-repeat; width:752px; height:160px; position:absolute; top:-9px; left:-9px; z-index:-1; } .rowwrapper .boxshadow2, .slideshow .boxshadow2 { background:url(../img/shadow-bigbox-bottom.png) bottom center no-repeat; width:752px; height:160px; position:absolute; bottom:-9px; left:-9px; z-index:-1; } .boxcontainer .boxshadow1 { background:url(../img/shadow-smallbox-top.png) top center no-repeat; width:242px; height:128px; position:absolute; top:-9px; left:-9px; z-index:-1; } .boxcontainer .boxshadow2 { background:url(../img/shadow-smallbox-bottom.png) bottom center no-repeat; width:242px; height:128px; position:absolute; bottom:-9px; left:-9px; z-index:-1; } .miniangebot .boxshadow1 { background:url(../img/corner-shadow-top-left.png); height:64px; width:64px; position:absolute; top:-9px; left:-9px; z-index:0; } .miniangebot .boxshadow2 { background:url(../img/corner-shadow-bottom-left.png); height:64px; width:64px; position:absolute; bottom:-9px; left:-9px; z-index:0; } #special .boxshadow2 { background:url(../img/shadow-mediumbox-bottom.png) bottom center no-repeat; width:464px; height:160px; position:absolute; bottom:-9px; left:-9px; z-index:-1; } .smallshadow .boxshadow1 { background:url(../img/shadow-bigbox-mini-top.png) top center no-repeat; width:752px; height:32px; position:absolute; top:-9px; left:-9px; z-index:-1; } .smallshadow .boxshadow2 { background:url(../img/shadow-bigbox-mini-bottom.png) bottom center no-repeat; width:752px; height:32px; position:absolute; bottom:-9px; left:-9px; z-index:-1; } /** * Navigation * @section navigation */ #nav { font-size:1.55em; font-family:"Trebuchet MS", Verdana, Arial, sans-serif; margin:0; padding:0 4px; position:absolute; bottom:61px; left:0; } #nav ul { width:auto; } #nav li { background:none; margin:0; padding:0; } #nav li a { background-image:url(../img/tab.png); background-repeat:no-repeat; text-align:center; display:block; float:left; border-bottom:none; width:138px; height:32px; padding:6px 0 4px 0; } #nav li a:link, #nav li a:visited { color:#666; background-position:-999px -999px; } #nav li a:hover, #nav li a active { color:#1E5A9E; background-position:bottom center; } #nav li.active { } #nav li.active a { background-position:top left !important; margin:0 0 0 0; } #nav li.active a:link, #nav li.active a:visited { color:#001; } #nav li.active a:hover, #nav li.active a active { color:#1E5A9E; } #nav li ul { display:none; font-size:0.8em; margin:17px 0 0 16px; } #nav li ul li { display:block; float:left; border-left:1px solid #E0E0E0; margin:16px 0 8px 0; } #nav li ul li a { width:auto; padding:0 16px; margin-bottom:-4px; background:none !important; } #nav li ul li a:link, #nav li ul li a:visited, #nav li.active ul li a:link, #nav li.active ul li a:visited { color:#111; border:none; } #nav li ul li a:link span, #nav li ul li a:visited span { border-bottom:2px solid #E0E0E0; } #nav li ul li a:hover span, #nav li ul li a:active span { border-bottom:none; } #nav li ul li a:hover, #nav li ul li a active, #nav li.active ul li a:hover, #nav li.active ul li a:active { color:#1E5A9E; border:none; } #nav li ul li.active a:link span, #nav li ul li.active a:visited span { border-bottom:none; } #nav li ul li.active a:hover span, #nav li ul li.active a:active span { border-bottom:none; } #nav li ul li.first { border:none; } #nav li ul li.active a:link, #nav li ul li.active a:visited { color:#BF2811; } #nav li ul li.active a:active, #nav li ul li.active a:hover { color:#1E5A9E; } #nav li.active ul { display:block; } #nav li.first a { background-image:url(../img/tab-first.png); } #nav li.last a { background-image:url(../img/tab-last.png); } #nav li[class="last active"] a { margin-left:2px; } /** * Breadcrumbs * @subsection breadcrumbs */ #breadcrumbs { font-size:1.35em; font-family:"Trebuchet MS", Verdana, Arial, sans-serif; position:absolute; top:-3.5em; left:1em; z-index:1337; } /** * Subnavigation * @section subnavigation */ .intern #side { margin-top:0; } .intern #side h2 { font-weight:normal; font-size:1.55em; background:#1E5A9E; color:#FFF; font-family:"Trebuchet MS", Verdana, Arial, sans-serif; margin:0; padding:4px 24px; } .intern #side ul { list-style:none; font-family:"Trebuchet MS", Verdana, Arial, sans-serif; padding:0; margin-top:0; } .intern #side ul li { font-size:1.3em; background:none; margin:0; padding:0; } .intern #side ul li a { padding-left:16px; } .intern #side ul li a:link, .intern #side ul li a:visited { color:#111; border:none; } .intern #side ul li a:hover, .intern #side ul li a active { color:#1E5A9E; border:none; } .intern #side ul li.active a { background:url(../img/bullet-subnavi.png) center left no-repeat; color:#1E5A9E; } /** * Live-Chat-Box * @section side-livechat */ #side .chat a { border:none; } #side .chat img { display:block; margin:0; padding:0; } /** * Textelemente * @section text */ p, ol, ul, dl, table { margin:12px; } .absatz { padding-left: 12px; padding-right: 32px;} .absatzangaben { padding-left: 12px;} .vorwahl {width: 60px; float: left;} .telefonangaben {width: 107px; float: left;} h2 { font-size:1.55em; font-family:"Trebuchet MS", Verdana, Arial, sans-serif; margin:12px; } #main .rowwrapper h2, #slideshow h2 { font-size:1.5em; background:#BF2811; color:#FFF; margin:0; padding:0px 24px; } #side h2 { font-size:1.2em; font-weight:bold; } h2.blue { background-color:#1E5A9E !important; } h3 { font-size:1.45em; font-weight:bold; font-family:"Trebuchet MS", Verdana, Arial, sans-serif; margin:16px 12px 0 12px; } h3.tinytext { font-size:12px; font-weight:bold; font-family:Verdana, Arial, sans-serif; } h3 strong { color:#BF2811; } h4 { font-size:1.2em; font-weight:bold; font-family:"Trebuchet MS", Verdana, Arial, sans-serif; margin:20px 12px 0 12px; } h5 { font-weight:bold; margin:16px 12px -8px 12px; } h6 { margin:12px; } h2 a, h3 a, h4 a, h5 a, h6 a { border-width:2px !important; } ol { list-style-type:decimal; padding-left:24px; } ul { list-style:none; } ol li, ul li { margin:2px 0; } ul li { background:url(../img/bullet-list.png) 0.25em 0.5em no-repeat; padding-left:16px; } dl:after { content:"."; display:block; width:100%; clear:both; height:0; visibility:hidden; } dl dt { font-weight:bold; clear:right; float:left; padding:2px 0; } dl dt:after { content:":"; } dl dd { float:right; display:block; width:45%; padding:2px 0; } dl dd-imp { float:right; display:block; width:70%; padding:2px 0; } dl.alt dd, dl.alt dt { float:none; width:auto; } table.data { width:696px; border-collapse:collapse; } table.datal { width:696px; border-collapse:collapse; } table.data th, table.data td { text-align:left; border:1px solid #DDD; padding:4px; } table.datal th, table.data td { text-align:left; border:1px solid #DDD; padding:4px; } table.data th { font-weight:bold; } table.datal th { font-weight:bold; } table.data thead th { background-repeat:no-repeat; font-size:1.1em; padding-left: 35px;} table.datal thead th { background-repeat:no-repeat; font-size:1.1em; padding-left: 4px;} table.data thead th h3, table.data thead th h4, table.data thead th h5 { background:#BF2811; color:#FFF; margin:-4px; padding:4px; } table.datal thead th h3, table.datal thead th h4, table.datal thead th h5 { background:#BF2811; color:#FFF; margin:-4px; padding:4px; } table.data td { } table.datal td { } table.data tbody th { width:40%; } table.datal tbody th { width:40%; } table.data tbody th.icon { position:relative; padding-left:40px; } table.datal tbody th.icon { position:relative; padding-left:40px; } table.data tbody th.icon img.icon { position:absolute; left:16px; } table.datal tbody th.icon img.icon { position:absolute; left:16px; } /** * Tabelle für die 1ClickInstall Programme * @section text */ .1ci { width:696px; border-collapse:collapse; } .1ci th, .1ci td { text-align:left; border:1px solid #DDD; padding:4px; } .1ci th { font-weight:bold; } .1ci thead th { background-repeat:no-repeat; font-size:1.1em; padding-left: 38px;} .1ci thead th h3, .1ci thead th h4, .1ci thead th h5 { background:#BF2811; color:#FFF; margin:-4px; padding:4px; } .1ci td { } .1ci tbody th { width:40%; } .1ci tbody th.icon { position:relative; padding-left:40px; } .1ci tbody th.icon img.icon { position:absolute; left:16px; } del { color:#A00; } ins { color:#147D20; text-decoration:none; border-bottom:1px dotted #111; } sup { font-size:0.7em; font-weight:normal; vertical-align:super; padding:0 0 0 0.5em; margin-top:-0.5em; } /** * Forms * @section forms */ fieldset { border:none; background:#FFF; margin:12px; padding:0; } label { display:block; padding:2px 0; } div.radio label { display:inline; padding:0; width:auto; } .radio label { display:inline; padding:0; padding-right: 20px; width:auto; } .radio input {width:auto;} input, select, textarea, button { width:100%; } .wwworder{padding-left: 50px; margin-top: -2px; } .wwwwordpos{position: relative; margin-left: -41px; top:20px; width: 40px;} label input { width:auto; } input.auto { width:auto; } .addbox { background:#E4F7E6; border:1px solid #A1E3A9; margin:12px 0; } span.req { color:#BF2811; } p.formerror { } p.formerror input, p.formerror textarea, p.formerror select { } p.formerror span.error, .error-message { color:#A00; display:block; font-size:0.9em; } .black-message { color:#000; display:block; font-size:0.9em; } p.formerror span.input password error { color:#A00; display:block; font-size:2.9em; } p.formerror span.error-message { color:#A00; display:block; font-size:0.9em; } p.formerror label { color:#A00; font-weight:bold; } div.formerror label { color:#A00; font-weight:bold; } div.error label { color:#A00; font-weight:bold; } div.formerrors { background:#F7E6E6; border:2px solid #A00; margin:12px; } fieldset.medium p.micro { width:224px; } fieldset.medium p.atto { width:64px; } fieldset.medium p.piko { width:144px; } div.medium fieldset.medium { margin:0; width:336px; } /* Sonderfall Spalten-Form */ /** * * FAQ-Bewertungs-Formular * * @subsection faqform * */ #FaqQuestionVoteForm fieldset > p { font-weight:bold; } #FaqQuestionVoteForm fieldset label { position:relative; top:-3px; } #FaqQuestionVoteForm fieldset input { width:auto; margin-left:16px; } /** * Domaincheck-Formular * @subsection domaincheck */ .domaincheck h2 { padding-bottom:0 !important; } .domaincheck label { padding:4px 0; color:#999; } .domaincheck input { width:65%; } .domaincheck select { width:30%; } .sldwahl {float: left; width: 250px; margin-top: 3px; position: relative;} .tldwahl {margin-left: 5px; top: -4px; width: 70px;} /** * Auszeichnungen * @subsection auszeichnungen */ #auszScroll p { width:200px; padding-bottom:8px; } /** * Buttons * @section buttons */ p.buttons { clear:both; margin-top:20px; } p.bigbuttons { margin-top:8px; margin-bottom:0; } a.button, input.button { font-family:Arial, sans-serif; font-size:1.1em; text-align:center; font-weight:bold; display:inline-block; border:none !important; width:88px; padding:4px; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; } a.button { } a.button:link { background:#1E5A9E; color:#FFF; } a.button:visited { background:#1E5A9E; color:#EEE; } a.button:hover { background:#0A4991; color:#FFF; } a.button:active { background:#0A4991; color:#FFF; } input.button { cursor:pointer; background:#1E5A9E; color:#FFF; } input.button:hover { background:#0A4991; color:#FFF; } input.button:active { background:#0A4991; color:#FFF; } a.bigbutton { width:auto !important; font-size:1.25em; padding:4px 12px; } .autobutton { width:auto !important; } #voting input { display:inline !important; width:auto !important; } /** * Box-Styles * @section navigation */ .box { margin:8px; } #side .box .border { height:4px; background:#BF2811; margin:-1px -1px 0 -1px } /** * Tarife * @section plans */ .special { background:#F0F4FA; border:2px solid #BF2811; margin:6px 0; padding:0 6px; } .special img.corner { width:64px; height:64px; position:absolute; top: 0px; right:0px; } .special img.corneremail { width:64px; height:64px; position:absolute; top:0px; right:0px; margin-bottom: -49px;} .tarif { padding-top:4px; padding-bottom:4px; } .tarif h3 { margin-top:8px; } .tarif ul { } .tarif .price { height:160px; border:1px solid #000; position:relative; margin:0 12px; } .tarif .price p { text-align:right; line-height:1.75; position:absolute; bottom:0; right:0; margin:0; padding:2px 4px; } .tarif .price .tinytext { font-weight:bold; } .tarif .price .bigtext { font-size:1.9em; } .tarif .price span, .tarif .price strong { color:#000; background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAAQSURBVHjaYvj///9NgAADAAnVA9fevCTLAAAAAElFTkSuQmCC'); padding:3px 4px; } .tarif .tinytext sup { padding:2px; } .tarif .bigtext sup { font-size:0.5em; } .hosting-starter .price { background:url(../img/../../data/webhosting/starter-klein.jpg);} .hosting-home .price { background:url(../img/../../data/webhosting/home-klein.jpg);} .hosting-profi .price { background:url(../img/../../data/webhosting/profi-klein.jpg);} .hosting-business .price { background:url(../img/../../data/webhosting/business-klein.jpg);} .hosting-power .price { background:url(../img/../../data/webhosting/power-klein.jpg);} .hosting-powerplus .price { background:url(../img/../../data/webhosting/powerplus-klein.jpg);} .server-starter .price { background:url(../img/../../data/server/starter-klein.jpg);} .server-profi .price { background:url(../img/../../data/server/profi-klein.jpg);} .server-power .price { background:url(../img/../../data/server/power-klein.jpg);} .webhosttop{background-image:url(../../images/webhosttop.jpg);height: 400px; background-repeat: no-repeat;} .webhosttoptext{height: 100px; width: 240px; padding-top: 143px; margin-left: 250px;} .webhosttestentext{height: 100px; width: 500px; padding-top: 84px; margin-left: 130px;} .whtestbutton {margin-top:25px; margin-left:27px;} /** * Slideshow * @section slideshow */ #slideshow { background:#FFF; border:2px solid #FFF; position:relative; margin:0 0 16px 0; } #slideshow h2 { background:#BF2811; } #slideshow .box { min-height:250px; margin:0; padding:0; } #slideshow #slideshow-content { padding:2px 0px; } #slideshow .femto { position:absolute; z-index:1337; width:183px; margin:0; padding:0; } #slideshow #slidethumbs1 { top:249px; left:-8px; } #slideshow #slidethumbs2 { top:238px; right:0; } #slideshow .slidelink { display:inline; height:40px; width:183px; margin:8px; } #slideshow .slidelink:link, #slideshow .slidelink:visited { border:0px solid #CCC; } /** * Slideshow slides * @subsection slideshow-slides */ #slideshow .slide { height:248px; width:732px; } #slideshow .slide h3 { font-size:2.25em; float:left; padding:2px; margin-bottom:4px; } #slideshow .slide p { clear:both; font-size:1.5em; } #slideshow .slide p span { padding:2px; } #slideshow .slide div.content { width:732px; position:absolute; bottom:0; left:0; } /* Bild: http://www.istockphoto.com/stock-photo-10040345-young-man-lying-on-back-by-laptop-and-mobile-phone.php */ #slide-0 { background:url(../img/../../data/slide-zufrieden.jpg) center center no-repeat; } /* Bild: http://www.istockphoto.com/stock-photo-6170310-young-helpdesk-operators.php */ #slide-1 { background:url(../img/../../data/slide-support.jpg) center center no-repeat; } /* Bild: http://www.istockphoto.com/stock-photo-4979155-hand-giving-euro-banknotes-money.php */ #slide-2 { background:url(../img/../../data/slide-geld.jpg) center center no-repeat; } /* Bild: http://www.istockphoto.com/stock-photo-2651478-racing-cars.php */ #slide-3 { background:url(../img/../../data/slide-zugang.jpg) center center no-repeat; } /* Bild: http://www.istockphoto.com/stock-photo-1759899-isps-data-center.php */ #slide-4 { background:url(../img/../../data/slide-hardware.jpg) center center no-repeat; } /* Bild: http://www.istockphoto.com/stock-photo-9600873-wind-turbines-on-green-grass-field.php */ #slide-5 { background:url(../img/../../data/slide-oeko.jpg) center center no-repeat; } /** * Slideshow slide description backgrunds * @subsubsection slideshow-slides-text-backgrounds */ #slide-0 h3, #slide-0 p span, #slide-1 h3, #slide-1 p span, #slide-2 h3, #slide-2 p span, #slide-3 h3, #slide-3 p span, #slide-4 h3, #slide-4 p span, #slide-5 h3, #slide-5 p span {color:#000; background:#FFF; background:url(../img/'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAAQSURBVHjaYvj///9NgAADAAnVA9fevCTLAAAAAElFTkSuQmCC'); } /* #slide-3 h3, #slide-3 p span { color:#FFF; background:#000; background:url(../img/'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAAPSURBVHjaYmBgYLgJEGAAAN4A2iRyhfgAAAAASUVORK5CYII='); }*/ /** * Slideshow slides EXCHANGE * @subsection slideshow-slides */ #slideex-0 { background:url(../../images/slideshowhead/cont/1.jpg) center center no-repeat; } #slideex-1 { background:url(../../images/slideshowhead/cont/2.jpg) center center no-repeat; } #slideex-2 { background:url(../../images/slideshowhead/cont/3.jpg) center center no-repeat; } #slideex-3 { background:url(../../images/slideshowhead/cont/4.jpg) center center no-repeat; } #slideex-4 { background:url(../../images/slideshow/big/scheudle.jpg) center center no-repeat; } #slideex-5 { background:url(../../images/slideshow/big/mobile.jpg) center center no-repeat; } .posexorder {margin-left: 580px; margin-bottom: 20px; } .posexdetail {position: absolute; margin-left: 490px; margin-bottom: -17px; } .posextest {margin-left: 564px; margin-bottom: 20px; } .posextesttext {position: relative; top: 35px;} .posextext {position: relative; top: 50px;} /** * Slideshow slide description backgrunds * @subsubsection slideshow-slides-text-backgrounds */ #slideex-0 h3, #slideex-0 p span, #slideex-1 h3, #slideex-1 p span, #slideex-2 h3, #slideex-2 p span, #slideex-3 h3, #slideex-3 p span, #slideex-4 h3, #slideex-4 p span, #slideex-5 h3, #slideex-5 p span {color:#000; background:url(../../images/transbg.png); } /* #slide-3 h3, #slide-3 p span { color:#FFF; background:#000; background:url(../img/'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAAPSURBVHjaYmBgYLgJEGAAAN4A2iRyhfgAAAAASUVORK5CYII='); }*/ /** * Slideshow slides SEM * @subsection slideshow-slides */ #slidejoo-0 { background:url(../../images/slideshow-sem/cont/joomla.jpg) center center no-repeat; } #slidemedia-0 { background:url(../../images/slideshow-sem/cont/media.jpg) center center no-repeat; } #slidecopper-0 { background:url(../../images/slideshow-sem/cont/copper.jpg) center center no-repeat; } #slidetypo3-0 { background:url(../../images/slideshow-sem/cont/typo3.jpg) center center no-repeat; } #slideosc-0 { background:url(../../images/slideshow-sem/cont/osc.jpg) center center no-repeat; } #slidewp-0 { background:url(../../images/slideshow-sem/cont/wp.jpg) center center no-repeat; } /** * Sidebar * @subsection sidebar */ #side h2 { margin:0; padding:0 8px; } #side .box { background:#FFF; border:2px solid #FFF; margin:0 0 16px 0; } #side .boximage { display:block; margin:0; padding:0; } /** * Banner * */ img.WHLVBanner, img.WHLbanner { display:inline-block; height:60px; width:140px; background:url(../img/loader.gif) center center no-repeat; } img.HPKbanner { display:inline-block; height:100px; width:200px; background:url(../img/loader.gif) center center no-repeat; } /** * Footer * @subsection footer */ /*#footer { border-top:4px solid #C71E0F !important; background:#F8F8F8; }*/ /* Das "important" ist nötig um die IE-Hacks zu überstimmen */ #footer2 { padding:8px 16px 48px 16px; margin:0 -16px; background:#F4F4F4 url(../img/footer2.png) center bottom no-repeat; } #footer2 p { padding-left:16px; } /** * Miniangebot * @section miniangebot */ .miniangebot { background:#F2F2B8; font-weight:bold; border:1px solid #DBDBAF; position:relative; width:104px; margin-right:-32px; padding:12px 8px; z-index:1337; } .miniangebot { line-height:1.4; } .miniangebot .bigtext { font-size:1.4em; color:#C00; display:block; padding:6px 0; } .miniangebot .corner { background:url(../img/postit-corner-bottom.png) bottom right no-repeat; display:block; height:10px; width:10px; position:absolute; bottom:-11px; right:-2px; } /** * Extrabox * @section extrabox */ .extrabox { background:#F2F2B8; border:1px solid #DBDBAF; margin-top:12px; } .formboxok { background:#fff; background:url(http://www.webgo24.de/assets/images/hakenerfolg.jpg) top left no-repeat; border:2px solid #006600; font-weight:bold; color: #006600; margin:12px 12px 12px 12px; padding: 35px 15px 0 100px; height: 55px; width: 585px} .formboxerror { background:#fff; background:url(http://www.webgo24.de/assets/images/erfolglos.jpg) top left no-repeat; border:2px solid #990000; font-weight:bold; color: #990000; margin:12px 12px 12px 12px; padding: 35px 15px 0 100px; height: 55px; width: 585px} /** * Zitate * @section quotescroller */ #quotescroller { background:#ffffff url(../img/quote.png) top left no-repeat; border:0px solid #DBDBAF; padding-left:45px; padding-top:77px; padding-right:40px; padding-bottom:55px; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; } #quotescroller .quote blockquote, #quotescroller .quote blockquote p { margin:0; } .quotecontrol { text-align:left; color:#CCC; font-size:1.25em; } .quotecontrol a { border:none; font-weight:bold; } p.quoted { font-style:italic; font-weight:bold; padding-left:32px; margin-bottom:32px; } #quotescroller p.quoted { padding-left:16px; } /** * Tooltips * @section tooltips */ div.tip-wrap { z-index:1337; margin-top:-2px; } div.tip { text-align:left; background:#F2F2B8; border:1px solid #DBDBAF; width:256px; } div.tip div.tip-title { font-weight:bold; margin:6px; } div.tip div.tip-text { margin:6px; } /** * * * New side navigation * * * @subsection sidenavi * * */ #side ul#sidenavi { margin:8px 6px; } #side ul#sidenavi a { font-style:normal; padding:0 !important; background:none; } #side ul#sidenavi a:link { color:#001; } #side ul#sidenavi a:visited { color:#001; } #side ul#sidenavi a:hover { color:#0A4991; } #side ul#sidenavi a:active { color:#F00; } #side ul#sidenavi li { font-family:"Trebuchet MS", Verdana, Arial, sans-serif; font-size:1.45em; font-style:italic; color:#CCC; } #side ul#sidenavi li ul { display:none; margin:0; } #side ul#sidenavi li ul li { font-size:0.9em; } #side ul#sidenavi li.active > a { color:#0A4991 !important; } #side ul#sidenavi li.active > ul { display:block } #side ul#sidenavi li.active { background:url(http://www.webgo24.de/assets/templates/img/bullet-list.png) 0 0 no-repeat; } #side ul#sidenavi li.active.children { background:url(http://www.webgo24.de/assets/templates/img/bullet-list-active.png) 0 0 no-repeat; } /* Level 1 */ #side ul#sidenavi li { margin-bottom:4px; padding:0 0 0 16px; } #side ul#sidenavi li a { font-weight:bold; } #side ul#sidenavi li.active { background-position:0 10px; } #side ul#sidenavi li.active.children { background-position:0 11px; } /* Level 2 */ #side ul#sidenavi li li { margin-bottom:0; } #side ul#sidenavi li li a { font-weight:normal; } #side ul#sidenavi li li.active { background-position:0 8px; } #side ul#sidenavi li li.active.children { background-position:0 9px; } #side ul#sidenavi li li.active.current > a { color:#BF2811 !important; border-bottom:1px solid #BF2811; } /* Level 3 */ #side ul#sidenavi li li ul { margin-bottom:4px; } #side ul#sidenavi li li li { font-family:Verdana, Arial, sans-serif; font-size:12px; padding-left:12px; } #side ul#sidenavi li li li.active { background-position:0 6px; } #side ul#sidenavi li li li.active.children { background-position:0 7px; } #side ul#sidenavi li li li.active.current > a { color:#BF2811 !important; border-bottom:1px solid #BF2811; } /** * Nützliche Klassen * @section classes */ .boxdeco { background:url(../img/boxdeco-bg.png) bottom right no-repeat; margin:-8px; padding:2px 8px 8px 0; } .boxdeco-block { display:block; background:url(../img/boxdeco-bg.png) bottom right no-repeat; margin:8px 12px; padding:0 8px 8px 0; } .tinytext { font-size:0.85em; } .bigtext { font-size:1.3em; } img.icon { margin:0 12px -4px 8px; } .help { cursor:help; } .online, .yes { color:#147D20; } .offline { color:#A00; } .no { color:#666; } .autowidth { width:auto !important; } fieldset div.clear p { margin:32px 12px -12px 12px; } .supbalken {border: 0px; border-bottom: 2px; border-color: #bf2811; width: 100%} .supleft {padding-left: 175px; height: 100px; background-repeat: no-repeat;} .supright {padding-right: 175px; height: 100px; background-repeat: no-repeat; background-position: 550px;} thead.toggleable { cursor:pointer; } /* Sorgt für den richtigen Cursor */ thead.opened { font-style:inherit; background-image:url(http://www.webgo24.de/assets/images/close.png); background-repeat:no-repeat} thead.closed { font-style:inherit; background-image:url(http://www.webgo24.de/assets/images/open.png); background-repeat:no-repeat} thead.foo th {padding-left: 0px !important; } .rzoeko { background:url(http://www.webgo24.de/assets/images/rootserver/technik/oekostrom.jpg); padding-left: 266px; padding-right: 18px; padding-top: 9px; height: 114px;} /** * IE8 * @section ie8 */ /* Opacity-Ersatz */ #ie8 #footnotes p.footnote { color:#999; } /** * IE7 * @section ie7 */ /* IE behandelt height wie min-height */ #ie7 { height:188px; } /* Clearfix-Hack */ #ie7 .clearfix { display:inline-block; } /* Opacity-Ersatz */ #ie7 #footnotes p.footnote { color:#999; } /* Schatten müssen rausfliegen und durch klare Borders ersetzt werden */ #ie7 .boxshadow1 { display:none; } #ie7 .boxshadow2 { display:none; } #ie7 #special, #ie7 #main .rowwrapper, #ie7 #main #slideshow, #ie7 #footer, #ie7 #side .box { background:#FFF; border:1px solid #E8E8E8; padding:1px; } /* Vereinheitlichung mit der neuen Border */ #ie7 #main .rowwrapper h2 { border:1px solid #E8E8E8; } #ie7 #main .rowwrapper img.boxdeco { margin-top:-22px; margin-left:-7px; } /* Verhindert Layout-Wackler beim Mouseover */ #ie7 #main .rowwrapper div { zoom:1; } /* Domaincheck */ #ie7 .domaincheck input { width:65%; margin-left:-12px; } #ie7 .domaincheck select { width:30%; } /* Miniangebot um ein paar px verschoben */ #ie7 .miniangebot { margin-right:-30px; } /* Treppeeffekt bei den nebeneinander stehenden Buttons */ #ie7 div.tarif a.button { float:none !important; } /* Bügelt einen Script-Resize-Fehler aus */ #ie7 div.tarif ul { padding-bottom:8px; } /* Definitionslisten sind nicht zu retten */ #ie7 dl dt, #ie7 dl dd { float:none; display:block; width:100%; } /* Wenn das hier nicht da ist passieren SCHRECKLICHE Dinge */ #ie7 #slideshow { height:320px; } /* Der IE berechnet die Position irgendwie anders */ #ie7 table.data tbody th.icon { border-bottom:1px solid #FFF; } #ie7 table.data tbody th.icon img.icon { position:absolute; left:2%; } /* Versteckt Tooltip-Artefakte */ #ie7 div.tip-wrap { margin-top:-16px; } /* PNG-Fallback funktioniert nicht? WTF! */ #ie7 #slide-0 h3, #ie7 #slide-0 p span, #ie7 #slide-1 h3, #ie7 #slide-1 p span, #ie7 #slide-2 h3, #ie7 #slide-2 p span, #ie7 #slide-3 h3, #ie7 #slide-3 p span, #ie7 #slide-4 h3, #ie7 #slide-4 p span, #ie7 #slide-5 h3, #ie7 #slide-5 p span, #ie7 .tarif .price span, #ie7 .tarif .price strong { background:#FFF; } /** * IE6 * @section ie6 */ /* Alpha Image Loader für das Logo */ #ie6 #header h1 a { background:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='logo.png', sizingMethod='crop'); cursor:pointer; } /* IE behandelt height wie min-height */ #ie6 { height:188px; } /* Clearfix-Hack */ #ie6 .clearfix { display:inline-block; } /* Opacity-Ersatz */ #ie6 #footnotes p.footnote { color:#999; } /* Das hier schiebt die Navi an die richtige Position */ #header div.full ul { width:976px; } /* Schatten müssen rausfliegen und durch klare Borders ersetzt werden */ #ie6 .boxshadow1 { display:none; } #ie6 .boxshadow2 { display:none; } #ie6 #special, #ie6 #main .rowwrapper, #ie6 #main #slideshow, #ie6 #footer, #ie6 #side .box { background:#FFF; border:1px solid #E8E8E8; padding:1px; } /* Miniangebot um ein paar px verschoben */ #ie6 .miniangebot { margin-right:-24px; } #ie6 .miniangebot span.corner { right:0; bottom:-12px; } /* Definitionslisten sind nicht zu retten */ #ie6 dl dt, #ie6 dl dd { float:none; display:block; width:100%; } /* Slideshow im IE6 ist nicht zu retten */ #ie6 #slideshow { display:none; } /* Sidebar sitzt nicht */ #ie6 #side { margin-right:-8px; } /* Domaincheck */ #ie6 .domaincheck input { width:50%; margin-left:-12px; } #ie6 .domaincheck select { width:25%; } /* Fixt die Footer-Links */ #ie6 #footer p { margin:12px 6px; } /* Alle bunten Headline sind im IE kaputt */ #ie6 h2.blue { background:none !important; } /* Versteckt Tooltip-Artefakte */ #ie6 div.tip-wrap { margin-top:-16px; } /* Rechts ausgerichtete Icons im IE6 gehen nicht */ #ie6 table.data tbody th.icon { position:static; padding-right:4px; } #ie6 table.data tbody th.icon img.icon { position:static; } /* Keine Transparenz im IE6 */ #ie6 .tarif .price span, #ie6 .tarif .price strong { background:#FFF; } /* Gegen Tarifgewackel */ #ie6 .tarif { zoom:1; } /* Treppeeffekt bei den nebeneinander stehenden Buttons */ #ie6 div.tarif a.button { float:none !important; } /* Zu lange Tabellen sprengen das Layout */ #ie6 table.data { width:95%; } /* Sind im IE6 einfach nicht auf eine akzeptable Höhe zu bringen -> rauswerfen */ #ie6 div.border { display:none; } /** * Non-JSTricks * @section nojs */ /* Falsche Position */ .nojs .tarif img.corner { display:none; } /* Slideshow ohne JS */ .nojs #slideshow div.slide + div.slide { display:none; } .nojs #slideshow #slidethumbs1, .nojs #slideshow #slidethumbs2 { visibility:hidden; } .nojs #slideshow div.slide div.content { padding:0 120px; } /* Kundenzitate ohne JS */ .nojs #quotescroller div.quote + div.quote { display:none; } /*Skripte verstecken*/ .hiddenscr {display:none;} /*E-Mail Seite*/ .emailindexbild {background-image:url(../../images/mail.jpg);height: 395px; background-repeat: no-repeat;} .emailkleineboxtext {position: relative; top:55px; left: 405px; width: 300px;} .emailgallerie{position: relative; top:60px; left: 65px; border: 1px #1e5b9e;} .emailverglbild{background-image:url(../../images/webmail.jpg); background-repeat: no-repeat; background-position: 20px; height: 246px;} .emailverglbildtext{position: relative; text-align: right; width: 510px; height: 60px; background:url(../../images/transbg.png);top: 180px; left: 221px;} .emailsyncpic{background-image:url(../../images/wg24sync.jpg);height: 247px; background-repeat: no-repeat;} .emailsynctexto{position: relative; text-align: right; width: 680px; height: 60px; background:url(../../images/transbg.png);top: 60px; left: 53px;} .emailsynctextu{position: relative; text-align: right; width: 680px; height: 60px; background:url(../../images/transbg.png);top: 97px; left: 53px;} .emailsync2pic{background-image:url(../../images/wg24sync2.jpg);height: 247px; background-repeat: no-repeat;} .emailsync2texto{position: relative; text-align: right; width: 475px; height: 60px; background:url(../../images/transbg.png);top: 89px; left: 256px;} .emailexcho{position: relative; text-align: right; width: 720px; height: 60px; background:url(../../images/transbg.png);top: 180px; left: 11px;}