@charset "utf-8";
/*
	Application CSS
	For myshoppingclub.de by creativestyle.de

	Authors:
		Lukasz Tyrala <l.tyrala[at]gmail.com>
	Version:
		1.0 (devel)
	Text bookmarks:
		-tx-bookmark- (main sections)
		-hx-bookmark- (hacks for IE)
*/

html {
  background: #1e1e1e;
  }

* {
  margin: 0;
  padding: 0;
  font-family: Verdana, sans;
  }

.spacer {
  margin: 0 auto 0 auto;
  padding: 0;
  width: 801px;
  }

/* HEADER
--------------------------------------------------------------------------------------- */

#header {
  height: 96px;
  background: #1e1e1e;
  border-top: 5px solid #ca73ff;
  }

#header .spacer {
  background: url('img/site/bg-footer.jpg') repeat-y 0 0;
  }

#header h1 {
  display: block;
  margin: 0;
  padding: 0;
  float: left;
  width: 400px;
  height: 41px;
  background: url('img/site/bg-logo.gif') no-repeat 0 0;
  }

#header h1 span {
  visibility: hidden;
  }

/* FEATURED CLUB OPTIONS
--------------------------------------------------------------------------------------- */

#featured-club-options {
  height: 61px;
  padding: 0 11px 0 11px;
  background: #313131;
  float: right;
  position: relative;
  top: 4px;

  }

#featured-club-options p {
  line-height: 20px;
  color: #a2a2a2;
  font-size: 11px;
  clear: both;
  padding: 0;
  margin: 0;
  }

#featured-club-options p a {
  color: #fff;
  text-decoration: none;
  }

#featured-club-options p a:hover {
  color: #fff;
  text-decoration: underline;
  }

#featured-club-options p.options {
  }

#featured-club-options p.options a {
  color: #c374ff;
  padding: 0 10px 0 0;
  }

#featured-club-options p.options a:hover {
  color: #c374ff;
  text-decoration: underline;
  }

#featured-club-options p.rating {
  float: left;
  line-height: 21px;
  width: 49%;
  clear: none;
  }

#featured-club-options p.rating-img {
  float: left;
  line-height: 21px;
  width: 50%;
  clear: none;
  }

#featured-club-options img {
  float: left;
  margin: 0 1px 0 0;
  position: relative;
  top: 3px;
  }

/* Featured shop options should be displaye only for iframe upper-frame */

#myshoppingclubs #featured-club-options,
#contact #featured-club-options,
#faq #featured-club-options,
#newsletter #featured-club-options,
#impressum #featured-club-options {
  visibility: hidden;
  }

#featured-club-options img {
  *left: 3px;
  } /*-hxbookmark-*/

/* CLUB SELECT BAR
--------------------------------------------------------------------------------------- */

#club-select {
  background: #a05dd1 url('img/site/bg-club-select.jpg') repeat-x 0 100%;
  height: 26px;
  width: 100%;
  clear: both;
  }

#club-select p {
  width: 801px;
  margin: 0 auto 0 auto;
  line-height: 26px;
  font-size: 10px;
  text-align: right;
  }

#club-select p select {
  width: 180px;
  font-size: 10px;
  }

#club-select p select {
  *position: relative;
  *top: 3px;
  }/*-hx-bookmark-*/

/* NAVIGATION / Top right nav
--------------------------------------------------------------------------------------- */

ul.nav {
  float: right;
  display: block;
  font-size: 14px;
  height: 27px;
  line-height: 27px;
  margin: 0 auto 0 auto;
  padding: 0;
  width: 801px;
  }

ul.nav li.opposite,
ul.nav li {
  float: right;
  margin: 0 1px 0 0;
  /* Overwriting ore.css specificity. Without browser-core.css this can be moved to ul */
  list-style: none inside;
  font-size: 12px;
  }

ul.nav li.opposite {
  float: left;
  margin: 0 0 0 1px;
  }

ul.nav li span.icon {
  padding-left: 18px;
  background: url('img/site/rss-icon.jpg') no-repeat 0 50%;
  }

ul.nav li a {
  display: block;
  padding: 0 11px 0 11px;
  text-decoration: none;
  color: #fdfdfd;
  background: #3d3d3d;
  }

ul.nav li.current {
  }

ul.nav li.current a {
  background: #ca73ff;
  }

ul.nav li a:hover {
  background: url('img/site/bg-nav-main-hov.jpg') repeat-x 0 0;
  }

ul.nav li.current a:hover {
  }

#impressum .impressum a,
#contact .kontakt a,
#faq .faq a,
#newsletter .newsletter a {
  background: #ca73ff;
  }

#impressum .impressum a:hover,
#contact .kontakt a:hover,
#faq .faq a:hover,
#newsletter .newsletter a:hover {
  cursor: default;
  background: #ca73ff;
  }


/* NAVIGATION / Main navigation
--------------------------------------------------------------------------------------- */

#navigation ul.nav {
  float: left;
  display: block;
  font-size: 12px;
  height: 28px;
  line-height: 28px;
  margin: 0;
  padding: 0;
  width: 400px;
  margin: 0 auto 0 auto;
  }

#navigation ul.nav li {
  float: left;
  margin: 0 5px 0 0;
  /* Overwriting ore.css specificity. Without browser-core.css this can be moved to ul */
  list-style: none inside;
  font-size: 11px;
  }

#navigation ul.nav li a {
  display: block;
  padding: 0 20px 0 20px;
  text-decoration: none;
  color: #fff;
  background: url('img/site/bg-nav-main.jpg') repeat-x 0 0;
  font-weight: bold;
  }

#navigation ul.nav li.current {
  }

#navigation ul.nav li.current a {
  background: url('img/site/bg-nav-main-current.jpg') repeat-x 0 0;
  }

#navigation ul.nav li a:hover {
  background: url('img/site/bg-nav-main-hov.jpg') repeat-x 0 0;
  }

#navigation ul.nav li.current a:hover {
  cursor: default;
  background: url('img/site/bg-nav-main-current.jpg') repeat-x 0 0;
  }

/* CONTENT
--------------------------------------------------------------------------------------- */

#content {
  clear: both;
/*  background: #fff url('img/site/bg-content.jpg') no-repeat 50% 0;*/
  padding: 30px 0 20px 0;
  margin: 0;
  width: 100%;
  }

p.options img {
  float: left;
  margin: 0 2px 0 0;
  }

.button-reg,
.button-visit {
  display: block;
  height: 24px;
  line-height: 24px;
  float: left;
  margin: 0 3px 0 0;
  }

#content .club .button-reg,
#content .club .button-visit {
  float: right;
  margin: 0 0 0 3px;
  }

.button-reg a,
.button-visit a {
  display: block;
  padding: 0 11px 0 11px;
  color: #fff;
  background: #525252;
  text-decoration: none;
  font-weight: bold;
  font-size: 11px;
  }

.button-reg a {
  background: #c36aff;
  }

.button-reg a:hover {
  background: #e58cff;
  }

.button-visit a:hover {
  background: #323232;
  }

#featured-club .button-visit a {
  color: #fff8a1;
  background: #766e1d;
  }

#featured-club .button-visit a:hover {
  color: #fff8a1;
  background: #988f2f;
  }

#featured-club {
  clear: both;
  background: #fff17a;
  padding: 1px 0 1px 0;
  }

#featured-club .spacer {
  clear: both;
  padding: 20px 0 15px 0;
  height: 210px;
  background: url('img/site/bg-featured-club.jpg') repeat-y 50% 0;
  }

#featured-club .section-1 {
  float: left;
  width: 167px;
  height: 210px;
  }

#featured-club .section-2 {
  float: left;
  width: 393px;
  height: 210px;
  }

#featured-club .section-1 p.options {
  line-height: 20px;
  font-size: 11px;
  color: #46413d;
  }

#featured-club .section-1 p.options img {
  position: relative;
  top: 4px;
  }

#featured-club .section-1 p.options a {
  font-size: 11px;
  text-decoration: none;
  color: #595047;
  }

#featured-club .section-1 p.options a:hover {
  text-decoration: underline;
  }

#featured-club .section-2 .product-desc {
  display: block;
  height: 210px;
  width: 225px;
  float: left;
  }

#featured-club .section-2 h3 {
  float: left;
  margin: 0;
  padding: 0 0 7.5px 0;
  font-size: 16px;
  font-weight: bold;
  color: #4f4700;
  }

#featured-club .section-2 p {
  float: left;
  text-align: justify;
  font-size: 11px;
  color: #4f4700;
  }

#featured-club .section-2 .product-thumb {
  float: right;
  padding: 0 35px 0 5px;
  }

#featured-club .section-3 {
  float: left;
  width: 241px;
  height: 210px;
  }

#featured-club .section-3 h3 {
  margin: 0;
  padding: 0 0 7.5px 0;
  font-size: 21px;
  font-weight: normal;
  color: #4f4700;
  }

#featured-club .section-3 p {
  text-align: justify;
  font-size: 10px;
  color: #4f4700;
  }



/* CONTENT / Contact / Impressum
--------------------------------------------------------------------------------------- */

#impressum #content h2 {
  font-size: 22px;
  font-weight: normal;
  padding: 5px 0 20px 0;
  margin: 0;
  }

#impressum #content p {
  line-height: 18px;
  margin-bottom: 18px;
  }

#contact #content h2 {
  font-size: 22px;
  font-weight: normal;
  padding: 5px 0 5px 0;
  margin: 0;
  }

#contact #content .form {
  float: left;
  width: 485px;
  padding: 0 0 10px 0;
  }

#contact #content label {
  line-height: 28px;
  font-size: 12px;
  }

#contact #content textarea {
  padding: 4px;
  border: 1px solid #ca73ff;
  background: #ebcbff;
  font-size: 14px;
  margin: 0 10px 0 0;
  width: 475px;
  height: 132px;
  color: #1e1e1e;
  }

#contact #content input.input {
  padding: 4px;
  border: 1px solid #ca73ff;
  background: #ebcbff;
  font-size: 14px;
  margin: 0 10px 0 0;
  width: 245px;
  color: #1e1e1e;
  }

#contact #content input.submit {
  padding: 4px;
  font-size: 12px;
  background: #e58cff;
  color: #fff;
  border: 2px solid #ebcbff;
  float: right;
  margin: 10px 0 10px 0;
  }

#contact #content input.submit:hover {
  background: #ebcbff;
  border: 2px solid #e58cff;
  }

#contact #content .info {
  float: right;
  width: 275px;
  }

#contact #content .info h3 {
  color: #d20000;
  font-size: 11px;
  line-height: 14px;
  }

#contact #content .info p {
  font-size: 11px;
  line-height: 14px;
  }

#contact #content .info p.em {
  color: #d20000;
  }

#impressum #content p a,
#contact #content .info p a {
  text-decoration: none;
  color: #ca73ff;
  font-weight: normal;
  }

#impressum #content p a:hover,
#contact #content .info p a:hover {
  text-decoration: underline;
  }

/* CONTENT / FAQ
--------------------------------------------------------------------------------------- */

#faq #content h2 {
  font-size: 22px;
  font-weight: normal;
  padding: 5px 0 20px 0;
  margin: 0;
  }


#faq #content p.footnote {
  padding: 10px 0 20px 0;
  margin: 0;
  font-size: 16px;
  font-weight: bold;
  line-height: 22px;
  }

#faq #submit {
  padding: 4px;
  font-size: 12px;
  background: #e58cff;
  color: #fff;
  border: 2px solid #ebcbff;
  }

#faq #submit:hover {
  background: #ebcbff;
  border: 2px solid #e58cff;
  }

#faq #content ul#faq-list {
  position: relative;
  left: 0;
  }

#faq #content ul li {
  list-style-type: none;
  }

#faq #content ul li div.q {
  padding: 0 0 0 10px;
  cursor: pointer;
  line-height: 22px;
  background: url('img/site/bg-faq-bullet.gif') no-repeat 0 55%;
  }

#faq #content ul li div.fab {
  padding: 10px;
  display: none;
  }

#faq #content ul li div.fab span.before {
  display: block;
  background: url('img/site/bg-faq-before.jpg') no-repeat 0 100%;
  height: 30px;
  width: 800px
  }

#faq #content ul li div.fab p {
  padding: 10px 10px 5px 10px;
  background: #ffcfea;
  margin: 0;
  width: 780px;
  font-size: 11px;
  }

#faq #content ul li div.fab span.after {
  display: block;
  background: url('img/site/bg-faq-after.jpg') no-repeat 0 0;
  height: 17px;
  width: 800px
  }



/* CONTENT / Newsletter
--------------------------------------------------------------------------------------- */

#newsletter #content {
  padding: 40px 0 140px 0;
  }

#newsletter #content .spacer {
  padding: 0 0 0 337px;
  text-align: left;
  }

#newsletter #content label {
  line-height: 42px;
  font-size: 12px;
  }

#newsletter #content input.input {
  padding: 4px;
  border: 1px solid #ca73ff;
  background: #ebcbff;
  font-size: 14px;
  margin: 0 10px 0 0;
  width: 325px;
  color: #1e1e1e;
  }

#newsletter #content input.submit {
  padding: 4px;
  font-size: 12px;
  background: #e58cff;
  color: #fff;
  border: 2px solid #ebcbff;
  }

#newsletter #content  input.submit:hover {
  background: #ebcbff;
  border: 2px solid #e58cff;
  }

#newsletter #content p {
  margin: 15px 0 0 0;
  padding: 0;
  text-align: center;
  width: 325px;
  }

#newsletter #content p a {
  text-decoration: none;
  color: #ca73ff;
  font-weight: bold;
  }

#newsletter #content p a:hover {
  text-decoration: underline;
  }

/* FOOTER
--------------------------------------------------------------------------------------- */

#footer {
  clear: both;
  background: #1e1e1e;
  color: #c7c7c7;
  padding: 1px 0 0 0;
  }

#footer h3 {
  margin: 0;
  padding: 17.5px 0 7.5px 0;
  font-size: 21px;
  font-weight: normal;
  letter-spacing: -1px;
  border-bottom: 1px solid #787878;
  }

#footer .spacer {
  background: url('img/site/bg-footer.jpg') repeat-y 0 0;
  clear: both;
  padding: 10px 0 0 0;
  padding-bottom: 40px; /* Min-padding */
  }

div.clublist {
  float: left;
  width: 504px;
  }

div.clublist ul {
  width: 504px;
  height: 155px;
  margin: 0;
  }

div.general-options {
  float: right;
  width: 250px;
  }

div.general-options ul {
  width: 250px;
  height: 155px;
  }

#footer ul li {
  border-bottom: 1px solid #787878;
  float: left;
  list-style: none inside;
  line-height: 30px;
  margin: 0;
  font-size: 12px;
  }

#footer ul li a {
  display: block;
  padding: 0;
  margin: 0;
  background: transparent;
  font-size: 12px;
  color: #c7c7c7;
  }

#footer ul li a:hover {
  background: #444;
  color: #00c6ff;
  }

#footer div.general-options ul li {
  width: 250px;
  }

#footer div.general-options ul li span.bookmark-icons a {
  display: inline;
  text-decoration: none;
  border: 0;
  }

#footer div.clublist ul li {
  width: 33.33%;
  }

.clear {
  clear: both;
  }