#projects-page{max-width:1110px;margin:auto;padding:20px 2% 40px 2%}#projects-page h1{text-align:right;font-size:18px;color:#666;padding:22px 0 17px 0;font-weight:bold;display:flex;justify-content:space-between}#projects-page h1 a{display:flex;gap:8px;align-items:center}#projects-page #site-map{margin:20px 0}#projects-page #site-map a{font-size:14px;color:#666;margin-left:2px;text-decoration:none;transition:all 0.3s}#projects-page #site-map a:hover{color:#000}#projects-page #site-map .cursor{margin-left:2px;font-size:10px;font-weight:bold}#projects-page #site-map svg{width:12px;vertical-align:text-top;margin-left:2px}#projects-page #pagination-options{display:flex;gap:10px;margin:20px 0}#projects-page #pagination-options #search-box{display:flex}#projects-page #pagination-options #search-box input{display:block;border-radius:4px;border-top-right-radius:0;border-bottom-right-radius:0;width:400px;height:40px;line-height:40px;padding:0 15px;font-size:14px;background-color:#fff;border:1px solid #ced4da;color:#333;transition:border-color 0.3s ease-in-out}#projects-page #pagination-options #search-box input:hover,#projects-page #pagination-options #search-box input:focus{border-color:#f44336}#projects-page #pagination-options #search-box #search-button{padding:0 18px;border-top-right-radius:4px;border-bottom-right-radius:4px;background-color:#f44336;color:#fff;height:40px;border:0;display:flex;align-items:center}#projects-page #pagination-options select{vertical-align:middle;font-size:14px;height:40px;line-height:40px;color:#333;background-color:white;border-radius:4px;border:1px solid gainsboro;-webkit-appearance:none;-moz-appearance:none;padding-left:25px;padding-right:15px;background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23666%22%20points%3D%2212%201%209%206%2015%206%22%20%2F%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23666%22%20points%3D%2212%2013%209%208%2015%208%22%20%2F%3E%0A%3C%2Fsvg%3E%0A");background-repeat:no-repeat;background-position:0 50%;transition:border-color 0.3s ease-in-out}#projects-page #pagination-options select:hover{border-color:#f44336}#projects-page #pagination-selected-options>div{font-size:14px;color:#777;line-height:28px;margin:10px 0;position:relative;padding-right:32px}#projects-page #pagination-selected-options>div svg{cursor:pointer;fill:#777;display:block;position:absolute;top:2px;right:0;width:30px;height:30px;padding:2px;transition:all 0.3s ease-in}#projects-page #pagination-selected-options>div svg:hover{fill:#131315}#projects-page .no-content{font-size:14px;line-height:32px;color:#666;background:#ececec;padding:15px;border-radius:6px;margin-top:15px}#projects-page #please-wait-msg{display:none;color:#777;margin:20px 0;font-size:14px;line-height:28px}#projects-page #projects{margin:20px 0}@media (max-width: 1110px){#projects-page #projects{grid-template-columns:1fr}}#projects-page .project{display:grid;grid-template-columns:280px auto;gap:20px;background:#fff;margin-top:27px;padding-bottom:0;border-radius:12px;padding:30px;box-shadow:0 5px 15px rgba(0,0,0,0.08);transition:box-shadow 0.1s ease-in-out}#projects-page .project .cover-image{background-repeat:no-repeat;background-size:cover;background-position:center;background-color:#ececec;position:relative;overflow:hidden;border-radius:5px;height:160px}#projects-page .project .rate-box{display:flex;align-items:center;justify-content:center;position:absolute;background:rgba(0,0,0,0.4);height:24px;line-height:24px;transform:rotateZ(45deg);width:160px;right:-44px;top:26px;direction:ltr}#projects-page .project .rate-box svg{transform:rotateZ(-35deg);width:13px;margin:0 1px}#projects-page .project .details .title{text-decoration:none;display:block;margin-bottom:10px;font-size:15px;color:#333;font-weight:bold;line-height:30px;transition:all 0.3s ease-in}#projects-page .project .details .title:hover{color:#21639d}#projects-page .project .details p{color:#444;line-height:36px;font-size:14px;margin-bottom:10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}#projects-page .project .details .meta{display:flex;column-gap:20px;margin-top:14px;flex-wrap:wrap;align-items:center}#projects-page .project .details .meta>div{display:flex;gap:5px;flex-wrap:wrap;align-items:center}#projects-page .project .details .meta>div span{color:#555;font-size:13px;line-height:26px}#projects-page .project .details .tags{display:flex;gap:5px;margin-top:14px;flex-wrap:wrap}#projects-page .project .details .tags .tag{cursor:pointer;display:flex;gap:5px;align-items:center;color:#f5f5dc;background:#777;padding:0 14px;font-size:12px;border-radius:5px;margin-bottom:5px;text-decoration:none;transition:all 0.2s ease-in-out;height:26px;line-height:26px}#projects-page .project .details .tags .tag:hover{background:#555}#projects-page .project:hover{border-color:#aeb4b9}#projects-page #btn-show-more{display:none;align-items:center}#projects-page #btn-show-more svg{margin-left:10px}@media (max-width: 1100px){#projects-page .project{grid-template-columns:270px auto;padding:20px}}@media (max-width: 760px){#projects-page #pagination-options{display:flex;flex-direction:column}#projects-page #pagination-options select,#projects-page #pagination-options #search-box input{width:100%}#projects-page .project{grid-template-columns:1fr;padding:15px}#projects-page .project .cover-image{height:200px}#projects-page .project .details p{display:block}}.dark #projects-page #site-map a{color:#a8a7a7}.dark #projects-page #site-map a:hover{color:#fff}.dark #projects-page #pagination-options #search-box input{background-color:#282828;border:1px solid #444;color:#cacaca}.dark #projects-page #pagination-options #search-box input:focus,.dark #projects-page #pagination-options #search-box input:hover{border-color:#1e87f0}.dark #projects-page #pagination-options #search-box #search-button{background:#395273;border-color:#395273}.dark #projects-page #pagination-options #search-box #search-button:hover{background:#2e62a6}.dark #projects-page #pagination-options select{background-color:#282828;border-color:#444;color:#cacaca}.dark #projects-page #pagination-options select:hover{border-color:#1e87f0}.dark #projects-page .no-content{color:#848484;background:#171717}.dark #projects-page .project{background:#131315;border-color:#303035}.dark #projects-page .project .cover-image{background-color:#393939}.dark #projects-page .project .details .tags .tag{background:#232a37}.dark #projects-page .project .details .tags .tag:hover{background:#26395e}.dark #projects-page .project .details .title{color:#a8a7a7}.dark #projects-page .project .details .title:hover{color:darkcyan}.dark #projects-page .project .details p{color:#666}.dark #projects-page .project:hover{border-color:#696c6f}
