/**--**/
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:wght@300;400;500;600;700&family=Righteous&display=swap');
@import url("https://use.typekit.net/yxm1tyw.css");
body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, b, strong {
    font-family: 'Bricolage Grotesque', sans-serif;
}
h2{
    font-size:24px
}
body p{
    font-family: 'lexia', serif !important;
    font-size:18px;
    font-weight: lighter;
}
.component-section{
    padding-top:0;
    padding-bottom:0;
}
.footer{
    margin-top:0;
}

#yellowSection{
    background-position:center;
}

@media screen and (max-width:768px){
    .text.parbase{
        padding:8px;
    }
    .cols3 .text.parbase{
        padding:0px;
    }
    .topbanner{
    min-height:350px;
        
    }
}

.banner-text-image img {
    margin: 150px 0 150px 100px;
    background: fix;
}

.light-gray-container {
    background-color: #f1f0ef;
}

@media screen and (max-width:768px){
        .banner-text-image img {
        margin: 100px 0 100px 0;
    }
        .light-gray-container {
        margin: 0;
        padding:0;
    }
}

@media (max-width: 767px) and (min-width: 0px){
        .page-section-inner {
        padding: 0;
    }
}

@media (max-width: 768px) {
  .responsive-text {
    font-size: 30px !important;
  }
}