/* Theme Name: BlackMesa Theme URI: http://www.arcance.net Description: Hübsches Theme mit vielen optischen Highlights: Alternierende semitransparente Artikel- und Sidebar-Kopfzeilen, parallax verschobene Hintergründe, viele Textstile und mehr. Unterstützt individuelle Menüs im Header und der Sidebar, hervorgehobene Artikelbilder und Widgetbereiche in Sidebar und Footer. Author: Stefan Kröber, Arcance Version: 1.0 Tags: black, red, white, two-columns, fixed-width, custom-menu */ /****************************** Reset Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html ******************************/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } :focus { outline: 0; } body { line-height: 1; color: black; background: white; } ol, ul { list-style: none; } table { border-collapse: separate; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } /****************************** Layout ******************************/ #body { background: url('images/bodyBg.png') repeat #000 fixed; } #wrap { width: 980px; margin: 0 auto; padding: 0 0 50px 0; background: url('images/waveBg.png') 50% top repeat-y; } #header { height: 150px; width: 980px; background: black; background: url('images/header.jpg') left top no-repeat; position: relative; border-top: 5px solid #da3e4f; } #overlay { width: 131px; height: 150px; background: url('images/headerOverlay.png') left top no-repeat; position: absolute; right:233px; top: 0; } #nav { height: 65px; width: 980px; background: url('images/glassSprite.png') left top no-repeat; } #nav ul { } #nav ul li { position: relative; float: left; height: 40px; padding: 10px 20px; margin: 15px auto 0 auto; background: url('images/navDiv.png') right top no-repeat; } #nav ul li:last-child { border: 0; } #nav ul li:hover ul, #nav ul li ul:hover { display: block; } #nav a:hover { text-shadow: 1px 1px 25px #da3e4f; } #nav ul li ul { position: absolute; left: -1px; top: 49px; background: #000; border-left: 1px solid #555; border-right: 1px solid #555; border-bottom: 1px solid #555; display: none; } #nav ul li ul li { float: none; height:auto; margin: 0; background: none; border-bottom: 1px solid #555; } #nav ul li ul li:hover { background: #333 } #nav ul li ul li:last-child { border: none; } #main { margin: 10px 0 0 0; } #content { width: 650px; float: left; } .article, .sidebox { margin: 50px 0 0 0; position: relative; } .highlight.head { background: url('images/headHighlight.jpg') left top no-repeat; height: 50px; width: 650px; padding: 15px 25px 0 25px!important; margin: 50px 0 -50px 0; } #comments .highlight.head { margin: 50px 0 -10px 0; } .head { max-height: 120px; padding: 15px 25px; overflow: hidden; } .article .head { width: 600px; } .article .head.one { background: url('images/glassSprite.png') left -85px no-repeat; } .article .head.two { background: url('images/glassSprite.png') left -225px no-repeat; } .article .head.three { background: url('images/glassSprite.png') left -365px no-repeat; } .sidebox .head { width: 230px; } .sidebox .head.one { background: url('images/glassSprite.png') -700px -85px no-repeat; } .sidebox .head.two { background: url('images/glassSprite.png') -700px -225px no-repeat; } .sidebox .head.three { background: url('images/glassSprite.png') -700px -365px no-repeat; } .featured-thumbnail { border: 5px solid #da3e4f; background: #fff; width: 80px; height: 80px; position: absolute; right: 20px; top: 20px; z-index: 999; } .body { padding: 25px 25px 0 25px; background: #fff; border-top: 5px solid #da3e4f; overflow: hidden; position: relative; } .article .body { width: 600px; } .article .body ul { list-style: disc; margin: 5px 0 5px 15px; } .article .body ul li { margin: 4px 0; } .article .body ol { list-style:decimal; margin: 5px 0 5px 15px; } .article .body ol li { margin: 4px 0; } .sidebox .body { padding: 25px; width: 230px; } #comments .body { border: none; } .push { padding: 25px 25px 25px 25px; } .meta { position: relative; left: -25px; width: 600px; background: #f6f6f6; border-top: 5px solid #eee; margin: 20px 0 0 0; padding: 15px 25px 25px 25px; } .meta ul { list-style: none!important; margin: 0!important; max-width: 440px; } .meta li { height: 16px; margin: 5px 0 0 0; } .meta .date { padding: 0 0 0 20px; background: url('images/iconDate.png') no-repeat; } .meta .author { padding: 0 0 0 20px; background: url('images/iconAuthor.png') no-repeat; } .meta .cats { padding: 0 0 0 20px; background: url('images/iconCats.png') no-repeat; } .meta .tags { padding: 0 0 0 20px; background: url('images/iconTags.png') no-repeat; } .meta .comments { position: absolute; right: 25px; bottom: 25px; } .pagination { margin: 50px 0 0 0; } #comments .gravatar { float: left; } #comments .commentText { margin: 0 0 0 100px; } #comments .odd { background: #fff; border-bottom: 5px solid #eee; } #comments .even { background: #f6f6f6; border-bottom: 5px solid #eee; } .ie7 #comments .odd, .ie7 #comments .even { margin:-3px 0 0 0; } #comments textarea#comment { width: 590px; } #sidebar { width: 280px; float: right; } .sidebox ul ul, .sidebox ul ul ul { margin: 7px 0 0 15px; } .sidebox ul { margin: 0 0 0 15px; } .sidebox li, .sidebox li li, .sidebox li li li { padding: 5px 0 5px 0; } .sidebox li:last-child, .sidebox li li:last-child, .sidebox li li li:last-child { padding-bottom: 0; } .sidebox li { list-style: url('images/listStyle.png'); } #sidebar-nav ul { margin: 0 0 7px 0; } #sidebar-nav ul ul, #sidebar-nav ul ul ul { margin: 0 0 7px 15px; } #sidebar #search label { position: absolute; top: -999em; left: -999em; } #copybox { width: 230px; margin: 50px 0 0 0; padding: 25px; background: url('images/copybox.jpg') right bottom no-repeat #da3e4f; } #copybox div.hr { height: 1px; background: #d53d4e; border-top: 1px solid #f06676; margin: 15px 0; } #footer { width: 980px; margin: 0 auto; background: url('images/footerBg.png') no-repeat #000; border-top: 5px solid #da3e4f; } #footer .third { float: left; width: 276px; margin: 25px; } #footer ul { list-style: url('images/listStyle.png'); margin: 0 0 0 20px; } #footer li { padding: 7px 0; } #footer div.hr { height: 1px; background: #222; border-top: 1px solid #000; margin: 15px 0; } /****************************** Elements ******************************/ .hideme { position: absolute; top: -999em; left: -999em; } .clear { clear: both; } .alignleft { float: left; margin: 0 15px 0 0; } .alignright { float: right; margin: 0 0 0 15px; } .aligncenter { margin: 0 auto; } blockquote, pre { position: relative; left: -25px; background: url('images/darkBg.gif') 50% top no-repeat #222; margin: 0 0 10px 0; padding: 20px 25px 20px 25px; width: 600px; border-top: 3px solid #555; border-bottom: 2px solid #555; overflow: hidden; } table { margin: 0 0 20px 0; } tr { background: #fafafa; } tr:hover, tr.even:hover { background: #fff; } tr.even { background: #f9f9f9; } th { padding: 10px 5px; border-bottom: 1px solid #fff; border-top: 2px solid #505050; background: #f4f4f4; } td { padding: 10px 5px; border-top: 1px solid #ebebeb; border-bottom: 1px solid #fff; } td+td { border-left: 1px solid #f0f0f0; } fieldset { border: 2px solid #f5f5f5; padding: 20px; background: url('images/lightBg.png') #eee; margin: 10px 0 20px 0; } legend { padding: 10px; background: #fff; border-bottom: 2px solid #f5f5f5; } input[type=text], input[type=password], textarea { padding: 4px; } input[type=submit], input[type=reset] { border: 0; height: 35px; } input[type=radio], input[type=checkbox] { margin: 0 0 0 20px; } .wp-caption { border: 2px solid #f5f5f5; padding: 10px; background: url('images/lightBg.png') #eee; } .wp-caption img { margin: 5px; } .button, input#submit { display: block; color: #fff; padding: 9px 10px 9px 10px; background: url('images/button.png') left top no-repeat #313131; cursor: pointer; } #searchsubmit { padding: 2px 7px 0 7px; height: 36px; color: #fff; background: url('images/button.png') left top no-repeat #313131; cursor: pointer; } .button:hover, #searchsubmit:hover, input#submit:hover { background: url('images/button.png') left -40px no-repeat #da3e4f; } .meta .button { margin: 15px 0 0 0; } .buttonGlass1 { padding: 9px 10px 0 10px; height: 26px; background: url('images/buttonGlass.png') left top no-repeat; border-right: 1px solid #444; } .buttonGlass2 { padding: 9px 10px 0 10px; height: 26px; background: url('images/buttonGlass.png') left -40px no-repeat; border-right: 1px solid #444; } /****************************** Font & Links ******************************/ @font-face { font-family: 'Share-RegularRegular'; src: url('fonts/Share-Regular-webfont.eot'); src: local('☺'), url('fonts/Share-Regular-webfont.woff') format('woff'), url('fonts/Share-Regular-webfont.ttf') format('truetype'), url('fonts/Share-Regular-webfont.svg#webfontd5fhuncX') format('svg'); font-weight: normal; font-style: normal; } body { color: #595959; font: 14px Helvetica, Verdana, Arial, Tahoma, sans-serif; } #header h1{ font-size: 36px; padding: 40px 0 0 50px; } #header p { color: #ccc; padding: 10px 0 0 50px; } #header a { color: #fff; text-decoration: none; } h1, h2, h3, h4, h5 { color: #fff; font-family: 'Share-RegularRegular', sans-serif; text-shadow: 2px 2px 1px #000; font-weight: 100; } .body h1, .body h2, .body h3, .body h4, .body h5 { color: #595959; font-family: Helvetica, Verdana, Arial, Tahoma, sans-serif; font-weight: bold; text-shadow: none; margin: 5px 0 5px 0; } h1 { font-size: 26px; } h2 { font-size: 22px; } .article .head h2 { font-size: 26px; margin: 15px 0 10px 0px; } h3 { font-size: 19px; } .sidebox h3.head , .highlight.head h3, #copybox h3, #footer h3 { font-size: 22px; } h4 { font-size: 17px; } h5 { font-size: 15px; } p { padding: 7px 0 9px 0; } .body p, .footer p { line-height: 150%; } .sidebox .body p:first-child { padding: 0 0 9px 0; } .sidebox .body p:last-child { padding: 7px 0 0 0; } blockquote { color: #797979; font-family: Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", "DejaVu Serif", "Bitstream Vera Serif", Georgia, serif; font-size: 14px; font-style: italic; text-shadow: 1px 1px 2px #111; } blockquote p:before { content: '"'; } blockquote p:after { content: '"'; } blockquote p:first-child { padding: 0 0 9px 0; } blockquote p:last-child { padding: 7px 0 0 0; } strong, b { font-weight: bold; } em, i, cite { font-style: italic; } cite:before { content: '"'; } cite:after { content: '"'; } acronym, abbr { border-bottom: 1px dotted #595959; } code { font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace; white-space: normal; } pre, pre code { font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace; font-size: 13px; color: #797979; text-shadow: 1px 1px 2px #111; white-space: pre-wrap; } small { font-size: smaller; } big { font-size: larger; } legend { font-size: 16px; font-weight: bold; } input, textarea { font-size: 13px; } sup { font-size: smaller; vertical-align: super } sub { font-size: smaller; vertical-align: sub; } th { font-weight: bold; } #nav li a { color: #fff; font-family: 'Share-RegularRegular', sans-serif; font-size: 20px; text-decoration: none; text-shadow: 2px 2px 1px #000; } #nav li li a{ color: #fff; font-family: Helvetica, Verdana, Arial, Tahoma, sans-serif; font-size: 14px; } .meta { color: #797979; font-size: 12px; } .wp-caption-text { padding: 0 0 0 5px; font-size: 12px; text-align: center } .head a { color: #fff; text-decoration: none; } .head a:hover { color: #ddd; } .body a { color: #da3e4f; } .body a:hover { color: #595959; } .body a:active { color: #000; } .button, a.button, .buttonGlass1, a.buttonGlass1, .buttonGlass2, a.buttonGlass2, .pagination a { color: #fff; font-family: 'Share-RegularRegular', sans-serif; font-size: 18px; text-decoration: none; text-shadow: 1px 1px 1px #000; } .body .button:hover, .body a.button:hover { color: #fff; } a.buttonGlass1:hover, a.buttonGlass2:hover, .pagination a span:hover { color: #da3e4f; } #copybox { color: #f2c7cc; text-shadow: 1px 1px 1px #9e1626; } #copybox a { color: #fff; text-decoration: none; } #copybox a:hover { text-decoration: underline; } #footer { color: #8d8d8d; } #footer a { color: #adadad; } #footer a:hover { color: #da3e4f; }