Back to Main Blog

3 Quick Style Fixes that Add Instant Polish to Your Kajabi Website

kajabi website design Apr 19, 2023
woman holding laptop

Polishing Up Your Kajabi Website

If you just invested 4 figures on a wow statement dress, would you walk out the door with the zipper hanging open, a hemline that doesn’t fall just right, and wearing your house slippers?  I’m guessing that the answer is “no”.  Now, I confess that I’ve never spent that much on a dress, but if I had, I would make darn sure that it looked a treat.  And that’s how you should view your Kajabi website.  You’ve invested in a sleek vehicle for your courses so it would be a shame if you didn’t give it a good polish now and then.   

Scan Instead of Read

% of words visitors read on a web page.

20%
 
 
 
 
Snap Judgement

% of visitors who judge a business based on its website design.

75%
 
 
 
 
Lost Opportunity

70% of small business websites don't have a Call to Action.

70%
 
 
 
 

Does Style Matter?

My philosophy for working on Kajabi landing pages or products is this:  create harmony between style and function.

Most website viewers have the attention span of a puppy.  They scan a page rather than read it.  In under a second, they've decided whether it's worth it to keep scrolling.  In this blog, I address a few quick and easy style fixes that will help keep your Kajabi website looking good so that it's easy for visitors to navigate and keep exploring the products or services you have to offer them. 

tip #1

Check the Mobile View

When working on your Kajabi page, use the same philosophy as checking yourself out in the mirror.  While your dress may look great on the front side, when you turn around you may discover that you missed closing a hook on the back.  In Kajabi terms, what may look great in a desktop view, may need some tweaking when viewed on a mobile.  When you edit your site, click on the small triangle in the bottom right corner of your page and click on “mobile view”.  Scroll down to get an idea of what a mobile viewer would see.  Here are a few things to look out for:

  • Does the text align the way you want it? Some prefer the look of text aligned to the left, others a centered text.  Whatever your choice, be consistent.  Text alignment can be found in  Block Settings/Mobile Layout/Mobile Text Alignment. 
  • Take a critical look at your CTA buttons. While you want CTAs to stand out, large buttons can look over the top when viewed on mobile.  Consider using a small or medium button size so it looks more natural to the reader.  To change the size of a CTA button go to Block Settings/Call to Action/Button Size.
tip #2

To Font or Not to Font

Ah, bling.  When to use it and when not to primarily is a personal choice, however, it’s good to remember that it’s not always about us.  It’s about what our website visitor thinks.  So while that gorgeous script font lights you up, it pays to give some thought as to where and how to use it so that it comes over as a special touch rather than sloppy and unreadable.  Here are a few things to keep in mind.

  • Script fonts look best used in combination with another font in headlines, short phrases, to write your name, and in places that you want to draw your reader’s attention to. They become tiring to the eye if used in sentences. 
  • Are your fonts readable in mobile view? This is especially important in text-heavy sections of your site, such as a blog.    You can select the font size for the headings and body text level by doing this:  Go to your Page’s Settings and select “Style Guide”.  Scroll down until you see the “Desktop Fonts” and “Mobile Fonts” Sections.  Adjust the font sizes to your liking, most experts recommend using a minimum 16px font on the mobile for sections that are text heavy.
tip #3

Header and Footer

Ummm, why should I worry about this?  Think of your header and footer as finding the perfect pair of earrings and shoes to wear with that wow statement dress.  They may not be the main story, but they add just the right amount of style to elevate a look.  In Kajabi terms, here are a few alternative choices to the default header and footer choices your pages come with. 

  • If the menu on top of your page looks crowded, try a drop-down menu instead. It’s a way to tidy up a cluttered user menu.   Create one by doing this:  Go to your Page Sections/Header and Hide your User Menu (click on 3 dots to do this).  Click on “Add Content” and select Dropdown Menu.  Once it’s been added, you can customize it to your liking. 
  • The standard footer has information reading from left to right. Alternatively, using a “stacked” format adds more oomph.  Does it serve any special purpose?  Nope, this is strictly a design choice.  Create one by doing this:  Go to your Page Sections/Footer/Desktop Layout/Select Vertical Layout.

Dress Up Your Site

Style has a lot to do with your personality, your business type, and your niche.  While it’s essential to check your mobile view and to make sure your copy is readable, some of these style tips come down to personal preference.  If you’re unsure, ask a friend(s) to read your page and take their comments on board.  The main thing is to be consistent about your choices so that your branding is cohesive across all of your pages and products. 

Have fun dressing up your site!

You Also May Be Interested In....

How to Turn Lemons into Kajabi Gold with Custom Font Fixes

Feb 15, 2023

Sara Smits van Oyen

I’m a Kajabi Specialist who's been on a professional journey that's spanned over 30 years in finance roles before finding the sweet spot of helping lifestyle entrepreneurs share their unique gifts with the world. I’m a mood creator and client journey geek who loves to help her clients shine in the spotlight so that they can focus on taking great care of themselves and their clients. 

#block-1694873394061 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1694873394061 .block { border: 4px black; border-radius: 0px; background-color: #efe0e2; padding: 0px; padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } @media (min-width: 768px) { #block-1694873394061 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1694873394061 .block { padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } } @media (max-width: 767px) { #block-1694873394061 { text-align: left; } } #block-1577982541036_0 .btn { margin-top: 1rem; } #block-1706880119567 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706880119567 .block { border: 1px solid #9d8a75; border-radius: 0px; background-color: #fffff9; padding: 0px; padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } @media (min-width: 768px) { #block-1706880119567 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706880119567 .block { padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } } @media (max-width: 767px) { #block-1706880119567 { text-align: center; } } #block-1706880119567 .feature__image, [data-slick-id="1706880119567"] .feature__image { width: 50px; border-radius: 0px; } #block-1706880119567 .c100 {float: none; margin: 0 auto;} @media only screen and (min-width: 768px) { #block-1706880119567 .revcirle, #block-1706880119567 .revtext {width: 100%;} #block-1706880119567 .revcirle {height: 130px; margin-left: auto; margin-right: auto; font-size: 100px;} } @media only screen and (max-width: 767px) { #block-1706880119567 .revcirle, #block-1706880119567 .revtext {width: 100%;} #block-1706880119567 .revcirle {height: 130px; margin-left: auto; margin-right: auto; font-size: 100px;} } #block-1706880119567 .revtext p {font-size: 14px; padding: 5px 5px 3px 5px; border-bottom: solid 1px #dddddd; margin-bottom: 0; text-align: left; } #block-1706880119567 .revtext span { float: right; } #block-1706880119567 .fill, #block-1706880119567 .bar { border-color: #9d8a75; } .rect-auto { clip: rect(auto, auto, auto, auto); } .pie, .c100 .bar { position: absolute; border: 0.08em solid #9d8a75; width: 0.84em; height: 0.84em; clip: rect(0em, 0.5em, 1em, 0em); -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } .pie-fill { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } #block-1706880119567 .c100 { background-color: #51643d; } .c100 { position: relative; width: 1em; height: 1em; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; // margin: 0 0.1em 0.1em 0; background-color: #51643d; // float: left; } .c100 *, .c100 *:before, .c100 *:after { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } #block-1706880119567 .c100 span { color: #fffff9; } .c100 span { position: absolute; width: 100%; z-index: 1; left: 0; top: 0; width: 5em; line-height: 5em; font-size: 0.2em; color: #51643d; display: block; text-align: center; white-space: nowrap; -webkit-transition-property: all; -moz-transition-property: all; -o-transition-property: all; transition-property: all; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; -o-transition-duration: 0.2s; transition-duration: 0.2s; -webkit-transition-timing-function: ease-out; -moz-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; } #block-1706880119567 .c100:after { background-color: ; } .c100:after { position: absolute; top: 0.08em; left: 0.08em; display: block; content: " "; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; background-color: ; width: 0.84em; height: 0.84em; -webkit-transition-property: all; -moz-transition-property: all; -o-transition-property: all; transition-property: all; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; -o-transition-duration: 0.2s; transition-duration: 0.2s; -webkit-transition-timing-function: ease-in; -moz-transition-timing-function: ease-in; -o-transition-timing-function: ease-in; transition-timing-function: ease-in; } .c100 .slice { position: absolute; width: 1em; height: 1em; clip: rect(0em, 1em, 1em, 0.5em); } .c100.p20 .bar { -webkit-transform: rotate(72.0deg); -moz-transform: rotate(72.0deg); -ms-transform: rotate(72.0deg); -o-transform: rotate(72.0deg); transform: rotate(72.0deg); } #block-1706880119567 .c100:hover { cursor: default; } #block-1706880119567 .c100:hover span { color: #9d8a75; } #block-1706880119567 .c100:hover span { width: 3.33em; line-height: 3.33em; font-size: 0.3em; color: #9d8a75; } #block-1706880119567 .c100:hover:after { top: 0.04em; left: 0.04em; width: 0.92em; height: 0.92em; } #block-1706880440280 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706880440280 .block { border: 1px solid #9d8a75; border-radius: 0px; background-color: #fffff9; padding: 0px; padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } @media (min-width: 768px) { #block-1706880440280 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706880440280 .block { padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } } @media (max-width: 767px) { #block-1706880440280 { text-align: center; } } #block-1706880440280 .feature__image, [data-slick-id="1706880440280"] .feature__image { width: 50px; border-radius: 0px; } #block-1706880440280 .c100 {float: none; margin: 0 auto;} @media only screen and (min-width: 768px) { #block-1706880440280 .revcirle, #block-1706880440280 .revtext {width: 100%;} #block-1706880440280 .revcirle {height: 130px; margin-left: auto; margin-right: auto; font-size: 100px;} } @media only screen and (max-width: 767px) { #block-1706880440280 .revcirle, #block-1706880440280 .revtext {width: 100%;} #block-1706880440280 .revcirle {height: 130px; margin-left: auto; margin-right: auto; font-size: 100px;} } #block-1706880440280 .revtext p {font-size: 14px; padding: 5px 5px 3px 5px; border-bottom: solid 1px #dddddd; margin-bottom: 0; text-align: left; } #block-1706880440280 .revtext span { float: right; } #block-1706880440280 .fill, #block-1706880440280 .bar { border-color: #9d8a75; } .rect-auto { clip: rect(auto, auto, auto, auto); } .pie, .c100 .bar { position: absolute; border: 0.08em solid #9d8a75; width: 0.84em; height: 0.84em; clip: rect(0em, 0.5em, 1em, 0em); -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } .pie-fill { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } .c100.p75 .slice { clip: rect(auto, auto, auto, auto); } .c100.p75 .fill { position: absolute; border: 0.08em solid #9d8a75; width: 0.84em; height: 0.84em; clip: rect(0em, 0.5em, 1em, 0em); -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } .c100.p75 .bar:after, .c100.p75 .fill { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } #block-1706880440280 .c100 { background-color: #51643d; } .c100 { position: relative; width: 1em; height: 1em; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; // margin: 0 0.1em 0.1em 0; background-color: #51643d; // float: left; } .c100 *, .c100 *:before, .c100 *:after { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } #block-1706880440280 .c100 span { color: #fffff9; } .c100 span { position: absolute; width: 100%; z-index: 1; left: 0; top: 0; width: 5em; line-height: 5em; font-size: 0.2em; color: #51643d; display: block; text-align: center; white-space: nowrap; -webkit-transition-property: all; -moz-transition-property: all; -o-transition-property: all; transition-property: all; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; -o-transition-duration: 0.2s; transition-duration: 0.2s; -webkit-transition-timing-function: ease-out; -moz-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; } #block-1706880440280 .c100:after { background-color: ; } .c100:after { position: absolute; top: 0.08em; left: 0.08em; display: block; content: " "; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; background-color: ; width: 0.84em; height: 0.84em; -webkit-transition-property: all; -moz-transition-property: all; -o-transition-property: all; transition-property: all; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; -o-transition-duration: 0.2s; transition-duration: 0.2s; -webkit-transition-timing-function: ease-in; -moz-transition-timing-function: ease-in; -o-transition-timing-function: ease-in; transition-timing-function: ease-in; } .c100 .slice { position: absolute; width: 1em; height: 1em; clip: rect(0em, 1em, 1em, 0.5em); } .c100.p75 .bar { -webkit-transform: rotate(270.0deg); -moz-transform: rotate(270.0deg); -ms-transform: rotate(270.0deg); -o-transform: rotate(270.0deg); transform: rotate(270.0deg); } #block-1706880440280 .c100:hover { cursor: default; } #block-1706880440280 .c100:hover span { color: #9d8a75; } #block-1706880440280 .c100:hover span { width: 3.33em; line-height: 3.33em; font-size: 0.3em; color: #9d8a75; } #block-1706880440280 .c100:hover:after { top: 0.04em; left: 0.04em; width: 0.92em; height: 0.92em; } #block-1706880508737 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706880508737 .block { border: 1px solid #9d8a75; border-radius: 0px; background-color: #fffff9; padding: 0px; padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } @media (min-width: 768px) { #block-1706880508737 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706880508737 .block { padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } } @media (max-width: 767px) { #block-1706880508737 { text-align: center; } } #block-1706880508737 .feature__image, [data-slick-id="1706880508737"] .feature__image { width: 50px; border-radius: 0px; } #block-1706880508737 .c100 {float: none; margin: 0 auto;} @media only screen and (min-width: 768px) { #block-1706880508737 .revcirle, #block-1706880508737 .revtext {width: 100%;} #block-1706880508737 .revcirle {height: 130px; margin-left: auto; margin-right: auto; font-size: 100px;} } @media only screen and (max-width: 767px) { #block-1706880508737 .revcirle, #block-1706880508737 .revtext {width: 100%;} #block-1706880508737 .revcirle {height: 130px; margin-left: auto; margin-right: auto; font-size: 100px;} } #block-1706880508737 .revtext p {font-size: 14px; padding: 5px 5px 3px 5px; border-bottom: solid 1px #dddddd; margin-bottom: 0; text-align: left; } #block-1706880508737 .revtext span { float: right; } #block-1706880508737 .fill, #block-1706880508737 .bar { border-color: #9d8a75; } .rect-auto { clip: rect(auto, auto, auto, auto); } .pie, .c100 .bar { position: absolute; border: 0.08em solid #9d8a75; width: 0.84em; height: 0.84em; clip: rect(0em, 0.5em, 1em, 0em); -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } .pie-fill { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } .c100.p70 .slice { clip: rect(auto, auto, auto, auto); } .c100.p70 .fill { position: absolute; border: 0.08em solid #9d8a75; width: 0.84em; height: 0.84em; clip: rect(0em, 0.5em, 1em, 0em); -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } .c100.p70 .bar:after, .c100.p70 .fill { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } #block-1706880508737 .c100 { background-color: #51643d; } .c100 { position: relative; width: 1em; height: 1em; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; // margin: 0 0.1em 0.1em 0; background-color: #51643d; // float: left; } .c100 *, .c100 *:before, .c100 *:after { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } #block-1706880508737 .c100 span { color: #fffff9; } .c100 span { position: absolute; width: 100%; z-index: 1; left: 0; top: 0; width: 5em; line-height: 5em; font-size: 0.2em; color: #51643d; display: block; text-align: center; white-space: nowrap; -webkit-transition-property: all; -moz-transition-property: all; -o-transition-property: all; transition-property: all; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; -o-transition-duration: 0.2s; transition-duration: 0.2s; -webkit-transition-timing-function: ease-out; -moz-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; } #block-1706880508737 .c100:after { background-color: ; } .c100:after { position: absolute; top: 0.08em; left: 0.08em; display: block; content: " "; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; background-color: ; width: 0.84em; height: 0.84em; -webkit-transition-property: all; -moz-transition-property: all; -o-transition-property: all; transition-property: all; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; -o-transition-duration: 0.2s; transition-duration: 0.2s; -webkit-transition-timing-function: ease-in; -moz-transition-timing-function: ease-in; -o-transition-timing-function: ease-in; transition-timing-function: ease-in; } .c100 .slice { position: absolute; width: 1em; height: 1em; clip: rect(0em, 1em, 1em, 0.5em); } .c100.p70 .bar { -webkit-transform: rotate(252.0deg); -moz-transform: rotate(252.0deg); -ms-transform: rotate(252.0deg); -o-transform: rotate(252.0deg); transform: rotate(252.0deg); } #block-1706880508737 .c100:hover { cursor: default; } #block-1706880508737 .c100:hover span { color: #9d8a75; } #block-1706880508737 .c100:hover span { width: 3.33em; line-height: 3.33em; font-size: 0.3em; color: #9d8a75; } #block-1706880508737 .c100:hover:after { top: 0.04em; left: 0.04em; width: 0.92em; height: 0.92em; } #block-1694873532692 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1694873532692 .block { border: 4px black; border-radius: 0px; background-color: #efe0e2; padding: 0px; padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } @media (min-width: 768px) { #block-1694873532692 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1694873532692 .block { padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } } @media (max-width: 767px) { #block-1694873532692 { text-align: left; } } #block-1577982541036_0 .btn { margin-top: 1rem; } #block-1695978871700 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1695978871700 .block { border: 4px black; border-radius: 0px; background-color: #fffff9; padding: 0px; padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } @media (min-width: 768px) { #block-1695978871700 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1695978871700 .block { padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } } @media (max-width: 767px) { #block-1695978871700 { text-align: left; } } #block-1695978871700 .image__image { max-width: 35%; border-radius: 0px; } #block-1695978871700 .image__image { float: left; margin-right: 15px; margin-bottom: 10px; } #block-1706799523683 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706799523683 .block { border: 4px black; border-radius: 0px; background-color: #fffff9; padding: 0px; padding: 0px; padding: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } @media (min-width: 768px) { #block-1706799523683 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706799523683 .block { padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } } @media (max-width: 767px) { #block-1706799523683 { text-align: left; } } #block-1706799523683 .image__image { max-width: 35%; border-radius: 0px; } #block-1706799523683 .image__image { float: right; margin-left: 15px; margin-bottom: 10px; } #block-1706799670680 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706799670680 .block { border: 4px black; border-radius: 0px; background-color: #fffff9; padding: 0px; padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } @media (min-width: 768px) { #block-1706799670680 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706799670680 .block { padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } } @media (max-width: 767px) { #block-1706799670680 { text-align: left; } } #block-1706799670680 .image__image { max-width: 35%; border-radius: 0px; } #block-1706799670680 .image__image { float: left; margin-right: 15px; margin-bottom: 10px; } #block-1706799983051 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706799983051 .block { border: 4px black; border-radius: 0px; background-color: #efe0e2; padding: 0px; padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } @media (min-width: 768px) { #block-1706799983051 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706799983051 .block { padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } } @media (max-width: 767px) { #block-1706799983051 { text-align: left; } } #block-1577982541036_0 .btn { margin-top: 1rem; } #block-1706884180221 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706884180221 .block { border: 4px black; border-radius: 4px; padding: 0px; padding: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } @media (min-width: 768px) { #block-1706884180221 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706884180221 .block { padding: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } } @media (max-width: 767px) { #block-1706884180221 { text-align: left; } } #block-1577982541036_0 .btn { margin-top: 1rem; } #block-1706878812174 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706878812174 .block { border: 4px black; border-radius: 0px; background-color: #51643d; padding: 0px; padding: 0px; padding: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } @media (min-width: 768px) { #block-1706878812174 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1706878812174 .block { padding: 0px; padding: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } } @media (max-width: 767px) { #block-1706878812174 { text-align: left; } } #block-1706878812174 .block { overflow: hidden; } #block-1696522456141 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1696522456141 .block { border: 1px solid #9d8a75; border-radius: 0px; padding: 0px; padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } @media (min-width: 768px) { #block-1696522456141 { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } #block-1696522456141 .block { padding: 0px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; } } @media (max-width: 767px) { #block-1696522456141 { text-align: center; } } #block-1696522456141 .feature__image, [data-slick-id="1696522456141"] .feature__image { width: 100px; border-radius: 100px; } .authorfeature { display: flex; align-items: flex-start; position: relative; } .authorfeature__image-container { flex-shrink: 0; margin-right: 20px; } .authorfeature__image { max-width: 150px; height: auto; } .authorfeature__content { flex-grow: 1; } @media (max-width: 767px) { #block-1696522456141 .authorfeature { flex-direction: column; align-items: center; } #block-1696522456141 .authorfeature__image-container { margin-right: 0; } } .awesomecontainer .row .block-type--accordion { align-self: flex-start; }