:root{
    --cs-green1: #2ab757;
    --cs-green2: #14ac44;

    --cs-blue1: #5271ff;
    --cs-blue2: #3755db;

    --cs-pink1: #cb6ce6;
    --cs-pink2: #a439c2;

    --cs-yellow1: #ff914d;
    --cs-yellow2: #d66e2d;

    --mt-5: 3rem !important;
}



.btn-bg-green{
    background-color: var(--cs-green1) !important;
    color: white;
}

.btn-bg-green:hover{
    background-color: var(--cs-green2) !important;
}


.btn-bg-blue{
    background-color: var(--cs-blue1) !important;
    color: white;
}

.btn-bg-blue:hover{
    background-color: var(--cs-blue2) !important;
}

.btn-bg-pink{
    background-color: var(--cs-pink1) !important;
    color: white;
}

.btn-bg-pink:hover{
    background-color: var(--cs-pink2) !important;
}

.btn-bg-yellow{
    background-color: var(--cs-yellow1) !important;
    color: white;
}

.btn-bg-yellow:hover{
    background-color: var(--cs-yellow2) !important;
}


.btn-bg-navy{
    background-color: #19365d;
}

.bg-green{
    background-color: #3ea66b;
}

.bg-green2{
    background-color: #50c877;
}



.bg-dark-navy{
    background-color: #19365d;
}

.navbar-top a{
    display: block;
    margin: 0px 10px;
    padding-left: 20px;
    padding-right: 20px;
    border-radius: 20px;
    line-height: 40px;
    font-weight: bold;
    font-size: 18px;
    text-transform: capitalize;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    border: transparent;
    letter-spacing: .25px;
    color: #000000;
    background-color: #ffffff;
}

.navbar-top a.active {
    color: #ffffff;
    background-color: #6cd08d;
}

.pos-overlap{
    position: relative;
}
.pos-overlap-text{
    position: relative;
    
}

@media (min-width: 768px) { 
    .pos-overlap{
        padding-left: 20%;
    }

    .pos-overlap-text{
        padding-right: 20%;
    }
    
}
@media (max-width: 768px) { 
    
    .pos-overlap{
        padding-left: 5%;
        padding-right: 15%;
    }

    .pos-overlap-text{
        padding-left: 10%;
        padding-right: 10%;
    }
}




.green-char{
    color: #50c878;
}

.tmr-arrow{
    max-height: 15px !important;
    width: auto;
    margin-top: 7px;

}

.text-logo{
    font-family: "Archivo Black", sans-serif;
    letter-spacing: -4px;
}

.tmr-logo{
    font-family: 'Poppins', sans-serif !important;
    font-weight: 300;
}

.f-poppin{
    font-family: 'Noto Sans', sans-serif !important;
    font-weight: 300;
}

p, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, button {
    font-family: 'Noto Sans', sans-serif !important;
    font-weight: 250;
}


.img-fluid{
    max-width: 90%;
    height: auto;
}


.py-6 {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
}

.bg-form-blur{
    background-color: #6e6d6d;
    backdrop-filter: blur(4px);
    border-radius: 25px;
    background-color: #000000;
    z-index: 1;
    background: rgba(41, 41, 41, 0.6);
}

@media (max-width: 768px) { 
    .bg-form-blur {
        top: 2%; 
        left: 5%;
        right: 5%;
    }

    .bg-text-overlap img{
        width: 100%;
    }
}

@media (min-width: 768px) { 
    .bg-form-blur {
        top: 20%; 
    }

    .bg-text-overlap img{
        display: block;
        width: 100%;
        height: auto;
    }

    
}

.bg-img {
    background-image: url("../assets/images/contact-us-team.png");
    background-position: center;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}



.bg-text-overlap{
    position: relative;
    display: inline-block;
}

.t-a{
    margin:0px 0px;
    padding:5px;
    min-height:100px !important;
    line-height:16px;
    display:block;
    margin:0px auto;   
}





.bg-contact-us{
    background-image: url("../assets/images/contact-us-team.png");
    background-size: cover;
    background-position: center;
    width:100%; 
    height:auto;
    background-repeat: no-repeat;
}

@media screen and (min-width: 800px) {
    .fix-sticky{
        position: sticky;
        position: -webkit-sticky;
        top: 300px;
        /*margin-top: 300px;*/
        justify-content: center;
        align-items: center;
        color: #fff;
    }
}


.show-overflow{
    overflow-x: scroll;
}

.menu-item-scroll ul li{
    line-height: 40px;
}

.menu-item-scroll ul li a.active{
    color: #2ab757;
    font-weight: bold;
}

.menu-sticky-arrow{
    margin-top: 0.5rem;
}

.btn:hover{
    background-color: #19365d !important;
}

/*.menu-spy{
    
    color: #ffffff;
    background-color: #51c977 !important;
}


.menu-spy.active{
    background-color: #eeae26 !important;
}


*/



@media (max-width: 768px) { 
    .bg-overlap-arrow-green{
        background-image: url("../assets/images/big-arrow-double-green.png");
        background-size: contain;
        background-repeat: no-repeat;
        background-position-y: 30px;
    }

    .bg-overlap-arrow-blue{
        background-image: url("../assets/images/big-arrow-double-blue.png");
        background-size: contain;
        background-repeat: no-repeat;
        background-position-y: 30px;
    }

    .bg-overlap-arrow-pink{
        background-image: url("../assets/images/big-arrow-double-pink.png");
        background-size: contain;
        background-repeat: no-repeat;
        background-position-y: 30px;
    }

    .bg-overlap-arrow-yellow{
        background-image: url("../assets/images/big-arrow-double-yellow.png");
        background-size: contain;
        background-repeat: no-repeat;
        background-position-y: 30px;
    }
}


.bg-gradient-green{
    padding: 40px 0px;
    background: linear-gradient(90deg, #0b9daa 0%, #32b18e 29%, #49bd7d 55%, #62cb6b 86%, #7ad75a 100%);
}

.bg-gradient-blue{
    padding: 40px 0px;
    background: linear-gradient(90deg, #2444dc 0%, #566ae6 29%, #9299f3 55%, #ccc9fd 86%, #c9d0f9 100%);
}

.bg-gradient-pink{
    padding: 40px 0px;
    background: linear-gradient(90deg, #ffacf6 0%, #ffbbe7 21%, #ffc6dd 50%, #ffd6ce 81%, #ffeeb6 99%);
}

.bg-gradient-yellow{
    padding: 40px 0px;
    background: linear-gradient(90deg, #ff934d 0%, #ffa450 21%, #ffb953 50%, #ffcc56 81%, #ffda58 99%);
}





.consult-alway-on a.ao-comment{
    
}

.consult-alway-on a.ao-comment:hover{
    
}


.balloon-alway-on{
    position: fixed;
    z-index: 999;
    right: 30px;
    bottom: 35px;
    height: 45px;
    width: 45px;
    cursor: pointer;
}

.balloon-alway-on a.active{
    display: inline;
}

.ao-comment{
    z-index: 1000;
}

.popup-consult{
    position: fixed;
    z-index: 999;
    right: 90px;
    bottom: 35px;
    display: none;
}

.ao-call{
    position: fixed;
    z-index: 20;
    right: 20px;
    bottom: 141px;
    display: none;
}

.popup-close{
    position: fixed;
    z-index: 999;
    right: 90px;
    bottom: 35px;
    display: none;
}

.ao-mail{
    position: fixed;
    z-index: 30;
    right: 20px;
    bottom: 83px;
    display: none;
}

.ao-close{
    position: fixed;
    z-index: 999;
    right: 20px;
    bottom: 25px;
    display: none;
}



.btn-black{
    background-color: #000000;
    color: white;
}

.btn-black:hover{
    background-color: #383838;
    color: white;
}


/*.fadeInUp{
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    -webkit-animation-duration: 0.2s;
    animation-duration: 0.2s;
}*/

.fadeOutDown-1x {
    animation: fadeOutDown-1x 0.3s ease-in 0s 1 normal forwards;
}

@keyframes fadeOutDown-1x {
    from {
        opacity: 1;
        transform: none;
        /*translate3d(0, 200%, 0);*/
      }
    
      to {
        opacity: 0;
        transform: translateY(50px);
      }
}

.fadeOutDown-2x {
    animation: fadeOutDown-2x 0.2s ease-in 0s 1 normal forwards;
}

@keyframes fadeOutDown-2x {
    from {
      opacity: 1;
      transform: none;
	  /*translate3d(0, 200%, 0);*/
    }
  
    to {
      opacity: 0;
      transform: translateY(100px);
    }
}

.fadeInUp-1x {
    animation: fadeInup-1x 0.2s ease-in 0s 1 normal forwards;
}

@keyframes fadeInup-1x {
    from {
      opacity: 0;
      transform: translateY(100px);
	  /*translate3d(0, 200%, 0);*/
    }
  
    to {
      opacity: 1;
      transform: none;
    }
  }

.fadeInUp-2x {
    animation: fadeInup-2x 0.3s ease-in 0s 1 normal forwards;
}

@keyframes fadeInup-2x {
    from {
      opacity: 0;
      transform: translateY(150px);
	  /*translate3d(0, 200%, 0);*/
    }
  
    to {
      opacity: 1;
      transform: none;
    }
  }

.thai-fda-block{
    position: relative;
}

.thai-fda-salman-bg{
    background-image: url("../assets/images/thai-fda-salman.png");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    z-index: 20;
    width: 100%;
}

.bg-blur{
    background-color: #6e6d6d;
    backdrop-filter: blur(4px);
    background-color: #000000;
    z-index: 1;
    background: rgba(41, 41, 41, 0.6);
    top: 0%;
    left: 0%;
}

.thai-fda-content-block{
    position:absolute;
    text-align:center;
    left: 0;
    top: 10%;
    width: 100%
}

.thai-fda-text{
    opacity: 1;
    z-index: 100;
}

.bg-black{
    background-color: black;
}

.regulartory-card{
    border-radius: 10px;
    padding-top: 40%;
    padding-bottom: 30%;
}

.regulartory-card-2row{
    border-radius: 10px;
    padding-top: 22%;
    padding-bottom: 20%;
}



@media only screen and (min-width: 992px) {
    h6 {
        font-size: 1.1rem;
    }
}



.px-6 {
    padding-left: 4.5rem !important;
    padding-right: 4.5rem !important;
}

@media only screen and (max-width: 576px) {
    .container {
        max-width: 90% !important;
    }
}



.desc-lh-1{
    line-height: 1.5;
}


.img-size{
    height: auto;
}

/* For screens smaller than 576px */
@media (max-width: 576px) {
    .img-size {
      width: 80%; /* Full width on small screens */
    }
  }
  
  /* For screens larger than 576px */
  @media (min-width: 576px) {
    .img-size {
      width: 60%; 
    }
  }

  /* For screens larger than 768px */
  @media (min-width: 768px) {
    .img-size {
      width: 60%; /* Half width on medium screens */
    }
  }

  /* For screens larger than 992px */
  @media (min-width: 992px) {
    .img-size {
      width: 60%; /* Half width on medium screens */
    }
  }

  /* For screens larger than 1200px */
  @media (min-width: 1200px) {
    .img-size {
      width: 50%; /* Half width on medium screens */
    }
  }


  @media (max-width: 576px) {
    .c-h5 {
      font-size: 1rem;
    }
  }
  
  /* For screens larger than 576px */
  @media (min-width: 576px) {
    .c-h5 {
      font-size: 1.1rem; 
    }
  }

  /* For screens larger than 768px */
  @media (min-width: 768px) {
    .c-h5 {
      font-size: 1.2rem; 
    }
  }

  /* For screens larger than 992px */
  @media (min-width: 992px) {
    .c-h5 {
      font-size: 1.2rem; 
    }
  }

  /* For screens larger than 1200px */
  @media (min-width: 1200px) {
    .c-h5 {
     font-size: 1.2rem; 
    }
  }

  .container-step {
    max-width: 1300px !important;
    width: 100%;
    padding-right: var(--bs-gutter-x, 0.75rem);
    padding-left: var(--bs-gutter-x, 0.75rem);
    margin-right: auto;
    margin-left: auto;
  }

.required-box {
    border: 3px solid #e72b2b;
}

.required-text {
    color: #e72b2b;
}