
/*
    Theme Name:         Barn Cat Renovations
    Theme URI:          barncatreno.com
    Version:            1.0 | June, 2021

*/


/* ---------------------------------------------------   BEGIN CSS NORMALIZE   --------------------------------------------------- */
/*
 * html5doctor.com Reset Stylesheet v1.6.1 (http://html5doctor.com/html-5-reset-stylesheet/)
 * Richard Clark (http://richclarkdesign.com)
 * http://cssreset.com
 */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
}
body {
    line-height:1;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display:block;
}
nav ul {
    list-style:none;
}
blockquote, q {
    quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}
a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
    text-decoration: none;
}
/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}
/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}
del {
    text-decoration: line-through;
    font-weight: bold;
}
abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}
table {
    border-collapse:collapse;
    border-spacing:0;
}
/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin: 0;
    padding:0;
}
input, select {
    vertical-align:middle;
}

html {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
*, *:before, *:after {
    box-sizing: inherit;
}
/* -------------------------------------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------   END OF CSS NORMALIZE   --------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------------------------- */
/* ...begin Karen's code :) */



/* -----------------   UNIVERSAL   ----------------- */

/* - NORMAL STYLES - */


html {
    font-family: 'Montserrat', Helvetica, sans-serif !important;
    text-align: left;
    color: rgb(45,45,45);
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
}
a {
    cursor: pointer;
    text-decoration: none;
    color: rgb(45,45,45);
}
p a {
    border-bottom: #FFD130 2px solid;
}
.black p a,
.home-meetKaren-box h3 a {
    border-bottom: #FFD130 2px solid;
}


h1 {
    font-family: 'Montserrat', sans-serif;
    font-size: 2.2rem;
    line-height: 36px;
    margin: 2rem auto;
    text-align: center;
    font-weight: bold;
    max-width: 50rem;
}
#hero h1 {
    font-size: 1.7rem;
    line-height: 30px;
    color: white;
}
h2 {
    font-family: 'Montserrat', sans-serif;
    font-size: 2rem;
    line-height: 40px;
    margin: 2rem auto;
    text-align: center;
    font-weight: bold;
    max-width: 50rem;
}
#hero h2 {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.3rem;
    line-height: 32px;
    font-weight: normal;
    margin: 1rem auto 2rem;
    text-align: center;
    max-width: 50rem;
    color: white;
}

h3 {   
    font-family: 'Montserrat', sans-serif;
    font-size: 1.3rem;
    font-weight: bold;
    line-height: 30px;
    max-width: 52rem;
    margin: 1rem auto;
    text-align: center;
    max-width: 50rem;
    font-weight: lighter;
}
h4 {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.1rem;
    margin: 1rem auto 2rem;
    line-height: 28px;
    font-weight: bold;
    color: black;
    text-align: left;
    max-width: 50rem;
}
h5,
p.h5 {
    font-family: 'Montserrat', sans-serif;
    font-size: .7rem;
    line-height: 16px;
    text-transform: uppercase;
    color: #6E7579;
    margin: 1rem auto;
    text-align: center;
    max-width: 50rem;
    letter-spacing: .05em;
}

span.handwrite {
    font-family: 'Nothing You Could Do', cursive;
    font-size: larger;
    margin-top:1.5rem;
}
span.funky {
    font-family: 'Permanent Marker', cursive;
}
p,
li,
ul,
a {
    line-height: 150%;
    margin: 0.625rem auto;
    font-size: 1rem;
    max-width: 50rem;

}

.sm-space {
    margin-bottom: 2rem;
}
blockquote {
    font-family: 'Spartan', sans-serif;
    max-width: 48rem;
    margin: 1rem auto;
}
blockquote h3 {
    font-size: 1.4rem;
    line-height: 32px;
    font-weight: bold;
    text-align: center;
}
em {
    font-style: italic;
}
.nowrap {
    white-space: nowrap;
}
span.underline {
    height: 22px;
    background-size: 200% 60%;
    background-position: -100% 100%;
    background-repeat: repeat-x;
    background-image: linear-gradient(to right,transparent 50%,rgba(209,66,29,0.4) 50%);
}
span.yellow-underline {
    color: black;
    height: 22px;
    background-size: 200% 60%;
    background-position: -100% 100%;
    background-repeat: repeat-x;
    background-image: linear-gradient(to right,transparent 50%,#FFD130 50%);
}
.centred p,
.centred h1,
.centred h2,
.centred h3,
.centred h4,
.centred h5,
p.centred,
h1.centred,
h2.centred,
h3.centred,
h4.centred,
h5.centred  {
    text-align: center;
}
.centre-form {
    display:flex;
    flex-direction: column;
    align-items: center;
}



.darkgreen {
    background-color: #535e4b;
}
.sage {
    background-color: #c1c2ad;
}
.cognac {
    background-color: #b5a4a3;
}
.taupe {
    background-color: #e9e6e2;
}


.grey {
    background-color: #f3f3f3;
}
.black {
    background-color: #2e2e2e;
}
.blue {
    background-color: #035780;
}
.accent {
    background-color: #d1421d;
}
.accentText,
span.accentText {
    color: #c1c2ad;
}
.white {
    background-color: white;
}
.colour-block {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.colour {
    padding: 2rem 8%;
}
.colour a,
.colour li,
.colour i,
.colour p,
.colour h1,
.colour h2,
.colour h3,
.colour h4,
.colour h5 {
    color: white;
}
span.accent {
    color: white;
    padding: .5rem 1rem;
    line-height: 3rem;
}
.spacer {
    padding-top: 4rem;
}
.large {
    font-size: 1.8rem;
}

.main-content {
    margin: 0 8%;
    width: 84%;
    max-width: 1200px;
    clear: both;
    text-align: left;
    padding: 2rem 0;
}
.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}
 
.clearfix:after {
  clear: both;
}
br.desktop {
    display: none;
}
div.desktop {
    display: none;
}
br.mobile,
div.mobile {
    display:inline-block;
}


.button {
    background: #535e4b;
    color: white;
    text-align: center;
    cursor: pointer;
    border: #535e4b solid 1px;
    -webkit-appearance: none;
    appearance: auto;
    padding: 1rem 1.5rem;
    display: inline-block;
    clear: both;
    text-transform: uppercase;
    border-radius: 45px;
    letter-spacing: .05em;
}
.white-button {
    color: white;
    background: black;
    border: black solid 1px;
    text-align: center;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: auto;
    padding: 1rem 1.5rem;
    display: inline-block;
    clear: both;
    text-transform: uppercase;
    border-radius: 45px;
    letter-spacing: .05em;
}
.button.black-button {
    background-color:white; 
    border: black solid 1px; 
    color: black;
}
.button.wide {
    width: 100%;
    margin-bottom: 0;
    border-radius: 45px;
}
.button-row {
    display: flex;
}
.double {
    flex-wrap: wrap;
    justify-content: center;
}
.double .button {
    margin: 0.5rem 1rem;
}


.lowercase {
    text-transform: lowercase;
}

a.button {
    color: white;
    font-weight: bold;
    font-size: 1rem;
    line-height: 14px;
}
a.doublerow {
    line-height: 160%;
    /* border: dashed #035780 5px; */
    background:#535e4b;
    color: white;
}

span.largetext {
    font-size: 1rem;
}
a.white-button {
    color: white;
    font-weight: bold;
    font-size: .9rem;
    line-height: 14px;
}

.button:hover {
    color: #535e4b;
    background: white;
    border: #535e4b solid 1px;
    border-radius: 45px;
}
.white-button:hover,
.black-button:hover {
    color: #535e4b;
    border: #535e4b solid 1px;
    background: white;
    border-radius: 45px;
}
a.button:hover {
    color: #535e4b;
    background: white;
    border: #535e4b solid 1px;
}
a.white-button:hover {
    color: #535e4b;
    border: #535e4b solid 1px;
    background: white;
}

img {
    width: 100%;
}
.cta {
    text-transform: uppercase;
    font-weight: bold;
    text-align: left;
    border-bottom: #535e4b 3px solid;
    letter-spacing: .05em;
}



/* - GRIDS & GENERAL STYLES- */

.full-width,
img.full-width {
    width: 100%;
}

.third,
.two-thirds {
    width: 100%;
    float: left;
    margin-top: 1.5rem;
    text-align: center;
}
.third h5 {
    text-align: center;
}
.third img,
.two-thirds img {
    width: 80%;
}
.quarter {
    width: 100%;
    float: left;
    margin-bottom: 1.5rem;
}
.quarter.right {
    margin-bottom: 0;
}
.sixtyPercent,
.seventyPercent,
.eightyPercent,
.thirtyPercent,
.fortyPercent,
.twentyPercent {
    width: 100%;
    float: left;
    margin-bottom: 2rem;
}
.fortyPercent,
.thirtyPercent,
.twentyPercent {
    display: flex;
    justify-content: center;
    align-items: center;
}
.fortyPercent img,
.thirtyPercent img,
.twentyPercent img {
    width: 85%;
}
.half {
    width: 100%;
    float: left;
    margin-bottom: 3rem;
}
.no-v-margin {
    margin-bottom: 0;
}
.half-no-margin {
    width: 100%;
    float: left;
}
.third h3,
.third p {
    text-align: center;
}

.left-align p,
.left-align h2, 
.left-align h3,
h3.left-align, 
.left-align h4 {
    text-align: left;
    margin-right: auto;
    margin-left: 0;
}

.right {
    margin-right: 0;
}
.row {
    clear: both;
    margin: 0 0 3rem 0;
}
ul li {
    margin-bottom: 5px;
    margin-left: 1.5rem;
    line-height: 160%;
    list-style-type: square;
}
ol li {
    margin-bottom: 5px;
    margin-left: 1.5rem;
    line-height: 160%;

}
.nofloat {
    clear: both;
    float: none;
}













/* - HEADER - */




header {
    width: 100%;
    background-color:#e9e6e2;
}
.header-content {
    max-width: 1200px;
    width: 94%;
    margin: auto;
    clear: both;
    text-align: center;
    background-color:#e9e6e2;

}
.logo,
.main-nav {
    text-align: center;
    margin: 0.7rem auto;
}
.logo img {
    display: inline-block;
    width: 12rem;
}
.main-nav {
    display: inline-block;
    padding: 1rem 0;
    border-top: #e9e6e2 solid 0.5px;
}
.main-nav ul {
    margin-top: 0;
    margin-bottom: 0;
    display: flex;
    flex-direction: column;
}
.main-nav li {
    float: left;
    text-align: center;
    margin: 0 .7rem;
    list-style-type: none;
}
.main-nav li a {
    padding: 0.5rem 0;
    font-size: .8rem;
    font-weight: bold;
    color: #535e4b;
}

.main-nav li a:hover {
    color: #b5a4a3;
}
.main-nav li a:visited {
    font-weight: bold;
}

/* - NAVIGATION FOR WHEN IT'S WIDE - PASTE THIS LATER IN THE CSS IF TOO MANY LINKS  - */

.main-nav ul {
    display: inline-block;
}

.main-nav li a,
.find-us li a {
    font-size: .9rem;
}






/* - FOOTER - */


.footer-content {
    max-width: 1200px;
    width: 94%;
    margin: auto;
    clear: both;
}
.footer .third {
    text-align: left;
    margin-top: 0;
}
.footer .half {
    margin-bottom: 1rem;
}
.legal .half {
    margin-bottom: 0;
}
.footer .main-content {
    padding-bottom: 1rem;
}
footer button {
    margin-top: 10px;
}
.footer a,
.footer p,
.legal p {
    text-align: left;
    font-size: .8rem;
}
.footer a {
    line-height: 32px;
    font-weight: bold;
}
.legal a {
    margin-left: 1rem;
    float: right;
    font-size: .8rem;
}

.footer a:hover,
.legal a:hover {
    cursor: pointer;
    color: #b5a4a3;
}
.footer a:visited,
.legal a:visited {
    font-weight: bold;
}
.footer img {
    width: 100%;
}
.footer .third a:first-of-type {
    margin: 0;
}
img#footer-round-profile,
img#ig-round-profile {
    width: 30%;
    border-radius: 110px;
}






/* -----------------   ALL PAGES   ----------------- */


#hero {
    margin: auto;
}
.heroImage {
    position: relative;
}
.heroImage img {
    position: relative;
    z-index: -1;
    width: 100%;
    
}
.herocopy {
    position: relative;
    width: 700px;
    max-width: 90%;
    background: #ffffff;
    margin: -15px auto 2rem auto;
    padding: 27px 20px 10px;
}
.video-gallery {
    display: flex;
    flex-wrap: wrap;
}
.video-thumbnail {
    margin-bottom: 2rem;
}



/* -----------------   HOMEPAGE   ----------------- */




span.name {
    font-size: 1.25rem;
}

p.intro {
    text-align: center;
}


.whatWeOffer a h3 {
    color: black;
}
.whatWeOffer a h5 {
    margin-top: 1rem;
}

.home-how-it-works h4 {
    margin-top: 2rem;
    margin-bottom: 1rem;
}
.home-how-it-works .third {
    margin-bottom: 2rem;
}
.betterway {
    position: relative;
}

.betterway-background {
    width:100%;
    z-index: -1;
    opacity: 35%;
    
}
.fifth {
    width: 20%;
}

.betterway-box {
    background: rgba(209,66,29, .75);
    z-index: 3;
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.betterway-box h3 {
    color: white;
    background: none;
    font-size: 2.5rem;
    z-index: 10;
}

.background {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 2rem;
    display: flex;
    justify-content: center;
    position: relative;
}
.photoCredit {
    position: absolute;
    left: 0;
    bottom: 0;
    background: white;
    padding: 0 .5rem .25rem .5rem;
    margin: 0;

}
.photoCredit p,
.photoCredit a {
    display: inline;
    text-align: left;
    font-size: .6rem;
}

#hero {
    background-image: url("img/barn-cat-reno-home-header-MOBNEW.jpg");
    padding: 0;
    background-size: cover;
}
#hero .background {
    padding: 0;
    background: rgba(0, 0, 0, .75);
}
.home-meetKaren {
    background-image: url("img/MeetKarenSM.jpg");
    padding:  0;
}
.home-hero-box {
    padding: 2rem;
}


.home-meetKaren-box,
.background-textbox {
    background: rgba(256, 256, 256, .9);
    padding: 1rem;
}


.home-meetKaren-box h3,
.home-meetKaren-box h4,
.home-meetKaren-box p {
    color: black;
}
span.plus {
    font-size: 1.5rem;
}
.blog-promo {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.blog-promo img {
    border: 1px solid #EFEFEF;
}
.blog-promo h5 {
    font-size: .75rem;
    background: white;
    padding: .75rem 1.5rem;
    text-align: center;
    color: black;
    margin: -3rem 0 .5rem;
    border: 1px solid #EFEFEF;
}
.blog-promo-rr h5 {
    margin-top: -3.5rem;
}
.blog-promo h5:hover {
    color:#6E7579;
}

.blog-promo h4 {
    margin-top: -1rem;
    padding: 0 1.5rem;
    font-size: 1.1rem;
    font-weight: lighter;
    text-align: center;
}

.blog-promo a {
    color: black;
}



.signup {
    background-image: url("img/eNewsletter.jpg");
    padding-top: 10rem;
    padding-bottom: 10rem;
}

.signup-box {
    background: white;
    padding: 1rem;
    max-width: 36rem;
    display: flex;
    justify-content: center;
    border: 1px solid grey;
}
.signup input,
.signup button,
.cK input,
.cK button,
.ck p,
.ck h2,
.blog-sidebar-signup input,
.blog-sidebar-signup button,
.tenQuestions input,
.tenQuestions button {
    width: 20rem;
    padding: 1rem;
    margin: .5rem auto;
    text-align: center;
    border: #EFEFEF 1px solid;
    display: flex;
    justify-content: center;
}

.signup button,
.cK button,
.blog-sidebar-signup button,
.tenQuestions button {
    border-radius: 45px;
}
.mc-field-group,
.formkit-field,
.mc-field-group p,
.formkit-field p,
.clear {
    text-align: center;
}
.formkit-checkboxes {
    display: flex;
    align-items: center;
}
.formkit-checkboxes label {
    font-size: .9rem;
}
#tag-4603-4249858,
#tag-4603-4249864,
#tag-4603-3036605 {
    width: 2rem;
    margin: .5rem;
    text-align: left;
}
legend {
    text-align: left;
    margin: 1rem 0;
    padding-top:1rem;
}
#mc-embedded-subscribe {
    margin-bottom: 1.25rem;
}


/* ---------  CONTACT  --------- */


.contactBackground {
    background-image:  url("img/prydumano-design-yW5Iq8NAtvo-unsplash.jpg");
    padding: .5rem;
}
.contactBackground-box {
    background: rgba(256, 256, 256, .6);
    padding: 1rem;
}
.indicates-required p {
    font-size: .8rem;
}
.contactBackground-box input,
.contactBackground-box select {
    width: 100%;
    max-width: 30rem;
    padding: 1rem;
    margin: .5rem auto;
    text-align: center;
    border: grey 1px solid;
}
.size1of2 input,
.size1of2 select {
    width: 100%;
    float: left;
    margin: inherit 1rem;
    clear: none;
}
.contactBackground-box li {
    list-style-type: none;
    margin-left: 0;
}
.contactBackground-box h4 {
    margin-top: 1rem;
}
input#mce-SERVICE-0,
input#mce-SERVICE-1,
input#mce-SERVICE-2 {
    width: 2rem;
}


.contactBackground-box .row {
    margin-bottom: 0 ;
}
select#mce-ROOMS {
    width: auto;
}





/* ---------  ALL PAGES  --------- */

p.bigPromo {
    font-size: 1.3rem;
    text-align: center;
}
p.smallPromo {
    font-size: 1.1rem;
    font-weight: bold;
    text-align: center;
}
.longText {
    max-width: 44rem;

}



/* ---------   FAQs   --------- */

.faqs h3,
.faqs h4,
.faqs p,
.faqs ul {
    text-align: left;
    max-width: 50rem;
}
.faqs h4 {
    margin: 1rem auto;
}

.faqs ul,
.faqs p {
    margin: 0 auto 3rem;
}






/* -----------------   WAITLIST FORM  ----------------- */

.waitlistForm input {
    width: 100%;
    max-width: 25rem;
    padding: 1rem;
    margin: .5rem auto;
    text-align: center;
    border: grey 1px solid;
}
.white-button {
    color: white;
    background: black;
    border: white solid 1px;
}




/* -----------------   ABOUT US  ----------------- */


.main-content.about {
    padding-top: 0;
    margin-top: 0;
}
.about i {
    padding: 1rem;
}
.about h4 {
    margin: 2rem auto 0;
}
span.bold-indent {
    font-weight: bold;
    margin-left: 1rem;
}
.aboutUsBackground {
    background-image: url("img/barn-cat-reno-about-Karen-backgroundSM.jpg");
    padding: 30rem 0 0 0;
}

.aboutUsBackground-box {
    background: rgba(256, 256, 256, .8);
    padding: 1rem;
}

.aboutUsBackground-box h3,
.aboutUsBackground-box h4,
.aboutUsBackground-box p {
    color: black;
}

.about-faqs {
    margin: auto;
}
.about-faqs h3,
.about-faqs h4,
.about-faqs p {
    text-align: center;
    margin: auto;
}
.about-faqs h4 {
    margin-top: 2rem;
}






/* -----------------   BLOG   ----------------- */



.blog-post h4 {
    margin-top: 2rem;
}
a.allBlogPosts {
    margin-right: .5rem;
    }
a.category {
    margin-right: .5rem;
    margin-left: .5rem;
}
p.blogTitle {
    font-weight: bold;
    margin-left: .5rem;
}
.blog-list-item-title h5 {
    margin-top:0;
}


/* ----   Right Rail   ---- */

.blog-right-rail {
    width: 100%;
    float: right;
    margin-bottom: 5rem;
}
h5.brr,
.blog-right-rail a {
    color: black;
    text-align: left;
}
.blog-categories {
    text-align: center;
}
.blog-categories a {
    font-size: .9rem;
    background: #EFEFEF;
    padding: .5rem .75rem;
    cursor: pointer;
    text-align: center;
    line-height: 350%;
    margin-right: .5rem;
    color: black;
    text-transform: uppercase;
    letter-spacing: .05em;
}
.blog-categories a:hover {
    background: grey;
    color: white;
}
.blog-popular-posts,
.blog-recent-posts-rr {
    display: none;
}
.blog-sidebar-signup {
    margin-top: 3rem;
    padding-bottom: 10rem;
    padding-top: 10rem;
    background-image: url("img/blog-signup.jpg");;
}
.blog-sidebar-signup h3,
.blog-sidebar-signup p {
    text-align: center;
}


/* ----   Blog Content   ---- */

.blog-content {
    width: 100%;
}
.blog-list-item {
    margin-bottom: 3rem;
}
.blog-list-item h5 {
    text-align: left;
    margin-bottom: 0;
}
.blog-list-item-title h5 {
    float: left;
    margin-right: 1rem;
    margin-bottom: .53rem;
}

.blog-list-item h2 {
    clear: both;
    float: none;
    text-align: left;
    margin: .5rem auto;
    /* font-size: 1.2rem;
    line-height: 28px;
    font-weight: normal; */
}
.blog-content h3 {
    margin-top: 2rem;
}
.blog-post h2 {
    margin-top: 2rem;
}
.blog-post img {
    float: none;
    margin: 1rem 0;
    clear: both;
}
.source a,
.source p {
    font-size: .7rem;
    margin-top: -1rem;
    color: grey;
    border-bottom: none;
}

span.author {
    margin-right: .75rem;
}

.instagramcarousel .carousel-cell {
    height: 600px;
    display:flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    padding: 0 2rem 2rem 2rem;
}
.flickity-prev-next-button {
    width: 50px;
    height: 50px;
    fill: black;
}
.flickity-button {
    background: transparent;
}
.flickity-button:hover {
    background: transparent;
}
/* icon color */
.flickity-button-icon {
    fill: black;
}
.flickity-button-icon:hover {
    fill: #d1421d;
}
.flickity-page-dots .dot {
    margin-bottom: 3rem;
}
/* position outside */
.flickity-prev-next-button.previous {
    left: -3%;
}
.flickity-prev-next-button.next {
    right: -3%;
}




/* ----   Keep Reading Section   ---- */


.recent-post-title h5 {
    text-align: left;
}
.recent-post-title h4 {
    text-align: left;
    color: #035780;
    font-size: 1.5rem;
    margin: 0;
}

.blog-recent-posts .blog-list-item {
    margin-bottom:2rem;
    display: flex;
    align-items: center;
}
.blog-recent-posts .blog-list-item-image {
    width: 35%;
    margin-right: 5%;
}
.blog-recent-posts .blog-list-item-image img {
    margin-bottom: 0;
}
.blog-recent-posts .blog-list-item-title {
    width: 60%;
}
.blog-recent-posts .blog-list-item-title h4 {
    font-size: 1.1rem;
    font-weight: lighter;
    text-align: left;
    clear:both;
    color:#035780;
    margin:0;
}
.quarter .blog-promo h4 {
    padding: 0;
    font-size: 1rem;
    line-height: 1.5rem;
    text-align: center;
}
.quarter .blog-promo h5 {
    padding: .4rem .7rem;
}
.related-posts hr {
    margin: 3rem 0;
}
.blog-right-rail .blog-categories {
    display: none;
}

.borderBottom {
    border-bottom:#d1421d solid 2px;
    padding-bottom: .5rem;
}
.borderBottomShort {
    border-bottom:#d1421d solid 2px;
    padding-bottom: .5rem;
    width: 3rem;
}

.YTvideo {
    display: flex;
    flex-direction: column;
}
.YTvideoWrapper {
    position: relative;
    display: flex;
    padding-bottom: 54%; /* 16:9 */
    padding-top: 25px;
    height: 0;
    margin: auto;
}
.YTvideoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.recipe-prep-info {
    padding-bottom: 1rem;
    margin: 2rem 0;
    border: #EFEFEF solid 1px;
}
.recipe-prep-info p,
.recipe-prep-info h5 {
    text-align: center;
}
.recipe-prep-info p {
    font-size: .85rem;
}




/* -----------------   RESOURCES   ----------------- */


/* .wideresource {
    display: flex;
    flex-direction: column;
}

.resource {
    display: flex;
    flex-direction: column;
    border:#cccccc solid 1px;
    padding: 0.5rem;
}
.resource a {
    margin: 0;
}
.wideresource p {
    color: black;
}
.resource p {
    color: black;
    line-height: 130%;
    font-size: .9rem;
}
.resource .button {
    padding: .75rem;
}
.wideresource h4,
.resource h4 {
    margin: .5rem 0 1rem;
} */
.product-tile {
    margin-bottom: 2rem;
}
.product-tile p,
.product-tile a {
    font-size: .9rem;
    text-align: center;
}
.product-tile h3 {
    color: rgb(45,45,45);
    margin-bottom: 1rem;
}
.product-tile h5 {
    color:#d1421d;
    margin-top: 1rem;
    font-size: .75rem;
}
.third .product-tile img {
    width: 70%;
}





/* -----------------   LEGAL DOCS   ----------------- */


.legal-doc h2 {
    margin-top: 3rem;
}


/* -----------------   INSTAGRAM, RPA Resources Page   ----------------- */


.igitem {
    margin-bottom: 1rem;
    display:flex;
    align-items: flex-start;
    background:#f4f4f4;
    padding: .8rem;
    border-radius: 8px;
}
.igitem img {
    width: 15%;
    margin-right: 5%
}
.igitem a { 
    margin:0;
}
.igitem h2,
.igitem p.h5 {
    text-align: left;
}

.igitem p.h5 {
    line-height: 120%;
    margin:0 0 .5rem 0 ;
    font-size: .65rem;
}

.igitem p.button,
.rpa-resources a.button {
    font-size: .8rem;
    margin-top: 0;
}
.instagram .button,
.rpa-resources .button {
    padding: .5rem .75rem;
    margin-bottom: 0;
    border-radius: 45px;
}
.instagram h2,
.rpa-resources h2 {
    margin: 0;
    font-size: .85rem;
    line-height: 120%;
}


.dictionary-item {
    display: flex;
    flex-direction: column;
    border-bottom: 1px #035780 solid;
    padding: 3rem 0;
}
.dictionary h2 {
    margin-top:3rem;
}
.dictionary-item h4 {
    margin-top: 0;
}
.dict-img p,
.dict-img a {
    font-size: .8rem;
    margin-bottom: 0;
}


/* -----------------   RENOVATION COURSES + TOOLS   ----------------- */


.products {
    display: flex;
    flex-wrap: wrap;
}
.product {
    width: 47%;
    margin: 2rem 1.5%;
    float: left;
}
.product-title p:hover {
    border-bottom: #d1421d solid 2px;
}
.product-byline {
    font-size: .85rem;
    color:#333;
    line-height: 16px;
}
.myService {
    text-align: left;
    display: flex;
    flex-wrap: wrap;
}
.course-desc {
    background: white;
    padding: 1rem 0;
}
.course-desc p,
.course-desc h2,
.course-desc a.button {
    margin-left: 7%;
}
.course-desc p,
.course-desc h2 {
    margin-left: 7%;
    padding-right: 4rem;
}
.course-desc h2 {
    text-align: left;
    z-index: 10;
    margin-bottom: 1rem;
}
.course-desc p.h5 {
    color:#d1421d;
    z-index: 10;
}
p.course-promise {
    background-color: #D1421D;
    color: white;
    font-weight: bold;
    padding: 1rem 1rem 1rem 10%;
    margin-left: 0;
    margin-right: 0;
    text-transform: uppercase;
    letter-spacing: .05em;
}
span.sale-price {
    color: #D1421D;
    font-weight: bold;
}
span.sale {
    background-color: #D1421D;
    font-size: .6rem;
    padding: .15rem .25rem;
    color: white;
    border-radius: 4px;
}





/* -----------------   SALES PAGES   ----------------- */

.rpaLogo {
    display: block;
    margin: auto;
    width: 50%;
}
.rpaLogo img {
    border: none;
}

.narrowCentred {
    max-width: 40rem;
    margin: auto;
}
.midCentred {
    max-width: 50rem;
    margin: auto;
}
.textbubble {
    padding: 4rem;
    margin: 4rem auto;
}
.textbubble h4,
.textbubble h2 {
    text-align: left;
    margin-bottom: 0;
    font-weight: lighter;
}
.textbubble h2 {
    margin: -5rem -3rem 0 0;
    padding-bottom:3rem;
}
span.price {
    font-size: 1.6rem;
    color: #035780;
    padding-top: 1rem;
}
.priceBox {
    border: black solid 1px;
    max-width: 24rem;
    margin: auto;
    padding: 1rem 0 0 0;
}
.priceBox h2 {
    margin: 1.5rem auto .75rem;
}
.priceBox h5, 
.priceBox h2 {
    text-align: center;
}
.priceBox.button-row {
    margin: 0;
}

.rpamath {
    max-width: 28rem;
    margin: auto;
}
.rpamath h3 {
    text-align: right;
}
.rpamath hr {
    margin: 1rem 0;
}
.rpamath a {
    border-bottom: #FFD130 solid 3px;
    font-size: 1.25rem;
    margin-bottom: .25rem;
}

.moduleContent,
.bonusContent {
    background: white;
    padding: 1rem;
}
.moduleContent h3 {
    text-align: center;
    z-index: 10;
}
.moduleContent p.h5 {
    color:#d1421d;
    text-align: center;
    z-index: 10;
}
.moduleImage img {
    display:none;
}
.bonusContent p.h5 {
    text-align: center;
}
.bonusContent h3 {
    color:#d1421d;
    text-align: center;
}
.rpafaqs p {
    border-bottom:#d1421d solid 1px;
    padding-bottom:3rem;
}
.greybox {
    background: #f3f3f3;
    padding: 1rem;
}
.break {
    border-bottom:#d1421d solid 5px;
    padding-bottom: 4rem;
    width: 3rem;
    margin: 0 auto 4rem;
}
/* .small-break {
    border-bottom:#d1421d solid 2px;
    padding-bottom: 4rem;
    width: 3rem;
    margin: 0 auto 0 0;
} */

.prog-diff {
    padding: .4rem;
    margin: 2rem 0;
}
.prog-diff h4 {
    margin:0 auto;
    font-size: 1.2rem;
}
.testimonial {
    margin:auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 52rem;
}
.testimonial img {
    width: 45%;
}
.testimonial p,
.testimonial-small p {
    font-style: italic;
}
.testimonial h3{
    text-align: left;
    margin-bottom: 1rem;
}
span.testimonial-name {
    text-align: right;
    font-size: .9rem;
}
.testimonial-small {
    background: white;
    padding: .5rem 1rem;
    margin: 0 auto 1rem;
    display: flex;
    flex-direction: row;
    align-items: center;
}
.testimonial-inline {
    display: flex;
    align-items: center;
    justify-content: center;
}
.testimonial-inline img {
    width: 20%;
    margin-right: 1rem;
}
.testimonial-inline p {
    font-size: 0.8rem;
}
.testimonials-section {
    max-width: 1200px;
    margin: 0 auto;
}
.testimonials-section .half {
    margin-bottom:0;
}
.testimonial-small img {
    width: 25%;
    margin-right:5%;
}
.testimonial-small p {
    color: black;
    line-height: 1.1rem;
    margin-bottom: 0;
    margin-top:0.3rem;
}

.roadmap-box {
    background-color: white;
    padding: 1rem;
    margin-bottom: 1rem;
}


.salesPageIntro,
.halfIntro {
    display: flex;
    align-items: center;
    flex-direction: column;
}
.salesPageIntro img,
.halfIntro img,
.halfIntro video {
    margin-bottom: 3rem;
}
.salesPageIntro a,
.halfIntro a {
    margin-bottom: 0;
}
.halfIntro a {
    display: flex;
    justify-content: center;
    margin-top: 1rem;
}

.center {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    margin-top: 73px;
}

.carousel {
    position: relative;
    width: 100%;
    text-align: center;
    font-size: 1.3rem;
    line-height: 37.5px;
    height: 75px;
}

.carousel .pre {
    position: absolute;
    top: 0;
    right: 54.5%;
    height: 75px;
    color:#d1421d;
}
    
.carousel .change_outer {
    position: absolute;
    top: 0;
    left: 46%;
    text-align: left;
    height: 75px;
    overflow: hidden;
}
        
.carousel .change_inner {
    position: relative;
    animation: rotate 12s ease-in-out infinite;
}
        
.carousel .element {
    display: block;
}
        
@keyframes rotate {
    0%, 5% {
        transform: translateY(0);
    }
    10%,15% {
        transform: translateY(-75px);
    }
    20%,25% {
        transform: translateY(-150px);
    }
    30%,35% {
        transform: translateY(-225px);
    }
    40%,45% {
        transform: translateY(-300px);
    }
    50%,55% {
        transform: translateY(-375px);
    }
    60%,65% {
        transform: translateY(-450px);
    }
    70%,75% {
        transform: translateY(-525px);
    }
    80%,85% {
        transform: translateY(-600px);
    }
    90%,95% {
        transform: translateY(-675px);
    }
    100% {
        transform: translateY(-750px);
    }
}

.salesPageModule {
    display: flex;
    flex-direction: column;
}
.salesPagecta h4 {
    margin-bottom: .5rem;
}
.salesPagecta li,
.checkmark li {
    list-style: none;
    margin-left: 0;
}
.checkmark i {
    margin-right: .75rem;
}
.RPActa ul {
    padding: 1rem 1rem 1rem 3rem;
}
.RPActa i {
    margin-left: -2rem;
    margin-right: .8rem;
}
.RPActa li {
    font-size: .9rem;
}
.RPActa a {
    font-size: .9rem;
    border-bottom: #FFD130 solid 3px;
}
.support-option {
    background-color: white;
    padding: 1rem;
}
.support-option h4 {
    color: black;
}
.support-option li {
    text-align: left;
    font-size: 0.9rem;
    line-height: 100%;
}
.payment-deets {
    text-align: center;
}
.payment-deets img {
    width:40%;
}

.flex {
    display:flex;
    align-items: center;
}
.vert-hor {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.flexcolumn {
    flex-direction: column;
}
.vert-hor img {
    width: 90%;
    margin: 2rem 0;
}
.hidemobile {
    display: none;
}

#class-header.background {
    padding: 0;
}
#class-header .background-textbox {
    margin:0;
    padding: 2rem;
}
#class-header h1 {
    margin-top:0;
}
#class-countdown {
    display: flex;
    flex-direction: column;
}
.countdown-container {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    background: transparent;
}

.countdown-box {
    text-align: center;
    background-color: white;
    border-radius: 10px;
    padding: 12px;
    width: 68px;
}

.countdown-time {
    font-size: 1.4rem;
    font-weight: bold;
}

.label {
    font-size: 10px;
    color: #777;
    margin-top: 5px;
}
.columnCentre {
    flex-direction: column;
    align-items: center;
}
#salesPage-isPossible {
    background-image: url("img/salesPage/house.jpg");
}
#salesPage-isPossible .background-textbox {
    max-width: 58rem;
}

img.mobile {
    display: block;
}
img.desktop {
    display:none;
}

.sfh-option {
    padding: 1rem;
    border: 1px #035780 solid;
    background-color: white;
}
.sfh-option li {
    text-align: left;
}



.bordered {
    border:#035780 15px solid;
    padding: 1rem;
}

/* Style the sticky navbar */
#navbar {
    overflow: hidden;
    background-color: #c1c2ad;
    padding: .5rem;
    justify-content: center;
    z-index: 40;
}
#navbar .button {
    margin: 0 0 0 2rem;
}

#navbar p {
    margin:0;
}
/* Sticky Navbar links */
#navbar a {
    float: left;
    display: block;
    text-align: center;
    text-decoration: none;
}
#navbar a.button {
    color: white;
}
#navbar a.button:hover {
    color:#535e4b;
}
#navbar p { 
    display: inline;
    color: black;
    text-align: left;
}

  
/* The sticky class is added to the navbar with JS when it reaches its scroll position */
.sticky {
    position: fixed;
    top: 0;
    width: 100%;
    border-bottom: 1px white solid;
}
  
/* Add some top padding to the page content to prevent sudden quick movement (as the navigation bar gets a new position at the top of the page (position:fixed and top:0) */
.sticky + .content {
    padding-top: 80px;
}

.ddio_countdown_wrap {
    width: 90%;
}


/* -----------------   ALL   ----------------- */


.right {
    margin-right: 0;
}
.surveycontainer {
    width:100%;
}
.eAQI0e {
    display: none;
    visibility: hidden;
}

/* -----------------   FOMO TOOL   ----------------- */

.fomo-notification-v2-classic .fomo-notification-content-wrapper p {
    font-size: .8rem;
}
.fomo-notification-v2-classic .fomo-notification-content-wrapper a {
    border-bottom: none;
    font-size: .8rem;
}



/* ------------------------------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------   MEDIA QUERIES   --------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------- */









/* --------------------------   312 - 340 px (Portrait Phone)   -------------------------- */


@media (min-width: 312px) {
    


    h5,
    p.h5 {
        font-size: 1rem;
    }


}


/* --------------------------   340 - 400 px (Portrait Phone)   -------------------------- */


@media (min-width: 340px) {
    

    

    
    .herocopy {
        margin-top: -20px;
    }

    

}
/* --------------------------   400 - 450 px (Portrait Phone)   -------------------------- */


@media (min-width: 400px) {
    

    .footer img {
        width: 80%;
    }
    img#footer-round-profile,
    img#ig-round-profile {
        width: 30%;
        border-radius: 110px;
    }

    .aboutUsBackground {
        background-image: url("img/barn-cat-reno-about-Karen-backgroundMED.jpg");
    }
    .contactBackground {
        padding: 2rem;
    }
    .contactBackground-box {
        padding: 3rem;
    }
    .testimonial img {
        width: 35%;
    }
    .testimonial-small img {
        width: 25%;
    }
    .igitem img {
        width: 20%;
    }
    .bordered {
        border:#035780 40px solid;
        padding: 1rem;
    }
    .product-tile h3 {
        font-size: 1.1rem;
        line-height: 1.5rem;
    }
    .ddio_countdown_wrap {
        width: 70%;
    }

}


/* --------------------------   450 - 550 px (Portrait Phone)   -------------------------- */


@media (min-width: 450px) {
    

    /* - UNIVERSAL & NAV - */


    .herocopy {
        margin-top: -30px;
    }


    .home-meetKaren {
        background-image: url("img/MeetKarenMed.jpg");
    }
    

    
    .third img {
        width: 100%;
    }
    .footer img {
        width: 60%;
    }
    .footer .third:first-of-type {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    img#footer-round-profile,
    img#ig-round-profile {
        width: 20%;
    }

    .blog-recent-posts .blog-list-item-image {
        width: 25%;
        margin-right: 5%;
    }
    .blog-recent-posts .blog-list-item-title {
        width: 70%;
    }

    .quarter {
        width: 25%;
        padding: .5rem;
    }
    .quarter .blog-promo h4 {
        margin-bottom: 0;
    }
    
    .black {
        padding: 3rem;
    }
    .prog-diff {
        padding: .5rem;
    }
    
    .waitlistForm p {
        margin: 1.5rem auto;
    }
    .waitlistForm form {
        max-width: 28rem;
        text-align: center;
        margin: auto;
    }
    .waitlistForm input {
        width: 60%;
        float: left;
        margin: 0 5% 0 0;
        clear: none;
    }
    .waitlistForm input#mc-embedded-subscribe {
        width: 35%;
        float: left;
        margin-right: 0;
    }

    .thingsYoullKnow {
        padding: 3rem;
    }



    
    .project {
        width: 50%;
    }
    .project img {
        width: 90%;
    }
    
    span.bold-indent {
        margin-left: 1.5rem;
    }
    

    .carousel {
        font-size: 1.5rem;
        line-height: 37.5px;
    }
    
    .carousel .pre {
        right: 54.5%;
    }
        
    .carousel .change_outer {
        left: 46%;
    }
    .element {
        max-width: 16rem;
    }
    .salesPagecta {
        padding: 3rem;
    }
    .RPActa {
        padding: 0;
    }


    .resource {
        width: 46%;
        margin: 1rem 2%;
    }

    .instagramcarousel .carousel-cell {
        height: 700px;
    }
    

    .right {
        margin-right: 0;
    }

}




/* --------------------------   640 - 768 px  (tablet-desktop) -------------------------- */

@media (min-width: 640px) {


    
    p,
    li,
    ul,
    ol,
    a {
        font-size: 1.1rem;
    }
    #hero h1 {
        font-size: 2.2rem;
        line-height: 40px;
    }
    #hero h2 {
        font-size: 1.5rem;
    }
    h3 {
        font-size: 1.5rem;
    }
    .rpamath a {
        font-size: 1.5rem;
    }
    #hero {
        background-image: url("img/barn-cat-reno-home-header-DTNEW.jpg");
    }
    .home-hero-box {
        padding: 3rem;
    }
    br.desktop {
        display: inline-block;
    }
    div.desktop {
        display: flex;
        flex-direction: column;
    }
    br.mobile,
    div.mobile {
        display:none;
    }
    img.hidemobile {
        display: block;
    }
    img.mobile {
        display: none;
    }
    img.desktop {
        display:block;
    }

    
   
    /* ---------  ALL PAGES  --------- */

    p.bigPromo {
        font-size: 1.5rem;
    }
    p.smallPromo {
        font-size: 1.2rem;
    }
    .wrapper {
        margin-top: 0;
    }
    .homepage-projects {
        flex-wrap: nowrap;
    }
    .homepage-projects img {
        width: 70%;
    }
    .homepage-projects a {
        margin: auto;
    }

    .home-meetKaren {
        background-image: url("img/MeetKaren.jpg");
        justify-content: flex-start;
        padding: 0 3rem;
    }
    .home-meetKaren-box,
    .aboutUsBackground-box {
        padding: 10rem 2rem;
        max-width: 21rem;
    }
    .aboutUsBackground {
        background-image: url("img/barn-cat-reno-about-Karen-backgroundLG.jpg");
        justify-content: flex-end;
        padding-top: 0;
    }
    .aboutBigPromo br:last-of-type {
        display: none;
    }
    .aboutBigPromo a:last-of-type {
        margin-left: 3rem;
    }

    .thingsYoullKnow {
        padding: 4rem;
    }
    .whatYoullLearn {
        padding: 1.5rem;
    }
    .whatYoullLearn li {
        font-size: 1.1rem;
    }


    .video-thumbnail {
        width: 47%;
        margin: 0 1.5% 3rem 1.5%;
    }
    
    
    

    .about-faqs {
        margin-left: 0;
        padding: 0;
        margin-bottom: 2rem;
    }
    .about-faqs h3,
    .about-faqs h4,
    .about-faqs p {
        text-align: center;
        max-width: 31rem; 
        margin-left: 0;
    }
    .about-faqs p {
        font-size: .9rem;

    }
    h2.learn {
        text-align: center;
    }

    #class-header {
        background-image: url("img/salesPage/karen-wide.jpg");
    }
    
    #class-header.background {
        padding: 5%;
    }
    #class-header .background-textbox {
        margin-left: -2rem;
        margin-right: 35%;
        padding: 2rem;
    }
    #class-header h1 {
        margin-top:0;
        font-size: 2.4rem;
        line-height: 40px;
    }
    .leftColumn p {
        font-size: .9rem;
    }

    
    .image-on-left {
        flex-direction: row-reverse;
    }
    
    .ck p,
    .ck h2,
    .cK input,
    .ck input.formkit-input,
    .cK button {
        text-align: left;
        margin-left:0;
    }
    .centred .cK input.formkit-input,
    .centred .cK button {
        margin-left: auto;
    }
    


    
    


    /* --- BLOG ---*/



    .blog-right-rail {
        width: 45%;
    }
    .blog-right-rail .blog-categories {
        display: block;
    }
    .blog-categories {
        text-align: left;
    }
    .blog-content {
        width: 52%;
        float: left;
        clear: none;
    }
    .blog-right-rail h5 {
        text-align: left;
    }
    .blog-popular-posts,
    .blog-recent-posts-rr,
    .blog-promo-posts {
        display: inline-block;
        margin-top: 3rem;
    }
    .blog-popular-posts li,
    .blog-recent-posts-rr li {
        list-style-type: none;
        margin: 0 0 .6rem;
        line-height: 16px;
        clear: both;
    }
    .blog-popular-posts a,
    .blog-recent-posts-rr a {
        font-size: .8rem;
        font-weight: bold;
    }
    .blog-recent-posts-rr img {
        width: 20%;
        float: left;
        margin-right: 1rem;
    }
    .blog-post h1,
    .blog-post h2,
    .blog-post h3,
    .blog-post h4,
    .blog-post h5,
    .blog-post p,
    .blog-post img {
        text-align: left;
        max-width: 50rem;
        margin-left: auto;
        margin-right: auto;
    }

    
    h5.author-date {
        text-align: center;
        margin-top: 1rem;
    }
    h5.blog-date {
        text-transform: none;
    }
    
    
    
    .recipe-prep-info p,
    .recipe-prep-info h5 {
        text-align: center;
    }

    .blog-list-item-image {
        width: 25%;
        margin-right: 3%;
        float: left;
    }
    .blog-list-item-title {
        width: 72%;
        float: left;
    }
    
    .blog-list-item h5 {
        margin-top: 0;
    }
    span.bold-indent {
        margin-left: 2rem;
    }

    .blog-recent-posts .blog-list-item-image {
        width: 20%;
        margin-right: 5%;
    }
    .blog-recent-posts .blog-list-item-title {
        width: 75%;
    }

    .instagramcarousel .carousel-cell {
        height: 500px;
    }

    .dictionary-item {
        display: flex;
        flex-direction: row;
    }
    .dictionary-item h4 {
        margin-top: 0;
    }
    .dict-img {
        width:30%;
        margin-left: 3%;
    }



    /* ---   RPA SALES PAGE   --- */

    .rpaLogo {
        display: block;
        margin: auto;
        width: 30%;
    }
    .rpaLogo img {
        border: none;
    }

    .moduleContent,
    .bonusContent,
    .greybox {
        padding: 2rem;
    }
    
    .thirtyPercent img {
        z-index: 10;
        width: 100%;
    }
    .thirtyPercentRight img {
        margin: 4rem 0 0 -1rem;
    }
    .thirtyPercentLeft img {
        margin: 4rem 0 0 1rem;
    }

    .guarantee p {
        text-align: left;
    }
    .priceBox h2 {
        text-align: center;
    }


    .testimonial {
        padding: 0 3rem;
        flex-direction: row;
        align-items: center;
    }
    .testimonial img {
        width: 25%;
        margin-right:5%;
    }

    .carousel {
        font-size: 1.6rem;
    }
    .salesPageIntro,
    .halfIntro {
        display: flex;
        justify-content: flex-start;
        flex-direction: row;
    }
    .salesPageIntro img {
        width: 45%;
        margin-right:5%;
        margin-bottom: 0;
    }
    .halfIntro {
        flex-direction: row;
    }
    .halfIntro img {
        width: 48%;
        margin-right: 5%;
        margin-bottom: 0;
    }
    .halfIntro form,
    .halfIntro h1,
    .halfIntro h3,
    .halfIntro p.h5 {
        text-align: left;
    }
    .salesPagecta {
        padding: 3rem 6rem;
    }
    .RPActa {
        padding: 0;
    }
    .salesPagecta li:before {
        margin-right: 1rem;
    }
    .salesPageModule {
        display: flex;
        flex-direction: row;
        align-items: center;
    }
    .salesPageModule img {
        width: 50%;
    }
    .background-textbox {
        padding: 4rem;
    }
    .vert-hor {
        flex-direction: row;
    }
    .vert-hor img {
        width: 35%;
        margin: 0 3% 0 0;
        padding: 0;
    }
    
    .desktop {
        display: flex;
    }
    .half-video-wrapper {
        width:50%;
        margin-right: 3%;

    }
    .half-video-wrapper video {
        height: auto;
        vertical-align: middle;
        width: 100%;
    }
    .video {
        width:90%;
        margin:auto;
    }

    
    


    .rpa-resources a.button {
        font-size: .9rem;
        margin-top: 1rem;
    }
    .rpa-resources .button {
        padding: .75rem 1rem;
        margin-bottom: 1rem;
        border-radius: 45px;
    }
    
    .right {
        margin-right: 0;
    }


    .product-tile h3 {
        font-size: 1.4rem;
        line-height: 1.7rem;
    }
}


/* --------------------------   768 - 1200 px  (tablet-desktop) -------------------------- */


@media (min-width: 768px) {
    

    /* - UNIVERSAL & NAV - */




    h1,
    #hero h1 {
        font-size: 2.8rem;
        line-height: 50px;
    }
    h2 {
        font-size: 2.5rem;
        margin: 0 auto 2rem auto;
        line-height: 46px;
    }
    #hero h2 {
        font-size: 1.7rem;
    }
    h3 {
        font-size: 1.8rem;
        line-height: 36px;
    }
    .home-hero-box {
        padding: 5rem;
    }
    .rpamath a {
        font-size: 1.75rem;
    }
    
    h4,
    h5,
    p.h5 {
        text-align: center;
        margin-top: 0;
    }
    p.left-align {
        text-align: left;
    }
    .checklist h2 {
        margin-top: 2rem;
    }
    .footer p.h5,
    .legal p.h5 {
        text-align: left;
    }
    .faqs h4 {
        margin-top: 1.5rem;
    }
    .footer img {
        width: 70%;
    }
    .herocopy {
        margin-top: -40px;
    }

    .main-content {
        padding: 4rem 0;
    }
    .about-faqs {
        padding: 2rem 0;
    }
    .logo {
        text-align: left;
        float: left;
    }
    .logo img {
        width: 8rem;
    }
    .main-nav {
        clear: none;
        float: right;
        margin: 0;
        padding: 0;
        border: none;
    }
    .main-nav li {
        padding: 1rem;
        float: left;
        width: auto;
        margin: .5rem 0;
    }
    .main-nav li a {
        display: inline;
        text-align: right;
    }

    /* - GRIDS - */
    
    .half {
        width: 47.5%;
        margin-right: 5%;
        float: left;
        margin-bottom: 0;
    }

    .sixtyPercent {
        width: 55%;
        margin-bottom: 0;
    }
    .seventyPercent {
        width: 65%;
        margin-bottom: 0;
    }
    .eightyPercent {
        width: 75%;
        margin-bottom: 0;
    }
    .imgLeft {
        display:flex; 
        justify-content: flex-start;
    }

    .half h2,
    .half h3,
    .half h4,
    .half p,
    .sixtyPercent h2,
    .sixtyPercent h3,
    .sixtyPercent h4,
    .sixtyPercent p {
        text-align: left;
    }
    .thirtyPercent {
        width: 35%;
        margin-bottom: 0;
    }
    .moduleContent h3 {
        text-align: center;
    }
    .fortyPercent {
        width: 40%;
        margin-bottom: 0;
        margin-right: 5%;
        }
    
    .swap img {
        margin-left: 3%;
        margin-right: 0;
    }
    
    .moduleImage img {
        display:block;
    }





    p.bigPromo {
        font-size: 2rem;
    }
    p.smallPromo {
        font-size: 1.5rem;
    }
    .video {
        width:65%;
        margin:auto;
    }
    .YTvideo .video {
        width: 100%;
    }

    .thingsYoullKnow {
        padding: 5rem;
    }
    

    .contactBackground-box {
        padding: 5rem 8rem;
    }
    .contactBackground-box input,
    .contactBackground-box select {
        width: 100%;
    }
    .size1of2 input,
    .size1of2 select {
        width: 48%;
    }
    .contactBackground-box .left input {
        margin-right: 4%;
    }
    .contactBackground-box .row {
        margin: inherit auto;
    }

    .contactBackground-box h4 {
        margin-left: 3.8rem;
        margin-right: 3.8rem;
    }

    .blog-post img {
        width: 70%;
    }
    img.full-width {
        width: 100%;
    }

    .third {
        width: 30%;
        margin-right: 5%;
    }
    .two-thirds {
        width: 65%;
    }

    .blog-right-rail {
        width: 35%;
    }
    .blog-content {
        width: 62%;
    }
    .blog-list-item h2 {
        font-size: 1.5rem;
        line-height: 36px;
    }
    .related-posts .row {
        margin-bottom: 2rem;
    }
    p.margin,
    ul.margin {
        margin-left: 3rem;
    }
    .colour {
        padding: 3rem;
    }
    .prog-diff {
        padding: .5rem;
    }

    #class-header.background {
        padding: 5%;
    }
    #class-header .background-textbox {
        margin-left: -2rem;
        margin-right: 45%;
        padding: 2rem;
    }



    /* --- COURSE ---*/

    .course-desc {
        padding: 2rem 0;
    }
    .course-desc p,
    .course-desc h2 {
        padding-right: 40%;
    }
    .course-desc h2 {
        text-align: left;
        margin-bottom: 1rem;
    }
    p.course-promise {
        padding: 1rem 2rem 1rem 7%;
        margin-left: 0;
        margin-right: 40%;
    }
    .swap {
        display: flex;
        flex-direction: row-reverse;
    }
    .swap .course-desc p,
    .swap .course-desc h2,
    .swap .course-desc a.button {
        margin-left: 35%;
    }
    .swap .course-desc p,
    .swap .course-desc h2 {
        margin-left: 35%;
        padding-right: 4rem;
    }

    .swap p.course-promise {
        padding: 1rem 2rem 1rem 35%;
        margin-left: 0;
        margin-right: 0;
    }
    .twentyPercent {
        width: 25%;
        margin-bottom: 0;
        margin-left: -12%;
    }
    .swap .twentyPercent {
        margin-right: -12%;
    }
    .twentyPercent img {
        width: 215%;
        padding-right: 2rem;
    }
    .swap .twentyPercent img {
        padding-left: 2rem;
        z-index: 40;
    }


    .myService p {
        text-align: left;
    }
    .course-desc h2 {
        margin-bottom: 1rem;
    }

    .product {
        width: 22%;
        margin: 1.5%;
    }


    /* -- INSTAGRAM --*/
    


    .igitem p,
    .igitem h2 {
       text-align: left;
       max-width: 1200px;
    }
    .igitem h2 {
        font-size: 2rem;
        line-height: 46px;
    }
    .igitem img {
        width: 20%;
    }


    .bonusContent,
    .greybox {
        padding: 3rem;
    }

    .thirtyPercent img {
        width:107%;
    }
    .thirtyPercentRight img {
        margin: 2rem 0 0 -2rem;
    }
    .thirtyPercentLeft img {
        margin: 2rem 0 0 2rem;
    }
    .expiring img {
        margin-top:-1rem;
    }
    
    .blog-recent-posts .blog-list-item-image {
        width: 15%;
        margin-right: 5%;
    }
    .blog-recent-posts .blog-list-item-title {
        width: 80%;
    }

    .instagramcarousel .carousel-cell {
        height: 550px;
    }
    
    /* --- RESOURCES ---*/

        
    
    .resource {
        width: 23%;
        margin: 1rem 1%;
    }
    .wideresource {
        flex-direction: row;
    }
    .wideresource video,
    .wideresource img {
        padding-right: 5%;
    }
    .wideresource p {
        font-size: 1rem;
    }
    .wideresource h4 {
        text-align: left;
    }
    .res-img {
        width:60%;
    }

    .carousel {
        font-size: 1.65rem;
    }
    
    .element {
        max-width: 18rem;
    }
    .salesPagecta ul {
        padding: 0 2rem;
    }
    .RPActa ul {
        padding: 1rem 2rem 1rem 4rem;
    }

    span.bold-indent {
        margin-left: 2.5rem;
    }

    .dictionary-item h4 {
        margin-top: 0;
    }
    .payment-deets img {
        width:15%;
    }


/* -----------------   RENOVATION COURSES + TOOLS   ----------------- */


    .product-tile {
        margin-bottom: 1rem;
    }
    .product-tile p,
    .product-tile a {
        font-size: .9rem;
        text-align: left;
    }
    .product-tile a.cta {
        text-align: left;
    }


    /* -----------------   CLASS   ----------------- */
   
    #class-countdown {
        flex-direction: row;
        justify-content: center;
    }
    .countdown-container {
        margin-left: 3rem;
        gap: 16px;
    }
    .countdown-box {
        padding: 12px;
        width: 80px;
    }
    .countdown-time {
        font-size: 2rem;
    }
    
   

    .right {
        margin-right: 0;
    }
}

/* --------------------------   900px    -------------------------- */

@media (min-width: 900px) {
    
    .home-hero-box {
        padding: 7rem;
    }
    .carousel {
        line-height: 75px;
    }
    .element {
        max-width: 50rem;
    }
    .instagramcarousel .carousel-cell {
        height: 680px;
    }
    #class-header.background {
        padding: 15%;
    }
    #class-header .background-textbox {
        margin-left: -2rem;
        margin-right: 40%;
        padding: 2rem; 
    }

}



/* --------------------------   1200px    -------------------------- */

@media (min-width: 1200px) {

    
    .main-content,
    header {
        margin: auto;
    }

    .herocopy {
        margin-top: -60px;
    }
    .about-faqs p {
        font-size: 1rem;

    }



    blockquote h3 {
        font-size: 2.3rem;
        line-height: 48px;
    }

    .background {
        padding: 10rem;
    }

    
    .aboutUsBackground {
        background-image: url("img/barn-cat-reno-about-Karen-background1.jpg");
    }
    /* .home-meetKaren, */
    .aboutUsBackground {
        padding: 10rem 10rem;
    }
    .home-meetKaren-box,
    .aboutUsBackground-box {
        padding: 2rem;
    }
    /* .home-meetKaren-box {
        max-width: 28rem;
    } */
    .background-textbox {
        padding: 2rem;
        max-width: 28rem;
    }

    #class-header.background {
        padding: 8% 49% 6% 20%;
    }
    #class-header .background-textbox {
        margin-left: -2rem;
        margin-right: 0;
        padding: 2rem; 
    }


    #hero {
        justify-content: flex-end;
    }
    .home-hero-box {
        padding: 10rem;
    }
    .home-hero-box h2 {
        max-width: 34rem;
        margin: 1.3rem auto;
    }
    .signup-box {
        padding: 1rem;
    }
    .home-signup-box {
        padding: 3rem;
    }

    
    
    .blog-right-rail {
        width: 30%;
    }
    .blog-content {
        width: 67%;
    }
    .blog-recent-posts .blog-list-item-title h5 {
        margin-bottom:1rem;
    }
    .blog-recent-posts .blog-list-item-title h4 {
        font-size: 1.3rem;
    }
    .instagramcarousel .carousel-cell {
        height: 780px;
    }

    .service-option p {
        margin: 2rem;
    }

    .service-option ul {
        padding: 0 3rem;
    }
    .thingsYoullKnow {
        padding: 10rem 15rem;
    }
    .thingsYoullKnow p {
        max-width: 60rem;
    }
    .whatYoullLearn {
        padding: 3rem;
    }



    .process-step p,
    .process-step a {
        font-size: 1rem;
    }

    
    span.bold-indent {
        margin-left: 3rem;
    }

    .right {
        margin-right: 0;
    }





    

    .bonusContent,
    .greybox {
        padding: 3rem 7rem;
    }

    .thirtyPercentRight img {
        margin: 3rem 0 0 -2rem;
    }
    .thirtyPercentLeft img {
        margin: 3rem 0 0 2rem;
    }

    .carousel {
        font-size: 2.1rem;
    }

    ._cUP1np9gMvFQrcPftuf.xahN8AEzyAvQtVj17TPv {
        margin-top: 0;
    }
}






