/* =========================================================
Basis-Stylesheet

Projektname: Inge Mayer Malerei

Media: screen
Datum: 11. Juni 2010
Autor: Andreas M. Helge
Web: www.formspiel.de
Farben: CD: #; Text: #; hover: #;

========================================================== */

@media all {
	/* ===== non-showable ===== */
	.invisible {display: none;}

	/* ===== reset ===== */
	body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,hr {margin:0;padding:0;}
	table {border-collapse:collapse;border-spacing:0;}
	fieldset,img {border:0;}
	ul {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;}

	/* ===== The 1Kb Grid – 760px 10 Columns ~ Margin left: 5px ~ Margin right: 5px ===== */
	.grid_1 {width: 66px;}
	.grid_2 {width: 142px;}
	.grid_3 {width: 218px;}
	.grid_4 {width: 294px;}
	.grid_5 {width: 370px;}
	.grid_6 {width: 446px;}
	.grid_7 {width: 522px;}
	.grid_8 {width: 598px;}
	.grid_9 {width: 674px;}
	.grid_10 {width: 750px;}
	.column {margin: 0 5px 0 5px; overflow: hidden; float: left; display: inline;}
	.row {width: 760px; margin: 0 auto; padding-top: 20px; overflow: hidden; border-right: 1px solid #b2b2b2; border-left: 1px solid #b2b2b2; background-color: #fff;}
	.row .row {margin: 0 -5px 0 -5px; width: auto; display: inline-block;}

	/* ===== general ===== */
	body {font: 14px/20px Heletica, Arial, sans-serif; color: #3b3b3b; background-color: #f8f8f8}
	h1 {float: left; padding-right: 20px; font: bold 17px/20px Arial, sans-serif; color: #83b817; text-transform: uppercase;}
	h2 {}
	h3 {}
	h4 {}
	p {}
	p.marginalNote {font-size: 12px;}
	
	a:link, a:visited {color: #333; text-decoration: none;}
	a:hover, a:active {color: #83b817; text-decoration: underline;}

	img {vertical-align: baseline}
		
	ul {margin-bottom: 9px}
	ul li {padding-left: 12px;}
	
	ol {margin-bottom: 9px}
	ol li {margin-left: 18px}
	
	hr {border: 0px; border-top:solid #751311 1px; /*FF Opera*/ border-bottom: solid 1px #751311;/*IE*/ margin: 0 0 10px 0; line-height: 0;}
	abbr {cursor: help; border-bottom: 1px dashed #333;}

	blockquote {margin: 0 10px 9px 0; padding: 9px 18px; font-style: italic; background-color: #f2f0ef; border: 1px solid #fff;}
	blockquote cite {display: block; font-size: 90%; font-style: normal; letter-spacing: 1px; text-align: right;}
	
	div.support {background-color: white; margin: 0 5px 5px; padding: 5px; border: 2px solid red;}
	
	/* ===== layout ===== */
	#header {margin-top: 40px; border-top: 1px solid #b2b2b2;}
	#logo {margin: 16px 0 13px 76px}
	#diashow { background-color: #ebebeb}
	#content {}
	#contact {padding-bottom: 20px}
	#footer {padding-top: 0; margin-bottom: 40px; border-top: 1px solid #b2b2b2; border-bottom: 1px solid #b2b2b2; text-align: center}
	#footer p, #footer a {padding: 3px 0; font-size: 10px; color: #666}
	/* ===== content ===== */
	
	/* ===== navigation ===== */
	ul#menu {margin-top: 25px; margin-left: 216px;}
	ul#menu li {float: left; margin-right: 20px}
	ul#menu li a, ul#menu li.current ul li a, ul#menu li.parent-1 ul li a {font: bold 14px/20px Heletica, Arial, sans-serif; color: #83b817; text-transform: uppercase}
	ul#menu li.current, ul#menu li.parent-1 {}
	ul#menu li.current a, ul#menu li.parent-1 a, ul#menu li.parent-1 ul li.current a {}
	ul#menu li:hover {background-color: #fff}
		
		ul#menu a {
			display: block;
			/* height: 100%;
			width: 100%;
			cursor: pointer; */
		}
		
		ul#menu ul {
			position: absolute;
			top: 0px;
			left: 187px;
			width: 187px;
			/* display: block; */
			/* background-color: silver; */
		}
	/* === FUCK IE6 === */
	* html #header {height: 215px;}
	* html ul#menu li {height: 18px; line-height: 18px}
	* html #claim {display: inline;}
	* html ol li {margin-left: 18px}
	
	/* === FUCK IE7 === */
	*:first-child+html #id{}

	/* === Easy Slider === */
	#slider ul, #slider li,	#slider2 ul, #slider2 li {margin:0; padding:0; list-style:none;}
	#slider2{margin-top:1em;}
	#slider li, #slider2 li{width:598px; height:380px; overflow:hidden;}
	
	/* buttons*/
	#prevBtn, #nextBtn,
	#slider1next, #slider1prev {display:block; width:30px; height:77px; position:absolute; left:-30px; top:71px; z-index:1000;}
	#nextBtn, #slider1next {left:696px;}
	#prevBtn a, #nextBtn a,
	#slider1next a, #slider1prev a{  
		display:block;
		position:relative;
		width:30px;
		height:77px;
		background:url(../images/btn_prev.gif) no-repeat 0 0;	
		}	
	#nextBtn a, #slider1next a{ 
		background:url(../images/btn_next.gif) no-repeat 0 0;	
		}	
	
	/* numeric controls */
	ol#controls {clear: both; margin:1em 0; padding:0; height:20px}
	ol#controls li {float:left; margin:0 10px 0 0; padding:0; list-style:none; height:20px; line-height:20px}
	ol#controls li a {float:left; height:20px; padding:0 7px; line-height:20px; background:#f8f8f8; color: #666; text-decoration:none; font-weight: bold}
	ol#controls li.current a { background:#83b817; color:#fff; }
	ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus {outline:none;}



	/* ===== footer ===== */
	#footer {}

}/*end media*/
	
@media print {
	/* ===== non-printable ===== */
	.invisible {display: none;}

}