/*  MAKE LAYOUT RESPONSIVE at 480px FOR IPHONE LANDSCAPE ============================================ */

header {
	width: 100%; /* 450px / 480px */
}

#maincontent {
	width: 100%; /* 450px / 480px */
}

.maincontent {
	width: 100%; /* 450px / 480px */
}

#footercontainer {
		background-size: 100% 150%;
	}

footer {
	width: 100%; /* 450px / 480px */
	font-size: 0.6em; /* 13 / 16 */
}

/*  GRID OF EIGHT TURNS INTO A GRID OF FOUR */

.span_8_of_8 {
	width: 100%;
	margin-left: 0;
}

.span_7_of_8 {
	width: 100%;
	margin-left: 0;
}

.span_6_of_8 {
	width: 100%;
	margin-left: 0;
}

.span_5_of_8 {
	width: 100%;
	margin-left: 0;
}

.span_4_of_8 {
	width: 100%;
	margin-left: 0;
}

.span_3_of_8 {
	width: 74.2%;
	margin: 1% 0 1% 3.2%;
}

.span_2_of_8 {
	width: 48.4%;
	margin: 1% 0 1% 3.2%;
}

.span_1_of_8 {
	width: 22.6%;
	margin: 1% 0 1% 3.2%;
}

.span_1_of_8:nth-child(4n+1) {
	clear: both;
	margin-left: 0;
}

/*  USER STYLES */

#jpreSlide {
	font-size: 0.5em;
	color: #ddd;
}

#maincontent h1 {
	font-size : 2.8em;
	padding: 10% 0 0 2%;
}

h2 {
	font-size: 1.4em; /* 40 / 16 */
}

#photoref h2 {
	font-size : 1em;
	padding: 1% 0 0 2%;
}

#pixelsS {display: inline-block;}
#pixelsXL, #pixelsL, #pixelsM {display: none;}

h3 {
	color: #fff;
}

#video h4 {
    font-size: .7em;
    max-width: 60%;
	}

  h4 {
    font-size: .7em;
  }

h5 {
	color: #777;
}

#impressum h5 {
  color: #bbb;
}

h6 {
	font-size: 75%;
}

.colcontainer {
		margin: 2% 0 3% 0;
	  -webkit-box-shadow: 0px 0px 12px rgba(0,0,0,.8)inset;
	  -moz-box-shadow: 0px 0px 12px rgba(0,0,0,.8)inset;
	  box-shadow: 0px 0px 12px rgba(0,0,0,.8)inset;
	}

#maincontentcontainer {
		-webkit-box-shadow: 0px 0px 5px rgba(0,0,0,.8)inset;
		-moz-box-shadow: 0px 0px 5px rgba(0,0,0,.8)inset;
		box-shadow: 0px 0px 5px rgba(0,0,0,.8)inset;
	}

#showcontent {
	padding-top: 5%;
}

#webcontent {
	padding-bottom: 15%;
}

#show, #gfx, #shirts, #web, #photo1, #photo2 {
	height: 120px;
	padding: 8px 0 8px 0;
}

#show img, #gfx img, #shirts img, #web img, #photo1 img, #photo2 img {
	height: 120px;
	width: auto;
}

.sliderinfo {
  float: right;
  font-size: 0.7em;
  color: #444;
  padding: 4px 4px 0 0;
}

#showref a, #video a, #videoclose2 a, #gfxref a, #shirtsref a, #printshopcontainer a, #webref a, #photoref a {
	font-size: 0.8em;
}

#videopen img, #videoclose1 img, #videoclose2 img, #printshopopen img, #printshopclose1 img, #printshopclose2 img {
	margin-bottom: 5px;
	width: 20px;
	height: 20px;
}

#video iframe {
	width: 280px;
	height: 158px;
}

#impressum {
	text-align: right;
	margin-left: 0;
	width: 60%;
	-webkit-box-shadow: 0px 0px 16px rgba(100,100,100,.8)inset;
	-moz-box-shadow: 0px 0px 16px rgba(100,100,100,.8)inset;
	box-shadow: 0px 0px 16px rgba(100,100,100,.8)inset;
}

#isdv {
		width: 60%;
}

#ihl {
  font-size: 100%;
  line-height : 0em;
}

#dse {
  font-size: 100%;
  line-height : 0em;
}

#impressum p {
	font-size: 0.5em;
	line-height: 1.2em;
	color: #666;
}

#impressum a:link, a:visited { color: #aaa; text-decoration: none; }
#impressum a:hover, a:active { color: #fff; text-decoration: none; }

.deskshop {
	display: none;
}

.touchshop {
	display: block;
}

#shopmobile {
	width: 100%;
	height: 170px;
	position: relative;
	padding: 8px 0 8px 0;
		-webkit-box-shadow: 0px 0px 16px rgba(100,100,100,.8)inset;
		-moz-box-shadow: 0px 0px 16px rgba(100,100,100,.8)inset;
		box-shadow: 0px 0px 16px rgba(100,100,100,.8)inset;
}

#shopmobile .faslider {
	width: 192px;
}

#falogo {
	width: 50%;
}

#bottomnav {
	clear: both;
}

#bottomnav ul {
	margin: 0;
	padding: 18px 0 12px 0;
}
#bottomnav li {
	text-align: left;
  padding: 0 0 12px 8px;
}

#bottomnav a:link, #bottomnav a:visited { color: #fff; text-decoration: none; text-shadow: 0 -1px 2px #000; zoom: 1; filter:DropShadow(color=#000, offx=0, offy=-1); /* IE Force hasLayout and Proprietary Filter */ }
#bottomnav a:hover, #bottomnav a:active { color: #000; text-decoration: none; text-shadow: 0 0 0px #fff; zoom: 1; filter:DropShadow(color=#fff, offx=0, offy=0); /* IE Force hasLayout and Proprietary Filter */ }


#smallprint {
		text-align: left;
		color: #888;
    padding-left: 8px;

}

#smallprint a:link, #smallprint a:visited { color: #444; text-decoration: none; }
#smallprint a:hover { color: #00f; text-decoration: none; }

#smlinxfooter {
	float: left;
	margin: 5px 0 0 1%;
}

a.hive, a.pi, a.ig, a.fb, a.tw {
	float: left;
	margin-right: 0;
	margin-left: 4px;
	font-size: 0;
}

.close {
	top: 8px;
	right: 8px;
}

div.scrollableArea img {
	padding-right: 8px;
}
