@charset "utf-8";
/* Uncomment to include Google Font & Icons files */
/* @import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined"); */

* {padding: 0; margin: 0;}
img {border: 0; vertical-align: middle;}
html, body, div, form, fieldset, legend, label, p, h1, h2, h3 {margin: 0; padding: 0;}
header, nav, article, footer, address, aside, section, hgroup {display:block;}
.float {float: left;} .clear {clear: both;} 

body {font-family: 'Poppins', sans-serif; font-weight: 300; margin: 0; padding: 0; font-size: 17px; line-height: 28px; color: #414042;}

h1 {font-family:"athelas", serif;font-weight: 400; font-size: 40px; line-height: 50px; color: #000;}
h2 {font-family:"athelas", serif;font-weight: 400; font-size: 35px; line-height: 45px; color: #000;}
h3 {font-family:"athelas", serif;font-weight: b400; font-size: 26px; line-height: 35px; color: #000;}
h4 {font-family: 'Poppins', sans-serif;font-weight: 400; font-size: 20px; line-height: 25px; color: #000;}

a {text-decoration: none; font-weight: 400; color: #AF2451;}
a:hover {text-decoration: underline; font-weight: 400; color: #AF2451;}

ul {list-style-type: disc; list-style-position: outside; padding-left: 25px;}

.banner-left {float:left;width: 50%; height:600px; background-size: cover; background-position: center center; text-align:center;}
.banner-right {float:left;width: 50%; height:600px;  text-align:center; font-size: 18px; line-height: 25px; color:#000;}
.banner {background-color: #8DC63F;}
img.mini-bowl {width: 150px; height: auto; padding-top: 100px;}
img.video {width: 75px; height: auto;padding-top: 250px;}
.banner h2 {font-size: 40px; line-height: 50px; color: #000;}

.client-logo {width: 14%; height: auto;float:left;}

.dark-mauve {color: #a72450;}
.light-green {color: #8dc63f;}

img.blogimage {width: 750px; height: auto;}

.testimonial {font-size: 25px; line-height: 35px;font-family:"athelas", serif;}

.home-link a {width: 100%; height: 0px; padding-top: 40%; padding-bottom: 20%; background-size: cover; background-position: center center; display:block;}
.home-link a .inner-link {background-color: rgba(141, 198, 63, 0.8); color: #fff; width: 80%; margin-left: 10%; margin-right: 10%; display:block; padding-top: 10px; padding-bottom: 10px;}
.home-link a:hover {text-decoration: none;}

.light-bg {display:block; padding: 5%; padding-top: 50px; padding-bottom: 50px; background-color: #f1f2f2; margin-bottom: 75px;}
.green-bg {background-color: #8dc63f; display:block; padding: 15px;  margin-bottom: 75px;}
.green-bg-logo {background-color: #8EC045; display:block; padding: 5%; padding-top: 50px; padding-bottom: 50px;  margin-bottom: 75px;
background-image: url('../images/green-bg-bowl.png'); background-position: bottom left; background-repeat: no-repeat; background-size: 50% auto; color: #000;}

.mauve-bg-logo {background-color: #AE2551; color: #fff; display:block; padding: 5%; padding-top: 50px; padding-bottom: 50px;  margin-bottom: 75px;
background-image: url('../images/mauve-bg-bowl.jpg'); background-position: bottom left; background-repeat: no-repeat; background-size: 50% auto;}

.mauve-bg-logo h2 {color: #fff;}
.mauve-bg-logo a {color: #8DC63F;}
.mauve-bg-logo .caselink {background-color: #000 !important; }
.mauve-bg-logo .caselink .span-title {color: #fff !important;}
.mauve-bg-logo .caselink .span-view {color: #8DC63F !important;}

a.social img {width: 30px; height: 30px; margin-left: 5px; scale: 1; transition: scale 0.5s;}
a:hover.social img {scale: 1.2;}

a.black-box-link {background-color: #000; color: #fff; padding: 10px 25px 10px 25px; font-weight: 300;}
.banner a.black-box-link {background-color: #000; color: #fff; padding: 10px 40px 10px 40px; font-weight: 300;}

.green-bg a {color: #a72450; font-weight: 400;}

.lead-para {font-size: 16px; line-height: 18px; color: #777;}
.material-symbols-outlined {}
img.pull-left {float:left; padding-right: 20px;} img.pull-right {float:right; padding-left: 20px;}
img.resp {width: 100%; height: auto;}

.foot-1 {float:left; width: 33.3%; padding-top: 50px;}
.foot-2 {float: left; width: 33.3%; padding-top: 50px; color: #000;}
.foot-2 a {color: #000;}
.foot-3 {float: left; width: 33.3%; padding-top: 50px;}
.foot-4 {display:block; width: 100%; text-align:center; color: #000;}

.foot-1 a {font-weight: 400; color: #000000;}
.foot-2 a {font-weight: 400;}

.one-1, .two-1, .two-2, .three-1, .three-2, .three-3, .three-12, .four-1, .four-2, .four-3, .four-4,
.five-1, .five-2, .five-3, .five-4, .five-5, .six-1, .six-2, .six-3, .six-4, .six-5, .six-6
{min-height: 50px;float:left; text-align: left; display: block; padding: 1%; margin: 0px 0.5% 10px 0.5%;}


@media only screen and (min-width: 1350px) { /* WIDE - Desktop */
  .one-1 {width: 97%; }
  .two-1, .two-2 {width: 47%; }
  .three-1, .three-2, .three-3 {width: 30.33%; }
  .three-12 {width: 63.66%; }
  .four-1, .four-2, .four-3, .four-4 {width: 22%; }
  .five-1, .five-2, .five-3, .five-4, .five-5 {width: 17%; }
  .six-1, .six-2, .six-3, .six-4, .six-5, .six-6 {width: 13.66%}
  .break {display:block;}
}

@media only screen and (min-width: 768px) and (max-width: 1349px) { /* MEDIUM - Tablet Portrait */
  .one-1 {width: 97%;}
  .two-1, .two-2 {width: 47%;}
  .three-1, .three-2, .three-3 {width: 30.33%;}
  .three-12, .three-23 {width: 63.66%; margin-top: 0px;}
  .four-1, .four-2, .four-3, .four-4 {width: 22%;}
  .five-1, .five-2, .five-3, .five-4, .five-5 {width: 17%; }
  .six-1, .six-2, .six-3, .six-4, .six-5, .six-6 {width: 30.33%;} 
}

@media only screen and (min-width: 480px) and (max-width: 767px) { /* SMALL - Mobile Landscape */
  .one-1 {width: 97%;}
  .two-1, .two-2 {width: 97%; }
  .three-1, .three-2, .three-3 {width: 97%; }
  .three-12, .three-23 {width: 97%; }
  .four-1, .four-2, .four-3, .four-4 {width: 47%;}
  .five-1, .five-2, .five-3 {width: 30.33%; }
  .five-4, .five-5 {width: 47%; }
  .six-1, .six-2, .six-3, .six-4, .six-5, .six-6 {width: 47%;}
    .banner-left {width: 100%;}
  .banner-right { width: 100%;}
  .foot-1 {float:none; width: 90%; margin-left: 5%; margin-right: 5%; text-align:center; margin-bottom: 30px;}
  .foot-2 {float: none; width: 90%; margin-left: 5%; margin-right: 5%; text-align:center; margin-bottom: 30px;}
  .foot-3 {float: none; width: 90%; margin-left: 5%; margin-right: 5%; text-align:center; margin-bottom: 30px;}  
  .client-logo {width: 33%; height: auto;float:left;}
  img.client-logo.shifty {margin-left: 35%;} 
  img.blogimage {width: 98%; margin-left: 1%; margin-right: 1%;}
}

@media only screen and (max-width: 479px) { /* TINY - Mobile Portrait */
  .one-1 {width: 97%; }
  .two-1, .two-2 {width: 97%; }
  .three-1, .three-2, .three-3 {width: 97%; }
  .three-12, .three-23 {width: 97%; }
  .four-1, .four-2, .four-3, .four-4 {width: 47%; }
  .five-1, .five-2, .five-3, .five-4 {width: 47%}
  .five-5 {width: 97%; }
  .six-1, .six-2, .six-3, .six-4, .six-5, .six-6 {width: 97%;}
  .banner-left {width: 100%;}
  .banner-right { width: 100%;}
  .foot-1 {float:none; width: 90%; margin-left: 5%; margin-right: 5%; text-align:center; margin-bottom: 30px;}
  .foot-2 {float: none; width: 90%; margin-left: 5%; margin-right: 5%; text-align:center; margin-bottom: 30px;}
  .foot-3 {float: none; width: 90%; margin-left: 5%; margin-right: 5%; text-align:center; margin-bottom: 30px;}
  .client-logo {width: 33%; height: auto;float:left;}
  img.client-logo.shifty {margin-left: 35%;} 
    img.blogimage {width: 98%; margin-left: 1%; margin-right: 1%;}
}