/*.test {
	position: absolute;
	width: 455px;
	height: 13px;
	left: 36px;
	top: 146px;
	background-color: white;
}*/

body {
    text-align: center;
    margin: 0px;
}

#wrapper {
	position: relative;
	margin: 0 auto;
	height: 4000px;	
	overflow: hidden;
}

/*__________________NAVI________________*/

.navi {
	position: fixed;
	top:0px;
	right:20%;
	z-index: 1;
	transition-property: top; 
	transition-duration: 0.25s;
}

.navi.inactive {
	top: -130px;
	transition-property: top; 
	transition-duration: 0.25s;
}

ul {
    position: absolute;
	right: 23px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 300; 
	font-size: 15px;
	color: white;
	text-align:left;
	line-height: 2em;
	cursor: pointer;

	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}

.line1 {
	position: absolute;
	right: -4px;
	top: -11px;
	width: 100px;
	height: 4px;
	background-color: white;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	transition-property: all;
	transition-duration: 0.5s;
}

.line2 {
	position: absolute;
	right: -47px;
	top: -10px;
	width: 100px;
	height: 4px;
	background-color: white;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	transition-property: all;
	transition-duration: 0.5s;
}

.line3 {
	position: absolute;
	right: -49px;
	top: 30px;
	width: 100px;
	height: 4px;
	background-color: white;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	transition-property: all;
	transition-duration: 0.5s;
}

.line4 {
	position: absolute;
	right: -107px;
	top: 28px;
	width: 126px;
	height: 4px;
	background-color: white;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	transition-property: all;
	transition-duration: 0.5s;
}

/*__________________TOP + LOGO________________*/

.back1 {
	position: fixed;
	margin: 0 auto;
	width: 100%;
	height: 100%;
	background: url("../back1.jpg") center center no-repeat;
	background-size: cover;
	left: 0px;
	top: 0px;
}

.triangle_move2 {
	position: absolute;
/*	left: -19px;
	top: -10px;
	height:1200px;
	width:100%;
	background: url(back1.jpg)  no-repeat, orange;  
	-webkit-background-blend-mode: multiply, normal; 
	background-blend-mode: multiply, normal;*/

	left: -800px;
	top: -1614px;
	border-top: 1607px solid transparent;
	border-bottom: 1607px solid transparent;
	border-left: 1607px solid #C5324A;
	overflow: hidden;
}

.triangle_move {
	position: absolute;
/*	left: -19px;
	top: -10px;
	height:1200px;
	width:100%;
	background: url(back1.jpg)  no-repeat, orange;  
	-webkit-background-blend-mode: multiply, normal; 
	background-blend-mode: multiply, normal;*/
	width: 3100px;
	height: 2100px;
	left: 50%;
	top: -800px;
	margin-left: -3100px;
	overflow: hidden;
/*	background: #C5324A;*/
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	-webkit-mix-blend-mode: multiply, normal;
	background-blend-mode: multiply, normal;

	background-image: -webkit-linear-gradient(#C5324A 63%, #8A1133 100%); 
	background-image: -moz-linear-gradient(#C5324A 63%, #8A1133 100%); 
	background-image: -o-linear-gradient(#C5324A 63%, #8A1133 100%); 
	background-image: linear-gradient(#C5324A 63%, #8A1133 100%);	
}

.top{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 1000px;
	overflow: hidden;	
}

.logo {
	position: absolute;
	left:20%;
	top: 250px;
	z-index: 1;
}

/*__________________PROJECTS________________*/

.content {
	position: relative;
	margin: 0 auto;
	width: 1024px;
	height: 4456px;	
	right: 0px;
	top: 1500px;
}

.background {
	position: absolute;
	width: 165%;
	right: -325px;
	height: 1000px;
	background-color: #111111;
}

.triangle_darkred {
	position: absolute;
	right: -1058px;
	top: -648px;
	width: 0;
	height: 0;
	border-top: 1591px solid transparent;
	border-bottom: 1591px solid transparent;
	border-right: 1591px solid #9F293E;
	overflow: hidden;
}

.triangle_red {
	position: absolute;
	left: -1179px;
	top: -1113px;
	width: 0;
	height: 0;
	border-top: 1607px solid transparent;
	border-bottom: 1607px solid transparent;
	border-left: 1607px solid #C5324A;
	overflow: hidden;
}

.triangle_black {
	position: absolute;
	right: -445px;
	top: 630px;
	width: 0;
	height: 0;
	border-bottom: 2500px solid transparent;
	border-right: 2500px solid #111111;
	overflow: hidden;
}

h1 {
	position: absolute;
	left: 23px;
	top: 391px;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300; 
	font-size: 20px;
	color: white;
}

h2 {
	position: absolute;
	left: 23px;
	top: 423px;
	width: 289px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700; 
	font-size: 23px;
	color: white;
	text-align:left;
	line-height: 1.3em;
}

h4 {
	position: absolute;
	left: 5px;
	top: 63px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700; 
	font-size: 86px;
	color: white;
	text-align:left;
}

p {
	font-family: 'Open Sans', sans-serif;
	font-weight: 300; 
	color: white;
	text-align: left;
	line-height: 1.3em;
}

.project_text {
	position: absolute;
	left: 23px;
	top: 498px;
	width: 289px;
	font-size: 15px;
}

.description1 {
	opacity: 0;
}

.description2 {
	opacity: 0;
}

.description3 {
	opacity: 0;
}

.description4 {
	opacity: 0;
}

.description5 {
	opacity: 0;
}

.description6 {
	opacity: 0;
}

.description7 {
	opacity: 0;
}

.description8 {
	opacity: 0;
}

.description9 {
	opacity: 0;
}

.description10 {
	opacity: 0;
}

.description11 {
	opacity: 0;
}

.description12 {
	opacity: 0;
}

.description13 {
	opacity: 0;
}

.description14 {
	opacity: 0;
}

.description_general {
	opacity: 1;
}

.P1 {
	position: absolute;
	left: 452px; 
	top: 774px;
	width: 122px;	
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	opacity: 1;
	cursor: pointer;
}

.P2 {
	position: absolute;
	left: 368px;
	top: 689px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	opacity: 1;
	cursor: pointer;
}

.P3 {
	position: absolute;
	left: 539px;
	top: 690px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	opacity: 1;
	cursor: pointer;
}

.P4 {
	position: absolute;
	left: 283px;
	top: 604px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	opacity: 1;
	cursor: pointer;
}

.P5 {
	position: absolute;
	left: 624px;
	top: 605px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	opacity: 1;
	cursor: pointer;
}

.P6 {
	position: absolute;
	left: 368px;
	top: 519px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	opacity: 1;
	cursor: pointer;
}

.P7 {
	position: absolute;
	left: 540px;
	top: 519px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	opacity: 1;
	cursor: pointer;
}

.P8 {
	position: absolute;
	left: 454px;
	top: 435px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	opacity: 1;
	cursor: pointer;
}

.P9 {
	position: absolute;
	left: 623px;
	top: 434px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	opacity: 1;
	cursor: pointer;
}

.P10 {
	position: absolute;
	left: 795px;
	top: 434px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	opacity: 1;
	cursor: pointer;
}

.P11 {
	position: absolute;
	left: 707px;
	top: 179px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	opacity: 1;
	cursor: pointer;
}

.P12 {
	position: absolute;
	left: 369px;
	top: 350px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	opacity: 1;
	cursor: pointer;
}

.P14 {
	position: absolute;
	left: 880px;
	top: 349px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	opacity: 1;
	cursor: pointer;
}

.P15 {
	position: absolute;
	left: 623px;
	top: 263px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	opacity: 1;
	cursor: pointer;
}

/*__________________ABOUT________________*/

h5 {
	position: absolute;
	left: 150px;
	top: 1300px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700; 
	font-size: 86px;
	color: white;
	text-align:left;
}

.about_text {
	position: absolute;
	left: 150px;
	top: 1400px;
	width: 498px;
	font-size: 17px;
}

.me {
	position: absolute;
	left: -230px;
	bottom: 0px;
	width: 2000px;
}

.red_line1 { 
	position: absolute;
	left: -210px;
	top: 1515px;
	width: 420px;
	border: none; 
	border-top: 2px dashed #C5324A; 
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}

.red_line2 { 
	position: absolute;
	left: -271px;
	top: 1786px;
	width: 245px;
	border: none; 
	border-top: 2px dashed #C5324A; 
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
}

.red_line3 { 
	position: absolute;
	left: 189px;
	top: 2016px;
	width: 542px;
	border: none; 
	border-top: 2px dashed #C5324A; 
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
}

/*__________________CONTACT________________*/

.contact_text {
	position: absolute;
	left: 320px;
	top: 1700px;
	width: 428px;
	font-size: 17px;
}

a.mail {
	position: absolute;
	left: 320px;
	top: 1725px;
	width: 428px;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300; 
	color: #C5324A;
	text-align: left;
	line-height: 1.3em;
	font-size: 17px;
	text-decoration: none;
}

.underline {
	position: absolute;
	left: 341px;
	top: 1745px;
	width: 100px;
	height: 4px;
	background-color: #C5324A;
	transition-property: all;
	transition-duration: 0.5s;
}

.red_box_fb {
	position: absolute;
	background-color: #C5324A;
	left: 280px;
	top: 1819px;
	height: 47px;
	width: 47px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}

.red_box_tw {
	position: absolute;
	background-color: #C5324A;
	left: 244px;
	top: 1855px;
	height: 47px;
	width: 47px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}

.red_box_g {
	position: absolute;
	background-color: #C5324A;
	left: 316px;
	top: 1855px;
	height: 47px;
	width: 47px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}

.red_box_p {
	position: absolute;
	background-color: #C5324A;
	left: 280px;
	top: 1891px;
	height: 47px;
	width: 47px;
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}

/*__________________OVERLAY________________*/
.project1 {
	height: 1500px;
}

.project2 {
	height: 1500px;
}

.project3 {
	height: 1500px;
}

.project4 {
	height: 1500px;
}

.project5 {
	height: 1500px;
}

.project6 {
	height: 1500px;
}

.project7 {
	height: 1500px;
}

.project8 {
	height: 1500px;
}

.project9 {
	height: 1500px;
}

.project10 {
	height: 1500px;
}

.project11 {
	height: 1500px;
}

.project12 {
	height: 1500px;
}

.project13 {
	height: 1500px;
}

.project14 {
	height: 1500px;
}

.project15 {
	height: 1500px;
}

.layer {
	position: absolute;
	height: 1760px;
	width: 2000px;
	right: 2000px;
	top: 0px;
	overflow: hidden;	
	transition-property: all;
	transition-duration: 0.5s;
}

.layer.active{
	right: -500px;
	transition-property: all;
	transition-duration: 0.5s;
}

.layer_red {
	position: absolute;
	background-color: #C5324A;
	height: 1230px;
	width: 2000px;
	right: 0px;
	top: 620px;	
}

.slide_box {
	position: absolute;
	background-color: white;
	opacity:0.8;
	height: 35px;
	width: 2000px;
	right: 0px;
	top: 585px;	
}

.slide_n1 {
	position: absolute;
	left: 490px;
	top: 591px;	
	font-family: 'Montserrat', sans-serif;
	font-weight: 700; 
	font-size: 20px;
	color: #111111;
}

.slide_n2 {
	position: absolute;
	left: 535px;
	top: 591px;	
	font-family: 'Montserrat', sans-serif;
	font-weight: 700; 
	font-size: 20px;
	color: #111111;
}

.slide_n3 {
	position: absolute;
	left: 590px;
	top: 591px;	
	font-family: 'Montserrat', sans-serif;
	font-weight: 700; 
	font-size: 20px;
	color: #111111;
}

.slide_n4 {
	position: absolute;
	left: 645px;
	top: 591px;	
	font-family: 'Montserrat', sans-serif;
	font-weight: 700; 
	font-size: 20px;
	color: #111111;
	display: none;
}

.layer_navi {
	position: absolute;
	background-color: white;
	height: 55px;
	width: 165%;
	right: -325px;
	top: 0px;	
	left: 0px;
}

.slide1 {
	position: absolute;
	left: 0px;
	top: 55px;
	width: 2000px;
	
}

.slide2 {
	position: absolute;
	left: 2000px;
	top: 55px;
	width: 2000px;
}

.slide3 {
	position: absolute;
	left: 4000px;
	top: 55px;
	width: 2000px;
}

.slide4 {
	position: absolute;
	left: 6000px;
	top: 55px;
	width: 2000px;
}

.layer > div{
	position: absolute;	
	overflow: hidden;
	width: 2000px;
}

h2.layer_headline {
	position: absolute;
	left: 507px;
	top: 648px;
	width: 400px;
	z-index: 1;
}

p.layer_text {
	position: absolute;
	left: 1011px;
	top: 740px;
	width: 450px;
	z-index: 1;
	font-size: 14px;
}

p.layer_text2 {
	position: absolute;
	left: 915px;
	top: 740px;
	width: 450px;
	z-index: 1;
	font-size: 14px;
}

p.layer_text3 {
	position: absolute;
	left: 894px;
	top: 740px;
	width: 450px;
	z-index: 1;
	font-size: 14px;
}

.pic1 {
	position: absolute;
	left: 490px;
	top: 726px;
	z-index: 1;
}

.pic2 {
	position: absolute;
	left: 490px;
	top: 1075px;
	z-index: 1;
}

.pic3 {
	position: absolute;
	left: 1006px;
	top: 1075px;
	z-index: 1;
}

.pic4 {
	position: absolute;
	left: 490px;
	top: 1145px;
	z-index: 1;
}

.pic5 {
	position: absolute;
	left: 1116px;
	top: 1145px;
	z-index: 1;
}

.pic6 {
	position: absolute;
	left: 802px;
	top: 1145px;
	z-index: 1;
}

.pic7 {
	position: absolute;
	left: 738px;
	top: 726px;
	z-index: 1;
}

.pic8 {
	position: absolute;
	left: 490px;
	top: 1090px;
	z-index: 1;
}

.pic9 {
	position: absolute;
	left: 738px;
	top: 1090px;
	z-index: 1;
}

.pic19 {
	position: absolute;
	left: 490px;
	top: 726px;
	z-index: 1;
}

.pic10 {
	position: absolute;
	left: 490px;
	top: 998px;
	z-index: 1;
}

.pic11 {
	position: absolute;
	left: 890px;
	top: 998px;
	z-index: 1;
}

.pic12 {
	position: absolute;
	left: 490px;
	top: 1270px;
	z-index: 1;
}

.pic13 {
	position: absolute;
	left: 890px;
	top: 1270px;
	z-index: 1;
}

.pic14 {
	position: absolute;
	left: 490px;
	top: 1082px;
	z-index: 1;
}

.pic15 {
	position: absolute;
	left: 1011px;
	top: 726px;
	z-index: 1;
}

.pic16 {
	position: absolute;
	left: 1011px;
	top: 1082px;
	z-index: 1;
}

.pic17 {
	position: absolute;
	left: 490px;
	top: 1025px;
	z-index: 1;
}

.pic18 {
	position: absolute;
	left: 1006px;
	top: 1025px;
	z-index: 1;
}

iframe {
	position: absolute;
	left: 490px;
	top: 726px;
	z-index: 1;
}

a.link_pixabit1 {
	position: absolute;
	left: 1011px;
	top: 915px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400; 
	color: white;
	z-index: 1;
	text-decoration: none;
}

a.link_pixabit2 {
	position: absolute;
	left: 1011px;
	top: 945px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400; 
	color: white;
	z-index: 1;
	text-decoration: none;
}

a.link_pokearound {
	position: absolute;
	left: 1011px;
	top: 935px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400; 
	color: white;
	z-index: 1;
	text-decoration: none;
}

/*__________________LAYER-NAVI-CONTENT________________*/

div.layerNavi{
	display: none; 	
}


p.category {
	position: absolute;
	left: 5%;
	top: 1514px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700; 
	font-size: 23px;
	color: #111111;
}

p.close {
	position: absolute;
	right: 5%;
	top: 1515px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400; 
	font-size: 20px;
	color: #111111;
	cursor: pointer;
}

.underline2 {
	position: absolute;
	left: 1090px;
	top: 931px;
	width: 100px;
	height: 4px;
	background-color: white;
	transition-property: all;
	transition-duration: 0.5s;
	z-index: 1;
}

.underline3 {
	position: absolute;
	left: 1090px;
	top: 961px;
	width: 100px;
	height: 4px;
	background-color: white;
	transition-property: all;
	transition-duration: 0.5s;
	z-index: 1;
}

.underline4 {
	position: absolute;
	left: 1027px;
	top: 931px;
	width: 100px;
	height: 4px;
	background-color: white;
	transition-property: all;
	transition-duration: 0.5s;
	z-index: 1;
}

.underline5 {
	position: absolute;
	left: 1064px;
	top: 951px;
	width: 100px;
	height: 4px;
	background-color: white;
	transition-property: all;
	transition-duration: 0.5s;
	z-index: 1;
}

/*________________ QUOTE ______________*/

.quote{
    position: absolute;
    top: 1000px;
    left: 190px;
    font-size: 30px;
    line-height: 45px;
    width: 570px;
    text-align: center;
    font-weight: 600;
    opacity: 0;
}

.quoteOf{
    position: absolute;
    top: 1120px;
    left: 693px;
    font-size: 25px;
    line-height: 45px;
    font-weight: 600;
    opacity: 0;
}


.sliderPics{
	width:2000px;
	height: 600px;
	background: black;
}

