
.logo {
				width: 12%;
				min-width: 120px;
				position: fixed;
				z-index: 2;
				left: 10px;
				top: 0px;
				cursor: pointer;
			}
			
						@media screen and (max-width: 762px) {
	.logo {
				width: 40%;
				min-width: 7px;
				position: fixed;
				z-index: 2;
				left: 10px;
				top: 0px;
				cursor: pointer;
			}
		}

			.logoPen {
				stroke-dasharray: 100;
				transform-origin: 50% 34%;
				animation: logoAnim 6s ease-in-out;
				animation-play-state: paused;
			}

			@keyframes logoAnim {
				50% {
					transform: rotate(360deg);
				}
			}

			.circle {
				stroke-dasharray: 470.4776611328125;
				stroke-dashoffset: 470.4776611328125;
				animation: dash 3s ease-in-out 2;
				animation-direction: alternate;
				transform: rotate(135deg);
				transform-origin: 50% 34%;
				stroke: #8aceff;
				animation-play-state: paused;
			}

			@keyframes dash {
				to {
					stroke-dashoffset: 25;
				}
			}
			