/* color variables (to make things a lot easier to change/experiment) */

:root {
    --bg:  #d7e3ec;
    --box-bg: #e1efff;
    /* #dee8fa */
    --box-border: #adbee1;
    /* #abb0de */
    --filter-head-bg: #7e96a9;
    --filter-head-border: black;
    --filter-head-color: white;
    --filter-head-hover: #788fa1;
    --filter-head-show: #718697;
    --filter-head-show-hover: #647786;
    --highlight-bg: #B64982;
    --highlight-color: white;
    --label-color: #32312e;
    --link-color: #32312e;
    --link-highlight: black;
    --search-bg: white;
    --secondary-button-bg: #1B9BFF;
    /* #1B9BFF */
    --secondary-button-color: black;
    --simple-border: black;
    --submit-bg: #084B83;
    /* #084B83 */
    --submit-color: white;
    
    
    /* --off-black: #32312e; */
    /* --off-white: #fef1f8; */
    /* toolbar bg: #5B9279 */
    /* title bg: #073E83 */
    /* #80b6b1 */
			 
    
    
}

html, body {
    height: 100%;
    width: 100%
}

body * {
    height: auto;
    width: auto
}

/* Bootstrap "helpfully" overwrites very many default behaviors. So I helpfully upped the specificity on all the defaults to overwrite the bootstrap defaults with our defaults.*/

html, html body, body div, body span, body object, body iframe,
body h1, body h2, body h3, body h4, body h5, body h6, body p, body blockquote, body pre,
body abbr, body address, body cite, body code, body del, body dfn, body em, body img, body ins, body kbd, body q, body samp,
body small, body strong, body sub, body sup, body var, body b, body i, body dl, body dt, body dd, body ol,
body fieldset, body form, body label, body legend,
body caption, body tbody, body tfoot, body thead, body th,
body article, body aside, body canvas, body details, body figcaption, body figure,
body footer, body header, body hgroup, body menu, body nav, body section, body summary,
body time, body mark, body audio, body video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font-weight: bold;
    /*font: inherit;*/
    vertical-align: baseline;
    /* background-color: #dcedfb; */
    /* background-color: #d1fa56 */
    background-color: var(--bg);
		      
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

/* Media queries. Using yui3b (Butler) to differentiate from official stuff. Unit sizes are consistant with base yui. Classes without units will set element width to auto, overwritting any base yui unit classes for that specific screen width. Not all units are supported yet.  */

/* Also note that the base yui3-u class will apply to any breakpoints not explicitly specified, not just all screens smaller than the yui3-bu class. */

/* Width breakpoints are generally based on bootstrap when converted into pixels assuming default settings (e.g: 88*16=1408 which is approximately the breakpoint for xxl in bootstrap) */

@media (min-width: 88rem) {
    .filter .filter-head, .filter .yui3-g, .filter .yui3-g-r, .filter .row {
	width: 1270px;
    }
    .yui3-g-r .yui3b-xxl {
	width: auto
    }
}

@media (min-width: 75rem) and (max-width: 88rem) {
    .filter .filter-head, .filter .yui3-g, .filter .yui3-g-r, .filter .row {
	width: 1110px
    }
    .yui3-g-r .yui3b-xl {
	width: auto
    }
    .yui3-g-r .yui3b-xl-1-6 {
	width: 16.6667%
    }
}

@media (min-width: 62rem) and (max-width: 75rem) {
    .filter .filter-head, .filter .yui3-g, .filter .yui3-g-r, .filter.row {
	width: 57rem;
    }
    .yui3-g-r .yui3b-lg {
	width: auto
    }
    .yui3-g-r .yui3b-lg-1-6 {
	width: 16.6667%
    }
}
/* This is an exception; I found there's a lot of problems that come up between 900px and 1101px so this is a better breakpoint */
@media (min-width: 48rem) and (max-width: 70rem ) { /*min 48rem*/
    .filter .filter-head, .filter .yui3-g, .filter .yui3-g-r, .filter .row {
	width: 44rem;
	/* 38rem */
	/* width: 234px; */
    }
    .yui3-g-r .yui3-tablet {
	width: auto
    }
    .yui3-g-r .yui3-tablet-1-4, .yui3-g .yui3-tablet-1-4 {
	width: 25%
    }
    .yui3-g-r .yui3-tablet-1-3, .yui3-g .yui3-tablet-1-3 {
	width: 33.3333%
    }
    .yui3-g-r .yui3-tablet-1-6, .yui3-g .yui3-tablet-1-6 {
	width: 16.6667%
    }
}
/* Special behavior for when browser text isn't 16px (I think?) */
@media (min-width: 33rem) and (max-width: 48rem) and (min-width: 767px) {
    .filter .filter-head, .filter .yui3-g, .filter .yui3-g-r, .filter .row {
	width: 34rem;
	/* 38rem */
	/* width: 234px; */
    }
    .yui3-g-r .yui3-tablet {
	width: auto
    }
    .yui3-g-r .yui3-tablet-1-4, .yui3-g .yui3-tablet-1-4 {
	width: 25%
    }
    .yui3-g-r .yui3-tablet-1-3, .yui3-g .yui3-tablet-1-3 {
	width: 33.3333%
    }
    .yui3-g-r .yui3-tablet-1-6, .yui3-g .yui3-tablet-1-6 {
	width: 16.6667%
    }
}
/* Special behavior for when browser text ISN'T 16px */
@media /* (min-width: 24rem) and  */(max-width: 36rem) and (min-width: 767px) { /*min 36rem*/
    .filter .filter-head, .filter .yui3-g, .filter .yui3-g-r, .filter .row {
	width: 19rem
    }
    .filter .filter-menu > * {
	width: 100%
    }
    .yui3-g-r .yui3-zoomed-1-3 {
	width: 33.3333%
    }
    .yui3-g-r .yui3-zoomed-1-2 {
	width: 50%
    }
}

/* this is the property for changing the tab height. Can play around with it, for default font size 1rem = 16px. Will definitely need decimal values since previous value was 12px or so. */
@media (max-width: 767px) {
    #toolbar > .yui3-u {
	padding: 0.5rem
    }
    .sticky-top {
	position: static !important
    }
}

#header > div {
    display: inline
}


/* colors
Top banner - #49a800 #506473 1/2 Gray, 1/3 Blue
Toolbar    - #c6f932 #7e96a9 1/3 gray, 1/4 Blue
Background - #d1fa56 #d7e3ec 1/10 Gray, 1/10 Blue
Header Brighe Blue #348dfb
Header Blue #8fc0fd
Header Dark Blue #084fa6
Header Dark Dark Blue #073e83 - Current
*/


/* Bicubic resizing for non-native sized IMG: code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */
.ie7 img {
    -ms-interpolation-mode: bicubic;
}

/* bootstrap overides */
/* body * { */
/*     box-sizing: content-box; */
/* } */

/* .container { */
/*     display: flex */
/* } */


/* bootstrap has their own thumbnail class separate from django''s. Overwritting... */
body .thumbnail {
    display: flex;
    justify-content: center;
    margin-bottom: 0px;
    background-color: transparent
}

.box {
    background-color: var(--box-bg);
    border-color: var(--box-border);
    border-style: solid;
    border-width: 2px;
    padding: 10px;
}

/* h1 rules are also contained in a custom .h1 class, so not including an override.  */

.blank_row {
    height: 25px !important;
    background-color: #FFFFFF;
    
}

#content {
    position: relative;
    overflow-x: hidden
}

#content > * {
    margin-left: 5px
}

li {
    margin: 10px auto 10px auto
}

input {
    width: 23rem;
    height: 2rem
}
/**
 * Tables
 *
 * @section   =tables
 */
/* Generic formatting that is valid for every table */
table th {
    font-weight: bold;
    text-align: left;
}
table td {
    vertical-align: top;
    
}


table th.number,
table td.number {
    text-align: right;
}



/* Simple table with a header, body and footer (labeled ""Simple" in the styleguide) */
table.simple {
    border: 1px solid #DDD;
    margin: 5px 5px 16px 5px;
    padding: 10px;
    border-collapse: separate;
    display: block;
    overflow-x: auto
}



table.simple caption {
    font-weight: bold;
    text-align: left;
}
table.simple caption,
table.simple th,
table.simple td,
table.simple h2 {
    padding: 3px 8px 3px 10px; /* abr 10px is the padding in cell */
}
table.simple thead th,
table.simple thead td {
    border-bottom: 1px solid #DDD;
    color: #666;
    font-weight: bold;
}
table.simple tbody th,
table.simple tbody h2,
table.simple tbody td {
    border: 1px solid var(--simple-border); /* This is the frame color */
    font-weight: normal;
    
}
table.simple tfoot th,
table.simple tfoot td {
    border-top: 1px solid #DDD;
    font-weight: bold;
}

div.filter {
    background-color: var(--bg);
    padding: 0px;
    margin: 0px;
    width: 100%;
}

/* table.filter tbody { */
/*     width: 100%; */
/* } */

div.filter > div * {
    cursor: pointer;
}



/* @media (min-width: 26rem) and (max-width: 36rem) { */
/*         .filter .filter-head, .filter .yui3-g, .filter .yui3-g-r { */
/* 	    width: 368px; */
/* 	    /\* width: 300px *\/ */
/*     } */
/*     .yui3-g-r .yui3b-xs-1 { */
/* 	width: 100% */
/*     } */
/* } */

/* @media (max-width: 24rem) { */
/*         .filter .filter-head, .filter .yui3-g, .filter .yui3-g-r { */
/* 	width: 300px; */
/*     } */
/*     .yui3-g-r .yui3b-xs-1 { */
/* 	width: 100% */
/*     } */
/* } */

div.filter > div.filter-head, div.filter > div.filter-end {
    margin-bottom: 2px;
    margin-top: 2px
}

/* .yui3-g-r { */
/*     max-width: 100% */
/* } */

div.filter > div.filter-head h2, .filter-menu {
    font-weight: bold;
    font-size: 16px;
    background-color: var(--filter-head-bg);
    color: var(--filter-head-color);
    border-color:  var(--filter-head-border);
    border-radius: 2px;
}

div.filter div.filter-head svg {
    float: right
}

div.filter > div.filter-head:hover h2 {
    background-color: var(--filter-head-hover)
}

div.filter > div.filter-head.dropdown-show:hover h2 {
    background-color: var(--filter-head-show-hover);
}

div.filter > div.filter-head.dropdown-show h2 {
    background-color: var(--filter-head-show);
}

/* div.filter > div.filter-head h2 div  { */
/*     background-color: #52937d; */
/*     display: flex; */
/*     justify-content: space-between; */
/* } */

div.filter > div.filter-head:hover h2 div  {
    background-color: var(--filter-head-hover);
}

div.filter > div.filter-head.dropdown-show:hover div  {
    background-color: var(--filter-head-show-hover)
}

div.filter > div.filter-head.dropdown-show h2 div {
    background-color: var(--filter-head-show);
}

div.filter svg {
    background-color: var(--filter-head-bg);
    color: var(--filter-head-color);
    display: none
}

div.filter > div.filter-head:hover svg {
    background-color: var(--filter-head-hover);
}

div.filter svg.dropdown-show {
    display: block
}
div.filter > div.dropdown-show svg {
    background-color: var(--filter-head-show);
}

div.filter > div.dropdown-show:hover svg {
    background-color: var(--filter-head-show-hover);
}

div.filter > div.filter-body {
    display: none;
    max-width: 100%;
}

.filter-option-hide {
    display: none
}

div.filter > div.filter-body.dropdown-show {
    display: flex;
}

div.filter p, .filter .search {
    margin: 15px 6px 15px 6px;
    margin-top: 15px;
    min-width: 73px;
    padding: 10px
}

div.filter .yui3-g-r, .filter .row {
    margin-left: 15px;
    margin-right: 15px;
    align-items: center;
}



div.filter .filter-option:hover {
    background-color: var(--highlight-bg);
    border-color: var(--highlight-color)
}

div.filter .filter-option:hover label {
    background-color: var(--highlight-bg);
    color: var(--highlight-color)
}

div.filter .filter-option label {
    background-color: var(--box-bg); /* #7dda98; */
    color: var(--label-color);
}

.filter-option input {
    width: 1rem;
    height: 1rem
}

.filter .filter-option {
    min-width: 7rem
}

div.filter > div.filter-end {
    border-style: solid none;
    border-color: black;
    background-color: var(--bg);
    border-radius: 0px;
    cursor: default;
    border-width: 2px;
    height: 7px;
    margin-top: 20px;
    margin-bottom: 20px;
}

/* I looked at filter.html... I can't find a single element this thing affects. */

/* div.filter > div.filter-end + .yui3-g-r .filter-option, .filter > .filter-end + .row .filter-option { */
/*     border-style: none; */
/*     background-color: #8FCB9B; */
/*     cursor: default */
/* } */

.filter .filter-menu > .filter-submit, .filter-submit {
    background-color:  var(--submit-bg);
    color: var(--submit-color);
    font-weight: bold;
    cursor: pointer;
    padding: 10px;
}

.filter-menu {
    border-width: 1px;
    border-style: solid
}

div.filter .filter-submit:hover, table.filter .filter-submit:hover  {
    background-color: var(--highlight-bg);
    color: var(--highlight-color)
}

.filter .filter-submit {
    text-align: center;
}

h1.filter-title {
    background-color: var(--highlight-bg);
    color: var(--highlight-color);
    padding: 8px 16px;
    border-top: 1px solid;
    border-bottom: 2px solid;
    font-size: 1rem;
}

/* Complex table with several headers and a more complex design (labeled ""Medium complexity" in the styleguide) */
table.complex {
    width: 100%;
    margin: 5px 0 16px;
}
table.complex caption {
    border-bottom: 1px solid #FFF;
    font-weight: bold;
    text-align: left;
    background: #DDD;
}
table.complex caption,
table.complex th,
table.complex td {
    padding: 3px 17px 3px 6px;
}
table.complex thead th,
table.complex thead td {
    border-bottom: 1px solid #FFF;
    color: #666;
    font-weight: bold;
    background-color: #DDD;
}
table.complex tbody th,
table.complex tbody td {
    border-bottom: 1px dotted #DDD;
    font-weight: normal;
}
table.complex tbody .level-1 th,
table.complex tbody .level-1 td {
    border-top: 1px solid #FFF;
    border-bottom: 1px solid #DDD;
    font-weight: bold;
    background-color: #EEE;
}
/**
   table.grid {
   border-collapse: separate;
   border-spacing: 5px;
   border: none;
   }
   */
#grid td{
    padding: 3px;
    border: 1px;
    border-style:solid;
    border-color:black;
    cursor:pointer;
}

tr.grid td{
    padding: 3px;
    border: 1px;
    border-style:solid;
    border-color:black;
    cursor:pointer;
}

#gridx td{
    padding: 1px;
    border: 1px;
    height:10px;
    border-style:solid;
    border-color:black;
    cursor:auto;
}

tr.gridx td{
    padding: 1px;
    border: 1px;
    height:10px;
    border-style:solid;
    border-color:black;
    cursor:auto;
}

tr.gridx .clickable{
    cursor:pointer;
}
/* Tables in the content area always have the same font settings */
#content table {
    font-size: 100%;
    /*abr line-height: 1.28;*/
}

/**
 * Grid
 *
 * The main grid for a typical Siemens page with header, toolbar, breadcrumb,
 * content area and footer.
 *
 * @section   =grid
 */

#wrapper {
    position: relative;
    min-width:1000px;
    min-height: 97%;
    background-color:#DFE6ED; /* The table */
}

#header {
    /*abr background-color:#49a800; */
    /* Middle portion background color, you must also change 2 below fir the whole header */
    background-color:#073E83;
}
#header {
    overflow: hidden;
    margin: 0px;
    width: 100%;
    padding: 10px 0px 3px 0px;
}
#header .inner,
#header .visual,
/* #header .headertext */ {
    overflow: hidden;
}
#header .headertext {
    float:left;
    width: 100%;
    /* height: 30px; /\* old value 76px *\/ */
    border-left: 0px solid #FFF;  /* old value 2px solid #FFF; */
    color: #FFF;
    align-items: end;
    /*abr background-color:#49a800; */
    /* left side color */
    background-color:#073e83;
    margin: 0px;
    /* padding-bottom: 10px */

}

#header .headertext > div {
    background-color:#073e83;
    margin-bottom: 10px;
}

#header .headertextr {
    float:right;
    width: 100px;
    height: 30px; /* old value 76px */
    border-left: 0px solid #FFF;  /* old value 2px solid #FFF; */
    padding: 10px 0px 3px 0px;
    color: #FFF;
    
}
.headertextr label {
    font-size: 123.1%;
    font-weight: bold;
}
#header .clickable{
    cursor:pointer;
}
/* Make the headertext div float in IE6 to remove margin */
.ie6 #header .headertext {
    float: left;
}
/* We support all level headlines to be flexible with the outline */
#header h2, #header h3, #header h4, #header h5, #header h6, #header p.main {
    font-size: 123.1%;
    font-weight: bold;
}
#header h1{
    font-size: 153.1%;
    font-weight: bold;
    /* abr This controls the color behind the right side header text */
    /* background-color:#49a800; */
    /* background-color:#073E83 */
}
#header p {
    margin-bottom: 5px;
    font-size: 85%;
    line-height: 1.45;

}
#header p.main {
    margin-bottom: 0;
    line-height: inherit;

}
#usertools {
    /* Controls a little strip below the login header section*/
    /* background-color:#49a800; */
    background-color:#073E83;
    float: right;
    height: 43px;
    margin-top: 5px
    transform: translateY(-10px);
}

#usertools a {
    padding: 10px;
    color: white;
    background-color: rgba(0, 0, 0, 0);
}

#usertools p {
    padding: 10px;
    color: white;
    background-color:#073E83;
}

#toolbar {
    min-height: 27px;
    border-top: 1px solid #FFF;
    border-bottom: 1px solid #FFF;
    color: #FFF;
    /* background-color:#c1d5e5; */
    background-color: #5B9279;
    width: auto;
    max-width: 100%;
    padding: 3px;
    margin-right: 0px;
    margin-left: 0px;
}

/* #toolbar > a { */
/*     min-width: 135px; */
/* } */




/* IE6 expands toolbar when border gets added to the opener */
.ie6 #toolbar {
    overflow: hidden;
}

#toolbar #toolbar-search > * {
    height: 10px;
    padding-top: 3px
    /* padding: 19px; */
}

#toolbar #toolbar-search {
    margin-bottom: 10px;
}

#toolbar .box {
    background-color: var(--box-bg);
    display: flex;
    justify-content: center;
}

/* #toolbar-main { */
/*     padding-top: 50px */
/* } */
/* removed in favor of bootstrap */
/* @media (max-width: 909px) { */
/*     .toolbar-row .m-hide { */
/* 	display: none */
/*     } */
/* } */
/* @media (min-width: 910px) { */
/*     .toolbar-row .m-show { */
/* 	display: none */
/*     } */
/* } */

#toolbar p {
    margin: 0;
    padding: 0;
}

/* toolbar links */


#toolbar a {
    color: white;
    border: 3px solid;
    padding: 16px;
    border-color: #5B9279;
    border-radius: 7px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    line-height: 2px;
}

.transparent {
    background-color: rgba(256, 256, 256, 0);
}

/* #toolbar div.yui3-u-1-12 { */
/*     padding: 19px; */
/* } */

/* #toolbar a { */
/*     color: #fef1fa; */
/* } */

#toolbar a:hover {
    background-color: var(--highlight-bg);
    border-color: var(--highlight-bg);
}

.filter .search svg {
    display: inline
}

.d-none {
    display: none !important
}

.filter .filter-menu > * {
    height: 4rem;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.search .search-box .fa-x, .search .search-box .fa-x path {
    cursor: pointer
}

.filter .search input {
    display: inline;
    width: 100%;
    height: 1rem;
    margin: 0px;
    padding: 0px;
    border-style: none;
    background-color: white;
}

.filter .search input:focus {
    outline: none
}

.searchbar-focus {
    outline: 4px solid var(--highlight-bg);
}

.search .search-box {
    cursor: text;
    top: 0px;
    bottom: 0px;
    width: 100%;
    height: 1em;
    display: flex;
    border: 2px solid black;
    padding: 1px;
    box-sizing: content-box;
    background-color: white;
}

.filter .filter-menu {
    justify-content: space-around;
    padding: 10px;
    margin: 10px 3px 10px 3px
}

.filter .yui3-g-r h2, .row h2 {
    padding-right: 10px;
    padding-left: 10px;
}

.filter .filter-menu > * {
    margin: 5px 20px 5px 20px;
    text-align: center;
    border: 3px outset black;
}
.filter .filter-menu .box {
    background-color: var(--secondary-button-bg);
    color: var(--secondary-button-color)
}
.search p.transparent {
    cursor: auto;
    margin: 0px;
    padding: 0px
}

.search form div {
    background-color: var(--search-bg);
    border: 1px solid var(--highlight-bg)
}

.search, .filter .search {
    justify-content: center;
    /* width: 133px; */
    /* height: 40px; */
    cursor: default;
    display: flex;
    align-items: center
    /* margin: 0px auto 5px auto; */
}

.search .search-box * {
    cursor: text;
    margin: auto 0px;
    min-width: auto;
}

.search form {
    width: 100%;
    display: flex;
    align-content: center;
}

.search .search-box svg {
    color: black;
    background-color: white;
    width: 1em;
    height: 1em;
    display: inline;
    padding-right: 7px
}


/* #toolbar > div > a { */
/*     position: absolute; */
/*     left: 50%; /\* Position the left edge of the element at the center of the container *\/ */
/*     transform: translateX(-50%); */
/* } */

/* #toolbar > div { */
/*     color: #fef1fa; */
/*     border: 3px solid; */
/*     padding: 8px; */
/*     border-color: #5B9279; */
/*     border-radius: 7px; */
/*     border-bottom-left-radius: 0px; */
/*     border-bottom-right-radius: 0px; */
/*     line-height: 2px; */
/* } */

/* #toolbar > div:hover { */
/*     background-color: #b64982; */
/*     border-color: #b64982; */
/* } */

/* Input elements thar are placed in an input box */
.input {
    position: relative;
    margin-bottom: 10px;
}
.input label {
    display: block;
    margin-bottom: 2px;
    font-size: 85%;
}
.input input.text,
.input textarea {
    width: 244px;
}
.input select {
    width: 250px;
}
.input input.text,
.input textarea,
.input select {
    font-size: 85%;
}
.input textarea,
.input select {
    line-height: 1.28;
}

input.btn {   
    color:#050;   
    /*font: bold 84% ''trebuchet ms',helvetica,sans-serif;   */
    background-color:#fed;   
    border:1px solid;   
    border-color: #696 #363 #363 #696;
    width: auto;
    height: auto
} 

input.btnhov {   
    border-color: #c63 #930 #930 #c63; 
}

/* Lists of checkboxes and radio buttons */
form ul.choose {
    margin: 0 0 -3px;
    padding: 0;
    list-style: none;
}

/* Submit button section */
form .submit {
    margin: 20px 0 10px;
    text-align: right;
}

#dynamic {
    background-color:#DFE6ED; /* x% Stone */
}


/**
 * Links
 *
 * @subsection   =links
 */

body a {
    color: var(--link-color);
    font-weight: bold;
    text-decoration: underline;
}

body a:hover {
    color: var(--link-highlight)
}

/* j.mp/webkit-tap-highlight-color */
a:link {
    -webkit-tap-highlight-color: var(--highlight-bg);

}
/* Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {
    outline: none;
}
/* Our close link, mainly used in layers on the top right */
a.close {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 18px;
    height: 18px;
    overflow: hidden;
    border-top: 1px solid #FFF;
    border-bottom: 2px solid #FFF;
    border-left: 2px solid #FFF;
    text-indent: -9999em;
    background: #DDD url("../images/icon-cross.gif") no-repeat center center;
}

/**
 * Toolbar
 *
 * Global toolbar for all pages.
 *
 * @section   =toolbar
 */


/**
 * Footer
 *
 * Global footer for all pages.
 *
 * @section   =footer
 */
#nav-footer {
    margin: 26px 20px 0 20px; /* old value 30px 22px 0 44px; */
    color: #727272;
    font-size: 77%;
    line-height: 1.3;
}
/* When the pagetools are in the footer, we need to adjust the margin */
.extended-footer #nav-footer {
    margin-top: 37px;
}
#nav-footer ul {
    margin: 0;
    list-style: none;
}
#nav-footer li {
    float: left;
    padding: 0 5px 0 6px;
    background: url("../images/divider-footer.gif") no-repeat left center;
}
#nav-footer li.first {
    padding-left: 0;
    background-image: none;
}
#nav-footer li a {
    color: #999;
    text-decoration: none;
}
#nav-footer li.relevant,
#nav-footer li.relevant a {
    color: #333;
}
#nav-footer li.relevant a:hover,
#nav-footer li.relevant a:active,
#nav-footer li.relevant a:focus {
    color: #900;
}


/**
 * 	Drag-able and resize-able panel
 */
div #panelbody {height:88%}

iframe {location:inherit;
	width: 100%;
 	height: 100%;
 	min-Height: auto;
       }

.yui3-panel {
    outline: none;
}

.yui3-panel #panelContent {
    -webkit-box-shadow: 0px 0px 2px black;
    -moz-box-shadow: 0px 0px 2px black;
    box-shadow: 0px 0px 2px black;
}
.yui3-panel #panelContent .yui3-widget-hd {
    /*abr background-color: #0B3E66; */
    background-color: #1B9BFF;
    background-image: none;
    font-weight: bold;
    padding: 5px;
}

#panelContent .yui3-widget-bd {
    padding: 15px;
    background: white;
    text-align: center;
}

#panelContent.yui3-widget-loading {
    display: none;
}

.yui3-skin-sam .yui3-widget-mask {
    background-color: #000000;
    opacity: 0.1;
}
.yui3-g-r, .yui3-g, .row {
    flex-wrap: wrap;
}

.yui3-g-r > *, .yui3-g-r, .yui3-g, .yui3-g > *, .row, .row > * {
    flex-grow: 1;
}
.yui3-g-r, .row {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    text-align: center;
    /* background-color: #5B9279; */
}

.yui3-g-r.invoice {
    text-align: left;
    width: 74rem
}

.filter.simple td {
    padding-top: 15px;
    padding-bottom: 15px;
    height: 188px
}

.filter td img, .filter .price-box div {
    margin: 31px 0px
}

.filter td .filter-menu {
    display: flex;
    padding: 5px
}

.filter .filter-menu .qty-box {
    height: 10px;
    padding: 0.75rem;
    margin-right: 2px;
    margin-left: 2px
}

.price-box {
    padding: 10px
}

.qty-menu {
    display: flex;
    justify-content: space-between;
    align-items: center
}