@font-face{font-family:Lato;font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/lato-400.woff2') format('woff2')}
@font-face{font-family:Lato;font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/lato-700.woff2') format('woff2')}
:root{--color-text:#404040;--color-muted:#a3a3a3;--color-background:#f5f5f5;--color-panel:#fff;--color-link:#0075d9;--color-footer:#063a78;--color-border:#ced4da;--content-width:1320px}
*,::before,::after{box-sizing:border-box}
body{margin:0;font-family:Lato,BlinkMacSystemFont,-apple-system,'Segoe UI','Helvetica Neue',Helvetica,Roboto,Arial,sans-serif;font-size:16px;font-weight:400;line-height:1.5;color:var(--color-text);background:var(--color-background)}
h1,h2,h3{margin-top:0;margin-bottom:.5rem;font-weight:500;line-height:1.4}
h1{font-size:calc(1.375rem + 1.5vw)}h2{font-size:calc(1.325rem + .9vw)}h3{font-size:calc(1.3rem + .6vw)}
p{margin-top:0;margin-bottom:1rem}ul,ol{padding-left:2rem;margin-top:0;margin-bottom:1rem}strong{font-weight:700}
a{color:var(--color-link);text-decoration:none}a:hover{color:#081942}img,svg{vertical-align:middle}button,input{margin:0;font:inherit}button{cursor:pointer}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #017cc2;outline-offset:3px}
.container{width:100%;padding-right:12px;padding-left:12px;margin-right:auto;margin-left:auto}
.row{--bs-gutter-x:24px;display:flex;flex-wrap:wrap;margin-right:calc(var(--bs-gutter-x)/-2);margin-left:calc(var(--bs-gutter-x)/-2)}
.row>*{flex-shrink:0;width:100%;max-width:100%;padding-right:calc(var(--bs-gutter-x)/2);padding-left:calc(var(--bs-gutter-x)/2)}
.col{flex:1 0 0%}.col-12{flex:0 0 auto;width:100%}.d-block{display:block}.text-center{text-align:center}.text-start{text-align:left}.mx-auto{margin-left:auto;margin-right:auto}.me-2{margin-right:.5rem}.mb-2{margin-bottom:.5rem}.pt-5{padding-top:3rem}.p-1{padding:.25rem}.position-relative{position:relative}
.navbar{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:.5rem 0}
.navbar .container{display:flex;flex-wrap:inherit;align-items:center;justify-content:space-between}
.navbar .container.d-block{display:block}
.brand-logo{display:block;width:320px;max-width:100%;height:65px;margin:auto}
.brand-logo img{display:block;width:100%;height:100%;object-fit:contain}
.input-group{position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100%}
.form-control{display:block;width:100%;padding:.375rem .75rem;color:#212529;background:#fff;border:1px solid var(--color-border);border-radius:.25rem;transition:border-color .15s,box-shadow .15s}
.form-control:focus{border-color:#86b7fe;box-shadow:0 0 0 .25rem #0d6efd40;outline:0}.form-control::placeholder{color:#6c757d;opacity:1}
.input-group>.form-control{position:relative;flex:1 1 auto;width:1%;min-width:0;border-top-right-radius:0;border-bottom-right-radius:0}
.input-group-text{display:flex;align-items:center;padding:.375rem .75rem;color:#212529;text-align:center;white-space:nowrap;background:#e9ecef;border:1px solid var(--color-border);border-radius:.25rem}
.input-group-lg>.form-control,.input-group-lg>.input-group-text{padding:.5rem 1rem;font-size:1.25rem;border-radius:.3rem}
.input-group-lg>.form-control{border-top-right-radius:0;border-bottom-right-radius:0}.input-group-lg>.input-group-text{margin-left:-1px;border-top-left-radius:0;border-bottom-left-radius:0}
.shadow{box-shadow:0 .5rem 1rem #00000026}
.breadcrumb{display:flex;flex-wrap:wrap;list-style:none}.breadcrumb-cat{background:var(--color-background);font-size:14px;padding:0;margin-bottom:.3rem}
.breadcrumb-item+.breadcrumb-item{padding-left:.5rem}.breadcrumb-item+.breadcrumb-item::before{float:left;padding-right:.5rem;color:#6c757d;content:'/'}
.breadcrumb-item.active{color:#6c757d}
.blog-detail-container .content-panel{background:var(--color-panel);padding:20px;margin-bottom:20px;border-radius:0 0 4px 4px}
.content-panel>.title{margin-bottom:20px}.content-panel>.title h1{font-size:28px;font-weight:700;color:var(--color-text)}
.author{position:relative;display:flex;justify-content:flex-start;align-items:center;margin-bottom:20px}.author .avatar img{max-width:56px;border-radius:50%}
.author .information{margin-left:1rem;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.author .name{font-size:16px;font-weight:700;color:#232323;margin-bottom:3px}.author .edit-date{font-size:14px;color:var(--color-muted);margin-bottom:3px}
.content img{width:100%;max-width:100%;height:auto}
.recommend-panel{background:var(--color-panel);padding:20px 15px 10px;border-radius:0 0 4px 4px}.recommend-panel p{line-height:1.3}
.recommend-title{font-size:24px;font-weight:700;color:#232323;margin-bottom:15px}
.recommend-blog-panel{margin-bottom:30px;position:relative}.recommend-blog-panel .picture{margin-bottom:6px;display:flex;justify-content:center;align-items:center}.recommend-blog-panel img{max-width:100%;height:auto}
.recommend-blog-panel .title p{font-size:16px;font-weight:700;color:var(--color-text)}
a.overlay{position:absolute;width:100%;height:100%;top:0;left:0}
footer{background:var(--color-footer);font-size:14px;width:100%;min-height:265px}footer a{color:#fff}footer .footer-cl{max-width:20%}
footer p.title{font-weight:700;color:#b3b3b3;margin:2rem 0 1rem;white-space:nowrap}footer ul{margin:0;padding:0;list-style:none}footer li{height:2rem;line-height:2rem}footer a.content{display:inline-block;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}footer a:hover{color:#ff5722}footer [aria-disabled='true']{cursor:default}
@media(min-width:576px){.container{max-width:540px}}
@media(min-width:768px){.container{max-width:720px}.col-md-9{flex:0 0 auto;width:75%}.col-md-3{flex:0 0 auto;width:25%}.py-md-2{padding-top:.5rem;padding-bottom:.5rem}}
@media(min-width:992px){.container{max-width:960px}.col-lg-4{flex:0 0 auto;width:33.33333333%}.col-lg-8{flex:0 0 auto;width:66.66666667%}.navbar{flex-wrap:nowrap}}
@media(min-width:1200px){.container{max-width:1140px}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.75rem}}
@media(min-width:1400px){.container{max-width:var(--content-width)}}
@media(max-width:768px){footer .footer-cl{max-width:50%;width:50%;flex:0 0 auto}}
@media(max-width:575px){.content-panel h1,.content h2,.content h3{overflow-wrap:break-word}.input-group-text{min-height:44px}}
