body {
  /*
  background: rgb(196, 196, 196);

   background-image: url(/views/img/background.jpg); 
  background-size: cover !important;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed;
*/
	background: linear-gradient(-45deg,  #23a6d5, #23d5ab, #235170);
	background-size: 400% 400%;
	animation: gradient 15s ease infinite;

  font-family: 'Source Sans Pro', sans-serif;
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}


.index{
  margin-top: 2%;
}

/* ====
SCROLLBAR 
==== */

/* width */
::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1; 
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #343a40; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: rgb(155, 155, 155); 
}

.basiclinks{
  text-decoration: none!important;
  color: #797979;
  transition: all 0.5s;
}

.basiclinks:hover{
  color: #222;}

.row.vdivide [class*='col divider']:not(:last-child):after {
  background: #e0e0e0;
  width: 1px;
  content: "";
  display:block;
  position: absolute;
  top:0;
  bottom: 0;
  right: 0;
  min-height: 70px;
}



.dashboard{
  background: #292d31;
  color: white;
  border-radius: 0%;
}

.top{
  border-top-left-radius: 10px!important; 
  border-top-right-radius: 10px!important
}
.bottom{
  border-bottom-left-radius: 10px!important; 
  border-bottom-right-radius: 10px!important
}

.tab{
  height: 35px;cursor: pointer;
}
.tab:hover{
  background-color: rgba(145, 145, 145, 0.329)
}

.red{
  background-color: rgba(0, 47, 255, 0.226)!important;
}

.sended{ margin-left: 2%; }

/* Mise en page pour tablettes */
@media (max-width: 767px) {
  .navbar-brand-head {
      display: block;
      margin-left: auto;
      margin-right: auto
  }
}



/* Border X get width  */
div.borderXwidth .head:before, div.borderXwidth .head:after
{
  position: absolute;
  opacity: 0;
  width: 0%;
  height: 2px;
  content: '';
  background: #FFF;
  transition: all 0.3s;
}

div.borderXwidth .head:before
{
  left: 0px;
  top: 0px;
}

div.borderXwidth .head:after
{
  right: 0px;
  bottom: 0px;
}

div.borderXwidth .head:hover:before, div.borderXwidth .head:hover:after
{
  opacity: 1;
  width: 100%;
}


header span
{
  color: #222;
}

footer span
{
  color: #AAA;
}

div.contain
{
  margin-left: auto;
}

div.contain .head
{
  color: #FFF;
  margin: 0px 10px;
  padding: 10px 10px;
  position: relative;
  z-index: 0;
  cursor: pointer;
}
/* BTN */

.btn-outline-light:hover{
  color: #000000;
}

