/**
 * The story styles
 */

.notification_page_the-story #wpcontent {
	padding-right: 10px;
}

#notification-story {
	max-width: 600px;
	margin: 80px auto 0 auto;

	h1 {
		font-size: 3rem;
		color: #696969;
		line-height: 3rem;
	}

	p {
		font-size: 1.1rem;
	}

	.founder {
		margin-top: 2rem;

		img {
			float: left;
			border-radius: 80px;
			margin-right: 20px;
		}

		.name {
			padding-top: 20px;
			font-size: 1.1rem;
			font-weight: 500;
		}

	}

	.skip {
		clear: both;
		padding-top: 1rem;
		text-align: center;

		a {
			color: #a0a0a0;
			text-decoration: none;

			&:hover {
				text-decoration: underline;
			}

		}

	}

	code {
		font-size: 1.1rem;
		position: relative;
		padding: 6px 10px;
		cursor: pointer;
		white-space: nowrap;
		max-width: 100%;

		span {
			display: none;
			position: absolute;
			right: -60px;
		    top: 3px;
			font-size: 1rem;
			background: #797979;
			padding: 4px 4px;
		    line-height: 1rem;
		    border-radius: 5px;
		    color: white;
		}

		&:hover span {
			display: block;
		}

		@media (max-width: 782px) {
			overflow-x: auto;
		    display: block;

			span {
				display: none;
			}
		}

	}

}
