Family Care Dental Clinic Pattern Library

HTML CODE

          
            <section id="thehero">
                <div class="the-inner">
                  <div class="container">
                    <div class="row">
                        <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                <h1>Your Complete Dental Care Clinic</h1>
                </div>
                </div>
                    <div class="row">
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                  <p>Extensive dental expertise, truly state-of-the-art clinic in Dapitan City. Family Care Dental Clinic embodies
                    all these, with clients guaranteed to experience and enjoy every such aspect with every
                     service. Owned and operated by <strong>Dr. Glenn Mohametano</strong> of Department of Education. Family Care Dental Clinic
                      is your hub for comprehensive and highly specialized dental treatments, such as cosmetic dentistry, 
                      TMJ, and periodontics, among others.</p>
                </div>
                </div>
                </div>
                </div>
                </section>
            
        

CSS CODE

        
        #thehero {
            width: 100vw;
                height: 100vh;
                display: flex;
                justify-content: flex;
                align-items: center;
                text-align: center;
                color: #fff;
                background-image: url(Images/todays-rdh-dental-instruments3.png);
                background-size: cover;
                background-position: center center;
                background-repeat: no-repeat;
                background-attachment: fixed;
            } 
            .the-inner {
                background-color: #96c789;
                opacity: 80%;
                width: 50vw;
                padding: 1rem;
                border-top-right-radius: 1rem;
                border-bottom-right-radius: 1rem;   
            }
            .the-inner h1{
            color: #000000;
            font-family: Helvetica, sans-serif;
            font-style: italic;
            font-weight: 400;
            line-height: 1.4;
            font-size: 2.1rem;
            }
            .the-inner p {
            color: black;
            text-align: left;
            font-size: 1.1rem;  
            }
            .the-inner a {
            color: #000000;
            }