NJ Pediatric Law
The goal of Fronzuto Law's pediatric malpractice website is to provide current, relevant legal and medical information for pediatric and obstetric malpractice victims and their families across the United States.
This resource center was a completely new website build which required an appealing design to present articles in an easy-to-read format.
Skipping the Photoshop design process, an initial HTML/CSS mockup of the home page was presented to the client. After sign-off, the rest of the website was built out using Wordpress for the back-end system to allow for easy content management in the future.
Design outline
HTML Code
<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
<!-- ============== Basic Page Needs ============== -->
<meta charset="utf-8"/>
<title>NJ Pediatric Malpractice Attorneys | New Jersey Birth Injury Lawyers</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<!-- ================= Stylesheets ================ -->
<link rel="stylesheet" href="css/framework.css"/>
<link rel="stylesheet" href="css/plugins.css"/>
<link rel="stylesheet" href="css/theme.css"/>
</head>
<body class="no-js">
<!-- ======== Page Header ======== -->
<div class="top-bar">
<div class="row">
<div class="columns small-12 large-order-2 large-6">
<a href="#" class="button-contact"><i class="fa fa-envelope"></i> info@pediatricmalpractice.com</a>
<a href="#" class="button-contact small"><i class="fa fa-phone"></i> 123.456.7890</a>
<a href="#" class="button tiny">free case evaluation</a>
</div>
<div class="columns small-12 large-order-1 large-6">
<div class="page-navigation">
<div class="row">
<div class="small-12 columns">
<div class="mobile-nav">
<a id="menu-trigger" class="menu-trigger hide-for-medium" data-toggle="collapse" data-target="#nav-primary">
<i class="fa fa-bars"></i>
</a>
</div>
<nav id="main-nav" class="nav-primary">
<ul id="nav-primary" class="sm sm-clean closed horizontal">
<li>
<a href="#">About Us</a>
</li>
<li>
<a href="#">What we do</a>
<ul>
<li><a href="#">Pediatric Malpractice</a></li>
<li><a href="#">Birth Injuries</a></li>
</ul>
</li>
<li>
<a href="#">Reviews</a>
</li>
<li>
<a href="#">News</a>
</li>
<li>
<a href="#">Contact</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</div>
</div>
</div>
<header class="page-header">
<div class="row">
<div class="small-12 columns">
<h1 class="logo">
<a href="/">Pediatric Malpractice & Birth Injury <small>Resource Center</small></a>
<em>Presented by Fronzuto Law Group</em>
</h1>
</div>
</div>
</header>
<!-- END Page Header -->
<!-- ======== Page Body ======== -->
<!-- Page Banner -->
<div class="page-banner">
<div class="row">
<div class="small-8 medium-5 columns">
<div class="page-banner-content">
<h2>When things <strong>go wrong,</strong> <span><i>you have</i> rights</span></h2>
<p>
Find out about pediatric and obstetric malpractice, birth injuries and conditions that may result from medical
negligence involving your child, whether you may have grounds for a medical malpractice case, and what you can do next.
</p>
</div>
</div>
</div>
</div>
<!-- Page Intro -->
<div class="page-intro">
<div class="row">
<div class="small-12 medium-6 large-expand columns small-order-2 medium-order-2 large-order-1">
<div class="info-box-alpha">
<h5><a href="#">Birth Injury Guide</a></h5>
<p>Want to know more about birth injury types, signs and symptoms, risks factors, and how medical negligence may play a role?</p>
<figure><i class="fa fa-question" aria-hidden="true"></i></figure>
</div>
</div>
<div class="small-12 medium-12 large-7 columns small-order-1 medium-order-1 larg-order-2">
<div class="case-evaluation-form">
<form action="/" method="post">
<div class="row">
<div class="columns">
<h2><strong>Free</strong> Case Evaluation</h2>
</div>
</div>
<div class="row">
<div class="small-12 medium-6 columns">
<label>Full Name<em>*</em>
<input type="text"/>
</label>
<label>Email<em>*</em>
<input type="text"/>
</label>
<label>Phone
<input type="text"/>
</label>
</div>
<div class="small-12 medium-6 columns">
<label>Describe your case<em>*</em>
<textarea></textarea>
</label>
<input type="submit" class="button expanded" value="Get your answers"/>
</div>
</div>
<figure class="form-square"></figure>
</form>
</div>
</div>
<div class="small-12 medium-6 large-expand columns small-order-3 medium-order-3 large-order-3">
<div class="info-box-beta">
<h5><a href="#">Has your child suffered an injury?</a></h5>
<figure><img src="images/birthinjury2.png" alt=""/></figure>
<h5><a href="#">Questions about Pediatric Malpractice?</a></h5>
</div>
</div>
</div>
</div>
<!-- Page Section: Site Intro -->
<section class="page-section site-intro bgcolor-lightgrey">
<div class="row">
<div class="columns">
<h2>a comprehensive resource <strong>for Pediatric Malpractice & Birth Injury Victims</strong></h2>
<div class="row">
<div class="columns small-12 medium-expand text-justify">
<p>There are few things more devastating to a family than the injury or loss of a child. As parents, we feel responsible
for protecting our children from harm but sometimes, we need help. Whether you seek medical treatment because your
child is sick or they are just entering the world, you entrust them to the care of those capable of protecting their
health.</p>
<p>Unfortunately, doctors, medical professionals, and facilities can simply fail to fulfill their responsibilities. The
consequences of their negligence can be permanent and catastrophic. From <strong>birth injuries</strong> to <strong>
failure to diagnose conditions</strong> like meningitis, medical negligence involving infants and children
happens far too often. If your child has been injured as a result of <strong>pediatric or obstetric malpractice</strong>,
you may feel powerless.<em> You're not.</em></p>
</div>
<div class="columns small-12 medium-expand text-justify">
<p>First, you have a host of resources available, including this one. You can browse this site for information regarding
your child’s specific injury or condition, as well as the ways in which these injuries often occur. Second, as the
caregiver of a child who was the victim of medical negligence, the law is on your side. Whether your child was injured
during labor or delivery, or as a result of an anesthesia error, medical misdiagnosis, adverse medication reaction,
surgical error, or other gross failure to provide an acceptable standard of care, you can hold these negligent parties
accountable.</p>
<p>Complete the online contact form above or call the number above for a free consultation with an experienced attorney who
will discuss your specific pediatric or birth injury case and outline your legal options.</p>
</div>
</div>
</div>
</div>
</section>
<!-- Page Section: Practice Sections -->
<div class="practice-sections pediatric-malpractice">
<div class="row small-up-1 medium-up-2 large-up-3 expanded collapse">
<div class="columns">
<div class="practice-section ps1">
<div class="practice-section-inner">
<small>read about</small>
<h3>Pediatric Malpractice</h3>
<p>Doctors must provide an acceptable standard of care when examining, diagnosing, and treating children suffering from
illnesses and injuries, but children can be victims of medical negligence.</p>
<p><a href="#" class="button hollow light">view other areas</a></p>
</div>
</div>
</div>
<div class="columns">
<div class="practice-section ps2">
<div class="practice-section-inner">
<h3>Medical Misdiagnosis</h3>
<p>Your child's doctor is responsible for identifying the potential causes of their symptoms and accurately diagnosing
their condition.</p>
<p><a href="#" class="button secondary">read more</a></p>
</div>
</div>
</div>
<div class="columns">
<div class="practice-section ps3">
<div class="practice-section-inner">
<h3>Failure to Diagnose or Treat</h3>
<p>Pediatricians frequently fail to diagnose and treat childhood conditions with potentially catastrophic results for
children.</p>
<p><a href="#" class="button secondary">read more</a></p>
</div>
</div>
</div>
<div class="columns">
<div class="practice-section ps4">
<div class="practice-section-inner">
<h3>Cerebral Palsy</h3>
<p>Cerebral Palsy is a serious condition affecting movement, posture, and/or muscle tone. It may be caused by medical
negligence that leads to brain damage before, during, or after birth</p>
<p><a href="#" class="button secondary">read more</a></p>
</div>
</div>
</div>
<div class="columns">
<div class="practice-section ps5">
<div class="practice-section-inner">
<h3>Surgical Errors</h3>
<p>If a surgeon, anesthesiologist, or other medical professional made an error during surgery on your child, they may
have caused permanent damage to your child's growing body.</p>
<p><a href="#" class="button secondary">read more</a></p>
</div>
</div>
</div>
<div class="columns">
<div class="practice-section ps6">
<div class="practice-section-inner">
<h3>Urgent Care Negligence</h3>
<p>Did your child's doctor negligently prescribe them a medication? This may involve dosage errors, adverse drug
interactions, allergic reactions, and other medication errors.</p>
<p><a href="#" class="button secondary">read more</a></p>
</div>
</div>
</div>
</div>
</div>
<!-- Page Section: Testimonials -->
<div class="page-section page-section-reviews bgcolor-lightgrey">
<div class="row align-center">
<div class="columns medium-10">
<h2>What our readers say</h2>
<div class="quote-featured">
<blockquote>
<div class="rating">
<span>★</span><span>★</span><span>★</span><span>★</span><span>★</span>
</div>
<h4>The best of the best! 5.0 stars</h4>
Ernie is a gifted litigator who made our family feel comfortable and safe. He protected us every step of the way. Our
case was long and complicated and not only did Ernie learn about this rare condition, he became an expert! Having
someone that we could rely on and protect us the way that he did is unimaginable. We are extremely grateful and feel
fortunate that we found him.
</blockquote>
<cite>Mary Lou</cite>
</div>
</div>
</div>
</div>
<!-- Page Section: Practice Sections -->
<div class="practice-sections birth-injuries">
<div class="row small-up-1 medium-up-2 large-up-3 expanded collapse">
<div class="columns">
<div class="practice-section ps1">
<div class="practice-section-inner">
<small>read about</small>
<h3>Birth Injury</h3>
<p>Birth injury refers to any physical trauma that an infant suffers during the process of childbirth. These injuries
can result from a vast array of complications or errors during labor and delivery.</p>
<p><a href="#" class="button hollow alert">view other areas</a></p>
</div>
</div>
</div>
<div class="columns">
<div class="practice-section ps2">
<div class="practice-section-inner">
<h3>Risk Factors for Birth Injuries</h3>
<p>Your doctor must be aware of the factors that place your baby at an increased risk for injury and develop a plan of
action to ensure a successful birth.</p>
<p><a href="#" class="button secondary">read more</a></p>
</div>
</div>
</div>
<div class="columns">
<div class="practice-section ps3">
<div class="practice-section-inner">
<h3>How do Birth Injuries Happen?</h3>
<p>Birth injuries can occur for a variety of reasons but are often preventable. Learn about the ways in which medical
negligence can lead to a birth injury.</p>
<p><a href="#" class="button secondary">read more</a></p>
</div>
</div>
</div>
<div class="columns">
<div class="practice-section ps4">
<div class="practice-section-inner">
<h3>Hypoxic Ischemic Encephalopothy</h3>
<p>Hypoxic Ischemic Encephalopothy (HIE), also known as birth asphyxia or hypoxic brain injury, is a type of birth
injury resulting from oxygen deprivation.</p>
<p><a href="#" class="button secondary">read more</a></p>
</div>
</div>
</div>
<div class="columns">
<div class="practice-section ps5">
<div class="practice-section-inner">
<h3>Brachial Plexus Injury</h3>
<p>This type of birth trauma affects the network of nerves that controls movement in the shoulder, arm, wrist, hand, and
fingers. It may result from excessive force or other delivery errors.</p>
<p><a href="#" class="button secondary">read more</a></p>
</div>
</div>
</div>
<div class="columns">
<div class="practice-section ps6">
<div class="practice-section-inner">
<h3>Brain Bleed Birth Injury</h3>
<p>An intracranial hemorrhage occurs when an infant’s brain experiences bleeding before, during, or soon after birth.
There are different types depending on the location and severity of the bleeding.</p>
<p><a href="#" class="button secondary">read more</a></p>
</div>
</div>
</div>
</div>
</div>
<!-- Page Section: About Us -->
<div class="page-section about-us bgcolor-lightgrey pb-0">
<div class="row align-center">
<div class="columns medium-10">
<h2>About Us</h2>
<p>If your baby or child is suffering from a medical condition, the questions you have may be overwhelming. What medical
conditions are associated with my child's symptoms? What caused my child's medical condition? Was the doctor responsible
for my child's injury? And if so, how can I pursue the compensation necessary to care for a child with a serious medical
condition? We understand, the questions can seem infinite and you may not know where to turn. Our goal is to provide a
virtual guidebook where you can access the medical and legal information you need during this incredibly challenging time.
We are constantly adding to this resource center to provide current and extensive information about conditions that may
result from pediatric and obstetric malpractice, as well as legal rights and remedies for those who have suffered injuries
resulting from medical negligence.</p>
<p>Our commitment is simple: we are here to help you. Our highly experienced attorneys have tackled some of the most complex
pediatric malpractice and birth injury cases, ranging from <a href="#">Cerebral Palsy</a> to brain injuries and rare
conditions such as Craniosynostosis and Plagiocephaly. We are dedicated to educating victims and families about the
different types of birth injuries and pediatric conditions, signs that an injury may have occurred, potential causes of
these injuries, ways they can be diagnosed and treated, and the legal avenues available to birth injury and pediatric
malpractice victims.</p>
<img src="images/img1.png" alt="" class="about-us-img"/>
</div>
</div>
</div>
<div class="page-section choose-us">
<div class="row align-center">
<div class="columns small-12 medium-6">
<div class="question-list-container content-box">
<h2>Get your specific questions answered by completing our contact form</h2>
<ul>
<li>
<h4>How do I know if my child has a pediatric malpractice case?</h4>
<p>If your child suffered an injury, complications, or a medical condition resulting from medical negligence,
you may have grounds for a pediatric malpractice or birth injury lawsuit. <a href="#">Learn more</a>.</p>
</li>
<li>
<h4>How can I get help to pay for my child's medical bills?</h4>
<p>If a doctor, nurse, hospital, or other healthcare provider failed to provide adequate care for your child
and they suffered harm, you can pursue compensation for medical expenses, pain and suffering, and more.
<a href="#">Find out about damages</a>.</p>
</li>
<li>
<h4>How long do I have to file a pediatric malpractice claim?</h4>
<p>The statute of limitations to file a medical malpractice lawsuit varies from state to state. The time limits
may begin when your child's condition is identified, not necessarily when it occurred. Contact us for
information that applies to your child's specific case.</p></li>
</ul>
</div>
</div>
<div class="columns small-12 medium-6">
<div class="content-box">
<form class="choose-us-form">
<h2>Get in touch.</h2>
<div class="row">
<div class="medium-6 columns">
<div class="form-field">
<label>First Name<em>*</em></label>
<input type="text"/>
</div>
</div>
<div class="medium-6 columns">
<div class="form-field">
<label>Last Name<em>*</em></label>
<input type="text"/>
</div>
</div>
</div>
<div class="row">
<div class="medium-6 columns">
<div class="form-field">
<label>Email<em>*</em></label>
<input type="text"/>
</div>
</div>
<div class="medium-6 columns">
<div class="form-field">
<label>Phone<em>*</em></label>
<input type="text"/>
</div>
</div>
</div>
<div class="row">
<div class="small-12 columns">
<div class="form-field">
<label>Your Message</label>
<textarea></textarea>
</div>
<input value="Send Message" class="button secondary" type="submit"/>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- Page Section: Recent Posts -->
<div class="page-section recent-posts">
<div class="row">
<div class="small-12 columns">
<h2>Latest News</h2>
<div class="row" data-equalizer>
<div class="small-12 medium-4 columns">
<div class="recent-post" data-equalizer-watch>
<div class="recent-post-image">
<img src="images/blog1.jpg" alt=""/>
</div>
<div class="recent-post-header">
<div class="blog-entry-time">
<time class="entry-date published" datetime="2017-10-17T23:45:08+00:00">
<span class="day">17</span>
<span class="month">Oct</span>
</time>
</div>
</div>
<div class="recent-post-content">
<h5><a href="#">Why the Size of Your Baby’s Head Matters for Cerebral Palsy Risk</a></h5>
<p>The size of your baby’s head, also known as head circumference, may be an important factor in predicting brain
damage and cerebral palsy, new...</p>
<a class="more" href="#">read more</a>
</div>
</div>
</div>
<div class="small-12 medium-4 columns">
<div class="recent-post" data-equalizer-watch>
<div class="recent-post-image">
<img src="images/blog2.jpg" alt=""/>
</div>
<div class="recent-post-header">
<div class="blog-entry-time">
<time class="entry-date published" datetime="2017-10-17T23:45:08+00:00">
<span class="day">17</span>
<span class="month">Oct</span>
</time>
</div>
</div>
<div class="recent-post-content">
<h5><a href="#">Our NJ Attorneys Recover $14.5 Million for Young Boy with Brain Injury</a></h5>
<p>Our attorneys regularly represent victims who suffer childhood brain injuries caused by defective products. In
one such case, we recovered $14.5 million for a...</p>
<a class="more" href="#">read more</a>
</div>
</div>
</div>
<div class="small-12 medium-4 columns">
<div class="recent-post" data-equalizer-watch>
<div class="recent-post-image">
<img src="images/blog3.jpg" alt=""/>
</div>
<div class="recent-post-header">
<div class="blog-entry-time">
<time class="entry-date published" datetime="2017-10-17T23:45:08+00:00">
<span class="day">17</span>
<span class="month">Oct</span>
</time>
</div>
</div>
<div class="recent-post-content">
<h5><a href="#">How Infant Strokes Affect the Brain</a></h5>
<p>If your child suffered a stroke during labor and delivery or soon after birth, it is invaluable to understand
the potential effects of these...</p>
<a class="more" href="#">read more</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- END Page Body -->
<!-- ======== Page Footer ======== -->
<footer class="page-footer">
<div class="row">
<div class="small-12 medium-4 columns">
<div class="footer-block">
<h5>Pediatric Malpractice Guide</h5>
<p>Our intention is to provide current and relevant information to pediatric malpractice and birth injury victims and their
caregivers. If you believe your child may have a medical malpractice claim, we assist clients in Bergen County, Essex
County, Morris County, Somerset County, Passaic County, Hudson County, Middlesex County, throughout New Jersey and New
York, and across the U.S.</p>
<ul class="list-contact">
<li><a href="#"><i class="fa fa-fw fa-map-marker"></i> 45 Bleeker Street Newark, New Jersey 07102</a></li>
<li><a href="#"><i class="fa fa-fw fa-phone"></i> 123.456.7891</a></li>
</ul>
</div>
</div>
<div class="small-12 medium-4 columns">
<div class="footer-block">
<h5>Practice Areas</h5>
<ul class="list-links">
<li><a href="#">Birth Injuries</a></li>
<li><a href="#">Birth Injury Risk Factors</a></li>
<li><a href="#">Signs and Symptoms of a Birth Injury</a></li>
<li><a href="#">Pediatric Malpractice</a></li>
<li><a href="#">Pediatric Misdiagnosis</a></li>
<li><a href="#">Pediatric Failure to Diagnose or Treat</a></li>
<li><a href="#">Pediatric Medication Errors</a></li>
<li><a href="#">Cerebral Palsy Lawyers</a></li>
<li><a href="#">Hypoxic ischemic encephalopathy (HIE)</a></li>
<li><a href="#">Damages for Birth Injury and Pediatric Malpractice</a></li>
</ul>
</div>
</div>
<div class="small-12 medium-4 columns">
<div class="footer-block">
<h5>Contact Us</h5>
<ul class="list-social">
<li><a href="#"><i class="fa fa-fw fa-facebook"></i> Facebook</a></li>
<li><a href="#"><i class="fa fa-fw fa-twitter"></i> Twitter</a></li>
<li><a href="#"><i class="fa fa-fw fa-youtube"></i> Youtube</a></li>
<li><a href="#"><i class="fa fa-fw fa-linkedin"></i> Linkedin</a></li>
</ul>
</div>
<div class="footer-block">
<h5>Disclaimer</h5>
<p>The information provided on this site is not, nor is it intended to be, legal advice. Consult an attorney for advice
regarding your individual situation. We invite you to contact us and welcome your calls.</p>
</div>
</div>
</div>
<!-- Page Bottom -->
<div class="row">
<div class="small-12 columns">
<div class="page-bottom">
<div class="row">
<div class="small-12 medium-6 columns">
©Copyright Medical Malpractice
</div>
<div class="small-12 medium-6 columns">
<ul class="list-inline">
<li><a href="#">Terms</a></li>
<li><a href="#">Sitemap</a></li>
<li><a href="#">Privacy Policy</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</footer>
<!-- END Page Footer -->
<!-- ================= Scripts ================ -->
<script src="js/jquery.js"></script>
<script src="js/plugins.min.js"></script>
<script src="js/scripts.js"></script>
</body>
</html>
Partial SCSS Code
/* ==> Case Evaluation Form */
.case-evaluation-form {
background: rgba($primary-color,1);
color: #fff;
margin: -40px 0 110px;
padding: 30px 20px 90px;
position: relative;
&:before {
background: repeating-linear-gradient(
45deg,
rgba(0, 0, 0, 0.2),
rgba(0, 0, 0, 0.2) 10px,
rgba(0, 0, 0, 0.3) 10px,
rgba(0, 0, 0, 0.3) 20px
);
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
height: 10px;
width: 100%;
}
h2 {
text-transform: uppercase;
font-weight: 300;
strong {
font-weight: 700;
}
}
label {
color: #fff;
font-style: italic;
margin-bottom: 1em;
em {
color: #f0a165;
}
}
input[type="text"],
textarea {
background: rgba(255, 255, 255, 0.3);
border: 0;
}
input[type="submit"] {
background: $dark-gray;
letter-spacing: 1px;
margin-top: 46px;
&:hover {
background: $color-brand3;
color: #000;
}
}
textarea {
height: 120px;
}
.form-square {
@include background-cover;
background-image: url('images/bg4.jpg');
border: 16px solid #fff;
position: absolute;
width: 120px;
height: 120px;
bottom: -130px;
margin-left: -60px;
left: 50%;
right: 0;
z-index: 10;
-webkit-transform: translateY(-50%) rotate(45deg);
-moz-transform: translateY(-50%) rotate(45deg);
-ms-transform: translateY(-50%) rotate(45deg);
-o-transform: translateY(-50%) rotate(45deg);
transform: translateY(-50%) rotate(45deg);
//box-shadow: 0px 0px 60px -10px rgba(139, 139, 139, 0.5);
}
}
@include breakpoint(medium) {
.case-evaluation-form {
margin-bottom: 40px;
padding-bottom: 70px;
h2 {
font-size: 1.625em;
}
}
}
@include breakpoint(large) {
.case-evaluation-form {
margin-bottom: 20px;
}
}
/* ==> Info Box */
.info-box-alpha {
background: #fff;
border: 1px solid rgba($primary-color,0.5);
font-size: 14px;
margin-top: -15px;
margin-bottom: 70px;
position: relative;
padding: 20px 20px 65px;
p {
margin-bottom: 0;
}
figure {
background: #496870;
border-radius: 50%;
padding: 10px;
height: 80px;
width: 80px;
position: absolute;
bottom: -40px;
border: 8px solid #fff;
left: 50%;
margin-left: -40px;
text-align: center;
color: #fff;
font-size: 65px;
line-height: 65px;
}
}
@include breakpoint(medium) {
.info-box-alpha {
margin-bottom: 35px;
}
}
/* ==> Intro Blurb */
.info-box-beta {
background: #496870;
margin-top: -20px;
margin-bottom: 15px;
position: relative;
text-align: center;
&:before {
background: #fff;
content: '';
display: block;
position: absolute;
left: 0;
top: 50%;
margin-top: -4px;
height: 8px;
width: 100%;
}
figure {
background: $color-brand2;
border: 8px solid #fff;
border-radius: 50%;
padding: 10px;
margin-top: -50px;
margin-left: -50px;
position: absolute;
left: 50%;
top: 50%;
width: 100px;
}
h5 {
margin: 0;
}
h5 a {
color: #fff;
display: block;
font-size: 16px;
padding: 27px 10px 66px;
transition: all 200ms ease;
min-height: 140px;
&:hover {
background: $color-brand2;
}
}
figure + h5 a {
background: $primary-color;
padding-top: 66px;
padding-bottom: 27px;
}
}
@include breakpoint(xlarge) {
.info-box-beta {
h5 a {
padding-left: 20px;
padding-right: 20px;
}
}
}
/* ==> Page Section: Site Intro */
.site-intro {
h2 {
color: $color-brand1;
font-size: 1em;
font-weight: 700;
line-height: 1.5em;
margin-bottom: 3em;
margin-top: 20px;
text-align: center;
text-transform: uppercase;
strong {
color: $dark-gray;
font-family: $font-family-serif;
font-weight: 700;
font-size: 1.6em;
display: block;
line-height: 1.2em;
text-transform: none;
}
}
h2 + p {
font-size: 1.1875em;
margin-bottom: 50px;
text-align: center;
}
h4 {
font-size: 1.25em;
font-weight: 700;
text-transform: uppercase;
}
}
@include breakpoint(medium) {
.site-intro {
h2 {
font-size: 1.25em;
}
}
}
/* ==> Page Section: Practice Sections */
.practice-sections {
h3 {
margin-bottom: 0.3em;
}
.columns:first-child {
small {
color: $primary-color;
display: block;
font-family: Georgia, serif;
font-size: 1em;
font-style: italic;
margin-bottom: 5px;
}
h3 {
border-bottom: 3px double #ccc;
border-top: 3px double #ccc;
padding-right: 35px;
position: relative;
&:before {
color: $primary-color;
font-family: 'FontAwesome';
line-height: 1.3em;
display: block;
position: absolute;
content: '\f178';
right: 0;
bottom: 0;
}
}
}
.columns:nth-child(n+2) {
color: #fff;
}
}
.practice-sections {
.practice-section {
height: 100%;
padding: 30px;
position: relative;
&:before {
background: $primary-color;
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}
&.ps1 {
background: #fff;
&:before { display: none; }
}
}
.practice-section-inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
height: 100%;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: relative;
}
}
.pediatric-malpractice {
@include background-cover;
background-image: url(images/bg5.jpg);
.ps2:before { background: rgba($primary-color,0.9); }
.ps3:before { background: rgba(saturate($primary-color, 10%),0.9); }
.ps4:before { background: rgba(saturate($primary-color, 20%),0.9); }
.ps5:before { background: rgba(saturate($primary-color, 30%),0.9); }
.ps6:before { background: rgba(saturate($primary-color, 40%),0.9); }
}
.birth-injuries {
@include background-cover;
background-image: url(images/bg8.jpg);
.ps2:before { background: rgba(desaturate($color-brand2, 40%),0.9); }
.ps3:before { background: rgba(desaturate($color-brand2, 30%),0.9); }
.ps4:before { background: rgba(desaturate($color-brand2, 20%),0.9); }
.ps5:before { background: rgba(desaturate($color-brand2, 10%),0.9); }
.ps6:before { background: rgba($color-brand2,0.9); }
.columns:first-child {
small {
color: $color-brand2;
}
h3:before {
color: $color-brand2;
}
}
}
@include breakpoint(medium) {
.practice-sections {
.columns {
height: 350px;
}
}
}
/* ==> Page Section: Testimonials */
.page-section-reviews {
color: $color-brand1;
text-align: center;
}
.quote-featured {
.rating {
background: #f4f4f4;
color: $color-brand3;
display: inline-block;
font-style: normal;
font-size: 30px;
line-height: 1em;
position: absolute;
top: -18px;
left: 0;
right: 0;
margin: 0 auto;
width: 150px;
}
h4 {
color: $dark-gray;
font-family: $font-family-serif;
font-weight: 700;
}
blockquote {
border: 3px double #ccc;
font-style: italic;
margin-bottom: 55px;
margin-top: 15px;
padding: 25px 20px 50px;
position: relative;
text-align: center;
&:before {
background: $color-brand1;
border: 8px solid #fff;
border-radius: 50%;
box-shadow: 0px 4px 0px 0px #e5e5e5;
color: #fff;
font-family: 'FontAwesome';
font-size: 57px;
font-style: normal;
line-height: 65px;
padding: 10px;
text-align: center;
position: absolute;
content: '\f007';
height: 80px;
width: 80px;
bottom: -40px;
left: 50%;
margin-left: -40px;
}
}
cite {
color: $color-brand1;
font-size: 1em;
&:after {
content: " —";
}
}
}
/* ==> Page Section: About Us */
.about-us {
text-align: center;
p:last-of-type {
margin-bottom: 50px;
}
.about-us-img {
margin: 0 auto;
max-width: 500px;
width: 100%;
}
}
/* ==> Page Section: Recent Posts */
.recent-post {
border: 3px double #e1e2e2;
margin-bottom: 30px;
padding: 15px;
.recent-post-image {
margin: -15px -15px 15px;
figure {
@include background-cover;
height: 200px;
max-width: 370px;
}
}
.more {
display: block;
font-weight: 700;
}
h5 {
line-height: 1.3em;
margin-bottom: 0.4em;
}
p {
margin-bottom: 0;
}
.blog-entry-time {
background: $primary-color;
color: #fff;
float: left;
margin-right: 15px;
text-align: center;
width: 55px;
.month {
display: block;
background: $secondary-color;
}
.day {
font: 700 35px/1em $font-family-condensed;
display: block;
padding: 10px 5px;
}
}
}