.block-container {
    margin-top: 30px;
    padding: 10px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    background-color: var(--odp-white2);
  }
  .block-container .single-block-wrapper {
    width: 25%;
    height: 88px;
    padding: 5px;
  }
  .block-container .single-block-wrapper .single-block {
    display: flex;
    align-items: center;
    height: 100%;
    background-color: var(--odp-white);
  }
  .block-container .single-block-wrapper .single-block.active {
    background-color: var(--odp-yellow2);
  }
  .block-container .single-block-wrapper .single-block:hover {
    color: var(--odp-black2);
    background-color: var(--odp-yellow2);
  }
  .block-container .single-block-wrapper .single-block img {
    transform: scale(0.5);
  }
  .block-container .single-block-wrapper .single-block p {
    padding: 15px;
  }


@media screen and (max-width: 1440px) {
  .block-container {
    margin-top: 30px;
    padding: 10px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    background-color: var(--odp-white2);
  }
  .block-container .single-block-wrapper {
    width: 33.33%;
    height: 88px;
    padding: 5px;
  }
  .block-container .single-block-wrapper .single-block {
    display: flex;
    align-items: center;
    height: 100%;
    background-color: var(--odp-white);
  }
  .block-container .single-block-wrapper .single-block.active {
    background-color: var(--odp-yellow2);
  }
  .block-container .single-block-wrapper .single-block:hover {
    color: var(--odp-black2);
    background-color: var(--odp-yellow2);
  }
  .block-container .single-block-wrapper .single-block img {
    transform: scale(0.5);
  }
}

@media screen and (max-width: 1024px) {
  .block-container {
    margin-top: 30px;
    padding: 10px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    background-color: var(--odp-white2);
  }
  .block-container .single-block-wrapper {
    width: 50%;
    height: 88px;
    padding: 5px;
  }
  .block-container .single-block-wrapper .single-block {
    display: flex;
    align-items: center;
    height: 100%;
    background-color: var(--odp-white);
  }
  .block-container .single-block-wrapper .single-block.active {
    background-color: var(--odp-yellow2);
  }
  .block-container .single-block-wrapper .single-block:hover {
    color: var(--odp-black2);
    background-color: var(--odp-yellow2);
  }
  .block-container .single-block-wrapper .single-block img {
    transform: scale(0.5);
  }
}

@media screen and (max-width: 768px) {
  .block-container {
    margin-top: 30px;
    padding: 10px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    background-color: var(--odp-white2);
  }
  .block-container .single-block-wrapper {
    width: 50%;
    height: 88px;
    padding: 5px;
  }
  .block-container .single-block-wrapper .single-block {
    display: flex;
    align-items: center;
    height: 100%;
    background-color: var(--odp-white);
  }
  .block-container .single-block-wrapper .single-block.active {
    background-color: var(--odp-yellow2);
  }
  .block-container .single-block-wrapper .single-block:hover {
    color: var(--odp-black2);
    background-color: var(--odp-yellow2);
  }
  .block-container .single-block-wrapper .single-block img {
    transform: scale(0.5);
  }
}
@media screen and (max-width: 500px) {
  .block-container .single-block-wrapper {
    width: 100%;
  }
}


  .ee-block-container {
    margin-top: 30px;
    padding: 10px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    background-color: var(--odp-white2);
  }
  .ee-block-container .single-block-wrapper {
    width: 33.33%;
    height: 88px;
    padding: 5px;
  }
  .ee-block-container .single-block-wrapper .single-block {
    display: flex;
    align-items: center;
    height: 100%;
    background-color: var(--odp-white);
  }
  .ee-block-container .single-block-wrapper .single-block:hover {
    color: var(--odp-black2);
    background-color: var(--odp-yellow2);
  }
  .ee-block-container .single-block-wrapper .single-block.active {
    background-color: var(--odp-yellow2);
  }
  .ee-block-container .single-block-wrapper .single-block img {
    transform: scale(0.5);
  }
  .ee-block-container .single-block-wrapper .single-block p {
    padding: 15px;
  }

  
@media screen and (max-width: 1440px) {
  .ee-block-container {
    margin-top: 30px;
    padding: 10px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    background-color: var(--odp-white2);
  }
  .ee-block-container .single-block-wrapper {
    width: 33.33%;
    height: 88px;
    padding: 5px;
  }
  .ee-block-container .single-block-wrapper .single-block {
    display: flex;
    align-items: center;
    height: 100%;
    background-color: var(--odp-white);
  }
  .ee-block-container .single-block-wrapper .single-block.active {
    background-color: var(--odp-yellow2);
  }
  .ee-block-container .single-block-wrapper .single-block:hover {
    color: var(--odp-black2);
    background-color: var(--odp-yellow2);
  }
  .ee-block-container .single-block-wrapper .single-block img {
    transform: scale(0.5);
  }
}

@media screen and (max-width: 1024px) {
  .ee-block-container {
    margin-top: 30px;
    padding: 10px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    background-color: var(--odp-white2);
  }
  .ee-block-container .single-block-wrapper {
    width: 50%;
    height: 88px;
    padding: 5px;
  }
  .ee-block-container .single-block-wrapper .single-block {
    display: flex;
    align-items: center;
    height: 100%;
    background-color: var(--odp-white);
  }
  .ee-block-container .single-block-wrapper .single-block.active {
    background-color: var(--odp-yellow2);
  }
  .ee-block-container .single-block-wrapper .single-block:hover {
    color: var(--odp-black2);
    background-color: var(--odp-yellow2);
  }
  .ee-block-container .single-block-wrapper .single-block img {
    transform: scale(0.5);
  }
}

@media screen and (max-width: 768px) {
  .ee-block-container {
    margin-top: 30px;
    padding: 10px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    background-color: var(--odp-white2);
  }
  .ee-block-container .single-block-wrapper {
    width: 50%;
    height: 88px;
    padding: 5px;
  }
  .ee-block-container .single-block-wrapper .single-block {
    display: flex;
    align-items: center;
    height: 100%;
    background-color: var(--odp-white);
  }
  .ee-block-container .single-block-wrapper .single-block.active {
    background-color: var(--odp-yellow2);
  }
  .ee-block-container .single-block-wrapper .single-block:hover {
    color: var(--odp-black2);
    background-color: var(--odp-yellow2);
  }
  .ee-block-container .single-block-wrapper .single-block img {
    transform: scale(0.5);
  }
}

@media screen and (max-width: 500px) {
  .ee-block-container .single-block-wrapper {
    width: 100%;
  }
}