

.HeroBanner{padding: 30px 0 70px 0;}
.HeroBanner .col_1_1 .col:first-child{padding-right: 50px; }
.HeroBanner .col_1_1 .col:last-child{
  padding-left: 0;
  position: relative;

}
.HeroBanner .col_1_1 .col:last-child img{
position: relative;
z-index: 1;
}
.HeroBanner .startingPrice {
    font-size: 18px;
    line-height: 24px;
    display: flex;
    align-items: center;
    font-weight: 400;
    position: relative;
    z-index: 1;

    width: 100%;
    color: #000;
}
.HeroBanner h1{
margin-top: -10px;
}
.HeroBanner .startingPrice > div:nth-child(1) {
    margin-right: 30px;
}
.HeroBanner .startingPrice .highlight{
  background-color: var(--primaryColor);
  color: #fff;
  padding: 15px;
  margin-right: 20px;
}
.HeroBanner .startingPrice > div:nth-child(2) {
    padding-left: 30px;
    border-left: 2px solid #000;
    font-size: 15px;
    line-height: 18px;
    font-weight: 400;
}
.HeroBanner .startingPrice > div:nth-child(2) span{
    font-size: 20px;
    line-height: 25px;
}
.HeroBanner .startingPrice strong{
    padding-bottom: 5px;
    display: block;
    font-weight: 600;
}
.HeroBanner .startingPrice div {
    display: flex;
    flex-direction: column;
}
.HeroBanner .startingPrice div div {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.HeroBanner .startingPrice div span:nth-child(3) {
    align-self: flex-end;
    font-size: 15px;
    line-height: 18px;
    font-weight: normal;
}
.HeroBanner .startingPrice div span:nth-child(2) {
    font-size: 80px;
    line-height: 85px;
    font-weight: 400;
}

.reviewsblock {
    display: flex;
    padding: 5px;
    margin-top: 30px;
    position: relative;
    z-index: 2;

    max-width: 500px;
    width: 100%;
    padding: 0px;
}
.reviewsblock > div{
    width: 25%;
    padding: 10px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
   /* background-color: rgb(181 181 181 / 30%);
    */
}
.reviewsblock > div {
    padding: 10px;
}
.WAcallaction {
    padding: 10px 10px 10px 50px;
    text-align: left;
    border: 1px solid #ddd;
    display: inline-block;
    position: relative;
    min-width: 200px;
}
.WAcallaction img{
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
}
.WAcallaction span {
    font-size: 16px !important;
    line-height: 18px !important;
}
.WAcallaction small {
    font-size: 12px !important;
    line-height: 14px !important;
    color: #000;
}
.WAcallaction span, .WAcallaction small{
    width: calc(100% - 35px);
}

.HeroBanner  .circles {
     height: 90vmin;
     position: relative;
     position: absolute;
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);
     z-index: 0;
     width: 90vmin;
}

.HeroBanner  .circles + img{
  margin-top: -60px;
}
 .HeroBanner  .circles > div {
     border-radius: 50%;
     height: 100%;
     opacity: 0;
     position: absolute;
     width: 100%;
}
 .circle1 {
     animation-delay: 1s;
     animation: growAndFade 2s infinite ease-out;
     background-color: #aef772;
     border: 2px dashed #000;
}
 .circle2 {
     animation-delay:1.5s;
     animation: growAndFade 2s infinite ease-out;
     background-color:#00ccbc;
     border: 2px dashed #000;
}
 .circle3 {
     animation-delay: 2s;
     animation: growAndFade 3s infinite ease-out;
     background-color: #fc8a63;
     border: 2px dashed #000;
}
 @keyframes growAndFade {
     0% {
         opacity: .35;
         transform: scale(0);
    }
     100% {
         opacity: 0;
         transform: scale(1);
    }
}

/* HEro banner css end */
.col40-60{padding-bottom: 70px;}
.col40-60 .col_1_1 {
  align-items: center;
}
.col40-60 .col_1_1 .col:first-child{
  width: 40%
}

.col40-60 .col_1_1 .col:last-child{
  width: 60%;

  padding-left: 10%;
}

.col40-60 .col_1_1 .col:last-child p:first-child{
  font-weight: 500;
  font-size: 18px;

}

.col40-60 .col_1_1 .col:last-child h3{
  font-size: 150px;
  line-height:0.8;
}

.col50-50 .col_1_1 .col{
  width: 50%;
  padding-right: 5%;
}

.col50-50 .col_1_1 .col:first-child{

  padding-right: 30px;
}

.col50-50 .col_1_1 .col:first-child table{
  width: 100%;
}
.col50-50 .col_1_1 .col:last-child{

  padding-right: 30px;
}
.col50-50 .col_1_1 .col:last-child .price
{   display: flex;
    flex-direction: column;
    font-size: 40px;
    line-height: 1.1;
    margin-bottom: 10px;
}

    .col50-50 .col_1_1 .col:last-child .price span
    {
      font-size: 14px;
      color: #000;
    }
    .col50-50 .col_1_1 .cardList .card{
      width: calc(50% - 10px);
      position: relative;
      background-color: #fff;
    }
    .col50-50 .primaryBtn
    {
      padding: 15px 20px;
    font-size: 18px;
    margin-top: 20px;
    }

.textWithBLocksRow{margin-top: 40px;}

.textWithBLocksRow .centerBlock{
  display: flex;
  align-items: flex-start;
  flex-flow: row wrap;
  justify-content: space-between;
}

.textWithBLocksRow .centerBlock .col:first-child{
  background-color: #f6f6f6;
  width: 50%;
  padding: 30px 10% 30px 30px;
}
.textWithBLocksRow .centerBlock .col:first-child p:last-child{padding: 0;}

.textWithBLocksRow .centerBlock .col:last-child{

  position: relative;
  z-index: 1;
  width: 57%;
  margin-left: -7%;
  padding: 10px;
  margin-top: -50px;
}

.cardList, .Blockwrapper{display: flex; justify-content: space-between;
flex-flow: row wrap; gap: 20px 0;     width: calc(100% + 10px);}
.cardList .card{
  border: 1px solid #e4e4e4;
  padding: 20px 20px 0px 20px;
  background-color: #fff;
  width: calc(33.33% - 10px);
}
.Blockwrapper .staticsBlock
{
  background-color: #fff;
  width: calc(50% - 10px);
  overflow: hidden;
  position: relative;
  margin-bottom: 15px;
  padding: 7% 20px;
box-shadow: 0px 0px 20px #ccc;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
.staticsBlock::before, .staticsBlock::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    background-color: rgb(0, 171, 224, 0.50);
    z-index: 0;
}
.staticsBlock::after {
    top: auto;
    bottom: 0;
}
.staticsBlock:hover::before, .staticsBlock:hover::after {
    height: 100%;
}
.Blockwrapper.animateMe .staticsBlock:nth-child(1)::before, .Blockwrapper.animateMe .staticsBlock:nth-child(1)::after {
    -webkit-animation: staticsBlock1 4s ease-in-out infinite;
    -moz-animation: staticsBlock1 4s ease-in-out infinite;
    -ms-animation: staticsBlock1 4s ease-in-out infinite;
    animation: staticsBlock1 4s ease-in-out infinite;
    transition-timing-function: cubic-bezier(0.12, 0, 0.39, 0);
   /* animation-delay: 0.5s;
    -webkit-animation-delay: 0.5s;
    */
}
.Blockwrapper.animateMe .staticsBlock:nth-child(2)::before, .Blockwrapper.animateMe .staticsBlock:nth-child(2)::after {
    -webkit-animation: staticsBlock2 4s ease-in-out infinite;
    -moz-animation: staticsBlock2 4s ease-in-out infinite;
    -ms-animation: staticsBlock2 4s ease-in-out infinite;
    animation: staticsBlock2 4s ease-in-out infinite;
    transition-timing-function: cubic-bezier(0.12, 0, 0.39, 0);
}
.Blockwrapper.animateMe .staticsBlock:nth-child(3)::before, .Blockwrapper.animateMe .staticsBlock:nth-child(3)::after {
    -webkit-animation: staticsBlock3 4s ease-in-out infinite;
    -moz-animation: staticsBlock3 4s ease-in-out infinite;
    -ms-animation: staticsBlock3 4s ease-in-out infinite;
    animation: staticsBlock3 4s ease-in-out infinite;
    transition-timing-function: cubic-bezier(0.12, 0, 0.39, 0);
}
.Blockwrapper.animateMe .staticsBlock:nth-child(4)::before, .Blockwrapper.animateMe .staticsBlock:nth-child(4)::after {
    -webkit-animation: staticsBlock4 4s ease-in-out infinite;
    -moz-animation: staticsBlock4 4s ease-in-out infinite;
    -ms-animation: staticsBlock4 4s ease-in-out infinite;
    animation: staticsBlock4 4s ease-in-out infinite;
    transition-timing-function: cubic-bezier(0.12, 0, 0.39, 0);
}

@-webkit-keyframes staticsBlock1 {
    0% {
        height: 0;
   }
    10% {
        height: 100%;
   }
    20% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@-moz-keyframes staticsBlock1 {
    0% {
        height: 0;
   }
    10% {
        height: 100%;
   }
    20% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@-ms-keyframes staticsBlock1 {
    0% {
        height: 0;
   }
    10% {
        height: 100%;
   }
    20% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@-0-keyframes staticsBlock1 {
    0% {
        height: 0;
   }
    10% {
        height: 100%;
   }
    20% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@keyframes staticsBlock1 {
    0% {
        height: 0;
   }
    10% {
        height: 100%;
   }
    20% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
/* =================== */
@-webkit-keyframes staticsBlock2 {
    0% {
        height: 0;
   }
    15% {
        height: 0;
   }
    25% {
        height: 100%;
   }
    35% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@-moz-keyframes staticsBlock2 {
    0% {
        height: 0;
   }
    15% {
        height: 0;
   }
    25% {
        height: 100%;
   }
    35% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@-ms-keyframes staticsBlock2 {
    0% {
        height: 0;
   }
    15% {
        height: 0;
   }
    25% {
        height: 100%;
   }
    35% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@-0-keyframes staticsBlock2 {
    0% {
        height: 0;
   }
    15% {
        height: 0;
   }
    25% {
        height: 100%;
   }
    35% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@keyframes staticsBlock2 {
    0% {
        height: 0;
   }
    15% {
        height: 0;
   }
    25% {
        height: 100%;
   }
    35% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
/* =================== */
@-webkit-keyframes staticsBlock3 {
    0% {
        height: 0;
   }
    20% {
        height: 0;
   }
    30% {
        height: 100%;
   }
    40% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@-moz-keyframes staticsBlock3 {
    0% {
        height: 0;
   }
    20% {
        height: 0;
   }
    30% {
        height: 100%;
   }
    40% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@-ms-keyframes staticsBlock3 {
    0% {
        height: 0;
   }
    20% {
        height: 0;
   }
    30% {
        height: 100%;
   }
    40% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@-0-keyframes staticsBlock3 {
    0% {
        height: 0;
   }
    20% {
        height: 0;
   }
    30% {
        height: 100%;
   }
    40% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@keyframes staticsBlock3 {
    0% {
        height: 0;
   }
    20% {
        height: 0;
   }
    30% {
        height: 100%;
   }
    40% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
/* =================== */
@-webkit-keyframes staticsBlock4 {
    0% {
        height: 0;
   }
    30% {
        height: 0;
   }
    40% {
        height: 100%;
   }
    50% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@-moz-keyframes staticsBlock4 {
    0% {
        height: 0;
   }
    30% {
        height: 0;
   }
    40% {
        height: 100%;
   }
    50% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@-ms-keyframes staticsBlock4 {
    0% {
        height: 0;
   }
    30% {
        height: 0;
   }
    40% {
        height: 100%;
   }
    50% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@-0-keyframes staticsBlock4 {
    0% {
        height: 0;
   }
    30% {
        height: 0;
   }
    40% {
        height: 100%;
   }
    50% {
        height: 0;
   }
    100% {
        height: 0;
   }
}
@keyframes staticsBlock4 {
    0% {
        height: 0;
   }
    30% {
        height: 0;
   }
    40% {
        height: 100%;
   }
    50% {
        height: 0;
   }
    100% {
        height: 0;
   }
}

.staticsBlock span {
    font-size: 5vw;

    font-weight: 400;
    color: #000;
    display: block;
   /* transform: skewX(-20deg);
    */
    z-index: 1;
    position: relative;
}
.staticsBlock > div {
    display: block;
    width: 100%;
    color: #000;
    z-index: 1;
    position: relative;
    font-size: 16px;
    text-align: center;
}
.cardList .card.full{width: 100% !important}
.cardList .card h3{font-size:15px; margin-bottom: 10px}
.cardList .card.full h3{font-size:20px; margin-bottom: 10px}
.cardList .card img{
  margin-bottom: 10px;
  height: 70px;
max-width: 100px;
}

.cardList .card p{
  font-size: 13px;

}
.card span.tag{
  position: absolute;
  right: -12px;
  top: -10px;
  background-color: var(--primaryColor);
  color: #fff;
  font-size: 12px;
  padding: 3px 8px;
}
.card span.tag::before
{
  content: '';
  display: block;
  position: absolute;
  top: 18px;
  right: 5px;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-right: 8px solid #185509;
  transform: rotate(45deg);}

.card span.tag.orange{
  background-color: orange;
}
.card span.tag.orange::before
{
  border-right: 8px solid #cd8605;
}
.card h4{
  font-size: 20px;
  margin-bottom: 0;
  background-color: var(--primaryColor);
  color: #fff;
  display: inline-block;
  padding: 5px 20px 5px 25px;
  position: absolute;
  bottom: 10px;
  left: -11px;
}


.card h4::before
{
  content: '';
  display: block;
  position: absolute;
  top: -10px;
  left: 4px;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-right: 8px solid #185509;
  transform: rotate(225deg);}
/* textWithBLocksRow css end */
.productList ul{
    margin: 0px;
    padding: 0px;
    list-style: none;
    display: flex;
    flex-flow: row wrap;
    align-items: flex-start;
    justify-content: flex-start;
    width: calc(100% + 20px);
    margin-left: -10px;
}

.productList ul li {
    width: 20%;
    padding: 10px;
    text-align: center;
}
.productList ul li > div {
    width: 100%;
    height: 100%;
    position: relative;
    background-color: #fff;
    padding-top: 100%;
    background: linear-gradient(-150deg, transparent 1.5em, #f1f1f1 0);
    border-radius: 0px;
}
.productList ul li > div::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    background: linear-gradient(to left bottom, transparent 50%, rgba(0, 0, 0, .2) 0, rgba(0, 0, 0, .4)) no-repeat 100% 0;
    width: 1.73em;
    height: 3em;
    transform: translateY(-1.3em) rotate(-30deg);
    transform-origin: bottom right;
    border-bottom-left-radius: inherit;
    box-shadow: -0.2em 0.2em 0.3em -0.1em rgba(0, 0, 0, .15);
}
.productList ul li > div > div{
    display: flex;
    position: absolute;
    padding: 10px;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
}
.productList ul li > div > div img {
    width: 100%;
    height: 100%;
    max-width: 200px;
    max-height: 200px;

    object-fit: contain;
}
.productList ul li h3 {
    font-size: 18px;
    line-height: 22px;
    font-weight: normal;
    padding-top: 5px;
}

.textWithBLocksRow .cardList.gradientBG .card{
  width: calc(50% - 10px);
  position: relative;
  background-color: #fff;
  padding-bottom: 0px;
}

.textWithBLocksRow .cardList.gradientBG .card h3{
  font-size: 20px;
}
.textWithBLocksRow .cardList.gradientBG .card:nth-child(2)::before{
  content: '';
  display: block;
  position: absolute;
  z-index: -1;
  left: -8px;
  top:-8px;
  width: calc(100% + 16px);
  height: calc(100% + 16px);
  background: linear-gradient(90deg, #44ff9a -0.55%, #44b0ff 22.86%, #8b44ff 48.36%, #ff6644 73.33%, #ebff70 99.34%);
  opacity: 0.2;
  filter: blur(3px);
}
.textWithBLocksRow .centerBlock:has(.gradientBG)
{
  align-items: center;
}

.textWithBLocksRow:has(.gradientBG)
{
  margin-top: 0;
}



/* textwithimage row end */

.imagesWithBLocksRow .col_1_1_1_1{
display: flex;
flex-flow: row wrap;
justify-content: space-between;
}
.imagesWithBLocksRow .col_1_1_1_1 .col{
  width: 23%;
  padding: 0 20px 20px 10px;
  border-right: 1px solid #c3c3c3;
  border-bottom: 1px solid #c3c3c3;
  border-radius: 0;
  position: relative;
}
.imagesWithBLocksRow .col_1_1_1_1 .col h2{font-size: 18px; font-weight: 400;}
.imagesWithBLocksRow .col_1_1_1_1 .col .imageBlock{
  margin-bottom: 10px;

  overflow: hidden;
  width: 90%;
  padding-top: 90%;
  position: relative;
  display: flex;align-items: center; justify-content: center;
}

.imagesWithBLocksRow .col_1_1_1_1 .col .imageBlock img{
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  object-fit: contain;
}

.imagesWithBLocksRow .col_1_1_1_1 .col .price{
  position: absolute;
  bottom: -20px;
  left:10px;
  background-color: #f2f2f2;
  padding: 8px 15px;
}
/* imagesWithBLocksRow end here */
.ImageTextRow .col span{
  margin-bottom: 15px;
  display: block;
  font-size: 16px;

}

.TwoCTA{display: flex;  align-items: center; margin-top: 40px;}
.TwoCTA h3{
  margin-bottom: 0;
}

.TwoCTA .WAcallaction  {
min-width:auto;
border: 0px;
padding: 0;
margin-left: 10%;
padding-left:50px;
display: flex;
flex-direction: column;
position: relative;
white-space: nowrap;

}
.TwoCTA .WAcallaction img{
  left: 0;
}
.TwoCTA a span{
  margin-bottom: 5px !important;
}
.TwoCTA .WAcallaction span{
  margin-bottom: 5px;
  width: 100%;
  font-weight: 400;
}

.TwoCTA .WAcallaction h3{
margin-bottom: 0;
}
.fulltextRow .TwoCTA{
  margin-top: 10px;
}
.fulltextRow .TwoCTA .WAcallaction{
  margin-left: 5%
}
.pricetable a span {
    background: #04e004;
    color: #fff;
    padding: 3px;
    font-size: 13px;
}
table.pricetable{
  min-width: 650px;
}

.fulltextRow .centerBlock >*:last-child{padding-bottom: 0;}
.fulltextRow.withborder .centerBlock *:last-child:not(div){padding-bottom: 0}

.fulltextRow.withborder .centerBlock > div{
  padding: 20px;
  border:  1px solid #ebebeb;
}
.fulltextRow.withborder .centerBlock > div.col:last-child{
  border-left: 0;
}

/* fulltextRow end */




.testmonialRow .centerBlock{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

.testmonialRow .centerBlock .col:first-child{
  background-color: #f6f6f6;
  width: 50%;
  padding: 30px 10% 30px 30px;
}
.testmonialRow .centerBlock .col:first-child p:last-child{padding: 0;}

.testmonialRow .centerBlock .col:last-child{

  position: relative;
  z-index: 1;
  width: 57%;
  margin-left: -7%;
  padding: 10px;
  margin-top: -50px;
}
.testmonialRow .centerBlock .col:last-child .card{
  width: calc(50% - 5px); position: relative;
}
.testmonialRow .centerBlock .col:last-child .card.full{
  width: 100%;
}
.testmonialRow .customerInfo{display: flex;
align-items: flex-start;}
.testmonialRow .customerInfo > div{
  display: flex;
  flex-direction: column;
}
.testmonialRow .customerInfo > div p{
  padding-bottom: 0px;
}
.testmonialRow .customerInfo img{width: 40px;height: 40px;
object-fit: cover; border-radius: 50%; margin-right:10px;}
.Stars {
    --percent: calc(var(--rating) / 5 * 100%);
    display: inline-block;
    font-size: 20px;
    font-family: Times;
    // make sure ★ appears correctly line-height: 1;
}
.Stars::before {
    content: '★★★★★';
    letter-spacing: 3px;
    background: linear-gradient(90deg, #fc0 var(--percent), #646464 var(--percent));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.tooltipWrap{

  line-height: 0;
  cursor: pointer;
}
.tooltipWrap img{
  margin-left: 10px;
  width: 20px !important;
  height: 20px!important;
}
.tipinfo{
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 45px;
  background-color: #000;
  color: #fff;
  padding: 7px;
width: 100%;
line-height: 1.2;
font-size: 12px;
  z-index: 1;
  visibility: hidden;
  display: block;
  opacity: 0;
  transition: 0.6s opacity ease;
}

.tooltipWrap:hover .tipinfo{
  visibility: visible;
  opacity: 1;
}
.varifyLink
{
  margin-left: 10px;text-decoration:none; color:#333;

}
.varifyLink img{
  margin: 0;
  width: 20px !important;
  height: 20px!important;
  vertical-align: middle;
}
.AcordionRow h2{
  border-bottom: 1px solid #ebebeb;
  padding-bottom: 10px;
}
.Accordion .AccordionTitle {
    border-bottom: 1px solid #ebebeb;
    padding: 12px 40px 12px 0px;
    cursor: pointer;
    font-size: 14px;
border-bottom: 1px solid #ebebeb;
    font-weight: 400;
    position: relative;
    margin-bottom: 0px;
    background: #fff;
    display: block;
    width: 100%;
}
.Accordion .AccordionTitle::after
{
  content: '';
display: inline-block;
vertical-align: middle;
width: 8px;
height: 8px;
position: absolute;
right: 10px;
top: 50%;
margin-top: -3px;
background: #fff;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
transform: rotate(45deg);
}
.Accordion .AccordionContent{
    background-color: #f8f8f8;
    font-size: 14px;

    border-top: 0px;
    max-height: 0;
        overflow: hidden;

        transition: max-height 0.4s ease;
}
.Accordion .AccordionContent > div{
    padding: 10px 15px 10px 15px;
}
.Accordion .AccordionContent > div p:last-child{
  padding-bottom: 10px;
}
.Accordion input {
        display: none;
    }
.Accordion input:checked ~ .AccordionContent {
        max-height: 400px;


        border-top: 0
      }
      .Accordion input:checked ~ .AccordionTitle::after
      {
            transform: rotate(225deg);
      }



.serviceRow{background-color: #f2f2f2; padding-top: 50px; }
.tmargin{margin-top: 50px;}

.ProductofferList{display: flex; justify-content: space-between;
flex-flow: row wrap; gap: 20px 0;     width: calc(100% + 20px);}
.ProductofferList .proOffer{
  border: 1px solid #e4e4e4;
  padding: 15px 10px 10px 10px;margin-bottom: 15px;
  background-color: #fff;
  width: calc(50% - 10px);
}
.ProductofferList .proOffer h3{
  font-size: 18px;
  margin-bottom: 10px;
}
.ProductofferList .proOffer .price{
  padding: 3px 6px;
      background-color: var(--primaryColor);
      color: #fff;
      display: inline-block;
      top: -30px;
      right: -20px;
      position: absolute;
      border-radius: 0px;
      font-weight: 400;
      font-size: 12px;
padding: 3px 8px;
}
.ProductofferList .proOffer .price::before
{
  content: '';
  display: block;
  position: absolute;
  top: 18px;
  right: 4px;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-right: 8px solid #185509;
  transform: rotate(45deg);}

.ProductofferList .proOffer > div{
  position: relative;
}
 .ProductofferList .proOffer > div p:last-of-type{
  padding: 0;
}
.ProductofferList .proOffer.full{width: 100%; padding: 20px; margin-bottom: 0}


.shopAddress{gap:10px; justify-content: space-between; flex-flow: row wrap; margin-top: 20px;}
.shopAddress .col{ width: calc(33.33% - 10px);   border: 1px solid #e4e4e4; padding: 20px; background-color: #f6f6f6;}
.shopAddress .col img{
  width: 35px;
  margin-right: 5px;
}
.shopAddress .col a{
  margin-top: 15px;
  display: flex;align-items: center;
}
.shopAddress ul{
  list-style: square;
      padding: 0;
}
.shopAddress ul li {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  position: relative;
  padding-left: 20px;
}
.shopAddress ul li::before{
  content: '';
  display: block;
  position: absolute;
  width: 5px;height: 5px; background-color: #000;
  left: 0;
}
.shopAddress ul li b{padding-right: 5px;}
.shopAddress ul li a{
  margin-top: 0px !important;
}

p.linkicon{
  display: flex;
  flex-flow: row wrap; align-items: center;
}
p.linkicon img{
  width: auto;
  height: 16px;
  max-width: 16px;
  margin-right: 5px;
}
.brandLogo{
  width: 100%;
  display: flex;
  flex-flow: row wrap;
  border-top: 1px solid #f2f2f2;
border-left: 1px solid #f2f2f2;
}
.brandLogo .col{   display: flex; padding: 5px; width: 20%; min-height: 80px;border-right: 1px solid #f2f2f2;
  flex-flow: row wrap; justify-content: center; align-items: center; border-bottom: 1px solid #f2f2f2;}
.brandLogo .col img{
  height: auto;
      max-width: 100px;
      width: auto;
      max-height: 70px;
}
footer{
  background-color: #f6f6f6;
  color: #000;
  padding: 50px 0px 10px 0;
}
footer .logo{
  margin-bottom: 20px;
  display: inline-block;
}
.copyright{
  display:block;
margin-bottom: 15px;
}
.copyright a{margin-left:5px;}
.copyright img{
  margin: 0 5px;
  vertical-align: middle;
  display: inline-block;
}

.footerNav{
  border-top: 1px solid #ccc;
  padding-top: 30px;
  margin-top: 10px;
  margin-bottom: 30px;
}

.footerNav ul{
  column-count: 3;
  margin: 0;
  padding: 0;
  gap:20px;
  list-style: none;
}

.footerNav ul li a{
  color: #000;
  font-weight: 400;
}
