#section_LogicSeptBlogsBanner_0 {   display: flex;   justify-content: center;   align-items: center;   flex-direction: column;   font-family: "Poppins", sans-serif;   position: relative; }   #section_LogicSeptBlogsBanner_0 .container {     display: flex;     align-items: center;     justify-content: flex-end;     flex-direction: row;     width: calc(100% - 20px);     max-width: 1170px;     position: relative; }   #section_LogicSeptBlogsBanner_0 img {     position: absolute;     object-fit: cover;     object-position: center;     max-width: 1170px;     width: 100%;     height: 100%;     top: 20px; }   #section_LogicSeptBlogsBanner_0 .container .pt1 {     display: flex;     flex-direction: column;     justify-content: flex-start;     align-items: flex-start;     margin-right: 100px;     max-width: 500px;     gap: 20px;     padding-top: 20px;     padding-left: 100px;     width: calc(100% - 40px);     position: relative; }   #section_LogicSeptBlogsBanner_0 .container .pt1::before {     content: '';     position: absolute;     width: 100%;     height: calc(100% + 20px);     top: 10px;     transform: skewX(15deg) translateX(-80px);     box-shadow: #0000003d 0 3px 8px;     background-color: #f6f6f6; }   #section_LogicSeptBlogsBanner_0 .container .pt1 .title {     color: #1a1a1a;     font-size: 36px;     line-height: 40px;     font-family: "Poppins", sans-serif;     max-width: 400px;     padding-top: 20px;     z-index: 1;     margin: 0; }   #section_LogicSeptBlogsBanner_0 .container .pt1 .desc {     font-size: 16px;     line-height: 20px;     color: #1a1a1a;     font-family: "Poppins", sans-serif;     z-index: 1; }   #section_LogicSeptBlogsBanner_0 .container .pt1 .desc > p {     margin: 0; }   @media screen and (max-width: 767px) {     #section_LogicSeptBlogsBanner_0 .container .pt1 {       padding-left: revert;       align-items: center; }     #section_LogicSeptBlogsBanner_0 .container .pt1::before {       width: calc(100% + 100px);       transform: skewX(15deg) translateX(0); }     #section_LogicSeptBlogsBanner_0 .container {       flex-wrap: wrap; }     #section_LogicSeptBlogsBanner_0 .container .pt1 .title {       font-size: 24px;       line-height: 30px;       align-self: flex-start; }     #section_LogicSeptBlogsBanner_0 .container .pt1 .desc {       font-size: 14px;       line-height: 20px; } }  #section_LogicSeptBlogList_1 {   background-color: #fff;   display: flex;   justify-content: center;   align-items: center;   font-family: "Poppins", sans-serif; }   #section_LogicSeptBlogList_1 .container {     display: flex;     flex-direction: column;     justify-content: center;     align-items: center;     width: calc(100% - 20px);     max-width: 1170px;     min-height: 200px;     padding-top: 45px;     padding-bottom: 20px; }   #section_LogicSeptBlogList_1 .container .boxes {     display: flex;     justify-content: space-between;     flex-wrap: wrap;     width: 100%;     margin-top: 30px;     gap: 30px; }   #section_LogicSeptBlogList_1 .container .boxes .box {     display: flex;     flex-direction: row;     align-items: flex-start;     justify-content: space-between;     max-width: 50%;     height: 250px;     overflow: hidden;     background-color: #f7f7f7;     width: calc(50% - 20px);     transition: all .2s ease-in-out;     cursor: auto; }   #section_LogicSeptBlogList_1 .container .boxes .box:hover {     box-shadow: #0000003d 0 3px 8px;     transition: all .2s ease-in-out; }   #section_LogicSeptBlogList_1 .container .boxes .box .image_container {     max-width: 250px;     height: 250px;     position: relative; }   #section_LogicSeptBlogList_1 .container .boxes .box img {     width: 250px;     height: 250px;     display: block;     aspect-ratio: 250 / 250;     object-position: center;     position: absolute;     object-fit: cover; }   #section_LogicSeptBlogList_1 .container .boxes .box .name_container {     display: flex;     flex-direction: column;     justify-content: space-between;     align-items: flex-start;     height: 100%;     box-sizing: border-box;     padding: 10px 20px;     width: 315px;     position: relative; }   #section_LogicSeptBlogList_1 .container .boxes .box .name_container::before {     content: '';     position: absolute;     width: 100%;     height: 100%;     top: 0;     left: 0;     background-color: #f7f7f7;     backdrop-filter: blur(8px);     opacity: 0.6;     z-index: 0; }   #section_LogicSeptBlogList_1 .container .boxes .box .name_container .name {     margin: 0;     font-size: clamp(1rem, 1.8vw, 1.125rem);     line-height: 1.5;     align-self: flex-start;     color: #1a1a1a;     overflow: hidden;     display: -webkit-box;     -webkit-line-clamp: 2;     -webkit-box-orient: vertical;     position: relative;     z-index: 1; }   #section_LogicSeptBlogList_1 .container .boxes .box .name_container .desc {     font-size: clamp(0.875rem, 1.6vw, 1rem);     line-height: 1.6;     color: #1a1a1a;     overflow: hidden;     display: -webkit-box;     -webkit-line-clamp: 4;     -webkit-box-orient: vertical;     position: relative;     z-index: 1; }   #section_LogicSeptBlogList_1 .container .boxes .box .name_container .btn {     background-color: transparent;     color: #1C2D4E;     align-self: flex-end;     border: 1px solid #1C2D4E;     border-radius: 30px;     min-width: 120px;     max-width: 200px;     font-size: clamp(0.875rem, 1.6vw, 1rem);     line-height: 1.6;     padding: 6px 10px;     box-sizing: border-box;     display: flex;     align-items: center;     justify-content: center;     text-decoration: none;     transition: all .3s ease-in-out;     position: relative;     z-index: 1; }   #section_LogicSeptBlogList_1 .container .boxes .box .name_container .btn::before {     content: '';     position: absolute;     top: -5px;     left: -5px;     right: -5px;     bottom: -5px;     z-index: 1; }   #section_LogicSeptBlogList_1 .container .boxes .box .name_container .btn:hover,   #section_LogicSeptBlogList_1 .container .boxes .box .name_container .btn:focus,   #section_LogicSeptBlogList_1 .container .boxes .box .name_container .btn:active {     background-color: #1C2D4E;     color: #f7f7f7;     transition: all .3s ease-in-out; }   #section_LogicSeptBlogList_1 .container .ciriksPagination {     list-style: none;     display: flex;     flex-direction: row;     justify-content: center;     align-items: center;     width: calc(100% - 20px);     position: relative;     padding-top: 20px; }   #section_LogicSeptBlogList_1 .container .ciriksPagination li {     margin: 5px; }   #section_LogicSeptBlogList_1 .container .ciriksPagination li:nth-child(1) {     display: none; }   #section_LogicSeptBlogList_1 .container .ciriksPagination li:nth-child(2) i {     color: #1a1a1a;     opacity: 50%;     font-size: 20px;     font-weight: bold; }   #section_LogicSeptBlogList_1 .container .ciriksPagination li:nth-child(2) i:hover {     color: #1a1a1a;     opacity: 100%; }   #section_LogicSeptBlogList_1 .container .ciriksPagination li:nth-last-child(1) {     display: none; }   #section_LogicSeptBlogList_1 .container .ciriksPagination li:nth-last-child(2) i {     color: #1a1a1a;     opacity: 50%;     font-size: 20px;     font-weight: bold; }   #section_LogicSeptBlogList_1 .container .ciriksPagination li:nth-last-child(2) i:hover {     color: #1a1a1a;     opacity: 100%; }   #section_LogicSeptBlogList_1 .container .ciriksPagination li a {     text-decoration: none;     display: flex;     justify-content: center;     align-items: center;     width: 20px;     height: 20px;     color: #1a1a1a;     font-weight: 100; }   #section_LogicSeptBlogList_1 .container .ciriksPagination > span {     color: #1a1a1a; }   #section_LogicSeptBlogList_1 .container .ciriksPagination li a:hover {     color: #1a1a1a; }   #section_LogicSeptBlogList_1 .container .ciriksPagination li a.active {     background-color: #f5f5f5;     border-radius: 5px;     font-weight: bold; }   #section_LogicSeptBlogList_1 .container .ciriksPagination li a.disable {     opacity: 10%; }   @media only screen and (max-width: 1190px) {     #section_LogicSeptBlogList_1 .container .boxes .box {       max-width: 50%;       width: calc(50% - 15px); } }   @media only screen and (max-width: 767px) {     #section_LogicSeptBlogList_1 .container .boxes .box .name_container {       width: 100%; }     #section_LogicSeptBlogList_1 .container .boxes .box {       max-width: 100%;       width: 100%; }     #section_LogicSeptBlogList_1 .container .boxes .box .image_container {       width: 100%; } }   @media only screen and (max-width: 580px) {     #section_LogicSeptBlogList_1 .container .boxes .box .image_container {       max-width: 100%; }     #section_LogicSeptBlogList_1 .container .boxes .box {       overflow: revert;       height: auto; }     #section_LogicSeptBlogList_1 .container .boxes .box .name_container {       height: revert; }     #section_LogicSeptBlogList_1 .container .boxes .box img {       width: 100%;       height: auto;       max-height: 250px;       position: relative; }     #section_LogicSeptBlogList_1 .container .boxes .box {       flex-direction: column; } } 
