@keyframes leaves {
    0% {
        transform: scale(1.0);
    }
    100% {
        transform: scale(2.0);
    }
}
.map-selection{
	background: #0169f9;
	padding: 100px 0;
	text-align: center;
}
.map-selection .map-selection--title{
	margin-bottom: 2px;
    color: #00CEF2;
    font-family: "Clayo", Sans-serif;
    font-size: 48px;
    font-weight: 500;
}
.map-selection .map-selection--description{
	color: #FFF6E9;
    font-family: "Helvetica", Sans-serif;
    font-size: 18px;
    font-weight: 400;
}
.map-container{  
    margin: 0 auto;
	position: relative;
	width: 800px;
}
.map-point{
	background: rgba(149, 219, 218, 0.45);
	border-radius: 100%;
	cursor: pointer;
	height: 27.4px;
	transition: 0.2s linear all;
	position: absolute;
	width: 27.4px;
}
.map-point:hover{ box-shadow: 0 0 2px 2px rgba(255, 255, 255, 0.5); }
.map-point.active{ animation: leaves 0.5s ease-in-out infinite alternate; }
.map-point:after{
	background: rgba(11, 134, 206, 0.79);
	border-radius: 100%;
	content: '';
	height: 21.3px;
	left: 3px;
	position: absolute;
	top: 3px;
	width: 21.3px;
}
.map-point:before{
	background: rgba(10, 27, 179, 0.71);
	border-radius: 100%;
	content: '';
	height: 16.3px;
	left: 5px;
	position: absolute;
	top: 5px;
	width: 16.3px;
}
.info-card{
    width: 860px;
    margin: 0 auto;
    display: grid;
    gap: 20px;
    grid-template-columns: 300px auto;
}

.info-card__image{
    height: 100%;
	border: 2px solid rgba(0, 206, 242, 1);
}
.info-card__image img{
    height: 100% !important;
    object-fit: fill;
    width: 100%;
}
.info-card__text {
	position: relative;
    text-align: left;
	top: -10px;
}
.info-card__text h4{
    margin-bottom: 11px;
    color: #00CEF2;
    font-family: "Clayo", Sans-serif;
    font-size: 32.4px;
    font-weight: 500;
}
.info-card__text p{
    color: #FFF6E9;
    font-family: "Helvetica", Sans-serif;
    font-size: 18px;
    font-weight: 400;
	margin-bottom: 40px;
}
.info-card__text a{
	background-color: #0A1BB4;
	color: #ffffff;
    font-family: "Roboto", Sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 4.6px;
    padding: 14px 15px 13px 22px;
}

/*  Rows Animation */

.row-hover{ transition: 3s linear all; }
.row-hover.row-hover--orange,
.row-hover.row-hover--blue{
	transition: 3s linear all;
}
.row-hover.row-hover--orange:hover{
	background: linear-gradient(270deg, #FD6508 15.79%, #FF8300 41.51%, #FF8300 57.85%, #FD6508 85.3%);
	transition: 3s linear all;
}
.row-hover.row-hover--blue:hover{
	background: linear-gradient(270deg, #2B1A7F 0%, #0057FF 50%, #A7E0FF 100%);
	transition: 3s linear all;
}

@media only screen and (max-width: 860px) {
	.info-card{
		width: 560px;
		grid-template-columns: 1fr;
	}
}
@media only screen and (max-width: 780px) {
	.map-selection{ padding: 50px 15px; }
	.map-container{ width: 100%; }
	.info-card{ 
		padding: 0 2rem;
		width: 100%; 
	}
	.map-selection .map-selection--title{
		font-size: 35px;
	}
}