/* General
----------------------------------*/
* { margin: 0; padding: 0; border: 0; }
html, body { height: 100%; }
body { line-height: 18px; font-family: Helvetica, Arial; font-size: 12px; color: #fff; background: #9ba2a8; overflow-x: auto; overflow-y: hidden; cursor: default; }

#container { position: relative; height: 100%; min-height: 646px; }



/* Top
----------------------------------*/
#top { position: fixed; z-index: 100; left: 0; top: 0; width: 100%; height: 45%; min-height: 300px; }

.text { position: absolute; bottom: 0; left: 50%; width: 460px; height: 340px; text-align: center; margin: 0 0 0 -230px; }
.text h1 { padding: 60px 0 40px; }
.text p { padding: 0 0 36px; }
.text p span { padding: 0 10px; }
.text a { color: #fff; text-decoration: underline; padding: 3px 6px; margin: 0 14px; }



/* Bottom
----------------------------------*/
#bottom { position: absolute; z-index: 99; left: 0; bottom: 0; width: 100%; height: 55%; min-height: 346px; }

.sites { height: 346px; list-style: none; padding: 0 25px; }
.sites li { float: left; width: 506px; height: 346px; padding: 0 25px; }
.sites a.image { float: left; display: block; width: 500px; height: 300px; position: relative; color: #fff; border: 3px solid #8d949a; text-decoration: none; }
.sites a.image:hover { border-color: #808a92; }
.sites a.image img { display: block; width: 500px; height: 300px; }
.sites p { float: right; line-height: 40px; padding: 0 15px; }
.sites p.name { background: #8d949a; }
.sites p.desc { color: #60686f; }

.sites p.partner { float: left; font-size: 11px; color: #60686f; }
.sites p.partner a { color: #60686f; }