﻿.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {line-height:1.4 !important;}
.bt-NVcolor {color: #fff; background-color: #76b701; display: inline-block; padding: 10px 30px; border-radius: 2px; letter-spacing: 1px; margin-top: 1rem;}

.d-none {display: none!important;}
h2 {color:#000;}
section i {margin-right:5px;}
 #HtmlTag[lang="en-US"] p {line-height:1.2 !important;}
.NVColor {color: #76b900;}
a.NVColor:focus, a.NVColor:active  {color: #76b900;}
a.NVColor:hover {color: #a3ff00;}
.textcomp {font-weight:normal;}
.tabs-wrapper { margin: 0 auto; display: block; width: 100%; overflow: hidden; position: relative;}
.tabs-wrapper ul.tabs {list-style: none; margin: 0; padding: 0; font-size: 0; overflow-x: auto; -ms-overflow-style: none; overflow: -moz-hidden-unscrollable; width: 100%; list-style-position: inside; white-space: nowrap; text-align: center;}
.tabs-wrapper ul.tabs::-webkit-scrollbar { display: none;}
.tabs-wrapper ul.tabs li { width: auto; margin: 0; border-bottom: 1px solid #ccc; padding-bottom: 4px; cursor: pointer; display: inline-block; font-size: 16px; line-height: 24px; list-style: none;}
.tabs-wrapper ul.tabs li.active { border-bottom: 4px solid #337ab7; padding-bottom: 1px;}
.tabs-wrapper ul.tabs li.active a { color: #337ab7; font-weight: 600;}
.tabs-wrapper ul.tabs li a { color: #000; font-size: 16px; padding-top: 10px; padding-bottom: 0; display: block; line-height: 50px;}
.mx-auto {margin-left:auto !important; margin-right:auto !important;}
.margin-b-0 {margin-bottom:0 !important;}
.table thead.thead-dark { border: 1px solid #b1b1b1;}
.table-bordered th, .table-bordered td {border-color:#b1b1b1 !important;}
.newtable th {background: #f0f9ff !important; vertical-align: middle !important;}

.table_rollup {overflow-y: hidden;transition: height 2s;}
.table_rollup .table_opener {display: none;}
.table_rollup table {width: calc(100% - 20px); margin: 10px;}

.table_rollup.table_rolled .table_opener {display: block;}
.table_opener {position: absolute;width: 100%;top: 8.75em;left: 0;text-align: center;padding: 5em 0;background: rgb(255, 255, 255);background: linear-gradient(0deg, rgb(243 246 248) 25%, rgba(255, 255, 255, 0) 100%);}
.table-wrapper {overflow-x: auto;}

/* Track */
.scroll-y::-webkit-scrollbar { width: 3px;}
.scroll-y::-webkit-scrollbar-track { background-color:#f2f2f2; border-left:1px solid #dde0e4; border-radius: 0px;}
.scroll-y::-webkit-scrollbar-thumb { background: #b3b3b3; border-radius: 0px;}
.scroll-y::-webkit-scrollbar-thumb:hover { background: #9b9b9b;}
.scroll-x::-webkit-scrollbar-thumb {border-radius:0; background-color:#b3b3b3; }
.scroll-x::-webkit-scrollbar {height: 3px; background-color:#f2f2f2;}
.scrollsmooth, .scroll-x, .scroll-y {scroll-behavior: smooth;}


#section1 { width: 100%; height: 510px; background-color: #1a1c1d; background-repeat: no-repeat; background-position: 50% 0}
#p_banner {width: 100%; height: 510px; display: flex; position:relative; z-index:1; align-content: center; justify-content: center;}
#bt_app {width: 180px; background-color: #2b58eb; margin-bottom:8px;}
#bt_app:active, #bt_app:hover {background-color: #143cbf;}
#banner_subject { display: flex; justify-content: center; flex-direction: column; }
#banner_subject > h2 { color: #fff; font-size:24px; font-weight: 600; letter-spacing: -.01em; margin:0; }
#HtmlTag[lang="en-US"] #banner_subject > h2 {font-size:20px;}
#banner_subject > h2:first-of-type {margin-top:15px; line-height:1.2 !important;}
#banner_subject > p {color:#fff; margin-top:10px;}

#section2 {
    background-image: url(/images/AIDMS/llm_rag_section2_bk1.webp), url(/images/AIDMS/llm_rag_section2_bk2.webp);
    background-repeat: no-repeat, repeat-x;
    background-position: bottom center, bottom center;
    background-size: auto, auto;
    height: auto;
    padding-bottom: 380px;
    background-color: #a0bdde;
}
#section2 .cardbox { padding: 15px 30px 20px; margin-bottom:0; background-color: #fff; border: 2px solid #2f6081; border-radius:6px;}
#section2 .shadow img {width: 100%; height: 25px;}
#section2 hr { background-color: #4a697f; margin-top: 5px; margin-bottom: 15px;}
#section2 p { margin-left:3px;}
#section2 .cardbox h2, #section2 .cardbox h3 { font-weight:bold; color: #2f6081;}
#section2 .cardbox h2 { font-size:20px; margin-bottom:0;}
#HtmlTag[lang="en-US"] #section2 .cardbox h2 { font-size:18px;}
#section2 .cardbox h3 { font-size:16px; margin-top: 0; margin-bottom: 10px;}
#HtmlTag[lang="en-US"] #section2 .cardbox h3 { font-size:15px; line-height:1.2 !important;}

#section3 {
    height: auto;
    padding-bottom: 30px;
    background-color: #dbde9f;
}
#section3 h3 { color: #352c00; margin-bottom: 15px;}
#HtmlTag[lang="en-US"] #section3 h3 {font-size: 19px; line-height: 1.2 !important;}
#section3 ul li { display:flex; color: #352c00; font-size: 16px;  border-top: 1px solid #a8ab63;  padding: 8px 0 8px 0; margin-left: -38px; margin-right: 10px;line-height: 1.2; list-style-type: none;}
#HtmlTag[lang="en-US"] #section3 ul li { font-size: 14px;}
#section3 i.fa {margin-left:8px;}

#section4 { background-color: #f5f5f5;}

[class*="card-columns-"] .card {border-color:#d7d7d7;}
[class*="card-columns-"] .card-body { padding: 0.3rem 1.5rem 30px;}
[class*="card-columns-"] img {padding:10px 10px 0;}
[class*="card-columns-"] p.card-text {color:#000; padding-bottom:20px; font-size:16px;}
[class*="card-columns-"] h3 {padding-top:15px;}
[class*="card-columns-"] .card-bottom a {float:right;}

.card-columns-3 { column-count: 3; padding-bottom: 40px; gap: 0; }
#section5 { border-top:1px solid #e7e7e7; padding-bottom:30px;}
#section5 .card {flex-direction: row;}
#section5  .card-body { padding: 40px 0 40px 0;}
#section5 .card-body img {max-width:100px; margin:0 auto;}
#section5  .card-body li {display:flex; border-bottom: 1px solid #9d9d9d; padding: 6px 0 6px 0; line-height: 1.2; list-style-type: none; margin-left:-30px;}
#section5  .card-body ul>li:first-child {border-top: 1px solid #9d9d9d; }
#section5 i.fa { margin-left: 6px;  margin-right: 6px;}
#section5 .gap img {height:100%; max-width:95px;}
#section5 h3 {color:#000; margin-bottom:0;}
#HtmlTag[lang="en-US"] #section5 h3 {line-height:1.2 !important; margin-bottom: 10px;}

#section6 {background-color:#e5fbfa;}
#section6 .card {background-color:transparent;}
#section6 h3 i { margin-right:5px; }
.card-columns-2 { column-count: 2; padding-bottom: 0;}
.color-green {color:#2cba53;}
.color-blue {color:#0c0fc5;}
#section7 {background-color: #000308;}
#section7, #section7 h2, #section7 p, #section7 li  {color:#fff;}
#section7 ul  {margin-left:-15px;}
#GPU_accelerate {background-repeat:no-repeat; background-position:center bottom; background-size: auto 100%;}

#nv_certified {max-width:110px;}
#section9 { background-color: #f9f9f9; border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
#started {max-width:180px; padding-top:40px;}
#section9 h3 {color: #d78300;}
#HtmlTag[lang="en-US"] #section9 h3 {font-size:22px; line-height:1.2 !important;}
#section9 h4 {margin: 0 0 5px 0;}
#section9 h4>a {font-size:15px;}

@media (min-width: 1200px) {
    .tabs-wrapper ul.tabs li {padding-left: 20px; padding-right: 20px;}
    #banner_subject {margin-left:15px; margin-right:15px;}
}

@media (max-width: 1199px) {
    .tabs-wrapper ul.tabs li {padding-left: 15px; padding-right: 15px;}
    #p_banner {margin-left:30px;}
}

@media (max-width: 1199px) and (min-width: 768px) {

}

@media (min-width: 992px) {
    .textcomp {font-size:19px; padding: 20px 0 0;}
    #section5 h3 {font-size: 22px;}
    #HtmlTag[lang="en-US"] #section5 h3 {font-size: 20px;}
    #section7 p {font-size:17px;}
    #GPU_accelerate {height: 521px;}
    th.row2, th.row3, th.row4 {width:calc(755px / 3) !important;}
}

@media (max-width: 991px) and (min-width: 785px) { 
    #GPU_accelerate { height: 52.5vw;}
}

@media (max-width: 991px) and (min-width: 768px) {
    .textcomp {font-size:17px; padding: 10px 0 0;}
    .tabs-wrapper ul.tabs li {padding-left: 15px; padding-right: 15px;}
    #banner_subject > h2 {font-size: 20px;}
    #banner_subject > p {font-size:13px;}
    #section5 h3 {font-size: 20px;}
    #HtmlTag[lang="en-US"] #section5 h3 {font-size: 18px;}
    th.row2, th.row3, th.row4 {width:calc(565px / 3) !important;}
}

@media (max-width: 991px) {

}

@media (min-width: 821px) {

}

@media (max-width: 820px) {
    
}

@media (min-width: 785px) {
    #section1 { background-image: url(/images/AIDMS/llm_rag_BG_L.webp?v=1.0);}
}

@media (max-width: 784px) {
    #section1 {
        height: 100vw;
        background-size: 100%;
        background-image: url(/images/AIDMS/llm_rag_BG_M.webp?v=1.0);
        background-position: bottom center;
        background-color: #000308;
    }
    #p_banner { height: auto; padding-top: 35px; padding-bottom: 10px; margin-left: 0;}
    #banner_subject { align-items: flex-start; margin: 0 15px 0 0;}
    #GPU_accelerate { height: 66.1vw; }
}

@media (min-width: 768px) {
    #section3 [class*="col-"] {padding-bottom: 40px;}
    #section3 [class*="col-"]:not(:last-child) .cardbox {margin-right: -15px; background:url(/images/AIDMS/llm_rag_section3_div.webp) no-repeat; background-position: right top; background-size: 9px 105%;}
    #section3 ul {width: calc(100% - 30px);}
}

@media (max-width: 767px) {
    .container-fluid {padding: 0;}
    .container-fluid > .container {padding: 0; width:calc(100vw - 30px)}    
    .textcomp {font-size:15px;}  
    section .row {margin-left:0; margin-right:0;}
    #banner_subject > h2 {font-size: 17px;}
    #HtmlTag[lang="en-US"] #banner_subject > h2 {font-size:15px;}
    #banner_subject > p {font-size:12px;}
    #section2 .row { margin-right: 0; margin-left: 0;}
    #section5 h3 {font-size: 18px;}
    #HtmlTag[lang="en-US"] #section5 h3 {font-size: 16px;}
    #section5 .step {overflow-x:scroll;}
    #section5 .step .container { width: calc(150vw - 15px);}
    #section5 .card-body {padding: 40px 0 40px 40px;}
    th.row2, th.row3, th.row4 {width:calc(505px / 3) !important;}
}

@media (max-width: 680px) {
    .tabs-wrapper ul.tabs { width: calc(100vw - 40px); overflow-x:auto;}
    .tabs-wrapper ul.tabs.end::before {content: ' '; }
    .tabs-wrapper ul.tabs li {padding-left: 10px; padding-right: 10px;}
    .tabs-wrapper ul.tabs li:last-child {padding-right:10px;}
    .tabs-wrapper ul.tabs li a {font-size:13px; padding-top: 0; line-height:40px;}
    section h2.title {font-size:24px;}
    #section2 { background-size: 90% auto, auto 51.4vw; padding-bottom: 45vw;}
    #section3 { padding-bottom: 50px;}
    #section3 .cardbox.match-height {height:auto !important;}
}

@media (max-width: 580px) {
    section h4 {font-size:15px;}
   #section1 {height: 110vw;}
   #p_banner { padding-top: 20px;}
   #banner_subject h2 {font-size:15px;}
   section h2.title {font-size:22px !important;}
   #section2 .cardbox { padding: 15px 20px 15px;}
   #section3 h3 {font-size: 18px;}
   #section3 ul li {font-size: 14px;}
   #section5 .step .container { width: calc(200vw - 15px);}
   .card-columns-2 { margin-left: -5px; margin-right: -5px; gap: 0;}
   #section6 h3 {font-size: 18px;}
   #section6 ul {margin-left: -20px;}
   #section6 .card-body { padding: 0 7px 0 7px;}
   #section9 h4 {font-size:15px;}
   #section9 h4 > a {font-size:13px;}
}

@media (max-width: 460px) {
    .textcomp {font-size:14px;}   
    .tabs-wrapper ul.tabs li a {font-size:12px; padding-top: 0; line-height:35px;}   
    .newtable th, .newtable td { font-size: 12px !important; font-weight: 500 !important; vertical-align:middle !important;}
    .tabs-wrapper { width: calc(100% + 40px); margin-left: -20px; margin-right: -20px;}
    #section1 {height: 130vw;}
    #section2 .cardbox h2 {font-size: 16px;}
    #section2 .cardbox h3 {font-size: 13px;}
    #section2 .match-height.padding-b-40 {padding-bottom: 15px;}
    #section3 ul li {font-size: 12px;}
    #section5 .step .container { width: calc(280vw - 15px);}
    #section5 h3 {font-size: 15px;}
    #section6 .card-columns-2 { column-count: 1 !important;}
    #section6 .card {height: auto !important;}
    #section6 h3 {font-size: 14px; font-weight: 400; padding-top:0;}
    #section6 h3 i {font-size: 12px; transform: scale(0.7); margin-right: 0;}
    #section8 .container { padding-right: 0; padding-left: 0;}
    #HtmlTag[lang="en-US"] #section9 h3 { font-size: 20px; }    
    #started { max-width: 140px;}
}