.sticky-search { position: fixed; top: 0; width: 100%; } .search-body.sticky-search { top: 82px; background: #F5FAFF; z-index: 1; padding: 38px 0; max-height: 128px; height: 100%; } .highlight { background-color: yellow } .noResultFound { text-align: center; margin: 20px 0; } .noResultFound { text-align: center; margin: 20px 0; } .noResultFound h1 { font-style: normal; font-weight: 700; font-size: 38px; line-height: 48px; /* identical to box height */ color: #01305C; margin: 27px 0 6px } .noResultFound p { font-style: normal; font-weight: 450; font-size: 20px; line-height: 25px; color: #575E62; } header.mpw-navbar.fixed-header { transform: translateY(0px); } .seoContentCard { margin-bottom: 40px; padding: 40px 30px 20px; border: 1px solid #c8d9ee; border-radius: 20px; } .seoContentCard h2{ padding-top: 20px; color: #01305C; font-size: 30px; line-height: 36px; text-transform: capitalize; font-weight: 700; padding-bottom: 15px; } .seoContentCard p, .seoContentCard li { font-weight: 450; color: #575E62; font-size: 17px; line-height: 28px; padding-bottom: 15px; } .blogTitle{ background-color: #F5FAFF; padding:118px 0 50px; margin-bottom: 25px; } .titlePara{ margin-bottom: 45px; } .searchWraper{ position: relative; max-width: 480px; width:100%; margin: 0 auto; } .searchControl{ width:100%; height: 52px; background-color: white; border-radius:8rem; color: #231F20; margin: 0 auto; position: relative; box-shadow: 0px 2.62226px 30.156px rgba(118, 133, 160, 0.15); border: 1px solid #fff; font-style: normal; font-weight: 400; font-size: 15px; line-height: 19px; padding: 0 45px 0px 20px; transition: all ease .1s; } .searchControl:hover{ border-color: #212121; } .searchControl::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color: #B0B0B0; opacity: 1; /* Firefox */ } .searchControl:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #B0B0B0; } .searchControl::-ms-input-placeholder { /* Microsoft Edge */ color: #B0B0B0; } .searchIcon{ position:absolute; right: 10px; top: 50%; transform: translateY(-50%); display: flex; } input.searchControl:focus-visible, input.searchControl:focus { border: 1px solid #05ada3!important; outline: unset; } .blogTitle h1{ color: #01305C; font-size: 38px; line-height: 48px; text-transform: capitalize; text-align: center; font-weight: 700; padding-bottom: 19px; } .des-head { text-align: center; font-size: 18px; line-height: 30px; color: #575E62; max-width: 90%; width: 100%; margin: 0 auto; font-weight: 400; } .blogTitle h1 span { border-bottom: 2px solid #00aeee; } .blogtop { display: block; text-align: center; padding: 10px 0 50px; } .blogPage{ padding: 0px 0; } a.newlogOutBtn { color: #000; border-color: #000; } .blogSearch input{ width: 260px; height: 42px; border: 1.5px solid #DADCE0; border-radius: 3px; background: #fff; padding: 10px 5px 10px 15px; font-size: 16px; color: #202124; } .blogList { display: flex; flex-wrap: wrap; column-gap: 20px; } .blog { flex-basis: 32%; width: 100%; overflow: hidden; max-height: 310px; margin-bottom: 50px; display: flex; flex-direction: column; justify-content: flex-start; box-shadow: 0 4px 34px 0 rgb(0 0 0 / 8%); border-radius: 5px; transition: all ease .1s; } .blog:hover{ transform: scale(1.02); } .blogImg { max-height: 270px; overflow: hidden; margin-bottom: 5px; } .blogName { padding: 10px; } .blogName h2 { font-size: 20px; min-height: 44px; } .blogName h2 a{ color: #00305c; } .blogName h2 a:hover{ text-decoration: underline; } .blogImg img { object-fit: contain; max-width: 374px; width: 100%; max-height: 211px; height: 100%; } .lazyImg { display: none; } .skeleton { background-size: 200px 100%; background-repeat: no-repeat; line-height: 1; width: 100%; height: inherit; animation: SkeletonLoading 1s ease-in-out infinite; background-color: #f3f3f3; background-image: linear-gradient(90deg, #f3f3f3, #ededee, #f3f3f3); } @keyframes SkeletonLoading { 0% { background-position: -200px 0; } to { background-position: calc(200px + 100%) 0; } } @media (max-width:767px) { .blog{ flex-basis: 48%; } .seoContentCard{ max-height: 600px; overflow-y: scroll; } .seoContentCard::-webkit-scrollbar { width: 5px; max-height: 5px } .seoContentCard::-webkit-scrollbar-track { background: #e5e5e5 } .seoContentCard::-webkit-scrollbar-thumb { background: #013E76; border-radius: 4px } } @media (max-width:500px) { .blog{ flex-basis: 99%; } .searchControl { height: 42px; } .noResultFound h1 { font-size: 22px; line-height: 34px; margin: 9px 0 5px; } .noResultFound p { font-size: 16px; line-height: 18px; } .noResultFound img { max-width: 255px; width: 100%; } .search-body.sticky-search { top: 60px; background: #F5FAFF; z-index: 1; padding: 25px 0; max-height: 94px; height: 100%; } .searchIcon svg{ width: 24px; height: 24px; } .blogTitle h1{ font-weight: 700; font-size: 20px; line-height: 32px; } .des-head { font-size: 12px; line-height: 150%; padding-bottom: 10px; } .searchWraper { max-width: 330px; } .blogTitle { padding: 118px 0 25px; } .titlePara { margin-bottom: 15px; } } @media (max-width:413px) { }