BEN SEN YOK, BİZ VARIZ.

#BizBirlikteYaparız

Muhittin Böcek

Beklenilmedik bir hata ile karşılaşıldı.

Ana Sayfa'ya yönelendirileceksiniz lütfen bekleyin...

.content
	h1 404
	h2 Oh no, you tore the website!
.tear
	pre
		code.language-pug.
			.content
				h1 404
				h2 Oh no, you tore the website!
				.tear
				pre
				code.language-pug.
	pre
		code.language-sass.
			$tear-height: 7px
			$tear-base-height: 250px
			$color-bg: #eee
			$color-tear: #0d0d13

			*
				margin: 0
				padding: 0
				border: none
			body
				background-color: $color-bg
				font-family: 'Source Sans Pro', Arial, sans-serif
				font-weight: 300
				font-size: 18px
			.content
				max-width: 800px
				margin: 30px auto
			h1
				font-size: 3rem
			h2
				font-size: 2rem

			pre
				background-color: $color-tear !important
				border-radius: 0 !important
				flex-basis: 33%
				margin: 0 !important
				overflow: hidden !important

			.tear
				display: flex
				background-color: $color-tear
				height: $tear-base-height
				position: relative
				margin: 30px 0 100px
				&:before, &:after
					display: block
					height: $tear-height
					width: 100%
					content: ""
					position: absolute
				&:before
					background-color: $color-bg
					top: 0
					left: 0
					clip-path: polygon(0% 0%, 2.5% 25%, 5% 58%, 7.5% 29%, 10% 44%, 12.5% 74%, 15% 59%, 17.5% 95%, 20% 75%, 22.5% 19%, 25% 65%, 27.5% 69%, 30% 52%, 32.5% 72%, 35% 2%, 37.5% 40%, 40% 14%, 42.5% 37%, 45% 44%, 47.5% 52%, 50% 21%, 52.5% 9%, 55% 30%, 57.5% 48%, 60% 14%, 62.5% 93%, 65% 13%, 67.5% 86%, 70% 53%, 72.5% 14%, 75% 60%, 77.5% 10%, 80% 27%, 82.5% 32%, 85% 84%, 87.5% 83%, 90% 97%, 92.5% 90%, 95% 98%, 97.5% 38%, 100% 0%)
				&:after
					background-color: $color-tear
					bottom: -$tear-height
					left: 0
					clip-path: polygon(0% 0%, 2.5% 73%, 5% 67%, 7.5% 61%, 10% 50%, 12.5% 88%, 15% 65%, 17.5% 69%, 20% 31%, 22.5% 25%, 25% 83%, 27.5% 59%, 30% 46%, 32.5% 80%, 35% 4%, 37.5% 58%, 40% 84%, 42.5% 37%, 45% 5%, 47.5% 7%, 50% 57%, 52.5% 32%, 55% 84%, 57.5% 20%, 60% 88%, 62.5% 16%, 65% 25%, 67.5% 16%, 70% 26%, 72.5% 61%, 75% 11%, 77.5% 98%, 80% 12%, 82.5% 55%, 85% 88%, 87.5% 47%, 90% 67%, 92.5% 44%, 95% 76%, 97.5% 68%, 100% 0%)

			.ref
				font-family: Arial, sans-serif
				background-color: #404
				border-radius: 3px
				padding: 5px 10px
				position: fixed
				font-size: 13px
				bottom: 10px
				right: 10px
				color: #fff
				text-decoration: none
				text-shadow: 0 0 3px rgba(0, 0, 0, .4)
	pre
	

			// Example code for tear polygon
			let str = 'polygon(0% 0%, '
			for(let i = 2.5; i < 100; i+=2.5) str += i + `% ${Math.floor(Math.random()*100)}%, `
			str += '100% 0%)'

// This will hopefully not be a 404 page 
$tear-height: 7px
$color-bg: #eee
$color-tear: #0d0d13

*
	margin: 0
	padding: 0
	border: none
body
	background-color: $color-bg
	font-family: 'Source Sans Pro', Arial, sans-serif
	font-weight: 300
	font-size: 18px
.content
	max-width: 800px
	margin: 30px auto
h1
	font-size: 3rem
h2
	font-size: 2rem

pre
	background-color: $color-tear !important
	border-radius: 0 !important
	flex-basis: 33%
	margin: 0 !important
	overflow: hidden !important

.tear
	display: flex
	background-color: $color-tear
	height: 200px
	position: relative
	margin: 30px 0 100px
	&:before, &:after
		display: block
		height: $tear-height
		width: 100%
		content: ""
		position: absolute
	&:before
		background-color: $color-bg
		top: 0
		left: 0
		clip-path: polygon(0% 0%, 2.5% 25%, 5% 58%, 7.5% 29%, 10% 44%, 12.5% 74%, 15% 59%, 17.5% 95%, 20% 75%, 22.5% 19%, 25% 65%, 27.5% 69%, 30% 52%, 32.5% 72%, 35% 2%, 37.5% 40%, 40% 14%, 42.5% 37%, 45% 44%, 47.5% 52%, 50% 21%, 52.5% 9%, 55% 30%, 57.5% 48%, 60% 14%, 62.5% 93%, 65% 13%, 67.5% 86%, 70% 53%, 72.5% 14%, 75% 60%, 77.5% 10%, 80% 27%, 82.5% 32%, 85% 84%, 87.5% 83%, 90% 97%, 92.5% 90%, 95% 98%, 97.5% 38%, 100% 0%)
	&:after
		background-color: $color-tear
		bottom: -$tear-height
		left: 0
		clip-path: polygon(0% 0%, 2.5% 73%, 5% 67%, 7.5% 61%, 10% 50%, 12.5% 88%, 15% 65%, 17.5% 69%, 20% 31%, 22.5% 25%, 25% 83%, 27.5% 59%, 30% 46%, 32.5% 80%, 35% 4%, 37.5% 58%, 40% 84%, 42.5% 37%, 45% 5%, 47.5% 7%, 50% 57%, 52.5% 32%, 55% 84%, 57.5% 20%, 60% 88%, 62.5% 16%, 65% 25%, 67.5% 16%, 70% 26%, 72.5% 61%, 75% 11%, 77.5% 98%, 80% 12%, 82.5% 55%, 85% 88%, 87.5% 47%, 90% 67%, 92.5% 44%, 95% 76%, 97.5% 68%, 100% 0%)

.ref
	font-family: Arial, sans-serif
	background-color: #404
	border-radius: 3px
	padding: 5px 10px
	position: fixed
	font-size: 13px
	bottom: 10px
	right: 10px
	color: #fff
	text-decoration: none
	text-shadow: 0 0 3px rgba(0, 0, 0, .4)


		// Example code for tear polygon
		let str = 'polygon(0% 0%, '
		for(let i = 2.5; i < 100; i+=2.5) str += i + `% ${Math.floor(Math.random()*100)}%, `
		str += '100% 0%)'