@charset "UTF-8"; /** * Tina Hohl Photography - CSS Style Sheet ____________________________________ * Email: * * @project Tina Hohl Photography * @site http://www.tinahohl.de * @style Global CSS File for www.tinahohl.de * * @media projection, screen, print, all * @note all media types are combined in this one CSS file using at(@)-rules * * @date 2009-09-12 * @version v2009-09-12 * @package xhtml-css * @author Coding: Eduard Seifert * http://www.mindspage.de/ * Design: Harry Seifert * http://www.artfatale.com/ * @copyright Copyright(c) 2009 * * @css-for fx, ie, opera, safari > trying to reach all a-grade browsers * @tested fx3, ie8, oper10, safari4, chrome3 * * @colordef #161616; background * @colordef #000; header bar * @colordef #FFF; text on screen * @colordef #909090; normal link color (visited) + #FFF; link hover color * * @colordef #99CC99; green - Contact * @colordef #996699; purple - About * @colordef #FF9933; orange - People * @colordef #FFCC66; yellow - Still * @colordef #99CCCC; babyblue - Fashion * @colordef #FF99CC; pink - Beauty * @colordef #6699CC; blue - News * @colordef #FF6666; rot - Imprint * * Credits to other artists: * @see http://www.famfamfam.com/lab/icons/silk/ * @see http://960.gs/ * @see http://www.jankoatwarpspeed.com/post/2008/05/22/CSS-Message-Boxes-for-different-message-types.aspx * @see http://developer.yahoo.com/yui/3/ */ /** * WordPress Theme Style Sheet Header Definition ______________________________ * @section WordPress Theme Style Sheet Header Definition * @see http://codex.wordpress.org/Theme_Development#Theme_Style_Sheet */ /* Theme Name: Tina Hohl Photography Theme URI: http://www.tinahohl.de/ Description: Theme for Tina Hohl Photography | http://www.tinahohl.de Version: v2009-09-12 Author: Eduard Seifert Author URI: http://www.mindspage.de/ */ @media projection, screen { /** * TABLE OF CONTENTS [TOC] ____________________________________________________ * (used for better navigation inside this CSS file) * * =RESET YUI | Yahoo! UI Library: Reset CSS * =FONTS YUI | Yahoo! UI Library: Fonts CSS * =GLOBAL STYLES * =960GS - 960 Gird System * =BLOCK ELEMENTS * =META ELEMENTS * =TABLE(S) ELEMENTS * =INLINE ELEMENTS * =LIST ELEMENTS * =HEADINGS * =FONT SIZES * =TEXT STYLES / TYPOGRAPHY * =LINKS / ANCHORS * =COLORS * =BORDERS * =FLOATS * =WORDPRESS GENERATED CLASSES * =HEADER * =PAGE STRUCTURE * =NAVIGATION * =FORMS * =COMMENTS * =SIDEBAR * =FOOTER * =IMAGES * =EXTRAS / MISCELLANEOUS * =PRINT Styles */ /** * =RESET YUI | Yahoo! UI Library: Reset CSS __________________________________ * * Copyright (c) 2008, Yahoo! Inc. All rights reserved. * Code licensed under the BSD License: * http://developer.yahoo.net/yui/license.txt * version: 3.0.0 * build: 1549 * * @section Yahoo! UI Library: Reset CSS (minified) * @see http://developer.yahoo.com/yui/3/cssreset/ * @see http://yui.yahooapis.com/3.0.0/build/cssreset/reset-min.css */ html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;} /** * =RESET YUI | Yahoo! UI Library: Fonts CSS __________________________________ * * Copyright (c) 2008, Yahoo! Inc. All rights reserved. * Code licensed under the BSD License: * http://developer.yahoo.net/yui/license.txt * version: 3.0.0 * build: 1549 * * @section Yahoo! UI Library: Fonts CSS (minified) * @see http://developer.yahoo.com/yui/3/cssfonts/ * @see http://yui.yahooapis.com/3.0.0/build/cssfonts/fonts-min.css */ body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}select,input,button,textarea{font:99% arial,helvetica,clean,sans-serif;}table{font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;} /** * =GLOBAL STYLES _____________________________________________________________ * @section all global styles of this site */ /** * =960GS | 960 Gird System (minified) ________________________________________ * Version 1.2 (see README.txt) * * +-------- 960px ----------+ * | | * +-------------------------+ * * @section 960 Gird System (minified) * @see http://960.gs/ * @see http://github.com/nathansmith/960-grid-system/tree/master * @note don't use @import url("css/960gs/code/css/960.css"); * @note .clearfix method below (FLOATS) commented out! */ .container_12,.container_16{margin-left:auto;margin-right:auto;width:960px}.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15,.grid_16{display:inline;float:left;position:relative;margin-left:10px;margin-right:10px}.container_12 .grid_3,.container_16 .grid_4{width:220px}.container_12 .grid_6,.container_16 .grid_8{width:460px}.container_12 .grid_9,.container_16 .grid_12{width:700px}.container_12 .grid_12,.container_16 .grid_16{width:940px}.alpha{margin-left:0}.omega{margin-right:0}.container_12 .grid_1{width:60px}.container_12 .grid_2{width:140px}.container_12 .grid_4{width:300px}.container_12 .grid_5{width:380px}.container_12 .grid_7{width:540px}.container_12 .grid_8{width:620px}.container_12 .grid_10{width:780px}.container_12 .grid_11{width:860px}.container_16 .grid_1{width:40px}.container_16 .grid_2{width:100px}.container_16 .grid_3{width:160px}.container_16 .grid_5{width:280px}.container_16 .grid_6{width:340px}.container_16 .grid_7{width:400px}.container_16 .grid_9{width:520px}.container_16 .grid_10{width:580px}.container_16 .grid_11{width:640px}.container_16 .grid_13{width:760px}.container_16 .grid_14{width:820px}.container_16 .grid_15{width:880px}.container_12 .prefix_3,.container_16 .prefix_4{padding-left:240px}.container_12 .prefix_6,.container_16 .prefix_8{padding-left:480px}.container_12 .prefix_9,.container_16 .prefix_12{padding-left:720px}.container_12 .prefix_1{padding-left:80px}.container_12 .prefix_2{padding-left:160px}.container_12 .prefix_4{padding-left:320px}.container_12 .prefix_5{padding-left:400px}.container_12 .prefix_7{padding-left:560px}.container_12 .prefix_8{padding-left:640px}.container_12 .prefix_10{padding-left:800px}.container_12 .prefix_11{padding-left:880px}.container_16 .prefix_1{padding-left:60px}.container_16 .prefix_2{padding-left:120px}.container_16 .prefix_3{padding-left:180px}.container_16 .prefix_5{padding-left:300px}.container_16 .prefix_6{padding-left:360px}.container_16 .prefix_7{padding-left:420px}.container_16 .prefix_9{padding-left:540px}.container_16 .prefix_10{padding-left:600px}.container_16 .prefix_11{padding-left:660px}.container_16 .prefix_13{padding-left:780px}.container_16 .prefix_14{padding-left:840px}.container_16 .prefix_15{padding-left:900px}.container_12 .suffix_3,.container_16 .suffix_4{padding-right:240px}.container_12 .suffix_6,.container_16 .suffix_8{padding-right:480px}.container_12 .suffix_9,.container_16 .suffix_12{padding-right:720px}.container_12 .suffix_1{padding-right:80px}.container_12 .suffix_2{padding-right:160px}.container_12 .suffix_4{padding-right:320px}.container_12 .suffix_5{padding-right:400px}.container_12 .suffix_7{padding-right:560px}.container_12 .suffix_8{padding-right:640px}.container_12 .suffix_10{padding-right:800px}.container_12 .suffix_11{padding-right:880px}.container_16 .suffix_1{padding-right:60px}.container_16 .suffix_2{padding-right:120px}.container_16 .suffix_3{padding-right:180px}.container_16 .suffix_5{padding-right:300px}.container_16 .suffix_6{padding-right:360px}.container_16 .suffix_7{padding-right:420px}.container_16 .suffix_9{padding-right:540px}.container_16 .suffix_10{padding-right:600px}.container_16 .suffix_11{padding-right:660px}.container_16 .suffix_13{padding-right:780px}.container_16 .suffix_14{padding-right:840px}.container_16 .suffix_15{padding-right:900px}.container_12 .push_3,.container_16 .push_4{left:240px}.container_12 .push_6,.container_16 .push_8{left:480px}.container_12 .push_9,.container_16 .push_12{left:720px}.container_12 .push_1{left:80px}.container_12 .push_2{left:160px}.container_12 .push_4{left:320px}.container_12 .push_5{left:400px}.container_12 .push_7{left:560px}.container_12 .push_8{left:640px}.container_12 .push_10{left:800px}.container_12 .push_11{left:880px}.container_16 .push_1{left:60px}.container_16 .push_2{left:120px}.container_16 .push_3{left:180px}.container_16 .push_5{left:300px}.container_16 .push_6{left:360px}.container_16 .push_7{left:420px}.container_16 .push_9{left:540px}.container_16 .push_10{left:600px}.container_16 .push_11{left:660px}.container_16 .push_13{left:780px}.container_16 .push_14{left:840px}.container_16 .push_15{left:900px}.container_12 .pull_3,.container_16 .pull_4{left:-240px}.container_12 .pull_6,.container_16 .pull_8{left:-480px}.container_12 .pull_9,.container_16 .pull_12{left:-720px}.container_12 .pull_1{left:-80px}.container_12 .pull_2{left:-160px}.container_12 .pull_4{left:-320px}.container_12 .pull_5{left:-400px}.container_12 .pull_7{left:-560px}.container_12 .pull_8{left:-640px}.container_12 .pull_10{left:-800px}.container_12 .pull_11{left:-880px}.container_16 .pull_1{left:-60px}.container_16 .pull_2{left:-120px}.container_16 .pull_3{left:-180px}.container_16 .pull_5{left:-300px}.container_16 .pull_6{left:-360px}.container_16 .pull_7{left:-420px}.container_16 .pull_9{left:-540px}.container_16 .pull_10{left:-600px}.container_16 .pull_11{left:-660px}.container_16 .pull_13{left:-780px}.container_16 .pull_14{left:-840px}.container_16 .pull_15{left:-900px}.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:after{clear:both;content:' ';display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}.clearfix{display:inline-block}* html .clearfix{height:1%}.clearfix{display:block} /** * =BLOCK ELEMENTS / XHTML Block Elements _____________________________________ * @section XHTML Block Elements * @see http://www.w3.org/TR/2003/WD-xhtml2-20030506/mod-block-text.html * @see http://meyerweb.com/eric/thoughts/2004/09/20/fractionally-restoring-htmlcss/ */ html, body, p, div, h1, h2, h3, h4, h5, h6, form, ul, ol, dl, dt, dd, blockquote, address, pre, listing, plaintext, xmp, menu, dir, isindex, hr, map, multicol, center, frameset, marquee {display: block;} html, body { height: 101%; } /* show scrollbar right = 101% */ html { background-color: #161616; color: #808080; } /** * body styles * * @note font-family * @see http://www.mediaevent.de/css/font-family.html * @see http://www.codestyle.org/css/font-family/sampler-CombinedResults.shtml * @see http://www.typechart.com/ * @note line-height: 1.5; - should be defined in body, line-height defined by YUI Fonts (use % or x.y) */ body { font-family: Arial, Helvetica, Verdana, Geneva, sans-serif; } /* hide horizontal line */ hr { border-color: #858585; border-style: solid; border-width: 1px 0 0 0; clear: both; height: 0; display: none; } /** * =META ELEMENTS * @see http://meyerweb.com/eric/thoughts/2004/09/20/fractionally-restoring-htmlcss/ */ area, base, basefont, head, meta, script, style, title, noembed, noscript, param, noframes { display: none; } /** * =TABLE ELEMENTS / XHTML Tables Module ______________________________________ * @section XHTML Tables Module * @see http://www.w3.org/TR/2004/WD-xhtml2-20040722/mod-tables.html * @see http://meyerweb.com/eric/thoughts/2004/09/20/fractionally-restoring-htmlcss/ */ table { display: table; border-collapse: collapse; border-spacing: 0; text-indent: 0; width: 100%; } caption { display: table-caption; text-align: center; } col { display: table-column; } colgroup { display: table-column-group; } tbody { display: table-row-group; } thead { display: table-header-group; } tfoot { display: table-footer-group; } tr { display: table-row; } th { display: table-cell; font-weight: bold; } td { display: table-cell; padding: 0.25em; vertical-align: top; } tbody, thead, tfoot { vertical-align: middle; } .td-sep { padding-bottom: 1em; } .td-valign-middle { vertical-align: middle; } .td-valign-top { vertical-align: top; } /** * =INLINE ELEMENTS / XHTML Inline Text Module ________________________________ * @section XHTML Inline Text Module * @see http://www.w3.org/TR/2003/WD-xhtml2-20030506/mod-inline-text.html */ strong { font-weight: bold; } cite, em, var, dfn { font-style: italic; } code, kbd, samp { font-family: monospace; } ins { text-decoration: underline; } del { text-decoration: line-through; } sub { vertical-align: -0.25em; font-size: smaller; line-height: normal; } sup { vertical-align: 0.5em; font-size: smaller; line-height: normal; } /* fix the line box to be taller than normal */ abbr, abbr[title], acronym, acronym[title] { border-bottom: dotted 1px; cursor: help; /* ! */} /** * =LIST ELEMENTS / XHTML List Module _________________________________________ * @section XHTML List Module * @see http://www.w3.org/TR/2004/WD-xhtml2-20040722/mod-list.html */ /* unordered lists */ ul { list-style-type: square; margin: 1em 0; } /* ordered lists */ ol { list-style-type: decimal; margin: 0 2em; } /* remove top & bottom margins for nested lists */ ul ul, ul ol, ul dl, ol ul, ol ol, ol dl, dl ul, dl ol, dl dl { margin-top: 0; margin-bottom: 0; } /* use type when ul nested 2 deep */ ol ul, ul ul { /* list-style-type: circle; */ list-style-type: square; } /* use type when ul nested 3 deep */ ol ol ul, ol ul ul, ul ol ul, ul ul ul { list-style-type: square; } /* list item */ li { display: list-item; } /** * =HEADINGS / XHTML Headings _________________________________________________ * @section XHTML Headings * @see http://www.w3schools.com/tags/tag_hn.asp */ /* general headings styles */ h1, h2, h3, h4, h5, h6 { display: block; font-weight: bold; } .post h2 { margin: 0 0 20px 0; } /** * =FONT SIZES ________________________________________________________________ * @section Font Sizes * @note Font Sizing Chart YUI v3.x * @see http://developer.yahoo.com/yui/3/cssfonts/#fontsize * 10px = 77% * 11px = 85% * 12px = 93% * 13px = 100% * 14px = 108% * 15px = 116% * 16px = 123.1% * 17px = 131% * 18px = 138.5% * 19px = 146.5% * 20px = 153.9% * 21px = 161.6% * 22px = 167% * 23px = 174% * 24px = 182% * 25px = 189% * 26px = 197% */ /* __ 10px = 77% */ .post-date { font-size: 77%; } /* __ 11px = 85% */ body, #sidebar li, #footer p { font-size: 85%; } /* __ 12px = 93% */ #content p { font-size: 93%; } /* __ 13px = 100% */ #sidebar-portfolio li { font-size: 100%; } /* __ 14px = 108% */ /* __ 15px = 116% */ #content h2 { font-size: 116%; } /* __ 16px = 123.1% */ /* __ 17px = 131% */ /* __ 18px = 138.5% */ /* __ 19px = 146.5% */ /* __ 20px = 153.9% */ /* __ 21px = 161.6% */ /* __ 22px = 167% */ /* __ 23px = 174% */ /* __ 24px = 182% */ /* __ 25px = 189% */ /* __ 26px = 197% */ /** * =TEXT STYLES / TYPOGRAPHY __________________________________________________ * @section Text Styles and Typography */ /* normal */ /* uppercase */ h1, h2, h3, h4, h5, h6, #sidebar, #sidebar-portfolio, #footer { text-transform: uppercase; } #sidebar-portfolio li { margin: 0.25em 0; font-weight: bold; } #posts p { padding: 0 0 1em 0; } /** * =COLORS ____________________________________________________________________ * @section Color Definitions */ #posts { color: #FFF; } /** * =LINKS / ANCHORS ___________________________________________________________ */ a:link { color: #909090; outline-width: 0; text-decoration: none; } a:visited { color: #909090; text-decoration: none; } a:hover, a:focus, a:active { color: #FFF; } /* External links (CSS3) */ /* a[href^="http://"], a[href^="https://"] {} a[href^="http://"]:hover, a[href^="https://"]:hover {} */ /* reset for development domain */ /* a[href^="http://localhost/wordpress/"], a[href^="http://localhost/wordpress"], */ /* reset for staging domain */ /* a[href^="http://www.tinahohl.de/"], a[href^="http://www.tinahohl.de"], a[href^="http://tinahohl.de/"], a[href^="http://tinahohl.de"], a[href^="www.tinahohl.de/"], a[href^="www.tinahohl.de"], a[href^="tinahohl.de/"], a[href^="tinahohl.de"] { background: none; padding: 0; } */ /* PDF Links */ /* a[href$=".pdf"] { background: transparent url(css/icons/page_white_acrobat.png) no-repeat 0 0; padding-left: 25px; } */ /* RSS Links */ /* .link_rss { background: transparent url(css/icons/rss.png) no-repeat 0 0; padding-left: 25px; } */ /* TODO on STAGING > change numbers !!! */ /* Portfolio Links */ /* #sidebar-portfolio li a { color: #FFF; } */ /* Beauty */ #sidebar-portfolio .page-item-5 a:visited { color: #FFF; } #sidebar-portfolio .page-item-5 a:link { color: #FFF; } #sidebar-portfolio .page-item-5 a:hover, #sidebar-portfolio .page-item-5 a:focus, #sidebar-portfolio .page-item-5 a:active { color: #FF99CC; } #sidebar-portfolio li.page-item-5.current_page_item a { color: #FF99CC; } /* Fashion */ #sidebar-portfolio .page-item-7 a:visited { color: #FFF; } #sidebar-portfolio .page-item-7 a:link { color: #FFF; } #sidebar-portfolio .page-item-7 a:hover, #sidebar-portfolio .page-item-7 a:focus, #sidebar-portfolio .page-item-7 a:active { color: #99CCCC; } #sidebar-portfolio li.page-item-7.current_page_item a { color: #99CCCC; } /* People */ #sidebar-portfolio .page-item-10 a:visited { color: #FFF; } #sidebar-portfolio .page-item-10 a:link { color: #FFF; } #sidebar-portfolio .page-item-10 a:hover, #sidebar-portfolio .page-item-10 a:focus, #sidebar-portfolio .page-item-10 a:active { color: #FF9933; } #sidebar-portfolio li.page-item-10.current_page_item a { color: #FF9933; } /* Still */ #sidebar-portfolio .page-item-12 a:visited { color: #FFF; } #sidebar-portfolio .page-item-12 a:link { color: #FFF; } #sidebar-portfolio .page-item-12 a:hover, #sidebar-portfolio .page-item-12 a:focus, #sidebar-portfolio .page-item-12 a:active { color: #FFCC66; } #sidebar-portfolio li.page-item-12.current_page_item a { color: #FFCC66; } /** * =BORDERS ___________________________________________________________________ * @section Border Definitions */ /* -moz-border-radius: 0.4em; -khtml-border-radius: 0.4em; -webkit-border-radius: 0.4em; border-radius: 0.4em; */ /** * =FLOATS ____________________________________________________________________ * @section Floats */ .floatleft { float: left; } .floatright { float: right; } /* Clear floating Elements */ .clearleft { clear: left; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0 } .clearright { clear: right; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0 } .clearboth { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0 } .clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0 } /** * CLEARFIX Method and Clearing floats * * @section Clearing floats with Clearfix Method * @see http://www.positioniseverything.net/easyclearing.html * @see http://little-boxes.de/?p=149 * @see http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack/ * slightly enhanced, universal clearfix hack * @note REMOVED * @see http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack/#comment-70981 */ /* .clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:after{clear:both;content:' ';display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}.clearfix{display:inline-block}* html .clearfix{height:1%}.clearfix{display:block} */ /* .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } */ /* IE-Patches for Clearfix */ /* .clearfix { display: inline-block; } */ /* Hide from IE5/Mac with Commented Backslash Hack \*/ /* * html .clearfix { height: 1%; } */ /* .clearfix { display: block; } */ /* END hide from IE5/Mac */ /** * =WORDPRESS GENERATED CLASSES _______________________________________________ * @section WordPress generated Classes * @see http://codex.wordpress.org/CSS */ .aligncenter, div.aligncenter { display: block; margin-left: auto; margin-right: auto; } .alignleft { float: left; } .alignright { float: right; } .wp-caption { margin: 0.5em 0; } .wp-caption a { margin: 0; } .wp-caption img { margin: 0; padding: 0; /* border: none; */ border: 1px solid #808080; } .wp-caption .wp-caption-text { margin: 0; padding: 0; } /** * Additional Wordpress classes generated by default * @section Additional Wordpress classes generated by default */ /* .categories {} .cat-item {} .current-cat {} .current-cat-parent {} .pagenav {} .page_item {} .current_page_item {} .current_page_parent {} .widget {} .widget_text {} .blogroll {} .linkcat{} */ /** * =HEADER ____________________________________________________________________ * with title, subtitle and logo */ #header { text-align: right; margin-top: 45px; } #header img { margin-right: 40px; } /** * =PAGE STRUCTURE ____________________________________________________________ * @section Page Structure (index.php, page.php, single.php) */ #container { /* background: transparent url(css/960gs/code/img/16_col_trans.gif) repeat-y scroll 0 0; */ overflow: hidden; /* show grid 960gs */ text-align: left; margin-top: 0 auto 1em auto; } #content {} .post-date { margin-right: 15px; } .contentbox { margin: 2em 0; } .post { margin-bottom: 40px; } /* .wrap-in { -moz-border-radius: 0.4em; -webkit-border-radius: 0.4em; -khtml-border-radius: 0.4em; border-radius: 0.4em; border: 1px solid #1A1A18; margin: 0.5em 0; padding: 1em; } */ /** * =NAVIGATION ________________________________________________________________ * @section Navigation */ /** * =FORMS _____________________________________________________________________ * @section Forms */ /* form input fields */ select, input, button, textarea { font-family: Arial, Helvetica, Verdana, Geneva, sans-serif; vertical-align: middle; } /** * =COMMENTS __________________________________________________________________ * @section Comments */ /** * =SIDEBAR ___________________________________________________________________ * @section Sidebar Styles * @note Theme file: sidebar.php */ #sidebar { background-color: #000000; height: 24px; line-height: 24px; position: fixed; left: 0; top: 0; width: 100%; z-index: 100; } #sidebar .wrap-in { width: 960px; margin-left: auto; margin-right: auto; margin-right: auto; text-align: right; } #sidebar ul { margin: 0; } #sidebar ul li { display: inline-block; text-align: center; } #sidebar li { width: 85px; } /** * =FOOTER ____________________________________________________________________ * @section Footer Styles (footer.php) */ #footer { margin: 40px 0 20px 0; text-align: right; } /** * =IMAGES ____________________________________________________________________ * @section Images Styles */ /** * =EXTRAS / MISCELLANEOUS ____________________________________________________ * @section Extras and Miscellaneous */ /* CSS Helper Classes (Hilfsklassen) */ /* Width sizes */ /* .width100 { width: 100% !important; } .width75 { width: 75% !important; } .width50 { width: 50% !important; } */ /* Text Alignment */ .textaligncenter { text-align: center; } .textalignleft { text-align: left; } .textalignright { text-align: right; } /* Offscreen position for elements to remove from view range */ .offscreen { position: absolute; left: -9999em !important; } .space-left { margin-left: 2em; } /* Hiding elements (display: none) */ .hide { display: none; } /* Text alignment */ .ta-center { text-align: center !important; } .ta-left { text-align: left !important; } .ta-right { text-align: right !important; } .ta-justify { text-align: justify !important; } /* Important */ .important { border-bottom: 1px dotted #F00 !important; } /* Debugging */ .debug, .warning { background-color: #FFBABA; border: 1px solid; color: #D8000C; -moz-border-radius: 0.4em; -khtml-border-radius: 0.4em; -webkit-border-radius: 0.4em; border-radius: 0.4em; margin: 0.5em 0; padding: 0.25em; } /* No border */ .noborder { border: none !important; } /* No bold typo */ .nobold { font-weight: normal !important; } .envelope-window { background-color: #FAFAFA; border: 1px solid #CCC; -moz-border-radius: 0.4em; -webkit-border-radius: 0.4em; -khtml-border-radius: 0.4em; border-radius: 0.4em; -moz-box-shadow: 1px 2px 3px #CCC; -webkit-box-shadow: 1px 2px 3px #CCC; box-shadow: 1px 2px 3px #CCC; padding: 0.5em; } /** * opacity * @see http://www.quirksmode.org/css/opacity.html * @see http://css-tricks.com/css-transparency-settings-for-all-broswers/ */ .opacity3 { /* for all IE (IE 5-8) (in this order!) */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; /* first */ filter: alpha(opacity=30); /* second */ /* Mozilla oldschool */ -moz-opacity: 0.3; /* Safari oldshool */ -khtml-opacity: 0.3; /* CSS3 (W3C)*/ opacity: 0.3; zoom: 1; } .opacity8 { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter: alpha(opacity=80); -moz-opacity: 0.8; -khtml-opacity: 0.8; opacity: 0.8; zoom: 1; } .opacity9 { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=95)"; filter: alpha(opacity=95); -moz-opacity: 0.95; -khtml-opacity: 0.95; opacity: 0.95; zoom: 1; } /** * SCF2 Contact Form Plugin * @see http://www.laptoptips.ca/projects/scf2-contact-form/ */ #scf2 { margin: 1em 0; } #scf2 fieldset { margin: 0; padding: 0.5em 0; text-align: left; } #scf2 legend { display: none; } /* #scf2 p { font-family: Arial, Helvetica, sans-serif; margin: 0 0 12px 0; } */ #scf2 label {} #scf2 input {} #scf2 textarea { width: 435px; } #scf2 input, #scf2 textarea { background-color: #161616; border: 1px solid #808080; color: #FFF; margin: 3px 0 0 0; padding: 2px; } #scf2 input:hover, #scf2 textarea:hover { border: 1px solid #FFF; } #scf2 input:focus, #scf2 textarea:focus { border: 1px solid #FFF; } #scf2 #scf2_submit { text-transform: uppercase; width: auto; } #scf2 #scf2_submit:hover { background-position: left -47px; /* bullet white */ color: #FFF; cursor: pointer; } /** * jQuery GalleryView Plugin * @see http://spaceforaname.com/galleryview * @see http://www.spaceforaname.com/jquery/galleryview/gallery-light.html */ /* GalleryView Stylesheet Use the CSS rules below to modify the look of your gallery. To create additional rules, use the markup below as a guide to GalleryView's architecture.
...overlay content...
  • caption text
  • caption text
*/ /* GALLERY LIST */ /* IMPORTANT - Change '#photos' to the ID of your gallery list to prevent a flash of unstyled content */ #work { visibility: hidden; } /* gallery container */ .gallery {} /* loading box */ .loader { background: url(loader.gif) center center no-repeat #ddd; } /* gallery panels */ .panel { margin-bottom: 20px; } /* define height of panel overlay */ /* NOTE - It is best to define padding here as well so overlay and background retain identical dimensions */ /* .panel .panel-overlay, .panel .overlay-background {} */ /* panel overlay background */ /* .panel .overlay-background {} */ /* panel overlay content */ /* .panel .panel-overlay {} */ /*.panel .panel-overlay a {} */ /* filmstrip */ /* 'margin' will define top/bottom margin in completed gallery */ .strip_wrapper {} .filmstrip { margin: 5px !important; } /* filmstrip frames (contains both images and captions) */ /* .frame {} */ /* wrapper for filmstrip images */ /* .frame .img_wrap {} */ /* wrapper for current filmstrip image */ /* .frame.current .img_wrap {} */ /* frame images */ /* .frame img {} */ /* frame caption */ /* .frame .caption {} */ /* carrent frame caption */ /* .frame.current .caption {} */ /* pointer for current frame */ .pointer { border: none !important; } /* transparent border fix for ie6 */ /* NOTE - DO NOT CHANGE THIS RULE */ /* *html .pointer { filter: chroma(color=pink); } */ } /* END @media projection, screen */ /** * =PRINT Styles ______________________________________________________________ * @section Styles for Print (@media print) * @see http://www.alistapart.com/articles/goingtoprint/ */ @media print { html, body { background: #FFF; color: #000; font-size: 10pt; } /** * Links * @note * Hyperlinks werden zurückgesetzt und auf dem Papier sichtbar gemacht * indem die URL Adresse nach dem Linktext dargestellt wird. * a[href]:after { content: " [Adresse (a[href]): "attr(href)"]"; } */ a:link, a:visited { color: #520; background: transparent; font-weight: bold; text-decoration: underline; } a[href]:after { content: " ["attr(href)"]"; } a:link:after, a:visited:after { content: " ["attr(href)"]"; font-size: 90%; } /** * Bugfix Print Preview * @section Bugfix Print Preview * @note * set overflow: hidden and overflow: auto to overflow: visible * to get pages not cut ! * Syntax: tag { overflow: visible !important; } * @see http://www.yaml.de/develop/ff_overflow.html */ } /* END @media print */