.metaslider.ms-theme-focus {
	.flexslider {

		.flex-direction-nav {
			li a {
				background: #00acd4;
				background-size: 30px;
				border-radius: 100%;
				bottom: 50%;
				transform: translateY(50%);
				box-shadow: 0 0 10px rgba(0,0,0,0.3) !important;
				height: 36px;
				top: auto;
				width: 36px;
				z-index: 999;
				opacity: 1;

				&:hover,
				&:focus {
					background-color: #009bbf;
					outline: none;
				}
	
				&:after {
					background-image: none;
					background-color: #fff;
					mask-repeat: no-repeat;
					mask-position: center;
					mask-size: 18px auto;
					content: '' !important;
					display: block;
					height: 100%;
					width: 100%;
					top: 0;
					position: absolute;
				}
	
				&.flex-prev {
					left: -18px;
	
					&:after {
						mask-image: url(images/arrow-left.svg);
					}
				}
	
				&.flex-next {
					right: -18px;
	
					&:after {
						mask-image: url(images/arrow-right.svg);
					}
				}
			}
		}

		&.filmstrip {
			margin-top: 5px;

			.slides {
				
				li {
					transition: opacity 0.3s linear, filter 0.3s linear;
					opacity: 0.5;
					filter: grayscale(100%);

					&.flex-active-slide {
						opacity: 1;
						filter: grayscale(0%);
					}
				}
			}
		}

		&:not(.filmstrip) {

			.flex-viewport {
				font-weight: bold;
				transition: none;
			}
			.caption-wrap {
				background: transparent;
				opacity: 1;

				.caption {
					box-sizing: border-box;
					padding: 100px 20px 20px;
					text-align: center;
					width: auto;
					background: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.8));
	
					p {
						margin: 0 0 15px;
					}
					
					a {
						color: #f3ea28;
						text-decoration: underline;
	
						&:hover,
						&:focus {
							color: #faf461;
							background: none;
						}
					}
				}
			}
	
			.flex-control-nav {
				bottom: -40px;
				z-index: 999;

				li a {
					box-shadow: 0 0 5px rgba(0,0,0,.2) !important;
					background: #00acd4;
					margin: 0 5px;
					border-radius: 100%;
					opacity: 1;
					width: 20px;
					height: 20px;
	
					&:hover,
					&:focus {
						opacity: 1;
						background: #009bbf;
					}

					&.flex-active {
						background: #c7f0f9;
					}
				}
			}
	
			.flex-pauseplay {
				z-index: 999;
	
				.flex-pause, .flex-play {
					width: 40px;
					height: 40px;
					background: #35948E;
					color: #fff;
					text-align: center;
					border-radius: 50%;
					line-height: 40px;
					bottom: 20px;
					opacity: 1;
				}
			}

			.flex-direction-nav {

				li a {
					bottom: 50%;
					transform: translateY(50%);
					width: 50px;
					height: 50px;

					&:after {
						mask-size: 30px auto;
					}

					&.flex-next {
						right: -25px;
		
						&:after {
							
						}
					}

					&.flex-prev {
						left: -25px;
		
						&:after {
							
						}
					}
				}
			}

			.slides {
				
				li {
					transition: opacity 0.3s linear, filter 0.3s linear;
					opacity: 0.5;
					filter: grayscale(100%);

					&.flex-active-slide {
						opacity: 1;
						filter: grayscale(0%);
					}
				}
			}
		}
	}

	&.has-onhover-arrows {
		.flex-direction-nav li {
			opacity: 0;
		}
		&:hover {
			.flex-direction-nav {
				li {
					opacity: 1;
				}
				a {
					opacity: 1;
				}
			}
		}
	}
}