.material-tooltip-container{
	position: absolute;
      
}
.tooltip-icon-input {
	position: relative;
    cursor: pointer;
    padding-left: 5px;
    padding-top: 5px;
}



.tooltip-container{
	position:relative;
}
.tooltip-icon-input:focus + .tooltip, .tooltip-icon-input:hover  + .tooltip, .tooltip-icon-input.hovered + .tooltip{
	width: 280px;
	display:flex;
	font-family: Arial, sans-serif;
	background: rgba(70, 70, 70, 0.9);
    border-radius: 2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
    color: #ececec;
    font-weight: bold;
    line-height: 1em;
    padding: 6px 8px;
    vertical-align: middle;
    position: absolute;
    top: 45px;
    font-size: 13px;
    z-index: 10;
	white-space: pre-line;
    right: 0;
}

.tooltip{
		display:none;
		white-space: pre-line;	
}

@media screen and (max-width: 768px) {

	.tooltip-icon-input:hover .tooltip{
		display:none;
	}
	
	/*.tooltip-icon-input:focus ~ .protective-screen-mobile{
	    position: fixed;
	    top: 0;
	    left: 0;
	    width: 100vw;
	    height: 100vh;
	    cursor: default;
	    z-index: 1;
	}*/

  	.tooltip-icon-input:focus + .tooltip, .tooltip-icon-input:hover + .tooltip {           
      overflow: visible;      
      position: fixed;  
      width: unset;         
      bottom: 0;
      left: 0;        
      top: unset;
      right: 0;
      padding: 15px;
      margin: 0;
  	}
      
      /* Fond gris� pour mettre �vidence le bottom sheet */
      .tooltip-icon-input:focus + .tooltip::before, .tooltip-icon-input:hover + .tooltip::before {
            position: absolute;
            height: 100vh;
            /* On ajoute 8px pour r�soudre le probl�me du d�calage sur la gauche  */
            width: calc(100vw + 8px);
            top: -100vh;            
            left: -8px;
            content: " ";                       
            background-color: rgba(0,0,0,0.5);

       }

	  /* Croix de fermeture positionn�e au dessus du bottom sheet */
      .tooltip-icon-input:focus + .tooltip::after, .tooltip-icon-input:hover + .tooltip::after {
            position: absolute;
            height: 40px;
            width: 40px;
            top: -10vh;                            
            left: calc(50% - 8px - 20px);
            content: "x";                                                     
            background-color: rgba(255,255,255, 1);
            border-radius: 20px;
            line-height: 40px;
            text-align: center;
            color: rgba(0,0,0,1);
       }
}