/* Global */
.center {
    text-align:center;
}

/* 首頁網頁  --start-- */
/* Header (navbar) */
.navshadow{
    box-shadow:0 2px 4px 0px rgba(0,0,0,.2);
}

.logofont{
    font-size:35px; 
    letter-spacing:1.5px;
}
  
.navbtnleft {
    margin-left:auto!important;
}

.navbtn {
    font-size: 20px; 
    color:#333 !important;
}
/* carousel */

/* intro-article */
.introbg {
    background-image: url(http://203.145.220.109/images/2035661.png); 
    background-size:cover; 
    
}

.introheaderer {
    font-size: 3.5rem; 
    line-height: 1.2; 
    font-family: source-han-sans-traditional, sans-serif;
    font-style: normal;
    font-weight: 700;
    color: #333;
    padding:25px 0 0 0;
}
/*
hr {
  border: none;
  border-top: 1px solid rgba(255,255,255,.3);
  border-bottom: 1px solid rgba(0,0,0,.08);
  margin: 2.5em 0;
  position: relative;
}
hr:before,hr:after {
  content: '';
  position: absolute;
  bottom:0px;
  height: 5em;
  width: 100%;
  background: radial-gradient(ellipse at bottom, rgba(255,255,255,0.35) 0%,rgba(255,255,255,0) 70%);
  z-index:90;
}
hr:after {
  top:0px;
  bottom:auto;
  height: 1.5em;
  background: radial-gradient(ellipse at top, rgba(0,0,0,0.06) 0%,rgba(0,0,0,0) 70%);
}
*/
.introborder {
    padding-top:3%
}

.introheader {
    font-size: 3.5rem; 
    line-height: 1.2; 
    font-weight:500; 
    color: #333;
}

.introbody{
    font-size: 1.2rem; 
    line-height: 2; 
    font-weight:600; 
    color: #333; 
    text-align: justify;
}
/* function */
.funheader {
    font-family: source-han-sans-traditional, sans-serif;
    font-size: 2.3rem; 
    line-height: 1.2; 
    font-weight:500; 
    color: #333;
}

.picword {
    margin:5% 0 0 0;
}

/* footer */
.footerheader{
    font-size: 1.2rem; 
    line-height: 0.5; 
    font-weight:600; 
    color: #f8f9fa; 
    text-align: center; 
    padding: 30px 0% 1% 0%;
    box-sizing: border-box;
    
}

.footercontent{
    font-size: 1.2rem; 
    line-height: 0.5; 
    font-weight:600; 
    color: #f8f9fa; 
    text-align: justify; 
    padding: 10px 0% 30px 15%;
}

/*.footer-bg-color{
background: #0f0c29;  /* fallback for old browsers */
/*background: -webkit-linear-gradient(to top, #24243e, #302b63, #0f0c29);  /* Chrome 10-25, Safari 5.1-6 */
/*background: linear-gradient(to top, #24243e, #302b63, #0f0c29); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
/*margin:0 0 0% 0             
/*}*/

.footer-bg-color {
    background-color: #949494;  /* fallback for old browsers */          
}


/* Sponsor_Logo */
.logo-container {
    width:100%;
}

.no-border {
    text-align:center;
    --bs-gutter-x: 0rem !important;
}

/*.logoborder {
    border: 1px solid #dee2e6!important;
}*/

.logobox {
    position: relative;
    display: block;
    max-width: 650px;
    margin: 0 auto;
    cursor: pointer;
    text-decoration: none;
    background-color: transparent;
}

.logoimg {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
    border-style: none;
}

.logo-caption {
    position: absolute;
    bottom: 0;
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;
    opacity: 0;
    color: #fff;
    background: rgba(135, 202, 211, 0.9);
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s;
}
/*BG-COLOR:rgba(90, 188, 155, 0.9); */

.logobox:hover .logo-caption {
  opacity: 1;
}

.logo-content {
    position: absolute;
    top: 50%;
    width: 100%;
    transform: translateY(-50%);
    text-align: center;
}

.logonamefont {
    font-size: 22px;
}

.logocontentfont {
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    padding: 0 15px;
    font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
}

.content-hallow {
    color: rgba(255, 255, 255, 0.7);
}
/* 首頁網頁  --end-- */
/* 
-------------------------------------------------- */
/* 模型網頁  --start-- */
/* 文案+分析 (=diagnosis) 的範圍設定 */
.diagnosis-col{
    width:100%;
    padding:0; 
}

.diagnosis-container {
    margin: 20px 0 0 0;
}

/* article */
.article-container{
    max-width: 1200px;
    margin: 0 auto 15px auto; 
    display: flex;
    position: relative;
    box-sizing: border-box;
}

.article-col {
    padding: 30px 0 1em 0;
    width: 100%;
    position: relative;
    box-sizing: border-box; 
    margin: 0px 0 0 0;
    text-align:center;
}

.artbg {
    background-image: url(https://lbcs.agri-twin.tw/images/beams4.png); 
    background-size:cover; 
    min-width:100%;
}

.artbtn { 
    text-align: center;
    margin:0 0 30px 0;
    
}

/* counter */
.project {
    font-weight:700px;
    font-size:55px;
    color: rgb(255,255,255);
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:pre;
    line-height:normal;
}

.chung{
    font-weight:700px;
    font-size:40px;
    color: rgb(255,255,255);
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:pre;
    line-height:normal;
    
}

.num1 {
    font-weight:700px;
    font-size:80px;
    color: rgb(255,255,255);
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:pre;
    line-height:normal;
}

.modelnam {
    font-weight:700px;
    font-size:45px;
    color: rgb(255,255,255);
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:pre;
    line-height:normal;
}

.pics {
    font-weight:700px;
    font-size:30px;
    color: rgb(255,255,255);
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:pre;
    line-height:normal;    
}


/* 分析區 = analysis
-------------------------------------------------- */
.analysis-col {
    width: 100%;
    margin: 25px 0 20px 0;
}

.analysis-container {
    background-color: #ededed;
    margin: 0 20% 10px 20%;
    padding: 30px;
    border: 1px solid #ddd; 
}
        
.analysis-btn { 
    background-color:#2336dd; 
    color: #ffffff; 
    letter-spacing:0.1em;
    
}

.analyform {
    margin-bottom: 30px;
}

.analyhead {
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 1.5;
    color: #5a5a5a;
    text-indent: 10px;
}

.analyhint {
    font-weight:700px;
    font-size:20px;
    color: #5a5a5a;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:normal;
    line-height:normal;   
}

.analyimg1 {
    width:50%; 
    text-align:center; 
    float:left;
}

.analyimg2 {
    width:50%; 
    text-align:center; 
}

/* smartmonitor 20220331  */
.smartm-container {
    margin: 35px 0 0 0;
}
.smartimgbg01 {
    text-align:center; 
}
.smartmimg01 {
    text-align: center;
    width: 98%;
    height: auto;
    margin: 0% 1% 0% 1%;
    border-radius:5px;
}

.smartmstream01 {
    text-align: center;
    padding:2% 2% 2% 2%; 
    background-color:#E9E6DF;
}

.smartarticle01{
    padding:2% 2% 2% 2%;
    background-color:#E9E6DF;

}

.card-header01 {
    padding: 0.5rem 1rem;
    margin-bottom: 0;
    background-color: rgba(0,0,0,.03);
    border-bottom: 1px solid rgba(0,0,0,.125); 
    padding: 0.8rem 1rem 0.4rem 1rem;
}

.card-link:link {
    color:black;
    text-decoration:none;

    font-size: 1.7rem;
    line-height: 1.0;
    font-weight: 500;
}

.card-link:visited {
    color:black;
    text-decoration:none;

    font-size: 1.7rem;
    line-height: 1.0;
    font-weight: 500;
}

.card-link:hover {
    color:black;
    text-decoration:none;

    font-size: 1.7rem;
    line-height: 1.0;
    font-weight: 600;
}

.cahd-font01 {
    font-size: 1.9rem;
    line-height: 1.0;
    font-weight: 600;
    color: #333;
    text-align: justify;
    margin: 2% 0 0 0;
}

.cahd-font {
    font-size: 1.8rem;
    line-height: 1.0;
    font-weight: 500;
    color: #2f4699;
    text-align: justify;
    margin: 2% 0 0 0;
}

.cabd-font {
    font-size: 1.2rem;
    line-height: 1.7;
    font-weight: 600;
    color: #333;
    text-align: justify;
    margin: 2% 0 0 0;
}

.cabd-font01 {
    font-size: 1.2rem;
    line-height: 1.7;
    font-weight: 600;
    color: #333;
    text-align: justify;
    margin: 3% 0 0 0;
}

.ccc-font {
    font-size: 1.1rem;
    line-height: 1.7;
    font-weight: 600;
    color: #333;
    display:block;
    text-align: right;
    margin: 5% 0 0 0;
}

/** 滑動時隱藏BAR **/
#navbar-hide {
    transition: top 0.3s;
}

@media (max-width: 959px) {
  /* Bump up size of carousel content */
.analysis-container {
    background-color: #ededed;
    margin: 0 0% 10px 0%;
    padding: 30px;
    border: 1px solid #ddd; 
  } 
.analyimg1 {
    width:100%; 
    text-align:center; 
    float:left;
}

.analyimg2 {
    width:100%; 
    text-align:center; 
}    
}
/* 模型網頁  --end-- */
/* 
-------------------------------------------------- */
div.dataTables_wrapper div.dataTables_paginate{margin:0;white-space:nowrap;text-align:right;}
.pagination>.disabled>a,.pagination>.disabled>a:focus,.pagination>.disabled>a:hover,.pagination>.disabled>span,.pagination>.disabled>span:focus,.pagination>.disabled>span:hover{color:#777;cursor:not-allowed;background-color:#fff;border-color:#ddd}

.pagination>li>a,.pagination>li>span{position:relative;float:left;padding:6px 12px;margin-left:-1px;line-height:1.42857143;color:#337ab7;text-decoration:none;background-color:#fff;border:1px solid #ddd; text-align:right;}

/* teamember --start-- */

.memberbg {
    background-color:#e4e4e3;
}

.memberpic {
    max-width:100%; 
    height:auto;
}

.memberintro {
    font-size: 0.8rem; 
    line-height: 1.2; 
    font-weight: 400; 
    color: #333; 
    text-align: justify !important;
    letter-spacing: normal;
}

.introheading {
    font-weight:700;
    margin-top:8px;
}

.vetfont {
    font-size:0.7em;
    font-weight:700;
}

.vetname {
    margin-top:16px;
    font-weight:700;
}

.vetname1 {
    margin-top:16px;
    font-size:20px;
}

.vetschool {
    font-size: 0.9rem;
    margin-bottom: 8px !important;
    font-weight:600;
    letter-spacing: normal;
}

@media (min-width: 994px) {
.memberpic1{
   max-width:85%;
   height:auto; 
    }
}

@media (max-width: 575px) {
.vetname{
    margin-top:16px;
    font-weight:700;
    text-align:center;
    }
.vetschool{
    font-size: 0.9rem;
    margin-bottom: 8px !important;
    font-weight:600;
    letter-spacing: normal;
    text-align:center;
}
}
@media (max-width:768px){
    
    
}
/* teamember --end-- */
/* video --start-- */
.video-js .vjs-tech {
  position: relative;
  width: 100%;
  height: auto;
  top:auto;
  bottom:auto;
}

.videoscreen {
    width:100%; 
    height:auto; 
    border-radius:5px;
    text-align:center !important;
}

.videoscreen1 {
    width:90%; 
    height:auto; 
    border-radius:5px;
    text-align:center !important;
}

.videoscreen2 {
    width:80%; 
    height:auto; 
    border-radius:5px;
    text-align:center !important;
}

.vidintrobg1 {
    background-color:#D6DCE5;  
}

.vidstreambg1 {
    background-color:#D6DCE5;
    padding:5%;
    height:auto;    
}

.streamimg1 {
    text-align:center;
    width:300px;
    height:auto;
    margin:35% 10% 10% 10%;
}

@media (max-width: 768px) {
.streamimg1 {
    text-align:center;
    width:300px;
    height:auto;
    margin:10% 10% 10% 10%;
}  

.streamimg2 {
    text-align:center;
    width:300px;
    height:auto;
    margin:10% 10% 10% 10%;
}    

.vidintrobody {
    font-size: 1.2rem; 
    line-height: 2; 
    font-weight:600; 
    color: #333; 
    text-align: justify;
    margin:10% 4% 0 8%;    
}
}

.tablescreen {
    width:100%; 
    height:auto; 

}

.vidintrobg2 {
    background-color:#f9fafb  
}

.vidstreambg2 {
    background-color:#f9fafb;
    padding:5%;
    height:auto;    
}

.streamimg2 {
    text-align:center;
    width:300px;
    height:auto;
    margin:35% 10% 10% 10%;
}


.sec1head {
    margin:8% 0 0 5%;
    font-family: source-han-sans-traditional, sans-serif;
    font-style: normal;
    font-weight: 600;
    font-family: source-han-sans-traditional, sans-serif;
}

.sec2head {
    margin:8% 0 0 5%;
    font-family: source-han-sans-traditional, sans-serif;
    font-style: normal;
    font-weight: 600;
    font-family: source-han-sans-traditional, sans-serif;
}


@media (min-width: 990px) {
   .sec2head {
    margin:8% 0 0 10%;
    font-family: source-han-sans-traditional, sans-serif;
    font-style: normal;
    font-weight: 600;
    font-family: source-han-sans-traditional, sans-serif;
} 
}

.vidintrobody {
    font-size: 1.2rem; 
    line-height: 2; 
    font-weight:600; 
    color: #333; 
    text-align: justify;
    margin:10% 0 0 8%;    
}
/*  video --end--  */