/* ====
   HOME 
   ====*/

body, html {
    min-height: 95vh;
    padding-top: 2.3rem;
}
.btn-course {
	margin-left: 5px;
	background-color: #6c757d08;
	margin-bottom: 10px;
}

.btn-course:focus {
    color: #6c757d;
}

.bg-light_tb {
    background-color: #f5f5fa!important;
}

.pmd-floating-action {
    z-index: 1040 !important; /* Bouton sous les fenetres modales*/
}

.btn.pmd-btn-fab.btn-sm {
	margin-left: 18px;
}

.fix_border_right_0  {
	border-top-right-radius: .0rem!important;
    border-bottom-right-radius: .0rem!important;
}

.bc-wrapper {
	flex: 1 1 auto;
    width: 1%;
}


.avatar {
	width: 100px !important;
	position: absolute;
	top: 0;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.card-avatar {
	padding-top: 36px;
}

.sticky-bottom {
	position: fixed;
	z-index: 2
}


/* ====
   CREATION COURSE 
   ====*/

.btn:active {
    background-color: yellowgreen;
}

.fix_button, .active {
	background-color: yellowgreen !important;
}

.custom-checkbox .custom-control-input:checked~.custom-control-label::before {
    background-color: yellowgreen !important;
}

/* Pour les labels :*/
.custom-control {
    padding-left: 2.5rem !important;
}


/* .form-group label {
	font-weight: bold;
}
 */
.description_label {
  font-weight: bolder;
}
.description_desc {
  color: grey;
}

.custom-control-label {
	font-weight: normal !important;
}

.fix_icon_material {
    padding-top: 5px;
    padding-right: 10px;
}

.slider.slider-horizontal .tooltip.tooltip-main.in,
.slider.slider-vertical .tooltip.tooltip-main.in { opacity: 1 !important; }

#ex1Slider {
    width: 100%;
}

#ex2Slider  {
    width: 98%;
    margin-left: 0.5rem !important;
}

#distanceSlider {
    width: 85%;
    margin-left: 12px;
    margin-bottom: 10px;
}


.badge-tag {
    margin-right: 10px;
}

#carte {
	margin-left: 0rem !important;
}

.slider-selection {
	background: yellowgreen !important;
}


.slider.slider-horizontal .slider-track {
    height: 20px !important;
 }
 
.slider-handle {
    top: 5px !important;
}

/* Les animations d'entr�e (� enter �) et de sortie (� leave �)  */
/* peuvent utiliser diff�rentes fonctions de dur�e et de temps.  */
.slide-fade-enter-active {
  transition: all .3s ease;
}
.slide-fade-leave-active {
  transition: all .8s cubic-bezier(1.0, 0.5, 0.8, 1.0);
}
.slide-fade-enter, .slide-fade-leave-to
/* .slide-fade-leave-active below version 2.1.8 */ {
  transform: translateX(10px);
  opacity: 0;
}



.notifications_active {
	transition: all 2s ease;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fce6cc+0,f8d594+100&0+0,1+100 */
	background: -moz-linear-gradient(45deg, rgba(252,230,204,0) 0%, rgba(248,213,148,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(45deg, rgba(252,230,204,0) 0%,rgba(248,213,148,1) 100%); /* Chrome10-25,Safari5.1-6 */
	/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	background: linear-gradient(8deg,rgba(252,230,204,0) 60%,rgba(248,213,148,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00fce6cc', endColorstr='#f8d594',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.activite_icon {
	position: absolute;
	bottom: 25px;
	right: 16px;
}

.realisees_icon {
	/* border-width: 0px; */
}

/* informations courses : */
.big_icon {
	font-size: 2em;
	color:#ff7043;
	position: absolute;
    padding-top: 20px;
}

.big_text {
	font-size: 1.2em;
	
}

.text_big_icon {
	margin-left: 60px;
	padding-top: 16px;
    margin-bottom: 10px;
}

.explication {
	font-weight: bold;
}

.icon_course {
	position: absolute;
    top: 12px;
    right: 16px;
    font-size: xx-large;
}

.icon_course_fa {
	position: absolute;
    top: 12px;
    right: 16px;
    font-size: x-large;
}

.bientot {
    top: 50px !important; 
}

.lock {
    top: 12px !important;
    right: 48px;
}


.border-filter {
	border-color: transparent;
    background-color: transparent;
    width: auto;
    display: inline;
}

.form-control_label:focus {
    color: inherit;
    background-color: inherit;
    border-color: transparent;
    outline: 0;
    box-shadow: inherit;
}

.input-group_label {
    background-color: white;
    border-color: yellowgreen !important;
    border-style: dotted;
    border-width: thin;
    border-radius: 25px;
    width: auto;
    padding-left: 0px;
    padding-right: 0px;
    margin-left: -3px;
    margin-right: 10px;
}

.input-group-prepend_label {
    padding-left: 5px;
    margin-right: -10px;
}

.input-group-text_label {
    border: transparent;
    background-color: transparent;
}

.abonnement {
    background-color: white;
	border-color: yellowgreen !important;
    border-style: dotted;
    border-width: thin;
    border-radius: 20px;
    padding: 8px;
    color: #495057 !important;
}

.row_label {
	margin-left: 0px;
}


.label_gauche{
    padding-right: 0px;
    padding-left: 3px;
    margin-bottom: 10px;
}

.label_droite {
    padding-right: 0px;
    padding-left: 0px;
    padding-top: 4px;
    margin-top: 0px;
}

.btn-edition {
    background-color: #ff7043;
    color: white;
}

.profil_macaron {
    padding: 20px;
    border-color: red;
    border-width: 1px;
    border-style: dotted;
    border-radius: 20px;
}

/*
    Bouton plus pour les teams
*/

.box input {
    opacity: 0;
    position: absolute;
    pointer-events: none;
}
.box p {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.box input:focus ~ label {
    outline: -webkit-focus-ring-color auto 5px;
}
.box input:checked + p {
    -webkit-line-clamp: unset;
}
.box input:checked ~ label,
.box p:not(.truncated) ~ label {
    display: none;
}

.box label {
    color: #9acd32;
}

.truncated {
    margin-bottom: 0rem !important;
}

.texte-rouge {
	color : #fb3c00 !important;
}

@media (max-width: 576px) {

    .step-indicator {
        font-size: x-small;
    }
    .step-indicator .step {
        font-size: 20px;
        height: 40px;
        line-height: 40px;
        margin: 0 auto;
        position: relative;
        width: 40px;
    }

    .step-indicator .caption {
      color: #ccc;
      font-weight: bold;
      font-size: smaller;
    }

}