/* Override default padding around the edge of the screen on page 0 - which is too much */

#p0 .ui-content { padding: 3px; }

/* ************** Command input */
.topcalc .ui-input-search {
	/* After removing search icon from input text field, need to shift that whole field left */
	padding-left:10px;
	/*space above and below command input was way too much.*/
	margin: 3px 0 3px 0;
}

/* ********************* Custom Calc Buttons (no label) */

.iosSlider .ui-mini {
	/*custom mini buttons have too much space above them*/
	margin-top:0px;
}

/* ********************* Calc Button with Label */

#calc_keys .ui-block-c p {
	/*get rid of huge margin above and below p tag*/
	-webkit-margin-before: 0em;
	-webkit-margin-after: 0em;
}

#calc_keys .ui-mini {
	/*mini buttons have too much space above them, so reduce this so that label is closer */
	margin-top:1px;
	/*add more space under mini buttons to add spacing between rows.*/
	margin-bottom:11px;
}
#calc_keys .threeletters .ui-btn-inner {
	/* mini button text is 13px by default, 12 lets "DUP" fit. Adjust margin by 1 pixel to keep button same size */
	font-size:12px;
	margin: 0 0 1px 0;
}
#calc_keys p {
	/*label itself, done as a p, color, background, uppercase etc*/
	text-align:center;
	background:#171717;
	color:#ffb93d;
	text-transform:uppercase;
	font-size:60%;
	margin: 0 1em 0 1em;
}
#calc_keys p.yellowbutton {
	/*get rid of the label above the yellow button*/
	background:none;
}
#calc_keys p.labelnobgnd {
	/*get rid of the label above the yellow button*/
	background:none;
}

/* Diagnostic borders */
/*
#calc_keys .ui-grid-d { border: 1px dotted blue; }
#calc_keys .ui-block-a,
#calc_keys .ui-block-b,
#calc_keys .ui-block-c,
#calc_keys .ui-block-d,
#calc_keys .ui-block-e { border: 1px dotted orange; }
*/

/* ************************************ carousel */

.iosSlider0 {
	width: 900px;
	height: 130px;   /* STACK DISPLAY HEIGHT */
}

.iosSlider0 .slider {
	width: 100%;
	height: 100%;
}

.iosSlider0 .slider .item {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 130px; /* STACK DISPLAY HEIGHT */
	margin: 0 0 0 0;
	/*background: #b35900;*/
}

.iosSlider {
	width: 100%;
	height: 47px;   /* CUSTOM BUTTONS CAROUSEL HEIGHT */
}

.iosSlider .slider {
	width: 100%;
	height: 100%;
}

.iosSlider .slider .item {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 47px; /* CUSTOM BUTTONS CAROUSEL HEIGHT */
	margin: 0 0 0 0;
	/*background: #b35900;*/
}

.iosSlider .slider #item1 {
	/*background: url(images/h-slider-1.jpg) no-repeat 0 0;*/
}

.iosSlider .slider #item2 {
	/*background: url(h-slider-2.jpg) no-repeat 0 0;*/
}

.iosSlider .slider #item3 {
	/*background: url(h-slider-3.jpg) no-repeat 0 0;*/
}

.iosSlider .slider #item4 {
	background: url(images/h-slider-1.jpg) no-repeat 0 0;
}

.iosSlider2 {
	width: 900px;
	height: 295px;   /* CAROUSEL HEIGHT */
}

.iosSlider2 .slider {
	width: 100%;
	height: 100%;
}

.iosSlider2 .slider .item {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 295px; /* CAROUSEL HEIGHT */
	margin: 0 0 0 0;
	/*background: #aaa;*/
}

/* SLIDER INDICATORS */

.iosSliderButtons0 {
	/* Overall positioning of the dots area. top, right specify how close to the edges we go */
	position: absolute;
	top: 2px;
	right: 2px;
	width: 100px;
	height: 5px;
}

.iosSliderButtons0 .button {
	float: right;
	width: 4px;
	height: 4px;
	background: #999;
	margin: 0 4px 0 0;
	opacity: 0.25;
	filter: alpha(opacity:25);
	border: 1px solid #8ab96d;
}

.iosSliderButtons0 .selected {
	background: #9ed47d;
	opacity: 1;
	filter: alpha(opacity:100);
}



.iosSliderButtons {
	/* Overall positioning of the dots area. */
	position: absolute;
	bottom: 2px;  /* bottom specifies how close to the bottom edge we go */

	width: 120px; /* width of the div containing the indicator button squares. Just pick a reasonable width */

	/*Centering Method */
	left: 50%;
	margin-left: -60px; /* Half the width */
	
	/* forces child indicator buttons that are display: inline-block; to be centered, within this enclosing block */
	text-align:center;
   
	/*background: red;*/
}

.iosSliderButtons .button {
	display: inline-block;
	width: 4px;
	height: 4px;
	background: #999;

	/* Usually this does the centering of something within parent div, but doesn't work, so used parent text-align:center; technique instead */
	/*margin: 0 auto;*/
	
	opacity: 0.25;
	filter: alpha(opacity:25);
	border: 1px solid #000;
}

.iosSliderButtons .selected {
	background: #393939;
	opacity: 0.8;
	filter: alpha(opacity:80);
}

/* ************************** LOGS */

#log1
{
	height: 99px;
	max-height: 99px;  
}

#log2
{
	height: 247px;
	max-height: 247px;  
}

/* ****************************prevent copy paste madness
	http://stackoverflow.com/questions/10126468/disable-copy-on-jquery-mobile-button-over-phonegap  */
/*
* {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
}

input, textarea{
	-webkit-user-select: auto;
}
*/

/* *************************** RPN STACK FORMATTING
  Each element is
	<li>"hello"<span class="stack_val_type">string</span><span class="stack_comment"></span></li>  */

ul#rpnstack2 {
	list-style:none;
	margin:0;
	padding:0;	
}

#rpnstack2
{
	/* make the list scrollable within a max height */
	height: 5.5em;
	overflow: scroll;
	overflow-x: hidden;
}
#rpnstack2 li {
	/* set the background color, and shift in from the left */
	background:#d8f5b8;
	color: black;
	font-size: 1.1em;
	margin-left: 3px;
	margin-right: 3px;
	padding-left: 2px;
}

ul#rpnstack2 li {
	/* get rid of bold in screen display */
	text-shadow: 0 0;    /* .ui-body-a */
}

#rpnstack2 li span.stack_val_type {
	/* get rid of my type/comment info in the stack item */
	display:none;
}

/* Make code area auto size around content rather than introducing scrollbars */
div.CodeMirror-scroll { height: auto!important; overflow: visible; } /* My own stackoverflow answer: http://stackoverflow.com/questions/12330326/codemirror-disabling-vertical-scroll-bar/14039818#14039818 */

/* Editor textarea */
textarea#code3 {
		border:1px solid #999;
		padding:10px;
		font-family: monospace;
		font-size:13px;		
}
textarea#code3:focus{
		border-color:#333;
}
