.hi { text-align: center }
.hi img { width: 100%; max-width: 1000px; min-width: 500px }

.summary { float: right; margin: 0 20px 30px 20px; border: 1px solid #666; padding: 0 15px; width: 250px }
.summary h4 { margin: 0.5em 0 -0.5em 0 }
.summary ul { padding-left: 15px; margin-top: -0.5em }

.red { color: #d00 }

.info { margin: 1em 0; padding-left: 34px; line-height: 1.4em; min-height: 34px; color: #003a78; font-size: 15px;
    background: url(../png/info.png) top left no-repeat; vertical-align: middle }

.optlist { line-height: 1.5em }
.colours img, .handles img, .windows img, .gears img, .operators img { border: 2px solid transparent; margin-right: 3px !important; cursor: pointer }
.colours img.sel, .handles img.sel, .windows img.sel, .gears img.sel, .operators img.sel { border-color: #1face5 }
#pnlColour { padding-top: 0.75em; line-height: 2.2em }
#pnlColour img, #pcimg { width: 2em; height: 2em; vertical-align: middle; margin-right: 0.5em }

.gears img { max-height: 100px; }

a.i-prn, a.i-eml { display: inline-block; width: 40px; height: 35px; background-color: #003a78; background-image: url(../png/i-prn.png); transition: 0.4s ease }
a.i-eml { background-image: url(../png/i-eml.png) }
a.i-prn:hover, a.i-eml:hover { background-color: #1face5 }

/*All responsive*/
@media 
    only screen and 
    (min-device-width : 300px) and 
    (max-device-width : 1023px) 
{
    article.page p.info { font-size: 30px; }
    article.page h4 { font-size: 40px; }
}