.pageHeadingSection{padding:30px 0}
.pageHeadingSection h1{font-size:32px;line-height:35px}
.pageHeadingSection ul{margin-top:10px;display:flex;flex-direction:column;gap:5px}
.pageHeadingSection ul li{padding-left:20px;display:flex;color:#fff;gap:4px;position:relative}
.pageHeadingSection ul li:before{content:'';margin-top:-5px;position:absolute;top:50%;left:0;width:10px;height:10px;border-radius:10px;border:#fff solid 1px}
.pageHeadingSection ul li strong{color:#fff;font-weight:700;text-decoration:underline;cursor:pointer}
.pageHeadingSection ul li strong:hover{text-decoration:none}
.blogDetailsSection{display:block;position:relative;overflow:clip}
.blogDetailsSection .container{display:flex;gap:20px}
.blogDetailsSection .container .box{width:300px}
.blogDetailsSection .container .box:nth-child(2){width:calc(100% - 620px)}
.blogTableOfContent{display:flex;flex-direction:column;position:sticky;top:85px}
.blogTableOfContent h2{font-size:25px;line-height:30px;color:#2B5BA7;font-weight:600}
.blogTableOfContent ul{margin-top:10px;display:flex;flex-direction:column;gap:15px}
.blogTableOfContent ul li{display:flex;color:#2B5BA7;gap:4px;position:relative}
.blogTableOfContent ul li a{color:#666;text-decoration:underline}
.blogTableOfContent ul li a:hover{text-decoration:none;color:#2B5BA7}
.blogContentBox{display:flex;flex-direction:column}
.blogContentBox h2{margin-top:30px;font-size:25px;line-height:30px;color:#2B5BA7;font-weight:600}
.blogContentBox h3{margin-top:30px;font-size:18px;line-height:22px;color:#2B5BA7;font-weight:600}
.blogContentBox img{margin-bottom:20px}
.blogContentBox p{margin-top:5px}
.blogContentBox p + p{margin-top:15px}
.blogContentBox ul li + li{margin-top:15px}
.blogContentBox a{color:#2B5BA7;text-decoration:underline}
.blogContentBox table{margin-top:10px;border:#d1d1d1 solid 1px;border-collapse:collapse}
.blogContentBox table tr td{padding:2px 10px;border:#d1d1d1 solid 1px}
.blogDetailsBoxForm{border:solid 1px #2d385e1c;border-radius:15px}
.blogDetailsBoxForm h2{padding:15px;background:#2B5BA7;display:flex;gap:20px;border-radius:15px 15px 0 0;flex-direction:column;color:#fff;font-size:20px;font-weight:600}
.blogDetailsBoxForm form{padding:15px;border-radius:0 0 15px 15px;display:flex;flex-wrap:wrap;width:100%;flex-direction:column}
.blogDetailsBoxForm form .form-control{border:solid 1px #2d385e1c}
.blogDetailsBoxForm form .btnBox{margin-top:5px}
.blogDetailsBoxForm form .btnBox .btn{width:100%}
.blogDetailsBoxForm{margin-top:15px;border:solid 1px #2d385e1c;border-radius:15px;position:sticky;top:90px}
.LatestBlogsBox h2{padding:15px;background:#2B5BA7;display:flex;gap:20px;border-radius:15px 15px 0 0;flex-direction:column;color:#fff;font-size:20px;font-weight:600}
.LatestBlogsBox .holder{height:400px;overflow:hidden}
.LatestBlogsBox .holder .mask{margin:15px 0;height:370px;overflow:hidden}
.LatestBlogsBox .holder ul{padding:15px;border-radius:0 0 15px 15px;display:flex;flex-direction:column;gap:10px;list-style:none;position:relative}
.LatestBlogsBox .holder ul li{display:flex;gap:5px}
.LatestBlogsBox .holder ul li a{color:#2B5BA7}
.relatedBlogsSection{display:block;overflow:hidden;background:#F4F6F8}
.relatedBlogsSection h2{color:#2B5BA7}
.relatedBlogsBox{margin-top:20px}
.relatedBlogsSlider{display:flex}
.blogTile{display:flex;flex-direction:column;border-radius:30px;border:solid 1px #2d385e1c;background:#fff;width:350px;height:auto;overflow:hidden}
.blogTile figure{height:230px;overflow:hidden;background:#F4F6F8;border-bottom:#e7e7e7 solid 1px}
.blogTile figure img{width:100%;height:100%;object-fit:cover;transition:.3s}
.blogTile .details{padding:20px;display:flex;flex-direction:column;gap:10px}
.blogTile .details .date{padding:2px 15px 2px 25px;border:#D1D1D1 solid 1px;border-radius:50px;font-size:13px;color:#666;width:fit-content;position:relative}
.blogTile .details .date:after{content:'';margin-top:-7px;position:absolute;top:50%;left:7px;width:14px;height:14px;border-radius:10px;background:#2B5BA7}
.blogTile .details h2{font-size:20px;font-weight:600;color:#2B5BA7;line-height:25px}
.blogTile .details p{color:#666}
.blogTile:hover figure img{transform:scale(1.2) rotate(10deg);transition:.3s}




@media screen and (max-width:1024px) {
.blogDetailsSection .container{flex-wrap:wrap}
.blogDetailsSection .container .box:nth-child(2){width:calc(100% - 320px)}
.blogDetailsSection .container .box:nth-child(3){width:100%}
}
@media screen and (max-width:768px) {
.blogDetailsSection .container .box{width:100%!important}
}
@media screen and (max-width:540px) {
.pageHeadingSection h1{font-size:24px;line-height:32px}
.blogTableOfContent h2,.blogContentBox h2{font-size:20px;line-height:25px}
.blogTile{width:100%;border-radius:15px}
.blogTile figure{height:185px}
}