
.section {
	&.gray {
		background: rgba($light-gray, 0.3);
	}

	&.blue {
		background: rgba($sulo-color, 0.3);
		h6 {
			color: $sulo-color;
		}
	}

	&.content {
		.row {
			max-width: 100%;
		}
	}

	&.banner {
		margin: 0;
		padding: 5% 0;

		.row {
			max-width: $global-width;
		}
		&.has-photo {
			padding-bottom: 0;
		}

		a {
			text-decoration: none;
		}
		em {
			font-style: normal;
			color: $sulo-dark-color;
		}
	}

	&.content {
		position: relative;
		.row {
			padding: 0 0.5rem;
			@include breakpoint(medium) {
				padding: 0 2rem;
			}
			flex-wrap: nowrap;
			overflow-x: scroll;
			overflow-y: hidden;
			// padding-left: 1rem;
			
			&::-webkit-scrollbar {
				height: 0;
					// background: $black;
			}
			&::-webkit-scrollbar-track {
					background: $white;
			}
			&::-webkit-scrollbar-thumb {
					background: map-get($foundation-palette,primary);
			}

			
		}	
		// > div {
		// 	position: relative;
		// 	display: flex;
		// 	align-items; center;
		// }
		.scroll-button-container {
			position:absolute;
			top: 0;
			bottom: 0;
			display: flex;
			align-items: center;
			&.left {
				left: 0;
			}
			&.right {
				right: 0;
			}
			a {
				padding: 1.5rem 1rem;
				background: rgba($white, 0.5);
				font-size: 1.25rem;
				color: $dark-gray;
				box-shadow: 0 0 3px 0 rgba($black, 0.1);
			}
		}
	}
}