
/* ---- grid ---- */

.grid {
	background: black;
	max-width: 1200px;
	margin: auto;
	padding-top: 50px;
}

/* clear fix */
.grid:after {
  content: '';
  display: block;
  clear: both;
}

/* ---- .grid-item ---- */

.grid-sizer-portfolio,
.grid-item-portfolio {
  width: 33.333%;
}

.grid-item-portfolio {
  float: left;
  padding:15px;
}

.grid-sizer-menu,
.grid-item-menu {
  width: 50%;
}

.grid-sizer-menu-min,
.grid-item-menu-min {
  width: 33.333%;
}

.grid-item-menu,
.grid-item-menu-min {
  float: left;
  padding:18px;
}

.grid-sizer-pano,
.grid-item-pano {
  width: 50%;
}

.grid-item-pano {
  float: left;
  padding: 15px;
}

.grid-item-portfolio img,
.grid-item-menu img,
.grid-item-menu-min img,
.grid-item-pano img {
  display: block;
  max-width: 100%;
  border-style: solid;
  border-width: 1px;
  border-color: white;
}

/*###################################*/
@media (max-width: 899px){
/*###################################*/
.grid-sizer-portfolio,
.grid-item-portfolio {
  width: 50%;
}

.grid-item-pano {
  padding: 8px;
}

.grid-sizer-menu-min,
.grid-item-menu-min {
  width: 50%;
}

}

/*###################################*/
@media (max-width: 699px){
/*###################################*/

.grid-sizer-menu,
.grid-item-menu,
.grid-sizer-pano,
.grid-item-pano {
  width: 100%;
}


.grid-sizer-menu-min,
.grid-item-menu-min {
  width: 50%;
}

.grid-item-menu,
.grid-item-menu-min {
  padding:10px;
}

.grid-item-portfolio {
	padding: 10px;
}

.grid-item-pano {
  padding: 4px;
}

}


/*###################################*/
@media (max-width: 499px){
/*###################################*/

.grid-item-portfolio {
	padding: 4px;
}

}