/* book/ 2018/ simple/ trimcut5x8_screen.css :*/
figure{margin:0 0 0 0;width:100%;}
#navpanel{position:fixed;visibility:visible;width:3.5in;}
#figview{ position:fixed;visibility:visible;}
.nava{
display:inline;
float:left;
color:black;
height:1in;
width:1in;
background-size:contain;
display:inline-block;
background-repeat:no-repeat;
background-position:center center;
background-color:beige;
text-decoration:none;
border:1px solid black;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.fig{
background-color:lightyellow;opacity:1.0;
line-height:1.0;
text-align:justify;
font-size:large;
}
.fig:hover img {        display:inline;        visibility:visible;        }

#paper{background:url(linen2d.jpg) repeat;}

/* double-width, GREATER than 2000 pixels ? :*/
@media (min-width:2000px) {
    #board{ background-color:#888;}
    #paper{ display:block; width:8.5in; margin: auto  2in auto auto; border:solid darkgreen 1px; }
    #frame{ display:block; width:6.2in; margin:  0in auto auto auto; border:solid darkred   1px; padding: 0.0in 0.1in 0.1in 0.1in;}
}
/* single-width,    LESS than 2000 pixels ? :*/
@media (max-width:2000px){
    #paper{ display:block; width:8.5in; margin: auto auto auto auto; border:solid darkgreen 1px; }
    #frame{ display:block; width:6.2in; margin:  0in auto  1in auto; border:solid darkred   1px; padding: 0.0in 0.1in 0.1in 0.1in;}
    /* mid-size, OVER 1460 pixel but UNDER 2000 pixels :*/
    @media (min-width:1460px){
        #paper{ margin-right: 0.5in; }
        #board{ background-color:saddlebrown;}
        #board{ background-color:#A63;}
    }
    /* narrow-screen ? :*/
    @media (max-width:1460px){
        #paper{ margin-right: 0; }
        #board{ background-color:#777; }
        #navpanel{ width:2.5in; }
        #figview{  position:static;display:none;visibility:collapse; }
    }
}

