
.font-base {font-family:system-ui,-apple-system;}
.monsterrat {font-family:'Montserrat' !important;font-style:normal;font-weight:700;}

/* user style */
.hide {display:none;}
.click {cursor:pointer;}
.msg {padding:5px;margin:2px 20px;color:#c00;border:1px solid #aaa;background-color:#fff;font-weight:400;font-size:0.8rem;float:inherit;} 
.success {color:#006d00;background-color:#ecffee !important;border-color:#006d00 !important;}
.error {color:#c00;background-color:#fff4f4 !important;border-color:#c00 !important;}
.passShowHide {display:inline-block;width:20px;position:absolute;top:0.25em;right:10px;color:#6c757d;cursor:pointer;}
.transition-03 {-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out;}
.transition-05 {-webkit-transition:all .5s ease-in-out;-moz-transition:all .5s ease-in-out;-o-transition:all .5s ease-in-out;transition:all .5s ease-in-out;}
.transition-10 {-webkit-transition:all 1s ease-in-out;-moz-transition:all 1s ease-in-out;-o-transition:all 1s ease-in-out;transition:all 1s ease-in-out;}
.upside-down {-webkit-transform:rotate(-180deg);-moz-transform:rotate(-180deg);-o-transform:rotate(-180deg);-ms-transform:rotate(-180deg);transform:rotate(-180deg);}
.zoom {-webkit-transition:all 0.6s ease-out;-moz-transition:all 0.6s ease-out;-ms-transition:all 0.6s ease-out;-o-transition:all 0.6s ease-out;transition:all 0.6s ease-out;}
.zoom:hover {transform:scale(1.5);}

.site-owner {display:inline-block;position:relative;top:0;color:#00e85d;padding:0 3px;font-weight:bold;text-shadow: 2px 2px #fff;font-size:1.2em;}


/* login / password forgot */
.flip-box {perspective:1000px;}
.flip-box-inner {position:relative;width:100%;height:100%;text-align:center;transition:transform 0.8s;transform-style:preserve-3d;}
.flip-box.flipped .flip-box-inner {transform:rotateY(180deg);}
.flip-box-front, .flip-box-back {position:absolute;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;}
.flip-box-front {}
.flip-box-back {transform: rotateY(180deg);}

/* login/forgot/user/admin form tweaks */
.input-wrapper {display:inline-flex;position:relative;text-align:left;font-size:1.25em;}
.input-icon {display:inline-block;position:absolute;left:5px;top:3px;width:25px;font-family:"Font Awesome 5 Free";font-weight:900;font-size:1.2em;color:#6c757d;text-align:center;}
.input-icon-client:before {content:"\f015";}
.input-icon-password:before {content:"\f023";}
.input-icon-user:before {content:"\f406";}
.input-icon-email:before {content:"\f0e0";}
.input-icon-name:before {content:"\f2c1";}
.input-icon-phone:before {content:"\f095";}
.input-icon-mobile:before {content:"\f10b";}
.input-icon-search:before {content:"\f002";}
.input-icon-status:before {content:"\f0b0";}
.input-icon-level:before {content:"\f5fd";}
.input-icon-level:before {content:"\f012";}

/* UI tweaks */
input {-webkit-appearance: none;}
.input-wrapper input, .input-wrapper select {/*width:100% !important;*/ padding-left:2.25em !important;}
.input-error {display:none;position:absolute;top:-15px;right:10px;color:#c00;background-color:#fff4f4;font-size:0.75em;padding:0 3px;border-radius:5px;border:1px dotted #C00;}
.input-wrapper.error input {color:#c00;background-color:#fff4f4 !important;border-color:#c00!important;}
.input-wrapper.error .input-error {display:inline-block;}
.input-wrapper input- {}


.my-shadow-sm {box-shadow:0 0.125rem 0.5rem rgba(0,0,0,.2)!important;}

/* bootstrap missing /changed definitions */
.btn:focus {/*outline:none;box-shadow:none;*/}
.navbar-dark.bg-dark .dropdown-menu {background-color:#343a40;border:1px solid rgb(244,244,244,0.15);}
.navbar-dark.bg-dark .dropdown-menu .dropdown-item {color:rgba(255,255,255,.5);background-color:#343a40;}

.navbar-dark.bg-dark .dropdown-menu .dropdown-item {}
.navbar-dark.bg-dark .dropdown-menu .dropdown-item:hover {color:#fff;background-color:#3d4145;}

.p-4-5 {padding:2.25rem !important;}
.pt-4-5, .py-4-5 {padding-top:2.25rem !important;}
.pr-4-5, .px-4-5 {padding-right:2.25rem !important;}
.pb-4-5, .py-4-5 {padding-bottom:2.25rem !important;}
.pl-4-5, .px-4-5 {padding-left:2.25rem !important;}

.nav-wrapper, .footer-wrapper {position:relative;}
nav.navbar {padding-bottom:.8rem;}
nav.navbar:before {content:"";display:block;position:absolute;bottom:0;left:0;width:100%;height:0.3rem;background-color:var(--bs-body-bg);border-top-left-radius:.3rem;border-top-right-radius:.3rem;}
footer.footer {/*padding-top:.8rem;*/}
footer.footer:before {content:"";display:block;position:absolute;top:0;left:0;width:100%;height:0.3rem;background-color:var(--bs-body-bg);border-bottom-left-radius:.3rem;border-bottom-right-radius:.3rem;}

.nav-link, .dropdown-item {border-left:3px solid transparent;border-right:3px solid transparent;border-radius:5px;}
.nav-link:hover, .dropdown-item:hover {border-color:#999;color:#fff;background-color:#3d4145;}

.dropdown-item {margin-left:5px;width:95%;}

.drop-shadow {filter:drop-shadow(0px 0px 5px rgba(0,0,0,.5));}

.box-shadow-1 {-webkit-box-shadow:inset 0px 0px 0px 1px transparent;-moz-box-shadow:inset 0px 0px 0px 1px transparent;box-shadow:inset 0px 0px 0px 1px transparent;}
.box-shadow-primary {-webkit-box-shadow:inset 0px 0px 0px 1px #007bff!important;-moz-box-shadow:inset 0px 0px 0px 1px #007bff!important;box-shadow:inset 0px 0px 0px 1px #007bff!important;}

.box-shadow-primary-1 {filter:drop-shadow(0px 0px 5px #007bff);}
.box-shadow-secondary-1 {/*filter:drop-shadow(0px 0px 5px #6c757d);*/ box-shadow:0 0.125rem 0.5rem rgba(108,117,125,0.25)!important;}
.box-shadow-success-1 {filter:drop-shadow(0px 0px 5px #28a745);}
.box-shadow-danger-1 {filter:drop-shadow(0px 0px 5px #dc3545);}
.box-shadow-warning-1 {filter:drop-shadow(0px 0px 5px #ffc107);}
.box-shadow-info-1 {filter:drop-shadow(0px 0px 5px #17a2b8);}
.box-shadow-light-1 {filter:drop-shadow(0px 0px 5px #f8f9fa);}
.box-shadow-dark-1 {filter:drop-shadow(0px 0px 5px #343a40);}
.box-shadow-white-1 {filter:drop-shadow(0px 0px 5px #fff);}

.box-shadow-max {box-shadow:0 19.2px 1.9px -25px rgba(0, 0, 0, 0.05),0 29.9px 5.4px -25px rgba(0, 0, 0, 0.074),0 34.9px 13px -25px rgba(0, 0, 0, 0.108),0 40px 43px -25px rgba(0, 0, 0, 0.19);}

.has-float-label {display:block;position:relative;margin-top:1em !important;}
.has-float-label label, .has-float-label > span {position:absolute; /*left:35px;top:-8px;*/ cursor:text;font-size:0.75em;opacity:1;transition:all .2s;}
.has-float-label label {border-top-left-radius:3px;border-top-right-radius:3px;padding:0 3px;top:-1.25em;left:0.25em;overflow:hidden;margin-top:0;}
.has-float-label label {-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out;}
.has-float-label select {-webkit-appearance:none;-moz-appearance:none;appearance:none;}
.has-float-label input, .has-float-label select {font-size:inherit;padding-top:5px;padding-left:5px;margin-bottom:5px;border-radius:0;border:1px solid #ddd;border-bottom:2px solid #ddd;}
.has-float-label input::-webkit-input-placeholder, .has-float-label select::-webkit-input-placeholder {opacity:1;transition:all .2s;}
.has-float-label input:-ms-input-placeholder, .has-float-label select:-ms-input-placeholder {opacity:1;transition:all .2s;}
.has-float-label input::-ms-input-placeholder, .has-float-label select::-ms-input-placeholder {opacity:1;transition:all .2s;}
.has-float-label input::placeholder, .has-float-label select::placeholder {opacity:1;transition:all .2s;}
.has-float-label input:placeholder-shown:not(:focus)::-webkit-input-placeholder, .has-float-label select:placeholder-shown:not(:focus)::-webkit-input-placeholder {opacity:0;}
.has-float-label input:placeholder-shown:not(:focus):-ms-input-placeholder, .has-float-label select:placeholder-shown:not(:focus):-ms-input-placeholder {opacity:0;}
.has-float-label input:placeholder-shown:not(:focus)::-ms-input-placeholder, .has-float-label select:placeholder-shown:not(:focus)::-ms-input-placeholder {opacity:0;}
.has-float-label input:placeholder-shown:not(:focus)::placeholder, .has-float-label select:placeholder-shown:not(:focus)::placeholder {opacity:0;}
.has-float-label input:placeholder-shown:not(:focus) + *, .has-float-label select:placeholder-shown:not(:focus) + * {font-size:1em;opacity:.75;top:.25em;left:2.25em;}
.has-float-label input:focus, .has-float-label select:focus {outline:none;border-color:#777;}
.has-float-label select {padding-right:1em;background:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23333' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right .5em bottom 0.25em;background-size:8px 10px;}


input.error {background-color:#fff4f4;}
span.inputIcon {font-family:"Font Awesome 5 Free";font-weight:900;font-size:1.2em;color:#6c757d;position:absolute;left:30px;top:5px;width:20px;text-align:center;}
span.inputUser:before {content:"\f406";}
/*span.inputClient:before {content:"\f275";}*/
span.inputClient:before {content:"\f1ad";}
span.inputPass:before {content:"\f023";}
span.inputUser:before {content:"\f406";}
span.inputEmail:before {content:"\f0e0";}
span.inputName:before {content:"\f2c1";}
span.inputPhone:before {content:"\f095";}
span.inputMobile:before {content:"\f10b";}

