
.pp-logo-grid {
	position: relative;
}

.pp-logo-grid .pp-logo-wrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	-webkit-transition: all .25s linear 0s;
	transition: all .25s linear 0s;
	width: 100%;
}

.pp-logo-grid .pp-logo-wrap a img {
	vertical-align: middle;
}

.pp-logo-grid .elementor-grid-item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	float: left;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	text-align: center;
	-webkit-transition: background .2s cubic-bezier(.645, .045, .355, 1);
	transition: background .2s cubic-bezier(.645, .045, .355, 1);
}

.pp-logo-grid .pp-logo-title {
	margin-bottom: 0;
}

.pp-logo-grid .pp-logo-title a {
	color: inherit;
}

.pp-logo-grid.grayscale-normal img {
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
}

.pp-logo-grid.grayscale-normal .pp-logo-wrap:hover img {
	-webkit-filter: none;
	filter: none;
}

.pp-logo-grid.grayscale-hover .pp-logo-wrap:hover img {
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
}

.cwia-content {
	flex-wrap: wrap;
	display: flex;
}

.cwia-items {
	border: 1px solid rgba(217, 222, 237, .08);
	background-color: rgba(217, 222, 237, .08);
	width: calc(55% - 20px);
	border-radius: 24px;
	margin-bottom: 20px;
	cursor: pointer;
	padding: 30px;
	color: #fff;
	transition: all .3s ease;
}

/* Improve focus visibility + allow card to receive focus (given tabindex="0" in HTML) */
.cwia-items:hover, .cwia-items.active {
	border-color: #1a56db;
	color: #d1d5db;
	outline: none;
}

.cwia-items:last-child {
	margin-bottom: 0;
}

/* Title badge */
.cwia-items .cwia-title {
	border: 1px solid rgba(217, 222, 237, .08);
	font-weight: 700 !important;
	line-height: 1 !important;
	display: inline-block;
	border-radius: 10px;
	margin-bottom: 20px;
	padding: 9px 14px;
	font-size: 20px;
	color: #d1d5db;
	transition: background-color .3s ease, color .3s ease;
}

/* Badge turns blue whenever the card is hovered, focused, or active */
.cwia-items:hover .cwia-title, .cwia-items:focus .cwia-title, .cwia-items.active .cwia-title {
	background-color: #1a56db;
	color: #fff;
}

.cwia-img {
	position: absolute;
	width: 45%;
	right: 0;
	top: 0;
}

.cwia-img img {
	display: none;
}

.cwia-img img.active {
	display: block;
}

@media only screen and (max-width: 1024px) {
	.cwia-items {
		padding: 20px;
	}
}

@media only screen and (max-width: 767px) {
	#cus-wid-img-accordion {
		flex-direction: column-reverse;
		padding-top: 420px;
	}
	
	.cwia-items {
		width: 100%;
	}
	
	.cwia-img {
		position: absolute;
		margin: auto;
		width: 100%;
		right: 0;
		left: 0;
		top: 0;
	}
	
	.cwia-img img {
		margin: 0 auto;
		width: 400px;
	}
}

@media only screen and (max-width:440px) {
	#cus-wid-img-accordion {
		padding-top: 105%;
	}
}
