.ContentBox
{
font-size: 140%;    
}

.Content
{
width: 60%;
}

    #sign
    {
    clear: both;
    margin-top: 10px;
    margin-left: 10px;
    position: absolute;
    right: 20px;
    bottom: 10px;
    font-size: 63%;
    }

    
@media 
(orientation: landscape) {
    .ContentBox
    {
    top: 5%;
    left: 35%;	
    min-width: calc(37% + 40px);
    width: calc(47% + 40px);
    max-width: calc(57% + 40px);
    }
	
    .Content
    {
    }
	
    .ContentImg
    {
    margin-right: -40px;
    width: calc(36%);
    }
		
    .ContentImg img 
    {
    width: calc(100%);
    }
}    
@media 
(orientation: portrait) {
    .ContentBox
    {
    top: 5%;
    left: 20%;	
    min-width: calc(57%);
    width: calc(67%);
    max-width: calc(77%);
    font-size: 100%;
    }
	
    .Content
    {
    clear: both;
    width: 100%;
    }
	
    .ContentImg
    {
    clear: both;
    width: 70%;
    margin-bottom: -40px;
    }
		
    .ContentImg img 
    {
    width: 100%;
    padding-bottom: 20px;
    }
}


@media 
(orientation: portrait) and (max-width: 600px), (orientation: landscape) and (max-height: 600px)
{
    .ContentBox
    {
    top: 1%;
    left: 14%;	
    min-width: calc(60%);
    width: calc(70%);
    max-width: calc(80%);
    }
}
@media 
(orientation: landscape) and (max-aspect-ratio: 5/3)
{
    .ContentBox
    {
    top: 10%;
    left: 25%;
    min-width: calc(57%);
    width: calc(67%);
    max-width: calc(77%);
    }
}