﻿@charset "utf-8";
/* CSS Document */
/* General Settings */
body { margin: 0px; background:url(images/body-background.gif) top left repeat-x #ededed; font-family: Arial, Helvetica, sans-serif; min-height:420px; }

body.settings { background:url(images/settings_bg.jpg) top center no-repeat #c4c8d1; height:420px; }
* { margin:0; padding:0; }
.pink { color:#ed028f; }
.blue { color:#0072b7; }

body canvas {  z-index:9999; top:120px;; left:50%; margin-left:-100px; position:absolute; background:#transparent; }

/* Wrapper */
#wrapper { /*width:320px; margin:0 auto;*/ min-height:400px; }

/* Header */
#header { width:100%; height:64px; background:url(images/header-bg.png) top left repeat-x; }
#header h1 { color:#FFFFFF; position:relative; margin:0 auto; width:111px; height:59px; font-size:14px; }
#header h1 span { position:absolute; background:url(images/header-logo.png) top left no-repeat; width:100%; height:100%; }
#header h2 { display:none; }
#header #rotate-note { float:right; margin-top:-50px; font-size:10px;  text-align:right; padding-right:8px; }
#header .signout { float:right; width:100px; font-size:10px; margin-top:-25px; text-align:right; padding-right:8px;}
#header .settings { float:left; width:100px; font-size:10px; margin-top:-25px; padding-left:8px; }
#wrapper #header .viewSettings a { color:#ed028f; font-weight:bold; }
#header a { text-decoration:none; color:#666666; }

/* Content */
/* keep the content centered on landscape */
#content { /* width:320px; margin:0 auto; */ min-height:344px; }

/* Login Screen - Where the user enters in a username and password */
#login .enter { width:320px; margin:10px auto; color:#0072b7; font-size:12px; font-weight:bold; text-align:center; }
#login .msg { width:320px; margin:10px auto; color:#ed028f; font-size:12px; font-weight:bold; text-align:center; }
#login form {  width:320px; margin:10px auto; margin-bottom:0; }
#login #loginTbl {  width:320px; margin:0px auto; }
#login #loginTbl tr td { padding:8px 3px; }
#login .fieldHeader { width:100px; text-align:right; font-size:12px; font-weight:bold; color:#7d7d7d; }
#login #loginTbl input { width:170px; border:1px solid #7d7d7d; height:20px; padding:3px 0 0 3px; font-size:14px; }
#login .extra { color:#0072b7; text-align:center; font-size:12px; height:36px; }
#login .extra a { text-decoration:none; color:#ed028f; font-weight:bold;  }
#login .extra .wait { font-size:16px; color:#ed028f; font-weight:bold;  display:block; padding-top:8px; }
#login #loginBtnWrapper { width:84px; margin:0 auto; padding:10px 0 20px 0; }
#login #loginBtn { width:84px; height:36px; background:url(images/button-login-blue.png) top left no-repeat; border:none; }

#login .infoWrapper { background:url(images/info-bg.gif) #404d6c top left repeat-x; border-top:#000000 1px solid; height:133px; }
#login .info { width:320px; margin:0 auto; color:#FFFFFF; font-size:13px; padding-top:0px; padding-bottom:0px; height:20px; }
#login .about { margin-top:14px; margin-left:10px; margin-right:10px; text-align:left; }
#login .screenshot { margin:0 auto; width:320px; }

#loginCache, #aboutCache { display:none; }

.aboutText { width:320px;  margin:0 auto; }
.aboutText p { margin:10px; font-size:12px; }
.aboutText .blue { color:#0072b7; }
.aboutText .options { font-size:12px; padding:6px 34px; }
.aboutText .options a { text-decoration:none; color:#ed028f; }
.aboutText .options .screenshot { float:right; padding-right:15px; padding-top:10px; }
#btnAboutBack { background:url(images/button-back.png) top left no-repeat; width:84px; height:36px; float:left; }
#btnAboutScreenshot { background:url(images/button-view-screenshot.png) top left no-repeat; width:160px; height:36px; float:right; }

/* The Browse Screen is the default screen where you can browse back and forth between people */
#browse { }
/* the place where it says Score, Name, Number, and tap info */
#browse .who { width:320px; margin:0 auto; height:60px; }
#browse .who .score { float:left; margin:0px 8px 0px 6px; width:48px; height:49px; background:url(images/browse-scorebox-bg.gif) top left no-repeat; }
#browse .who .score .number { width:34px; height:16px; margin-top:0px; margin-left:6px; text-align:center; padding-top:3px; font-size:19px; font-weight:bold; color:#ef087c; }
#browse .who .score .of { font-size:8px; color:#000000; width:34px; height:16px; margin-top:0px; margin-left:5px; text-align:center; padding-top:9px; }
#browse .who .name-number { float:left; padding-left:4px; }
#browse .who .name-number .name { color:#006ebd; font-size:17px; font-weight:bold; }
#browse .who .name-number .number { margin-top:4px; width:128px; height:25px; background:url(images/number-bg.gif) top left no-repeat; font-size:11px; }
#browse .who .name-number .number span { display:block; padding:4px 0 0 35px; }
#browse .who .tap { float:left; padding:6px 0 0 53px; }
#browse .who .tap span { display:block; width:55px; font-size:9px; text-align:center; }
#browse .who .tap span span { display:inline; }
#browse .who .tap .records { padding-top:4px; font-size:11px; width:120px; text-align:right; margin-left:-56px; }
#browse .who .tap .records span { font-size:11px; font-weight:bold; }
#browse .who .tap .records .found span { font-size:9px; font-weight:normal; }
/* the place where you can see pictures, and hit the nav buttons */
#browse .photos { width:320px; margin:0 auto; height:182px; }
#browse .photos .album { float:left; width:218px; height:173px; margin:0px 0px 0px 6px; background:url(images/photo-frame.png) top left no-repeat; } 
#browse .photos .album .profile {  position: relative; width:197px; height:112px; top:9px; left:10px; background:#000000; }
#browse .photos .album .profileImg { width:181px; height:112px; margin:0 auto; }

#browse .photos .album .thumbnails { position:relative; top:13px; left:11px;}
#browse .photos .album .thumbnails ul { list-style:none; }
#browse .photos .album .thumbnails li { display:block; float:left; margin-right:4px; }

#browse .buttons { float:left; margin:0 0 0px 7px; }
#browse .infoWrapper { background:url(images/info-bg.gif) #404d6c top left repeat-x; border-top:#000000 1px solid; }
#browse .info { width:320px; margin:0 auto; color:#FFFFFF; font-size:13px; padding-top:3px; padding-bottom:5px; min-height:105px; }
#browse .info .threshold { float:right; margin-right:5px; }
#browse .info .threshold .score { font-weight:bold; color:#c9ddf6; }
#browse .info p { margin-left:5px; }


#btnSkip { background:url(images/button-skip.png) top left no-repeat; width:84px; height:36px; margin-bottom:10px; }
#btnBack { background:url(images/button-back.png) top left no-repeat; width:84px; height:36px; margin-bottom:10px; }
#btnDelete { background:url(images/button-delete.png) top left no-repeat; width:84px; height:36px; margin-bottom:10px; }
#btnAdd { background:url(images/button-add.png) top left no-repeat; width:84px; height:36px; margin-bottom:10px; }

#prompt { display:none; position:fixed; width:100%; height:100%; background:url(images/screen.png) repeat; z-index:5000; min-height:356px; }
#black { display:none; position:fixed; width:100%; height:100%; min-height:420px; max-width:400px; background:#000000; z-index:9999; }
#promptContent, #promptSettings { display:none; }


#prompt .notice { margin:0 auto; text-align:center; font-size:22px; font-weight:bold; color:#0072b7; margin-top:15px; }
#prompt .buttons { width:195px; margin:0 auto; margin-top:25px; }
#prompt .loading { margin:40px auto 0 auto; text-align:center; color:#ed028f; font-size:22px; font-weight:bold;}
#prompt .note {  width:250px; margin:0 auto; margin-top:120px; font-size:14px; font-weight:bold; }

#prompt #spinner {  margin:0 auto; width:200px; }

body.settings #prompt { background:none; }

/* Settings */
#settings { width:280px; margin:0 auto; padding:0px 10px 10px 10px; height:360px; }
#settings .title { margin:0px 0 4px 0; font-weight:bold; font-size:14px; }
#settings .sort_by { font-weight:bold; margin:10px 0; font-size:13px; float:left; width:145px; }
#settings .sort_by select { width:90px; }
#settings .sort_dir { font-weight:bold; margin:10px 0; font-size:13px; float:right; width:130px; }
#settings .sort_dir select { width:85px; }
#settings .photos { clear:both; padding:17px 0 5px 0; font-size:13px; }
#settings .age { clear:both; padding:2px 0 4px 0; font-size:13px; }
#settings .age select { height:18px; margin-top:7px; }
#settings .score { clear:both; padding:7px 0 4px 0; font-size:13px; }
#settings .locations { margin:10px 0; font-size:13px; }
#settings .locations td { padding:2px 8px 2px 0; line-height:24px; }
#settings .locations td.check { padding-top:8px; }

#btnSettingsBack { background:url(images/button-back.png) top left no-repeat; width:84px; height:36px; margin-bottom:20px; margin-left:28px; float:left; margin-top:12px; }
#btnSettingsSave { background:url(images/button-save-settings.png) top left no-repeat; width:119px; height:36px; margin-bottom:20px; margin-right:28px; float:right; margin-top:12px; }

#btnPromptBack { background:url(images/button-back.png) top left no-repeat; width:84px; height:36px; margin-bottom:10px; float:left; }
#btnPromptDelete { background:url(images/button-delete.png) top left no-repeat; width:84px; height:36px; margin-bottom:10px; float:right; }
#btnPromptAdd { background:url(images/button-add.png) top left no-repeat; width:84px; height:36px; margin-bottom:10px; float:right; }


/* empty */
#empty { width:320px; margin:0 auto; }
#empty .nomore { font-size:32px; font-weight:bold; text-align:center; padding:20px 0; }
#empty .message { text-align:center; padding:10px; font-weight:bold; padding-bottom:88px; }
#empty a { text-decoration:none; }


/* Highslide CSS */
.highslide {
    cursor: url(highslide/graphics/zoomin.cur), pointer;
    outline: none;
}
.highslide-active-anchor img {
	visibility: hidden;
}
#wrapper #content .highslide img {
	border:none;
}
.highslide:hover img {
	border:none;
}

.highslide-wrapper {
	background: white;
}
.highslide-image {
	border:none;
}
.highslide-image-blur {
}
.highslide-caption {
    display: none;
    
    border: 2px solid white;
    border-top: none;
    font-family: Verdana, Helvetica;
    font-size: 10pt;
    padding: 5px;
    background-color: white;
}
.highslide-loading {
    display: block;
	color: black;
	font-size: 8pt;
	font-family: sans-serif;
	font-weight: bold;
    text-decoration: none;
	padding: 2px;
	border: 1px solid black;
    background-color: white;
    
    padding-left: 22px;
    background-image: url(highslide/graphics/loader.white.gif);
    background-repeat: no-repeat;
    background-position: 3px 1px;
}

a.highslide-credits,
a.highslide-credits i {
    padding: 2px;
    color: silver;
    text-decoration: none;
	font-size: 10px;
}
a.highslide-credits:hover,
a.highslide-credits:hover i {
    color: white;
    background-color: gray;
}
a.highslide-full-expand {
	background: url(highslide/graphics/fullexpand.gif) no-repeat;
	display: block;
	margin: 0 0px 0px 0;
	width: 34px;
	height: 34px;
}

/* These must always be last */
.highslide-display-block {
    display: block;
}
.highslide-display-none {
    display: none;
}
