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

@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%
    }
}

@media (min-width: 48rem) and (max-width: 62rem ) { /*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-2, .yui3-g .yui3-tablet-1-2 {
	
    }
}

@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%
    }
}

@media /* (min-width: 24rem) and  */(max-width: 33rem) 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 - #506473 1/2 Gray, 1/3 Blue
Toolbar    - #7e96a9 1/3 gray, 1/4 Blue
Background - #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;
}



/**
 * 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;
}

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

/* Simple table with a header, body and footer (labeled "Simple" in the styleguide) */
table.simple {
    border: 1px solid #DDD;
    margin: 5px 0 16px;
    padding: 10px;
}
table.simple caption {
    font-weight: bold;
    text-align: left;
}
table.simple caption,
table.simple th,
table.simple td {
    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 td {
    border: 1px solid #506473; /* This is the frame color */
    font-weight: normal;
    
}
table.simple tfoot th,
table.simple tfoot td {
    border-top: 1px solid #DDD;
    font-weight: bold;
}

/* 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
 */
html, body {
    height: 100%;
}

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

#header {
    /*abr background-color:#506473; */
    /* Middle portion background color, you must also change 2 below fir the whole header */
    background-color:#073e83;
}
#header {
    overflow: hidden;
}
#header .inner,
#header .visual,
#header .headertext {
    overflow: hidden;
}
#header .headertext {
    float:left;
    width: 430px;
    height: 30px; /* old value 76px */
    border-left: 0px solid #FFF;  /* old value 2px solid #FFF; */
    padding: 10px 0px 3px 0px;
    color: #FFF;
    /*abr background-color:#506473; */
    /* left side color */
    background-color:#073e83;

}
#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:#506473; */
    /* 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:#506473; */
    background-color:#073e83;
    float: right;
}

#usertools a {
    padding: 10px;
    color: white;
    background-color:#073e83;
}

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

#toolbar {
    height: 27px;
    border-top: 1px solid #FFF;
    border-bottom: 1px solid #FFF;
    color: #FFF;
    /* background-color:#c1d5e5; */
    background-color: #7e96a9;
    min-width:800px;
    padding: 3px;
/* overflow: visible; */
}
/* IE6 expands toolbar when border gets added to the opener */
.ie6 #toolbar {
    overflow: hidden;
}

/* 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; 
} 

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
 */
a {
    color: #2e2e2e;
    font-weight: bold;
    text-decoration: underline;
}
/* j.mp/webkit-tap-highlight-color */
a:link {
    -webkit-tap-highlight-color: #FF5E99;

}
/* 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: #999;
    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; /*/* #1B9BFF */
    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;
}