/**
* CSS
* @version 1.0
* @author Ozhan Binici
*/

.indeks {
	width:100%;
	max-width:1326rem;
	margin:0 auto;
	position:relative;
	display:flex;
	/*align-items:flex-start;*/
	flex-wrap:wrap;
	/*flex-direction:column;*/
	padding:15rem 18rem 10rem 18rem;
}

.indeks .column-container {
	width:50%;
	display:flex;
	/*align-items:flex-start;*/
	flex-wrap:wrap;
}

.indeks .column-container-1 {
	width:660rem;
}

.indeks .column-container-2 {
	width:630rem;
}


.indeks .column {
	border-left:2rem solid #fff;
	padding:0 25rem 0 13rem;
}


.indeks .column.column-4 {
	padding-right:0rem;
	margin-top:280rem;
}

.indeks .column-4 .set {
	width:285rem;
}

.indeks .column-label {
	color: #fff;
	font-family: "Adelle";
	font-weight: 700;
	line-height: 23rem;
}

.indeks .column-label label {
	display:none;
}

.indeks .column-label label.column-4 {
	display:block;
}

.indeks .set {
	display:flex;
	flex-direction:column;
	margin-top:31rem;
	width:290rem;
}

.indeks .set.hidden {
	display:none;
}


.indeks .set .label {
	font-family: "Tenso";
	font-weight: 600;
	font-size: 19rem;
	line-height: 31rem;
}

.indeks .tag-container {
	display:none;
}
.indeks .tag-container.visible {
	display:block;
}

.indeks .set a.tag {
	font-family: "Tenso";
	font-weight: 400;
	font-size: 19rem;
	line-height: 31rem;
	color: #000;
	text-decoration: underline;
	margin-left: 20rem;
	text-indent: -20rem;
	display: inline-block;
}

.indeks .set a.tag.highlighted {
	color: #ef476f;
}

.indeks .set a.tag.italic {
	font-style:italic;
}

.indeks .set a.tag.bold {
	font-weight: 600;
	color: #939598;
}

.indeks .set a.tag:hover {
	text-decoration: none;
	color: #65887a;
}

.indeks .column-1 .set-d,
.indeks .column-1 .set-e,
.indeks .column-1 .set-f {
	display:none;
}

.indeks .column-2 .set-k,
.indeks .column-2 .set-l,
.indeks .column-2 .set-m,
.indeks .column-2 .set-n,
.indeks .column-2 .set-o {
	display:none;
}

.indeks .column-4 .set-o-accent,
.indeks .column-4 .set-p {
	display:none;
}


.indeks .filters {
	width:100%;
	display:flex;
	flex-wrap:wrap;
	margin-bottom:15rem;
	overflow-x:hidden;
}

.indeks .filters a.all {
	width:300rem;
}

.indeks .filters .rest {
	width:calc(100% - 300rem);
	display:flex;
	flex-wrap:wrap;
	margin-right:-30rem;
}


.filters a {
	position: relative;
	display: block;
	background-color: #bdcac7;
	font-family: "Tenso";
	width: 135rem;
	height: 30rem;
	font-size: 16rem;
	line-height: 20rem;
	padding: 5rem;
	text-align: center;
	color: #000000;
	text-decoration: underline;
	margin-right: 30rem;
	margin-bottom: 15rem;
}

.filters a.active, 
.filters a:hover {
	color: #FFFFFF;
	background-color: #65887a;
}

#player {
	position:absolute;
	top:120rem;
	right:18rem;
	width:300rem;
	height:250rem;
}

#player iframe:hover {
	-webkit-box-shadow: 5rem 5rem 5rem 0rem rgba(0,0,0,0.4);
	-moz-box-shadow: 5rem 5rem 5rem 0rem rgba(0,0,0,0.4);
	box-shadow: 5rem 5rem 5rem 0rem rgba(0,0,0,0.4);
}

.cell #player {
	position:relative;
	top:auto;
	right:auto;
	width:330rem;
	height:280rem;
	padding:15rem;
}

#player iframe {
	width:300px;
	height:250px;
	border:none;
	overflow:hidden;
	display:block;
	transform-origin: top left;
}

@media (max-width:1199px){
	.indeks .column-1 .set-d,
	.indeks .column-1 .set-e,
	.indeks .column-1 .set-f {
		display:flex;
	}
	
	.indeks .column-2 .set-k,
	.indeks .column-2 .set-l,
	.indeks .column-2 .set-m,
	.indeks .column-2 .set-n,
	.indeks .column-2 .set-o {
		display:flex;
	}
	
	.indeks .column-2 .set-d,
	.indeks .column-2 .set-e,
	.indeks .column-2 .set-f {
		display:none;
	}
	
	.indeks .column-3{
		display:none;
	}
	
	.indeks .column-4 .set-o-accent,
	.indeks .column-4 .set-p {
		display:flex;
	}

	.indeks .column-container-1 {
		width:660rem;
	}
	.indeks .column-container-2 {
		width:300rem;
	}
	
	.indeks .column-label label.column-4 {
		display:none;
	}
	
	.indeks .column-label label.column-3 {
		display:block;
	}
	.indeks {
		padding:15rem 15rem 10rem 15rem;
	}
	
	#player {
		right:15px;
	}
}

@media (max-width:799px){
	
	.indeks .column-1 .set-d,
	.indeks .column-1 .set-e,
	.indeks .column-1 .set-f {
		display:none;
	}

	.indeks .column-2 .set-k,
	.indeks .column-2 .set-l,
	.indeks .column-2 .set-m,
	.indeks .column-2 .set-n,
	.indeks .column-2 .set-o {
		display:none;
	}
	
	.indeks .column-3{
		display:block;
	}

	.indeks .column-4 .set-o-accent,
	.indeks .column-4 .set-p {
		display:none;
	}
	
	.indeks .column-container-1 {
		width:330rem;
	}
	.indeks .column-container-2 {
		width:300rem;
		margin-top:280rem;
	}
	
	.indeks .column-label label.column-3 {
		display:none;
	}
	.indeks .column-label label.column-2 {
		display:block;
	}
	.indeks {
		padding:15rem 30rem 10rem 30rem;
	}
	.indeks .filters .rest {
		width:calc(100% + 30rem);
	}
	#player {
		top:165rem;
		right:30rem;
	}
}

@media (max-width:479px){
	.indeks .column-label label.column-2 {
		display:none;
	}
	.indeks .column-container-1 {
		width:100%;
	}
	.indeks .column-container-2 {
		width:100%;
		margin-top:0rem;
	}
	
	.indeks .column-1 .column-label + .set {
		margin-top:-6rem;
	}
	
	.indeks {
		padding:5rem 10rem 10rem 10rem;
	}
	
	.indeks .filters {
		margin-bottom:0rem;
	}
	.indeks .filters a.all {
		margin-right:0rem;
	}
	
	#player {
		position:relative;
		top:auto;
		right:auto;
		margin-bottom:15rem;
	}
}