/* common styles for template */

/* ------------- imports of other stylesheets ------------- */
@import url("gallery.css");
@import url("news_full.css");
@import url("guestbook.css");
@import url("links.css");
@import url("news_horiz.css");
@import url("news_vert.css");
@import url("authorization.css");
@import url("calendar.css");      /* includes styling rules for all calendar files */
 
/* ------------- basic layout rules ------------- */

  body {
    padding: 0;                                                     /* no padding and margin */
    margin: 0;
    /* background-color: #000; */
  }

  /* ----------------- container section ----------------- */
  #container {
    width: 957px;                                                   /* exact width of the background header picture */
    margin: 10px auto;                                              /* horizontal zentriert -> Achtung: funktioniert in älteren IE Versionen so nicht */
    background-color: #e9d8d0;                                      /* container background color */
    /*color: #333;*/
    border: 1px solid #fff;                                         /* white border around all container */
    /*line-height: 130%;*/                                          /* increase readability */
  }
  
  /* ----------------- top section ----------------- */
  /* header background picture */
  #top {
    height: 125px;                                                  /* exact height of background image */
    background: url("../_images/logo.jpg") no-repeat;        /* this is just temporary -> use collage later */
    border-bottom: 1px solid #fff;                                  /* use white bottom border */ 
    position: relative;                                             /* needed, so that image can be positioned absolutely */
  }
  
  /* positioning of collage image */
  #top img {
    position: absolute;
    right: 0;
    width: 757px;
    height: 125px;
  }
  
  /* ----------------- mainnavi section ----------------- */
  #mainnavi {
    border-bottom: 1px solid #fff;                                  /* use bottom border */
    background-color: #3d3c3a;                                      /* special background color -> use background image later */
    padding-top: .5em;
    padding-left: 42px;                                             /* move navlist a little more to the center */
    padding-bottom: .5em;
    color: #fff;                                                    /* use white font color */
  }
  
  /* ----------------- leftnav section ----------------- */
  #leftnav {
    float: left;                                                    /* to float the leftnav, a width must be declared as well */
    width: 177px;
    padding: 10px;                                                  /* use padding */
  }
  
  #leftnav h1 {
    border-bottom: 1px solid #462208;                               /* use bottom border */
    padding-bottom: 5px;
    margin-top: 0;
    color: #462208;                                                 /* special color */
    font-size: 15px;                                                /* choose lower font size */
    letter-spacing: 0.1px;              
    width: 150px;                                                   /* this is a hack -> maybe find a better solution */
    margin-bottom: 20px;                                            /* use some margin as well to get the first news item away from the header */
  }
  
  #leftnav img {
    margin-left: 50px;                                                 /* center the image -> as good as possible :-) */
    margin-bottom: 10px;                                            /* use some bottom margin */
  }
  
  #leftnav p {
    font-size: 13px;
  }

  #leftnav span {
    font-weight: bold;                                              /* use bold font weight */
  }
  
  /* ----------------- middle-right section ----------------- */
  #middle-right {
    background-color: #f0d89c;
    margin-left: 197px;
  }
  
  /* ----------------- rightnav section ----------------- */
  #rightnav {
    float: right;                                                   /* float the rightnav */
    width: 197px;
    padding: 10px;
  }
  
  #rightnav h1 {
    border-bottom: 1px solid #462208;                               /* use bottom border */
    padding-bottom: 5px;
    color: #462208;                                                 /* special color */
    font-size: 15px;                                                /* choose lower font size */
    letter-spacing: 0.1px;              
    width: 150px;                                                   /* this is a hack -> maybe find a better solution */
    margin-bottom: 10px;                                            /* use some margin as well to get the first news item away from the header */
    margin-top: 20px;
  }
  
  div#rightnav h1:first-child {                                     /* first header should have no top margin */
    margin-top: 0;
  }
  
  #rightnav p.more {                                                /* align the more text on the right */
    text-align: right;
    margin-right: 10px;                                             /* so it's not too much on the right */
    font-size: 12px;                                                /* choose a lower font weight */
    margin-top: 5px;
  }
  
  #rightnav p.more a {                                              /* style anchors */
    color: #484441;
  }
  
  #rightnav a {                                                     
    color: #484441;
  }
  
  #rightnav p.more a:hover {
    text-decoration: none;
  }
  
  #rightnav a:hover {
    text-decoration: none;
  }
  
  #rightnav span {
    font-weight: bold;
  }
  
  #rightnav p.news_detail {
    margin-top: 10px;                                               /* get some space between news header and news detail */
    color: #000;
  }
  
  /* ----------------- content section ----------------- */
  #content {
    border-left: 1px solid #fff;                                    /* apply border to leftnav div if it gets longer than the content */
    margin-right: 217px;
    border-right: 1px solid #fff;
    padding: 10px;                                                   /* use padding so that the content moves away from the border */
    background-color: #efe2cf;                                      /* special background color */
    min-height: 570px;
  }
  
  #content h1, p {
    padding: 0;                                                     /* browsers use different amounts of padding and margin */
    margin: 0;
  }
  
  #content p {
    line-height: 150%;                                              /* use larger line height for better readability */
    color: #484441;                                                 /* special font color */
  }
  
  #content a {
    color: #484441;
  }
  
  #content a:hover {
    text-decoration: none;
  }
  
  #content h1 {
    border-bottom: 1px solid #462208;                               /* use bottom border */
    padding-bottom: 5px;
    color: #462208;                                                 /* special color */
    font-size: 15px;                                                /* choose lower font size */
    letter-spacing: 0.1px;              
    width: 200px;                                                   /* this is a hack -> maybe find a better solution */
    margin-bottom: 10px;                                            /* use some bottom margin */
  }
  
  #content table {                                                  /* as tables may be used -> fck editor */
    line-height: 150%;                                              /* use larger line height for better readability */
    color: #484441;
  }
  
  /* #content img {
    float: right;      */                                             /* float the image */
   /* padding: 3px;    */                                               /* use some padding */
    /* border: 1px solid #b1ada4;      */                                /* use a border */
   /* margin-left: 20px;   */                                           /* use margin to get the text away from the image */
   /* position: relative;       */                                      /* move picture down a little bit */
    /* top: 5px; */
  /* } */
  
  /* ----------------- footer section ----------------- */
  #footer {
    clear: both;                                                    /* force the footer below any floated elements */
    padding: 10px;                                                  /* move text away from borders */
    color: #fff;
    background-color: #462208;
    border-top: 1px solid #fff;                                     /* use top border */
    text-align: center;                                             /* center the text */
    font-size: 12px;                                                /* use smaller font weight */
  }
    
  /* otherwise IE adds too much padding or margin */
  #footer a {
    margin: 0;
    padding: 0;
    text-decoration: none;
    color: #fff;
  }