/*
 * fullPage 2.8.8
 * https://github.com/alvarotrigo/fullPage.js
 * MIT licensed
 *
 * Copyright (C) 2013 alvarotrigo.com - A project by Alvaro Trigo
 * Contribution by Jhony0311
 */

html.fp-enabled,
.fp-enabled body {
	overflow: hidden;
	/* Avoid flicker on slides transitions for mobile phones #336 */
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

#superContainer {
	height: 100%;
	position: relative;

	/* Touch detection for Windows 8 */
	-ms-touch-action: none;

	/* IE 11 on Windows Phone 8.1*/
	touch-action: none;
}

.fp-section {
	position: relative;
	box-sizing: border-box;
}

.fp-slide {
	float: left;
}

.fp-slide, .fp-slidesContainer {
	height: 100%;
	display: block;
}

.fp-slides {
	z-index: 1;
	height: 100%;
	overflow: hidden;
	position: relative;
	transition: all 0.3s ease-out;
}

.fp-section.fp-table, .fp-slide.fp-table {
	display: table;
	table-layout: fixed;
	width: 100%;
}

.fp-tableCell {
	display: table-cell;
	vertical-align: middle;
	width: 100%;
	height: 100%;
	position: relative;
}

.fp-slidesContainer {
	float: left;
	position: relative;
}

.fp-controlArrow {
	user-select: none;
	position: absolute;
	z-index: 4;
	top: 50%;
	cursor: pointer;
	width: 0;
	height: 0;
	border-style: solid;
	margin-top: -38px;
	transform: translate3d(0, 0, 0);

	&.fp-prev {
		left: 15px;
		width: 0;
		border-width: 38.5px 34px 38.5px 0;
		border-color: transparent #fff transparent transparent;
	}

	&.fp-next {
		right: 15px;
		border-width: 38.5px 0 38.5px 34px;
		border-color: transparent transparent transparent #fff;
	}
}

.fp-scrollable {
	overflow: scroll;
}

.fp-notransition {
	-webkit-transition: none !important;
	transition: none !important;
}

.fp-slidesNav {
	position: absolute;
	z-index: 4;
	left: 50%;
	opacity: 1;

	&.bottom {
		bottom: 17px;
	}

	&.top {
		top: 17px;
	}
}

#fp-nav ul,
.fp-slidesNav ul {
	margin: 0;
	padding: 0;

	li {
		display: block;
		padding: 13px 7px;
		position: relative;

		a {
			display: block;
			position: relative;
			z-index: 1;
			width: 16px;
			height: 16px;
			cursor: pointer;
			text-decoration: none;

			span {
				border-radius: 100%;
				position: absolute;
				z-index: 1;
				height: 8px;
				width: 8px;
				left: 50%;
				top: 50%;
				transform: translate(-50%, -50%);
				transition: all .1s ease-in-out;
				background: #eee;
			}

			&.active,
			&:hover {
				span {
					background: #222;
				}
			}

			&.active {
				span {
					width: 100%;
					height: 100%;
				}
			}

			&:not(.active):hover {
				span {
					width: 12px;
					height: 12px;
				}
			}
		}
	}
}

#fp-nav {
	position: fixed;
	z-index: 100;
	margin-top: -32px;
	top: 50%;
	opacity: 1;
	transform: translate3d(0, 0, 0);

	&.right {
		right: 60px;
	}

	&.left {
		left: 60px;
	}

	.page-template-one-page-scroll[data-row-skin='light'] & {
		ul {
			li {
				a {
					color: #fff;

					&.active,
					&:hover {
						span {
							background-color: #fff;
						}
					}
				}

				span {
					background-color: rgba(255, 255, 255, .2);
				}
			}
		}

		.fp-tooltip {
			background: #fff;
			color: #333;
		}
	}

	.page-template-one-page-scroll[data-row-skin='dark'] & {
		ul {
			li {
				span {
					border-color: #e6e8ee;
				}
			}
		}

		.fp-tooltip {
			background: #333;
			color: #fff;

			&.right:after {
				border-left-color: #333;
			}

			&.left:after {
				border-right-color: #333;
			}
		}
	}

	.fp-tooltip {
		position: absolute;
		top: 50%;
		background: #fff;
		color: #333;
		font-size: 13px;
		white-space: nowrap;
		max-width: 220px;
		display: block;
		opacity: 0;
		width: 0;
		cursor: pointer;
		transform: translateY(-50%);
		padding: 5px 10px;
		border-radius: 5px;

		&:after {
			content: '';
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
			border-top: 8px solid transparent;
			border-bottom: 8px solid transparent;
		}

		&.right {
			right: 40px;

			&:after {
				left: 100%;
				border-left: 10px solid #fff;
			}
		}

		&.left {
			left: 40px;

			&:after {
				right: 100%;
				border-right: 10px solid #fff;
			}
		}
	}

	li {
		&:hover {
			.fp-tooltip {
				-webkit-transition: opacity 0.2s ease-in;
				transition: opacity 0.2s ease-in;
				width: auto;
				opacity: 1;
			}
		}
	}

	&.fp-show-active a.active + .fp-tooltip {
		-webkit-transition: opacity 0.2s ease-in;
		transition: opacity 0.2s ease-in;
		width: auto;
		opacity: 1;
	}
}

.fp-slidesNav ul li {
	display: inline-block;
}

.fp-auto-height.fp-section,
.fp-auto-height .fp-slide,
.fp-auto-height .fp-tableCell {
	height: auto !important;
}

.fp-responsive .fp-auto-height-responsive.fp-section,
.fp-responsive .fp-auto-height-responsive .fp-slide,
.fp-responsive .fp-auto-height-responsive .fp-tableCell {
	height: auto !important;
}

.fp-scrollable {
	overflow: hidden;

	.fp-scroller {
		overflow: hidden;
	}
}

.one-page-scroll {
	&.tm-enable-onepage-animation {
		> .vc-row-wrapper {
			overflow: hidden;
			position: absolute;
			top: 0;
			left: 0;
			background-color: #fff;
			backface-visibility: hidden;
			transform-style: preserve-3d;
			z-index: 1;

			&.active {
				z-index: 10;
			}

			&:not(.active):not(.fp-completely) {
				top: 100%;
				pointer-events: none;
				visibility: hidden;
			}
		}
	}
}

.fp-enabled {
	margin-top: 0 !important;

	.fp-table {
		display: table !important;
	}

	.admin-bar {
		.site {
			top: 32px;
		}
	}

	.site {
		position: relative;
		left: 0;
		overflow: hidden;
		transition: transform .3s ease-in-out;
	}

	.page-template-one-page-scroll {
		#page-content {
			position: relative;
			z-index: 2;
			transition: transform .6s ease;
		}

		#page-footer-wrapper {
			&:not(.overlay) {
				position: relative;
				z-index: 2;
				transition: transform .6s ease;
			}
		}

		&.tm-one-page-footer-expanded {
			#page-content {
				transform: translateY(-100px);
			}

			#page-footer-wrapper {
				transform: translateY(-100%);
			}
		}

		.custom-logo {
			display: none;
		}

		&[data-row-skin='light'] {
			.onepage-pagination {
				a {
					color: #fff;
				}
			}

			.page-header .menu__container > li > a,
			.page-open-mobile-menu i,
			.page-open-main-menu i,
			.header-right-more {
				color: #fff !important;
			}

			&:not(.header-more-tools-opened) {
				.popup-search-wrap i {
					color: #fff !important;
				}
			}

			.mini-cart .mini-cart-icon {
				&:after {
					color: #333 !important;
					background: #fff !important;
				}
			}

			.light-logo {
				display: inline-block;
			}

			.dark-logo {
				display: none;
			}
		}

		&[data-row-skin='dark'] {
			.onepage-pagination {
				a {
					color: inherit;
				}
			}

			.page-header .menu__container > li > a,
			.page-open-mobile-menu i,
			.page-open-main-menu i,
			.header-right-more {
				color: #333 !important;
			}

			&:not(.header-more-tools-opened) {
				.popup-search-wrap i {
					color: #333 !important;
				}
			}

			.mini-cart .mini-cart-icon {
				&:after {
					color: #fff !important;
					background: #333 !important;
				}
			}

			.light-logo {
				display: none;
			}

			.dark-logo {
				display: inline-block;
			}
		}

		&[data-logo-skin='light'] {
			.light-logo {
				display: inline-block;
			}

			.dark-logo {
				display: none;
			}
		}

		&[data-logo-skin='dark'] {
			.light-logo {
				display: none;
			}

			.dark-logo {
				display: inline-block;
			}
		}
	}
}

.page-template-one-page-scroll {
	.page-content {
		padding-top: 0;
		padding-bottom: 0;
	}
}

@include media-breakpoint-down(sm) {
	#fp-nav {
		&.right {
			right: 40px;
		}

		&.left {
			left: 40px;
		}
	}
}

@include media-breakpoint-down(xs) {
	#fp-nav {
		&.right {
			right: 20px;
		}

		&.left {
			left: 20px;
		}
	}
}
