/* CSS Document */
@font-face {
    font-family: 'Kanit-SemiBold';
    src: local('Kanit-SemiBold'),
         url('https://cdn.biocytogen.com/web/frontend/Public/webfonts/Kanit-SemiBold.ttf') format('truetype');
    font-style: normal;
    font-display: swap; /* 字体加载中显示默认字体，加载完成后替换 */
    font-size-adjust: 0.5; /* 调整x-height匹配默认字体 */
}
@font-face {
    font-family: 'Kanit-Medium';
    src: local('Kanit-Medium'),
         url('https://cdn.biocytogen.com/web/frontend/Public/webfonts/Kanit-Medium.ttf') format('truetype');
    font-style: normal;
    font-display: swap; /* 字体加载中显示默认字体，加载完成后替换 */
    font-size-adjust: 0.5; /* 调整x-height匹配默认字体 */
}
@font-face {
    font-family: 'Kanit-Light';
    src: local('Kanit-Light'),
         url('https://cdn.biocytogen.com/web/frontend/Public/webfonts/Kanit-Light.ttf') format('truetype');
    font-style: normal;
    font-display: swap; /* 字体加载中显示默认字体，加载完成后替换 */
    font-size-adjust: 0.5; /* 调整x-height匹配默认字体 */
}
@font-face {
    font-family: 'Kanit-Regular';
    src: local('Kanit-Regular'),
         url('https://cdn.biocytogen.com/web/frontend/Public/webfonts/Kanit-Regular.ttf') format('truetype');
    font-style: normal;
    font-display: swap;
    font-size-adjust: 0.5;
}
@font-face {
    font-family: 'PlusJakartaSans-Medium';
    src: local('PlusJakartaSans-Medium'),
         url('https://cdn.biocytogen.com/web/frontend/Public/webfonts/PlusJakartaSans-Medium.ttf') format('truetype');
    font-style: normal;
    font-display: swap;
    font-size-adjust: 0.5;
}
@font-face {
    font-family: 'PlusJakartaSans-Regular';
    src: local('PlusJakartaSans-Regular'),
         url('https://cdn.biocytogen.com/web/frontend/Public/webfonts/PlusJakartaSans-Regular.ttf') format('truetype');
    font-style: normal;
    font-display: swap;
    font-size-adjust: 0.5;
}
@font-face {
    font-family: 'PlusJakartaSans-SemiBold';
    src: local('PlusJakartaSans-SemiBold'),
         url('https://cdn.biocytogen.com/web/frontend/Public/webfonts/PlusJakartaSans-SemiBold.ttf') format('truetype');
    font-style: normal;
    font-display: swap;
    font-size-adjust: 0.5;
}
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  height: 100%;
  scroll-behavior: smooth;
}

body{background:#fff;height:100%;margin:0;padding:0;font-family: 'PlusJakartaSans-Regular', sans-serif;font-weight:400;font-size:16px;line-height: 1.5;color: #51516C;}

.h1,h1{font-family: 'Kanit-SemiBold', sans-serif;font-weight:600;line-height: 1.3;color:#23232F;font-size: 40px;}

.h2,h2{font-family: 'Kanit-SemiBold', sans-serif;font-weight:500;line-height: 1.3;color:#23232F;font-size: 48px;}

.h3,h3{font-family: 'Kanit-SemiBold', sans-serif;font-weight:600;line-height: 1.3;color:#23232F;font-size: 40px;}

.h4,h4{font-family: 'Kanit-SemiBold', sans-serif;font-weight:600;line-height: 1.3;color:#23232F;font-size: 36px;}

.h5,h5{font-family: 'Kanit-Medium', sans-serif;font-weight:500;line-height: 1.3;color:#23232F;font-size: 24px;}

.h6,h6{font-family: 'Kanit-Medium', sans-serif;font-weight:500;line-height: 1.3;color:#23232F;font-size: 18px;}

.title-widget{font-family: 'Kanit-Medium', sans-serif;font-weight:500;color:#23232F;font-size: 16px;}
/*Loader=================================================================================*/
#preloader{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#fff;background:rgba(255,255,255,.8);z-index:10000;line-height:100%}
#preloader .preloader-center{position:absolute;bottom:50%;top:50%;left:0;right:0}
#preloader .loading-logo{text-align:center;margin:0 auto 5px}
#preloader .load-spinner{margin:0 auto;width:250px;text-align:center}
.load-spinner>div{width:20px;height:20px;background-color:#00ACA1;border-radius:100%;display:inline-block;-webkit-animation:bouncedelay 1.4s infinite ease-in-out;animation:bouncedelay 1.4s infinite ease-in-out;-webkit-animation-fill-mode:both;animation-fill-mode:both}
.load-spinner .bounce1{-webkit-animation-delay:-.64s;animation-delay:-.64s}
.load-spinner .bounce2{-webkit-animation-delay:-.48s;animation-delay:-.48s}
.load-spinner .bounce3{-webkit-animation-delay:-.32s;animation-delay:-.32s}
.load-spinner .bounce4{-webkit-animation-delay:-.16s;animation-delay:-.16s}
@-webkit-keyframes bouncedelay{0%,100%,80%{-webkit-transform:scale(0)}
40%{-webkit-transform:scale(1)}
}
@keyframes bouncedelay{0%,100%,80%{transform:scale(0);-webkit-transform:scale(0)}
40%{transform:scale(1);-webkit-transform:scale(1)}
}
.nav-overlay{background: #000;filter: alpha(opacity=100);opacity: 0;height: 100%;width: 100%;position: fixed;top: 0;left: 0;z-index: 10000; display:none;}


.all-caps{font-family: 'Kanit-Light', sans-serif;font-weight:300;color:#23232F;font-size: 14px;}

.textBody-large{font-family: 'PlusJakartaSans-Medium', sans-serif;font-weight:500;color:#51516C;font-size: 20px;}

.textBody-reg{font-family: 'PlusJakartaSans-Regular', sans-serif;font-weight:400;color:#51516C;font-size: 16px;}

.textBody-small{font-family: 'PlusJakartaSans-Regular', sans-serif;font-weight:400;color:#51516C;font-size: 14px;}

.textBody-tiny{font-family: 'PlusJakartaSans-Regular', sans-serif;font-weight:400;color:#51516C;font-size: 13px;}

.textLink{font-family: 'PlusJakartaSans-SemiBold', sans-serif;font-weight:600;color:#007A72;font-size: 16px;text-decoration:underline!important;}

ul, ol, li {
  list-style: none;
  padding: 0;
  margin: 0;
}

.tab-content li {
  list-style: disc;
  padding-left: 20px;
  margin-bottom: 5px;
}

a {
  color: #51516C;
  text-decoration: none;
  outline: 0;
  transition: color 0.2s ease;
}
a:active, a:hover, a:link, a:visited {
  text-decoration: none;
  outline: 0;
}
a:hover {
  color: #007A72;
}
a.blue, a.blue:link, a.blue:visited {
  color: #2096f6;
  text-decoration: underline;
}
a.blue:hover {
  color: #1880e8;
}
a.green, a.green:link, a.green:visited {
  color: #007A72;
  text-decoration: underline;
}
a.green:hover {
  color: #006963;
}

button, input, select, textarea {
  outline: none;
}
.btn {
  outline: none !important;
  box-shadow: none !important;
}
.btn::-moz-focus-inner {
  border-color: transparent;
}
.btn-biocytogen {
  background-color: #007A72;
  color: #fff !important;
  border-color: #007A72;
  transition: background-color 0.2s ease;
}
.btn-biocytogen:hover {
  background-color: #006963;
}

input:focus {
  background-color: transparent !important;
}

p {
  margin-bottom: 10px;
}
form code {
  background: transparent;
}
textarea.form-control {
  height: auto;
}
form.required-validate .help-block {
  margin-bottom: 0 !important;
}

[class*=" icon-"], [class^=icon-]{ margin-right:4px;}

.ct-ml-5{margin-left: 5px;}

.ct-ml-10{margin-left: 10px;}

.ct-pl-10{padding-left: 10px;}

.ct-ml-15{margin-left: 15px;}

.ct-ml-20{margin-left: 20px;}

.ct-ml-30{margin-left: 30px;}

.ct-mr-5{margin-right: 5px;}

.ct-mr-10{margin-right: 10px;}

.ct-mr-15{margin-right: 15px;}

.ct-mr-20{margin-right: 20px;}

.ct-mr-30{margin-right: 30px;}

.ct-mt-5{margin-top: 5px;}

.ct-mt-10{margin-top: 10px;}

.ct-mt-15{margin-top: 15px;}

.ct-mt-20{margin-top: 20px;}

.ct-mt-24{margin-top: 24px;}

.ct-mt-30{margin-top: 30px;}

.ct-mt-32{margin-top: 32px;}

.ct-mt-48{margin-top: 48px;}

.ct-mb-5{margin-bottom: 5px;}

.ct-mb-10{margin-bottom: 10px;}

.ct-mb-15{margin-bottom: 15px;}

.ct-mb-20{margin-bottom: 20px;}

.ct-mb-24{margin-bottom: 24px;}

.ct-mb-30{margin-bottom: 30px;}

.ct-mb-32{margin-bottom: 32px;}

.ct-mb-48{margin-bottom: 48px;}

.zm-uppercase{text-transform: uppercase;}

table.pth-center thead tr td{text-align: center;}
table.ptd-8-10 tbody tr td{padding: 8px 10px;}
table.ptd-8-15 tbody tr td{padding: 8px 15px;}
table.ptd-10-10 tbody tr td,table.pth-10-15 thead tr td{padding: 10px;}
table.ptd-10-15 tbody tr td,table.pth-10-15 thead tr td{padding: 10px 15px;}
table.ptd-15-15 tbody tr td,table.pth-15-15 thead tr td{padding: 15px;}

.commonForm .form-group{margin: 0;}
.commonForm .input-group{background-color: rgb(255 255 255 / 80%);padding: 3px 10px;border-radius: 30px;border: 1px solid #ccc;}
.commonForm .input-group input{border: none!important;box-shadow: none!important;background-color: transparent!important;}
.commonForm .input-group button{border-radius: 50%!important;padding: 0;height: 28px;width: 28px;text-align: center;}
.commonForm .input-group button i{margin: 0;}

#back-top{position:fixed;bottom:25px;right:25px;padding:0;margin:0;z-index:999999999;box-shadow:0 2px 6px rgba(0,0,0,0.2);border-radius: 5px;}
#back-top a{text-decoration:none;width:38px;height:38px;display:block;background-color:#757679;color:#FFF;font-size:30px;line-height:100%;z-index:9999999;text-align:center;transition:all .3s ease 0s;-webkit-transition-duration:.3s;-webkit-transition-timing-function:ease;border-radius:5px;}
#back-top a:hover{background-color:#007a72;transition:all .3s ease 0s;-webkit-transition-duration:.3s;-webkit-transition-timing-function:ease;color:#fff}

.vrs-grid{display: grid;grid-template-columns: 25.6% 68.6%;column-gap: 65px;}

@media screen and (max-width:1199px){
    .vrs-grid{column-gap: 55px;}
}
@media screen and (max-width:991px){
    .vrs-grid{grid-template-columns: 100%;gap: 30px;}
    .vrs-grid .vrs-md-4.left-block .leftitem-box{position: static!important;width: 100%!important;height: auto!important;}
}

@media screen and (max-width:1279px){
    .h1,h1{font-size: 38px;}
    .h2,h2{font-size: 46px;}
    .h3,h3{font-size: 38px;}
    .h4,h4{font-size: 34px;}
    .h5,h5{font-size: 22px;}
    .h6,h6{font-size: 16px;}
    .all-caps{font-size: 13px;}
    .textBody-large{font-size: 18px;}
    .textBody-reg{font-size: 15px;}
    .textBody-small{font-size: 13px;}
    .textBody-tiny{font-size: 12px;}
    .textLink{font-size: 15px;}
    body{font-size: 15px;}
}
@media screen and (max-width:1023px){
    .h1,h1{font-size: 36px;}
    .h2,h2{font-size: 44px;}
    .h3,h3{font-size: 36px;}
    .h4,h4{font-size: 32px;}
    .h5,h5{font-size: 20px;}
    .all-caps{font-size: 12px;}
    .textBody-reg{font-size: 14px;}
    .textBody-small{font-size: 12px;}
    .textLink{font-size: 14px;}
    body{font-size: 14px;}
}
@media screen and (max-width:767px){
    .h1,h1{font-size: 34px;}
    .h2,h2{font-size: 42px;}
    .h3,h3{font-size: 34px;}
    .h4,h4{font-size: 30px;}
    .h5,h5{font-size: 18px;}
}

@media screen and (min-width:480px) and (max-width:599px){
    .container-fluid{width: 100%;padding-right: 15px;padding-left: 15px;margin-right: auto;margin-left: auto;}
}

@media screen and (min-width:720px) and (max-width:839px){
    .container-fluid{width: 100%;padding-right: 15px;padding-left: 15px;margin-right: auto;margin-left: auto;}
}

@media screen and (min-width:840px) and (max-width:1023px){
    .container-fluid{width: 100%;padding-right: 15px;padding-left: 15px;margin-right: auto;margin-left: auto;}
}

@media screen and (min-width:1024px) and (max-width:1279px){
    .container-fluid{width: 100%;max-width: 970px;min-width: 755px;margin: 0 auto;}
}

@media screen and (min-width:1280px) and (max-width:1599px){
    .container-fluid{width: 100%;max-width: 1170px;min-width: 755px;margin: 0 auto;}
}

@media screen and (min-width:1600px) and (max-width:1919px){
    .container-fluid{width: 100%;max-width: 1200px;min-width: 755px;margin: 0 auto;}
}

@media screen and (min-width:1920px){
    .container-fluid{width: 100%;max-width: 1260px;min-width: 755px;margin: 0 auto;}
}