/* Grapes, web template for business or for fun */
/* By Dave Reeder, www.davereederdesign.com */
/* Modified by Zoltan Zmeskal */

* {
	margin: 0;
	padding: 0;
}

body {
	background: url(images/img01.png) repeat-y center;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #053858;
	background: #213205;
}

h2, h3 {
	font-family: Arial Narrow, Impact, Georgia, "Times New Roman", Times, serif;
	color: #D62723; font-weight: bolder;
	letter-spacing: -.05em;
}


h1 {
	font-family: Impact, Georgia, "Times New Roman", Times, serif;
	color: #D62723;
	letter-spacing: -.05em;
	font-size: 2.2em;
}

h2 {
	margin-top: 1em;
	letter-spacing: .05em;
	font-size: 1.4em;
	border-bottom: 1px dashed #D62723;
}

h3 {
	margin-top: 1em;
}

p, ul, ol {
	margin-top: 1em;
	line-height: 160%;
}

#list {
	font: normal 1.5em;
}

#list p {
	margin: 0 0 0 15px;
	padding: 0 0 0.25em 0.25em;
	list-style: outside square;
}

strong {font-weight: bold; color: #D62723;}

table {border: 2px solid #800080;} 


/*----------------------------------------------Basic styles------------------------------------------------*/


h1 {float:right; right: 0px; top: 30px; font-size: 2.25em; letter-spacing: 0.1em; line-height: 1.00em; padding-right: 10px; border-right: 15px solid #eee}
h1:first-letter {font-family: Verdana, Georgia, serif; font-size: 2.25em} /* styles the first letter of the main title to make it large */

p#tagline {position: relative; left: 400px; top: 60px; font-style: italic; color: #648D20; font-size: 0.90em}  /* sits under main title */

.lang {position: relative; left: 561px; top: -30px;}

code {font-family: monospace; font-size: 1.20em; color: #E20000}

p span {font-size: 1.50em; font-weight: bold} /* shouting words */

a:link, a:visited {color: #792533; font-weight: bold; text-decoration: none; }
a:hover, a:active {color: #fff; border-color: #fff}

ul {list-style: inside square} /* general lists */

acronym {color: #a03; border-bottom: 1px dashed #a03; cursor: help}

.thmb {padding: 5px; border: 1px solid #D62723; }


/*-----------------------------------------------Layout DIVS------------------------------------------------*/

#container {  /* keeps everything together */
	width: 760px;
	margin: 0 auto;
	background: #CCCC33;
}

#hdr {  /* div containing h1, nav and grapes image */

	width: 760px;
	height: 120px;
	background-color: #CCCC33;
	border-bottom: 3px solid #d9d93c;
	
}

#hdr a {color: #D62723;}
#hdr img {border: 0;}

#lftcol {   /* left column */
float: left;
width: 200px;
margin-top: 15px;
}

#rgtcol {float: left; margin-bottom: 20px;
width: 500px; padding: 20px;}  /* right column */

#extra {font-family: Verdana; padding: 20px; color: #B6482F; background: #D8D876; border: 1px dashed #B6482F; font-size: 0.70em; margin-top: 20px; background-image: url("../images/extra.gif"); background-repeat: no-repeat; background-position: 430px 5px;}

#bttmbar {padding: 20px; clear: both; text-align: left; font-size: 0.60em; height: 4em; line-height: 4em; background: #213205; border-top: 3px solid #D62723;}

#bttmbar p {line-height: 1.6em; font-style: italic; color: #ddd;}

#bttmbar a {color: #CCCC33;}

#footer {
	clear: both;
	height: 100px;
	padding-top: 20px;
	background: #EFEFEF;
	border-top: 1px solid #CCCCCC;
}

#footer p {
	margin: 0;
	text-align: center;
	font-size: 77%;
}

#quote {    /* Quote box in left column */
	float: left;
	margin: 10px 0 20px 10px;
	padding: 10px 0;
	width: 170px;
	text-align: center;
	background: url(../images/quote.gif) no-repeat 0 0;
	font-style: italic;
}

#quote p {color: #444; font-size: 0.80em; font-weight: bold; line-height: 2.00em}  /* Quote box text */


/*---------------------------------------------Main Navigation-----------------------------------------------*/

ul#nav {   /* navigation list */
	margin: 0px 0 20px 0; /* the 53px is where the nav begins (margin top) */
	padding: 0;
	list-style: none inside
}
	
ul#nav li {float: left;	display: block}

ul#nav li a {
	width: 170px;
	margin: 3px 0 0 0;  /* a little top margin */
	border: 0;
	border-left: 10px solid #CCCC33;
	padding: 10px 10px;
	font-family: Trebuchet MS, Georgia, serif;
	font-weight: normal;
	font-size: 75%;
	text-decoration: none;
	display: block;
	color: #450F1F;
	background: #D9D93C;
}

ul#nav li a#current {border-color: #eee}   /* current page, move id in the xhtml when creating a new page */

ul#nav li a:hover {background: #9EA219; color: #eee}


/*--SPEECH BUBBLE--*/

.character {
	MARGIN-TOP: 6px
}
.sbl {
	BACKGROUND: url(bl.gif) #ededed no-repeat left bottom; WIDTH: 50%; TEXT-ALIGN: center; min-width: 100px
}
.sbr {
	BACKGROUND: url(br.gif) no-repeat right bottom
}
.stl {
	BACKGROUND: url(tl.gif) no-repeat left top
}
.str {
	PADDING-RIGHT: 10px; PADDING-LEFT: 10px; BACKGROUND: url(tr.gif) no-repeat right top; PADDING-BOTTOM: 10px; PADDING-TOP: 10px
}
.sb {
	PADDING-RIGHT: 0px; PADDING-LEFT: 50px; BACKGROUND: url(b.gif) no-repeat 30px top; PADDING-BOTTOM: 10px; PADDING-TOP: 2px
}
.container {
	PADDING-RIGHT: 10px; PADDING-LEFT: 10px; BACKGROUND: #ffffff; PADDING-BOTTOM: 10px; WIDTH: 80%; PADDING-TOP: 10px
}
.sbl2 {
	BACKGROUND: url(bl2.gif) #e9e9e9 no-repeat left bottom; WIDTH: 30%; TEXT-ALIGN: center; min-width: 100px
}
.sbr2 {
	BACKGROUND: url(br2.gif) no-repeat right bottom
}
.stl2 {
	BACKGROUND: url(tl2.gif) no-repeat left top
}
.str2 {
	PADDING-RIGHT: 10px; PADDING-LEFT: 10px; BACKGROUND: url(tr2.gif) no-repeat right top; PADDING-BOTTOM: 10px; PADDING-TOP: 10px
}
.sb2 {
	PADDING-RIGHT: 0px; PADDING-LEFT: 50px; BACKGROUND: url(b2.gif) no-repeat 30px top; PADDING-BOTTOM: 10px; PADDING-TOP: 2px
}

/*--SPEECH BUBBLE END--*/