/* GET STARTED POP UP */
.getStartedPopup{
  position: fixed;
  width: auto;
  top: 50%;
  left: -200%;
  transform: rotate(180deg);
  background-color: rgb(204, 204, 201);
  border-radius: 6px;
  transition: 1s ;
  z-index: 1;

}

.getStartedPopup.ctive{
  left: 50%;
  rotate: 0deg;
  transform: translate(-50%, -50%);
}

.gts-popup{
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 32px;
  box-shadow: 1px 2px 4px var(--SHADOW-COLOR);
}

.getStartedPopup .fa-times{
  
  margin: 12px 0px 0px 12px;
  color: rgb(161, 26, 26);
  cursor: pointer;
}



.gts-popup h2{
  font-size: 1.3rem;
}

.gts-popup span{
  font-size: 0.8rem;
}





        /*ONSCROLL POPUP  */

        .onscrollPopupWrapper{
          position: fixed;         
          background-color: rgb(199, 196, 191);
          padding: 22px;
          box-shadow: 4px 6px 9px var(--SHADOW-COLOR);
          border-radius: 5px;
          top: 50%;
          left: -210%;
          transform: rotate(180deg);
          transition: 1s;
          z-index: 1;
        }

        .onScrollPopup{
          position: relative;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          
        }

        .onscrollPopupWrapper.act{
          left: 50%;
          rotate: 0deg;
          transform: translate(-50%, -50%);
        }



        .onscrollPopupWrapper .fa-times{
         color: red;
         position: absolute;
         top: 1px;
         right: -1px;
         cursor: pointer;
        }

        /* ONLOAD POP UP */

          .onloadWrapper{
            position: fixed;
            text-align: center;
            align-items: center;
              background-color: rgb(187, 186, 183);
              padding: 22px;
              box-shadow: 3px 5px 8px var(--SHADOW-COLOR);
              width: 40%;
              top: 50% ;
              left: -100%;
               transform: translate(-50%, -50%) rotate(0deg);
              transition: transform 1s, left 1s;
              z-index: 1;
          }

          .onloadWrapper.actNow{
              left: 50%;
              transform: translate(-50%, -50%) rotate (180deg);
          }



          .onloadWrapper h2{
            font-size: 1.2rem;
            
          }
          .onloadWrapper p{
            font-size: 0.9rem;

          }



        .mouseOver{
          position: relative;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
        } */


/* PARAGRAPH ANIMATION */


/* CALL TO ACTION */
.cta{
  display: flex;
  flex-direction: column;
  align-items: center;
}

/*REVIEW INFINITE SLIDES*/

.reviews{
    
  width: 90%;
  max-width: 1536px;
  margin-inline: auto;
  margin-bottom: 22px;
  position: relative;
  height: 340px;
  overflow: hidden;
  /* mask-image: linear-gradient(
  to right,
  rgba(0,0,0,0)5%,
  rgba(0,0,0,1) ,
  rgba(0,0,0,0) 95%,
  rgba(0,0,0,0)
); */

}
.review:nth-child(2n){
  background-color:    rgb(224, 231, 218);
}


.reviews img{
  border-radius: 50px;
}

.review{
/* background-color: #8d8b85; */
padding: 22px;
position: absolute;
border-radius: 5px;
width: 150px;
height: 340px;
margin-bottom: 22px;
left: calc(200px * 6);
animation-name: scrollleft;
animation-duration: 30s;
animation-timing-function: linear;
animation-iteration-count: infinite;
}

.review:hover{
  background-color: rgb(202, 210, 195);
  cursor: pointer;
  }

  .reviews h6{
    color: rgb(59, 57, 57);
    font-size: 0.9rem;
  }

@keyframes scrollleft{
to{
  left: -200px;
}
}

.item1{
animation-delay: calc(30s / 6 * (6 - 1) * -1);

}
.item2{
animation-delay: calc(30s / 6 * (6 - 2) * -1);
}
.item3{
animation-delay: calc(30s / 6 * (6 - 3) * -1);
}
.item4{
animation-delay: calc(30s / 6 * (6 - 4) * -1);
}
.item5{
animation-delay: calc(30s / 6 * (6 - 5) * -1);
}
.item6{
animation-delay:calc(30s / 6 * (6 - 6) * -1) ;
}

/* .conditions :nth-child(2n){
background-color: rgb(230, 163, 75);
} */


    /* WATERPROOFING PAGE */ 


  /* request a quote pop up */
.reqQuotePopup{
  position: relative;
  display: none;
  position: fixed;
  width: 40%;
  top: 50%;
  left: 50%; 
  transform: translate(-50%, -50%);
  background-color: rgb(204, 204, 201);
  border-radius: 6px;
  z-index: 1;

}

.reqQuotePopup .fa-times{
  
  color: red;
  margin: 12px;
  cursor: pointer;
  font-size: larger;
}


    /* READY TO DO BUSINESS */


    .readyToDoBusiness{
      background-color: rgb(232, 231, 230);
      padding: 22px;
    }


    /* .readyToDoBusines{
      display: none;
      background-color: rgb(98, 202, 240);
      border-radius: 5px;
      padding: 22px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      text-align: center;
      color: antiquewhite;
      width: 40%;
      
     
      box-shadow: 3px 6px 9px var(--SHADOW-COLOR);
    } */

    /* .readyToDoBusines.trigger{
      top: 50%;
    } */