.audio-content-wrapper {
	WIDTH: 100VW; 
	HEIGHT: 100VH; 
	LEFT: 0 !IMPORTANT; 
	MARGIN-LEFT: 0PX !IMPORTANT; 
	TOP: 0 !IMPORTANT; 
	MARGIN-TOP: 0PX !IMPORTANT; 
	MARGIN: 0PX !IMPORTANT; 
	POSITION: ABSOLUTE; 
	box-sizing: border-box; 
	clear: both;
	border: 2px solid blue;
	}

.inner-port {
  	width: 100%;  
  	height: 100%; 
  	top: 0;
  	left: 0;
  	padding-top: 100px; padding-top: 0px;
  	7878background-color: #F2F2F2;
  	z-index: 103; 
  	66visibility: hidden;
  	777-webkit-transform: translateY(-100%);
  	777transform: translateY(-100%);
  	border-bottom: 1px solid #d0d0d0;
  	-webkit-transition: all 0.5s ease-in-out;
  	-moz-transition: all 0.5s ease-in-out;
  	transition: all 0.5s ease-in-out;
	/** CENTER DIV VERTICALLY AND HORIZONTALY **/
  		margin: auto;  
  		position: FIXED;
  		left:0;
  		right: 0;
  		top: 0;
  		bottom: 0;
	/** END OF CENTER DIV VERTICALLY AND HORIZONTALY **/
  	background-image: url("data:image/svg+xml,%3Csvg width='6' height='6' viewBox='0 0 6 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%239C92AC' fill-opacity='0.4' fill-rule='evenodd'%3E%3Cpath d='M5 0h1L0 6V5zM6 5v1H5z'/%3E%3C/g%3E%3C/svg%3E") 
	}

.inner-port.item_open {
  	visibility: visible;
  	-webkit-transform: translateY(0%);
  	transform: translateY(0%);
  	-webkit-transition: all 0.4s ease-in-out;
  	-moz-transition: all 0.4s ease-in-out;
  	transition: all 0.4s ease-in-out;
	}

.inner-port > * { padding-top: 0px !important;
  	opacity: 1;
  	-webkit-transition-delay: 0.5s;
  	transition-delay: 0.5s;  
	}