/*  

Joachim Bartoll
Version: 2.0

*/



/* 1. Reset margins */

* {
	margin: 0;
	padding: 0;
}


/* 2. Core Stuff */


body#pagetop {
	margin: 0;
	padding: 0;
	color: #333;
	background: #666 url(http://www.bartoll.com/templates/bartoll_com/images/background.gif) repeat-y 50% 0;
	font-size: 12px;
	line-height: 18px;
	font-weight: normal;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif, Lucida Grande;
	text-align: center;
}

div#wrapper {
	width: 766px;
	margin: 0 auto 0 auto;
	background: url(http://www.bartoll.com/templates/bartoll_com/images/bg_contents_white.gif) repeat-y 50% 0;
	text-align: left;
}

div#header {
	height: 28px;
	padding: 10px 4px 0 4px;
	background: url(http://www.bartoll.com/templates/bartoll_com/images/logo.jpg) no-repeat 0 0;
}

div#top {
	clear: both;
}

div#content_top {
	background: url(http://www.bartoll.com/templates/bartoll_com/images/bg_content_top_white.gif) no-repeat 50% 0;
}

div#mainfull {
	width: 730px; /* 706 */
}


div#mainarticle {
	width: 600px;
	float: left;
	padding: 14px 0 0 30px;
}

div#extra {
	width: 206px;
	margin-top: 16px;
}

div#extra {
	float: right;
	padding: 8px 20px 0 0;
	font-size: 10px;
	line-height: 16px;
}

div#main, #mainfull {
	float: left;
	padding: 14px 0 0 30px;
	margin: 0;
}

div#bottom {
	clear: both;
	height: 30px;
	padding: 28px 0 0 0;
	color: #333;
	background: url(http://www.bartoll.com/templates/bartoll_com/images/bg_bottom.gif) no-repeat 0 0;
}

div#header a:link,
div#header a:visited,
div#header a:active,
div#header a:hover,
div#top a:link,
div#top a:visited,
div#top a:active,
div#top a:hover {
	border: none;
	text-decoration: none;
}

.jbcalendar {
	font: 0.9em Verdana, Arial, Sans-Serif;
	margin-left: -35px;
	}

.jbcalendar a:link,
.jbcalendar a:visited,
.jbcalendar a:active,
.jbcalendar a:hover { 
	font-weight: bold; 
	text-decoration: none;
}


/* 4. Search */

ul#searchfield {
	float: left;
	height: 18px;

}
ul#searchfield li {
	display: block;
	height: 18px;
}

ul#searchfield li {
	float: left;
}

div.search input {
	float: left;
	display: block;
	height: 18px;

}

.button {
	margin-top: 2px;
	float: left;
	height: 18px;
	margin-left: 12px;
}

.button img {
	border: none;
	height: 18px
}

input.button { cursor: pointer; }


/* 5. Link to Team reFORM */


p#reform {
	float: right;
	width: 104px;
	height: 25px;
	background: url(http://www.bartoll.com/templates/bartoll_com/images/reforml.gif) no-repeat 0 0;
	margin: 0px;
	padding: 0px;
}

p#reform a {
	display: block;
	width: 104px;
	height: 25px;
}
p#reform a:active,
p#reform a:hover {
	background: url(http://www.bartoll.com/templates/bartoll_com/images/reforml.gif) no-repeat 0 -25px;
}

p#acrobat {
	float: right;
	width: 88px;
	height: 31px;
	background: url(http://www.bartoll.com/templates/bartoll_com/images/get_adobe_reader.gif) no-repeat 0 0;
	margin: 0px;
	padding: 0px;
}
p#acrobat a {
	display: block;
	width: 88px;
	height: 31px;
}
p#acrobat a:active,
p#acrobat a:hover {
	background: url(http://www.bartoll.com/templates/bartoll_com/images/get_adobe_reader.gif) no-repeat 0 0;
}

div#logo {
	height: 85px;
	background: url(http://www.bartoll.com/templates/bartoll_com/images/logo.jpg) no-repeat 0 -38px;
}
div#logo a {
	display: block;
	float: left;
	width: 766px;
	height: 80px;
}
div#logo a:link, div#logo a:visited, div#logo a:active, div#logo a:hover {
	background: transparent;
}


/* 6. Menu navigation styles */

div#menuwrap {
    background: transparent url(http://www.bartoll.com/templates/bartoll_com/images/menu_bg.gif) no-repeat 0 0;
    padding: 0 0px 0 3px;
    margin: 0;
    width: 763px;
    height: 39px;
    position: relative;
}

ul#menu {
	height: 39px;
	position: relative;
}
    
#menu li.main { display: block;}
#menu li.main a.menu_link { height: 34px; display: block; }
    
li#menu_biography_en { position: absolute; left: 0; }
li#menu_blog_en { position: absolute; left: 71px; }
li#menu_services_en { position: absolute; left: 142px; }
li#menu_articles_en { position: absolute; left: 214px; }
li#menu_products_en { position: absolute; left: 281px; }
li#menu_photo_en { position: absolute; left: 362px; }
li#menu_contact_en { position: absolute; left: 434px; }
li#menu_links_en { position: absolute; left: 506px; }

#menu_biography_en a.menu_link, #menu_blog_en a.menu_link, #menu_services_en a.menu_link, #menu_articles_en a.menu_link, #menu_products_en a.menu_link, #menu_photo_en a.menu_link, #menu_contact_en a.menu_link, #menu_links_en a.menu_link { background: transparent url(http://www.bartoll.com/templates/bartoll_com/images/menu_en.gif) no-repeat; }
            
#menu_biography_en a.menu_link { width: 71px; background-position: 0 0; }
#menu_blog_en a.menu_link { width: 72px; background-position: -72px 0; }
#menu_services_en a.menu_link { width: 72px; background-position: -143px 0; }
#menu_articles_en a.menu_link { width: 67px; background-position: -215px 0; }
#menu_products_en a.menu_link { width: 81px; background-position: -282px 0; }
#menu_photo_en a.menu_link { width: 72px; background-position: -363px 0; }
#menu_contact_en a.menu_link { width: 72px; background-position: -435px 0; }
#menu_links_en a.menu_link { width: 62px; background-position: -507px 0; }

#menu_biography_en a.menu_link:hover { background-position: 0 -34px; }
#menu_blog_en a.menu_link:hover { background-position: -72px -34px; }
#menu_services_en a.menu_link:hover { background-position: -143px -34px; }
#menu_articles_en a.menu_link:hover { background-position: -215px -34px; }
#menu_products_en a.menu_link:hover { background-position: -282px -34px; }
#menu_photo_en a.menu_link:hover { background-position: -363px -34px; }
#menu_contact_en a.menu_link:hover { background-position: -435px -34px; }
#menu_links_en a.menu_link:hover { background-position: -507px -34px; }


/* 7. Main Layout */

pre,
p.command {
	margin: 7px 3px 7px 3px;
	border: 1px solid #E2E2E2;
	padding: 8px 12px 8px 12px;
	background: #F2F2F2;
	color: #666;
	font-size: 12px;
	line-height: 17px;
}


/* 8. Contents layout and elements */

div#blog_r270 {
	width: 270px;
	float: right;
	line-height: 16px;
	margin-left: 11px;
}

div#blog_r250 {
	width: 250px;
	float: right;
	line-height: 16px;
	margin-left: 11px;
}

div#blog_l270 {
	width: 270px;
	float: left;
	line-height: 16px;
	margin-right: 11px;
}

div#blog_l250 {
	width: 250px;
	float: left;
	line-height: 16px;
	margin-right: 11px;
}

li#copyright {
	float: left;
	width: 486px;
	list-style: none;
	font-size: 10px;
	line-height: 12px;
	text-align: center;
}

li#copyright, #dummy {
	padding-left: 140px;
}

.cb { clear:both ; }

.mt-12 {margin-top: -12px;}

.pl-10 {padding-left: 10px;}

div#logo {
	height: 85px;
	background: url(http://www.bartoll.com/templates/bartoll_com/images/logo.jpg) no-repeat 0 -38px;
}
div#logo a {
	display: block;
	float: left;
	width: 766px;
	height: 80px;
}
div#logo a:link, div#logo a:visited, div#logo a:active, div#logo a:hover {
	background: transparent;
}




/* 9. Hidden elements */


#logo a,
#logotype a,
ul#lang li,
ul#lang li a,
ul#menu li a,
div.container h2,
p#acrobat a,
p#reform a {
	font-size: 1px;
	line-height: 1px;
	text-indent: -9999px;		
}





/* Begin Blog Typography & Colors */



sub, sup {

font-family: serif, Georgia;

font-size: 1.1em;

color: #606e79;

}



.squarebox {

padding: 8px;

width: 450px;

background-color: #a4acb3;

border: 1px solid #6f7d88;

}



.squarebox_bright {

padding: 8px;

width: 450px;

background-color: #bec4c8;

border: 1px solid #6f7d88;

}



#page {;

	text-align: left;

	}



#content {

	font-size: 1em;

	color: #2c4353;

	}



.widecolumn .entry p {

	font-size: 0.9em;

	}



.narrowcolumn .entry, .widecolumn .entry {

	line-height: 1.4em;

	}



.widecolumn {

	line-height: 1.6em;

	}

	

.narrowcolumn .postmetadata {

	text-align: center;

	}



.alt {

	background-color: #f8f8f8;

	border-top: 1px solid #ddd;

	border-bottom: 1px solid #ddd;

	}



#footer {

	background-color: #f3f3f3;

	}



small {

	font-family: Arial, Helvetica, Sans-Serif;

	font-size: 0.9em;

	line-height: 1.5em;

	}



h1, h2, h3 {

	font-family: 'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;

	font-weight: bold;

	}



h1 {

	font-size: 4em;

	text-align: center;

	}



.description {

	font-size: 1.2em;

	text-align: center;

	}



h2 {

	font-size: 1.6em;

	}



h2.pagetitle {

	font-size: 1.6em;

	}



#sidebar h2 {

	font-family: 'Lucida Grande', Verdana, Sans-Serif;

	font-size: 1.2em;

	}



h3 {

	font-size: 1.3em;

        padding-left: 20px;

	}



h1, h1 a, h1 a:hover, h1 a:visited, .description {

	text-decoration: none;

	color: white;

	}



h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited {

	color: #344451;

	}



h2, h2 a, h2 a:hover, h2 a:visited, h3, h3 a, h3 a:hover, h3 a:visited, #sidebar h2, #wp-calendar caption, cite {

	text-decoration: none;

	}



.entry p { margin-bottom: 1.1em; }

.entry a { text-decoration: underline; }


.entry p a:visited {

	color: #344451;

	}



.commentlist li, #commentform input, #commentform textarea {

	font: 0.9em Verdana, Arial, Sans-Serif;

	}

	

.commentlist li {

	font-weight: bold;

	}



.commentlist cite, .commentlist cite a {

	font-weight: bold;

	font-style: normal;

	font-size: 1.1em;

	}



.commentlist p {

	font-weight: normal;

	line-height: 1.5em;

	text-transform: none;

	}



#commentform p {

	font-family: Verdana, Arial, Sans-Serif;

	}



.entrytext p {

	margin-bottom: 11px;

	}



.commentmetadata {

	font-weight: normal;

	}



#sidebar {

	font: 0.9em Verdana, Arial, Sans-Serif;

	}



small, #sidebar ul ul li, #sidebar ul ol li, .nocomments, .postmetadata, blockquote, strike {

	color: #777;

	}

	

code {

	font: 1.1em 'Courier New', Courier, Fixed;

	}



acronym, abbr, span.caps

{

	font-size: 0.9em;

	letter-spacing: .07em;

	}



a, h2 a:hover, h3 a:hover {

	color: #3b5365;

	text-decoration: none;

	}



a:hover {

	color: #147;

	text-decoration: underline;

	}

	

#wp-calendar #prev a {

	font-size: 9pt;

	}



#wp-calendar a {

	text-decoration: none;

	}



#wp-calendar caption {

	font: bold 1.3em Verdana, Arial, Sans-Serif;

	text-align: center;

	}



#wp-calendar th {

	font-style: normal;

	text-transform: capitalize;

	}

/* End Typography & Colors */







/* Begin Structure */



#page {
	margin: 5px auto;
	margin-left: -10px;
	padding: 0;
	width: 728px; /* 706px */
	border: none;
	}

	

#blog_header {
	padding: 0;
	margin: 0 auto;
	height: 70px;
	width: 100%;
	background-color: #fff;
	}



#blog_headerimg {
	margin: 0;
	height: 80px;
	width: 100%;
	}



.narrowcolumn {

	float: left;

	padding: 0 0 20px 45px;

	margin: 0px 0 0;

	width: 430px; /* 450px */

	}



.widecolumn {

	padding: 10px 0 20px 0;

	margin: 5px 0 0 150px;

	width: 430px; /* 450px */

	}

	

.post {
	margin: 0 0 40px;
	text-align: justify;
	}

/*.post a:link,
.post a:hover, 
.post a:visited {
	text-decoration: underline;
	color: #CC6633;
	}
*/


.widecolumn .post {

	margin: 0;

	}



.narrowcolumn .postmetadata {

	padding-top: 5px;

	}



.widecolumn .postmetadata {

	margin: 30px 0;

	}



.widecolumn .smallattachment {

	text-align: center;

	float: left;

	width: 128px;

	margin: 5px 5px 5px 0px;

}



.widecolumn .attachment {

	text-align: center;

	margin: 5px 0px;

}



.postmetadata {

	clear: left;

}



#footer {

	padding: 0px;

	margin: 0 auto;

	width: 726px; /* 706px */

	clear: both;

	}



#footer p {

	font-size: 10px;

	color: #666666;

	margin: 0;

	padding: 20px 0;

	text-align: center;

	}

/* End Structure */







/*	Begin Headers */

h1 {

	padding-top: 70px;

	margin: 0;

	}



.description {

	text-align: center;

	}



h2 {

	margin: 30px 0 0;

	}



h2.pagetitle {

	margin-top: 30px;

	text-align: center;

}



#sidebar h2 {

	margin: 5px 0 0;

	padding: 0;

	}



h3 {

	padding: 0;

	margin: 30px 0 0;

	}



h3.comments {

	padding: 0;

	margin: 40px auto 20px ;

	}

/* End Headers */







/* Begin Images */



img.noborder {

	border: none;

}



img.border {

	border: 1px solid #000;

}



p img {

	padding: 0;

	max-width: 100%;

	}



/*	Using 'class="alignright"' on an image will (who would've

	thought?!) align the image to the right. And using 'class="centered',

	will of course center the image. This is much better than using

	align="center", being much more futureproof (and valid) */

	

img.centered {

	display: block;

	margin-left: auto;

	margin-right: auto;

	}

	

img.alignright {

	padding: 4px;

	margin: 0 0 2px 7px;

	display: inline;

	}



img.alignleft {

	padding: 4px;

	margin: 0 7px 2px 0;

	display: inline;

	}



.alignright {

	float: right;

	}

	

.alignleft {

	float: left

	}

/* End Images */







/* Begin Lists



	Special stylized non-IE bullets

	Do not work in Internet Explorer, which merely default to normal bullets. */



.entry ul {

	/*margin-left: 0px;

	padding: 0 0 0 30px;

	list-style: none;

	padding-left: 10px;*/
	margin-left: 33px;
	margin-bottom: 12px;
	
	} 

.entrytext ul {
	margin-left: 33px;
	margin-bottom: 12px;
	
	} 


.entry #sidebar ul ul li:before {

	content: "\00BB \0020";

	}


.entry ol {

	padding: 0 0 0 35px;


	}



/*.entry ol li {

	margin: 0;

	padding: 0;

	}*/



.postmetadata ul, .postmetadata li {

	display: inline;

	list-style-type: none;

	list-style-image: none;

	}

	

#sidebar ul, #sidebar ul ol {

	margin: 0;

	padding: 0;

	}



#sidebar ul li {

	list-style-type: none;

	list-style-image: none;

	margin-bottom: 15px;

	}



#sidebar ul p, #sidebar ul select {

	margin: 5px 0 8px;

	}



#sidebar ul ul, #sidebar ul ol {

	margin: 5px 0 0 10px;

	}



#sidebar ul ul ul, #sidebar ul ol {

	margin: 0 0 0 10px;

	}



ol li, #sidebar ul ol li {

	list-style: decimal outside;

	}



#sidebar ul ul li, #sidebar ul ol li {

	margin: 3px 0 0;

	padding: 0;

	}



.sidebar_icon {

text-align: right;

padding-right: 5px;

}



/* End Entry Lists */







/* Begin Form Elements */

#searchform {

	margin: 10px auto;

	padding: 5px 3px; 

	text-align: center;

	}



#sidebar #searchform #s {

	width: 115px;

	padding: 2px;

	}



#sidebar #searchsubmit {

	padding: 1px;

	}



.entry form { /* This is mainly for password protected posts, makes them look better. */

	text-align:center;

	}



select {

	width: 130px;

	}



#commentform input {

	width: 170px;

	padding: 2px;

	margin: 5px 5px 1px 0;

	}



#commentform textarea {

	width: 100%;

	padding: 2px;

	}



#commentform #submit {

	margin: 0;

	float: right;

	}

/* End Form Elements */







/* Begin Comments*/

.alt {

	margin: 0;

	padding: 10px;

	}



.commentlist {

	padding: 0;

	text-align: justify;

	}



.commentlist li {

	margin: 15px 0 3px;

	padding: 5px 10px 3px;

	list-style: none;

	}



.commentlist p {

	margin: 10px 5px 10px 0;

	}



#commentform p {

	margin: 5px 0;

	}



.nocomments {

	text-align: center;

	margin: 0;

	padding: 0;

	}



.commentmetadata {

	margin: 0;

	display: block;

	}

/* End Comments */







/* Begin Sidebar */

#sidebar

{

	padding: 20px 0 10px 0;

	margin-left: 500px; /* 545px */

	width: 190px; /* 190px */

	}



#sidebar form {

	margin: 0;

	}



/* End Sidebar */







/* Begin Calendar */

#wp-calendar {

	empty-cells: show;

	margin: 10px auto 0;

	width: 155px;

	}



#wp-calendar #next a {

	padding-right: 10px;

	text-align: right;

	}



#wp-calendar #prev a {

	padding-left: 10px;

	text-align: left;

	}



#wp-calendar a {

	display: block;

	}



#wp-calendar caption {

	text-align: center;

	width: 100%;

	}



#wp-calendar td {

	padding: 3px 0;

	text-align: center;

	}



#wp-calendar td.pad:hover { /* Doesn't work in IE */

	background-color: #fff; }

/* End Calendar */







/* Begin Various Tags & Classes */

acronym, abbr, span.caps {

	cursor: help;

	}



acronym, abbr {

	border-bottom: 1px dashed #999;

	}



blockquote {

	margin: 15px 30px 0 10px;

	padding-left: 20px;

	border-left: 5px solid #ddd;

	}



blockquote cite {

	margin: 5px 0 0;

	display: block;

	}



.center {

	text-align: center;

	}



hr {

	display: none;

	}



a img {

	border: none;

	}



.navigation {

	display: block;

	text-align: center;

	margin-top: 10px;

	margin-bottom: 60px;

	}



.entry_spacer {

width: 400px;

height: 0px;

border-bottom: 1px solid #a4acb3;

border-top: 1px solid #eaeaea;

margin: auto;

}



#sk2-footer a {

color: #eeeeee;

}



#sk2-footer a:hover {

color: #dddddd;

}



/* End Various Tags & Classes*/



#page, #blog_header {

background-color: #f3f3f3;

}



.top {

float: right;

padding-left: 10px;

}



.toppost {

float: right;

margin-top: -15px;

}



#ibook {

position: absolute;

left: 0%;

top: 0px;

overflow: visible;

height: 200px;

width: 200px;

margin: 0 0 0 0px;

z-index: 1000000000;

border: none;

float: none;

}



/* IE Hack */



* html #ibook {

float: left;

margin-top: 0px;

overflow: hidden;

}



* html #page {

margin: auto;

overflow: hidden;

}



/* IE Hack end */



/* Now to get background and stuff working */



#blog_header {

background: url('images/header.png') no-repeat bottom center;

}



#footer {

border: none;

}



#page {

border: none;

padding: 0px;

}



#blog_header {

margin: 0 !important;

margin: 0 0 0 1px;

padding: 1px;

height: 140px;

width: 706px;

}



#blog_headerimg {

margin: 7px 9px 0;

height: 62px;

width: 400px;

}





/* Page Jump Plugin by Charles Stricklin and David House */





.page_jump {

font: .9em Arial, Helvetica, sans-serif;

padding-top: 10px;

padding-bottom: 10px;

margin: 0px;

text-align: center;

}

	

.page_jump a, .pageList .this-page {

padding: 2px 6px;

border: 1px solid #bcbfc1;

background: #fff;

text-decoration: none;

}

	

.page_jump a:visited {

padding: 2px 6px;

border: solid 1px #ddd;

background: #fff;

text-decoration: none;

}

	

.page_jump .this-page {

padding: 2px 6px;

border: solid 1px #bcbfc1;

background: #f3f3f3;

}

	

.page_jump a:hover {

background: #f3f3f3;

border: 1px solid #868b90;

text-decoration: none;

}



/* Yes, the CSS is incredibly messy, but I really don't have the energy to overgo and check everything. I did not do the base; blame Heilemann :) */



.currencies {

text-align: center;

padding-top: 20px;

padding-bottom: 20px;

}



.currencies img {

border: 1px solid #bcbfc1;

}



.currencies img:hover {

border: 1px solid #868b90;

}



/* And Spam Karma II */



#sk2-footer {

background-color: #5b6974;

height: 1.2em;

color: #f3f3f3;

border-top: #f3f3f3;

margin-top: 10px;

padding-bottom: 1px;

padding-top: 1px;

text-align: center;

}





/* This is for Brian's Threaded Comments */



small.comments_disclaimer {

color: #5d5d5d;

font-size: 1em;

}





#footer {

margin-right: 1px;

}