@charset "UTF-8";
/**
 * (en) base style for multilevel vertical menue
 * (de) Basisstil für Mehrstufiges Vertikales Menu
 *
 * @copyright       Copyright 2010, crossbase mediasolution GmbH
 * @version         1.0
 */

@media screen, projection
{

  .page_nav {
    height: 19px;
    padding: 6px 8px 0 0;
  }  

  .page_nav ul {
    font-family: 'FF Din Web Pro Medium', Verdana, sans-serif;
    font-size: 85.71%;
    list-style-type: none;
    position: relative;
    text-transform: uppercase;
    text-align: right;
    color: #808080;
  }

  .page_nav .item-left {
    float: left;
    margin: 0;
    padding: 0 0 0 10px;
  }  
  
  .page_nav .item-right, .page_nav .pipe {
    float: right;
    margin: 0;
    padding: 0 0 0 10px;
  }

  .page_nav li a {
    display: block;
    text-decoration: none;
  }

  .page_nav li a:hover {
    display: block;
    text-decoration: none;
  }  

  .page_nav li.active {
    width: 94%;
    padding: 3px 5% 3px 2%;
    color: #a1007b;
  }
  
  .pagenav-item {
    /*padding-left: 20px;*/
  }
  
  .pagenav-item i {
    font-size: 14px !important;
  }
  
  .user {
    background: url('icon-user.png') left top no-repeat;
    padding-left: 20px;
    padding-top: 2px;
  }

  .favorites {
    background: url('icon-favorites.png') left top no-repeat;
    padding-left: 20px;
    padding-top: 2px;
  }
  
  .cart {
    background: url('icon-cart.png') left top no-repeat;
    padding-left: 20px;
    padding-top: 2px;
  }  

  .logout {
    background: url('icon-logout.png') left top no-repeat;
    padding-left: 20px;
    padding-top: 2px;
  }

  .compare {
    background: url('icon-compare.png') left top no-repeat;
    padding-left: 20px;
    padding-top: 2px;
  }
  
}

  /*------------------------------------------------------------------------------------------------------*/
  /* (en) Media Query 850 */
  /* (de) Media Query 850 */
  /*------------------------------------------------------------------------------------------------------*/

@media screen and (max-width: 850px)
{

  .page_nav {
		height: auto;
		padding: 6px 8px 0 0;
		font-size: 1.2em;
  }  

  .page_nav .item-left {
    float: none;
    text-align: left;
  }

  .page_nav .item-right {
    float: left;
  }
  
  .page_nav .pipe {
    display: none;
  }
  
  #footer ul.page_nav_footer {
    display: block;
  }

}