/*   
Theme Name: Kleidermacher Flex
Theme URI: http://diekleidermacher.de/
Description: For the website of tailor-shop "Die Kleidermacher" in Muenster, Germany. Thanks to the authors of CSS Mastery!
Author: Florian Schroiff
Author URI: http://doktorflorian.com/
Version: 1.0
.
Design (c) Florian Schroiff
.
*/

/* Styles for screen media */

html,body,div,p{font-family:"Lucida Grande","Lucida Sans Unicode",tahoma,verdana,arial,sans-serif;color:#9E696C;}
body{margin:15px 15px 0 15px;background:#3A1215 url(img/body_bg.gif);}
/*
LINKS --------------------- */
a:link,a:active,a:visited{outline:none;text-decoration:none;color:#E57300;}
/*
COMMON --------------------- */
br{clear:both;}
hr{display:none;}
p{margin:0;padding-top:1em;line-height:160%;}
img{border:1px solid #959478;background-color:#fff;margin:6px 10px 6px 0;padding:3px;}
/*
MASTHEAD + SUBMAST --------------------- */
h1{margin:0;position:absolute;top:20px;left:46px;z-index:3;width:126px;text-indent:-9000px;}
h1 a{display:block;height:87px;}
#mast-content{position:absolute;top:0;right:0;z-index:4;width:361px;}
#masthead{position:relative;background:#3A1215 url(img/head-repeat.gif) repeat-x;height:210px;margin:0 -15px 0 0;padding:0;}
#head-deco{position:absolute;top:0;left:0;z-index:2;width:324px;height:210px;background:url(img/head-deco.gif) no-repeat;}
/*
NAVIGATION --------------------- */
#head-menu{position:absolute;top:0;right:0;z-index:1;width:361px;height:210px;background:url(img/head-menu.jpg) no-repeat;}
ul#nav{margin:0;padding:0;list-style:none;}
#nav li{margin:0;padding:0;list-style:none;display:block;position:absolute;text-indent:-100em;overflow:hidden;}
#nav a{display:block;}
#nav-home{right:262px;top:132px;width:38px;height:14px;background:url(img/home.gif) top no-repeat;z-index:5;}
#nav-einblicke{right:186px;top:122px;width:64px;height:17px;background:url(img/einblicke.gif) top no-repeat;}
#nav-neues{right:133px;top:115px;width:40px;height:13px;background:url(img/neues.gif) top no-repeat;}
#nav-kontakt{right:64px;top:105px;width:59px;height:16px;background:url(img/kontakt.gif) top no-repeat;}
#nav-home a{height:14px;}
#nav-einblicke a{height:18px;}
#nav-neues a{height:13px;}
#nav-kontakt a{height:16px;}
#nav-home a:hover,#nav-home.active{background:url(img/home.gif) -1px -14px no-repeat;}
#nav-einblicke a:hover,#nav-einblicke.active{background:url(img/einblicke.gif) 0 -17px no-repeat;}
#nav-neues a:hover,#nav-neues.active{background:url(img/neues.gif) 0 -13px no-repeat;}
#nav-kontakt a:hover,#nav-kontakt.active{background:url(img/kontakt.gif) 0 -16px no-repeat;}
/*
MAIN CONTENT --------------------- */
#content,#archive{float:left;width:70%;padding:0 0 1em;background-color:#FFFBDF;font-size:.9em;}
#content h2,#archive h2{position:relative;margin:0;padding:3px 0 15px 25px;width:85%;font:normal 2em Georgia,serif;color:#7C1B20;}
.title{background:url(img/bg_hmain.gif) repeat-x bottom;}
#content a:link,#content a:active,#content a:visited,#footer a:link,#footer a:active,#footer a:visited{padding:1px 2px;text-decoration:none;border-bottom:1px dotted #E57300;}
#footer a:link.fernstrg,#footer a:active.fernstrg,#footer a:visited.fernstrg{padding:2px 2px 2px 12px;background:url(img/fernstrg.png) no-repeat center left;border:none;}
#content a:hover,#footer a:hover{color:#DF295A;background-color:#F3E9CA;border-bottom:1px solid #CFB86E;}
#footer a:hover.fernstrg{background:#F3E9CA url(img/fernstrg_a.png) no-repeat center left;}
#unterschriften{text-indent:-9000px;width:422px;line-height:58px;background:url(img/unterschriften.gif) no-repeat;margin:10px 0;padding:0;}
#bottomnav{margin-top:20px;padding-top:12px;text-align:center;background:url(img/bg_botnav.gif) repeat-x top;}
img.alignleft{float:left;margin-top:1.5em;}
/*
SIDEBAR --------------------- */
#cap{position:absolute;top:0;left:0;width:107px;height:57px;background:url(img/div_cap.jpg) no-repeat;}
#hpic1{background:#EBEBE5 url(img/hpic_laden.jpg) no-repeat center center;}
#hpic2{background:#EBEBE5 url(img/hpic_archiv.jpg) no-repeat center center;}
#hpic3{background:#EBEBE5 url(img/hpic_shoes.gif) no-repeat center center;}
#hpic4{background:#EBEBE5 url(img/hpic_entwuerfe.jpg) no-repeat center center;}
#hpic5{background:#EBEBE5 url(img/hpic_heiraten_auf_probe.jpg) no-repeat center center;}
/* Two widths are used,the second being a hack for Internet Explorer */
#sidebar{position:relative;float:left;width:30% !important;width:29.9%;padding:40px 0 20px 0;background:url(img/bg_darkbot.gif) repeat-x top left;font-size:.8em;}
.section{clear:both;padding:1.5em 0.2em 0.7em 1em;background:url(img/ornamentside.gif) no-repeat bottom center;}
.section h4{margin:0;font:normal 1.55em Georgia,serif;color:#613032;letter-spacing:-1px;text-align:center;}
/* The padding and margin here offset each other,allowing padding for a:hover without affecting the h4 positioning */
.section h4 a,#archive h3 a{margin:-2px -4px -1px -4px;padding:2px 4px 1px 4px;text-decoration:none;color:#DF295A;}
.section h4 a:hover,#archive h3 a:hover{background:#F3E9CA;color:#E57300;border-bottom:1px solid #CFB86E;}
.section p{margin:0 0.5em 1.5em 0.5em;color:#8A7463;}
.section p a:link,.section p a:active,.section p a:visited{text-decoration:none;border-bottom:1px dotted #E57300;}
.section p a:hover{color:#DF295A;border-bottom:1px solid #CFB86E;background-color:#F3E9CA;}
.section_pic{margin:0.3em auto;width:90%;height:45px;border:3px solid #CFB86E;text-indent:-9000px;}
.section ul{list-style-type:none;margin:5px 0 20px 0;padding:0;}
.section li a{margin:0.4em auto;width:90%;padding:6px 2px 6px 31px;display:block;background:#F3E9CA url(img/linkbg.gif) no-repeat 3px 8px;}
.section li a:hover{display:block;padding:1px 0;border:2px solid #CFB86E;padding:4px 0 4px 29px;background:#F3E9CA url(img/linkbg_hov.gif) no-repeat 1px 6px;color:#DF295A;}
.section .button,.section .field{margin-top:5px;}
/*
ARCHIVE --------------------- */
#archive h3{margin:1.3em 0 0 0;font:normal 1.55em Georgia,serif;color:#613032;letter-spacing:-1px;}
#archive p{margin:0;padding:0;font-size:.8em;}
/*
FOOTER --------------------- */
#footer{height:174px;padding:8px 0 1em 0;background:url(img/bg_barbottom.gif) no-repeat top center;}
#footer p{font-size:10px;color:#B05042;}
#footer p#copy{float:left;width:40%;}
#footer p#imagery{float:right;width:40%;text-align:right;}
/*
MISC --------------------- */
#container{background:url(img/bg_container.gif) 70% 0% repeat-y;border-bottom:3px solid #DF295A;}
/* 'margin:0 auto' is necessary so the layout stays centered on screen when browser width is more than 1200px */
#container,#footer{margin:0 auto;min-width:740px;max-width:1200px;}
.shell{margin:0 auto;width:85%;}
#skip,#back{display:none;}
#mapcontainer{width:405px;height:300px;padding:4px;margin:10px 0 10px 0;border:1px solid #959478;background-color:#fff;}
#map img{background:transparent;}
#map{width:405px;height:300px;background:url(img/mapbg.jpg) center center no-repeat;}
img#wpstats{border:0;background:transparent;}
/*
P.I.E. FLOAT CLEARING
See http://www.positioniseverything.net/easyclearing.html 
--------------------- */
.clearfix:after{content:".";clear:both;height:0;visibility:hidden;display:block;}
.clearfix{display:inline-block;/* Fixes IE/Mac */}
/* Hides from IE-mac \*/
* html .clearfix{height:1%;}
.clearfix{display:block;}
/* End hide from IE-mac */
