/*================================================================================
	Item Name: Materialize - Material Design Admin Template
	Version: 5.0
	Author: PIXINVENT
	Author URL: https://themeforest.net/user/pixinvent/portfolio
================================================================================

NOTE:
------
PLACE HERE YOUR OWN CSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */


/* Text inputs */
body {
  /* background:url(/images/animated/Wave-9.1s-1920pxanima.png) #ffffff  no-repeat; */
  background-size: auto; 
  background-attachment: fixed;
  background-position: top center;
}    
/*background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab ,#036938);*/


@-webkit-keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 80% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

@keyframes gradient { 
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}


body .text-gradient {
  /*background-image: linear-gradient(45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab ,#036938);*/
background-image: linear-gradient(228deg, #ee7752, #e73c7e, #ae23d5, #0537a9 ,#03562e);
  /*background-image: linear-gradient(45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab ,#036938);*/
  /*background-image:linear-gradient(181deg, #ffffff,#e9e5e5);*/
  background-size: 400% 400%;
  /*-webkit-animation: gradient 60s ease infinite;*/
  /*animation: gradient 60s ease infinite;*/
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

/*filter: drop-shadow(1px 1px 2px rgba(10, 0, 0, 1));*/
position:relative;  
 /*letter-spacing: 2px;*/

}
.shado{
  filter: drop-shadow(1px 1px 2px rgba(10, 0, 0, 1))
}
body .text-gradient-green,.card-header {
  /*background-image: linear-gradient(228deg, #4F2C1D,#78BE20,#046A38,#888B8D,#000000);*/
  background-image: linear-gradient(228deg, #71CC98,#009A44,#00843D,#046A38,#006341);
  /*background-image: linear-gradient(45deg, #78BE20,#046A38,#FFD100,#E1813E,#63666A);*/
  /*background-image:linear-gradient(181deg, #71CC98,#009A44,#00843D,#046A38,#006341);*/
  background-size: 400% 400%;
  /*-webkit-animation: gradient 60s ease infinite;*/
  /*animation: gradient 60s ease infinite;*/
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

/*filter: drop-shadow(1px 1px 2px rgba(10, 0, 0, 1));*/
position:relative;  
 /*letter-spacing: 2px;*/

}
.card-header{
  padding-top:  1rem;             
  padding-left: 1rem;             
  padding-bottom: 0.5rem;
}
/* Color Theme Swatches in Hex */
.Botanic-Garden-Green-2017-1-hex { color: #71CC98; }
.Botanic-Garden-Green-2017-2-hex { color: #009A44; }
.Botanic-Garden-Green-2017-3-hex { color: #00843D; }
.Botanic-Garden-Green-2017-4-hex { color: #046A38; }
.Botanic-Garden-Green-2017-5-hex { color: #006341; }

/* Color Theme Swatches in RGBA */
.Botanic-Garden-Green-2017-1-rgba { color: rgba(112, 204, 151, 1); }
.Botanic-Garden-Green-2017-2-rgba { color: rgba(0, 154, 68, 1); }
.Botanic-Garden-Green-2017-3-rgba { color: rgba(0, 131, 61, 1); }
.Botanic-Garden-Green-2017-4-rgba { color: rgba(4, 105, 56, 1); }
.Botanic-Garden-Green-2017-5-rgba { color: rgba(0, 98, 65, 1); }

/* Color Theme Swatches in HSLA */
.Botanic-Garden-Green-2017-1-hsla { color: hsla(145, 47, 62, 1); }
.Botanic-Garden-Green-2017-2-hsla { color: hsla(146, 100, 30, 1); }
.Botanic-Garden-Green-2017-3-hsla { color: hsla(147, 100, 25, 1); }
.Botanic-Garden-Green-2017-4-hsla { color: hsla(150, 92, 21, 1); }
.Botanic-Garden-Green-2017-5-hsla { color: hsla(159, 100, 19, 1); }



/*.text-gradient-green {

  background-image:linear-gradient(180deg,#71CC98,#009A44,#00843D,#046A38,#006341);
  
  background-size: 100% 100%;
  -webkit-animation: gradient 60s ease infinite;
  animation: gradient 60s ease infinite;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
text-shadow:1px 4px 5px rgb(10 0 0 / 26%);
position:relative;  
 letter-spacing: 1px;

}*/

.appName {
/*color: #FFFFFF;*/

text-shadow: 0 1px 0 #CCCCCC, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.2), 0 20px 20px rgba(0,0,0,.15);
/*color: #FFFFFF;*/
/*color: #d9d9d9;*/
/*background: #ffffff;*/
text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5);


}

body .text-gradient-wellcom {
  background-image: linear-gradient(45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab ,#036938);
/*background-image: linear-gradient(228deg, #ee7752, #e73c7e, #ae23d5, #0537a9 ,#03562e);*/
  text-shadow: 0px 0px 12px rgba(178, 150, 150, 1);
  background-size: 400% 400%;
  /*-webkit-animation: gradient 60s ease infinite;*/
  /*animation: gradient 60s ease infinite;*/
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -moz-background-clip: text;
  -moz-text-fill-color: transparent;
}



@keyframes fly {
  100% {
    transform:rotate(1turn) translate(100px) rotate(-1turn);
  }
}

@keyframes flyPlus {
  100% {
    transform:rotate(-1turn) translate(100px) rotate(1turn);
  }
}



nav ul a:hover {
    background-color: rgba(0, 0, 0, 0);
}
.input-field {
    position: relative;
    margin-top: 0rem;
    margin-bottom: 1rem;
    /*max-height: 50.5px;*/
    max-height: 70.5px;
    /* min-height: 80.5px; */
    height: 70.5px;
}
.error{
      font-size: 0.8rem;
    color: #ff1010;
}

.input-field div.error {
    position: relative;
    top: 0rem;
    left: 0rem;
    font-size: 0.8rem;
    color: #FF4081;
    transform: translateY(0%);
  }
  .error {
 
    font-size: 0.8rem;
    color: #FF4081;
   
  }
.input-field.col label {
    left: 0.80rem;
    font-weight: 300;
    color: #545456;
}
.background {
    width: 100%;
    height: 100%;
   
    position: fixed;
    overflow: hidden;
    z-index: 0;
}

.navbar .navbar-glass {
      background: rgba( 255, 255, 255, 0.25 );
    /*box-shadow: 0 8px 32px 0 rgb(31 38 135 / 37%);*/
    backdrop-filter: blur( 4px );
    -webkit-backdrop-filter: blur( 4px );
    border-bottom: 1px solid rgba( 255, 255, 255, 0.18 )
}

.glass{
    width: 100%;
    margin: 0 auto;
    height: 100%;
    background: #eeeeee8a;
    box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
    backdrop-filter: blur( 28px );
    -webkit-backdrop-filter: blur( 4px );
    position: static;
    overflow: hidden;
    z-index: 1;
}
.base {
  position: absolute;
  filter: blur(60px);
  opacity: 0.8;
}

.one {
  border-radius: 100%;
  width: 1000px;
  height: 1000px;
  background-color: #185d26;
  left: 500px;
  top:-300px;
  z-index: 3;
  /*animation: fly 12s linear infinite;*/
  transform:rotate(0) translate(80px) rotate(0);
  z-index: -9999;
}

.two {
  width: 6000px;
  height: 6499px;
  background-color: #3d8259;
   bottom:-30px; 
   left:-80px; 
  z-index: -1;
}

.three {
  border-radius: 100%;
  width: 450px;
  height: 450px;
  bottom:-80px;
  right:-100px;
  background-color: #4df26e;
  /*animation: flyPlus 8s linear infinite;*/
  transform:rotate(0) translate(100px) rotate(0);
   z-index: -1;
}
.sidenav span.badge {

   font-size: 10px
}

input:not([type]),
input[type=text]:not(.browser-default),
input[type=password]:not(.browser-default),
input[type=email]:not(.browser-default),
input[type=url]:not(.browser-default),
input[type=time]:not(.browser-default),
input[type=date]:not(.browser-default),
input[type=datetime]:not(.browser-default),
input[type=datetime-local]:not(.browser-default),
input[type=tel]:not(.browser-default),
input[type=number]:not(.browser-default),
input[type=search]:not(.browser-default),
textarea.materialize-textarea {
  
    display: block;
    width: 100%;
    height: 40px;
    padding: .175rem .75rem;
    font-size: 1.1rem;
    line-height: 1;
    color: #495057;
    background-color: #ffffff80;
    background-clip: padding-box;
        border: 1px solid rgba(0, 0, 0, 10%);
    border-radius: 5px;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
   }

 input[type=search]:not(.browser-default){
  
    border: 1px solid rgb(0 0 0 / 6%);
   
}

.select-wrapper input.select-dropdown:disabled {
   background: #eee;
    color: rgba(0, 0, 0, 0.42);
    cursor: default;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
input:not([type]):focus:not([readonly]) + label,
input[type=text]:not(.browser-default):focus:not([readonly]) + label,
input[type=password]:not(.browser-default):focus:not([readonly]) + label,
input[type=email]:not(.browser-default):focus:not([readonly]) + label,
input[type=url]:not(.browser-default):focus:not([readonly]) + label,
input[type=time]:not(.browser-default):focus:not([readonly]) + label,
input[type=date]:not(.browser-default):focus:not([readonly]) + label,
input[type=datetime]:not(.browser-default):focus:not([readonly]) + label,
input[type=datetime-local]:not(.browser-default):focus:not([readonly]) + label,
input[type=tel]:not(.browser-default):focus:not([readonly]) + label,
input[type=number]:not(.browser-default):focus:not([readonly]) + label,
input[type=search]:not(.browser-default):focus:not([readonly]) + label,
textarea.materialize-textarea:focus:not([readonly]) + label {
  color: #036938;
  box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%)
}
input:not([type]):focus.valid ~ label,
input[type=text]:not(.browser-default):focus.valid ~ label,
input[type=password]:not(.browser-default):focus.valid ~ label,
input[type=email]:not(.browser-default):focus.valid ~ label,
input[type=url]:not(.browser-default):focus.valid ~ label,
input[type=time]:not(.browser-default):focus.valid ~ label,
input[type=date]:not(.browser-default):focus.valid ~ label,
input[type=datetime]:not(.browser-default):focus.valid ~ label,
input[type=datetime-local]:not(.browser-default):focus.valid ~ label,
input[type=tel]:not(.browser-default):focus.valid ~ label,
input[type=number]:not(.browser-default):focus.valid ~ label,
input[type=search]:not(.browser-default):focus.valid ~ label,
textarea.materialize-textarea:focus.valid ~ label {
  color: #32CD32;
  box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%)
}
input:not([type]):focus.invalid ~ label,
input[type=text]:not(.browser-default):focus.invalid ~ label,
input[type=password]:not(.browser-default):focus.invalid ~ label,
input[type=email]:not(.browser-default):focus.invalid ~ label,
input[type=url]:not(.browser-default):focus.invalid ~ label,
input[type=time]:not(.browser-default):focus.invalid ~ label,
input[type=date]:not(.browser-default):focus.invalid ~ label,
input[type=datetime]:not(.browser-default):focus.invalid ~ label,
input[type=datetime-local]:not(.browser-default):focus.invalid ~ label,
input[type=tel]:not(.browser-default):focus.invalid ~ label,
input[type=number]:not(.browser-default):focus.invalid ~ label,
input[type=search]:not(.browser-default):focus.invalid ~ label,
textarea.materialize-textarea:focus.invalid ~ label {
  color: #FF495F;
  box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%)
}
input:not([type]).validate + label,
input[type=text]:not(.browser-default).validate + label,
input[type=password]:not(.browser-default).validate + label,
input[type=email]:not(.browser-default).validate + label,
input[type=url]:not(.browser-default).validate + label,
input[type=time]:not(.browser-default).validate + label,
input[type=date]:not(.browser-default).validate + label,
input[type=datetime]:not(.browser-default).validate + label,
input[type=datetime-local]:not(.browser-default).validate + label,
input[type=tel]:not(.browser-default).validate + label,
input[type=number]:not(.browser-default).validate + label,
input[type=search]:not(.browser-default).validate + label,
textarea.materialize-textarea.validate + label {
  width: 100%;
}
input:not([type]):disabled, input:not([type])[readonly=readonly],
input[type=text]:not(.browser-default):disabled,
input[type=text]:not(.browser-default)[readonly=readonly],
input[type=password]:not(.browser-default):disabled,
input[type=password]:not(.browser-default)[readonly=readonly],
input[type=email]:not(.browser-default):disabled,
input[type=email]:not(.browser-default)[readonly=readonly],
input[type=url]:not(.browser-default):disabled,
input[type=url]:not(.browser-default)[readonly=readonly],
input[type=time]:not(.browser-default):disabled,
input[type=time]:not(.browser-default)[readonly=readonly],
input[type=date]:not(.browser-default):disabled,
input[type=date]:not(.browser-default)[readonly=readonly],
input[type=datetime]:not(.browser-default):disabled,
input[type=datetime]:not(.browser-default)[readonly=readonly],
input[type=datetime-local]:not(.browser-default):disabled,
input[type=datetime-local]:not(.browser-default)[readonly=readonly],
input[type=tel]:not(.browser-default):disabled,
input[type=tel]:not(.browser-default)[readonly=readonly],
input[type=number]:not(.browser-default):disabled,
input[type=number]:not(.browser-default)[readonly=readonly],
input[type=search]:not(.browser-default):disabled,
input[type=search]:not(.browser-default)[readonly=readonly],
textarea.materialize-textarea:disabled,
textarea.materialize-textarea[readonly=readonly] {
   background: #eee;
    color: rgba(0, 0, 0, 0.42);
    /* border-bottom: 1px dotted rgba(0, 0, 0, 0.42); */
}

.navbar input.header-search-input {
    display: block;
    padding: 8px 8px 8px 65px;
    width: 100%;
    box-sizing: border-box;
    background: hsla(0,0%,100%,.3);
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
    border: none;
    font-size: 16px;
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;
    font-weight: 400;
    outline: none;
    border-radius: 3px;
    margin-bottom: 0;
}
.navbar .header-search-wrapper i {
    position: absolute;
    font-size: 24px;
    top: 6px;
    left: 24px;
    line-height: 32px !important;
    transition: color 200ms ease;
    color: #ffffff
}
.modal .modal-content{
  height: 100%
}
.modal .modal-header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 24px;
    margin-top: 24px;
    /* border-bottom: 1px solid #e9ecef; */
}
.modal-reject { 
 
  left: 0;
  right: 0;
  background-color: #ffffff;
  /*padding: 0;*/
  max-height: 40%;
  width: 25%;
  border-radius: 5px;
  will-change: top, opacity;
 
}
.close-container{
  position: absolute;
  margin: auto;
  width: 20px;
  height: 55px;
  cursor: pointer;
  top: 5px;
  right: 15px;
}
.remove-quotation{
 
  height: 55px;
  cursor: pointer;
  top: 5px;
  right: 15px;
}
.remove-quotation:hover .leftright{
  transform: rotate(-45deg);
  background-color: #F25C66;
}
.remove-quotation:hover .rightleft{
  transform: rotate(45deg);
  background-color: #F25C66;
}
.remove-quotation:hover label{
  opacity: 1;
}
.leftright{
  height: 4px;
  width: 20px;
  position: absolute;
  margin-top: 15px;
  background-color: #646362;
  border-radius: 2px;
  transform: rotate(45deg);
  transition: all .3s ease-in;
}

.rightleft{
  height: 4px;
  width: 20px;
  position: absolute;
  margin-top: 15px;
  background-color: #646362;
  border-radius: 2px;
  transform: rotate(-45deg);
  transition: all .3s ease-in;
}

.brand-sidebar {
    position: fixed;
    left: 0;
    height: 64px;
    top: 0px;
     box-shadow: none; 
    width: inherit;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background: #fff;
}

/*.close{
  margin: 23px 0 0 -24px;
  position: absolute;
}*/

.close-container:hover .leftright{
  transform: rotate(-45deg);
  background-color: #F25C66;
}
.close-container:hover .rightleft{
  transform: rotate(45deg);
  background-color: #F25C66;
}
.close-container:hover label{
  opacity: 1;
}

.modalb{
    /* display: flex; */
     justify-content: center;
    /* align-items: center; */
    /* height: 100vh; */
 }



.gradient-animation{
   background-size: 200% 200%;
    background-position: 0 50%;
   /*-webkit-animation: moveGradient 4s infinite linear;*/
    /*animation: moveGradient 4s infinite linear;*/
}


@-webkit-keyframes moveGradient {
  50% {
    background-position: 100% 50%
  }
}

@keyframes moveGradient {
  50% {
    background-position: 100% 50%
  }
}


   { width: 180px;
       height: 50px;
       color: #fff;
       /* margin-left: 44px; */
       background-image: linear-gradient(270deg, #693891 3.68%, #B6305B 38.6%, #D45B20 58.65%, #EAA64F 88.9%);
       background-size: 200% 200%;
       background-position: 0 50%;
       /*-webkit-animation: moveGradient 4s infinite linear;*/
       /*animation: moveGradient 4s infinite linear;*/
       }

 
/*Select2 */

.select2-container--default .select2-selection--single {
    background-color: #ffffff80;
    border: 1px solid rgba(0, 0, 0, 10%);
    /*height: calc(1.2rem + .75rem + 5px);*/
    height: 40px;
    border-radius: 5px;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    /*box-shadow: 0 4px 5px 0 rgb(0 0 0 / 14%), 0 1px 10px 0 rgb(0 0 0 / 12%), 0 2px 4px -1px rgb(0 0 0 / 30%)x*/
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 26px;
    position: absolute;
    top: 9px;
    right: 2px;
    width: 20px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #444;
    line-height: 30px;
}
.select2-results__option {
    padding: 6px 15px;
    user-select: none;
    -webkit-user-select: none;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: #43a047;
    background: -webkit-linear-gradient(45deg, #1f7748, #30A252) !important;
    background: linear-gradient(45deg, #1f7748, #30A252) !important;
    color: white;
}

.brand-sidebar {

  background: #ffffff00;
}

.material-placeholder{
    float: left;
    padding-left: 20px;
}
.modal-content {
    padding: 2% 7%;
}
.modal-content.datepicker-container {
    padding: 0%;
}
.modal .modal-content>.datepicker-container{
    padding: 0px !important;
}
.modal.bottom-sheet {
    top: auto;
    bottom: -100%;
    margin: 0px;
    width: 100%;
    height: 100vh;
    /* max-height: 45%; */
    border-radius: 0rem;
     will-change: bottom, opacity; 
     background:#FFFFFF ;
    /*background: rgba( 255, 255, 255, 0.70 );*/
    box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
    /*backdrop-filter: blur( 10px );*/
    /*-webkit-backdrop-filter: blur( 11.0px );*/
    border: 1px solid rgba( 255, 255, 255, 0.18 );
}

.modal .modal-footer {
    border-radius: 0 0 2px 2px;
    padding: 43px;
    margin-bottom: 20px;
    width: 100%;
    text-align: right;
}

#materialbox-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba( 255, 255, 255, 0.50 ) !important;
              box-shadow: 0 8px 32px 0 #bdbdbd9e;
            backdrop-filter: blur( 12.0px );
            -webkit-backdrop-filter: blur( 12.0px );
            border-radius: 1rem;
            border: 1px solid rgba( 255, 255, 255, 0.18 );
    z-index: 1000;
    /*will-change: opacity;*/
}

.swal2-popup {
            background: rgba( 255, 255, 255, 0.50 ) !important;
              box-shadow: 0 8px 32px 0 #bdbdbd9e;
            backdrop-filter: blur( 12.0px );
            -webkit-backdrop-filter: blur( 12.0px );
            border-radius: 1rem;
            border: 1px solid rgba( 255, 255, 255, 0.18 );

            }

.swal2-container.swal2-backdrop-show, .swal2-container.swal2-noanimation {

   
     background: rgba( 255, 255, 255, 0.25 )  !important;
box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
backdrop-filter: blur( 4px );
-webkit-backdrop-filter: blur( 4px );
border-radius: 10px;
border: 1px solid rgba( 255, 255, 255, 0.18 );

  
}
table.dataTable tbody tr {
    /*background-color: #ffffffa8;*/
    background-color: #ffffff;
}
table{

  table-layout: fixed; 
  width: 100%;
  word-wrap:break-word;
      border-top-right-radius: 15px;
    border-top-left-radius: 15px;
}

@media (max-width: 500.98px) { 
table{

  table-layout: auto; 
  width: 100%;
  word-wrap:break-word;
      border-top-right-radius: 15px;
    border-top-left-radius: 15px;
}
}

@media (min-width: 576px) and (max-width: 767.98px) { 
table{

  table-layout: auto; 
  width: 100%;
  word-wrap:break-word;
      border-top-right-radius: 15px;
    border-top-left-radius: 15px;
}
 }

.table-responsive{
overflow: auto;
    width: 100%;
     border-top-right-radius: 15px;
    border-top-left-radius: 15px;
}
.sidenav {
   
     background-color: #ffffff00; 
  
}
.glass-wall{
/*   background: rgba(255,255,255,0.25);
box-shadow: 20px 20px 40px -6px rgba(0,0,0,0.2);
backdrop-filter: blur(5.2px);
-webkit-backdrop-filter: blur(5.2px);
border-radius: 10px;*/
/*  background: rgba(255,255,255,0.4);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur( 5px );
  /*border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.2);
*/

/*background:#ffffff;*/
background: rgba( 255, 255, 255, 0.25 );
box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
backdrop-filter: blur( 4px );
-webkit-backdrop-filter: blur( 4px );
border: 0.5px solid rgb(255 255 255 / 2%);
/*border: 1px solid rgba( 255, 255, 255, 0.18 );*/
/*
background: rgba( 255, 255, 255, 0.35 );
box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
backdrop-filter: blur( 10.0px );
-webkit-backdrop-filter: blur( 10.0px );
border-radius: 10px;
border: 1px solid rgba( 255, 255, 255, 0.18 );*/
}
.glass-wall-dashboard{
/*   background: rgba(255,255,255,0.25);
box-shadow: 20px 20px 40px -6px rgba(0,0,0,0.2);
backdrop-filter: blur(5.2px);
-webkit-backdrop-filter: blur(5.2px);
border-radius: 10px;*/
  background: rgba(255,255,255,0.4);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur( 5px );
  /*border-radius: 10px;*/
  /*border: 1px solid rgba(255,255,255,0.2);*/


/*
background: rgba( 255, 255, 255, 0.25 );
box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
backdrop-filter: blur( 4px );
-webkit-backdrop-filter: blur( 4px );
border: 0.5px solid rgb(255 255 255 / 2%);*/
/*border: 1px solid rgba( 255, 255, 255, 0.18 );*/
/*
background: rgba( 255, 255, 255, 0.35 );
box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
backdrop-filter: blur( 10.0px );
-webkit-backdrop-filter: blur( 10.0px );
border-radius: 10px;
border: 1px solid rgba( 255, 255, 255, 0.18 );*/
}
.glass-wall-green{
/*   background: rgba(255,255,255,0.25);
box-shadow: 20px 20px 40px -6px rgba(0,0,0,0.2);
backdrop-filter: blur(5.2px);
-webkit-backdrop-filter: blur(5.2px);
border-radius: 10px;*/
  /*background: rgba(255,255,255,0.4);*/
  background-image: linear-gradient(289deg, hsl(137deg 56% 30%), hsl(138, 53%, 42%)) !important;
  backdrop-filter: blur(10px);
  opacity: 95%;
  -webkit-backdrop-filter: blur( 5px );
  /*border-radius: 10px;*/
  /*border: 1px solid rgba(255,255,255,0.2);*/


/*
background: rgba( 255, 255, 255, 0.25 );
box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
backdrop-filter: blur( 4px );
-webkit-backdrop-filter: blur( 4px );
border: 0.5px solid rgb(255 255 255 / 2%);*/
/*border: 1px solid rgba( 255, 255, 255, 0.18 );*/
/*
background: rgba( 255, 255, 255, 0.35 );
box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
backdrop-filter: blur( 10.0px );
-webkit-backdrop-filter: blur( 10.0px );
border-radius: 10px;
border: 1px solid rgba( 255, 255, 255, 0.18 );*/
}
.glass-wall-black{
  background-image: linear-gradient(289deg, hsl(151, 41%, 35%), hsl(0deg 0.4% 48.76%)) !important;
  backdrop-filter: blur(10px);
  opacity: 95%;
  -webkit-backdrop-filter: blur( 5px );
}
.glass-wall-50{
background: rgb(255 255 255 / 94%);
box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
backdrop-filter: blur( 16.0px );
-webkit-backdrop-filter: blur( 16.0px );
border-radius: 0 0 .45rem .45rem;
border: 1px solid rgba( 255, 255, 255, 0.18 );
}

.glass-wall2{
  background: rgba( 255, 255, 255);
  box-shadow: none;
  backdrop-filter: blur( 4px );
  -webkit-backdrop-filter: blur( 4px );
}
.swal-button--confirm {
    background: #0a0;
     background-image: linear-gradient(109.5deg, rgb(13, 11, 136) 9.4%, rgb(86, 255, 248) 78.4%) !important;
     background-size: 200% 200%;
    background-position: 0 50%;
   /*-webkit-animation: moveGradient 4s infinite linear;*/
    /*animation: moveGradient 4s infinite linear;*/
   
}

.swal-button--cancel {
    background: #aaa;
    background-image: linear-gradient(109.6deg, rgb(162 162 162) 11.2%, rgb(243 242 242) 100.3%) !important;
    color: #ccc;
    background-size: 200% 200%;
    background-position: 0 50%;
    /*-webkit-animation: moveGradient 4s infinite linear;*/
    /*animation: moveGradient 4s infinite linear;*/
}

.swal-button--danger {
    background: #a00;
    background-image: linear-gradient(109.6deg, rgb(127, 7, 7) 11.2%, rgb(247, 30, 30) 100.3%) !important;
     background-size: 200% 200%;
    background-position: 0 50%;
   /*-webkit-animation: moveGradient 4s infinite linear;*/
    /*animation: moveGradient 4s infinite linear;*/
}

.swal-button--warning{
    background: #a00;
   background-image: radial-gradient(circle at 10% 20%, rgb(255, 187, 26) 6.7%, rgb(161, 0, 0) 90.3%) !important;
     background-size: 200% 200%;
    background-position: 0 50%;
   /*-webkit-animation: moveGradient 4s infinite linear;*/
    /*animation: moveGradient 4s infinite linear;*/
}

.swal-button--confirm2, .swal-button--confirm2:hover, .swal-button--confirm2:focus {
  background: #C51616;
  /*-webkit-animation: moveGradient 4s infinite linear;*/
  /*animation: moveGradient 4s infinite linear;*/
}

.swal-button--confirm2:hover {
  background: #C51616;
  /*-webkit-animation: moveGradient 4s infinite linear;*/
  /*animation: moveGradient 4s infinite linear;*/
}

.swal-button--cancel2 {
  background: #9A9A9A;
  background-image: linear-gradient(109.6deg, #9A9A9A 11.2%, #9A9A9A 100.3%) !important;
  color: #ccc;
  background-size: 200% 200%;
  background-position: 0 50%;
  /*-webkit-animation: moveGradient 4s infinite linear;*/
  /*animation: moveGradient 4s infinite linear;*/
}

.swal-button--confirm:active {
    background: #0a0;
}

.swal-button--cancel:active {
    background: #aaa;
}

.swal-button--danger:active {
    background: #a00;
}


.weather{
    /*width: 310px;*/
    height: 155px;

background: rgba( 255, 255, 255, 0.25 );
box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
backdrop-filter: blur( 4px );
-webkit-backdrop-filter: blur( 4px );
border-radius: 10px;
border: 1px solid rgba( 255, 255, 255, 0.18 );
/*background: rgba( 155, 155, 155, 0.20 );
box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
backdrop-filter: blur( 2.5px );
-webkit-backdrop-filter: blur( 2.5px );
border-radius: 10px;
border: 1px solid rgba( 255, 255, 255, 0.18 );*/
}

.btn-small {
    text-transform: capitalize;
    padding: 0rem;
}

.introjs-button{
    font-size: 16px;
        background-size: 200% 200%;
    background-position: 0 50%;
    /*-webkit-animation: moveGradient 4s infinite linear;*/
    /*animation: moveGradient 4s infinite linear;*/
    background: #e040fb;
    background-image: radial-gradient(circle at 10% 20%, rgb(252, 117, 117) 0%, rgb(237, 83, 83) 38.2%, rgb(204, 4, 4) 66.4%, rgb(165, 9, 9) 90%) !important;
    text-decoration: none;
    color: #fff;
    background-color: #036938;
    text-align: center;
    letter-spacing: 0.5px;
    transition: background-color 0.2s ease-out;
    cursor: pointer;
    border: none;
    border-radius: .45rem;
    display: inline-block;
    height: 36px;
    line-height: 36px;
    padding: 0 1rem;
    
    vertical-align: middle;
    -webkit-tap-highlight-color: transparent;
    text-shadow: none;
}


.introjs-button:hover ,.introjs-button:focus,.introjs-button:active{
    outline: none;
    text-decoration: none;
  
    color: #ffffff;
     box-shadow: 0 3px 3px 0 rgb(0 0 0 / 14%), 0 1px 7px 0 rgb(0 0 0 / 12%), 0 3px 1px -1px rgb(0 0 0 / 20%);
}



.tag-status{
    text-decoration: none;
    text-align: center;
    letter-spacing: 0.5px;
    transition: background-color 0.2s ease-out;
    cursor: default;
    border: none;
    display: inline-block;
    height: 30px;
    line-height: 30px;
  padding: 0 1rem;
   
    font-size: 0.7rem;
    vertical-align: middle;
    -webkit-tap-highlight-color: transparent;
        border-radius: 150px !important;
        margin-bottom: 1% !important;
            margin-right: 1% !important
}

.tag-status.tag-lg{
  font-size: calc(15px + (26 - 14) * ((100vw - 300px) / (1600 - 300)));
    height: 4rem;
    line-height: 60px;
    padding: 0rem 2rem;
    flex-flow: nowrap;
}


.gradient-cus-70:disabled,.gradient-cus-70.disabled..gradient-cus-70[disabled] {
      background: #cccccc;
      background-image: radial-gradient( circle farthest-corner at -1% 57.5%,  rgba(19,170,82,1) 0%, rgba(0,102,43,1) 90% )!important;
}




@keyframes ldio-xays5wjcf2-r {
  0%, 100% { animation-timing-function: cubic-bezier(0.2 0 0.8 0.8) }
  50% { animation-timing-function: cubic-bezier(0.2 0.2 0.8 1) }
  0% { transform: rotate(0deg) }
  50% { transform: rotate(180deg) }
  100% { transform: rotate(360deg) }
}
@keyframes ldio-xays5wjcf2-s {
  0%, 100% { animation-timing-function: cubic-bezier(0.2 0 0.8 0.8) }
  50% { animation-timing-function: cubic-bezier(0.2 0.2 0.8 1) }
  0% { transform: translate(-26.880000000000003px,-26.880000000000003px) scale(0) }
  50% { transform: translate(-26.880000000000003px,-26.880000000000003px) scale(1) }
  100% { transform: translate(-26.880000000000003px,-26.880000000000003px) scale(0) }
}
.ldio-xays5wjcf2 > div { transform: translate(0px,-13.440000000000001px) }
.ldio-xays5wjcf2 > div > div {
  /*animation: ldio-xays5wjcf2-r 1.5384615384615383s linear infinite;*/
  transform-origin: 112.00000000000001px 112.00000000000001px;
}
.ldio-xays5wjcf2 > div > div > div {
  position: absolute;
  transform: translate(112.00000000000001px, 95.872px);
}
.ldio-xays5wjcf2 > div > div > div > div {
  width: 53.760000000000005px;
  height: 53.760000000000005px;
  border-radius: 50%;
  background: #215d38;
  /*animation: ldio-xays5wjcf2-s 1.5384615384615383s linear infinite;*/
}
.ldio-xays5wjcf2 > div > div:last-child {
  animation-delay: -0.7692307692307692s;
}
.ldio-xays5wjcf2 > div > div:last-child > div > div {
  animation-delay: -0.7692307692307692s;
  background: #14a651;
}
.loadingio-spinner-interwind-lszuaq3bbg8 {
  width: 224px;
  height: 224px;
  margin: 0 auto;
  /*display: inline-block;*/
  overflow: hidden;
  /*background: rgba(NaN, NaN, NaN, 0);*/
}
.ldio-xays5wjcf2 {
  width: 100%;
  height: 100%;
  position: relative;
  transform: translateZ(0) scale(1);
  backface-visibility: hidden;
  transform-origin: 0 0; /* see note above */
}
.ldio-xays5wjcf2 div { box-sizing: content-box; }
/* generated by https://loading.io/ */


.invoice-date-number{
        position: absolute;
    right: 26px;
    top: 15px;
    font-size: 10px;
}
#breadcrumbs-wrapper.breadcrumbs-dark .breadcrumbs-title, #breadcrumbs-wrapper.breadcrumbs-dark a {
    color: #201F1C;
}
#breadcrumbs-wrapper .breadcrumbs > li {
    display: inline-block;
    color: #201F1C;
}

#breadcrumbs-wrapper .breadcrumbs > li.active {
    display: inline-block;
    color: #046A38;
    font-weight: 300;
      text-shadow: 0 0 5px #fafafa;
}

header .brand-logo {
    top: 0;
    position: absolute;
    color: #fff;
    display: inline-block;
    font-size: 2.1rem;
    margin: 1px 0px;
    padding: 10px;
    line-height: 0;
}
header .brand-logo .logo-text {
  letter-spacing: 2px;
}

header .brand-logo .logo-text-system {
    font-size: 9px;
    font-weight: 500;
    letter-spacing: 4px;
    
        left: 7.5rem;    
        top: -20px;

    position: relative;
    visibility: visible;
    opacity: 1;
    transition: opacity 0.2s linear;
}
.brand-sidebar span.logo-text {
    /*color: #ffffff;*/
        position: absolute;
        /*font-family: "Muli", sans-serif !important;*/
    font-size: 35px;
    font-weight: 500;
    top: 30px;
    padding-left: 7px;
    visibility: visible;
    
    /*transition: opacity 0.2s linear;*/
    letter-spacing: 2px;

}
.brand-sidebar span.logo-text-system {
        /*font-family: "Muli", sans-serif !important;*/
  
   font-size: 9px;

        font-weight: 500;
    letter-spacing: 4px;
    left: 7.3rem;
    top: -20px;
    position: relative;
    visibility: visible;
    opacity: 1;
    transition: opacity 0.2s linear;
}
.brand-sidebar .logo-wrapper a.navbar-toggler {
    position: absolute;
    right: 12px;
    top: 0px;
}

.status{
  font-weight: 200
}
.font-b-status{
    font-size: 16px;
    float: right;
    top: -20px;
    position: relative;
    right: -37px;
}
.font-b-status {
    font-size: 16px;
    float: right;
    
    position: relative;

}
.draft-shadow {
text-shadow: rgba(252,91,5,1) 0px 0px 30px;

}
 .sent-to-shadow{
text-shadow: rgba(173,31,81,1) 0px 0px 21px;
}

.ro-app-shadow{

text-shadow: rgba(0,131,143,1) 0px 0px 21px;
}


.po-create-shadow{
  text-shadow: rgba(145,0,171,1) 0px 0px 21px;
}


.po-app-shadow{
  text-shadow: rgba(14,232,21,1) 0px 0px 21px;
}


.reject-shadow{
  text-shadow: 0px 0px 22px rgba(222, 73, 62, 1),0px 0px 20px rgba(255, 174, 33, 1),2px 2px 22px rgba(242, 255, 64, 1);
}

.cancel-shadow{
  text-shadow: rgba(214,13,29,1) 0px 0px 21px;
}
.finance-approved-shadow{
text-shadow: 0px 0px 23px rgba(54,105,235,1);
}
.finance-edit-shadow{

text-shadow: 1px 1px 20px #FFF910, 1px 1px 20px #FFF910, 1px 1px 20px #FFF910;

}
.m-close-shadow{
  text-shadow: 0px 0px 22px rgba(179, 179, 179, 1),0px 0px 20px rgba(62, 56, 64, 1),2px 2px 22px rgba(90, 91, 119, 1);
}
.finance-reject-shadow{
text-shadow: 0px 1px 18px rgba(255, 113, 5, 1);
}

.totalTable{
    text-align: right;
}

kbd {
    /*display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 0.1em 0.5em;
    margin: 0 0.2em;
    box-shadow: 0 1px 0px rgba(0, 0, 0, 0.2), 0 0 0 2px #fff inset;
    background-color: #f7f7f7;*/
    display: inline-block;
    /* border: 1px solid #8d8d8d; */
    border-radius: 4px;
    padding: 0.1em 0.5em;
    margin: 0 0.2em;
    box-shadow: 0 1px 0px rgb(0 0 0 / 20%);
    background-color: #f7f7f730;
}


 #or {
  padding: 0.7rem;
  height: calc(100vh - 54px);
  position: relative;
}

.slide-ro li > a, .slide-ro li a.collapsible-header {
    padding:10px !important;
    height: 83px;
    line-height: 44px;
    font-weight: 400;
    width: 100%;
}
/*.slide-ro li > a, .slide-ro li a.collapsible-header {
    padding: 0 16px !important;
    height: 65px;
    line-height: 60px;
    font-weight: 400;
    width: 100%;
}*/
.slide-ro li {
   
   border-bottom: 1px #cccccc47 solid;
}
.slide-ro .collapsible-header:after {
    font-family: "Material Icons";
    content: "keyboard_arrow_right";
    color: #afafaf;
    font-size: 18px;
    position: absolute;
    right: 10px;
    transition: transform 0.3s ease-in-out, opacity 0.25s ease-in-out 0.1s;
}
.slide-ro-active-square .slide-ro li > a.active {
    border-radius: 0px;
    color: #fff;
    margin-right: 1.15rem;
}
.slide-ro li.active {
   background: #eeeeee5e;
    box-shadow: 0 8px 32px 0 rgb(31 38 135 / 37%);
}
.active-menu {
background-color: #309c57;
background-image: linear-gradient(297deg, #309c57 0%, #077f29 1%, #0a4920 100%);

}

.packt_tip {
 
    margin: 50px 0!important;
 
    font-weight: 300;
 
    font-size: 1em;
 
    line-height: 1.7em;
 
    padding: 2rem;
 
    background-color: #fff;
 
    border-radius: 10px;
 
    box-shadow: 0 5px 30px 0 rgb(89 83 240 / 20%);
 
    position: relative;
}

.select2-container .select2-selection--single {
 
    font-weight: 300;
 
}

.sidenav .navigation-header .navigation-header-text {

    color: #036938;

    font-size: 0.9rem;
    font-weight: 600;
}



.mask-circle {
    display: inline-block;
    object-fit: cover;
    width: 10rem;
    height: 10rem;
    border-radius: 50%;
    overflow: hidden;
}
@media (max-width: 600px) {
.mask-circle {
    display: inline-block;
    object-fit: cover;
    width: 8rem;
    height: 8rem;
    border-radius: 50%;
    overflow: hidden;
}
}


.chips {
    border: none;
    border: 1px solid #ccc;
    box-shadow: none;
    border-radius: 5px;
    margin: 0 0 8px 0;
    height: 50px;
    min-height: 50px;
    max-height: 50px;
    outline: none;
    transition: all 0.3s;
    padding-left: .75rem;
}

.chips.focus{
    border: 1px solid #43a047 !important;
    box-shadow: 0px 0px 2px 0px #43a047;
  }

.modal-overlay {
    position: fixed;
    z-index: 999;
    top: -25%;
    left: 0;
    bottom: 0;
    right: 0;
    height: 125%;
    width: 100%;
    background: rgba( 255, 255, 255, 0.25 );
    box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
    backdrop-filter: blur( 4px );
    -webkit-backdrop-filter: blur( 4px );
    border: 0.5px solid rgb(255 255 255 / 2%);
    display: none;
    will-change: opacity;
    opacity: 1 !important;
}

.btn-floating i {
    width: inherit;
    display: inline-block;
    text-align: center;
    color: #FFFFFF;
    font-size: 1.6rem;
    line-height: 40px;
}

.dropify-wrapper .dropify-message span.file-icon {
    font-size: 14px;
    color: #CCC;
}
.time-status{
      position: absolute;
    color: #ccc;
    font-size: 12px;
    top: 30px;
    left: 15px;

}

.advice{
    font-size: 12px;
    color: #cccccc;
}
.card-alert.success{
  border-radius: 5px !important;
  text-shadow: 0 2px 4px rgb(71 97 206 / 36%);
  background: rgba( 108, 198, 12, 0.6 );
box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
backdrop-filter: blur( 11.5px );
-webkit-backdrop-filter: blur( 11.5px );
border-radius: 10px;
border: 1px solid rgba( 255, 255, 255, 0.18 );
}

.card-alert.error{
  border-radius: 5px !important;
  text-shadow: 0 2px 4px rgb(71 97 206 / 36%);
  background: rgba( 229, 21, 21, 0.65 );
box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
backdrop-filter: blur( 11.5px );
-webkit-backdrop-filter: blur( 11.5px );
border-radius: 10px;
border: 1px solid rgba( 255, 255, 255, 0.18 );
}





.card-alert .card-content{
  padding: 12px 20px !important ;
}


.list-po-approve {
  display: flex;
  justify-content: space-around;
}

.re-tag input:not([type]).valid{
  border: 1px solid #ffffff;
    box-shadow: 0px 0px 2px 0px #FFFFFF !important;
}

.daterangepicker {
    position: fixed !important;
    left: 50% !important;
    top: 40% !important;
            transform:translate(-50%, -50%);
    -webkit-transform:translate(-50%, -50%);
  }
.search-box-c-ro{
       margin:0 0.75rem !important;
      padding: 25px 50px 0px 50px !important;
      box-shadow: 0px 3px 7px -3px rgb(0 0 0 / 30%);                 
}
/*.divider {
  height: 2px;
  width: 80%;
  background: blue;
  background: linear-gradient(90deg, hsl(0, 0%, 20%), hsl(0, 0%, 70%), hsl(0, 0%, 20%));

}*/

.divider {
  height: 20px;
  position: relative;
  width: 100%;
  background: radial-gradient(ellipse farthest-side at top center, rgba(0,0,0,0.08), transparent);
}
.divider2 {
  height: 1px;
  position: relative;
  width: 10%;
  background-color: #B7B7B7;
  padding-left: 15px;
}
.divider3 {
  height: 2px;
  position: relative;
  width: 14%;
  background-color: #20A525;
  padding-left: 15px;
}
.divider:before {
  content: "";
  display: block;
  position: absolute;
  top: 0px;
  right: 0;
  left: 0;
  height: 3px;
  background: linear-gradient(left, transparent, rgba(0,0,0,0.02), rgba(0,0,0,0.02), transparent);
}

.divider1 {
  display: flex;
  align-items: flex-start;
  text-align: left;
}
.divider1:after {
  content: "";
  flex-grow: 1;
  height: 1px;
  background: #cccccc4d;
  min-width: 20px;
  margin: auto;
}
.divider1:after {
  margin-left: 20px;
}




.divider-1 {
  border-bottom: 1px solid #cccccc4d;
  background-color: #ffffff;
  height: 1px;
  margin: 0.5em 0px 1.5em;
}
.divider-1 span {
  display: block;
  width: 150px;
  height: 2px;
  background-color: #046A38;
}

 /*.divider {
  width: 100%;
  height: 1px;
  display: block;
  position: relative;
  margin-bottom: 0em;
  padding: 2em 0;
}
.divider:after, .divider:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  bottom: 50%;
  left: 0;
}
.divider:before {
 background: linear-gradient(90deg, #10111F 0%, #10111F 50%, transparent 50%, transparent 100%);
  background-size: 15px;
  background-position: center;
  z-index: 1;
}
.divider:after {
  transition: opacity 0.3s ease, -webkit-animation 0.3s ease;
  transition: opacity 0.3s ease, animation 0.3s ease;
  transition: opacity 0.3s ease, animation 0.3s ease, -webkit-animation 0.3s ease;
  background: linear-gradient(to right, #62efab 5%, #F2EA7D 15%, #F2EA7D 25%, #FF8797 35%, #FF8797 45%, #e1a4f4 55%, #e1a4f4 65%, #82fff4 75%, #82fff4 85%, #62efab 95%);
  background-size: 200%;
  background-position: 0%;
  -webkit-animation: bar 15s linear infinite;
          animation: bar 15s linear infinite;
}
@-webkit-keyframes bar {
  0% {
    background-position: 0%;
  }
  100% {
    background-position: 200%;
  }
}
@keyframes bar {
  0% {
    background-position: 0%;
  }
  100% {
    background-position: 200%;
  }
}

.divider.anim:before {
  background: linear-gradient(90deg, #10111F 0%, #10111F 5%, transparent 5%, transparent 10%, #10111F 10%, #10111F 15%, transparent 15%, transparent 20%, #10111F 20%, #10111F 25%, transparent 25%, transparent 30%, #10111F 30%, #10111F 35%, transparent 35%, transparent 40%, #10111F 40%, #10111F 45%, transparent 45%, transparent 50%, #10111F 50%, #10111F 55%, transparent 55%, transparent 60%, #10111F 60%, #10111F 65%, transparent 65%, transparent 70%, #10111F 70%, #10111F 75%, transparent 75%, transparent 80%, #10111F 80%, #10111F 85%, transparent 85%, transparent 90%, #10111F 90%, #10111F 95%, transparent 95%, transparent 100%);
  background-size: 150px;
  background-position: center;
  z-index: 1;
  -webkit-animation: bar 120s linear infinite;
          animation: bar 120s linear infinite;
}
.divider.anim:hover:before {
  -webkit-animation-duration: 20s;
          animation-duration: 20s;
}
.divider.anim:hover:after {
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
}*/


 .pagination-oppo{
              padding: 17px;   
              color: #444;
              border-bottom-right-radius: 15px;
              border-bottom-left-radius: 15px;
            }
.pagination{
              line-height: 30px

          }
.pagination li a {
    color: #444;
    display: inline-block;
    font-size: 1rem;
    padding: 0 10px;
    line-height: 30px;
}
.pagination li.active {
    background-color: #046A38;
    background-image: linear-gradient(297deg, #309c57 0%, #077f29 1%, #0a4920 100%);
    padding: 0 6px;
    color: #fff;
    font-size: 1.2rem
}
.pagination li {
    display: inline-block;
    border-radius: 5px;
    text-align: center;
    vertical-align: top;
    height: 30px;
    font-size: 0.5rem
    
}
.pagination li i {
    font-size: 1.5rem;
}
.showing{
            line-height: 30px !important;
            margin: 0px;
         }
/*.pagination li:hover {
      background: linear-gradient(297deg, hsl(0, 0%, 90%), hsl(0, 0%, 70%));
  
}
*/