@charset "UTF-8";
/**
 * YAML Builder 
 * A tool for visual layout development of YAML based CSS layouts
 *
 * Construction View Styles
 *
 * @copyright       Copyright 2007, Dirk Jesse
 * @link            http://builder.yaml.de
 * @revision        $Revision: 107 $
 * @lastmodified    $Date: 2007-08-01 18:27:14 +0200 (Mi, 01 Aug 2007) $
 */

@media all
{
/** 
 * section construction element definition
 *
 * defines all classes and id's that are used in 'construction view'
 */
 
  /* This class makes editable elements visible */
  .yb_wrapper { 
    position: relative;
    min-height: 4em; 

    border-style: dotted;
    border-color: #bbb;
    border-width: 1px; 
    border-top-width: 0px;
    background: transparent; 
  }

  /* add background grid to subtemplate width containers */
  .subcolumns > div > .yb_wrapper {background: transparent url("../../yaml/debug/images/grid_pattern.png") top left !important;}

  /* inline context menu */
  div.yb_menu {
    display:block; 
    width: 100%; 
    overflow:hidden;
    font-size: 10px;
    background:#ccc; 
    color:#fff; 
	background: transparent url(../images/bg_trans10.png);
  }

  .yb_content { width:100%; position:relative; overflow:hidden; }
  .yb_content a.remove_container { display:none }
  .yb_content:hover a.remove_container { display:block; position:absolute; top:0.2em; right:0.2em; opacity: 0.5; filter: alpha(Opacity=50);}
  .yb_content:hover a.remove_container:hover {opacity: 1; filter: alpha(Opacity=100);}
  .yb_hover { background: transparent url(../images/bg_trans10.png); }

  .subcolumns > div.yb_menu { background: transparent url(../images/bg_trans50.png);}
  .subcolumns > div > div > div.yb_menu { background: transparent url(../images/bg_trans30.png);}
    
  /* standard link definition for context menu */
  div.yb_menu a {
    display:block;
    color:#fff !important; 
    line-height: 1.5em;
    font-size: 10px; 
    font-weight: normal;
    padding: 2px 4px;
    margin: 0;
  }	

  /* button positioning in context menu */
  a.add_content, a.close { float:left; }
  a.flush_content, a.remove_container, a.autocomplete { float:right; display:block }

  html body div.yb_menu a.add_content,
  html body div.yb_menu a.close { border-right: 1px #eee solid !important; }

  html body div.yb_menu a.add_content:hover {background:#6a6 !important;}
  html body div.yb_menu a.close:hover {background:#a66 !important;}

  html body div.yb_menu a.flush_content { border-left: 1px #eee solid !important; }
  html body div.yb_menu a.flush_content:hover {background:#888 !important;}

  html body div.yb_menu a.remove_container:hover {background:#a66 !important;}

  html body div.yb_menu a.autocomplete { background:#6a6 !important; }
  html body div.yb_menu a.autocomplete:hover {background:#080 !important;}

  /* dropzone status */
  .page_margins .dropzone {border: #f93 2px dashed !important; background-position: -1px -2px !important;}	
  .page_margins .dropzoneactive { border: #f63 2px solid !important; ; background-position: -1px -2px !important;}	
  .page_margins .dropzonehover { opacity: 0.5; filter: alpha(Opacity=50); background: #f88; background-position: -1px -2px !important;}	

/**
 * section layout adjustment 
 *
 * defines paddings/margins/borders of basic layout elements in construction view
 */

  #topnav {padding: 5px;top:0;right:0;}
  #main #col1 .yb_wrapper,
  #main #col2 .yb_wrapper,
  #main #col3 .yb_wrapper { min-height: 320px; }
  #main .yb_wrapper, #teaser .yb_wrapper { min-height: 120px; }
  .subcolumns .yb_wrapper { min-height: 100px !important; background-image: none;}

  #nav, #nav * {background-color: transparent; background-image:none;}
  #nav { overflow:hidden; }
  #nav * { border: 0px none !important; }
  #nav li {opacity: 0.5; filter: alpha(Opacity=50)}
  
  .subc > .yb_wrapper {border-width: 0 1px 1px 1px;}
  .subcr > .yb_wrapper, .subcl .subcr > .yb_wrapper, .subc .subcr > .yb_wrapper {border-width: 0 0 1px 1px;}
  .subcl > .yb_wrapper, .subcr .subcl > .yb_wrapper, .subc .subcl > .yb_wrapper {border-width: 0 1px 1px 0;}

  #footer .yb_wrapper a { font-weight: normal }
/** 
 * section color scheme
 *
 * defines all colors of the basic layout elements in construction view
 */
  
  #header {background-color: #f6f6f6 !important;}
  #topnav {background-color: #ececec;}
  #nav {background-color: #ececec !important;}
  #nav .hlist {background-color: transparent !important;}
  #nav li.active { background: #666; }
  #main   {background-color: #fff;}
  #col1   {background-color: #fee;}
  #col2   {background-color: #efe;}
  #col3   {background-color: #eef;}
  #teaser  {background-color: #ffe;}
  #footer {background-color: #f6f6f6;}

  #col3 {border-width: 2px !important; border-color: #444 !important}
/**
 * section background graphics
 *
 * defines background graphics of basic layout elements in construction view
 */

  #header {background-image: url("../images/bg_header.png") !important;}
  #topnav {background-image: url("../images/bg_topnav.png");}
  #nav    {background-image: url("../images/bg_nav.png") !important;}
  #main   {background-image: url("../images/bg_main.png") !important; }
  #col1   {background-image: url("../images/bg_col1.png");}
  #col2   {background-image: url("../images/bg_col2.png");}
  #col3   {background-image: url("../images/bg_col3.png");}
  #teaser {background-image: url("../images/bg_teaser.png");}
  #footer {background-image: url("../images/bg_footer.png") !important;}

  #header, #topnav, #nav, #main, #col1, #col2, #col3, #teaser, #footer {
    background-repeat: no-repeat !important;
    background-position: top left  !important;
  }

  /* #page - Level 1 */
  .page .subcolumns {background-color: #f8f8f8;}
  .page .subcolumns .subcl .yb_wrapper, 
  .page .subcolumns .subcr .yb_wrapper, 
  .page .subcolumns .subc .yb_wrapper {background-color: #f4f4f4;}

  /* #page - Level 2 */
  .page .subcolumns .subcolumns {background-color: #f4f4f4;}
  .page .subcolumns .subcolumns .subcl .yb_wrapper, 
  .page .subcolumns .subcolumns .subcr .yb_wrapper, 
  .page .subcolumns .subcolumns .subc .yb_wrapper {background-color: #f0f0f0;}

  /* #page - Level 3 */
  .page .subcolumns .subcolumns .subcolumns {background-color: #f0f0f0;}
  .page .subcolumns .subcolumns .subcolumns .subcl .yb_wrapper, 
  .page .subcolumns .subcolumns .subcolumns .subcr .yb_wrapper, 
  .page .subcolumns .subcolumns .subcolumns .subc .yb_wrapper {background-color: #ececec;}

  /* #col1 - Level 1 */
  #main #col1 .subcolumns {background-color: #f8e8e8;}
  #main #col1 .subcolumns .subcl .yb_wrapper, 
  #main #col1 .subcolumns .subcr .yb_wrapper, 
  #main #col1 .subcolumns .subc .yb_wrapper {background-color: #f4e4e4;}

  /* #col1 - Level 2 */
  #main #col1 .subcolumns .subcolumns {background-color: #f4e4e4;}
  #main #col1 .subcolumns .subcolumns .subcl .yb_wrapper, 
  #main #col1 .subcolumns .subcolumns .subcr .yb_wrapper, 
  #main #col1 .subcolumns .subcolumns .subc .yb_wrapper {background-color: #f0e0e0;}

  /* #col1 - Level 3 */
  #main #col1 .subcolumns .subcolumns .subcolumns {background-color: #f0e0e0;}
  #main #col1 .subcolumns .subcolumns .subcolumns .subcl .yb_wrapper, 
  #main #col1 .subcolumns .subcolumns .subcolumns .subcr .yb_wrapper, 
  #main #col1 .subcolumns .subcolumns .subcolumns .subc .yb_wrapper {background-color: #ecdcdc;}
  
  /* #col2 - Level 1 */
  #main #col2 .subcolumns {background-color: #e8f8e8;}
  #main #col2 .subcolumns .subcl .yb_wrapper, 
  #main #col2 .subcolumns .subcr .yb_wrapper, 
  #main #col2 .subcolumns .subc .yb_wrapper {background-color: #e4f4e4;}

  /* #col2 - Level 2 */
  #main #col2 .subcolumns .subcolumns {background-color: #e4f4e4;}
  #main #col2 .subcolumns .subcolumns .subcl .yb_wrapper, 
  #main #col2 .subcolumns .subcolumns .subcr .yb_wrapper, 
  #main #col2 .subcolumns .subcolumns .subc .yb_wrapper {background-color: #e0f0e0;}

  /* #col2 - Level 3 */
  #main #col2 .subcolumns .subcolumns .subcolumns {background-color: #e0f0e0;}
  #main #col2 .subcolumns .subcolumns .subcolumns .subcl .yb_wrapper, 
  #main #col2 .subcolumns .subcolumns .subcolumns .subcr .yb_wrapper, 
  #main #col2 .subcolumns .subcolumns .subcolumns .subc .yb_wrapper {background-color: #dcecdc;}

  /* #col3 - Level 1 */
  #main #col3 .subcolumns {background-color: #e8e8f8;}
  #main #col3 .subcolumns .subcl .yb_wrapper, 
  #main #col3 .subcolumns .subcr .yb_wrapper, 
  #main #col3 .subcolumns .subc .yb_wrapper {background-color: #e4e4f4;}

  /* #col3 - Level 2 */
  #main #col3 .subcolumns .subcolumns {background-color: #e4e4f8;}
  #main #col3 .subcolumns .subcolumns .subcl .yb_wrapper, 
  #main #col3 .subcolumns .subcolumns .subcr .yb_wrapper, 
  #main #col3 .subcolumns .subcolumns .subc .yb_wrapper {background-color: #e0e0f0;}

  /* #col3 - Level 3 */
  #main #col3 .subcolumns .subcolumns .subcolumns {background-color: #e0e0f0;}
  #main #col3 .subcolumns .subcolumns .subcolumns .subcl .yb_wrapper, 
  #main #col3 .subcolumns .subcolumns .subcolumns .subcr .yb_wrapper, 
  #main #col3 .subcolumns .subcolumns .subcolumns .subc .yb_wrapper {background-color: #dcdcec;}

  /* #col3 - Level 1 */
  #main #teaser .subcolumns {background-color: #f8f8e8;}
  #main #teaser .subcolumns .subcl .yb_wrapper, 
  #main #teaser .subcolumns .subcr .yb_wrapper, 
  #main #teaser .subcolumns .subc .yb_wrapper {background-color: #f4f4e4;}

  /* #col3 - Level 2 */
  #main #teaser .subcolumns .subcolumns {background-color: #f4f4e8;}
  #main #teaser .subcolumns .subcolumns .subcl .yb_wrapper, 
  #main #teaser .subcolumns .subcolumns .subcr .yb_wrapper, 
  #main #teaser .subcolumns .subcolumns .subc .yb_wrapper {background-color: #f0f0e0;}

  /* #col3 - Level 3 */
  #main #teaser .subcolumns .subcolumns .subcolumns {background-color: #f0f0e0;}
  #main #teaser .subcolumns .subcolumns .subcolumns .subcl .yb_wrapper, 
  #main #teaser .subcolumns .subcolumns .subcolumns .subcr .yb_wrapper, 
  #main #teaser .subcolumns .subcolumns .subcolumns .subc .yb_wrapper {background-color: #ececdc;}
 
  /* Little Help for dropzones in IE */
  #col3 {height:1% }

}
