@charset "utf-8";
/* CSS Document */

/* Clear styles - Thankyou Mr Meyer */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, 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 { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;}
/* remember to define focus styles! */
:focus { outline: 0;}
body { line-height: 1; color: black; background: white;}
ol, ul { list-style: none;}
/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: separate; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal;}
blockquote:before, blockquote:after,q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}

/*** Main Styles ***/
body { background: url(../images/header-bg.jpg) repeat-x; font-size: 75%; font-family:Arial, Helvetica, sans-serif; }

.wrapper { width: 810px; margin: 0 auto; }
.clear { display: block; clear:both; height:0px; overflow:hidden;}

.left { float: left; }
.right { float: right; }

p { color: #333333; line-height: 20px; margin-bottom: 20px; }
strong { font-weight: bold; }
.italic { font-style: italic; }
h2 { color: #b033a0; font-weight: bold; font-size: 14px; margin: 0 0 30px 0; }

a { text-decoration: none; font-weight: bold; color: #30929f; }
a:visited { color: #30929f; }
a:hover { color: #5cbaaa; }

/*** Header ***/
.header { width: 980px; height: 209px; margin: 0 auto; background: url(../images/karin-hellaby.jpg) top left no-repeat; }

#logolink { width: 410px;  height: 160px; float: left; }
h1#logolink a, #logolink a:visited { width: 370px;  height: 35px; padding: 125px 0 0 60px; color: #55554f; display: block; font-size: 18px; text-decoration: none; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; font-weight: normal; }
#logolink a:hover { color: #55554f; }

#menu { list-style: none; float: right; margin: 120px 0 0 0; }
#menu li { float: left; margin-left: 40px; }
#menu li a { font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; font-size: 18px; text-decoration: none; color: #828282; font-weight: normal; }
#menu li.home a { border-bottom: solid 5px #f7d5da; }
#menu li.calendar a { border-bottom: solid 5px #d192ba; }
#menu li.workshops a { border-bottom: solid 5px #91c1b9; }
#menu li.contact a { border-bottom: solid 5px #a7d6bf; }

#menu li.home.hover a:hover { border-bottom: solid 5px #fab7da; color: #000; }
#menu li.calendar.hover a:hover { border-bottom: solid 5px #b033a0; color: #000; }
#menu li.workshops.hover a:hover { border-bottom: solid 5px #30929f; color: #000; }
#menu li.contact.hover a:hover { border-bottom: solid 5px #5cbaaa; color: #000; }

#home #menu li.home a { border-bottom: solid 5px #fab7da; color: #000; }
#calendar #menu li.calendar a { border-bottom: solid 5px #b033a0; color: #000; }
#workshops #menu li.workshops a { border-bottom: solid 5px #30929f; color: #000; }
#contact #menu li.contact a { border-bottom: solid 5px #5cbaaa; color: #000; }

/*** Content ***/
.content { margin: 30px 0 40px 0; line-height: 20px; }
.col2-left { width: 550px; float: left; }
.col2-right { float: left; width: 220px; margin-left: 40px;  }

#karinpic { border: 1px solid #f5f3da; margin-bottom: 15px; }
#submenu li { display: block; }
#submenu li a { display: block; border-bottom: 1px dotted #c0c0c0; padding: 8px 0 8px 4px; }
#submenu li a:hover { background: #fffde4; border-bottom: 1px solid #f9f6d6; }
#submenu li a span { color: #666666; font-weight: normal; font-style: italic; }

/* Table */
table.patchwork { margin-top: 5px; width: 500px; }
.patchwork td { width: 230px; padding: 3px 10px 3px 10px; }
.patchwork .tr-odd td { background: #ffeef7; } /* #e7fffb */
td.td-right { text-align: right; }
.patchwork p { margin: 0; }


/* Calendar */
#calendar .right { width: 250px; padding-top: 40px; }

/* contact */
#contact .left { width: 250px; padding: 0 50px 0 0; }
#contact .right { width: 500px; }

#comments_form .mand { color: #5CBAAA; text-align: right; margin-right: 164px; }

#comments_form div { margin: 0 0 12px 0; }
#comments_form label { float: left; width: 98px; display: block; color: #666; }
#comments_form label strong { color: #5CBAAA; }
#comments_form span.error { color: #C76EB2; }

#comments_form input { margin: 0 8px 0 0; padding: 5px; background: none; width: 174px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; border: 1px solid #ccc; border-style: solid; }
#comments_form input:focus { border-style: dashed; }
#comments_form textarea { margin: 0 8px 0 0; padding: 4px; width: 230px; height: 120px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; border: 1px solid #ccc; border-style: solid; }
#comments_form textarea:focus { border-style: dashed; }

#comments_form .submit { float: right; width: 100px; height: 28px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; border: 1px dashed #ccc; margin: 5px 160px 0 0; padding: 5px; }
#comments_form #submit { float: right; margin: 0 0 0 0; width: 100px; font-weight: bold; color: #000; background: -webkit-gradient( linear, left bottom, left top, color-stop(0.2, rgb(246,178,216)), color-stop(0.75, rgb(250,203,228)) ); background: -moz-linear-gradient( center bottom, rgb(246,178,216) 20%, rgb(250,203,228) 75% ); color: #fff; text-shadow: 1px 1px 1px #999999; filter: dropshadow(color=#999999, offx=1, offy=1); font-size: 14px; padding: 4px 0; }
#comments_form input:hover#submit { background: -webkit-gradient( linear, left bottom, left top, color-stop(0.2, rgb(250,203,228)), color-stop(0.75, rgb(246,178,216)) ); background: -moz-linear-gradient( center bottom, rgb(250,203,228) 20%, rgb(246,178,216) 75% ); color: #fff; text-shadow: 1px 1px 1px #cccccc; }

/* slideshow */
#slideshow { width: 810px; margin-top: 30px; }
#slideshow ul { margin: 0; padding: 0; list-style-type: none; height: 1%;}
#slideshow ul:after { content: "."; clear: both; display: block; height: 0;visibility: hidden;}            
#slideshow .slides { overflow: hidden; width: 550px; }

#slideshow .slides ul { width: 7150px;}
#slideshow .slides li { width: 550px; float: left; height: 640px; }
#slideshow .slides h2 { margin: 0 0 10px 0;}

#slideshow .slides-nav { float: left; background: url(../images/workshops-nav-bg1.png) no-repeat; width: 220px; height: 710px; margin-right: 35px;}
#slideshow .slides li img { text-align: center; }
#slideshow .slides-nav li a { display: block; padding: 11px 0 0 20px ; width: 200px; height: 30px; outline: none;}

#slideshow .slides-nav li.on,
#slideshow .slides-nav li.on { background: url(../images/slidenav-on.png) no-repeat; }

#slideshow .slides-nav li.on { background: url(../images/slidenav-on.png) no-repeat; }


/*** footer ***/
.footer { background: url(../images/stitch-border.gif) top repeat-x; font-size: 10px; padding-top: 5px; height: 50px; }
.footer p { color: #999999; }
.ft-menu { float: left; width: 400px; }
.ft-menu a, .ft-menu a:visited { color: #999999; }
.ft-menu a:hover { color: #999999; }
.copyright { float: right; width: 400px; text-align: right; }
