@charset "UTF-8";
/* Group Body Left-Column CSS */

#left-column {
    display: flex;
    flex-flow: column nowrap;
    justify-content: space-between;
	flex: 0 1 58%; /*child of page-wrapper*/
    width:58%;
	text-align: justify;
}
@media only screen and (orientation:portrait)
    {#left-column{width:100vw;display:flex;flex-flow:column nowrap;justify-content: flex-start; flex:1 1 auto;align-items:center;margin-bottom:3%;}}

@media only screen and (min-width:1025px) and (max-width:1400px) and (orientation:landscape)
    {#left-column{flex:1 1 auto;width:50%}}
@media only screen and (max-width:1024px) and (orientation:landscape)
    {#left-column{width:100%;display:flex;flex-flow:column nowrap;justify-content: flex-start; flex:1 1 auto;align-items:center;margin-bottom:3%;}}


.left-subbox {
    height:auto;
    padding: 3% 5% 4% 5%;
    font-size: 2vh;
    line-height: 1.4em;
}
@media only screen and (max-width:1023px) and (orientation:landscape)
    {.left-subbox{font-size:4vh;}}
    

#insert-pic{
    margin:5% 0;
    height:calc(80vw * 0.58 * 0.3);
    width:100%;
}
@media only screen and (orientation: portrait)
    {#insert-pic{width: 100vw; height: calc(100vw * 0.3); background-size:cover;margin: 3% 0;flex:0 0}}
    
@media only screen and (min-width:1025px) and (max-width:1400px) and (orientation: landscape)
    {#insert-pic{height: 20vh;width:100%;}}
@media only screen and (max-width:1024px) and (orientation:landscape)
    {#insert-pic{width: 100vw; height: calc(100vw * 0.3); background-size:cover;}}
    

.yamaha-note{
    height:3em;
    width:3em;
    float: left;
    margin:2% 1.5% 1% 1.5%;
    background: url("../Assets/yamaha-note.png") no-repeat center;
    background-size: cover;
}