@import url(globle.css);

.list-wrapper {
  padding: 52px 40px 0 40px;
  border-radius: 10px;
  margin-bottom: 20px;
  width: 100%;
}
.list-wrapper .image {
  height: 100%;
  height: 550px;
}
.list-wrapper .image::after {
  content: none;
}
.list-wrapper .image img {
  height: 100%;
  border-radius: 10px 10px 0 0;
}
.case_list_wrap .right-wrap {
  padding: 0px;
  padding-bottom: 52px;
}
.list-wrapper .title a {
  font-size: 33px;
  font-weight: 700;
  text-decoration: none;
  color: var(--text-color-white);
  display: block;
  margin: 20px 0 10px;
}
.list-wrapper .product-sub-title p {
  font-size: 20px;
  color: var(--text-color-white);
  font-weight: 500;
  margin-top: 10px;
  margin-bottom: 30px;
  line-height: 1.3em;
}
.description p,
.list-wrapper ul li {
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 30px;
  color: var(--text-color-white);
}
.list-wrapper ul {
  padding: 0;
}
.list-wrapper ul li {
  line-height: 1.6em;
  margin-bottom: 15px;
  list-style: none;
}
.list-wrapper ul li i {
  font-size: 15px;
  color: var(--primary-color);
  background-color: #fff;
  padding: 5px 8px;
  border-radius: 30px;
  margin-right: 5px;
}
.list-1 {
  background-color: rgb(243, 255, 255);
}
.list-2 {
  background-color: rgb(255, 252, 228);
}
.list-3 {
  background-color: rgb(228, 239, 255);
}
.list-4 {
  background-color: rgb(249, 236, 255);
}
.list-5 {
  background-color: rgb(255, 248, 236);
}
.techno-wrap {
  margin-top: 0px;
  margin-bottom: 0px;
}
.casestudy_layout .description {
  color: var(--text-color-white);
}
.techno-wrap ul li {
  margin: 0;

  font-size: var(--font-sm);
  padding: 10px 15px;
  border-radius: 30px;
  font-weight: 500;
  line-height: 11px;
  text-transform: capitalize;
}
.techno-wrap .tech-1 {
  background-color: #ffebe4;

  color: #f33c00;
}
.techno-wrap .tech-2 {
  background-color: #d1eeff;

  color: #0071b4;
}
.techno-wrap .tech-3 {
  background-color: #e3f5ff;

  color: #00c9f7;
}
.techno-wrap .tech-4 {
  background-color: #dedfff;

  color: #7375af;
}
.highlights {
  margin-bottom: 40px;
}

.shuffle-filter {
  margin: 0 auto;
  background: transparent;
  border-radius: 5px;
  width: max-content;
  padding: 6px;
  border: 1px solid var(--border-color-1);
}
.shuffle-filter li {
  display: inline-block;
  padding: 10px;
  cursor: pointer;
}
.selected {
  text-decoration: underline;
}

/*======================*/
/* ul shuffle-container*/
.shuffle-container {
  max-width: 100%;
  width: 1200px;
  margin: 0 auto;
  padding: 0;
}
.card-wrapper.shuffle-item {
  box-shadow: none;
  border-radius: 10px;
}
.case-study .image {
  height: 270px;
  position: relative;
}
.shuffle-filter div {
  border-radius: 5;
  padding: 5px 15px;
  transition: all 0.5s ease;
  font-weight: 600;
  margin-right: 5px;
  font-size: 15px;
}
.selected,
.shuffle-filter div:hover {
  text-decoration: none;
  color: var(--heading-color);
  background: var(--bg-color-1);
}
.shuffle-filter div {
  cursor: pointer;
  border-radius: 5px;
}