.tipn{
			display: inline-block;
			position: relative;
			border-radius: 50%;
			background-color: #8d8d8d;
			width: 25px;
			height: 25px;
			font: bold 20px arial;
			line-height: 25px;
			text-align: center;
			color: #fff;
			cursor: pointer;
			margin-left: 8px;
			margin-right: 8px;			
		}

		.tipn:after{
			content: 'i';
		}
		@media only screen and (max-device-width: 480px){ 
			.tipn{
				margin-left: -35px;
			}
			.tipn__invoices {
				position: absolute;
				left: 100%;
			}
		}

		.toolTipn-right{ 
			left: -270px !important;
		}
		.toolTipn-left{ 
			left: 0 !important;
		}
		
		.toolTipn-top{ 
		}
		#toolTipn{
			position: absolute;
			border-radius: 5px;
			width: 300px; /* IF THE WIDTH IS CHANGED. MAKE SURE YOU INCREASE SAME PIXELS IN .toolTipn-right > LEFT PROPERTY */
			padding: 15px;
			background-color: #fff;
			color: #000;
			font-weight: normal;
			z-index: 10;
			box-shadow: 0px 0px 6px 0px #333;
			top: 30px;
			left: -150px;
			font-size: 14px;
		}
		
		.tipn-arrow{
			position: absolute;
			top: 25px;
			left: 7px;
			border-left: 1px solid #ccc;
			border-top: 1px solid #ccc;
			display: block;
			width: 10px;
			height: 10px;
			background-color: #fff;
			transform: rotate(45deg);
			z-index: 11;
			
		}
		
		.tipn-arrow-bottom{
			top: -11px;
			border-right: 1px solid #ccc;
			border-bottom: 1px solid #ccc;
			border-left: 0;
			border-top: 0;
		}
		
		.tipn__maintenance-schedule{
			margin-top: -20px;
			margin-left:  -35px;
		}
		
		.tipn__manage-vehicles {
			width: 15px;
			height: 15px;
			font: bold 13px arial;
			margin-left: 0px;
		}

		.tipn__invoices {
			width: 20px;
			height: 20px;
			font: bold 15px arial;
			line-height: 20px;
		}
		@media (max-width: 500px) {
		.vehicle-form-info__info-section #toolTipn{
		width:200px;
		}
}