@font-face {
  font-family: barrio;
  src: url(Barrio-Regular.otf);
}
NichSketchBg {
    position: absolute;
    width: 70%;
    left: 0%;
    
}
body, html {
	/*height:100%;*/
	margin: 0;
	/*font-family: 'Ubuntu', sans-serif;*/
	line-height: 100%;
	color: #000000;
	text-align: center;
	background-color: orange;
    /*background-image: url(imgs/bg.png);*/

	
	font-size: 100%;
	font-family: 'Helvetica', 'Arial', sans-serif;
    text-align: left;
}
#Main{
	position:absolute;
	left: 12.5%;
	width: 75%;
	
}
#player-container{
	width: 1366px;
	/*height: 100vh;*/
	position: absolute;
	/*background-color: #cccfff;*/
	top:75px;
	left:0%;
	
}

.MainNich0{
	position: relative;
	width: 95%;
    left: -2.5%;
   
	
}
.MainNich0:before{
	content: "";
	display: flex;
	padding-top: 100%; 	/* initial ratio of 1:1*/
}
.content0{
	position:  absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}


.MainNich{
    
	position: relative;
	width: 87.5%;
    left: 1.25%;
    
    /*left: -2.5%;*/
	/*height:512px;*/
	/*background-color:blue;*/
	
	
}
.MainNich:before{
	content: "";
	display: flex;
	padding-top: 100%; 	/* initial ratio of 1:1*/
}
.content{
	position:  absolute;
	top: 0%;
	left: 0%;
	bottom: 0%;
	right: 0%;
}
#NickLeftBar{
	position: absolute;
	right:-5%;
	top:0%;
	height:100%;
	
	background-image: url(nicho_parts/vert_r.png);
	
}
#NickRightBar{
	position: absolute;
	left:5%;
	top:0%;
	height:100%;
	
	background-image: url(nicho_parts/vert_l.png);
	
}
#NichInside{
    background-image: url(nicho_parts/bg.png);
    background-repeat:repeat-y;
    background-size:contain;
}
#NickBg{
    position:relative;
    left: 10%;
    width: 70%;
    height: 70%;
    
    
    
}
#TopBar{
	position: absolute;
	left:0%;
	top:-32px;
	height:32px;
	width: 100%;
	background-image: url(nicho_parts/horiz_top.png);
}
#BottomBar{
	position: absolute;
	left:0%;
	bottom:-32px;
	height:32px;
	width: 100%;
	background-image: url(nicho_parts/horiz_bott.png);
}
#NickCeil{
	margin: auto;
	position: absolute;
	left: 0%;
	top:0%;"
	
}
#NickFloor{
	position: absolute;
	left: 0%;
	bottom:0%;
	
	
}





/*//////////////////////////////
//////////////////////////////*/

.start-video {
    position: absolute;
    top: 76px;
    left: 226px;
    padding: 12px;
    
    opacity: .8;
    
    cursor: pointer;
    
    transition: all 0.3s;
}
.start-video2{
    position: absolute;
    top: 128px;
    padding: 12px;
    left: 180px;
    opacity: .8;
    
    cursor: pointer;
    
    transition: all 0.3s;
}
.start-video:hover {
    opacity: 1;
    -webkit-filter: brightness (1);
}
.start-video2:hover
{
    opacity: 1;
    -webkit-filter: brightness (1);
}
div.thumbnail_container
{
    width: 600px;
    height: 280px;
    overflow: hidden;
    background-color: #000;
}
div.thumbnail_container2
{
    width: 542px;
    height: 392px;
    overflow: hidden;
    background-color: #000;
}
#player1 {
	position: absolute;
	left:20px;
	top:20px;
	z-index:-1;
	pointer-events: all;
	width: 600px;
	height: 280px;
	background-color:#000000;
}
#player2 {
	position: absolute;
	left:59px;
	top:32px;
	z-index:-1;
	pointer-events: all;
	width: 524px;
	height: 392px;
	background-color:#000000;
}
#player-container{
	width: 1366px;
	/*height: 100vh;*/
	position: absolute;
	/*background-color: #cccfff;*/
	top:75px;
	left:5%;
	
}

.video-container {
position: absolute;
padding-bottom: 36%;
    bottom: 8%;
    left: 5%;
padding-top: 0px; width: 64%; overflow: hidden;
    background-image: url(imgs2/video_frame2.png);
    background-size: cover;
}

.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
bottom: 9%;
left: 9%;
width: 82%;
height: 82%;
}