.restaurant_hero
	padding: 7rem 0
	a
		font-size: 2rem
		font-weight: 500
		color: #000
		text-decoration: none
		@include desktop
			font-size: 1.5rem

	@include phone
		padding: 1rem 0
		margin-bottom: 1rem
	.container
		@include phone
			max-width: 100%
	.restaurant_hero_image
		width: 100%
		img
			width: 100%
	.restaurant_hero_description
		display: flex
		flex-direction: column
		gap: 1rem
		@include phone
			text-align: center
			margin-bottom: 1rem
		h1
			font-size: 4rem
			font-weight: 600
			color: #000
			@include phone
				font-size: 1.5rem
			@include desktop
				font-size: 2.5rem
		h2
			font-size: 2.25rem
			font-weight: 600
			color: #000
			a
				font-size: 2.25rem
				@include phone
					font-size: 1.3rem            
				@include desktop
					font-size: 1.65rem
		p
			font-size: 1.1rem
			font-weight: 300
			color: #000
			@include phone
				font-size: .9rem            
			@include desktop
				font-size: .9rem
.custom_nav_restaurant
	ul
		display: flex
		list-style: none
		align-items: center
		justify-content: center
		width: 100%
		margin-bottom: 0
		@include phone
			flex-wrap: wrap
			padding: 0
		li
			text-align: center
			border: 1px solid #000
			padding: 6px 10px
			border-right: none
			a
				color: #000
				font-size: 1.25rem
				font-weight: 600
				@include desktop
					font-size: .9rem
			@include phone
				width: 100%
				border-right: 1px solid #000
				border-bottom: none
			&:nth-child(6)
				border-right: 1px solid #000
				@include phone
					border-bottom: 1px solid #000
                
.restaurant_grey_bg
	background-color: #F4F4F4
	&:nth-child(odd)
		background-color: #F4F4F4
	&:nth-child(even)
		background-color: #FFF
        
.restaurant_101
	padding: 8rem 1rem
	@include phone
		padding: 2rem 0
	.image_section
		width: 70%
		margin: 0 auto
		margin-right: 2rem
		@include phone
			width: 100%
			img
				width: 100%
	.restaurant_description
		width: 80%
		@include phone
			width: 100%
			padding: 0 12px
		h2
			font-weight: 600
			a
				font-size: 2.3rem
				color: #000
				&:hover
					text-decoration: underline
					color: #1d8ce1
				@include desktop
					font-size: 2rem
				@include phone
					font-size: 1.4rem
		p
			font-size: 1.5rem
			font-weight: 400
			color: #000
			border-bottom: 2px solid #000
			padding-bottom: 2rem
			margin-bottom: 2rem
			margin-top: 1rem
			@include phone
				font-size: 1rem
			@include desktop
				font-size: 1rem
		ul
			list-style: none
			@include phone
				padding: 0
			li
				font-weight: 400
				color: #000000
				display: flex
				align-items: center
				a
					font-size: 1.2rem
					color: #000
					&:hover
						text-decoration: underline
						color: #1d8ce1
					@include phone
						font-size: 1rem
					@include desktop
						font-size: 1.1rem
				&::before
					content: '\2022'
					color: #676767
					width: 24px
					height: 26px
					font-size: 3rem
					font-weight: bold
					margin-right: 1rem
					display: flex
					align-items: center
					@include desktop
						font-size: 1.1rem


