﻿/*CSS FOR CLHF PAGES*/

/*PUBLIC HOME PAGE*/
.block-container {
    display: flex;
    flex-wrap: wrap;
    gap: 12px; /*GAP BETWEEN BLOCKS*/
    margin-top: 1rem;
    margin-bottom: 1rem;
    align-items: stretch;
}

    .block-container .hero {
        background-image: url('https://cihq-clhf.org/images/bg-home-hands.png');
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        min-height: 200px;
        padding-bottom: 1rem;
        overflow: hidden;
    }

        .block-container .content-block {
            flex: 1 1 calc((100% - 12px) / 2); /*2 PER ROW, RESPONSIVE*/
            background-color: #ededed;
            border: 1px solid #ccc;
            font-size: 1rem;
            font-weight: 500;
            color: #333;
            border-radius: 0;
            box-sizing: border-box;
            height: auto;
            padding: 0;
        }

            .block-container .overlay {
                background-color: rgba(0, 0, 0, 0.6);
                z-index: 0;
            }

                .block-container .content-block .header {
                    background-color: #182945;
                    line-height: 1.3;
                    padding: 1rem;
        
                }

                    @media (max-width: 767.98px) {
                        .block-container  .content-block {
                            flex: 1 1 100%; /* 1 per row on phones */
                        }
                    }