Orange is the New Black title animation

<button title="Mute sound">
	<svg class="mute-on" viewBox="0 0 24 24" aria-label="Mute on">
		<path
			d="M12,4L9.91,6.09L12,8.18M4.27,3L3,4.27L7.73,9H3V15H7L12,20V13.27L16.25,17.53C15.58,18.04 14.83,18.46 14,18.7V20.77C15.38,20.45 16.63,19.82 17.68,18.96L19.73,21L21,19.73L12,10.73M19,12C19,12.94 18.8,13.82 18.46,14.64L19.97,16.15C20.62,14.91 21,13.5 21,12C21,7.72 18,4.14 14,3.23V5.29C16.89,6.15 19,8.83 19,12M16.5,12C16.5,10.23 15.5,8.71 14,7.97V10.18L16.45,12.63C16.5,12.43 16.5,12.21 16.5,12Z"
		></path>
	</svg>

	<svg class="mute-off hide" viewBox="0 0 24 24" aria-label="Mute off">
		<path
			d="M14,3.23V5.29C16.89,6.15 19,8.83 19,12C19,15.17 16.89,17.84 14,18.7V20.77C18,19.86 21,16.28 21,12C21,7.72 18,4.14 14,3.23M16.5,12C16.5,10.23 15.5,8.71 14,7.97V16C15.5,15.29 16.5,13.76 16.5,12M3,9V15H7L12,20V4L7,9H3Z"
		></path>
	</svg>
</button>

<svg id="logo" viewBox="0 0 1200 600">
	<path
		id="opening-bar"
		d="M51.704 53.35h17.09c4.44 0 8.015 10.17 8.015 22.805v30.579c-1.608 13.753-.083 18.106 0 26.785 2.327 11.198.21 16.471 0 24.286l-3.571 11.072 3.214-2.858.357 355.975c.006 5.84 2.171 15.678-2.019 15.181-34.463-4.084-10.877-4.197-1.416 3.567 2.219 1.82-2.876 4.057-4.58 4.057h-17.09c-4.44 0-8.014-10.17-8.014-22.805-1.333-7.515-.408-14.29 1.034-21.61l-.469-192.223c-2.76-25.767-6.616-50.876-.2-82.148L43.69 76.155c-.031-12.634 3.574-22.806 8.014-22.806z"
	/>
	<path
		id="bar1"
		class="moving-bar close-animation"
		d="M51.704 53.35h17.09c4.44 0 8.015 10.17 8.015 22.805v30.579c-1.608 13.753-.083 18.106 0 26.785 2.327 11.198.21 16.471 0 24.286l-3.571 11.072 3.214-2.858.357 355.975c.006 5.84 2.171 15.678-2.019 15.181-34.463-4.084-10.877-4.197-1.416 3.567 2.219 1.82-2.876 4.057-4.58 4.057h-17.09c-4.44 0-8.014-10.17-8.014-22.805-1.333-7.515-.408-14.29 1.034-21.61l-.469-192.223c-2.76-25.767-6.616-50.876-.2-82.148L43.69 76.155c-.031-12.634 3.574-22.806 8.014-22.806z"
	/>
	<path
		id="bar2"
		class="moving-bar close-animation"
		d="M51.704 53.35h17.09c4.44 0 8.015 10.17 8.015 22.805v30.579c-1.608 13.753-.083 18.106 0 26.785 2.327 11.198.21 16.471 0 24.286l-3.571 11.072 3.214-2.858.357 355.975c.006 5.84 2.171 15.678-2.019 15.181-34.463-4.084-10.877-4.197-1.416 3.567 2.219 1.82-2.876 4.057-4.58 4.057h-17.09c-4.44 0-8.014-10.17-8.014-22.805-1.333-7.515-.408-14.29 1.034-21.61l-.469-192.223c-2.76-25.767-6.616-50.876-.2-82.148L43.69 76.155c-.031-12.634 3.574-22.806 8.014-22.806z"
	/>
	<path
		id="closing-bar"
		d="M1129.91 54.025h17.091c4.44 0 8.015 10.17 8.015 22.805v30.579c-1.608 13.753-.083 18.106 0 26.786 2.327 11.197.21 16.47 0 24.285l-3.572 11.072 3.215-2.857.357 355.974c.01 5.84 2.17 15.678-2.02 15.181-34.462-4.083-10.876-4.196-1.415 3.567 2.218 1.82-2.876 4.058-4.58 4.058h-17.09c-4.44 0-8.015-10.172-8.015-22.806-1.332-7.515-.408-14.29 1.034-21.609l-.468-192.224c-2.76-25.767-6.617-50.875-.2-82.148l-.366-149.858c-.03-12.634 3.575-22.805 8.015-22.805z"
	/>
	<g id="writing" class="appear-animation">
		<g id="orange" aria-label="orange" >
			<path
				id="path4777"
				d="M205.904 48.101c-13.362-.058-26.747 2.272-38.261 9.21-18.27 10.612-28.156 32.064-27.088 52.812-1.018 8.22 3.964 16.916-.463 24.61-.503 11.505-.266 23.024-.246 34.536.67 9.426-1.512 19.19 1.289 28.352.288 11.166-1.642 23.03 1.553 34.142.414 8.154 4.284 15.39 10.04 21.871 1.052 1.184 9.666-11.586 3.334 3.477-.583 1.387 2.205 2.076 3.368 3.084 8.134 7.046 18.135 13.116 27.43 18.475.962-.2 18.717-33.717 18.841-34.23.098.046 3.96-1.452 5.338-.171 3.87 3.595 9.052 13.11 17.691 16.815 14.27 6.117 31.933 5.354 35.471-3.95 8.418-13.204 10.394-29.534 9.922-44.873-.23-11.349 1.251-22.617-.158-33.96 1.864-11.206 1.725-22.596 2.127-33.934a98.806 98.806 0 00-.274-3.461c-2.623-16.465.276-33.404-4.232-49.645-1.98-10.812-7.548-20.7-17.338-26.265-8.371-7.956-18.787-13.807-30.316-15.543-2.93-.4-18.761 3.912-21.759 3.678-3.025-.236 6.782-5.016 3.731-5.03zm3.471 40.106c14.083-.017 11.448 16.378 9.322 26.215-3.805 11.486-1.664 23.497 2.94 34.414.69 5.29-3.358 9.316-5.028 13.962.074 12.463-.094 24.925.014 37.387-.111 10.396 3.112 20.79-.467 31.053.408 5.937-4.074 8.603-8.348 8.844-8.917.503-7.912-.636-8.849-6.643-1.239-12.292-1.535-24.925-.545-37.474-.42-3.201-6.047-4.982-6.203-8.198-.217-4.483 4.122-8.204 5.48-13.021 1.614-5.723.342-12.554.748-17.873 2.042-12.497-6.028-24.99-.392-37.201 1.537-10.047-3.765-31.612 11.328-31.465zm29.668 149.482c.438 5.484-4.42 8.843-7.527 13.611L225 253.877zM175.262 252.9l-.506 6.06h-2.777l-1.01-4.798c3.95-4.02 3.403-1.614 4.293-1.262z"
			/>
			<path
				id="path4779"
				d="M428.29 233.172c-.51 9.668-2.419 19.222-2.113 28.956.84 6.036-1.091 11.443-7.941 12.933-7.547 1.726-11.107 1.982-18.617-.688-10.824-4.145-7.21-28.882-8.41-37.458.515-11.136-4.14-14.257-4.6-28.178.003-9.201-4.939-24.316-4.939-24.316.16-11.185-2.742-3.995-5.197-1.127-3.545 4.144-19.68-.803-24.98-2.065-10.034 3.042-8.045 16.46-8.431 24.68-4.052 8.22-.203 17.104.576 25.727.236 12.236-.454 24.67-1.64 36.863-2.695 5.497-7.938 7.809-13.71 6.842-8.33-.398-19.08 2.055-24.283-6.314-5.918-9.59-.508-20.62-.057-30.741-2.132-8.794 2.19-17.646.995-26.355-1.985-9.064-4.4-18.135-3.718-27.491V60.03c4.283-10.202 13.742-6.292 20.857-2.147 10.063 3.935 15.285-8.684 25.317-6.558 11.121-.524 21.97 2.71 32.997 3.33 12.366-1.673 24.726 4.303 34.174 11.88 8.232 6.754 8.324 18.117 11.415 27.495 2.505 8.974 2.524 18.682-1.326 27.263-2.687 9.522 4.138 19.414-3.491 27.821-4.364 6.74-16.49 13.146-10.9 22.463 5.62 5.81 12.467 11.314 14.234 19.71 3.676 9.488 1.379 19.678 1.71 29.458.521 4.168 1.349 8.297 2.077 12.427zm-43.286-115.335c.01-10.124 1.061-21.868-7.052-29.427-8.866-4.416-18.997-6.263-27.856-11.118-10.653-1.426-9.672 14.274-10.119 21.616-1.263 7.042 4.239 12.192 2.579 19.52.198 6.817.099 13.635-2.514 20.074-5.071 9.954 7.98 13.868 15.36 14.801 11.516.22 26.144-4.395 29.07-17 1.138-6.085.33-12.315.532-18.466zm26.809 129.019c2.68-6.408-4.179-2.752 0 0z"
			/>
			<path
				id="path4781"
				d="M591.657 266.963c-2.487 13.445-17.042 4.727-25.675 8.238-11.267 4.752-16.06-7.433-14.137-16.477-3.184-8.226-6.76-18.075-15.203-23.039-12.118-.658-24.399.463-36.583.559-12.225 2.335-12.072 16.275-12.846 25.971-.509 10.93-11.284 16.385-20.988 13.627-9.874 1.057-18.249-6.746-16.974-16.762 3.11-22.016 8.475-43.721 13.069-65.485 4.301-23.98 6.555-48.526 13.792-71.848 2.372-5.422 9.764-8.338 10.543-14.033-3.509-8.377-8.085-17.007-3.893-26.094 2.839-9.554-2.16-23.075 4.95-30.653 8.512-3.567 23.91.694 32.943.476 9.655 1.527 21.116-2.693 28.868 5.27 5.61 7.031 4.436 16.983 6.188 25.43 2.33 17.453 9.596 34.592 6.903 52.45 6.078 8.464.141 21.507 8.412 30.02 5.405 11.744 3.48 25.345 7.506 37.561 3.874 14.909 6.787 30.03 8.552 45.328 1.218 6.563 3.13 12.957 4.573 19.46zM533.85 72.876c1.294 6.312-14.616.068-13.684 5.864 3.898 4.204 14.024.35 13.684-5.864zm2.792 123.713l-15.638-80.428c-2.777.639-8.17-1.869-7.748 2.619l-14.314 76.971c2.69 12.308 16.36 8.187 25.413 9.495 6.1 1.94 10.069-3.707 12.287-8.657z"
			/>
			<path
				id="path4783"
				d="M746.647 70.083v4.468q0 3.91-.28 8.937-.279 5.027-.558 10.333-.28 5.026-.838 8.657 0 .837-.559 2.513-.279 1.676-.837 3.351-.28 1.676-.838 3.351-.28 1.397-.28 2.234 0 .559.56 2.793.558 1.955 1.116 4.189l1.117 4.468q.559 1.955.559 2.793v122.316q0 .559-.28 2.514-.279 1.954-.837 4.747-.559 2.513-1.117 5.306-.559 2.793-1.397 4.747-.558 1.397-2.234 3.072-1.675 1.676-3.35 1.955-2.235.28-5.307.838l-6.144.558q-2.792.28-5.026.559-2.234.28-2.793.28-10.333 0-15.08-5.865-4.747-6.144-9.216-20.107-3.072-9.495-6.981-21.782-3.91-12.567-8.378-26.251-4.189-13.684-8.936-27.647-4.748-14.242-8.937-27.088-.558-2.234-1.675-2.234-.838-.28-2.234-.28-3.072 0-4.19.838-.837.559-1.396 5.027l-.837 84.616q-.559 1.117-.559 3.351.28 2.234 0 4.468-1.117 6.703 0 11.17 1.396 4.19 1.396 9.496 0 4.189-1.675 6.702-1.676 2.513-4.19 3.91-2.513 1.117-5.305 1.396-2.793.28-5.027.28-7.82 0-12.567-.839-4.468-.837-6.702-3.35-2.234-2.514-3.072-6.982-.558-4.468-.558-11.45v-5.864q0-2.514.279-5.027.28-2.513.838-5.585.838-3.351 2.234-8.657.558-1.955.558-4.19l.559-4.468q.558-.558 1.117-.837.838-.559 1.396-1.117 0-1.117-1.117-1.955-1.117-.838-2.234-1.397-2.234-5.585-3.351-12.846-1.117-7.54-1.117-13.125 0-.558.558-4.468.559-4.189 1.117-8.657.838-4.748 1.397-8.657.558-3.91.558-4.748 0-.558-.558-2.513-.28-1.955-.838-3.91-.559-2.234-1.117-4.189-.28-1.954-.28-2.513V128.17v-3.63q0-3.631-.279-8.379 0-5.026-.279-10.611 0-5.586-.28-10.612V86.56v-3.91-5.585q.28-4.468 1.118-7.54 0-.28.558-2.234l1.676-4.468q1.117-2.514 2.234-4.19 1.396-1.954 2.514-1.954 1.396 0 4.188 1.675 2.793 1.676 4.19 1.676 1.396 0 3.909-.28 2.793-.558 4.468-1.116 1.955-1.117 4.748-4.19 2.792-3.35 5.585-4.468 1.117-.558 1.955-.279h2.513q4.468 0 10.053 2.514 5.865 2.234 8.658 10.053 2.234 6.423 5.585 17.035 3.63 10.612 7.26 22.9 3.91 12.287 7.82 25.133 4.189 12.846 7.82 23.737 0 .28.558 1.955.558 1.396 1.675 1.396h5.586q1.396-2.234 1.675-5.026.28-2.793.28-5.586 0-3.072-.28-5.864 0-2.793.838-5.027l-.838-48.87q.559-5.586.838-12.567.28-6.982.28-13.963 0-1.397 3.071-4.19 3.072-3.071 4.748-3.35 2.234-.559 5.864-.28h10.053q3.91-.279 6.423.28 3.63.837 5.586 3.63 1.955 2.513 2.513 5.864.559 3.072.559 6.144v4.468z"
			/>
			<path
				id="path4785"
				d="M903.033 221.164q0 14.242-4.748 25.133-4.747 10.892-13.125 18.432-8.099 7.26-19.269 10.89-11.17 3.91-24.016 3.91-3.91 0-6.982-1.117t-5.585-2.513q-2.514-1.117-4.468-2.234-1.676-1.117-3.352-1.117h-17.314q-1.955 0-5.585-3.072l-6.982-6.981q-3.63-3.91-6.423-7.261-2.513-3.351-2.792-3.91-1.117-1.955-2.514-5.306-1.117-3.351-1.675-5.864-.559-2.235-1.117-5.306-.28-3.072-.559-5.865-.279-2.792-.558-5.027V108.063q0-4.468.838-10.333.837-6.144 2.792-12.008 1.955-6.144 5.027-11.17 3.072-5.306 7.54-8.1 2.234-1.395 4.189-3.63 2.234-2.234 4.189-3.35.838-.56 2.234-1.676 1.675-1.117 2.513-1.397 3.351-1.396 7.261-2.513 3.91-1.396 5.306-1.396 1.117 0 2.234.838 1.117.558 2.513.558 1.397 0 1.676-.28.28-.278.838-.837 1.955 0 5.306-.28 3.35-.558 6.702-.837 3.351-.558 6.144-.838 2.792-.279 3.351-.279 3.63 0 7.82.838 4.188.558 7.819 1.675 3.63 1.117 6.143 2.514 2.514 1.117 2.793 2.234.28.838.559 2.513.558 1.396 1.675 3.072-.838 1.117-1.396 3.072-.28 1.675 0 3.63.558 1.676 1.675 3.072 1.397 1.117 3.63 1.117 1.397 0 2.235-.279.838-.559 1.955-.559t5.306 2.235q4.189 2.234 7.26 3.63.838 1.955 2.235 4.747 1.396 2.514 2.513 5.306 1.117 2.514 1.955 4.469.838 1.954.838 2.792 0 .559-.838 2.513-.559 1.676-1.397 3.63-.558 1.676-1.396 3.631-.558 1.676-.558 2.234 0 1.397.279 3.352.28 1.675.558 3.071.28 1.117 1.676 2.234 1.676 1.118 1.676 2.514 0 2.513-1.676 4.189-1.396 1.396-3.351 2.513-1.955.838-3.91 1.117-1.675.28-2.234.28-1.396 0-3.91-.28-2.513-.558-4.468-.558-.838-2.793-.838-6.423-2.513-1.117-5.306-1.955-2.792-.838-5.026-2.234.279-2.514-.838-3.91-.838-1.676-2.513-2.793-1.397-1.396-3.072-2.513-1.397-1.396-1.955-3.351-.559-1.676-.559-4.189 0-2.793-1.117-4.747-1.955-3.072-5.026-6.703-2.793-3.91-5.865-6.143-.838-.559-2.513-.28h-3.072q-7.54 0-10.891 1.397-3.351 1.117-5.306 2.513l-3.91 2.793q-1.676 1.117-5.864 1.117-5.865 0-7.54-3.352-1.397-3.35 0-8.936 0-.558-.838-1.117-.559-.838-1.117-1.396h-1.955q-.838 1.955-1.676 4.747-.838 2.793-.838 3.91 0 1.396 1.955 2.513 1.955.838 2.793 2.234.558 1.397 1.396 3.072.838 1.676.838 3.072 0 1.117-1.396 2.513-1.397 1.117-1.397 2.514 0 1.117 1.117 4.468 1.118 3.072 1.955 5.306.559 1.396 1.955 3.072 1.676 1.675 3.072 3.91 1.117 1.675 1.396 4.468.28 2.513 0 5.306-.279 2.513-.558 5.306-.28 2.792-.559 4.747-.838 10.612-1.117 17.593 0 6.982.559 9.495.558 3.072 1.117 7.261.558 4.19 1.117 8.099.838 4.747.558 8.098-.279 3.072-.837 5.865-.28 2.792-.838 5.585-.559 2.793-.559 6.144 0 1.117.28 3.63.558 2.234.837 4.19.838 5.305.838 11.449 0 5.864 1.676 11.45.558 1.954 2.513 3.91 1.955 1.954 4.189 3.909 2.513 1.675 4.747 3.072 2.514 1.117 4.19 1.396.837.28 1.954.28h7.261q2.513 0 4.747-1.118 2.514-1.117 5.027-3.35 2.513-2.514 5.585-7.262 1.397-2.513 1.955-6.143.838-3.63.838-6.982.28-3.63.28-6.144v-3.35-1.397-2.793q0-2.234-.28-6.143-.28-3.91-.559-10.892 0-2.234-2.234-3.91-2.234-1.675-5.306-3.35-2.792-1.676-5.864-3.63-2.793-1.956-3.91-5.028-.558-1.396-.28-3.35l.56-4.469q-.56-1.117-1.676-2.793-.28-1.117-.28-2.234.28-1.117.28-2.234 1.396-1.117 3.63-2.234 2.514-1.396 3.91-1.396 1.396 0 2.793.838 1.396.558 2.792.558 1.955 0 3.072-.558l2.793-1.117q1.396-.559 3.35-1.117 2.235-.559 5.586-.559 1.396 0 5.027.838 3.63.558 5.026.558.559 0 1.955-.279l3.351-1.117q1.676-.558 3.352-.838 1.675-.558 2.513-.558 1.117 0 2.513.838 1.676.837 3.072 1.954 1.676.838 2.793 2.234 1.117 1.118 1.117 1.955zm-20.386-31.557q0-1.396-.28-1.396 0-.28-.558-.559-1.117 0-1.676.28-.558.279-.837.279 1.117 2.793 2.234 3.91l.837-.838q.28-.28.28-1.676zm2.234 6.982l-2.514-2.234q-1.396.837-1.396 2.234.28 1.117.559 1.675.558 0 1.675-.558 1.117-.559 1.676-1.117z"
			/>
			<path
				id="path4787"
				d="M1050.762 270.035c-3.279 7.421-11.512 9.298-18.815 7.801-13.984-.225-27.952-2.079-41.924-1.78-9.24 1.838-18.586 2.355-27.979 1.64-8.419-.727-17.073.465-25.325-1.5-6.968-2.708-7.92-11.01-7.368-17.544l.77-81.612c4.355-8.371 3.41-17.525.838-26.215-2.86-13.096-1.253-26.602-1.676-39.903.093-16.193-.186-32.41.14-48.588 2.262-10.664 13.797-10.42 22.41-10.385 8.447.412 16.208 11.926 24.506 6.336 5.646-3.48 37.285-4.342 43.998-3.852 9.164-.232 11.153-7.195 12.867 27.977 0 0-1.048-28.682 4.672-28.64 11.534 2.488 11.855 13.793 12.258 22.806-.2 5.814 1.518 12.606-3.561 16.965-2.698 4.66-7.831 4.807-12.544 4.468-14.74.139-29.518-.277-44.233.21-12.197 5.383.025 16.404-2.426 25.203-.765 6.633 2.12 14.769 9.17 16.477 6.837.234 13.836-.469 20.57.349 6.867 4.154 8.934 11.348 7.96 18.886-.533 5.747 1.453 12.17-1.396 17.348-2.912 5.109-7.991 7.722-13.707 6.702-4.632.184-9.384-.37-13.94.28-5.31 2.792-9.368 7.86-8.099 14.03v26.462c3.636 10.382 15.868 9.597 24.824 9.844 9.776.244 19.607.562 29.353-.349 5.75 1.764 10.111 6.47 8.657 12.59z"
			/>
		</g>
		<g id="is" aria-label="is" >
			<path
				id="path4837"
				d="M175.872 388.06h-12.84v-48.917h12.84zm-13.428-61.576q0-2.984 1.9-4.883 1.898-1.9 5.063-1.9t5.063 1.9q1.9 1.899 1.9 4.883 0 2.938-1.9 4.882-1.853 1.944-5.063 1.944t-5.11-1.944q-1.853-1.944-1.853-4.882z"
			/>
			<path
				id="path4839"
				d="M207.43 374.95q0-1.628-1.583-2.984-1.537-1.402-6.918-3.753-7.911-3.21-10.895-6.646-2.94-3.436-2.94-8.545 0-6.42 4.612-10.579 4.657-4.205 12.298-4.205 8.047 0 12.885 4.16 4.838 4.16 4.838 11.167h-12.795q0-5.968-4.973-5.968-2.035 0-3.346 1.266t-1.311 3.526q0 1.628 1.447 2.894 1.446 1.22 6.826 3.526 7.822 2.894 11.032 6.466 3.255 3.526 3.255 9.177 0 6.556-4.928 10.535-4.928 3.978-12.93 3.978-5.38 0-9.494-2.08-4.115-2.125-6.466-5.877-2.305-3.753-2.305-8.093H195.9q.09 3.346 1.538 5.019 1.491 1.672 4.837 1.672 5.154 0 5.154-4.656z"
			/>
		</g>
		<g id="new" aria-label="new" >
			<path
				id="path4830"
				d="M171.817 492.572l.361 4.838q4.34-5.742 11.348-5.742 12.614 0 12.976 17.678v32.145h-12.84v-31.196q0-4.16-1.266-6.013-1.22-1.899-4.34-1.899-3.481 0-5.425 3.572v35.536h-12.84v-48.919z"
			/>
			<path
				id="path4832"
				d="M225.437 542.395q-9.856 0-15.372-5.878-5.516-5.877-5.516-16.818v-3.888q0-11.574 5.064-17.859 5.064-6.284 14.513-6.284 9.223 0 13.88 5.923 4.656 5.877 4.747 17.451v6.284h-25.454q.271 5.426 2.396 7.958 2.125 2.486 6.556 2.486 6.42 0 10.715-4.385l5.018 7.73q-2.35 3.256-6.827 5.29-4.476 1.99-9.72 1.99zm-8.048-30.02h12.795v-1.176q-.09-4.385-1.447-6.646-1.356-2.26-4.702-2.26-3.345 0-4.882 2.396-1.492 2.396-1.764 7.686z"
			/>
			<path
				id="path4834"
				d="M285.613 520.015l4.385-27.443h12.252l-10.127 48.919h-10.625l-6.917-28.302-6.917 28.302h-10.67l-10.127-48.919h12.297l4.34 27.489 6.51-27.489h9.088z"
			/>
		</g>
		<g id="the" aria-label="the" >
			<path
				id="path4823"
				d="M174.981 410.744v12.026h6.556v9.63h-6.556v24.279q0 2.893.77 3.978.813 1.085 3.073 1.085 1.854 0 3.03-.316l-.09 9.946q-3.256 1.22-7.054 1.22-12.388 0-12.523-14.195V432.4h-5.652v-9.63h5.652v-12.026z"
			/>
			<path
				id="path4825"
				d="M201.023 427.065q4.16-5.199 10.218-5.199 6.69 0 10.172 4.702 3.481 4.702 3.527 14.016v31.105H212.1v-30.97q0-4.295-1.357-6.194-1.31-1.944-4.295-1.944-3.48 0-5.425 3.21v35.898h-12.795v-69.444h12.795z"
			/>
			<path
				id="path4827"
				d="M253.875 472.593q-9.856 0-15.372-5.878-5.516-5.877-5.516-16.818v-3.888q0-11.574 5.064-17.858 5.063-6.285 14.512-6.285 9.223 0 13.88 5.923 4.657 5.877 4.747 17.451v6.285h-25.453q.27 5.425 2.396 7.957 2.125 2.486 6.555 2.486 6.42 0 10.715-4.385l5.019 7.73q-2.351 3.256-6.827 5.29-4.476 1.99-9.72 1.99zm-8.048-30.02h12.795v-1.176q-.09-4.385-1.447-6.646-1.356-2.26-4.702-2.26t-4.883 2.396q-1.492 2.396-1.763 7.686z"
			/>
		</g>
		<g
			id="black"
			fill="#ff6600"
			aria-label="black"
			
		>
			<path
				id="path4792"
				d="M605.342 531.054c.475 6.204-2.152 15.9-9.544 16.088h-88.57c-5.971-3.342-5.67-9.49-3.099-14.572-3.187-7.646-5.9-15.73-5.34-24.198.251-12.058 1.036-24.097 1.846-36.134 3.708-5.676-1.46-14.495.989-21.462-2.546-8.521.207-17.271-.791-25.88-1.926-6.39-.759-13.264-1.226-19.883-.151-19.234-.872-38.482-.406-57.708-.41-7.84 7.615-13.39 14.934-11.688 6.777.292 14.937-1.664 19.6 4.748 2.364 6.91 4.824 14.329 5.86 22.068.702 13.164.058 26.375-.651 39.517-2.116 7.507-5.73 14.864-3.495 22.814.02 8.795 5.165 16.507 2.374 25.32-3.707 7.027 1.845 13.41 1.78 20.374.68 13.142.174 26.333.33 39.496 2.389 6.762 10.138 8.18 16.455 7.649 5.718.131 11.49-.264 17.173.198 5.044 3.028 12.442 2.333 18.127.749 6.996-3.672 15.177 3.644 13.654 11.024v1.48z"
			/>
			<path
				id="path4794"
				d="M758.58 536.593c-2.349 12.698 2.119 3.035-6.035 6.352-11.9-11.074-20.043-27.446-35.924-37.32-11.445-.622-33.044 1.865-44.55 1.955-11.547 2.206-11.402 15.371-12.133 24.529-.48 10.323-10.657 15.474-19.822 12.87-9.326.998-17.235-6.372-16.031-15.831 2.937-20.793 8.004-41.293 12.342-61.847 4.063-22.649 6.192-45.83 13.027-67.857 4.36-6.555 14.298-11.477 7.319-20.045-5.072-7.364-1.422-15.838.424-23.605 2.47-8.033 3.209-20.665 13.258-22.369 12.86-1.406 25.806.34 38.672-.05 10.946.687 14.347 11.982 14.534 21.21 1.352 19.158 10.194 37.574 7.489 56.992 5.74 7.994.133 20.312 7.945 28.352 5.104 11.092 3.287 23.937 7.088 35.474 3.66 14.08 6.41 28.362 8.077 42.81 1.15 6.198 2.956 12.237 4.32 18.38zm-54.596-183.305c-5.885-6.314-16.029-3.777-12.924 5.54 3.682 3.97 13.245.329 12.924-5.54zm2.637 116.84l-14.77-75.959c-2.623.603-7.716-1.765-7.317 2.473l-13.519 72.695c2.541 11.624 15.452 7.732 24.001 8.967 5.76 1.834 9.51-3.5 11.605-8.176z"
			/>
			<path
				id="path4796"
				d="M896.782 481.733c-1.056 13.995-.235 29.507-8.555 41.573-6.577 6.494-12.825 14.152-21.48 17.853-8.306.316-16.058 4.069-24.429 4.665-10.68 1.268-21.172-1.705-31.155-5.098-11.75-.667-20.303-10.16-26.54-19.216-7.309-12.589-9.085-29.022-1.533-41.953 4.383-8.233-7.145-15.345-5.637-24.314-1.53-12.07 10.256-21.854 7.335-34.073-1.815-5.791-8.882-9.106-6.956-16.466.212-10.397.284-20.798.33-31.206 1.575-8.973 4.053-18.535 10.22-25.485 9.346-5.754 17.683-13.781 28.452-16.78 8.21.798 16.423 4.344 24.363 1.55 5 4.689 10.977-1.84 17.012 1.45 10.407-2.383 18.605 6.74 25.023 13.566 10.683 12.066 8.178 22.947 12.965 38.367-6.426 4.846 1.526.05-7.287 3.407-5.136-25.407-17.531-20.327-29.491-23.869-7.898-2.338-13.014-5.843-19.87-6.086-5.638-.486-13.896.408-16.827-.239-2.423 8.89-8.442 17.448-7.487 26.878-.229 4.169-1.539 8.251-1.006 12.69.132 7.512-.844 15.234 2.308 22.322 2.136 6.763.706 14.016 1.12 21.012-.083 5.543.17 11.11-.131 16.638-3.625 5.374.792 14.866-1.055 18.924 1.025 5.824-1.635 13.139.412 19.517 1.659 8.678 8.382 18.841 18.38 17.54 7.901-.675 17.919 12.795 23.374 2.554 4.893-7.593.556-16.467.05-24.627-.244-7.354-.039-14.979 2.093-22.04 3.992-7.969 13.124-6.819 20.527-6.461 7.186-1.094 15.926 3.07 15.557 11.341-.147 2.019-.058 4.044-.082 6.066z"
			/>
			<path
				id="path4798"
				d="M1051.074 538.439c-.441 7.52-8.51 8.726-14.5 8.879-6.745-.148-14.345 2.508-20.315-1.758-7.06-6.568-9.597-16.466-14.163-24.75-7.237-15.365-13.942-30.975-20.915-46.462-5.707-8.416-16.115-.668-16.336 7.534-2.338 14.773-.807 29.811-.952 44.717-.338 5.744 1.766 12.305-3.02 16.851-7.158 6.622-18.534-2.627-26.64 4.22-5.617-1.858-12.495-6.112-11.077-12.941.109-25.202-.217-50.421.165-75.612 2.91-8.12 8.177-16.323 1.237-24.397-2.277-9.188-.994-18.773-1.665-28.124-.72-8.284 4.47-15.972 2.637-24.295-3.883-9.89-2.178-20.5-2.262-30.822-.287-8.932 5.447-18.748 15.683-16.125 6.017.305 12.277-.711 18.097.725 5.069 2.816 8.083 7.699 6.99 13.412-.132 12.535.262 25.116-.199 37.623-3.962 7.652-.211 16.375.198 24.462 4.53 7.306 12.214.83 12.133-6.066 7.921-13.504 15.982-26.933 22.748-41.078 5.596-9.318 9.813-20.4 18.99-26.82 7.223-2.167 15.095-1.316 22.585-2.258 8.538-1.057 13.67 10.162 5.454 14.753-2.948 8.205-7.66 15.078-15.577 19.468-2.298 7.594-2.014 16.409-7.979 22.484-5.503 9.104-10.09 18.738-16.27 27.43-6.825 8.147-2.694 18.454 1.706 26.544 2.386 7.322 9.331 14.223 9.164 21.773-4.508 7.029-7.957 18.82 4.098 20.01 10.341 4.003 14.025 14.825 18.479 23.968 4.218 8.711 8.029 17.63 11.506 26.655z"
			/>
			<path
				id="path4799"
				d="M416.688 437.757l3.49 1.655c.552-1.633-.432-1.832-1.843-1.633l-1.647-.022zm27.779 66.418l14.394 11.87-10.353-11.87h-4.041zm-15.36 3.094l5.536 3.75c-.925-1.036-1.645-2.413-2.69-3.248l-2.846-.502zm11.319 2.21l-.252 4.04 4.293 1.01 1.01-4.041-5.051-1.01zm-19.95.251l.504 6.06 5.305-3.029-5.808-3.03zm10.774 2.004c-.46.953-2.007 2.095-.333 2.675l4.618 3.575-4.285-6.25zm-18.855 2.795l-2.02 3.283 4.797 3.535v-4.04l-2.777-2.778zm14.646 1.01c-.677 1.004-.89 2.5-1.869 3.183-3.387 1.114 3.022.658 4.162 1.152 2.299.164 6.625.97 7.718.791l-10.011-5.126zm47.22-28.53c-.313 12.705-.315 25.957-4.963 37.946-6.027 9.963-17.786 13.685-28.484 16.072-10.214 5.125-21.847 4.069-32.93 4.27H353.2c-4.84-2.784-10.174-7.682-8.916-13.79.33-17.401.35-34.824.872-52.213 2.592-6.409 2.328-14.094-.135-20.48l-.788-111.064c-.093-6.748 2.955-15.594 10.996-15.585 19.717.001 39.525-1.55 59.16.634 9.191 5.354 19.935 2.613 29.54 5.983 10.013 1.487 11.212 12.962 17.144 19.254 6.754 7.544 8.36 17.785 8.328 27.545.422 11.336.877 24.355-8.23 32.738-3.511 4.068-10.222 8.025-8.274 14.16 4.338 5.687 9.856 10.388 14.901 15.363 6.944 11.832 5.168 26.061 6.462 39.166zm-52.223-87.829v-16.616c-1.424-6.811-9.419-10.835-16.035-12.614-8.614.46-19.76 5.84-15.136 16.109 1.25 8.897 5.064 24.461-6.808 27.364-5.108 11.098 8.891 13.782 15.495 7.273 6.962-4.36 14.715-8.293 20.176-14.46-.032-2.802 1.322-6.037 2.308-7.056zm0 93.63c-.132-10.236.264-20.517-.198-30.726-3.38-6.718-11.847-12.808-19.369-11.935-10.724 3.043-10.849 12.941-10.516 22.452-.735 9.377.355 18.747.544 28.122 5.682 5.196 14.967 9.063 21.363 2.637 5.283-2.228 6.767-7.327 8.176-10.55zm10.307 27.78a2.778 3.03 0 01-2.778 3.03 2.778 3.03 0 01-2.778-3.03 2.778 3.03 0 012.778-3.03 2.778 3.03 0 012.778 3.03z"
			/>
		</g>
	</g>
</svg>

:root {
  --animation-duration: 0.75s;
}

body {
  height: 100vh;
  margin: 0;

  display: grid;
  grid-template-columns: 2fr 2fr;
  align-items: center;

  background-image: url("img/bg.webp");
  background-position: right top;
  background-repeat: no-repeat;
}

#logo {
  cursor: pointer;
}

#bar2 {
  animation-delay: 0.2s;
}

@keyframes close {
  to {
    transform: translateX(90%);
  }
}

.close-animation {
  animation: close var(--animation-duration) forwards;
}

#writing {
  opacity: 0;
}

@keyframes appear {
  to {
    opacity: 1;
  }
}

.appear-animation {
  animation: appear 0.1s forwards;
  animation-delay: 0.7s;
}

button {
  position: fixed;
  top: 0.75rem;
  right: 0.75rem;

  width: calc(1.5rem + 2vw);
  height: calc(1.5rem + 2vw);

  background-color: black;
  border-radius: 50%;
  border: none;

  cursor: pointer;
}

button svg {
  position: absolute;
  top: 10%;
  right: 10%;

  width: 80%;
  height: 80%;
}

button path {
  fill: orange;
}

.hide {
  display: none;
}

let closeAudio = new Audio("audio/jail-close.mp3");

let muteButton = document.querySelector("button");
let muteOnIcon = muteButton.querySelector(".mute-on");
let muteOffIcon = muteButton.querySelector(".mute-off");

let bars = document.querySelectorAll(".moving-bar");
let writing = document.querySelector("#writing");
let logo = document.getElementById("logo");

let timeout;

function init() {
  closeAudio.muted = true;
  closeAudio.playbackRate = 1.5;
  playAudio();

  muteButton.addEventListener("click", toggleMute);
  logo.addEventListener("click", replay);
}

function replay() {
  clearTimeout(timeout); // in case it hasnt run yet
  reset();

  timeout = setTimeout(() => {
    bars[0].classList.add("close-animation");
    bars[1].classList.add("close-animation");
    writing.classList.add("appear-animation");

    playAudio();
  }, 20);
}

function toggleMute() {
  // initiate playing the song if it was blocked
  if (closeAudio.currentTime === 0) {
    playAudio();
    closeAudio.pause();
  }

  muteOnIcon.classList.toggle("hide");
  muteOffIcon.classList.toggle("hide");

  closeAudio.muted = !closeAudio.muted;
}

function reset() {
  stopAudio();

  bars[0].classList.remove("close-animation");
  bars[1].classList.remove("close-animation");

  writing.classList.remove("appear-animation");
}

function stopAudio() {
  closeAudio.pause();
  closeAudio.currentTime = 0;
}

function playAudio() {
  try {
    closeAudio.play();
  } catch (error) {
    console.error(error);
  }
}

init();