/// CONTROLS

.controls			{	z-index: 300; position: fixed;
						top: 0; left: 0;
						width: 100%; height: 100%;
						//width: 100vw; height: 100vh;
						text-align: center; 
						pointer-events: none;
						transition: all 250ms ease-in; }

.box-carousel:not(.box-zoomed) .controls
					{	position: absolute; }


.widget				{	pointer-events: auto; }

.widget-show			{	opacity: 1; pointer-events: auto; }
.widget-hide,
.widget-hide:hover	{	opacity: 0; pointer-events: none; }

.close,
.arrow				{	@extend .widget; }

.slide-box:not(.box-zoomed) .close
					{	@extend .widget-hide; }
.slide-box:not(.box-zoomed, .box-carousel) .arrow
					{	@extend .widget-hide; }
					
.controls a			{	line-height: 16px; text-align: center; }
.controls a:link,
.controls a:visited	{	color: $text; text-decoration: none; }
.controls a:hover	{	color: $accent; }


/// WIDGETS: CLOSE

.close				{	position: absolute; left: 0;
						width: 36px; height: 36px;
						padding: 18px;
						background-repeat: no-repeat;
						background-position: center center; 
						background-size: 36px 36px;
						font-size: 0; }
.close:link,
.close:visited		{	background-image: url($image_dir+'widget-close.svg'); }
.close:hover			{	background-image: url($image_dir+'widget-close-over.svg'); }


/// WIDGETS: ARROWS */

.disabled,
.disabled:hover		{	@extend .widget-hide; }

a.disabled:link,
a.disabled:visited,
a.disabled:hover		{	color: rgba(0,0,0,0.0);
						cursor: default; }


.arrow				{	position: absolute; top: 3*$gutter;
						height: $h-margin; width: $h-margin;
						width: 30%; height: 100% - 6*$gutter;
						text-decoration: none; font-size: 0;
						line-height: 1.15*$h-margin; }
.carousel .arrow		{	width: 50%; }

.arrow.disabled		{	cursor: default; }

.prev, .next			{	@extend .arrow; }

.prev				{	left: 0;
						text-align: right; }
.next				{	right: 0; }

.arrow.prev			{	cursor: url($image_dir+'arrow-long-left.svg'), url($image_dir+'arrow-long-left.png'), pointer; }

.arrow.next			{	cursor: url($image_dir+'arrow-long-right.svg'), url($image_dir+'arrow-long-right.png'), pointer; }


/// VIDEO CONTROLS

.play,
.entry .play			{	display: block; position: absolute; 
						top: 0; left: 0; bottom: 0; right: 0;
						/* overflow: auto; */ margin: auto; 
						border: $v-margin solid white; border-radius: 1.5*$v-margin;
						width: 0; height: 0; background: white;
						transition: all 250ms ease-out;
						opacity: 1; pointer-events: all; }

.play-triangle		{	z-index: 10; display: block; position: absolute;
						top: -$h-margin/3; left: -$h-margin/6;
						border-color: transparent transparent transparent $black; 
						border-style: solid;
						border-width: $h-margin/3 $h-margin/2; }

.play:hover			{	border-width: 1.1*$v-margin; /* border-color: $text-hover; */ }
.play:hover .play-triangle
					{	border-left-color: $accent; }

.entry .play:link,
.entry .play:visited{	border-color: white; }

.entry .play:hover	{	border-color: $accent; }
.entry .play:hover .play-triangle
					{	border-left-color: white; }

.playing .play		{	opacity: 0; pointer-events: none; }

@media only screen and (max-width: $phone-large) {
	
	.play,
	.entry .play		{	opacity: 0; }
	
}