@charset "utf-8";

/* Yamaha Musikschule Franchise Website
===============================================================================
    (c) 2010 projektvier | www.projektvier.de

    contents

    01.  Body
    02.  Header area
    02a. TopNav area
    02b. MicroNav
    03.  Content area (all pages)
    04.  Content area (specific pages)
    05.  Footer area

    last revision: 06.10.2010
=============================================================================== */



/* ===============================================================================
01. Body
=============================================================================== */
body { background: #f0f0f2 url(../images/bg_body.png) 0 0 repeat-x; }
.clear {
  clear: both;
  font-size: 0.1em;
  line-height: 0.1em;
  height: 0;
  width: 0;
}
div#jumptocontent {
  position: absolute;
  left: -9999px;
  top: -99999px;
}
div#page {
  background: #ffffff;
  width: 892px;
  margin: 0 auto;
}


/* ===============================================================================
02. Header area
=============================================================================== */

/* Page Header - Logos, Musikschulname */
div#page div#header {
  width: 862px;
  height: 65px;
  padding: 0 15px;
}
div#page div#header div#logos {
  width: 202px;
  float: left;
  text-align: center;
}
div#page div#header div#headermusikschulname {
  float: right;
  margin-top: 35px;
}
div#page div#header div#logos img#yamahalogo {
  margin: 18px 0 0 0;
  width: 91px;
  height: 21px;
}
div#page div#header div#logos img#contractlogo {
  margin: 10px 0 0 0;
}


/* ===============================================================================
02a. TopNav area
=============================================================================== */
div#page ul#topnavigation {
  width: 862px;
  height: 45px;
  margin: 0 15px;
  border-bottom: 1px solid #ebebeb;
}
div#page ul#topnavigation li {
  float: left;
  padding: 0 15px 0 10px;
}
div#page ul#topnavigation li a {
  color: #7f7f7f;
  text-decoration: none;
}
div#page ul#topnavigation li.active a {
  color: #2f9dd1;
}

div#page ul#topnavigation li a:hover {
  color: #555555;
  text-decoration: underline;
}


/* ===============================================================================
02b. MicroNav
=============================================================================== */
div#page ul#micronavigation {
  width: 862px;
  height: 35px;
  margin: 0 15px;
  border-bottom: 1px solid #ebebeb;
}
div#page ul#micronavigation li {
  float: left;
  color: #626262;
  padding: 10px 5px 10px 0;
}
div#page ul#micronavigation li a {
  color: #626262;
}
div#page ul#micronavigation li a:hover {
  color: #4c4c4c;
  text-decoration: none;
}


/* ===============================================================================
03. Content area (all pages => Default Styles)
=============================================================================== */
div#page div#content {
  float: left;
  display: inline; /* for IE6 */
  width: 660px;
  margin: 20px 0;
}
/* Left Navigation ------------------------------------------------------------ */
div#page div#leftnavigation {
  float: left;
  display: inline; /* for IE6 */
  width: 182px;
  margin: 20px 20px 20px 15px;
}
div#page div#leftnavigation ul {
  border: 1px solid #e5e5e5;
}
div#page div#leftnavigation ul li {
  border-top: 1px solid #e5e5e5;
}
div#page div#leftnavigation ul li.top {
  background: #e5e5e5;
  border-bottom: 1px solid #bdbdbd;
}
div#page div#leftnavigation ul li.active {
  background: #2f9dd1;
}
div#page div#leftnavigation ul li a {
  display: block;
  min-height: 18px;
  color: #2f9dd1;
  text-decoration: none;
  background: url(../images/arrow_right.gif) 4px 10px no-repeat;
  padding: 5px 0 5px 17px;
}
div#page div#leftnavigation ul li.top a {
  font-weight: bold;
}
div#page div#leftnavigation ul li.active a {
  color: #ffffff;
}
div#page div#leftnavigation ul li a:hover {
  text-decoration: underline;
}

/* Headlines ------------------------------------------------------------------ */
h1 { margin: 20px 0 5px 15px; }
h3, h2 { margin: 0 0 1em 0; }

/* Default Styles (Links, paragraphs etc) ------------------------------------- */
div#content p {
  margin: 0 0 1em 0;
}
/* Standard Link */
div#content a {
  color: #2f9dd1;
  font-weight: bold;
  text-decoration: none;
}
div#content a:hover {
  text-decoration: underline;
}

/* PDF link big --------------------------------------------------------------- */
div#content a.pdflinkbig {
  background: url(../images/icon_pdf.png) 0 50% no-repeat;
  padding-left: 20px;
}

/* Default unordered list ----------------------------------------------------- */
div#content ul.normal {
  margin: 0 0 1em 0;
}
div#content ul.normal li {
  background: url(../images/circle.gif) no-repeat scroll 0 0.35em transparent;
  margin: 0 0 0.5em 0;
  padding-left: 10px;
}

/* Link Backtotop ------------------------------------------------------------- */
div.backtotop {
  text-align: right;
  padding: 0 15px 15px 0;
}
div.backtotop a {
  color: #2f9dd1;
  background: url(../images/arrow_up.png) 100% 50% no-repeat;
  padding-right: 12px;
}

/* Default Listview ----------------------------------------------------------- */
div#content ul.listview {
  margin: 25px 0 0 0;
}
div#content ul.listview li {
  color: #444444;
  margin: 0 0 15px 0;
}
div#content ul.listview img {
  float: left;
  width: 120px;
  margin-right: 15px;
}
div#content ul.listview p {
  float: right;
  width: 525px;
}

/* ===============================================================================
04. Content area (specific pages)
=============================================================================== */
/* Homepage */
div.promobox_leftnav {
  width: 160px;
  margin: 20px 0 15px 0;
  padding: 10px;
  border: 1px solid #e5e5e5;
  color: #444444;
}
div.promobox_leftnav a {
  display: block;
  background: url(../images/arrow_right.gif) 0 5px no-repeat;
  color: #2f9dd1;
  padding-left: 13px;
  font-weight: bold;
  margin-bottom: 1em;
}

/* Courses Overview */
ul.coursecategories li {
  width: 315px;
  float: left;
  display: inline;
  margin: 0 15px 2em 0;
}

/* News Listview */
div#content ul.listview a.newslist {
  background: url(../images/arrow_right_big.png) 100% 50% no-repeat;
  padding-right: 20px;
}

/* News Detail */
div#content img.newsdetail {
  float: left;
  padding: 0 15px 15px 0;
}

/* Job offers */
ul.joboffers li {
  padding: 0 0 13px 0;
  margin: 0 0 25px 0;
  border-bottom: 1px solid #999999;
}




/* ===============================================================================
05. Footer area
=============================================================================== */
div#footer {
  height: 31px;
  width: 862px;
  margin: 0 auto;
  padding: 0 15px;
  background: #bdbdbd;
  color: #ffffff;
}
div#footer address { float: left; font-style: normal; }
div#footer ul { float: right; }
div#footer ul li { float: left; }
div#footer ul li a { color: #ffffff; }