@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');


		body {
			background-color: #5d5757;
			margin: 0;
			padding: 0;
		}



		.tab {
			position: absolute;
			width: 20px;
			height: 70px;
			background: royalblue;
			color: white;
			display: flex;
			align-items: center;
			justify-content: center;
			font-weight: bold;
			border-radius: 12px;
			filter: drop-shadow(3px 4px 4px rgba(0, 0, 0, 0.4));
			corner-shape: bevel;
      clip-path: polygon(
    10px 0%, calc(100% - 10px) 0%, 
    100% 10px, 100% calc(100% - 10px), 
    calc(100% - 10px) 100%, 10px 100%, 
    0% calc(100% - 10px), 0% 10px
  );

			transform-style: preserve-3d;

			transform: rotateY(90deg), ;
			transform-style: preserve-3d;
			backface-visibility: hidden;

		}

		@keyframes spin3DOpenVert {
			from {
				transform: rotateY(90deg);
			}

			to {
				transform: rotateY(0deg);
			}
		}

		@keyframes spin3DCloseVert {
			from {
				transform: rotateY(0deg);
			}

			to {
				transform: rotateY(90deg);
			}
		}

		@keyframes spin3DOpenHorz {
			from {
				transform: rotateX(90deg);
			}

			to {
				transform: rotateX(0deg);
			}
		}

		@keyframes spin3DCloseHorz {
			from {
				transform: rotateX(0deg);
			}

			to {
				transform: rotateX(90deg);
			}
		}