body { background-color: #303030; margin: 0px; padding: 0px; font-family: 'Tahoma', Tahoma, Verdana; color: #CCCCCC; font-size: 12px; }
h2 { color: #cccccc; margin: 0px; padding: 5px;	font-size: 18px; text-align: center; }
a { color: #709fef;	text-decoration: none; font-size: 12px; }
a:hover { color: #FFFFFF; text-decoration: underline; }
td { font-size: 12px; }
p { font-size: 12px; }

div#whole { width: auto; max-width: 1450px; margin-left: auto; margin-right: auto; }
div.block { display: flex; flex-wrap: wrap; justify-content: center; clear: both; line-height: 12px; }
div.block div { margin: 1px; padding: 0px; }
div.block img { width: 286px; height: 160px; border: 1px solid #444; background-color:#222; margin: 0px; padding: 0px; }
div.block a:hover img { border: 1px solid #888; }
div.block p { width: 150px; height: 12px; font-size: 12px; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0px 0px 2px 0px; margin: 0px; }

ul#flex_top_header { display: flex; flex-flow: column wrap; list-style: none; padding: 0; margin: 4px auto 6px auto; }
ul#flex_top_header li { width: 130px; height: 14px; font-size: 12px; text-align: left; color: #888888; }
ul#flex_top_header a { color: #709fef; }
ul#flex_top_header a:hover { color: #fff; }
ul#flex_top_header { width: 310px; height: 84px; }
@media all and (min-width: 480px) { ul#flex_top_header { width: 460px; height: 56px; }}
@media all and (min-width: 640px) { ul#flex_top_header { width: 620px; height: 42px; }}
@media all and (min-width: 960px) { ul#flex_top_header { width: 860px; height: 28px; }}

ul#flex_top { display: flex; flex-flow: column wrap; justify-content: space-between; list-style: none; padding: 0; margin: 0 auto 10px auto; }
ul#flex_top li { width: 150px; height: 20px; text-align: left; color: #888888; }
ul#flex_top a, a.exchange { color: #709fef; }
ul#flex_top a:hover, a.exchange:hover { color: #fff; }
ul#flex_top { width: 308px; height: 480px; }
@media all and (min-width: 480px) { ul#flex_top { width: 460px; height: 320px; }}
@media all and (min-width: 640px) { ul#flex_top { width: 616px; height: 240px; }}
@media all and (min-width: 960px) {	ul#flex_top { width: 924px; height: 160px; }}
@media all and (min-width: 1280px) { ul#flex_top { width: 1232px; height: 120px; }}

/* menu bar */ 
div#navbar { width: auto; height: 30px; border: 1px solid #101010; background-color: #202020; }
ul#menu { margin: 0; padding: 0; list-style-type: none; float: left; position: relative; display: block; height: 30px; font-size: 12px; font-weight: bold; font-family: 'Tahoma', Tahoma, Verdana; }
ul#menu li { display: block; float: left; height: 30px; margin: 0; padding: 0; }
ul#menu li a { display: block; float: left; color: #cccccc; text-decoration: none; font-weight: bold; padding: 8px 8px 0 8px; }
ul#menu li a:hover { background-color: #4080ea; height: 22px; }
ul#menu li a.current { background-color: #709fef; color: white; height: 22px; float: left; margin: 0; }
ul#menu li#menu-home, ul#menu li#menu-paysite, ul#menu li#menu-tag, ul#menu li#menu-follow, ul#menu li#menu-sub-follow { display: none; }
ul#menu li.submenu { padding: 9px 5px 0 0; color: #cccccc; }
ul#menu li.submenu a { font-size: 11px; text-decoration: none; font-weight: normal; padding: 0; }
ul#menu li.submenu a:hover { color: white; height: 20px; text-decoration: underline; background: none; padding: 0; }
ul#menu li.submenu p { display: block; float: left; font-size: 11px; text-decoration: none; font-weight: normal; padding: 0; margin: 0; }
a#logo { float: right; font-family: 'Monoton', cursive; font-size: 22px; margin: 0px 8px; color: #709fef; }
a#logo:hover { color: #4080ea; text-decoration: none; }
@media all and (min-width: 640px) { 
	div#navbar { width: auto; } 
	ul#menu li#menu-home { display: block; }
	ul#menu li a { padding: 8px 20px 0 20px; }
}
@media all and (min-width: 960px) { 
	ul#menu li#menu-paysite, ul#menu li#menu-tag, ul#menu li#menu-follow, ul#menu li#menu-sub-follow { display: block; } 
}

div#tags { display: block; text-align: left; width: 800px; margin: 10px 0 0 0; }
div#tags a { display: block; float: left; width: 200px; }

div#bottom { display: flex; margin: 0px 0px 8px 0px; }
div#bottom-bookmark-us {}
div#bottom-copyright { margin: auto auto 0 auto; }
div#bottom-webmasters {  margin: auto 0px 0px 0px; }
div#bottom-bookmark-us a { font-size: 22px; }