/* All the size-independent stuff comes first, so it may be overridden by media queries below */

/* This was plucked from the html file. Hopefully universal */

.userform { padding:.8em 1.2em; }
.userform h2 { color:#555; margin:0.3em 0 .8em 0; padding-bottom:.5em; border-bottom:1px solid rgba(0,0,0,.1); }
.userform label { display:block; margin-top:1.2em; }
.switch .ui-slider-switch { width: 6.5em !important }
/*.ui-grid-a { margin-top:1em; padding-top:.8em; margin-top:1.4em}*/
/* Not sure why there was a border or padding-top on this, but there was? */
/*.ui-grid-a { margin-top:1em; padding-top:.8em; margin-top:1.4em; border-top:1px solid rgba(0,0,0,.1); }*/


/* Our custom css. Most of the listview items can go away */
.normal_button {
	background-color: #DDD;
	border-style:solid;
	border-width:1px;
	border-color:#333;
	border-radius:2px;
	position:absolute;
	width:30px;
	height:30px;
	text-align: center;
	padding-top:0.2em;
	cursor:pointer;
    cursor:hand;
	text-align:center;
	text-shadow: none;
}
.show_button, .enabled_button, .inactive_button {
	background-color: #AFA!important;
}
.hide_button, .disabled_button, .active_button{
	background-color: #FAA;
}
.p_indent {
	padding-left:10px;
}
.p_med {
	font-size:14px!important;
}
.p_big {
	font-size:16px!important;
}
.main_li {
	padding-right:6%!important;
}
.li_ul {
	list-style: inside;
	padding-left:1em;
}
.li_ul > li {
	padding-left:1em;
	list-style: inherit;
}


.nav-search .ui-btn-up-a {
    background-image:none;
    background-color:#333333;
}
.nav-search .ui-btn-inner {
    border-top: 1px solid #888;
    border-color: rgba(255, 255, 255, .1);
}

.ui-datepicker {
	background:#FFF;
	padding: 1em;
	border-radius:0.5em;
	border:solid;
	border-width:3px;
	border-color:#ccc;
}
.ui-dialog-content {
	padding:1em!important;
}

.lidivgrid {
	border-top:none!important;
	margin-top:0!important;
	padding-top:0!important;
}
.ui-listview > li p {
	white-space: normal;
}
/* Inventory list and formatting */
.selectionitem, .bomlistitem, .inventorylistitem, .orderlistitem, .assemblylistitem {
	font-size:10px;
	padding: 0.1em 0;
}
.livedisabled > div {
	opacity:1!important;
}
.contentlistitem {
	font-size:10px;
	padding: 0
}
.clients_listview {
	margin-top:1em!important;
	margin-bottom:1em!important;
	margin-left:0.5em!important;
}
li.client_list_item {
	padding-left: 0 !important;
	border:0!important;
}

.panelselect {
	text-align: center;
	background: #999;
	color:#FFF;
	border-radius:0.1em;
	text-shadow:none;
    margin:0 0.5em;
}
.activepanelselect {
    background-color: #55ff55!important;
	color:#111!important;
}
.activelistselect, .item_selected{
    background-color: #b3ffaa !important;
	color:#111!important;
}
.button_active {
    background-color: #b3ffaa !important;
	color:#111!important;
}
.button_inactive {
    background-color: #eeeeee !important;
	color:#111!important;
}
.clear_radio, label.clear_radio, label.clear_radio.ui-btn{
    font-size:11px;
    margin-left:0.2em;
    border-style:none;
    background-color:#fff;
}
.code {
    font-family:Consolas, "Lucida Console", Arial;
    text-shadow:none;
    background-color:#ddd;
}
.clicky {
    cursor:pointer;
    cursor:hand;
}
.tight_list_collapsible .ui-collapsible-content {
	padding:0 1em;
}
.tight_list_collapsible h4 a {
	font-weight:normal!important;
}
.li_sub {
	font-size:0.9em;
	padding-left:0.8em;
}
/* reserve listitemcb for generic classes here. Others are used to list selectors.
TODO: Should actually use the generic class selector to apply css and use a separate selector to pull items. */

.listitemcb, .stocklistitemcb, .bomlistitemcb, .inventorylistitemcb, .orderlistitemcb, .bompartslistitemcb,
.inventorypartslistitemcb, .orderpartslistitemcb, .assemblylistitemcb, .assemblypartslistitemcb{
    width:18px!important;
    height:18px!important;
    margin-top:-11px!important;
}
.stocklistitemnumber {
	width:45px!important;
}
.buttondiv {
    /* need to override grid and block definitions */
    width:35px!important;
	margin-left:10px;
}
.itembuttondiv {
    /* need to override grid and block definitions */
    /*width:20px!important;*/
    /*height:35px!important;*/
	margin:0 0px 0 4px;
}
.headerrow {
	font-size:14px;
	padding: 0.3em 0;
	background-color:#EAEAEA;
	border:solid;
	border-width:0 0 0.1em 0;
	border-color:rgb(119, 119, 119);
	margin-bottom:0;
}

/* this is for the items we use to filter stuff */
.selectionlistitem {
	padding: 0 0;
	margin: 0.2em 1em!important;
}
.selectionitem > div > div > div >  input {
	height:10px;
	width:10px;
	margin-top: -4px;
}
.itemslistview {
	/*height:600px;*/
	width:100%;
	overflow: auto;
	-webkit-overflow-scrolling:touch;
}

/* Add / edit item content */
.addedititempopupcontent > label {
    font-size: 13px;
    margin: 0 0 0.1em;
}
.addedititempopupcontent > div > div > label {
    font-size: 13px;
    margin: 0 0 0.1em;
}
.addedititempopupcontent > div > input {
    font-size: 11px;
}
.addedititempopupcontent > div, .addedititempopupcontent > textarea, .addedititempopupcontent > div > div > div{
    margin: .2em 0 0.4em
}
/* This is for items in grids */
.addedititempopupcontent > div > div > div > input {
    font-size: 11px;
}

/* listview formatting */
ul.circle {list-style-type: circle;}

.smallinsetlist {
	padding-left:0.4em;
	margin:0em!important;
}
.smallinsetlist > li {
	font-size:11px;
	padding:0.3em 0.1em;
	border-style:none!important;
}
.ui-content .ui-listview-inset {
	margin-top:0;
}
.ui-listview {
	margin:0;
}

.footertext {
    margin: 15px 25px 15px 25px;
    font-size: 12px;
    font-weight: normal;
}
.ui-header .ui-title {
    margin: 0px 10%;
}
/* Tile view settings Here is three-wide by default*/

.tileview li {
	float: left;
	width: 30.9333%; /* 33.3333% incl. 2 x 1.2% margin */
	height: 14.5em; /* 232p */
	margin: .5625em 1.2%;
	border-radius: 0.3em;
}

/* Basic settings */
.ui-li-static.ui-collapsible {
    padding: 0;
}
.ui-li-static.ui-collapsible > .ui-collapsible-content > .ui-listview,
.ui-li-static.ui-collapsible > .ui-collapsible-heading {
    margin: 0;
}
.lastli {
    height:0;
    padding:0.1em
}
.ui-li-divider {
    font-size: 16px
}
.ui-listview > .lastli {
    height:0;
    padding:0.2em
}
.content-one, .content-two, .content-three {
	margin-top:1em;
	padding:0;
}


.content-full {
    width:96%;
    padding:0;
}
.ui-biglabel {
    font-size: 1.1em !important;
}
.ui-btn-icon-left {
    padding-left: 2.7em
}
.submitpopup {
    width:400px;
}


/* Only for small screens */

/* Only for small screens */
@media all and (max-width: 750px) {
    .ui-content{
        padding:0.2em;
    }
    .gridstack {
        width:100%;
    }

}
.submitpopup {
    width:250px;
}

/* This applies to larger settings. First of two breakpoints */
@media all and (min-width: 750px){
    .submitpopup {
        width:500px;
    }
	.type-home .ui-content {
		margin-top: 5px;
	}
	.ui-mobile #jqm-homeheader {
		max-width: 340px;
	}
	p.intro {
		margin: 2em 0;
	}
	.type-home .ui-content,
	.type-interior > .ui-content {
		padding: 0;
	}
	.type-interior > .ui-content {
		overflow: hidden;
	}
	.content-one {
		text-align: left;
		float: left;
		width: 30%;
	}
	/* override above */
	.content-one-narrow {
		width:20%;
	}

	/*.content-one,*/
	.type-interior .content-one {
		margin: 0;
		padding: 0;
		/*background: none;*/
		border-top: none;
		position: relative;
	}
	.type-interior .content-one::after {
		content: "";
		display: inline-block;
		position: absolute;
		top: 0;
		right: 0;
		height: 1px;
		width: 1px;
		margin-bottom: -9999px;
		padding-bottom: 9999px;
		background: #bbb;
	}

	.ui-mobile #jqm-homeheader {
		padding: 0;
	}
	.content-two, .content-three{
		width: 67%;
		float: right;
		/*margin-top: 30px;*/
		margin-right: 1%;
		padding: 0;
	}
	/* override above for narrow content one */
	.content-two-wide {
		width: 77%;
	}
    .content-one-full {
        width: 99%;
    }
	/*.content-two ul:first-child {*/
		/*margin-top: 0;*/
	/*}*/
	/* collapsible non-inset example */
	.content-two .ui-collapsible-content ul:first-child,
    .content-three .ui-collapsible-content ul:first-child {
		margin-top: -10px;
	}
	.content-one h2 {
		position: absolute;
		left: -9999px;
	}
	/*.type-interior .content-two,*/
    /*.type-interior .content-three {*/
		/*padding: 1.5em 6% 3em 0;*/
		/*margin: 0;*/
	/*}*/
	/* fix up the collapsibles - expanded on desktop */
	.content-one .ui-collapsible-inset {
		margin-bottom: -1px;
	}
	/* .content-one .ui-collapsible-heading {
		display: none;
	}
	.content-one .ui-collapsible-contain {
		margin:0;
	}
	.content-one .ui-collapsible-content {
		display: block;
		margin: 0;
		padding: 0;
	}*/
	.content-one .ui-collapsible-content,
	.content-one .ui-collapsible-content > .ui-listview .ui-li-last {
		border-bottom-left-radius: 0;
		border-bottom-right-radius: 0;
	}
	.type-interior  .content-one .ui-li-divider {
		padding-top: 1em;
		padding-bottom: 1em;
	}
	.type-interior .content-one {
		margin: 0;
		padding: 0;
	}
    .plots {
        height:200px;
    }
    .fullplots {
        height:300px;
    }
    .ui-field-contain div.ui-slider-switch {
        width: 5.5em;
    }
    .ui-content-main {
        padding-left:2%;
        padding-right:0;
    }

    .plots {
        height:300px;
    }
    .fullplots {
        height:500px;
    }
    /* tileview settings */
	.tileview li {
        -moz-box-shadow: 0px 0px 3px #111;
        -webkit-box-shadow: 0px 0px 3px #111;
        box-shadow: 0px 0px 3px #111;
    }

    /* Animate focus and hover style, and resizing. TODO: Replace deprecated easing, determine precedence*/
    .tileview li {
        -webkit-transition: all 500ms ease;
        /*-moz-transition: all 500ms ease;*/
        /*-o-transition: all 500ms ease;*/
        /*-ms-transition: all 500ms ease;*/
        /*transition: all 500ms ease;*/
    }
}

/* Second of two breakpoints
at this break, no three column as with other pages */

@media all and (min-width: 1200px){
	.type-home .ui-content{
		background-position: 38.5%;
	}
    .ui-content-main {
        padding-left:2%;
        padding-right:0;
    }

	.type-interior .content-one {
		margin: 0;
		padding: 0;
	}
	.content-two, .content-three {
		/*width: 65%;*/
		/*margin-right: 5%;*/
		/*padding-right: 3%;*/
	}
	.type-interior .content-two,
    .type-interior .content-three {
		width: 60%;
	}
    .plots {
        height:500px;
    }
    .fullplots {
        height:700px;
    }
	/* Tileview settings */
	.tileview li {
        width: 23%;
        height: 215px;
        margin: .625em 1%;
    }
}


/* reset for popup examples */
.type-interior .ui-popup.ui-content,
.type-interior .ui-popup .ui-content {
	background-position: 0 0;
	background-repeat: no-repeat;
	overflow: visible;
}

/* tables documenting enum-type settings */
.enum-value {
	vertical-align: top;
	white-space: nowrap;
}

/* Navbar examples */
.content-two > .ui-header,
.content-two > .ui-footer {
	overflow: hidden;
}

/* list styles */
ul { margin:0; padding-left:0; }
ul li { list-style:none; padding:.7em 0; margin:0; border-bottom:1px solid #e3e3e3; }
ul.dotlist li {list-style: outside;margin-left:1em;white-space: normal;padding:0.5em 0.5em;margin-left:2em}
ul ul li { border: none;}

dl dd ul { padding-left: 40px; }
dl dd ul li { list-style: disc; }
dl dd ul li li { list-style: circle; }
dl dd ul li li li { list-style: square; }
dl dd ul li { border: none; }

.ui-mobile-viewport .localnav li {
	border: none;
}
.ui-corner-all {
	-webkit-border-radius: .2em /*{global-radii-blocks}*/;
	border-radius: .2em /*{global-radii-blocks}*/;
}
.tailli {
    padding: 0 0!important;
}
body,
input,
select,
textarea,
button,
.ui-btn {
	font-size: 0.9em;
	line-height: 1.5;
	 font-family: "Open Sans", Arial, sans-serif /*{global-font-family}*/;
}

/*.ui-overlay-a, .ui-page-theme-a, .ui-page-theme-a .ui-panel-wrapper {*/
    /*background-color: #e4e4e4;*/
/*}*/

a {
    color:#333;
}