.hs-product-catalog{margin:10px 10px 30px;}
.hs-product-catalog .request-info{display:block;text-align:right;font-size:1rem;color:inherit;}
.catalog-main-text {
    display:block;
    margin-bottom: 20px;
}
#catalog-category-overview {
    display: grid;
    grid-gap:20px;
    grid-template-columns: 1fr;
}
.catalog-category {
    display:block;
    text-align:center;
    padding: 20px;
    background: #000;
    transition: opacity 300ms;
}
.catalog-category:hover {
    opacity:0.8;
}
.catalog-category img {
    max-width:250px;
}
.catalog-category .category-name {
    margin-top:15px;
    color:#fff;
}
/* category page */
.category-page .catalog-category-info {
    display:grid;
    grid-template-columns: 1fr;
    grid-gap:30px;
    
}
.category-page .catalog-category-info img {
    width:100%;
    max-width: 600px;
    display:block;
    margin:0 auto;
}
.category-page .catalog-product-overview {
    display:grid;
    grid-template-columns:1fr;
    grid-gap:50px;
    justify-items: center;
}
.category-page .category-product {
    color:#333;
    display:inline-block;
    background:#fff;
    box-shadow: 0 0.03rem 0.06rem rgba(0,0,0,0.1),0 0.1rem 0.3rem rgba(0,0,0,0.1);
    transition: box-shadow 300ms;
    text-align:center;
    height:100%;
    position:relative;
    padding-bottom:70px;
    max-width:380px;
    box-sizing: border-box;
}
.category-page .category-product .product-name {
    font-size:1.4rem;
    font-weight:700;
    display:block;
    margin:20px 40px;
}
.category-page .category-product .product-excerpt {
    font-size:1.2rem;
    margin:10px 40px;
    text-align:left;
}
.category-page .category-product img {max-width: 380px;width:100%;}
.category-page .category-product .more-button{width:100%;display:block;background:#f9da03;font-size:16px;padding:1em 2em;font-weight:bold;position:absolute;bottom:0;left:0;transition:background-color 300ms,color 300ms;}
.category-page .category-product:hover {box-shadow: 0 0.1rem 0.2rem rgba(0,0,0,0.1),0 0.33rem 1rem rgba(0,0,0,0.15);}
.category-page .category-product:hover .more-button{background:#000;color:#fff;}
.category-page #request-container{margin-top:30px;}
.category-page #errorMess{display:none;opacity:0;}

/* product */
.catalog-product-page .product-head {
    display: grid;
    margin:25px 0 20px;
}
.catalog-product-page .product-head h1 {
    grid-area:headline;
    margin-top:0;
    font-size:3.2rem;
}
.catalog-product-page .product-main-image {
    width:100%;
    max-width:600px;
    grid-area:image;
}
.catalog-product-page .product-main-image img{width:100%;}
.catalog-product-page .product-text {
    grid-area:text;
}
.catalog-product-page .product-head .product-actions {
    grid-area:actions;
    margin:10px 0;
}
.category-page .request-category,
.category-page .send-request,
.catalog-product-page .request-product,
.request-catalog-products .send-request {
    padding:1em 2em;
    background: #f9da03;
    color:inherit;
    cursor: pointer;
    font-weight:700;
    margin-top: 20px;
    transition: all 300ms ease-out;
    border:none;
}
.category-page .request-category:hover,
.category-page .request-category:focus-visible,
.category-page .send-request:hover,
.category-page .send-request:focus-visible,
.catalog-product-page .request-product:hover,
.catalog-product-page .request-product:focus-visible,
.request-catalog-products .send-request:hover,
.request-catalog-products .send-request:focus-visible {
    background: #000;
    color:#fff;
}
.catalog-product-page .request-product-added {
    background: #eee;
    padding: 10px;
    margin: 10px 0;
    font-size: 0.9rem;
    -moz-box-shadow: 0px 0px 10px 2px #ccc;
    -webkit-box-shadow: 0px 0px 10px 2px #ccc;
    box-shadow: 0px 0px 10px 2px #ccc;
}
.catalog-product-page .request-product-added a {
    padding: 10px;
    background: #000;
    color: #fff;
    display: block;
    transition: background-color 300ms;
    width: fit-content;
}
.catalog-product-page .request-product-added a:hover {
    background:#555;
}
.catalog-product-page .additional_images {
    display:grid;
    grid-template-columns: 1fr;
    grid-gap:20px;
    margin: 50px 0;
}
.catalog-product-page .additional_images .additional-image img{max-width:600px;width:100%;}
.catalog-product-page #request-form{display:none;}
.require-field-hint{display:block;margin:20px 0;font-size:1.0rem;}
.request-message{text-align:center;padding:40px;margin:40px 5px;display:block;}
.request-successfull{background:#efe;color:#040;}
.request-successfull a{color:inherit;}
.request-error{background:#fee;color:#400;}
#requestForm .mailerror{display:block;color:#900;font-size:0.9rem;}

@media(max-width:768px) {
    .catalog-product-page .product-head {
        grid-template-columns:100%;
        grid-template-areas: "headline" "image" "text" "actions";
        grid-gap: 20px 0;
        justify-items: center;
    }
    .catalog-product-page .additional_images .additional-image img{
        display:block;
        margin:0 auto;
    }
    .catalog-product-page .request-product{
        display: block;
        margin: 0 auto;
    }
    .catalog-product-page .request-product-added a {
        margin: 5px auto;
    }
}
@media(min-width:600px){
    #catalog-category-overview,
    .category-page .catalog-product-overview {
        grid-template-columns: repeat(2,1fr);
    }

}
@media(min-width:769px) {
    .catalog-product-page .product-head {
        grid-template-columns:1fr 1fr;
        grid-template-areas: "image headline" "image text" "image actions";
        grid-gap: 0 20px;
        justify-items:left;
    }
    .category-page .catalog-category-info {
        grid-template-columns: 40% 60%;
    }
    .catalog-product-page .additional_images {
        grid-template-columns: repeat(2,1fr);
    }
    .catalog-product-page .request-product-added a {
        margin:5px 0;
    }
}
@media(min-width:1100px){
    #catalog-category-overview,
    .category-page .catalog-product-overview {
        grid-template-columns: repeat(3,1fr);
    }
}
