<html>
<head>
<title>News ticker</title>
<style>
.ticker {
background: #cbfaf4;
}
.news {
box-shadow: inset 0 -15px 30px rgba(0,0,0,0.4), 0 5px 10px rgba(0,0,0,0.5);
width: 100%;
margin: 0;
overflow: hidden;
border-radius: 1px;
padding: 2px;
-webkit-user-select: none;
}
.news span {
float: left;
color: #ff0000;
padding: 5px;
position: relative;
top: 2%;
box-shadow: inset 0 -15px 30px rgba(0,0,0,0.4);
font: 16px;
-webkit-font-smoothing: antialiased;
-webkit-user-select: none;
cursor: pointer;
}
.text{
box-shadow: none !important;
width: 92%;
}
</style>
</head>
<body>
<div class="news ticker">
<span>Latest News</span>
<span class="text">
<marquee style="color: black;" onmouseover="this.stop();" onmouseout="this.start();" direction="left" behavior="scroll" scrollamount="6">
Write your text here
</marquee>
</span>
</div>
</body>
</head>
</html>