/* Style for General cbl_LayoutMVC.css */

/* Importing Styles */



@import url("../lib.css");


body
{
  background: #fff;
}

/* Class : .CBL_wrapper */

.CBL_wrapper
{
  /*width: 88%;
  max-width: 88%;*/
  /*width: calc( 100% - 200px );*/
  width: calc( 100% - 260px );
  height: 100vh !important;
  min-height: 100% !important;
  /* background: #D3D6D8;*/
  float: right;
  margin-top: 3em !important;
  padding-left: .25em;
  padding-right: .25em;
}

/* Class  .CblWrapperToggle */
.CblWrapperToggle
{
  width: 98vw !important;
  max-width: 98vw !important;
  float: left;
  /*border: solid 1px green;*/
}


/* ------------------------------------  / ToggleClass .CBL_wrapper */
    /* Class: .container */
    .CBL_wrapper .container {
        width: 97% !important;
        height: 100%;
        margin: auto !important;
        min-height: 100% !important;
        padding: 1em;
        margin-top: 2em;
        float: left;
        /*margin-left: 1em !important;*/
        /*border: solid 1px;*/
    }



    .CBL_wrapper .cbl-container
    {
      display: flex;

    }

    /* container general of the page  [ Notice: Not using the class .container will affect all page ] */
    .CBL_wrapper #PanelContainer
    {
        margin-top: .51em !important;
    }

              .CBL_wrapper .container .row {
                    float: left;
                    clear: both;
                    width: 95%; /* modified */
          
                    margin-top: 0.15em;
                    margin-left:0em;
                    margin-right: 0em;
                    margin-bottom:0.15em;
                    line-height: 1em !important
                }


    /* h3 tag principal item && sub-items titles h5 */
    .CBL_wrapper .container h3
    {

        /*margin-left: -1em;*/
        margin-top: 0em;
        margin-bottom: .45em;
        padding-top: 0em;
        padding-left:.25em;
        padding-right:0em;
        padding-bottom: 0em;
        line-height: 1.75em;
     
    }


        .CBL_wrapper .container h5
        {

            /*margin-left: -0.25em;*/
            margin-top: 0em;
            margin-bottom: .45em;
            padding-top: 0em;
            padding-left:.25em;
            padding-right:0em;
            padding-bottom: 0em;
            line-height: 1.75em;
           
        }

        .CBL_wrapper .container h5.cblSubHeader
        {
            /*border: solid 1px;*/
            max-width: 300px;
        }

  


        .CBL_wrapper .container h3 span.fas
        {
            color: #0d47a1;
            text-shadow: .25em 0em .25em rgba(13,71,161,.5);
        }


        .cbl-container,
        .cbl-container-fluid
        {
            width : 98%;
            max-width : 100%;
            margin : 1.25em auto;
            padding-left: .9375em;
            padding-right : .9375em;
            border : var(--border);
        }

        .cbl-text-align-center
        {
          text-align : center;
        }


        .cbl-span
        {
          font-size: 1em;
          text-align: center;
         /* border : solid 1px #fff; */
        }

        .cbl-row
        {
           display : flex;
                display: -ms-flexbox;
            flex-direction : row;
                -ms-flex-direction: row;
            width : 100%;
            max-width : 100%;
            margin: auto auto;
            float: left;

        }


/* ++++++++++++++++++++++++++++++++++++++++++++++
              START : EMANUAL
    ++++++++++++++++++++++++++++++++++++++++++++  */



    .modal#folderPropertiesModal
    {

    }

    .modal#myModal
    {

    }

    .modal#myModal,
    .modal#folderPropertiesModal
    {
      border: solid 1px #368ee0;

      box-shadow: 0em 0em .25em rgba(13,71,161,.5);
        -webkit-box-shadow: 0em 0em .25em rgba(13,71,161,.5);
        -moz-box-shadow: 0em 0em .25em rgba(13,71,161,.5);
        -ms-box-shadow: 0em 0em .25em rgba(13,71,161,.5);
        -o-box-shadow: 0em 0em .25em rgba(13,71,161,.5);

    }

        .modal.modal-dialog

        {
           /*margin: auto auto;*/
        }

        .modal  .modal-content
        {
            margin-top: -7.1em !important;
        }

             .modal  .modal-header
             {
                 background: #368ee0;
                 border-bottom: solid .25em #2E86C1;
                 color: #fff;
             }

             .modal .modal-header button.close,
             .modal .modal-header #myModalLabel
             {
                 color: #fff;
             }

             .modal .modal-footer
             {
                 text-align: right !important;
                 background: transparent;
             }

             .modal .modal-footer .RadButton_Metro.CblBtnSave
             {
                 float: right !important;
                 margin-left: 1em;
             }



             /* #windowManagerfileExplorerUpload */
            body  form .RadWindow #ctl00_ContentPlaceHolder1_FileExplorer1_uploadContainer
             {
                 height: 100px !important;
             }
                  /*body  form .RadWindow  div.rfeUploadButtonContainer,
                  body  form .RadWindow  div.rfeUploadButtonContainer button.RadButton_Metro
                  {
                      border: solid 0em transparent;
                  }

                  body  form .RadWindow  div.rfeUploadButtonContainer:hover
                  {
                      color: #000 !important;
                  }*/


                   body  form .RadWindow button#ctl00_ContentPlaceHolder1_FileExplorer1_btnUpload
                   {
                       margin-top: -0.25em;
                   }

                          body .RadUpload_Metro .ruSelectWrap .ruFakeInput
                          {
                              border-color: transparent !important;
                              border: solid 0em transparent !important;
                              color: #000;
                          }


                          html .RadUpload .ruSelectWrap .ruButton.ruButtonHover
                          {
                              color: #000 !important;
                          }
     /*div#sendFeedback
     {
         width: 50%;
         height: 4em;
         float: right;
         display: block !important;
     }*/
    /* ++++++++++++++++++++++++++++++++++++++++++++++
                  END : EMANUAL
        ++++++++++++++++++++++++++++++++++++++++++++  */


/*  +++++++++++++++++++++++++++++++++
  Start : Alineation Text
+++++++++++++++++++++++++++++++++ */
    .cbl-text-align-center
    {
        text-align : center;
    }

    .cbl-text-align-left
    {
      text-align: left;
    }

    .cbl-text-align-right
    {
      text-align: right;
    }

    .cbl-text-align-justify
    {
      text-align: justify;
    }

    .cbl-text-align-end
    {
        text-align: end;
    }

    .cbl-text-align-start
    {
        text-align: start;
    }


    .cbl-text-align-revert
    {
        text-align: revert;
    }


    .cbl-text-align-initial
    {
        text-align: initial;
    }


    .cbl-text-align-unset
    {
        text-align: unset;
    }

/*  +++++++++++++++++++++++++++++++++
    End : Alineation text
+++++++++++++++++++++++++++++++++ */



/*++++++++++++++++++++++++++++++++
  Start : Common Display
  ++++++++++++++++++++++++++++++++ */

  /* display : none */
  .cbl-d-none
  {
    display: none;
  }

  /* display : inline */
  .cbl-d-inline
  {
    display: inline;
  }

  /* display : block */
  .cbl-d-block
  {
    display: block;
  }

  /* display : inline-block */
  .cbl-d-inline-block
  {
    display: inline-block;
  }

  .cbl-display-inline-grid
  {
      display: inline-grid !important;
  }

  .cbl-display-table
  {
      display: table  !important;
  }


/*++++++++++++++++++++++++++++++++
    End  : Common Display
  ++++++++++++++++++++++++++++++++ */


/* ++++++++++++++++++++++++++++++++++
       Start : Width
   ++++++++++++++++++++++++++++++++++ */

.cblWauto
{
    width: auto !important;
}

.cblW25p
{
    min-width: 25px !important;
}
.cblW50p
{
    width: 48%;
    padding-left: .15em;
    padding-right: .15em;
}

.cblW60p {
    width: 60%;
    padding-left: .15em;
    padding-right: .15em;
}

.cblW68p {
    width: 68%;
    padding-left: .15em;
    padding-right: .15em;
}


.cblW75p
{
    width: 75%;
    padding-left: .15em;
    padding-right: .15em;
}


.cblW90p
{
    width:90%;
    padding-left: .15em;
    padding-right: .15em;
}

.cblW82D5p
{
    width: 82.5%;
    padding-left: .15em;
    padding-right: .15em;
}


.cblW100p
{
    width: 100%;
    padding-left: .15em;
    padding-right: .15em;
}

.cblJW100pH100p {

}

.cblMaxW75p
{
   max-width: 75%;
}


.cblMaxW27p
{
   max-width: 27%;
}

.cblMaxW16em{
  max-width: 16em;
}



.cblW98p
{
    width: 98%;
}

.cblMinW5em
{
    min-width: 5em !important;
}

.cblMinW10em
{
    min-width: 10em !important;
}

.cblMinW11em
{
    min-width: 11em !important;
}

.cblW4em
{
    width: 4em;
}

.cblW9em
{
    width: 9em;
}

.cblW13em
{
    width: 13em;
}
.cblW15em
{
    width: 15em !important;
}

.cblW16em
{
    width: 16em !important;
}

.cblMinW16d5em
{
   min-width:16.5em !important;
}

.cblW18em
{
    width: 18em !important;
}


.cblMinW98p
{
    min-width: 98% !important;
}

.cblMinW12em
{
  min-width: 12em;
}

.cblMinW230p
{
    min-width: 230px;
}


.cblMinW28em{
    min-width: 28em !important;

}

.cblMinW75em
{
    min-width: 75em;
}

.cblW75em
{
    width: 75em;
}

.cblWMin19em
{
  min-width: 19em !important;
}

.cblMinW24em
{
    min-width: 24em !important;
}

.cblW200px
{
  width: 200px !important;
}


.cblW25em
{
    width: 25em !important;
}


.cblW37em
{
    width : 37em !important;
}


.cblW36em
{
    width : 36em !important;
}


.cblW35em
{
    width : 35em !important;
}


.cblW34em
{
    width : 34em !important;
}
/* ++++++++++++++++++++++++++++++++++
       End : Width
   ++++++++++++++++++++++++++++++++++ */


/* ++++++++++++++++++++++++++++++++++
       Start : Height
   ++++++++++++++++++++++++++++++++++ */
.cbl-height-auto
{
    height: auto !important;
}

.cbl-height-1em
{
    height: 1em !important;
}

.cbl-height-3em
{
    height: 3em !important;
}

.cbl-height-4em
{
    height: 4em !important;
}

.cbl-height-5em
{
    height: 5em !important;
}

.cbl-height-6em
{
    height: 6em !important;
}

.cbl-height-7em
{
    height: 7em !important;
}

.cbl-height-8em
{
    height: 9em !important;
}

.cbl-height-9em
{
    height: 9em !important;
}

.cbl-height-10em
{
    height: 10em !important;
}

.cbl-height-11em
{
    height: 11em !important;
}



.cblMinHeight2em
{
    min-height: 2em !important;
}

.cblMinHeight3em {
  min-height: 3em !important;
}


.cblMinHeight4em {
  min-height: 4em !important;
}

.cblMinH24px
{
    min-height: 24px !important;
}



/* ++++++++++++++++++++++++++++++++++
       End : Height
   ++++++++++++++++++++++++++++++++++ */



/* ++++++++++++++++++++++++++++++++++
       Start : Margin
   ++++++++++++++++++++++++++++++++++ */

.cblMarginLeft0D25em
{
    margin-left: .25em !important;
}

.cblMarginLeft070em
{
  margin-left: .70em;
}

.cblMarginLeft1em
{
    margin-left: 1em !important;
}

.cblMarginLeft32px
{
    margin-left: 32px !important;
}

.cblMarginLeft16px
{
    margin-left: 16px !important;
}

.cblMarginLess0D50em{

     margin-left: -0.50em !important;

}

.cblMarginRight0d25em
{
    margin-right: .25em !important;
}

.cblMarginRight0d15em
{
    margin-right: .15em !important;
}


.cblMarginRight2em
{
    margin-right: 2em !important;
}

.cblMarginRight1D2em
{
    margin-right: 1.2em !important;
}

.cblMarginTop0D50em /* Wiki Document Juan */
{
    margin-top: .50em !important;
}

.cblMarginBottom0D50em
{
    margin-bottom: .50em !important;
}

.cblMarginBottom1em
{
    margin-bottom: 1em !important;
}

.cblMarginBottom2em
{
    margin-bottom: 2em !important;
}


.cblVerticalMargin
{
    margin-top: .50em;
    margin-bottom: .50em;
}

.cblMarginTop1em
{
    margin-top: 1em !important;
}


.cblMarginTop1D25em
{
    margin-top: 1.25em !important;
}
/* ++++++++++++++++++++++++++++++++++
       End : Margin
   ++++++++++++++++++++++++++++++++++ */

/* ++++++++++++++++++++++++++++++++++++
  Start : Margin Top && Bottom
  +++++++++++++++++++++++++++++++++++++ */
  .cblMarginTopBottom0D50em
  {
    margin: 0.50em 0em;
  }

  .cblMarginTopBottom1em
  {
    margin: 1em 0em;
  }

  .cblMarginTopBottom2em
  {
    margin: 2em 0em;
  }

  .cblMarginTopBottom16em
  {
    margin: 16em 0em;
  }

.cblMarginTopBottom32em
  {
    margin: 16em 0em;
  }

/* ++++++++++++++++++++++++++++++++++++
  End: Margin Top && Bottom
  +++++++++++++++++++++++++++++++++++++ */

/* ++++++++++++++++++++++++++++++
        Start: Padding (rem )
    +++++++++++++++++++++++++++ */
.cblPd5Ad3rem
{
    padding: 0.50rem 0.3rem;
}
/* ++++++++++++++++++++++++++++++
        End : Padding (rem )
    +++++++++++++++++++++++++++ */

/* ++++++++++++++++++++++++++++++
        Start: FlexBox
    +++++++++++++++++++++++++++ */

/* Flex */

.cbl-flex
{
   display: flex;
   display: -ms-flexbox;
}

/* row */
.cbl-flex-row
{

  flex-direction : row;
      -webkit-flex-direction: row;
      -moz-flex-direction: row;
      -ms-flex-direction: row;
      -o-flex-direction: row;

}

.cbl-flex-row-reverse
{

  flex-direction : row-reverse;
      -webkit-flex-direction: row-reverse;
      -moz-flex-direction: row-reverse;
      -ms-flex-direction: row-reverse;
      -o-flex-direction: row-reverse;

}

/* Column */
.cbl-flex-column
{

  flex-direction : column;
      -webkit-flex-direction: column;
      -moz-flex-direction: column;
      -ms-flex-direction: column;
      -o-flex-direction: column;
}


.cbl-flex-column-reverse
{

  flex-direction : column-reverse;
      -webkit-flex-direction: column-reverse;
      -moz-flex-direction: column-reverse;
      -ms-flex-direction: column-reverse;
      -o-flex-direction: column-reverse;
}


  /* Justify-content */

  .cbl-justify-center
  {
     justify-content: center;
  }

  .cbl-justify-start
  {
    justify-content: start;
  }

  .cbl-justify-flex-start
  {
      justify-content: flex-start !important;
  }

  .cbl-justify-end
  {
    justify-content: end;
  }

  .cbl-justify-flex-end
  {
      justify-content: flex-end;
  }

  .cbl-justify-space-between
  {

      justify-content: space-between !important;
  }

  .cbl-justify-space-arround
   {
      justify-content: space-around;
   }

   .cbl-justify-space-stretch
   {
     justify-content: stretch;
   }

   /* Align-items */

  .cbl-align-items-start
  {
     align-items: flex-start !important;
       align-items: -ms-flex-start !important;
  }

  .cbl-align-items-end
  {
     align-items: flex-end;
       align-items: -ms-flex-end;
  }

  .cbl-align-items-center
  {
      align-items: center;
  }

  .cbl-align-items-baseline
  {
    align-items: baseline !important;
  }



  .cbl-align-items-f-stretch
  {
    align-items: flex-stretch;
  }


  .cbl-align-items-streetch
  {
      align-items: stretch;
  }

  /* Aling-content */
 .cbl-align-content-center
 {
    align-content: center;
 }

 .cbl-align-content-left
 {
    align-content: left;
 }

 .cbl-align-content-right
 {
    align-content: right;
 }

 .cbl-align-content-baseline
 {
    align-content: baseline;
 }

 .cbl-align-content-start
 {
    align-content: start;
 }

 .cbl-align-content-end
 {
    align-content: end;
 }

 .cbl-align-flex-end
 {
   align-items: flex-end;
 }

 /* Wrap */
 .cbl-flex-wrap
 {
   flex-wrap: wrap;
 }

 .cbl-flex-nowrap
 {
   flex-wrap: nowrap;
 }

/* grid container */
.cblContent_f_r
{
   display: flex;
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flexbox;

  justify-content: flex-start;
    justify-content: -ms-flex-start;

  align-items: flex-start;
      align-items: -ms-flex-start;

  flex-direction: row;
    -ms-flex-direction: row;

}

.cblContent_f_rWrap
{
   display: flex;
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flexbox;

  justify-content: flex-start;
    justify-content: -ms-flex-start;

  align-items: flex-start;
      align-items: -ms-flex-start;

  flex-wrap: wrap;
  flex-direction: row;
    -ms-flex-direction: row;

}

.cblContent_f_aligCenter_rWrap {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
}

.cblContent_f_rNwrap
{
   display: flex;
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flexbox;

  justify-content: flex-start;
    justify-content: -ms-flex-start;

  align-items: flex-start;
      align-items: -ms-flex-start;

  flex-wrap: wrap;
  flex-direction: row;
    -ms-flex-direction: row;

}


.cblContent_f_cWrap
{
   display: flex;
      display: -ms-flexbox;

  justify-content: flex-start;
    justify-content: -ms-flex-start;

  align-items: flex-start;
      align-items: -ms-flex-start;

  flex-wrap: wrap;
    flex-direction: column;
      -ms-flex-direction: column;

}


.cblContent_f_cNWrap
{
   display: flex;
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flexbox;

  justify-content: flex-start;
    justify-content: -ms-flex-start;

  align-items: flex-start;
      align-items: -ms-flex-start;

  flex-wrap: wrap;
    flex-direction: column;
      -ms-flex-direction: column;

}


.cblContent_f_c
{
   display: flex;
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flexbox;

  justify-content: flex-start;
    justify-content: -ms-flex-start;

  align-items: flex-start;
      align-items: -ms-flex-start;

    flex-direction: column;
      -ms-flex-direction: column;

}


.cbl-grid-f
{
 /* -ms-flex-preferred-size: 50%;
  flex-basis: 50%;
  max-width: 50%;*/
}


/* Grid FlexBox */
.c1
{
  border: solid 1px green;
}
.c2
{
  border:solid 1px blue;
}

.cbl-flex-auto
{
  flex: auto;
    -ms-flex: 0 0  auto;
}

.cbl-flex-1
{
  flex: 1;
  -ms-flex: 1 1 auto;
}

.cbl-flex-2
{
  flex: 2;
  -ms-flex: 2 2 auto;
}

.cbl-flex-3
{
  flex: 3;
  -ms-flex: 3 3 auto;
}

.cbl-flex-4
{
  flex: 4;
  -ms-flex: 4 4 auto;
}


.cbl-flex-5
{
  flex: 5;
  -ms-flex: 5 5 auto;
}

.cbl-flex-6
{
  flex: 6;
  -ms-flex: 6 6 auto;
}


.cbl-flex-7
{
  flex: 7;
  -ms-flex: 7 7  auto;
}


.cbl-flex-8
{
  flex: 8;
  -ms-flex: 8 8 auto;
}


.cbl-flex-9
{
  flex: 9;
  -ms-flex: 9 9 auto;
}

.cbl-flex-10
{
  flex: 10;
  -ms-flex: 10 10 auto;
}

.cbl-flex-11
{
  flex: 11;
  -ms-flex: 11 11 auto;
}

.cbl-flex-12
{
  flex: 12;
  -ms-flex: 12 12 auto;
}


/* flex-basis */
.cbl-flex-basis10120p
{
    flex: 1 0 120px;
    max-width: 220px;
}

/* flex-grow : wider */
.cbl-flex-grow1
{
  flex-grow: 1;
    -ms-flex-grow: 1;
}

.cbl-flex-grow2
{
  flex-grow: 2;
    -ms-flex-grow: 2;
}

.cbl-flex-grow3
{
  flex-grow: 3;
    -ms-flex-grow: 3;
}

.cbl-flex-grow4
{
  flex-grow: 4;
    -ms-flex-grow: 4;
}

.cbl-flex-grow5
{
  flex-grow: 5;
    -ms-flex-grow: 5;
}


.cbl-flex-grow6
{
  flex-grow: 6;
    -ms-flex-grow: 6;
}


.cbl-flex-grow7
{
  flex-grow: 7;
    -ms-flex-grow: 7;
}


.cbl-flex-grow8
{
  flex-grow: 8;
    -ms-flex-grow: 8;
}


.cbl-flex-grow9
{
  flex-grow: 9;
    -ms-flex-grow: 9;
}


.cbl-flex-grow10
{
  flex-grow: 10;
    -ms-flex-grow: 10;
}


.cbl-flex-grow11
{
  flex-grow: 11;
    -ms-flex-grow: 11;
}


.cbl-flex-grow12
{
  flex-grow: 12;
    -ms-flex-grow: 12;
}


.cbl-flex-grow60
{
  flex-grow: 60;
    -ms-flex-grow: 60;
}


/* Flex-form */
.cbl-form-group-flex
{

  display: flex;
    display: -ms-flexbox;

  flex-direction: row;
}

    label.cbl-label-g-f,
    span.label.cbl-label-g-f
    .cbl-label-g-f
    {
       /* display: block;*/
        display: flex;
        min-width: 69px;
        color: #666666;
        font-size: 1em;
        font-weight: bold;
        padding-left: .20em;

        justify-content: flex-start;
          justify-content: -ms-flex-start;

        align-items: center;
    }

    .cbl-input-g-f,
    .cbl-textarea-g-f
    {
        flex: 1 1 auto;
          -ms-flex: 1 1 auto;

      display: block;
      border-color: #000000  !important;
   }

      @media ( max-width: 768px)
      {

        .cbl-form-group-flex
        {
            flex-direction: column;
              -ms-flex-direction: column;
        }

      }

@media only screen and ( max-width: 1192px)
{
    .cbl-flex-column-md
    {
        flex-direction: column;
            -ms-flex-direction:column;
    }

    .cbl-md-100
    {
        width: 100% !important
    }
}



@media only screen and (min-width: 361px) and (max-width: 768px) {

}







/* ++++++++++++++++++++++++++++++
        End: FlexBox
    +++++++++++++++++++++++++++ */


/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
      Start: webForm
   ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.CblWebContentForm
{
    display: flex;
        display: -ms-flexbox;
    justify-content:flex-start;
    align-items: flex-start;
    /*align-items: baseline;*/
    /*align-items: center;*/
}

.CblWebContentFormColumn
{
    display: flex;
        display: -ms-flexbox;
    justify-content:flex-start;
    align-items: flex-start;

    flex-direction: column;
        -ms-flex-direction: column;
}


.cbl-label-form
{
    /* font-size: 1em !important;
    margin-right: .25em !important;
    display: flex;
    display: -ms-flexbox; */
    /*min-width: 66px !important;*/
    /* min-width: 85px !important;
    text-align: center;
    justify-content: flex-start;
    padding: 0em 0em !important; */
    /*border: solid 1px;*/
    /*min-height: 29px;*/
    /* height: 29px !important; */
    }

    .cbl_box_label
    {
      /* border: solid 1px; */
      width: 100px;
      height: 24px !important;

      display: flex;
  
      justify-content: flex-start;
      align-items: flex-end;
    }
label.cbl_labelFormDiv,
span.cbl_labelFormDiv {
    font-size: 1em !important;
    margin-right: .875em;
    text-align: left;
    min-width: 66px !important;
    font-weight: 600;
    font-family: 'Roboto Flex Variable', 'Roboto', sans-serif;
 
}




    .cblWebFormMandatoryField .cbl-label-form::after,
    .cblWebFormMandatoryField .cbl_labelFormDiv::after,
    .cblWebFormMandatoryField .cblh5::after
    {
        content:"*";
        color: #000000;
        font-size: 14px;
        margin-left: 2px;
    }

    .cblWebFormRowError,
    .cblWebFormRowValidation
    {
        position: relative;
    }


            .cblWebFormRowError span.icons8-info-squared
            {
                margin-top: 4px !important;
                margin-left: .25em;
                margin-right: .25em;
            }

     


    .cblWebFormRowValidation .cblIconConfirmation
    {
        position:absolute;
        right: 14px;
        margin-top: 6px;
   
    }

    .cblWebFormRowValidation .cblIconConfirmation::before
     {
        font-family: "Font Awesome 5 Free";
        font-weight: 600;
        content: "\f00c";
        color: #4FA52F; /* IC8 */
        font-size: 1em;
     }
         .cblToolTipErrorMessage
         {
                background: #DD1111;
                padding: 5px 5px;
                position: absolute;
                left:88px;
                bottom: 39px;
                z-index: 500;
                color: #ffffff !important;
                border-radius: .25em;
            
                box-shadow: 0em 0em .15em rgba(202,15,15,5);
                display: none;
         }

         .cblWebFormRowError:hover span.cblToolTipErrorMessage
        {
            display: block;
        }

         .cblWebFormRowDisabled
         {
             opacity: .7;
             color: #C3C0C0;
         }


    .CblWebContentFormColumn .cbl-label-form-checkbox
    {
        margin-left: .25em;

    }

    .CblWebContentFormColumn  .cbl-flex-row label.cbl-label-form-checkbox
  {
     margin-left: .09em !important;
     margin-top: .15em;
  }

     .CblWebContentFormColumn  .cbl-flex-row-reverse label.cbl-label-form-checkbox
     {
         margin-top: .15em;
     }

     /* class: .cblWebFormRow */
     .cblWebFormRow
     {
        display: flex;
        justify-content: flex-start;
        margin-bottom: 0.5rem;
    
     }

.cblJWebFormRow {
    display: flex;
    justify-content: space-between;
}

.cblToggleSwitchContent .cbl-label-form-checkbox {
    margin-top: .25em;
    font-weight: 600;
    font-family: 'Roboto Flex Variable', 'Roboto', sans-serif;
}
    .CblWebContentFormColumn .cbl-component-check
    {
        /*margin-top: -0.25em*/
    }
.cbl-input-field {
    border-color: #000000 !important;
    margin-right: 2em !important;
    font-size: 1em !important;
    color: #000000 !important;
    font-family: 'Roboto Flex Variable', 'Roboto', sans-serif;
}

    .CblWebContentForm .cblFormLabelForm
    {
        display: flex;
   

        justify-content: center;
        align-items: center;
        /*border: solid 1px blue;*/
        margin-left: .15em;
        margin-right: .15em;
    }


    /* Size for label in web form */
    label.cblLabelMin124p
    {
       min-width: 124px !important;
    }


    .cblFontWeight
    {
        font-weight: 600;
    }

    .cblFontWeight500
    {
        font-weight: 500;
    }

    /* layout with checkbox */
       .cbl_webform_checkbox,
       .cbl_webform_radiobutton
       {
           display: flex;
 
           margin-left: .15em;
           margin-right: .15em;

           justify-content: center;
           align-items: center;
       }


        .cbl_webform_checkbox label.cbl_checkbox_label,
        .cbl_webform_radiobutton label.cbl_radiobtnlabel {
            font-family: 'Roboto Flex Variable', 'Roboto', sans-serif;
            font-size: 1em;
            text-align: left;
            font-weight: 600;
            margin-top: .25em;
            margin-bottom: .25em;
            cursor: pointer;
        }

       .cbl_webform_checkbox  span.cbl-check-control
       {
          margin-top: -1px !important;
       }

           /* container of element to set label and checkbox */
          .cbl_webform_checkbox div.cbl_box_checkbox,
          .cbl_webform_radiobutton div.cbl_box_checkbox
          {
            /* border: solid 1px green; */

            display: flex;
      

              height: 23px;
              margin-right: .25em;;
              justify-content: flex-start;
              align-items: center;
          }

          /*error state for checkboxes div container */
.cblWebFormRowError.cbl_webform_checkbox span.cblToolTipErrorMessage {
    font-family: 'Roboto Flex Variable', 'Roboto', sans-serif;
}
    /* --------------------------------------------- layout with checkbox */

    /* CblRadCombobox */
    .cblRadCombobox
    {
        min-width: 50px !important;
        max-width: 220px;
        margin-right: .25em;
        margin-bottom: .25em;
    }

           .cblRadCombobox span.rcbInner
           {
               height: 24px !important;
               min-width: 50px !important;
               padding:6px 6px;
               font-size: 14px !important;

               border-radius: .25em !important;
                 
                  cursor: pointer !important;

           }

              .cblRadCombobox span.rcbInner > input[type="text"].rcbInput
              {
                  height: 22px  !important;
                  font-size: 14px !important;
                  /* margin-top: 1px;*/
                  margin-top: 1px;
                  padding: 0px 0px;
                  text-align: left;
                  cursor: pointer;
              }

              .cblRadCombobox span.rcbInner > button.rcbActionButton
              {

                  display: flex;
           

                  justify-content: center;
                  align-items: baseline;
                  height:14px !important;
              }


             /* cblRadComobobox error state */
             .cblRadComboboxErrorState
             {
               margin-top: -2px;
             }

             .cblRadComboboxErrorState span.rcbInner
             {
                 border-color: #DD1111 !important;
             }

             .cblRadComboboxErrorState span.rcbInner:hover
             {
                  background-color: #DD1111;
             }

                    .cblRadComboboxErrorState span.rcbInner:hover .rcInput,
                    .cblRadComboboxErrorState span.rcbInner:hover .p-icon::before
                    {
                      color: #DD1111 !important;
                    }


                .cblRadComboboxErrorState span.rcbInner  input[type="text"].rcbInput
                {
                     color: #DD1111;
                }

                .cblRadComboboxErrorState span.rcbInner span.p-icon::before
                {
                      color: #DD1111;
                }


          .cblWebFormRowErrorRadComobobox  span.icons8-info-squared
          {
               margin-top: 2px !important
          }

              /* cblRadComobox disabled */
              .cblRadCombobox span.rcbInner.rcbDisabled,
              .cblRadCombobox span.rcbInner.rcbDisabled:hover
              {
                 background: transparent !important;
              }

              .cblRadCombobox span.rcbInner.rcbDisabled
              {
                border-color: #c3c0c0 !important;
              }

              .cblRadCombobox span.rcbInner.rcbDisabled .rcInput,
              .cblRadCombobox span.rcbInner.rcbDisabled .p-icon::before
              {
                color: #c3c0c0 !important;
              }
    /*----------------------------------------------------------------------------- / CblRadCombobox */

/*#region Default fontFamily  */

.cbl-font-RobotoRegular {
    font-family: 'Roboto Flex Variable', 'Roboto', sans-serif;
}

/*#endregion */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
      End: Webform
   ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
      Start: GridTemplateLayout
   ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

   .cblGridTemplateCol1
   {
      column-count: 1;
      column-gap: 1em;
   }

   .cblGridTemplateCol2
   {
      column-count: 2;
      column-gap: 1em;
   }


   .cblGridTemplateCol3
   {
      column-count: 3;
      column-gap: 1em;
   }


   .cblGridTemplateCol4
   {
      column-count: 4;
      column-gap: 1em;
   }


   .cblGridTemplateCol5
   {
      column-count: 5;
      column-gap: 1em;
   }


      .cblGridItem
      {

      }


/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
      End: GridTemplateLayout
   ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
        START  : Box shadow default
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
  .cblBoxshadow_df{
    border: solid 1px #F0EFEF;
    padding: .35em;
    margin-top: .50em;
    margin-bottom: .50em;

    border-radius: 1em;
      -moz-border-radius: 1em;


  }
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
        END  : Box shadow default
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */



/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
        START  : Info description with webForms
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.cblInfo_desc {
    background: #FFD75C;
    padding: .25em;
    border-radius: .15em;

    color: #000;
    font-family: 'Roboto Flex Variable', 'Roboto', sans-serif;
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
        START  :  Info description with webForms
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
        START  : SCREEN STYLE
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/*
    This sections indicates differents sizes of screen, adapting their layout responsive

     Desktops :
          [ Screens : >= 1440px  // 90em  ]
          [ Screens : >=1280px   // 80em  ]
          [ Screens : >= 1024px  // 64em  ]
          [ Screens : >= 768px   // 48em  ]
          [ Screens : >= 500px   // 30em  ]
          [ Screens : <= 500px   //  30em ]
*/


/* ++++++++++++++++++++++++++++++++++++++++++++++++++
         Start:  Desktop screen
    ++++++++++++++++++++++++++++++++++++++++++++++++++ */


/*  [ Screens : <= 500px   //  30em ] */
@media only screen and (max-width : 500px)
{

    .CBL_wrapper
    {
        /* border: solid 2px blue; */
    }

}


/*   [ Screens : >= 500px   // 30em  ]  */
@media only screen and (min-width : 500px )
{

   .CBL_wrapper
    {
        /* border: solid 2px blue; */
    }

}


/* [ Screens : <= 768px   // 48em  ] */
@media only screen and (max-width : 768px)
{

}


/* [ Screens : >= 768px   // 48em  ] */
@media only screen and (min-width : 768px)
{

   .CBL_wrapper
    {
        /* border: solid 2px  green; */
    }

}

/* [ Screens : >= 1024px  // 64em  ] */
@media only screen and (min-width : 1024px)
{
  .CBL_wrapper
    {
        /* border: solid 2px orange; */
    }
}


/* [ Screens : >=1280px   // 80em  ]   */
@media only screen and (min-width : 1280px)
{
   .CBL_wrapper
    {
        /* border: solid 2px violet; */
    }
}


/*  [ Screens : >= 1440px  // 90em  ] */
@media only screen and (min-width : 1440px)
{
    .CBL_wrapper
    {
        /* border: solid 2px rgba(54,142,224,.7); */
    }
}


/* ++++++++++++++++++++++++++++++++++++++++++++++++++
         End:  Desktop screen
    ++++++++++++++++++++++++++++++++++++++++++++++++++ */


/*
  This sections indicates size of tablets and Ipads

  Tablets && Ipads :
      [ Screens : 768px && 1366px && orientation: portrait ]
      [ Screens : 1366px && 768px && orientation: landscape  ]
*/


/* ++++++++++++++++++++++++++++++++++++++++++++++++++
         Start:  Tablets && Ipads
    ++++++++++++++++++++++++++++++++++++++++++++++++++ */

  @media only screen and (min-device-width: 200px ) and (max-device-width: 820px ) and ( orientation: portrait)
  {

     .CBL_wrapper
     {
       width: 100vw;
       overflow: auto;
     }
  }

    /* ++++++++++++++++++++++++++++++++++++++++++++++++++
         End:  Tablets && Ipads
    ++++++++++++++++++++++++++++++++++++++++++++++++++ */


    /*++++++++++++++++++++++++++++++++++++++++++
    Start: Iphone && Android
   +++++++++++++++++++++++++++++++++++++++++*/