*{font-family:Lucida Sans,Lucida Sans Regular,Lucida Grande,Lucida Sans Unicode,Geneva,Verdana,sans-serif}*{margin:0;box-sizing:border-box}h1{color:red}.time-container{height:90vh;width:90%;margin:30px auto 0;position:relative}.timings{display:flex;height:100%;width:100%;flex-direction:column;justify-content:space-evenly}.hrs{line-height:30px;font-size:18px;z-index:1;vertical-align:center;position:relative;flex-basis:100%;color:red}.hrs:before{height:1px;position:absolute;top:0;z-index:0;right:0;width:95%;background-color:red;content:""}.time-slot{width:250px;background:coral;border-radius:4px;text-align:center;position:absolute;z-index:1}.rect{position:absolute;border:2px dotted violet;border-radius:4px;z-index:10}