Cards
Grouped content
Cards Sample(s):
Information Card Header
Medical Malpractice Insurance
<a href="" class="no-underline">
<div class="c_product-card-img-container c_product-card-img">
<h3>Medical Malpractice Insurance</h3>
<div class="c_product-card-img-placement">
<svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icons-icon-product-1"></use></svg>
</div>
</div>
</a>Information Card Vertical
Medical Malpractice Insurance
The Cinch Professional Protection – Healthcare product provides medical malpractice coverage for advanced practice and allied health medical professionals, as well as for students. Our Professional Protection – Healthcare product allows you to choose from a range of limits, provides defense expense coverage in addition to the limits of insurance, and gives you the option to add extra coverage parts, including general liability and Medicare/Medicaid reimbursement for self-employed customers. We also offer convenient payment plans. Plus, there are no deductibles or additional fees, and we welcome applicants of all experience levels.
Medical Malpractice Insurance
The Cinch Professional Protection plan offers professional liability insurance—also known as errors and omissions & insurance—for professionals across a range of fields, including real estate, financial planning, consulting, and insurance. We offer deductible options qualified payment plans, and flexible limits to suit your needs. Plus, there are no hidden service or association fees and no caps on annual earnings. You can also add general liability coverage for a more comprehensive solution.
<section class="c_product-card-wrapper c_product-card-border">
<div class="c_product-card-container">
<a href="" class="no-underline">
<div class="c_product-card-img-container c_product-card-img">
<h3>Medical Malpractice Insurance</h3>
<div class="c_product-card-img-placement">
<svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icons-icon-product-1"></use></svg>
</div>
</div>
</a>
<div class="c_product-card-body">
<p>The Cinch Professional Protection – Healthcare product provides medical malpractice coverage for advanced practice and allied health medical professionals, as well as for students. Our Professional Protection – Healthcare product allows you to choose from a range of limits, provides defense expense coverage in addition to the limits of insurance, and gives you the option to add extra coverage parts, including general liability and Medicare/Medicaid reimbursement for self-employed customers. We also offer convenient payment plans. Plus, there are no deductibles or additional fees, and we welcome applicants of all experience levels.</p>
</div>
<div class="c_button-wrapper">
<div class="c_button-base">
<a href="#" class="btn btn-secondary">Learn More</a>
</div>
</div>
</div>
<div class="c_product-card-container">
<a href="" class="no-underline">
<div class="c_product-card-img-container c_product-card-img">
<h3>Medical Malpractice Insurance</h3>
<div class="c_product-card-img-placement">
<svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icons-icon-product-2"></use></svg>
</div>
</div>
</a>
<div class="c_product-card-body">
<p>The Cinch Professional Protection plan offers professional liability insurance—also known as errors and omissions & insurance—for professionals across a range of fields, including real estate, financial planning, consulting, and insurance. We offer deductible options qualified payment plans, and flexible limits to suit your needs. Plus, there are no hidden service or association fees and no caps on annual earnings. You can also add general liability coverage for a more comprehensive solution.</p>
</div>
<div class="c_button-wrapper">
<div class="c_button-base">
<a href="#" class="btn btn-secondary">Learn More</a>
</div>
</div>
</div>
</section>Information Card Horizontal
Coming Soon...
We plan to offer Business Owners Coverage for small businesses including property insurance for buildings and their contents, crime, employee dishonesty, fiduciary coverage, and business interruption, which covers the loss of income resulting from a fire or other catastrophe that disrupts the operation of your business.
<section class="c_product-card-wrapper c_product-card-border">
<div class="c_product-card-horiz-container c_product-card-horiz-img-container">
<a href="" class="no-underline">
<div class="c_product-card-img-container c_product-card-img">
<h3>Medical Malpractice Insurance</h3>
<div class="c_product-card-img-placement">
<svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icons-icon-product-3"></use></svg>
</div>
</div>
</a>
<div class="c_button-learn-more-desktop">
<a href="#" class="btn btn-secondary">Learn More</a>
</div>
</div>
<div class="c_product-card-horiz-container c_product-card-horiz-body-container">
<div class="c_product-card-body">
<h4>Coming Soon...</h4>
<p>We plan to offer Business Owners Coverage for small businesses including property insurance for buildings and their contents, crime, employee dishonesty, fiduciary coverage, and business interruption, which covers the loss of income resulting from a fire or other catastrophe that disrupts the operation of your business.</p>
</div>
<div class="c_button-learn-more-mobile">
<a href="#" class="btn btn-secondary">Learn More</a>
</div>
</div>
</section>
Icon Cards
Save time and money
We’ve built professional and small business insurance with digital-age ease and efficiency, so you can enjoy significant cost and time savings.
Stellar Financial Strength
We’re part of Berkshire Hathaway Specialty Insurance, so you get the security of a top-rated insurer and a brand name you trust.
The protection you need
We offer simply customizable, contemporary coverage, so you’re protected against today’s risks, with limits and enhancements right for you.
<section class="c_card-vertical-value-props">
<div class="c_card-vertical-wrapper">
<div class="c_card-vertical-container">
<div class="c_card-img-container">
<svg class="c_card-icon fill-mint-100">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icons-time-money"></use>
</svg>
</div>
<div class="c_card-vertical-body">
<h3>Save time and money</h3>
<p>We’ve built professional and small business insurance with digital-age ease and efficiency, so you can enjoy significant cost and time savings.</p>
</div>
</div>
<div class="c_card-vertical-container">
<div class="c_card-img-container">
<svg class="c_card-icon fill-mint-100">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icons-berkshire-hathaway"></use>
</svg>
</div>
<div class="c_card-vertical-body">
<h3>Stellar Financial Strength</h3>
<p>We’re part of Berkshire Hathaway Specialty Insurance, so you get the security of a top-rated insurer and a brand name you trust.</p>
</div>
</div>
<div class="c_card-vertical-container">
<div class="c_card-img-container">
<svg class="c_card-icon fill-mint-100">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icons-lightbulb"></use>
</svg>
</div>
<div class="c_card-vertical-body">
<h3>The protection you need</h3>
<p>We offer simply customizable, contemporary coverage, so you’re protected against today’s risks, with limits and enhancements right for you.</p>
</div>
</div>
</div>
</section>
To use in Landing Page Layout:
<div class="c_card-vertical-container">...
<svg class="c_card-icon fill-cyan-100"><use></use></svg>
</div>Summary Card
Policy Summary
Limits of Liability (Per Claim / Aggregate)
$500,000 / $1,000,000
Deductible
$5,000
Coverage Dates
9/1/2017 - 9/1/2018
<div class="c_card mt-0">
<h2 class="c_card-header">
Policy Summary
</h2>
<div class="c_card-content">
<p class="card-content-text">Limits of Liability (Per Claim / Aggregate) </p>
<p class="card-content-value">
<strong>$500,000 / $1,000,000</strong>
</p>
<p class="card-content-text">Deductible</p>
<p class="card-content-value">
<strong>$5,000</strong>
</p>
<p class="card-content-text">Coverage Dates</p>
<p class="card-content-value">
<strong>9/1/2017 - 9/1/2018</strong>
</p>
</div>
</div>Article Cards
Flexible length excerpt vivamus hendrerit arcu sed erat molestie vehicula. Sed auctor neque eu tellus rhoncus ut eleifend.
Flexible length excerpt vivamus hendrerit arcu sed erat molestie vehicula. Sed auctor neque eu tellus rhoncus ut eleifend.
Flexible length excerpt vivamus hendrerit arcu sed erat molestie vehicula. Sed auctor neque eu tellus rhoncus ut eleifend.
Flexible length excerpt vivamus hendrerit arcu sed erat molestie vehicula. Sed auctor neque eu tellus rhoncus ut eleifend.
Image Dimensions
| Size (px) | Resolution | Compression | Ideal Raw File Size |
|---|---|---|---|
| 1200 x 800 | 72dpi | 50% | < 200KB |
<section class="l_card-grid">
<div class="c_summary-card">
<div class="c_summary-card-image">
<a href="#">
<picture>
<source media="(min-width: 768px)" srcset="https://source.unsplash.com/300x200?nature,
https://source.unsplash.com/600x400?nature 2x" />
<source media="(min-width: 300px)" srcset="https://source.unsplash.com/96x96?nature,
https://source.unsplash.com/192x192?nature 2x" />
<img alt="" src="https://source.unsplash.com/300x200?nature" srcset="https://source.unsplash.com/300x200?nature,
https://source.unsplash.com/600x400?nature 2x" />
</picture>
</a>
</div>
<div class="flex flex-col flex-grow">
<div class="c_summary-card-content">
<div class="w-full h-full flex flex-col">
<a href="#" class="flex">
<h2></h2>
</a>
</div>
</div>
<div class="c_summary-card-desktop">
<p>Flexible length excerpt vivamus hendrerit arcu sed erat molestie vehicula. Sed auctor neque eu tellus rhoncus ut eleifend.</p>
</div>
<div class="flex lg:mt-auto">
<div class="tags text-right lg:ml-auto">
<a href="#" class="tag">#inspiration</a>
<a href="#" class="tag">#education</a>
</div>
</div>
</div>
</div>
</section>Guide Cards
Flexible length excerpt vivamus hendrerit arcu sed erat molestie vehicula. Sed auctor neque eu tellus rhoncus ut eleifend.
Flexible length excerpt vivamus hendrerit arcu sed erat molestie vehicula. Sed auctor neque eu tellus rhoncus ut eleifend.
Flexible length excerpt vivamus hendrerit arcu sed erat molestie vehicula. Sed auctor neque eu tellus rhoncus ut eleifend.
Flexible length excerpt vivamus hendrerit arcu sed erat molestie vehicula. Sed auctor neque eu tellus rhoncus ut eleifend.
Image Dimensions
| Size (px) | Resolution | Compression | Ideal Raw File Size |
|---|---|---|---|
| 1200 x 800 | 72dpi | 50% | < 200KB |
<section class="l_card-grid">
<div class="c_summary-card">
<div class="c_summary-card-image">
<a href="#">
<picture>
<source media="(min-width: 768px)" srcset="https://source.unsplash.com/300x200?nature,
https://source.unsplash.com/600x400?nature 2x" />
<source media="(min-width: 300px)" srcset="https://source.unsplash.com/96x96?nature,
https://source.unsplash.com/192x192?nature 2x" />
<img alt="" src="https://source.unsplash.com/300x200?nature" srcset="https://source.unsplash.com/300x200?nature,
https://source.unsplash.com/600x400?nature 2x" />
</picture>
</a>
</div>
<div class="flex flex-col flex-grow">
<div class="c_summary-card-content">
<div class="w-full h-full flex flex-col">
<a href="#" class="flex">
<svg class="w-5 h-5 fill-cyan-100 mr-2">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icons-guide"></use>
</svg>
<h2></h2>
</a>
</div>
</div>
<div class="c_summary-card-desktop">
<p>Flexible length excerpt vivamus hendrerit arcu sed erat molestie vehicula. Sed auctor neque eu tellus rhoncus ut eleifend.</p>
</div>
<div class="flex lg:mt-auto">
<div class="tags text-right lg:ml-auto">
<a href="#" class="tag">#inspiration</a>
<a href="#" class="tag">#education</a>
</div>
</div>
</div>
</div>
</section>