/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
  #Site Styles
  #Page Styles
  #Media Queries
  #Font-Face */

/* #Site Styles
================================================== */

/* #Page Styles
================================================== */

/* #Media Queries
================================================== */
  @media only screen and (min-width: 1279px) {
    #superContainer header, #superContainer #steuer { left:0; }
    #storeadd { right:140px; }
    #service { background-color:rgba(255, 255, 255, 0); }
  }

  @media only screen and (min-width: 1279px) and (max-width: 1291px) {
    nav ul { padding-left:5px; }
  	#storeadd { right:70px; }
  	.newsitems .offset-by-two { margin-left:0; }
    #service { background-color:rgba(255, 255, 255, 0); }
  }
  
  @media only screen and (min-width: 959px) and (max-width: 1279px) {
    #service { background-color:rgba(255, 255, 255, 0); }
    h1, h1.lauftext, h2, .artistlist, h2.lead, h3 { font-size: 40px; line-height: 40px; margin:0; padding:0; }
    p.alt, p.artist, .alt { font-size: 20px; line-height:24px; }
    .artikel.item>img { width:220px; }
    p.lead { font-size:18px; line-height:22px; }
		.news h3 { font-size:32px; line-height:32px; margin-bottom:4px; }
		.news h3:first-child { margin-top:40px; }
		.news .alt { font-size:20px; line-height:24px; }
		.news .artistnews { margin:4px 0 0; }
		.item { min-height:260px; }
    .item .itemhover p.lead { font-size: 18px; }
    .container .itemhover.columns { left:-8px; }
    .itemtable { font:11px/17px Geneva, "MS Sans Serif", sans-serif; letter-spacing:0.02em; }
    .itemtable td.l { width:78px; letter-spacing:0.07em;}
    .container .offset-by-three { padding-left: 178px; }
    .container .thirteen.columns { width: 762px; }
    #cartcrumb.five.columns { width:400px; }
    .item { height:255px; }
    li, li ul li { line-height: 21px; margin-bottom: 0.5em; }
    .artistlist li { margin-bottom:0.3em; }
    #cart-table img { width: 134px; }
    #promocode { width: 116px; }
  	#storeadd { right:3px; }
  	.newsitems .offset-by-two { padding-left:0; }
    .newsitems .twelve.columns { width:940px; }
    .newsitems .six.columns { width:460px; }
  }

  /* Smaller than standard 960 (devices and browsers) */
  @media only screen and (max-width: 959px) {
    body { font: 16px/21px gandlreg, Arial, sans-serif; }
    #service { background-color:rgba(255, 255, 255, 0.7); }
    h1, h1.lauftext, h2, .artistlist, h2.lead, h3 { font-size: 34px; line-height: 34px; margin:0; padding:0; }
    h1.lauftext, h3 { margin-bottom:10px; }
    nav ul, #artistmenu ul, #cart h1, p.alt, p.artist, .alt, h2.thema { font-size: 21px; line-height:24px; }
    footer div { position:static; font-size:11px; }
    #footernav { display:block; }
    .unten { padding-bottom:150px; }
    li, li ul li { line-height: 21px; margin-bottom: 0.5em; }
    .artistlist li { margin-bottom:0.25em; }
    #footernav li { margin-bottom:0; line-height:16px; }
    .artistnews { padding-left:0;  margin:12px 0; }
  	#storeadd { right:0; }
  	.newsitems li a:hover { border-bottom:0 !important; }
  }

  /* Tablet Portrait size to standard 960 (devices and browsers) */
  @media only screen and (min-width: 768px) and (max-width: 959px) {
    body { font: 16px/21px gandlreg, Arial, sans-serif; /*overflow:hidden;*/ }
    h1, h1.lauftext, h2, .artistlist, h2.lead, h3 { font-size: 40px; line-height: 40px; margin:0; padding:0; }
    h1.lauftext, h3 { margin-bottom:10px; }
		h1.logotype { font-size:60px; line-height:60px; letter-spacing:0.01em; margin-bottom:18px; }
		h2.subline { font-size:44px; line-height:44px; }
    nav ul, #artistmenu ul, #cart h1, p.alt, p.artist, .alt, h2.thema { font-size: 20px; line-height:24px; }
    nav ul#mainnav { display:none; }
    #filter { margin-top:-20px; text-align:center; }
    #filter li { display:inline; padding:0 10px; }
    #steuer { position:relative; }
    #collection-overview.oben { margin-top: 130px; }
    .container nav.three.columns { width:768px; }
    .current:hover #artistmenu { display:none; }
    #navTrigger { display:inline-block; margin:11px 14px 0 10px; float:left; }
    #cartcrumb.five.columns { width:325px; }
    #cartcrumb.offset-by-three { padding-left:0; margin-left:44px; }
    header #service { z-index:3; background:#fff url(/img/dotline.png) 0 bottom repeat-x; top:0; padding:6px 0 0; overflow:hidden; width:768px; }
    header li#basket { margin-right:10px; }
    #service .storelogo { margin-left:10px; }
    #basket a:hover #basket-info { display:none !important; }
    #collection-overview.offset-by-three { padding-left:45px; }
    #collection-overview.thirteen.columns { width:680px; }
    .container .eight.columns  { width: 556px; }
    .container .offset-by-four { padding-left: 96px; }
    footer div { position:absolute; }
    .unten { padding-bottom:150px; }
    li, li ul li { line-height: 21px; margin-bottom: 0.5em; }
    .item { width:50%; margin-bottom:0; }
    .item>img, .item p { display:none; }
    .item .itemhover p { display:block; }
    .container article .itemhover.columns { display:block; position:static; top:0; left:0; height:450px; }
    .container article:nth-child(odd) .itemhover.columns { margin-left:-10px; }
    .container article:nth-child(even) .itemhover.columns { float:right; margin-right:-5px; }
    #collection-overview .four.columns { width:87%; }
    .itemtable { font:11px/17px Geneva, "MS Sans Serif", sans-serif; letter-spacing:0.02em; }
    .itemtable td.l { width:78px; letter-spacing:0.07em;}
    .unten div { margin-bottom: 65px; }
    #cart main.thirteen.columns.offset-by-three { width:768px; padding-left:0; }
    #cart main.thirteen.columns.offset-by-three .eight { width:480px; }
    #cart-table img { width: 140px; }
    #promocode { width: 130px; }
    #cart-login-form .four { width:364px; }
    #account-form .four, #shipping-address .four { width:220px; }
    #cart aside.five.columns { margin-left:0; width:258px; }
    #aside-table .valright { display:block; float:none; margin-bottom:4px; }
    #cart aside .subtotal br, #cart aside .tec.upc br { display:none; } 
    #sharebutton { margin-top:0 !important; }
  	.logocontent { padding-top:90px; }
  	.newsitems .offset-by-two { padding-left:0; }
    .newsitems .twelve.columns { width:748px; }
    .newsitems .six.columns { width:364px; }   
  	#storeadd { top:100px; }
  	.newsitems article { min-height:280px; }
  	.newsitems article p, .newsitems article small { font-size:28px; line-height:28px; }
  	.newsitems article .titversal, .newsitems .bx-caption { font-size:44px; line-height:44px; }
  }

  /* All Mobile Sizes (devices and browser) */
  @media only screen and (max-width: 767px) {
    body { font: 16px/21px gandlreg, Arial, sans-serif; }
    nav ul#mainnav { display:none; }
    nav { top:60px; }
    #filter { margin-top:0; text-align:center; }
    #filter li { display:inline; padding:0 10px; }
    #steuer { position:relative; }
    .current:hover #artistmenu, #storeadd { display:none; }
    #navTrigger { display:inline-block; margin:11px 12px 0 2px; z-index:11 !important; float:left; }
    #service .storelogo { margin-left:0; }
    #service .storelogo span, #service #nl { display:none; }
    header #service { z-index:3; background:transparent url(/img/dotline.png) 0 bottom repeat-x; top:0; padding:6px 0 0; overflow:hidden; }
    header li#basket { margin-top:8px; margin-right:6px; margin-bottom:4px; clear:right; }
    header li { margin-top:7px; }
    header li a { border-bottom:2px solid transparent; }
    #superContainer header li, #superContainer header li#basket { margin-top:0; }
    #superContainer #navTrigger { margin:10px 0 0 5px; }
    header li { margin-left:4px; }
  	header li#sharetop span { display:none; }
  	header li#sharetop img { margin-right:0; padding-right:4px; } 
    header li#search { width:24px; position:relative; }
    header li#search form  { position:absolute; z-index: 10000; right:0; display:none; width:275px; margin:1px 0 0; background:#ffff2e url(/img/search.png) right 10px no-repeat;}
		header li#search:hover form { display:block;  }
		header li#search form input { font: 18px/24px gandlreg, Arial, sans-serif; letter-spacing: 0.05em; color:#000; background-color:#ffff2e; border:0; padding:2px 4px; width:220px; margin:6px 0 0 6px; } 
		header li#search form input:focus { border:0; color: #000; -moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none; }
		header li#search ul { background-color:#fff; overflow:hidden; margin:0; }
		header li#search li { float:left; clear:left; width:100%; margin-left:0; margin-bottom:0; padding:8px 10px; background:transparent url(/img/dotline.png) 0 bottom repeat-x; }
		header li#search li:last-of-type { background:none; }
		header li#search li span { display:block; }

    #basket a:hover #basket-info { display:none !important; }
     header li { margin-top:0; margin-left:17px; }
    header li#basket { background:url(/img/basket_mob.png) 0 0 no-repeat; margin:0 6px 4px 12px; }
    header li#basket:hover, header li#basket.aktiv { background: url("/img/basket_mob.png") no-repeat scroll -104px 0 rgba(0, 0, 0, 0); }
   
    header #cartcrumb { top:40px; left:0; z-index:1; }
    header #cartcrumb li { width:auto; margin:0 15px 0 0; }
    header #cartcrumb li:first-child { margin-left:0; }
		h1.logotype { font-size:52px; line-height:52px; letter-spacing:0.01em; margin-bottom:14px; }
		h2.subline { font-size:38px; line-height:38px; }
		.news h3 { font-size: 18px; line-height: 18px; }
		.news h3:first-child { margin-top:40px; }
		.news .alt { font-size: 14px; line-height: 14px; }
		.news .artistnews { width:55%; margin:4px 0; }
		#fullPage-nav span, .fullPage-slidesNav span { height: 9px !important; width: 9px !important; }
		#fullPage-nav li, .fullPage-slidesNav li { margin: 0 7px 6px !important; }
    .controlArrow { visibility:hidden; }
   .nono img { display:block; margin:0 auto 20px; }
   #backlink { top:20px; }
   .mob img, .mobtxt h2, .mobtxt p { display:block; }
   .mobtxt a.button, .six .button { display:block; }
   .mobtxt img, .mob h2, .mob p, .mob .button { display:none; }
   .six .button { width:38px; margin:0 auto 45px; }
    h2, .artistlist, h3 { font-size: 34px; line-height: 34px; margin:0; padding:0; }
    h2.product { text-align:center; }
    p.alt, p.artist, .alt { font-size: 18px; line-height:22px; }
    .five figure { margin:0 auto 20px; display:inline-block; }
    #section1 .seven.offset-by-one figure { display:none; }
    #section1 h3 { margin-bottom:12px; }
    .eight { padding-bottom:35px; }
    footer div { position:static; padding-top:80px; }
    .unten { padding-bottom:150px; }
    #collection-overview.oben { margin-top:30px; }
    .oben, .standard, .obennewsletter { padding-top:95px; margin-top:30px; min-height:450px; }
   .right { text-align:left; }
    h1 + .oben { padding-top:0; }
    #cart-table img { width:85%; }
    li, li ul li { line-height: 18px; margin-bottom: 0.5em; }
    .artistlist li { margin-bottom:0.25em; }
    .item { width:70%; margin-bottom:0; }
    .item>img, .item p { display:none; }
    .item .itemhover p { display:block; }
    .container article .itemhover.columns { display:block; position:static; top:0; left:0; height:auto; margin:0 0 20px 48px; }
    .container .four.columns { width:100%; }
    .itemtable { font:11px/17px Geneva, "MS Sans Serif", sans-serif; letter-spacing:0.02em; }
    .itemtable td.l { width:78px; letter-spacing:0.07em;}
    .unten div { margin-bottom: 65px; }
    #collection-item { position:static !important; }
    .bx-wrapper { margin-top:95px !important; }
    .bx-wrapper .bx-controls-direction a { display:none; }
    .newsitems .bx-wrapper { margin-top:0 !important; }
		#login-form input#username[type="text"], #login-form input#emailaddress[type="text"], #login-form input#pwd[type="password"] { margin-bottom: 9px; padding: 5px 5px 5px; }
	  #backlink { display:none; }
  	.logocontent { padding-top:90px; }
  	h2.subline { margin-bottom:75px; }
  	.newsitems article { min-height:300px; margin-bottom:25px !important; }
  	.newsitems article p, .newsitems article small { font-size:35px; line-height:35px; }
  	.newsitems article .titversal, .newsitems .bx-caption { font-size:49px; line-height:49px; }
	}

  /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
  @media only screen and (min-width: 480px) and (max-width: 767px) {
  }

  /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
  @media only screen and (max-width: 479px) {
		h1.logotype { font-size:42px; line-height:42px; letter-spacing:0.01em; margin-bottom:18px; }
		h2.subline { font-size:32px; line-height:32px; }
    .item { width:80%; margin-bottom:0; }
    #service .storelogo { font-size:18px; margin-top:0; }
    #navTrigger { margin-top:12px; margin-left:3px; }
    #service .storelogo { margin-right:4px; }
    header li { margin-top:0; margin-left:8px; }
    header li#basket { background:url(/img/basket_mob.png) 0 0 no-repeat; margin:0 6px 4px 8px; }
    header li#basket:hover, header li#basket.aktiv { background: url("/img/basket_mob.png") no-repeat scroll -104px 0 rgba(0, 0, 0, 0); }
    nav { top:55px; }
    .container article .itemhover.columns { margin:0 0 20px 15px; }
    .five figure { margin:0 0 20px; display:block; }
    #login-form input#username[type="text"], #login-form input#emailaddress[type="text"], #login-form input#pwd[type="password"] { width:auto; }
  	.newsitems article { min-height:230px; }
  	.newsitems article p, .newsitems article small { font-size:25px; line-height:25px; }
  	.newsitems article .titversal, .newsitems .bx-caption { font-size:33px; line-height:33px; }
  }


/* #Font-Face
================================================== */
/*   This is the proper syntax for an @font-face file
    Just create a "fonts" folder at the root,
    copy your FontName into code below and remove
    comment brackets */

  @font-face {
    font-family: 'gandlreg';
    src: url('/css/fonts/gandl-webfont.eot');
    src: url('/css/fonts/gandl-webfont.eot?#iefix') format('embedded-opentype'),
         url('/css/fonts/gandl-webfont.woff') format('woff'),
         url('/css/fonts/gandl-webfont.eot') format('truetype'),
         url('/css/fonts/gandl-webfont.svg') format('svg');
  }
  
  @font-face {
    font-family: 'gandlitalic';
    src: url('/css/fonts/gandlitalic-webfont.eot');
    src: url('/css/fonts/gandlitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('/css/fonts/gandlitalic-webfont.woff') format('woff'),
         url('/css/fonts/gandlitalic-webfont.eot') format('truetype'),
         url('/css/fonts/gandlitalic-webfont.svg') format('svg');
  }

