body {
  text-align : left;
  margin-top: 0vw;
  margin-left: 0vw;
  margin-right: 0vw;
 /* font-family: helvetica; */
  font-family: favorit regular;
  font-size: 1vw;
  color: rgba(255,255,255,0.30);
  line-height: 1 ;
  background-color: black;

	}

@font-face {
	font-family: SilkaMono-Light;
	src: url("fonts/SilkaMono-Light.otf") format("opentype");
}

@font-face {
	font-family: favorit regular;
	src: url("fonts/favorit-regular.otf") format("opentype");
}

img { 
margin-left:-0.9vw;

}


  .accordion {
  font-family: favorit regular;
  background-color: rgba(238, 238, 238, 0);
  color: rgba(255,255,255,0.3);
  cursor: pointer;
  margin-left: 1vw;
  border: none;
  text-align : left;
  outline: none;
  font-size: 14vw;
  transition: 0.05s;
  line-height: 1	 ;
  box-align: left;
  
  
  }

  .link:hover {
    opacity: 0.60;
    }

	link2:hover {
    background-blend-mode: 0.60;
    }
    
    .link {
      text-decoration: none;
      color: #FFFFFF;
      padding-left: 1vw;
      }

	 .link2 {
      text-decoration: none;
      color: #FFFFFF;
      padding-left: 1vw;
	
      }

  .active, .accordion:hover {
  color: rgba(255,255,255,1);
  transform: translateX(1vw); 
  }

  .panel {
  padding: 0vw 0vw 0 17vw;
  margin-left: 0vw;
  margin-right: 0vw;
  background-color: rgba(255, 255, 255, 0);
  max-height: 0;
  text-align: left;
  overflow: hidden;
  transition: max-height 0.3s ease-in-out;
  font-family: SilkaMono-Light;
  color: white;
  font-size: 0.75vw;
  }

.row{

}
.column {
	float: left;
	width: 45%;
  	margin-left: 0%;
	padding-top: 8vw;
	padding-right: 0vw;
	padding-bottom: 0;
	padding-left: 0vw;
	text-align: left;
	font-size: 0.75vw;

}

.column-pic {
	float: left;
	width: 30%;
  	margin-left: 0%;
	padding-top: 8vw;
	padding-right: 0vw;
	padding-bottom: 0;
	padding-left: 0vw;
	text-align: left;

}

.cut {
	float: left;
	width: 37%;
  	margin-left: 6%;
	padding-top: 8vw;
	padding-right: 0vw;
	padding-bottom: 0;
	padding-left: 0vw;
	text-align: left;			
	}
	

/* Clearfix (clear floats) */
.row::after {
  content: "";
  clear: both;
  display: table;

	
}

.project-column {
	text-align: left;
	float: left;
	font-size: 0.75vw;
	width: 44%;
	padding-top: 0vw;
	padding-right: 2vw;
	padding-bottom: 0;
	padding-left: 0vw;
}

.project-column iframe {
	width: 29vw; height: 16vw;
	transform: translate(12vw);
}

.column-pic img {
	transform: translate(12vw);
	margin-right: 3px;
	margin-bottom: 3px;
	margin-left: 1px;
	
}

.socialmedia {
	margin-top: 4.5vw;

}

.copyright {
	text-align: right; 
	font-family: helvetica; 
	font-size: 11pt; 
	padding-top: 4.5vw; 
	padding-right: 3vw; 
	color: rgba(255,255,255,0.3)
}


.centered-middle {
			position: absolute;
			top: 150px;
			left: 50%;
			transform: translate(-50%, 0%);
			line-height: 2;
			text-align: left;
         	}

.centered-middle iframe {
			width: 640px;
			height: 360px;
}

.container {
            position: relative;
            text-align: center;
            color: white;
			width: 95vw;
			transform: translate(2.5%, 0);
				
            }

iframe{			
				width: 40vw;
				height: 22.4vw;
				border-width: 1px;
				border-color: #434343;
				border-style: solid;
			}

.dates {
	font-size: 0.75vw;
}

.bio {
	transform: translate(-6vw);
	padding-right: 24.5vw;
	font-size: 0.75vw;
	
}

.video{
	transform: translate(12.5vw);
}

/* Hide scrollbar for Chrome, Safari and Opera 
:-webkit-scrollbar {
  display: none;
}
*/

/* scrollbar */
/* width */
::-webkit-scrollbar {
  width: 0px;
  }

/* Hide scrollbar for IE, Edge and Firefox */
.example {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}



@media (max-width : 1250px ){
	.accordion {
		width: 123%;
		height: 150%;
		font-size: 25vw;
		margin-left: -0vw;	
		margin-bottom: -2vw;
		font-family: favorit regular;
  		background-color: rgba(238, 238, 238, 0);
	  	color: rgba(255,255,255,0.3);
	  	cursor: pointer;
	  	border: none;
	  	text-align : justify;
	  	outline: none;
	  	transition: 0.05s;
	  	line-height: 1.15	 ;
	  	box-align: left;

	}	
	
	.panel {
		padding-left: 27vw;
		font-size: 2.5vw;
		text-align: justify;
	}
	
	.copyright {
		font-size: 6pt;
		color: rgba(255,255,255,0.30);
		
	}
	
	.project-column {
		font-size: 2.5vw;
		width: 95%;
		transform: translate(2vw);
	}
	
	.project-column iframe {
		width: 80%; height: 38%;
		transform: translate(0);
		
	}
	
	.column {
		width: 100%;
		transform: translate(-3vw);
		margin-left: 6%;
		font-size: 2.5vw;
	}
	
	.bio {
	transform: translate(-12vw);
	padding-right: 1vw;
	font-size: 2.5vw;
	
}
	.cut {
		width: 35%;
		transform: translate(1000vw);
		
	}
	
	
	iframe {			
		width: 80vw;
		height: 50vw;
		
	}
	
	.socialmedia {
	margin-top: 4.5vw;
	transform: translate(5vw);
	font-size: 2.5vw;
	}
	
	.dates {
		transform: translate(-12vw);
		font-size: 2.5vw;
	}
	
	.video {
		transform: translate(-17.5vw);
		font-size: 2.5vw;
	}
	
}
/*

.shader-web-background-fallback {
  background: url("https://placekitten.com/666/666");
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
}

canvas {
  
  width : 100vw;
  height : 100vh;
  margin : auto;
  padding : 0;
  border : none;
  background-color : black;
}

*/
.2 {
}
