﻿html	{	width: 100.0%; } 
body 	{	width: 100.0%; } 

		*		{	list-style: none; margin: 0; padding: 0; border: 0; border-style: solid; }
img, ul, video	{	display: block; }
		main	{	position: relative; display: block; z-index: 2; width: 100.0%; }

.columns 			{	position: fixed; top: 0; left: 0; width: 100.0%; height: 200.0%; opacity: 0.09; }
.columns > .row 	{	height: 100.0%; }
.columns > .row > *	{	margin: 0; flex: 0 0 1px; background-color: black; }

/* --- Layout --- */

article, 
.sector,
footer			{	position: relative; z-index: 2; width: 100.0%; margin: 0 auto; padding: 9.00vmin 0; }

.smallpage article	{	padding: 60px 0 0; }

	.row		{	position: relative; width: calc(100.0% - 16.00vmin); max-width: 1400px; margin: -4.00vmin auto; display: flex; flex-flow: row wrap; justify-content: space-between; align-content: stretch; align-items: stretch; }
	.row > *	{	margin: 2.00vmin auto; }

article > .row > div				{	min-width: 240px; margin: 4.00vmin 0; }
article > .row > div:nth-child(1)	{	flex: 1 1 33.33%; order: 1; }
article > .row > div:nth-child(2)	{	flex: 1 1 66.66%; order: 2; }
							
	.sector > .row > div	{	flex: 1 1 10.00%; min-width: 240px; }

		.sector > .row > div > div, form,
		article > .row > div > div	{	padding: 3.00vmin; }
							
	/* --- ILLU's --- */
	
	.illu		{	position: relative; width: 100.0%; background-repeat: no-repeat; background-position: top 0.60rem center; background-size: cover; }
	.illu img	{	width: 100.0%; height: 100.0%; }
		 	
/* --- Header --- */

header 	{	position: fixed; top: 0; z-index: 3; width: 100.0%; height: 59px; display: flex; flex-flow: row wrap; justify-content: space-between; align-content: center; align-items: center; 
			background-image: url(../img/KoGW.svg); background-repeat: no-repeat; background-position: center; background-size: auto 21px; border-bottom-width: 1px; border-bottom-style: dotted; }
			
	header	{	-webkit-backdrop-filter:	blur(8px);
				-moz-backdrop-filter:		blur(8px);
				-o-backdrop-filter:			blur(8px);
				-ms-backdrop-filter:		blur(8px);
				backdrop-filter:			blur(8px); }
	
	header > span				{	display: flex; flex-flow: row wrap; }
	header > span:nth-child(1)	{	justify-content: flex-start; margin-left: 8.00vmin; }
	header > span:nth-child(2)	{	justify-content: flex-end; margin-right: 8.00vmin; }
	header > .btn				{	position: absolute; right: 8.00vmin; padding: 0.60em 1.20em; }
	
	
	header > span:nth-child(2) *			{	margin: 0 0.30rem; }
	header > span:nth-child(2) a			{	opacity: 1.00; transition: opacity 300ms ease-in-out 0ms; }
	header > span:nth-child(2) a:hover		{	opacity: 0.42; }
	header > span:nth-child(2) a:last-child	{	margin-right: 0; }

/* --- Nav (mobile) --- */

.nav-hh	{	position: fixed; z-index: 9; top: 0; right: 6.00vmin; width: 60px; height: 60px;
			background-image: url('../img/baseline-menu-24px.svg'); background-repeat: no-repeat; background-position: center; background-size: 30px; }
			
	nav		{	position: fixed; z-index: 8; top: 0; right: -100.0%; width: 100.0%; height: 100.0%; overflow: hidden; display: flex; flex-flow: row wrap; justify-content: flex-end; transition: right 600ms ease-in-out 0ms; }

	nav:before		{	content: ''; position: absolute; top: 0; right: 0; width: 100.0%; height: 100.0%; box-shadow: inset 0 0 0 4.20vmin white; opacity: 0.90;
						background-image: url(../img/illu/illucat_white.png); background-repeat: no-repeat; background-position: left bottom 4.20vmin; background-size: 38.20vmin auto; }

	nav span					{	z-index: 2; margin: 15.00vmin 12.00vmin 12.00vmin -12.00vmin; }
	nav span:first-child 		{	align-self: flex-start; }
	nav	span:first-child > a	{	display: block; }
	nav span:last-child 		{	align-self: flex-end; }
	nav	span:last-child > a		{	opacity: 1.00; display: block; }
		
			body.nav-on			{	position: fixed; }
			.nav-on > .nav-hh	{	background-image: url('../img/baseline-close-24px.svg'); top: 6.00vmin; }
			.nav-on > nav		{	right: 0; }

/* --- Menu --- */

#menu 	{	position: sticky; z-index: 4; top: 0; height: 60px; border-bottom-width: 1px; display: flex; flex-flow: row wrap; justify-content: center; align-content: center; align-items: center; }

	#menu a					{	position: relative; margin: 0 1.20em; padding: 0.60em 0.06em 0.60em; text-align: center; }
	#menu a:before			{	content: ''; position: absolute; bottom: 0; left: 50.00%; width: 0; height: 0.30em; margin: 0 auto; transition: width 300ms ease-in-out 0ms, left 300ms ease-in-out 0ms; background: black; }
	#menu a:hover:before	{	width: 100.0%; left: 0; }
					
/* --- Intro + Start + Thanks --- */

#thanks				{	position: relative; z-index: 1; top: 0; left: 0; height: calc(100.0vh - 60px); overflow: hidden; }
#thanks .row		{	height: 100.0%; justify-content: flex-start; align-content: center; align-items: center; }

#start				{	position: relative; z-index: 1; top: 0; left: 0; height: 100.0vh; padding: 0; overflow: hidden; }
#start .row			{	height: 100.0%; justify-content: flex-start; align-content: center; align-items: center; }

#start span			{	display: block; width: 100.0%; margin-top: 60px; padding: 0; }
#start h1			{	width: calc(100.0% - 6.00vmin); min-width: 300px; margin: 0; }

	#start .row		{	animation-duration: 		3s;
						animation-timing-function: 	ease-in-out; 
						animation-name:				head_on; }
													
						@keyframes head_on {
							00.00% 	{	opacity: 0.0; }
							10.00% 	{	opacity: 0.0; }
							100.0% 	{	opacity: 1.0; }}

#intro	{	position: fixed; z-index: -2; top: 60px; left: 0; height: 100.0vh; padding: 0; overflow: hidden; }

#intro > div		{	position: absolute; top: 0; left: 0; width: 100.0%; height: 100.0%; display: flex; flex-flow: row wrap; justify-content: center; align-content: stretch; align-items: stretch; overflow: hidden; }	
#intro > div:before	{	content:''; z-index: 2; position: absolute; top: 0; left: 0; width: 100.0%; height: 100.0%; opacity: 0.42; }	
	
	#intro > div > video	{	height: auto; min-height: 120.0%; margin: 0 auto; }
	
	#intro > div		{	background-repeat: no-repeat; background-size: cover; }
	#intro > #intro-0	{	background-image: url('../img/intro/intro-0.jpg'); background-position: center left; }
	#intro > #intro-1	{	background-image: url('../img/intro/intro-1.jpg'); background-position: center right; }
	#intro > #intro-2	{	background-image: url('../img/intro/intro-2.jpg'); background-position: center right; }

	#intro > div	{	animation-duration: 		60s;
						animation-iteration-count: 	infinite;
						animation-timing-function: 	ease-in-out; }
						
						#intro-1	{	animation-name:	intro-1; }
						#intro-2	{	animation-name: intro-2; }
												
						@keyframes intro-1 {
							00.00% 	{	opacity: 0.0; }
							28.33% 	{	opacity: 0.0; }
							33.33% 	{	opacity: 1.0; }
							61.66% 	{	opacity: 1.0; }
							66.66% 	{	opacity: 1.0; }
							95.00% 	{	opacity: 0.0; }
							100.0% 	{	opacity: 0.0; }}
							
						@keyframes intro-2 {
							00.00% 	{	opacity: 0.0; }
							28.33% 	{	opacity: 0.0; }
							33.33% 	{	opacity: 0.0; }
							61.66% 	{	opacity: 0.0; }
							66.66% 	{	opacity: 1.0; }
							95.00% 	{	opacity: 1.0; }
							100.0% 	{	opacity: 0.0; }}
							
/* --- Teaser --- */

article > .row > .teaser > div			{	width: 100.0%; height: 100.0%; margin: 0 -1.50vmin; padding: 1.50vmin; display: flex; flex-flow: row wrap; justify-content: space-between; align-content: stretch; align-items: stretch; }
article > .row > .teaser > div > span	{	position: relative; flex: 1 1 200px; display: inline-block; margin: 1.50vmin; }

	.teaser span > a					{	position: absolute; z-index: 2; top: 0; left: 0; width: 100.0%; height: 100.0%; }
	.teaser span > span 				{	position: relative; display: block; }
	.teaser span > span:nth-child(2) 	{	height: 4px; margin-bottom: 1.50em; }
	.teaser span > span:nth-child(3)	{	width: calc(100.0% - 3.00rem); margin-bottom: 0.90em; }
	
		.teaser span > span:nth-child(2):before 		{	width: 2.40em; transition: width 240ms ease-in-out 120ms; content: ''; display: block; height: 100.0%; }
		.teaser span:hover > span:nth-child(2):before 	{	width: 5.20em; transition: width 240ms ease-in-out 0ms; }

/* --- Konkret --- */

#konkret			{	padding: 6.0vmin 0; }

.work				{	position: relative; flex: 1 1 10.00%; min-width: 240px; margin: 2.00vmin; overflow: hidden; }
.work > img			{	width: 100.0%; }

.work > span			{	position: absolute; top: -100.0%; left: 0; width: 100.0%; height: 100.0%; display: flex; flex-flow: row wrap; justify-content: center; align-content: center; align-items: center; }	
.work > span:before		{	position: absolute; top:    0.0%; left: 0; width: 100.0%; height: 100.0%; content:''; opacity: 0.60; }	
.work > span > a		{	z-index: 2; width: 80.00%; opacity: 0.0; }	
.work > span > a span	{	display: block; margin-top: 0.60rem; }

	.work:hover > span, .work:active > span 		{	-webkit-user-select: none; -webkit-touch-callout: none; top: 0; }	
	.work:hover > span > a, .work:active > span > a	{	-webkit-user-select: none; -webkit-touch-callout: none; opacity: 1.0; }	
	
	.work-00 > span			{	top: 0; z-index: 2; width: calc(100.0% - 2.00rem); height: 100.0%; padding: 0 1.0rem; }	
	.work-00 > span:before	{	height: 0; opacity: 1.00; }	
	.work-00 > span > span	{	display: block; margin-top: 1.20rem; }	

				.work			{	transition:	background-size 900ms ease-in-out 0ms; }
				.work:hover		{	transition:	background-size 600ms ease-in-out 0ms; }
				
					.work > span > span			{	transition:	opacity 300ms ease-in-out 300ms; }
					.work:hover > span > span	{	transition:	opacity 300ms ease-in-out 300ms; }
					
						.work > span		{	transition:	top 450ms ease-in-out 0ms; }
						.work:hover > span	{	transition:	top 450ms ease-in-out 300ms;  }
				
							.work> span > a			{	transition:	opacity 300ms ease-in-out 900ms;  }
							.work:hover > span > a	{	transition:	opacity 300ms ease-in-out 900ms;  }
				
/* --- Quote + Kunden --- */

#kunden, #quote 	{	display: flex; flex-flow: row wrap; justify-content: center; align-content: center; align-items: center; }
		
			#quote 	{	width: 80.00%; padding: 7.50vmin 10.00%; }
			#kunden	{	width: 90.00%; padding: 3.00vmin  5.00%; }

#kunden *		{	opacity: 0.80; transition: transform ease-in-out 300ms 240ms; flex: 0 0 9.00rem; height: 5.40rem; margin: 1.50vmin 0.90rem; }
#kunden *:hover	{	opacity: 1.00; transition: transform ease-in-out 300ms   0ms; transform: scale(1.2); }

/* --- ABC --- */

			/* ---- Grid Start---- */
			
						.grid 		{	width: calc(100.0% - 16.00vmin); max-width: 1400px; margin: -4.00vmin auto 0;  }
						.grid:after {	content: ''; display: block; clear: both; }
						
						.grid-item 	{	float: left; }
						
						@media screen and ( min-width:  0	  ) {	.grid-sizer, .grid-item {	width: 100.0%; }}
						@media screen and ( min-width:  767px ) {	.grid-sizer, .grid-item {	width: 50.00%; }}
						@media screen and ( min-width: 1024px ) {	.grid-sizer, .grid-item {	width: 33.33%; }}
						@media screen and ( min-width: 1025px ) {	.grid-sizer, .grid-item {	width: 33.33%; }}
				
			/* ---- Grid Ende---- */
	
.abc					{	margin-bottom: 9.00vmin; }	
.abc div 				{	}	
.abc div > div			{	}	
.abc div > div > div	{	position: relative; margin: 3.00vmin; }	

.abc .grid-item span	{	display: inline-block; float: right; padding-left: 1.20em; opacity: 0.24; }

.navi-abc						{	position: fixed; z-index: 3; bottom: 0; right: 0; width: 1.50em; height: calc(100.0% - 60px); display: flex; flex-flow: row wrap; justify-content: center; }
.navi-abc > div					{	flex: 1 0 100.0%; height: auto; align-self: center; border-radius: 3px 0 0 3px; background: white; border-width: 1px 0 1px 1px; }
.navi-abc > div > a 			{	display: block; padding: 0.30em 0; border-bottom-width: 1px; }
.navi-abc > div > a:last-child	{	border-bottom-width: 0; }

/* --- Thema --- */

.abb			{	width: calc(100.0% + 1.20rem); margin: 0.60rem 0 0.60rem -0.60rem; display: flex; flex-flow: row wrap; justify-content: space-between; align-content: stretch; align-items: stretch; }
.abb > figure	{	flex: 1 1 10.00%; margin: 0.60rem; }

/* --- Footer --- */

footer.sector	{	padding: 3.00vmin 0 0; border-top-width: 1px; }

/* --- Elemente --- */

.downward		{	opacity: 0.60; z-index: 5; position: absolute; bottom: 4.00rem; left: calc(50.00% - 1.50rem); padding: 1.50rem; border-radius: 100.0%; box-shadow: inset 0 0 0 2px white; transition: opacity 240ms ease-in-out 0ms;
					background-image: url('../img/baseline-arrow_downward-24px.svg'); background-repeat: no-repeat; background-position: center; background-size: 1.50em; transition: background-position 300ms ease-in-out 0ms; 
					animation-name: 			hopser;
					animation-duration: 		2s;
					animation-iteration-count: 	infinite;
					animation-timing-function: 	ease-in-out; }
	          
					@keyframes hopser {
						from 	{	transform: translate(0, 0); }
						50% 	{	transform: translate(0, -10px); }
						to 		{	transform: translate(0, 0); } }
					
.downward:hover	{	opacity: 1.00; }

		.hopser {	animation-name: 			hopser;
					animation-duration: 		2s;
					animation-iteration-count: 	infinite;
					animation-timing-function: 	ease-in-out; }
			          
					@keyframes hopser {
						from 	{	transform: translate(0, 0); }
						50% 	{	transform: translate(0, -10px); }
						to 		{	transform: translate(0, 0); } }

a.toplink		{	position: fixed; display: none; z-index: 5; bottom: 4.00rem; right: calc(8.00vmin - 0.82rem); padding: 1.20rem 0.82rem; border-radius: 0.90rem; box-shadow: inset 0 0 0 2px black;
					background-image: url('../img/baseline-arrow_upward-24px.svg'); background-repeat: no-repeat; background-position: top 0.60em center; background-size: 1.20em; transition: background-position 300ms ease-in-out 0ms; }
a.toplink:hover	{	background-position: top 0.30rem center; }

.coty	{	display: inline-block; padding: 0.8rem 1.20em; margin: 1.00em 0 1.20em 0; }

.end	{	display: block; float: right; width: 0.60em; height: 0.60em; margin: 0.72em 0 0 1.20em; background: black; }

.btn				{	position: relative; padding: 1.20em 2.40em; border-width: 1px; border-color: black; transition: color ease-in-out 120ms 60ms; }
.btn:after			{	content:''; position: absolute; z-index: -1 ; top: 0; left: 0; height: 100.0%; width: 100.0%; background: black; transform: scale(0.0); transition: all ease-in-out 150ms 0ms; }
.btn:hover			{	color: white; }
.btn:hover:after	{	transform: scale(1.0); }

button				{	background: white; color: black; transition: all ease-in-out 120ms; margin: 0; }
button:hover		{	background: black; color: white; }

figure				{	width: 100.0% }
figure > img		{	width: 100.0%; height: auto; margin-bottom: 1.20rem; }

/* --- Quick--- */

.quicktab			{	position: fixed; top: calc(50.00% - 2.10rem); right: 0; z-index: 8; width: 6.00rem; height: 4.20rem; padding: 0; border: 0; 
						display: flex; flex-flow: row wrap; justify-content: center; align-content: center; align-items: center; opacity: 0.90; }
.quicktab > img		{	width: 1.50rem; height: auto; margin-bottom: 0.15rem; }
.quicktab > span	{	flex: 0 0 100.0%; }

#quick				{	position: fixed; top: 0; right: -100.0%; z-index: 8; width: 100.0%; height: 100.0%; overflow: hidden; transition: right ease-in-out 600ms 0ms; }
#quick.quick-on		{	right: 0; }
#quick > a			{	position: absolute; top: 0; right: 0; z-index: 1; width: 100.0%; height: 100.0%; }
#quick > div		{	position: absolute; top: calc(50.00% - 140px); right: 0; z-index: 2; width: 560px; height: 280px; background: white; }

#quick > div > div					{	position: absolute; display: flex; flex-flow: row wrap; justify-content: center; align-content: center; align-items: center; }
#quick > div > div:nth-child(1)		{	top: 0;      left:  0; width: 60.00%;             height: 100.0%; background: transparent; }
#quick > div > div:nth-child(2)		{	top: 2px;    right: 0; width: calc(40.00% - 2px); height: calc(50.00% - 3px); }
#quick > div > div:nth-child(3)		{	bottom: 2px; right: 0; width: calc(40.00% - 2px); height: calc(50.00% - 3px); }
		#quick > div > div > a		{	position: absolute; top: 0; right: 0; z-index: 1; width: 100.0%; height: 100.0%; }
		#quick > div > div > span	{	flex: 1 1 100.0%; margin: 0 1.20rem; }

#quick > div > div:nth-child(1) img	{	width: 4.20rem; height: auto; margin-bottom: 1.50rem; }
#quick > div > div:nth-child(2) img,	
#quick > div > div:nth-child(3) img	{	width: 2.10rem; height: auto; margin-bottom: 0.90rem; }

/* --- Cookies--- */

#cookies 			{	position: fixed; top: 0; left: 0; z-index: 999; width: 100.0%; height: 100.0%; overflow: hidden; 
						display: flex; flex-flow: row wrap; justify-content: center; align-content: center; align-items: center; 
						-webkit-backdrop-filter:	blur(8px);
						-moz-backdrop-filter:		blur(8px);
						-o-backdrop-filter:			blur(8px);
						-ms-backdrop-filter:		blur(8px);
						backdrop-filter:			blur(8px); }
						
#cookies:before		{	content: ''; position: absolute; top: 0; left: 0;  width: 100.0%; height: 100.0%; opacity: 0.42; }

#cookies > span 		{	position: relative; width: 80.00%; max-width: 280px; height: auto; padding: 1.80rem; border-radius: 0.24rem; border-width: 1px; color: black; background: white; color: black; line-height: 1.80;
							display: flex; flex-flow: row wrap; justify-content: center; align-content: center; align-items: center; }
#cookies > span > span	{	display: block; width: 100.0%; }
#cookies span + span	{	margin-top: 0.60rem; }


#cookies .btn 		{	flex: 1 1 100.0%; margin-top: 1.50rem;  }

	#cookies 		{	animation-name: 			cookies-on;
						animation-duration: 		4s;
						animation-fill-mode: 		forwards;
						animation-timing-function: 	linear; }
		
						@keyframes cookies-on {
							from 	{	opacity: 0.00; }
							66% 	{	opacity: 0.00; }
							to 		{	opacity: 1.00; } }
							
						#cookies a.btn	{	animation-name: 			colorred;
											animation-duration: 		12s;
											animation-fill-mode: 		forwards;
											animation-timing-function: 	linear; }
						
						@keyframes colorred {
							from 	{	color: #000000; }
							60% 	{	color: #000000; }
							66% 	{	color: #e50000; }
							to 		{	color: #e50000; } }
	
	#cookies:target 		{	height:  0; transition: height  480ms ease-in-out 240ms; }
	#cookies:target:before 	{	opacity: 0; transition: opacity 240ms ease-in-out 0ms; }

/* --- Preloader --- */	
	
#preload-wrapper 			{	transition: all 500ms;}
#preload-wrapper.loaded 	{	visibility: hidden; opacity: 0;}
#preload-wrapper .preload 	{	position: fixed; z-index: 10; top: 0; left: 0; width: 100.0%; height: 100.0%; display: flex; flex-flow: row wrap; justify-content: center; align-content: center; align-items: center; }

				.spinner	{	width: 100.0%; text-align: center; }
				
				.spinner > div		{	display: inline-block; width: 18px; height: 18px; margin: 0 3px; border-radius: 100%; background-color: #fff; animation: sk-bouncedelay 1.4s infinite ease-in-out both; }
				
				.spinner :nth-child(1)	{ animation-delay: -0.48s; }
				.spinner :nth-child(2)	{ animation-delay: -0.32s; }
				.spinner :nth-child(3)	{ animation-delay: -0.16s; }
				
				@keyframes sk-bouncedelay	{	0%, 80%, 100% { transform: scale(0); } 40% { transform: scale(1.0); }}	
				
/* --- Effekt Fade-in --- */

.fade-in				{ opacity: 0; transform: scale(0); transition: all 600ms ease-in-out; }
.fade-in.fade-in-on		{ opacity: 1; transform: scale(1); }

/*	=================================
		FORMULAR
	================================= */

	select,	input, textarea	{	appearance:	none; -webkit-appearance: none; -moz-appearance: none; }	
		*:focus 			{	outline: -webkit-focus-ring-color auto 0; outline: none; }
		*:-moz-focusring 	{	outline: 0; }
		::placeholder	 	{	opacity: 0.75; }
		button	 			{	background-color: transparent; }
		
	input[type=radio], 
	input[type=checkbox] 	{	display: none; }
							
form	{	display: block; }
						
input, textarea	{	width: 100.0%; height: 48px; margin-bottom: 1.00em; padding: 0; border-radius: 0; border-bottom-width: 2px; border-bottom-style: dotted; background-color: transparent; }					
textarea		{	resize: vertical; min-height: 4.00em; }
	
input[type=checkbox] + label		{	position: relative; display: block; margin: 3.00vmin 0; padding: 0 0 0 2.70em; }
input[type=checkbox] + label > a	{	display: inline; }
input[type=checkbox] + label:before			{	content:''; position: absolute; top: 0.30em; left: 0; display: block; width: 2.10em; height: 2.10em; background-color: white; border-radius: 3px; box-shadow: inset 0 0 0 1px black; }
input[type=checkbox]:checked + label:before	{	background: url(../img/baseline-check-24px.svg) no-repeat center; background-size: 84.00%; }

.hidden-field 	{ display: none; visibility: hidden; }

/*	=================================
		SCREENS
	================================= */

@media screen and (min-width : 0) and (max-width : 767px)
{	
	.columns	{	opacity: 0.06; }
	.columns > .row  > :nth-child(2), 
	.columns > .row  > :nth-child(3), 
	.columns > .row  > :nth-child(4),
	.columns > .row  > :nth-child(5),
	.columns > .row  > :nth-child(6)	{	display: none; }

	header {	background-position: left 8.00vmin center; }
	header > span:nth-child(1),
	header > span:nth-child(2),
	#menu,
	.navi-abc,
	.downward 	{	display: none; }
	
	@media screen and (orientation : landscape)
	{	
	}

	@media screen and (orientation : portrait)
	{	 
	.quicktab,
	#quick		{	display: none; }
	}
}

@media screen and (min-width : 768px) and (max-width : 1024px) 
{		
	.columns	{	opacity: 0.06; }

	header > span:nth-child(2),	#menu	{	display: none; }
	
	@media screen and (orientation : landscape)
	{	
	.columns > .row  > :nth-child(3), 
	.columns > .row  > :nth-child(4), 
	.columns > .row  > :nth-child(5)	{	display: none; }	
	 
	body.kogw article:nth-child(2n-1) > .row > div:nth-child(1)	{	order: 2; }
	body.kogw article:nth-child(2n-1) > .row > div:nth-child(2)	{	order: 1; }
	}

	@media screen and (orientation : portrait)
	{	 
	.columns > .row  > :nth-child(2), 
	.columns > .row  > :nth-child(3), 
	.columns > .row  > :nth-child(4), 
	.columns > .row  > :nth-child(5)	{	display: none; }
	}
}

@media screen and (min-width : 1025px) 
{	
	header 		{	position: relative; }
	.nav-hh		{	display: none; }
	 #start		{	top: -60px; left: 0; margin-bottom: -60px; }
	
	body.kogw article:nth-child(2n-1) > .row > div:nth-child(1)	{	order: 2; }
	body.kogw article:nth-child(2n-1) > .row > div:nth-child(2)	{	order: 1; }
}

/*	=================================
		Layout
	================================= 
	
	.comment	{	color: rgba(255,000,255,1.0); }
		
			*	{	box-shadow: 		inset 0 0 0 1px  rgba(000,000,000,0.10) !important; } 
			*	{	background-color: 	rgba(000,000,000,0.05) 					!important; } 
			div	{	background-color: 	rgba(255,000,000,0.05) 					!important; } 
			div	{	background-image: 	none				 					!important; } 
			*	{	color: 				rgba(000,000,000,1.0) 					!important; } 
			img	{	box-shadow: 		inset 0 0 0 1px  rgba(000,000,000,0.40) !important; } 
				
/*	=================================
		END
	================================= */