.container{
	display:flex;
	flex-direction: column;
	width:720px;
	padding:0px 0px 10px 25px;
}

		code {
		    padding: 2px 4px;
		    font-size: 90%;
		    color: #c7254e;
		    background-color: #f9f2f4;
		    border-radius: 4px;
		}
  
  	.demo_content{
  		display: flex;
  		padding:30px;
  	}
  	
		.demo_ttl{
			color:red;
		}
		
		.yg_manual{
			font-size:20px;
			color:#333;
		}
		
		a:hover ,a:link,a:visited {
		 	text-decoration: none;
		}			
		
		.ttl{
			font-size:22px;
	    background-color: #3570ad;
	    padding:10px;
	    color:white;
		}
		
		.well {
	    min-height: 20px;
	    padding: 19px;
	    margin-bottom: 20px;
	    background-color: #f5f5f5;
	    border: 1px solid #e3e3e3;
	    border-radius: 4px;
	    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
	    box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
	    font-size: 25px;
	}
  
  
input[type=range]{
  vertical-align:middle;
}  

.ygParent{
    position:fixed;
    top: 5%;
    left: 40%;
    width:480px;
	  display:none;
}

li {  
	margin: 15px; 
}


.playable {  
	cursor:pointer;
	font-size:25px;
}


.srcWrapper{
	text-align: center;
}

.src{
	padding:10px;
  width: 70%;
  margin: 0 auto;
  text-align: left;
}