.custom-container{ width: 96%; max-width: 1700px; }
.toggle-blog-links{ height: 35px; width: 70px; position: absolute; bottom:0; left: 50%; transform: translateX(-50%); background: rgba(255,234,0,0.9); border-radius: 70px 70px 0 0; border: 0; outline: none; box-shadow: none; }
.toggle-blog-links:hover{ background: rgba(255,234,0,1); }
.toggle-blog-links::before{ content: ""; display: inline-block; height: 12px; width: 20px; background: url('../../../../../uploads/2023/10/arrow-up.webp') no-repeat; background-position: bottom  center; background-size: contain; transition: all 0.5s ease-in-out; margin-top: 12px; }
.toggle-blog-links.active::before{ transform: rotateX(180deg); }
.blog-links-wrapper .links-list { list-style-type: none; display: flex; align-items: flex-start; justify-content: flex-start; column-gap: 25px; row-gap: 10px; flex-wrap: wrap; height: 100%; max-height: 175px; overflow: hidden; margin-bottom: 0; transition: all 0.5s ease-in-out; }
.blog-links-wrapper .links-list.expanded {max-height: 1000px; }
.links-list li { width: 100%; max-width: calc(20% - 20px); font-size: 16px; }
.links-list li a{ color: #fff; border-bottom: 1px solid transparent; padding-bottom: 1px; position: relative; }
.links-list li a:hover{ color: #ffea05; border-color: #ffea05; }
.links-list li a::after{ content: ""; height: 12px; width: 20px; background: url('../../../../../uploads/2023/10/right-long-arrow.webp') no-repeat; background-position: center; background-size: contain; position: absolute; top: 50%; transform: translateY(-50%); opacity: 0; right: 0; }
.links-list li a:hover::after{ animation: arrow-move 0.5s ease-in-out both; }
@keyframes arrow-move { 0% { right: -15px; opacity: 0; } 100% { right: -25px; opacity: 1; }}
@media only screen and (max-width: 1300px){ 
.links-list li{ font-size: 14px; min-height: 26px; } }
@media only screen and (max-width: 991px){
.custom-container{ width: 100%; }
.blog-links-wrapper .links-list { column-gap: 0; }
.links-list li { max-width: 25%; padding-right: 15px; }
.links-list li a::after{ display: none; } }
@media only screen and (max-width: 768px){    
.links-list li { max-width: calc(100%/3); } }  
@media only screen and (max-width: 575px){
.blog-links-wrapper .links-list{ max-height: 300px; row-gap: 5px; }
.links-list li { max-width: 50%; min-height: unset; } }
@media only screen and (max-width: 375px){
.blog-links-wrapper .links-list{ max-height: 290px; }
.links-list li{ padding-right: 10px; font-size: 13px; } }