/* ################################################### WIDTH 1500px ################################################### */
@media only screen and (max-width: 1500px){
    
.materials_gallery_item {
width: 25%;
}
/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 30px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 30px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 22px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 16px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 16px;
    line-height: 145%;
}
}

/* ################################################### WIDTH 1250px ################################################### */
@media only screen and (max-width: 1250px){
    
#load_more, .link_back{
width: 270px;
}

/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 30px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 30px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 22px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 16px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 16px;
    line-height: 145%;
}
}

/* ################################################### WIDTH 1150px ################################################### */
@media only screen and (max-width: 1150px){
    
#detail_content_img:hover, #detail_content_img:active{
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
-webkit-box-shadow: none;
box-shadow: none;
}

#detail_content_img:hover + .detail_content_img_desc, #detail_content_img:active + .detail_content_img_desc{
padding-top:10px 
}
/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 30px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 30px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 22px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 16px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 16px;
    line-height: 145%;
}
}

/* ################################################### WIDTH 1100px ################################################### */
@media only screen and (max-width: 1100px){
    
.materials_gallery_item {
width: 33.333%;
}
/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 30px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 30px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 22px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 16px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 16px;
    line-height: 145%;
}
}

/* ################################################### WIDTH 1060px ################################################### */
@media only screen and (max-width: 1060px){
    
#materials_gallery{
width: 100%;
}

#detail_content_img{
width: 95%;
}

.slick-prev, .slick-next{
bottom:-50px;
top: auto;
padding: 0px;
}

.slick-prev{
left: 0px;
background-position: left 10px center;
}

.slick-next{
right: 0px;
background-position: right 10px center;
}
/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 30px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 30px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 22px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 16px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 16px;
    line-height: 145%;
}
}

/* ################################################### WIDTH 1000px ################################################### */
@media only screen and (max-width: 1000px){

.content {
width: 95%;
}

#materials_filter{
width: 100%;
}

#materials_filter.filter_fix{
width:calc(100% - 30px);
left: 15px;
margin-left: 0px;
}

#cart_items_wrapper .col65{
float: left;
width: 65%;
}

#cart_items_wrapper .cart_item_image {
height: 151px;
overflow: hidden;
}

.cart_item_image img {
max-width: inherit;
height: 100%;
width: auto;
}

#cart_items_wrapper .col30{
float: right;
width: 30%;
margin-top: 0px;
}

#slider {
width: calc(95% + 20px);
}

.slick-prev{
left: 15px;
background-position: left center;
}

.slick-next{
right: 15px;
background-position: right center;
}

.filter_space {
width: 3%;
}

.filter_wrapper {
width: 20%;
}

 .filter_wrapper2 {
width: 31%;
}

.filter_wrapper2 > #show.button_center {
width: calc(45% - 30px);
}

.filter_wrapper2 > #reset.button_center {
width: calc(45% - 30px);
}

/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 30px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 30px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 22px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 16px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 16px;
    line-height: 145%;
}
}

/* ################################################### WIDTH 800px ################################################### */
@media only screen and (max-width: 800px){

#wishlist_content_wrapper li a {
width: 22px;
}
/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 29px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 29px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 22px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 16px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 16px;
    line-height: 145%;
}
}

/* ################################################### WIDTH 750px ################################################### */
@media only screen and (max-width: 750px){
    
.col65, .col30{
width: 100%;
float: none;
}

.col30{
margin-top: 30px;
}
    
.cart_item {
height: auto;
}
    
#cart_items_wrapper .col65{
float: none;
width: 100%;
}

#cart_items_wrapper .cart_item_image {
height: auto;
overflow: inherit;
}

.cart_item_image {
width: 45%;
}

.cart_item_image img {
max-width: 100%;
height: auto;
}

.cart_item_content {
width: 50%;
}

#cart_items_wrapper .col30{
float: none;
width: 100%;
height: auto;
margin-top: 30px;
}

.cart_button_wrapper {
position: static;
bottom: auto;
}

#form_spam input {
width: calc(100% - 149px);
}
/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 29px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 29px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 22px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 16px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 16px;
    line-height: 145%;
}
}

/* ################################################### WIDTH 700px ################################################### */
@media only screen and (max-width: 700px){
    
.materials_gallery_item {
width: 50%;
}
  
.filter_wrapper,
.filter_wrapper2 {
width: 47%;
margin-bottom: 20px;
}
  
.filter_space {
width: 6%;
}
.filter_space:nth-child(4) {
width: 0%;
}
/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 29px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 29px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 22px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 16px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 16px;
    line-height: 145%;
}
}

/* ################################################### WIDTH 650px ################################################### */
@media only screen and (max-width: 650px){

#wishlist_button{
    margin-top:0px;
    margin-left: 15px;
}

/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 26px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 26px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 24px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 15px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 15px;
    line-height: 145%;
}
}

/* ################################################### WIDTH 600px ################################################### */
@media only screen and (max-width: 600px){

#wishlist_button{
    margin-top:2px;
}

/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 26px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 26px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 24px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 15px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 15px;
    line-height: 145%;
}

}

/* ################################################### WIDTH 550px ################################################### */
@media only screen and (max-width: 550px){
    
.fs30 {
font-size: 20px;
}

.pt50 {
padding-top: 20px;
}

.filter_wrapper, .filter_wrapper2, .filter_space {
float: none;
width: 100%;
}

.filter_space {
height: 0px;
}

#load_more{
width: 240px;
margin: 30px auto 0px;
}

.link_back{
width: 240px;
}

#detail_content_img {
height: auto;
overflow: inherit;
}

.cart_item_content .fs22{
font-size: 20px;
}
/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 26px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 26px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 24px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 15px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 15px;
    line-height: 145%;
}

}

/* ################################################### WIDTH 500px ################################################### */
@media only screen and (max-width: 500px){

#detail_content td{    
display: table-cell;
}

#detail_content td:first-child{
width: 55%;
padding: 6px 5% 6px 0px;
}

#details tr:first-child td, #more_details tr:first-child td {
padding: 6px 8% 6px 0px;
}
    
.cart_item {
margin-bottom: 60px;
}

.cart_item_image, .cart_item_content{
float: none;
}
    
.cart_item_image {
width: 100%;
}

.cart_item_content {
width: 100%;
margin-top: 30px;
}

.cart_item_content table {
margin-top: 15px;
}

.cart_button_wrapper .mt20 {
margin-top: 15px;
}

#cart_items_buttons a {
width: 100%;
float: none;
}

  
#form_inputs input#zip_id{
width:30%;
margin-right:2%;
margin-bottom:10px;
float: left;
}
#form_inputs input#city_id{
width:64%;
margin-bottom:10px;
float: right;
}
  
#cart_items_buttons a:nth-child(2) {
margin: 15px 0%;
}

#form_spam_terms {
margin-top: 10px;
}
    
form input[type="submit"], form input[type="reset"] {
margin-top: 30px;
}

/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 26px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 26px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 24px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 15px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 15px;
    line-height: 145%;
}
#searchItem{
    width: 400px;
    height: 80px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -40px 0px 0px -200px;
}
	
}

/* ################################################### WIDTH 450px ################################################### */
@media only screen and (max-width: 450px){
    
.materials_gallery_item {
width: 100%;
}
/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 26px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 26px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 23px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 15px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 15px;
    line-height: 145%;
}
#searchItem{
    width: 340px;
    height: 80px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -40px 0px 0px -170px;
}
    
#searchItem .form input{
    font-size: 18px;
}
  
}

/* ################################################### WIDTH 400px ################################################### */
@media only screen and (max-width: 400px){
    
#wishlist_content {
width: 290px;
}

#wishlist_content_wrapper li p {
width: 65%;
overflow: hidden;
text-overflow: ellipsis;
display: block;
float: left;
white-space: nowrap;
}
#wishlist_content_wrapper li a {
width: auto;
overflow: hidden;
}

#form_terms input[type="checkbox"] + label p {
width: calc(100% - 47px);
}

/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 24px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 24px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 22px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 14px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 14px;
    line-height: 145%;
}
	
}

/* ################################################### WIDTH 320px ################################################### */
@media only screen and (max-width: 360px){
    
#slider {
width: 100%;
margin-left: 0px;
}
#wishlist_content_wrapper li a {
min-height: 8px;
}
	
/* ______________________________ H1 ______________________________ */
.din_bold_30, h1 {
    font-size: 24px;
    line-height: 120%;
}

/* ______________________________ H2 ______________________________ */
.din_light_30, h2 {
    font-size: 22px;
    line-height: 120%;
}

/* ______________________________ H3 ______________________________ */
.din_bold_22, h3 {
    font-size: 18px;
    line-height: 120%;
}

/* ______________________________ H4 ______________________________ */
.din_bold_16, h4, h5, h6 {
    font-size: 14px;
    line-height: 120%;
}

/* ______________________________ P ______________________________ */
.content-segment p{
    font-size: 14px;
    line-height: 145%;
}
    


}
