.form-control{
  	padding-left: 30px;
    width:100%;
    border:2px solid #d3d3d3;
    border-radius:4px;
    margin:8px 0;
    outline:none;
    box-sizing:border-box;
    transition:.3s;
  }

  
  .form-control:focus-within ~ .datepickershow{
    border-color:dodgerBlue;
    box-shadow:0 0 8px 0 dodgerBlue;
    background-color:#000000;
  }
  
  .inputWithIcon.form-control{
    padding-left:40px;
  }
  
  .inputWithIcon{
    position:relative;
  }
  
  .inputWithIcon .datepickershow{
    position:absolute;
    left:0;
    padding:9px 8px;
    border-color:#d3d3d3; 
    color:#d3d3d3;
    transition:.3s;
  }
  
  
  .inputWithIcon.inputIconBg .datepickershow{
    background-color:#d3d3d3;
    color:#fff;
    margin-left: 2px;
    padding:6px 4px;
    border-radius:2px 0 0 2px;
  }

.datepickerdropdown {
	background:
		url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAD6CAIAAADvIroEAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwQAADsEBuJFr7QAAABh0RVh0U29mdHdhcmUAUGFpbnQuTkVUIHYzLjM2qefiJQAAAIhJREFUOE99w4cRgDAQBLHtvzKyyWByhjKo4E8z4vs+3vc1P8+Det836nVdqOd5oh7HgXXfd9Rt21DXdUVdlgV1nmes0zShjuOIOgwDqvcete97rF3XobZti9o0DWpd16hVVaGWZYm1KArUPM9RnXOoWZahpmmKNUkS1DiOUaMoQg3DEDUIAow/RjJ3qB92TU4AAAAASUVORK5CYII=);
	border: 1px solid #888;
	border-radius: 5px;
	font-size: 14px;
	padding: 10px;
	position: absolute;
	text-align: center;
	z-index: 10;
}

.datepickerdropdown table {
	border-collapse: collapse;
	margin: auto;
}

.datepickerdropdown input {
	font-family: monospace;
	border: 1px solid #888;
	border-radius: 3px;
	margin: 1px;
	padding: 2px 5px;
	text-align: center;
}

.datepickerdropdown table input[type=button] {
	width: 2em;
}

.datepickerdropdown input[type=button] {
	height: 34px;
	background:
		url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAeCAIAAABi9+OQAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAAlwSFlzAAAOwwAADsMBx2+oZAAAABh0RVh0U29mdHdhcmUAUGFpbnQuTkVUIHYzLjM2qefiJQAAAElJREFUGFeNwwEGACEQQNF//6MlSRSRSMMkY86wdk+wj4e78zaz772Xcw6qioiw92atxZyTMQa9d1pr1FoppZBzJqVEjJEQwt8PXeRLuM/peRgAAAAASUVORK5CYII=);
}

.datepickerdropdown input[type=button]:hover {
	background:
		url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAeCAIAAABi9+OQAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAAlwSFlzAAAOwwAADsMBx2+oZAAAABh0RVh0U29mdHdhcmUAUGFpbnQuTkVUIHYzLjM2qefiJQAAAFpJREFUGFdjePfuAgMIv3lzCoxfvTrK8OLFAYbnz/cyPHmyleHx480MDx+uY7h3bxnDnTsLGW7enMVw7dpkhqtXJzJcutTFcOFCG8O5c00MZ87UMZw6VUksBgDwaURPl4Jv2AAAAABJRU5ErkJggg==);
}

.datepickerdropdown input[type=button]:active {
	background:
		url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAeCAIAAABi9+OQAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAAlwSFlzAAAOwwAADsMBx2+oZAAAABh0RVh0U29mdHdhcmUAUGFpbnQuTkVUIHYzLjM2qefiJQAAAFhJREFUGFdjOHWqkuHMmTqGc+eaGC5caGO4dKmL4erViQzXrk1muHlzFsOdOwsZ7t1bxvDw4TqGx483Mzx5spXh+fO9DC9eHGB49eoow5s3p8D43bsLpGAAr0NKhZpZNgcAAAAASUVORK5CYII=);
	padding: 2px 4px 2px 6px;
}

.datepickerdropdown input.selected {
	background:
		url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAeCAIAAABi9+OQAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAAlwSFlzAAAOwwAADsMBx2+oZAAAABh0RVh0U29mdHdhcmUAUGFpbnQuTkVUIHYzLjM2qefiJQAAAEBJREFUGFdj+P//P8P//5+A+CkQXwfiU0C8B4jXA/EiIJ4CxO1AXAnEOUAcB8SBQOwCxGZArAnE0kDMB8QMxGIAwnRFxCnPkL8AAAAASUVORK5CYII=);
}

.datepickerdropdown input[type=text] {
	background: #fff;
	color: #000;
	font-size: 14px;
}

.datepickerdropdown input.today {
	border: 1px solid red;
}

.datepickerdropdown input.othermonth {
	color: #d3d3d3;
	border: 1px solid #bbb;
}

.datepickershow img {
	border: 0;
}

.monthDsp {
	width: 80px;
	font-size: 14px;
}

.daysRow {
	font-family: sans-serif;
	font-size: 14px;
}