/* @font-face {
  font-family: 'Roboto';
  src: url('/ht-admin/theme/theme-select/fonts/roboto-regular.woff2') format('woff2');
  font-display: swap;
} */

:root {
--color-body-bg: #ffffff;  
--color-body-text: #333;  
--color-theme-bg: #07335b;   
--color-theme-text: #ffffff;   
--color-theme-link: #ffffff; 
--color-article-background: #ffffff; 
--color-article-text:#333; 
--color-article-link:#006fe6; 
--color-artcle-button-background: #07335b; 
--color-artcle-button-text: #ffffff; 


--font-size-article-H1: 1.8em;  
--font-size-article-H2: 1.5em;
--font-size-article-H3: 1.2em;
--font-size-article-H4: 1.1em;
--font-size-article-P: 1em;  
--font-size-article-Span: 0.8em;
}


*{box-sizing:border-box; padding:0;margin:0;}
html{scroll-behavior:smooth}
body, html{font-size: var(--font-size-article-P); background-color: var(--color-body-bg); color: var(--color-body-text);word-break: break-word; } 
body { font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; }
 
 
 
 
article a{text-decoration:none;color:var(--color-article-link);transition:color .3s;text-decoration: underline; font-weight: bold;}a:hover{color:#f90}
article h1{ font-size:  var(--font-size-article-H1);}
article h2{font-size:  var(--font-size-article-H2);}
article h3{font-size: var(--font-size-article-H3);}
main article h4{font-size:  var(--font-size-article-H4);}
main article p{font-size:  var(--font-size-article-P); margin:10px auto;line-height:1.8;}   
main article span{font-size:  var(--font-size-article-Span);}
main article button{ background-color: var(--color-artcle-button-background); color: var(--color-artcle-button-text); }
 
 
.header,.logo,.nav,.nav-links{display:flex} .hamburger .line{background-color:#fff} 
 article *{margin:10px auto}   
 .header{align-items:center;justify-content:space-between; background-color: var(--color-theme-bg); color: var(--color-theme-text); padding:10px 20px;position:sticky;top:0;z-index:1000}.logo{align-items:center}
 .logo img{width:40px;height:40px;border-radius:50%;background:#fff;display:block}.logo span{font-weight:700;font-size:18px;margin-left:8px}.logo span:first-child{color:#fff}.logo span:last-child,.nav-links li a:hover{color:gold}.nav-links{list-style:none;gap:20px}.nav-links li a{color:#fff;font-weight:500}.hamburger{display:none;flex-direction:column;cursor:pointer;gap:5px;background:0 0;border:none;padding:0;margin:0;box-shadow:none;width:30px;height:auto}.hamburger .line{width:25px;height:3px;border-radius:3px;transition:.3s ease-in-out}

  
 article { width: 98%; max-width: 720px; margin: 0 auto; padding: 10px; font-family: Roboto,Arial,sans-serif; font-size: 1rem; line-height: 1.75; background-color: var(--color-article-background); color: var(--color-article-text); box-shadow: 0px 0px 3px 0px; border-radius: 10px; } 
  
  
  .breadcrumb{list-style:none;display:inline-flex;align-items:center;gap:6px;padding:0;margin:0}.breadcrumb li{display:inline-flex;align-items:center}.breadcrumb li a{color:#007bff;text-decoration:none;font-weight:500}.breadcrumb li a:hover{text-decoration:underline}.breadcrumb li::after{content:"›";margin:0 6px;color:#555}.breadcrumb li:last-child::after{content:""}@media (max-width:768px){.breadcrumbData{display:none}}
  
  
article table{width: 100%; border-collapse: collapse; word-break: break-word; margin: 10px auto; font-size: 14px;}main article .category-data img, main article img{object-fit:cover}.HT-artical-Main{background-color:#fff;padding:0;border-radius:8px;flex:1}.articalheader{text-align: center;padding:5px;margin:5px;display:block}.articalheader span{font-size:14px;color:#555}.articalheader a{color:#007bff;text-decoration:none}.articalheader a:hover{text-decoration:underline}.right-sidebar{padding:15px;margin-left:20px}.post main a:hover{color:#f60}.post main h3{font-size:20px;font-weight:700;color:#333;margin-top:10px;margin-bottom:10px}.post .post main ol,.post main ul{margin-left:20px;margin-bottom:15px} main article ol, main article ul { margin-left: 15px; margin-bottom: 15px; } main article li{font-size:16px;color:#555;margin-bottom:8px}article main img{width:96%;max-width:400px;height:auto;margin:20px auto;border-radius:8px;display:block} .post main table td,.post main table th{padding:10px;border:1px solid #ddd;text-align:left}.post main table th{background-color:#f1f1f1}.post main table td{background-color:#fff}.footer{background-color:var(--color-theme-bg);color:var(--color-theme-text);padding:20px;text-align:center}.footer a{color:var(--color-theme-link)}.footer-bottom p{margin-bottom:5px}
 @media (max-width:250px){.header{display:block;padding:5px;text-align:center}.header a{display:none;padding:0;}}article audio,article embed,article iframe,article img,article video{max-width:500px;display:block;margin:0 auto}
 
  article article ol,article ul{padding-left:1.5em;margin:1em 0}article ol li,article ul li{margin-bottom:.5em}article img{height:auto;border-radius:8px}article button{padding:10px 20px;background-color:#0078d7;color:#fff;border:none;border-radius:6px;cursor:pointer;margin:1em 0;font-size:1rem;transition:background-color .3s}article button:hover{background-color:#005bb5}article table{margin:1.5em 0}article td,article th{border:1px solid #ccc;padding:10px;text-align:left}article th{background-color:#f7f7f7}article pre{background-color:#f0f0f0;padding:15px;border-radius:6px;overflow-x:auto;margin:1.5em 0;font-family:monospace;font-size:.95rem;line-height:1.6}article img[loading=lazy]{min-height:100px;background-color:#f8f8f8}html{font-display:swap}
  
  @media screen and (max-width:768px){article{padding:10px}}.htfy-article{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:auto;max-width:1200px}.ht-article-home{width:300px;border:1px solid #ddd;border-radius:8px;box-shadow:0 4px 6px rgba(0,0,0,.1);transition:transform .3s,box-shadow .3s}.aricaltitlehome{font-size:16px;font-weight:700;color:#333;padding:10px 15px;display:block}.aricaltitlehome a{color:inherit;transition:color .3s}.aricaltitlehome a:hover{color:#007bff}.latestpostdescription{font-size:14px;color:#666;line-height:1.6;padding:0 15px 15px;text-align:justify;display:block}.related-post-contener{display:flex;gap:5px;flex-wrap:wrap;margin:10px auto}main article .related-post{display:inline-flex;gap:10px;padding:5px;border-radius:5px;background-color:#fafafa;align-items:center;justify-content:center;width:98%;border:1px dashed #ff6a00;margin:5px auto}main article .related-post img{width:100px;height:auto;object-fit:cover;border-radius:6px;box-shadow:none;padding:0;margin:0}main article .related-post span{font-size:16px;margin:0;padding:0}main article .related-post h2{font-size:16px;color:#00f;font-weight:400;background:0 0;margin:0;padding:0}@media (max-width:768px){.nav{position:absolute;top:60px;right:0;background-color:#2c3e50;display:none;width:50%;max-width:200px;padding:0 10px;text-align:center}.nav-links,.nav.active{display:block}.hamburger{display:flex}.mainHTcontent,.nav-links li{display:block;margin:10px auto}.nav-links li{padding:0}.left-sidebar{display:none}.right-sidebar{width:96%;max-width:700px;background-color:#fff;padding:0;margin:0 auto}main article .related-post h2,main article .related-post span{font-size:15px;margin:0;padding:0}.related-post-contener{gap:0}.related-post{width:auto;margin:2px auto}main .related-post h2{color:#00f;font-weight:400;background:0 0}  .articalheader{display:none}}
  @media (max-width:480px){main article .related-post h2,main article .related-post span{font-size:14px;margin:0;padding:0}main article .related-post h2{color:#00f;font-weight:400;background:0 0}main article .related-post img{width:80px;height:auto}}main .category-data{border:1px solid #ddd;border-radius:8px;box-shadow:0 4px 6px rgba(0,0,0,.1);max-width:300px;display:flex;flex-direction:column}.category-data,.ht-article-home{background-color:#fff;overflow:hidden}.category-data .categoriname{font-size:1.2rem;margin:0;padding:7px 0;color:#fff;text-transform:uppercase}main .category-data .categoriname{background:#07335b;text-align:center}main .categoriname a{color:#fff}.category-item{padding:0 7px;box-shadow:0 2px 3px 0;margin:7px auto}.category-data img,.ht-article-home img{width:100%;height:auto;border-bottom:1px solid #ddd;max-width:100%;border-radius:10px 10px 0 0;max-height:180px}main .latestcategoryartical{display:block;margin:5px auto;text-align:center}.articledetails{display:inline-block;border:1px solid;margin:5px;padding:5px;border-radius:5px;width:auto;height:auto;max-width:300px;max-height:500px;box-sizing:border-box;overflow:auto}.urltitlehome,article .articledetails h2{font-size:16px;padding:0;margin:0}.latestcategoryartical img{width:96%;height:auto;border-radius:5px;display:block;margin:5px auto;padding:0;box-shadow:none}main .latestcategoryartical a{transition:color .3s;color:#0821a2}