.btn-grace{background: repeating-linear-gradient(45deg, #ff0000, #ff0000 2px, #ffffff 2px, #ffffff 5px );padding: 5px 10px;border-color:#aa4a24; color: black;}

.alert-grace{background: repeating-linear-gradient(45deg, #ff0000, #ff0000 2px, #ffffff 2px, #ffffff 5px );padding: 5px 10px;border-color:#aa4a24; color: blue;}

.rb {border-color: red}
.gb {border-color: green}
.bb {border-color: blue}

.green {color: green}
.red {color: red}
.blue {color: blue}
.yellow {color: yellow}



.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}


.vertical-align {
    display: flex;
    align-items: bottom;
    vertical-align: baseline;;
    vertical-align: bottom;
}



.orbit-spinner {
	display: none;
	position: absolute;;
	left: 50%;
	top: 50%;
	z-index: 100;
}

.orbit-spinner, .orbit-spinner * {
  box-sizing: border-box;
}

.orbit-spinner {
  height: 55px;
  width: 55px;
  border-radius: 50%;
  perspective: 800px;
}

.orbit-spinner .orbit {
  position: absolute;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}

.orbit-spinner .orbit:nth-child(1) {
  left: 0%;
  top: 0%;
  animation: orbit-spinner-orbit-one-animation 1200ms linear infinite;
  border-bottom: 3px solid #ff1d5e;
}

.orbit-spinner .orbit:nth-child(2) {
  right: 0%;
  top: 0%;
  animation: orbit-spinner-orbit-two-animation 1200ms linear infinite;
  border-right: 3px solid #ff1d5e;
}

.orbit-spinner .orbit:nth-child(3) {
  right: 0%;
  bottom: 0%;
  animation: orbit-spinner-orbit-three-animation 1200ms linear infinite;
  border-top: 3px solid #ff1d5e;
}

@keyframes orbit-spinner-orbit-one-animation {
  0% {
    transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
  }
}

@keyframes orbit-spinner-orbit-two-animation {
  0% {
    transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
  }
}

@keyframes orbit-spinner-orbit-three-animation {
  0% {
    transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
  }
}


.mt-5 {
	margin-top: 5px !important;
}

.mb-5 {
	margin-bottom: 5px !important;
}
.mb-10 {
	margin-bottom: 10px !important;
}
.title {
    font-size: 84px;
}

.panel-heading-background{
  background-color: #f5f5f5 !important;
}


.m-b-md {
    margin-bottom: 30px;
    text-align: center;
}

.test + .tooltip > .tooltip-inner {
  background-color: #73AD21;
  color: #FFFFFF;
  border: 1px solid green;
  padding: 15px;
  font-size: 20px;
}

.btn-lg.focus, .btn-lg:focus, .btn-lg:hover {
    color:blue;
    background:#ffffff;
}
.btn-lg {
    background-color: #265094;
    font-size: 12px;
    color: #ffffff;
    border-radius: 0px;
    padding: 2px 2px;
}

.bottomright {position:absolute; bottom:0;  margin-bottom:7px; margin:7px; right: 0;}

.bold {
	font-weight: bold;
}

.footer {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: #cfcfcf;
  color: white;
  text-align: center;
  margin-top: 100px;
}

.legend {
    font-size: 24px;
    padding-left: 10px;
    padding-top: 0px;
    display: block;
}
.error {
    color: red;
}


.btn-outline-warning {
    color: #ffc107;
    border-color: #ffc107;
}

.vcntr,.vcntr2 {
    font-size: 20px;
    background-color: orange;
    color: white;
    padding: 1px 10px;
    box-shadow: none;
    display: inline-block;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}

.help-block {
    color: red;
    font-size: 10px;
}

.break-word {
  word-wrap: break-word;
}
.control-label.required:after
{
      content:" *";
      color:red;
      font-weight: bold;
}

.dgr {
  background: repeating-linear-gradient(45deg, #ff0000, #ff0000 3px, #ffffff 3px, #ffffff 10px);
  color: black;
}
.menu-parent {
  font-size: 14px;
  background-color: black;
	font-weight: bold;
  color:white;
}
.menu-subparent {
  font-size: 14px;
  background-color: #ffc107;
	font-weight: bold;

}

.loader { 
  border: 16px solid #f3f3f3; 
  border-top: 16px solid #3498db; 
  border-radius: 50%; width: 120px; 
  height: 120px; 
  animation: spin 2s linear infinite; 
  position: fixed; 
  top: 40%; 
  left: 40%; 
  z-index: 90;
}

.center_dyn {
  position: fixed;
  /* center the div */
  right: 0;
  left: 0;
  margin-right: auto;
  margin-left: auto;
  /* give it dimensions */
  
  
  min-height: 100px;

  


}

@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

@media print {
    a[href]:after {
        content: "" !important;
    }

    #sidebar {
        display: none;
    }
}

@media print {
  .print-none {display: none !important}
}

.flash {
  animation-name: flash;
  animation-duration: 0.2s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-play-state: running;
}

@keyframes flash {
  from {color: white;}
  to {color: black;}
}




.wrapper {
    display: flex;
    align-items: stretch;
}

#sidebar {
    min-width: 250px;
    max-width: 250px;
    background: white;
    color: grey;
    transition: all 0.3s;
}

#sidebar a,
#sidebar a:hover,
#sidebar a:focus {
    color: inherit;
}

#sidebar.active {
    margin-left: -250px;
}

#sidebar .sidebar-header {
    padding: 20px;
    background: white;
    color: black;
}

#sidebar ul.components {
    padding: 20px 0;
    border-bottom: 1px solid white;
}

#sidebar ul p {
    color: black;
    padding: 10px;
}

#sidebar ul li a {
    padding: 10px;
    font-size: 1.1em;
    display: block;
}

#sidebar ul li a:hover {
    color: white;
    background: grey;
}

#sidebar ul li.active > a,
a[aria-expanded="true"] {
    color: blue;
    background: white;
    font-size: bold;
    font-weight: normal;
}

#sidebar a.active
{
    color: blue;
    background: white;
    font-size: bold;
    font-weight: normal;
}

a[data-toggle="collapse"] {
    position: relative;
}

#sidebar .indent {
  padding-left: 20px;
}



@media (max-width: 768px) {
  #sidebar {
    margin-left: -250px;
  }
  #sidebar.active {
    margin-left: 0;
  }
  #sidebarCollapse span {
    display: none;
  }
}