@charset "utf-8";

	
	.astoundSelectedWorkTitleContainer{
		width:100%;
		display: flex;
		margin-bottom:var(--astoundDefaultSectionMarginSmaller);
	}

	.astoundSelectedWorkTitle{
		padding-left:var(--astoundDefaultSectionMarginSmaller);
		padding-right:var(--astoundDefaultSectionMarginSmaller);
		padding-bottom:20px;
		border-bottom: solid 1px #000;
	}
	
	.astoundSelectedWorkItemContainer{
		width:100%;
		display: flex;
		flex-direction: row;
		margin-bottom:var(--astoundDefaultSectionMargin);
	}
	.astoundSelectedWorkItemContainer:nth-child(even){
		flex-direction: row-reverse;
	}

	.astoundSelectedWorkTitleColumn{
		padding-left:var(--astoundDefaultSectionMarginSmaller);
		padding-right:150px;
		min-width:40vw;
	}
	
	.astoundSelectedWorkImageDesc{
		flex-grow: 1;
	}
	.astoundSelectedWorkImage{
		width:100%;
		height:650px;
		background-size: cover;
		background-position: center;
	}
	.astoundSelectedWorkItemContainer .astoundSelectedWorkDesc{
		text-align: right;
		width:50%;
		float:right;
		margin-right:var(--astoundDefaultSectionMarginSmaller);
		padding-right:var(--astoundDefaultSectionMarginSmaller);
		margin-left:0px;
		padding-left:0px;
		padding-top:20px;
		border-right:solid 1px #000;
		border-left:solid 0px #000;
		
	}
	.astoundSelectedWorkItemContainer:nth-child(even) .astoundSelectedWorkDesc{
		text-align: left;
		width:50%;
		float:left;
		margin-right:0px;
		padding-right:0px;
		margin-left:var(--astoundDefaultSectionMarginSmaller);
		padding-left:var(--astoundDefaultSectionMarginSmaller);
		padding-top:20px;
		border-right:solid 0px #000;
		border-left:solid 1px #000;
		
	}

@media (max-width: 992px) {
		
		.astoundSelectedWorkItemContainer .astoundSelectedWorkDesc{
			text-align: right;
			width:80%;
			float:right;
			margin-right:var(--astoundDefaultSectionMarginSmaller);
			padding-right:var(--astoundDefaultSectionMarginSmaller);
			margin-left:0px;
			padding-left:0px;
			padding-top:20px;
			border-right:solid 1px #000;
			border-left:solid 0px #000;
		}
		.astoundSelectedWorkItemContainer:nth-child(even) .astoundSelectedWorkDesc{
			text-align: left;
			width:80%;
			float:left;
			margin-right:0px;
			padding-right:0px;
			margin-left:var(--astoundDefaultSectionMarginSmaller);
			padding-left:var(--astoundDefaultSectionMarginSmaller);
			padding-top:20px;
			border-right:solid 0px #000;
			border-left:solid 1px #000;

		}
}
	
	@media (max-width: 768px) {
		.astoundSelectedWorkItemContainer {
			width: 100%;
			display: flex;
			flex-direction: column;
			margin-bottom:var(--astoundDefaultSectionMargin);
		}
		.astoundSelectedWorkItemContainer:nth-child(even){
			flex-direction: column;
		}
		.astoundSelectedWorkImage{
			width:100%;
			height:40vh;
			background-size: cover;
			background-position: center;
		}
		
		.astoundSelectedWorkItemContainer .astoundSelectedWorkDesc{
			text-align: left;
			width:80%;
			float:left;
			margin-right:0px;
			padding-right:0px;
			margin-left:var(--astoundDefaultSectionMarginSmaller);
			padding-left:var(--astoundDefaultSectionMarginSmaller);
			padding-top:20px;
			border-right:solid 0px #000;
			border-left:solid 1px #000;
		}
		.astoundSelectedWorkItemContainer:nth-child(even) .astoundSelectedWorkDesc{
			text-align: left;
			width:80%;
			float:left;
			margin-right:0px;
			padding-right:0px;
			margin-left:var(--astoundDefaultSectionMarginSmaller);
			padding-left:var(--astoundDefaultSectionMarginSmaller);
			padding-top:20px;
			border-right:solid 0px #000;
			border-left:solid 1px #000;

		}
	}
	.astoundSelectedWorkItemContainer .astoundSelectedWorkTitleColumn{
		transform: translateX(-50vw);
		opacity:0.0;
		transition: 0.5s all;
		padding-right:20px;
	}
	.astoundSelectedWorkItemContainer:nth-child(even) .astoundSelectedWorkTitleColumn{
		transform: translateX(50vw);
	}
	.astoundSelectedWorkItemContainer.active .astoundSelectedWorkTitleColumn{
		transform: translateX(0vw);
		opacity:1.0;
	}
	.astoundSelectedWorkImageDesc{
		transform: translateX(50vw);
		opacity:0.0;
		transition: 0.6s all;
	}
	.astoundSelectedWorkItemContainer:nth-child(even) .astoundSelectedWorkImageDesc{
		transform: translateX(-50vw);
	}
	.astoundSelectedWorkItemContainer.active .astoundSelectedWorkImageDesc{
		transform: translateX(0vw);
		opacity:1.0;
	}
	.astoundSelectedWorkItemContainer h1 {
		font-family: var(--astound-h2-font-family);
		font-weight: var(--astound-h2-font-weight);
		font-size: var(--astound-h2-font-size);
		line-height: var(--astound-h2-line-height);
		text-transform: var(--astound-h2-text-transform);
		transition: 0.5s all;
	}
	
	.astoundSelectedWorkItemContainer h2 {
		font-family: var(--astound-h6-font-family);
		font-weight: var(--astound-h6-font-weight);
		font-size: var(--astound-h6-font-size);
		line-height: var(--astound-h6-line-height);
		text-transform: var(--astound-h6-text-transform);
		transition: 0.5s all;
		margin-bottom:0px;
	}
	.astoundSelectedWorkTitleColumn h3{
		white-space: nowrap;
	}


.astoundLargeAnimatedButton {
	height: 160px;
	width: 160px;
	overflow: hidden;
	z-index: 30000;
	color: #222;
	transform: translateY(-40px);
	display:block;
	background-position-x: 0px;
	background-repeat: no-repeat;
	cursor: pointer;
	animation: playALAB2 00.25s steps(29) forwards;
	transition:none;
}
.astoundLargeAnimatedButton:hover {
	animation: playALAB 00.5s steps(29) forwards;
  
}	
.astoundLargeAnimatedButton {
	background-image: url("../../images/ui/navmenubutton-learnmore-black.png"); /* width: 2048px; height: 512px; */
}


@media (max-width: 768px) {
	.astoundLargeAnimatedButton{
		height: 80px;
		width: 80px;
		animation: playALABs2 00.25s steps(29) forwards;
	transform: translateY(-25px);
	background-image: url("../../images/ui/navmenubutton-learnmore-sm-black.png"); /* width: 2048px; height: 512px; */
		
	}
	.astoundLargeAnimatedButton:hover {
		animation: playALABs 00.5s steps(29) forwards;

	}	
}

@keyframes playALAB {
  from {
    background-position-x: 0px;
  }
  to {
    background-position-x: -4640px;
  }
}
@keyframes playALAB2 {
  from {
    background-position-x: -4640px;
  }
  to {
    background-position-x: 0px;
  }
}

@keyframes playALABs {
  from {
    background-position-x: 0px;
  }
  to {
    background-position-x: -2320px;
  }
}
@keyframes playALABs2 {
  from {
    background-position-x: -2320px;
  }
  to {
    background-position-x: 0px;
  }
}