.wp-block-getwid-section__wrapper {
	padding: 0 !important;
}

.flip-card-front, .flip-card-back {
	padding: 18px 8px !important;
}

:where(.wp-block-columns.is-layout-flex) {
  	gap: var(--gap-12);
}

.wp-block-getwid-section, .flip-card {
	width: 180px !important;
    height: 180px !important;
	display: flex !important;
    flex-direction: column;
	align-items: center;
  	justify-content: center;
}

.flip-card {
	margin: 0 auto;
  	perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

.flip-card-inner, .flip-card-back, .wp-block-getwid-section {
	border-radius: var(--border-radius-24);
}

.flip-card-inner {
  	position: relative;
  	width: 100%;
  	height: 100%;
  	text-align: center;
  	transition: transform 0.8s;
  	transform-style: preserve-3d;
  	box-shadow: var(--box-shadow-little-cards);
	background: var(--white-color);
}

.flip-card:hover .flip-card-inner {
  	transform: rotateY(180deg);
  	cursor: pointer;
}

.flip-card-front, .flip-card-back {
  	position: absolute;
  	width: 100%;
  	height: 100%;
  	-webkit-backface-visibility: hidden; /* Safari */
  	backface-visibility: hidden;
  	display: flex;
  	flex-direction: column;
  	align-items: center;
  	justify-content: start;
}

.flip-card-back {
	justify-content: center;
	background: transparent linear-gradient(180deg, var(--blue-button) 0%, var(--green-of-gradient-card) 100%) 0% 0% no-repeat padding-box;
	transform: rotateY(180deg);
	width: -webkit-fill-available;
}

.flip-card-front {
  	width: 100%;
	gap: var(--gap-4);
}

.wp-block-getwid-section {
	background-color: var(--white-color) !important;
    border: 1px solid var(--gray-for-white-background-card-border) !important;
    box-shadow: var(--box-shadow-little-cards) !important;
}

.wp-block-getwid-section:hover, .card-information:hover {
	cursor: pointer;
	color: var(--white-color) !important;
    border: 1px solid var(--blue-border) !important;
    background: transparent linear-gradient(180deg, #2C71AF 0%, #13AAB8 100%) 0% 0% no-repeat padding-box;
}

.card-information:hover p {
	color: var(--white-color) !important;
}

.wp-block-getwid-section h2, .flip-card-front h2 {
	font-size: var(--font-size-16) !important;
	color: var(--text-color) !important;
	padding: 0 !important;
	font-weight: var(--font-weight-600);
}

.flip-card-front h2 {
	font-size: var(--font-size-14) !important;
	line-height: var(--line-spacing-18) !important;
}

.flip-card-back p {
  	font-size: var(--font-size-12);
  	line-height: var(--line-spacing-16);
  	color: var(--white-color);
  	margin: 0;
  	font-weight: var(--font-weight-600);
}

.wp-block-getwid-section p {
	display: none;
	font-size: var(--font-size-12) !important;
	font-weight: var(--font-weight-500);
	color: var(--white-color) !important;
	margin-bottom: 0 !important;
	line-height: var(--line-spacing-16);
}

.wp-block-getwid-section:hover h2 {
	display: none;	
}

.wp-block-getwid-section:hover p {
	display: block;	
}

.wp-block-getwid-section figure {
	width: 70px !important;
    height: 70px !important;
}

.flip-card-front img {
	width: auto !important;
    height: 85px !important;
}

.wp-block-getwid-section__inner-wrapper {
    max-width: 100% !important;
	width: 100% !important;
}

.wp-block-getwid-section__content {
	padding: 14px;
}

.wp-block-getwid-section img {
    height: auto !important;
}

.wp-block-getwid-section:has(#satelite-logo):hover img, .wp-block-getwid-section:has(#satelite-logo):focus img  {
    content: url(https://data.inpe.br/big/web/wp-content/uploads/2024/05/satelite-hover.png);
}

.wp-block-getwid-section:has(#clima-logo):hover img, .wp-block-getwid-section:has(#clima-logo):focus img {
    content: url(https://data.inpe.br/big/web/wp-content/uploads/2024/05/tempo-e-clima-hover.png);
}

.wp-block-getwid-section:has(#desastre-logo):hover img, .wp-block-getwid-section:has(#desastre-logo):focus img {
    content: url(https://data.inpe.br/big/web/wp-content/uploads/2024/05/casa-alagada-da-daiene-hover.png);
}

.wp-block-getwid-section:has(#queimadas-logo):hover img, .wp-block-getwid-section:has(#queimadas-logo):focus img {
    content: url(https://data.inpe.br/big/web/wp-content/uploads/2024/05/queimadas-hover.png);
}

.wp-block-getwid-section:has(#usoECobertura-logo):hover img, .wp-block-getwid-section:has(#usoECobertura-logo):focus img {
    content: url(https://data.inpe.br/big/web/wp-content/uploads/2024/05/uso-cobertura-hover.png);
}

.wp-block-getwid-section:has(#aplicacoes-logo):hover img, .wp-block-getwid-section:has(#aplicacoes-logo):focus img {
    content: url(https://data.inpe.br/big/web/wp-content/uploads/2024/05/aplicacoes-hover.png);
}

@media (max-width: 768px) {
	.wp-block-getwid-section p {
		margin: 0px !important;
		margin-bottom: 0px !important;
	}
}

@media (min-width: 768px) {
	.wp-block-getwid-section figure {
		margin-bottom: 10px !important;
	}
}

@media (min-width: 1740px) {
    .wp-block-getwid-section__inner-wrapper {
        width: 155px;
    }
    
    .wp-block-getwid-section {
        flex-direction: row;
    }
}