body {
	
	background: #8abae9;
	background-image:url(../images/didbook/didbook_background_tiger_web.jpg);
	background-position:top;
	background-repeat:no-repeat;
	

	font-family:myriad-pro,calibri,sans-serif;
	font-weight: 400;

	/* Firefox inspired blue diagonals - no images */
	/*
	background-color: #8abae9;
	background-image: 
		linear-gradient(to bottom, rgba(138, 186, 233, 0) 0px, rgba(138, 186, 233, 0) 100px, #8abae9 450px, #8abae9)
		, repeating-linear-gradient(118deg, rgba(138, 186, 233, 0) 0px, #77aadb 550px, rgba(138, 186, 233, 0) 550px, #77aadb 800px, rgba(138, 186, 233, 0) 800px, #77aadb 950px);
	background-repeat: no-repeat;
	*/
}


h1, h2, h3, h4, h5, h6, 
input, button, select, textarea
{
	font-family:myriad-pro,calibri,sans-serif;
	font-weight:400;
}


/* stop the highlighting on touch devices after a click */
input, button, select, textarea, a
{
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}


/* fix the inner shadow in webkit browsers for most input types */
input[type="text"],
input[type="password"],
input[type="email"] {
	-webkit-appearance: none;
}

/* TODO: needs further testing - but is a better size for mobile devices and stops the iPhone zoom in... */
/*
select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
  font-size: 16px;
}
*/



h1
{
	font-size:200%;
	color:#659ace;
}

h2, h3
{
	color:#659ace;
	margin-top:30px;
}

h3
{
	font-size:150%;
}



th {
	text-align: left;
}




a
{
	color:#659ace;
}




/* Note:	this fixes spaces to the right on mobile devices but it does so by setting overflow,
			which doesn't fix the problem which is that there is content that can't reflow to the screen width */
/*
@media
only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5){

  html,
  body{
    width:100%;
    overflow-x:hidden;
  }

}
*/