/* scrollbar css start */

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background-color: #f5f5f5;
}

::-webkit-scrollbar-thumb {
  background-color: #3dbaeb;
}

html {
  scroll-behavior: smooth;
}

/* scrollbar css end */

/* general css for entire website start */

p {
  line-height: inherit !important;
  margin: 0px;
}

.height_auto img {
  height: auto !important;
}

.full_width img {
  max-width: none !important;
  width: 100% !important;
}

.form-error-message {
  color: #d9534f;
  font-size: 14px;
}

/* general css for entire website ends */

/* 404 page css starts */

body.error404 {
  display: flex;
  flex-direction: column;
  min-height: 100dvh;
}

body.error404 > [data-elementor-type="error-404"] {
  flex-grow: 1;
}

/* 404 page css ends */

/* homepage css starts */

.max-container-width-221 {
  max-width: 221px;
}

.max-container-width-980 {
  max-width: 980px;
}

/* form css starts */

.elementor-field-type-submit button[type="submit"].elementor-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.contact_form .elementor-field-group {
  align-content: flex-start;
}

/* form css ends */

/* hero section css starts */

.hero-section-heading h1 {
  display: flex;
  align-items: flex-start;
}

.hero-section-tm-typography {
  font-size: 34px;
  line-height: 1.5em;
  letter-spacing: -0.005em;
  padding-left: 4px;
}

/* hero section css ends */

/* WHAT IS RADIQON section css starts */

.hide-video-border video {
  margin: 0px !important;
  background: #fff;
}

/* WHAT IS RADIQON section css ends */



/* -----------------------------------------------------------------------------EVERY FINDING, ON THE RECORD----------------------------------------------------------- */

/* ===== Graph container ===== */
.graph {
    height: 150px;
}

/* ===== Initial state: bars hidden ===== */
.graph .image-20 {
    transform: scaleY(0);
    transform-origin: bottom;
}

/* ===== Initial state: numbers hidden ===== */
.graph .per {
    opacity: 0;
    transform: translateY(25px);
}

/* ===== Animate only when graph is visible ===== */
.graph.graph-animate .image-20 {
    animation: barGrow 1s ease-out both;
}

.graph.graph-animate .per {
    animation: numberRise 1s ease-out both;
}

/* ===== Bar animation ===== */
@keyframes barGrow {
    from {
        transform: scaleY(0);
    }
    to {
        transform: scaleY(1);
    }
}

/* ===== Number animation ===== */
@keyframes numberRise {
    from {
        transform: translateY(25px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* ===== First bar: 20 ===== */
.graph.graph-animate .bar-20 .image-20,
.graph.graph-animate .bar-20 .per {
    animation-delay: 0s;
}

/* ===== Second bar: 89 ===== */
.graph.graph-animate .bar-89 .image-20,
.graph.graph-animate .bar-89 .per {
    animation-delay: 0.15s;
}

/* ===== Third bar: 46 ===== */
.graph.graph-animate .bar-46 .image-20,
.graph.graph-animate .bar-46 .per {
    animation-delay: 0.3s;
}

/* ===== Fourth bar: 49 ===== */
.graph.graph-animate .bar-49 .image-20,
.graph.graph-animate .bar-49 .per {
    animation-delay: 0.45s;
}

/* ===== Fifth bar: 41 ===== */
.graph.graph-animate .bar-41 .image-20,
.graph.graph-animate .bar-41 .per {
    animation-delay: 0.6s;
}

@media (max-width: 470px) {

    .ASTM {
        min-height: 75px !important;
    }

}

/* ------------------------------------------------------------------------------------------------------------------------------------------------ */

/* media query starts */

@media only screen and (max-width: 1536px) {
  .hide-video-border video {
    margin: 1px !important;
    background: #fff;
  }
}

@media only screen and (max-width: 1366px) {
  .hero-section-tm-typography {
    font-size: 24px;
  }
}

@media only screen and (max-width: 767px) {
  .hero-section-tm-typography {
    font-size: 12px;
  }

  /* table css starts */

  .inspection-table .table-heading p {
    text-transform: capitalize;
  }

  /* table css ends */
}

@media only screen and (max-width: 360px) {
  .inspection-table {
    overflow-x: auto;
  }
}
