#redwood_city {
	background: url('../assets/images/redwood-city.jpg') center no-repeat;
	background-size: cover;
}

#san_francisco {
	background: url('https://images.unsplash.com/photo-1719858403527-e171e237fe59?q=80&w=1470&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D')
		center no-repeat;
	background-size: cover;
}

#san_mateo {
	background: url('https://media.equityapartments.com/images/c_crop,x_0,y_0,w_1920,h_1080/c_fill,w_1920,h_1080/q_auto,f_auto/4115-125/park-place-at-san-mateo-apartments-building')
		center no-repeat;
	background-size: cover;
}

#san_jose {
	background: url('https://a.travel-assets.com/findyours-php/viewfinder/images/res70/193000/193876-St-Joseph-Cathedral-Basilica.jpg')
		center no-repeat;
	background-size: cover;
}

#san_carlos {
	background: url('https://content.r9cdn.net/rimg/dimg/e0/be/1e1e8e71-city-48160-16b31f2945c.jpg?width=1366&height=768&xhint=1369&yhint=1230&crop=true')
		center no-repeat;
	background-size: cover;
}

#belmont {
	background: url('https://downtownbelmont.org/wp-content/uploads/2024/02/dbda-sept2023-24.jpg')
		center no-repeat;
	background-size: cover;
}

#burlingame {
	background: url('https://cdn.openhomesphotography.com/uploads/1375-burlingame-avenue.a3c1733c-34c3-473b-b589-ad9686ca6ac9/offlineBatchUploads/p4k.37708b4c-70c4-45fa-994a-fdb4a172528a/pictures/web/1375-burlingame-avenue.44621.p4k.001.web.jpg')
		center no-repeat;
	background-size: cover;
}

#hillsborough {
	background: url('https://live.staticflickr.com/65535/19584888234_f4c32222e3_h.jpg')
		center no-repeat;
	background-size: cover;
}

#santa_clara {
	background: url('https://bekinsmovingservices.com/wp-content/uploads/2021/09/san-jose-santa-clara-county-cities.jpg')
		center no-repeat;
	background-size: cover;
}

#cupertino {
	background: url('https://granicus.com/wp-content/uploads/2023/05/Success-Story-Cupertino-ca-header.jpg')
		center no-repeat;
	background-size: cover;
}

#milpitas {
	background: url('https://studios.imgix.net/img/hero-images/assets/uploads/Milpitas_Hero_Desktop_Facade.jpg?w=2800&q=80')
		center no-repeat;
	background-size: cover;
}

#morgan_hill {
	background: url('https://photos.zillowstatic.com/fp/732d36d7e1a10310e83de2988acf20a2-cc_ft_1536.jpg')
		center no-repeat;
	background-size: cover;
}

#los_altos {
	background: url('https://images.brivityidx.com/assets/images/uploads/4090/GettyImages-1848470240.jpg')
		center no-repeat;
	background-size: cover;
}

#los_gatos {
	background: url('https://photos.zillowstatic.com/fp/e6b5455d79511afebb1ad311cd693021-cc_ft_1536.jpg')
		center no-repeat;
	background-size: cover;
}

#menlo_park {
	background: url('https://images.squarespace-cdn.com/content/v1/64b6da8bd41bd43353341e05/1690561682196-JAXQZRQ0AEDQGPEAQDRV/Menlo+Park_Jenny+Russo+%283%29.jpeg')
		center no-repeat;
	background-size: cover;
}

#areas_info {
	margin: 30px 0;
}

.areas_info {
	display: flex;
	justify-content: space-between;
	align-items: start;
	gap: 20px;
}

.areas_info_content {
	max-width: 70%;
	width: 100%;
	flex: 0 0 70%;
}

.weather {
	display: flex;
	flex-direction: column;
	align-items: start;
	gap: 12px;
	border-left: 2px solid black;
	max-width: 30%;
	width: 100%;
	flex: 0 0 30%;
}

.city_logo {
	width: 200px;
	margin: 0 auto;
}

.weather_title {
	text-transform: uppercase;
	font-size: 22px;
	margin: 20px 0 8px 16px;
}

.weather_title::after {
	content: '';
	display: block;
	width: 50%;
	height: 5px;
	margin-left: -16px;
	background: #9e3b24;
	border-radius: 150px;
	margin-top: 4px;
}

.weather_info {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 68px;
	font-weight: 100;
	margin: 0 auto;
	img {
		width: 150px;
	}
}

.city_info {
	max-width: 250px;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: start;
	gap: 12px;
	padding: 0 12px;
	a {
		text-align: right;
		color: rgb(0, 149, 194);
		font-size: 12px;
		margin: 0 0 0 110px;
	}
}

.city_data {
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: start;
	gap: 12px;
	padding: 0 12px;
	a {
		transition: all 0.3s ease-in-out;
		color: rgb(0, 149, 194);
		&:hover {
			color: #9e3b24;
			text-decoration: underline;
			text-underline-offset: 4px;
		}
	}
}

.city_info_el {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1px solid black;
	padding: 4px 0;
}

.areas_info_supertitle {
	font-size: 36px;
}

.areas_info_title {
	margin: 12px 0;
	font-size: 36px;
	font-weight: 900;
}

.areas_info_subtitle {
	font-size: 22px;
}

.areas_info_text {
	margin: 20px 0;
	font-size: 18px;
	p {
		margin: 8px 0;
	}
}

#areas_map {
	margin: 30px 0;
}

#area_rest {
	margin: 100px 0;
}

.area_rest_title {
	text-transform: uppercase;
	font-size: 22px;
	font-weight: bold;
}

.area_rest_title::after {
	content: '';
	display: block;
	width: 10%;
	height: 5px;
	background: #9e3b24;
	border-radius: 150px;
	margin-top: 4px;
}

.area_info {
	margin: 30px 0;
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	align-items: center;
	gap: 24px;
}

.area_info_reverse {
	flex-direction: row-reverse;
}

.area_gallery {
	display: grid;
	gap: 1px;
	grid-template-columns: repeat(3, 110px);
	img {
		width: 110px;
		height: 110px;
		object-fit: cover;
	}
}

.area_description {
	font-size: 16px;
}

.area_establishments {
	margin: 40px 0;
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	gap: 20px;
}

.area_establishment {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	max-width: 23%;
	flex: 0 0 23%;
	&:hover {
		.establishment_content {
			.establishment_address {
				color: #9e3b24;
				text-decoration: underline;
				text-underline-offset: 4px;
			}
		}
	}
}

.establishment_title {
	font-size: 18px;
	font-weight: 700;
	color: #000;
}

.establishment_content {
	display: flex;
	align-items: center;
	gap: 12px;
	img {
		width: 85px;
		height: 85px;
		object-fit: cover;
	}
	.establishment_address {
		transition: all 0.3s ease-in-out;
		font-size: 18px;
		color: #000;
	}
}