/*

  GENERAL INFO
  Site:       http://
  Version:    2009.04
  Author:     Amsterdam Hotsprings
  Email:      webmaster@amsterdamhotsprings.com
  Website:    www.amsterdamhotsprings.com

  INDEX
  1. reset
  2. general
  3. text markup
     3.1 headings
	 3.2 text elements
	 3.3 lists
	 3.4 table
	 3.5 misc classes
  4. forms
  5. alignment
     5.1 general
	 5.2 images
	 5.3 floats
	 5.4 columns
  6. layout
     6.1 general
	 6.2 header
	 6.3 navigation
	     6.3.1 main-navigation
		 6.3.2 sub-navigation
	 6.4 body
	     6.4.1 main content
		 6.4.2 DLSidebar
	 6.5 footer
	 6.6 bottom
  7. thumbnails
  8. box
  9. separators
  10. misc overriding classes
  
  NOTES
  
  SHORTHANDS
  ********************************************************************
  background: color image repeat position attachment;
  background: #fff url(image.png)no-repeat 20px 100px fixed;
  background: red url(image.png) repeat top left scroll;
  
  font: style variant weight size line-height family;
  font: italic small-caps bold 1.2em/1.5em Arial, Georgia, "Times New Roman"
  
  border: width style color;
  border: 1px solid #0000;
  
  margin: 10px;               *** een marge van 10px rondom ***
  margin: 5px 10px;           *** 5px marge voor de top en bottom en 10px marge voor links en rechts ***
  margin: 10px 20px 30px      *** 10px marge top, 20px marge links en rechts, 30px marge bottom ***
  margin: 5px 10px 15px 20px  *** 5px marge top, 10px marge rechts, 15px marge bottom, 20px marge links ***
  
  outline: width style color;
  outline: 5px dotted #foo;
  
  list-style: type position image;
  liste-style: disc outside none;

*/

/*********************************************************************
* 1. reset                                                         *
*********************************************************************/

  html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, textarea, input, select {margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;}
  table {border-collapse: collapse; border-spacing: 0;}
  caption, th, td {text-align: left; font-weight: normal;}
  table, td, th {vertical-align: middle;}
  blockquote:before, blockquote:after, q:before, q:after {content: "";}
  blockquote, q {quotes: "" "";}
  a img {border: none;}
  :focus {outline: 0; }

/*********************************************************************
* 2. general                                                         *
*********************************************************************/

  * {
    margin: 0;
    padding: 0;
  }
 
  html {
    height: 100%;
    padding-bottom: 1px; /* force scrollbars */
  }

  body {
    background: #e9e9e9;
    color: #000;
    font: normal 62.5% Arial;
    line-height: 1.5;
  }

/*********************************************************************
* 3. text markup                                                     *
*********************************************************************/

/**********************************
* 3.1 headings                    *
**********************************/

  h1, h2, h3, h4, h5, h6 {
    color: #0062ac;
	font-weight: normal;
	line-height: 1;
	margin-bottom: 0.5em;
  }

  h4, h5, h6 { font-weight: bold; }
  
  h1 { font-size: 1.8em }
  h2 { font-size: 1.6em }
  h3 { font-size: 1.4em }
  h4 { font-size: 1.25em }
  h5 { font-size: 1.1em }
  h6 { font-size: 1em }

  h1 im,g, h2 img, h3 img, h4 img, h5 img, h6 img { margin: 0; }
  
/**********************************
* 3.2 text elements               *
**********************************/

  p { margin-bottom: 2em; font-size: 1.1em;}
 
  a:focus, a:hover{ color: #0062ac; text-decoration:none; }
  
  a {
    color: #0062ac;
	text-decoration: underline;
  }

  abbr, acronym {border-bottom: 1px dotted #666;}
  address {margin-bottom: 1.5em;}
  blockquote {margin: 1.2em; line-height: 1.4em;}
  blockquote span {font-size: 1.4em; color: #000;}
  del {color:#666;}
  em, dfn, blockquote, address {font-style: italic;}
  strong, dfn {font-weight: bold;}
  sup, sub {line-height: 0;}
  cite {color: #666;}

  pre {
    margin: 1.5em 0;
    white-space: pre;
  }

  pre,code,tt {
    font: 1em monospace;
    line-height: 1.5;
  }

/**********************************
* 3.3 lists                       *
**********************************/

  li ul, li ol {margin-left: 1.5em;}
  ul, ol {margin: 0 1.5em 1.5em 1.5em;}

  ul {list-style-type: disc;}
  ol {list-style-type: decimal;}

  dl {margin: 0 0 1.5em 0;}
  dl dt {font-weight: bold;}
  dd {margin-left: 1.5em;}

/**********************************
* 3.4 tables                      *
**********************************/

  table {margin-bottom: 1.4em; width: 100%; font-size: 1em;}
  th {font-weight: bold;}
  thead th {background: #C3D9FF;}
  th,td,caption {}
  tr.even td {background: #F2F6FA;}
  tfoot {font-style: italic;}
  caption {background: #EEE;}

  table.data-table {
    border: 1px solid #EEE;
    margin-bottom: 2em;
    width: 100%;
  }
  
  table.data-table th {
    background: #EEE;
    border: 1px solid #DDD;
    color: #555;
    text-align: left;
  }
  
  table.data-table tr {border-bottom: 1px solid #EEE;}
  table.data-table td, table th {padding: 8px 10px;}
  table.data-table td {
    background: #F6F6F6;
    border: 1px solid #E6E6E6;
  }

  table.data-table tr.even td {background: #FCFCFC;}

/**********************************
* 3.5 misc classes                *
**********************************/

  .small {font-size: 0.9em;}
  .smaller {font-size: 0.8em;}
  .smallest {font-size: 0.7em;}

  .large {font-size: 1.1em;}
  .larger {font-size: 1.5em;}
  .largest {font-size: 2em;}

  .hidden {display: none;}

  .quiet {color: #666;}
  .loud {color: #000;}
  .highlight {background: #FF0;}

  .text-left {text-align: left;}
  .text-right {text-align: right;}
  .text-center {text-align: center;}

  .error, .notice, .success {
    border: 1px solid #DDD;
    margin: 5px 0 0 0;
    padding: 4px 5px;
  }

  .error {background: #FBE3E4; color: #8A1F11; border-color: #FBC2C4;}
  .error a {color: #8A1F11;}
  
  .errorTekst{color: #f00; font-weight:bold;}

  .notice {background: #FFF6BF; color: #514721; border-color: #FFD324;}
  .notice a {color: #514721;}

  .success {background: #E6EFC2; color: #264409; border-color: #C6D880;}
  .success a {color: #264409;}

  div.more {padding-top: 6px;}
  .more a, a.more {color: #666;}
  .more a:hover, a.more:hover {color: #002;}

/*********************************************************************
* 4. forms                                                           *
*********************************************************************/

  label {font-weight: bold; cursor: pointer;}
  fieldset {padding: 1.4em; margin: 0 0 1.5em 0; border: 1px solid #DDD; background: #F6F6F6;}
  legend {font-weight: bold; font-size: 1.2em;}
  textarea {overflow: auto;}
  input, textarea, select {
    background: #FCFCFC;
    border: 1px solid #ccc;
    margin: 5px 0 0 0;
    padding: 4px 5px;
	width: 250px;
  }
  
  input.small{width: 25px;}
  
  input.radio, input.checkbox{width:20px;}

  input.text:focus, textarea:focus, select:focus {background: #FFFFF5;}

  input.button {
width: 262px; color:#fff; background-color: #0062ac;   }

  input.button:active {border-style: inset;}

  .form-error {border-color: #F00;}

/*********************************************************************
* 5. alignment                                                       *
*********************************************************************/

/**********************************
* 5.1 general                     *
**********************************/

  .center,.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }

/**********************************
* 5.2 images                      *
**********************************/

  img.bordered,img.alignleft,img.alignright,img.aligncenter {
    background-color: #FFF;
    border: 1px solid #DDD;
    padding: 3px;
  }

  img.alignleft, img.left {margin: 0 1.5em 1em 0;}
  img.alignright, img.right {margin: 0 0 1em 1.5em;}
  
  .afbeeldingMasker{ margin-top: -204px;}


/**********************************
* 5.3 floats                      *
**********************************/

  .left,.alignleft {float: left;}
  .right,.alignright {float: right;}

  .clear,.clearer {clear: both;}
  .clearer {
    display: block;
    font-size: 0;
    line-height: 0;	
  }

/**********************************
* 5.4 columns                     *
**********************************/

  .col1 {width: 640px; height: 200px; background: url(../images/templateimages/col1-bg.gif); float: left; margin: 20px;}
  .col1 .content2 {width: 300px; float: right; padding: 20px 40px; color: #fff;}
  .col2 {width: 180px; float: left; margin: 20px;}
  .col3 {width: 260px; float: left; margin: 20px;}
  .col4 {width: 340px; float: left; margin: 20px;}


/*********************************************************************
* 6. lay-out                                                         *
*********************************************************************/

/**********************************
* 6.1 general                      *
**********************************/

  #MainContain, .DLCenterContain {
  width: 960px;
  margin: 0 auto;
  }

/**********************************
* 6.2 header                      *
**********************************/

  #Header {padding: 20px 10px;}

  #Logo{height: 80px; width: 220px; float: left;}
  #Banner{float: right; width:392px; height: 72px;}
  #SiteTitle a{}
  #SiteTitle, #DLSiteTitle a{}
  #SiteSlogan{}

/**********************************
* 6.3 navigation                  *
**********************************/

  ul.tabbed {
    display: inline;
    margin: 0;
    padding: 0;
  }

  ul.tabbed li {
    float: left;
    list-style: none;
  }

  ul.tabbed a {text-decoration: none;}

/**********************************
* 6.3.1 main-navigation           *
**********************************/
  
  #Navigation {background: url(../images/templateimages/menu-bg.gif) no-repeat bottom; padding: 0 4px; width: 952px; height: 32px;  }

  #Navigation a, #Navigation a.FirstButton {
    color: #FFF;
    display: block;
    font-size: 1.1em;
	font-weight: bold;
	width: 118px;
	height: 23px;
	background: url(../images/templateimages/menu-tab.gif);
	text-align: center;
	padding-top: 9px;
	margin-right: 1px;
  }
  
  #Navigation a:hover { background: url(../images/templateimages/menu-tab-over.gif); color: #0062ac;}
  #Navigation a.FirstButton:hover{background: url(../images/templateimages/menu-tab-over-first.gif);}
  #Navigation a.LastButton:hover{background: url(../images/templateimages/menu-tab-over-last.gif);}

  #Navigation li.current_page_item a {background: url(../images/templateimages/menu-tab-over.gif); color: #0062ac;}
  #Navigation li.current_page_item_first a {background: url(../images/templateimages/menu-tab-over-first.gif); color: #0062ac;}
  #Navigation li.current_page_item_last a {background: url(../images/templateimages/menu-tab-over-last.gif); color: #0062ac;}

/**********************************
* 6.3.2 sub-navigation            *
**********************************/

  #Subnavigation { background: url(../images/templateimages/submenu-bg.gif); height:37px; padding: 12px 0 0 40px;}

  #Subnavigation a {
    color: #0062ac;
    display: block;
    font: bold 1.3em arial;
	padding: 0 7px;
  }
  #Subnavigation a:hover {color: #999;}
  #Subnavigation li.current_page_item a {text-decoration: underline;}

/**********************************
* 6.4 body                        *
**********************************/

  .DLBodyContent{font-size: 1.1em;}
  #DLBodyContentContain{background: url(../images/templateimages/content-bg.gif) repeat-y center top; padding: 0 30px;}
  .DLBodyContent#DLBodyContentTwoColumns {background: url(../images/pageparts/content-two-columns.gif) repeat-y right top;}

/**********************************
* 6.4.1 main content              *
**********************************/

#ContentGroot{width: 840px; padding: 20px; font-size:1.1em;}
#Content {    float: right;
    width: 560px;
	font-size: 1.1em;
	margin: 20px;
}
#Content ul {font-size: 1.1em; list-style-image:url(../images/templateimages/list.gif);}
#Content strong{color:#0062ac;}


  #Content .text-separator{
    color: #AAA;
    padding: 0 5px;
  }

/**********************************
* 6.4.2 DLSidebar left              *
**********************************/

  #SidebarLeft {
    float: left;
    width: 260px;
    height: 100%;
	margin: 20px;
  }

/**********************************
* 6.4.3 DLSidebar right             *
**********************************/

  #SidebarContainRight {
    float: right;
    width: 260px;
  }

/**********************************
* 6.6 footer                      *
**********************************/

  #Footer { background:url(../images/templateimages/footer-bg.gif); height: 20px; }
  #DLFooter a {
    color: #DDD;
    text-decoration: none;
  }
  #DLFooter a:hover {color: #FFF;}
  #DLFooter span.text-separator {
    color: #999;
    padding: 0 3px;
  }

/**********************************
* 6.7 bottom                      *
**********************************/

#DLBottom {
	color: #666;
	padding: 0 6px 12px;
	margin-top: -6px;
}
#DLBottom a {
	color: #555;
	text-decoration: none;
}
#DLBottom a:hover, #DLBottom .right a:hover {color: #002;}
#DLBottom span.text-separator {
	color: #888;
	padding: 0 3px;
}
#DLBottom .right, #bottom .right a {color: #777;}

/*********************************************************************
* 7. thumbnails                                                      *
*********************************************************************/

  .thumbnail {border: 1px solid #ccc; padding: 1px; height: 90px; width: 90px; float: left; margin: 20px 20px 0 0;}
  .thumbnails a.thumb {	
    background: #DAD6D0;
    display: block;
    float: left;
    margin: 0 0 8px 8px;
    padding: 1px;
  }
  .thumbnails a.thumb:hover {background: #AAA;}
  .thumb{border: 1px solid #ccc; padding: 1px;}


/*********************************************************************
* 8. box                                                             *
*********************************************************************/

  .box1 {
    background: url(../images/templateimages/box1.gif) no-repeat left top;
    padding: 0;
	margin-bottom: 40px;
	width: 260px;
	height: 112px;
	color: #fff;
	font-size: 1.1em;
	padding: 10px 20px;
  }
  
  .box1 a{color:#fff; text-decoration: none;}
  .box1 a:hover{color:#fff; text-decoration: underline;}

  .box2 {
    background: url(../images/templateimages/box-small.gif) no-repeat left top;
    padding: 20px 0;
	margin-bottom: 20px;
	width: 120px;
	height: 82px;
	margin-right:20px;
	float: left;
  }


  .box a {color: #951;}
  .box a:hover {color: #310;}
  .box-title-small { color: #fff; background: url(../images/templateimages/titel-small.gif); width: 160px; height: 16px; font-size: 1.1em; font-weight: bold; padding: 2px 10px; }
  .box-title-medium { color: #fff; background: url(../images/templateimages/titel-medium.gif); width: 320px; height: 16px; font-size: 1.1em; font-weight: bold; padding: 2px 10px;  }
  .box-content {padding: 5px 10px; font-size: 1.1em;}

/*********************************************************************
* 9. separators                                                      *
*********************************************************************/

  .content-separator, .archive-separator {
    background: #EEE;
    clear: both;
    color: #FFE;
    display: block;
    font-size: 0;
    height: 1px;
    line-height: 0;
    margin: 12px 0 24px;
  }

  .archive-separator {margin: 0 0 14px;}

  .separator-vertical {background: url('img/separator-vertical.gif') repeat-y center top;}


/*********************************************************************
* 10. misc overriding classes                                        *
*********************************************************************/

/**********************************
* 10.1 borders                    *
**********************************/

.noborder {border: 0;}
.notborder {border-top: 0;}
.norborder {border-right: 0;}
.nobborder {border-bottom: 0;}
.nolborder {border-left: 0;}

/**********************************
* 10.2 margins                    *
**********************************/

.nomargin {margin: 0;}
.notmargin {margin-top: 0;}
.normargin {margin-right: 0;}
.nobmargin {margin-bottom: 0;}
.nolmargin {margin-left: 0;}

/**********************************
* 10.3 paddings                   *
**********************************/

.nopadding {padding: 0;}
.notpadding {padding-top: 0;}
.norpadding {padding-right: 0;}
.nobpadding {padding-bottom: 0;}
.nolpadding {padding-left: 0;}




/*********************************************************************
* 11. posts                                                           *
*********************************************************************/

  .post {margin: 10px 0 10px 0; border-bottom: 1px solid #ccc; width: auto; height: 70px; padding-bottom: 10px; font-size: 1.1em; }

  .post a {text-decoration: none; color: #000;}
  .post a:hover, .post-body a {text-decoration: underline; color:#0062ac;}

  .post-title {border-bottom: 1px solid #E5E5E5;}

  .post-date {
    color: #777;
    font-size: 0.9em;
    padding: 8px 0 0;
  }

  .post-date a {color: #444;}

  .post-body {padding-top: 12px;}

  .post-meta {
    background: #FCFCFC;
    border: 1px solid #ECECEC;
    color: #777;
    font-size: 0.9em;
    padding: 6px 10px;
  }

  .post-meta a {color: #345; }
  .post-meta a:hover {color: #001;}

  ul.nice-list {
    border-top: 1px solid #F0F0F0;
    margin-left: 0;
    margin-right: 0;
  }

  ul.nice-list li {
    border-bottom: 1px solid #F0F0F0;
    list-style: none;
    padding: 6px 5px;
  }

  ul.nice-list li a {text-decoration: none;}
  ul.nice-list li a:hover {text-decoration: underline;}
  ul.nice-list span {color: #666;}

  #DLSidebar ul.nice-list li,#DLSidebar ul.nice-list {border-color: #E0E0E0;}


/**********************************
* 11.1 archives                   *
**********************************/
  .archive-pagination {margin-bottom: 1.6em;}
  .archive-pagination a {text-decoration: none;}
  .archive-pagination a:hover {text-decoration: underline;}
  .archive-post {margin-bottom: 14px;}
  .archive-post-date {
    background: #F5F5F5;
    border-bottom: 1px solid #C5C5C5;
    border-right: 1px solid #CFCFCF;
    float: left;
    margin-right: 12px;
    padding: 2px 0 5px;
    text-align: center;
    width: 46px;
  }
  .archive-post .post-date {
    border: none;
    padding: 0;
  }
  .archive-post-day {font: normal 1.6em Georgia,serif;}
  .archive-post .post-date,.archive-post-title {padding-top: 3px;} 

/*********************************************************************
* 12. comments                                                       *
*********************************************************************/

  div.comment-list {
    border-top: 1px solid #EEE; 
    margin: 1em 0 2em;
  }

  .comment {
    border-bottom: 1px solid #EEE;
    padding: 10px 8px 0;
  }
  .comment-date {font-size: 0.9em;}
  .comment-date a {
    color: #567;
    text-decoration: none;
  }
  .comment-date a:hover {
    color: #001;
    text-decoration: underline;
  }
  .comment-body {padding-top: 4px;}

  .comment-gravatar {width: 48px;}
  .comment-gravatar img {
    background: #FFF;
    border: 1px solid #DDD;
    padding: 2px;
  }



