/*ALLGEMEIN*/

body {
	text-align:center;
	color: #DFD3BD;
	font-family: 'Titillium Web', sans-serif;
	font-size:18px;
	font-weight: 200;
	text-rendering: optimizeLegibility;
	margin:0;
	line-height: 1.42857143;
}

p{
	text-align:left;
}

a{
	color: beige;
}

		
h1,h2,h3,h4,h5,h6{
	margin: 0;
	color:#292721;
	font-weight: 600;
	font-family: 'Titillium Web', sans-serif;
	text-transform:uppercase;
	text-align:center;
	line-height:1.1;
}



*{box-sizing:border-box;}

button{
	font:inherit;
	color: inherit;
}

img{
	vertical-align: middle;
}

figure{
	margin: 0;
}


h1{font-size:48px;}
h2{font-size:36px;}
h3{font-size:24px;}
h4{font-size:20px;}
h5{font-size:18px;}
h6{font-size:16px;}
	

.gradientLine {
	background: #876e5a;
	background: -webkit-linear-gradient(#876e5a 0%, #e5c99c 83%, #56402d 94%, #e5c99c 100%);
	background: linear-gradient(#876e5a 0%, #e5c99c 83%, #56402d 94%, #e5c99c 100%);
	z-index:4;
	position:absolute;
	width:100%;
	height: 30px;
	}

.scrollable{
	overflow-y: auto;
	overflow-x: hidden;
	height: 100%;
}

	
#bottomPage{
	bottom:0px;
	}


#innerHTML{
	overflow:hidden;
	height: 100vh;
	width: 100vw;
	position: absolute;
}


#logo{
	cursor: pointer;
	}

#logoFillInAni{
	/*fill:#7B7B7B;*/
	fill:#dac4a3;
	mask:url(#logoInlineMask);}
	
#logoPieces{
	mask:url(#logoPiecesMask);}
	
#logoOutlineAni{
	fill:rgba(170,170,170,0.47);
	stroke:rgba(170,170,170,0.47);
	stroke-width:5.6;
	mask:url(#logoOutlineMask);}

#svgText{
	mask:url(#textMask);}

svg text{
	font-size:30pt;
	text-transform:uppercase;}
	
.bigText{
	font-weight:700;}
	
#logoSVG{
	position: absolute;
	width:100%;
	height:100%;
	z-index: 6;
	}
	
#textSVG{
	position: absolute;
	right: 50px;
	top: 50px;
	width:40%;
	height:40%;
	max-width: 500px;
	}
	
	
.responsive-video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
	
.responsive-video {
position: relative;
padding-bottom: 56.25%; /* Default for 1600x900 videos 16:9 ratio*/
padding-top: 0px;
height: 0;
width: 100%;
overflow: hidden;
}

	
.startVideoDiv{
	-webkit-transition: all ease 1.2s;
	transition: all ease 1.2s;
	border-style: ridge;
	border-color: #2d2319;
	border-width: 4px;
	z-index: 6;
	position: absolute;
	width: 48%;
	top: calc(21% - 4vw);
	right: 6%;
}
	

#imprintLink{
	right: 10px;
	cursor: pointer;
	}
	
#copyRight{
	left: 10px;
	}
	
	.bottomText{
	position: absolute;
	text-decoration:none;
	margin-top: calc(12px - 0.5vw);
	font-size: calc(6pt + 0.5vw);
	font-weight: 300;
	}

#imprint{
	background: #000000;
	border-top: ridge 1px burlywood;
	}
	
#imprintInner{
	margin-top: -30px;
	padding-top: 50px;
	padding-bottom: 100px;
	}
	
#imprint h4{
	text-align: left;
	}
	
	
#imprintInner div {
	width:50%;
	float: left;
	padding: 5%;
	text-align: left;
	}
	
#imprint.imprintOff{

	top: 100%;
	}
	

	
	
.videoDiv{
	width: 80%;
	margin-left: 10%;
	margin-bottom: 1%;
	margin-top: 1%;
}
	
.startVideoDiv.mainPage{
	right: -100%;
}

.aniConti{
	-webkit-transition: all ease 1.2s;
	transition: all ease 1.2s;
	}
	
.logoConti{
	position: absolute;	
	z-index: 100;
	}
	
.logoConti.startPage{	
	height: calc(20% + 2vw);
	width: calc(35px + 11%);
	top: calc(10% + 3.2vw);
	left:calc(10% - 20px);
	}
	
.logoConti.mainPage{
	top: 5px;
	left: 30px;
	height: 60px;
	width: 60px;
	}

#form1{animation: form1 1s ease ;}
#form2{animation: form2 1s ease ;}
#form3{animation: form3 1s ease ;}
#form4{animation: form4 1s ease ;}


#svgLines{animation: rigthIn 0.5s ease forwards 1s;}
#svgName1{animation: upIn 1s ease forwards 0.5s;}
#svgName2{animation: upIn 1s ease forwards 0.7s;}

#svgThe{animation: rigthIn 0.5s ease forwards 1.5s;}
#svgDesign{animation: rigthIn 0.5s ease forwards 1.7s;}
#svgGeneralist{animation: upIn 0.8s ease forwards 1.9s;}


#svgWith{animation: rigthIn 0.8s ease forwards 2.4s;}
#svgA{animation: upIn 0.8s ease forwards 2.6s;}
#svgPassion{animation: rigthIn 0.8s ease forwards 3s;}
#svgFor{animation: downIn 0.8s ease forwards 3.2s;}
#svgMotion{animation: rigthIn 1.2s ease forwards 3.6s;}





@keyframes form1 {0% {transform: translateY(250px) translateX(-500px);}}
@keyframes form2 {0% {transform: translateY(500px);}}
@keyframes form3 {0% {transform: translateY(-300px) translateX(-600px);}}
@keyframes form4 {0% {transform: translateY(250px) translateX(500px);}}

@keyframes downIn {0% {transform: translateY(0px);} 100% {transform: translateY(-350px);}}
@keyframes upIn {0% {transform: translateY(0px);} 100% {transform: translateY(350px);}}
@keyframes rigthIn {0% {transform: translateX(0px);} 100% {transform: translateX(-320px);}}
@keyframes rigthIn2 {0% {transform: translateX(0px);} 50% {transform: translateX(-350px);} 100% {transform: translateX(-320px);}}
@keyframes rigthIn3 {0% {transform: translateX(0px);} 60% {transform: translateX(-335px);} 100% {transform: translateX(-320px);}}




.conti{		
	-webkit-transition: right ease 1s, width ease 0.5s, top ease 1s, padding-top linear 0.5s, opacity ease 0s;
	transition: right ease 1s, width ease 0.5s, top ease 1s, padding-top linear 0.5s, opacity ease 0s;
	top:30px;
	position:absolute;
	width:100%;
	height:calc(100vh - 60px);	
	z-index: 2;
}

.backBox{
	background-image: url(../img/dark_wood.png);
	background-repeat: repeat;
	height:100vh;	
	top:0px;
}


.backgroundDiv{
	background-image: url(../img/dark_wood.png);
	background-repeat: repeat;
}
				
.gradientBox{
	opacity: inherit;
	height:100vh;
   	background: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(31,15,1,0.4)), to(rgba(0,0,0,0.4)));
   	background: linear-gradient(rgba(31,15,1,0.4) 0%, rgba(0,0,0,0.4) 100%);
	}
		
.activeDiv{right: 0%;}
		
.leftDiv{right: 100%;}
	
.rightDiv{right: -100%;}

#main.mainPage{
	bottom: 0%;
	-webkit-transition: all ease 1s 0.2s;
	transition: all ease 1s 0.2s;
}

#main.startPage{
	bottom: -100%;
	-webkit-transition: all ease 1s;
	transition: all ease 1s;
}

#main{
	width: 100%;
	height: 100%;
	position: absolute;
}

.backConti,
.workSideBackConti{opacity: 0;}

#workSideBack{
	position: absolute;
	background-position: 0 -30px;
}

.title{
	-webkit-transition-duration: 500ms;
    transition-duration: 500ms;
	height: 30px;
}




/*ISOTOPE*/
.isotope-item {
    z-index: 2;
}
.isotope-hidden.isotope-item {
    pointer-events: none;
    z-index: 1;
}
.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */

    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    transition-duration: 0.8s;
}

.isotope {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    transition-property: height, width;
}
.isotope .isotope-item {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    transition-property: transform, opacity;
}


/*MENU*/

#nav{
	width:100%;
	height:calc(200px + 3vw);
	bottom:0px;
}

#menuBox{
	width:100%;
	left:0%;
	height:200px;
	bottom:0px;
	position:absolute;
	overflow:hidden;
	}
	
#menu{
  -webkit-filter: url("#shadowed-goo");
          filter: url("#shadowed-goo");
	width:100px;
	left:50%;
	right:50%;
	bottom:0px;
	position:absolute;
	z-index:6;
}

#menuOpen{
	width:50px;
	height:50px;
	left:-25px;
	bottom:0px;
	background:#00ED0C;
	position:absolute;
}
	
.menuCircleBack{
 	background: rgba(18,10,1,0.79);
  	position: absolute;
	bottom: -350px;
	width:80px;
  	width: 340px;
  	height: 360px;
	left:calc(50% - 170px);
  	border-radius: 15% 15% 0 0;
  	z-index:2;
	border: ridge 1px burlywood;
}

.menuCircleBackBig{
	bottom: -220px;
}

.startPage .menuCircleBack{
	bottom: -350px;
}
	
.menu-item, .menuOpen-button {
  	background: #dec6a0;
  	width: 50px;
  	height: 50px;
  	position: absolute;
  	bottom: 5px;
  	left:-25px;
  	border-radius: 100%;
	overflow: hidden;
}

.menu-item{
	
}

.menu-item svg,
.menu-item h3,
.menuCircleBack{
	-webkit-transition: all 0.35s ease-in-out;
	-moz-transition: all 0.35s ease-in-out;
	transition: all 0.35s ease-in-out;	
  	}

.startPage .menu-item svg,
.menu-item:hover svg {
	width: 80%;
}

.startPage .menu-item h3,
.menu-item:hover h3 {
	bottom: 32%;
}

.menu-item h3{
	bottom: -25%;
	height: 50%;
  	font-size: 90%;
	color:black;
	position: relative;
	background: rgba(149, 123, 100, 0.8);
	border: solid 1px #6c4d38;
  	}

.top-menu-item {
  	background: #dec6a0;
  	width: 25px;
  	height: 25px;
  	position: absolute;
  	top: 2px;
  	right:25px;
  	border-radius: 100%;
	z-index:4;
}

.menu-item div, .menuOpen-button div {  	
	width: 98%;
  	height: 98%;
	top: 1%;
	left: 1%;
  	position: absolute;
  	border-radius: 100%;
	overflow: hidden;
	background: -moz-radial-gradient(ellipse at center, rgba(89,57,39,1) 0%,rgba(89,57,39,0) 62%,rgba(89,57,39,1) 70%);
	background: -webkit-radial-gradient(ellipse at center, rgba(89,57,39,1) 0%,rgba(89,57,39,0) 62%,rgba(89,57,39,1) 70%);
	background: radial-gradient(ellipse at center, rgba(89,57,39,1) 0%,rgba(89,57,39,0) 62%,rgba(89,57,39,1) 70%);
}

.menuOpen {
  	display: none;
}

.btnLine {
  	width: 28px;
  	height: 2px;
  	background: #232323;
  	display: block;
  	position: absolute;
  	top: 50%;
  	left: 50%;
  	margin-left: -14px;
  	margin-top: -1.5px;
  	-webkit-transition: -webkit-transform 200ms;
  	transition: -webkit-transform 200ms;
  	transition: transform 200ms;
  	transition: transform 200ms, -webkit-transform 200ms;
}

.btnLine-1 {-webkit-transform: translate3d(0, -8px, 0);transform: translate3d(0, -8px, 0);}
.btnLine-2 {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}
.btnLine-3 {-webkit-transform: translate3d(0, 8px, 0);transform: translate3d(0, 8px, 0);}

.menuOpen:checked + .menuOpen-button .btnLine-1,
.closeBtn .btnLine-1{
  	-webkit-transform: translate3d(0, 0, 0) rotate(45deg);
          	transform: translate3d(0, 0, 0) rotate(45deg);
}
.menuOpen:checked + .menuOpen-button .btnLine-2 {
  	-webkit-transform: translate3d(0, 0, 0) scale(0.1, 1);
          	transform: translate3d(0, 0, 0) scale(0.1, 1);
}
.menuOpen:checked + .menuOpen-button .btnLine-3,
.closeBtn .btnLine-2{
  	-webkit-transform: translate3d(0, 0, 0) rotate(-45deg);
          	transform: translate3d(0, 0, 0) rotate(-45deg);
}

.menuOpen-button {
  	z-index: 1;
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
          	transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
 	-webkit-transition-duration: 400ms;
          	transition-duration: 400ms;
  	-webkit-transform: scale(1.1, 1.1) translate3d(0, 0, 0);
          	transform: scale(1.1, 1.1) translate3d(0, 0, 0);
  	cursor: pointer;
}

.menuOpen-button:hover {
  	-webkit-transform: scale(1.2, 1.2) translate3d(0, 0, 0);
          	transform: scale(1.2, 1.2) translate3d(0, 0, 0);
}

.menu-item:hover,
.menuOpen-button:hover{
  	background: white;
}

.left_item {
  	-webkit-transition-duration: 320ms;
          	transition-duration: 320ms;
}
.active {
  	-webkit-transition-duration: 480ms;
          	transition-duration: 480ms;
}
.right_item {
  	-webkit-transition-duration: 640ms;
          	transition-duration: 640ms;
}

.menuOpen:checked ~ .menu-item {
  	-webkit-transition-timing-function: cubic-bezier(0.935, 0, 0.34, 1.33);
          	transition-timing-function: cubic-bezier(0.935, 0, 0.34, 1.33);
}
.menuOpen:checked ~ .left_item {
  	-webkit-transform: translate3d(-140px, -30px, 0);
          	transform: translate3d(-140px, -30px, 0);
}
.menuOpen:checked ~ .active {
  	-webkit-transform: translate3d(-35px, -50px, 0);
          	transform: translate3d(-35px, -50px, 0);
	width: 120px;
  	height: 120px;
}
.menuOpen:checked ~ .right_item {
  	-webkit-transform: translate3d(90px, -30px, 0);
          	transform: translate3d(90px, -30px, 0);
}

.menuOpen:checked ~ .left_item,
.menuOpen:checked ~ .right_item {
	width: 100px;
  	height: 100px;
}


.startPage .menuOpen:checked ~ .menuOpen-button{
	-webkit-transform: scale(0, 0) translate3d(0, -50px, 0);
          	transform: scale(0, 0) translate3d(0, -50px, 0);}

.startPage .menuOpen:checked ~ .right_item,
.startPage .menuOpen:checked ~ .left_item,
.startPage .menuOpen:checked ~ .active{
	left:calc(-60px - 0.5vw);
	width: calc(120px + 2vw);
  	height: calc(120px + 2vw);}


.startPage .menuOpen:checked ~ .right_item{
	-webkit-transform: translate3d(calc(120px + 2vw), calc(-50px - 2vw), 0);
          	transform: translate3d(calc(120px + 2vw), calc(-50px - 2vw), 0);
	}	
.startPage .menuOpen:checked ~ .left_item{
	-webkit-transform: translate3d(calc(-120px - 2vw), calc(-50px - 2vw), 0);
          	transform: translate3d(calc(-120px - 2vw), calc(-50px - 2vw), 0);
	}	
.startPage .menuOpen:checked ~ .active{
	-webkit-transform: translate3d(0px, calc(-50px - 2vw), 0);
          	transform: translate3d(0px, calc(-50px - 2vw), 0);
	}





	
	

/*WORK*/
.workFull .thumb {
	width: 100%;
}

.workSide .thumb {
	width: 95%;
}

.thumb {
	-webkit-transition-duration: 200ms;
          	transition-duration: 200ms;
	margin: 1%;
	display: block;
	float: left;
	margin-bottom: 25px !important;
	max-width: 300px;
	height: auto;
}


.thumb.big {
	max-width: 620px;
}

.gallery div a img {
	width: 100%;
}
		
.workFull{width:100%;}
		
.workSide{
	left:0px;
	width:20%;
	padding-top: 100px;
	}
				
.portfolioContainer{
	padding-top:0%;
	margin-left:auto;
	margin-right:auto;
	width:103%;
	}

#thumbConti{top:0px;
padding-top: 0px;}

.workInfo{
	-webkit-transition: all ease 1s;
	transition: all ease 1s;
	position:absolute;
	right: 0%;
	width:80%;
	background:black;
}

.workInfo .title{
	padding-top: 3px;
	border-bottom: solid 1px #382914;
}

.workInfo .title h4,
#imprint h4{
	color: #DFD3BD;
	font-weight: 200;
	
	
}

.workInfo .title br{
	display: none;
}
	
.workInfoClosed{
	right: -100%;
}


.closeBtn{
	-webkit-transition: all ease 0.2s;
	transition: all ease 0.2s;
	top: 0px;
	right: 0px;
	position: absolute;
	width: 30px;
	height: 30px;
	border: ridge 1px #C7AD76;
	border-top: none;
	background: rgba(18,10,1,1);
	border-radius: 0 0 5px 5px;
}

.closeBtn:hover{
	background: #57503e;
	width: 32px;
	height: 32px;
	
}

.closeBtn .btnLine{
  	background: #DFD3BD;
}

/* WORK INLAY */
.workInfoInlay{
	height:calc(100vh - 60px);
}

.workInfoInlay .workText,
.workInfoInlay .videoDiv,
.workInfoInlay video,
.workInfoInlay .smallPic,
.workInfoInlay .bigPic{
	border-bottom: solid 1px #382914;
	margin-bottom:1%;
	padding-bottom: 1%;
}


.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}

.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.workInfoPic{
	float: left;
	margin: 0 10% 0 10%;
}


.workText{
	padding-top:3%;
	max-width:80%;
	margin-right:auto;
	margin-left:auto;
	overflow: auto;
}

.bigPic{
	width:auto;
	height:auto;
	max-width:80%;
	max-height: 75%;
}

.topPic{
	width:auto;
	height:auto;
	max-width:40%;
	max-height:25vh;
	float: left;
	margin-right: 10%;
}
	

.smallPic{
	width:auto;
	height:auto;
	max-width:39%;
	max-height: 45%;
	margin: 0 1%;
}

.picLeft{float:left;}

.picRight{float:right;}
	
.pic2{top:15%;}
	
.smallPic img{
	width:auto;
	height:auto;
	max-width:100%;
	max-height:100%;
	float:left;
	margin-right:3%;
}

.bigVid{
	width:auto;
	height:auto;
	max-width:80%;
	max-height:80%;
	}


			

.linearMasked{
	-webkit-mask-image: -webkit-linear-gradient(top, rgba(0,0,0,0) 2%,rgba(0,0,0,1) 30%,rgba(0,0,0,1) 75%,rgba(0,0,0,0) 99%);
	-mask-image: linear-gradient(top, rgba(0,0,0,0) 2%,rgba(0,0,0,1) 30%,rgba(0,0,0,1) 75%,rgba(0,0,0,0) 99%);
}	
		


/*ABOUT*/
		
#aboutPic{
	margin-left:-50px;
	margin-right:50px;
	max-height:100%;
	max-width:50%;
	width:auto;
	left:0px;	
	float: left;	
	-webkit-clip-path: polygon(80% 0, 80% 35%, 95% 50%, 80% 65%, 80% 100%, 0% 100%, 0 0);
	clip-path: polygon(80% 0, 80% 35%, 95% 50%, 80% 65%, 80% 100%, 0% 100%, 0 0);
	-webkit-shape-outside: polygon(80% 0, 80% 35%, 95% 50%, 80% 65%, 80% 100%, 0% 100%, 0 0);
	shape-outside: polygon(80% 0, 80% 35%, 95% 50%, 80% 65%, 80% 100%, 0% 100%, 0 0);
	-webkit-shape-margin: 2%;
	shape-margin: 2%;
	}

#aboutText{
	margin:5%;
	left:0px;
	max-width:80%;}


/*SCROLLBAR*/
	
::-webkit-scrollbar {width: 15px;height: 15px;}
::-webkit-scrollbar-button {width: 0px;height: 0px;}
::-webkit-scrollbar-thumb {background:rgba(221,203,156,0.5); border-radius: 10px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.7);box-shadow: inset 0 0 6px rgba(0,0,0,0.7);}
::-webkit-scrollbar-thumb:hover {background: #ffffff;}
::-webkit-scrollbar-thumb:active {background: #CFCFCF;}
::-webkit-scrollbar-track {background:rgba(221,203,156,0.3); -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);box-shadow: inset 0 0 6px rgba(0,0,0,0.3);border-radius: 10px;}
::-webkit-scrollbar-track:hover {background: #666666;}
::-webkit-scrollbar-track:active {background: #333333;}
::-webkit-scrollbar-corner {background: transparent;}
	

	

/* MEDIA QUERIES */

@media all and (min-width: 1670px)  {	
	
.portfolioContainer{	
	max-width:1670px;
}	
.workSide .portfolioContainer{
	margin-left:10%;
}	
}

@media all and (max-width: 1670px)  {	
	
.portfolioContainer{
	max-width:1340px;
}	
.gallery {
	margin-left:2%;
}
}

@media all and (max-width: 1330px)  {	
	
.portfolioContainer{
	max-width:1000px;
}	
		
}

@media all and (max-width: 1000px)  {	
	
.portfolioContainer{
	max-width:665px;
}	
.gallery {
	margin-left:4%;
}
}




@media all and (max-width: 767px)  {	
	
.menu-item, .menuOpen-button{
	width: 44px;
  	height: 44px;
  	bottom: 0px;
  	left:-22px;
}
	
.menuOpen:checked ~ .right_item,
.menuOpen:checked ~ .left_item{
	left: -40px;
	width: 80px;
  	height: 80px;}
	
.menuOpen:checked ~ .left_item {
  	-webkit-transform: translate3d(-90px, -30px, 0);
          	transform: translate3d(-90px, -30px, 0);
}
.menuOpen:checked ~ .active {
  	-webkit-transform: translate3d(-28px, -50px, 0);
          	transform: translate3d(-28px, -50px, 0);
	width: 100px;
  	height: 100px;
}

.menuOpen:checked ~ .right_item {
  	-webkit-transform: translate3d(90px, -30px, 0);
          	transform: translate3d(90px, -30px, 0);
}
	
.menu-item h3{
  	font-size: 80%;
  	}
	

.startPage .menuOpen:checked ~ .right_item,
.startPage .menuOpen:checked ~ .left_item,
.startPage .menuOpen:checked ~ .active{
	left:-40px;
	width: 80px;
  	height: 80px;}
	
.startPage .menuOpen:checked ~ .right_item{
	-webkit-transform: translate3d(80px, -50px, 0);
          	transform: translate3d(80px, -50px, 0);
	}	
.startPage .menuOpen:checked ~ .left_item{
	-webkit-transform: translate3d(-80px, -50px, 0);
          	transform: translate3d(-80px, -50px, 0);
	}
	
.startPage .menuOpen:checked ~ .active{
	-webkit-transform: translate3d(0px, -50px, 0);
          	transform: translate3d(0px, -50px, 0);
	}	

.menuCircleBack{
	width: 270px;
  	height: 334px;
	left:calc(50% - 135px);
}
	
.startVideoDiv{
	border-width: 2px;
}
	
}








@media all and (max-width: 650px)  {	

.gallery {
	margin-left:1%;
}
}


@media all and (max-width: 630px)  {	
	
.portfolioContainer{
	max-width:300px;
}	
}


@media (orientation: portrait){
	
.workInfo{
	margin-left:0%;
	width:100%;
}
	
#thumbConti.workSide{
	left:0px;
	width:0px;
}
	
.logoConti.startPage{
	top: calc(20px + 5% - 4vh);
	left: calc(35% - 4vh);
	}
	
.startVideoDiv{
	width: 80%;
	top: 37%;
	right: 10%;
}
	
.videoDiv{
	width: 100%;
	margin-left: 0%;
}
	
.bigVid{
	max-width:100%;
	}
	
.bigPic{
	max-width:100%;
}
	
.workText{
	max-width:90%;
}

.smallPic{
	max-width:44%;
	}
	
	#imprintInner div{width: 100%}
	
}

@media (orientation: portrait) and (max-width: 767px) {
.startVideoDiv{
	width: 96%;
	right: 2%;
}

.logoConti.startPage{
	height: calc(15% + 4vh);
	width: calc(15% + 4vh);
	top: calc(20px + 5% - 4vh);
	left: calc(29% - 4vh);
	}
	
.logoConti.mainPage{
	top: 5px;
	left: 15px;
	height: 35px;
	width: 35px;	
	}
}