body{ background-color: black; }

/* Box borders
   This sets a border around all
   the element boxes.
   
   It's only perpos is to ease
   development
   */
/*
#out-top, #out-bottom, #out-left, #out-right, #in-top, #in-bottom, #main { 
  border: 1px solid red;
}
*/

#out-wrapper { 
    margin-left: auto;
    margin-right: auto;
}
#out-top {
   text-align: center;

}

#p_footer {
   text-align: center;
}

  /* Menu Settings 

   list-style: none; - removes the dots
   padding:0; margin:0; - removes spaceing/indent
   */
#p_menu {
  list-style: none;
  padding: 0;
  margin: 0;
  text-align: center;
}

/* Horizontal Menu */
#p_menu li {
  display: inline;
  margin: 0 1em;
}


/* Menu link settings */
#p_menu a {
  font-size: 100%;
  text-decoration: none;
  color: #ccc;
}

/* Menu link hand-over settings */
 
#p_menu a:hover { 
  color: white;
}


/* Selected page/link */

#p_menu a.selected {
  text-decoration: underline;
}



/* Remove document actions and the top header/page title (print & send-to) */
.documentActions, .documentFirstHeading {
  display: none;
}


/* Two-collum forms */
#kontakt-form { width: 400px; padding-top: 10px; }
#kontakt-form div.field { clear:both; }
#kontakt-form label { float:left; }
#kontakt-form div div.formError { float:right;}
#kontakt-form div.field input { float: right; }
#kontakt-form div.field textarea { float: right; }
#kontakt-form div div.formHelp { float:left; clear:left; }
#kontakt-form div.formButtons { clear:both; float:right; }
/* Cross browser fixes for the forms */
html > body #kontakt-form { padding-top: 0; }
html > body #kontakt-form div.formButtons { padding-top: 15px; }
html > body #kontakt-form div.field input { margin-top: -18px; }
html > body #kontakt-form div.field textarea { margin-top: -18px; }
html > body #kontakt-form label { margin-top: 15px; }




/***************************************************************************
   CSS Quick Reference
   *************************************************************************

   Elements: 
    body      :: The outermost element (Please do not use this it will probably just break the template)
    p         :: Paragraf
    a         :: Link
    a:hover   :: Link hand over
    a:visited :: Link when visited
    h1 -> h6  :: Headings
    table     :: Table wrapper
    tr        :: Table row
    th        :: Table header cell
    td        :: Table cell
    ul        :: Unordered list
    ol        :: Ordered list
    li        :: List item
    img       :: Image element
    

   Unique elements:
    #out-wrapper  :: Outer wrapper, contains all other elements
    #in-wrapper   :: Inner wrapper, contains in-top, in-bottom & main
    #out-top      :: Sutable for logo
    #out-bottom   :: Sutable for footer
    #out-left     :: Sutable for menu
    #out-right    :: Sutable for side boxes
    #in-top       :: Sutable for menu
    #in-bottom    :: Sutable for menu or footer
    #main         :: Contains the page (be careful with this one)
   
   Portlets
    #p_menu
    #p_footer
    #p_login_box
    #p_login_link


   CSS values
   
   color: hex | rgb | keyword         :: Font Color
   font-size: px | %                  :: Always use %
   font-width: bold | 500 - 900
   font-family: arial sans-serif      :: Always end in serif or sans-serif
   font-style: italic | none;
   text-decoration: underline | none  :: There are more but I don't remeber
   
   text-align: left | right | center | justifiy;
   
   The following can be written in several ways

     margin: 1px 2px 3px 4px;

   and

     margin-top: 1px;
     margin-right: 2px;
     margin-bottom: 3px;
     margin-left: 4px;

   are the same

   margin: px | %
   padding: px | %
   width: px | %
   height: px | %
   
   border: WIDTH STYLE COLOR;
   or
   border-width: TOP RIGHT BOTTOM LEFT;  :: in px (Can be set as: border-bottom-width ...)
   border-style: dashed | solid;
   border-color: hex | rgb;
   

   IMAGE is written as: url('path/to/image.png')
   background: COLOR IMAGE REPEAT POSITION;
   background-color: hex|rgb
   background-image: url('...')
   background-repeat: repeat-x | repeat-y | no-repeat
   background-position: x-pos y-pos;     :: in px or %


   display: inline | block | none;       :: block=new line after element

   **************************************************************************/