body{font-family:Arial, sans-serif;margin:0;padding:0;line-height:1.6;background-color:#f4f4f4;color:#333;padding-bottom:4rem;}
header{background-color:#333;color:#fff;padding:1rem 0;text-align:center;}
header h1{margin:0;font-size:2.5rem;}
main{max-width:800px;margin:2rem auto;padding:1rem;background-color:#fff;box-shadow:0 0 10px rgba(0, 0, 0, 0.1);}
main img{width:100%;height:auto;display:block;margin-bottom:1rem;}
article p{font-size:1.2rem;line-height:1.8;margin-bottom:1rem;}
footer{background-color:#333;color:#fff;text-align:center;padding:1rem 0;position:fixed;width:100%;bottom:0;box-shadow:0 -2px 5px rgba(0, 0, 0, 0.1);}
.social-icons .ico{background:transparent url(/shared/empty.gif) repeat scroll 0% 0%;box-shadow:0px 0px 0px 1px rgb(24, 101, 164) inset;cursor:pointer;display:inline-block;width:32px;height:32px;margin-left:11px;}
.blog-list{display:flex;flex-wrap:wrap;margin:-10px;}
.blog-preview{flex:1 1 280px;max-width:400px;margin:10px;border:1px solid #ddd;border-radius:12px;overflow:hidden;background:#fff;transition:box-shadow 0.3s;}
.blog-preview:hover{box-shadow:0 4px 12px rgba(0,0,0,0.1);}
.blog-link{text-decoration:none;color:inherit;display:block;}
.blog-image{width:100%;height:180px;object-fit:cover;display:block;}
.blog-title{font-size:1.2rem;margin:12px 16px 8px;}
.blog-description{font-size:0.95rem;color:#555;margin:0 16px 16px;line-height:1.4;}
@media (max-width: 600px) {
header h1{font-size:2rem;}
main{max-width:800px;margin:2rem auto;padding:1rem;background-color:#fff;box-shadow:0 0 10px rgba(0, 0, 0, 0.1);padding-bottom:4rem;}
article p{font-size:1rem;}

}