body{ padding: 5px; margin: 0; color: #FFF; font-size: 14px; background-color: #000; font-family: sans-serif; }
a{ color: #888; }
img{ border: 0; }
table{ border-collapse: collapse; }
h2{ margin-bottom: 5px; }
p{ margin-top: 5px; }

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

#menu{ height: 30px; width: 800px; margin: auto; margin-top: 5px; border-bottom: 1px solid #333; }
#menu a, #menu div.item{ display: block; text-decoration: none; color: #AAA; text-align: center; height: 30px; float: left; border-right: 1px solid #000; background-image: url(images/tabs/tab_background.png); background-position: top left; background-repeat: no-repeat; }
#menu a span, #menu div.item span{ display: block; width: auto; height: 24px; padding-left: 8px; padding-right: 8px; padding-top: 6px; background-image: url(images/tabs/tab_right.png); background-position: top right; background-repeat: no-repeat; }
#menu a.selected, #menu a:hover{ color: #FFF; background-image: url(images/tabs/tab_background.png); background-position: bottom left; background-repeat: no-repeat; }
#menu a.selected span, #menu a:hover span{ color: #FFF; background-image: url(images/tabs/tab_right.png); background-position: bottom right; background-repeat: no-repeat; }

/*
#menu div.item{ display: block; text-decoration: none; border-right: 1px solid #000; color: #000; width: auto; height: 24px; padding-top: 6px; float: left; }
#menu div.item span{ display: block; width: auto; height: 24px; padding-left: 8px; padding-right: 8px; padding-top: 6px; background-image: url(images/tabs/tab_right.png); background-position: top right; background-repeat: no-repeat; }
*/
#menu div.spacer{ text-align: center; display: block; width: 1px; height: 25px; padding-top: 6px; float: left; }

#menu-user{ display: block; width: 300px; height: 30px; float: right; }
#menu-user a{ float: right; border-left: 1px solid #000; border-right: 0; }
#menu-user a span{ display: block; width: auto; height: 24px; padding-left: 8px; padding-right: 8px; padding-top: 6px; background-image: url(images/tabs/tab_right.png); background-position: top right; background-repeat: no-repeat; }
#menu-user a:hover{ color: #FFF; background-image: url(images/tabs/tab_background.png); background-position: bottom left; background-repeat: no-repeat; }
#menu-user a:hover span{ color: #FFF; background-image: url(images/tabs/tab_right.png); background-position: bottom right; background-repeat: no-repeat; }

#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; }*/

#user{ display: none; background-color: #444; margin: auto; width: 800px; }
#user-image img, #user-target-image img{ vertical-align: middle; }
#user-image{ width: 50px; }
#user-info{ width: 340px; padding: 0px 5px 0px 5px; }
#user-info-next-level{ font-size: 11px; }
#user-target{ width: 400px; padding: 0px 5px 0px 5px; text-align: right; height: 50px; font-size: 13px; }
#user-target-difficulty{ margin-top: 3px; font-size: 11px; }

#target-change-control{ display: none; }

#activity{ display: none; width: 800px; margin: auto; }
#activity-special-head{ text-align: center; }
#activity-special{ text-align: center; }
#activity div.activity-text{ margin-bottom: 10px; }
#activity div.text{ margin-top: 3px; }

#mazes{ display: none; width: 800px; margin: auto; }
#mazes-content{ text-align: center; }
#mazes-content a{ display: inline-block; vertical-align: top; margin: 15px; text-align: center; width: 80px; min-height: 60px; font-size: 10px; text-decoration: none; background-image: url(images/loading_fb.gif); background-position: top center; background-repeat: no-repeat; }
#mazes-content a img{ border: 0px solid #000; width: 80px; height: 80px; }
#mazes-content a:hover{ color: #FFF; }
#mazes-content a:hover img{ border: 0px solid #FFF; position: relative; z-index: 1; }

#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{ margin-top: 10px; text-align: center; color: #AAA; }
#footer a{ color: #AAA; }

#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{ padding: 5px !important; 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; background-repeat: no-repeat; 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; }

#your-asset{ text-align: center; min-height: 50px; background-image: url(images/loading_fb.gif); background-position: center; background-repeat: no-repeat; }

/* 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; }