/*
Theme Name: Max and the Magic Marker
Description: Wordpress theme
Version: 3.0
*/
/* RESET
----------------------------------------------*/
/*html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,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{ border:0;outline:0;vertical-align:baseline;background:transparent;margin:0;padding:0; }*/

/* LAYOUT
----------------------------------------------*/
body{ 
	background: #00aeff url('images/background.jpg') 50% 0 no-repeat; 
	font: 62.5%/1.6em verdana, geneva, sans-serif;
	margin:0 auto; 
	margin-top: 50px;
	overflow-x:hidden;
}

#flashheader{
	position: relative;
	z-index: 10;
}

#content-wrapper{
	position: relative;
	width: 980px;
	z-index: 1;
	margin: 0 auto;

	/*background-color: #fff;	*/
}

#buynow_button{
	position: absolute;
	width: 243px;
	height: 243px;
	left: -50px;
	top: -50px;
	z-index: 10;
	cursor: pointer;
}

#buynow_button a{
	display:block;
	width: 243px;
	height: 243px;
}

#buynow_button.dk{
	background:url('images/buynow_dk_sprite.png') 0 0 no-repeat;
}

#buynow_button.eu{
	background:url('images/buynow_eu_sprite.png') 0 0 no-repeat;
}

#buynow_button.us{
	background:url('images/buynow_us_sprite.png') 0 0 no-repeat;
}

#buynow_button:hover{
	background-position: -243px 0px; 
}

#clicklayerShop{
	position: absolute;
	right: -33px;
	top: -50px;
	width: 250px;
	height: 50px;
	z-index: 10;
}

#clicklayerShop a{
	position: relative;
	display:block;
	width: 250px;
	height: 50px;

}

#clicklayerHeader{
	position: absolute;
	width: 960px;
	height: 150px;
	top: -25px;
}

#clicklayerHeader a{
	position: relative;
	display:block;
	width: 960px;
	height: 150px;

}

#content{
	padding-top: 5px;
}

#content-middle{
	background:url('images/bg_content_middle.png') 50% 0 repeat-y;
	min-height: 800px;
	
}

#content-top{
	background:url('images/bg_content_top.png') 50% 0 no-repeat;
	height: 26px;
}

#content-bottom{
	background:url('images/bg_content_bottom.png') 50% 0 no-repeat;
	height: 23px;
	position: relative;	
}

#footer{
	background-color:#231c13;
	margin-top: -40px;
	z-index: 1;	
	background:#231c13 url('images/footer.jpg') no-repeat 50% 0%;	
	min-height:140px;	
}

#newsticker{
	padding-bottom: 10px;
}

/* MENU
----------------------------------------------*/

#menu{
	position: relative;
	top: 10px;
	left: 10px;
	z-index: -1;
	/*background:url('images/buttons_nogobos.png') 50% 0 no-repeat;*/
}

#menu li{
	display: inline;
	
}

#menu li a{ 
	background:url('images/buttons_nogobos.png') 0 0 no-repeat;
	display: block;	
	float:left;
	width: 145px;
	height: 217px;	
}
#menu li a:hover { 
	background:url('images/buttons_gobos.png') 0 0 no-repeat;
}

#menu li.selected a{
	background:url('images/buttons_gobos.png') 0 0 no-repeat;
}

#menu li a.story{ background-position: -2px 2px; }
#menu li a.faq{ background-position: -151px 2px; }
#menu li a.forum{ background-position: -300px 2px; }
#menu li a.blog{ background-position: -450px 2px; }
#menu li a.press{ background-position: -600px 2px; }
#menu li a.demo{ background-position: -750px 2px; }

/*
#menu li a.story:hover{
	background-position: -2px -122px;
}
*/

/*
#menu li a {background-image:url('../img/image_nav.gif')}
#menu li a.item1 {background-position:0px 0px}
#menu li a:hover.item1 {background-position:0px -72px}
#menu li a.item2 {background-position:0px -143px;}
#menu li a:hover.item2 {background-position:0px -215px;}
*/

#menu:hover{
	/*background:url('images/buttons_gobos.png') 50% 0 no-repeat;*/

}

/* NEWSFEED
----------------------------------------------*/
.newsfeed{
	font-size: 1.5em;
}

.newsfeed h2{
	font-size: 1.5em;
	margin-bottom: 10px;
	color: #00aeff;	
	text-align: center;
}

.newsfeed ul{

}

.newsfeed li{
	border-top: 1px solid #eee;
}

.newsfeed li:last-child{
	border-bottom: 1px solid #eee;
}

.newsfeed .date{

}

.newsfeed .link{

}

.newsfeed li a{
	padding: 5px 0 5px 0;
	display: block;
	text-decoration: none;
	color: #00aeff;
}

.newsfeed a:hover{
	background-color: #00aeff;
	color: #FFF;
	padding-left: 4px;
}


/* POST
----------------------------------------------*/
.post{

}

.post_title h2{
	font-size: 2.1em;
	/*color: #FFF;*/
	color: #72400f;
	font-weight: bold;
	/*background-color: #00aeff;*/
	background: url(images/header_middle.png) repeat-y center center; 	
	padding: 5px;
	padding-left: 10px;
}

.post_title h2 a{
	color: #72400f;
	text-decoration:none;
}

.post_title h2 a:hover{
	color: #72400f;
	text-decoration:underline;
}
.post_title{
	position: relative;
	z-index: 10;
	margin-bottom: 15px;
}

.post_title .h2_top{
	background: url(images/header_top.png) no-repeat top center; 
	height: 5px;	
	z-index: 100;	
}

.post_title .h2_bottom{
	background: url(images/header_bottom.png) no-repeat bottom center; 
	height: 5px;
	z-index: 100;	
}

.post_title .h2_icon{
	position:absolute;
	left: 370px;
	top: -49px;
}


.post h3{
	font-size: 1.3em;
	color: #72400f;
	font-weight: bold;
}

.post img{
	max-width: 500px;
}

.post-meta{
	padding-top: 5px;
	padding-left: 10px;
	font-size: 1.2em;
	color: #72400f;
	margin-bottom: 15px;
}

.post p{
	text-align: justify;
	margin-left:10px;
}

.post li{
	list-style-type:square;
	margin-left: 1.5em;
}


.post ol{
	margin-bottom: 30px;

}

.post ol li{
	font-size: 1.3em;
	height: 20px;
	padding-left: 20px;
	margin-left: 10px;
	list-style-type: none;
	background: url(images/bullet.png) left center no-repeat;
}


.post .testimonial{
	position: relative;
	margin-left: 10px;
}

.post .testimonial .icon{
	
}

.post .testimonial .text{
	position: absolute;
	top: 0;
	left: 50px;
}


/* FRONT
*****************************************************************************************/
.front{

}

.front p{
	padding-left: 10px;
	padding-right: 10px;
}

.front .post_title{
	margin-bottom: 10px;
}

/* General styling
*****************************************************************************************/
.contentPadding{
	padding: 0 15px 5px 15px;
}

.rightBorder{
	border-right: 1px solid #eee;
}

h2{
	font-family: arial, Helvetica,sans-serif;
}
h3{
	margin-left: 10px;
	font-size:10px;
	margin-bottom: 10px;
	margin-top: 20px;
	font-family:Verdana, Geneva, sans-serif;
}

p{
	margin-bottom: 15px;
	font-size: 1.3em;
	/*margin-left: 10px;*/

}

.demobanner{
	margin:0;
	padding: 0;
	background:url('images/demoBannerNormal.png') 50% 50% no-repeat;
	width: 323px;
	height: 198px;
}

.demobanner:hover{
	background:url('images/demoBannerOver.png') 50% 50% no-repeat;
}

.demobanner a{
	display: block;
	width: 323px;
	height: 198px;	
}

hr{
	background-color: #eee;
	border: 1px solid #eee;
}

.transparent_class {
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}

.solid_on_hover{
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}

.solid_on_hover:hover{
	filter:alpha(opacity=100);
	-moz-opacity:1;
	-khtml-opacity: 1;
	opacity: 1;
}

.transparent_on_hover:hover{
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}

/* Styling of sidebar
*****************************************************************************************/

.commentbox .middle p{
	margin: 1em 0;
	padding: 0;
	font-size: 1.2em;
}

.commentbox .top{
	position: absolute;
	top: 0;
	background:url('images/commentsFrameTop.jpg') 50% 0 no-repeat;
	height: 16px;
	width: 493px;
}

.commentbox .bottom{
	position: absolute;
	bottom: 0px;
	background:url('images/commentsFrameBtm.jpg') 50% 0 no-repeat;
	height: 16px;
	width: 493px;
}

#sidebar{
	/*width: 353px;*/
}

#sidebar-middle{
	background:url('images/sidebar_middle.png') 50% 0 repeat-y;
	border-left: 1px solid #ffffff; /* Weird IE fix to make the background tile !?! */
	border-right: 1px solid #ffffff; /* Weird IE fix to make the background tile !?! */
	/*min-height: 500px;*/
}

#sidebar-top{
	position: relative;
	background:url('images/sidebar_top.png') 50% 0 no-repeat;
	height: 22px;
}

#sidebar-bottom{
	background:url('images/sidebar_bottom.png') 50% 0 no-repeat;
	height: 249px;
}

.sidebarPadding{
	padding: 0 25px 5px 20px;
}

#sidebar .textwidget{
	width: 313px;
	margin: 0 auto;
}

#sidebar h2{
	width: 313px;
	margin: 0 auto;
	font-size: 1.8em;
	margin-bottom: 0.4em;
	color: #666;	
}

#sidebar h3{
	font-size: 1.4em;
}

#sidebar input[type=text]{
	width: 70%;
}

#sidebar strong{
	color: #72400f;
	width: 100%;
	text-align: center;
	display: block;
	font-size: 1.4em;
	margin-bottom: 15px;
}

#sidebar hr{
	width: 95%;
	height: 1px;
	background-color: #bac1c5;
	border: 0;
	margin: 20px 0 20px 0;
}

#sidebar p{
	color: #6d6d6d;
	padding: 0 10px 0 10px;
	text-align: justify;
}

#sidebar ul{
	width: 313px;
	margin: 0 auto;
}

#sidebar ul a{
	color: #ea8319;
	font-size: 1.2em;
	text-decoration: none;
}

#sidebar ul a:hover{
	color: #72400f;
	text-decoration: underline;
}

/****************************************************************************************/
/* Styling of demo page
*****************************************************************************************/

.demoborder{
	width: 820px;
	height: 520px;
	background:url('images/demo_border.png') top left no-repeat;
	margin: 0 auto;
	padding-top: 10px;
}

.demoinner{
	width: 800px;
	margin: 0 auto;
}

.demodescription{
	font-size: 0.8em;
	width: 820px;
	margin: 0 auto;
}

/****************************************************************************************/


/* Styling of comments
*****************************************************************************************/

.commentlist{ }
.commentlist h4{ margin: 0; font-size: 1.8em; font-weight: bold }
.commentlist ul{

}

.commentrow{ padding: 5px 0 5px 0 }

.commentbox{
	position: relative;
	background:url('images/comment_middle.png') 50% 0 repeat-y;
	margin-bottom: 20px;
	width: 493px;
}

.commentbox .middle{
	padding: 10px 20px 10px 20px;
}

.commentbox .middle p{
	margin: 1em 0;
	padding: 0;
	font-size: 1.2em;
}

.commentbox .top{
	position: absolute;
	top: 0;
	background:url('images/comment_top.png') 50% 0 no-repeat;
	height: 16px;
	width: 493px;
}

.commentbox .bottom{
	position: absolute;
	bottom: 0px;
	background:url('images/comment_bottom.png') 50% 0 no-repeat;
	height: 16px;
	width: 493px;
}

.commentbox.author{
	background:url('images/comment_middle_blue.png') 50% 0 repeat-y;
}

.author .top{
	background:url('images/comment_top_blue.png') 50% 0 no-repeat;
}

.author .bottom{
	background:url('images/comment_bottom_blue.png') 50% 0 no-repeat;
}

.commentbox .commentdate{

}

.commentbox .commentauthor{
	font-weight: bold;
	font-size: 1.2em;
}

.commentbox a{
	color: #72400f;
}

.commentbox a:visited{
	color: #72400f;
}

/*input[type=text] { height: 17px; background: url( ../images/background-input.gif) no-repeat left top; border: 1px solid #d5cccc; padding: 3px; color: #999999; }*/
.newsform { margin-bottom: 3px; padding-top: 10px }
.newsform input[type=text] { width: 200px; height: 17px; border: 1px solid #d5cccc; padding: 3px; color: #999999; width:100%; }
.newsform textarea { border: 1px solid #d5cccc; padding: 3px; height:122px; color: #999999; width:100%;}
.newsform label { font-size: 0.9em; color: #333333; font-weight: bold; display: block; padding: 7px 0 4px 0; }
.newsform p{margin-bottom: 0px}

/*
*****************************************************************************************/
.alignleft{ float: left;}
.alignright{ float: right; }
.left { float: left!important}
.right { float: right!important}
