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

#san_francisco{
	background: url('https://wallpapercat.com/w/full/8/4/1/294626-1920x1080-desktop-full-hd-san-francisco-background-photo.jpg') center no-repeat;
	background-size: cover;
}

#san_mateo{
	background: url('https://astanehelaw.com/wp-content/uploads/2020/09/San-Mateo-County-CoronavirusCOVID-19-Emergency-Paid-Sick-Leave-Ordinance-scaled.jpeg') center no-repeat;
	background-size: cover;
}

#san_jose{
	background: url('https://wallpapercat.com/w/full/9/1/a/2019652-2560x1440-desktop-hd-san-jose-costa-rica-wallpaper.jpg') center no-repeat;
	background-size: cover;
}

#san_carlos{
	background: url('https://content.r9cdn.net/rimg/dimg/cd/ef/3e7837cb-city-17093-1712acb4a6d.jpg?width=1366&height=768&xhint=2189&yhint=1046&crop=true') center no-repeat;
	background-size: cover;
}

#belmont{
	background: url('https://a.travel-assets.com/findyours-php/viewfinder/images/res70/481000/481436-City-Beach-La.jpg') center no-repeat;
	background-size: cover;
}

#burlingame{
	background: url('https://res.cloudinary.com/simpleview/image/upload/v1620152774/clients/sanmateoca/Burlingame_Jan2015_JKeefe_7D_2136_e16f452f-90e0-47f7-ac5f-67186344d39b.jpg') center no-repeat;
	background-size: cover;
}

#hillsborough{
	background: url('https://media.california.com/media/_versions_jpg/articles/living_in_hillsborough_california__5806x2784____v1222x580__.jpg') center no-repeat;
	background-size: cover;
}

#santa_clara{
	background: url('https://a.travel-assets.com/findyours-php/viewfinder/images/res70/213000/213032-Santa-Clara.jpg') center no-repeat;
	background-size: cover;
}

#cupertino{
	background: url('https://assets.agentfire3.com/uploads/sites/1928/2023/11/cupertino-ca-drone-shot.jpg') center no-repeat;
	background-size: cover;
}

#milpitas{
	background: url('https://griffisresidential.com/wp-content/uploads/sites/2/2023/03/jose-rago-M3itYJP_jMc-unsplash_ExtraLarge_1920x1080.jpg') center no-repeat;
	background-size: cover;
}

#morgan_hill{
	background: url('https://upload.wikimedia.org/wikipedia/commons/thumb/f/f8/Morgan-Hill-banner-01_%28cropped%29.jpg/1920px-Morgan-Hill-banner-01_%28cropped%29.jpg') center no-repeat;
	background-size: cover;
}

#los_altos{
	background: url('https://images.squarespace-cdn.com/content/v1/64b6da8bd41bd43353341e05/1690563444052-6BJNRMXXCZOGYPJXVGJE/Los+Altos_Jenny+Russo+%281%29.jpeg') center no-repeat;
	background-size: cover;
}

#los_gatos{
	background: url('https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQUSI2-x_nDrAf0wFGFCrxyOKUpY8okHApRxA&s') center no-repeat;
	background-size: cover;
}

#menlo_park{
	background: url('https://jjteamhomes.com/wp-content/uploads/Menlo-Park.jpg') 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: #fa9500;
	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: #f78400;
			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: #fa9500;
	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: #f78400;
				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;
	}
}