﻿@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

body {
    font-family: 'Roboto', sans-serif;
   
}

.navbar {
    background-color:#5A20CB !important;
    /*background-color:#383CC1 !important;*/
}

    .navbar ul li {
       
    }

#home_icon {
    
    /*font-size:24px;*/
}

.btn-cont {
    background-color:#02B290;
    color:#fff;
    border-radius :50px;
    padding-left:20px;
    padding-right:20px;
}

.btn-save {
    background-color:#5A20CB;
    color:#fff;
    border-radius :50px;
    padding-left:20px;
    padding-right:20px;
}

/*.btn-cont:hover {
   color:#fff;
}*/

.btn-mark {

    background-color:#f39c12;
    color:#fff;
    border-radius :50px;
    padding-left:20px;
    padding-right:20px;

}

.btn-clear {
    background-color:#3498db;
    color:#fff;
    border-radius :50px;
    padding-left:20px;
    padding-right:20px;
}


.btn-cont-close {
     background-color:#FF6263;
     color:#fff;
     border-radius :50px;
     padding-left:20px;
     padding-right:20px;
}

.btn-delete {
     background-color:#FF6263;
     color:#fff;
     border-radius :50px;
     padding-left:20px;
     padding-right:20px;
}

.btn-refresh {
     background:#ffa502;
     /*background:#1B98F5;*/
     color:#fff;
     border-radius :50px;
     padding-left:20px;
     padding-right:20px;
}

.btn-list {
     background:#1FAA59;
     /*background:#1B98F5;*/
     color:#fff;
     border-radius :50px;
     padding-left:20px;
     padding-right:20px;
}

.btn-row-edit {
    width:30px;
    height:30px;
     background:#1FAA59;
     /*background:#1B98F5;*/
     color:#fff;
     border-radius :50%;
 }

.btn-row-delete {
     background:#FF6263;
     /*background:#1B98F5;*/
     color:#fff;
     border-radius :50%;
 }

.btn-search {
    background:#ecf0f1;
    border:1px solid rgba(0,0,0,0.2);
}


.alert-hide {
    visibility:hidden !important;
}


.txt-danger {
   border-color: #FF0000;
   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 0, 0, 0.6);
}

.txt-danger:focus {
   border-color: #FF0000;
   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 0, 0, 0.6);
}

.pagination li a {
    cursor:pointer !important;
}

.form-control {

    border-radius:0;
}

/* Center the loader */
#loader {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 22;
  width: 120px;
  height: 120px;
  margin: -76px 0 0 -76px;
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
  background:#fff;
  display:none;
}

.form-check-input {
    border:1px solid #5A20CB;
}

.form-check-input:checked {
            background:#5A20CB;
            border-color:#5A20CB;
}

select {
    border-radius:0 !important; 
}

.table-cell-success {
            background: #7bed9f !important;
}

.table-cell-danger {
            background: #ff6b81 !important;
}

.table-cell-info {
            background: #70a1ff !important;
}

.table-cell-warning {
            background: #eccc68 !important;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Add animation to "page content" */
.animate-bottom {
  position: relative;
  -webkit-animation-name: animatebottom;
  -webkit-animation-duration: 1s;
  animation-name: animatebottom;
  animation-duration: 1s
}

@-webkit-keyframes animatebottom {
  from { bottom:-100px; opacity:0 } 
  to { bottom:0px; opacity:1 }
}

@keyframes animatebottom { 
  from{ bottom:-100px; opacity:0 } 
  to{ bottom:0; opacity:1 }
}

#myDiv {
  display: none;
  text-align: center;
}

#BtnUpload {
    cursor:pointer;
    background:#5A20CB;
    color:#fff;
}