<link href='https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz' rel='stylesheet' type='text/css'>

<div class="vbduyuru1"><div class="yazi">Duyuru <a href="#">Link</a></div></div>


<div class="vbduyuru2"><div class="yazi">Duyuru <a href="#">Link</a></div></div>


<div class="vbduyuru3"><div class="yazi">Duyuru <a href="#">Link</a></div></div>

.vbduyuru1{
background:linear-gradient(#2980b9,#2980b9);
border-bottom:7px solid #2980b9;
width:370px;
height:80px;
transition-property: background;
transition-duration:0.1s;
transition-delay: 0.2s;
transition:all 1s ease-in-out 0s;
}

.vbduyuru1:hover {
    border-bottom:7px solid #444;
 background:linear-gradient(#3498db,#3498db);
 }

.vbduyuru1 a{
color:#fff;
 text-decoration:none;
}

.vbduyuru2{
background:linear-gradient(#c0392b,#c0392b);
border-bottom:7px solid #c0392b;
width:370px;
height:80px;
transition-property: background;
transition-duration:0.1s;
transition:all 1s ease-in-out 0s;
transition-delay: 0.2s;
margin-top:-87px;
left:375px;
position:relative;
}

.vbduyuru2:hover {
    border-bottom:7px solid #444;
    background:linear-gradient(#e74c3c,#e74c3c);
 }

.vbduyuru2 a{
 color:#fff;
 text-decoration:none;
}

.vbduyuru3{
background:linear-gradient(#2c3e50,#2c3e50);
border-bottom:7px solid #34495e;
width:370px;
height:80px;
transition-property: background;
transition-duration:0.1s;
transition-delay: 0.2s;
transition:all 1s ease-in-out 0s;
margin-top:-87px;
left:755px;
position:relative;
}

.vbduyuru3:hover {
    border-bottom:7px solid #444;
    background:linear-gradient(#34495e,#34495e);
 }
.vbduyuru3 a{
 color:#fff;
 text-decoration:none;
}

.yazi{
 color:#fff;
font-size:23px;
font-family: 'Yanone Kaffeesatz', sans-serif;
text-align:center;
padding:20px;
}