
@media (max-width: 767.98px) {
   body{font-size: 20px;}
}

.background-group20 {
	background: rgb(255,193,7);	
}
.background-group10 {
	background: rgb(13,202,240);
}
.background-group10-20 {
	background: linear-gradient(90deg, rgba(255,193,7,1) 0%, rgba(13,202,240,1) 100%);
}

body {
	background: url('/img/body-background.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	height: 100vh;
}

body::after {
  opacity: 0.3;
  z-index: -1;   
}

/*
 * Carousel and image style
 */

.rsad-image {
	border: #bbd3e0;
	border-style: outset;
	border-width: thick;
	border-radius: 15px;	
	width: fit-content;
}

/*
 * Textarea characters count
 */

.textarea{
    resize:none;
    height:100px;
    transition:all 0.5s;
    border:2px solid #DDDDDD;
    width:100% !important;
}

.textarea_danger{
    border:2px solid red !important;
}

/*
*   For mobile only
*/

/* @media (min-width: 576px) { */
	.rsad-fixed-bottom {
	  position: fixed;
	  bottom: 35;
	  right: 10;
	}
/* } */

a.disabled {
    pointer-events: none;
    color: #ccc;
}

/*
 * For larger Tooltips bootstrap 5 
 * Add to the html element
 *  data-container="body"
 */

.tooltip-inner {
    max-width: 100% !important;
}

/*
 * Styles for Treeview based on <ul> <li>
 */

ul, #myUL {
  list-style-type: none;
}

#myUL {
  margin: 0;
  padding: 0;
}

.caret {
  cursor: pointer;
  -webkit-user-select: none; /* Safari 3.1+ */
  -moz-user-select: none; /* Firefox 2+ */
  -ms-user-select: none; /* IE 10+ */
  user-select: none;
}

.caret::before {
  content: "\25B6";
  color: black;
  display: inline-block;
  margin-right: 6px;
}

.caret-down::before {
  -ms-transform: rotate(90deg); /* IE 9 */
  -webkit-transform: rotate(90deg); /* Safari */'
  transform: rotate(90deg);  
}

.nested {
  display: none;
}

.active {
  display: block;
}

/*
 * Style du loader  
 */
 
.loader {
  border: 5px solid #f3f3f3;
  border-top: 5px solid #3498db;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  animation: spin 1s linear infinite;
  margin: 20px auto;
  display: none;
  position:fixed;
  top:50%;
  left:50%;
}

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

/*
 * Pour l'affichage des initiales dans un cercle si pas de photo de profil
 */

.btn-circle {
  width: 30px;
  height: 30px;
  text-align: center;
  padding: 6px 0;
  font-size: 12px;
  line-height: 1.428571429;
  border-radius: 15px;
}

.btn-circle.btn-lg {
  width: 50px;
  height: 50px;
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.33;
  border-radius: 25px;
}

.btn-circle.btn-xl {
  width: 70px;
  height: 70px;
  padding: 10px 16px;
  font-size: 24px;
  line-height: 1.33;
  border-radius: 35px;
}

.btn-circle.btn-xxl {
  width: 90px;
  height: 90px;
  padding: 15px 18px;
  font-size: 46px;
  line-height: 1.33;
  border-radius: 45px;
}

/* use negative margins to accommodate wider button text */

.btn-circle span {
  margin: 0 -2rem;
}
