@charset "UTF-8";
/* CSS Document */
html, body {
  min-height: 100%;
}

body {
  /* Top padding makes room for the header bar */
  padding-top: 120px;
  /* Set as position parent */
  position: relative;
  color: #444444;
}
/*example of the target child selector - will give the header tag of the body element styling*/
body > header {
  position: absolute;
  top: 0; left: 0; right: 0;
  /* Must be matched with padding-top on the body */
  height: 64px;
}

body > footer {
  height: 64px;
  margin-top: 3.3333em;
  border-top: 1px solid rgb(230,230,230);
}

/* manage layers */

.site_wrap    { 
	z-index: 1; 
	margin:auto;
	width: 88%;
	max-width: 1200px;
	min-width: 292px;
	}
.site_header  { z-index: 2; }

.parallax-viewport {
    position: relative;     /* relative, absolute, fixed */
    overflow: hidden;
	width: 976px;
	/*max-width: 1200px;*/
	height: 300px;
	/*background-color: #aebcc9;*/
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-moz-box-shadow: 1px 1px 3px rgba(255,255,255,3);
	-webkit-box-shadow: 1px 1px 3px rgba(255,255,255,3);
	box-shadow: 1px 1px 3px rgba(230,255,255,3);
}
.parallax-layer {
    position: absolute;
	background:url(../images/artshop_pano/pano60_1925x400.jpg) 0 -100px;
}


/************************************************************************************
smaller than 1024px?
*************************************************************************************/
@media screen and (max-width: 1024px) {
    .parallax-viewport {display:none;}

}