/* cmsms stylesheet: default_1024 modified: 11/02/26 09:37:29 */
/* cmsms stylesheet: default_1024 modified: 11/26/24 11:35:55 */
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: 980px;
    margin: 0px auto;
}

.narrowInner {
    width: 980px;
}

.smallestInner {
    width: 1000px;
}

.wideInnerColumn {
    width: 538px;
}

.narrowInnerColumn {
    width: 400px;
}

#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-bottom: 25px;
}

#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: 170%;
    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%;
}

#inpagequotes {
    display: grid;
    font-size: 80%;
   grid-template-columns: repeat(3, 1fr); /* 3 columns */
    gap: 40px; /* Spacing between grid items */
    padding: 40px;
}




.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: 140%;
    line-height: 120%;
    font-weight: 400;
    color: #000000;
    margin: 0px 0px 30px 0px;
}

h4 {
    font-size: 130%;
    line-height: 120%;
    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: 99;}

#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: 662px;
    overflow: hidden;
    z-index: 1;
}

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

.hero_inner_placer {
    width: 1240px;
    position: relative;
    margin: 0px auto;
}

#heroIllustrations {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 662px;
    z-index: 1;
    }

.innerHeroLeftImage {
    position: absolute;
    top: 0px;
    left: -331px;
    clip-path: polygon(0 0, 100% 0, calc(100% - 709.29px) 100%, 0 100%);
    width: 1280px;
    height: 662px;
}
.innerHeroLeftImageBorder {
    position: absolute;
    top: 25px;
    left: 0px;
    width: 1220px;
    height: 612px;
    border: 1px solid #ffffff;
    border-left: 0px;
    z-index: 3;
    clip-path: polygon(0 0, 100% 0, calc(100% - 655.91px) 100%, 0 100%);
}

.innerHeroLeftImageRightBorder {position: absolute;top: 25px;right: 58px;width: 1px;height: 898px;background-color: #ffffff;transform: rotate(46.9deg);transform-origin: top right;z-index: 3;}

.innerHeroRightImage {
    position: absolute;
    top: 0px;
    right: -331px;
    clip-path: polygon(709.29px 0, 100% 0, 100% 100%, 0 100%);
    width:  1280px;
    height:  662px;
}

.innerHeroRightImageBorder {
    position: absolute;
    top: 25px;
    right: 0px;
    width: 1220px; /* Adjusted for the inset border */
    height: 612px; /* Adjusted for the inset border */
    border: 1px solid #ffffff;
    border-right: 0; /* No border on the right side to mimic the outer edge alignment */
    clip-path: polygon(calc(100% - 562px) 0, 100% 0, 100% 100%, 0px 100%); /* Adjusted to inset by 25px */
    z-index: 3; /* Above the image */
}

.innerHeroRightImageRightBorder {
    position: absolute;
    top: 25px;
    left: 716px;
    width: 1px;
    height: 898px;
    background-color: #ffffff;
    transform: rotate(46.9deg);
    transform-origin: top right;
    z-index: 3;
}

.innerHeroLeftImage  iframe {
    position: absolute;
    right: 0px;
    top: 0px;
    z-index:2;
    width:  1280px;
    height: 720px;
}

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

.innerHeroRightImage  iframe {
    position: absolute;
    right: 0px;
    top: 0px;
    z-index:2;
    width:  1280px;
    height: 720px;
}

.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: 980px;
    margin: 0px auto;
}

.heroLeft {

}

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

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

.innerHeroLeftText {
             position:  absolute;
             width: 400px;
             top: 118px;
             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 {

}

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

}

.innerHeroLeftText a:hover {

}



.heroRight {

}

.innerHeroRight {

}

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

.innerHeroRightText {
          position:  absolute;
          width: 400px;
          top: 295px;
          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 {

}

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

#heroMovieTwenty25Movie iframe {
width: 1920px;
    height: 662px
}

#heroMovieTwenty25Splitter {
        position: absolute;
        top: -16px;
        right: -395px;
        width: 30px;
        height: 1030px;
        background-color: #ffffff;
        transform: rotate(46.9deg);
        transform-origin: top right;
        z-index: 3;
    }

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

#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: auto;
    width: 100%;
}

.otherPagesheroSwatch {
    position: absolute;
    height: 248px;
    left: 0px;
    right: 650px;
    top: 25px;
}

.otherPagesLeftSwatchInner {
    background-color: #ffffff73;
    height: 248px;
    border-top: 1px solid #861620;
    border-bottom: 1px solid #861620;
    clip-path: polygon(0 0, 100% 0, calc(100% - 265.63px) 100%, 0 100%);
}

.otherPagesLeftSwatchInnerBorder {
    position: absolute;
    top: 0px;
    right: -1px;
    width: 1px;
    height: 367px;
    background-color: #861620;
    transform: rotate(46.9deg);
    transform-origin: top right;
    z-index: 3;
}

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

.otherPagesLeftContent {
    width: 500px;
}

#topCTAs
 {
    position: absolute;
    z-index: 9999;
    text-align: right;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    margin: 0px auto;
    display: flex;
    gap: 10px;
}

#topCTAs :first-child {
  margin-left: auto;
}

#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;
}

#about {

}

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

.aboutText {order: 2;}

.aboutText h2 {

}

.aboutText p {

}

.aboutImage {
position:  relative;
}

.flourish {
    position: absolute;
}

.aboutImageLeft {order: 1;}

.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; */}

#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;}
#pastProjects h1 {
    color: #861620;
    font-size: 200%;
}
.pastProject {height: 336px;position:  relative;width: 100%;}

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

.projectBackgroundImage img {
    height: auto;
    width:  100%;
}

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

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

.pastProjectsLeftSwatchInner {
    background-color: #ffffffab;
    height: 284px;
    border-top: 1px solid #861620;
    border-bottom: 1px solid #861620;
    clip-path: polygon(0 0, 100% 0, calc(100% - 304.19px) 100%, 0 100%);
}

.pastProjectsLeftSwatchInnerBorder 
{
 position: absolute;
 top: 0px;
 right: -1px;
 width: 1px;
 height: 419px;
 background-color: #861620;
 transform: rotate(46.9deg);
 transform-origin: top right;
 z-index: 3;
 }


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

.pastProjectsLeftContent {width: 650px;}

.otherPage .pastProjectsLeftContent {
    width: 500px;
}

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

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

.pastProjectsLeft p {

}

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

}

.pastProjectsLeft a:hover {

}

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

#leftHandle {position: absolute;left: -12px;top: 15px;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: -12px;
        top: 15px;
        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: 980px;left: 50%;transform: translateX(-50%);z-index: 10;}

#galleryThumbs {
                       display:  flex;
                       gap: 23px;
                       position:  absolute;
                       right:  0px;
                       top: 245px;
                       height: 186px;
                       width: 412px;
                       overflow: hidden;
               }

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

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

#galleryHandlers {
    position: absolute;
    right: 0px;
    top: 351px;
    width: 411px;
}

#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: 9999;
}

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

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

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


#buttons {

}

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

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

.bigButton {
height: 70px;
    width: 296px;
    font-size: 140%;
    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;
}

#outerMainpage {

}

#innerMainpage {z-index:  12;}

.oneColumn {

}

#values {position:  relative;height: 855px;}

#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;
}

#outerFooter .quoteBack {
top: 70px
}

#outerFooter .quoteBackSide {
top: 70px
}

.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 {
    position: absolute;
    background-color: #861620;
    border-top:  1px solid #ffffff;
    border-bottom:  1px solid #ffffff;
    right: 0px;
    width: 200px;
    height: 168px;
    z-index: 4;
    top: 40px;
}

.wideInner {

}



#footerTriple {

position:  absolute;

width:  100%;

top: 82px;


}

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

#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(2, 1fr); /* 3 columns */
    gap: 20px; /* Spacing between grid items */
    padding: 20px; /* 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 */
}

.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: 70px;
}

.blogTitle h3 {
    color: #333; /* Title color */
    margin: 10px 0;
    font-size: 120%;
}

.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: 600px;
    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: 200px;
    height: 200px;
    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: 50px;
  }

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

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