.blogPage{display:flex;gap:36px;padding:40px 33px 80px 40px;overflow:hidden;position:relative;background:#f1f1f1;z-index:0}.blogPage .blogMain .bc{padding:0 50px 0 48px}.blogPage .blogMain .bc .countCon{width:22%;display:flex;justify-content:end;position:relative}.blogPage .blogMain .bc .countCon .count{display:flex;align-items:center;width:-moz-fit-content;width:fit-content;padding:0 25px 0 10px;height:35px;border-radius:9px;background-image:linear-gradient(#ffba00,#ff8300)}.blogPage .blogMain .bc .countCon .count .span{font-size:13px;font-weight:600;color:#fff}.blogPage .blogMain .bc .gear{position:absolute;right:-52px;top:-4px}.blogPage .blogMain .allPosts{display:flex;flex-direction:column;padding:40px 0 30px;gap:35px}.blogPage .blogMain .allPosts .post{width:100%;position:relative;overflow:hidden;border-radius:20px 20px 10px 10px;box-shadow:0 0 15px 4px rgba(0,0,0,.3)}.blogPage .blogMain .allPosts .post .head{position:relative;background-image:linear-gradient(181deg,#44eaff,#23a6ff);height:107px;display:flex;align-items:center;overflow:hidden}.blogPage .blogMain .allPosts .post .head .bgBox{position:absolute;top:0;right:0;height:100%;mix-blend-mode:overlay}.blogPage .blogMain .allPosts .post .head .h1{font-size:38px;font-weight:600;color:#fff;padding-left:33px;position:relative;text-decoration:none}.blogPage .blogMain .allPosts .post .head .h1:hover{text-decoration:underline}.blogPage .blogMain .allPosts .post .head .topL{top:1px;right:12px;width:75%;height:6px;opacity:50%;border-radius:40%}.blogPage .blogMain .allPosts .post .metaCont{display:flex;align-items:center;justify-content:space-between;padding:16px 37px 16px 32px;position:relative;background:#f1f1f1;border-bottom:1px solid #c8c8c8;box-shadow:0 0 2px rgba(0,0,0,.3);z-index:1}.blogPage .blogMain .allPosts .post .metaCont .meta{display:flex;align-items:center;gap:8px;position:relative}.blogPage .blogMain .allPosts .post .metaCont .meta .icon{position:relative;z-index:1}.blogPage .blogMain .allPosts .post .metaCont .meta .link{font-size:18px;font-weight:600;color:#0eb7ff;text-decoration:none}.blogPage .blogMain .allPosts .post .metaCont .meta .link:hover{text-decoration:underline;transition:.3s}.blogPage .blogMain .allPosts .post .postCont{display:flex;flex-direction:column;padding:25px 32px 30px;gap:35px;position:relative;background:#fff}.blogPage .blogMain .allPosts .post .postCont .contA{display:block;position:relative}.blogPage .blogMain .allPosts .post .postCont .contA figure a picture .mainImg{display:flex;float:left;border:5px solid #fff;box-shadow:0 0 20px 0 rgba(0,0,0,.3);margin-right:23px}.blogPage .blogMain .allPosts .post .postCont .contA .desc{display:block;font-size:19px;color:#000;line-height:36px;letter-spacing:.3px;word-spacing:.3px;text-align:justify;margin-top:-6px}.blogPage .blogMain .allPosts .post .postCont .contB{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:10}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon{display:flex;align-items:center;position:relative;background-image:linear-gradient(#3b3b3a,#1f1f1d);height:-moz-fit-content;height:fit-content;width:-moz-fit-content;width:fit-content;max-width:calc(100% - 250px);border-radius:100px 0 0;padding:6px 6px 6px 54px;-moz-column-gap:8px;column-gap:8px;flex-wrap:wrap;row-gap:3px}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon::after{content:"";position:absolute;width:12px;height:100%;top:0;right:-12px;background-image:url(https://images.theengineeringprojects.com/image/theme/main/2025/06/blog-tags-after.png);background-size:100% 100%;background-repeat:no-repeat}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon .tagsMain{position:absolute;left:-45px;top:-12px}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon .topL{width:calc(100% - 90px);height:5px;left:45px;top:0}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon .tag{font-size:15px;font-weight:600;color:#fff;text-decoration:none;position:relative}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon .tag:hover{text-decoration:underline}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon .dot{width:3px;height:3px;background:#fff;border-radius:100%;position:relative;top:1px}.blogPage .blogMain .allPosts .post .postCont .contB .postButton{font-size:16px;font-weight:600;color:#fff;text-decoration:none;background-image:linear-gradient(#44eaff,#23a6ff);border-radius:5px;height:40px;width:154px;display:flex;align-items:center;justify-content:center;position:relative;box-shadow:0 3px 2px 1px rgba(0,0,0,.3)}.blogPage .blogMain .allPosts .post .postCont .contB .postButton:hover{box-shadow:0 4px 3px 1px rgba(0,0,0,.3);transition:.3s}.blogPage .blogMain .allPosts .post .postCont .contB .postButton:active{font-size:17px;box-shadow:0 3px 2px 1px rgba(0,0,0,.3)}.blogPage .blogMain .pageChng{display:flex;align-items:center;justify-content:center}.blogPage .blogMain .pageChng .ul{display:flex;align-items:center;gap:15px}.blogPage .blogMain .pageChng .ul .btn{display:flex;align-items:center;justify-content:center;width:127px;height:41px;border-radius:7px;background-image:linear-gradient(#ffba00,#ff8300);box-shadow:0 0 3px rgba(0,0,0,.2);list-style:none}.blogPage .blogMain .pageChng .ul .btn .link{display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;color:#fff;gap:12px;text-decoration:none;height:100%;width:100%}.blogPage .blogMain .pageChng .ul .btn .link:active{font-size:19px;transition:.3s}.blogPage .blogMain .pageChng .ul .btn .link .icon{position:relative}.blogPage .blogMain .pageChng .ul .prevBtn{margin-right:45px}.blogPage .blogMain .pageChng .ul .prevBtn:hover{box-shadow:-2px 2px 4px rgba(0,0,0,.3);transition:.3s}.blogPage .blogMain .pageChng .ul .nextBtn{margin-left:45px}.blogPage .blogMain .pageChng .ul .nextBtn:hover{box-shadow:2px 2px 4px rgba(0,0,0,.3);transition:.3s}.blogPage .blogMain .pageChng .ul .number{list-style:none}.blogPage .blogMain .pageChng .ul .number .numLink{font-size:20px;font-weight:700;color:#000;text-decoration:none;width:41px;height:41px;display:flex;align-items:center;justify-content:center}.blogPage .blogMain .pageChng .ul .number .numLink:hover{font-size:24px;color:#fff;background-image:linear-gradient(#ffba00,#ff8300);border-radius:100%;box-shadow:0 0 3px rgba(0,0,0,.2);transition:.3s}.blogPage .blogMain .pageChng .ul .number .numLink.active{font-size:24px;color:#fff;background-image:linear-gradient(#ffba00,#ff8300);border-radius:100%;box-shadow:0 0 3px rgba(0,0,0,.2)}.blogPage .blogMain .pageChng .ul .dot3{font-size:20px;font-weight:700;cursor:context-menu}.blogPage .blogMain .pageChng .ul .numRemove{display:none}@media (max-width:1750px){.blogPage{gap:30px!important;padding:30px 20px 60px!important}.blogPage .blogMain .allPosts{padding:35px 0 25px;gap:30px}.blogPage .blogMain .allPosts .post .head{height:90px}.blogPage .blogMain .allPosts .post .head .h1{font-size:30px;padding-left:28px}.blogPage .blogMain .allPosts .post .metaCont{padding:10px 30px 10px 20px}.blogPage .blogMain .allPosts .post .metaCont .meta{gap:5px}.blogPage .blogMain .allPosts .post .metaCont .meta .icon{width:25px}.blogPage .blogMain .allPosts .post .metaCont .meta .link{font-size:17px}.blogPage .blogMain .allPosts .post .postCont{padding:22px 25px 25px;gap:25px}.blogPage .blogMain .allPosts .post .postCont .contA figure a picture .mainImg{margin-right:16px}.blogPage .blogMain .allPosts .post .postCont .contA .desc{font-size:18px;line-height:32px;word-spacing:.3px}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon{padding:5px 4px 5px 46px}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon .tagsMain{left:-40px;top:-11px;width:105px}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon .tag{font-size:14px}.blogPage .blogMain .allPosts .post .postCont .contB .postButton{font-size:17px;height:44px;width:140px}.blogPage .blogMain .allPosts .post .postCont .contB .postButton:active{font-size:18px}.blogPage .blogMain .pageChng .ul{gap:12px}.blogPage .blogMain .pageChng .ul .btn{width:115px;height:40px}.blogPage .blogMain .pageChng .ul .btn .link{font-size:17px;gap:8px}.blogPage .blogMain .pageChng .ul .btn .link:active{font-size:18px}.blogPage .blogMain .pageChng .ul .btn .link .icon{width:16px}.blogPage .blogMain .pageChng .ul .prevBtn{margin-right:35px}.blogPage .blogMain .pageChng .ul .nextBtn{margin-left:35px}.blogPage .blogMain .pageChng .ul .number .numLink{font-size:19px;width:40px;height:40px}.blogPage .blogMain .pageChng .ul .number .numLink:hover{font-size:23px}.blogPage .blogMain .pageChng .ul .number .numLink.active{font-size:23px}.blogPage .blogMain .pageChng .ul .dot3{font-size:19px}}@media (max-width:1200px){.blogPage{gap:40px!important;padding:30px 20px 50px!important;flex-direction:column}.blogPage .blogMain{width:100%}.blogPage .blogMain .allPosts{padding:30px 0 40px;gap:28px}.blogPage .blogMain .allPosts .post .head{height:75px}.blogPage .blogMain .allPosts .post .head .h1{font-size:26px}.blogPage .blogMain .allPosts .post .metaCont{padding:9px 20px 9px 12px}.blogPage .blogMain .allPosts .post .metaCont .meta .icon{width:24px}.blogPage .blogMain .allPosts .post .metaCont .meta .link{font-size:16px}.blogPage .blogMain .allPosts .post .postCont{padding:24px 16px 16px 20px;gap:22px}.blogPage .blogMain .allPosts .post .postCont .contA{display:block;position:relative}.blogPage .blogMain .allPosts .post .postCont .contA .desc{font-size:17px}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon{padding:5px 2px 4px 64px}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon .tagsMain{left:-68px;top:-17px;width:165px}.blogPage .blogMain .allPosts .post .postCont .contB .postButton{font-size:16px;width:125px}.blogPage .blogMain .allPosts .post .postCont .contB .postButton:active{font-size:17px}.blogPage .blogMain .pageChng .ul{gap:10px}.blogPage .blogMain .pageChng .ul .btn{width:90px;height:34px}.blogPage .blogMain .pageChng .ul .btn .link{font-size:16px}.blogPage .blogMain .pageChng .ul .btn .link:active{font-size:17px}.blogPage .blogMain .pageChng .ul .btn .link .icon{width:14px}.blogPage .blogMain .pageChng .ul .prevBtn{margin-right:25px}.blogPage .blogMain .pageChng .ul .nextBtn{margin-left:25px}.blogPage .blogMain .pageChng .ul .number .numLink{font-size:18px;width:34px;height:34px}.blogPage .blogMain .pageChng .ul .number .numLink:hover{font-size:20px}.blogPage .blogMain .pageChng .ul .number .numLink.active{font-size:20px}.blogPage .blogMain .pageChng .ul .dot3{font-size:18px}}@media (max-width:786px){.blogPage .blogMain .bc .countCon{width:100%}.blogPage .blogMain .allPosts{padding:30px 0 40px;gap:25px}.blogPage .blogMain .allPosts .post .head{height:65px}.blogPage .blogMain .allPosts .post .head .h1{font-size:24px;padding-left:20px}.blogPage .blogMain .allPosts .post .head .topL{height:2px}.blogPage .blogMain .allPosts .post .metaCont{padding:9px 10px;justify-content:space-around;flex-wrap:wrap;-moz-column-gap:10px;column-gap:10px;row-gap:4px}.blogPage .blogMain .allPosts .post .metaCont .meta{gap:3px}.blogPage .blogMain .allPosts .post .metaCont .meta .icon{width:20px}.blogPage .blogMain .allPosts .post .metaCont .meta .link{font-size:15px}.blogPage .blogMain .allPosts .post .postCont{padding:20px 12px 16px 16px;gap:20px}.blogPage .blogMain .allPosts .post .postCont .contA .desc{font-size:16px;letter-spacing:.4px;word-spacing:.2px}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon{padding:5px 2px 5px 64px;-moz-column-gap:6px;column-gap:6px;row-gap:2px}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon .tag{font-size:13px}.blogPage .blogMain .allPosts .post .postCont .contB .postButton{font-size:15px;width:110px;height:36px;border-radius:8px}.blogPage .blogMain .allPosts .post .postCont .contB .postButton:active{font-size:16px}.blogPage .blogMain .allPosts .post10,.blogPage .blogMain .allPosts .post11,.blogPage .blogMain .allPosts .post9{display:none}.blogPage .blogMain .pageChng .ul{gap:8px}.blogPage .blogMain .pageChng .ul .btn{width:85px}.blogPage .blogMain .pageChng .ul .btn .link{font-size:15px}.blogPage .blogMain .pageChng .ul .btn .link:active{font-size:16px}.blogPage .blogMain .pageChng .ul .btn .link .icon{width:12px}.blogPage .blogMain .pageChng .ul .prevBtn{margin-right:20px}.blogPage .blogMain .pageChng .ul .nextBtn{margin-left:20px}.blogPage .blogMain .pageChng .ul .number .numLink{font-size:17px;width:32px;height:32px}.blogPage .blogMain .pageChng .ul .number .numLink:hover{font-size:19px}.blogPage .blogMain .pageChng .ul .number .numLink.active{font-size:19px}.blogPage .blogMain .pageChng .ul .dot3{font-size:17px}}@media (max-width:600px){.blogPage{padding:12px 14px 20px!important;gap:20px!important}.blogPage .blogMain .bc{padding:0 0 0 13px}.blogPage .blogMain .bc .countCon .count{height:31px;padding:0 26px 0 10px}.blogPage .blogMain .bc .countCon .count .span{font-size:11px}.blogPage .blogMain .bc .gear{display:none}.blogPage .blogMain .allPosts{padding:20px 0 24px;gap:16px}.blogPage .blogMain .allPosts .post{border-radius:12px}.blogPage .blogMain .allPosts .post .head .h1{font-size:18px;line-height:22px;padding:0 10px}.blogPage .blogMain .allPosts .post .metaCont{padding:4px 6px;-moz-column-gap:6px;column-gap:6px}.blogPage .blogMain .allPosts .post .metaCont .meta{gap:3px}.blogPage .blogMain .allPosts .post .metaCont .meta .icon{width:16px}.blogPage .blogMain .allPosts .post .metaCont .meta .link{font-size:13px}.blogPage .blogMain .allPosts .post .postCont{padding:10px;gap:8px}.blogPage .blogMain .allPosts .post .postCont .contA figure a picture .mainImg{width:calc(100% - 16px);height:100%;border:3px solid #fff;margin:2px 5px 10px}.blogPage .blogMain .allPosts .post .postCont .contA .desc{font-size:14px;line-height:22px;padding:0 5px;letter-spacing:0;word-spacing:0}.blogPage .blogMain .allPosts .post .postCont .contB{flex-direction:column;gap:6px}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon{border-radius:7px;margin:0 auto;justify-content:center;max-width:94%;padding:6px 8px;-moz-column-gap:6px;column-gap:6px}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon .tagsMain{display:none}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon::after{display:none}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon .topL{height:3px}.blogPage .blogMain .allPosts .post .postCont .contB .tagsCon .tag{font-size:12px}.blogPage .blogMain .allPosts .post .postCont .contB .postButton{font-size:13px;height:36px;width:60%}.blogPage .blogMain .allPosts .post .postCont .contB .postButton:active{font-size:14px}.blogPage .blogMain .pageChng .ul{gap:3px}.blogPage .blogMain .pageChng .ul .btn{width:50px;height:26px}.blogPage .blogMain .pageChng .ul .btn .link{font-size:12px;gap:3px}.blogPage .blogMain .pageChng .ul .btn .link .icon{width:8px}.blogPage .blogMain .pageChng .ul .prevBtn{margin-right:5px}.blogPage .blogMain .pageChng .ul .nextBtn{margin-left:5px}.blogPage .blogMain .pageChng .ul .number .numLink{font-size:14px;width:24px;height:24px}.blogPage .blogMain .pageChng .ul .number .numLink:hover{font-size:15px}.blogPage .blogMain .pageChng .ul .number .numLink.active{font-size:15px}.blogPage .blogMain .pageChng .ul .dot3{font-size:14px}}