

/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------- NON-FORMS PAGES -------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */



/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------- GENERIC STYLES -------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */

* {
   margin-top: 0;
   line-height: 1.5em;
   outline: none !important;
}

body {
   min-height: 100%;
}

#contents {
   height: 100%;
   min-height: 500px;
   position: relative;
   margin-bottom: 15px;
   padding-bottom: 20px;
}

#contents.form {
   width: 100%;
   padding: 0;
   margin: 0;
   opacity: 1;
}

#contents.form.search {
   width: auto !important;
   padding: 20pt !important;
   margin: 0 !important;
   opacity: 1 !important;
   float: none !important;
}

#contents.form.users {
   width: 100%;
   padding: 0;
   margin: 0;
   opacity: 1;
}

#gContents {
   height: 100% !important;
   margin: auto;
   position: relative;
   text-align: justify;
   padding-bottom: 40pt;
}

.claro #gContents h3.header.contents {
  margin-left: 0;
  font-size: 1.5em;
}

.claro #gContents h3.header {
  margin-top: 2%;
  margin-bottom: 1.5%;
  font-weight: 900;
}

.claro #gContents h3.header + p:empty + table.title,
.claro #gContents h3.header + p:empty + p:empty + table.title {
  margin-top: -0.8em;
}

.claro #gContents h3.header.contents + p:empty + h3 {
  margin-top: 0.75em !important;
}

.claro #gContents table h3 {
  margin-top: 0;
}

.claro #gContents a:hover {
  text-decoration: underline;
}

.claro #gContents ul {
  text-align: left;
  margin-top: 1.5em;
  margin-bottom: 0.5em;
  font-weight: normal;
}

.claro #gContents ul + ul {
  margin-top: 0.5em;
}

.claro #gContents p.left {
  text-align: left; 
}

.claro #gContents p.center {
  text-align: center; 
}

.claro #gContents p.right {
  text-align: right;
}

.claro #gContents p.image,
.claro #gContents p:empty + p.image {
  margin: 30pt auto;
}

.claro #gContents p:empty + p {
  margin-top: 0;
}

.claro #gContents p + p {
  margin-top: 0.6em;
}

.claro #gContents orderedlist li {
  margin-left: 2em;
}

.claro #gContents blockquote + h3 {
  margin-top: 1.8em;
}

.claro #gContents p + h3 {
  margin-top: 1.2em;
}

.claro #gContents h3 + ul,
.claro #gContents p + blockquote,
.claro #gContents p + ul {
  margin-top: 1.5em;
}

.claro #gContents blockquote + p,
.claro #gContents ul + p {
  margin-top: 1.5em;
}

.claro #gContents blockquote p {
  margin-top: 0.8em;
}

.claro #gContents ul + blockquote ul,
.claro #gContents blockquote + blockquote ul {
  margin-top: 0;
}

.claro #gContents div.dbFormLayer p {
  margin-top: 0em;
}

.claro #gContents div.title.management {
   width: 95%;
}

.claro .search-box + #contents #gContents div.title {
   padding: 0 0 0 15pt;
}

.claro .dijitDialogPaneContent div.title table.title td {
   color: #286098;
}

.claro #gContents table.entry {
   margin: 20pt auto 40pt;
   width: 100%;
}

.claro #gContents table.entry table.entry {
   margin: 15pt auto 25pt;
}

.claro #gContents table.entry tr ~ tr td.entry {
   padding: 5pt 0 0;
}

.claro #gContents table.entry tr td.entry ~ td.entry {
   padding-left: 25pt;
}

.claro #gContents table p.image {
   width: 100%;
   margin: auto 1.5em auto auto;
}

.claro #gContents table.title .mainTitle table,
.claro #gContents table.title .secTitle table {
   margin: auto;
}

.claro #gContents table.title .mainTitle {
  float: left;
}

.claro #gContents table.title .mainTitle img {
  margin-top: 0.9em !important;
}

.claro #gContents table.title .mainTitle .entry.image + .entry h3 {
  margin-top: 0.3em !important;
  margin-left: -1em !important;
}

.claro #gContents table.title .mainTitle h3 a {
   text-decoration: none;
}

.claro #gContents table.title .secTitle {
  float: right;
  padding-right: 5px;
}

.claro #gContents table.title td:empty,
.claro #gContents table.title td > p:empty {
  display: none;
}

.claro #gContents table td ul:first-child {
   margin-top: 0;
}

.claro #gContents table td > ul {
   padding-left: 15pt;
}

.claro #gContents table td > h3 ~ ul {
   padding-left: 15pt;
}

.claro #gContents table td h3:first-child {
   margin: 1pt 0 8pt;
   padding: 0;
}

.claro #gContents table td h3 {
   margin: 25pt 0 10pt;
   padding: 0;
}

.claro blockquote table td {
   padding-left: 3pt;
}

.claro blockquote ~ h3 {
   padding-top: 10pt;
}

.claro #gContents table + p {
   margin-top: 15px;
}

.claro #gContents table tr td p + div.object,
.claro #gContents table tr td p + div.object + p {
   margin-bottom: 15px;
}

.claro #gContents div.object.video .play {
    background: url('./../images/play-video.jpg') no-repeat scroll 0 50% rgba(0, 0, 0, 0);
    background-repeat: no-repeat;
    cursor: pointer;
    height: 49px;
    margin: 5px auto 0;
    position: absolute;
    width: 48px;
    opacity: 0.7;
}

.claro #gContents div.object.video .play:hover,
.claro #gContents div.object.video .play.hover {
    background: url('./../images/play-video.jpg') no-repeat scroll 100% 50% rgba(0, 0, 0, 0);
    opacity: 1;
}





/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------- SPECIAL TABLES -------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */



.claro table.header_images {
   width: 100%;
   padding-left: 5pt;
   padding-bottom: 5pt;
}

.claro table.tutorial {
   width: 75%;
   margin: auto;
   padding-top: 10pt;
}

.claro #gContents table.news_page td table.news h3.header {
   padding-top: 10pt;
   padding-bottom: 10pt;
}

.claro #gContents table td > ul.list-news,
.claro #gContents table.news td p + ul.list-news,
.claro #gContents table.news td ul.list-news {
   font-size: 70%;
   list-style: none outside none;
   margin: 0;
   padding: 0 15px;
}

.claro #gContents table.news_page table td > ul.list-news,
.claro #gContents table.news_page table.news td p + ul.list-news,
.claro #gContents table.news_page table.news td ul.list-news {
   font-size: 110%;
   list-style: none outside none;
   margin: 0;
   padding: 10px;
}

.claro #gContents table td > ul.list-news img {
   margin: 0;
   border: none;
   box-shadow: none;
}

.claro #gContents table.news ul.list-news li:first-child {
   margin-top: 0px;
}

.claro #gContents table.news ul.list-news li {
   margin-top: 15px;
   margin-bottom: 25px;
   text-align: justify;
}

.claro #gContents table.news ul.list-news .badge { 
   background: none repeat scroll 0 0 #DFDFE0; 
   float: left; 
   width: 60px; 
   height: 40px;
   text-align: center; font-size: 18px;
   font-weight: 900; 
   line-height: 1em;    
   color: #fff; 
   text-transform: uppercase; 
   margin-top: 0;
}

.claro #gContents table.news_page table.news ul.list-news li:first-child {
   padding-top: 0px;
}

.claro #gContents table.news_page table.news ul.list-news > li {
   padding-top: 15px;
}

.claro #gContents table.news ul.list-news .badge span {
   display: block; 
   font-size: 8px;
   text-align: center;
}

.claro #gContents table.news ul.list-news span.text-info {
   font-size: 1em;
}

.claro #gContents table.news ul.list-news span.text-info ~ span {
   margin-top: 2px;
   display: inline-block;
}

.claro #gContents table.news ul.list-news a:hover {
   text-decoration: underline;
}

.claro #gContents table td > ul.list-news ul {
   margin-bottom: -10px;
}

.claro #gContents table.news td.more_news {
   text-align: right;
   padding: 0 10pt 10pt;
}

.claro #gContents table.tutorial td p img {
   padding: 10pt 5pt 15pt 0;
   width: 10%;
}

.claro #gContents table.tutorial td p.left b,
.claro #gContents table.tutorial td p.right b {
   vertical-align: middle;
   padding-top: 20pt;
}

.claro #gContents table.tutorial td ~ td {
   padding-left: 15pt;
   padding-right: 0;
}

.claro #gContents div.navT {
   position: relative;
}

.claro #gContents div.navT div.navBarT {
   bottom: 0;
   height: 25px;
   position: absolute;
   width: 65%;
}

.claro #gContents div.navT div.navBarT .navBarTControl {
   display: none;
}

.claro #gContents div.navT div.navBarT .navBarTBack,
.claro #gContents div.navT div.navBarT .navBarTNext {
   bottom: 0;
   color: grey;
   font-size: 0.8em;
   position: absolute;
   cursor: pointer;
}

.claro #gContents div.navT div.navBarT .navBarTBack:hover,
.claro #gContents div.navT div.navBarT .navBarTNext:hover {
   color: black;
}

.claro #gContents div.navT div.navBarT .navBarTBack {
   right: 80px;
}

.claro #gContents div.navT div.navBarT .navBarTBack.posP_B,
.claro #gContents div.navT div.navBarT .navBarTNext {
   right: 0;
}

.claro #gContents table.decorated {
   margin: 40pt 15pt;
}

.claro #gContents table.decorated tr:first-child td {
   background-color: #0f9171;
   color: #FFF;
}

.claro #gContents table.decorated tr td {
   background-color: #cdffcd;
   color: #000;
   padding: 10px;
   border: 5px solid #FFF;
}

.claro #gContents table.button {
   max-width: 200px;
   margin-top: 20px;
   margin-bottom: 15px;
}

.claro #gContents table.button a {
   background: none repeat scroll 0 0 transparent;
   border: 1px solid transparent;
   border-radius: 5px;
   box-sizing: border-box;
   color: #3f4752;
   cursor: pointer;
   display: inline-block;
   font: 700 1em/1.334 Arial,sans-serif;
   margin: 5px 0;
   outline: 0 none;
   padding: 6px 12px 7px;
   position: relative;
   text-align: center;
   text-decoration: none;
}

.claro #gContents table.button.button_grey a {
    background: linear-gradient(#fff, #f5f5f5) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-color: rgba(0, 0, 0, 0.15);
    text-shadow: 0 1px rgb(255, 255, 255);
}

.claro #gContents table.button.button_grey a:hover {
    background: linear-gradient(#fff, #ebebeb) repeat scroll 0 0 rgba(0, 0, 0, 0);
    color: #3f4752;
}

.claro #gContents table.button.button_green a {
    background: linear-gradient(#00c328, #00ab23) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-color: #00b124 #00991f #00841c;
    color: #fff;
    text-shadow: 0 -1px rgba(0, 0, 0, 0.15);
}

.claro #gContents table.button.button_green a:hover {
    background: linear-gradient(#00c328, #00991f) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-color: #00b124 #007519 #008b1c;
    color: #fff;
}

.claro #gContents table.button.button_blue a {
    background: linear-gradient(#5078c2, #3a5cac) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-color: #7099db #3153a6 #2c4892;
    color: #fff;
    text-shadow: 0 -1px rgba(0, 0, 0, 0.15);
}

.claro #gContents table.button.button_blue a:hover {
    background: linear-gradient(#5078c2, #32519c) repeat scroll 0 0 rgba(0, 0, 0, 0);
    color: #fff;
}

.claro #gContents table.button.button_orange a {
    background: linear-gradient(#fb9500, #fb7400) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-color: #e88a00 #ee7300 #d86100;
    color: #fff;
    text-shadow: 0 -1px rgba(0, 0, 0, 0.15);
}

.claro #gContents table.button.button_orange a:hover {
    background: linear-gradient(#fb9500, #f35b00) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-color: #e88a00 #ee7300 #b24d00;
    color: #fff;
}

.claro #gContents table.button .dijitButton {
   margin: 0;
}

.claro #gContents table.button .dijitButton .dijitButtonNode,
.claro #gContents table.button .dijitButton .dijitButtonNode {
   padding: 0;
   border: 0 none;
   box-shadow: none; 
   border-radius: 0;
   background-color: transparent;
}






/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------- HEADER SLIDERS --------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */





#slideshow {
   position: relative;
   min-height: 250px;	
   margin-top: 1px;
}

#slideshow img {
   z-index:  0;
   display: block;
   position: absolute;
   opacity: 0;
}

#slideshow img.active-image {
   opacity: 1;
}







/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------- FORMS -------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */



/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------ PRELOADERS ----------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */



.claro #customContents {
   opacity: 0; 
}

#preloader {
   width: 100%; 
   height: 100%; 
   background: transparent no-repeat center top url('http://o.aolcdn.com/dojo/1.2/dojox/image/resources/images/loading.gif'); 
   position: absolute;
   left: 0;
   top: 225px;
   z-index: 999;
   margin: 0;
   padding: 0;
}

#preloader2 {
   width: 100%; 
   height: 85%; 
   background: #FFF;
   position: absolute;
   left: 0;
   z-index: 999;
   margin: 0; 
   padding: 0;
}

#search_preloader {
   background: #FFF no-repeat center 10% url('http://o.aolcdn.com/dojo/1.2/dojox/image/resources/images/loading.gif');
   position: absolute;
}





/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------- GENERAL SETTINGS -------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */



.claro div.dijitDialogPaneContent,
.claro .dijitTooltip,
.claro .dijitPopup {
   font-size: 0.8em;
   border-top: none;
}

.claro div.formContents {
    font-size: 0.8em;
    height: 100% !important;
    margin: auto auto 40px;
    min-height: 700px;
    width: 100%;
}

.claro div.formContents.Int {
    /* background: rgb(255,255,255);
    background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(241,248,254,1) 15%, rgba(241,248,254,1) 51%, rgba(241,248,254,1) 90%, #FFF 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(15%,rgba(241,248,254,1)), color-stop(51%,rgba(241,248,254,1)),                  color-stop(90%,rgba(241,248,254,1)), color-stop(100%,#FFF));
    background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(241,248,254,1) 15%,rgba(241,248,254,1) 51%,rgba(241,248,254,1) 90%, #FFF 100%);
    background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(241,248,254,1) 15%,rgba(241,248,254,1) 51%,rgba(241,248,254,1) 90%, #FFF 100%);
    background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(241,248,254,1) 15%,rgba(241,248,254,1) 51%,rgba(241,248,254,1) 90%, #FFF 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(241,248,254,1) 15%,rgba(241,248,254,1) 51%,rgba(241,248,254,1) 90%, #FFF);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f1f8fe',GradientType=0 ); */
    background-color: #FFF;
}

.claro div.formContents div.dbLeftFormLayer {
    position: relative;
    height: 100% !important;
    margin: auto;
    min-height: 100%;
    padding: 15pt 0;
    width: 98%;
    overflow: hidden !important;
}

.claro div.formContents img {
   border: 0 none;
}

.claro div.formContents div.dbLeftFormLayer div.dbLayer,
.claro div.formContents div.dbLeftFormLayer.left div.dbLayer {
   float: left;
   width: 25%;
}

.claro div.formContents div.dbLeftFormLayer div.dbFormLayer,
.claro div.formContents div.dbLeftFormLayer.left div.dbFormLayer {
   float: right;
   width: 75%;
}

@media screen and (max-width: 1150px) {
   .claro div.formContents div.dbLeftFormLayer div.dbFormLayer,
   .claro div.formContents div.dbLeftFormLayer.left div.dbFormLayer {
       width: 68%;
       margin-left: 7%;
   }
}

.claro div.formContents div.dbLeftFormLayer.none div.dbLayer {
   width: 0;
   display: none;
}

.claro div.formContents div.dbLeftFormLayer.none div.dbFormLayer {
   width: 100%;
}

.claro div.formContents div.dbLeftFormLayer.all div.dbLayer {
   width: 100%;
}

.claro div.formContents div.dbLeftFormLayer.all div.dbFormLayer {
   width: 0;
   display: none;
}

.claro div.formContents div.dbLeftFormLayer div.dbLayer #SelectForm {
   width: 100%;
}

.claro div.formContents div.dbLeftFormLayer div.dbFormLayer .formContentPanel {
   height: 100% !important;
   min-height: 100% !important;
   overflow-y: none;
   overflow: hidden;
   padding: 0 10px !important;
}

.claro div.contentPreloader {
   background: url("http://ajax.googleapis.com/ajax/libs/dojo/1.7.4/dijit/themes/claro/images/loadingAnimation.gif") no-repeat scroll center top transparent;
   height: 150%;
   width: 70%;
   margin: 100px auto;
   position: absolute;
   z-index: 999;
}

.claro div.contentBlankPreloader {
   visibility: hidden;
}

.claro div.contentChartPreloader {
   background: url('./../images/preloader.gif') no-repeat scroll center bottom transparent;
   height: 10%;
   left: 0;
   margin-top: 50px;
   position: absolute;
   width: 100%;
   z-index: 9999;
}

.claro div.contentChartPreloader.calendar {
   margin-top: -20px;
}

.claro div.dialog table.dialogChart div.contentChartPreloader {
   width: 99%;
}

.claro div.formContents div.dbFormLayer table.FormTable {
    height: 100%;
    margin: auto;
    width: 98%;
}

.claro div.formContents div.dbLeftFormLayer div.object {
   background-color: #E5F2FE;
   background-image: linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.7) 100%);
   box-shadow: -1px 0 0 0 #D2D2D2, -1px 0 0 0 #E6E6E6, 1px 0 0 0 #D2D2D2, 2px 0 0 0 #E6E6E6, 0 -1px 0 0 #E8E8E8, 0 2px 0 0 rgba(241, 241, 241, 0.3), 0 1px 0 0 #B1B1B1;
   border-radius: 8px;
   text-align: center;
   margin: 10pt auto;
   padding: 8pt;
}

.claro div.formContents div.dbLeftFormLayer div.object div.contents {
   height: 130px;
   margin: 10px 0;
   overflow-y: auto;
}

.claro div.formContents div.dbLeftFormLayer div.object object,
.claro div.formContents div.dbLeftFormLayer div.object mediaobject {
   background-color: transparent;
}

.claro div.formObject {
   text-align: center;
   margin: 50pt auto;
}

.claro div.formContainer .dijitValidationTextBoxError .dijitValidationContainer {
   background-image: url("./../images/errorInvalidWidget.PNG"), -moz-linear-gradient(top, #d46464 0%, #d46464 50%, #d46464 51%, #d46464 100%);
   background-image: url("./../images/errorInvalidWidget.PNG"), -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d46464), color-stop(50%,#d46464), color-stop(51%,#d46464), color-stop(100%,#d46464));
   background-image: url("./../images/errorInvalidWidget.PNG"), -webkit-linear-gradient(top, #d46464 0%,#d46464 50%,#d46464 51%,#d46464 100%);
   background-image: url("./../images/errorInvalidWidget.PNG"), -o-linear-gradient(top, #d46464 0%,#d46464 50%,#d46464 51%,#d46464 100%);
   background-image: url("./../images/errorInvalidWidget.PNG"), -ms-linear-gradient(top, #d46464 0%,#d46464 50%,#d46464 51%,#d46464 100%);
   background-image: url("./../images/errorInvalidWidget.PNG"), linear-gradient(to bottom, #d46464 0%,#d46464 50%,#d46464 51%,#d46464 100%);
   background-position: 100% 50%;
   min-height: 92%;
   background-repeat: no-repeat;
}




/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------- TITLE -------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */



.claro div.formTitle {
   width: 95%;
   background: url('./../images/header.jpg') no-repeat scroll center bottom transparent;
   height: 65px;
   margin: auto;
}

.claro div.formTitle.nInt {
   display: none;
}

.claro div.formTitle table.formTitle {
   width: 100%;
   height: 100%;
   padding-top: 10pt;
}

.claro div.formTitle table.formTitle img {
   border: 0 none;
}

.claro div.formTitle table.formTitle td:first-child {
   width: 30pt;
   padding: 0 5pt;
}

.claro div.formTitle table.formTitle td {
   padding-top 0;
}

.claro div.formTitle table.formTitle td span.formTitle {
   color: #3F506B;
   font-size: 1.5em;
}

.claro div.formTitle table.formTitle td.dbShow {
   cursor: pointer;
   padding: 3pt 35pt 0 0;
   width: 10pt;
}

.claro div.formTitle table.formTitle td.dbShow img:hover {
   position: relative;
   top: 1px;
   left: 1px;
}

.claro div.formTitle table.formTitle td.dbDescription {
   width: 10pt;
   visibility: visible;
   transition: visibility 0.3s ease-in-out 0s;
   padding: 0 10pt 0 0;
}

.claro div.formTitle table.formTitle td.dbDescription img {
   float: right;
   cursor: pointer;
}

.claro div.formTitle table.formTitle td.dbDescription img:hover {
   position: relative;
   top: 1px;
   left: 1px;
}



/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------ CONTAINERS ----------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */




.claro div.container {
   padding: 0;
   margin: auto;
}

.claro #Form, 
.claro #Form_Dialog {
   margin: auto;
}

.claro #Form,
.claro div.dialogChart #Form_Dialog {
   width: 80%;
}

.claro #Form_Dialog {
   width: 100%;
}

.claro div.container fieldset {
   width: 100%;
   background: -moz-linear-gradient(top, #FFF 0%, #F9F9F9 70%, #F6F6F6 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFF), color-stop(70%,#F9F9F9),color-stop(100%,#F6F6F6));
   background: -webkit-linear-gradient(top, #FFF 0%,#F9F9F9 70%,#F6F6F6 100%);
   background: -o-linear-gradient(top, #FFF 0%,#F9F9F9 70%,#F6F6F6 100%);
   background: -ms-linear-gradient(top, #FFF 0%,#F9F9F9 70%,#F6F6F6 100%);
   background: linear-gradient(to bottom, #FFF 0%,#F9F9F9 70%,#F6F6F6 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFF', endColorstr='#F6F6F6',GradientType=0 );
   margin: 30pt auto 20pt;
}

.claro .dijitTabContainer {
   margin-top: 30pt;
}

.claro .dijitTabContainer .dijitTabPane {
   padding: 10pt 0 60pt;
} 

.claro .dijitTabContainer .tabLabel {
   outline: medium none;
}

.claro .dijitTabContainer div.container.nInt fieldset {
   width: 85%;
}

.claro .dijitTabContainer ~ div.container.buttons {
   visibility: hidden;
}

.claro div.container fieldset {
   background-color: #F9FDFF;
   border: 1px solid #809DB9; 
   margin: 15pt auto auto;
}

.claro div.container ~ div.container fieldset.EdC {
   margin: 30pt auto auto;
}

.claro div.container fieldset.nEdC {
   border: none;
   background: none;
   margin: 35pt auto 5pt;
   width: 92.3%;
}

.claro div.container fieldset.nEdC.status {
   padding-top: 20pt;
   margin: 5pt auto auto;
}

.claro div.container fieldset.EdC {
   width: 90%;
}

.claro div.container fieldset legend {
   color: #3F506B;
   font-size: 1.25em;
   font-weight: bold;
   margin-left: 15pt;
   padding: 0 5pt;
}

.claro #Form div.container.container-1 fieldset {
   margin-top: 40pt;
   background: none;
}

.claro div.dbFormLayer #Form {
   width: 100%;
   margin-left: 5pt;
}

.claro div.dbFormLayer #Form div.container.container-1 fieldset {
   width: 95%;
}

.claro #Form div.container.container-1 fieldset div.formControlContainer {
   margin-top: 5px;
}

.claro div.dbFormLayer #Form div.container.container-1 fieldset {
   border-bottom: 2px ridge #809DB9;
   border-top: none;
   border-left: none;
   border-right: none;
   height: 33px;
   margin-bottom: 40px;
   margin-top: 20px;
}

.claro #Form div.formContainer {
   font-size: 0.85em; 
}

.claro #Form div.response div.formContainer {
   background-color: #FFF;
}

.claro #Form div.container table.formContainer {
   width: 95%;
   margin: 15pt auto;
   border-collapse: separate;
   padding: 5pt;
   table-layout: fixed; 
}

.claro div.formContents.nInt table.formContainer.sLpC td ~ td table {
   width: 93%;
}

.claro #Form fieldset.nEdC + fieldset.nEdC div.nEdC {
   padding: 5pt 0;
}

.claro #Form div.nEdC table.formContainer {
   border-style: none;
   border-collapse: collapse;
   table-layout: auto;
}

div.dbFormLayer #Form div table.formContainer.sLpC,
div.dbFormLayer #Form div table.formContainer.sLpCe {
   width: 100%;
}

.claro #Form div.formControlContainer {
   font-size: 0.85em;
   color: #3F506B;
}

.claro #Form div.formControlContainer table.formContainer {
   width: 100%;
}

.claro #Form div.formControlContainer table.formContainer td.formKeyIcon {
   width: 5%;
}

.claro #Form div.formControlContainer table.formContainer td.formKeyIcon + td.fieldTitle ~ td > table,
.claro #Form div.formControlContainer table.formContainer td.formKeyIcon + td.fieldTitle ~ td > table {
   float: right;
}

.claro #Form div.formControlContainer table.formContainer.sLpCe td.formKeyIcon + td.fieldTitle ~ td > table {
   float: left;
}

.claro #Form fieldset.nEdC div.formContainer.nEdC table.formContainer {
   border: 0.1em solid #809DB9;
   margin: 0 auto;
   width: 100%;
}

.claro #Form div.formContainer:last-of-type fieldset.nEdC {
   margin: 0 auto;
}

.claro #Form fieldset.nEdC div.formContainer.nEdC table.formContainer tr:first-child td.nEdC.title {
   background-color: #004875;
   border-color: #6eadca #004875 #004875;
   border-style: solid;
   border-width: 1px;
   color: #ffffff;
   font-size: 1.25em;
   font-weight: bold;
   padding-left: 7pt;
}

.claro #Form fieldset.nEdC:last-of-type div.formControlContainer table.formContainer {
   margin: -5pt auto 0;
}

.claro #Form fieldset.nEdC:last-of-type div.formControlContainer.nEdC table.formContainer {
   margin: 5pt auto 0;
}

.claro #Form div.description {
   font-size: 1.25em;
   margin-left: -6%;
   margin-top: 3%;
   text-align: justify;
   width: 113%;
}

.claro div.nEdC table.eC td .dijitTextBoxDisabled.dijitDisabled,
.claro div.nEdC table.eC td .dijitTextBoxDisabled.dijitDisabled .dijitInputContainer,
.claro div.nEdC table.eC td .dijitComboBoxDisabled.dijitDisabled .dijitArrowButtonInner {
   width: 140pt;
}

.claro div.formContainer.nEdC table.formContainer tr.nL:nth-child(odd),
.claro div.formContainer.nEdC table.formContainer tr.nLF:nth-child(odd) {
   background-color: #EFF6F9;
   background-repeat: no-repeat;
}

.claro div.formContainer.nEdC table.formContainer tr.nL:nth-child(even),
.claro div.formContainer.nEdC table.formContainer tr.nLF:nth-child(even) {
   background-color: #FFFFFF;
   background-repeat: no-repeat;
}

.claro div.formContainer.nEdC table.dropDownContainer {
   float: right;
}

.claro div.formContainer.nEdC table.dropDownContainer td.containerAction {
   float: right;
   margin-top: -25px;
}

.claro div.formContainer.nEdC table.dropDownContainer td.containerAction span {
   color: #3F506B;
   display: inline-block;
   font-size: 8pt;
   margin-right: 10px;
   vertical-align: top;
}

.claro div.formContainer.nEdC table.dropDownContainer td.containerAction img:hover {
   cursor: pointer;
   position: relative;
   top: 1px;
   left: 1px;
}





/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------- FIELD TITLES ---------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */



.claro table.formContainer td.fieldTitle,
.claro table.formContainer div.dijitCheckBox + label {
   text-align: left;
   vertical-align: middle;
   color: #585A4D;
   font-weight: bold;
   word-wrap: break-word;
   padding-right: 10pt;
   box-sizing: border-box;
}

.claro table.formContainer td.fieldTitle div.fieldTitleBox {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   width: 90%;
}

.claro div.dijitCheckBox > input {
   cursor: pointer;
}

.claro fieldset.nEdC div.formContainer.nEdC table.formContainer td.fieldTitle {
   color: #004875;
}

.claro div.formContainer table.formContainer td.fieldTitle,
.claro div.formContainer table.formContainer div.dijitCheckBox + label {
   width: 35%; 
}

.claro div.formContainer table.formContainer td.fieldTitle ~ td {
   width: 65%; 
}

.claro div.container.response div.formContainer table.formContainer td.fieldTitle.checkBox {
   padding-left: 7pt;
}

.claro div.container.response div.formContainer table.formContainer td.fieldTitle ~ td.fieldInput.checkBox {
   padding: 0;
   vertical-align: middle;
}

.claro div.container.response div.formContainer table.formContainer td.fieldTitle ~ td.fieldInput.checkBox div {
   padding-left: 3px;
}

.claro div.formContainer table.formContainer.sLpC td.fieldTitle,
.claro div.formContainer table.formContainer.sLpCe td.fieldTitle,
.claro div.formContainer table.formContainer.sLpC div.dijitCheckBox + label,
.claro div.formContainer table.formContainer.sLpCe div.dijitCheckBox + label {
   width: 25%;
}

.claro div.dialog div.formContainer table.formContainer.sLpC td.fieldTitle,
.claro div.dialog div.formContainer table.formContainer.sLpCe td.fieldTitle,
.claro div.dialog div.formContainer table.formContainer.sLpC div.dijitCheckBox + label,
.claro div.dialog div.formContainer table.formContainer.sLpCe div.dijitCheckBox + label {
   width: 15% !important;
}

.claro div.formContainer table.formContainer.sLpC td.fieldTitle + td,
.claro div.formContainer table.formContainer.sLpC td.fieldTitle + input + td,
.claro div.formContainer table.formContainer.sLpC td.fieldTitle + input + script + td,
.claro div.formContainer table.formContainer.sLpCe td.fieldTitle + td,
.claro div.formContainer table.formContainer.sLpCe td.fieldTitle + input + td,
.claro div.formContainer table.formContainer.sLpCe td.fieldTitle + input + script + td {
   width: 25%;
}

.claro div.formControlContainer table.formContainer td.fieldTitle,
.claro div.formControlContainer table.formContainer div.dijitCheckBox + label {
   min-width: 30%;
   width: 35%;
}

.claro div.formControlContainer.nEdC table.formContainer.sLpC td.fieldTitle,
.claro div.formControlContainer.nEdC table.formContainer.sLpCe td.fieldTitle,
.claro div.formControlContainer.nEdC table.formContainer.sLpC div.dijitCheckBox + label,
.claro div.formControlContainer.nEdC table.formContainer.sLpCe div.dijitCheckBox + label {
   width: 32%;
}

.claro table.formContainer td.fieldTitle {
   vertical-align: middle;
   padding-left: 7pt;
   box-sizing: border-box;
}

.claro table.formContainer td.fieldTitle ~ td {
   vertical-align: middle;
}

.claro div.formContainer table.formContainer.sLpC td.fieldTitle ~ td.fieldTitle {
   width: 25%;
}

.claro div.dbFormLayer div.formContainer table.formContainer.sLpC td.fieldTitle ~ td.fieldTitle {
   width: 22%;
}

.claro div.formContainer table.formContainer.sLpCe td ~ td.fieldTitle {
   padding-left: 20pt;
   width: 22%;
}

.claro div.formControlContainer table.formContainer td.fieldTitle {
   font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
   font-size: 1.5em;
}

.claro div.formContainer.nEdC table.formContainer td.fieldTitle,
.claro div.formContainer.nEdC table.formContainer td.fieldTitle ~ td,
.claro div.formContainer.nEdC table.formContainer td.formattedExpression.chart {
   border-color: #E1EEF4; 
   border-width: 1px;
}

.claro div.formContainer.nEdC table.formContainer td.fieldTitle + td {
   padding-top: 2pt;
   padding-left: 4pt;
}

.claro table.formContainer td.editor td.fieldTitle,
.claro table.formContainer td.tableGrid td.fieldTitle {
   font-weight: bold;
   color: #585A4D;
   padding: 5px 2px;
}

.claro div.formContainer table.formContainer.resume tr:first-child {
   display: none;
}

.claro div.formContainer table.formContainer.resume tr td.fieldTitle.resume {
   height: 24px;
   width: 22%;
}

.claro div.formContainer table.formContainer.resume td.fieldTitle.resume + td {
   width: 28%;
}






/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------- BUTTONS ------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */



.claro #Form div.container.control + input + input + input + input + input + #formControlButtonContainer {
   border-bottom: 2px ridge #809DB9;
   padding-top: 0;
   width: 95%;
   margin: auto;
}

.claro #Form div.container.normal + input + input + input + input + input + #formControlButtonContainer {
   border-bottom: 2px ridge #809DB9;
   padding-top: 40pt;
   width: 95%;
   margin: auto;
}

.claro table.formButtons {
   margin: 25pt auto 25pt 35%;
   font-size: 0.8em;
}

.claro .loginLayer.users table.formButtons {
   margin: 20px 0 0 auto;
   padding-bottom: 0;
   font-size: 0.8em;
   width: 100%;
}

.claro .loginLayer.users table.formButtons td {
   text-align: center;
}

.claro div.dbFormButtons {
   float: left;
   padding-top: 18pt;
}

.claro div.dbFormButtons table.formButtons {
   margin: 0 15pt;
}

.claro table.formButtons .dijitButton {
    margin: auto 12pt;
}

.claro table.formButtons .B_A .dijitButton .dijitButtonNode,
.claro table.formButtons .B_A .dijitDropDownButton .dijitButtonNode, 
.claro table.formButtons .B_A .dijitComboButton .dijitButtonNode, 
.claro table.formButtons .B_A .dijitToggleButton .dijitButtonNode,
.claro table.formButtons .B_Cl .dijitButton .dijitButtonNode,
.claro table.formButtons .B_Cl .dijitDropDownButton .dijitButtonNode, 
.claro table.formButtons .B_Cl .dijitComboButton .dijitButtonNode, 
.claro table.formButtons .B_Cl .dijitToggleButton .dijitButtonNode,
.claro div.sigsDialog div.sigInfoButton.B_Cl .dijitButton .dijitButtonNode {
    background: #287BBC;
    background: #287bbc;
    background: -moz-linear-gradient(top, #287bbc 0%, #23639a 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#287bbc), color-stop(100%,#23639a));
    background: -webkit-linear-gradient(top, #287bbc 0%,#23639a 100%);
    background: -o-linear-gradient(top, #287bbc 0%,#23639a 100%);
    background: -ms-linear-gradient(top, #287bbc 0%,#23639a 100%);
    background: linear-gradient(to bottom, #287bbc 0%,#23639a 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#287bbc', endColorstr='#23639a',GradientType=0 );
    border-color: #1B5480;
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    color: #FFFFFF;
    display: inline-block;
    font-size: 13px;
    font-weight: bold;
    line-height: 30px;
    overflow: visible;
    padding: 4px 15px 6px;
    text-decoration: none !important;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
    vertical-align: middle;
    white-space: nowrap;
    width: auto;
    outline: none !important;
}

.claro table.formButtons .B_A .dijitButton .dijitButtonNode:hover,
.claro table.formButtons .B_A .dijitDropDownButton .dijitButtonNode:hover, 
.claro table.formButtons .B_A .dijitComboButton .dijitButtonNode:hover, 
.claro table.formButtons .B_A .dijitToggleButton .dijitButtonNode:hover,
.claro table.formButtons .B_Cl .dijitButton .dijitButtonNode:hover,
.claro table.formButtons .B_Cl .dijitDropDownButton .dijitButtonNode:hover, 
.claro table.formButtons .B_Cl .dijitComboButton .dijitButtonNode:hover, 
.claro table.formButtons .B_Cl .dijitToggleButton .dijitButtonNode:hover
.claro div.sigsDialog div.sigInfoButton.B_Cl .dijitButton .dijitButtonNode:hover {
    background: #2672AE;
    background: #2672ae;
    background: -moz-linear-gradient(top, #2672ae 0%, #1e4f7e 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2672ae), color-stop(100%,#1e4f7e));
    background: -webkit-linear-gradient(top, #2672ae 0%,#1e4f7e 100%);
    background: -o-linear-gradient(top, #2672ae 0%,#1e4f7e 100%);
    background: -ms-linear-gradient(top, #2672ae 0%,#1e4f7e 100%);
    background: linear-gradient(to bottom, #2672ae 0%,#1e4f7e 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2672ae', endColorstr='#1e4f7e',GradientType=0 );
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
    color: #FFF;
}

.claro table.formButtons .B_R .dijitButton .dijitButtonNode,
.claro table.formButtons .B_R .dijitDropDownButton .dijitButtonNode, 
.claro table.formButtons .B_R .dijitComboButton .dijitButtonNode, 
.claro table.formButtons .B_R .dijitToggleButton .dijitButtonNode {
   background: #f2f2f2;
   background: -moz-linear-gradient(top, #f2f2f2 0%, #e9e9e9 32%, #e9e9e9 74%, #e9e9e9 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(32%,#e9e9e9), color-stop(74%,#e9e9e9), color-stop(100%,#e9e9e9));
   background: -webkit-linear-gradient(top, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   background: -o-linear-gradient(top, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   background: -ms-linear-gradient(top, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   background: linear-gradient(to bottom, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#e9e9e9',GradientType=0 );
   border-color: #A7A7A7;
   border-radius: 3px;
   border-style: solid;
   border-width: 1px;
   color: #444444;
   display: inline-block;
   font-size: 13px;
   font-weight: bold;
   line-height: 29px;
   margin: 0;
   overflow: visible;
   padding: 5px 10px 6px;
   text-decoration: none !important;
   text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
   vertical-align: middle;
   white-space: nowrap;
   outline: none !important;
   width: auto;
}

.claro table.formButtons .B_R .dijitButton .dijitButtonNode:hover,
.claro table.formButtons .B_R .dijitDropDownButton .dijitButtonNode:hover, 
.claro table.formButtons .B_R .dijitComboButton .dijitButtonNode:hover, 
.claro table.formButtons .B_R .dijitToggleButton .dijitButtonNode:hover {
   background: #ffffff;
   background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#ffffff));
   background: -webkit-linear-gradient(top, #ffffff 0%,#ffffff 100%);
   background: -o-linear-gradient(top, #ffffff 0%,#ffffff 100%);
   background: -ms-linear-gradient(top, #ffffff 0%,#ffffff 100%);
   background: linear-gradient(to bottom, #ffffff 0%,#ffffff 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 );
}

.claro table.formButtons .B_A_Reg {
   float: right;
}

.claro table.formButtons .B_A_Reg .dijitButton .dijitButtonNode {
   background: yellow;
   background: -moz-linear-gradient(center top , yellow 0%, yellow 75%, yellow 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,yellow), color-stop(75%,yellow), color-stop(100%,yellow));
   background: -webkit-linear-gradient(top, yellow 0%,yellow 75%,yellow 100%);
   background: -o-linear-gradient(top, yellow 0%,yellow 75%,yellow 100%);
   background: -ms-linear-gradient(top, yellow 0%,yellow 75%,yellow 100%);
   background: linear-gradient(to bottom, yellow 0%,yellow 75%,yellow 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='yellow', endColorstr='yellow',GradientType=0 );
   border-color: #A7A7A7;
   border-radius: 3px;
   border-style: solid;
   border-width: 1px;
   color: #444;
   display: inline-block;
   font-size: 13px;
   font-weight: bold;
   line-height: 29px;
   margin: 0;
   overflow: visible;
   padding: 5px 10px 6px;
   text-decoration: none !important;
   text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
   vertical-align: middle;
   white-space: nowrap;
   outline: none !important;
   width: auto;
}

.claro table.formButtons .B_A_Reg .dijitButton.dijitDisabled .dijitButtonNode,
.claro table.formButtons .B_A_Reg .dijitButton.dijitDisabled .dijitButtonNode:hover {
   background: #f2f2f2;
   background: -moz-linear-gradient(top, #f2f2f2 0%, #e9e9e9 32%, #e9e9e9 74%, #e9e9e9 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(32%,#e9e9e9), color-stop(74%,#e9e9e9), color-stop(100%,#e9e9e9));
   background: -webkit-linear-gradient(top, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   background: -o-linear-gradient(top, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   background: -ms-linear-gradient(top, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   background: linear-gradient(to bottom, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#e9e9e9',GradientType=0 );
   border-color: #CCC;
   border-radius: 3px;
   border-style: solid;
   border-width: 1px;
   color: #444444;
   cursor: default;
   display: inline-block;
   font-size: 13px;
   font-weight: bold;
   line-height: 29px;
   margin: 0;
   overflow: visible;
   padding: 5px 10px 6px;
   text-decoration: none !important;
   text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
   vertical-align: middle;
   white-space: nowrap;
   outline: none !important;
   width: auto; 
}

.claro table.formButtons .B_A_Reg .dijitButton .dijitButtonNode:hover {
   background: #eddb11;
   background: -moz-linear-gradient(center top , #eddb11 0%, #efcf14 75%, #f1bf18 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eddb11), color-stop(75%,#efcf14), color-stop(100%,#f1bf18));
   background: -webkit-linear-gradient(top, #eddb11 0%,#efcf14 75%,#f1bf18 100%);
   background: -o-linear-gradient(top, #eddb11 0%,#efcf14 75%,#f1bf18 100%);
   background: -ms-linear-gradient(top, #eddb11 0%,#efcf14 75%,#f1bf18 100%);
   background: linear-gradient(to bottom, #eddb11 0%,#efcf14 75%,#f1bf18 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eddb11', endColorstr='#f1bf18',GradientType=0 );
}

.claro table.formButtons .B_PL {
   padding-top: 5px;
   text-align: right;
   width: 15%;
}

.claro table.formButtons .B_PL_T {
    padding-left: 15px;
    padding-top: 10px;
}

.claro table.formButtons .B_PL_T div {
   font-style: italic;
   color: #002643;
}

.claro div.dbFormManager {
   float: right;
   padding-top: 20pt;
   max-width: 350px;
}

.claro div.dbFormManager table.dbFormManager {
   margin: 2pt 25pt 0 0;
}

.claro div.dbFormManager td.managerStatus table td.managerStatus_image {
   padding: 2pt 5pt 0 0;
}

.claro div.dbFormManager td.managerStatus table span.managerStatus_text {
   font-size: 10pt;
   font-style: italic;
}

.claro div.dbFormManager table.dbFormManager #managerPL {
   padding: 0 20pt 0 0;
}

.claro table.formContainerButtons2 {
   margin: 15pt auto auto 2pt;
}

.claro table.formContainerButtons2 td.exportPL {
   padding: 5pt 4pt 1pt;
}








/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------- DATABASE LIST ---------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */






.claro #dbLeftGrid .dojoxGrid table {
   margin: 0;
}

.claro .highlightRow tr { 
   background-color: #F2F2F2 !important;
}

.claro #dbLeftGrid {
   border: none;
   cursor: pointer;
   height: 100%;
   margin: auto;
   min-height: 700px;
   max-height: 1000px !important;
   width: 100%;
   padding: 0 0 2px 0;
}

.claro #dbLeftGrid .dojoxGridMasterHeader {
   background: #f2f2f2;
   background: -moz-linear-gradient(top, #f2f2f2 0%, #e9e9e9 32%, #d8d8d8 74%, #d1d1d1 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(32%,#e9e9e9), color-stop(74%,#d8d8d8), color-stop(100%,#d1d1d1));
   background: -webkit-linear-gradient(top, #f2f2f2 0%,#e9e9e9 32%,#d8d8d8 74%,#d1d1d1 100%);
   background: -o-linear-gradient(top, #f2f2f2 0%,#e9e9e9 32%,#d8d8d8 74%,#d1d1d1 100%);
   background: -ms-linear-gradient(top, #f2f2f2 0%,#e9e9e9 32%,#d8d8d8 74%,#d1d1d1 100%);
   background: linear-gradient(to bottom, #f2f2f2 0%,#e9e9e9 32%,#d8d8d8 74%,#d1d1d1 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#d1d1d1',GradientType=0 );
   border-bottom: 1px solid #D1D1D1;
}

.claro #dbLeftGrid .dojoxGridMasterMessages {
   height: 100%;
   width: 100%;
   position: absolute;
   background-color: #F9FDFF !important;
   padding: 15pt 0 0 0;
}

.claro #dbLeftGrid div.dojoxGridMasterMessages span.dojoxGridNoData,
.claro #dbLeftGrid div.dojoxGridMasterMessages span.dojoxGridLoading {
   font-size: 10pt;
   font-style: italic;
}

.claro #dbLeftGrid .dojoxGridMasterView .dojoxGridView {
   min-height: inherit; 
}

.claro #dbLeftGridTable td.dbLeftGridContainer.reduced #dbLeftGrid {
   min-height: 350px;
}

.claro #dbLeftGrid .dojoxGridMasterHeader .dojoxGridRowTable {
   margin-left: 1px;
   border-left: none;
}

.claro #dbLeftGrid .dojoxGridHeader:first-child th {
   height: 42px;
   cursor: pointer;
   vertical-align: middle;
   border-bottom: 1px solid #CCCCCC !important;
}

.claro #dbLeftGrid .dojoxGridHeader th {
   height: 35px;
   border-left: none;
   border-right: none;
   border-bottom: 1px solid #CCCCCC !important;
}

.claro #dbLeftGrid .dojoxGridHeader #dbLeftGridHdr1 {
   padding-left: 38px;
   width: 145px !important;
}

.claro #dbLeftGrid td.dojoxGridCell {
   height: 28px;
   border-left: none;
   border-right: none;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   vertical-align: middle;
}

.claro #dbLeftGrid td.dojoxGridCell span.date {
   color: grey;
   float: right;
   padding-right: 45px;
   font-size: 90%;
}

.claro #dbLeftGrid td.dojoxGridCell span.data {
   font-size: 90%;
}

.claro #dbLeftGrid .dojoxGridSortNode {
   margin: 8px 1px 0;
   font-size: 1.1em;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   font-size: 95%;
}

.claro #dbLeftGrid .dojoxGridSortNode span.date {
   float: right;
   padding-right: 45px;
}

.claro #dbLeftGrid .dojoxGridRowOdd .dojoxGridCell {
   border-top: 1px solid transparent;
   border-bottom: 1px solid #E5DAC8;
}

.claro #dbLeftGrid .dojoxGridRowOdd .dojoxGridCell {
   background: #f3f6fa;
   background: -moz-linear-gradient(top, #F3F6Fa 0%, #F9FDFF 60%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F3F6Fa), color-stop(60%,#F9FDFF));
   background: -webkit-linear-gradient(top, #F3F6Fa 0%,#F9FDFF 60%);
   background: -o-linear-gradient(top, #F3F6Fa 0%,#F9FDFF 60%);
   background: -ms-linear-gradient(top, #F3F6Fa 0%,#F9FDFF 60%);
   background: linear-gradient(to bottom, #F3F6Fa 0%,#F9FDFF 60%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F3F6Fa', endColorstr='#F9FDFF',GradientType=0 );
}

.claro #dbLeftGrid .dojoxGridRowbar {
   border-right: none;
}

.claro #dbLeftGrid .dojoxGridRowbar .dojoxGridRowbarInner {
   height: 28px;
   vertical-align: middle;
   border-top: 1px solid transparent;
   border-bottom: 1px solid #E5DAC8;
}

.claro #dbLeftGrid .dojoxGridRowbar .dojoxGridRowbarInner .dijitCheckBox,
.claro #dbLeftGrid .dojoxGridRowbar .dojoxGridRowbarInner .dijitCheckBoxIcon {
   margin: 0 0 2px 0 !important;
}

.claro #dbLeftGrid .dojoxGridRowbar:nth-child(odd) .dojoxGridRowbarInner {
   background-color: #FFF;
}

.claro #dbLeftGrid .dojoxGridRowbar:nth-child(even) .dojoxGridRowbarInner {
   background: #f3f6fa;
   background: -moz-linear-gradient(top, #F3F6Fa 0%, #F9FDFF 60%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F3F6Fa), color-stop(60%,#F9FDFF));
   background: -webkit-linear-gradient(top, #F3F6Fa 0%,#F9FDFF 60%);
   background: -o-linear-gradient(top, #F3F6Fa 0%,#F9FDFF 60%);
   background: -ms-linear-gradient(top, #F3F6Fa 0%,#F9FDFF 60%);
   background: linear-gradient(to bottom, #F3F6Fa 0%,#F9FDFF 60%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F3F6Fa', endColorstr='#F9FDFF',GradientType=0 );
}

.claro #dbLeftGrid .dojoxGridRowOver .dojoxGridCell,
.claro #dbLeftGrid .dojoxGridRowbar.dojoxGridRowbarOver .dojoxGridRowbarInner {
   background: url("images/row_back.png") repeat-x scroll 0 0 #FBFBCA;
   border-top: 1px solid transparent;
   border-bottom: 1px solid #D1D1D1;
}

.claro #dbLeftGrid .dojoxGridRowSelected .dojoxGridCell,
.claro #dbLeftGrid .dojoxGridRowbar.dojoxGridRowbarSelected .dojoxGridRowbarInner {
   background: none repeat scroll 0 0 #FFE284;
   border-top: 1px solid transparent;
   border-bottom: 1px solid #D1D1D1;
}

.claro #dbLeftGrid .dojoxGridHeader .dojoxGridCellFocus {
   border-top: none !important;
   border-left: none !important;
   border-right: none !important;
}

.claro #dbLeftGrid .dojoxGridHeader .dojoxGridCellOver,
.claro #dbLeftGrid .dojoxGridHeader .dojoxGridCellOver .dojoxGridSortNode {
   background: none;
}

.claro #dbLeftGrid .dojoxGridScrollbox {
   overflow-x: auto;
}

.claro #dbLeftGrid.left .dojoxGridScrollbox {
   overflow-x: hidden;
}

.claro #dbLeftGrid .dojoxGridScrollbox {
   height: 100% !important;
   background-color: #fcfcfc;
}

.claro #dbLeftGridTable td.formContainerButtonsArea {
   border-bottom: 2px ridge #809DB9;
}

.claro #dbLeftGridTable td.formContainerButtonsArea.bottom {
   border-bottom: none;
}

.claro #dbLeftGridTable td.formContainerButtonsArea .dijitButton .dijitButtonNode, 
.claro #dbLeftGridTable td.formContainerButtonsArea .dijitDropDownButton .dijitButtonNode, 
.claro #dbLeftGridTable td.formContainerButtonsArea .dijitComboButton .dijitButtonNode, 
.claro #dbLeftGridTable td.formContainerButtonsArea .dijitToggleButton .dijitButtonNode {
   background: #f2f2f2;
   background: -moz-linear-gradient(top, #f2f2f2 0%, #e9e9e9 32%, #e9e9e9 74%, #e9e9e9 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(32%,#e9e9e9), color-stop(74%,#e9e9e9), color-stop(100%,#e9e9e9));
   background: -webkit-linear-gradient(top, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   background: -o-linear-gradient(top, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   background: -ms-linear-gradient(top, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   background: linear-gradient(to bottom, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#e9e9e9',GradientType=0 );
   border-color: #A7A7A7;
   border-radius: 3px;
   border-style: solid;
   border-width: 1px;
   color: #444444;
   cursor: pointer;
   display: inline-block;
   font-size: 13px;
   font-weight: bold;
   line-height: 29px;
   margin: 0;
   overflow: visible;
   padding: 5px;
   text-decoration: none !important;
   text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
   vertical-align: middle;
   white-space: nowrap;
   width: auto;
}

.claro #dbLeftGridTable td.formContainerButtonsArea .dijitButton .dijitButtonNode:hover, 
.claro #dbLeftGridTable td.formContainerButtonsArea .dijitDropDownButton .dijitButtonNode:hover, 
.claro #dbLeftGridTable td.formContainerButtonsArea .dijitComboButton .dijitButtonNode:hover, 
.claro #dbLeftGridTable td.formContainerButtonsArea .dijitToggleButton .dijitButtonNode:hover {
   background: #ffffff;
   background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#ffffff));
   background: -webkit-linear-gradient(top, #ffffff 0%,#ffffff 100%);
   background: -o-linear-gradient(top, #ffffff 0%,#ffffff 100%);
   background: -ms-linear-gradient(top, #ffffff 0%,#ffffff 100%);
   background: linear-gradient(to bottom, #ffffff 0%,#ffffff 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 );
}

.claro #dbLeftGridTable td.formContainerButtonsArea .dijitButton.dijitDisabled .dijitButtonNode, 
.claro #dbLeftGridTable td.formContainerButtonsArea .dijitDropDownButton.dijitDisabled .dijitButtonNode, 
.claro #dbLeftGridTable td.formContainerButtonsArea .dijitComboButton.dijitDisabled .dijitButtonNode, 
.claro #dbLeftGridTable td.formContainerButtonsArea .dijitToggleButton.dijitDisabled .dijitButtonNode {
   background: #f2f2f2;
   background: -moz-linear-gradient(top, #f2f2f2 0%, #f2f2f2 32%, #f2f2f2 74%, #f2f2f2 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(32%,#f2f2f2), color-stop(74%,#f2f2f2), color-stop(100%,#f2f2f2));
   background: -webkit-linear-gradient(top, #f2f2f2 0%,#f2f2f2 32%,#f2f2f2 74%,#f2f2f2 100%);
   background: -o-linear-gradient(top, #f2f2f2 0%,#f2f2f2 32%,#f2f2f2 74%,#f2f2f2 100%);
   background: -ms-linear-gradient(top, #f2f2f2 0%,#f2f2f2 32%,#f2f2f2 74%,#f2f2f2 100%);
   background: linear-gradient(to bottom, #f2f2f2 0%,#f2f2f2 32%,#f2f2f2 74%,#f2f2f2 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#f2f2f2',GradientType=0 );
   cursor: default;
   border-color: #D3D3D3;
}

.claro table.dbLeftGrid {
   height: 100%;
   padding: 8pt;
   width: inherit;
}

.claro table.dbLeftGrid td.dbLeftGridContainer {
   width: inherit;
   margin: 0;
   vertical-align: top;
   min-height: 700px;
   height: 700px;
}

.claro table.dbLeftGrid div.dbHide {
   height: 10px;
   cursor: pointer;
   float: left;
   margin-top: 3px;
   margin-left: 4px;
}

.claro table.dbLeftGrid div.dbHide.hidden {
   visibility: hidden;
}

.claro table.dbLeftGrid div.dbHide img:hover {
   position: relative;
   top: 1px;
   left: 1px;
}

.claro table.dbLeftGrid div.dbExtend {
   height: 10px;
   cursor: pointer;
   float: right;
   margin-top: 6px;
   margin-right: 2px;
}

.claro table.dbLeftGrid div.dbExtend.hidden {
   visibility: hidden;
}

.claro table.dbLeftGrid div.dbExtend img:hover {
   position: relative;
   top: 1px;
   left: 1px;
}

.claro table.dbLeftGrid td.dbFormNewButton .dijitButton .dijitButtonNode,
.claro table.dbLeftGrid td.dbFormDeleteButton .dijitButton .dijitButtonNode,
.claro table.dbLeftGrid td.dbFormGlobalButton .dijitButton .dijitButtonNode,
.claro table.dbLeftGrid td.dbFormExportButton .dijitButton .dijitButtonNode {
   padding: 1.5px 3px;
} 

.claro table.dbLeftGrid td.dbFormNewButton .dijitButton .dijitButtonNode .dijitButtonText,
.claro table.dbLeftGrid td.dbFormDeleteButton .dijitButton .dijitButtonNode .dijitButtonText,
.claro table.dbLeftGrid td.dbFormGlobalButton .dijitButton .dijitButtonNode .dijitButtonText,
.claro table.dbLeftGrid td.dbFormExportButton .dijitButton .dijitButtonNode .dijitButtonText {
   font-size: 8pt;
} 

.claro table.dbLeftGrid td.dbFormNewButton,
.claro table.dbLeftGrid td.dbFormDeleteButton,
.claro table.dbLeftGrid td.dbFormGlobalButton,
.claro table.dbLeftGrid td.dbFormExportButton {
   padding: 5pt 4pt 6pt;
}

.claro table.dbLeftGrid tr:nth-child(3) td:nth-child(2) {
   text-align: right;
   padding-right: 8pt;
   padding-top: 12pt;
}

.claro table.dbLeftGrid tr:nth-child(3) td:nth-child(2) a {
   color: #3B5998;
   cursor: pointer;
}

.claro table.dbLeftGrid tr:nth-child(3) td:nth-child(2) a:hover {
   text-decoration: underline;
}

.claro table.dbLeftGrid table.formSearchWidget {
   margin: 12pt 0 5pt;
}

.claro table.dbLeftGrid table.formSearchWidget td.formSearchInput {
   position: absolute;
   border: 1px solid #B5BCC7; 
   background-color: #FFF;
   transition-duration: 0.25s;
   -webkit-transition-duration: 0.25s;
   padding: 0;
   font-family: times new roman;
}

.claro table.dbLeftGrid table.formSearchWidget td.formSearchInput div.dijitTextBox {
   width: 120pt;
   height: 18pt;
   border: none;
   padding-left: 2pt;
}

.claro table.dbLeftGrid table.formSearchWidget td.formSearchInput div.dijitTextBox .dijitInputContainer {
   border: none;
   padding-top: 1pt;
}

.claro table.dbLeftGrid table.formSearchWidget td.formSearchInput div.dijitTextBox .dijitInputContainer .dijitPlaceHolder {
   padding-top: 3px;
}

.claro table.dbLeftGrid table.formSearchWidget td.formSearchInput div.formSearchClearIcon {
   position: absolute; 
   top: 1pt;
   left: 106pt;
   z-index: 0;
   cursor: pointer;
   padding: 1pt 3pt 2pt 0;
}

.claro table.dbLeftGrid table.formSearchWidget td.formSearchIcon {
   cursor: pointer;
   padding: 0 0 0 130pt;
}

.claro table.dbLeftGrid table.formSearchWidget td.globalBPL {
   padding-top: 3pt;
   padding-left: 12pt;
}


.claro table.dbLeftGrid table.formSearchWidget td.formSearchInput div.formSearchClearIcon img:hover,
.claro table.dbLeftGrid table.formSearchWidget td.formSearchIcon img:hover {
   position: relative;
   top: 1px;
   left: 1px;
}





/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------- DIALOGS ------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */


.claro .dijitDialogUnderlay {
   background: none repeat scroll 0 0 #000 !important;
   opacity: 0.65;
}

.claro div.dijitDialogPaneContent {
   border: 5px solid #e9e9e9;
}

.claro div.dialog.dialogText div.dijitDialogPaneContent {
   border: none;
}

.claro div.dialog {
   width: 700px;
}

.claro div.dialog.dialogText {
   width: 1000px; 
}

.claro div.dialogChart {
   width: 800px;
}

.claro div.dialog div.dijitDialogPaneContent {
   min-height: 70px !important;
   min-width: 200px !important; 
}

.claro div.dialog div.dijitDialogPaneContent > div:first-of-type {
   margin: 30px auto;
   width: 95%;
}

.claro div.dialog div.dijitDialogPaneContent table.formDialog {
   margin: auto;
   width: 95%;
}

.claro div.dialog div.dijitDialogPaneContent table.formDialog + table.formButtons {
   margin-top: 35px;
}

.claro div.dialog div.dijitDialogPaneContent table.formDialog table.formContainer {
   margin: 10pt 0 15pt 10pt;
}

.claro div.dijitDialogUnderlayWrapper.mobile {
   width: 100%;
   height: 100%;
   position: absolute;
   top: 0px !important;
   left: 0px !important;
}

.claro div.dijitDialogUnderlayWrapper.mobile div {
   width: 100% !important;
   height: 100% !important;  
   margin: 0 auto;
   padding: 0;
}

.claro div.dijitDialog {
   border: 1px solid transparent;
   box-shadow: 5px 5px 8px rgba(0, 0, 0, 0.5);
}

.claro div.dijitDialog table.formButtons {
   margin: -15px auto auto;
}

.claro div.dijitDialog table.formButtons.non-form {
   padding-top: 40pt;
}

.claro div.dijitDialog .dijitDialogTitleBar {
   background-color: #004875;
   background-image: linear-gradient(rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.1) 100%);
   border-left: 1pt solid #759dc0;
   border-right: 1pt solid #759dc0;
   border-bottom: 1pt solid #759dc0;
   height: 25px;
   text-align: left;
}

.claro div.dijitDialog .dijitDialogTitleBar .dijitDialogTitle {
   font-size: 0.95em;
   padding-left: 5pt;
}

.claro div.dijitDialog .dijitDialogTitleBar .dijitDialogTitle .dijitIcon {
   vertical-align: middle;
   display: inline-block;
}

.claro div.dijitDialog .dijitDialogTitleBar .dijitDialogTitle .dijitTitleName {
   font-size: 110%;
   padding-top: 1pt;
   padding-left: 8pt;
   vertical-align: middle;
   color: #FFF;
}

.claro div.formResponseDialog {
   width: 400px;
}

.claro div.formDescriptionDialog,
.claro div.formIncidenceDialog {
   width: 650px;
}

.claro div.formDescriptionDialog div.dijitDialogTitleBar span.dijitLeaf {
   vertical-align: middle;
   display: inline-block;
}

.claro div.formIncidenceDialog div.dijitDialogTitleBar span.dijitIconError {
   background-color: #E29696;
   vertical-align: middle;
   display: inline-block;
}

.claro div.formIncidenceDialog div.dijitDialogPaneContent div.formContainer table.formContainer td.fieldTitle {
   padding-left: 15pt;
   vertical-align: top;
   width: 100px;
   font-size: 130%;
}

.claro div.formDescriptionDialog table.description {
   margin-top: 20pt;
}

.claro div.formDescriptionDialog table.description td.descriptionIcon {
   width: 15%;
   padding-left: 40pt;
}

.claro div.formDescriptionDialog table.description td.descriptionIcon img {
   vertical-align: middle;
}

.claro div.formDescriptionDialog table.description td.description {
   margin: auto;
   padding-right: 25pt;
   width: 50%;
   font-size: 1.4em;
}

.claro div.formIncidenceDialog div.dijitDialogPaneContent div.formContainer {
   margin: 35px 20px 20px;
   width: 90%;
}

.claro div.formDescriptionDialog div.dijitDialogPaneContent table.formButtons {
   padding-bottom: 0;
}

.claro div.formDescriptionDialog div.dijitDialogPaneContent table.formButtons,
.claro div.formIncidenceDialog div.dijitDialogPaneContent table.formButtons {
   margin-top: 40px;
}

.claro div.formResponseDialog div.dijitDialogPaneContent h3,
.claro div.formIncidenceDialog div.dijitDialogPaneContent h3 {
   margin: 10pt 0 0 20pt;
}

.claro div.formResponseDialog div.dijitDialogPaneContent div.formResponseActionBar {
   text-align: left;
   margin-top: 2pt;
}

.claro div.formResponseDialog div.dijitDialogPaneContent #statusResponse {
   color: #4D8B99;
   font-size: 11pt;
   font-weight: bold;
   padding-left: 50pt;
}

.claro div.formResponseDialog table.responseDialog {
   margin: 20pt auto;
}

.claro div.formResponseDialog table.responseDialog td span.responseDialogStatus {
   color: #4D8B99;
   font-weight: bold;
   font-size: 14pt;
   margin: 0 15pt 0 0;
}

.claro div.formDeleteDialog {
   width: 550px;
   text-align: left;
}

.claro div.errorDialog,
.claro div.formErrorDialog {
   width: 700px;
   text-align: left;
}

.claro div.errorDialog div.dijitDialogPaneContent,
.claro div.formErrorDialog div.dijitDialogPaneContent,
.claro div.formDeleteDialog div.dijitDialogPaneContent {  
   min-height: 60px;
}

.claro div.formDeleteDialog table.alertDialog,
.claro div.errorDialog table.alertDialog,
.claro div.formErrorDialog table.alertDialog {
   margin: 30px 40px 50px;
}

.claro div.formDeleteDialog div.dijitDialogTitleBar span.dijitDialogTitle {
   color: #EEE; 
   padding-left: 5pt;
}

.claro div.formDeleteDialog div.dijitDialogTitleBar span.dijitDialogTitle .dijitIconEditProperty {
   vertical-align: middle;
   padding-left: 12pt;
}

.claro div.formDeleteDialog div.dijitDialogPaneContent table.formButtons {
   margin: 25pt auto 15pt;
}

.claro div.errorDialog div.dijitDialogPaneContent table.alertDialog td span.errorDialogStatus,
.claro div.formErrorDialog div.dijitDialogPaneContent table.alertDialog td span.errorDialogStatus,
.claro div.formDeleteDialog div.dijitDialogPaneContent table.alertDialog td span.errorDialogStatus {
   max-width: 350pt;
   vertical-align: middle;
   font-size: 130%;
}

.claro div.errorDialog.dijitDialog table.formButtons,
.claro div.formErrorDialog.dijitDialog table.formButtons {
   margin: 0 auto 20px;
}

.claro div.formDeleteDialog div.dijitDialogPaneContent table.alertDialog td span.errorDialogStatus {
   font-size: 130%;
}

.claro div.errorDialog div.dijitDialogPaneContent div.errorDialogButton,
.claro div.formErrorDialog div.dijitDialogPaneContent div.formErrorDialogButton {
   text-align: right;
   margin: 15pt 10pt 8pt 0;
}

.claro div.dijitDialog table.dialogChart {
   margin: 25px auto -10px;
   width: 95%;
}

.claro div.dijitDialog table.dialogChart div.container fieldset {
   border: none;
   margin: 0 auto;
   background: none;
}

.claro div.dijitDialog table.dialogChart ~ table.formButtons {
   margin: -15px auto 15px;
}



/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------ FORM FIELDS ---------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */



.claro .dijitComboBox .dijitButtonNode {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: inherit;
    border-top-left-radius: 0;
    border-top-right-radius: inherit;
    height: 100%;
}

.claro .dijitComboBox .dijitArrowButtonInner {
    height: calc(100% - 4px) !important;
    width: calc(20px - 3px) !important;
    border: 1px solid transparent !important;
}

.claro .dijitSelect .dijitInputField, 
.claro .dijitTextBox .dijitInputField {
    height: calc(100% - 4px) !important;
}

.dj_gecko .claro .dijitTextBox .dijitInputContainer input, 
.dj_webkit .claro .dijitTextBox .dijitInputContainer input {
    /* height: calc(100% - 2px) !important; */
    height: 100% !important;
    padding-top: 2px;
}

.claro .dijitTextBoxError .dijitValidationContainer {
    height: 95%;
}





/* ------------------------------------------------------------------ BASIC FIELDS --------------------------------------------------------------- */



.claro table.formContainer .fieldInput {
    height: 25px;
    width: 205px;
    display: inline-cell;
}

.claro table.formContainer .fieldInput tbody,
.claro table.formContainer .fieldInput tr {
    border-radius: inherit;
    height: inherit;
}

.claro table.formContainer.sLpC .fieldInput {
    width: 160px;
}

.claro table.formContainer.sLpCe .fieldInput {
    width: 205px;
}

.claro div.formContainer.nEdC table.formContainer td.fieldInput {
    display: table-cell !important;
}

.claro table.formContainer table.text,
.claro table.formContainer table.select {
    border-radius: inherit;
    height: 100%;
    min-height: 25px;
    width: 100%;
}

.claro table.formContainer table.text td,
.claro table.formContainer table.select td {
    border-radius: inherit;
    height: 100%;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.claro table.formContainer .widget {
    color: #000000;
    height: 100%;
    padding-left: 3px;
    width: 100%;
    border-radius: inherit;
    box-sizing: content-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: content-box;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    .claro table.formContainer .widget {
        width: calc(100% - 5px);
    }
}

.claro table.formContainer table.select .widget.readonly {
    table-layout: fixed;
    border-collapse: separate !important;
    box-sizing: border-box;
    width: 100%;
    cursor: pointer;
}

.claro table.formContainer table.select .widget.readonly .dijitInputField,
.claro table.formContainer table.select .widget.readonly .dijitInputField input {
    cursor: pointer;
}

.claro table.formContainer table.select.nEdP .widget.readonly .dijitInputField,
.claro table.formContainer table.select.nEdP .widget.readonly .dijitInputField input {
    cursor: default !important;
}

.claro table.formContainer table.select .widget.readonly td.dijitButtonContents {
    border-top-right-radius: 0;
    border-bottom-right-radius:0;
}

.claro table.formContainer table.select .widget.readonly td.dijitButtonContents > div.dijitButtonText {
    display: table;
}

.claro table.formContainer table.select .widget.readonly td.dijitButtonContents > div.dijitButtonText > span {
    display: table-cell;
    vertical-align: middle;
    padding-top: 3px;
    padding-left: 3px;
}

.claro table.formContainer table.select .widget.readonly td.dijitArrowButton {
    width: 18px;
    border-top-left-radius: 0;
    border-bottom-left-radius:0;
}

.claro table.formContainer table.longText td .dijitTextArea {
    width: 151.5pt;
    padding: 3pt;
    font-size: 1em;
}

.claro div.container.response table.formContainer table.longText td .dijitTextArea {
    margin-left: 3px;
}

.claro table.formContainer.sLpC table.longText td .dijitTextArea {
    width: 95%;
}

.claro table.formContainer table.longTextIncidence td .dijitTextArea {
    width: 300pt;
    height: 100pt;
    font-size: 120%;
}

.claro table.formContainer td table.nEdP .dijitDisabled .dijitButtonNode {
   display: none;
}

.claro div table.nEdP .dijitDisabled,
.claro div table.nEdP .dijitTextBoxDisabled.dijitDisabled,
.claro div table.nEdP .dijitTextBoxDisabled.dijitDisabled .dijitInputContainer,
.claro div table.nEdP .dijitComboBoxDisabled.dijitDisabled .dijitArrowButtonInner,
.claro div table.nEdP .dijitComboBoxDisabled.dijitDisabled .dijitInputContainer {
   vertical-align: bottom;
   background-image: none;
   background-color: transparent;
   border: none;
}

.claro div table.nEdP .dijitSelectDisabled, 
.claro div table.nEdP .dijitSelectDisabled .dijitButtonContents, 
.claro div table.nEdP .dijitTextBoxDisabled, 
.claro div table.nEdP .dijitTextBoxDisabled .dijitButtonNode {
   border: none;
}

.claro div table.nEdP .dijitSelect .dijitInputField,
.claro div table.nEdP .dijitTextBox .dijitInputField {
   opacity: 1;
}

.claro div.formControlContainer table.nEdP .dijitTextBoxDisabled.dijitDisabled,
.claro div.formControlContainer table.nEdP .dijitTextBoxDisabled.dijitDisabled .dijitInputContainer,
.claro div.formControlContainer table.nEdP .dijitComboBoxDisabled.dijitDisabled .dijitInputContainer {
   color: #000;
   font-size: 1.25em;
}

.claro div.formControlContainer:first-of-type table.nEdP .dijitDisabled .dijitInputInner, 
.claro div.formControlContainer:first-of-type table.nEdP textarea {
   text-align: right;
}

.claro div.formControlContainer:first-of-type table.formContainer.sLpC table.nEdP .dijitDisabled .dijitInputInner,
.claro div.formControlContainer:first-of-type table.formContainer.sLpCe table.nEdP .dijitDisabled .dijitInputInner, 
.claro div.formControlContainer:first-of-type table.formContainer.sLpC table.nEdP textarea,
.claro div.formControlContainer:first-of-type table.formContainer.sLpCe table.nEdP textarea {
   text-align: left;
}

.claro div table.nEdP .dijitDisabled .dijitInputInner,
.claro div table.nEdP textarea {
   color: #000;
   font-size: 1em;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}








/* ------------------------------------------------------------ TEXT EXPRESSION FIELDS ----------------------------------------------------------- */




.claro div.formControlContainer table.formContainer td.fieldTitle ~ td.textExpression {
   padding-left: 10pt; 
}

.claro table.formContainer td.textExpression table.textExpression {
   width: 100%;
}

.claro div.container.response table.formContainer td.fieldInput.textExpression {
   border-right-color: #809DB9;
}

.claro div.container.response table.formContainer td.textExpression table.textExpression {
   padding: 15px;
}

.claro table.formContainer td.textExpression table.textExpression .error_icon {
   display: none;
}

.claro table.formContainer td.textExpression table.textExpression .error_txt {
   padding-left: 25px;
   padding-top: 15px;
   vertical-align: middle;
}

.claro table.formContainer.sLpC td.textExpression {
   width: 50%;
}

.claro div.formControlContainer table.formContainer.sLpC td.textExpression {
   width: 40%;
}

.claro table.formContainer.sLpC td.textExpression table.textExpression td {
   padding: 2pt;
}

.claro table.formContainer table.textExpression td .dijitTextArea {
   overflow: hidden;
   font-size: 8pt;
   resize: vertical;
   width: 115pt;
}






/* ---------------------------------------------------------------  EXPRESSION FIELDS ------------------------------------------------------------- */




.claro table.formContainer table.expressions {
   width: 100%;
   padding: 10pt; 
}

.claro table.formContainer.sLpC table.expressions {
   padding: 2pt 0 0;
}

.claro table.formContainer td.table.expressions td span {
   padding: 0 3px;
}







/* --------------------------------------------------------- CHECKBOX AND RADIOBUTTON FIELDS ----------------------------------------------------- */





.claro table.formContainer td.checkBox {
   vertical-align: middle;
   display: table-cell !important;
   padding: 10pt 0 10pt 10pt;
}

.claro table.formContainer.sLpC tr.nL td.checkBox,
.claro table.formContainer td.checkBox:only-child {
   padding: 15pt 0 10pt 14pt;
   vertical-align: middle;
}

.claro div.container.response table.formContainer.sLpC tr.nL td.checkBox,
.claro div.container.response table.formContainer td.checkBox:only-child {
   padding: 1px 0 0;
}

.claro div.formControlContainer table.formContainer td.checkBox {
   vertical-align: middle;
   padding-top: 5pt;
   padding-bottom: 5pt;
   padding-left: 10pt;
}

.claro table.formContainer table.radioButton {
   box-shadow: none !important;
   height: 100%;
   vertical-align: middle;
}

.claro table.formContainer table.radioButton td.radioButton ~ td.radioButton {
   padding-left: 10px;
}

.claro div.container.response table.formContainer table.radioButton td.radioButton ~ td.radioButton {
   padding-left: 3px;
}

.claro table.formContainer table.radioButton td.radioButton label {
   padding-left: 3pt;
   padding-right: 3pt;
   outline: none;
   vertical-align: middle;
}

.claro table.formContainer div.dijitCheckBox + label {
   outline: none;
}

.claro table.formContainer table.radioButton td.radioButton .dijitRadio input,
.claro table.formContainer td.checkBox .dijitCheckBox input {
   cursor: pointer;
}

.claro table.formContainer table.radioButton td.radioButton .dijitRadioDisabled input,
.claro table.formContainer td.checkBox .dijitCheckBoxDisabled input {
   cursor: default;
}

.claro table.formContainer table.radioButton td.radioButton .dijitRadio.dijitRadioDisabled input,
.claro table.formContainer td.checkBox .dijitCheckBox .input.dijitCheckBoxDisabled {
   cursor: default;
}

.claro table.formContainer table.radioButton td.radioButton .dijitRadio.dijitRadioDisabled ~ label,
.claro table.formContainer td.checkBox .dijitCheckBox.dijitCheckBoxDisabled ~ label {
   color: #b5bcc7;
}

.claro table.formContainer .dijitComboBoxMenu .dijitMenuItem {
   font-size: 1em;
}

.claro table.formContainer table.nEdP .radioButton.noChecked,
.claro table.formContainer table.nEdP .radioButton.checked .dijitRadioCheckedDisabled {
   display: none;
}

.claro table.formContainer table.nEdP .radioButton.checked label {
   padding-left: 0 !important;
   color: #000 !important;
}

.claro table.formContainer td.checkBox.nEdP {
   vertical-align: bottom;
   padding-left: 4pt !important;
}

.claro .dijitFocusedLabel { 
   outline: none; 
}

.claro .dijitPopup.dijitComboBoxMenuPopup .dijitComboBoxMenu .dijitMenuItem,
.claro .dijitPopup.dijitMenuPopup .dijitSelectMenu .dijitMenuItem td {
   padding-top: 4px;
   padding-bottom: 4px;
}

.claro .dijitPopup.dijitComboBoxMenuPopup .dijitComboBoxMenu .dijitMenuItem,
.claro .dijitPopup.dijitMenuPopup .dijitSelectMenu .dijitMenuItem .dijitMenuItemLabel,
.claro .dijitPopup.dijitMenuPopup .dijitMenuTable .dijitMenuItem .dijitMenuItemLabel {
   font-size: 120%;
   padding-left: 5px;
}

.claro table.formContainer .dijitSelectFocused .dijitArrowButton {
    background-color: #efefef;
    background-image: linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
    background-repeat: repeat-x;
}

.claro .dijitPopup.dijitMenuPopup .dijitMenuSeparator:first-child {
    display: none;
}

.claro .dijitPopup.dijitMenuPopup .dijitMenuSeparator td {
    border: 0 none;
    padding-left: 10px;
    width: 85%;
}

.claro .dijitPopup.dijitMenuPopup .dijitSelectMenu .dijitMenuSeparatorTop {
    border-bottom: 1px solid #b5bcc7;
}

.claro .dijitPopup.dijitMenuPopup .dijitSelectMenu .dijitMenuSeparatorLabelCell {
    visibility: hidden;
}

.claro .dijitPopup.dijitMenuPopup .dijitMenuSeparatorTop {
    border-bottom: 1px solid #b5bcc7;
    height: auto;
    margin-top: 20px;
}

.claro .dijitPopup.dijitMenuPopup .dijitMenuSeparatorBottom {
    height: auto;
    margin-bottom: 20px;
}

.claro .dijitPopup .dijitMenu .dijitMenuItem i.title {
    color: #222;
    font-size: 95%;
}


/* --------------------------------------------------- FORMATTED / FORMATTED EXPRESSION FIELDS --------------------------------------------------- */




.claro table.formContainer .widget.dijitEditor,
.claro table.formContainer .formatted.dijitEditor {
    border: 1px solid #B5BCC7;
    margin: auto;
    padding: 0;
    width: 100%;
    min-height: 200px;
}

.claro table.formContainer .widget.dijitEditor.dijitEditorError {
    border: 1px solid #ce5050;
}

.claro table.formContainer .widget.dijitEditor div.dijitToolbar {
   max-height: 25px;
   overflow-y: hidden;
}

.claro table.formContainer .widget.dijitEditor.dijitEditorError div.dijitToolbar {
   border-bottom: 1px solid #ce5050;
}

.claro table.formContainer.sLpC .widget.dijitEditor,
.claro table.formContainer.sLpC .formatted.dijitEditor {
    width: 100%;
}

.claro table.formContainer .dijitEditor .dijitEditorIFrameContainer {
    height: calc(100% - 35px);
}

.claro table.formContainer .dijitEditor.dijitEditorDisabled .dijitEditorIFrameContainer {
    height: 200px; 
}

.claro table.formContainer .widget.dijitEditor .dijitEditorIFrameContainer .dijitEditorIFrame {
   height: 100% !important; 
}

.claro table.formContainer > tbody > tr > td.editor {
   padding: 5pt 5pt 10pt;
}

.claro div.container.response table.formContainer > tbody > tr > td.editor {
   border-color: #e1eef4;
   padding: 15px;
}

.claro table.formContainer.sLpC td.editor,
.claro table.formContainer.sLpCe td.editor {
   width: 50%;
}

.claro table.formContainer.sLpCe td.editor {
   padding: 0 5pt;
}

.claro table.formContainer.sLpCe td.editor td.editor {
   padding: 0 0 4px;
}

.claro table.formContainer td.editor table {
   margin: auto;
   width: 100%;
}

.claro table.formContainer td.fieldTitle.editor {
   padding: 0 2pt;
}

.claro table.formContainer td.editor table .dijitEditor.formatted .dijitToolbar {
   display: none;
}

.claro table.formContainer td.editor table .dijitEditor.formatted .dijitEditorIFrame, 
.claro table.formContainer td.editor table .dijitEditor.formatted .dijitEditorIFrameContainer, 
.claro table.formContainer td.editor table .dijitEditor.formatted .dijitEditorIFrameContainer .dijitEditorIFrame {
   background-color: white;
   height: 195px !important;
}

.claro table.formContainer td.editor table .dijitEditor.formatted html body,
   font-size: 0.85em !important;
}

.claro table.formContainer td.editor table .dijitEditor.formatted .dijitEditorIFrame b {
   display: inline-block;
   width: 100pt;
}

.claro table.formContainer td.formattedExpression {
   min-width: 260px;
   padding-top: 5px;
}

.claro table.formContainer.sLpC td.button ~ td.formattedExpression {
   width: 100% !important; 
}

.claro table.formContainer tr.nL + tr.nLF > td.fieldInput.editor {
   padding-top: 15px;
}

.claro div.formContainer.nEdC table.formContainer td.formattedExpression:empty {
   display: none;
   height: 0;
   padding: 0;
}

.claro table.formContainer tr.nL + tr.nLF td.fieldTitle + td.formattedExpression {
   padding-top: 5px;
}

.claro table.formContainer tr.nL + tr.nLF td.formattedExpression {
   padding-top: 30px;
   height: 100%;
}

.claro div.formContainer.nEdC table.formContainer td.formattedExpression {
   padding: 0;
}

.claro div.container.response div.formContainer.nEdC table.formContainer td.formattedExpression {
   padding: 30px; 
   border-color: #e1eef4;
}

.claro div.formContainer.nEdC table.formContainer td.formattedExpression.chart {
   padding: 0! important;
}

.claro table.formControlContainer td.formattedExpression {
   padding: 0 !important;
}

.claro table.formContainer td.formattedExpression table.resume {
   width: 100%;
   border-collapse: collapse;
   border: none !important;
   table-layout: fixed;
}

.claro table.formContainer td.formattedExpression table.resume tr.nL:nth-child(odd) {
   background-color: #FFFFFF;
   background-repeat: no-repeat;
}

.claro table.formContainer td.formattedExpression table.resume tr.nL:first-child td,
.claro table.formContainer td.formattedExpression table.resume tr.nL:first-child td table td.units {
   border-top: none;
   width: 22%;
}

.claro table.formContainer td.formattedExpression table.resume tr.nL:nth-child(even) {
   background-color: #E1EEF4;
   background-repeat: no-repeat;
}

.claro table.formContainer td.formattedExpression table.resume td.fieldTitle.resume + td {
  width: 33%;
}

.claro div.formControlContainer td.formattedExpression {
   vertical-align: middle;
   color: #000;
   text-align: justify;
   outline: none;
   padding: 0 20pt !important;
}

.claro div.formControlContainer div.formattedExpression b {
   display: inline-block;
   width: 100pt;
   color: #585A4D;
}

.claro div.formControlContainer td.formattedExpression p {
   margin: 0.25em !important;
   color: black;
}

.claro div.formControlContainer td.formattedExpression b + span {
   width: 110pt;
   display: inline-block;
}

.claro div.formControlContainer #status_resume {
   text-align: right;
   padding: 0;
}

.claro div.formControlContainer td.formattedExpression i.status,
.claro div.formControlContainer td.formattedExpression i.status_warning {
   display: inline-block;
   font-size: 10pt;
   font-weight: bold;
   padding: 2pt 0 2pt 10pt;
   font-style: normal;
}

.claro div.formControlContainer td.formattedExpression i.status_warning {
   color: red;
}

.claro div.formControlContainer td.formattedExpression i.status span,
.claro div.formControlContainer td.formattedExpression i.status_warning span {
   font-weight: normal;
}

.claro div.formControlContainer td.formattedExpression i.status + img,
.claro div.formControlContainer td.formattedExpression i.status_warning + img {
   margin: 0 !important;
   padding-left: 15pt;
}

.claro div.container.response td.formattedExpression i.status + img,
.claro div.container.response td.formattedExpression i.status_warning + img {
   margin: 0 !important;
   padding-lefT: 20pt;
}

.claro div.formControlContainer td.formattedExpression i.warning {
   display: inline-block;
   font-size: 9pt;
   color: red;
   padding: 3pt 0 0 0;
}

.claro div.formControlContainer td.formattedExpression img {
   float: right;
   display: inline-block; 
   margin: 0 10pt 0 0;
   padding: 0;
   padding: 0;
}






/* ----------------------------------------------------------------- BUTTON FIELDS --------------------------------------------------------------- */



.claro table.formContainer tr.nLBc table td.button {
   padding-left: 5pt;
}

.claro table.formContainer tr.nLBc table td.buttonPL,
.claro table.formContainer tr.nLBc table td.button.dropDown + td.buttonPL {
   vertical-align: middle;
   padding: 3pt 20pt 0 5pt;
}

.claro table td.button .dijitButton .dijitButtonNode, 
.claro table td.button .dijitDropDownButton .dijitButtonNode, 
.claro table td.button .dijitComboButton .dijitButtonNode, 
.claro table td.button .dijitToggleButton .dijitButtonNode {
   background: -moz-linear-gradient(top, rgba(255,255,255,1) 0px, rgba(255,255,255,0) 1px, rgba(255,255,255,0.75) 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0px,rgba(255,255,255,1)), color-stop(1px,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,0.75)));
   background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%);
   background: -o-linear-gradient(top, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%);
   background: -ms-linear-gradient(top, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%);
   background: linear-gradient(to bottom, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#bfffffff',GradientType=0 );
   background-color: #EFEFEF;
   font-size: 1.1em;
   height: 15pt;
}

.claro table td.button .dijitButton.dijitButtonHover .dijitButtonNode, 
.claro table td.button .dijitDropDownButton.dijitDropDownButtonHover .dijitButtonNode, 
.claro table td.button .dijitComboButton.dijitComboButtonHover .dijitButtonNode, 
.claro table td.button .dijitToggleButton.dijitToogleButtonHover .dijitButtonNode {
   background-color: #ABD6FF;
   transition-duration: 0.25s;
   -webkit-transition-duration: 0.25s;
}




/* ------------------------------------------------------------------ CHART FIELDS --------------------------------------------------------------- */



.claro td.formattedExpression.chart {
   padding-top: 40px !important;
   width: auto !important;
}

.claro div.dialog td.formattedExpression.chart {
   height: 340px !important;
}

.claro td.formattedExpression.chart div.chartNode {
   margin: 0 auto;
   height: 350px !important;
}

.claro td.formattedExpression.chart div.fieldChart.chartNode.activeChart {
   opacity: 0;
} 

.claro td.formattedExpression.chart div.fieldChart.chartNode.inactiveChart {
   visibility: hidden; 
} 

.claro td.formattedExpression.chart div.chartWarning {
   color: #3176BB;
   font-size: 1.1em;
   font-style: italic;
   font-weight: bold;
   text-align: center;
}

.claro td.formattedExpression.chart div.chartWarning > div {
   padding-top: 50pt;
}

.claro td.formattedExpression.chart div.chartWarning.activeChartWarning {
   opacity: 0;
} 

.claro td.formattedExpression.chart div.chartWarning.inactiveChartWarning {
   visibility: hidden;
} 

.claro td.formattedExpression.chart div.chartWarning.activeChartWarning ~ div.chartNode.inactiveChart {
   height: 263px !important;
} 

.claro td.formattedExpression table.dojoxLegendNode,
.claro td.formattedExpression.chart div.chartLegend {
   height: 28px !important;
}

.claro table.dialog td.formattedExpression.chart {
   width: 800px !important;
   padding-top: 40px !important;
   padding-bottom: 40px !important;
} 

.claro table.dialog td.formattedExpression.chart.inactiveChart {
   min-height: 0 !important;
   height: 0 !important;
   padding-top: 0 !important;
   padding: 0 !important;
   display: none;
}

.claro table.dialog td.formattedExpression.chart div.chartNode {
   height: 300px !important;
}

.claro table.dialog td.formattedExpression.chart div.chartNode.activeChart,
.claro table.dialog td.formattedExpression.chart div.chartLegend.activeChart {
   box-shadow: none !important;
   visibility: visible;
}

.claro table.dialog td.formattedExpression.chart div.chartNode.inactiveChart,
.claro table.dialog td.formattedExpression.chart div.chartLegend.inactiveChart {
   box-shadow: none !important;
   visibility: hidden;
}

.claro td.formattedExpression.chart table.calendar {
   margin: -20px auto 50px auto;
}

.claro td.formattedExpression.chart table.calendar .dijitCalendarDisabledDate {
   background-color: yellow !important;
   text-decoration: none;
}

.claro td.formattedExpression.chart table.calendar .dijitCalendarDisabledDate .dijitCalendarDateLabel {
   text-decoration: none;
   color: red;
}

.claro td.formattedExpression.chart table.calendar tr.dijitCalendarWeekTemplate td:first-child,
.claro td.formattedExpression.chart table.calendar tr.dijitCalendarWeekTemplate td:last-child {
   background-color: #FFF;
   color: red;
}








/* ----------------------------------------------------- OPTIONS MULTIPLE NON-EDITABLE FIELDS ---------------------------------------------------- */






.claro table.formContainer table.mSelect table.mSelectWidget {
    table-layout: fixed;
    border: 1px solid #B5BCC7;
    height: 100%;
    width: 100%;
}

.claro table.formContainer table.mSelect table.mSelectWidget td.mSelectInput {
    height: 100%;
    width: calc(100% - 20px);
}

.claro table.formContainer table.mSelect table.mSelectWidget.widgetHovered {
    border: 1px solid #769DC0;
}

.claro table.formContainer table.mSelect table.mSelectWidget.disabled {
    border: 1px solid #D3D3D3;
}

.claro table.formContainer table.mSelect.nEdP table.mSelectWidget {
    border: none;
}

.claro table.formContainer table.mSelect .dojoxCheckedMultiSelect .dojoxCheckedMultiSelectWrapper {
    border: 1px solid #759DC0;
    margin: 0 0 0 -1px;
    overflow: auto;
    padding-top: 2pt;
    position: absolute;
    width: 100%;
    max-width: 203px;
}

.claro table.formContainer table.mSelect .dojoxCheckedMultiSelect .dojoxCheckedMultiSelectWrapper .dijitCheckBox input {
    cursor: pointer;
}

.claro table.formContainer table.mSelect table.mSelectWidget div.mSelectBox {
    display: none;
    z-index: 9999;
}

.claro table.formContainer table.mSelect table.mSelectWidget div.mSelectData {
    cursor: pointer;
    height: calc(100% - 4px);
    overflow: hidden;
    padding: 4px 4px 0;
    transition: background-color 0.2s ease-in-out 0s;
    width: calc(100% - 8px);
    text-overflow: ellipsis;
    white-space: nowrap;
    background-color: #FFF;
}

.claro table.formContainer table.mSelect.nEdP table.mSelectWidget div.mSelectData {
    background-color: transparent;
}

.claro table.formContainer table.mSelect table.mSelectWidget.widgetHovered div.mSelectData {
    background-color: #E5F2FE;
}

.claro table.formContainer table.mSelect table.mSelectWidget.widgetHovered.widgetBoxOpen div.mSelectData {
    background-color: #FFF;
}

.claro table.formContainer table.mSelect table.mSelectWidget.disabled div.mSelectData {
    background-color: #EFEFEF;
    cursor: default;
    color: #818181;
}

.claro table.formContainer table.mSelect.nEdP table.mSelectWidget .dijitTextBoxDisabled.dijitDisabled,
.claro table.formContainer table.mSelect.nEdP table.mSelectWidget .dijitTextBoxDisabled.dijitDisabled .dijitInputContainer {
   font-size: 8pt;
   vertical-align: bottom;
   background-image: none;
   background-color: transparent;
   border: none;
}

.claro table.formContainer table.mSelect table.mSelectWidget td.mSelectButton {
    padding: 0;
    margin: 0;
    border-left: 1px solid #B5BCC7;
    height: 100%;
    width: 20px;
}

.claro table.formContainer table.mSelect table.mSelectWidget.disabled td.mSelectButton {
    border-left: 1px solid #D3D3D3;
}

.claro table.formContainer table.mSelect table.mSelectWidget.widgetHovered td.mSelectButton {
    border-left: 1px solid #769DC0;
}

.claro table.formContainer table.mSelect.nEdP table.mSelectWidget td.mSelectButton {
    display: none;
}

.claro table.formContainer table.mSelect table.mSelectWidget td.mSelectButton div {
    background: -moz-linear-gradient(top, rgba(255,255,255,1) 0px, rgba(255,255,255,0) 1px, rgba(255,255,255,0.75) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0px,rgba(255,255,255,1)), color-stop(1px,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,0.75)));
    background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%);
    background: -o-linear-gradient(top, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%);
    background: -ms-linear-gradient(top, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#bfffffff',GradientType=0 );
    background-color: #EFEFEF;
    transition: background-color 0.2s ease-in-out 0s;
    width: 100%;
    height: 100%;
}

.claro table.formContainer table.mSelect table.mSelectWidget.disabled td.mSelectButton div {
    background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 10%); 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(10%,rgba(255,255,255,0))); 
    background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 10%); 
    background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 10%); 
    background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 10%); 
    background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 10%); 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 ); 
    background-color: #EFEFEF;
}

.claro table.formContainer table.mSelect table.mSelectWidget td.mSelectButton div.buttonHovered {
    background-color: #ABD6FF;
}

.claro table.formContainer table.mSelect table.mSelectWidget td.mSelectButton div ._mSelectButton {
    background-image: url("http://ajax.googleapis.com/ajax/libs/dojo/1.8/dijit/themes/claro/form/images/commonFormArrows.png");
    background-position: -34px 50%;
    background-repeat: no-repeat;
    margin: 0;
    width: 100%;
    height: 100%;
}

.claro table.formContainer table.mSelect table.mSelectWidget td.mSelectButton div ._mSelectButton._mSelectButtonHover {
    background-position: -69px 50%;
}

.claro table.formContainer table.mSelect table.mSelectWidget.disabled td.mSelectButton div ._mSelectButton {
    background-position: 1px 50%;
}

.claro table.formContainer table.mSelect .dijitCheckBox, 
.claro table.formContainer table.mSelect .dijitCheckBoxIcon {
    margin: 0 5px 0 3px;
}

.claro table.formContainer table.mSelect .dijitButtonNode {
    border: none;
    width: 100%;
    height: 100%;
}

.claro table.formContainer table.mSelect .dijitButtonNode .dijitButtonContents {
    height: 100%;
}

.claro table.formContainer .dojoxCheckedMultiSelectHidden{
   display: none;
}

.claro table.formContainer .dojoxCheckedMultiSelect .dojoxCheckedMultiSelectWrapper {
   border: solid black 1px;
   margin: 1px 0;
   overflow: scroll; 
   overflow-y: scroll; 
   overflow-x: hidden; 
   height: 120px;	
   z-index: 9999;
}

.claro table.formContainer .dj_ie .dojoxCheckedMultiSelectWrapper,
.claro table.formContainer .dj_webkit .dojoxCheckedMultiSelectWrapper {	
   padding-right: 15px;
}

.claro table.formContainer .dojoxMultiSelectItem {
   cursor: default;
   padding: 0.1em 0.2em;
   white-space: nowrap;
}

.claro table.formContainer .dojoxCheckedMultiSelectItem {
   white-space: nowrap;
   padding: .1em .2em;
   cursor: default;
}

.claro table.formContainer .dojoxCheckedMultiSelectDisabled *,
.claro table.formContainer .dojoxCheckedMultiSelectReadOnly * {
   color: gray !important;
}

.claro table.formContainer .dojoxCheckedMultiSelectItemLabel {
   margin-left: .2em;
}

.claro table.formContainer .dojoxCheckedMultiSelect .dojoxCheckedMultiSelectWrapper {
   margin: 0em 0.1em;
}

.claro table.formContainer .dojoxCheckedMultiSelectCheckBoxInput {
   opacity: 0.01;
}

.claro table.formContainer .dj_ie .dojoxCheckedMultiSelectCheckBoxInput {
   filter: alpha(opacity=0);
   width: 15px;
   height: 16px;
}

.claro table.formContainer .dijit_a11y .dojoxCheckedMultiSelectCheckBoxInput {
   opacity: 1;
   filter: none;
}

.claro table.formContainer .dojoxCheckedMultiSelectMenu td.dijitMenuArrowCell {
   display: none;
}

.claro table.formContainer .dojoxCheckedMultiSelectMenu td.dijitMenuItemLabel {
   position: static;
   padding: 2px;
}

.claro table.formContainer .dojoxCheckedMultiSelect .dojoxCheckedMultiSelectWrapper {
   border: 1px solid #b5bcc7;
   background-color: #f7fcff;
   line-height: normal;
   -webkit-transition-property:background-color, border;
   -webkit-transition-duration:.35s;
}

.claro table.formContainer .dojoxCheckedMultiSelectHover .dojoxCheckedMultiSelectWrapper {
   border-color: #769dc0;
   background-color: #e9f4fe;
   background-image: none;
   background-repeat: repeat-x;
   -webkit-transition-duration:.25s;
}

.claro table.formContainer .dojoxCheckedMultiSelectFocused .dojoxCheckedMultiSelectWrapper {
   border: 1px solid #769dc0;
   -webkit-transition-duration:.1s;
}

.claro table.formContainer .dojoxCheckedMultiSelectMenuCheckBoxItemIcon {
   background-image: url('../../../dijit/themes/claro/form/images/checkboxRadioButtonStates.png');
   background-repeat: no-repeat;
   background-position: -15px;
   width: 15px;
   height: 16px;
}

.claro table.formContainer .dojoxCheckedMultiSelectMenuRadioItemIcon {
   background-image: url('../../../dijit/themes/claro/form/images/checkboxRadioButtonStates.png');
   background-repeat: no-repeat;
   background-position: -105px;
   width: 15px;
   height: 16px;
}

.claro table.formContainer .dj_ie6 .claro .dojoxCheckedMultiSelectMenuItemIcon {
   background-image: url('../../../dijit/themes/claro/form/images/checkboxRadioButtonStates.png');
}

.claro table.formContainer .dojoxCheckedMultiSelectMenuItemChecked .dojoxCheckedMultiSelectMenuCheckBoxItemIcon {
   background-position: 0;
}

.claro table.formContainer .dojoxCheckedMultiSelectMenuItemChecked .dojoxCheckedMultiSelectMenuRadioItemIcon {
   background-position: -90px;
}

.claro table.formContainer .dojoxCheckedMultiSelect .dojoxCheckedMultiSelectButton .dijitButtonText {
   padding: 2px;
}

.claro table.formContainer .dojoxCheckedMultiSelectButton {
   border: 1px solid #b5bcc7;
   background-color: #ffffff;
   border-collapse: separate;
}

.claro table.formContainer .dojoxCheckedMultiSelect .dijitButtonNode {
   border: 0 solid #b5bcc7;
   border-width: 0 0 0 0;
}

.dj_ie6 fieldset .claro .dojoxCheckedMultiSelectButton, .dj_ie6 .claro .dojoxCheckedMultiSelect .dojoxCheckedMultiSelectButton .dijitButtonNode {
   background-image: none;
}

.claro table.formContainer .dojoxCheckedMultiSelectButton .dijitButtonContents {
   border: 0 solid #b5bcc7;
   border-right-width: 1px;
}

.claro table.formContainer .dojoxCheckedMultiSelectButton .dijitArrowButton {
   padding: 0;
   border: 1px solid #ffffff;
   border-top: none;
   background-color: #efefef;
   background-image: url("../../../dijit/themes/claro/form/images/formHighlight.png");
   background-repeat: repeat-x;
}

.claro table.formContainer .dojoxCheckedMultiSelectButton .dijitArrowButton .dijitArrowButtonInner {
   background-image: url("../../../dijit/themes/claro/form/images/commonFormArrows.png");
   background-position: -35px;
   background-repeat: no-repeat;
   width: 16px;
   height: 16px;
}
.claro table.formContainer .dojoxCheckedMultiSelectButtonHover {
   border: 1px solid #769dc0;
   background-color: #e9f4fe;
   background-image: none;
   background-repeat: repeat-x;
}

.claro table.formContainer .dojoxCheckedMultiSelectButtonHover .dijitButtonContents {
   border-color: #769dc0;
}

.claro table.formContainer .dojoxCheckedMultiSelectButtonHover .dijitArrowButton {
   background-color: #abd6ff;
}

.claro table.formContainer .dojoxCheckedMultiSelectButtonHover .dijitArrowButton .dijitArrowButtonInner {
   background-position: -70px ;
}

.claro table.formContainer .dojoxCheckedMultiSelectButtonFocused {
   border: 1px solid #769dc0;
}

.claro table.formContainer .dojoxCheckedMultiSelectButtonFocused .dijitButtonContents {
   border-color: #769dc0;
}

.claro table.formContainer .dojoxCheckedMultiSelectButtonFocused .dijitArrowButton {
   background-color: #7dbefa;
   background-position: 0 -177px;
   border: none;
   padding: 0 1px;
}

.claro table.formContainer .dojoxCheckedMultiSelectButtonFocused .dijitArrowButton .dijitArrowButtonInner {
   background-position: -70px;
   margin-bottom: 1px;
}

.claro table.formContainer .dojoxCheckedMultiSelectButtonDisabled {
   border: 1px solid #d3d3d3;
   background-color: #efefef;
   background-image: none;
   color: #818181;
}

.claro table.formContainer .dojoxCheckedMultiSelectButtonDisabled .dijitArrowButton {
   background-color: #efefef;
}

.claro table.formContainer .dojoxCheckedMultiSelectButtonDisabled .dijitArrowButton .dijitArrowButtonInner {
   background-position: 0;
}





/* ---------------------------------------------------------- FILE, DATE AND TIME FIELDS --------------------------------------------------------- */



.claro table.formContainer table.file,
.claro table.formContainer table.date,
.claro table.formContainer table.time {
   border-radius: inherit;
   height: 100%;
   min-height: 25px;
   width: 100%;
}

.claro table.formContainer table.file.fileSignature {
   height: 50%;
   margin-top: 28px;
}

.claro table.formContainer table.file td,
.claro table.formContainer table.date td,
.claro table.formContainer table.time td {
   border-radius: inherit;
   height: 100%;
   width: 100%;
}

.claro table.formContainer table.file table.fileWidget,
.claro table.formContainer table.file table.fileWidgetDisabled,
.claro table.formContainer table.date table.dateWidget,
.claro table.formContainer table.time table.timeWidget {
   border: 1px solid #B5BCC7;
   border-radius: inherit;
   height: 100%;
   min-height: 25px;
   width: 100%;
}

.claro table.formContainer table.date table.dateWidget.invalid,
.claro table.formContainer table.time table.timeWidget.invalid {
   border: 1px solid #d46464;
}

.claro div.nEdC table.formContainer table.file {
   width: 225px !important;
   margin: 3px 5px;
}

.claro div.nEdC table.formContainer.sLpC table.file {
   width: 160px !important;
}

.claro table.formContainer table.file td.fileInput,
.claro table.formContainer table.date td.dateInput,
.claro table.formContainer table.time td.timeInput {
   border-bottom-left-radius: inherit;
   border-bottom-right-radius: 0;
   border-top-left-radius: inherit;
   border-top-right-radius: 0;
   height: 100%;
   width: 80%;
}

.claro table.formContainer table.date table.dateWidget .widget.dijitDateTextBox,
.claro table.formContainer table.date table.dateWidgetDisabled .widget.dijitDateTextBox,
.claro table.formContainer table.time table.timeWidget .widget.dijitTimeTextBox,
.claro table.formContainer table.time table.timeWidgetDisabled .widget.dijitTimeTextBox {
   border-bottom-left-radius: inherit;
   border-bottom-right-radius: 0;
   border-top-left-radius: inherit;
   border-top-right-radius: 0;
   height: 100%;
   width: 100%;
   border: none !important;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    .claro table.formContainer table.date table.dateWidget .widget.dijitDateTextBox,
    .claro table.formContainer table.date table.dateWidgetDisabled .widget.dijitDateTextBox,
    .claro table.formContainer table.time table.timeWidget .widget.dijitTimeTextBox,
    .claro table.formContainer table.time table.timeWidgetDisabled .widget.dijitTimeTextBox {
       width: 97%;
    }
}

.claro table.formContainer table.file table.fileWidget.widgetHovered,
.claro table.formContainer table.file table.fileWidgetDisabled.nEdP.widgetHovered,
.claro table.formContainer table.date table.dateWidget.widgetHovered,
.claro table.formContainer table.time table.timeWidget.widgetHovered {
   border: 1px solid #769DC0;
}

.claro table.formContainer table.file table.fileWidgetDisabled,
.claro table.formContainer table.date table.dateWidgetDisabled,
.claro table.formContainer table.time table.timeWidgetDisabled {
   border: 1px solid #D3D3D3;
}

.claro table.formContainer table.date table.dateWidgetDisabled.nEdP,
.claro table.formContainer table.time table.timeWidgetDisabled.nEdP {
   border: none !important;
}

.claro table.formContainer table.file table.fileWidgetDisabled.nEdP td.fileInput .dijitTextBoxDisabled.dijitDisabled,
.claro table.formContainer table.file table.fileWidgetDisabled.nEdP td.fileInput .dijitTextBoxDisabled.dijitDisabled .dijitInputContainer,
.claro table.formContainer table.date table.dateWidgetDisabled.nEdP td.dateInput .dijitTextBoxDisabled.dijitDisabled,
.claro table.formContainer table.date table.dateWidgetDisabled.nEdP td.dateInput .dijitTextBoxDisabled.dijitDisabled .dijitInputContainer,
.claro table.formContainer table.time table.timeWidgetDisabled.nEdP td.timeInput .dijitTextBoxDisabled.dijitDisabled,
.claro table.formContainer table.time table.timeWidgetDisabled.nEdP td.timeInput .dijitTextBoxDisabled.dijitDisabled .dijitInputContainer {
   font-size: 8pt;
   vertical-align: bottom;
   background-image: none;
   background-color: transparent;
   border: none;
}

.claro table.formContainer table.file table.fileWidgetDisabled.nEdP td.dateInput .dijitFileTextBoxDisabled.dijitDisabled .dijitInputInner,
.claro table.formContainer table.date table.dateWidgetDisabled.nEdP td.dateInput .dijitDateTextBoxDisabled.dijitDisabled .dijitInputInner,
.claro table.formContainer table.time table.timeWidgetDisabled.nEdP td.timeInput .dijitTimeTextBoxDisabled.dijitDisabled .dijitInputInner {
   color: #000 !important;
}

.claro table.formContainer table.file .dijitComboBox .dijitButtonNode,
.claro table.formContainer table.date .dijitComboBox .dijitButtonNode,
.claro table.formContainer table.time .dijitComboBox .dijitButtonNode {
   display: none;
}

.claro table.formContainer table.file table.fileWidget td.fileButton,
.claro table.formContainer table.file table.fileWidgetDisabled td.fileButton,
.claro table.formContainer table.date table.dateWidget td.dateButton,
.claro table.formContainer table.time table.timeWidget td.timeButton {
   height: 100%;
   border-left: 1px solid #B5BCC7;
   border-bottom-left-radius: 0;
   border-bottom-right-radius: inherit;
   border-left: 1px solid #B5BCC7;
   border-top-left-radius: 0;
   border-top-right-radius: inherit;
}

.claro table.formContainer table.file table.fileWidgetDisabled td.fileButton,
.claro table.formContainer table.date table.dateWidgetDisabled td.dateButton,
.claro table.formContainer table.time table.timeWidgetDisabled td.timeButton {
   border-left: 1px solid #D3D3D3;
}

.claro table.formContainer table.file table.fileWidget.widgetHovered td.fileButton,
.claro table.formContainer table.file table.fileWidgetDisabled.nEdP.widgetHovered td.fileButton,
.claro table.formContainer table.date table.dateWidget.widgetHovered td.dateButton,
.claro table.formContainer table.time table.timeWidget.widgetHovered td.timeButton {
   border-left: 1px solid #769DC0;
}

.claro table.formContainer table.date table.dateWidgetDisabled.nEdP td.dateButton,
.claro table.formContainer table.time table.timeWidgetDisabled.nEdP td.timeButton {
   display: none;
}

.claro table.formContainer div.nEdC table.formContainer table.date table.dateWidgetDisabled td.dateButton,
.claro table.formContainer div.nEdC table.formContainer table.time table.timeWidgetDisabled td.timeButton {
   border-left: none;
}

.claro table.formContainer table.file td.fileButton .dijitToggleButton, 
.claro table.formContainer table.file td.fileButton .dijitButton, 
.claro table.formContainer table.file td.fileButton .dijitDropDownButton, 
.claro table.formContainer table.file td.fileButton .dijitComboButton,
.claro table.formContainer table.date td.dateButton .dijitToggleButton, 
.claro table.formContainer table.date td.dateButton .dijitButton, 
.claro table.formContainer table.date td.dateButton .dijitDropDownButton, 
.claro table.formContainer table.date td.dateButton .dijitComboButton,
.claro table.formContainer table.time td.timeButton .dijitToggleButton, 
.claro table.formContainer table.time td.timeButton .dijitButton, 
.claro table.formContainer table.time td.timeButton .dijitDropDownButton, 
.claro table.formContainer table.time td.timeButton .dijitComboButton {
   border-radius: inherit;
   margin: 0 !important;
   height: 100%;
   width: 100%;
   display: block;
}

.claro table.formContainer table.date td.dateInput .dijitComboBox .dijitArrowButtonInner,
.claro table.formContainer table.time td.timeInput .dijitComboBox .dijitArrowButtonInner {
   display: none !important;
}

.claro table.formContainer .dijitComboBox .dijitHasDropDownOpen {
   display: none !important;
}

.claro table.formContainer table.file td.fileButton .dijitDropDownButton .dijitButtonNode,
.claro table.formContainer table.date td.dateButton .dijitDropDownButton .dijitButtonNode,
.claro table.formContainer table.time td.timeButton .dijitDropDownButton .dijitButtonNode {
   background-color: #EFEFEF;
   border-color: rgba(0, 0, 0, 0);
   border-radius: 0 0 0 0;
   border-style: none none none none;
   box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}

.claro table.file table.fileWidget td.fileButton .dijitButton .dijitButtonNode, 
.claro table.file table.fileWidget td.fileButton .dijitDropDownButton .dijitButtonNode, 
.claro table.file table.fileWidget td.fileButton .dijitComboButton .dijitButtonNode, 
.claro table.file table.fileWidget td.fileButton .dijitToggleButton .dijitButtonNode,
.claro table.file table.fileWidgetDisabled td.fileButton .dijitButton .dijitButtonNode, 
.claro table.file table.fileWidgetDisabled td.fileButton .dijitDropDownButton .dijitButtonNode, 
.claro table.file table.fileWidgetDisabled td.fileButton .dijitComboButton .dijitButtonNode, 
.claro table.file table.fileWidgetDisabled td.fileButton .dijitToggleButton .dijitButtonNode,
.claro table.date table.dateWidget td.dateButton .dijitButton .dijitButtonNode, 
.claro table.date table.dateWidget td.dateButton .dijitDropDownButton .dijitButtonNode, 
.claro table.date table.dateWidget td.dateButton .dijitComboButton .dijitButtonNode, 
.claro table.date table.dateWidget td.dateButton .dijitToggleButton .dijitButtonNode,
.claro table.time table.timeWidget td.timeButton .dijitButton .dijitButtonNode, 
.claro table.time table.timeWidget td.timeButton .dijitDropDownButton .dijitButtonNode, 
.claro table.time table.timeWidget td.timeButton .dijitComboButton .dijitButtonNode, 
.claro table.time table.timeWidget td.timeButton .dijitToggleButton .dijitButtonNode {
   border-radius: inherit;
   padding: 0 !important;
   background: -moz-linear-gradient(top, rgba(255,255,255,1) 0px, rgba(255,255,255,0) 1px, rgba(255,255,255,0.75) 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0px,rgba(255,255,255,1)), color-stop(1px,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,0.75)));
   background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%);
   background: -o-linear-gradient(top, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%);
   background: -ms-linear-gradient(top, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%);
   background: linear-gradient(to bottom, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#bfffffff',GradientType=0 );
   background-color: #EFEFEF;
   height: 100%;
   width: 100%;
}

.claro table.file table.fileWidget td.fileButton .dijitButton .dijitButtonNode span, 
.claro table.file table.fileWidget td.fileButton .dijitDropDownButton .dijitButtonNode span, 
.claro table.file table.fileWidget td.fileButton .dijitComboButton .dijitButtonNode span, 
.claro table.file table.fileWidget td.fileButton .dijitToggleButton .dijitButtonNode span,
.claro table.file table.fileWidgetDisabled td.fileButton .dijitButton .dijitButtonNode span, 
.claro table.file table.fileWidgetDisabled td.fileButton .dijitDropDownButton .dijitButtonNode span, 
.claro table.file table.fileWidgetDisabled td.fileButton .dijitComboButton .dijitButtonNode span, 
.claro table.file table.fileWidgetDisabled td.fileButton .dijitToggleButton .dijitButtonNode span,
.claro table.date table.dateWidget td.dateButton .dijitButton .dijitButtonNode span, 
.claro table.date table.dateWidget td.dateButton .dijitDropDownButton .dijitButtonNode span, 
.claro table.date table.dateWidget td.dateButton .dijitComboButton .dijitButtonNode span, 
.claro table.date table.dateWidget td.dateButton .dijitToggleButton .dijitButtonNode span,
.claro table.time table.timeWidget td.timeButton .dijitButton .dijitButtonNode span, 
.claro table.time table.timeWidget td.timeButton .dijitDropDownButton .dijitButtonNode span, 
.claro table.time table.timeWidget td.timeButton .dijitComboButton .dijitButtonNode span, 
.claro table.time table.timeWidget td.timeButton .dijitToggleButton .dijitButtonNode span {
   height: 100%;
}

.claro table.file table.fileWidgetDisabled td.fileButton .dijitButton .dijitButtonNode, 
.claro table.file table.fileWidgetDisabled td.fileButton .dijitDropDownButton .dijitButtonNode, 
.claro table.file table.fileWidgetDisabled td.fileButton .dijitComboButton .dijitButtonNode, 
.claro table.file table.fileWidgetDisabled td.fileButton .dijitToggleButton .dijitButtonNode,
.claro table.date table.dateWidgetDisabled td.dateButton .dijitButton .dijitButtonNode, 
.claro table.date table.dateWidgetDisabled td.dateButton .dijitDropDownButton .dijitButtonNode, 
.claro table.date table.dateWidgetDisabled td.dateButton .dijitComboButton .dijitButtonNode, 
.claro table.date table.dateWidgetDisabled td.dateButton .dijitToggleButton .dijitButtonNode,
.claro table.time table.timeWidgetDisabled td.timeButton .dijitButton .dijitButtonNode, 
.claro table.time table.timeWidgetDisabled td.timeButton .dijitDropDownButton .dijitButtonNode, 
.claro table.time table.timeWidgetDisabled td.timeButton .dijitComboButton .dijitButtonNode, 
.claro table.time table.timeWidgetDisabled td.timeButton .dijitToggleButton .dijitButtonNode {
   background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 10%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(10%,rgba(255,255,255,0)));
   background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 10%);
   background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 10%);
   background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 10%);
   background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 10%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
   background-color: #EFEFEF;
   height: 100%;
}

.claro table.file table.fileWidget td.fileButton .dijitDropDownButton.dijitDropDownButtonHover.dijitHover .dijitButtonNode,
.claro table.file table.fileWidgetDisabled.nEdP td.fileButton .dijitDropDownButton.dijitDropDownButtonHover.dijitHover .dijitButtonNode,
.claro table.date table.dateWidget td.dateButton .dijitDropDownButton.dijitDropDownButtonHover.dijitHover .dijitButtonNode,
.claro table.time table.timeWidget td.timeButton .dijitDropDownButton.dijitDropDownButtonHover.dijitHover .dijitButtonNode {
   background-color: #ABD6FF;
   transition-duration: 0.25s;
   -webkit-transition-duration: 0.25s;
}

.claro table.file td.fileButton .dijitDropDownButton .dijitButtonNode .dijitArrowButtonInner,
.claro table.date td.dateButton .dijitDropDownButton .dijitButtonNode .dijitArrowButtonInner,
.claro table.time td.timeButton .dijitDropDownButton .dijitButtonNode .dijitArrowButtonInner {
   background-image: url("//ajax.googleapis.com/ajax/libs/dojo/1.8/dijit/themes/claro/form/images/commonFormArrows.png");
   background-position: -37px 50%;
   background-repeat: no-repeat;
}

.claro table.file td.fileButton .dijitDropDownButton.dijitDropDownButtonHover.dijitHover .dijitButtonNode .dijitArrowButtonInner,
.claro table.file td.fileButton .dijitDropDownButton.dijitDropDownButtonFocused .dijitButtonNode .dijitArrowButtonInner,
.claro table.date td.dateButton .dijitDropDownButton.dijitDropDownButtonHover.dijitHover .dijitButtonNode .dijitArrowButtonInner,
.claro table.date td.dateButton .dijitDropDownButton.dijitDropDownButtonFocused .dijitButtonNode .dijitArrowButtonInner,
.claro table.time td.timeButton .dijitDropDownButton.dijitDropDownButtonHover.dijitHover .dijitButtonNode .dijitArrowButtonInner,
.claro table.time td.timeButton .dijitDropDownButton.dijitDropDownButtonFocused .dijitButtonNode .dijitArrowButtonInner {
   background-position: -72px 50%;
}

.claro table.file td.fileButton .dijitDropDownButtonDisabled .dijitButtonNode .dijitArrowButtonInner,
.claro table.date td.dateButton .dijitDropDownButtonDisabled .dijitButtonNode .dijitArrowButtonInner,
.claro table.time td.timeButton .dijitDropDownButtonDisabled .dijitButtonNode .dijitArrowButtonInner {
   background-position: -2px 50%;
}

.claro table.file .dijitFileInput.fileInput {
   height: 100%;
   width: calc(100% - 0.5px);
}

.claro table.file .dijitFileInputReal {
   width: 120pt;
   position: absolute;
   z-index: 10;
   opacity: 0;
   filter: alpha(opacity=0);
   cursor: pointer;
   border: 0 none;
}

.claro table.file td table.fileWidgetDisabled .dijitFileInputReal {
   cursor: default;
}

.claro table.file table.fileWidget .dijitFileInputVisible,
.claro table.file table.fileWidgetDisabled .dijitFileInputVisible {
   width: calc(100% - 5pt);
   height: 100%;
   font-size: 8pt;
   cursor: default;
   border: 0 none;
   padding: 0 0 0 5pt;
}

.claro table.file table.fileWidget.fileWidgetReception .dijitFileInputReception,
.claro table.sLpC table.file table.fileWidget .dijitFileInputVisible,
.claro table.sLpC table.file table.fileWidgetDisabled .dijitFileInputVisible {
   width: calc(100% - 3px);
}

.claro table.sLpC table.file table.fileWidget.fileWidgetReception .dijitFileInputReception {
   width: calc(100% - 3px);
}

.claro table.file .dijitFileInputVisible.widgetHovered {
   background-color: #E9F4FE;
   transition-duration: 0.25s;
   -webkit-transition-duration: 0.25s;
}

.claro table.sLpC table.file .dijitFileInputReal {
   width: 90pt;
   height: 1.7em;
   position: absolute;
   z-index: 10;
   opacity: 0;
   filter: alpha(opacity=0);
   cursor: pointer;
   border: 0 none;
}

.claro table.sLpC table.file .dijitFileInputReception {
   width: 100%;
   height: 100%;
   border: 0 none;
}

.claro table.sLpC table.file .dijitFileInputVisible {
   border: 0 none;
   cursor: default;
   font-size: 8pt;
   height: calc(100% - 1px);
   padding: 1px 0 0 3px;
}

.claro table.file .dijitFileInputText {
   display: none;
}

.claro table.file .dijitFakeInput {
   height: 100%;
   top: 0; 
   left: 0; 
   z-index: 1; 
   white-space: nowrap;
}

.claro table.file.fileSignature td.fileSignatureBox {
   padding: 6px 1px 5px;
   width: 100%;
   max-width: 200px;
}

.claro table.formContainer.sLpC table.file.fileSignature td.fileSignatureBox,
.claro table.formContainer.sLpCe table.file.fileSignature td.fileSignatureBox {
   max-width: 150px;
}

.claro table.file.fileSignature td.fileSignatureBox > div {
   height: 15px !important;
}

.claro table.file.fileSignature td.fileSignatureBox span.fileSignatureContents {
   display: inline-block;
   font-size: 8pt;
   font-style: italic;
   padding-top: 2px;
   max-width: 90%;
}

.claro table.file.fileSignature td.fileSignatureBox span.fileSignatureContents.UMS {
   max-width: 85%;
}

.claro table.file.fileSignature td.fileSignatureBox span.fileSignatureContents a,
.claro table.file.fileSignature td.fileSignatureBox span.fileSignatureContents a b {
   display: inline-block;
   max-width: 100%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.claro table.file.fileSignature td.fileSignatureBox span.fileSignatureContents a b:hover {
   text-decoration: underline;
}

.claro .fileSignatureTooltipVal {
   color: #4D8B99;
   font-weight: bold;
   padding: 10pt 0 5pt;
}

.claro .fileSignatureTooltipExp {
   color: red;
   font-style: normal;
   text-decoration: underline;
   padding: 8pt 0 0 0;
}

.claro div.sigsDialog div.sigInfoButton.B_Cl {
   margin-bottom: 15px;
}



/* ----------------------------------------------------------- FILE, DATE AND TIME BUTTON ICONS -------------------------------------------------- */



.claro span.dateIcon {
   width: 13px;
   height: 100%;
   /* background: url('./../images/date.png') no-repeat 50% 50%; */
   background: url('./../images/today.png') no-repeat 50% 50%;
   margin-left: 4px;
}

.claro span.dateIcon + span {
   padding: 0 3px !important;
}

.claro .todayIcon {
   width: 20px; 
   height: 20px;
   background: url('./../images/today.png') no-repeat 10% 50%;
   margin-left: 1px;
}

.claro .timeIcon {
   width: 14px; 
   height: 100%;
   background: url('./../images/time.png') no-repeat 50% 50%;
   margin-left: 2px;
}

.claro span.timeIcon + span {
   padding: 0 3px !important;
}

.claro .fileIcon {
   width: 14px;
   height: 100%;
   background: url("./../images/file.png") no-repeat scroll 100% 50% rgba(0, 0, 0, 0);
   margin-left: 2px;
}

.claro span.fileIcon + span {
   padding: 0 3px !important;
}

.claro .fileButton .dijitButtonContents .filePDFIcon {
   width: 12px;
   height: 100%;
   background: url('./../images/spdf_file.png') no-repeat 0 50%;
   margin-left: 4px;
}

.claro .dijitButtonContents .filePDFIcon {
   width: 12px;
   height: 15px;
   background: url('./../images/spdf_file.png') no-repeat 0 50%;
   margin-left: 1px;
   margin-right: 2px;
}

.claro span.filePDFIcon + span {
   padding: 0 3px !important;
}

.claro td.certIcon {
   width: 30px;
   background: url('./../images/cert.png') no-repeat 10% 10%;
}

.claro td.branchIcon {
   width: 30px;
   background: url('./../images/branch.png') no-repeat 50% 0;
}

.claro td.infoIcon {
   background: url('./../images/sinfo.png') no-repeat 100% 100%;
   padding: 0 0 0 20px;
}

.claro td.infoIcon:hover {
   cursor: pointer;
   position: relative;
   top: 1px;
   left: 1px;
}

.claro .dijitDisabled .dateIcon {
   opacity: 0.2;
   filter: alpha(opacity=20);
}

.claro .dijitDisabled .timeIcon {
   opacity: 0.3;
   filter: alpha(opacity=30);
}

.claro .dijitDisabled .fileIcon {
   opacity: 0.3;
   filter: alpha(opacity=30);
}

.claro .dijitDisabled .filePDFIcon {
   opacity: 0.3;
   filter: alpha(opacity=30);
}

.claro .dijitDisabled .dijitIconDelete,
.claro .dijitDisabled .dijitIconEdit,
.claro .dijitDisabled .dijitIconChart,
.claro .dijitDisabled .dijitButtonText {
   opacity: 0.3;
   filter: alpha(opacity=30);
}





/* ------------------------------------------------------------------ TABLE FIELD ---------------------------------------------------------------- */


.claro table.formContainer tr.nLT + tr > td {
   padding-top: 20px;
}

.claro table.formContainer td.tableGrid {
    vertical-align: top;
    padding: 5pt 5pt 10pt;
}

.claro div.container.response table.formContainer td.tableGrid {
   border-color: #e1eef4;
   padding: 15px;
}

.claro table.formContainer td.tableGrid > table {
    width: 100%;
}

.claro table.formContainer.sLpC td.tableGrid,
.claro table.formContainer.sLpCe td.tableGrid {
    width: 50%;
}

.claro table.formContainer.sLpC td.tableGrid:only-of-type,
.claro table.formContainer.sLpCe td.tableGrid:only-of-type {
    width: 100%;
}

.claro table.formContainer.sLpCe td.tableGrid {
    padding: 0 5pt;
}

.claro table.formContainer td.tableGrid div.tableGridParam {
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    height: 100px;
    margin: auto;
    min-height: 125px !important;
    width: 100%;
    border: 1px solid #B5BCC7;
}

.claro table.formContainer.sLpC td.tableGrid div.tableGridParam {
    width: 100%;
}

.claro table.formContainer td.tableGrid div.tableGridParam .dojoxGridContent {
    border-bottom: 1px solid #e5dac8;
}

.claro table.formContainer td.tableGrid div.tableGridParam .dojoxGridContent:empty {
    border-bottom: 1px solid transparent;
}

.claro table.formContainer td.tableGrid div.tableGridParam td.dojoxGridCell {
   height: 12pt !important;
   white-space: nowrap;
   text-overflow: ellipsis;
   vertical-align: middle !important;
}

.claro table.formContainer td.tableGrid div.tableGridParam .dojoxGridContent .dojoxGridRow:last-child td.dojoxGridCell {
   border-bottom: 1px solid transparent;
}

.claro table.formContainer td.tableGrid div.tableGridParam div.dojoxGridHeader th.dojoxGridCell div.dojoxGridSortNode {
   background-color: transparent;
}

.claro table.formContainer td.tableGrid div.tableGridParam.disabled {
   cursor: default;
   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

.claro table.formContainer td.tableGrid div.tableGridParam div.dojoxGridHeader,
.claro table.formContainer td.tableGrid div.tableGridParam div.dojoxGridHeader th.dojoxGridCell,
.claro table.formContainer td.tableGrid div.tableGridParam div.dojoxGridHeader th.dojoxGridCell div.dojoxGridSortNode,
.claro table.formContainer td.tableGrid div.tableGridParam div.dojoxGridHeader th.dojoxGridCell.dojoxGridCellOver,
.claro table.formContainer td.tableGrid div.tableGridParam div.dojoxGridHeader th.dojoxGridCell.dojoxGridCellOver div.dojoxGridSortNode {
   background: none repeat scroll 0 0 rgba(0, 0, 0, 0); 
}

.claro table.formContainer td.tableGrid div.tableGridParam.disabled div.dojoxGridHeader,
.claro table.formContainer td.tableGrid div.tableGridParam.disabled div.dojoxGridHeader th.dojoxGridCell,
.claro table.formContainer td.tableGrid div.tableGridParam.disabled div.dojoxGridHeader th.dojoxGridCell div.dojoxGridSortNode,
.claro table.formContainer td.tableGrid div.tableGridParam.disabled div.dojoxGridHeader th.dojoxGridCell.dojoxGridCellOver,
.claro table.formContainer td.tableGrid div.tableGridParam.disabled div.dojoxGridHeader th.dojoxGridCell.dojoxGridCellOver div.dojoxGridSortNode {
   background-color: #EFEFEF; 
}

.claro table.formContainer td.tableGrid div.tableGridParam.disabled td.dojoxGridCell {
   background: linear-gradient(to bottom, #FFFFFF 0px, rgba(255, 255, 255, 0) 1px, rgba(255, 255, 255, 0.75) 100%) repeat scroll 0 0 #EFEFEF;
   background: -moz-linear-gradient(top, rgba(255,255,255,1) 0px, rgba(255,255,255,0) 1px, rgba(255,255,255,0.75) 100%) repeat scroll 0 0 #EFEFEF;
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0px,rgba(255,255,255,1)), color-stop(1px,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,0.75)));
   background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%) repeat scroll 0 0 #EFEFEF;
   background: -o-linear-gradient(top, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%) repeat scroll 0 0 #EFEFEF;
   background: -ms-linear-gradient(top, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%) repeat scroll 0 0 #EFEFEF;
   background: linear-gradient(to bottom, rgba(255,255,255,1) 0px,rgba(255,255,255,0) 1px,rgba(255,255,255,0.75) 100%) repeat scroll 0 0 #EFEFEF;
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#bfffffff',GradientType=0 ) repeat scroll 0 0 #EFEFEF;
}

.claro table.formContainer td.tableGrid div.tableGridParam.disabled div.dojoxGridRow td.dojoxGridCell,
.claro table.formContainer td.tableGrid div.tableGridParam.disabled div.dojoxGridRow.dojoxGridRowOver td.dojoxGridCell {
   border-bottom-colors: none;
   border-left-colors: none;
   border-right-colors: none;
   border-top-colors: none;
   border-color: rgba(0, 0, 0, 0) #E5DAC8 #E5DAC8 rgba(0, 0, 0, 0);
   border-image: none;
   border-style: solid;
   border-width: 1px;
   outline: medium none;
   padding: 3px 5px;
}

.claro table.formContainer td.tableGrid div.tableGridParam .dojoxGridCellFocus {
   border-color: rgba(0, 0, 0, 0) #E5DAC8 #E5DAC8 rgba(0, 0, 0, 0) !important; 
   border-image: none !important;
   border-style: solid !important;
   border-width: 1px !important;
   outline: medium none !important;
   padding: 3px 5px !important;
}

.claro table.formContainer td.tableGrid div.tableGridParam .dojoxGridRowOver .dojoxGridCell {
   border-top: 1px solid #769dc0 !important;
   border-bottom: 1px solid #769dc0 !important;
}

.claro table.formContainer td.tableGrid div.tableGridParam.disabled .dojoxGridRowOver .dojoxGridCell {
   border-top: 1px solid transparent !important;
   border-bottom: 1px solid #e5dac8 !important;
}

.claro table.formContainer td.tableGrid div.tableGridParam .dojoxGridRowSelected .dojoxGridCell {
   border-top: 1px solid transparent;
   border-bottom: 1px solid #e5dac8;
}

.claro div.formResponseContainer table.formContainer td.tableGrid div.tableGridParam td.dojoxGridCell {
   font-size: 0.9em;
}

.claro table.formContainer td.tableGrid div.tableGridParam .dojoxGridSortNode {
   font-size: 8pt;
   white-space: nowrap;
   text-overflow: ellipsis;
   margin: 1px;
}

.claro table.formContainer td.tableGrid div.tableGridParam .dojoxGridCell {
   height: 15pt;
}

.claro table.formContainer td.tableGrid table td.tableButton {
   width: 10%;
   text-align: right;
}

.claro table.formContainer td.tableGrid table td.tableButton > span:first-child {
   width: 15px;
   margin: 0;
}

.claro table.formContainer td.tableGrid table td.tableButton > span:only-child {
   width: 20px;
   margin-right: 2px;
}

.claro table.formContainer td.tableGrid table td.tableButton .dijitButtonNode {
   background-color: transparent;
   background-image: none;
   border: 0 none;
   border-radius: 0;
   box-shadow: none;
   padding: 0 4px 5px;
}

.claro table.formContainer td.tableGrid table td.tableButton > span:first-child .dijitButtonNode:hover {
   position: relative;
   top: 1px;
   left: 1px;
}

.claro div.tableDialog {
   width: 650px;
   overflow-y: auto;
}

.claro div.tableDialog .dijitDialogTitleBar .dijitDialogTitle .dijitIconTable {
   padding-left: 12pt; 
}

.claro div.tableDialog .dijitDialogTitleBar .dijitDialogTitle .dijitTitleName {
   font-size: 0.9em;
   padding-top: 0;
}

.claro div.tableDialog fieldset {
   width: 450px;
   border: 1px ridge #809DB9;
   margin: 25pt auto 20pt;
   background-color: #FFF;
}

.claro div.tableDialog fieldset legend {
   padding: 0 5pt;
   color: #3F506B;
}

.claro div.tableDialog div.formContainer table.formContainer td.fieldTitle, 
.claro div.tableDialog div.formContainer table.formContainer div.dijitCheckBox + label {
   width: 40%;
}

.claro div.tableDialog table.formContainer {
   margin: 10pt 0 15pt 10pt;
}

.claro div.tableDialog table.formButtons {
   margin: 15pt auto;
}

.claro div.tableDialog table.formButtons td .dijitButton {
   margin: auto 8pt;
}

.claro div.tableDialog table.formContainer .dijitTextBoxDisabled.dijitDisabled,
.claro div.tableDialog table.formContainer .dijitTextBoxDisabled.dijitDisabled .dijitInputContainer,
.claro div.tableDialog table.formContainer .dijitComboBoxDisabled.dijitDisabled .dijitArrowButtonInner,
.claro div.tableDialog table.formContainer .dijitComboBoxDisabled.dijitDisabled .dijitInputContainer {
   font-size: 10pt;
   vertical-align: bottom;
   background-image: none;
   background-color: transparent;
   border: none;
   color: #000000;
}






/* -------------------------------------------------------------------- UNITS -------------------------------------------------------------------- */



.claro table.formContainer td.units,
.claro table.formControlContainer td.units {
   vertical-align: middle;
   color: #585A4D;
   padding: 0 0 0 8px;
   white-space: nowrap;
}

.claro table.formContainer td.formattedExpression table.resume tr.nL td table td.units {
   padding-right: 3px;
}

.claro div.tableDialog table.formContainer td.units {
   padding-left: 3pt;
}






/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------- USERS MANAGEMENT --------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */




/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------- BUTTONS ------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */


#edit {
   color: #286098;
   font-family: lucida grande;
   font-size: 1em;
}

#edit span {
   float: left;
   padding-right: 20pt;
   cursor: default;
}

#edit #loginUserLink,
#edit #certsUserLink,
#edit #areaUserLink,
#edit #demoUserLink {
   border-radius: 5px;
   box-shadow: 0 1px 0 rgba(255, 255, 255, 0.15) inset, 0 1px 0 rgba(0, 0, 0, 0.8);
   height: 21px;
   line-height: 21px;
   padding: 0 12px;
   color: #FFFFFF;
   display: block;
   font-family: 'Helvetica Neue',Arial,sans-serif;
   font-size: 11px;
   font-weight: bold;
   text-decoration: none;
   text-shadow: 0 1px 0 #000000;
   margin: 0 5px;
}

#edit #loginUserLink,
#edit #certsUserLink {
   float: right;
   background-color: #3176BB;
   background-image: linear-gradient(#3176BB, #286098);
}

#edit #areaUserLink,
#edit #demoUserLink {
   float: left;
   background-color: #83D678;
   background-image: linear-gradient(#83D678, #2A931D);
}

#edit #loginUserLink:hover,
#edit #certsUserLink:hover,
#edit #areaUserLink:hover,
#edit #demoUserLink:hover {
   box-shadow: 0 1px 0 rgba(255, 255, 255, 0.15) inset, 0 1px 0 rgba(0, 0, 0, 0.8);
   height: 21px;
   line-height: 21px;
   position: relative;
   top: 1px;
   left: 1px;
   z-index: 1;
}

#edit #loginUserLink:hover,
#edit #certsUserLink:hover {
   background-color: #111111;
   background-image: linear-gradient(#3F3F3F, #1F1F1F);
}

#edit #areaUserLink:hover,
#edit #demoUserLink:hover {
   background-color: green;
   background-image: linear-gradient(green, green);
}





/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------- INPUT FIELDS ----------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */



.claro .login.dijitTextBox,
.claro .login.dijitValidationTextBox,
.claro .login.dijitButtonText,
.claro .login.dijitSelect,
.claro .login.dijitSpinner .dijitInputField {
    border-radius: 3px;
    box-shadow: 0 0 0 3px #f2f5f7;
    height: 18pt;
    width: 135pt;
}

.claro .loginLayer.users tr.reg.rfieldstext div {
    color: grey;
    font-style: italic;
    margin-bottom: 10px;
    margin-top: -15px;
    padding-right: 25px;
    text-align: right;
    width: 100%;
}

.claro .loginLayer.users tr.reg.mrow .login.dijitTextBox,
.claro .loginLayer.users tr.reg.mrow .login.dijitValidationTextBox,
.claro .loginLayer.users tr.reg.mrow .login.dijitButtonText,
.claro .loginLayer.users tr.reg.mrow .login.dijitSelect,
.claro .loginLayer.users tr.reg.mrow .login.dijitSpinner .dijitInputField {
    width: 175pt;
}

.claro .loginLayer.users tr.reg.srow .login.dijitTextBox,
.claro .loginLayer.users tr.reg.srow .login.dijitValidationTextBox,
.claro .loginLayer.users tr.reg.srow .login.dijitButtonText,
.claro .loginLayer.users tr.reg.srow .login.dijitSelect,
.claro .loginLayer.users tr.reg.srow .login.dijitSpinner .dijitInputField {
    width: 370pt;
}

.claro .loginLayer.users tr.reg.mrow td.input + td.input .login.dijitTextBox,
.claro .loginLayer.users tr.reg.mrow td.input + td.input .login.dijitValidationTextBox,
.claro .loginLayer.users tr.reg.mrow td.input + td.input .login.dijitButtonText,
.claro .loginLayer.users tr.reg.mrow td.input + td.input .login.dijitSelect,
.claro .loginLayer.users tr.reg.mrow td.input + td.input .login.dijitSpinner .dijitInputField {
    margin-left: 10pt;
}

.claro .loginLayer.users .login.dijitTextBox,
.claro .loginLayer.users .login.dijitValidationTextBox,
.claro .loginLayer.users .login.dijitButtonText,
.claro .loginLayer.users .login.dijitSelect,
.claro .loginLayer.users .login.dijitSpinner .dijitInputField {
    height: 25pt;
    padding-left: 5pt;
    font-size: 18px;
}

.claro .loginLayer.users.manage .login.dijitTextBox,
.claro .loginLayer.users.manage .login.dijitValidationTextBox,
.claro .loginLayer.users.manage .login.dijitButtonText,
.claro .loginLayer.users.manage .login.dijitSelect,
.claro .loginLayer.users.manage .login.dijitSpinner .dijitInputField {
    height: 20pt;
    width: 170pt;
    padding-left: 5pt;
    font-size: 15px;
}

.claro .loginLayer.users .certTxt {
    float: left;
    font-size: 1.5em;
    padding-left: 6px;
    padding-top: 6px;
}

.claro .loginLayer.users.login .login.dijitTextBoxFocused,
.claro .loginLayer.users.register .login.dijitTextBoxFocused,
.claro .loginLayer.users.login .login.dijitValidationTextBoxFocused,
.claro .loginLayer.users.register .login.dijitValidationTextBoxFocused,
.claro .loginLayer.users.login .login.dijitSelectFocused,
.claro .loginLayer.users.register .login.dijitSelectFocused,
.claro .loginLayer.users.login .login.dijitButtonTextFocused,
.claro .loginLayer.users.register .login.dijitButtonTextFocused {
    box-shadow: 0 0 0 3px #e0f1fc;
}

.claro .loginLayer .login.dijitTextBoxFocused,
.claro .loginLayer .login.dijitValidationTextBoxFocused,
.claro .loginLayer .login.dijitSelectFocused,
.claro .loginLayer .login.dijitButtonTextFocused {
    box-shadow: 0 0 0 3px #f8e6e0;
}

.claro .login.dijitTextBox  .dijitInputField.dijitInputContainer,
.claro .login.dijitValidationTextBox .dijitInputField.dijitInputContainer,
.claro .login.dijitButtonText .dijitInputField.dijitInputContainer {
    border-radius: 3px;
    padding-left: 3px;
}

.claro .login.dijitSelect .dijitInputField.dijitInputContainer {
    border-radius: 3px 0 0 3px;
    padding-left: 3px;
}

.claro .login.dijitSelect .dijitButtonContents {
    border-radius: 3px 0 0 3px;
}

.claro .login.dijitSelect .dijitArrowButtonContainer {
    border-radius: 0 3px 3px 0;
    width: 18px;
}

.claro .login.dijitSelectDisabled,
.claro .login.dijitSelectDisabled .dijitButtonContents {
    width: 130pt;
    color: grey;
}

.dj_webkit .claro .dijitTextBoxDisabled input {
    color: #333;
}

.dj_webkit .claro .dijitTextBox {
    padding: 0 0 0 1pt;
    border-collapse: collapse;
}

.claro .dijitTooltip.dijitTooltipRight .dijitTooltipContainer {
    max-width: 300px;
}







/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------ USER, CERTIFICATES, PROFILES AND SIGNATURES  --------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */



.claro table.usersManager {
   width: 100%;
}
                
.claro .profileGPL,
.claro .usersGridPL,
.claro .usersProfileGridPL,
.claro .certsGridPL,
.claro .sigsGridPL {
   margin: 100px auto;
   text-align: center;
}
                
.claro #usersGrid,
.claro #usersProfileGrid,
.claro #certsGrid,
.claro #sigsGrid {
   width: 100%;
   height: 50em;
   min-height: 50em;
   border: none;
   padding: 0 0 2px 0;
}

.claro table.usersManager td.usersGridHeader,
.claro table.usersManager td.certsGridHeader,
.claro table.usersManager td.sigsGridHeader {
   padding: 25pt 0 8pt;
}

.claro #usersGrid .dojoxGridMasterHeader,
.claro #usersProfileGrid .dojoxGridMasterHeader,
.claro #certsGrid .dojoxGridMasterHeader,
.claro #sigsGrid .dojoxGridMasterHeader {
   background: #f2f2f2;
   background: -moz-linear-gradient(top, #f2f2f2 0%, #e9e9e9 50%, #e9e9e9 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(50%,#e9e9e9), color-stop(100%,#e9e9e9));
   background: -webkit-linear-gradient(top, #f2f2f2 0%,#e9e9e9 50%,#e9e9e9 100%);
   background: -o-linear-gradient(top, #f2f2f2 0%,#e9e9e9 50%,#e9e9e9 100%);
   background: -ms-linear-gradient(top, #f2f2f2 0%,#e9e9e9 50%,#e9e9e9 100%);
   background: linear-gradient(to bottom, #f2f2f2 0%,#e9e9e9 50%,#e9e9e9 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#e9e9e9',GradientType=0 );
   border: 1px solid rgba(102, 102, 102, 0.3) !important;
}

.claro #usersGrid .dojoxGridMasterHeader {
   height: 54px !important;
}

.claro #usersProfileGrid .dojoxGridMasterHeader {
   height: 42px !important;
}

.claro #certsGrid .dojoxGridMasterHeader,
.claro #sigsGrid .dojoxGridMasterHeader {
   height: 48px !important;
}

.claro #usersGrid .dojoxGridHeader .dojoxGridCellOver,
.claro #usersGrid .dojoxGridHeader .dojoxGridCellOver .dojoxGridSortNode,
.claro #usersProfileGrid .dojoxGridHeader .dojoxGridCellOver,
.claro #usersProfileGrid .dojoxGridHeader .dojoxGridCellOver .dojoxGridSortNode,
.claro #certsGrid .dojoxGridHeader .dojoxGridCellOver,
.claro #certsGrid .dojoxGridHeader .dojoxGridCellOver .dojoxGridSortNode,
.claro #sigsGrid .dojoxGridHeader .dojoxGridCellOver,
.claro #sigsGrid .dojoxGridHeader .dojoxGridCellOver .dojoxGridSortNode {
   background: none;
}

.claro #usersGrid th.dojoxGridEditableNode div.dojoxGridSortNode {
   background: url('./../images/pencil.png') no-repeat 98% 20% !important;
   height: 16px;
}

.claro #usersGrid .dojoxGridHeader table,
.claro #usersProfileGrid .dojoxGridHeader table,
.claro #certsGrid .dojoxGridHeader table,
.claro #sigsGrid .dojoxGridHeader table {
   min-width: 36px;
   border: none;
}

.claro .highlightRow tr { 
   background-color: #F2F2F2 !important;
} 

.claro #usersGrid .dojoxGridHeader .userHeaderGrid,
.claro #certsGrid .dojoxGridHeader .certHeaderGrid,
.claro #sigsGrid .dojoxGridHeader .certHeaderGrid {
   height: 40px;
}

.claro #usersProfileGrid .dojoxGridHeader .profileHeaderGrid {
   height: 35px;
}

.claro #usersGrid .dojoxGridMasterHeader .dojoxGridRowTable,
.claro #usersProfileGrid .dojoxGridMasterHeader .dojoxGridRowTable,
.claro #certsGrid .dojoxGridMasterHeader .dojoxGridRowTable,
.claro #sigsGrid .dojoxGridMasterHeader .dojoxGridRowTable {
   margin-left: 1px;
}

.claro #usersGrid .dojoxGridHeader th,
.claro #usersProfileGrid .dojoxGridHeader th,
.claro #certsGrid .dojoxGridHeader th,
.claro #sigsGrid .dojoxGridHeader th {
   vertical-align: middle;
   text-align: center;
   border-bottom: 1px solid rgba(102, 102, 102, 0.3) !important;
   font-size: 0.9em;
}

.claro #usersGrid #usersGridHdr11 {
   border-left: 1px solid #E5DAC8;
}

.claro #usersGrid #usersGridHdr5,
.claro #usersGrid #usersGridHdr8 {
   border: none;
}

.claro #usersGrid #usersGridHdr20 div.dojoxGridSortNode {
   text-align: center;
}

.claro #usersGrid .dojoxGridRowbarTable,
.claro #usersProfileGrid .dojoxGridRowbarTable,
.claro #certsGrid .dojoxGridRowbarTable,
.claro #sigsGrid .dojoxGridRowbarTable {
   min-width: 36px;
}

.claro #usersGrid table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #usersProfileGrid table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #certsGrid table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #sigsGrid table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle {
   height: 30px;
   font-size: 8pt;
   border-top: none;
   text-align: center; 
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.claro #usersGrid .dojoxGridRowbar,
.claro #usersProfileGrid .dojoxGridRowbar,
.claro #certsGrid .dojoxGridRowbar,
.claro #sigsGrid .dojoxGridRowbar {
   background: none;
}

.claro #usersGrid .dojoxGridRowbarTable,
.claro #usersProfileGrid .dojoxGridRowbarTable,
.claro #certsGrid .dojoxGridRowbarTable,
.claro #sigsGrid .dojoxGridRowbarTable {
   background: none;
}

.claro #usersGrid .dojoxGridScrollbox .dojoxGridContent .dojoxGridRowbar:nth-child(even),
.claro #usersProfileGrid .dojoxGridScrollbox .dojoxGridContent .dojoxGridRowbar:nth-child(even),
.claro #certsGrid .dojoxGridScrollbox .dojoxGridContent .dojoxGridRowbar:nth-child(even),
.claro #sigsGrid .dojoxGridScrollbox .dojoxGridContent .dojoxGridRowbar:nth-child(even) {
   background-color: #F6F6F6 !important;
}  

.claro #usersGrid .dojoxGridRow table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #usersProfileGrid .dojoxGridRow table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #certsGrid .dojoxGridRow table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #sigsGrid .dojoxGridRow table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle {
   height: 30px;
   font-size: 8pt;
   border-top: none;
   text-align: center; 
   background-color: #FFFFFF;
   border-right: none;
   border-bottom: 1px solid rgba(102, 102, 102, 0.3);
}

.claro #usersGrid .dojoxGridScrollbox .dojoxGridContent .dojoxGridRowbar:nth-child(odd),
.claro #usersProfileGrid .dojoxGridScrollbox .dojoxGridContent .dojoxGridRowbar:nth-child(odd),
.claro #certsGrid .dojoxGridScrollbox .dojoxGridContent .dojoxGridRowbar:nth-child(odd),
.claro #sigsGrid .dojoxGridScrollbox .dojoxGridContent .dojoxGridRowbar:nth-child(odd) {
   background-color: #FFFFFF;
}  

.claro #usersGrid .dojoxGridRow.dojoxGridRowOdd table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #usersProfileGrid .dojoxGridRow.dojoxGridRowOdd table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #certsGrid .dojoxGridRow.dojoxGridRowOdd table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #sigsGrid .dojoxGridRow.dojoxGridRowOdd table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #usersGrid .dojoxGridRow.dojoxGridRowOdd.dojoxGridRowOver table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #usersProfileGrid .dojoxGridRow.dojoxGridRowOdd.dojoxGridRowOver table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #certsGrid .dojoxGridRow.dojoxGridRowOdd.dojoxGridRowOver table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #sigsGrid .dojoxGridRow.dojoxGridRowOdd.dojoxGridRowOver table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle {
   background-color: #F6F6F6 !important;
   background-image: none !important;
}

.claro #usersGrid .dojoxGridRow.dojoxGridRowOver table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #usersProfileGrid .dojoxGridRow.dojoxGridRowOver table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #certsGrid .dojoxGridRow.dojoxGridRowOver table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle,
.claro #sigsGrid .dojoxGridRow.dojoxGridRowOver table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle {
   border-bottom: 1px solid #DBDBDB !important;
}

.claro #usersGrid table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle gridUsernameWidgetTooltip,
.claro #certsGrid table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle gridUsernameWidgetTooltip {
   color: yellow;
}

.claro #usersGrid table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle span.userCertificateInfo img:hover,
.claro #usersGrid table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle span.profileInfo img:hover,
.claro #usersProfileGrid table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle span.profileInfo img:hover,
.claro #certsGrid table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle span.userCertificateInfo img:hover,
.claro #sigsGrid table.dojoxGridRowTable tr td.dojoxGridCell.dojoxGridStyle span.userCertificateInfo img:hover {
   cursor: pointer;
   position: relative;
   top: 1px;
   left: 1px; 
}

.claro #usersGrid table.dojoxGridRowTable tr.dojoxGridInvisible th.dojoxGridCell,
.claro #usersGrid table.dojoxGridRowTable tr.dojoxGridInvisible td.dojoxGridCell {
   padding: 0 5px;
   visibility: visible;
   border-bottom: none;
   border: none !important;
}

.claro #certsGrid #certsGridHdr1 div.dojoxGridSortNode,
.claro #sigsGrid #sigsGridHdr1 div.dojoxGridSortNode {
   background: url('./../images/pencil.png') no-repeat 98% 20%;
   height: 18px;
}

.claro #usersGrid .dojoxGridMasterView .dojoxGridRowbarInner,
.claro #usersProfileGrid .dojoxGridMasterView .dojoxGridRowbarInner,
.claro #certsGrid .dojoxGridMasterView .dojoxGridRowbarInner,
.claro #sigsGrid .dojoxGridMasterView .dojoxGridRowbarInner {
   height: 30px;
   cursor: pointer;
   border-bottom: 1px solid rgba(102, 102, 102, 0.3);
}

.claro #usersGrid .dojoxGridCellFocus,
.claro #usersProfileGrid .dojoxGridCellFocus,
.claro #permsGrid .dojoxGridCellFocus,
.claro #certsGrid .dojoxGridCellFocus,
.claro #sigsGrid .dojoxGridCellFocus {
   border-top: transparent solid 1px !important;
   border-right: #E5DAC8 solid 1px !important;
   border-bottom: #E5DAC8 solid 1px !important;
   border-left: transparent solid 1px !important;
}

.claro .dojoxGridMasterMessages {
   height: 100%;
   width: 100%;
   position: absolute;
   background-color: #F9FDFF !important;
   padding: 15pt 0 0 0;
}

.claro div.dojoxGridMasterMessages span.dojoxGridNoData,
.claro div.dojoxGridMasterMessages span.dojoxGridLoading {
   font-size: 10pt;
   font-style: italic;
}

.claro table.usersManager td table.usersManagerContainer1 {
   padding: 0 8pt;
   width: 95%;
}

.claro table.usersManager td table.usersManagerContainer2 {
   width: 100%;
}

.claro table.usersManager td table.usersManagerContainer1,
.claro table.usersManager td table.usersManagerContainer2 {
   margin: 5pt auto 0;
}

.claro table.usersManager td table.usersManagerContainer2 td.pf_sh_c {
   border-bottom: 1px solid #E5997F;
   min-width: 5pt;
} 

.claro table.usersManager td table.usersManagerContainer2 td.pf_sh_c:first-of-type {
   min-width: 0;
} 

.claro table.usersManager td table.usersManagerContainer2 td.pf_sh_c:last-of-type {
   width: 100%;
} 

.claro table.usersManager td table.usersManagerContainer2 td.pf_sh_c.c {
   padding: 0 5pt;
}

.claro table.usersManager td table.usersManagerContainer2 td.usersSelection,
.claro table.usersManager td table.usersManagerContainer2 td.profileSelection,
.claro table.usersManager td table.usersManagerContainer2 td.certificateSelection,
.claro table.usersManager td table.usersManagerContainer2 td.signatureSelection {
   border-color: #E5997F #E5997F transparent;
   border-radius: 10px 10px 0 0;
   border-style: solid solid solid;
   border-width: 1px 1px 1px;
   padding: 2pt 10pt 0;
   height: 35px;
   cursor: pointer;
   color: #CC3300;
   font-size: 1.2em;
}

.claro table.usersManager td table.usersManagerContainer2 td.usersSelection.pf_sh_c,
.claro table.usersManager td table.usersManagerContainer2 td.profileSelection.pf_sh_c,
.claro table.usersManager td table.usersManagerContainer2 td.certificateSelection.pf_sh_c,
.claro table.usersManager td table.usersManagerContainer2 td.signatureSelection.pf_sh_c {
   border-bottom: 1px solid #E5997F;
   background-color: #FBF1E9;
}

.claro table.usersManager td table.usersManagerContainer2 td.usersSelection,
.claro table.usersManager td table.usersManagerContainer2 td.profileSelection {
   min-width: 85px;
}

.claro table.usersManager td table.usersManagerContainer2 td.certificateSelection,
.claro table.usersManager td table.usersManagerContainer2 td.signatureSelection {
   min-width: 110px;
}

.claro table.usersManager td table.usersManagerContainer3 {
   border-bottom: 1px solid #E5997F;
   border-left: 1px solid #E5997F;
   border-right: 1px solid #E5997F;
   height: 380pt;
   margin: 0 auto 40pt;
   padding: 0 12pt 25pt;
   width: 100%;
   background-color: #f9fdff;
}

.claro table.usersManager td table.usersManagerContainer1 td.usersManager {
   border-left: 1px solid #E5997F;
   border-right: 1px solid #E5997F;
   padding: 15pt 0 0;
   background-color: #f9fdff;
}

.claro table.usersManager td table.usersManagerContainer1 td.usersManager > div {
   width: 95%;
   margin: auto;
   border-bottom: 1px solid #E5997F;
   height: 45px;
}

.claro table.usersManager td table.usersManagerContainer1 td.usersManager div.managerTitle {
   float: left;
   padding: 2pt 0 0;
}

.claro table.usersManager td table.usersManagerContainer1 td.usersManager div.managerTitle span.usersTitle,
.claro table.usersManager td table.usersManagerContainer1 td.usersManager div.managerTitle span.profileTitle,
.claro table.usersManager td table.usersManagerContainer1 td.usersManager div.managerTitle span.certsTitle,
.claro table.usersManager td table.usersManagerContainer1 td.usersManager div.managerTitle span.sigsTitle {
   font-size: 14pt;
   padding: 0 0 0 10pt;
   color: #CC3300;
}

.claro table.usersManager td table.usersManagerContainer1 td.usersManager table.usersControlPane table.managerSubPane1,
.claro table.usersManager td table.usersManagerContainer1 td.usersManager table.usersControlPane table.managerSubPane2,
.claro table.usersManager td table.usersManagerContainer1 td.usersManager table.usersControlPane table.managerSubPane3 {
   border-right: 1px solid #E5997F;
   padding: 0 4pt 0 0;
}

.claro table.usersManager table.usersManagerContainer2 td.usersMenu {
   height: 25pt;
}

.claro table.usersManager table.usersManagerContainer2 td.usersMenu div.usersMenu {
   float: left;
   font-family: calibri;
   font-size: 12px;
   font-weight: bold;
   padding-top: 3pt;
   width: 100%;
}

.claro table.usersManager table.usersManagerContainer3 td.usersGridHeader div.usersSearch {
   float: left;
   margin-top: 3pt;
}

.claro table.usersManager table.usersManagerContainer2 td.usersMenu div.usersMenu,
.claro table.usersManager table.usersManagerContainer3 td.usersGridHeader div.usersFilter,
.claro table.usersManager table.usersManagerContainer3 td.certsGridHeader div.certsFilter {
   font-size: 1em;
   text-align: left;
   font-family: Arial;
   margin: 5pt 0 0;
   font-weight: normal;
}

.claro table.usersManager table.usersManagerContainer3 td.usersGridHeader div.usersFilter,
.claro table.usersManager table.usersManagerContainer3 td.certsGridHeader div.certsFilter {
   float: right;
}

.claro table.usersManager table.usersManagerContainer3 td.usersGridHeader div.usersFilter .dijitSelect,
.claro table.usersManager table.usersManagerContainer3 td.usersGridHeader div.usersFilter .dijitButtonContents .dijitInputField {
   font-size: 0.9em;
   text-align: left;
   border-radius: 4pt 0 0 4pt;
   padding-left: 5pt;
   outline: none !important;
   color: #000;
}

.claro table.usersManager table.usersManagerContainer3 td.usersGridHeader div.usersFilter #filter_by.dijitSelect .dijitButtonContents {
   width: 50pt;
}

.claro table.usersManager table.usersManagerContainer3 td.usersGridHeader div.usersFilter #filter_what.dijitSelect .dijitButtonContents {
   width: 100pt;
}

.claro #filter_by_menu .dijitMenuItemLabel,
.claro #filter_what_menu .dijitMenuItemLabel {
   font-size: 100%;
   padding-top: 5px;
}

.claro table.usersManager table.usersManagerContainer3 td.usersGridHeader div.usersFilter table td.filterCheckRegion,
.claro table.usersManager table.usersManagerContainer3 td.certsGridHeader div.certsFilter table td.filterCheckRegion {
   padding: 0 5pt 0 0;
}

.claro table.usersManager table.usersManagerContainer3 td.usersGridHeader div.usersFilter table td.filterCheckRegion input,
.claro table.usersManager table.usersManagerContainer3 td.certsGridHeader div.certsFilter table td.filterCheckRegion input {
   cursor: pointer;
}

.claro table.usersManager table.usersManagerContainer3 td.usersGridHeader div.usersFilter table td.filterLabelRegion,
.claro table.usersManager table.usersManagerContainer3 td.certsGridHeader div.certsFilter table td.filterLabelRegion,
.claro table.usersManager table.usersManagerContainer3 td.usersGridHeader div.usersFilter table td.filterSelect1Region,
.claro table.usersManager table.usersManagerContainer3 td.certsGridHeader div.certsFilter table td.filterSelect1Region {
   opacity: 0.6;
   padding: 0 8pt 0 0;
}

.claro table.usersManager table.usersManagerContainer3 td.usersGridHeader div.usersFilter table td.filterSelect2Region,
.claro table.usersManager table.usersManagerContainer3 td.certsGridHeader div.certsFilter table td.filterSelect2Region {
   opacity: 0.6;
}

.claro table.usersManager table.usersManagerContainer3 td.usersGridHeader div.usersFilter table td.filterSelect1Region .dijitMenuItemLabel,
.claro table.usersManager table.usersManagerContainer3 td.usersGridHeader div.usersFilter table td.filterSelect2Region .dijitSelectMenu {
   font-size: 8pt;
}

.claro table.usersManager table td table.usersManagerSearchWidget td.usersManagerSearchInput {
   position: absolute;
   border: 1px solid #B5BCC7;
   background-color: #FFF; 
   transition-duration: 0.2s;
   -webkit-transition-duration: 0.25s;
   padding: 0;
   height: 18pt;
}

.claro table.usersManager table td table.usersManagerSearchWidget td.usersManagerSearchInput div.dijitTextBox {
   padding-left: 2pt;
   height: 98%;
   border: none;
}

.claro table.usersManager table td table.usersManagerSearchWidget td.usersManagerSearchInput div.usersManagerSearchClearIcon {
   position: absolute;
   top: 0;
   right: 5px;
   z-index: 0;
   cursor: pointer;
   padding: 2pt 3pt 2pt 0;
}

.claro table.usersManager table td table.usersManagerSearchWidget td.usersManagerSearchInput div.usersManagerSearchClearIcon img:hover {
   position: relative;
   top: 1px;
   left: 1px;
}

.claro table.usersManager table td.usersManagerSearchIcon {
   width: 10pt;
   padding: 0 10pt;
}

.claro table.usersManager table td.usersManagerSearchIcon img:hover,
.claro table.certsGrid table td.certsManagerSearchIcon img:hover,
.claro table.sigsGrid table td.sigsGridSearchIcon img:hover {
   cursor: pointer;
   position: relative;
   top: 1px;
   left: 1px;
}

.claro table.usersControlPane .dijitButton .dijitButtonNode, 
.claro table.usersControlPane .dijitDropDownButton .dijitButtonNode, 
.claro table.usersControlPane .dijitComboButton .dijitButtonNode, 
.claro table.usersControlPane .dijitToggleButton .dijitButtonNode {
   background: #f2f2f2;
   background: -moz-linear-gradient(top, #f2f2f2 0%, #e9e9e9 32%, #e9e9e9 74%, #e9e9e9 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(32%,#e9e9e9), color-stop(74%,#e9e9e9), color-stop(100%,#e9e9e9));
   background: -webkit-linear-gradient(top, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   background: -o-linear-gradient(top, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   background: -ms-linear-gradient(top, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   background: linear-gradient(to bottom, #f2f2f2 0%,#e9e9e9 32%,#e9e9e9 74%,#e9e9e9 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#e9e9e9',GradientType=0 );
   border: 1px solid #E5997F;
   border-radius: 4px 4px 4px 4px;
   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
   color: #000000;
   padding: 2px 4px 4px;
}

.claro table.usersControlPane .dijitButton .dijitButtonNode:hover, 
.claro table.usersControlPane .dijitDropDownButton .dijitButtonNode:hover, 
.claro table.usersControlPane .dijitComboButton .dijitButtonNode:hover, 
.claro table.usersControlPane .dijitToggleButton .dijitButtonNode:hover {
   background: #ffffff;
   background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#ffffff));
   background: -webkit-linear-gradient(top, #ffffff 0%,#ffffff 100%);
   background: -o-linear-gradient(top, #ffffff 0%,#ffffff 100%);
   background: -ms-linear-gradient(top, #ffffff 0%,#ffffff 100%);
   background: linear-gradient(to bottom, #ffffff 0%,#ffffff 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 );
}

.claro table.usersControlPane .dijitButtonDisabled .dijitButtonNode, 
.claro table.usersControlPane .dijitDropDownButtonDisabled .dijitButtonNode, 
.claro table.usersControlPane .dijitComboButtonDisabled .dijitButtonNode, 
.claro table.usersControlPane .dijitToggleButtonDisabled .dijitButtonNode {
   background-color: #EFEFEF;
   background-image: linear-gradient(#FFFFFF 0%, rgba(255, 255, 255, 0) 40%);
   border: 1px solid #D3D3D3;
   box-shadow: 0 0 0 transparent;
   color: #818181;
}

.claro table.usersControlPane .dijitButtonDisabled .dijitButtonNode:hover, 
.claro table.usersControlPane .dijitDropDownButtonDisabled .dijitButtonNode:hover, 
.claro table.usersControlPane .dijitComboButtonDisabled .dijitButtonNode:hover, 
.claro table.usersControlPane .dijitToggleButtonDisabled .dijitButtonNode:hover {
   background-color: #EFEFEF;
   background-image: linear-gradient(#FFFFFF 0%, rgba(255, 255, 255, 0) 40%);
   border: 1px solid #D3D3D3;
   box-shadow: 0 0 0 transparent;
   color: #818181;
}

.claro table.permsGrid td.permsGridTitle {
   font-size: 10pt;
   padding: 10pt 0 0 15pt;
}

.claro table.permsGrid td.permsGrid {
   padding: 10pt 45pt 20pt;
}

.claro table.permsGrid td.permsGrid div.permInfoDialogButton {
   padding: 20pt 0 0 0;
}

.claro table.usersManager td table.usersManagerContainer2 td.usersMenu div div td.managerPL {
   padding: 3pt 10pt 0 0;
}

.claro td.usersManager table td.certsManagerPane td.certsManagerActivate table td.certsManagerActivateSelection {
   padding: 0 5pt 0 0;
}

.claro td.usersManager table td.certsManagerPane td.certsManagerActivate table td.certsManagerActivateSelection .dijitTextBox {
   width: 100pt;
   padding: 0 0 0 1pt;
}

.claro td.usersManager table td table.usersManagerUndoPane,
.claro td.certsGrid table td table.certsGridUndoPane {
   padding: 0 0 10pt 0;
}

.claro table.usersManager td table.usersManagerContainer2 td.usersMenu div table td.managerStatus table td.managerStatus_image {
   padding: 0 5pt 0 0;
}
.claro table.usersManager td table.usersManagerContainer2 td.usersMenu div table td.managerStatus table td.managerStatusInfo {
   font-style: italic;
}

.claro div.profileInfoDialog div.usersProfilePane div.managerConfirmPane .dijitButton .dijitButtonNode, 
.claro div.profileInfoDialog div.usersProfilePane div.managerConfirmPane .dijitDropDownButton .dijitButtonNode, 
.claro div.profileInfoDialog div.usersProfilePane div.managerConfirmPane .dijitComboButton .dijitButtonNode, 
.claro div.profileInfoDialog div.usersProfilePane div.managerConfirmPane .dijitToggleButton .dijitButtonNode {
   padding: 3px 0 3px 5px;
}

.claro div.usersProfilePane div.managerConfirmPane .dijitButtonHover .dijitButtonNode, 
.claro div.usersProfilePane div.managerConfirmPane .dijitDropDownButtonHover .dijitButtonNode, 
.claro div.usersProfilePane div.managerConfirmPane .dijitComboButton .dijitButtonNodeHover,
.claro div.usersProfilePane div.managerConfirmPane .dijitComboButton .dijitDownArrowButtonHover, 
.claro div.usersProfilePane div.managerConfirmPane .dijitToggleButtonHover .dijitButtonNode {
   background-color: #c6def5;
   color: #000000;
   transition-duration: 0.2s;
}

.claro div.profileInfoDialog div.usersProfilePane {
   overflow: hidden;
   padding: 10pt 15pt 0 0;
}





/* -------------------------------------------------------- USERS MANAGEMENT DIALOGS ------------------------------------------------------------- */



.claro .dijitDialogUnderlay.usersDialog_underlay.loginDialog_underlay {
   background: none repeat scroll 0 0 #000 !important;
   opacity: 0.6:
}

.claro .dijitDialogUnderlay.usersDialog_underlay,
.claro .dijitDialogUnderlay.certsDialog_underlay {
   background: none repeat scroll 0 0 #000 !important;
   opacity: 0.8:
}

.claro div.usersDialog {
   width: 720px;
   border: 4px solid #585A4D;
   background-color: #fff;
   border-radius: 0;
   text-align: left;
}

.claro div.usersDialog.loginDialog {
   border: 5px solid #ACACAC;
   top: 50% !important; 
   /* left: 50% !important; */
   /* -webkit-transform: translate(0, -50%); */
   /* -moz-transform: translate(-50%, -50%); */
   /* -ms-transform: translate(-50%, -50%); */
   /* -o-transform: translate(-50%, -50%); */

   -webkit-transform: translateY(-50%); 
   -moz-transform: translateY(-50%); 
   -ms-transform: translateY(-50%); 
   -o-transform: translateY(-50%); 
}

.claro div.usersDialog.loginDialog.loginDialog.loginDialogSSL {
   height: 460px;
}

.claro div.usersDialog.loginDialog.loginDialog.loginDialogNoSSL {
   height: 405px;
}

.claro div.usersDialog.loginDialog.loginDialog.loginRDialogSSL {
   height: 535px;
}

.claro div.usersDialog.loginDialog.loginDialog.loginRDialogNoSSL {
   height: 485px;
}

.claro div.usersDialog.loginDialog table.usersDialogLoginPL {
   margin: 80pt auto;
}

.claro div.usersDialog.loginDialog table.usersDialogLoginPL .hidden {
   display: none;
   opacity: 0;
}

.claro div.usersDialog div.dijitDialogTitleBar {
   background: #f2f2f2;
   background: -moz-linear-gradient(top, #E9E9E9 0%, #e9e9e9 10%, #e9e9e9 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#E9E9E9), color-stop(10%,#e9e9e9), color-stop(100%,#e9e9e9));
   background: -webkit-linear-gradient(top, #E9E9E9 0%,#e9e9e9 10%,#e9e9e9 100%);
   background: -o-linear-gradient(top, #E9E9E9 0%,#e9e9e9 10%,#e9e9e9 100%);
   background: -ms-linear-gradient(top, #E9E9E9 0%,#e9e9e9 10%,#e9e9e9 100%);
   background: linear-gradient(to bottom, #E9E9E9 0%,#e9e9e9 10%,#e9e9e9 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E9E9E9', endColorstr='#e9e9e9',GradientType=0 );
   border: 2pt solid #e9e9e9;
   border-radius: 0;
}

.claro div.usersDialog.loginDialog div.dijitDialogTitleBar {
   background: none;
   background-color: #FFF;
   border: none;
}

.claro div.usersDialog div.dijitDialogPaneContent {
   background-color: #FFF;
   padding: 10px 0 0;
   border-top: 2pt solid #e9e9e9;
   border-radius: 0;
}

.claro div.usersDialog.loginDialog div.dijitDialogPaneContent {
   border: none !important;
   margin-top: -20px;
   overflow-y: hidden !important;
   height: 100% !important;
}

.claro div.usersDialog h3 {
   margin: 25pt auto 20pt !important;
   padding-bottom: 2pt;
   padding-left: 5pt;
   padding-top: 0;
   color: #CC3300;
   font-size: 1.35em !important;
   text-align: left;
   width: 80%;
   border-bottom: 1px solid #E5997F;
}

.claro div.usersDialog.loginDialog h3 {
   font-size: 1.75em !important;
   text-align: left;
   color: #23639A;
   border-bottom: 1px solid #23639A;
   margin-bottom: 50px !important;
}

.claro div.usersDialog.loginDialog h3 span.demoRTitle {
   color: #fb9500;
   font-family: cursive;
   margin-right: 15px;
   margin-top: -1px;
   float: right;
}

.claro div.usersDialog table.formButtons {
   margin-top: 5pt;
   margin-bottom: 15pt;
}

.claro div.usersDialog table.formButtons .dijitButton {
   margin: auto 8pt;
}

.claro div.usersDialog table.formButtons td.usersDialogStatus {
   width: 350px;
   font-style: italic;
   padding: 0 0 0 10pt;
   font-size: 1.2em;
}

.claro div.usersDialog table.formButtons td.usersDialogStatus img {
   vertical-align: middle;
}

.claro div.usersDialog table.formButtons td.usersDialogStatus .usersDialogStatus_text {
   max-width: 50px;
   padding-left: 5pt;
   padding-top: 0;
   text-overflow: ellipsis;
   vertical-align: middle;
   white-space: nowrap;
}

.claro div.usersDialog table.formButtons td.usersDialogStatus .usersDialogStatus_info {
   margin-left: 10pt;
}

.claro div.usersDialog table.formButtons td.usersDialogStatus .usersDialogStatus_info:hover {
   cursor: pointer;
}

.claro div.usersDialog .regMsg {
   font-size: 115%;
   margin: -30px auto 30px;
   width: 535px;
   font-family: cursive;
   text-align: justify;
}

.claro div.usersDialog .regMsg.hidden {
   display: none;
}

.claro div.usersDialog .regSteps {
    display: none;
}

.claro div.usersDialog.loginDialog .regSteps {
    display: block;
    margin: -85px auto 65px !important;
    text-align: right;
    width: 75%;
}

.claro div.usersDialog.loginDialog .regSteps li {
    display: inline-block;
    margin: 0 10px 0 0;
}

.claro div.usersDialog.loginDialog .regSteps li .number {
    color: #FFFFFF;
    display: inline-block;
    font-size: 28px;
    margin-right: 10px;
    position: relative;
    width: 20px;
}

.claro div.usersDialog.loginDialog .regSteps li.selected .number .ball {
    background-color: #2088C2;
}

.claro div.usersDialog.loginDialog .regSteps li .number .ball {
    background-color: #EFEFEF;
    border-radius: 90px;
    font-size: 0.7em;
    padding: 2px 12px;
    position: absolute;
    top: -24px;
}

.claro div.usersDialog.loginDialog .regSteps li.selected .text {
    font-weight: bold;
}

.claro div.usersDialog.loginDialog .regSteps li .text {
    font-size: 12px;
    margin-left: 15px;
    margin-right: 15px;
    text-align: center;
    vertical-align: top;
}

.claro div.usersDialog.loginDialog table td.loginCertWelcome {
   padding-bottom: 15pt;
}

.claro div.usersDialog.loginDialog table.loginCertNotes {
   font-size: 8pt;
   font-style: italic;
   margin: auto auto 40px;
   width: 500px;
}

.claro div.usersDialog.loginDialog table table.loginCertSignForm {
   padding: 15pt 5pt 0;
}

.claro div.usersDialog.loginDialog table table.loginCertSignForm td.title {
   width: 260px;
}

.claro div.usersDialog.loginDialog table table.loginCertSignForm .dijitCheckBoxInput {
   cursor: pointer;
}

.claro div.usersDialog.loginDialog table.loginCertError {
   display: none;
   margin: 50pt auto 10pt;
   width: 70%;
   min-height: 100px;
}

.claro div.usersDialog.loginDialog table.loginCertError .errorDialogStatus {
   padding-left: 25pt;
}

.claro div.usersDialog.loginDialog table.loginCertError table.d_backButton {
   margin-left: -30pt;
   margin-top: 50pt;
}

.claro div.usersDialog.loginDialog table.loginCertError table.d_backButton a {
   cursor: pointer;
   color: #23639A;
}

.claro div.usersDialog.loginDialog table.registerError {
   width: 70%;
   margin: 35pt auto 80pt;
}

.claro div.usersDialog.loginDialog table.registerError td.registerErrorIcon {
   width: 50px;
}

.claro div.usersDialog.loginDialog table.registerError td.registerErrorText {
   font-size: 1.35em;
   color: red;
   padding-left: 20px;
}

.claro div.usersDialog.loginDialog table.registerError ~ div.managerClosePane {
   margin: 25pt auto;
}

.claro #permsGrid {
   width: 450px;
   height: 20em;
   border: solid #585a4d 1pt;
}

.claro div.permInfoDialog {
   width: 600px;
   border: 1px solid grey;
   border-radius: 10pt;
}

.claro div.permInfoDialog div.dijitDialogPaneContent {
   background-color: #f7fbfe;
}

.claro table.loginLayer,
.claro table.loginButton {
   width: 550px;
}

.claro table.loginLayer {
   padding: 15pt;
   margin: 10pt auto 15pt;
}

.claro table.loginLayer.users {
   margin: -20pt auto 10pt;
}

.claro table.loginLayer.users.manage {
   margin: 10pt auto 20pt;
   padding-top: 5pt;
}

.claro table.loginLayer.users + table.registerText {
   font-size: 1.15em;
   margin: 20px auto -10px;
   text-align: right;
   width: 80%;
}

.claro table.registerText a {
   color: #2088C2;
   cursor: pointer;
}

.claro table.registerText a:hover {
   text-decoration: underline;
}

.claro table.loginLayerResponse {
   width: 350px;
   text-align: center;
   background-color: #FAFAFA;
   border: 2pt solid #759DC0;
   border-radius: 8pt 8pt 8pt 8pt;
   padding: 15pt;
   margin: 25pt auto 10pt;
}

.claro table.loginLayer .dijitTextBoxHover,
.claro table.loginLayer .dijitValidationTextBoxHover {
   background-color: #FFF !important;
}

.claro table.loginButton {
   border-top: 2px solid #ACACAC;
   height: 50px;
   margin: 10pt auto 0;
   padding-top: 10pt;
   width: 88%;
}

.claro table.loginLayer td {
   text-align: left;
}

.claro table.loginLayer td.title,
.claro table.loginLayer td.adminTitle {
   width: 225px;
   font-size: 1.2em;
   vertical-align: middle;   
   text-align: left; 
   color: #CC3300;
}

.claro table.loginLayer td.adminTitle {
   padding-top: 12pt;
}

.claro div.usersDialog.loginDialog table.loginLayer td.title {
   color: #585A4D;
   width: 180px;
   font-size: 1.2em;
}

.claro table.loginLayer td.acTypeTitle1,
.claro table.loginLayer td.acTypeTitle2,
.claro table.loginLayer td.acTypeTitle3,
.claro table.loginLayer td.acTypeTitle4 {
   width: 225px;
   font-size: 1.2em;
   vertical-align: middle;
   text-align: left; 
   color: #CC3300;
}

.claro table.loginLayer td.acTypeTitle1 {
   padding: 8pt 0 0;
}

.claro table.loginLayer td.acTypeTitle2 {
   padding: 2pt 0 0;
}

.claro table.loginLayer td.acTypeTitle3 {
   padding: 10pt 0 5pt;
}

.claro table.loginLayer td.acTypeTitle4 {
   padding: 5pt 0;
}

.claro table.loginLayer td.input {
   vertical-align: middle; 
   text-align: left;
   padding-top: 4pt;
   padding-bottom: 4pt;
}

.claro table.loginLayer td.input .dijitSelect {
   width: 120pt;
}

.claro table.loginLayer td.adminInput {
   text-align: left;
   padding: 10pt 0 0;
}

.claro table.loginLayer td.adminInput #convert_administrator {
   cursor: pointer;
}

.claro table.loginLayer td.acTypeInput1 {
   text-align: left;
   padding: 8pt 0 0;
}

.claro table.loginLayer td.acTypeInput2 {
   text-align: left;
   padding: 2pt 0 0;
}

.claro table.loginLayer td.acTypeInput3 {
   text-align: left;
   padding: 10pt 0 5pt;
}

.claro table.loginLayer td.acTypeInput4 {
   text-align: left;
   padding: 5pt 0;
}

.claro table.loginLayer td.acTypeInput3 #remove_password {
   cursor: pointer;
}

.claro table.loginLayer table.userPagePermissionTable table.formButtons {
   margin-top: 15pt;
}

.claro table.loginLayer table.userPagePermissionTable table.formButtons .dijitButton {
   margin: auto 0 auto 8pt;
}

.claro table.loginButton .dijitButton .dijitButtonNode {
   min-width: 30pt;
}

.claro #user_availability {
   color: grey;
   font-style: italic;
   padding: 7pt 0 0 5pt;
}

.claro div.certsResponseDialog,
.claro div.sigsResponseDialog {
   max-width: 400px;
   text-align: left;
}

.claro table.formProfileDialogButtons,
.claro table.formProfileButtons {
   margin: 20pt auto 15pt;
}

.claro table.formProfileButtons td.managerB img {
   padding-top: 5pt;
}

.claro table.formProfileDialogButtons td {
   padding-left: 120pt;
}





/* ------------------------------------------------------- DEMO CONTENTS AND WIZARD --------------------------------------------------------------- */




.claro table.demo_introduction {
   margin: auto;
   font-family: cursive;
}

.claro table.demo_introduction h3.header {
   color: #fb9500;
   font-size: 130%;
   margin-bottom: 2% !important;
   margin-top: 4% !important;
}

.claro #democontents {
   opacity: 0;
}

.claro #democontents.form {
   box-shadow: 2px 0 10px rgba(0, 0, 0, 0.8);
   height: 0;
   margin: -15px auto 10px;
   padding-bottom: 20px;
   width: 100%;
}

.claro #democontents.form div.wizardCloseLayer #wizardClose:before {
   content: "x";
}

.claro #democontents.form div.wizardCloseLayer #wizardClose {
    background: none repeat scroll 0 0 #605f61;
    border: 1px solid #aeaeae;
    border-radius: 15px;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    float: right;
    font-size: 12px;
    font-weight: bold;
    height: 3px;
    line-height: 0;
    margin-right: -4%;
    margin-top: -80px;
    padding: 5px 2px 5px 3px;
    width: 8px;
}

@media screen and (max-width: 1150px) {
    .claro #democontents.form div.wizardCloseLayer #wizardClose {
        margin-right: 5%;
    }
}
@media screen and (max-width: 1200px) and (min-width: 1149px) {
    .claro #democontents.form div.wizardCloseLayer #wizardClose {
        margin-right: 0;
    }
}
@media screen and (max-width: 1250px) and (min-width: 1199px) {
    .claro #democontents.form div.wizardCloseLayer #wizardClose {
        margin-right: -2%;
    }
}

.claro #democontents.form div.wizardCloseLayer #wizardClose:hover {
    color: #aeaeae;
}

.claro #democontents.form div.demoWizardContents {
   display: table;
   font-family: cursive;
   margin: 30px auto 0;
   max-height: 80px;
   max-width: 1080px;
   text-align: justify;
   width: 100%;
}

.claro #democontents.form div.demoWizardContents #demoWizardContentsStep1 table.button {
   float: right;
   margin-top: -12px;
   margin-left: 25px;
   cursor: default;
}

.claro #democontents.form div.demoWizardContents #demoWizardContentsStep1 table.button td.wizardSep {
   color: #34302d;
   padding-left: 10pt;
   padding-right: 10pt;
   font-size: 110%;
   font-family: cursive;
}

.claro #democontents.form div.demoWizardContents #demoWizardContentsStep2 table.button {
   float: right;
   margin-bottom: 15px;
   margin-right: -30px;
   margin-top: 15px;
   max-width: 200px;
}

.claro #democontents.form div.demoWizardContents #demoWizardContentsStep4 table.button {
   float: right;
   margin-top: 15px;
   margin-bottom: 15px;
   margin-right: 15px;
   max-width: 200px;
}

.claro #democontents.form div.demoWizardContents #demoWizardContentsStep4 #demoWizardContentsStep4Substep2 table.button {
   margin-top: -6px;
}

.claro #democontents.form div.demoWizardContents #demoWizardContentsStep4 #demoWizardContentsStep4Substep2 table.button td {
   padding-top: 20px;
   padding-right: 20px;
}

.claro #democontents.form div.demoWizardContents table.button a {
   background: none repeat scroll 0 0 transparent;
   border: 1px solid transparent;
   border-radius: 5px;
   box-sizing: border-box;
   color: #3f4752;
   cursor: pointer;
   display: inline-block;
   font: 700 1em/1.334 Arial,sans-serif;
   margin: 5px 0;
   outline: 0 none;
   padding: 5px 12px 6px;
   position: relative;
   text-align: center;
   text-decoration: none;
}

.claro #democontents.form div.demoWizardContents table.button.button_blue a {
    background: linear-gradient(#5078c2, #1b74bb) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-color: #7099db #3153a6 #2c4892;
    color: #fff;
    text-shadow: 0 -1px rgba(0, 0, 0, 0.15);
}

.claro #democontents.form div.demoWizardContents table.button.button_blue a:hover {
    background: linear-gradient(#5078c2, #32519c) repeat scroll 0 0 rgba(0, 0, 0, 0);
    color: #fff;
}

.claro #democontents.form div.demoWizardContents table.button.button_grey a {
    background: linear-gradient(to bottom, #f2f2f2 0%, #e9e9e9 32%, #e9e9e9 74%, #e9e9e9 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-color: rgba(0, 0, 0, 0.15);
    text-shadow: 0 1px rgb(255, 255, 255);
    font-weight: normal;
}

.claro #democontents.form div.demoWizardContents table.button.button_grey a:hover {
    background: linear-gradient(#fff, #ebebeb) repeat scroll 0 0 rgba(0, 0, 0, 0);
    color: #3f4752;
}

.claro #democontents.form div.demoWizardContents table.button.button_orange a {
    background: linear-gradient(#fbaa32, #f3aa57) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-color: #e88a00 #ee7300 #d86100;
    color: #fff;
}

.claro #democontents.form div.demoWizardContents table.button.button_orange a:hover {
    background: linear-gradient(#fb9500, #f35b00) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-color: #e88a00 #ee7300 #b24d00;
    color: #fff;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep2 #wizardAutosubmitStep2.disabled {
    pointer-events: none !important;
    cursor: default !important;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep2 #wizardPLStep2,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep3 #wizardPLStep3 {
    background-image: url("./../images/spinner.gif");
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    height: 16px;
    margin-left: 15px;
    vertical-align: middle;
    width: 16px;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep2 #wizardPLStep2 {
    opacity: 0;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep3 #wizardPLStep3 {
    margin-left: 25px;
    margin-top: -2px;
    opacity: 1;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep3 #wizardPLStep3.hidden {
    opacity: 0;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep2 #wizardAutosubmitStep2.disabled + #wizardPLStep2 {
    opacity: 1;
}

.claro #democontents.form div.demoWizardContents #demoWizardContentsStep1,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep2,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep3,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep4,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep5 {
   display: table;
   margin: 0 auto;
   width: 100%;
}

.claro #democontents.form div.demoWizardContents #demoWizardContentsStep2,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep3,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep4,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep5 {
   opacity: 0;
}

.claro #democontents.form div.demoWizardContents #demoWizardContentsStep1.show,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep2.show,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep3.show,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep4.show,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep5.show {
   opacity: 1;
}

.claro #democontents.form div.demoWizardContents #demoWizardContentsStep1.hidden,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep2.hidden,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep3.hidden,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep4.hidden,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep5.hidden {
   opacity: 0;
   display: none;
}

.claro #democontents.form div.demoWizardContents #demoWizardContentsStep3 #demoWizardContentsStep3Substep1.hidden,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep3 #demoWizardContentsStep3Substep2.hidden,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep4 #demoWizardContentsStep4Substep1.hidden,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep4 #demoWizardContentsStep4Substep2.hidden {
   display: none; 
}

.claro #democontents.form div.demoWizardContents #demoWizardContentsStep1 table,
.claro #democontents.form div.demoWizardContents #demoWizardContentsStep4 table {
   margin: auto;
}

.claro #democontents.form div.demoWizardContents #demoWizardContentsStep1 ol {
   position: relative;
   list-style-type: none;
   counter-reset: li-counter;
   margin-top: 14pt;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1, 
.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep2 {
   float: left;
   margin-top: 15px;
   padding-left: 5px;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1 {
   margin-left: 12%;
   font-weight: bold;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep2 {
   margin-left: 11%;
   font-weight: bold;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1 #wizardStartStep1,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1 #wizardAutofillStep1,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep2 #wizardSubmitStep1 {
   cursor: pointer;
   font-family: verdana;
   font-size: 105%;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1 #wizardCheckStep1,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep2 #wizardCheckStep2,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep3 #wizardCheckStep3,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep4 #wizardCheckStep4a,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep4 #wizardCheckStep4b {
    background-image: url("./../images/true_b.png");
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    height: 16px;
    margin-left: 10px;
    width: 16px;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep2 #wizardCheckStep2,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep3 #wizardCheckStep3,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep4 #wizardCheckStep4a,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep4 #wizardCheckStep4b {
    float: left;
    margin-right: 10px;
    margin-top: 5px;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep3 > table,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep5 > table {
    width: 100%;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep3 table tr:nth-child(2) td table,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep5 table tr:nth-child(2) td table {
    float: right;
    margin-right: 50px;
    margin-top: 25px;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep3 table tr:nth-child(2) td table #wizardNotifStep3a,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep3 table tr:nth-child(2) td table #wizardNotifStep3b,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep5 table tr:nth-child(2) td table #wizardEndStep5 {
    color: #8cc63f;
    float: left;
    font-weight: bold;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep5 table tr:nth-child(2) td table #wizardEndStep5.hidden {
    display: none;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep5 table tr:nth-child(2) td table #wizardEndStep5:hover {
    text-decoration: underline;
    cursor: pointer;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep3 table tr:nth-child(2) td table #wizardNotifStep3b,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep5 table tr:nth-child(2) td table #wizardEndStep5 {
    margin-top: -15px;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.selected #wizardCheckStep1 {
    opacity: 0;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.completed #wizardCheckStep1 {
    opacity: 1;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1 #wizardPLStep1 {
    background-image: url("./../images/spinner.gif");
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    height: 20px;
    margin-left: 15px;
    opacity: 1;
    vertical-align: middle;
    width: 20px;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1 #wizardPLStep1 {
    opacity: 0;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.selected.loading #wizardPLStep1 {
    opacity: 1;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.selected.loading a {
    pointer-events: none !important;
    cursor: default !important;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1:before {
    border: 2px solid #aaa;
    border-radius: 50%;
    content: counter(li-counter, decimal);
    counter-increment: li-counter;
    font-size: 1.2em;
    height: 1em;
    left: 16%;
    line-height: 1em;
    padding: 2px 2px 2px 3px;
    position: absolute;
    text-align: center;
    top: 0.75em;
    width: 1.1em;
    margin-left: -8%;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep2:before {
    border: 2px solid #ddd;
    border-radius: 50%;
    content: counter(li-counter, decimal);
    counter-increment: li-counter;
    font-size: 1.2em;
    height: 1em;
    line-height: 1em;
    padding: 2px 2px 2px 3px;
    position: absolute;
    left: 56%;
    text-align: center;
    top: 0.75em;
    width: 1em;
}

@media screen and (max-width: 1080px) {
    .claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep2:before {
	left: 61%;
    }
}

@media screen and (min-width: 1050px) and (max-width: 1079px){
    .claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep2:before {
	left: 60%;
    }
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.selected:before {
    background-color: #3a5cac;
    color: #f5f5f5;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.selected + li.step1Substep2:before {
    color: #ddd;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.completed:before {
    background-color: transparent;
    color: #999;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.completed + li.step1Substep2:before {
    background-color: #3a5cac;
    border: 2px solid #aaa;
    color: #f5f5f5;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.selected {
   color: #3a5cac;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.selected + li.step1Substep2 {
   color: #ccc;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.selected + li.step1Substep2 a,
.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.completed a {
   background: linear-gradient(#fff, #ebebeb) repeat scroll 0 0 rgba(0, 0, 0, 0);
   border-color: rgba(0, 0, 0, 0.15);
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.selected + li.step1Substep2 a {
   pointer-events: none;
   cursor: default;
   color: #ccc;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.completed a {
   cursor: pointer;
   color: #a7a7a7;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.completed a:hover {
    background: linear-gradient(#fff, #fff) repeat scroll 0 0 rgba(0, 0, 0, 0) !important;
    color: #999 !important;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.completed {
   color: #999;
}

.claro #democontents.form .demoWizardContents #demoWizardContentsStep1 ol li.step1Substep1.completed + li.step1Substep2 {
   color: #3a5cac;
}

.claro #democontents.form div.demoWizardLayer {
    border: 0 solid #ccc;
    display: block;
    margin: auto;
    overflow: hidden;
    padding: 0;
    position: relative;
    width: 95%;
}

.claro #democontents.form .demoWizardLayer div.demoWizardTitleLayerBox {
    position: absolute;
    left: 74%;
    top: 40px;
}

@media screen and (max-width: 1150px) {
    .claro #democontents.form .demoWizardLayer div.demoWizardTitleLayerBox {
        display: none;
    }
}
@media screen and (max-width: 1250px) and (min-width: 1150px) {
    .claro #democontents.form .demoWizardLayer div.demoWizardTitleLayerBox {
        left: 75%;
    }
}

.claro #democontents.form .demoWizardLayer table.demoWizardTitleLayer {
   height: 35px;
   margin-top: 7px;
   width: 260px;
}

.claro #democontents.form div.demoWizardLayer table.demoWizardTitleLayer td.demoWizardLogo {
   background-image: url("./../images/Lognoter_logo.png");
   background-repeat: no-repeat;
   background-size: contain;
   width: 16%;
}

.claro #democontents.form div.demoWizardLayer table.demoWizardTitleLayer td.demoWizardTitle {
   font-family: cursive;
   font-size: 1.2em;
}

.claro #democontents.form div.demoWizardLayer ul.anchor {
    background: none repeat scroll 0 0 transparent;
    border: 0 solid #cccccc;
    display: table;
    list-style: outside none none;
    margin: 10px 0 25px;
    padding: 0;
    position: relative;
}

.claro #democontents.form div.demoWizardLayer ul.anchor li {
    border: 0 solid #e0e0e0;
    display: block;
    float: left;
    margin: 0;
    padding: 0 3px;
    position: relative;
}

.claro #democontents.form div.demoWizardLayer ul.anchor li a {
    display: block;
    float: left;
    height: 35px;
    margin: 5px 0 0;
    outline-style: none;
    padding: 2px;
    position: relative;
    text-decoration: none;
    width: 190px;
    z-index: 99;
    cursor: default;
    transition: background-color 0.1s ease-in 0.1s, color 0.1s ease-in 0.1s;
}

.claro #democontents.form div.demoWizardLayer ul.anchor li a .stepNumber {
    float: left;
    font: bold 25px Verdana,Arial,Helvetica,sans-serif;
    padding: 0 20px 5px 5px;
    position: relative;
    text-align: center;
    width: 30px;
}

.claro #democontents.form div.demoWizardLayer ul.anchor li a .stepDesc {
    display: block;
    font: bold 15px Verdana,Arial,Helvetica,sans-serif;
    padding: 5px;
    position: relative;
    text-align: left;
}


.claro #democontents.form div.demoWizardLayer ul.anchor li a .stepDesc p, 
.claro #democontents.form div.demoWizardLayer ul.anchor li a .stepDesc span {
    color: inherit;
}

.claro #democontents.form div.demoWizardLayer ul.anchor li a .stepDesc small {
    font: 12px Verdana,Arial,Helvetica,sans-serif;
    margin-left: -8pt;
}

.claro #democontents.form div.demoWizardLayer ul.anchor li a.selected {
    background: none repeat scroll 0 0 #1b74bb;
    border: 1px solid #1b74bb;
    box-shadow: 1px 1px 2px #888;
    color: #f8f8f8;
    cursor: pointer;
}

.claro #democontents.form div.demoWizardLayer ul.anchor li a.selected:hover {
    color: #ffe284;
}

.claro #democontents.form div.demoWizardLayer ul.anchor li a.done {
    background: none repeat scroll 0 0 #8cc63f;
    border: 1px solid #8cc63f;
    color: #fff;
    position: relative;
    z-index: 99;
    cursor: pointer;
}

.claro #democontents.form div.demoWizardLayer ul.anchor li a.done:hover {
    color: #5a5655;
}

.claro #democontents.form div.demoWizardLayer ul.anchor li a.disabled.done {
    background: none repeat scroll 0 0 #8cc63f;
    border: 1px solid #8cc63f;
    color: #fff;
    cursor: default !important;
    pointer-events: none !important;
}

.claro #democontents.form div.demoWizardLayer ul.anchor li a.disabled.done:hover {
    color: #fff !important;
}

.claro #democontents.form div.demoWizardLayer ul.anchor li a.disabled {
    background: none repeat scroll 0 0 #f8f8f8;
    border: 1px solid #ccc;
    color: #cccccc;
    cursor: disabled;
}

.claro #democontents.form div.demoWizardLayer ul.anchor li a.disabled.selected {
    background: none repeat scroll 0 0 #f8f8f8;
    border: 1px solid #5a5655;
    box-shadow: none;
    color: #5a5655;
    cursor: pointer;
}

.claro #democontents.form div.demoWizardLayer ul.anchor li a.disabled.denied {
    cursor: default !important;
    pointer-events: none !important;
}






/* --------------------------------------------------- PROFILE AND CERTIFICATES DIALOGS ----------------------------------------------------------- */




.claro div.certsDialog,
.claro div.sigsDialog {
   min-height: 200px;
   overflow-y: auto;
   border: 1px solid #585A4D;
   border-radius: 0;
}

.claro div.certsDialog div.dijitDialogTitleBar {
   background: #f2f2f2;
   background: -moz-linear-gradient(top, #E9E9E9 0%, #e9e9e9 10%, #e9e9e9 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#E9E9E9), color-stop(10%,#e9e9e9), color-stop(100%,#e9e9e9));
   background: -webkit-linear-gradient(top, #E9E9E9 0%,#e9e9e9 10%,#e9e9e9 100%);
   background: -o-linear-gradient(top, #E9E9E9 0%,#e9e9e9 10%,#e9e9e9 100%);
   background: -ms-linear-gradient(top, #E9E9E9 0%,#e9e9e9 10%,#e9e9e9 100%);
   background: linear-gradient(to bottom, #E9E9E9 0%,#e9e9e9 10%,#e9e9e9 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E9E9E9', endColorstr='#e9e9e9',GradientType=0 );
   border: 1pt solid rgba(0, 0, 0, 0);
   border-radius: 0;
   padding-left: 10pt;
   height: 16pt;
}

.claro div.certsDialog .dijitIcon.certsProfileIcon {
   padding-left: 8pt;
   background-image: url('./../images/cert.png');
   height: 18px;
   width: 12px;
   display: inline-block;
}

.claro div.certsDialog .dijitTitleName {
   color: #585A4D !important;
}

.claro div.certsDialog div.dijitDialogPaneContent {
   background-color: #585A4D;
   padding: 10px 8px;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsChain {
   margin: 0 auto 15pt;
   height: 100%;
}

.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsChain {
   margin: 25pt auto 0;
   height: 100%;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table {
   height: 100%;
}

.claro div.usersDialog div.dijitDialogPaneContentArea h4,
.claro div.certsDialog div.dijitDialogPaneContentArea h4 {
   color: #CC3300;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsChain td,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsChain td {
   font-size: 12.5px;
   padding-top: 1pt;
   text-align: left;
   vertical-align: top;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certInfoStatus,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certInfoStatus {
   font-size: 1.2em;
   font-weight: bold;
   color: #585A4D;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certInfoStatus {
   padding: 8pt 8pt 0;
   vertical-align: middle;
   font-style: italic;
   font-size: 100%;
}

.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certInfoStatus {
   padding: 0 10pt 0 0;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certInfoContentsChainData,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certInfoContentsChainData {
   width: 320px;
   padding: 0 0 0 10pt;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certInfoContentsChainData > table,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certInfoContentsChainData > table {
   line-height: 1em;
   margin: 30pt 5pt;
   height: auto !important;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certD_val,
.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certD_exp {
   padding-left: 15pt;
   padding-top: 12pt;
}

.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certD_val,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certD_exp {
   padding-left: 25pt;
   padding-top: 12pt;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certD_val.hidden,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certD_val.hidden {
   display: none;
   opacity: 0;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certD_exp.warning p,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certD_exp.warning p {
   color: red;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certD_exp.warning.val_hidden,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certD_exp.warning.val_hidden {
   display: block;
   margin-top: -85px;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certInfoContentsChainData h4,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsChain table td.certInfoContentsChainData h4 {
   font-size: 1.35em;
   margin: 8pt 10pt;
   width: 215px;
   text-decoration: underline;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsData,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsData {
   margin: 5pt auto 10pt;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsData p,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsData p {
   padding-left: 2pt;
   margin: 0.3em auto;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsData td.certInfoContentsData b,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsData td.certInfoContentsData b {
   padding-right: 3pt;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsData td.certInfoContentsData,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsData td.certInfoContentsData {
   width: 300px;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsData td.certInfoContentsData h4,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsData td.certInfoContentsData h4 {
   font-size: 1.3em;
   margin: 5pt 0;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.certInfoContentsData tr + tr td.certInfoContentsData h4,
.claro div.certsDialog div.dijitDialogPaneContentArea table.certInfoContentsData tr + tr td.certInfoContentsData h4 {
   margin-top: 15pt;
}

.claro div.certsDialog div.dijitDialogPaneContentArea table.loginButton {
   border-top: medium none;
   margin: 5pt auto 0;
   padding-top: 0;
}

.claro div.usersDialog div.dijitDialogPaneContentArea table.formButtons {
   margin-left: 25%;
   margin-bottom: 0;
}

.claro div.certsDialog div.dijitDialogPaneContentArea table.formButtons {
   margin: 35px auto 25px;
}

.claro div.usersDialog p.expirationDate,
.claro div.certsDialog p.expirationDate {
   color: red;
   font-weight: bold;
   padding: 2pt 0 0 0;
}

.claro div.usersDialog div.dijitDialogPaneContentArea.certificateContents {
   background-color: #FAFEFF;
   text-align: center;
   margin: -20px auto 0 25px;
}

.claro div.usersDialog div.dijitDialogPaneContentArea.certificateContents table.alertDialog {
   margin: 30pt 70pt 10pt;
}

.claro div.usersDialog div.dijitDialogPaneContentArea.certificateContents table.alertDialog img {
   margin-right: 15pt;
}

.claro div.usersDialog div.dijitDialogPaneContentArea.certificateContents table.alertDialog .errorDialogStatus {
   font-size: 12pt;
   color: #23639a;
}

.claro div.usersDialog div.dijitDialogPaneContentArea.certificateContents table.loginCertNotes {
   font-size: 9pt;
   font-style: italic;
   margin: 80px 0 25px 45px;
   text-align: left;
   width: 85%;
}

.claro div.usersDialog div.dijitDialogPaneContentArea.certificateContents table.loginCertNotes td {
   margin-bottom: 5pt;
}

.claro div.usersDialog.loginDialog div.dijitDialogPaneContentArea.certificateContents {
   background-color: #FFF;
}

.claro div.certsDialog div.dijitDialogPaneContentArea.certificateContents {
   background-color: #FAFEFF;
   text-align: center;
}

.claro div.dijitDialogPaneContentArea.certificateContents p {
   font-size: 8pt;
   text-align:left;
}

.claro div.dijitDialogPaneContentArea.certificateContents td.certInfo {
   padding: 0 10pt 0 5pt;
   max-width: 180px;
   text-align: left;
}

.claro div.dijitDialogPaneContentArea.certificateContents td.certInfo:hover {
   text-decoration: underline;
   cursor: pointer;
}







/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------- PERSONAL AREA PAGE ---------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */




.claro div.personalArea {
   font-size: 0.8em;
   min-height: 700px;
   padding: 5pt 0 20pt;
}

.claro div.personalArea div.usersProfilePane {
   padding: 20pt 20pt 0;
}

.claro div.personalArea div.pAMenu,
.claro div.personalArea div.pAContents {
   width: 95%;
   margin: 15pt auto 0;
   min-width: 850px;
}

.claro div.personalArea div.pAMenu table.pAMenu {
   padding: 0 15pt;
   width: 100%;
}

.claro div.personalArea div.pAMenu table.pAMenu #pAId {
   font-size: 1.85em;
   font-weight: bold;
   padding-left: 5pt;
   color: #044364;
}

.claro div.personalArea table.pAMenu td.pf_sh_c {
   border-bottom: 1px solid rgba(102, 102, 102, 0.9);
   width: 100%;
   min-width: 3pt;
}

.claro div.personalArea table.pAMenu td.pf_sh_c:last-of-type {
   min-width: 6pt;
}

.claro div.personalArea table.pAMenu td.pf_sh_c.c {
   padding: 0 5pt;
}

.claro div.personalArea table.pAMenu td table.pAUsers,
.claro div.personalArea table.pAMenu td table.pAProfile,
.claro div.personalArea table.pAMenu td table.pANot,
.claro div.personalArea table.pAMenu td table.pADemo {
   border-color: rgba(102, 102, 102, 0.9) rgba(102, 102, 102, 0.9) transparent;
   border-radius: 10px 10px 0 0;
   border-style: solid solid solid;
   border-width: 1px 1px 1px;
   padding: 6pt 10pt 0;
   height: 48px;
   cursor: pointer;
   white-space: nowrap;
}

.claro div.personalArea table.pAMenu td table.pAUsers td,
.claro div.personalArea table.pAMenu td table.pAProfile td,
.claro div.personalArea table.pAMenu td table.pANot td,
.claro div.personalArea table.pAMenu td table.pADemo td {
   border-bottom: 2px solid #e5997f;
}

.claro div.personalArea table.pAMenu td.usersManagementSelection.pf_sh_c table.pAUsers td,
.claro div.personalArea table.pAMenu td.profileSelection.pf_sh_c table.pAProfile td,
.claro div.personalArea table.pAMenu td.notificationSelection.pf_sh_c table.pANot td,
.claro div.personalArea table.pAMenu td.liveDemoSelection.pf_sh_c table.pADemo td {
   border-bottom: 2px solid transparent;
   opacity: 0.4;
}

.claro div.personalArea table.pAMenu td.usersManagementSelection.pf_sh_c,
.claro div.personalArea table.pAMenu td.profileSelection.pf_sh_c,
.claro div.personalArea table.pAMenu td.notificationSelection.pf_sh_c,
.claro div.personalArea table.pAMenu td.liveDemoSelection.pf_sh_c {
   background-color: #F2F2F2;
   border-radius: 10pt 10pt 0 0;
}

.claro div.personalArea div.pAMenu table.pAMenu td img {
   padding: 0 3pt;
}

.claro div.personalArea div.pAMenu table.pAMenu td.managerPL {
   padding: 0 5pt 0 0;
}

.claro div.personalArea div.pAMenu table.pAMenu td.managerStatusInfo span.managerStatus_text {
   font-style: italic;
}

.claro div.personalArea div.pAMenu table.pAMenu td a {
   font-family: Calibri;
   font-size: 12pt;
}

.claro div.personalArea div.pAMenu table.pAMenu td a:hover {
   cursor: pointer;
   position: relative;
   top: 1px;
   left: 1px;
}







/* ---------------------------------------------------------------- PROFILE ---------------------------------------------------------------------- */





.claro div.usersProfilePane div.managerEditionPane {
   float: right;
   margin-right: 35px;
   margin-top: -18px;
}

.claro div.usersDialog div.usersProfilePane {
   padding-bottom: 20px;
   min-height: 100%;
   padding-top: 35px;
}

.claro div.usersDialog.loginDialog div.usersProfilePane {
   margin-top: -120px;
   margin-bottom: 0;
   min-height: 100%;
}

.claro div.personalArea div.usersProfilePane div.managerStatusPane {
   float: left;
   margin-left: 20px;
   margin-top: -19px;
   opacity: 0;
}

.claro div.personalArea div.usersProfilePane div.managerStatusPane td.managerStatusPaneText {
   color: #044364;
   font-size: 1.2em;
   font-weight: bold;
   padding-left: 10px;
   padding-top: 5px;
}

.claro div.personalArea div.usersProfilePane div.managerStatusPane td.managerStatusPaneText span.s {
   padding-left: 10pt;
   padding-right: 10pt;
}

.claro div.personalArea div.usersProfilePane div.managerEditionPane {
   margin-top: -15px;
}

.claro div.usersProfilePane div.managerEditionPane a.editButton {
   cursor: pointer;
   color: #3B5998;
   padding-right: 5pt;
}

.claro div.usersProfilePane div.managerEditionPane a.editButton:hover {
   text-decoration: underline;
}

.claro div.personalArea div.usersProfilePane div.managerConfirmPane {
   float: left;
   margin: 10px 0 auto 60px;
}

.claro div.usersProfilePane div.managerConfirmPane table.formButtons,
.claro div.usersProfilePane div.managerClosePane table.formButtons {
   margin-top: 10px;
}

div.usersDialog.loginDialog div.usersProfilePane div.managerConfirmPane {
   width: 80%;
   margin: 20pt auto 15pt;
   padding-bottom: 10pt;
   border-top: 2px solid #ACACAC;
}

div.usersDialog.loginDialog div.usersProfilePane div.managerConfirmPane table.formButtons {
   margin-top: 15pt;
   margin-left: 0;
   width: 80%;
}

.claro div.usersProfilePane div.profileStatusBox {
   width: 45%;
   float: right;
   margin: 27px 0 0;
}

.claro div.usersProfilePane div.profileStatusBox span.profileStatus_text {
   padding-left: 4pt;
   color: #3B5998;
   font-style: italic;
   min-width: 150px;
}

.claro div.usersProfilePane table.FormTable {
   padding: 0;
   width: 95%;
   margin-top: 45pt;
   margin-left: 10pt;
}

.claro div.usersProfilePane table.FormTable #Form_Profile {
   width: 100%;
}

.claro div.usersProfilePane table.FormTable #Form_d_Profile {
   width: 90%;
   margin: auto;
}

.claro div.usersProfilePane table.FormTable #Form_Profile {
   margin-top: 10px;
}

.claro div.usersDialog.loginDialog div.dijitDialogPaneContent div.usersProfilePane #Form_d_Profile {
   overflow-y: hidden;
   margin-bottom: -40px;
   width: 100%;
}

.claro div.usersProfilePane table.FormTable #Form_Profile fieldset,
.claro div.usersProfilePane table.FormTable #Form_d_Profile fieldset {
   border: none;
   background: none;
   margin: 0 auto;
}

.claro div.usersDialog div.dijitDialogPaneContent div.usersProfilePane #Form_d_Profile fieldset:first-of-type {
   margin-top: 12pt;
}

.claro div.usersDialog.manageProfileDialog div.dijitDialogPaneContent div.usersProfilePane #Form_d_Profile fieldset:first-of-type {
   margin-top: -45pt;
}

.claro div.usersDialog div.dijitDialogPaneContent div.usersProfilePane #Form_d_Profile fieldset:only-of-type {
   margin-bottom: 25pt;
}

.claro div.usersDialog.manageProfileDialog div.dijitDialogPaneContent div.usersProfilePane #Form_d_Profile fieldset:first-of-type {
   margin-bottom: 5pt;
}

.claro div.usersDialog.loginDialog div.dijitDialogPaneContent div.usersProfilePane #Form_d_Profile .login.dijitValidationTextBox,
.claro div.usersDialog.loginDialog div.dijitDialogPaneContent div.usersProfilePane #Form_d_Profile .login.dijitButtonText,
.claro div.usersDialog.loginDialog div.dijitDialogPaneContent div.usersProfilePane #Form_d_Profile .login.dijitSelect,
.claro div.usersDialog.loginDialog div.dijitDialogPaneContent div.usersProfilePane #Form_d_Profile .login.dijitSpinner .dijitInputField {
   margin-bottom: 5pt;
}

.claro div.usersDialog.manageProfileDialog {
   width: 950px;
}

.claro div.usersDialog.manageProfileDialog div.usersProfilePane div.formContainer table.formContainer {
   width: 100%;
}

.claro div.usersDialog.manageProfileDialog div.managerConfirmPane table.formButtons,
.claro div.usersDialog.manageProfileDialog div.managerClosePane table.formButtons {
   padding-top: 25px;
   padding-bottom: 5px;
}

.claro div.usersDialog.manageProfileDialog div.usersProfilePane div.formContainer table.formContainer td.fieldTitle {
   width: 20% !important;
}

.claro div.usersDialog.manageProfileDialog div.usersProfilePane div.formContainer table.formContainer td.fieldTitle + td {
   width: 30% !important;
}

.claro div.usersDialog.manageProfileDialog div.dijitDialogPaneContent div.usersProfilePane #Form_d_Profile .managerConfirmPane .formButtons {
   margin: 10px auto auto;
   width: 30%;
}

.claro div.usersDialog.manageProfileDialog div.dijitDialogPaneContent div.usersProfilePane #Form_d_Profile .managerConfirmPane .formButtons tr td:first-child {
   display: none;
}

.claro div.usersProfilePane #Form_Profile table.formContainer table.text,
.claro div.usersProfilePane #Form_Profile table.formContainer table.select {
   width: 125%;
}

.claro div.usersDialog .dijitIcon.usersProfileIcon {
   background-image: url('./../images/usersManagement.png');
   display: inline-block;
   height: 21px;
   padding-bottom: 1pt;
   padding-left: 8pt;
   width: 20px;
}

.claro div.usersDialog .dijitDialogTitleBar .dijitDialogTitle .dijitTitleName {
   color: #585A4D !important;
   font-size: 100%;
   padding-top: 3pt;
}

.claro div.usersProfilePane table.FormTable #Form_Profile fieldset legend,
.claro div.usersProfilePane table.FormTable #Form_d_Profile fieldset legend {
   color: #CC3300;
   border-bottom: 1px solid #E5997F;
   font-size: 1.4em;
   font-weight: normal;
}

.claro div.usersProfilePane table.FormTable #Form_Profile fieldset legend {
   font-size: 1.3em;
   width: 85%;
}

.claro div.usersProfilePane table.FormTable #Form_d_Profile fieldset legend {
   font-size: 1.35em;
   width: 98%;
}

.claro div.usersDialog.loginDialog div.usersProfilePane table.FormTable #Form_d_Profile fieldset legend {
   border-bottom: 1px solid #e5997f;
   color: #cc3300;
   margin-left: 60px;
   margin-bottom: 10px;
   text-align: left;
   font-weight: bold;
   width: 80%;
}

.claro div.usersProfilePane table.formContainer {
   width: 100%;
   margin: 5pt auto 10pt;
}

.claro div.usersDialog div.usersProfilePane table.formContainer {
   width: 90%;
}

.claro div.usersDialog.loginDialog div.usersProfilePane table.formContainer {
   width: 80%;
}

.claro div.personalArea div.usersProfilePane table.formContainer td.fieldTitle {
   font-size: 1.25em;
}

.claro div.personalArea div.usersProfilePane table.formContainer td.fieldTitle + td.fieldInput {
   font-size: 1.25em;
   padding-top: 3px
}

.claro div.usersProfilePane table.formContainer td.fieldTitle + td {
   padding-top: 1pt;
   padding-bottom: 0;
}

.claro div.usersProfilePane table.formContainer .widget {
   padding-left: 1pt;
}






/* ---------------------------------------------------------------- NOTIFICATIONS ---------------------------------------------------------------- */




.claro div.notificationsViewAdmin {
   text-align: right;
   padding-top: 5pt;
   height: 20px;
   width: 96%;
}

.claro div.notificationsViewAdmin.hide {
   visibility: hidden;
}

.claro div.notificationsMenu.hide {
   display: none;
}

.claro div.notificationsViewAdmin a {
   color: #3B5998;
   cursor: pointer;
}

.claro #notM,
.claro #notC,
.claro #notAdminView {
   display: none;
}

.claro div.notificationsMenu table.notificationsManager {
   width: 92%;
   margin: 30pt auto 0;
}

.claro div.notificationsMenu table.notificationsManager.hidden {
   visibility: hidden;
   margin-bottom: -10px !important;
}

.claro div.notificationsViewAdmin ~ div.notificationsMenu table.notificationsManager {
   margin: 20pt auto 5pt;
}

.claro table.usersManager td table.usersManagerContainer2 td.pf_sh_c,
.claro table.notificationsManager td.pf_sh_c {
   border-bottom: 1px solid #E5997F;
   min-width: 5pt;
} 

.claro table.usersManager td table.usersManagerContainer2 td.pf_sh_c:first-of-type {
   min-width: 0;
}

.claro table.notificationsManager td.pf_sh_c:first-of-type {
   min-width: 8pt;
} 

.claro table.usersManager td table.usersManagerContainer2 td.pf_sh_c:last-of-type,
.claro table.notificationsManager td.pf_sh_c:last-of-type {
   width: 100%;
} 

.claro table.usersManager td table.usersManagerContainer2 td.pf_sh_c.c {
   padding: 0 5pt;
}

.claro table.usersManager td table.usersManagerContainer2 td.usersSelection,
.claro table.usersManager td table.usersManagerContainer2 td.profileSelection,
.claro table.usersManager td table.usersManagerContainer2 td.certificateSelection,
.claro table.usersManager td table.usersManagerContainer2 td.signatureSelection,
.claro table.notificationsManager td.notificationSelection {
   border-color: #E5997F #E5997F transparent;
   border-radius: 10px 10px 0 0;
   border-style: solid solid solid;
   border-width: 1px 1px 1px;
   padding: 2pt 10pt 0;
   height: 35px;
   cursor: pointer;
   color: #CC3300;
   white-space: nowrap;
}

.claro table.usersManager td table.usersManagerContainer2 td.usersSelection.pf_sh_c,
.claro table.usersManager td table.usersManagerContainer2 td.profileSelection.pf_sh_c,
.claro table.usersManager td table.usersManagerContainer2 td.certificateSelection.pf_sh_c,
.claro table.usersManager td table.usersManagerContainer2 td.signatureSelection.pf_sh_c,
.claro table.notificationsManager td.notificationSelection.pf_sh_c {
   border-bottom: 1px solid #E5997F;
   background-color: #FBF1E9;
}

.claro table.usersManager td table.usersManagerContainer2 td.usersSelection,
.claro table.usersManager td table.usersManagerContainer2 td.profileSelection {
   min-width: 85px;
   background-color: #f9fdff;
}

.claro table.usersManager td table.usersManagerContainer2 td.certificateSelection,
.claro table.usersManager td table.usersManagerContainer2 td.signatureSelection {
   min-width: 110px;
   background-color: #f9fdff;
}

.claro table.usersManager span.nIconGlobe,
.claro table.notificationsManager span.nIconGlobe {
   width: 12px;
   height: 16px;
   display: inline-block; 
   position: relative;
   text-decoration: none;
   margin-left: 20px;
}

.claro table.usersManager span.nIconGlobe span.nCount,
.claro table.notificationsManager span.nIconGlobe span.nCount {
   opacity: 0;
   background-color: #FE2E2E;
   border: 1px solid red;
   color: #FFFFFF;
   font-family: tahoma,arial,'sans-serif';
   font-size: 9px;
   font-weight: bold;
   position: absolute;
   padding-right: 3px;
   padding-left: 3px;
   top: -1px;
   right: -1px;

}

.claro div.notificationsContents {
   height: 100% !important;
   margin: auto;
   min-height: 600px;
   padding-bottom: 20pt;
   width: 100%;
}

.claro div.notificationsContents table.notificationsContents {
   margin: auto;
   padding-bottom: 80px;
   padding-top: 50px;
   width: 92%;
}

.claro div.notificationsContents table.notificationsWelcome {
   width: 90%;
   margin: -60px auto auto;
   padding-bottom: 80px;
   font-size: 1.25em;
   color: #3F4752;
}

.claro div.notificationsContents table.demoWelcome {
   width: 85%;
   margin: auto;
   padding-top: 30pt;
   padding-bottom: 80px;
   font-size: 1.25em;
   color: #3F4752;
}

.claro div.notificationsContents table.notificationsWelcome table.notificationsWelcomeC:nth-child(2),
.claro div.notificationsContents table.demoWelcome table.demoWelcomeC:nth-child(2) {
   width: 98%;
   padding-top: 15px;
   margin: auto;
}

.claro div.notificationsContents table.notificationsWelcome.warning table.notificationsWelcomeC:nth-child(2) {
   width: 100%;
}

.claro div.notificationsContents table.notificationsWelcome table.notificationsWelcomeC:nth-child(2) tr:nth-child(2) td {
   padding-top: 10px;
}

.claro div.notificationsContents table.notificationsWelcome table.notificationsWelcomeC td.notificationsWelcomeT,
.claro div.notificationsContents table.demoWelcome table.demoWelcomeC td.demoWelcomeT {
   padding-right: 15px;
}

.claro div.notificationsContents table.notificationsWelcome.warning table.notificationsWelcomeC td.notificationsWelcomeT {
   padding-right: 25px;
}

.claro div.formContents div.deniedFormBox {
   padding-top: 120px;
}

.claro div.formContents table.deniedForm {
   width: 65%;
   margin: auto;
   font-size: 1.5em;
   color: #3F4752;
   border: 1px solid #bababa;
   border-radius: 5px;
   padding: 50px 60px;
   margin: auto;
   background: #ffffff;
   background: -moz-linear-gradient(top, #ffffff 0%, #f6f8fa 33%, #f2f6f8 67%, #e5edf1 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(33%,#f6f8fa), color-stop(67%,#f2f6f8), color-stop(100%,#e5edf1));
   background: -webkit-linear-gradient(top, #ffffff 0%,#f6f8fa 33%,#f2f6f8 67%,#e5edf1 100%);
   background: -o-linear-gradient(top, #ffffff 0%,#f6f8fa 33%,#f2f6f8 67%,#e5edf1 100%);
   background: -ms-linear-gradient(top, #ffffff 0%,#f6f8fa 33%,#f2f6f8 67%,#e5edf1 100%);
   background: linear-gradient(to bottom, #ffffff 0%,#f6f8fa 33%,#f2f6f8 67%,#e5edf1 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5edf1',GradientType=1 );
   opacity: 0;
}

.claro div.formContents table.deniedForm td.deniedFormT {
   padding-right: 20px;
}

.claro div.formContents table.deniedForm tr:nth-child(2) td {
   padding-top: 15px;
   padding-left: 85px;
}

.claro div.notificationsContents div.notifications {
   background-color: #FFFFFF;
   border-bottom: 1px solid rgba(102, 102, 102, 0.7);
   margin: 0 auto 45px;
   padding: 0;
   width: 80%;
}

.claro div.notificationsContents div.notifications table.notifications tr:nth-child(2n+1) td + td {
    background: #ffffff;
    background: -moz-linear-gradient(left, #ffffff 0%, #f6f8fa 33%, #f2f6f8 67%, #e5edf1 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#ffffff), color-stop(33%,#f6f8fa), color-stop(67%,#f2f6f8), color-stop(100%,#e5edf1));
    background: -webkit-linear-gradient(left, #ffffff 0%,#f6f8fa 33%,#f2f6f8 67%,#e5edf1 100%);
    background: -o-linear-gradient(left, #ffffff 0%,#f6f8fa 33%,#f2f6f8 67%,#e5edf1 100%);
    background: -ms-linear-gradient(left, #ffffff 0%,#f6f8fa 33%,#f2f6f8 67%,#e5edf1 100%);
    background: linear-gradient(to right, #ffffff 0%,#f6f8fa 33%,#f2f6f8 67%,#e5edf1 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5edf1',GradientType=1 );
}

.claro div.notificationsContents div.notifications table.notifications tr:first-child td,
.claro div.notificationsContents div.notifications table.notifications tr:first-child td.notificationsIcon {
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #f6f8fa 33%, #f2f6f8 67%, #e5edf1 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(33%,#f6f8fa), color-stop(67%,#f2f6f8), color-stop(100%,#e5edf1));
    background: -webkit-linear-gradient(top, #ffffff 0%,#f6f8fa 33%,#f2f6f8 67%,#e5edf1 100%);
    background: -o-linear-gradient(top, #ffffff 0%,#f6f8fa 33%,#f2f6f8 67%,#e5edf1 100%);
    background: -ms-linear-gradient(top, #ffffff 0%,#f6f8fa 33%,#f2f6f8 67%,#e5edf1 100%);
    background: linear-gradient(to bottom, #ffffff 0%,#f6f8fa 33%,#f2f6f8 67%,#e5edf1 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5edf1',GradientType=1 );
    border-bottom: 1px solid rgba(102, 102, 102, 0.7);
    border-top: 1px solid rgba(102, 102, 102, 0.4);
    border-left: 1px solid rgba(102, 102, 102, 0.4);
    font-size: 1.25em;
}

.claro div.notificationsContents div.notifications table.notifications td:first-child {
    border-left: medium none;
}

.claro div.notificationsContents div.notifications table.notifications td {
    border-left: 1px solid #E1EEF4;
    border-bottom: 1px solid rgba(102, 102, 102, 0.2);
    color: #00496B;
    font-size: 12px;
    font-weight: normal;
    padding: 6px 10px;
}

.claro div.notificationsContents div.notifications table.notifications tr {
    display: none;
}

.claro div.notificationsContents div.notifications table.notifications tr:first-child,
.claro div.notificationsContents div.notifications table.notifications tr.nd_v {
    display: block !important;
}

.claro div.notificationsContents div.notifications div.notificationsData {
   height: 210px;
   font-size: 1em;
   overflow: hidden;
}

.claro div.notificationsContents div.notifications div.notificationsData .notifications {
   width: 100%;
}

.claro div.notificationsContents div.notifications div.scrollNotifications {
   height: 25px;
   margin-top: 25px;
}

.claro div.notificationsContents div.notifications div.scrollNotifications div.notificationsDivisionControl {
   display: none !important;
}

.claro div.notificationsContents div.notifications div.scrollNotifications div.nextNotifications,
.claro div.notificationsContents div.notifications div.scrollNotifications div.backNotifications {
   float: left;
   cursor: pointer;
   color: #00496B;
   display: none;
   padding-right: 8pt;
}

.claro div.notificationsContents div.notifications div.scrollNotifications div.expandNotification {
   float: right;
   cursor: pointer;
}

.claro div.notificationsContents table.notifications td.notificationsIcon {
   border-left: none !important;
   border-bottom: 1px solid rgba(102, 102, 102, 0.7);
   border-right: 1px solid rgba(102, 102, 102, 0.4);
}

.claro div.notificationsContents table.notifications td.notificationsIcon img:hover {
   position: relative;
   top: 1px;
   left: 1px;
}

.claro div.notificationsContents table.notifications td.notificationsPage {
   width: 100%;
   font-size: 1.6em;
   padding: 12pt 5pt 18pt; 
}

.claro div.notificationsContents table.notifications td.notificationsNoNews {
   color: #CC3300;
   border: none !important;
   display: block !important;
   font-family: calibri;
   font-size: 15px !important;
   margin-top: 15pt;
}

.claro div.notificationsContents table.notifications td.notificationsError {
   font-family: calibri;
   font-size: 1.6em;
   color: red;
   padding-left: 10pt;
}

.claro div.notificationsContents table.notifications tr.notificationsDivision:hover td {
   background: none !important;
   background-color: #FBFBCA !important;
}

.claro div.notificationsContents table.notifications tr.notificationsDivision td.notificationsNews {
   width: 95%;
   height: 20px;
   cursor: pointer;
}

.claro div.notificationsContents table.notifications tr.notificationsDivision td.notificationsNews div:first-child {
   float: left;
}

.claro div.notificationsContents table.notifications tr.notificationsDivision td.notificationsNews div:first-child + div {
   float: right;
   padding-right: 5pt;
   color: grey;
}

.claro div.notificationsContents table.notifications tr.notificationsDivision td.notificationsNewsNum {
   width: 50px;
}






/* ----------------------------------------------- USER, CERTIFICATE AND SIGNATURE BUTTON ICONS -------------------------------------------------- */



.claro .createIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/users/createUser.png') no-repeat 100% 50%;
}

.claro .dijitDisabled .createIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/users/createUser.png') no-repeat 100% 50%;
   opacity: 0.3;
   filter: alpha(opacity=30);
}

.claro .permissionsIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/users/permissionsUser.png') no-repeat 100% 50%;
}

.claro .dijitDisabled .permissionsIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/users/permissionsUser.png') no-repeat 100% 50%;
   opacity: 0.3;
   filter: alpha(opacity=30);
}

.claro .passwordIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/users/passwordUser.png') no-repeat 100% 50%;
}

.claro .dijitDisabled .passwordIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/users/passwordUser.png') no-repeat 100% 50%;
   opacity: 0.3;
   filter: alpha(opacity=30);
}

.claro .activateUserIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/users/activateUser.png') no-repeat 100% 50%;
}

.claro .dijitDisabled .activateUserIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/users/activateUser.png') no-repeat 100% 50%;
   opacity: 0.3;
   filter: alpha(opacity=30);
}

.claro .activateSigIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/sigs/activateSig.png') no-repeat 100% 50%;
}

.claro .dijitDisabled .activateSigIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/sigs/activateSig.png') no-repeat 100% 50%;
   opacity: 0.3;
   filter: alpha(opacity=30);
}

.claro .inactivateUserIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/users/inactivateUser.png') no-repeat 100% 50%;
}

.claro .dijitDisabled .inactivateUserIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/users/inactivateUser.png') no-repeat 100% 50%;
   opacity: 0.3;
   filter: alpha(opacity=30);
}

.claro .revokeSigIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/sigs/revokeSig.png') no-repeat 100% 50%;
}

.claro .dijitDisabled .revokeSigIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/sigs/revokeSig.png') no-repeat 100% 50%;
   opacity: 0.3;
   filter: alpha(opacity=30);
}

.claro .removeUserIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/users/removeUser.png') no-repeat 100% 50%;
}

.claro .dijitDisabled .removeUserIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/users/removeUser.png') no-repeat 100% 50%;
   opacity: 0.3;
   filter: alpha(opacity=30);
}

.claro .removeSigIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/sigs/removeSig.png') no-repeat 100% 50%;
}

.claro .dijitDisabled .removeSigIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/sigs/removeSig.png') no-repeat 100% 50%;
   opacity: 0.3;
   filter: alpha(opacity=30);
}

.claro .undoIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/undo.png') no-repeat 50% 50%;
}

.claro .dijitDisabled .undoIcon {
   width: 24px; 
   height: 18px;
   background: url('./../images/undo.png') no-repeat 50% 50%;
   opacity: 0.3;
   filter: alpha(opacity=30);
}


.claro .checkIcon {
   background: url("./../images/true_b.png") no-repeat scroll 100% 50% transparent;
   height: 16px;
   width: 16px;
}





/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------- SEARCH PAGE ------------------------------------------------------------------ */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */



#search_frame {
   margin-top: 15px;
}

.mixed-search .unveil {
   opacity: 1;
   transition: opacity 0.1s ease-out 0s;
}

.srp-search {
    display: table;
    margin: 40px auto 10px;
    position: relative;
    width: 95%;
}

.srp-search-wrapper {
   width: 100%;
}

.srp-search-wrapper .field-with-placeholder label.focus, .srp-search-wrapper .field-with-placeholder .placeholder.focus {
   color: #CCCCCC;
}

.srp-search-wrapper .field-with-placeholder label {
   color: #999999;
   opacity: 1;
   padding: 8px 0 0 25px;
   pointer-events: none;
   position: absolute;
   text-indent: 0;
   transition: color 200ms linear 0s;
   white-space: nowrap;
}

.mixed-search .field-with-placeholder {
   display: table;
   padding: 0;
   position: relative;
   vertical-align: inherit;
   width: 100%;
}

span.field-with-placeholder label.placeholder span {
   font-size: 12px;
   line-height: 1.3;
   padding: 0;
   position: inherit;
}

.srp-search .left-wrapper {
   display: table-cell;
   line-height: 1;
   width: 100%;
}

.srp-search-wrapper .placeholder.hidden {
   overflow: hidden;
   padding: 0;
   text-indent: -9999px;
}

.srp-search input {
   background: url('./../images/magnifier.png') no-repeat scroll 12px 10px #FFFFFF;
   border-color: #B9B9B9;
   -moz-use-text-color #D8D8D8 #D8D8D8;
   border-image: none;
   border-radius: 3px 0 0 3px;
   border-style: solid none solid solid;
   border-width: 1px 0 1px 1px;
   color: #000000;
   font-size: 12px;
   height: 20px;
   line-height: 1;
   padding: 7px 32px 6px;
   width: 100%;
}

.srp-search input:focus, span.field-with-placeholder input.editing {
   background: url('./../images/magnifier.png') no-repeat scroll 12px 10px #FFFFFF;
   box-shadow: none;
   border-color: #2A7EB7;
}

.srp-search .right-wrapper {
   display: table-cell;
   vertical-align: top;
}

.srp-search .search-reset {
   background: url('./../images/close.png') no-repeat scroll 0 0 / 19px 19px transparent;
   cursor: pointer;
   height: 20px;
   position: absolute;
   right: 100px;
   top: 8px;
   width: 18px;
}

.srp-search .search-spinner {
   background: url('./../images/spinner.gif') no-repeat scroll 1px 1px / 17px 17px #FFFFFF;
   height: 18px;
   position: absolute;
   right: 100px;
   top: 8px;
   width: 18px;
}

.xs, .replaced, .a11y {
   clip: rect(1px, 1px, 1px, 1px);
   height: 1px;
   overflow: hidden;
   position: absolute !important;
   width: 1px;
}

button {
   color: #333333;
   font: 11px/1.5 "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
}

.button {
   border: 0 none;
   border-collapse: separate;
   cursor: pointer;
   font: 11px/1.5 "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
   overflow: visible;
   position: relative;
}

.button.srp-blue .label {
   text-shadow: 0 -1px 2px rgba(0, 0, 0, 0.12);
}

.button.srp-blue {
   background-color: #4D90FE;
   background-image: -moz-linear-gradient(center top , #4D90FE, #4787ED);
   border-color: #D3D3D3;
   text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
   border-bottom-right-radius: 3px;
   border-top-right-radius: 3px;
   display: block;
   height: 35px;
}

.button.srp-blue .fill {
   background-color: #4D90FE;
   background-image: -moz-linear-gradient(center top , #4D90FE, #4787ED);
   border-color: #D3D3D3;
   text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
   border: 0 none;
   border-radius: 0 3px 3px 0;
   box-shadow: none;
   padding: 5px 14px;
}

.button.srp-blue:hover, .button.srp-blue:focus {
   background-color: #3D71B0;
   background-image: -moz-linear-gradient(center top , #3D71B0, #2E64FE);
   border-color: #3D71B0;
}

.button.srp-blue:hover .fill, .button.srp-blue:focus .fill {
   background-color: #3D71B0;
   background-image: -moz-linear-gradient(center top , #3D71B0, #2E64FE);
   border-color: #3D71B0;
}

a img, *:link img, button {
   border: 0 none;
}

body, input, textarea, button, legend {
   color: #333333;
   font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
}

.button > span {
   color: white;
   display: inline-block;
   font: 12px/1 "Lucida Grande","Lucida Sans Unicode",Helvetica,Arial,sans-serif;
   letter-spacing: 0;
   opacity: 1;
   position: relative;
   text-align: center;
   transition: opacity 800ms ease 0s;
   white-space: nowrap;
   word-spacing: 0;
}

.button.srp-blue .label {
   text-shadow: 0 -1px 2px rgba(0, 0, 0, 0.12);
   font-weight: bold;
}

#search_resume {
    color: #084B8A;
    font-family: Arial,Helvetica,sans-serif;
    margin: 20px auto;
    padding: 5px 20px 0 0;
    text-align: right;
    width: 95%;
}

#search_results {
   margin: auto;
   width: 95%;
   min-height: 600px;
}

#search_results ul {
   list-style: none outside none;
   margin: auto;
   padding: 0;
}

#search_results ul li {
   border-bottom: 1px solid #CACACA;
   padding: 20px 0 15px;
}

#search_results ul li a {
   text-decoration: none;
   color: #0088CC;
}

#search_results ul li a:hover {
   text-decoration: underline;
}

#search_results ul li p {
   padding: 15px 0 0 2px;
}

.claro table.search {
   margin: 10pt;
}

.claro table.search td {
   vertical-align: middle;
}

.claro table.search td table.searchWidget {
   float: right;
   border: 1px solid #B5BCC7;
}

.claro table.search td table.searchWidget td.searchInput {
   padding: 0;
}

.claro table.search td table.searchWidget td.searchInput div.dijitTextBox {
   border: 0 none;
}

.claro table.search td table.searchWidget td.searchClearIcon {
   width: 10pt;
   vertical-align: middle;
   padding: 0 2pt 0 1pt;
   background-color: #fff;
   transition-duration: 0.25s;
   -webkit-transition-duration: 0.25s;
}

.claro table.search td table.searchWidget td.searchClearIcon img:hover {
   cursor: pointer;
   position: relative;
   top: 1px;
   left: 1px;
}

.claro table.search td.searchButton {
   padding: 0 20pt 0 8pt;
}

.claro #searchResults {
   margin: 20pt 0 0 25pt;
}

.claro #searchResults h4 {
   margin: 0 0 15pt 0;
}

.claro #searchResults table tr:first-child td {
   padding: 0 0 10pt 0;
}

.claro #searchResults a:hover {
   text-decoration: underline;
}

#main-navigation {
    left: 0;
    position: absolute;
    top: 130px;
}


.main-navigation-item.slogan {
    -moz-box-sizing: border-box;
    background-color: #2F3339;
    color: #FFF;
}


.main-navigation-item {
    height: 45px;
    margin-bottom: 5px;
    padding-left: 20px;
    font-size: 1.2em;
    position: relative;
    text-align: left;
    width: 300px;
}

.main-navigation-item  > p,
.main-navigation-item  > a {
    color: #FFF !important;
}

.claro #gContents table td > ul#main-navigation-links,
#main-navigation-links {
    padding-left: 0 !important;
    list-style: none outside none;
}

.main-navigation-item-popup {
    -moz-box-sizing: border-box;
    background-color: #FFFFFF;
    box-shadow: 5px 5px 10px #666666;
    color: #000000;
    font-weight: normal;
    left: 100%;
    margin-left: 3px;
    opacity: 0;
    padding: 10px 15px 20px;
    position: absolute;
    top: 0;
    width: 255px;
    z-index: -1;
    text-align: left;
}

.main-navigation-item-popup img {
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.8);
    margin: 25px 20px;
    text-align: center;
    vertical-align: top;
    width: 190px;
}


.main-navigation-item.mobileactive .main-navigation-item-popup, 
.main-navigation-item:hover .main-navigation-item-popup {
    opacity: 1;
    z-index: 1;
}

.main-navigation-link {
    -moz-box-sizing: border-box;
    background-color: rgba(0, 103, 172, 0.9);
    color: #EEEEEE;
    display: block;
    font-size: 1.2em;
    font-weight: bold;
    line-height: 50px;
    height: 34px;
    padding-top: 7px;
    text-decoration: none;
    width: 300px;
}

.animate {
    transition: all 0.3s ease-in 0s;
}


.main-navigation-item.mobileactive .main-navigation-link, 
.main-navigation-link:hover {
    background-color: #004B79;
}





/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------- WIKI PAGE ------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------------------------------------------- */



.claro table.wikiEditor {
   width: 95%;
   border: 0 none;
   margin: 15pt auto;
}

.claro .wiki_area.dijitTextArea {
   margin: 0 auto;
}

.claro h3.wiki {
   font-size: 14pt;
   color: #2E40A5;
}

.claro table.wiki_buttons {
   width: 100%;
   border: 0 none;
   margin: 1pt auto;
   padding: 0pt;
}

.claro table.wiki_buttons_preview {
   width: 100%;
   border-bottom: 2px solid #759DC0;
   margin-bottom: 15px;
}













