/* Hi there and welcome to the source code of this site. Feel free to be inspired, enlightened or amused by this code. Do note that literally copying any of this site's content without politely asking first will NOT make you popular. Do ask. I'm nice. As for images or other graphic content: don't copy. Really, don't. For more information contact me at info@agwebdesign.nl or find me at www.agwebdesign.nl. */ ul, ol { list-style: none; } h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; } ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input { margin:0; padding:0 } a img,:link img,:visited img, fieldset { border:none } address, cite { font-style:normal } /* end */ .hidden_navigation { display: none; } /* general layout */ body { color: #595f62; text-align: center; font: 62.5%/1.4em "Lucida Grande", "Lucida Sans Unicode", Lucida, Verdana, sans-serif; background: #fff; } #site { line-height: 1.4em; } #content { clear: both; text-align: left; margin: 0px auto; width: 700px; padding: 0em 25px; background: #fff url(../images/bg_sidebar.png) repeat-y right top; } #masthead { text-align: left; margin: 0px auto; width: 700px; } #main { font-size: 1.2em; line-height: 1.4em; width: 433px; padding: 0.4em 0em 2em 0em; } #sidebar { font-size: 1.1em; line-height: 1.4em; width: 180px; float: right; padding-left: 28px; margin-top: 8.5em; padding-bottom: 2em; } #footer { clear: both; color: #7e8387; line-height: 1.6em; background-color: #fefefe; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; text-align: left; margin: 0px auto 3em auto; width: 700px; padding: 2em 25px;} #footer img { float: left; margin-right: 25px; } #footer address { float: left; } #footer ul { margin-left: 520px; } #footer a { color: #595f62; } #footer a:visited { color: inherit; } #footer a:hover { color: #000; } /* Menu */ #menu { background: #6b6e73 url(../images/bg_menu2.png) repeat-y center top; height: 4em; float: left; width: 100%; margin: 0.25em 0em; } #menu ol, #menu dl { overflow: auto; background: #89ae3e url(../images/bg_menu.png) repeat-x left bottom; text-align: left; width: 700px; padding: 0px 50px; margin: -0.25em auto; } #menu ol li { display: block; float: left; font: bold 1.75em/2.57em Garamond, Georgia, "Times New Roman", serif; margin-right: 40px; height: 2.57em; overflow: hidden; } #menu ol li.current { background: url(../images/menu_current.png) no-repeat center top; } #site.frontpage #menu { height: 14.4em; } #menu dl { position: relative; height: 15em; color: #fff; overflow: auto; } #menu dl dt, #menu dl dd { position: absolute; width: 150px; } #menu dl dt { font: bold 1.75em/2.57em Garamond, Georgia, "Times New Roman"; } #menu dl dd { top: 4em; font-size: 1.1em; } #menu dl .panel2 { left: 233px; } #menu dl .panel3 { left: 416px; } #menu dl .panel4 { left: 599px; } #menu a,#menu a:visited { color: #fff; text-decoration: none; } #menu a:hover { color: #e5ffb0; text-decoration: underline; } /* search box */ #searchbox { float: left; width: 200px; height: 1.7em; text-align: right; margin: 3em 0em; } #searchbox fieldset legend, #searchbox fieldset label { display: none; } #searchbox input { width: 28%; font-size: 0.85em; } #searchbox #query { width: 60%; margin-right: 2%; padding: 3px; color: #999; } #searchbox #query:focus { color: #444; } /* masthead */ #site.text #content .hidden_navigation { display: block; background: #fbbd41 url(../images/bg_masthead1.png) repeat-x left top; margin: 0px -25px -7.5em -25px; height: 7.5em; } #content .hidden_navigation li { display: none; } #content .hidden_navigation li + li { background: #fddea0 url(../images/bg_masthead2.png) repeat-x left top; height: 7.5em; display: block; width: 245px; float: right; margin-bottom: -7.5em; } #content .hidden_navigation li a { display: none; } /* test styles: links */ #content a { color: #000; text-decoration: underline; } #content a:visited { color: #595f62; } #content a:hover { color: #89ae3e; } #content a:active { color: #fbbd41; } a.continue { font-size: 0.85em; } /* text styles: headings */ h1 { float: left; font-size: 2em; width: 492px; height: 1.7em; margin: 1.5em 0em; } h2 { color: #393e44; font-size: 1.6em; font-weight: bold; line-height: 1.4em; margin: 2.1em 0em 1.05em 0em; } h3{ font: bold 1.65em/1.4em Garamond, Georgia, "Times New Roman", serif; margin: 1.4em 0em 0em 0em; } h4 { color: #595f62; font-size: 1.1em; line-height: 1.6em; text-transform: lowercase; font-variant: small-caps; } #main h4 { font-size: 1em; } h1 a, #content h2 a, #content h3 a, #content h4 a { text-decoration: none; color: inherit; } /* text styles: formatting */ p { margin: 1em 0em; } #sidebar p { margin: 0em 0em 1em; } strong { color: #333; } em { color: #393e44; } del { color: #ccc; } del:hover { color: #7e8387; background: #eee; } ins { color: #89ae3e; } kbd, code { color: #393e44; background: #f6f6f6; padding: 2px; font: 1em "Courier New", Courier, mono; } cite { border-bottom: 1px dotted #ccc; color: #444; } abbr, acronym { text-transform: lowercase; font-variant: small-caps; letter-spacing: 0.1em; } abbr[title], acronym[title] { border-bottom: 1px dotted #ccc; cursor: help; } abbr:hover, acronym:hover { border-color: #666; } /* Flash */ .flash { color: #fff; border: 3px double #fff; margin: 1.5em 1em; padding: 0.5em 2em 0.5em 3em; font-weight: bold; } .flash.error { background: #fbbd41 url(images/icon_error.png) no-repeat 1em 0.5em; } .flash.confirm { background: #89ae3e; } .flash.highlight { background: #ccc; } /* text styles: block level */ p.leader { font-size: 1.2em; line-height: 1.4em; color: #111; } #masthead p.leader { clear: both; font-size: 2.2em; margin: 1em 80px 1.5em 80px; text-align: center; } blockquote { margin: 1em 2em; border-top: 0.5em solid #ddd; background-color: #f9f9f9; padding: 1em; } blockquote p { margin: 0em; } blockquote p + p { text-indent: 1.4em; } address { display: block; } pre code { overflow-y: hidden; position: relative; overflow: auto; font: 0.9em/1.3em "Courier New", Courier, mono; margin: 1em 0em; padding: 1em; display: block; border: 1px solid #fbbd41; background: #fddea0; color: #000; } /* lists */ #content ul, #content ol, #content dl { margin: 1em 2em 1em 0.5em; } #content ul li { background: url(../images/bullet.png) no-repeat 0em 0.5em; padding-left: 1.5em; list-style: none; } #content ol li { list-style: decimal; margin-left: 1.5em; } #content li ul, #content li ol { margin: 0em 2em; } #content li ul li { list-style: circle; background: none; padding-left: 0em; } #content li ol li { list-style: lower-alpha; } #content dt { font-weight: bold; color: #595f62; background: url(../images/bullet.png) no-repeat 0em 0.5em; padding-left: 1.5em; } #content dd { margin-bottom: 0.7em; margin-left: 1.5em; } /* sidebar blocks */ #syndicate, #request-for-proposal { background-color: #eee; margin: 2em -25px 2em -39px; padding: 1em 0em; } #syndicate p, #request-for-proposal p { margin: 0px 25px 0px 39px; } #syndicate h4, #request-for-proposal h4 { padding-left: 10px; } #syndicate h4 img, #request-for-proposal h4 img { margin-right: 9px; } /* author vcard */ #sidebar address.vcard * { display: block; } /* images */ img.photo { border: 1px solid #999; margin: 1em 0em; } #main p img { float: right; margin: 15px 0px 15px 15px; } #main p img { margin-bottom: 0px; } span.image_caption { float: right; margin: 0px 15px 15px 15px; font-size: 0.85em; line-height: 1.4em; display: block; text-align: center; color: #999; } span.image_caption strong { color: #999; } /* portfolio */ div.projects { float: left; } div.project { padding-bottom: 1em; border-bottom: 1px dotted #ccc; margin-bottom: 2em; } div.project h3, div.project p, #content div.project dl { margin-left: 256px; } div.project img { float: left; margin: 0px; border: 1px solid #444; } div.project h3 { margin-top: 0em; } div.project p { margin-top: 0em; margin-bottom: 0em; font-size: 0.85em; line-height: 1.4em; } div.project dl { font-size: 0.85em; line-height: 1.4em; margin-top: 0em; margin-bottom: 0em; } #content div.project dd { float: left; width: 5em; width: 115px; margin-left: 0em; } #content div.project dt { float: left; width: 40px; background: none; padding-left: 0em; } div.project dd abbr { color: #900; } /* contact form */ #content fieldset { border-top: 1px solid #ddd; padding: 1em 0em; margin: 1em 0em 2em 0em; } #content fieldset:hover { background: #f6f6f6; } #content fieldset legend { font-weight: bold; } #content fieldset p { position: relative; overflow: auto; } #content fieldset p label { display: block; float: left; width: 90px; } #content fieldset p label em { color: #900; position: absolute; top: 1px; left: 320px; padding-right: 10px; font-size: 0.85em; } #content input, #content textarea { font: 1em/1.4em Lucida "Lucida Grande", "Lucida Sans Unicode", Lucida, Verdana, sans-serif; } #content textarea { width: 95%; padding: 3px; } #sidebar #business-card { font-size: 1.2em; line-height: 1.6em; } #sidebar #business-card * { display: inline; } #sidebar #business-card a { display: block; } #sidebar #business-card .street-address, #sidebar #business-card .country-name { display: block; } a#vCard { background: url(../images/icon_vcard.png) no-repeat left center; padding-left: 25px; margin-left: -25px; font-size: 0.85em; } /* frontpage */ #site.frontpage #content { background: #fff; } #site.frontpage #main { width: 100%; padding-bottom: 4em; } #blogpanel { margin-left: 380px; } #site.frontpage #business-card { font-size: 1.1em; line-height: 1.6em; border-right: 1px solid #ccc; margin-top: 2.45em; float: left; text-align: right; width: 325px; padding-right: 30px; } #main #blogpanel ol { margin: 0em; } #main #blogpanel ol li { list-style: none; margin-bottom: 0.7em; margin-left: 0em; } /* weblog */ div.post p.meta { color: #7e8387; font-size: 0.85em; margin-top: -1.5em; } #main ol.comment-list { margin: 1em 0em; } #main ol.comment-list li { list-style: none; margin-top: 2.5em; } ol.comment-list li p.meta { font-size: 0.85em; color: #7e8387; } img.gravatar { float: right; margin: 0px 0px 15px 15px; border: 1px solid #000; } /* skillset table */ table { width: 100%; border-spacing: 0px; border-bottom: 1px solid #ccc; } table tbody tr th, #skillset tbody tr td { background: #fff; border-bottom: 1px solid #ddd; padding: 4px 2px; font-weight: normal; } table caption { font-size: 0.9em; color: #999; text-align: left; } table caption strong { color: #999; } table caption:hover, table caption:hover strong { color: #444; } table thead tr th { border-bottom: 2px solid #ccc; padding: 2px; } #skillset tbody tr td { background: url(../images/star_disabled.png) repeat-x 0px 4px; width: 80px; padding: 4px 0px; } #skillset tbody tr td span { background: url(../images/star.png) repeat-x left top; text-indent: -999px; outline: none; display: block; } #skillset tbody tr td span.star5 { width: 80px; } #skillset tbody tr td span.star4 { width: 64px; } #skillset tbody tr td span.star3 { width: 48px; } #skillset tbody tr td span.star2 { width: 32px; } #skillset tbody tr td span.star1 { width: 16px; } div.spacer { clear: both; visibility: hidden; height: 1px; }