@charset "UTF-8";
/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework
 *
 * (en) YAML debugging stylesheet
 * (de) YAML Stylesheet zur Fehlersuche
 *
 * Don't make any changes in this file!
 * Your changes should be placed in any css-file in your own stylesheet folder.
 *
 * @note:           Many thanks to Tomas Caspers (http://www.tomascaspers.de/) for contribution
 *
 * @copyright       Copyright 2005-2009, Dirk Jesse
 * @license         CC-A 2.0 (http://creativecommons.org/licenses/by/2.0/),
 *                  YAML-C (http://www.yaml.de/en/license/license-conditions.html)
 * @link            http://www.yaml.de
 * @package         yaml
 * @version         3.1
 * @revision        $Revision: 343 $
 * @lastmodified    $Date: 2009-01-19 23:41:32 +0100 (Mo, 19. Jan 2009) $
 */

@media all
{
  /*------------------------------------------------------------------------------------------------------*/

  /**
   * @section layout preparation for debugging
   * @see http://www.yaml.de/en/documentation/practice/drafting-and-debugging.html
   */

  /* Adding debugging background */
  body { padding-top: 10px !important; background: transparent url("images/grid_pattern.png") top left no-repeat fixed !important; }

  /* CSS-Warning, if core stylesheet 'iehacks.css' is missing in the layout */
  *+html #ie_clearing { display:block; } /* IE7 */
  * html #ie_clearing { display:block; } /* IE 5.x & 6 */

  #ie_clearing {
    width: 500px;
    font-size: 25px;
    position:absolute;
    top: -2px;
    left:0px;
    background: url("images/warning_iehacks.png") top left no-repeat;
  }

  /**
   * @section pixel grid
   */

  .bg_grid {
    background-image:url("images/grid_pattern.png") !important;
    background-repeat:no-repeat;
    background-position:top left !important;
  }

  /**
   * @section transparency
   */

  .transOFF { -moz-opacity: 1.0; opacity: 1.0; filter: alpha(Opacity=100);}
  .trans50,
  .transON { -moz-opacity: 0.5; opacity: 0.5; filter: alpha(Opacity=50);}
  .trans25 { -moz-opacity: 0.25; opacity: 0.25; filter: alpha(Opacity=25);}
  .trans75 { -moz-opacity: 0.75; opacity: 0.75; filter: alpha(Opacity=75);}

  /**
   * @section colors
   */

  .bg_red { background-color: #f00 !important;}
  .bg_blue { background-color: #00f !important;}
  .bg_green { background-color: #0f0 !important;}

  /**
   * @visualize semantic structure
   *
   */

  div[id] { padding: 0 !important; margin: 0 -1px; border: 1px #000 solid !important; }
  div[class] { padding: 0 !important; margin: 0 -1px; border: 1px #000 solid !important; }

  div[id]:before,
  div[class]:before {
   display:block;
  text-align:left;
  color: #fff;
  padding: 2px;
  font: normal 11px "Lucida console", monospace;
  }

  div[id]:before {
  background:  #800;
  content: "[div id='"attr(id)"']";
  }

  div[class]:before {
  background:  #a44;
  content: "[div class='"attr(class)"']";
  }

  div[id][class]:before {
  background:  #800;
  content: "[div id='"attr(id)"' class='"attr(class)"']";
  }


  div[class="floatbox"] { background: #f4f4f4; }
  div[class="floatbox"]:before {
   display:block;
  color: #fff;
  padding: 2px;
  font: normal 11px "Lucida console", monospace;
  background:  #66a;
  content: "[div class='"attr(class)"']";
  }

  div[class="subcolumns"] { background: #f8f8f8; color: #000 !important; }
  div[class="subcolumns"]:before {
   display:block;
  color: #fff;
  padding: 2px;
  font: normal 11px "Lucida console", monospace;
  background:  #444;
  content: "[div ."attr(class)"]";
  }

  div[class="subcolumns"] > div:before {
   display:block;
  color: #fff;
  padding: 2px;
  font: normal 11px "Lucida console", monospace;
  background:  #080;
  content: "[div ."attr(class)"]";
  }

  div[class="subc"], div[class="subcl"], div[class="subcr"] { background: #eee; }
  div[class="subc"]:before, div[class="subcl"]:before, div[class="subcr"]:before {
   display:block;
  color: #fff;
  padding: 2px;
  font: normal 11px "Lucida console", monospace;
  background: #6a6;
  content: "[div ."attr(class)"]";
  }

  h1:before  { content: "[h1] "; }
  h2:before  { content: "[h2] "; }
  h3:before  { content: "[h3] "; }
  h4:before  { content: "[h4] "; }
  h5:before  { content: "[h5] "; }
  h6:before  { content: "[h6] "; }


  /* make link attributes href,title visible on hover ... */
  a:hover { color: #fff !important; background: #337; text-align: left;}
  a:hover:after { color: #fff; background: #333; content: " (href='" attr(href) "' title='"attr(title)"')"; text-align: left; }

  a[class="skip"] {  }

  a[id="navigation"]:before,
  a[id="content"]:before { font: normal 11px "Lucida console", monospace; content: "[skip anchor: "attr(id)"]"; padding: 2px !important; }

  a[id="content"]:hover,
  a[id="navigation"]:hover { background: #ff0; color: #000; }

  a[id="content"]:hover:after,
  a[id="navigation"]:hover:after { content: ""; background: inherit; color: #000; }

  img:after  { font: normal 11px "Lucida console", monospace; content:" ( alt='" attr(alt)"' ) "; }

  address, blockquote, dl, fieldset, form, h1, h2, h3, h4, ol, p, pre, ul  {
  border:  1px dotted #888;
  margin: 2px;
  padding: 2px;
  display: block;
  }

 /* Highlighting empty elements */
 div:empty, span:empty, p:empty, a:empty, td:empty, th:empty, li:empty,
 b:empty, i:empty, em:empty {padding: 2px 4px; background: yellow;}

 /* Highlighting inline-Styles */
 *[style] {outline: 3px solid #f0f;}
 *[style]:after { font: normal 11px "Lucida console", monospace; background: #f0f; color: #000; height: auto; visibility:visible; content: "Element contains inline styles!" !important; }

  /**
   * @visualize inline elements
   *
   */

  abbr, acronym  { background: #d9eaff; }
  q, cite, dfn, kbd  { background: #ffe3f6; }
  /* :lang(de), :lang(en), :lang(fr), :lang(es) { background: #d9efaa !important; } */

}