.elementor-3016 .elementor-element.elementor-element-f522436{--display:flex;--min-height:350px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:40px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3016 .elementor-element.elementor-element-f522436:not(.elementor-motion-effects-element-type-background), .elementor-3016 .elementor-element.elementor-element-f522436 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#E5F1FD;}.elementor-3016 .elementor-element.elementor-element-20b3bc7 > .elementor-widget-container{margin:0px 100px 0px 100px;}.elementor-3016 .elementor-element.elementor-element-20b3bc7{text-align:center;}.elementor-3016 .elementor-element.elementor-element-287738d{--display:flex;--padding-top:30px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3016 .elementor-element.elementor-element-287738d:not(.elementor-motion-effects-element-type-background), .elementor-3016 .elementor-element.elementor-element-287738d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-3016 .elementor-element.elementor-element-ac3f146 > .elementor-widget-container{margin:0px 0px 50px 0px;}.elementor-3016 .elementor-element.elementor-element-6846d19 > .elementor-widget-container{padding:50px 0px 0px 0px;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-3016 .elementor-element.elementor-element-287738d{--content-width:1080px;}}@media(max-width:767px){.elementor-3016 .elementor-element.elementor-element-20b3bc7 > .elementor-widget-container{margin:0px 40px 0px 40px;}}/* Start custom CSS for shortcode, class: .elementor-element-ac3f146 */.tabs {
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap; 
  margin: 20px 20px;
}

.tab {
  padding: 10px 20px;
  cursor: pointer;
  background-color: #f0f0f0;
  border-radius: 8px;
  transition: background-color 0.3s;
  text-align: center;
}

.tab.active {
  background-color: #0070f3;
  color: white;
}

.tab-content {
  display: none;
}

.tab-content.active {
  display: grid;
  grid-template-columns: repeat(2, minmax(250px, 1fr));
  gap: 15px;
}

/* Card styling */
.card {
  display: block;
  border: 1px solid #ddd;
  border-radius: 8px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  background: #eaf1ff;
  transition: transform 0.3s, box-shadow 0.3s;
}

.card img {
  width: 100%;
  height: auto;
  display: block;
}

.card-content {
  padding: 10px;
}

.card-content h3 {
  font-size: 20px;
  margin: 5px 0;
}

.card-content p {
  font-size: 16px;
  color: #555;
}

/* Hover effect for desktop */
@media (hover: hover) {
  .card:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
  }
}

/* Small screens adjustments */
@media (max-width: 640px) {
  .tab-content {
    grid-template-columns: 1fr; /* Single column for small screens */
  }
}
@media (max-width: 640px) {
.tab-content.active {
  display: grid;
  grid-template-columns: repeat(1, minmax(250px, 1fr));
  gap: 15px;
}
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-6846d19 */.tabs {
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap; 
  margin: 20px 20px;
}

.tab {
  padding: 10px 20px;
  cursor: pointer;
  background-color: #f0f0f0;
  border-radius: 8px;
  transition: background-color 0.3s;
  text-align: center;
}

.tab.active {
  background-color: #0070f3;
  color: white;
}

.tab-content {
  display: none;
}

.tab-content.active {
  display: grid;
  grid-template-columns: repeat(2, minmax(250px, 1fr));
  gap: 15px;
}

/* Card styling */
.card {
  display: block;
  border: 1px solid #ddd;
  border-radius: 8px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  background: #eaf1ff;
  transition: transform 0.3s, box-shadow 0.3s;
}

.card img {
  width: 100%;
  height: auto;
  display: block;
}

.card-content {
  padding: 10px;
}

.card-content h3 {
  font-size: 20px;
  margin: 5px 0;
}

.card-content p {
  font-size: 16px;
  color: #555;
}

/* Hover effect for desktop */
@media (hover: hover) {
  .card:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
  }
}

/* Small screens adjustments */
@media (max-width: 640px) {
  .tab-content {
    grid-template-columns: 1fr; /* Single column for small screens */
  }
}
@media (max-width: 640px) {
.tab-content.active {
  display: grid;
  grid-template-columns: repeat(1, minmax(250px, 1fr));
  gap: 15px;
}
}/* End custom CSS */