@charset "utf-8";
/*@import url(https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700);*/
/* latin-ext */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 300;
    src: url(../fonts/Poppins/pxiByp8kv8JHgFVrLDz8Z1JlFc-K.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
  }
  /* latin */
  @font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 300;
    src: url(../fonts/Poppins/pxiByp8kv8JHgFVrLDz8Z1xlFQ.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }
  /* latin-ext */
  @font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/Poppins/pxiEyp8kv8JHgFVrJJnecmNE.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
  }
  /* latin */
  @font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/Poppins/pxiEyp8kv8JHgFVrJJfecg.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }
  /* latin-ext */
  @font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    src: url(../fonts/Poppins/pxiByp8kv8JHgFVrLGT9Z1JlFc-K.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
  }
  /* latin */
  @font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    src: url(../fonts/Poppins/pxiByp8kv8JHgFVrLGT9Z1xlFQ.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }
  /* latin-ext */
  @font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    src: url(../fonts/Poppins/pxiByp8kv8JHgFVrLEj6Z1JlFc-K.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
  }
  /* latin */
  @font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    src: url(../fonts/Poppins/pxiByp8kv8JHgFVrLEj6Z1xlFQ.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }
  /* latin-ext */
  @font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 700;
    src: url(../fonts/Poppins/pxiByp8kv8JHgFVrLCz7Z1JlFc-K.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
  }
  /* latin */
  @font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 700;
    src: url(../fonts/Poppins/pxiByp8kv8JHgFVrLCz7Z1xlFQ.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }

  @font-face {
    font-family: 'Droid Arabic Kufi';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/DroidKufi/DroidKufi-Regular.eot);
    src: url(../fonts/DroidKufi/DroidKufi-Regular.eot?#iefix) format('embedded-opentype'),
         url(../fonts/DroidKufi/DroidKufi-Regular.woff2) format('woff2'),
         url(../fonts/DroidKufi/DroidKufi-Regular.woff) format('woff'),
         url(../fonts/DroidKufi/DroidKufi-Regular.ttf) format('truetype');
  }
  @font-face {
    font-family: 'Droid Arabic Kufi';
    font-style: normal;
    font-weight: 700;
    src: url(../fonts/DroidKufi/DroidKufi-Bold.eot);
    src: url(../fonts/DroidKufi/DroidKufi-Bold.eot?#iefix) format('embedded-opentype'),
         url(../fonts/DroidKufi/DroidKufi-Bold.woff2) format('woff2'),
         url(../fonts/DroidKufi/DroidKufi-Bold.woff) format('woff'),
         url(../fonts/DroidKufi/DroidKufi-Bold.ttf) format('truetype');
  }  
* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;		
}

:root {
    --bs-blue: #03a9f3;
    --bs-indigo: #6610f2;
    --bs-purple: #ab8ce4;
    --bs-pink: #e83e8c;
    --bs-red: #e46a76;
    --bs-orange: #fb9678;
    --bs-yellow: #fec107;
    --bs-green: #00c292;
    --bs-teal: #20c997;
    --bs-cyan: #01c0c8;
    --bs-white: #fff;
    --bs-gray: #6c757d;
    --bs-gray-dark: #343a40;
    --bs-primary: #fb9678;
    --bs-secondary: #f8f9fa;
    --bs-success: #00c292;
    --bs-info: #03a9f3;
    --bs-warning: #fec107;
    --bs-danger: #e46a76;
    --bs-light: #f8f9fa;
    --bs-cyan: #01c0c8;
    --bs-dark: #343a40;
    --bs-purple: #ab8ce4;
    
    --bs-border-table: #e9ecef;
    --bs-table-bg: transparent;

    --bs-font-sans-serif: "Poppins", 'Droid Arabic Kufi', sans-serif;
}


html, body {
	height: 100%;
}
html {
    overflow-y: scroll;	
}
img {
  border: medium none;
}
h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal;
}
ul, li, ol {
  margin: 0;
  padding: 0;
}
body {
  font-family: var(--bs-font-sans-serif);
  font-size: .875rem;
  font-weight: 400;
  color: #212529;
  background-color: #edf1f5;
	-webkit-text-size-adjust:none;
	-moz-text-size-adjust:none;
	-ms-text-size-adjust:none;
}
/* Texte arabe — Droid Arabic Kufi */
[lang="ar"] {
  font-size: 12px;
}
.clear-left {
  clear: left;
}
#page {
    position: relative;
    float: left;
    width: 100%;
}
  #page .page {
    position: relative;
    float: left;
    width: 100%;
  }

#header {
  position: relative;
  float: left;
  width: 100%;
  box-shadow: 1px 0 20px rgba(0,0,0,.08);
}
  #header .header {
    position: relative;
    float: left;
    width: 100%; /* 1857px */
  }
    #header .header .header-top{
      float: left;
      width: 100%;
      background-color: #4f5467;
      /*padding: 0 20px; */
    }
      #header .header .header-top .header-top-wrapper{
        width: 1857px;
        padding: 0 20px;
        display: block;
        overflow: hidden;
        margin: 0 auto;
      }
      #header .header .header-top .nav-logo{
        float: left;
        width: 148px;
        height: 66px;
        padding: 13px 0;
      }
        #header .header .header-top .nav-logo .nav-logo-icon{
          float: left;
          width: 40px;
          height: 40px;
        }
          #header .header .header-top .nav-logo .nav-logo-icon .img{
            float: left;
          }
        #header .header .header-top .nav-logo .nav-logo-text{
          float: left;
          width: 108px;
          height: 21px;
          margin: 9px 0 10px 0;
        }
          #header .header .header-top .nav-logo .nav-logo-text .img{
            float: left;
          }
      #header .header .header-top .nav-menu{
        float: right;
      }
        #header .header .header-top .nav-menu .link{
          position: relative;
          float: right;
          width: 40px;
          height: 40px;
          margin: 13px 0 0 13px;
        }
          #header .header .header-top .nav-menu .link .notify{
            position: absolute;
            top: 1px;
            right: 0px;
            width: 25px;
            height: 25px;
            z-index: 1;
          }
            #header .header .header-top .nav-menu .link .notify.email{
              right: -2px;
            }
            #header .header .header-top .nav-menu .link .notify.bell{
              right: 2px;
            }            
            #header .header .header-top .nav-menu .link .notify .heartbit {
              float: left;
              height: 25px;
              width: 25px;
              border: 5px solid #e46a76;
              border-radius: 70px;
              animation: heartbit 1s ease-out;
              animation-iteration-count: infinite;
              animation-iteration-count: infinite
          } 
          #header .header .header-top .nav-menu .link .notify .point {
              position: absolute;
              top: 9px;
              right: 9px;
              width: 7px;
              height: 7px;
              -webkit-border-radius: 30px;
              -moz-border-radius: 30px;
              border-radius: 30px;
              background-color: #e46a76;
              
          }
          @keyframes heartbit {
              0% {
                  -webkit-transform: scale(0);
                  opacity: 0
              }
          
              25% {
                  -webkit-transform: scale(.1);
                  opacity: .1
              }
              50% {
                  -webkit-transform: scale(.5);
                  opacity: .3
              }
          
              75% {
                  -webkit-transform: scale(.8);
                  opacity: .5
              }     
              100% {
                  -webkit-transform: scale(1);
                  opacity: 0
              }
          }
          #header .header .header-top .nav-menu .link .href{
            float: left;
            width: 100%;
            color: rgba(255, 255, 255, .55);
          }
            #header .header .header-top .nav-menu .link .href:hover{
              color: rgba(255,255,255,.75)
            }
            #header .header .header-top .nav-menu .link .href > i{
              float: left;
              width: 40px;
              height: 40px;
              text-align: center;
              line-height: 42px;
              font-size: 24px;
            }

         
    #header .header .header-bottom{
      float: left;
      width: 100%;
      background-color: #fff;
      /*padding: 0 20px;*/
    }
      #header .header .header-bottom-wrapper{
          width: 1857px;
          padding: 0 20px;
          display: block;
          overflow: hidden;
          margin: 0 auto;
      }
      #header .header .header-bottom .nav-menu{
        float: left;
        padding: 13px 0;
      }
        #header .header .header-bottom .nav-menu .href{
          float: left;
          height: 34px;
          padding: 0 12px;
          background-color: #f8f9fa;
          line-height: 32px;
          margin: 0 20px 0 0;
          color: #000;
          border-radius: 4px;
          text-decoration: none;
          font-weight: 500;
          border: 1px solid #dee2e6;

        }
          #header .header .header-bottom .nav-menu .href.active{
            background-color: #fb9678;
            color: #fff;
            border: 1px solid #fb9678;
          }
            #header .header .header-bottom .nav-menu .href.active:hover{
              background-color: #fca68c;
              border-color: #fba186;
            } 
          #header .header .header-bottom .nav-menu .href:hover{
            background-color: #f9fafb;
            border-color: #f9fafb;
          }          
      #header .header .header-bottom .nav-text{
        float: right;
        padding: 20px 0;
      }
        #header .header .header-bottom .nav-text .href{
          float: left;
          height: 20px;
          line-height: 20px;
          color: #212529;
          font-size: 12px;
          text-decoration: none;
        }
        #header .header .header-bottom .nav-text .breadcrumb-text{
          float: left;
          height: 20px;
          line-height: 20px;
          font-size: 12px;
          color: #fb9678;
          font-weight: 500;
        }
        #header .header .header-bottom .nav-text .icon-text{
          float: left;
          width: 20px; 
        }
          #header .header .header-bottom .nav-text .icon-text > i{
            float: left;
            height: 20px;
            line-height: 20px;
            width: 20px;
            text-align: center;
            color: #ced4da;
            font-size: 16px;
          }


#main {
  position: relative;
  width: 1857px; /* 1857px */
  height: -moz-calc(100vh - 158px);
  height: -webkit-calc(100vh - 158px);
  height: -o-calc(100vh - 158px);
  height: calc(100vh - 158px);
  right: 0;
  margin-right: auto;
  margin-left: auto;
  display: table;
  padding: 0 20px;
}

#portlet {
  position: relative;
  float: left;
  width: 100%;
  padding: 20px 0;
}


#portlet .portlet, 
#popup-page .popup-page .portlet{
  float: left;
  width: 100%;
  background-color: #fff;
  box-shadow: 1px 0 20px rgba(0,0,0,.08);
  padding: 20px;
}
#popup-page .popup-page .portlet{
  padding: 20px 0 20px 20px !important;
}



#portlet .portlet .card-body, 
#popup-page .popup-page .portlet .card-body{
  float: left;
  width: 100%;
}
#portlet .portlet .card-body .card-title, 
#portlet .portlet .card-body .card-bottom, 
#popup-page .popup-page .portlet .card-body .card-title,
#popup-page .popup-page .portlet .card-body .card-bottom{
  float: left;
  width: 100%;
}
#popup-page .popup-page .portlet .card-body .card-title {
  border-bottom: 1px solid rgba(33, 37, 41, 0.25) !important;
  margin-right: 20px;
  width: -moz-calc(100% - 20px);
  width: -webkit-calc(100% - 20px);
  width: -o-calc(100% - 20px);
  width: calc(100% - 20px);
}
#popup-page .popup-page .portlet .card-body .card-title.no-form-responsive {
  border-bottom-width: 0 !important;
}

#portlet .portlet .card-body .card-title .nav-title, 
#popup-page .popup-page .portlet .card-body .card-title .nav-title{
  float: left;
  width: 100%;
  height: 24px;
  line-height: 24px;
  font-weight: 500;
  margin-bottom: 10px;
  font-size: 18px;
}
#portlet .portlet .card-body .card-title .nav-scare {
  position: relative;
}
#portlet .portlet .card-body .card-title .nav-scare::after{
  content: '';
  position: absolute;
  top: -14px;
  left: -16px;
  height: 24px;
  width: 24px;
  border: 5px solid #e46a76;
  border-radius: 70px;
  animation: heartbit 1s ease-out;
  animation-iteration-count: infinite;
  animation-iteration-count: infinite
}
#portlet .portlet .card-body .card-title .nav-scare::before{
  content: '';
  position: absolute;
  top: -1px;
  left: -3px;
  width: 8px;
  height: 8px;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px;
  background-color: #e46a76;
}


      #popup-page .popup-page .portlet .card-body .card-title .nav-title{
        width: 60% !important;   
      }
      #portlet .portlet .card-body .card-title .nav-slogan, 
      #popup-page .popup-page .portlet .card-body .card-title .nav-slogan{
        float: left;
        width: 100%;     
        margin-bottom: 24px;
        font-weight: 300;
        margin-bottom: 15px;
        font-size: 14px;        
      } 
      #popup-page .popup-page .portlet .card-body .card-title.no-form-responsive .nav-slogan{
        margin-bottom: 0px !important;
      
      } 
      #popup-page .popup-page .portlet .card-body .card-title .nav-slogan{
        width: 60% !important;        
      }   
      #portlet .portlet .card-body .card-title .nav-buttons, 
      #portlet .portlet .card-body .card-bottom .card-footable .nav-buttons, 
      #popup-page .popup-page .portlet .card-body .card-title .nav-buttons, 
      #popup-page .popup-page .portlet .card-body .card-bottom .card-footable .nav-buttons{
        float: right;
        padding: 0 20px;
      }
      #popup-page .popup-page .portlet .card-body .card-title .nav-buttons {
        padding: 0 0 0 20px !important
      }
        #portlet .portlet .card-body .card-title .nav-buttons .href, #portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href, #popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href{
          float: left;
          height: 34px;
          padding: 0 12px;
          background-color: #03a9f3;
          line-height: 32px;
          margin: 0 0 0 20px;
          color: #fff;
          border-radius: 4px;
          text-decoration: none;
          font-weight: 400;
          border:1px solid #03a9f3;
        }       
          #portlet .portlet .card-body .card-title .nav-buttons .href:hover, 
          #portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href:hover, 
          #popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href:hover{
            background-color: #29b6f5;
            border-color: #1cb2f4
          } 
      
          
#portlet .portlet .card-body .card-title .nav-buttons .href.href-menu, 
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-menu, 
#popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href.href-menu{
  background-color: #f8f9fa;
  color: #000;
  border:1px solid #dee2e6;
}    
#portlet .portlet .card-body .card-title .nav-buttons .href.href-menu:hover, 
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-menu:hover, 
#popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href.href-menu:hover{
  background-color: #f9fafb;
  border-color: #ced4da
}




#portlet .portlet .card-body .card-title .nav-buttons .href.href-basic, 
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-basic, 
#popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href.href-basic{
  background-color: #03a9f3;
  color: #fff;
  border:1px solid #03a9f3;
}    
#portlet .portlet .card-body .card-title .nav-buttons .href.href-basic:hover, 
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-action:hover, 
#popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href.href-basic:hover{
  background-color: #29b6f5;
    border-color: #1cb2f4
}

#portlet .portlet .card-body .card-title .nav-buttons .href.href-basic-c, 
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-basic-c{
  background-color: #fff;
  color: #03a9f3;
  border:1px solid #03a9f3;
}    
#portlet .portlet .card-body .card-title .nav-buttons .href.href-basic-c:hover, 
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-action-c:hover{
  background-color: #29b6f5;
  color: #fff;
    border-color: #1cb2f4
}





#portlet .portlet .card-body .card-title .nav-buttons .href.href-action, 
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-action, 
#popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href.href-action{
  background-color: #00c292;
  color: #fff;
  border:1px solid #00c292;
}

#portlet .portlet .card-body .card-title .nav-buttons .href.href-action:hover, 
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-action:hover, 
#popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href.href-action:hover{
  background-color: #26cba2;
  border-color: #1ac89d
}

#portlet .portlet .card-body .card-title .nav-buttons .href.href-popup, 
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-popup, 
#popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href.href-popup{
  background-color: #fec107;
  color: #fff;
  border:1px solid #fec107;
}
#portlet .portlet .card-body .card-title .nav-buttons .href.href-popup:hover, 
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-popup:hover, 
#popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href.href-popup:hover{
  background-color: #feca2c;
  border-color: #fec720
}
#portlet .portlet .card-body .card-title .nav-buttons .href.href-action-c,
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-action-c{
  background-color: #fff;
  color: #00c292;
  border:1px solid #00c292;
}
#portlet .portlet .card-body .card-title .nav-buttons .href.href-action-c:hover,
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-action-c:hover{
  background-color: #26cba2;
  color: #fff;
  border-color: #1ac89d
}

          #portlet .portlet .card-body .card-title .nav-buttons .href.href-remove, #portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-remove, #popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href.href-remove{
            background-color: #e46a76;
            color: #fff;
            border:1px solid #e46a76;
          }    
            #portlet .portlet .card-body .card-title .nav-buttons .href.href-remove:hover, #portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-remove:hover, #popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href.href-remove:hover{
              background-color: #e8808b;
              border-color: #e77984
            }

            
#portlet .portlet .card-body .card-title .nav-buttons .href.href-back, 
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-back, 
#popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href.href-back{
  background-color: #343a40;
  color: #fff;
  border:1px solid #343a40;
}    
#portlet .portlet .card-body .card-title .nav-buttons .href.href-back:hover, 
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-back:hover, 
#popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href.href-back:hover{
  background-color: #2c3136;
  border-color: #2a2e33
}
#portlet .portlet .card-body .card-title .nav-buttons .href.href-back-c,
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-back-c{
  background-color: #fff;
  color: #343a40;
  border:1px solid #343a40;
}    
#portlet .portlet .card-body .card-title .nav-buttons .href.href-back-c:hover,
#portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-back-c:hover{
  background-color: #2c3136;
  color: #fff;
  border-color: #2a2e33
}
          #portlet .portlet .card-body .card-title .nav-buttons .href.href-close, #portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-close, #popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href.href-close{
            background-color: #dd3333;
            color: #fff;
            border:1px solid #dd3333;
          }    
            #portlet .portlet .card-body .card-title .nav-buttons .href.href-close:hover, #portlet .portlet .card-body .card-bottom .card-footable .nav-buttons .href.href-close:hover, #popup-page .popup-page .portlet .card-body .card-title .nav-buttons .href.href-close:hover{
              background-color: #c72e2e;
              border-color: #c72e2e
            }
    #portlet .portlet .card-body .card-bottom{
      padding: 0 20px 0 20px;
    }
      #portlet .portlet .card-body .card-bottom .card-footable,
      #popup-page .popup-page .portlet .card-body .card-bottom .card-footable{
        float: left;
        width: 100%;
        padding: 20px 0 0 0;
        border-top: 1px solid rgba(33, 37, 41, 0.25)
      }
        #portlet .portlet .card-body .card-bottom .card-footable .nav-buttons {
            padding: 0 0;
        }
        #portlet .portlet .card-body .card-bottom .card-footable .nav-obligatory, 
        #popup-page .popup-page .portlet .card-body .card-bottom .card-footable .nav-obligatory {
            float: left;
        }
          #portlet .portlet .card-body .card-bottom .card-footable .nav-obligatory .obligatory, 
          #popup-page .popup-page .portlet .card-body .card-bottom .card-footable .nav-obligatory .obligatory{
            float: left;
            height: 34px;
            line-height: 34px;
            font-size: 12px;
            font-weight: 500;
          }
            #portlet .portlet .card-body .card-bottom .card-footable .nav-obligatory .obligatory span, 
            #popup-page .popup-page .portlet .card-body .card-bottom .card-footable .nav-obligatory .obligatory span{
              color: red;
            } 
          #popup-page .popup-page .portlet .card-body .card-bottom .card-footable .nav-obligatory .alert-danger{
            float: left;
            width: 100%;
            height: 16px;
            line-height: 16px;
            font-size: 11px;
            color: #e46a76;
            font-weight: 400;
            display: none;
          }         
    #portlet .portlet .card-body .card-search{
      float: left;
      width: 100%;
      padding: 20px 0 0 20px;
    }
      #portlet .portlet .card-body .card-search .nav-search{
        float: left;
        width: 100%;
        padding: 0 20px 0 0;
      }
      #portlet .portlet .card-body .card-search .nav-search.nav-search-hide{
        display: none;
      }
        #portlet .portlet .card-body .card-search .nav-search.nav-search-15{
          width: 15%;
        }
        #portlet .portlet .card-body .card-search .nav-search.nav-search-20{
          width: 20%;
        }
        #portlet .portlet .card-body .card-search .nav-search.nav-search-25{
          width: 25%;
        }
        #portlet .portlet .card-body .card-search .nav-search.nav-search-33{
          width: 33%;
        }
        #portlet .portlet .card-body .card-search .nav-search.nav-search-34{
          width: 34%;
        }
        #portlet .portlet .card-body .card-search .nav-search.nav-search-50{
          width: 50%;
        }
        #portlet .portlet .card-body .card-search .nav-search.nav-search-65{
          width: 65%;
        }        
        #portlet .portlet .card-body .card-search .nav-search.nav-search-75{
          width: 75%; 
        }
        #portlet .portlet .card-body .card-search .nav-search .nav-label{
          float: left;
          width: 100%;
          font-weight: 400;
          margin-bottom: 8px;
          font-size: 14px;
          height: 22px;
          line-height: 22px;
        }
        #portlet .portlet .card-body .card-search .nav-search .nav-group{
          float: left;
          width: 100%;
          
        }
          #portlet .portlet .card-body .card-search .nav-search .nav-group .nav-select{
            float: left;
            width: 100%;
            
            margin-bottom: 4px;
            height: 36px;
          }
            #portlet .portlet .card-body .card-search .nav-search .nav-group .nav-select .form-select{
              float: left;
              width: 100%;
              visibility: hidden;
            }
          #portlet .portlet .card-body .card-search .nav-search .nav-group .form-small{
            float: left;
            width: 100%;
            height: 16px;
            line-height: 16px;
            font-size: 11px;
            color: #6c757d;
          }
    
    
    
    
    #portlet .portlet .card-body .table-responsive{
      float: left;
      width: 100%;
      padding: 20px 20px 0 20px;
    }
    #portlet .portlet .card-body .table-responsive .form-title{
      position: relative;
      float: left;
      width: 100%;
      margin-bottom: 25px;
    }
    #portlet .portlet .card-body .table-responsive .form-title > div {
      float: left;
      width: 100%;
      height: 49px;
      padding-bottom: 15px;
      border-bottom: 1px solid rgba(33, 37, 41, 0.25);
    }
    #portlet .portlet .card-body .table-responsive .form-title > div > span {
      font-weight: 500;
      float: left;
      height: 34px;
      line-height: 34px;
      font-size: 24px;
    }


    

      #portlet .portlet .card-body .table-responsive .table-validation{
        position: relative;
        float: left;
        width: 100%;
        margin: 0 20px 20px 0;
        border: 1px solid transparent;
        border-radius: 4px;
        padding: 16px;
        display: none;
      }
        #portlet .portlet .card-body .table-responsive .table-validation.validation-success{
          color: #007458;
          background-color: #ccf3e9;
          border-color: #b3edde;
          display: block;
        }
        #portlet .portlet .card-body .table-responsive .table-validation.validation-danger{
          color: #894047;
          background-color: #fae1e4;
          border-color: #f7d2d6;
          display: block;
        }
      #portlet .portlet .card-body .table-responsive .table-bord{
        float: left;
        width: 100%;
      }
        #portlet .portlet .card-body .table-responsive .table-bord .thead{
          float: left;
          width: 100%;
          z-index: 1;
          position: sticky;
          bottom: auto;
          top: 0px;
          left: 0px;
          display: block;
          overflow: hidden;
          background-color: #fff;
        }
          #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord{
            float: left;
            width: 100%;
          }
          #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row-first{
            float: left;
            width: 30px;
            line-height: 50px;
            height: 50px;
            border-top: 1px solid var(--bs-border-table);
            border-bottom: 1px solid var(--bs-border-table);
            border-left: 1px solid var(--bs-border-table);
            background-color: var(--bs-table-bg);
          }
          #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row{
            float: left;
          }




#portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href-fortnight{
  float: left;
  width: 100%;
  height: 50px;
  line-height: 48px;
  padding: 0 6px 0 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-decoration: none;
  border-top: 1px solid var(--bs-border-table);
  border-bottom: 1px solid var(--bs-border-table);
  border-left: 1px solid var(--bs-border-table);
  font-weight: 500;
  color: #212529;
  text-align: left;
  font-size: 14px;
}
#portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href-fortnight.href-fortnight-num{
  text-align: center;
  overflow: initial;
  text-overflow: initial;
  white-space: initial;
}
#portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href-fortnight.href-fortnight-mini{
  text-align: center;
  font-size: 10px;
}
#portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href-fortnight.href-fortnight-mini span{
  float: left;
  width: 100%;
  line-height: 14px;
  height: 24px;
}
#portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href-fortnight.href-fortnight-mini span:first-child{
  padding-top: 10px;
}
#portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href-fortnight.href-fortnight-mini span:last-child{
  padding-bottom: 10px;
}

#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-fortnight{
  float: left;
  width: 100%;
  height: 50px;
  text-decoration: none;
  border-bottom: 1px solid var(--bs-border-table);
  border-left: 1px solid var(--bs-border-table);
  color: #212529;
  font-weight: 300;
  line-height: 48px;
  padding: 0 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-fortnight .href{
  color: #212529;
  text-decoration: none;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-fortnight-point{
  overflow: initial;
  text-overflow: initial;
  white-space: initial;
  padding: 0;

}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-fortnight-point.link-fortnight-sunday{
  background-color: #e8f6fd; /*cdeefd*/
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-fortnight-point.link-fortnight-holiday{
  background-color: #fff3cd; /*fff3cd*/
}

#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-fortnight-point .icon-checked{
    display: block;
    margin: 5px auto;
    content: url(../images/icons/check_gras.svg);
    width: 40px;
    height: 40px;
    padding: 10px;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-fortnight-point .icon-cross{
    display: block;
    margin: 5px auto;
    content: url(../images/icons/croix_gras.svg);
    width: 40px;
    height: 40px;
    padding: 10px;
}

#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-fortnight .point{
  float: left;
  width: 33px;
  text-align: center;
  height: 13px;
  padding: 0 0px;
  margin-top: 17px;
  /*background-color: #c72e2e;*/
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-fortnight .point .img-point {
    float: left;
    width: 33px;
    height: 13px;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-fortnight .dot{
    float: left;
    width: 33px;
    text-align: center;
    font-size: 8px;
    padding: 0 0;
    color: #1fafcb;
    height: 12px;
    line-height: 12px;
    /*background-color: #e8808b;*/
    /*display: none;*/
}

            
              

            #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href-cards{
              float: left;
              width: 100%;
              height: 50px;
              padding: 0;
              text-decoration: none;
              border-top: 1px solid var(--bs-border-table);
              border-bottom: 1px solid var(--bs-border-table);
              border-left: 1px solid var(--bs-border-table);
              font-weight: 500;
              color: #212529;
              text-align: left;
              font-size: 14px;
            }
            #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href-cards.href-cards-basic{
              line-height: 48px;
              padding: 0 6px 0 6px;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
            }
            #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href-cards.href-cards-num{
              line-height: 48px;
              text-align: center;
            }
            #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href-cards > span{
              float: left;
              width: 100%;
              height: 24px;
              font-size: 10px;
              line-height: 14px;
              text-align: center;
              padding: 0 6px 0 6px;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
            }
            #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href-cards > span:first-child{
              padding-top: 10px;
            }
            #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href-cards > span:last-child{
              padding-bottom: 10px;
            }
            #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href-cards.xxxx{
              float: left;
              width: 100%;
              line-height: 48px;
              height: 50px;
              padding: 0 10px 0 10px;
              text-decoration: none;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
              border-top: 1px solid var(--bs-border-table);
              border-bottom: 1px solid var(--bs-border-table);
              border-left: 1px solid var(--bs-border-table);
              font-weight: 500;
              color: #212529;
              text-align: left;
              font-size: 14px;
            }




            #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href{
              float: left;
              width: 100%;
              line-height: 48px;
              height: 50px;
              padding: 0 10px 0 10px;
              text-decoration: none;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
              border-top: 1px solid var(--bs-border-table);
              border-bottom: 1px solid var(--bs-border-table);
              border-left: 1px solid var(--bs-border-table);
              font-weight: 500;
              color: #212529;
              text-align: left;
              font-size: 14px;
            }
             
              #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href.sort{
                position: relative;
                padding-right: 20px;
              }
              #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href.sort:before{
                display: inline-block;
                font: normal normal normal 14px / 1 "Material Design Icons";
                font-size: inherit;
                text-rendering: auto;
                line-height: inherit;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
                transform: translate(0, 0);
                content: "\F4BA";
                text-align: center;
                width: 20px;
                height: 48px;
                line-height: 50px;
                position: absolute;
                top: 0;
                right: 0px;
                opacity: 0.3;
              }
              #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href.sort:hover:before{
                content: "\F4BC";
                opacity: 1;
              }
              #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href.sort-descending{
                position: relative;
                padding-right: 20px;
              }
              #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href.sort-descending:before{
                display: inline-block;
                font: normal normal normal 14px / 1 "Material Design Icons";
                font-size: inherit;
                text-rendering: auto;
                line-height: inherit;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
                transform: translate(0, 0);
                content: "\F4BD";
                text-align: center;
                width: 20px;
                height: 48px;
                line-height: 50px;
                position: absolute;
                top: 0;
                right: 0px;
              }
              #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href.sort-descending:hover:before{
                content: "\F4BC";
              }
              #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href.sort-ascending{
                position: relative;
                padding-right: 20px;
              }
              #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href.sort-ascending:before{
                display: inline-block;
                font: normal normal normal 14px / 1 "Material Design Icons";
                font-size: inherit;
                text-rendering: auto;
                line-height: inherit;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
                transform: translate(0, 0);
                content: "\F4BC";
                text-align: center;
                width: 20px;
                height: 48px;
                line-height: 50px;
                position: absolute;
                top: 0;
                right: 0px;
              }
              #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row .href.sort-ascending:hover:before{
                content: "\F4BD";
              }
            #portlet .portlet .card-body .table-responsive .table-bord .thead .thead-bord .row-last{
              float: right;
              line-height: 48px;
              height: 50px;
              padding: 0 10px 0 10px;
              text-decoration: none;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
              border-top: 1px solid var(--bs-border-table);
              border-bottom: 1px solid var(--bs-border-table);
              border-left: 1px solid var(--bs-border-table);
              border-right: 1px solid var(--bs-border-table);
              font-weight: 500;
              color: #212529;              
            }
        #portlet .portlet .card-body .table-responsive .table-bord .tbody {
          position: relative;
          float: left;
          width: 100%;
        }
          #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord{
            float: left;
            width: 100%;
          }
            #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord.odd{
              background-color: #f8f9fa;
            }
            #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord:hover{
              background-color: #f2f2f2 !important;
            }            
            #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-first{
              float: left;
              line-height: 48px;
              height: 50px;
              width: 30px;
              text-align: center;
              border-bottom: 1px solid var(--bs-border-table);
              border-left: 1px solid var(--bs-border-table);
              color: #212529;
              font-size: 14px;
            }
              #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord.bord-selected .row-first{
                color: #fb9678 !important;
              }
            #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row{
              float: left;
            }


              #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-cards{
                float: left;
                width: 100%;
                height: 50px;
                padding: 0;
                text-decoration: none;
                border-bottom: 1px solid var(--bs-border-table);
                border-left: 1px solid var(--bs-border-table);
                color: #212529;
                font-weight: 300;
              }
              #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-cards .href{
                color: #212529;
                text-decoration: none;
              }
              #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-cards.link-cards-basic{
                line-height: 48px;
                padding: 0 6px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
              }
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-cards.link-cards-red{
  color: red !important;
  font-weight: 500;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-cards.link-cards-green{
  color: green !important;
  font-weight: 500;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-cards.link-cards-blue{
  color: blue !important;
  font-weight: 500;
}

              #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-cards > span {
                  float: left;
                  width: 100%;
                  height: 18px;
                  font-size: 10px;
                  line-height: 18px;
                  text-align: center;
                  padding: 0 6px 0 6px;
                  overflow: hidden;
                  text-overflow: ellipsis;
                  white-space: nowrap;
                  border-bottom: 1px solid var(--bs-border-table);
              }
              #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-cards.link-cards-issunday > span {
                  background-color: #e8f6fd; /*cdeefd*/
              }
              #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-cards.link-cards-holidays > span {
                  background-color: #fff3cd; /*fff3cd*/
              }
              #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-cards > span:last-child {
                  border-bottom: none;
                  height: 13px;
                  line-height: 13px;
              }

              #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link-xxxxx{
                float: left;
                line-height: 48px;
                height: 50px;
                padding: 0 10px;
                text-decoration: none;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                border-bottom: 1px solid var(--bs-border-table);
                border-left: 1px solid var(--bs-border-table);
                color: #212529;
                font-weight: 300;
              }




              #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link{
                float: left;
                line-height: 48px;
                height: 50px;
                padding: 0 10px;
                text-decoration: none;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                border-bottom: 1px solid var(--bs-border-table);
                border-left: 1px solid var(--bs-border-table);
                color: #212529;
                font-weight: 300;
              }
              #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link .copy{
                position: absolute;
                top: 0;
                right: 0;
                font-size: 8px;
                height: 14px;
                line-height: 14px;
                padding: 0 2px;
                color: red;
                text-decoration: none;
              }
              #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link:has(> .copy) {
                position: relative;
              }
              #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link:has(> .iscopy) {
                background-color: #dee2e6 !important;
              }
              #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row .link .href{
                color: #212529;
                text-decoration: none;
              }
                #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord.bord-selected .row .link .href{
                  color: #fb9678 !important
                }
            #portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last{
              float: right;
              height: 50px;
              border-right: 1px solid var(--bs-border-table);
              border-bottom: 1px solid var(--bs-border-table);
              border-left: 1px solid var(--bs-border-table);
              padding: 0 0 0 8px;
            }








#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href{
  float: left;
  height: 34px;
  padding: 0 12px;
  background-color: #343a40;
  line-height: 32px;
  margin: 8px 8px 0 0;
  color: #fff;
  border-radius: 4px;
  text-decoration: none;
  font-weight: 400;
  border: 1px solid #343a40;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href:hover{
  background-color: #2c3136;
  border: 1px solid #2a2e33;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.scare{
  position: relative;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.scare::after{
  content: '';
  position: absolute;
  top: -18px;
  right: -18px;
  height: 25px;
  width: 25px;
  border: 5px solid #e46a76;
  border-radius: 70px;
  animation: heartbit 1s ease-out;
  animation-iteration-count: infinite;
  animation-iteration-count: infinite
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.scare::before{
  content: '';
  position: absolute;
  top: -4px;
  right: -4px;
  width: 8px;
  height: 8px;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px;
  background-color: #e46a76;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.button-0{
  background-color: #f8f9fa;
  border: 1px solid #dee2e6;
  color: #dee2e6;
  cursor: default;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.button-0:hover{
  background-color: #f8f9fa;
  border: 1px solid #dee2e6;
  
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.button-1{
  background-color: #00c292;
  border: 1px solid #00c292;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.button-1:hover{
  background-color: #26cba2;
  border: 1px solid #1ac89d;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.button-2{
  background-color: #e46a76 ;
  border: 1px solid #e46a76;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.button-2:hover{
  background-color: #e8808b;
  border: 1px solid #e77984;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.button-3{
  background-color: #fec107 ;
  border: 1px solid #fec107;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.button-3:hover{
  background-color: #feca2c;
  border: 1px solid #fec720;
}

#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.button-1-c{
  background-color: #fff;
  color: #00c292;
  border: 1px solid #00c292;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.button-1-c:hover{
  background-color: #26cba2;
  color: #fff;
  border: 1px solid #1ac89d;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.button-2-c{
  background-color: #fff ;
  color: #e46a76;
  border: 1px solid #e46a76;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.button-2-c:hover{
  background-color: #e8808b;
  color: #fff;
  border: 1px solid #e77984;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.button-3-c{
  background-color: #fff ;
  color: #fec107;
  border: 1px solid #fec107;
}
#portlet .portlet .card-body .table-responsive .table-bord .tbody .tbody-bord .row-last .href.button-3-c:hover{
  background-color: #feca2c;
  color: #fff;
  border: 1px solid #fec720;
}






        #portlet .portlet .card-body .table-responsive .table-bord .tfoot {
          position: relative;
          float: left;
          width: 100%;
        }
          #portlet .portlet .card-body .table-responsive .table-bord .tfoot .tfoot-bord{
            float: left;
            width: 100%;
            margin-top: 3px;
          }
            #portlet .portlet .card-body .table-responsive .table-bord .tfoot .tfoot-bord .row{
              float: left;
              line-height: 50px;
              height: 50px;
              font-weight: 300;
            }
            #portlet .portlet .card-body .table-responsive .table-bord .tfoot .tfoot-bord .pagination{
              position: relative;
              float: right;
              margin: 7px 0;
            }
              #portlet .portlet .card-body .table-responsive .table-bord .tfoot .tfoot-bord .paginate{
                position: relative;
                float: left;
                height: 36px;
                display: block;
                line-height: 34px;
                background-color: #fff;
                border: 1px solid #dee2e6;
                color: #fb9678;
                font-size: 14px;
                text-decoration: none;
                text-align: center;
                font-weight: 300;
                margin-left: -1px !important;
                padding: 0 10px;
              }
                #portlet .portlet .card-body .table-responsive .table-bord .tfoot .tfoot-bord .paginate:hover{
                  color: #c97860;
                  background-color: #e9ecef;
                }
                #portlet .portlet .card-body .table-responsive .table-bord .tfoot .tfoot-bord .paginate.num{
                  width: 36px;
                  padding: 0;
                }
                #portlet .portlet .card-body .table-responsive .table-bord .tfoot .tfoot-bord .paginate.active{
                  color: #fff;
                  background-color: #fb9678;
                  border-color: #fb9678;
                  z-index: 3;
                }
                #portlet .portlet .card-body .table-responsive .table-bord .tfoot .tfoot-bord .paginate.disabled{
                  color: #6c757d;
                  background-color: #fff;
                  border-color: #dee2e6;
                }

#portlet .portlet .card-body .form-responsive, 
#popup-page .popup-page .portlet .card-body .form-responsive{
  float: left;
  width: 100%;
  padding: 0 0 20px 20px;
  margin-bottom: 20px;
}
#popup-page .popup-page .portlet .card-body .form-responsive{
  padding: 0 0 0 0 !important;
  margin-bottom: 0 !important;
}

      #portlet .portlet .card-body .form-responsive .form-validation, #popup-page .popup-page .portlet .card-body .form-responsive .form-validation{
        position: relative;
        float: left;
        /*width: 100%;*/
        margin: 0 40px 0  0;
        border: 1px solid transparent;
        border-radius: 4px;
        padding: 16px;
        display: none;
      }
        #portlet .portlet .card-body .form-responsive .form-validation.validation-success, #popup-page .popup-page .portlet .card-body .form-responsive .form-validation.validation-success{
          color: #007458;
          background-color: #ccf3e9;
          border-color: #b3edde;
          display: block;
        }
        #portlet .portlet .card-body .form-responsive .form-validation.validation-danger, #popup-page .popup-page .portlet .card-body .form-responsive .form-validation.validation-danger{
          color: #894047;
          background-color: #fae1e4;
          border-color: #f7d2d6;
          display: block;
        }
      #portlet .portlet .card-body .form-responsive .form-bord, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord{
        float: left;
        width: 100%;
        
      }
        #portlet .portlet .card-body .form-responsive .form-bord .form-body, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body{
          float: left;
          width: 100%;
          padding: 20px 0 0 0;
        }
          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-title, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-title{
            position: relative;
            float: left;
            width: 100%;
            padding-right: 20px;
            margin-bottom: 25px;
          }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-title > div, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-title > div{
              float: left;
              width: 100%;
              height: 49px;
              padding-bottom: 15px;
              border-bottom: 1px solid rgba(33, 37, 41, 0.25);
            }
              #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-title > div > span, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-title > div > span{
                font-weight: 500;
                float: left;
                height: 34px;
                line-height: 34px;
                font-size: 18px; /*24px*/
            }
              #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-title > div .nav-buttons, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-title > div .nav-buttons {
                float: right;
              }
                #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-title > div .nav-buttons .href, 
                #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-title > div .nav-buttons .href{
                  float: left;
                  height: 34px;
                  padding: 0 12px;
                  background-color: #03a9f3;
                  line-height: 32px;
                  margin: 0 0 0 20px;
                  color: #fff;
                  border-radius: 4px;
                  text-decoration: none;
                  font-weight: 400;
                  border: 1px solid #03a9f3;
                }
                  #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-title > div .nav-buttons .href:hover, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-title > div .nav-buttons .href:hover{
                    background-color: #29b6f5;
                    border-color: #1cb2f4
                  }

                #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-title > div .nav-buttons .href.copy-price-hide, 
                #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-title > div .nav-buttons .href.copy-price-hide{
                  display: none;
                }

#portlet .portlet .card-body .form-responsive .form-bord .form-body .form-title > div .nav-buttons .href.href-c{
  background-color: #fff;
  color: #03a9f3;
  border: 1px solid #03a9f3;
}
#portlet .portlet .card-body .form-responsive .form-bord .form-body .form-title > div .nav-buttons .href.href-c:hover{
  background-color: #29b6f5;
  color: #fff;
  border-color: #1cb2f4
}                

          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-upload, 
          #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-upload{
            position: relative;
            float: left;
            width: 100%;
            padding-right: 20px;
          }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-upload .drop-area, 
            #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-upload .drop-area{
              position: relative;
              float: left;
              width: 100%;
              border: 2px dashed #007BFF;
              padding: 10px;
              cursor: pointer;
              text-align: center;
            }
              #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-upload .drop-area #file-upload, 
              #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-upload .drop-area #file-upload{
                display: none;
              }
              #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-upload .drop-area #drop-preview, 
              #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-upload .drop-area #drop-preview{
                float: left;
                width: 856px;
                height: 449.39px;
              }


#portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group-parent{
  position: relative;
  float: left;
  width: 100%;
}
#portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group-parent.disabled{
  display: none;
}     
          

          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group{
            position: relative;
            float: left;
            width: 100%;
            padding-right: 20px;
            padding-bottom: 20px;
          }
          #portlet .portlet .card-body .form-responsive .form-bord .form-body.form-body-table .form-group.no-form-body-table{
            padding-bottom: 20px !important;
          }


            #portlet .portlet .card-body .form-responsive .form-bord .form-body.form-body-table .form-group, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body.form-body-table .form-group{
              padding-bottom: 4px;
            }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-15, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-15{
              width: 15%;
            }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-20, 
            #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-20{
              width: 20%;
            }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-30, 
            #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-30{
              width: 30%;
            }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-40, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-40{
              width: 40%;
            }
              #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-40-80{
                /* -80px de width & -20 de padding = -100px */
                width: -moz-calc(40% - 100px);
                width: -webkit-calc(40% - 100px);
                width: -o-calc(40% - 100px);
                width: calc(40% - 100px);
              }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-80, 
            #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-80{
              width: 80%;
            }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-60, 
            #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-60{
              width: 60%;
            }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-50, 
            #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-50{
              width: 50%;
            }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-29, 
            #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-29{
              width: 29%;
            }              
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-25, 
            #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-25{
              width: 25%;
            }  
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-20, 
            #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-20{
              width: 20%;
            }  
#portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-25, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-25{
  width: 25%;
}  
#portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-33, 
#popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-33{
  width: 33%;
}  
#portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-34, 
#popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-34{
  width: 34%;
}  
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-50, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-50{
              width: 50%;
            }   
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-75, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-75{
              width: 75%;
            }  
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-80, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-80{
              width: 80%;
            }            
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-control, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-control{
              width: 100px;
            }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-control .href, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-control .href{
              float: left;
              height: 36px;
              padding: 0 12px;
              background-color: #03a9f3;
              line-height: 34px;
              color: #fff;
              border-radius: 4px;
              text-decoration: none;
              font-weight: 400;
              border:1px solid #03a9f3;
              width: 100%;
              text-align: center;
            }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-control .href.href-clear, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-control .href.href-clear{
              background-color: #e46a76 ;
              border: 1px solid #e46a76;
            }
              #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-control .href.href-clear:hover, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group.form-group-control .href.href-clear:hover{
                background-color: #e8808b;
                border: 1px solid #e77984;
              }
          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-label, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-label{
            position: relative;
            float: left;
            width: 100%;
            overflow: hidden;
            height: 22px;
            line-height: 22px;
            margin-bottom: 8px;
            font-size: 14px;
            font-weight: 400;
          }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-label > span, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-label > span{
              color: red;
            }

            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-label .operation-link, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-label .operation-link{
              font-size: 12px;
              position: absolute;
              right: 0;
              top: 0;
              height: 22px;
              line-height: 20px;
              text-decoration: none;
              padding: 0 12px;
              background-color: #03a9f3;
              margin: 0 0 0 20px;
              color: #fff;
              border-radius: 4px;
              text-decoration: none;
              font-weight: 400;
              border: 1px solid #03a9f3;              
            }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-label .operation-link:hover, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-label .operation-link:hover{
              background-color: #29b6f5;
              border-color: #1cb2f4
            } 





          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ,
          #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ{
            position: relative;
            float: left;
            width: 100%;
            margin-bottom: 4px;
          }  
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ.alert-danger::before,
            #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ.alert-danger::before{

              display: inline-block;
              font: normal normal normal 24px / 1 "Material Design Icons";
              text-rendering: auto;
              -webkit-font-smoothing: antialiased;
              -moz-osx-font-smoothing: grayscale;
              transform: translate(0, 0);

              content: "\F02A";
              position: absolute;
              right: 0;
              top: 0;
              width: 36px;
              height: 36px;
              text-align: center;
              line-height: 36px;
              font-size: 24px;              
              z-index: 1;

              color: #e46a76;
              animation: clignoter 1s infinite alternate;
            }  
            @keyframes clignoter {
              0% {
                opacity: 1;
              }
              50% {
                opacity: 0;
              }
              100% {
                opacity: 1;
              }
            }
          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-select, 
          #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-select{
            visibility: hidden;
          }        
          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-textarea, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-textarea{
            position: relative;
            float: left;
            width: 100%;
            height: 36px;
            line-height: 34px;
            font-weight: 400;
            font-size: 14px;
            background-color: #fff;
            background-clip: padding-box;
            border: 1px solid #e9ecef;
            border-radius: 4px;
            padding: 0 12px;
            color: #212529;
            font-family: var(--bs-font-sans-serif);
            height: 200px;
            resize: none;
          }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-textarea.form-textarea-hide, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-textarea.form-textarea-hide{
              display: none;
            } 
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-textarea:focus, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-textarea:focus {
              color: #212529;
              background-color: #fff;
              /*border-color: rgba(0,0,0,.1);*/
              border-color: #aaa;
              outline: 0;

              -webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, .15);
              box-shadow: 0 4px 5px rgba(0, 0, 0, .15);
           
            }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-textarea::placeholder, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-textarea::placeholder {
              color: #999;
              opacity: 1
            }
#portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input, 
#popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input{
  position: relative;
  float: left;
  width: 100%;
  height: 36px;
  line-height: 34px;
  font-weight: 400;
  font-size: 14px;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #e9ecef;
  border-radius: 4px;
  padding: 0 12px;
  color: #212529;
  font-family: var(--bs-font-sans-serif);
}
#portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input:read-only, 
#popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input:read-only{
  background-color: #f8f9fa;
}

#portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input.input-uppercase, 
#popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input.input-uppercase{
  text-transform: uppercase;
}



          
          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ.alert-danger .form-input, 
          #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ.alert-danger .form-input{
            padding-right: 34px;
          }
          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input-right, 
          #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input-right{
            text-align: right;
          }
            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input.form-input-hide, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input.form-input-hide{
              display: none;
            } 
#portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input:focus, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input:focus {
  color: #212529;
  background-color: #fff;
  /*border-color: rgba(0,0,0,.1);*/
  border-color: #aaa;
  outline: 0;

  -webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, .15);
  box-shadow: 0 4px 5px rgba(0, 0, 0, .15);

}
#portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input:read-only:focus, 
#popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input:read-only:focus {
  color: #212529;
  background-color: #f8f9fa;
  border-color: #e9ecef;
  -webkit-box-shadow: none;
  box-shadow: none;
}


            #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input::placeholder, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .form-input::placeholder {
              color: #999;
              opacity: 1
            }

          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .select-multiple{
            position: relative;
            float: left;
            width: 100%;
          }
          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .select-multiple .select-multiple-from,
          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .select-multiple .select-multiple-to {
            position: relative;
            float: left;
            width: 50%;
          }
          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .select-multiple .select-multiple-from{
            padding: 0 10px 0 0;
          }
          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .select-multiple .select-multiple-to{
            padding: 0 0 0 10px;
          }
          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .select-multiple .select-multiple-from .form-control,
          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .select-multiple .select-multiple-to .form-control{
            position: relative;
            float: left;
            width: 100%;
            font-weight: 400;
            font-size: 14px;
            background-color: #fff;
            background-clip: padding-box;
            border: 1px solid #e9ecef;
            border-radius: 4px;
            padding: 12px;
            color: #212529;
            font-family: var(--bs-font-sans-serif);
          }
          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .select-multiple .select-multiple-from .form-control:focus ,
          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-champ .select-multiple .select-multiple-to .form-control:focus {
            color: #212529;
            background-color: #fff;
            /*border-color: rgba(0,0,0,.1);*/
            border-color: #aaa;
            outline: 0;

            -webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, .15);
            box-shadow: 0 4px 5px rgba(0, 0, 0, .15);
         
          }



        #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-small, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-small{
          float: left;
          width: 100%;
          height: 16px;
          line-height: 16px;
          font-size: 11px;
          color: #6c757d;
          font-weight: 400;   
        }
          #portlet .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-small.alert-danger, #popup-page .popup-page .portlet .card-body .form-responsive .form-bord .form-body .form-group .form-small.alert-danger{
            color: #e46a76;  
          }
#popup-page .popup-page#lexilogos .portlet .card-body .form-responsive{
  padding-right: 20px !important;
}
#popup-page .popup-page#lexilogos .portlet .card-body .form-responsive #lexilogosArea{
    position: relative;
    display: grid;
    width: 100%;
    font-weight: 400;
    font-size: 14px;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #e9ecef;
    border-radius: 4px;
    padding: 10px 12px;
    color: #212529;
    font-family: var(--bs-font-sans-serif);
    height: 200px;
    resize: none;
    margin-top: 20px;
    text-align: right;
    margin-bottom: 20px;
}
#popup-page .popup-page#lexilogos .portlet .card-body .form-responsive #lexilogosArea:focus{
    color: #212529;
    background-color: #fff;
    /*border-color: rgba(0,0,0,.1);*/
    border-color: #aaa;
    outline: 0;

    -webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, .15);
    box-shadow: 0 4px 5px rgba(0, 0, 0, .15);
}
/* Clavier moderne */
#popup-page .popup-page#lexilogos .portlet .card-body .form-responsive .keyboard-lexilogos {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 6px;
    max-width: 100%;
    margin-bottom: 20px;
}

/* Boutons clavier */
#popup-page .popup-page#lexilogos .portlet .card-body .form-responsive .key {
    background: #4a90e2;
    color: white;
    font-size: 16px;
    font-weight: bold;
    border: none;
    border-radius: 8px;
    text-align: center;
    cursor: pointer;
    user-select: none;
    transition: all 0.15s ease;
    height: 48px;
    line-height: 48px;
}

#popup-page .popup-page#lexilogos .portlet .card-body .form-responsive .key:hover {
    background: #357ABD;
    transform: translateY(-2px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

#popup-page .popup-page#lexilogos .portlet .card-body .form-responsive .key:active {
    background: #2C5F9B;
    transform: translateY(0);
    box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}

/* Boutons larges */
#popup-page .popup-page#lexilogos .portlet .card-body .form-responsive .wide-two { grid-column: span 2; }
#popup-page .popup-page#lexilogos .portlet .card-body .form-responsive .wide-six { grid-column: span 6; }

/* Responsive mobile */
@media (max-width: 600px) {
    #popup-page .popup-page#lexilogos .portlet .card-body .form-responsive .keyboard-lexilogos {
        grid-template-columns: repeat(6, 1fr);
    }
    #popup-page .popup-page#lexilogos .portlet .card-body .form-responsive .key { font-size: 18px; padding: 10px 0; }
}



#mini-score{
  display: block;
  float: left;
  width: 100%;
}
#mini-score .mini-score{
  float: left;
  width: 100%;
}
#mini-score .mini-score .score-value{
  float: left;
  width: 90px;
}
#mini-score .mini-score .score-value .score-row{
  float: left;
  width: 90px;
  height: 50px;
  border-top: 1px solid var(--bs-border-table);
  border-left: 1px solid var(--bs-border-table);
  border-right: 1px solid var(--bs-border-table);
}
#mini-score .mini-score .score-value .score-row .href{
  float: left;
  height: 34px;
  padding: 0 12px;
  background-color: #03a9f3;
  line-height: 32px;
  margin: 8px 8px 0 0;
  color: #fff;
  border-radius: 4px;
  text-decoration: none;
  font-weight: 400;
  border: 1px solid #03a9f3;
}
#mini-score .mini-score .score-value .score-row .href:hover{
  background-color: #29b6f5;
  border-color: #1cb2f4
}
#mini-score .mini-score .score-value .score-row .href.href-c{
  background-color: #fff;
  color: #03a9f3;
  border: 1px solid #03a9f3;
}
#mini-score .mini-score .score-value .score-row .href.href-c:hover{
  background-color: #29b6f5;
  color: #fff;
  border-color: #1cb2f4
}
#mini-score .mini-score .score-value .score-row:first-child{
  padding: 0 0 0 8px;
}
#mini-score .mini-score .score-value .score-row:last-child{
      border-bottom: 1px solid var(--bs-border-table);
}
    
#mini-score .mini-score .score-value .score-row.row-d{
  float: left;
  text-align: center;
  line-height: 40px;
  height: 40px;
  font-weight: 500;
  cursor: pointer;
}
#mini-score .mini-score .score-value .score-row.row-h{
  float: left;
  text-align: center;
  line-height: 40px;
  height: 40px;
  font-weight: 500;
  cursor: pointer;
}
#mini-score .mini-score .score-value .row-hr{
  float: left;
  width: 90px;
  height: 10px;
  border-top: 1px solid var(--bs-border-table);
  border-left: 1px solid #fff;
  border-right: 1px solid #fff;
}
#mini-score .mini-score .score-col{
  float: left;
  width: 30px;
}
#mini-score .mini-score .score-col .score-day{
  float: left;
  width: 30px;
  height: 50px;
  line-height: 48px;
  text-align: center;
  font-weight: 500;

  border-top: 1px solid var(--bs-border-table);
  border-right: 1px solid var(--bs-border-table);
}
#mini-score .mini-score .score-col .score-day.highlight {
    background: #fae1e4;
    transition: background 0.2s;
}
#mini-score .mini-score .score-col .score-row{
  float: left;
  width: 30px;
  height: 40px;
  border-top: 1px solid var(--bs-border-table);
  border-right: 1px solid var(--bs-border-table);
}
#mini-score .mini-score .score-col .score-row.score-row-issunday{
  background-color: #e8f6fd;
}
#mini-score .mini-score .score-col .score-row.score-row-holidays{
  background-color: #fff3cd;
}



#mini-score .mini-score .score-col .score-row:last-child{
  border-bottom: 1px solid var(--bs-border-table); 
}
#mini-score .mini-score .score-col .score-row .label{
  float: left;
  width: 100%;
  height: 40px;
  line-height: 40px;
  cursor: pointer;
}
#mini-score .mini-score .score-col .score-row .label .radio{
  float: left;
  height: 40px;
  line-height: 40px;
  width: 100%;
}

#mini-score .mini-score .score-col .score-row .label .radio [type="radio"]:not(:checked), #mini-score .mini-score .score-col .score-row .label .radio [type="radio"]:checked {
    position: absolute;
    left: -9999px;
}
#mini-score .mini-score .score-col .score-row .label .radio [type="radio"]:not(:checked) + div,
#mini-score .mini-score .score-col .score-row .label .radio [type="radio"]:checked + div {
	position: relative;
	float: left;
	width: 100%;
	height: 40px;
	margin: 0;
    text-align: center;
    font-size: 14px;
	/*background-color: #2b3643;*/
	color: transparent; /*#fff/
}
#mini-score .mini-score .score-col .score-row .label.label-radio-1 .radio [type="radio"]:checked + div {
	/*background-color: #fff;*/
}
#mini-score .mini-score .score-col .score-row .label.label-radio-1 .radio [type="radio"]:not(:checked) + div .bg-hide  {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 0;
    height: 24px;
    color: #212529;
    opacity: 0.4;
    font-size: 10px;
}
#mini-score .mini-score .score-col .score-row .label.label-radio-1 .radio [type="radio"]:checked + div .fa  {
  background-color: #3598dc;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  margin: 13px 8px;
}

#mini-score .mini-score .score-col .score-row .label.label-radio-2 .radio [type="radio"]:checked + div .fa{
	color: #8E44AD;
}

#mini-score .mini-score .score-col .score-row .label .radio [type="radio"]:checked ~ .td{
	background-color: red;
}
#mini-score .mini-score .score-col .score-row .label .radio [type="radio"]:not(:checked) + div:before {
    width: 100%;
    height: 34px;
	top: 0;
	left: 0;
}

#mini-score .mini-score .score-col .score-row .label .radio [type="radio"]:checked + div:before {
	top: 0;
    left: 0;
    width: 100%;
    height: 40px;
}

#mini-score .mini-score .score-col .score-row .label .radio [type="radio"]:checked + div:after {
	top: 0px;
	left: 0px;
	width: 100%;
	height: 40px;
	z-index: 0;
}


#mini-score .mini-score .score-col .score-row .label .radio [type="radio"] + div:before,
#mini-score .mini-score .score-col .score-row .label .radio [type="radio"] + div:after {
  content: '';
  position: absolute;
  left: 0;

}
#mini-score .mini-score .score-col .row-hr {
  float: left;
  width: 30px;
  height: 10px;
  border-top: 1px solid var(--bs-border-table);
  border-right: 1px solid #fff;
}








#consult-smag .smag-bord{
  float: left;
  width: 100%;
  padding-right: 20px;
  padding-top: 20px;
}
#consult-smag .smag-bord .thead {
  position: relative;
  float: left;
  width: 100%;
}
#consult-smag .smag-bord .thead .thead-bord {
  float: left;
  width: 100%;
}
#consult-smag .smag-bord .thead .thead-bord .row {
  float: left;
  width: 100%;
}
#consult-smag .smag-bord .thead .thead-bord .row .row-thead {
  float: left;
  width: 20%;
  line-height: 48px;
  height: 50px;
  padding: 0 10px 0 10px;
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border-top: 1px solid var(--bs-border-table);
  border-bottom: 1px solid var(--bs-border-table);
  border-left: 1px solid var(--bs-border-table);
  font-weight: 500;
  color: #212529;
  text-align: center;
  font-size: 14px;
}
#consult-smag .smag-bord .thead .thead-bord .row .row-thead:last-child {
  border-right: 1px solid var(--bs-border-table);

}
#consult-smag .smag-bord .tbody {
  position: relative;
  float: left;
  width: 100%;
}
#consult-smag .smag-bord .tbody .tbody-bord {
  float: left;
  width: 100%;
}
#consult-smag .smag-bord .tbody .tbody-bord .row {
  float: left;
  width: 100%;
}
#consult-smag .smag-bord .tbody .tbody-bord .row .row-tbody {
  float: left;
  width: 20%;
  line-height: 48px;
  height: 50px;
  padding: 0 10px;
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border-bottom: 1px solid var(--bs-border-table);
  border-left: 1px solid var(--bs-border-table);
  color: #212529;
  font-weight: 300;
  text-align: center;
}
#consult-smag .smag-bord .tbody .tbody-bord .row .row-tbody:last-child {
  border-right: 1px solid var(--bs-border-table);
}






/* PAGE LOGIN */
#login{
    position: fixed;
    float: left;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    height: 100%;
    background-image: url(../images/background/login-register.jpg);
}
  #login .login{
      position: relative;
      float: left;
      width: 100%;
  }
    #login .login .login-box{
        right: 0px;
        position: fixed;
        height: 100%;
        display: flex;
        background-color: #fff;
        background-clip: border-box;
        border: 0 solid transparent;
        border-radius: 0;    
        width: 400px;
    }
      #login .login .login-box .login-form{
          float: left;
          width: 100%;
          padding: 20px;
      }
        #login .login .login-box .login-form .logo-icon{
          float: left;
          width: 100%;
          height: 40px;
        }
          #login .login .login-box .login-form .logo-icon > img{
            float: left;
            width: 360px;
            padding: 0 160px;
            height: 40px;
          }
        #login .login .login-box .login-form .logo-text{
          float: left;
          width: 100%;
          height: 21px;
        }
          #login .login .login-box .login-form .logo-text > img{
            float: left;
            width: 360px;
            padding: 0 126px;
            height: 21px;
          }
        #login .login .login-box .login-form .form-group{
          float: left;
          width: 100%;
          margin-top: 25px;
          display: block;
        }
          #login .login .login-box .login-form .form-group .input{
            float: left;
            font-family: var(--bs-font-sans-serif);
            font-weight: 400;
            font-size: 14px;
            height: 40px;
            width: 100%;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            position: relative;
            vertical-align: middle;
            white-space: nowrap;
            padding: 0 ;
            outline: none;
            color: #212529;
            border: 0 none;
            border-bottom: 1px solid #e9ecef;
          }
          #login .login .login-box .login-form .form-group .forgot-pwd{
            float: left;
            color: #6c757d !important;
            text-decoration: none;
          }
            #login .login .login-box .login-form .form-group .forgot-pwd:hover{
              text-decoration: underline;
            }
          #login .login .login-box .login-form .form-group .submit{
            float: left;
            width: 100%;
            height: 52px;
            line-height: 52px;
            text-align: center;
            text-transform: uppercase;
            background-color: #03a9f3;
            cursor: pointer;
            border-radius: 60px;
            color: #fff !important;
            font-size: 16px;
            font-weight: 400;
            text-decoration: none;
          }
            #login .login .login-box .login-form .form-group .submit:hover{
              background-color: #29b6f5;
            }
          #login .login .login-box .login-form .form-group .developer{
            float: left;
            width: 48px;
            height: 48px;
            border-radius: 4px;
            margin: 0 2px;
          }
            #login .login .login-box .login-form .form-group .developer.developer-html5{
              background-image: url(../images/icons/html5-icon.png);
              margin-left: 104px;
            }
            #login .login .login-box .login-form .form-group .developer.developer-css3{
              background-image: url(../images/icons/css3-icon.png);
            }
            #login .login .login-box .login-form .form-group .developer.developer-js{
              margin-right: 104px;
              background-image: url(../images/icons/javascript-icon.png);
            }
          #login .login .login-box .login-form .form-group .inscription{
            float: left;
            text-align: center;
            width: 100%;
          }
            #login .login .login-box .login-form .form-group .inscription > a{
              color: #6c757d !important;
              text-decoration: none;
            }
              #login .login .login-box .login-form .form-group .inscription > a:hover{
                text-decoration: underline;
              }
        #login .login .login-box .login-form .alert{
          position: relative;
          float: left;
          width: 100%;
          margin-top: 25px;
          border: 1px solid transparent;
          border-radius: 4px;
          padding: 16px;
          display: none;
        }
          #login .login .login-box .login-form .alert.alert-success{
            color: #007458;
            background-color: #ccf3e9;
            border-color: #b3edde;
          }
          #login .login .login-box .login-form .alert.alert-danger{
            color: #894047;
            background-color: #fae1e4;
            border-color: #f7d2d6;
          }




#popup-page .popup-page{
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  display: none; /* none */
  cursor: no-drop;	
}
  #popup-page .popup-page .popup{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    background-color: rgba(0, 0, 0, 0.4);
  }
    #popup-page .popup-page .popup .popup-wrapper{  
      position: fixed;
      display: table;
      height: auto;
      width: 1000px;
      overflow: hidden;
      margin: auto;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      cursor: default;
    }
      #popup-page .popup-page .popup .popup-wrapper .new-page{
        float: left;
        width: 100%;
        background-color: #fff;
        padding: 20px;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
      }







#popup-remove{
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  display: none; /* none */
  cursor: no-drop;	
}
  #popup-remove .popup{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    background-color: rgba(0, 0, 0, 0.4);
  }
    #popup-remove .popup .popup-wrapper{
      position: fixed;
      display: table;
      height: auto;
      width: 500px;
      overflow: hidden;
      margin: auto;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      cursor: default;
    }
    #popup-remove .popup .popup-wrapper .popup-page{
      float: left;
      width: 100%;
      background-color: #fff;
      padding: 40px;
      -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
      border-radius: 4px;
    }
      #popup-remove .popup .popup-wrapper .popup-page .popup-header{
        position: relative;
        float: left;
        width: 100%;
      }
        #popup-remove .popup .popup-wrapper .popup-page .popup-header .icon{
          position: relative;
          float: left;
          width: 100%;
          height: 88px;
          text-align: center;
          margin-bottom: 24px;
        }
          #popup-remove .popup .popup-wrapper .popup-page .popup-header .icon .icon-alert{
            width: 88px;
            height: 88px;
            border: 4px solid #f7b731;
            border-radius: 50%;
            margin: 0px auto;
            position: relative;
          }
            #popup-remove .popup .popup-wrapper .popup-page .popup-header .icon .icon-alert .sa-line1 {
              position: absolute;
              width: 5px;
              height: 47px;
              left: 50%;
              top: 10px;
              -webkit-border-radius: 2px;
              border-radius: 2px;
              margin-left: -2px;
              background-color: #f7b731;
            }
            #popup-remove .popup .popup-wrapper .popup-page .popup-header .icon .icon-alert .sa-line2 {
              position: absolute;
              width: 7px;
              height: 7px;
              -webkit-border-radius: 50%;
              border-radius: 50%;
              margin-left: -3px;
              left: 50%;
              bottom: 10px;
              background-color: #f7b731;
            }
            #popup-remove .popup .popup-wrapper .popup-page .popup-header .icon .icon-alert::before {
              -webkit-border-radius: 120px 0 0 120px;
              border-radius: 120px 0 0 120px;
              top: -7px;
              left: -33px;
              -webkit-transform: rotate(-45deg);
              transform: rotate(-45deg);
              -webkit-transform-origin: 60px 60px;
              transform-origin: 60px 60px;
              content: '';
              position: absolute;
              width: 60px;
              height: 120px;
            }

        #popup-remove .popup .popup-wrapper .popup-page .popup-header > span{
          position: relative;
            float: left;
            width: 100%;
            color: #595959;
            font-size: 30px;
            text-align: center;
            font-weight: 600;
            text-transform: none;
            display: block;
            margin-bottom: 5px;
            word-wrap: break-word;
        }
      #popup-remove .popup .popup-wrapper .popup-page .popup-body{
        position: relative;
        float: left;
        width: 100%;
        color: #8499c4;
        font-size: 16px;
        text-align: center;
        font-weight: 300;
      }
        #popup-remove .popup .popup-wrapper .popup-page .popup-body .popup-alert{
          position: relative;
          float: left;
          width: 100%;
          font-weight: 300;
          color: #545454;
          word-wrap: break-word;
          font-size: 18px;
        }
        #popup-remove .popup .popup-wrapper .popup-page .popup-body .popup-boutons{
          position: relative;
          float: left;
          width: 100%;
          margin: 20px 0 0 0;
        }
          #popup-remove .popup .popup-wrapper .popup-page .popup-body .popup-boutons .popup-valid{
            margin: 0 auto;
            font-size: 16px;
            line-height: 26px;
            position: relative;
            overflow: hidden;
            cursor: pointer;
            padding: 10px 34px;
            background-color: #3085d6;
            color: #fff;
            font-weight: 500;
            text-align: center;	
            -webkit-border-radius: 4px;
            -moz-border-radius: 4px;
            border-radius: 4px;
            text-transform: uppercase;
            display: inline-block;
            transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
            text-decoration: none;
          }
            #popup-remove .popup .popup-wrapper .popup-page .popup-body .popup-boutons .popup-valid:hover{
              background-image: linear-gradient(rgba(0, 0, 0, .1), rgba(0, 0, 0, .1));
            }
          #popup-remove .popup .popup-wrapper .popup-page .popup-body .popup-boutons .popup-close{
            margin: 0 auto;
            font-size: 16px;
            line-height: 26px;
            position: relative;
            overflow: hidden;
            cursor: pointer;
            padding: 10px 34px;
            background-color: rgb(221, 51, 51);
            color: #fff;
            font-weight: 500;
            text-align: center;	
            -webkit-border-radius: 4px;
            -moz-border-radius: 4px;
            border-radius: 4px;
            text-transform: uppercase;
            display: inline-block;
            transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
            text-decoration: none;
          }
            #popup-remove .popup .popup-wrapper .popup-page .popup-body .popup-boutons .popup-close:hover{
              background-image: linear-gradient(rgba(0, 0, 0, .1), rgba(0, 0, 0, .1));
            }


#loading {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display:block;
	background-color: #fff;
	z-index: 99999;

    display: none;
}
  #loading .loader {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100%;
      border: 3px solid #fff; 
  }
    #loading .loader .loader_figure{
        width: 120px;
        height: 22px;
        border-radius: 40px;
        color: #1976d2;
        border: 2px solid;
        position: relative;
    }
      #loading .loader .loader_figure::before {
          content: "";
          position: absolute;
          margin: 2px;
          width: 25%;
          top: 0;
          bottom: 0;
          left: 0;
          border-radius: inherit;
          background: currentColor;
          animation: a_loader_figure 1s infinite linear;
      }
      @keyframes a_loader_figure {
          50% {left:100%;transform: translateX(calc(-100% - 4px))}
      }




#portlet .frame{
  display: none;
}