/* ==== BROWSER RESETS  ==== */
* { box-sizing: border-box; padding: 0; margin: 0 }
body, html { height: 100% }
body { max-width: 1600px; font-family: sans-serif }
img { width: 100%; height: auto; display: block }
html { scroll-behavior: smooth; scroll-padding-top: 72px }

/* Default font and colours */
body { font-family: 'Rubik', sans-serif }
h1, h2, h3 { color: #222 }
p, li { color: #403d50 }
.bg-pastel-green { background-color: #fef1ef }
.bg-pastel-grey { background-color: #edf5f1 }


/* ===================== BEGIN MENU STYLES ========================== */

/* === All screen sizes ====== */

.unhide-content-under-sticky-menu { margin-top: 72px }

/* Positions all menus in front of page content */
.container-menu-desktop, 
.container-menu-bar-mobile, 
.flyout-menu { z-index: 999 }
.container-menu-desktop, .container-menu-bar-mobile { width:100% }

/* on mobiles - hide desktop menu */
@media all and (max-width:767px) { 
    .container-menu-desktop.menu-light { display: none }
}

/* on desktops - hide mobile menu bar and list of menu options */
@media all and (min-width:768px) { 
    .container-menu-bar-mobile.menu-light,
    .flyout-menu.menu-light { display: none }
}

/* sticks menu to top of desktop and/or mobile screen */
.menu-sticky { position: fixed; top: 0; left: 0; right: 0; }

/* prevents content from disappearing udner sticky menus */
.sticky-anchor {
    position: relative;
    border-top: 90px solid transparent;
    margin: -90px 0 0;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
 }
 
 .sticky-anchor:before {
    content: "";
    position: absolute;
    top: -2px;
    left: 0;
    right: 0;
 }
 
/* Height of desktop menu and mobile menu bar */
.container-menu-desktop, .container-menu-bar-mobile { height:72px }

/* website logo fixed size in desktop menu and mobile menu bar  */
.container-menu-desktop    a:first-child img,
.container-menu-bar-mobile a:first-child img { width: 200px; height: 40px }

/* website logo vertically centered in desktop menu and mobile menu bar  */
.container-menu-desktop    a:first-child,
.container-menu-bar-mobile a:first-child { display: flex; flex-direction: row; align-items: center }

/* hide bullet character on listed links */
.container-menu-desktop ul li,
.flyout-menu            ul li { list-style-type: none }

/* hide link underlines on desktop and mobile menus */
.container-menu-desktop ul li a,
.flyout-menu            ul li a { text-decoration: none }

/* make desktop menu options bold */
.container-menu-desktop ul li a { font-weight:bold }

/* style cta button on desktop and mobile menus */
.container-menu-desktop ul li a.btn-cta,
.flyout-menu            ul li a.btn-cta {
    display: inline-block;
    border-width: 2px;
    border-style: solid;
    font-weight: bold;
}

/* style icon in cta button on desktop and mobile menus */
.container-menu-desktop ul li a.btn-cta i,
.flyout-menu            ul li a.btn-cta i { margin-right: 8px; font-size: 90% }

/* on mobiles, prevent scrolling outside flyout menu */
.no-scroll { overflow: hidden }

.menu-drop-shadow { box-shadow: 0 1px 10px #888 }

/* ======= DESKTOP MENU ======= */

/* outer parent flexbox container 
   home page link (with website logo) at left and ul links at right are its two children */
.container-menu-desktop {
	display: flex;
    justify-content: space-between;
    padding: 0 6% 0 6%;
    width: 100%;
}

/* menu links and cta button aligned horizontally */
.container-menu-desktop ul li {
    display: inline-block;
    margin: 0 80px 0 0; /* spacing at right of menu links, cta button */
}

.container-menu-desktop ul li:last-child {
    margin-right: 0 /* no spacing at right of last menu link or cta button */
}

/* vertically center menu links and cta button */
.container-menu-desktop ul { display: flex; align-items: center }

/* style text for links and cta button  */
.container-menu-desktop ul li a {
    font-size: calc(15px + (19 - 15) * ((100vw - 320px)/(1600 - 320)));
    /* font-weight:bold */
    /* text-transform: uppercase */
}

/* cta button padding */
.container-menu-desktop ul li a.btn-cta { padding: 6px 20px }


/* ======= MOBILE MENU  ======== */

/* outer flexbox container for mobile menu bar 
   home page link (with website logo) at left and hamburger icon at right are its two children */
.container-menu-bar-mobile {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
    width: 100%;
    padding: 0 6% 0 6%;
}

/* three bars hozizontal in hamburger icon */
.container-menu-bar-mobile .item-icon .bar1, 
.container-menu-bar-mobile .item-icon .bar2, 
.container-menu-bar-mobile .item-icon .bar3 { width: 36px; height: 4px; margin: 7px 0; transition: 0.4s }

/* hamburger icon changes shape to 'X' when fly-out menu is visible */
.change .bar1 { transform: rotate(-45deg) translate(-9px, 6px) }
.change .bar2 { opacity: 0 }
.change .bar3 { transform: rotate(45deg) translate(-8px, -8px) }

/* container div for flyout menu content */
.flyout-menu { 
    position: fixed; display: block; 
    top: 72px; /* same height as menu bar */
    width: 320px; 
    max-height: 100%;
    height: 100%;
    padding: 30px 40px 40px 40px;
    transition: 0.5s;
    overflow-x: hidden;
    overflow-y: scroll;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch; /* safari on mobiles */    
}

.flyout-menu.flyout-menu-is-closed {
    right: -320px; /* hides flyout menu */
}

.flyout-menu.flyout-menu-is-open {
    right: 0; /* displays flyout menu */
    overscroll-behavior: contain;
    overscroll-behavior-y: contain
}

/* drop shadow border at left of fly-out menu */
.flyout-menu.flyout-menu-is-open {
    box-shadow: 0px 1px 10px #888 
}

/* list of links on flyout menu */
.flyout-menu ul li { margin: 0 40px 30px 0 }

/* style flyout menu links */
.flyout-menu ul li a {
    font-size: 18px;
    /* font-weight:bold */
    /* text-transform: uppercase */
}

/* cta button */
.flyout-menu a.btn-cta {
    display: inline-block;
    padding: 10px 24px;
}

.flyout-menu hr { 
    height: 4px;
    margin: 32px 0 0 0;
    border-style: solid;
    border-width: 1px 
} 

.flyout-menu h4 {
    font-size: 20px;
    margin: 42px 0 4px 0;
    text-align: center;
    /* letter-spacing: 2px; *./
    /* text-transform: uppercase */
}

.flyout-menu h5 {
    font-size: 17px;
    margin: 20px 0 20px 0;
    text-align: center
}

.flyout-menu h5 a {
    font-size: 17px;
    text-decoration: none;
    padding-bottom: 4px;
    border-bottom-style: solid;
    border-bottom-width: 2px
}

.flyout-menu p { 
    text-align: center; font-size: 15px; line-height: 1.4;
}

.flyout-menu.flyout-menu-is-open div.fly-out-profile-box,
.flyout-menu.flyout-menu-is-open div.fly-out-social-icons {
    display:flex;
    flex-direction: row;
    justify-content: space-between;    
}

.flyout-menu.flyout-menu-is-open div.fly-out-profile-box img,
.flyout-menu.flyout-menu-is-open div.fly-out-profile-box p { width: 47% }

.flyout-menu.flyout-menu-is-open div.fly-out-profile-box img {
    display: block; border-radius: 100%;
    width: 104px; height: 104px; 
    border-style: solid;
    border-width: 2px
}

.flyout-menu.flyout-menu-is-open div.fly-out-profile-box p {
    text-align:left 
}

.flyout-menu.flyout-menu-is-open div.fly-out-social-icons { 
    margin-top:12px
}

.flyout-menu.flyout-menu-is-open div.fly-out-social-icons a {
    font-size: 26px;
    text-align: center 
}

/* ========= Light background menu - desktops and mobiles ========= */

/* background colour */
.menu-light { 
	background-color: #fff;
	transition: all .5s ease-in-out;
}

/* menu links */

.menu-light ul li a { font-weight: 500 } 
.menu-light ul li a:link,  .menu-light ul li a:visited { color: #403d50 }
.menu-light ul li a:hover, .menu-light ul li a:active  { color: pink }

/* cta button */

.menu-light ul li a.btn-cta { font-weight: 500 }
.menu-light ul li a.btn-cta:link, 
.menu-light ul li a.btn-cta:visited {
    border-color: pink;
    background-color: pink;
    color: #000;
}

.menu-light ul li a.btn-cta:hover,
.menu-light ul li a.btn-cta:active {
    border-color: #F77BB6;
    background-color: #F77BB6;
    color: #fff
}

/* on mobiles only */
.flyout-menu.menu-light { background-color: #fef1ef }
.menu-light.flyout-menu hr { background-color: pink; border-color: pink } 

.menu-light.flyout-menu h4,
.menu-light.flyout-menu h5,
.menu-light.flyout-menu h5 a, 
.menu-light.flyout-menu p { color: #403d50 } 

/* colour of hamburger icon bars */
.menu-light .item-icon .bar1, 
.menu-light .item-icon .bar2, 
.menu-light .item-icon .bar3 { background-color: #F77BB6 }	

/* phone number link */
a[href^=tel] { text-decoration: none; color: pink }

/* email link */
.menu-light.flyout-menu h5 a:link, 
.menu-light.flyout-menu h5 a:visited {
    border-bottom-color: pink;
}

.menu-light.flyout-menu h5 a:hover, 
.menu-light.flyout-menu h5 a:active {
    border-bottom-color: transparent;
}

/* profile image border colour */
.menu-light.flyout-menu.flyout-menu-is-open div.fly-out-profile-box img { border-color: pink }

/* contact icons */
.menu-light.flyout-menu .fly-out-social-icons a i { color: #F77BB6 }

/* === End light background menu === */



/* ==========================================================================
   Start of base Webflow CSS - If you're looking for some ultra-clean CSS, skip the boilerplate and see the unminified code below.
   ========================================================================== */
.w-container .w-row{margin-left:-10px;margin-right:-10px}.w-row:before,.w-row:after{content:" ";display:table;grid-column-start:1;grid-row-start:1;grid-column-end:2;grid-row-end:2}.w-row:after{clear:both}.w-row .w-row{margin-left:0;margin-right:0}.w-col{position:relative;float:left;width:100%;min-height:1px;padding-left:10px;padding-right:10px}.w-col .w-col{padding-left:0;padding-right:0}.w-col-1{width:8.33333333%}.w-col-2{width:16.66666667%}.w-col-3{width:25%}.w-col-4{width:33.33333333%}.w-col-5{width:41.66666667%}.w-col-6{width:50%}.w-col-7{width:58.33333333%}.w-col-8{width:66.66666667%}.w-col-9{width:75%}.w-col-10{width:83.33333333%}.w-col-11{width:91.66666667%}.w-col-12{width:100%}.w-hidden-main{display:none !important}


@media screen and (max-width:767px){.w-hidden-main{display:inherit !important}.w-hidden-medium{display:inherit !important}.w-hidden-small{display:none !important}.w-row,.w-container .w-row{margin-left:0;margin-right:0}.w-col{width:100%;left:auto;right:auto}.w-col-small-1{width:8.33333333%}.w-col-small-2{width:16.66666667%}.w-col-small-3{width:25%}.w-col-small-4{width:33.33333333%}.w-col-small-5{width:41.66666667%}.w-col-small-6{width:50%}.w-col-small-7{width:58.33333333%}.w-col-small-8{width:66.66666667%}.w-col-small-9{width:75%}.w-col-small-10{width:83.33333333%}.w-col-small-11{width:91.66666667%}.w-col-small-12{width:100%}}


/* ==========================================================================
   Start of custom Webflow CSS
   ========================================================================== */


@media screen and (max-width: 479px) {
  .w-commerce-commercecartcontainerwrapper--cartType-modal {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
  }
  .w-commerce-commercecheckoutrow {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

a {
  border-bottom: 1px solid #eed6be;
  color: #b68757;
  text-decoration: none;
}

.section {
  height: 100px;
  padding-top: 0px;
  padding-bottom: 0px;
}


.div-block {
  display: -ms-grid;
  display: grid;
  grid-auto-columns: 1fr;
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -ms-grid-columns: 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  -ms-grid-rows: auto auto;
  grid-template-rows: auto auto;
}

.parallax {
  position: relative;
  overflow: hidden;
  height: 85vh;
  margin-bottom: 94px;
}

.parallax.homepage {
  height: 80vh;
  margin-bottom: 0px;
}

.parallax.slack {
  z-index: -10;
  height: 50vw;
  max-height: 600px;
  margin-bottom: -101px;
}



.wrapper {
  position: relative;
  display: block;
  width: 1000px;
  max-width: 100%;
  margin-right: auto;
  margin-left: auto;
}

.wrapper.cc-header {
  width: 600px;
}

.wrapper.cc-top {
  padding-top: 30px;
}

.wrapper.cc-post {
  padding-top: 0px;
  padding-bottom: 80px;
}

.wrapper.cc-post.cc-about {
  width: 900px;
  padding-top: 59px;
}

.wrapper.cc-homepage {
  padding-bottom: 83px;
}

.wrapper.cc-900 {
  width: 900px;
  padding-top: 38px;
  padding-bottom: 104px;
}

.wrapper.cc-900.cc-newsletter {
  padding-top: 60px;
  padding-bottom: 187px;
}

.wrapper.full-img {
  width: 500px;
  padding-left: 46px;
  float: left;
}

.wrapper.cc-fullimg {
  position: absolute;
  left: 0%;
  top: 0%;
  right: 0%;
  bottom: auto;
  z-index: 100;
}

.wrapper.cc-white {
  z-index: 100;
  background-color: #fff;
}

.grid {
  height: 500px;
  padding-bottom: 10px;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  -ms-grid-columns: 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  text-align: center;
}

.homepage-thumbnail-title {
  position: relative;
  z-index: 10;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: visible;
  margin-right: auto;
  margin-bottom: 0px;
  margin-left: auto;
  padding-top: 8px;
  padding-bottom: 0px;
  clear: none;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-color: #132b4e;
  font-family: 'Circularstd book', Arial, sans-serif;
  color: #132b4e;
  font-weight: 800;
  text-align: left;
}

.homepage-thumbnail-title.card-title {
  display: block;
  margin-bottom: 27px;
  margin-left: 0px;
  padding-bottom: 8px;
  clear: none;
  border-width: 4px;
  border-color: #cfe6eb;
  border-bottom-style: solid;
  font-family: Sentinel, Georgia, sans-serif;
  color: #d3eaef;
  font-size: 40px;
  line-height: 46px;
}

.homepage-thumbnail-title.card-title.dark-blue {
  border-color: #c59b6e;
  color: #003a8e;
}

.homepage-thumbnail-title.card-title.light-blue {
  margin-bottom: 23px;
}

.homepage-thumbnail-title.cc-comingsoon {
  padding-bottom: 20px;
  font-family: Sentinel, Georgia, sans-serif;
  color: #fff;
  font-size: 31px;
  line-height: 30px;
  font-weight: 900;
  text-align: center;
}

.homepage-thumbnail-tag {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-right: auto;
  margin-left: auto;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-family: 'Circularstd book', Arial, sans-serif;
  color: #b0bdd0;
  font-size: 10px;
  font-weight: 100;
  text-align: left;
  letter-spacing: 0.5px;
}

.homepage-thumbnail-tag.card {
  font-family: 'Circularstd book', Arial, sans-serif;
  font-size: 14px;
}

.homepage-thumbnail {
  margin-top: 4px;
  padding-right: 15px;
  padding-left: 15px;
  float: left;
  text-align: center;
  text-transform: none;
}

.homepage-thumbnail.left {
  margin-left: 0px;
  text-align: left;
}

.homepage-thumbnail.right {
  margin-right: 0px;
}

.homepage-thumbnail.card-image.cc-mural {
  background-color: transparent;
}

.homepage-thumbnail.card-image {
  margin-top: 0px;
  margin-bottom: 0px;
  padding-right: 0px;
  padding-left: 0px;
}

.homepage-thumbnail.card {
  left: 0px;
  right: 0px;
  bottom: 0px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 100px 50px 0px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.columns {
  display: block;
  margin-top: 10px;
  margin-right: 0px;
  margin-bottom: 30px;
  padding-right: 0px;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.columns.card {
  margin-top: 50px;
  margin-bottom: 60px;
  padding-bottom: 0px;
}

.image-3 {
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  float: right;
  text-align: right;
}

.full-width {
  width: 100%;
  min-width: 100%;
}

.pink.full-width {
  background-color: #fef1ef;
}

.card.text.cc-readmore {
  color: #F77BB6;
  font-weight: 700;
}

.card.card-tag {
  padding-top: 0px;
  padding-bottom: 0px;
  font-family: Circularstd, Arial, sans-serif;
  color: #F77BB6;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.card.text {
  padding-bottom: 50px;
  font-family: 'Circularstd book', Arial, sans-serif;
  color: #403d50;
  font-size: 13px;
  text-align: left;
}

.body-text.p {
  width: 450px;
  color: #505050;
  text-align: left;
}

.divider {
  display: block;
  margin-right: auto;
  margin-left: auto;
  padding-top: 40px;
  padding-right: 0px;
  padding-bottom: 100px;
}

.caption {
  display: block;
  width: 800px;
  max-width: 100%;
  margin-right: auto;
  margin-bottom: 0px;
  margin-left: auto;
  padding: 10px 0px 53px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  font-family: Circularstd, Arial, sans-serif;
  color: #9da9ba;
  font-size: 12px;
  text-align: left;
}


.image-13 {
  display: block;
  margin-right: auto;
  margin-left: auto;
}

.image-13.header-image {
  margin-top: 100px;
}

.image-14 {
  display: block;
  margin-right: auto;
  margin-left: auto;
}

.img {
  display: block;
  width: 800px;
  margin-top: 0px;
  margin-right: auto;
  margin-left: auto;
}

.img.cc-02 {
  width: 200px;
  padding-top: 78px;
  padding-bottom: 21px;
}

.img.cc-02.float {
  top: -121px;
  right: 17px;
  width: 250px;
}

.read-more-caption {
  padding: 0px 15px;
}

.text-span {
  font-family: Circularstd, Arial, sans-serif;
  color: #313131;
}

.text-span.cc-white {
  color: #fff;
}

.text-span-2 {
  color: #a3a2a2;
}

.cc-header {
  display: block;
  width: 900px;
  max-width: 100%;
  margin-right: auto;
  margin-left: auto;
}

.dropcap {
  position: relative;
  top: 25px;
  margin-right: 10px;
  margin-bottom: 28px;
  float: left;
  color: #3b4c64;
  font-size: 87px;
}

.checkered {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
}

.checkered-piece {
  position: relative;
  width: 50%;
  padding: 0px;
}

.checkered-piece.left {
  float: left;
}

.checkered-piece.left.color {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  background-color: #f3b5a6;
}

.checkered-piece.left.cc-nocolor {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.checkered-piece.right {
  float: right;
}

.checkered-piece.right.color {
  background-color: #ffede7;
}

.checkered-piece.right.cc-color-01 {
  background-color: #ffede7;
}

.checkered-piece.cc-color-02 {
  background-color: #e5f2f5;
}

.checkered-piece.cc-color-02.left {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  grid-auto-columns: 1fr;
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  -ms-grid-rows: auto auto;
  grid-template-rows: auto auto;
}

.checkered-inner {
  display: block;
  width: 400px;
  padding: 49px 25px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.h4 {
  overflow: visible;
  padding-top: 0px;
  padding-bottom: 0px;
  font-family: Sentinel, Georgia, sans-serif;
  color: #132b4e;
  font-size: 18px;
  line-height: 40px;
  font-weight: 800;
  text-align: left;
}

.h4.cc-murals {
  margin-top: 41px;
}

.h4.cc-murals.cc12 {
  margin-top: 22px;
}


.columns-3 {
  display: block;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.video {
  height: auto;
  margin-top: 37px;
  padding-bottom: 60%;
}

.video.cc-01 {
  clear: left;
}

.div-block-3 {
  display: -ms-grid;
  display: grid;
  grid-auto-columns: 1fr;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  -ms-grid-columns: 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  -ms-grid-rows: auto auto;
  grid-template-rows: auto auto;
}


.inline.cc-heart {
  margin-top: -12px;
}

.inline-block {
  display: block;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.link-block {
  border-width: 0px;
}

.section-icon {
  display: block;
  margin-right: auto;
  margin-left: auto;
}

.case-study {
  display: block;
  max-width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-top: 36px;
  font-family: Circularstd, Arial, sans-serif;
  color: #ccd0d6;
  font-size: 11px;
  font-weight: 700;
  text-align: center;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.caption-2.cc-homepage {
  width: 970px;
  padding-top: 0px;
  padding-bottom: 29px;
}

.column-grid-top {
  padding-bottom: 21px;
}

.coming-soon {
  position: relative;
  left: 0px;
  top: 0px;
  opacity: 1;
}

.div-block-6 {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 490px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-align-content: stretch;
  -ms-flex-line-pack: stretch;
  align-content: stretch;
}

.div-block-7 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.hover-color {
  position: absolute;
  left: 0px;
  top: 0px;
  right: 0px;
  bottom: 0px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: transparent;
  opacity: 0;
}

.hover-color.inner.cc-color.cc-dearfutureme {
  background-color: #ffede7;
}

.parent-coming-soon {
  position: relative;
}

.heart {
  position: relative;
  z-index: 0;
  display: block;
  margin-top: 0px;
  margin-right: auto;
  margin-left: auto;
}

.preloader {
  position: relative;
  left: 0px;
  top: 0px;
  right: 0px;
  bottom: 0px;
  z-index: 100;
  width: 100%;
  height: 100%;
  background-color: #200b8e;
  background-image: url("assets/cover_intouch.jpg");
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-attachment: scroll;
}





video {
    width: 100%;
    height: auto;
  }


  [class*="col-8"] {
    float: left;
    padding: 15px;
    width: 100%;
  }












@media (max-width: 991px) {
  .parallax.slack {
    height: 60vw;
  }
  .wrapper {
    overflow: visible;
  }
  .homepage-thumbnail-title.card-title.dark-blue {
    font-size: 32px;
  }
  .homepage-thumbnail-title.card-title.light-blue {
    font-size: 30px;
    line-height: 38px;
  }
  .homepage-thumbnail.card {
    padding-top: 59px;
    padding-right: 24px;
    padding-left: 24px;
  }
  .navbar {
    max-width: 100%;
  }
  .col-wrapper {
    max-width: 100%;
  }
  .wrapper-2 {
    overflow: visible;
  }
}

@media (max-width: 767px) {
  .wrapper.cc-fullimg {
    display: block;
    overflow: visible;
  }
  .h1.cc-full-img.cc-01 {
    font-size: 40px;
  }
  .post-text-2.cc-017 {
    margin-bottom: 0px;
  }
}

@media (max-width:479px) {
  .wrapper {
    overflow: visible;
    margin-top: 0px;
  }
  .wrapper.cc-footer {
    margin-top: 0px;
  }
  .wrapper.cc-homepage {
    margin-top: 0px;
    padding-bottom: 84px;
  }
}


.iframe-container{
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; 
  height: 0;
}
.iframe-container iframe{
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 100%;
}




/* == Begin footer CSS == */

/* Outer footer parent container */
.container-footer { 
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	background-color: pink
}

/* Desktop footer - inside padding  */
@media all and (min-width:768px) {
	.container-footer { padding: 3% 8% 3% 8% }
}

/* Mobiles footer - inside padding */
@media all and (max-width:767px) {
	.container-footer { padding: 12% 8% 1% 8% }
}

/* Inner footer columns */

/* Desktops - 3 columns */
@media all and (min-width:768px) { 
   .container-footer .item-3:nth-child(1) { width: 20% }
   .container-footer .item-3:nth-child(2) { 
      width: 50%;
      /* text-align: center */
   }
   .container-footer .item-3:nth-child(3) { 
      width: 20%;
   }
}

/* Mobiles - 1 column */
@media all and (max-width:767px) { 
	.container-footer .item-3 { 
      width: 100%;
      margin-bottom: 10%
   }
   .container-footer .item-3:nth-child(2) { order: 1 }
   .container-footer .item-3:nth-child(1) { order: 2 }
   .container-footer .item-3:nth-child(3) { order: 3 } 
}

/* Styles for footer background, text, icons and links */

.container-footer .item-3 h4,
.container-footer .item-3 p,
.container-footer .item-3 p i,
.container-footer .item-3 p a {
   color: #fff
}

.container-footer .item-3 h4 {
   font-weight: bold;
   /* text-transform: uppercase */
   margin-bottom: 12px;
   font-size: calc(17px + (19 - 17) * ((100vw - 320px)/(1600 - 320)));
}

.container-footer .item-3 p {
   font-weight: normal;
   margin-bottom: 12px;
   font-size: calc(15px + (18 - 15) * ((100vw - 320px)/(1600 - 320)));
   line-height: 1.6
}

.container-footer .item-3 i { 
   padding-right: 26px;
} 

.container-footer .item-3 p a {
   text-decoration: none;
   border-bottom-style: solid;
   border-bottom-width: 2px;
   padding-bottom:2px;
}

.container-footer .item-3 p a:link, 
.container-footer .item-3 p a:visited  {
   border-bottom-color: transparent;
}

.container-footer .item-3 p a:hover, 
.container-footer .item-3 p a:active  {
   border-bottom-color: #fff
}

/* == End footer CSS == */