/**
 * @file
 * Control the position of and styling of the floating button.
 */

/*	Footer
	--------------------------------------------- */

	/* Floating Button */
	.floating-menu-wrapper { position: fixed; bottom: 30px; right: 30px; text-align: right; z-index: 5 }
	.floating-menu-wrapper .floating-icon { display: inline-block; padding: 15px; background: #747474; line-height: 0; border-radius: 50%; color: #fff; box-shadow: 1px 1px 3px rgba(28, 28, 28, 0.5); }
    .floating-menu-wrapper .floating-icon svg { transition: 0.2s; fill: #fff; }
    .floating-menu-wrapper.hover .floating-icon svg,
    .floating-menu-wrapper.clicked .floating-icon svg { transform: rotate(45deg); }

    .floating-menu-wrapper .floating-menu { display: none; }
    .floating-menu-wrapper.hover .floating-menu,
    .floating-menu-wrapper.clicked .floating-menu { display: block; }
    .floating-menu-wrapper .floating-menu .block-shortcuts { margin: 0; padding: 0; }
    .floating-menu-wrapper .floating-menu ul.toolbar-menu { display: table-row; padding: 0; list-style: none; }
	.floating-menu-wrapper .floating-menu ul.toolbar-menu > li { width: 100%; position: relative; }
	.floating-menu-wrapper .floating-menu ul.toolbar-menu > li { opacity: 0; }
	.floating-menu-wrapper.hover .floating-menu ul.toolbar-menu > li { animation: mymove 0.2s ease-in-out 1; animation-fill-mode: both; }
	/* .floating-menu-wrapper.hover .floating-menu ul.toolbar-menu > li { right: 50px; opacity: 0; } */
	/* .floating-menu-wrapper.hover .floating-menu ul.toolbar-menu > li:nth-child(n) { transition-delay: calc(var(--testmore)+0.1s); } */
	/* .floating-menu-wrapper.hover .floating-menu ul.toolbar-menu > li:nth-child(2) { animation-delay: 0.1s; }
	.floating-menu-wrapper.hover .floating-menu ul.toolbar-menu > li:nth-child(3) { animation-delay: 0.2s; }
	.floating-menu-wrapper.hover .floating-menu ul.toolbar-menu > li:nth-child(4) { animation-delay: 0.3s; }
	.floating-menu-wrapper.hover .floating-menu ul.toolbar-menu > li:nth-child(5) { animation-delay: 0.4s; }
	.floating-menu-wrapper.hover .floating-menu ul.toolbar-menu > li:nth-child(6) { animation-delay: 0.5s; } */
	/* .floating-menu-wrapper.hover .floating-menu ul.toolbar-menu > li:nth-child(7) { animation-delay: 0.6s; }
	.floating-menu-wrapper.hover .floating-menu ul.toolbar-menu > li:nth-child(8) { animation-delay: 0.7s; }
	.floating-menu-wrapper.hover .floating-menu ul.toolbar-menu > li:nth-child(9) { animation-delay: 0.8s; }
	.floating-menu-wrapper.hover .floating-menu ul.toolbar-menu > li:nth-child(10) { animation-delay: 0.9s; }
	.floating-menu-wrapper.hover .floating-menu ul.toolbar-menu > li:nth-child(11) { animation-delay: 1.0s; } */
	.floating-menu-wrapper.clicked .floating-menu ul.toolbar-menu > li { animation: mymove 0.2s ease-in-out 1; animation-fill-mode: both; }
	/* .floating-menu-wrapper.clicked .floating-menu ul.toolbar-menu > li:nth-child(2) { animation-delay: 0.1s; }
	.floating-menu-wrapper.clicked .floating-menu ul.toolbar-menu > li:nth-child(3) { animation-delay: 0.2s; }
	.floating-menu-wrapper.clicked .floating-menu ul.toolbar-menu > li:nth-child(4) { animation-delay: 0.3s; }
	.floating-menu-wrapper.clicked .floating-menu ul.toolbar-menu > li:nth-child(5) { animation-delay: 0.4s; }
	.floating-menu-wrapper.clicked .floating-menu ul.toolbar-menu > li:nth-child(6) { animation-delay: 0.5s; } */
	/* .floating-menu-wrapper.clicked .floating-menu ul.toolbar-menu > li:nth-child(7) { animation-delay: 0.6s; }
	.floating-menu-wrapper.clicked .floating-menu ul.toolbar-menu > li:nth-child(8) { animation-delay: 0.7s; }
	.floating-menu-wrapper.clicked .floating-menu ul.toolbar-menu > li:nth-child(9) { animation-delay: 0.8s; }
	.floating-menu-wrapper.clicked .floating-menu ul.toolbar-menu > li:nth-child(10) { animation-delay: 0.9s; }
	.floating-menu-wrapper.clicked .floating-menu ul.toolbar-menu > li:nth-child(11) { animation-delay: 1.0s; } */
	.floating-menu-wrapper .floating-menu ul.toolbar-menu > li a { font-family: 'Muli', sans-serif; display: inline-block;
	 color: #fff; background: #4a4a4a; padding: 10px 15px; text-indent: 0; margin-bottom: 8px; border-radius: 25px; }
	 
	.floating-menu-wrapper .floating-menu ul.toolbar-menu > li a:hover { background: #747474; }

	@keyframes mymove {
	  0% { right: 50px; opacity: 0; }
	  100% {right: 0px; opacity: 1; }
	}