/*
	Title:		KashaNasha Site
	Author:		Jochem van Grondelle
	Website:	http://www.thatsconsulting.com


================================
COMMON STYLES 
================================*/

.left { float: left; }

.right { float: right; clear:right; }

.hide, .printonly { display: none;  }

.pointer { cursor: pointer; }

.clearBoth { clear: both; }
 .clearboth { clear: both; display: block; line-height:0;  height: 0; visibility: hidden; }
 

.clearfix:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; }

.clearfix { display: inline-block; position: relative }

a:active { outline: none; }

a:focus { outline: none; }

hr {border:0; border-top: solid 1px #245267}

/*
================================
MAIN STYLES
================================*/
a { color: #DD660A;font-weight:bold; text-decoration: none; }
a:hover {text-decoration:underline}

html { background-color: #000; color: #FBF7D4; height: 100%; margin: 0; padding: 0; }

body { background-color: #000; color: #FBF7D4; height: 100%; margin: 0; padding: 0; font-family: Bookman Old Style, Cooper Black, Cooper, Times New Roman, Serif; }

.fullwidth { margin: 0 auto; position: relative; }

.contentwidth { margin: 0 auto; position: relative; width: 797px; }

#bodyborder { background: #000 url(/images/borders/content2.gif) no-repeat scroll center top; height: 491px; margin: 0 auto; position: relative; width: 813px; }

#grass {position:absolute; background: transparent url(/images/textures/Grass.png) no-repeat scroll center bottom; height: 53px; width:797px; z-index: 10000; left:8px;top:434px }

#body { background-color: #000; height: 487px; margin-bottom: 70px; z-index: 1; }

/*
================================
HEADER STYLES 
================================*/
#headerborder { background: #000 url(/images/borders/line.gif) repeat-y scroll center top; height: auto; margin: 0 auto; position: relative; width: 813px; }

#header { margin: 0 auto; position: relative; width: 797px; background-color: #000; border-bottom: 0; border-top: 0; height: 107px; }

#subheader { padding-bottom: 50px; }

#subheader h2 { color: #FF152B; font-size: 250%; font-weight: bold; letter-spacing: 2px; text-align: center; text-shadow: 2px 2px 2px #000 }


#ruler { background: #000 url(/images/textures/colourbeam_dynamic.png) no-repeat scroll top center; border: 0; height: 5px;padding:0; margin: 0 auto; width: 1280px; }

#header h1 { font-size: 200%; font-weight: bold; }
#imageContainer { display: block; height: 107px; width: 797px; }
#header h1 a img { display: block; height: 107px; width: 797px; }

#header .headerLinks { font-size: 12px; text-align: right; width: 360px; }

#header .headerLinks a { margin: 3px 0 0; }

#header .searchBox { margin: 0 0 0 33px; }

#header .searchBox input { border: 2px solid #515151; font-size: 10px; height: 14px; padding: 1px 2px; width: 102px; }

#header .searchBox input:focus { border: 2px solid #619ca7; }

#header .searchBox button { border-color: inherit; border-style: none; border-width: medium; font-size: 12px; padding: 0 7px 0 0; }

/*
================================
SIDEBAR STYLES 
================================*/
#sideBar { color: #FBF7D4; font-family: Verdana, Unico Sans, Unico Sans Unicode, Geneva, Sans-Serif; font-size: 14px; margin: 0 30px 0 0; width: 125px; }
#sideBar a {color: #FBF7D4; font-weight:normal}

/*
================================
NAVI STYLES 
================================*/
#navi { border-top: solid 2px #FF152B; }

#navi a:hover { text-decoration: underline; }

#extra a:hover { text-decoration: underline; }

#navi li.selected a:hover { cursor: default; text-decoration: none; }

#navi li { border-bottom: solid 2px #FF152B; text-transform: uppercase; }

#navi li.selected a { font-weight: bold; }

#navi li a { display: block; padding: 10px 0 10px 10px; }

#navi-bottom { bottom: -20px; font-size: 9px; margin-right: 10px; position: absolute; width: 140px; }

#extra li a { display: block; padding: 5px 0 5px 10px; text-transform: uppercase; }

#copyright { color: #fff; font-size: 11px; padding-left: 10px; padding-top: 5px; }

/*
================================
CONTENT STYLES 
================================*/
.content { font-size: 16px; line-height: 20px;  }
#contentdiv {display:block; width: 632px; overflow: auto; height:320px; padding-bottom: 20px; position:relative; padding-right: 10px;    }



.content ul, .content ol, .content li, .content p {margin-bottom: 10px}

.content strong { font-weight: bold; }

.content em { font-style: italic; }

.content h3 { font-family: Cooper Black,Cooper,Serif; font-size: 20px; font-weight: bold; margin-bottom: 10px; }
.content h4 { font-weight: bold; }

.content ol { list-style-position: inside; list-style-type: decimal; }

.content ul { list-style-position: inside; list-style-type: disc; }
.content img {margin-right:10px; margin-left:10px}




/*
================================
SUBNAVI STYLES 
================================*/
ul.subnavi { list-style-type:none; margin-top: -13px}
ul.subnavi a {display:block; font-weight:normal; font-size: 16px; margin-bottom: 20px; margin-top: 20px;}
ul.subnavi li.selected a {font-weight:bold}
ul.subnavi, ul.subnavi a, ul.subnavi li {list-style-position:outside}

.twoCol .subnavicol { float:left; width: 100px; padding-bottom:30px }
.twoCol .subnavicontentcol { float:right; width: 500px; padding-bottom:30px; clear:right;}
/*
================================
HOMEPAGE TWO COLS
================================*/
.onecol, .twoCol {height:390px; width: auto}
.oneCol .col_1 { padding-bottom:30px}
.twoCol .col_1 { float: left; width: 200px;  padding-bottom:30px}

.twoCol .col_2 { float: right; width: 400px; padding-bottom:30px; clear:right; }

/*
================================
GALLERY GRID
================================*/
.galleryGrid { margin: 25px 0 0; }

.galleryGrid .item { margin: 0 0 15px 20px; width: 208px; }

.galleryGrid .item.first { margin-left: 0; }

.galleryGrid .item a { padding: 0 7px 0 0; }

.galleryGrid .item img { display: block; }

.galleryGrid .item span { display: block; }

/*
================================
PHOTO GRID
================================*/
.photoGrid { margin: 25px 0 0; }

.photoGrid .item { margin: 0 0 15px 20px; width: 151px; }

.photoGrid .item.first { margin-left: 0; }

.photoGrid .item a { padding: 0 7px 0 0; }

.photoGrid .item img { display: block; }

.photoGrid .item span { display: block; }

/*
================================
PHOTO ITEM
================================*/
.photo { margin: 25px 0 0; }

.photo .pager { display: block; margin: 0 0 10px; }

.photo a.prev { padding: 0 0 0 7px; }

.photo a.next { padding: 0 7px 0 0; }

.photo .item { overflow: hidden; position: relative; }

.photo .item span { bottom: 0; display: none; left: 0; padding: 10px 5px; position: absolute; width: 100%; }

/*
================================
NEWS LIST
================================*/
.newsList { margin: 25px 0 0; width: 630px; }

.newsList div { display: inline; margin: 0 0 25px 45px; width: 180px; }

.newsList div.first { margin-left: 0; }

.newsList div span { font-size: 11px; font-weight: bold; }

/*
================================
NEWS ITEM
================================*/
.newsItem img { margin: 0 0 15px; }

/*
================================
CONTACT STYLES
================================*/
.form .text { margin: 0 10px 0 0; width: 265px; }

.form .fields { width: 265px; }

fieldset legend { display: none; }

fieldset label { display: block; margin: 10px 0 0; }

fieldset label.first { margin: 0; }

fieldset input { border: 2px solid #515151; font-size: 14px; height: 17px; margin: 0 0 3px; padding: 2px; width: 265px; }

fieldset textarea { border: 2px solid #515151; font-size: 14px; height: 130px; margin: 0 0 3px; padding: 2px 2px 1px; width: 265px; }

fieldset input:focus { border: 2px solid #619ca7; }

fieldset textarea:focus { border: 2px solid #619ca7; }

fieldset input.error { border: 2px solid #F49AC1; }

fieldset textarea.error { border: 2px solid #F49AC1; }

fieldset input.error:focus { border: 2px solid #af4975; }

fieldset button { border: none; margin: 10px 0; padding: 0 7px 0 0; }

/* big background images */

/*.background1 { background: #000 url(/images/background/header.png) no-repeat scroll top center; }
.background2 { background: #000 url(/images/background/header2-x.png) no-repeat scroll top center; }*/
#body { background: #000 url(/images/background/background.jpg) no-repeat scroll top left; height: 487px; margin-bottom: 70px; z-index: 1; }

#preloadimages, #preloadimages * { height: 0; overflow: hidden; }

#debug { background-color: White; color: Black; width: 100%; height: auto; position: absolute; bottom: 0; }
#debug a { color: Black; }
#debug ul { list-style-type: square; padding-left: 20px; }
#debug ul li { float: left; padding-right: 20px; }


#imageContainer img { display: none; position: absolute; top: 0; left: 0; }


/*================================
COMMON STYLES 
================================*/
ul.guestbook {width:100%}
ul.guestbook li {list-style-type: none; overflow:hidden; width:250px; padding: 5px; margin-right:20px; display:block; float:left; border-style: solid; border-width: 2px; border-color:#245267; padding-top: 10px; }
ul.guestbook li dl dt {font-weight:bold;}

ul.speellijst {width:100%}
ul.speellijst li {list-style-type: none; overflow:hidden; width:40%; padding: 10px; margin-right:20px; display:block; float:left; border-style: solid; border-width: 2px; border-color:#245267; padding-top: 10px; }
ul.speellijst li dl dt {font-weight:bold;}

dl.optreden {list-style-type: none; overflow:hidden; display:block; margin-bottom:10px }
dl.optreden dt {font-weight:bold;}


ul.photos {list-style-type:none !important}


/*================================
SCROLL STYLES 
================================*/

/* Scroll Bar Master Styling Starts Here */
/* All comments can be freely removed from the css */

/*  scrollgeneric is used for corrective styling of elements, and should not be modified or removed */ 
.scrollgeneric {
line-height: 1px;
font-size: 1px;
position: absolute;
top: 0; left: 0;
}

.vscrollerbase {
width:22px;
background-image: url(/images/scollerbase.png);
  background-repeat: repeat-y;
}
.vscrollerbar {
background-image: url(/images/scrollbar.png);
background-repeat: none;
width: 22px;
/* following is the bit that allows us fixed height scrollbars */
height: 52px !important;
z-index: 999;

/* for fixed height, we force the vscrollerbar class with an !important decleration, and fleXcroll follows suit.*/


/* unfortunately, due to limitations of CSS, we cannot provide a color for the background when we are
using alpha images, thay have to be transparent.*/
}

* html .vscrollerbar {
/* IE6 alpha png trick */
/* IE7 is not affected by this trick, as it perfectly handles the normal png */
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop src='/images/scrollbar.png');
background-image: none;
}


/* do not forget to give horizontal scrollbars some color properties even if you don't plan on using them */
.hscrollerbase {height: 22px;}
.hscrollerbar {height: 22px; background-color: #84ADD6;}

.vscrollerbar, .hscrollerbar {
/* paddings of these elements will decide how far the scrollbar will stop in both ends, and are not actually
used for styling, and are set to 0 by the script, here we will set them the size of our faux arrows */
padding: 0px;
z-index: 2;
}

/* properties for scroller jog box, just in case */
.scrollerjogbox {
width: 22px;
height: 22px;
top: auto; left: auto;
bottom: 0px; right: 0px;
background: #698AAA;
}


/* Scroll Bar Master Styling Ends Here */



/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */