.fundo-bg{background: url("../images/fundo_padrao.png") repeat-x top left; }
#FiltroPanel .ui-panel-inner, #FiltroPanel .ui-panel-inner .ui-li-desc{padding:0; text-align: center;}
#FiltroPanel .ui-panel-inner .ui-li a {padding:0; text-align: center;}
#FiltroPanel .ui-panel-inner .ui-li > span span {font-size: small;}
#DetalhesPopup h1, #DetalhesPage h1 {font-style: italic;text-transform:capitalize;}
#details-page-table span, #details-pop-table span {font-style: italic;/*text-transform:capitalize;*/}

.insetos .ui-li-heading {font-style: italic;}


@media (min-width:40em){
	
	/* Insect Details img and info side-by-side  */
	/* Insect Details */
	#DetalhesPopup > .inseto-info { display: inline-block; max-width: 78%; vertical-align: text-top;}
	/* Insect img */
	#DetalhesPopup > .inseto-img { display: inline-block; max-width: 20%; max-height: 30%; vertical-align: text-top;}

	/*hide mobile-only for Tablets*/
	.mobile-only {display:none !important;}


	/* wrap on wide viewports once open */
		.ui-responsive-panel.ui-page-panel-open .ui-panel-content-fixed-toolbar-display-push.ui-panel-content-fixed-toolbar-position-left,
		.ui-responsive-panel.ui-page-panel-open .ui-panel-content-fixed-toolbar-display-reveal.ui-panel-content-fixed-toolbar-position-left,
		.ui-responsive-panel.ui-page-panel-open .ui-panel-content-wrap-display-push.ui-panel-content-wrap-position-left,
		.ui-responsive-panel.ui-page-panel-open .ui-panel-content-wrap-display-reveal.ui-panel-content-wrap-position-left {
		    margin-right: 17em;
		}
		.ui-responsive-panel.ui-page-panel-open .ui-panel-content-fixed-toolbar-display-push.ui-panel-content-fixed-toolbar-position-right,
		.ui-responsive-panel.ui-page-panel-open .ui-panel-content-fixed-toolbar-display-reveal.ui-panel-content-fixed-toolbar-position-right,
		.ui-responsive-panel.ui-page-panel-open .ui-panel-content-wrap-display-push.ui-panel-content-wrap-position-right,
		.ui-responsive-panel.ui-page-panel-open .ui-panel-content-wrap-display-reveal.ui-panel-content-wrap-position-right {
		    margin-left: 17em;
		}
		.ui-responsive-panel.ui-page-panel-open .ui-panel-content-fixed-toolbar-display-push,
		.ui-responsive-panel.ui-page-panel-open .ui-panel-content-fixed-toolbar-display-reveal {
		    width: auto;
		}

	/* disable "dismiss" on wide viewports */
		.ui-responsive-panel .ui-panel-dismiss-display-push {
		    display: none;
		}


	
}



@media (max-width:40em){
	#DetalhesPage  .inseto-img { display: block; width:100%; align:center;}
	#DetailPopup img { max-width: none; max-height: none;}


/* Adjust the width of the left reveal menu.
		Copy all CSS from jquery.mobile.panel.css and delete the properties other than width, left, right and transform.
		Then delete the selectors/rules for display modes (reveal/push/overlay) and the position (left/right) that you don't use.
		If you don't use fixed toolbars on your page you can delete those selectors as well.
		Narrow the scope of the selectors to prevent other panels being affected by the overrides. */
		#IndexPage #FiltroPanel.ui-panel {
		    width: 100%;
		}
		#IndexPage #FiltroPanel.ui-panel-closed {
		    width: 0;
		}
		#IndexPage .ui-panel-position-right.ui-panel-display-reveal {
		    left: 0;
		}
		#IndexPage .ui-panel-content-wrap-position-right.ui-panel-content-wrap-open,
		 .ui-panel-dismiss-position-right.ui-panel-dismiss-open {
		    left: 100%;
		    right: -100%;
		}
		#IndexPage .ui-panel-animate.ui-panel-content-wrap-position-right.ui-panel-content-wrap-open.ui-panel-content-wrap-display-reveal {
		    left: 0;
		    right: 0;
		    -webkit-transform: translate3d(100%,0,0);
		    -moz-transform: translate3d(100%,0,0);
		    transform: translate3d(100%,0,0);
		}
}