html, body {
  font-family: 'Titillium Web', sans-serif;
  margin: 0;
  padding: 0;
  background-image: url(/images/bg6.png); }

.orthoColor {
  color: #81617e; }

.luxuryColor {
  color: #d3a73e; }

.basicColor {
  color: #749bc2; }

.comfortColor {
  color: #a64345; }

#innerwrapper {
  background-color: white;
  border-bottom: 2px dashed #F1F1F1; }

#wrapper {
  width: 1200px;
  margin: 0 auto;
  padding: 0 10px;
  border: 1px solid #DEDEDE;
  background-color: white;
  border-top-width: 0px; }
  @media screen and (max-width: 1200px) {
    #wrapper {
      width: 800px; } }
  @media screen and (max-width: 800px), screen and (max-device-width: 800px) {
    #wrapper {
      width: 480px; } }

#header {
  position: relative;
  width: 100%;
  font-weight: 200;
  font-family: 'Titillium Web', sans-serif; }
  #header #logo {
    position: absolute;
    top: 28px;
    margin: 0px;
    padding-left: 5px; }
    @media screen and (max-width: 1200px) {
      #header #logo {
        top: 30px; }
        #header #logo img {
          width: 280px; } }
    @media screen and (max-width: 800px), screen and (min-device-width: 320px) and (max-device-width: 480px) {
      #header #logo {
        width: 200px;
        margin-left: 50px;
        margin-top: 6px; } }
  #header .submenu {
    width: 100%;
    text-align: right;
    border-bottom: 0px solid #E5E5E5;
    height: 30px;
    font-size: 13px;
    font-weight: 300; }
    #header .submenu .active {
      color: #632317;
      font-weight: bold; }
    @media screen and (max-width: 1200px) {
      #header .submenu {
        font-size: 12px; } }
    @media screen and (max-width: 800px), screen and (min-device-width: 320px) and (max-device-width: 480px) {
      #header .submenu {
        font-size: 11px; } }
    #header .submenu ul {
      margin: 0 0px;
      padding: 0;
      list-style: none;
      float: right; }
      #header .submenu ul li {
        float: left;
        padding: 4px 10px;
        border-right: 1px dotted #E5E5E5; }
        #header .submenu ul li:last-child {
          border-width: 0px; }
  #header .menu {
    font-size: 18px;
    margin: 0 auto; }
    @media screen and (max-width: 1200px) {
      #header .menu {
        font-size: 16px; } }
    @media screen and (max-width: 800px), screen and (min-device-width: 320px) and (max-device-width: 480px) {
      #header .menu {
        font-size: 12px; } }
    #header .menu ul {
      float: right;
      margin: 0;
      padding: 0;
      list-style: none; }
      @media screen and (max-width: 800px), screen and (min-device-width: 320px) and (max-device-width: 480px) {
        #header .menu ul {
          margin-top: 50px;
          padding-right: 3px; } }
      #header .menu ul li {
        float: left;
        padding: 25px 15px;
        display: block; }
        @media screen and (max-width: 1200px) {
          #header .menu ul li {
            padding: 22px 10px; } }
        @media screen and (max-width: 800px), screen and (min-device-width: 320px) and (max-device-width: 480px) {
          #header .menu ul li {
            padding: 22px 8px; } }
        #header .menu ul li.start.active, #header .menu ul li.start:hover {
          background-color: white !important; }
          #header .menu ul li.start.active a, #header .menu ul li.start:hover a {
            color: black; }
        #header .menu ul li.balance.active, #header .menu ul li.balance:hover {
          background-color: #5f7b86 !important; }
          #header .menu ul li.balance.active a, #header .menu ul li.balance:hover a {
            color: white; }
        #header .menu ul li.luxury.active, #header .menu ul li.luxury:hover {
          background-color: #d3a73e !important; }
          #header .menu ul li.luxury.active a, #header .menu ul li.luxury:hover a {
            color: white; }
        #header .menu ul li.cuddly.active, #header .menu ul li.cuddly:hover {
          background-color: #afab8f !important; }
          #header .menu ul li.cuddly.active a, #header .menu ul li.cuddly:hover a {
            color: white; }
        #header .menu ul li.premium.active, #header .menu ul li.premium:hover {
          background-color: #000000 !important; }
          #header .menu ul li.premium.active a, #header .menu ul li.premium:hover a {
            color: white; }
        #header .menu ul li.ortho.active, #header .menu ul li.ortho:hover {
          background-color: #81617e !important; }
          #header .menu ul li.ortho.active a, #header .menu ul li.ortho:hover a {
            color: white; }
        #header .menu ul li.basic.active, #header .menu ul li.basic:hover {
          background-color: #749bc2 !important; }
          #header .menu ul li.basic.active a, #header .menu ul li.basic:hover a {
            color: white; }
        #header .menu ul li.comfort.active, #header .menu ul li.comfort:hover {
          background-color: #a64345 !important; }
          #header .menu ul li.comfort.active a, #header .menu ul li.comfort:hover a {
            color: white; }

.frame-width {
  margin: 0 auto;
  width: 1200px; }
  @media screen and (max-width: 1200px) {
    .frame-width {
      width: 800px; } }
  @media screen and (max-width: 800px), screen and (max-device-width: 800px) {
    .frame-width {
      width: 480px; } }

#logo {
  font-family: 'Titillium Web', sans-serif;
  font-weight: 900;
  font-size: 32px;
  margin-top: 15px;
  float: left; }

#trim {
  width: 100%;
  background-color: #D4D4D4;
  opacity: 0.8;
  height: 3px; }
  @media screen and (max-width: 1200px) {
    #trim {
      height: 2px; } }
  #trim.shaddow {
    border-bottom-width: 10px;
    -webkit-box-shadow: 0 4px 6px -6px #222;
    -moz-box-shadow: 0 4px 6px -6px #222;
    box-shadow: 0 4px 6px -6px #222; }
  #trim.basic {
    opacity: 1;
    background-color: #749bc2; }
  #trim.luxury {
    opacity: 1;
    background-color: #d3a73e; }
  #trim.comfort {
    opacity: 1;
    background-color: #a64345; }
  #trim.ortho {
    opacity: 1;
    background-color: #81617e; }
  #trim.cuddly {
    opacity: 1;
    background-color: #afab8f; }
  #trim.balance {
    opacity: 1;
    background-color: #5f7b86; }
  #trim.premium {
    opacity: 1;
    background-color: #000000; }

#product-image-front img {
  width: 100%; }

#product-name-front span {
  float: right;
  font-weight: bold;
  color: #B0B0B0; }
#product-name-front h1 {
  font-size: 54px;
  margin-left: 2px;
  margin-top: 10px;
  text-align: center; }

#product-front .line {
  font-weight: bold;
  color: #B0B0B0;
  text-align: center;
  margin-top: 10px; }
#product-front .name span {
  float: right;
  font-weight: bold;
  color: #B0B0B0; }
#product-front .name h1 {
  font-size: 54px;
  margin-top: 5px;
  text-align: center; }
#product-front .image img {
  width: 100%; }
#product-front .detail {
  font-size: 20px;
  text-align: center; }
  #product-front .detail .key {
    color: grey; }
#product-front .price {
  text-align: center;
  font-size: 24px; }
#product-front .variation {
  text-align: center;
  padding-bottom: 100px; }
  #product-front .variation span {
    border: 1px solid #CBC9C9;
    padding: 3px;
    font-size: 12px;
    display: inline-block; }

#product {
  position: relative; }
  #product .image {
    width: 600px;
    float: left; }
    @media screen and (max-width: 1200px) {
      #product .image {
        width: 400px; } }
    @media screen and (max-width: 800px), screen and (max-device-width: 800px) {
      #product .image {
        width: 460px;
        float: none;
        margin: 0 auto; } }
    #product .image img {
      width: 100%; }
      @media screen and (max-width: 800px), screen and (max-device-width: 800px) {
        #product .image img {
          margin-top: 40px; } }
  #product .name {
    margin-left: 600px;
    border-bottom: 2px dotted #DDDDDD; }
    @media screen and (max-width: 1200px) {
      #product .name {
        margin-left: 400px; } }
    @media screen and (max-width: 800px), screen and (max-device-width: 800px) {
      #product .name {
        margin-left: 0px;
        position: absolute;
        top: 10px;
        width: 100%; } }
    #product .name.left {
      margin-left: 0; }
    #product .name h1 {
      color: #8C8C8C;
      margin: 10px 10px 5px 10px;
      text-transform: uppercase;
      font-weight: 400;
      font-size: 36px; }
      @media screen and (max-width: 1200px) {
        #product .name h1 {
          font-size: 28px; } }
      @media screen and (max-width: 800px), screen and (max-device-width: 800px) {
        #product .name h1 {
          font-size: 22px; } }
    #product .name span.line {
      font-size: 14px;
      font-weight: 600;
      float: right;
      margin-right: 20px;
      color: #C6C6C6; }
      @media screen and (max-width: 1200px) {
        #product .name span.line {
          font-size: 12px; } }
      @media screen and (max-width: 800px), screen and (max-device-width: 800px) {
        #product .name span.line {
          font-size: 10px; } }
    #product .name.Basic {
      border-color: #C3D4E6; }
    #product .name.Ortho {
      border-color: #cfafcc; }
    #product .name.Comfort {
      border-color: #db8c8e; }
    #product .name.Luxury {
      border-color: #efd69a; }
    #product .name.Balance {
      border-color: #5f7b86; }
    #product .name.Luxury {
      border-color: #d4d1bd; }
    #product .name.Premium {
      border-color: #000000; }
  #product .detail {
    text-align: right;
    margin-left: 600px;
    padding: 30px 10px;
    font-size: 18px; }
    @media screen and (max-width: 1200px) {
      #product .detail {
        margin-left: 400px;
        font-size: 16px; } }
    @media screen and (max-width: 800px), screen and (max-device-width: 800px) {
      #product .detail {
        text-align: center;
        margin-left: 0;
        font-size: 18px; } }
    #product .detail.left {
      text-align: left;
      margin-left: 0; }
    #product .detail span.price {
      font-size: 28px;
      font-weight: bold;
      color: #B0B0B0; }
      @media screen and (max-width: 1200px) {
        #product .detail span.price {
          font-size: 24px; } }
      @media screen and (max-width: 800px), screen and (max-device-width: 800px) {
        #product .detail span.price {
          font-size: 18px; } }
    #product .detail span.variation {
      border: 1px solid #CBC9C9;
      padding: 3px;
      font-size: 12px;
      display: inline-block; }

a {
  color: #363636;
  text-decoration: none; }

.product-box {
  display: inline-block;
  overflow: auto;
  width: 365px;
  border: 1px solid #E3E3E3;
  padding: 5px;
  margin: 20px 10px 0;
  color: #BFBFBF; }
  .product-box.i2 {
    margin: 20px 15px 0px 15px;
    width: 546px;
    text-align: center; }
    @media screen and (max-width: 1200px) {
      .product-box.i2 {
        width: 365px;
        margin: 20px 10px 0; } }
    @media screen and (max-width: 800px), screen and (max-device-width: 800px) {
      .product-box.i2 {
        width: 450px; } }
    .product-box.i2 img {
      width: 70%;
      margin: 0 auto; }
  .product-box.i3 {
    width: 365px;
    margin: 20px 10px 0; }
    @media screen and (max-width: 1200px) {
      .product-box.i3 {
        width: 242px;
        margin: 10px 5px 0; } }
    @media screen and (max-width: 800px), screen and (max-device-width: 800px) {
      .product-box.i3 {
        width: 200px; } }
  @media screen and (max-width: 1200px) {
    .product-box {
      width: 242px;
      margin: 10px 5px 0; } }
  @media screen and (max-width: 800px), screen and (max-device-width: 800px) {
    .product-box {
      width: 450px; } }
  .product-box img {
    width: 100%; }
  .product-box div {
    text-align: center; }

@media screen and (max-width: 800px), screen and (max-device-width: 800px) {
  .more-products-text {
    text-align: center; } }

.alternative-product {
  display: inline-block;
  overflow: auto;
  width: 365px;
  border: 1px solid #E3E3E3;
  padding: 5px;
  margin-right: 20px;
  margin-top: 20px;
  color: #BFBFBF; }
  .alternative-product img {
    width: 100%; }
  .alternative-product div {
    text-align: center; }

/*# sourceMappingURL=default.css.map */