.c-circle-menu {

	position: fixed;

	bottom: 150px;

	left: 10px;

	z-index: 1000;

	width: 60px;

	height: 99px;

	border-radius: 50px

}



@media(min-width:390px) and (min-height:390px) {

	.c-circle-menu {

		width: 96px;

		height: 96px;

		border-radius: 48px

	}

}



.c-circle-menu__items {

	display: block;

	list-style: none;

	position: absolute;

	z-index: 2;

	margin: 0;

	padding: 0

}



.c-circle-menu__item {

	display: block;

	position: absolute;

	top: 0;

	left: 0;

	width: 50px;

	height: 50px;

	border-radius: 0;

	opacity: 0;

	-webkit-transition: opacity, -webkit-transform;

	transition: opacity, -webkit-transform;

	transition: transform, opacity;

	transition: transform, opacity, -webkit-transform;

	-webkit-transition-duration: .3s, .3s;

	transition-duration: .3s, .3s;

	-webkit-transition-timing-function: cubic-bezier(.35, -.59, .47, .97);

	transition-timing-function: cubic-bezier(.35, -.59, .47, .97)

}



.c-circle-menu__item:nth-child(1) {

	-webkit-transition-delay: .4s;

	transition-delay: .4s

}



.c-circle-menu__item:nth-child(2) {

	-webkit-transition-delay: .3s;

	transition-delay: .3s

}



.c-circle-menu__item:nth-child(3) {

	-webkit-transition-delay: .2s;

	transition-delay: .2s

}



.c-circle-menu__item:nth-child(4) {

	-webkit-transition-delay: .1s;

	transition-delay: .1s

}



.c-circle-menu__item:nth-child(5) {

	-webkit-transition-delay: 0s;

	transition-delay: 0s

}



.c-circle-menu.is-active .c-circle-menu__item {

	-webkit-transition-timing-function: cubic-bezier(.35, .03, .47, 1.59);

	transition-timing-function: cubic-bezier(.35, .03, .47, 1.59);

	opacity: 1

}



.c-circle-menu.is-active .c-circle-menu__item:nth-child(1) {

	-webkit-transition-delay: 0s;

	transition-delay: 0s;

	-webkit-transform: translate(+344px, -0);

	transform: translate(+80px, -0)

}



@media(min-width:390px) and (min-height:390px) {

	.c-circle-menu__item {

		width: 60px;

		height: 60px;

		border-radius: 50px

	}



	.c-circle-menu.is-active .c-circle-menu__item:nth-child(1) {

		-webkit-transform: translate(+50px, 0);

		transform: translate(+50px, 0)

	}

}



.c-circle-menu.is-active .c-circle-menu__item:nth-child(2) {

	-webkit-transition-delay: .1s;

	transition-delay: .1s;

	-webkit-transform: translate(+70px, -59px);

	transform: translate(+70px, -70px)

}



@media(min-width:390px) and (min-height:390px) {

	.c-circle-menu.is-active .c-circle-menu__item:nth-child(2) {

		-webkit-transform: translate(+40px, -60px);

		transform: translate(+40px, -60px)

	}

}



.c-circle-menu.is-active .c-circle-menu__item:nth-child(3) {

	-webkit-transition-delay: .2s;

	transition-delay: .2s;

	-webkit-transform: translate(+100px, -145px);

	transform: translate(+0px, -80px)

}



@media(min-width:390px) and (min-height:390px) {

	.c-circle-menu.is-active .c-circle-menu__item:nth-child(3) {

		-webkit-transform: translate(+0px, -100px);

		transform: translate(+0px, -100px)

	}

}



.c-circle-menu.is-active .c-circle-menu__item:nth-child(4) {

	-webkit-transition-delay: .3s;

	transition-delay: .3s;

	-webkit-transform: translate(+50px, -163px);

	transform: translate(+60px, -180px)

}



@media(min-width:390px) and (min-height:390px) {

	.c-circle-menu.is-active .c-circle-menu__item:nth-child(4) {

		-webkit-transform: translate(+111px, -267px);

		transform: translate(+111px, -267px)

	}

}



.c-circle-menu.is-active .c-circle-menu__item:nth-child(5) {

	-webkit-transition-delay: .4s;

	transition-delay: .4s;

	-webkit-transform: translate(-0, -210px);

	transform: translate(-0, -210px)

}



.c-circle-menu__link {

	display: block;

	width: 100%;

	height: 100%;

	border-radius: 1000px;

	box-shadow: inset 0 0 0 2px #0066ff

}



@media(min-width:390px) and (min-height:390px) {

	.c-circle-menu.is-active .c-circle-menu__item:nth-child(5) {

		-webkit-transform: translate(0, -298px);

		transform: translate(0, -298px)

	}



	.c-circle-menu__link {

		border-radius: 1000px

	}

}



.c-circle-menu__link img {

	display: block;

	max-width: 100%;

	height: auto

}



.c-circle-menu__link:hover {

	box-shadow: inset 0 0 0 2px #0019fd

}



.c-circle-menu__toggle {

	display: block;

	position: absolute;

	z-index: 100;

	margin: 0;

	padding: 0;

	width: 48px;

	height: 48px;

	background-color: #0066ff;

	font: inherit;

	font-size: 0;

	text-indent: -9999px;

	border-radius: 10px;

	-webkit-transition: background .3s;

	transition: background .3s;

	cursor: pointer;

	border: none;

	-webkit-appearance: none;

	-moz-appearance: none;

	appearance: none;

	box-shadow: none

}



@media(min-width:390px) and (min-height:390px) {

	.c-circle-menu__toggle {

		width: 60px;

		height: 60px;

		border-radius: 10px

	}

}



.c-circle-menu__toggle.is-active,

.c-circle-menu__toggle:focus,

.c-circle-menu__toggle:hover {

	outline: 0;

	background-color: #0066ff

}



.c-circle-menu__toggle span,

.c-circle-menu__toggle span::after,

.c-circle-menu__toggle span::before {

	display: block;

	position: absolute;

	height: 4px;

	background: #fff;

	border-radius: 0

}



.c-circle-menu__toggle span {

	top: 22px;

	left: 10px;

	right: 10px;

	-webkit-transition: background .3s;

	transition: background .3s

}



@media(min-width:390px) and (min-height:390px) {



	.c-circle-menu__toggle span,

	.c-circle-menu__toggle span::after,

	.c-circle-menu__toggle span::before {

		height: 8px;

		border-radius: 0

	}



	.c-circle-menu__toggle span {

		top: 25px;

		left: 10px;

		right: 10px

	}

}



.c-circle-menu__toggle span::after,

.c-circle-menu__toggle span::before {

	left: 0;

	width: 100%;

	content: "";

	-webkit-transition-duration: .3s, .3s;

	transition-duration: .3s, .3s;

	-webkit-transition-delay: .3s, 0s;

	transition-delay: .3s, 0s

}



.c-circle-menu__toggle span::before {

	top: -8px;

	-webkit-transition-property: top, -webkit-transform;

	transition-property: top, -webkit-transform;

	transition-property: top, transform;

	transition-property: top, transform, -webkit-transform

}



.c-circle-menu__toggle span::after {

	bottom: -8px;

	-webkit-transition-property: bottom, -webkit-transform;

	transition-property: bottom, -webkit-transform;

	transition-property: bottom, transform;

	transition-property: bottom, transform, -webkit-transform

}



@media(min-width:390px) and (min-height:390px) {

	.c-circle-menu__toggle span::before {

		top: -16px

	}



	.c-circle-menu__toggle span::after {

		bottom: -16px

	}

}



.c-circle-menu__toggle.is-active span {

	background: 0 0

}



.c-circle-menu__toggle.is-active span::before {

	top: 0;

	-webkit-transform: rotate(45deg);

	transform: rotate(45deg);

	-webkit-transition-delay: 0s, .3s;

	transition-delay: 0s, .3s

}



.c-circle-menu__toggle.is-active span::after {

	bottom: 0;

	-webkit-transform: rotate(-45deg);

	transform: rotate(-45deg);

	-webkit-transition-delay: 0s, .3s;

	transition-delay: 0s, .3s

}



.c-circle-menu__mask {

	position: fixed;

	top: 0;

	left: 0;

	z-index: 1;

	visibility: hidden;

	opacity: 0;

	width: 100%;

	height: 100%;

	background-color: rgba(0, 0, 0, .8);

	-webkit-transition: opacity .3s, visibility .3s;

	transition: opacity .3s, visibility .3s

}



.c-circle-menu__mask.is-active {

	opacity: 1;

	visibility: visible

}