@charset "ISO-8859-1";
/* ==================== Reset, defaults, clearfix ==================== */
* { margin: 0; padding: 0; outline: none }
body { background: #4a4844 url(img/hg.gif) repeat; font: normal 11px/18px Verdana, Arial, Helvetica, sans-serif; color: black }
h1 { font: bold 16px/21px Georgia, "Times New Roman", Times, serif; color: #900; display: inline-block }
h1.teaser { font-size: 17px }
h2 { font: bold 12px/18px Georgia, "Times New Roman", Times, serif; color: #626366; margin-bottom: 12px }
h2.portfolio { margin-bottom: 1px }
h2.sitemap { margin: 15px 0 12px }
h3 { font: bold 12px/16px Verdana, Geneva, sans-serif; color: #900; margin-bottom: 8px }
h3.category { font: normal 12px/16px Arial, Helvetica, sans-serif; color: #399026; margin-bottom: 3px }
h4 { font: bold 14px/17px Verdana, Arial, Helvetica, sans-serif; color: #fb9942; padding-left: 4px; margin: 12px 0 4px 0 }
h5 { font: bold 10px/16px Verdana, Arial, Helvetica, sans-serif; color: #626366 }
h6 { background-color: #4d4b47; font: bold 11px/16px Verdana, Arial, Helvetica, sans-serif; color: #f8f7f5; width: 176px; height: 17px; padding-left: 6px }
hr { background-color: #aaa; height: 1px; border: 0 }
tr, td { vertical-align: top }
fieldset, img { border: 0 }
ul, ol, dl { list-style: none; margin-bottom: 15px }
ul.bulletList { list-style: square }
ul.bulletList li { margin-left: 13px }
.layoutPageBody ul li { list-style: none; background: url(img/bullets/bulletFull.png) 0 9px no-repeat; padding-left: 10px; line-height: 21px; margin-bottom: 2px }
p { margin-bottom: 14px }
a:link, a:visited { font: bold 11px/18px Verdana, Arial, Helvetica, sans-serif; color: #313d7a; text-decoration: underline }
a:hover, a:active { color: #900 }
a.bullet { background: url(img/bullet_green.png) 0 2px no-repeat; padding-left: 16px }
a.iconLinkPdf { background: url(img/icons/iconPdf.png) no-repeat; clear: both; float: none; overflow: hidden; display: inline-block; height: 23px; padding-left: 26px }
a.buttonNarrow, a.buttonWide { clear: both; float: none; overflow: hidden; display: block; height: 23px; font-size: 13px; color: white; padding-top: 2px; margin-bottom: 5px; text-align: center }
a.buttonNarrow { background: url(img/buttons/button90.png) no-repeat; width: 90px }
a.buttonWide { background: url(img/buttons/button150.png) no-repeat; width: 150px }
.accentuate { font-weight: bold; color: #313d7a }
.note { float: right; margin-top: 3px }
.imgFloated { float: left; margin: 5px 10px 5px 0 }
.imgBordered { border: 2px solid #878c94 }
.moreDistance { margin-top: 20px }
.lessDistance { margin-top: -10px }
.item { margin-bottom: 26px; overflow: hidden }
.noShow { visibility: hidden; height: 0 }
.group, .item { display: inline-block }
.group:after, .item:after { clear: both; content: "."; display: block; font-size: 0; height: 0; min-height: 0; visibility: hidden }
/* ==================== Version 4.1 (2007) ==================== */
/* ==================== (Index) Teaser moduls left side ("Diese Tage..." + "Weitere Tutorials") ==================== */
#modulsTeaser { position: absolute; top: 173px; left: 30px; width: 185px; overflow: hidden; z-index: 4 }
#modulsTeaser a, #modulsTeaser .modulScheduled { font: normal 11px/15px Verdana, Arial, Helvetica, sans-serif; color: white }
#modulsTeaser span { display: block }
#modulsTeaser .modulPreview { margin-bottom: 10px }
#modulsTeaser .modulPreview .modulHead, #modulsTeaser .modulScheduled .modulHead { background: url(img/teaserBox/previewHeadRight.png) 100% 0 no-repeat; padding-right: 8px }
#modulsTeaser .modulPreview .modulHead .modulHeadInner, #modulsTeaser .modulScheduled .modulHead .modulHeadInner { background: url(img/teaserBox/previewHeadLeft.png) 0 no-repeat; height: 44px }
#modulsTeaser .modulPreview .modulHead .modulHeadInner img, #modulsTeaser .modulScheduled .modulHead .modulHeadInner img { position: relative; top: 11px; left: 15px }
#modulsTeaser .modulPreview .modulBody, #modulsTeaser .modulScheduled .modulBody { background: url(img/teaserBox/previewBodyRight.png) 100% 0 repeat-y; padding-right: 8px }
#modulsTeaser .modulPreview .modulBody .modulBodyInner, #modulsTeaser .modulScheduled .modulBody .modulBodyInner { background: url(img/teaserBox/previewBodyLeft.png) 0 repeat-y; padding: 0 10px 25px 26px }
#modulsTeaser .modulPreview .modulBody a.linkBlock:link { display: block; color: white; text-decoration: none }
#modulsTeaser .modulPreview .modulBody a.linkBlock:visited { color: white }
#modulsTeaser .modulPreview .modulBody a.linkBlock:hover { text-decoration: underline }
#modulsTeaser .modulPreview .modulBody a.linkBlock span { display: block }
#modulsTeaser .modulPreview .modulBody a.linkBlock span.hiddenHeadline, #modulsTeaser .modulScheduled .modulBody .modulBodyInner .hiddenHeadline { position: absolute; text-indent: -9999px; height: 0 }
#modulsTeaser .modulPreview .modulBody a.linkBlock span.date { font-size: 11px; font-weight: bold; margin: 0 0 0 -4px }
#modulsTeaser .modulPreview .modulBody a.linkBlock span.headline { font: bold 13px/17px Verdana, Arial, Helvetica, sans-serif; color: #fb9942; text-decoration: underline; margin: 7px 0 6px }
#modulsTeaser .modulPreview .modulBody a.linkBlock span.relatedToScriptaculous { display: inline-block; padding: 0 }
#modulsTeaser .modulPreview .modulFoot, #modulsTeaser .modulScheduled .modulFoot { background: url(img/teaserBox/previewFootRight.png) 100% 100% no-repeat; height: 27px; padding-right: 8px }
#modulsTeaser .modulPreview .modulFoot .modulFootInner, #modulsTeaser .modulScheduled .modulFoot .modulFootInner { background: url(img/teaserBox/previewFootLeft.png) 0 100% no-repeat; height: 27px; padding-left: 8px }
#modulsTeaser .modulScheduled .date { font-weight: bold; margin-left: -5px }
#modulsTeaser .modulScheduled h4 { font: bold 13px/17px Verdana, Arial, Helvetica, sans-serif; color: #fb9942; padding: 0; margin: 7px 0 3px }
#modulsTeaser .modulScheduled a { color: #fb9942 }
#modulsTeaser .modulScheduled hr { background-color: #958b7b; margin: 12px 0 -3px }
/* ==================== (Index) 1. Teaser + (Index) "Ãœber wwwdesign.info (Version 4.1)" ==================== */
table.teaser, .articleMain table.ueberschrifttabelle, table.about { margin-bottom: 12px }
span.date { display: inline; font-weight: bold }
span.dateAccent { border-bottom: 1px dotted black }
/* ==================== (Index) 2. Teaser "Frontend Developer sucht neue Herausforderungen!" ==================== */
.teaser .teaserSearch { background-color: #969487; border-top: 2px solid #878c94; border-right: 2px solid #878c94; border-left: 2px solid #878c94; font-size: 13px; height: 200px; margin-top: 20px }
.teaser .teaserSearch { height: 200px }
.teaser .teaserSearch object { width: 377px; height: 200px }
.teaser .teaserSearch object a img { border: 0 }
.teaser .teaserSearchIntro { background-color: white; border-right: 2px solid #878c94; border-left: 2px solid #878c94; font-size: 11px; line-height: 17px; padding: 3px 15px 1px 10px; position: relative; width: 352px }
.teaser .teaserSearchIntro .teaserHeadlines { margin-bottom: 1px }
.teaser .teaserSearchIntro .teaserHeadlines div { display: none }
.teaser .teaserSearchIntro .teaserHeadlines div.active { display: block }
.teaser .teaserSearchIntro a.teaserClaim { display: block; border-bottom: 1px dotted #900; font: bold 17px/21px Georgia, "Times New Roman", Times, serif; color: #900; text-align: center; padding: 8px 0 13px; text-decoration: underline; cursor: pointer }
.teaser .teaserSearchIntro a.teaserClaim:hover { color: #d9751d }
.teaser .teaserSearchIntro h2 { border-bottom: 1px dotted; font-size: 12px; line-height: 17px; text-align: center; margin-bottom: 6px }
.teaser .teaserSearchIntro div .hiddenHeadline { position: absolute; text-indent: -9999px }
.teaser .teaserSearchIntro div a.preAktuellesCodebeispiel { display: block; font-size: 15px; color: #900; text-align: center; margin: -2px 0 19px }
.teaser .teaserSearchIntro div a.preAktuellesCodebeispiel:hover { color: #d9751d }
.teaser #teaserSearchDetails { background-color: white; position: relative; width: 361px; border-right: 2px solid #878c94; border-left: 2px solid #878c94; font-size: 11px; line-height: 17px; padding: 10px 0 20px 16px }
.teaser #teaserSearchDetails hr { width: 343px }
.teaser #teaserSearchDetails ul { line-height: 10px; list-style: none; margin-top: 0 }
.teaser #teaserSearchDetails ul li.vita { margin: 6px 0 11px 0 }
.teaser #teaserSearchDetails ul li a img { border: 0 }
.teaser #teaserSearchDetails h2 { margin: 12px 0 5px }
.teaser #teaserSearchDetails h2.portfolioProgAnd3d { margin-bottom: 9px }
.teaser #teaserSearchDetails a:visited img, #teaserSearchDetails a:hover img { border: 1px solid #313d7a }
.teaser #teaserSearchDetails a img { border: 1px solid #878c94; margin: 0 17px 10px 0 }
.teaser #teaserSearchDetails a.linkWeb, #teaserSearchDetails a.boxSamples, #teaserSearchDetails a.link3d, #teaserSearchDetails a.linkPortfolio, #teaserSearchDetails a.aboutMe { display: block; margin: -9px 0 13px; padding-right: 20px; text-align: right }
#teaserSearchDetails a.boxSamples { margin: 0 0 13px }
.teaser #teaserSearchDetails a.linkPortfolio { margin: 0 0 13px }
.teaser #teaserSearchDetails a.linkExampleCode { margin: 5px 0 13px 0 }
.teaser #teaserSearchDetails a.profile img { border: 0; margin: 0 0 1px 0 }
.teaser .teaserDetailsButton { width: 381px; margin-bottom: 25px }
.teaser .teaserDetailsButton div { display: none; border-top: 2px solid #878c94; text-align: right }
.teaser .teaserDetailsButton div.active { display: block }
.teaser .teaserDetailsButton div a { color: white; display: block; margin: -2px 20px 0 0; text-decoration: none }
.teaser .teaserDetailsButton div a span { background-color: #900; border: 2px solid #878c94; border-top: 2px solid white; color: white; font-weight: bold; padding: 3px 8px }
.teaser .teaserDetailsButton div a span:hover { background-color: white; color: #313d7a }
/* ==================== (Index) Box code-samples ==================== */
#sampleCodeBox { display: none; position: absolute; border: 1px solid #878c94; width: 1000px; height: 650px; left: 23px; margin-top: 43px; font: normal 11px/13px Verdana, Arial, Helvetica, sans-serif; padding: 10px 0 0 10px; z-index: 5; overflow: hidden; cursor: move }
#sampleCodeBox .codeSamples div { position: relative; display: inline-block; float: left; z-index: 2 }
#sampleCodeBox .codeSamples div a { display: block; border-top: 1px solid #878c94; border-right: 1px solid #878c94; border-bottom: 0; border-left: 1px solid #878c94; color: #313d7a; font-weight: bold; text-decoration: none; line-height: 18px; padding: 0 35px 1px }
#sampleCodeBox .codeSamples div a:hover { text-decoration: underline }
#sampleCodeBox .codeSamples div a.active { background-color: white; padding-bottom: 2px; text-decoration: underline }
#sampleCodeBox .codeSamples div.description { margin: 16px 6px 0 0 }
*+html #sampleCodeBox .codeSamples .description { margin-right: 8px }
#sampleCodeBox .codeSamples div.tabs { top: 13px }
#sampleCodeBox .codeSamples div.tabs div { background-color: #ddd; margin-right: 10px }
#sampleCodeBox .codeSamples .close { position: absolute; top: 22px; right: 11px }
#sampleCodeBox .codeSamples .close a { background-color: #ddd; padding: 0 16px 2px }
#sampleCodeBox .codeSamples #content { background-color: white; border: 1px solid #878c94; top: 4px; width: 987px; height: 604px; z-index: 1 }
#sampleCodeBox .codeSamples #content pre { position: relative; overflow: scroll; width: 977px; height: 604px; font: normal 13px/16px Arial, Helvetica, sans-serif; color: black; padding-left: 10px }
.sampleBox { background-color: #eee }
/* ==================== Tabs right side ("Aktuelle Codebeispiele", Xing, LinkedIn, Twitter, Facebook) ==================== */
.tabsRightSide, .tabsRightSideIndex { position: absolute; top: 100px; right: 0; z-index: 5 }
.tabsRightSide div div, .tabsRightSideIndex div div, .tabsRightSide .samplesCode, .tabsRightSideIndex .samplesCodeIndex { position: absolute; -moz-border-radius: 5px 0 0 5px; -webkit-border-radius: 5px 0 0 5px; -khtml-border-radius: 5px; -o-border-radius: 5px 0 0 5px; border-radius: 5px 0 0 5px; right: 0; background-color: white; background-position: 5px 6px; background-repeat: no-repeat; width: 42px; height: 42px; text-indent: -9999px }
.tabsRightSide a, .tabsRightSideIndex a { display: block; height: 100% }
.tabsRightSide .samplesCode, .tabsRightSideIndex .samplesCodeIndex { background: white url(img/buttonCodeSamples.png) 11px 24px no-repeat; height: 224px }
.tabsRightSide .externals, .tabsRightSideIndex .externalsIndex { position: absolute; top: 245px }
.tabsRightSide .externals .xing, .tabsRightSideIndex .externalsIndex .xing { background-image: url(img/iconXing.png) }
.tabsRightSide .externals .linkedin, .tabsRightSideIndex .externalsIndex .linkedin { background-image: url(img/iconLinkedIn.png); top: 50px }
.tabsRightSide .externals .twitter, .tabsRightSideIndex .externalsIndex .twitter { background-image: url(img/iconSocialTwitter.png); top: 100px }
.tabsRightSide .externals .facebook, .tabsRightSideIndex .externalsIndex .facebook { background-image: url(img/iconSocialFacebook.png); top: 150px }
/* ==================== (Index) Layout ==================== */
.header { background: url(img/backHead.png) 0 0 repeat-x; height: 144px; margin-top: 13px }
.header .theme { background: url(img/hg_oben.jpg) 13px 0 no-repeat; height: 144px }
.main { width: 100% }
.main .wrapperContent { float: left; background: url(img/frame.png) 100% 0 repeat-y; width: 100% }
.main .wrapperContent .contentFrame { background: url(img/contentBorder.png) repeat-y; width: 449px; margin-left: 229px }
.main .wrapperContent .contentFrame .content { background: #fbf6ee url(img/bgSearchBar.png) repeat-x; width: 383px; padding: 0 25px 40px 15px; margin: -15px 0 0 13px }
.main .wrapperContent .contentFrame .content.search { margin-top: 0 }
.main .frameBottom { background: white; width: 100%; height: 13px }
.preview { background: url(img/bgReferences.png) no-repeat; width: 124px; vertical-align: top }
.preview a { display: block; margin-bottom: 9px }
.preview.prevItem2 { background: url(img/bgReferences2.png) no-repeat; height: 219px }
.preview.prevItem3 { background: url(img/bgReferences3.png) no-repeat; height: 336px }
.preview.prevItem4 { background: url(img/bgReferences4.png) no-repeat; height: 94px }
.preview.prevItem5 { background: url(img/bgReferences5.png) no-repeat; height: 219px }
.articleMain { position: relative; margin-top: 10px; z-index: 2 }
.articleMain .articleHeader { margin-bottom: 5px; cursor: pointer }
.articleMain .articleHeader.noMouse { cursor: default }
.articleMain .article { margin-top: 10px }
.separatorNews { border-top: 1px dotted #837e79; height: 1px; margin: 15px 0 0 }
.separatorNews.last {margin-bottom: 30px }
.newsTitle, .newsPreviousTitle { position: relative; color: black; font-size: 11px; font-style: italic; font-weight: bold; margin: 5px 0 -17px; text-indent: 29px; z-index: 1 }
.newsTitle span, .newsPreviousTitle span { border-bottom: 1px dotted black }
.articleMain .articleHeader .ueberschrifttabelle { margin-bottom: 0 }
.defaultLayout table.teaser td.headline, .articleMain td.headline { text-indent: 14px }
.defaultLayout table.teaser td.headline { background: url(img/iconNewsHeadline.png) 0 0 no-repeat }
.articleHeader table.articleHeader { margin-bottom: 0 }
.articleMain .headline h1 { font-size: 13px }
.about { margin-bottom: 100px }
.about .ueberschrifttabelle { margin: 0 }
.about .articleAboutHeader { margin-bottom: 15px }
.about img { margin: 0 0 32px }
.signature { font-size: 13px; font-style: italic; margin-top: 40px }
.signature.author { margin-top: 25px }
.signature img { display: block; margin: 0 0 0 18px }
.articleMain .articleContent { display: none }
.articleMain .articleContent.active { display: block }
.articleMain .conclusion { margin: 10px 0 20px }
.articleMain .conclusion div { margin-top: 10px }
.articleMain .articleContent .articleSource { font-weight: bold }
.articleMain .conclusion .hint { font-weight: bold }
/* ==================== Version 4.0 (2007) ==================== */
/* ==================== Layout ==================== */
.logo, .searchBar, .nav, .frameTop, .frameTopRight, .frameRight, .frameLeft, .articlePortfolio, .headerBar, .headerBarRight, .titutmen, .titutart, .tiporueb, .divs,
.divshg, .diveinshg, .divsbeitraege, .divzweihg, .divdreihg, .divsprojekt, .divvierhg, .diveins, .divzwei, .divdrei, .cornerShadow, .styleswitcher, .menue, .article,
.defaultLayout { position: absolute }
.frameTop { z-index: 2; top: 0; left: 0; width: 99%; height: 13px; background-color: white }
.frameTopRight { z-index: 3; top: 0; right: 0; width: 100px; height: 13px; background-color: white }
.headerBar { z-index: 2; background: url(img/streifen.gif) repeat-x; top: 156px; left: 13px; width: 99%; height: 8px }
.headerBarRight { z-index: 1; background: url(img/streifen.gif) no-repeat; top: 156px; right: 13px; width: 13px; height: 9px }
.frameLeft { z-index: 5; top: 0; left: 0; background: white; width: 13px; height: 100% }
.frameRight { z-index: 5; top: 0; right: 0; background: white; width: 13px; height: 100% }
.logo { z-index: 3; top: 0; left: 0; width: 194px; height: 35px }
.logo a { display: block; text-indent: -9999px; height: 35px; background: white url(img/logo.gif) no-repeat }
.nav { top: 48px; left: 36px; width: 180px; height: 140px; z-index: 3 }
.nav dl { width: 180px; height: 100px; margin: 0 }
.nav dl dd { height: 20px; margin: 0; text-indent: -9999px; overflow: hidden; margin-bottom: 6px }
.nav dl dd a { background-color: #749047; height: 20px; display: block; cursor: pointer }
.nav dl dd.typ1 { margin-bottom: 8px }
.nav dl dd.typ1 a { background: url(img/navi.png) 0 -19px no-repeat; width: 138px; margin: 0 0 8px 0 }
.nav dl dd.typ1 a:hover { background-position: 0 -38px }
.nav dl dd.typ1 a.active { background-position: 0 -57px }
.nav dl dd.typ2 a { background: url(img/navi.png) -137px -19px no-repeat; width: 142px; margin-left: 37px }
.nav dl dd.typ2 a:hover { background-position: -137px -38px }
.nav dl dd.typ2 a.active { background-position: -137px -57px }
.nav dl dd.typ3 a { background: url(img/navi.png) -278px -19px no-repeat; width: 123px; margin-left: 42px }
.nav dl dd.typ3 a:hover { background-position: -278px -38px }
.nav dl dd.typ3 a.active { background-position: -278px -57px }
.nav dl dd.typ4 a { background: url(img/navi.png) -400px -19px no-repeat; width: 65px; margin-left: 12px }
.nav dl dd.typ4 a:hover { background-position: -400px -38px }
.nav dl dd.typ4 a.active { background-position: -400px -57px }
.menue { z-index: 3; top: 218px; left: 34px; width: 176px; text-align: right; line-height: 15px }
.menue table td { padding-bottom: 4px }
.menue table td.category { width: 150px }
.menue table td.category.flash a { display: inline-block; margin-top: -4px }
.menue table td.quantity { width: 26px; font: normal 11px/14px Verdana, Arial, Helvetica, sans-serif; color: white }
.article { z-index: 3; top: 390px; left: 34px; width: 176px; text-align: right; line-height: 13px }
.article table td { padding-bottom: 9px }
.article table td.category { width: 150px }
.article table td.quantity { width: 26px; font: normal 11px/13px Verdana, Arial, Helvetica, sans-serif; color: white }
.article table td.separatorNewOld { height: 40px }
.articlePortfolio { z-index: 3; top: 373px; left: 34px; width: 176px; text-align: right; line-height: 14px }
.articlePortfolio table td { padding-bottom: 7px }
.articlePortfolio table td.category { width: 150px }
.articlePortfolio table td.quantity { width: 26px; font: normal 11px/13px Verdana, Arial, Helvetica, sans-serif; color: white }
.topOfPage { display: block; height: 58px }
*+html .topOfPage { height: 101px }
.topOfPage.index { height: 72px }
/* ==================== Defaults (Part 1) ==================== */
.searchBar { z-index: 4; background: url(img/bgSearch.png) no-repeat; top: 156px; left: 233px; width: 441px; height: 29px }
.searchBar form { margin: 2px 0 0 24px }
.searchBar form table td.searchField { width: 150px }
.searchBar form table td.searchButton { padding-top: 2px }
.titutmen { z-index: 2; background: url(img/titutmen.gif) no-repeat; top: 178px; left: 48px; width: 161px; height: 34px }
.titutmen a { display: block; height: 34px }
.titutart { z-index: 2; background: url(img/titutart.gif) no-repeat; top: 351px; left: 48px; width: 161px; height: 33px }
.titutart a { display: block; height: 33px }
.tiporueb { z-index: 2; background: url(img/tiporueb.gif) no-repeat; top: 332px; left: 39px; width: 170px; height: 33px }
.tiporueb a { display: block; height: 33px }
.divshg { z-index: 4; top: 174px; left: 692px }
.divs { z-index: 5; top: 174px; left: 692px }
.diveinshg { background: url(img/div_1.jpg) no-repeat; top: 0; left: 0; width: 280px; height: 82px }
.diveinshg a { display: block; height: 82px }
.divsbeitraege { background: url(img/divsbeitraege.gif) no-repeat; top: 95px; left: 6px; width: 174px; height: 34px }
.divsbeitraege a { display: block; height: 34px }
.divzweihg { background: url(img/div_2.gif) no-repeat; top: 133px; left: 0; width: 186px; height: 110px }
.divzweihg a { display: block; height: 110px }
.divdreihg { background: url(img/div_3.gif) no-repeat; top: 244px; left: 0; width: 186px; height: 124px }
.divdreihg a { display: block; height: 124px }
.divsprojekt { background: url(img/divsprojekt.gif) no-repeat; top: 381px; left: 6px; width: 182px; height: 38px }
.divsprojekt a { display: block; height: 38px }
.divvierhg { background: url(img/divVier.png) no-repeat; top: 419px; left: 0; width: 167px; height: 116px }
.divvierhg a { display: block; height: 116px }
.diveins { bottom: -71px; left: 15px; width: 255px }
.divzwei { top: 164px; left: 18px; width: 150px }
.divzwei a, .divdrei a { display: block }
.divzwei a:hover, .divdrei a:hover { text-decoration: underline }
.divzwei .boxHeadline, .divdrei .boxHeadline { height: 18px; text-align: center; text-transform: uppercase }
.divzwei .boxHeadline a:hover, .divdrei .boxHeadline a:hover { color: black }
.divzwei .boxContent, .divdrei .boxContent { padding-left: 8px }
.divdrei { top: 271px; left: 18px; width: 150px }
.divzweitab, .divdreitab { width: 150px }
.styleswitcher { z-index: 4; background: url(img/hg_styleswitcher.gif) no-repeat; top: 205px; left: 438px; width: 209px; height: 16px }
.styleswitcher table { width: 63px; height: 14px; margin: 2px 0 0 143px }
.styleswitcher table td { width: 21px }
.defaultLayout { z-index: 1; top: 0; left: 0; width: 100% }
.defaultLayout table { width: 100% }
.hgbild { background: url(img/backHead.png) 0 0 repeat-x }
.backHeadArea { background: url(img/hg_oben.jpg) 0 0 no-repeat; height: 144px }
.cornerShadow { z-index: 4; width: 7px; height: 8px; top: 157px }
.cornerShadow.left { background: url(img/cornerShadowL.png) no-repeat; left: 226px }
.cornerShadow.right { background: url(img/cornerShadowR.png) no-repeat; left: 674px }
.shareTwitter { position: absolute; top: 0; left: 194px; background: white; width: 80px; height: 35px; z-index: 3 }
.shareTwitter .twitter-share-button { position: relative; top: 8px; left: 0 }
/* ==================== Headlines (graphics) ==================== */
.headerTitleCategory { z-index: 3; position: absolute }
.headerTitleCategory.index { top: 116px; left: 504px }
.headerTitleCategory.sitemap { top: 119px; left: 551px }
.headerTitleCategory.search { top: 119px; left: 412px }
.headerTitleCategory.author { top: 93px; left: 258px }
.headerTitleCategory.photos { top: 117px; left: 569px }
.headerTitleCategory.books { top: 96px; left: 399px }
.headerTitleCategory.gallery3d { top: 120px; left: 570px }
.headerTitleCategory.imprint { top: 119px; left: 526px }
.headerTitleCategory.tutorials { top: 119px; left: 546px }
.headerTitleCategory.tutHtml { top: 120px; left: 544px }
.headerTitleCategory.tutStylesheets { top: 119px; left: 439px }
.headerTitleCategory.tutWeb2-0JavaScript { top: 118px; left: 394px }
.headerTitleCategory.tutPhp { top: 123px; left: 580px }
.headerTitleCategory.tutFlash { top: 121px; left: 583px }
.headerTitleCategory.tut3dAnimation { top: 118px; left: 459px }
.headerTitleCategory.portfolio { top: 120px; left: 550px }
.headerTitleCategory.portProgramming { top: 99px; left: 456px }
.headerTitleCategory.port3dAnimation { top: 118px; left: 459px }
.headerTitleCategory.portPrint { top: 119px; left: 491px }
.headerTitleCategory.portFlyer { top: 119px; left: 434px}
.headerTitleCategory.portBusinessCards { top: 117px; left: 494px }
/* ==================== Defaults (Part 2) ==================== */
.toBeAnnounced { display: block; margin: 61px 0 720px; text-align: center }
.toBeAnnounced .date { color: #900; display: block; font: bold 14px/13px Verdana, Arial, Helvetica, sans-serif; margin: 5px 0 }
.toBeAnnounced .linkOverview { display: block; margin-top: 63px }
.tabelle td.index { padding-bottom: 110px }
#eingabefeld { width: 120px; height: 14px; background-color: #e7e1da; border: 1px solid #52524d; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; padding: 0 10px 1px; margin-top: 2px }
.fazit { background-color: #e4dbd3; float: left; width: 168px; margin: 6px 21px 70px 0; padding: 5px 23px 5px 10px; text-align: justify }
.fazit.typ2 { margin: 6px 21px 20px 0 }
.fazit table { font: normal 11px/18px Verdana, Arial, Helvetica, sans-serif; color: black; margin: 5px 0 17px }
.fazit table td { padding-right: 5px }
.subline { background: url(img/trennstrich.gif) no-repeat; width: 380px; height: 35px; padding-top: 9px; margin-top: 90px; clear: both }
.subline.fewContent { margin-top: 800px }
.subline.fewContentTyp2 { margin-top: 600px }
.subline.fewContentTyp3 { margin-top: 400px }
.subline a { display: block; font-size: 11px; font-weight: normal; height: 25px }
.subline .imprint { float: left }
.subline .imprint a { margin-left: 8px }
.subline .linkTopOfPage { float: right }
.subline .linkTopOfPage a { background: url(img/pfeil_hoch.gif) no-repeat; padding-left: 15px; margin-right: 8px }
.ankerpfeilsuche { width: 9px }
.ankerlinkbereich { width: 242px; text-align: right; vertical-align: middle }
.ankerlinkbereichzwei { width: 86px; text-align: right; vertical-align: middle }
.output div { margin-bottom: 0 }
.output ol { list-style: none }
.output ol li { margin-bottom: 10px }
.output ol li a { font: bold 13px/19px Georgia, "Times New Roman", Times, serif; color: #900; margin-bottom: 10px }
.output ol li span.mod { color: #777 }
.output ol li span.mod a { display: inline-block; font: normal 11px/18px Verdana, Arial, Helvetica, sans-serif; margin-bottom: 2px }
.output a { font-weight: bold }
*+html .output { height: 0 !important }
em { font-weight: bold; color: #900 }
.mod { display: block; padding-bottom: 12px; font-size: 10px }
.navtabhoehe { height: 26px }
.linkabstand { padding-bottom: 10px }
.articleHeader table td.headline { background: url(img/iconNewsHeadline.png) 0 -100px no-repeat; width: 380px; padding: 8px 0 0 }
.articleHeader.active table td.headline, .articleMain.active table td.headline { background: url(img/iconNewsHeadline.png) 0 0 no-repeat; width: 380px }
td.headline.news { padding-bottom: 0 }
td.headline img { margin-bottom: -5px }
.ueberschrifttabelle { width: 380px; height: 42px; margin-bottom: 17px }
.ueberschrifttabelle.shortDistance { margin-bottom: 0 }
.ueberschrifttabelle.typ2 { margin-top: 40px }
.ueberschrifttabellezwei { width: 380px; height: 30px; margin-bottom: 35px }
.ueberschrifttabellebullet { background: url(img/iconHeadline.png) 0 bottom no-repeat; width: 30px }
.ueberschriftartikel { width: 350px; padding: 8px 0 2px }
.ueberschriftstrich { height: 1px; background-color: #837e79 }
.ueberschriftdetails { height: 12px; text-align: right; vertical-align: bottom }
.aktualisierung { font: italic bold 10px/18px Verdana, Arial, Helvetica, sans-serif; color: #900; margin-right: 6px }
.kursivklein { font: italic 10px/18px Verdana, Arial, Helvetica, sans-serif }
.anthrazitklein { margin-bottom: 10px }
.articleOverview { width: 380px; vertical-align: top; margin-bottom: 22px }
.articleOverview.sitemap { width: 380px; vertical-align: top; line-height: 20px }
.articleOverview.sitemap a { font-weight: normal }
.articleOverview.sitemap .articleOverviewText a { font-weight: bold }
.articleOverview.sitemap img.note { float: left; margin: 5px 175px 5px 0 }
.articleOverview.overview img.note { float: none; margin: 5px 0 -2px 15px }
.articleOverview.further .articleOverviewText a { font-size: 12px }
.articleOverviewBullet { width: 50px; vertical-align: top }
.articleOverviewBullet a.article { position: static }
.articleOverviewBar { width: 15px; background: url(img/strich_senkrecht.gif) no-repeat }
.articleOverviewText { width: 315px; padding-bottom: 2px; font: bold 11px/16px Verdana, Arial, Helvetica, sans-serif }
.articleOverviewText a { font: bold 15px/19px Georgia, "Times New Roman", Times, serif }
.einleitung { font: bold 11px/18px Verdana, Arial, Helvetica, sans-serif; color: #555 }
.bildueberschrift, .bildunterschrift { color: #878587 }
.bildunterschrift { margin-bottom: 20px }
.bild { border: 2px solid #878C94; margin: 18px 0 7px }
.bildIndex { border: 2px solid #878c94; margin: 15px 0 25px }
.bildlinks { float: left; margin-right: 12px; margin-bottom: 5px }
.bildrechts { float: right; margin-left: 8px; margin-bottom: 5px }
.personalData td.query { width: 65px }
.personalData td.return { width: 315px }
.referenceLong { background: url(img/bgReferencesLong.png) no-repeat; vertical-align: top; width: 124px }
.referenz { width: 380px }
.referenzeins { width: 31px }
.referenzzwei { background: url(img/hg_referenzen.gif) no-repeat; width: 124px; vertical-align: top }
.referenzdrei { width: 20px }
.referenzvier { width: 205px; height: 21px }
.prevTypItem3 { height: 208px }
.prevTypItem4 { height: 139px }
.referenzfuenf { height: 10px; background: url(img/trennstrich_punktiert_2.gif) no-repeat }
.leistenabstaende { padding-top: 10px; padding-bottom: 8px }
.leiste { font: normal 11px/14px Arial, Helvetica, sans-serif; color: #737170 }
.bildunterschrift { font-size: 10px; line-height: 18px; color: #666; text-align: center }
.achtung { background-color: #edccc6; width: 338px; border: 1px solid black; padding: 9px 20px; margin-bottom: 17px }
.codebox { background-color: white; width: 378px; border: 1px solid #7f7873; margin-bottom: 15px }
.code { background-color: white; width: 358px; max-width: 376px; overflow: hidden; padding: 10px; font: 12px/15px monospace, Courier; color: #313d7a }
.coderelevant { color: #f00 }
.coderelevantgruen { color: #080 }
.trennstreifen { background: url(img/trennstreifen.gif); background-repeat: repeat-x }
.beschreibung { font: normal 11px/18px Verdana, Arial, Helvetica, sans-serif }
.gross { font: bold 14px/18px Arial, Helvetica, sans-serif; color: white }
.blau { font: bold 14px/15px Verdana, Arial, Helvetica, sans-serif; color: #4f78aa }
.galerie { margin-top: 5px }
.galerie img.bild { margin: 0 0 3px }
.galerieeins { width: 31px }
.galeriezwei { width: 124px; vertical-align: top; text-align: center }
.galeriedrei { width: 20px }
.galerievier { width: 205px; height: 21px }
.galeriefuenf { width: 1px; height: 17px; background: url(img/trennstrich_punktiert_2.gif) no-repeat }
.smallPreview { width: 111px }
/* ==================== Portfolio ==================== */
.loginBox, .notice { border: 1px solid #837e79; padding: 6px 10px 21px; text-align: center; margin: 15px 0 35px }
.loginBox h6, .notice h6 { background-color: #829a3f; width: auto; margin-bottom: 13px }
.loginBox p, .notice p { padding: 0 10px }
.loginBox.index p { padding: 0 50px }
.loginBox div, .notice div { font-size: 12px }
.loginBox input.password { background: white url(img/bgInput.png) repeat-x; border: 1px solid #837e79; -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; width: 135px; height: 19px; font-size: 11px; text-align: center; padding: 0 10px; margin: 3px 0 15px }
.loginBox input.button { background: url(img/bgButtonLogin.png) no-repeat; border: 0; width: 84px; height: 22px; text-indent: -9999px; cursor: pointer }
.loginBox input.button.logout { background-image: url(img/bgButtonLogout.png) }
.bild.teaser, .bild.animation, .bild.print { margin: 0 }
.flashVideo { text-align: center; margin: 20px 0 30px }
.flashVideo object { width: 320px; height: 277px }
.animation3d { margin: 20px 0 10px }
.animation3d.bowcraft, table.animation3d.shape, table.animation3d.logo3d, table.animation3d.desk, table.animation3d.house3d { padding-left: 40px }
.animation3d.abwassertechnik .typ1, table.animation3d.memorial .typ1, table.animation3d.accommodation .typ1, table.animation3d.kitchenBathPlanner .typ1, table.animation3d.firstAnimation .typ1 { width: 210px }
.animation3d.firstAnimation .typ1 { padding-bottom: 15px }
.animation3d.abwassertechnik img.description, table.animation3d.memorial img.description, table.animation3d.kitchenBathPlanner img.description { margin-bottom: 10px }
.animation3d.aqugenius .bildueberschrift { padding-bottom: 8px }
.print { padding-left: 40px }
td.category { width: 110px }
.photos .description, .photos .hintElderPhotos { text-align: center }
.photos .new { margin-bottom: 30px }
.photos .new img { position: relative; background-color: #efe8dd; left: 4px; margin-bottom: -7px }
.photos .collage { position: relative }
.photos .collage img { position: absolute; background-color: #efe8dd }
.photos .collage .typ1 { top: 24px; left: 29px }
.photos .collage .typ2 { top: 109px; left: 226px }
.photos .collage .typ3 { top: 186px; left: 0 }
.photos .collage .typ4 { top: 290px; left: 79px }
.photos .collage .description { position: relative; top: 474px }
.photos .collage .description span { text-decoration: underline }
ul li.phone { margin-top: 10px }
ul li.email a { margin-left: 12px }
/* ==================== "3D-Galerie" ==================== */
.galleryTyp1, .galleryTyp2, .galleryTyp3 { position: absolute; padding: 10px }
.galleryTyp1 img, .galleryTyp2 img, .galleryTyp3 img { border: 4px solid white }
.galleryTyp1 { width: 808px; height: 608px }
.galleryTyp2 { width: 1032px; height: 776px }
.galleryTyp3 { width: 1288px; height: 968px }
/* ==================== "Bücher Webdesign und Programmierung" ==================== */
.book { margin-top: 30px }
.book td.imageAndDetails { width: 260px; padding-left: 20px }
.book td.imageAndDetails img { border: 2px solid #878c94; margin-bottom: 7px }
.book td.imageAndDetails ul img { border: 0; margin: 0 }
.book td.rating { width: 100px; text-align: right }
.book td.rating ul li { float: left; width: 20px; height: 16px }
.book td.rating ul li.full { background: url(img/ratingStars.png) no-repeat }
.book td.rating ul li.half { background: url(img/ratingStars.png) 0 -16px no-repeat }
.book td.rating ul li.empty { background: url(img/ratingStars.png) 0 -32px no-repeat }
/* ==================== Additional links ==================== */
a.stand, a.alterna, a.kontra, a.stand:visited, a.alterna:visited, a.kontra:visited { display: block; width: 15px; height: 12px }
a.stand, a.stand:visited { background-image: url(img/style_1_kon.gif) }
a.stand:hover, a.stand:active { }
a.alterna, a.alterna:visited { background-image: url(img/style_2.gif) }
a.alterna:hover, a.alterna:active { }
a.kontra, a.kontra:visited { background-image: url(img/style_3.gif) }
a.kontra:hover, a.kontra:active { }
a.men, a.men:visited { line-height: 15px; color: #eee; text-decoration: none }
a.men:hover, a.men:active { color: #c8dd8a }
a.menaktiv, a.menaktiv:visited { line-height: 15px; color: #c8dd8a }
a.menaktiv:hover, a.menaktiv:active { }
a.art, a.art:visited { font-size: 10px; line-height: 13px; color: #eee; text-decoration: none }
a.art:hover, a.art:active { color: #c8dd8a }
a.artaktiv, a.artaktiv:visited { font-size: 10px; line-height: 13px; color: #c8dd8a }
a.artaktiv:hover, a.artaktiv:active { }
a.divsueberschrift, a.divsueberschrift:visited { color: #333 }
a.divsueberschrift:hover, a.divsueberschrift:active { }
a.divstextweiss, a.divstextweiss:visited { line-height: 14px; color: white; text-decoration: none }
a.divstextweiss:hover, a.divstextweiss:active { }
a.divstextweissunterstrich, a.divstextweissunterstrich:visited { line-height: 14px; color: #df9534 }
a.divstextweissunterstrich:hover, a.divstextweissunterstrich:active { color: white }
a.divstext, a.divstext:visited { line-height: 13px; color: #f8f3ec; text-decoration: none }
a.divstext:hover, a.divstext:active { color: #f8f3ec }
a.articleOverview, a.articleOverview:visited { font: bold 14px/20px Georgia, "Times New Roman", Times, serif }
a.articleOverview:hover, a.articleOverview:active { }
a.ueberschriftleiste, a.ueberschriftleiste:visited { font-family: Tahoma, Arial, sans-serif; line-height: 14px; color: #737170 }
a.ueberschriftleiste:hover, a.ueberschriftleiste:active { color: #ce2a32 }
a.author, a.author:visited { font-size: 10px; font-weight: normal; font-style: italic }
a.author:hover, a.author:active { }
a.article, a.article:visited { display: block; background: url(img/bullet.gif) 0 no-repeat; width: 50px; height: 50px }
a.article:hover, a.article:active { background-position: -50px 0 }
a.linkduenn, a.linkduenn:visited { line-height: 20px }
a.linkduenn:hover, a.linkduenn:active { }
a.leiste, a.leiste:visited { font-family: Arial, Helvetica, sans-serif; line-height: 14px; color: black }
a.leiste:hover, a.leiste:active { color: #ce2a32 }
a.klein, a.klein:visited { font-size: 10px }
a.klein:hover, a.klein:active { }
a.kleinfett, a.kleinfett:visited { font-size: 10px }
a.kleinfett:hover, a.kleinfett:active { }
a.arrowRight { display: block }
.imprint a:link, .imprint a:visited { font-weight: normal }
.imprint a:hover, .imprint a:active { }
Relaunch! | Version 6.0 demnächst... |
|
| Zuletzt aktualisiert: 16. Januar 2012 | |
Ab 20. Februar 2012: Wieder “up-to-date”, mit Elementen der
Social Media 
und Web 2.0 -Technologien,
wird die jetzige veraltete Website (Version 4.1 von 2008!) abgelöst.
Fluid-Layout + media-queries + HTML5 + CSS 3... |
| 16. Januar 2012/ von Stefan Plagge |
Aktuelles Projekt ist eine “mobile” Demo-Seite (für alle Endgeräte) mit Fluid-Layout und den aktuellen Web-Technologien (HTML5 ,
CSS 3 ,
jQTouch ,
Sencha Touch ,
jQuery Mobile ,
Ext JS ,
jQuery ,
Ajax
und PHP .
Die Demo-Seite ist ab 13.02.2012 verfügbar.
(Screenshot der Demo-Seite)
Blog:
Artikel: How To Build A Mobile Website |
| 27. November 2011/ von Stefan Plagge |
Auf Smashing Magazine
gibt es eine sehr interessante Einführung (in englisch) mit den Pros & Cons bezgl. der technischen Umsetzung von “mobilen” Websites:
How To Build A Mobile Website .
Bei dieser Gelegenheit auch gleich noch die Artikel-Übersicht
“Guidelines For Mobile Web Development”
mit einigen informativen Leitfäden zur Thematik “Entwicklung für mobile Endgeräte”.
Meine Meinung:
Smashing Magazine vermittelt mittels weniger Artikel bereits die wichtigsten (Grundlagen-) Informationen.
Aus aktuellem Anlass (bzgl. Flash®
für mobile Endgeräte): Technologievordenker Steve Jobs
setzte auf (die offiziellen) Webstandards und veröffentlichte, im April 2010, aufschlussreiche Gedanken hierzu: Thoughts on Flash (engl.).
Blog-Archiv (Anklicken öffnet Blog):
Vorschau auf Opera Dragonfly 1.1 |
| 19. Juni 2011/ von Stefan Plagge |
Das seit Version 1.0 durchweg konkurrenzfähige Debugging-Tool wird ständig weiterentwickelt und kann -mit all seinen Verbesserungen- vorab mit einem aktuellem
Opera Build (ab Version 11.50)
ausprobiert werden.
ausprobiert werden.
Meine Meinung:
Neben Safaris Developer Tools
(in ähnlicher Form auch in Google Chrome
enthalten) befinden sich diese beiden Developer-Tools mittlerweile auf dem Niveau (mit kleinen Abstrichen) von
Firebug .
U.a. wegen der enormen Erweiterbarkeit bleibt der Firefox
mein Browser “für alle Gelegenheiten”.
Bei der Arbeit kann man auf eine riesige Anzahl von (Developer-) Add-Ons zurückgreifen, z.B.
HTML Validator ,
JSView ,
QuickJava und
EventBug .
Innovationsschub auf dem Browsermarkt |
| 14. August 2010/ von Stefan Plagge |
Das Magazin vergleicht, in kompakter Weise, den aktuellen Stand von Internet Explorer ,
Firefox ,
Safari ,
Opera und
Chrome .
,
Firefox ,
Safari ,
Opera und
Chrome .
Meine Meinung:
Der “Einsteiger”-Artikel macht auch deutlich, dass für die Gesamt-Performance eines Browsers im Alltagsgebrauch mehr notwendig ist
als “einfach nur schnell” zu sein.
Die besten Plugins für jQuery... |
| 19. Juli 2010/ von Stefan Plagge |
Die Auswahl an Plugins für jQuery
im Web ist riesig und (naturgemäß) unübersichtlich. Die BLOGPROGRAMMIERER
hatten im Vorjahr eine Auswahl zusammengestellt, welche die Bezeichnung “Best of...” wirklich verdient: jQuery: Die 20+ besten Content - Plugins (Scroll, Accordion, Slide) .
Auch einen Besuch wert ist die Zusammenstellung der Plugins im Teil 1 der “Best of jQuery-Tutorials”
des Webstandard- Blogs .
Bei dieser Gelegenheit lohnt auch ein Klick auf Teil 2
und Teil 3
der Bestenliste.
Meine Meinung:
Einige der (eher selten anzutreffenden) Zusammenstellungen, bei denen die vorgestellten Beipiele durchweg sinnvoll und “stimmig” sind.
Google Chrome 5: Beta-Version verfügbar |
| 09. Mai 2010/ von Stefan Plagge |
Wie das Team um den Google-Browser in ihrem Blog
mitteilt, ist die aktuelle Beta-Version
jetzt schon bis zu 35 Prozent schneller als die stabile Version 4.1.
mitteilt, ist die aktuelle Beta-Version
jetzt schon bis zu 35 Prozent schneller als die stabile Version 4.1.Des weiteren wurden natürlich etliche Verbesserungen integriert. U.a. wurde die Unterstützung für HTML5 weiterhin verbessert.
weiterhin verbessert.
Meine Meinung:
Chrome überholte
im Januar Safari
(Apple) und verfügt nun (Mai 2010) über einen Marktanteil um 7 Prozent .
Durch den -in absehbarer Zeit- zweistelligen Marktanteil kommen auch “Google-kritische” Web-Entwickler nicht mehr umhin, den Browser
zu berücksichtigen; und die umstrittene Browser-ID lässt sich mittlerweile ja problemlos deaktivieren.
Firebug: Website mit neuem Layout |
| 11. Februar 2010/ von Stefan Plagge |
Die Website des Firefox Add-ons Firebug
hat ein neues Layout.
hat ein neues Layout.
Schnell, schneller: jQuery 1.4 |
| 19. Januar 2010/ von Stefan Plagge |
Hiervon profitiert nicht nur die relativ träge JavaScript-Engine des Internet Explorers: Ursprünglich als kleines Update geplant,
beinhaltet jQuery 1.4
nicht nur neue Funktionen, sondern verfügt über eine um 40 Prozent höhere Performance im Vergleich zum direkten Vorgänger.
nicht nur neue Funktionen, sondern verfügt über eine um 40 Prozent höhere Performance im Vergleich zum direkten Vorgänger.
Mein Tipp:
Wegen einiger Inkompatibilitäten zu früheren Versionen: Testen, testen, testen... und dann mit der kommenden
Version 3.6 von Firefox
eine (fast) unschlagbare Performance genießen!
Firefox überholt Internet Explorer |
| 01. Dezember 2009/ von Stefan Plagge |
Das Hamburger Marktforschungsunternehmens Fittkau & Maaß
hat ermittelt, dass der Firefox-Browser (in Deutschland) mit 45,4 Prozent Marktanteil vor dem Internet Explorer (44,5 Prozent) liegt.
hat ermittelt, dass der Firefox-Browser (in Deutschland) mit 45,4 Prozent Marktanteil vor dem Internet Explorer (44,5 Prozent) liegt.
Quelle: heise open
Meine Meinung:
Microsoft hatte zwar mit dem Internet Explorer 8
in mehrerer Hinsicht große Fortschritte gemacht; alleine schon aus Sicherheitsgründen (und natürlich der enormen Erweiterbarkeit!) sollte man jedoch
Firefox den Vorzug geben.
Dank der riesigen Verfügbarkeit von Add-ons
für Webentwickler (z.B. Firebug
und Web Developer )
gibt es zur Zeit keine gleichwertige Alternative.
Über wwwdesign.info (Version 4.1) |
|
| Update: 16. Januar 2012/ von Stefan Plagge | |
wwwdesign.info (die komplett neue Version 6.0 erscheint demnächst) ist meine Informationsseite mit Tutorials aus verschiedenen Bereichen der Webentwicklung und des Webdesigns. U.a. (X)HTML, CSS, JavaScript, jQuery, script.aculo.us, PHP (neu), Web 2.0 (neu) und Flash®.
Falls Sie an den Möglichkeiten interessiert sind welche sich mit 3D-Programmen ergeben, so finden Sie hier Beispiele für die beiden Szenarien “Stills” und “Animation”.
Ich freue mich, falls auch Sie hier interessantes Material finden, welches Sie für die Umsetzung ihrer Webprojekte verwenden können!
Falls Sie mehr über meine bisherigen Arbeiten erfahren möchten, so finden Sie hier mein Portfolio, sowie ein paar Fakten über mich (Stefan Plagge), z.B. meinen Lebenslauf.
Für eine vollständige Übersicht aller Inhalte (bzw. Artikel) meiner Website besuchen Sie bitte die Sitemap.
Herzlichst,
