.row {
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -ms-flex-wrap: wrap; /* IE10 */
  flex-wrap: wrap;
  margin-left:10%;
	margin-right: 10%;
}

*.column, *.column2, *.column3 {
  box-sizing: border-box;
}



.column img, .column2 img, .column3 img {
  vertical-align: middle;
  height:100%;
  max-height:530px;
  object-fit: cover;
}


/* Create 3 equal columns that sits next to each other */
@media screen and (min-width: 1000px) {
	.column {
  -ms-flex: 33%; /* IE10 */
  flex: 33%;
  max-width: 33%;
  padding-right:30px;
  padding-left:0px;
}
.column2 {
  -ms-flex: 33%; /* IE10 */
  flex: 33%;
  max-width: 33%;
  padding-right:15px;
  padding-left:15px;
}
.column3 {
  -ms-flex: 33%; /* IE10 */
  flex: 33%;
  max-width: 33%;
  padding-right:0px;
  padding-left:30px;
}
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 1000px) and (min-width: 700px) {
  .column {
    -ms-flex: 50%;
    flex: 50%;
    max-width: 50%;
    padding-right:20px;
  }
  .column2 {
    -ms-flex: 50%;
    flex: 50%;
    max-width: 50%;
    padding-right:0px;
    padding-left:20px;
  }
  .column3 {
    -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
    padding:150px 0px 0px 0px;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 700px) {
  .column {
    -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
    padding:0px;
  }
  .column2 {
    -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
    padding:150px 0px 150px 0px;
  }
  .column3 {
    -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
    padding:0px;
  }
}

/*Products*/
*.products {
  box-sizing: border-box;
}



.products {
  vertical-align: middle;
  height:100%;
  max-height:530px;
  object-fit: cover;
}


/* Create 3 equal columns that sits next to each other */
@media screen and (min-width: 1200px) {
	.products {
  -ms-flex: 33%; /* IE10 */
  flex: 33%;
  max-width: 33%;
  padding-right:20px;
  padding-left:20px;
}
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 1200px) and (min-width: 950px) {

  .products {
    -ms-flex: 50%;
    flex: 50%;
    max-width: 50%;
    padding-right:20px;
    padding-left:20px;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 950px) {
  .products {
    -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
    padding:0px;
  }

}



/* Icons */
*.icon {
  box-sizing: border-box;
}

.icon img {
  vertical-align: middle;
  width: 75px;
  object-fit: cover;
  display: block;
  margin-left: auto;
  margin-right: auto;
}


/* Create 3 equal columns that sits next to each other */
@media screen and (min-width: 769px) {
	.icon {
  -ms-flex: 33%; /* IE10 */
  flex: 33%;
  max-width: 33%;
}

}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 769px) {
  .icon {
    -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
  }
}



/* Tearsheets */
*.tearsheet1, *.tearsheet2, *.tearsheet3, *.tearsheet4 {
  box-sizing: border-box;
}

.tearsheet1 img, .tearsheet2 img, .tearsheet3 img, .tearsheet4 img {
  vertical-align: middle;
  max-height:400px;
  object-fit: cover;
  display: block;
  margin-left: auto;
  margin-right: auto;
}


/* Create equal columns that sits next to each other */
@media screen and (min-width: 769px) {
.tearsheet1 {
  -ms-flex: 100%; /* IE10 */
  flex: 100%;
  max-width: 100%;
}
.tearsheet2 {
  -ms-flex: 50%; /* IE10 */
  flex: 50%;
  max-width: 50%;
  padding: 20px;
}
.tearsheet3 {
  -ms-flex: 33%; /* IE10 */
  flex: 33%;
  max-width: 33%;
  padding: 15px;
}
.tearsheet4 {
  -ms-flex: 25%; /* IE10 */
  flex: 25%;
  max-width: 25%;
  padding: 10px;
}
}





/* Responsive layout - makes the columns stack on top of each other instead of next to each other */
@media screen and (max-width: 769px) {
.tearsheet1, .tearsheet2, .tearsheet3, .tearsheet4 {
    -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
	padding-bottom: 100px;
  }
  .tearsheet1 img, .tearsheet2 img, .tearsheet3 img, .tearsheet4 img {
  vertical-align: middle;
  max-height:400px;
  object-fit: cover;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
}


/* Specials */
*.Specials {
  box-sizing: border-box;
}

.Specials img {
  vertical-align: middle;
  height:100%;
  max-height:400px;
  object-fit: cover;
}


/* Create 3 equal columns that sits next to each other */
@media screen and (min-width: 1200px) {
.Specials {
  -ms-flex: 33%; /* IE10 */
  flex: 33%;
  max-width: 33%;
  padding: 20px;
}

}

/* Create 2 equal columns that sits next to each other */
@media screen and (max-width: 1200px) {
.Specials {
     -ms-flex: 50%;
    flex: 50%;
    max-width: 50%;
    padding:20px;
  }
.Specials img {
  vertical-align: middle;
  height:100%;
  max-height:400px;
  object-fit: cover;
  padding-top: 100px;
}

}

/* Responsive layout - makes the columns stack on top of each other instead of next to each other */
@media screen and (max-width: 769px) {
.Specials {
     -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
    padding:0px;
	padding-bottom: 150px;
  }
  .Specials img {
  vertical-align: middle;
  height:100%;
  width:100%;
  max-height:400px;
  object-fit: cover;
  padding-top: 100px;
}
}


/* Saw Cuts */
*.SawCuts {
  box-sizing: border-box;
}

.SawCuts img {
  vertical-align: middle;
  max-height:400px;
  object-fit: cover;
  display: block;
  margin-left: auto;
  margin-right: auto;
}


/* Create 3 equal columns that sits next to each other */
@media screen and (min-width: 1200px) {
.SawCuts {
  -ms-flex: 33%; /* IE10 */
  flex: 33%;
  max-width: 33%;
  padding: 20px;
}

}

/* Create 2 equal columns that sits next to each other */
@media screen and (max-width: 1200px) {
.SawCuts {
     -ms-flex: 50%;
    flex: 50%;
    max-width: 50%;
    padding:20px;
  }


}




/* Responsive layout - makes the columns stack on top of each other instead of next to each other */
@media screen and (max-width: 769px) {
.SawCuts {
     -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
    padding:0px;
  }
  .SawCuts img {
  vertical-align: middle;
  max-height:400px;
  object-fit: cover;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
}



/* Colors */
*.color {
  box-sizing: border-box;
}

.color img {
  vertical-align: middle;
  max-height:400px;
  object-fit: cover;
  height:100%;
  width:100%;
}



/* Create equal columns that sits next to each other */
@media screen and (min-width: 1200px) {

.color {
  -ms-flex: 25%; /* IE10 */
  flex: 25%;
  max-width: 25%;
  padding: 10px;
}

}





/* Responsive layout - makes the columns stack on top of each other instead of next to each other */
@media screen and (max-width: 1200px) {
.color {
  -ms-flex: 50%; /* IE10 */
  flex: 50%;
  max-width: 50%;
  padding: 20px;
}

}

@media screen and (max-width: 769px) {
	.color {
    -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
	padding-bottom: 100px;
  }
}


/* European */
*.European {
  box-sizing: border-box;
}

.European img {
  vertical-align: middle;
  height:100%;
  width:100%;
  max-height:400px;
  object-fit: cover;
}


/* Create 3 equal columns that sits next to each other */
@media screen and (min-width: 1200px) {
.European {
  -ms-flex: 33%; /* IE10 */
  flex: 33%;
  max-width: 33%;
  padding: 30px;
}

}

/* Create 2 equal columns that sits next to each other */
@media screen and (max-width: 1200px) {
.European {
     -ms-flex: 50%;
    flex: 50%;
    max-width: 50%;
    padding: 30px;
  }
.European img {
  vertical-align: middle;
  height:100%;
  width:100%;
  max-height:400px;
  object-fit: cover;
  padding-top: 100px;
}

}




/* Responsive layout - makes the columns stack on top of each other instead of next to each other */
@media screen and (max-width: 769px) {
.European {
     -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
    padding:30px;
  }
  .European img {
  vertical-align: middle;
  height:100%;
  width:100%;
  max-height:400px;
  object-fit: cover;
  padding-top: 100px;
}
}