/*
 * styles.css
 * WumWam stylesheet
 *
 * $Id: $
 *
 * Copyright (c) 2010 AMC World Technologies GmbH
 * Fischerinsel 1, D-10179 Berlin, Deutschland
 * All Rights Reserved.
 *
 * This software is the confidential and proprietary information of AMC World
 * Technologies GmbH ("Confidential Information"). You shall not disclose such
 * Confidential Information and shall use it only in accordance with the terms
 * of the license agreement you entered into with AMC World Technologies GmbH.
 */


/*-----------------------------------
 *
 * Reset browser styles (from YUI)
 *
 *---------------------------------*/

html {
  color: black;
  background: white;
}
blockquote, body, button, code, dd, div, dl, dt, fieldset, form, h1, h2, h3,
  h4, h5, h6, input, legend, li, ol, p, pre, td, textarea, th, ul
{
  margin: 0;
  padding: 0;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
fieldset, iframe, img, table {
  border: none;
}
address, caption, cite, code, dfn, em, optgroup, strong, th, var {
  font-style: inherit;
  font-weight: inherit;
}
del, ins {
  text-decoration: none;
}
li {
  list-style: none;
}
caption, th {
  text-align: left;
}
h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal;
}
q:after, q:before {
  content: "";
}
abbr, acronym {
  border: none;
  font-variant: normal;
}
sup {
  vertical-align: baseline;
}
sub {
  vertical-align: baseline;
}
legend {
  color: black;   /* because legend doesn't inherit in IE */
}
button, input, optgroup, option, select, textarea {
  font-family: inherit;
  font-size: inherit;
  font-style: inherit;
  font-weight: inherit;
}


/*-----------------------------------
 *
 * Font settings (from YUI)
 *
 *---------------------------------*/

body {
  font: 13px/1.231 Tahoma, Verdana, Arial, Helvetica, sans-serif;
  /*font-size: 81.25%;*/
}
button, input, select, textarea {
  font: 99% Tahoma, Verdana, Arial, Helvetica, sans-serif;
}
code, kbd, pre, samp, textarea, tt, xmp {
  font-family: "Bitstream Vera Sans Mono", "Lucida Console", "Courier New",
    Courier, monospace;
  line-height: 100%;
}
table {
  font-size: inherit;
}


/*-----------------------------------
 *
 * General settings
 *
 *---------------------------------*/

/* default links */
a {
  color: #600;
  text-decoration: none;
}
a:hover {
  color: #FF9;
  text-decoration: none;
}

/* general body settings */
html {
  background-color: #2D2D2D;
}

/* default definition term */
dt {
  font-weight: bold;
}

/* default headers */
h1, h2, h3, h4 {
  color: #FC3;
}
h1 {
  color: #FC3;
  font-size: 108%;
  font-weight: bold;
  margin-bottom: 2em;
  margin-top: 2.5em;
}
h2 {
  font-size: 108%;
  font-weight: normal;
  margin-bottom: 1.5em;
  margin-top: 2em;
}


/* default rulers */
hr {
  background: #ffcc33;
  border-style: solid;
  border-width: 0;
  color: #ffcc33;
  height: 1px;
}

/* default block elements */
fieldset, p, pre, table {
  margin-bottom: 1em;
}

/* default paragraphs */
p {
  font-size: 93%;
  line-height: 150%;
}

/* default lists */
dd, dt, li {
  font-size: 93%;
  line-height: 150%;
  margin-bottom: 1em;
}
dd dd, dd dt, dd li, li dd, li dt, li li {
  font-size: 100%;
}
blockquote, dl, ol, ul {
  margin: 1em;
}
dl, ol, ul {
  margin-left: 2em;
}
ol li {
  list-style: decimal outside;
}
ul li {
  list-style: disc outside;
}
dl {
  margin-left: 0;
}
dl dd {
  margin-left: 1em;
}

/* default inline stuff */
abbr, acronym {
  border-bottom: 1px dotted #3399FF;
  cursor: help;
}
strong {
  font-weight: bold;
}
del {
  text-decoration: line-through;
}
em {
  font-style: italic;
}
sub {
  vertical-align: sub;
}
sup {
  vertical-align: super;
}

/* default table stuff */
caption {
  caption-side: bottom;
  font-size: 85%;
  margin-bottom: .5em;
  margin-top: 1em;
  text-align: center;
}
td, th {
  padding: .5em;
}
th {
  font-size: 93%;
  font-weight: bold;
  text-align: center;
}


/*-----------------------------------
 *
 * Page elements
 *
 *---------------------------------*/

/* the outer box */
#outer-box {
  background-color: #660000;
  margin: 0 auto;
  width: 1000px;
}

/* the top bar */
#top-bar {
  background: #FC3;
  color: #600;
  padding: 1em 14px;
}
#top-bar p {
  margin-bottom: 0;
}
#contact-phone {
  float: left;
  margin-right: 2.5em;
}
#contact-mail {
  float: left;
}
#contact-mail a {
  color: #600;
}
#contact-mail a:hover {
  text-decoration: underline;
}
#company-name {
  float: right;
  text-align: right;
  width: 50%;
}
#company-name strong {
  font-weight: normal;
}

/* the inner frame */
#inner-frame {
  border-top: 1px solid #600;
  height: 459px;
  left: 0;
  position: relative;
  top: 0;
}

/* the main service menu */
.main-service-menu {
  left: 0;
  margin: 0;
  position: absolute;
  width: 1000px;
}
.main-service-menu li {
  float: left;
  list-style-type: none;
  margin: 0 0 0 13px;
}
.main-service-menu .first-child {
  margin-left: 0;
}
.main-service-menu .last-child {
  margin-left: 12px;
}
.main-service-menu a {
  background: #600 no-repeat;
  display: block;
  text-indent: -9999px;
}
#main-service-menu-1 {
  height: 80px;
  top: 16px;
}
#main-service-menu-1 a, #main-service-menu-1 .spacer {
  background: #600 url("../img/menu-t-wumwam.png");
  height: 80px;
}
#barvinok #main-service-menu-1 a {
  background-image: url("../img/menu-t-barvinok.png");
}
#caramel-club #main-service-menu-1 a {
  background-image: url("../img/menu-t-caramel-club.png");
}
#caramel-cx #main-service-menu-1 a {
  background-image: url("../img/menu-t-caramel-cx.png");
}
#main-service-menu-2 {
  bottom: 16px;
  height: 153px;
}
#main-service-menu-2 a, #main-service-menu-2 .spacer {
  background: #600 url("../img/menu-b-wumwam.png");
  height: 153px;
}
#headache #main-service-menu-2 a {
  background-image: url("../img/menu-b-headache.png");
}
#styler #main-service-menu-2 a {
  background-image: url("../img/menu-b-styler.png");
}
#the-worldshop #main-service-menu-2 a {
  background-image: url("../img/menu-b-the-worldshop.png");
}
#main-service-menu-1 #link-t1 {
  width: 262px;
}
#main-service-menu-1 #link-t1:hover {
  background-position: 0 -80px;
}
#main-service-menu-1 #link-t2 {
  background-position: -262px 0;
  width: 369px;
}
#main-service-menu-1 #link-t2:hover {
  background-position: -262px -80px;
}
#main-service-menu-1 #link-t4 {
  background-position: -700px 0;
  width: 262px;
}
#main-service-menu-1 #link-t4:hover {
  background-position: -700px -80px;
}
#main-service-menu-2 #link-b1 {
  width: 171px;
}
#main-service-menu-2 #link-b1:hover {
  background-position: 0 -153px;
}
#main-service-menu-2 #link-b3 {
  background-position: -348px 0;
  width: 402px;
}
#main-service-menu-2 #link-b3:hover {
  background-position: -348px -153px;
}
#main-service-menu-2 #link-b4 {
  background-position: -750px 0;
  width: 182px;
}
#main-service-menu-2 #link-b4:hover {
  background-position: -750px -153px;
}
.spacer {
  background: #660000 no-repeat;
  display: block;
}
#main-service-menu-1 .spacer {
  background-position: -631px 0;
  width: 69px;
}
#main-service-menu-2 .spacer {
  background-position: -171px 0;
  width: 177px;
}

/* the main content */
#main-container {
  height: 114px;
  margin-top: 137px;
}
#headache #main-container {
  height: 178px;
  margin-top: 105px;
}
#styler #main-container {
  height: 149px;
  margin-top: 119px;
}
#the-worldshop #main-container {
  height: 175px;
  margin-top: 106px;
}
#logo {
  background: url("../img/wumwam.jpg") no-repeat 100% 50%;
  float: left;
  height: 100%;
  text-indent: -9999px;
  width: 473px;
}
#barvinok #logo {
  background-image: url("../img/barvinok.jpg");
  width: 489px;
}
#caramel-club #logo {
  background-image: url("../img/caramel-club.jpg");
  width: 512px;
}
#caramel-cx #logo {
  background-image: url("../img/caramel-cx.jpg");
  width: 465px;
}
#headache #logo {
  background-image: url("../img/headache.jpg");
  width: 471px;
}
#styler #logo {
  background-image: url("../img/styler.jpg");
  width: 473px;
}
#the-worldshop #logo {
  background-image: url("../img/the-worldshop.jpg");
  width: 364px;
}
#logo h1 {
  font-size: 100%;
  line-height: 1;
  margin: 0;
}
#main-content-container {
  float: left;
  margin-left: 35px;
  width: 492px;
}
#barvinok #main-content-container {
  width: 476px;
}
#caramel-club #main-content-container {
  width: 453px;
}
#caramel-cx #main-content-container {
  width: 500px;
}
#headache #main-content-container {
  padding-top: 25px;
  width: 494px;
}
#styler #main-content-container {
  padding-top: 5px;
  width: 492px;
}
#the-worldshop #main-content-container {
  padding-top: 25px;
  width: 601px;
}
#title {
  border-bottom: 1px solid #FC3;
  color: #FC3;
  font-size: 13px;
  font-weight: bold;
  line-height: 1;
  margin: 11px 0 16px;
  padding: 0 14px 8px 0;
}
#main-content {
  color: #FC3;
  font-size: 12px;
  line-height: 14px;
  padding-right: 100px;
}

/* the main menu */
#main-menu {
  margin: 0;
}
#main-menu li {
  float: left;
  list-style: none;
  margin: 0 20px 0 0;
}
#main-menu a {
  color: #FC3;
}
#main-menu a:hover {
  color: #FF9;
}

/* the bottom menus */
#bottom-bar {
  background-color: #ffcc33;
  padding: 1em 0;
}
#bottom-bar a {
  color: #600;
}
#bottom-bar a:hover {
  text-decoration: underline;
}
#services-menu {
  float: left;
  margin: auto 0;
}
#services-menu li {
  display: inline;
  font-size: 100%;
  list-style-type: none;
  margin-bottom: 0;
  padding-left: 14px;
}
#bottom-extra-menu {
  float: right;
  margin: 0;
}
#bottom-extra-menu li {
  display: inline;
  font-size: 100%;
  list-style-type: none;
  margin-bottom: 0;
  padding-right: 14px;
}


/*-----------------------------------
 *
 * Miscellaneous
 *
 *---------------------------------*/

/* clearing */
#top-bar:after, .main-menu:after, #main-container:after, #main-menu:after,
  #bottom-bar:after
{
  clear: both;
  content: ".";
  display: block;
  height: 0;
  visibility: hidden;
}

/* vim:set ts=2 sw=2 sts=2: */