/* colors 

dark blue: #4A74A4
dark green: #7E8B7A
*/
body, h1, p{ background-color:#FFFFFF; color:#333333;border:0; margin:0; padding:0; margin-left: 2%; margin-right: 2%;font-family: Helvetica, "Lucida Grande", Verdana, Arial, sans-serif;
	font-size: 14px;}

/* ------------ */
/* HEADER */
#header{
background:#111111;

}
/* PAGE BODY */
#page-body{padding:10px;text-align: center; color:#333333; text-decoration:none; width: 250px; margin-left: auto; margin-right: auto;}
a:link, a:visited{color:#4A74A4;text-decoration:none;}
a:hover, a:active{color:#7E8B7A;text-decoration:none;}
	

h1 a:link, a:visited{color:#BBB;}
.tag{font-size:11px; margin-bottom:20px;}
.tag a:link, .tag a:visited{color:#BBB;}

/* FOOTER */
#footer{
padding:6px;
color:#BBB;
font-size:11px;
text-align: center;
height:50px;
}
#footer a:link, #footer a:visited{
color:#444444;
text-decoration:none;
}

#Div1{text-align:left;}
#Div1 strong{color:#4A74A4; font-weight:800;}
#Div1 ul li{list-style-type:circle;text-align:left;margin-bottom:6px;}
#mydiv1 { width: 250px; height: 50px; }

/* GLOBAL CSS */

a {
	color: #BBB;
}
img {
	border-width: 0px;
}
input {
	width: 260px;
	background-color: #FFF;
	font-size: 18px;
	margin: 10px 0px 0px 0px;
}
.center {
	text-align: center;
}
.fontSmall {
	font-size: 12px;
}
.bold {
	font-weight: bold;
}

/* GLOBAL FLICK CONTAINER */
#container {
	width: 320px;
	height: 235px;
}

/* ALL FLICK DIVs */
#container div {
	display: none;
	position: absolute;
	top: 80px;
	left: 490px;
	width: 300px;
	height: 235px;
	padding: 10px;
	background-color: #FFFFFF;
	text-align: center;
	color: #666666;
	font-size: 12px;
	-webkit-border-radius: 5px;
	/*NOTE: The currently displaying DIV has overrides for DISPLAY and LEFT attributes in its STYLE tag*/
}




/* IPHONE ANIMATION API CLASSES */
.divRtC {
	-webkit-animation-name: 'RtC';
	-webkit-animation-duration: 1s;
}
.divCtL {
	-webkit-animation-name: 'CtL';
	-webkit-animation-duration: 1s;
}
.divLtC {
	-webkit-animation-name: 'LtC';
	-webkit-animation-duration: 1s;
}
.divCtR {
	-webkit-animation-name: 'CtR';
	-webkit-animation-duration: 1s;
}
@-webkit-keyframes 'RtC' {
	from { left: 490px; }
	to { left: 10px; }
}
@-webkit-keyframes 'CtL' {
	from { left: 10px; }
	to { left: -490px; }
}
@-webkit-keyframes 'LtC' {
	from { left: -490px; }
	to { left: 10px; }
}
@-webkit-keyframes 'CtR' {
	from { left: 10px; }
	to { left: 490px; }
}

/* THE DEBUG RESULTS */
#debug {
	position: absolute;
	text-align: center;
	top: 305px;
	left: 10px;
	width: 300px;
	height: 75px;
	font-size: 12px;
}
#header1{
position: absolute;
text-align: center;
top: 10px;
width: 320px;
}

#arrows{
text-align: center;
top: 0px;
width: 320px;
font-size: 20px;

}
#arrowsLeft{
position: absolute;
top: 120px;
left: 0px;
width: 75px;
height: 300px;
z-index:3;

}

#arrowsRight{
position: absolute;
top: 120px;
left: 415px;
width: 75px;
height: 300px;
z-index:4;

}

#divOF {color:#7E8B7A; width:320px;}