
.banner .discussions-large-btn {
  display: inline-block;
  cursor: hand;
  cursor: pointer;
  vertical-align: initial;
  margin-left: 5px;
}

.web-buttons .button-class {
  font-family: monospace;
}
.web-buttons .button-code {
  width: 400px;
}

.demo [data-color=blueDarker] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #0e2d5f;
}
.demo [data-color=blueDarker] .name {
  color: #0e2d5f;
}
.demo [data-color=blueDarkGray] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #495363;
}
.demo [data-color=blueDarkGray] .name {
  color: #495363;
}
.demo [data-color=blueActionDark] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #0f527d;
}
.demo [data-color=blueActionDark] .name {
  color: #0f527d;
}
.demo [data-color=blueGrid] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #84bef3;
}
.demo [data-color=blueGrid] .name {
  color: #84bef3;
}
.demo [data-color=blueGridDark] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #4895dc;
}
.demo [data-color=blueGridDark] .name {
  color: #4895dc;
}
.demo [data-color=blueDark] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #7792ad;
}
.demo [data-color=blueDark] .name {
  color: #7792ad;
}
.demo [data-color=blueBright] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #50a5f4;
}
.demo [data-color=blueBright] .name {
  color: #50a5f4;
}
.demo [data-color=blueLight] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #aacfeb;
}
.demo [data-color=blueLight] .name {
  color: #aacfeb;
}
.demo [data-color=blueLighter] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #c5cfe5;
}
.demo [data-color=blueLighter] .name {
  color: #c5cfe5;
}
.demo [data-color=blueGray] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #c1cbd5;
}
.demo [data-color=blueGray] .name {
  color: #c1cbd5;
}
.demo [data-color=blueLightest] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #dae6f1;
}
.demo [data-color=blueLightest] .name {
  color: #dae6f1;
}
.demo [data-color=blueTab] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #dce8f2;
}
.demo [data-color=blueTab] .name {
  color: #dce8f2;
}
.demo [data-color=blueLightestAlt] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #bacedd;
}
.demo [data-color=blueLightestAlt] .name {
  color: #bacedd;
}
.demo [data-color=grayDarker] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #333333;
}
.demo [data-color=grayDarker] .name {
  color: #333333;
}
.demo [data-color=grayDark] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #666666;
}
.demo [data-color=grayDark] .name {
  color: #666666;
}
.demo [data-color=gray] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #999999;
}
.demo [data-color=gray] .name {
  color: #999999;
}
.demo [data-color=grayLight] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #bdbdbd;
}
.demo [data-color=grayLight] .name {
  color: #bdbdbd;
}
.demo [data-color=grayLighter] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #cccccc;
}
.demo [data-color=grayLighter] .name {
  color: #cccccc;
}
.demo [data-color=grayLightest] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #f3f3f3;
}
.demo [data-color=grayLightest] .name {
  color: #f3f3f3;
}
.demo [data-color=grayForm] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #f3f8fc;
}
.demo [data-color=grayForm] .name {
  color: #f3f8fc;
}
.demo [data-color=graySecondary] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #616977;
}
.demo [data-color=graySecondary] .name {
  color: #616977;
}
.demo [data-color=blueAction] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #0072bc;
}
.demo [data-color=blueAction] .name {
  color: #0072bc;
}
.demo [data-color=greenHighlight] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #008000;
}
.demo [data-color=greenHighlight] .name {
  color: #008000;
}
.demo [data-color=redHighlight] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #f80000;
}
.demo [data-color=redHighlight] .name {
  color: #f80000;
}
.demo [data-color=orangeHighlight] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #fa4801;
}
.demo [data-color=orangeHighlight] .name {
  color: #fa4801;
}
.demo [data-color=yellowHighlight] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #faab01;
}
.demo [data-color=yellowHighlight] .name {
  color: #faab01;
}
.demo [data-color=creamHighlight] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #fff2d5;
}
.demo [data-color=creamHighlight] .name {
  color: #fff2d5;
}
.demo [data-color=mintHighlight] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #009c92;
}
.demo [data-color=mintHighlight] .name {
  color: #009c92;
}
.demo [data-color=mintDarkHighlight] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #00857c;
}
.demo [data-color=mintDarkHighlight] .name {
  color: #00857c;
}
.demo [data-color=errorText] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #d80202;
}
.demo [data-color=errorText] .name {
  color: #d80202;
}
.demo [data-color=successText] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #008000;
}
.demo [data-color=successText] .name {
  color: #008000;
}
.demo [data-color=requiredText] .swatch {
  height: 1.5em;
  width: 1.5em;
  background-color: #d80202;
}
.demo [data-color=requiredText] .name {
  color: #d80202;
}

/*
CSS necessary for double picker widget to look proper
*/

table.example-table td.code-cell {
  max-width: 300px;
  min-width: 200px;
}
table.using-table caption,
table.props-table caption {
  text-align: left;
  cursor: hand;
  cursor: pointer;
  font-weight: bold;
}
table.using-table caption:after,
table.props-table caption:after {
  font-size: .75em;
  content: " (click to expand)";
}

.web-fonts .arial-bold {
  font-family: 'Arial';
  font-weight: bold;
}
.web-fonts .arial-regular {
  font-family: 'Arial';
  font-weight: normal;
}

/*
CSS necessary for double picker widget to look proper
*/
html {
  height: 100%;
}
body {
  display: block !important;
  background: initial !important;
  background-image: none !important;
  filter: none !important;
}
.header-icon {
  margin-top: .28em;
}
.easy-read {
  padding: 0 60px;
}
.version-toggle {
  position: relative;
  top: 12px;
}
.version-toggle a {
  color: rgba(0, 136, 204, 0.6);
}
.version-toggle strong a {
  color: #08c;
}
.guide-example {
  position: relative;
  margin: 15px 0;
  padding: 39px 19px 14px;
  *padding-top: 19px;
  background-color: #fff;
  border: 1px solid #888888;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
/* Echo out a label for the example */
.guide-example:after {
  content: "Example";
  position: absolute;
  top: -1px;
  left: -1px;
  padding: 3px 7px;
  font-size: 12px;
  font-weight: bold;
  background-color: #f5f5f5;
  border: 1px solid #888888;
  color: #333333;
  -webkit-border-radius: 4px 0 4px 0;
  -moz-border-radius: 4px 0 4px 0;
  border-radius: 4px 0 4px 0;
}
/* Remove spacing between an example and it's code */
.guide-example + .prettyprint {
  margin-top: -20px;
  padding-top: 15px;
}
.usage-table {
  table-layout: fixed;
}
.usage-table tr > td:nth-child(1),
.usage-table tr > th:nth-child(1) {
  width: 20%;
}
.usage-table tr > td:nth-child(2),
.usage-table tr > th:nth-child(2) {
  width: 80%;
}
.int-guide-link,
.top-link {
  font-size: 12px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.int-guide-link:after {
  content: ' \2192';
}
.top-link:after {
  content: ' \2191';
}
h1 .int-guide-link,
h2 .int-guide-link,
h3 .int-guide-link,
h4 .int-guide-link,
h5 .int-guide-link,
h6 .int-guide-link,
h1 .top-link,
h2 .top-link,
h3 .top-link,
h4 .top-link,
h5 .top-link,
h6 .top-link {
  float: right;
  margin-left: 5px;
}
.flip-img-container {
  position: relative;
}
.flip-img-container .orig-img {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transition: opacity 0.5s;
  -moz-transition: opacity 0.5s;
  -o-transition: opacity 0.5s;
  transition: opacity 0.5s;
  opacity: 1;
  filter: alpha(opacity=100);
}
.flip-img-container .orig-img:hover {
  opacity: 0;
  filter: alpha(opacity=0);
}
.search-result {
  margin-bottom: 10px;
}
.modal.double-picker-modal {
  width: 600px;
  margin-left: -300px;
}
.modal.double-picker-modal .control-label + .tree.fill {
  height: -webkit-calc(100% - 20px);
  height: -moz-calc(100% - 20px);
  height: -o-calc(100% - 20px);
  height: calc(100% - 20px);
  min-height: -webkit-calc(100% - 20px);
  min-height: calc(100% - 20px);
}
.modal.double-picker-modal .double-picker-container {
  *zoom: 1;
  clear: both;
  width: 100%;
  height: 288px;
  overflow-y: hidden;
}
.modal.double-picker-modal .double-picker-container:before,
.modal.double-picker-modal .double-picker-container:after {
  display: table;
  content: "";
  line-height: 0;
}
.modal.double-picker-modal .double-picker-container:after {
  clear: both;
}
.modal.double-picker-modal .double-picker-source-picker {
  float: left;
  width: -webkit-calc(50% - 43px);
  width: -moz-calc(50% - 43px);
  width: -o-calc(50% - 43px);
  width: calc(50% - 43px);
  height: 100%;
  vertical-align: top;
}
.modal.double-picker-modal .double-picker-source-picker .orcl-picker {
  height: 100%;
  margin-bottom: 0;
}
.modal.double-picker-modal .double-picker-source-picker .orcl-picker .search {
  width: 100%;
}
.modal.double-picker-modal .double-picker-source-picker .orcl-picker .orcl-type-ahead {
  margin-bottom: 5px;
}
.modal.double-picker-modal .double-picker-source-picker .tree-content {
  height: -webkit-calc(100% - 51px);
  height: -moz-calc(100% - 51px);
  height: -o-calc(100% - 51px);
  height: calc(100% - 51px);
}
.modal.double-picker-modal .double-picker-destination-picker {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
  width: -webkit-calc(50% - 43px);
  width: -moz-calc(50% - 43px);
  width: -o-calc(50% - 43px);
  width: calc(50% - 43px);
  height: 100%;
}
.modal.double-picker-modal .picker-controls {
  float: left;
  width: 28px;
  padding: 0 10px;
  vertical-align: top;
  position: relative;
  top: -webkit-calc(50% - 16px);
  top: -moz-calc(50% - 16px);
  top: -o-calc(50% - 16px);
  top: calc(50% - 16px);
}
.modal.double-picker-modal .picker-controls:last-child {
  padding-right: 0;
}
.modal.double-picker-modal .picker-controls .not-btn {
  display: block;
  margin: 0 auto;
  padding: 3px;
}
.modal.double-picker-modal .picker-controls .not-btn:disabled {
  opacity: 0.25;
  filter: alpha(opacity=25);
}
.modal.double-picker-modal .picker-controls .not-btn:first-child {
  margin-bottom: 10px;
}
.modal.double-picker-modal .double-picker-container.no-sort .double-picker-source-picker,
.modal.double-picker-modal .double-picker-container.no-sort .double-picker-destination-picker {
  width: -webkit-calc(50% - 24px);
  width: -moz-calc(50% - 24px);
  width: -o-calc(50% - 24px);
  width: calc(50% - 24px);
}
.table caption {
  font-weight: bold;
  text-align: left;
  padding: 4px;
}
#content-row table {
  width: 100%;
}
#content-row table th {
  text-align: left;
}
#content-row table td {
  vertical-align: top;
}
.brand {
  height: 20px;
}
table:not(.table) {
  margin-bottom: 10px;
}
table:not(.table) td:first-child:not([colspan]),
table:not(.table) th:first-child:not([colspan]) {
  width: 200px;
}

table.icons-table .pgbu-icon:hover,
table.icons-table .pgbu-icon-small:hover,
table.icons-table .pgbu-icon-large:hover,
table.icons-table .pgbu-icon-nav:hover {
  -webkit-box-shadow: 0 0 1px 0 black;
  -moz-box-shadow: 0 0 1px 0 black;
  -ms-box-shadow: 0 0 1px 0 black;
  -o-box-shadow: 0 0 1px 0 black;
  box-shadow: 0 0 1px 0 black;
}

.web-uielems .banner {
  width: 100%;
  *zoom: 1;
  clear: both;
}
.web-uielems .banner h1,
.web-uielems .banner h2,
.web-uielems .banner h3,
.web-uielems .banner h4,
.web-uielems .banner h5,
.web-uielems .banner h6 {
  margin: 0;
  padding: 0;
  height: 61px;
  line-height: 61px;
}
.web-uielems .banner .title {
  padding-left: 20px;
  display: inline-block;
}
.web-uielems .banner .pull-right {
  margin-top: -61px;
  margin-right: 20px;
}
.web-uielems .banner .btn-group {
  margin-top: -12px;
  margin-left: 10px;
}
.web-uielems .banner .btn-group .dropdown-toggle,
.web-uielems .banner .btn-group .dropdown-menu > li > a {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.web-uielems .banner .btn-group > .dropdown-toggle {
  background-color: #e5f2fb;
  color: #0e2d5f;
  font-size: 18px;
  line-height: 22px;
  border-width: 2px;
}
.web-uielems .banner .btn-group > .dropdown-toggle .caret {
  border-top-color: #0e2d5f;
}
.web-uielems .banner .btn-group ul {
  width: 100%;
}
.web-uielems .banner .nav {
  padding: 0 20px 0 0;
  border-bottom: none;
}
.web-uielems .banner .nav li {
  height: 61px;
}
.web-uielems .banner .nav li a {
  line-height: 20px;
}
.web-uielems .banner .nav.with-notch {
  -webkit-box-shadow: none !important;
  -moz-box-shadow: none !important;
  -ms-box-shadow: none !important;
  -o-box-shadow: none !important;
  box-shadow: none !important;
  background-color: transparent;
}
.web-uielems .banner .nav.with-notch > li {
  border-right: none !important;
  margin: 8px 0 -8px;
}
.web-uielems .banner .nav.with-notch > li.active:after,
.web-uielems .banner .nav.with-notch > li.active.open:after {
  border-width: 8px;
  margin-left: -8px;
}
.web-uielems .banner .orcl-popover {
  top: -5px;
}
.web-uielems .banner .orcl-popover .pgbu-icon,
.web-uielems .banner .orcl-popover .pgbu-icon-small,
.web-uielems .banner .orcl-popover .pgbu-icon-large {
  margin: 10px 0 10px 10px;
}
.web-uielems .banner .orcl-popover .orcl-popover-inner {
  top: 0;
}
.web-uielems .banner .orcl-popover .arrow {
  border-right-color: rgba(174, 194, 154, 0.8);
}
.web-uielems .banner:before,
.web-uielems .banner:after {
  display: table;
  content: "";
  line-height: 0;
}
.web-uielems .banner:after {
  clear: both;
}
