﻿#promo { 
	height: 58px;
	border-bottom: 2px solid black;}
h1#converter {
	font-size: 14px;
	font-style: bold; 
	float: left; 
	margin-left: 35px;
	margin-right: 15px;
	margin-top: 20px;
	max-width: 435px;
}
	
#signupbutton {
	background-image: url(/images/front/button_signup_complex.png);
	position: absolute; top: 23px; right: 20px;
	}

.second_signup_button {
	background-image: url(/images/front/button_signup_green.png);
	margin: 0px auto;
	}
	
.button { height: 40px; width: 200px; }
.button { background-position: 0 -80px; }
.button:hover { background-position: 0 -40px; }
.button:active { background-position: 0 0; }

p.confidential{
	font-size: 12px;
	font-weight: normal;
	}
	
div#status_bar {
	border-bottom-width: 0;}

#river, #shuffle, #add_word_wrapper { display: none; }
div.demo_slide {
    position: absolute; padding: 10px 20px; display: none;
    -moz-border-radius:0.5em 0.5em 0.5em 0.5em;
    -moz-box-shadow:0 2px 7px #888888;
    -webkit-border-radius: 0.5em;
    -webkit-box-shadow: 0 2px 7px #888;
    background:none repeat scroll 0 0 #C1E0FF;
    z-index: 10;
    border: 2px solid white;
}

/* These buttons don't have a background for some reason in Android */
body.android .demo_slide input {
background-color: #ededed;
-webkit-border-radius: 10px;
}

/* Progress Bar Above Skritter Window */
#demo_progress { border: 1px solid black;
		 margin-top: -25px; margin-bottom: 10px;
		 line-height: 23px; padding: 2px 5px 2px 10px; 
	       }

#demo_progress > span { float: left; }

#demo_progress div.back { width: 540px; float: left; height: 23px; 
			       position: relative; }
#demo_progress div.fore { height: 23px; top: 0; position: absolute; }
#demo_progress img.fore { height: 23px; }

#demo_progress_bar {
    background: url(/images/practice/topbar_groove_green_center.png) repeat-x; }
#demo_progress_bar div.fore { left: 0;
    background: url(/images/practice/topbar_green_liquid_center.png) repeat-x; }
#demo_progress_bar img.fore { position: absolute; right: -10px; top: 0; }
#demo_progress_bar img.back { position: absolute; right: -1px; }


/* Slides */

div.demo_slide p{
	margin: 10px 0;
	font-size: 16px;
	font-weight: bold;
	text-align: center;}	

div.demo_slide img {
 position: absolute; height: 40px; width: 38px; z-index: 1; }
div.demo_slide img.down_arrow { bottom: -40px; }
div.demo_slide img.up_arrow { top: -40px; }
div.demo_slide input.ok { float: right; }
div.demo_slide a, div.demo_slide a:visited {
 color: #66f; text-decoration: underline; }

div.demo_slide ul { text-align: left; }

.select_buttons { text-align: center; }
.select_buttons input { margin: 0 20px; }
.language_buttons input { width: 200px; }

#cram_button, #active_lists_button, #settings_button, #add_word_button { 
    opacity:0.4;filter:alpha(opacity=40);
}

#skritter_window { height: 405px; }
#help_icon { display: none; }
.star_button { display: none; }

/* common slide positionings */

.center_slide { top: 161px; left: 168px; width: 345px; }

.canvas_point { bottom: 445px; left: 20px; }
.canvas_point .down_arrow { left: 150px; }

.next_point { bottom: 116px; left: 166px; width: 250px; }
.next_point .down_arrow { left: 150px; }

.above_all { bottom: 26px; right: 20px; width: 266px; }

.speaker_point { top: 211px; right: 48px; }
.speaker_point .up_arrow { right: 9px; }

.prompt_point { bottom: 463px; right: 20px; width: 326px; }
.prompt_point .down_arrow { right: 247px; }

.phantom_point { bottom: 110px; left: 25px; width: 297px; }
.phantom_point .down_arrow { left: 148px; }

.correct_point { bottom: 105px; left: 100px; width: 300px; }
.correct_point .down_arrow { left: 144px; }

.erase_point { bottom: 105px; left: 50px; width: 300px; }
.erase_point .down_arrow { left: 144px; }

.offside { bottom: 26px; right: 20px; width: 266px; }

.hidden_slide { left: -9001px; }



