/* cmsms stylesheet: default_720 modified: 11/02/26 09:37:57 */
body {
    margin: 0px;
    padding: 0px;
    font-family: roboto, sans-serif;
    font-size: 100%;
    font-weight: 400;
    line-height: 140%;
    color: #000000;
    /* overflow-x: hidden; */
}

.outer {
    position: relative;
}

.standardPadder {
    padding: 70px 0px;
}

.inner {
    position: relative;
    width: 700px;
    margin: 0px auto;
}

.narrowInner {
    width: 700px;
}

.smallestInner {
    width: 720px;
}

.wideInnerColumn {
    /* width: 380px; */
}

#projectHero {padding-bottom: 20px;}

.narrowInnerColumn {
    /* width: 300px; */
}

#socialSharesSider {
    position: absolute;
    border-top: 1px solid #000000;
    border-bottom: 1px solid #000000;
    height: 78px;
    background-color: #ffffff;
    right: 0px;
    width: 310px;
    z-index:99;
    display: none;
}

#socialShares {
    width: 100%; /* Set width as needed */
    height: 80px;
    background-color: black;
    position: relative; /* Relative to ensure absolute positioning inside */
    clip-path: polygon(85.67px 0, 100% 0, 100% 100%, 0 100%);
    margin: 25px 0px;
}

#innerSocialShares {
    width: calc(100% - 2px); /* 1px gap on both left and right */
    height: calc(100% - 2px); /* 1px gap on top and bottom */
    background-color: white;
    position: absolute;
    top: 1px;
    left: 1px;
    clip-path: polygon(84.67px 0, 100% 0, 100% 100%, 0 100%);
    display:  flex;
    gap: 20px;
    padding-left: 85px;
    box-sizing:  border-box;
    padding-top: 26px;
}

#innerSocialShares .socials {
    gap: 25px;
    display: flex;
    gap: 12px;
}

#innerSocialShares .socials img {
    width: initial !important;
}

    #secondHeroImage {
        max-width: 100%;
        height: auto;
    }

#sideQuote, .sideQuote {font-family: adobe-garamond-pro, serif;margin-top: 35px;}

#sideQuoteQuote, .sideQuoteQuote {
    position: relative;
    width: 100%;
}

#sideQuoteQuoteStart, .sideQuoteQuoteStart {
    position: absolute;
    top: 50px;
    left: -25px;
    font-size: 1500%;
    color: #d9d9d9;
    z-index: 1;
    font-family: times, serif;
}

#sideQuoteQuoteActual, .sideQuoteQuoteActual {
    position: relative;
    z-index: 3;
    color: #861620;
    font-size: 140%;
    line-height: 130%;
}

#sideQuoteQuoteEnd, .sideQuoteQuoteEnd {
    position: absolute;
    bottom: -60px;
    right: -20px;
    font-size: 1500%;
    color: #d9d9d9;
    z-index: 2;
    font-family: times, serif;
}

#sideQuoteCredit, .sideQuoteCredit {
    font-family: roboto, sans-serif;
    text-align: right;
    position: relative;
    z-index: 4;
    font-size: 120%;
}

#sideQuoteQuoteStart {position:  absolute;top: 50px;left: -25px;font-size: 1500%;color:  #d9d9d9;z-index: 1;font-family:  times, serif;}

#sideQuoteQuoteActual {position:  relative;z-index: 3;color:  #861620;font-size: 160%;line-height: 130%;}

#sideQuoteQuoteEnd {position: absolute;bottom: -50px;right: -20px;font-size: 1500%;color: #d9d9d9;z-index: 2;font-family: times, serif;}

#sideQuoteCredit {

font-family: roboto, sans-serif;

text-align:  right;

position:  relative;

z-index:  4;

font-size:  120%;
}

.narrowInnerColumn iframe {width: 400px;height: 225px;}

#logo {
    position: absolute;
    left: 0px;
    top: 37px;
}

#logo img {
    width: 100%;
    height: auto;
}

.columnContainer {
    /* display: flex; */
    /* justify-content: space-between; */
}

.column {
    flex: 1;
    background-color: #cccccc;
    box-sizing: border-box;
    position: relative;
}

h1 {
    font-size: 200%;
    line-height: 120%;
    font-weight: 400;
    color: #000000;
    margin: 0px 0px 30px 0px;
}

h2 {
    font-size: 150%;
    line-height: 120%;
    font-weight: 400;
    color: #000000;
    margin: 0px 0px 30px 0px;
}

h3 {
    font-size: 150%;
    line-height: 120%;
    font-weight: 400;
    color: #000000;
    margin: 0px 0px 10px 0px;
}

h4 {
    font-size: 120%;
    line-height: 140%;
    font-weight: 400;
    color: #000000;
    margin: 0px 0px 30px 0px;
}

h5 {
    font-size: 110%;
    line-height: 120%;
    font-weight: 400;
    color: #000000;
    margin: 0px 0px 30px 0px;
}

h6 {
    font-size: 115%;
    line-height: 156%;
    font-weight: 400;
    color: #000000;
    margin: 0px 0px 30px 0px;
}

#innerMainpage h1, #innerMainpage h2, #innerMainpage h3, #innerMainpage h4, #innerMainpage h5, #innerMainpage h6 {
    color: #861620;
}

p {
    margin: 0px 0px 30px 0px;
}

a:link, a:visited {
    color: #cccccc;
    text-decoration: none;
    transition: color 0.4s, background-color 0.4s;
}

a:hover {
    color: #000000;
    text-decoration: none;
}

a img {
    border: 0px;
}

#outerHeader {height: 180px;z-index: 999;}

#navigationBacker {
    position: absolute;
    top: 55px;
    right: 0px;
    background-color: #861620;
    height: 70px;
    width: 200px;
}

#innerHeader {

}

#logo a {

}

#contactInfo {

position:  absolute;

top: 14px;

right:  0px;

display:  flex;

gap: 15px;
}

#phone {

}

#contactInfo span {color: #861620;}

#contactInfo a:link, #contactInfo a:visited {color:  #000000;text-decoration:  none;font-weight:  700;}

#contactInfo a:hover {
color: #861620;
}

#innerHeader .socials {position:  absolute;top: 140px;right:  0px;display:  flex;gap: 12px;}


.facebook {

}

.twitter {

}

.instagram {

}

.linkedin {

}

#topNavigationleft {
    background-color:  #861620;
    height: 70px;
    position:  absolute;
    top:  55px;
    left: 175px;
    width: 102px;
    right: 0px;
    clip-path: polygon(75px 0, 100% 0, 100% 100%, 0 100%);
    /* display: none; */
}

#topNavigation {
    background-color:  #861620;
    height: 70px;
    position:  absolute;
    top:  55px;
    left: 275px;
    width: calc(100% - 275px);
    right: 0px;

}

#menuShow {
    display: block;
    position: absolute;
    right: 0px;
    top: 20px;
    z-index: 999999;
    text-align:  right;
    width: 84px;
    cursor: pointer;
}

.menuShowBar {
    float:  left;
    clear:  left;
    background-color: #ffffff;
    margin-bottom: 6px;
    height: 3px;
    width: 30px;
    transition: background-color 0.4s;
}
.menuShowText {
    color:  #ffffff;
    font-size:  110%;
    transition: color 0.4s;
}

#menuShow:hover .menuShowBar {
    background-color: #000000;
}

#menuShow:hover .menuShowText {
    color: #000000;
}

#closemenu {
    color: #ffffff;
    text-align: right;
    font-size: 80%;
    padding-bottom: 20px;
    display: block;
    transition: color 0.4s;
    cursor: pointer;
}

#closemenu:hover {
    color: #861620;
}

#actualMenu {
    position: fixed;
    right: -300px;
    top: 0px;
    height: 100%;
    background-color: #000000;
    padding: 25px;
    box-sizing: border-box;
    z-index:  9999999;
    width:  300px;
    transition: right 0.4s;
 }

.slideside {
   right: 0px !important; 
}

#actualMenu ul {
margin:  0px;
padding:  0px;
}

#actualMenu ul li {
    list-style: none;
    /* position:  relative; */
    display: block;
}

#actualMenu ul li a:link, #actualMenu ul li a:visited {
    color:  #ffffff;
    font-size: 105%;
    font-weight:  300;
    display:  block;
    transition: color 0.4s;
}

#actualMenu ul li a:hover {
color: #efbfc3;
}

#actualMenu ul li a span {
    display: block;
    padding: 10px 0px;
    border-bottom: 2px solid #861620;
    transition: border-color 0.4s;
}

#actualMenu ul li a:hover span {
   border-bottom: 2px solid #ffffff;
}

#actualMenu ul li.last_child a::after, #actualMenu ul li li a::after {
    content: "";
    padding: 0px;
}

#actualMenu ul ul {
    display: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    position: absolute;
    background-color: #1e1e1e;
    padding: 20px;
    left: 20px;]
    x;];
    top: 80px;
    width: 260px;
    border:  1px solid #ffffff;
    box-sizing: border-box;
}

#actualMenu ul ul li a:link, #actualMenu ul ul li a:visited {font-size:  100%;width:  200px;line-height: 130%;}

 #actualMenu ul li li a span {
         display: block;
         border-color: #1e1e1e;
         margin-bottom: 3px;
 }

#actualMenu ul ul li a:hover {
    
}

li.backlink {
    text-align:  right;
    color:  #ffffff;
    font-size:  80%;
    transition: color 0.4s;
    cursor: pointer;
}

li.backlink:hover {
    color: #861620;
}

li.backlink span.backlinkActual {}

#hero {
    position:  relative;
    height: 600px;
    overflow: hidden;
    z-index: 1;
}

.hero_placer {width: 500%;
             margin-left: -200%;}

.hero_inner_placer {
    width: 1024px;
    height: 277px;
    margin: 0px auto;
    /* overflow: hidden; */
}

#heroIllustrations {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 1024px;
    height: 598px;
    z-index: 1;
    }

.innerHeroLeftImage {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 1024px;
    height: 300px;
    overflow:  hidden;
}
.innerHeroLeftImageBorder, .innerHeroLeftImageRightBorder {
    display: none;
}

.innerHeroRightImage {
    position: absolute;
    top: 300px;
    right: 0px;
    /* clip-path: polygon(709.29px 0, 100% 0, 100% 100%, 0 100%); */
    width: 1024px;
    height: 300px;
    overflow: hidden;
}

.innerHeroRightImageBorder, .innerHeroRightImageRightBorder {
    display: none;
}

.innerHeroLeftImage  iframe {
    position: absolute;
    right: 0px;
    top: -180px;
    z-index:2;
    width: 1024px;
    height: 576px;
}

.innerHeroLeftImage img {
    position: absolute;
    right: 0px;
    top: 0px;
    z-index:1;
    width: 1024px;
    height: 576px;
}

.innerHeroRightImage  iframe {
    position: absolute;
    right: 0px;
    top: -180px;
    z-index:2;
    width: 1024px;
    height: 576px;
}

.innerHeroRightImage img {
    position: absolute;
    left: 0px;0
    top: 0px;
    top: 0px;
    z-index:1;
}
#heroContent {
    position: relative;
    z-index:2;
    display: flex;
    height: 662px;
    width: 720px;
    margin: 0px auto;
}

.heroLeft {

}

.innerHeroLeft {position: relative;height: 300px;/* background-color: #ffffff3b; */}

.innerHeroLeft a.blockButton {
    position: absolute;
    top: 175px;
    left: 0px;
}

.innerHeroLeftText {
             position:  absolute;
             width: 600px;
             top: 54px;
             left:  0px;
             color:  #ffffff;
             font-weight: 500;
             font-size: 150%;
             line-height: 118%;
             text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.8),
             5px 5px 5px rgba(0, 0, 0, 0.99);
             }

.innerHeroLeftText h2 {color:  #ffffff;font-weight: 500;font-size: 115%;margin-bottom:  10px;}

.innerHeroLeftText p {padding-bottom: 0px;}

.innerHeroLeftText a:link, .innerHeroLeftText a:visited {

}

.innerHeroLeftText a:hover {

}



.heroRight {

}

.innerHeroRight {

}

.innerHeroRight a.blockButton {
    position: absolute;
    top: 494px;
    right: 0px;
}

.innerHeroRightText {
          position:  absolute;
          width: 600px;
          top: 352px;
          right:  0px;
          color:  #ffffff;
          font-weight: 500;
          font-size: 150%;
          line-height: 118%;
          text-align: right;
          text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.8),
             5px 5px 5px rgba(0, 0, 0, 0.99);
}

.innerHeroRightText h2 {

color: #ffffff;

font-weight: 500;

font-size: 115%;

margin-bottom: 10px;
}

.innerHeroRightText p {

}

.innerHeroRightText a:link, .innerHeroRightText a:visited {

}

.innerHeroRightText a:hover {

}

#heroMovieTwenty25 {position:  absolute;top:  0px;left: 50%;transform: translateX(-50%);}

#heroMovieTwenty25Image {
position: absolute;
top:  0px;
    left: 50%;
    transform: translateX(-50%);
}

#heroMovieTwenty25Image img {
width: 1024px;
height: auto;
}

#heroMovieTwenty25Movie {
position: absolute;
top:  0px;
    left: 50%;
    transform: translateX(-50%);
}

#heroMovieTwenty25Movie iframe {
width: 1024px;
    height: 598px
}

#heroMovieTwenty25Splitter {
display: none;
    }

#otherPages {
    position: relative;
    overflow-x: hidden;
    overflow-y: visible;
}

#otherPages h1 {
    color: #861620;
    font-size: 250%;
}

.otherPage {
    height: 335px;
    position: relative;
}

.otherPagesBackgroundImage {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 335px;
    overflow:  hidden;
}

.otherPagesBackgroundImage img {
    height: 335px;
    width: auto;
}

.otherPagesheroSwatch {
    position: absolute;
    height: 248px;
    left: 0px;
    right: 535px;
    top: 69px;
}

.otherPagesLeftSwatchInner {
    background-color: #ffffff73;
    height: 150px;
    border-top: 1px solid #861620;
    border-bottom: 1px solid #861620;
    border-right: 1px solid #861620;
}

.otherPagesLeftSwatchInnerBorder {
    display: none;
}

.otherPagesLeft {
    position: relative;
    z-index: 4;
    padding-top: 120px;
    height: 360px;
}

.otherPagesLeftContent {
    width: 500px;
}

#about {

}

#innerAbout {display:  flex;gap: 130px;}

.aboutText {order: 2;}

.aboutText h2 {

}

.aboutText p {

}

.aboutImage {
position:  relative;
}

.flourish {
    position: absolute;
}

.aboutImageLeft {order: 1;display:  none;}

.aboutImageLeft .flourish {
    left: -25px;
    bottom: 25px;
}

.aboutImageRight {order: 3;}

.aboutImageRight .flourish {
    transform: scaleX(-1);
    right: -25px;
    bottom: 25px;
}

.aboutOverlay {

}

.quote {

background-color: #861620;

color:  #ffffff;

padding: 40px 0px 55px 0px;

overflow:  hidden;
}

.testimonial {width: 600px !important;padding-top:  25px;}

.testimonial p {

margin-bottom: 10px;
}

.quoteCredit {

text-align:  right;

font-size:  80%;
}

.central {text-align: center;/* display:  none; */margin: 0px auto;}

#clients {

}

#clients h3 {

}

#clients ul {
 margin: 0px;
 padding: 0px;
 display: grid;
grid-template-columns: repeat(3, 1fr); 
}

#clients ul li {
     list-style:  none;
    margin: 0px;
    padding: 0px;
    flex:1;
}

#clients ul li img {

}

#pastProjects {/* display:  none; */position: relative;z-index: 99;overflow-x: hidden;}
#pastProjects h1 {
    color: #861620;
    font-size: 250%;
}
.pastProject {height: 275px;position:  relative;width: 100%;overflow:  hidden;z-index: 1;}

.projectBackgroundImage {position:  absolute;top:  0px;left:  0px;width:  100%;height: 276px;}

.projectBackgroundImage img {
    height: auto;
    width: 1024px;
}

.pastProjectsLeftSwatch {
    position:  absolute;
    height: 272px;
    left:  0px;
    right: 240px;
    top:  25px;
    width: 641px;
}

.otherPageheroSwatch {
    position:  absolute;
    height: 231px;
    left:  0px;
    right: 240px;
    top:  25px;
}

.pastProjectsLeftSwatchInner {
    background-color: #ffffffb5;
    height: 230px;
    border-top: 1px solid #861620;
    border-bottom: 1px solid #861620;
    border-right: 1px solid #861620;
    /* clip-path: polygon(0 0, 100% 0, calc(100% - 586.95px) 100%, 0 100%); */
    width: 600px;
}

.pastProjectsLeftSwatchInnerBorder 
{
display: none
 }


.pastProjectsLeft {position: relative;z-index:4;padding-top: 43px;height: 310px;}

.pastProjectsLeftContent {width: 456px;}

.otherPage .pastProjectsLeftContent {
    width: 500px;
}

.pastProjectsLeft h4 {
color: #861620;
margin-bottom: 15px;
font-size: 105%;
font-weight:  500;
}

.pastProjectsLeft h3 {font-size: 130%;}

.pastProjectsLeftContent img {
   display: block;
    margin-bottom: 30px;
}

.pastProjectsLeft p {margin-bottom: 10px;}

.pastProjectsLeft a:link, .pastProjectsLeft a:visited {

}

.pastProjectsLeft a:hover {

}

#topCTAs
 {
    /* position: absolute; */
    /* z-index: 9999; */
    /* text-align: right; */
    /* bottom: 24px; */
    padding-top: 10px;
    /* right: 0px; */
    /* width: 320px; */
    /* margin: 0px auto; */
    /* display: flex; */
    /* flex-direction: column; */
    /* gap: 10px; */
}

#handlers {position:  absolute;top:  0px;z-index: 99;height: 1px;left: 50%;transform: translateX(-50%);}

#leftHandle {position: absolute;right: 33px;top: 30px;color: #861620;text-shadow: 1px 1px 0 white, -1px 1px 0 white, 1px -1px 0 white, -1px -1px 0 white;font-size: 200%;cursor:  pointer;}

#rightHandle {
        position:  absolute;
        right: 0px;
        top: 30px;
        color: #861620;
        text-shadow: 1px 1px 0 white,   /* Bottom right shadow */
        -1px 1px 0 white,  /* Bottom left shadow */
        1px -1px 0 white,  /* Top right shadow */
        -1px -1px 0 white; /* Top left shadow */
        font-size: 200%;
        cursor: pointer;
        }

#leftHandle, #rightHandle {
    transition: color 0.4s;
}

#leftHandle:hover, #rightHandle:hover {
    color: #000000;
}

#gallery {position:  absolute;top: 0px;height: 0px;width: 720px;left: 50%;transform: translateX(-50%);z-index: 2;}

#galleryThumbs {
                       display:  flex;
                       gap: 23px;
                       position:  absolute;
                       right:  0px;
                       top: 210px;
                       height: 100px;
                       width: 352px;
                       overflow: hidden;
                       z-index: 999999;
               }

.galleryThumbImage, .galleryThumb img {
    cursor: pointer;
    border: 1px solid transparent;
    transition: border-color 0.4s;
    width: 100px;
    height: 100px;
}

.galleryThumbImage:hover {
    border: 1px solid #861620;
}

#galleryHandlers {
    position: absolute;
    right: 0px;
    top: 286px;
    width: 347px;
}

#galleryHandlers #leftHandle {left: -54px;top:  0px;}

#galleryHandlers #rightHandle {
    right: -50px;
    top: 0px;
}

#galleryThumbs #leftHandle {

}

#galleryThumbs #rightHandle {

}

#galleryActuals {

}

#galleryheroes {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 999999;
}

.galleryHero {display: none;position: fixed;top: 0px;left: 0px;right: 0px;height: 100%;background-color: #ffffffc2;z-index: 7;padding-top: 205px;}

.galleryLive {width: 600px;margin:  0px auto;}

.galleryLive  img {width: 600px;height: auto;display:  block;}


#buttons {

}

#handlers .blockButton {
    position: absolute;
    right: 0px;
    top: 202px;
}

.blockButton {display: inline-block;box-sizing: border-box;text-align:  center;padding: 5px 8px;}

.bigButton {height: 55px;width: 205px;font-size: 114%;font-weight: 500;line-height: 100%;padding-top: 5px;}

.bigButton span {
    font-size: 70%;display: block; font-weight: 400;
}

.smallButton {

}

a.redBack:link, a.redBack:visited  {
    background-color: #861620;
    color: #ffffff !important;
    border:1px solid #ffffff;
    transition: background-color 0.4s;
}

a.redBack:hover  {
    background-color: #000000;
}

#topCTAs a:link, #topCTAs a:visited, #topCTAs span, a.thisCTA:link, a.thisCTA:visited, span.thisCTA {display: inline-block;box-sizing: border-box;text-align: center;padding: 9px 0px 0px 0px;background-color: #861620;color: #ffffff;border: 1px solid #ffffff;transition: background-color 0.4s;height: 45px;width: 172px;cursor: pointer;/* font-size: 110%; */transition: background-color 0.4s;}

#topCTAs a:hover, #topCTAs span:hover, a.thisCTA:hover, span.thisCTA:hover  {
background-color: #000000;
}

#outerMainpage {

}

#innerMainpage {z-index:  12;}

.oneColumn {

}

#values {position:  relative;height: 855px;overflow=x: hidden;overflow=x: hidden;overflow=x: hidde;overflow=x: hidd;overflow=x: hid;overflow=x: hi;overflow=x: inherit;overflow=x: inherit;overflow=x: h;overflow=x: hidden;overflow=x: hidden;overflow=x: hidde;overflow=x: hidd;overflow=x: hid;overflow=x: hi;overflow=x: inherit;overflow=x: inherit;overflow=x: h;overflow-x: hidden;}

#values .bigButton {
    position: absolute;
    top: 404px;
    left: 50%;
    transform: translateX(-50%);
}

#valueImage {

position: absolute;

left:  0px;

top: 0px;

width:  100%;

line-height: 0px;

height: 855px;

overflow: hidden;
}

#valueImage img {
    width: 100%;
}

#valueFrames {position:  absolute;top:  0px;left:  0px;width:  100%;height: 855px;}

.valueFrame {
    background-color: #000000b3;
    width: calc(50% - 15px);
    height:  350px;
    position: absolute;
}

#valueFrameTopLeft {top:  70px;left:  0px;
                   clip-path: polygon(0 0, calc(100% - 375.03px) 0, 100% 100%, 0 100%);
                   }

#valueFrameTopRight {
top:  70px;right:  0px;
    clip-path: polygon(375.03px 0, 100% 0, 100% 100%, 0 100%);
}

#valueFrameBottomLeft {
top: 460px; left: 0px;
    clip-path: polygon(0 0, 100% 0, calc(100% - 375.03px) 100%, 0 100%);
}

#valueFrameBottomRight {
top: 460px; right: 0px;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 375.03px 100%);
}

#innerValues {

color:  #ffffff;
}

#valueGrid {
    padding-top: 70px;
    display: grid;
    grid-template-columns: 1fr 1fr; /* Two equal-width columns */
    grid-template-rows: 352px 300px; /* First row is 200px, second row is 300px */
    row-gap: 37px;  /* Vertical gap between rows */
    column-gap: 10px;  /* Horizontal gap between columns */
    text-align: left;
}

.value {
    padding-top: 85px;
}

#innerValues h2 {
             color:  #ffffff;
             font-family: adobe-garamond-pro, serif;
             font-size: 432%;
             text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.8),
             5px 5px 5px rgba(0, 0, 0, 0.99);
             position:  absolute;
             top: 90px;
             left:  0px;
             width:  100%;
             }

#innerValues h3 {color:  #ffffff;font-family: adobe-garamond-pro, serif;font-size: 260%;margin: 0px 0px 10px 0px;}

#innerValues h5 {margion#:  0px;margion#:  0px;margion#:  0p;margion#:  0;color:  #ffffff;font-family: adobe-garamond-pro, serif;font-size: 150%;margion#: ;margin: 0px 0px 10px 0px;}

#family {

padding-right: 50%;
}

#positivity {

padding-left: 50%;
}

#quality {

padding-right:  50%;
}

#loyalty {

padding-left:  50%;
}

.footerLink:link, .footerLink:visited {

}

.footerLink:hover {

}

#outerFooter {
    background-color: #861620;
    color: #ffffff;
    /* height: 320px; */
    text-align:  center;
    padding: 10px 0px;
}

#outerFooter .quoteBack {
display: none;
}

#outerFooter .quoteBackSide {
display: none;
}

.quoteBack {
    width: 980px;
    height: 170px;
    background-color:  #ffffff;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    /* clip-path: polygon(182.16px 0, 100% 0, 100% 100%, 0 100%); */
    }

.innerQuoteBack {
    width: calc(100% + 2px);  /* Inset only 1px from the left */
    height: calc(100% - 2px); /* 1px inset on top and bottom */
    background-color: #861620;
    position: absolute;
    top: 1px;
    left: 2px;  /* Inset from the left by 1px */
    /* clip-path: polygon(181.16px 0, 100% 0, 100% 100%, 0 100%); */ /* Same diagonal */
}

.quoteBackSide {
    display: none;
}

.wideInner {

}



#footerTriple {/* position:  absolute; */width:  100%;/* top: 82px; */}

#innerFooterTriple {
    /* display:  flex; */
    width: 100%; /* Constrain the flex items to the middle 600px */
    /* margin: 0 auto; */ /* Center the flex-container within the outer-container */
    padding: 20px 0px;
}

#innerFooterTriple div {

flex: 1;

font-size:  80%;

line-height: 140%;
}

#lowCredits {/* top: 243px; *//* position:  relative; */font-size: 80%;}

.left {/* float: left; */}

.right {/* float: right; */}


.blogHolder {
    display: grid;
    grid-template-columns: repeat(1, 1fr); /* 3 columns */
    gap: 0px; /* Spacing between grid items */
    padding: 0px; /* Optional padding around the grid */
}

.blogItem {
    border: 1px solid #861620; /* Optional border for items */
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Optional box shadow for depth */
    background-color: #fff; /* Background color */
    transition: transform 0.2s; /* Animation on hover */
    margin-bottom:  20px;
}

.blogItem:hover {
    transform: scale(1.01); /* Slight zoom effect on hover */
}

.innerBlogItem {
    padding: 15px; /* Inner padding for blog content */
}

.blogImage img {
    width: 100%; /* Ensure images fit their container */
    height: auto; /* Maintain aspect ratio */
}

.blogTitle {
    height: 40px;
}

.blogTitle h3 {
    color: #333; /* Title color */
    margin: 10px 0;
}

.blogDate {
    font-size: 80%;
    color: #666; /* Muted date color */
    margin-bottom: 10px;
}

.blogSummary {
    margin-bottom: 10px;
}

.blogSummary p {
    margin: 0;
}

#blogImage {
    float: right;
    display: block;
    margin-left: 40px;
    margin-bottom: 40px;
    width: 300px;
    height: auto;
}

#complianceItems {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* Three columns of equal width */
    grid-template-rows: repeat(2, auto); 
}

.complianceItem {
    text-align: center
}

.complianceItem img {
    max-width:50%
}

.lightingHeroContainer {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* Three columns of equal width */
    grid-template-rows: repeat(2, auto);  /* Two rows with height based on content */
    gap: 40px
}

.lightingHeroSection {border: 1px solid #861620;
        padding: 20px;}
.lightingHeroSection img  {
    max-width: 100%;
    height: auto;
}

  #heroTeamys {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 100px;
  }

  .heroTeamy {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
padding-bottom:40px;
  }

  .heroTeamyImg img {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid #ccc;
  }

  .heroTeamyText h3 {
    margin-top: 15px;
    color: #333;
  }

  .heroTeamyText p {
    margin: 10px 0;
    color: #555;
  }

#otherTeamys {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 70px;
  }

#otherTeamys  .heroTeamyImg img {
    width: 125px;
    height: 125px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid #ccc;
  }

  .heroTeamyText h3 span {
    display: block;
font-size: 70%;
  }
