

/* body
----------------------------------------------- */

body {
}


/* button
----------------------------------------------- */

.lpZoffpc_pack .lp-button a,
.lpZoffpc_pack .lp-button a:after {
	transition-property: color, background-color, background-image;
	transition-duration: 0.25s;
	transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
}

/* hover */

.lpZoffpc_pack .lp-button a:hover {
	color: #229ade;
	background-color: #fff;
	opacity: 1;
	transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
.lpZoffpc_pack .lp-button a:hover:after {
	background-image: url(../common/images/button_arrow_blue.svg);
	animation-name: button;
	animation-duration: 0.85s;
	animation-iteration-count: infinite;
}

/* keyframes */

@keyframes button {
	30% {
		transform: translateX(3px);
	}
}


/* nav
----------------------------------------------- */

.lpZoffpc_pack .lp-nav__arrow,
.lpZoffpc_pack .lp-nav__arrow:after {
	transition-property: background-color, background-image, transform;
	transition-duration: 0.25s;
}
.lpZoffpc_pack .lp-nav__copy u:before,
.lpZoffpc_pack .lp-nav__copy u:after {
	transform-origin: right;
	transition-property: transform;
	transition-duration: 0s;
	transition-delay: 0;
	transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
}
.lpZoffpc_pack .lp-nav__copy u:after {
	transform: scaleX(0);
	transform-origin: left;
}

/* hover */

.lpZoffpc_pack .lp-nav__item a:hover {
	opacity: 1;
}
.lpZoffpc_pack .lp-nav__item a:hover .lp-nav__copy u:before {
	transform: scaleX(0);
	transition-duration: 0.35s;
}
.lpZoffpc_pack .lp-nav__item a:hover .lp-nav__copy u:after {
	transform: scaleX(1);
	transition-duration: 0.35s;
	transition-delay: 0.35s;
}
.lpZoffpc_pack .lp-nav__item--regular a:hover .lp-nav__arrow {
	background-color: #00aae7;
}
.lpZoffpc_pack .lp-nav__item--ultra a:hover .lp-nav__arrow {
	background-color: #0068b6;
}
.lpZoffpc_pack .lp-nav__item a:hover .lp-nav__arrow {
	transform: translateY(-3px);
}
.lpZoffpc_pack .lp-nav__item a:hover .lp-nav__arrow:after {
	background-image: url(../common/images/nav_arrow_white.svg);
	animation-name: nav_arrow;
	animation-duration: 0.85s;
	animation-iteration-count: infinite;
}

/* keyframes */

@keyframes nav_arrow {
	30% {
		transform: translateY(3px);
	}
}


/* product
----------------------------------------------- */

.lpZoffpc_pack .lp-product__color {
	transition-property: opacity;
	transition-duration: 0.25s;
}

/* hover */

.lpZoffpc_pack .lp-product__color:hover {
	opacity: 0.7;
}


