/* To make the web site work nicer on a large screen	*/


/*
@media only screen and (min-width: 800px){
	.ui-page {
		width: 800px !important;
		max-width: 800px;
		margin: 0 auto !important;
		position: relative !important;
	}
	.ui-header-fixed, .ui-footer-fixed {
		width: 800px !important;
		margin: 0 auto !important;
	}

	.ui-overlay-a {
		background-image: -webkit-linear-gradient( #444,#222 );
		background-image: -moz-linear-gradient( #444,#222 );
		background-image: -ms-linear-gradient( #444,#222 );
		background-image: -o-linear-gradient( #444,#222 );
		background-image: linear-gradient( #444,#222 );
	}
}
*/
	/* For wide screens, limits the placement of the header and footer buttons	*/
	.ui-header-fixed, .ui-footer-fixed {
		max-width: 1200px !important;
		margin: 0 auto !important;
	}

	/* Brings the header icons left and right down a few pixels
	.ui-header-fixed .ui-btn-left, .ui-header-fixed .ui-btn-right {
		margin-top: 10px;
	}
 */
 
	/* On imagepg, with left and right buttons, this is needed so the right
		button is vertically in-line with the left button (don't know why)
	.ui-btn-right {
		top: 0px;
	}
	*/

/* needed to set the footer bar proportions */
.my-breakpoint.ui-grid-b .ui-block-a { min-width: 80px; }
.my-breakpoint.ui-grid-b .ui-block-b { max-width: 1400px; }
.my-breakpoint.ui-grid-b .ui-block-c { min-width: 120px; }
.my-breakpoint.ui-grid-b .ui-block-a { clear: left; }



/* To override jquery.mobile.structure-1.4.0.css */
/* Change header and footer border to none */
.ui-header,
.ui-footer {
	border: none;
	height: 2.6em;
}
.ui-footer {
	height: auto;
}


/* To override jquery.mobile.structure-1.4.0.css */
/* Changes lists to make it smaller, not bold, and no border */
/* Used by both listview and custom multiple select button */
.ui-li-count {
	font-size: 11.5px;
	font-weight: normal;
	border-width: 0px;
	border-style: solid;
	padding: 0 .32em;
}

/* To get the <p> text in lists to wrap						*/
/* - changed white-space: nowrap; to white-space: normal;	*/
.ui-listview > .ui-li-static,
.ui-listview > .ui-li-divider,
.ui-listview > li > a.ui-btn {
	white-space: normal;
}


/* To remove the background color and box around the buttons (theme-e)
/* Button up */
.ui-page-theme-e .ui-btn,
html .ui-bar-e .ui-btn,
html .ui-body-e .ui-btn,
html body .ui-group-theme-e .ui-btn,
html head + body .ui-btn.ui-btn-e,
/* Button visited */
.ui-page-theme-e .ui-btn:visited,
html .ui-bar-e .ui-btn:visited,
html .ui-body-e .ui-btn:visited,
html body .ui-group-theme-e .ui-btn:visited,
html head + body .ui-btn.ui-btn-e:visited { 
/*
	background-color: transparent;
	border-color: transparent;
*/
}


/* my-theme-b
/* To override my-themes.css theme-b bold text (v1.4.0)
/* Links */
.ui-page-theme-b a,
html .ui-bar-b a,
html .ui-body-b a,
html body .ui-group-theme-b a {
	color: #3388cc /*{b-link-color}*/;
	font-weight: normal;
}

/* my-theme-c
/* To override bold lettering in index list
//* Links */
.ui-page-theme-c a,
html .ui-bar-c a,
html .ui-body-c a,
html body .ui-group-theme-c a {
	font-weight: normal;
}

/* Button hover */  /* THIS CAN BE PUT INTO MY-THEME */
.ui-page-theme-c .ui-btn:hover,
html .ui-bar-c .ui-btn:hover,
html .ui-body-c .ui-btn:hover,
html body .ui-group-theme-c .ui-btn:hover,
html head + body .ui-btn.ui-btn-c:hover {
	background: #cccccc /*{c-bhover-background-color}*/;
}


/* my-theme-d
/* To override bold lettering in index list
//* Links */
.ui-page-theme-d a,
html .ui-bar-d a,
html .ui-body-d a,
html body .ui-group-theme-d a {
	font-weight: normal;
}


/* my-theme-c */
/* To override search button focus
/* Focus */
.ui-page-theme-c .ui-btn:focus,
html .ui-bar-c .ui-btn:focus,
html .ui-body-c .ui-btn:focus,
html body .ui-group-theme-c .ui-btn:focus,
html head + body .ui-btn.ui-btn-c:focus,
/* Focus buttons and text inputs with div wrap */
.ui-page-theme-c .ui-focus,
html .ui-bar-c .ui-focus,
html .ui-body-c .ui-focus,
html body .ui-group-theme-c .ui-focus,
html head + body .ui-btn-c.ui-focus,
html head + body .ui-body-c.ui-focus {
	-webkit-box-shadow: 0 0 6px #00ff00 /*{c-active-background-color}*/;
	-moz-box-shadow: 0 0 6px #00ff00 /*{c-active-background-color}*/;
	box-shadow: 0 0 6px #00ff00 /*{c-active-background-color}*/;
}

/* my-theme-c */
/* Button hover */
.ui-page-theme-c .ui-btn:hover,
html .ui-bar-c .ui-btn:hover,
html .ui-body-c .ui-btn:hover,
html body .ui-group-theme-c .ui-btn:hover,
html head + body .ui-btn.ui-btn-c:hover {
	opacity:0.8;
	filter:alpha(opacity=80);
	color: #000000 /*{c-bhover-color}*/;
	text-shadow: 1px /*{c-bhover-shadow-x}*/ 0 /*{c-bhover-shadow-y}*/ 1px /*{c-bhover-shadow-radius}*/ #cccccc /*{c-bhover-shadow-color}*/;
}


/* To make the h1 header margins smaller (1em left/right instead of 30%)	*/
/* and allow it to wrap if needed (white-space: normal instead of nowrap)	*/
.ui-header .ui-title, .ui-footer .ui-title {
	white-space: normal;
}

/* To set the h1 font size not so big */
h1 {
	font-size:1em;
}

/* This was added to decrease the space above and below the heading	*/
/* and room on the left for the back button							*/
h2 {
	font-size:100%;
	margin-right: 5em;
	margin-left: 5.2em;
	-webkit-margin-before: 0.5em;
	-webkit-margin-after: 0;
	-webkit-margin-start: 5em;
	-webkit-margin-end: 5.2em;
}

h4 {
	font-size:100%;
	margin-right: 5em;
	margin-left: 5.2em;
	-webkit-margin-before: 0.5em;
	-webkit-margin-after: 0;
	-webkit-margin-start: 5em;
	-webkit-margin-end: 5.2em;
}
	
#homepg {
  background-repeat: repeat; 
  background-position: top left; 
  background-size: contain;
  background-attachment: fixed;
  -webkit-background-size: contain;
  -moz-background-size: contain;
  -o-background-size: contain;
}

/* To limit the width of the list on the homepg	*/
#homepg .ui-content {
	width: 240px;
}

#homepg .ui-bar-a {
background: transparent;
border: none;
}


/* To limit the width of the list on the indexpg	*/
#indexpg .ui-content {
	max-width: 360px;
}


#catalogList {
	max-width: 900px;
	margin: 0 auto !important;
	position: relative !important;
	padding: 0px;
	line-height: 0;
	overflow: hidden;
}

.catdesc {
	display: inherit;
	font-size: small;
	color: #66cc33;
}

#thumbcontent {
	max-width: 900px;
	margin: 0 auto !important;
	position: relative !important;
	padding: 0px;
	line-height: 0;
	overflow: hidden;
}

.mythumb {
	padding: 1px 1px 0px 0px;
}


#imagepgHeader {
	display:inline-block;
}

#imagepgFooter {
	display:inline-block;
	text-shadow: none;
	font-size: 11.5px;
	font-weight: normal;
    background: transparent; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient( rgba(255,255,255,0), rgba(0,0,0,0.5)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient( rgba(255,255,255,0), rgba(0,0,0,0.5)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient( rgba(255,255,255,0), rgba(0,0,0,0.5)); /* For Firefox 3.6 to 15 */
    background: linear-gradient( rgba(255,255,255,0), rgba(0,0,0,0.5)); /* Standard syntax (must be last) */
}

#theInfo {
	margin: 1.5em 0.5em 0 0.5em;
}