body{ padding: 5px; margin: 0; color: #FFF; font-size: 14px; background-color: #000; font-family: /*"lucida grande",tahoma,verdana,arial,*/sans-serif; }
a{ color: #888; }
img{ border: 0; }
table{ border-collapse: collapse; }
h2{ margin-bottom: 5px; }
p{ margin-top: 5px; }

#logo{ text-align: center; margin-top: 10px; }
#logo img{ margin: auto; }

#menu{ height: 30px; width: 800px; margin: auto; margin-top: 15px; border-bottom: 1px solid #333; }
#menu a{ text-decoration: none; color: #000; text-align: center; display: block; width: auto; height: 24px; padding-left: 8px; padding-right: 8px; padding-top: 6px; float: left; }
#menu a.selected, #menu a:hover{ color: #FFF; }
#menu div.item{ text-align: center; color: #666; width: auto; height: 25px; padding-left: 10px; padding-top: 6px; float: left; }
#menu div.spacer{ text-align: center; display: block; width: 1px; height: 25px; padding-top: 6px; float: left; }

#menu-game{ background-image: url(images/tabs/tab_game.jpg); background-position: top center; background-repeat: no-repeat; }
#menu-game:hover, #menu-game.selected{ background-image: url(images/tabs/tab_game.jpg); background-position: bottom center; background-repeat: no-repeat; }
#menu-leaderboard{ background-image: url(images/tabs/tab_leaderboard.jpg); background-position: top center; background-repeat: no-repeat; }
#menu-leaderboard:hover, #menu-leaderboard.selected{ background-image: url(images/tabs/tab_leaderboard.jpg); background-position: bottom center; background-repeat: no-repeat; }
#menu-instructions{ background-image: url(images/tabs/tab_leaderboard.jpg); background-position: top center; background-repeat: no-repeat; padding-left: 12px !important; padding-right: 12px !important; }
#menu-instructions:hover, #menu-instructions.selected{ background-image: url(images/tabs/tab_leaderboard.jpg); background-position: bottom center; background-repeat: no-repeat; }

#user-bar{ text-align: center; display: block; width: 530px; height: 25px; float: right; }
#user-bar a:hover{ background-color: transparent; color: #FFF; }
#user-bar a.service{ width: auto; padding: 0; margin: 4px; float: right; }
#user-bar a img{ width: 22px; height: 22px; }
#user-bar div.username{ display: block; width: auto; height: 25px; margin-top: 6px; float: right; }

#user-bar a.connect, #user-bar div.connect{ display: block; width: auto; height: 25px; padding-top: 5px; float: right; background-image: url(images/tabs/tab_connect.jpg); background-position: top center; background-repeat: no-repeat; }
#user-bar a.connect:hover{ display: block; width: auto; height: 24px; float: right; background-image: url(images/tabs/tab_connect.jpg); background-position: bottom center; background-repeat: no-repeat; }

#user-bar a.asset{ display: block; width: auto; height: 24px; float: right; background-image: url(images/tabs/tab_game.jpg); background-position: top center; background-repeat: no-repeat; padding-left: 10px; padding-right: 10px; }
#user-bar a.asset:hover{ background-image: url(images/tabs/tab_game.jpg); background-position: bottom center; background-repeat: no-repeat; }

#user-bar a.link{ display: block; width: auto; height: 24px; float: right; background-image: url(images/tabs/tab_logout.jpg); background-position: top center; background-repeat: no-repeat; padding-left: 16px; padding-right: 16px; }
#user-bar a.link:hover{ background-image: url(images/tabs/tab_logout.jpg); background-position: bottom center; background-repeat: no-repeat; }
#user-bar div.inactive{ text-align: center; color: #666; width: auto; height: 25px; padding-left: 10px; padding-top: 6px; float: right; }

#loader{ margin: auto; text-align: center; margin: 20px; }

#game{ margin: auto; display: none; height: 600px; width: 800px; }
#game.hidden{ height: 1px; width: 1px; }
/*#UnityObject{ float: left; }*/

#stats{ display: none; width: 800px; margin: auto; }
#stats table{ width: 100%; }
#stats table tr{ border-bottom: 1px solid #333; border-bottom: 1px solid #333; }
#stats table tr.header{ background-color: #444; }

#stats table tr.first{ font-size: 16px; }
#stats table tr.second{ font-size: 15px; }
#stats table tr.third{ font-size: 14px; }

#stats table tr td.position{ text-align: center; width: 100px; }
/*#stats td.icon{ width: 32px; }
#stats td.name{ width: 560px; }*/
#stats table tr td.score{ width: 200px; text-align: center; }
#stats table tr td img{ float: left; width: 32px; height: 32px; }

#unlock{ display: none; width: 800px; margin: auto; }
#unlock h2{ text-align: center; font-size: 20px; }
#unlock div{ text-align: center; font-size: 18px; }

#instructions{ display: none; width: 800px; margin: auto; }
#instructions h2{ font-size: 20px; }
#instructions div{ text-align: center; font-size: 18px; }
#instructions table{ width: 100%; }
#instructions table tr td{ vertical-align: middle; min-width: 50px; max-width: 200px; }
#instructions table tr td img{ display: inline; }

#logout{ display: block; margin-top: 10px; width: 138px; height: 32px; background-image: url(images/logout_button.jpg); background-position: top left; background-repeat: no-repeat; }
#logout:hover{ background-position: top right; }

#fan{ width: 800px; margin: auto; text-align: center; display: none; }

#footer{ position: absolute; padding-top: 30px; bottom: 0px; width: 99%; text-align: center; color: #FFF; }
#footer a{ color: #FFF; }

#message{ position: absolute; width: 99%; display: none; }
#message table{ margin: auto; width: 700px; }
#message table tr td{ padding: 0; }
#message table tr td.tl{ height: 10px; width: 10px; background-image: url(images/message/tl.png); background-position: top left; }
#message table tr td.tr{ height: 10px; width: 10px; background-image: url(images/message/tr.png); background-position: top left; }
#message table tr td.bl{ height: 10px; width: 10px; background-image: url(images/message/bl.png); background-position: top left; }
#message table tr td.br{ height: 10px; width: 10px; background-image: url(images/message/br.png); background-position: top left; }
#message table tr td.b{ background-image: url(images/message/b.png); }
#message-content{ background-color: #333; }
#message-content h2{ padding: 0px 0px 5px 0px; margin: 0; }
#message-content textarea{ width: 580px; }
#message-content div.controls{ text-align: right; }

div.sharing-controls{ text-align: center; }
div.sharing-controls *{ display: inline-block; vertical-align: middle; }
div.sharing-controls input{ height: 25px; }

/* game target */
div.scroller{ margin: auto; overflow-x: auto; overflow-y: hidden; width: 680px; }
div.photo-loading{ background-image: url(images/loading_fb.gif); background-position: center; text-align: center; }

div.friends{ text-align: center; overflow-x: hidden; overflow-y: auto; max-height: 400px; }
/*#target-friends a{ display: inline-block; text-align: center; width: 70px; min-height: 80px; float: left; font-size: 10px; text-decoration: none; background-image: url(images/loading_fb.gif); background-position: center; background-repeat: no-repeat; }*/
div.friends a{ display: inline-block; vertical-align: top; text-align: center; width: 60px; min-height: 60px; font-size: 10px; text-decoration: none; background-image: url(images/loading_fb.gif); background-position: top center; background-repeat: no-repeat; }
div.friends a img{ border: 1px solid #000; width: 50px; height: 50px; }
div.friends a:hover{ color: #FFF; }
div.friends a:hover img{ border: 1px solid #FFF; position: relative; z-index: 1; }

div.photos{ margin: auto; text-align: center; }
div.photos a{ display: inline-block; vertical-align: top; text-align: center; margin-left: 5px; margin-right: 5px; width: 160px; min-height: 170px; font-size: 10px; text-decoration: none; background-image: url(images/loading_fb.gif); background-position: center; background-repeat: no-repeat; }
div.photos a img{ border: 1px solid #000; max-width: 160px; max-height: 160px; }
div.photos a:hover{ color: #FFF; }
div.photos a:hover img{ border: 1px solid #FFF; position: relative; z-index: 1; }

#target-photo-approval-container{ min-width: 600px; min-height: 100px; background-image: url(images/loading_fb.gif); background-position: center; background-repeat: no-repeat; }
#target-photo-approval-container img{ display: none; min-width: 300px; min-height: 100px; max-width: 600px; max-height: 600px;  }

#target-disclaimer div{ text-align: center; }
#target-disclaimer div img{ max-width: 600px; max-height: 600px; }
#target-disclaimer div input{ margin: 5px; }

#target-photo-display-container{ min-width: 600px; min-height: 100px; background-image: url(images/loading_fb.gif); background-position: center; background-repeat: no-repeat; }
#target-photo-display-container div{ text-align: center; }
#target-photo-display-container div.abuse{ font-size: 8px; padding-bottom: 8px; }
#target-photo-display img{ max-width: 600px; max-height: 600px; }

#target{ display: none; width: 800px; /*background-color: #333;*/ margin: auto; text-align: center; padding: 2px; }

/* support stuff */
#RES_ID_fb_pop_dialog_table{ margin: auto; }

#unity-install1{ width: 600px; margin: auto; text-align: justify; padding: 10px; }
#unity-install2{ width: 600px; margin: auto; text-align: justify; padding: 10px; }