/* html5doctor.com Reset Stylesheet (Eric Meyer's Reset Reloaded + HTML5 baseline) */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, time { display:block; }
ul { list-style:none; }
ul, li { margin: 0; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
ins { background-color:#ff9; color:#000; text-decoration:none; }
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
table { border-collapse:collapse; border-spacing:0; }
hr { display:block; height:2px; border:0; margin:1em 0; padding:0; background:url(../images/line.png) repeat-x }
input, select { vertical-align:middle; }
/* END RESET CSS */

@font-face {
    font-family: 'PFAgoraSansProRegular';
    src: url('pfagorasanspro-reg-webfont.eot');
    src: url('pfagorasanspro-reg-webfont.eot?#iefix') format('embedded-opentype'),
         url('pfagorasanspro-reg-webfont.woff') format('woff'),
         url('pfagorasanspro-reg-webfont.ttf') format('truetype'),
         url('pfagorasanspro-reg-webfont.svg#PFAgoraSansProRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}


/* body */
html { background: #fff; min-width: 980px;}
body { font:18px PFAgoraSansProRegular, "Trebuchet MS", Arial, Helvetica, sans-serif; padding: 0px; color: #7a8d2d; width: 960px; margin: 0px auto; text-transform: uppercase;}
/* 
 * minimal base styles 
 */
h1, h2, h3, h4, h5, h6 { font-weight: normal; letter-spacing:-1px }
p, h1, h2, h3, h4, h5, h6, blockquote, ul, time, address { margin:0 0 10px 0 }
.clear{clear: both;}

header{
	display: block;
	height: 51px;
	padding-top: 27px;
	}
	header a{
		color: #cfcccd;
		background: #433f3f url(../images/arr.png) no-repeat 5px 6px;
		height: 21px;
		line-height: 21px;
		float: left;
		padding: 0 6px 0 23px;
		text-decoration: none;
		}
	header a:hover{
		background-color: #726f6f;
		}
		
aside{
	float: left;
	width: 258px;
	text-align: right;
	padding-right: 40px;
	background: url(../images/open.jpg) no-repeat 280px 0px;
	}
	aside img{
		display: block;
		margin-bottom: 27px;
		}
		aside a{
			text-decoration: none;
			color: #433f3f;
			}
			aside a:hover{color: #000;}
			
section{
	float: left;
	width: 662px;
	
	}
	
h1{
	color: #433f3f;
	font-size: 48px;
	line-height: 48px;
	margin-top: -4px;
	}
h2, .author{
	color: #433f3f;
	font-size: 24px;
	line-height: 24px;
	margin: -8px 0 23px 0;
	}
	h2{
		float: left;
		background: url(../images/close.jpg) no-repeat right -2px;
		padding-right: 24px;
		}
	.author{
		margin: 25px 0 3px 0;
		}
p{
	line-height: 1.6em;
	}
.rank{
	color: #433f3f;
	font-size: 14px;
	line-height: 14px;
	height: 27px;
	}
	
	
article{
	width: 550px;
	/* display: block; */
	/* margin: 0 0 0 auto; */
  display: flex;
  flex-direction: row;
  justify-content: space-between;
	}
article img {
  /* float: right; */
  width: auto;
  height: 65px;
  object-fit: contain;
}
article img:hover{opacity: 0.8;}