[dohtml]
<center><style type="text/css">
.mood1 {width: 510px;
height: 450px;
background: #888;
position: relative;
border-radius:10px;}
.mood2 {width: 430px;
height: 435px;
background: url(//jegvirag.gportal.hu/portal/jegvirag/image/gallery/1477470933_20.jpg);
position: relative;
left: 45px;
border-left: 5px solid #999;
padding-right:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;}
.moodimg1 {width:125px;
height:125px;
opacity: 1;
background: url(http://placehold.it/125);
background-size: 100%;
position: relative; top: 20px; left: -135px;
transition-duration: 0.4s;
-webkit-transition-duration: 0.4s;
-moz-transition-duration: 0.4s;
border-radius: 10px;}
.moodimg1:hover {opacity: 0.5;
border-radius: 30px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
filter: blur(2px);
-webkit-filter: blur(2px);
-moz-filter: blur(2px);}
.moodimg2 { width:125px;
height:125px;
opacity: 1;
background: url(http://placehold.it/125);
background-size: 100%;
position: relative; top: 30px; left: -135px;
transition-duration: 0.6s;
-webkit-transition-duration: 0.6s;
-moz-transition-duration: 0.6s;
border-radius: 10px;}
.moodimg2:hover { opacity: 0.5;
border-radius: 30px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
filter: blur(2px);
-webkit-filter: blur(2px);
-moz-filter: blur(2px);}
.moodimg3 { width:125px;
height:125px;
opacity: 1;
background: url(http://placehold.it/125);
position: relative; top: 40px; left: -135px;
transition-duration: 0.8s;
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
border-radius: 10px;}
.moodimg3:hover { opacity: 0.5;
border-radius: 30px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
filter: blur(2px);
-webkit-filter: blur(2px);
-moz-filter: blur(2px);}
.moodimg4 {width:125px;
height:125px;
opacity: 1;
background: url(http://placehold.it/125);
background-size: 100%;
position: relative; top: -355px; left: 5px;
transition-duration: 0.8s;
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
border-radius: 10px;}
.moodimg4:hover { opacity: 0.5;
border-radius: 30px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
filter: blur(2px);
-webkit-filter: blur(2px);
-moz-filter: blur(2px);}
.moodimg5 {width:125px;
height:125px;
opacity: 1;
background: url(http://placehold.it/125);
background-size: 100%;
position: relative; top: -345px; left: 5px;
transition-duration: 0.8s;
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
border-radius: 10px;}
.moodimg5:hover { opacity: 0.5;
border-radius: 100px;
border-radius: 30px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
filter: blur(2px);
-webkit-filter: blur(2px);
-moz-filter: blur(2px);}
.moodimg6 {width:125px;
height:125px;
opacity: 1;
background: url(http://placehold.it/125);
background-size: 100%;
position: relative; top: -335px; left: 5px;
transition-duration: 0.8s;
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
border-radius: 10px;}
.moodimg6:hover { opacity: 0.5;
border-radius: 30px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
filter: blur(2px);
-webkit-filter: blur(2px);
-moz-filter: blur(2px);}
.moodimg7 { width:125px;
height:125px;
opacity: 1;
background: url(http://placehold.it/125);
background-size: 100%;
position: relative; top: -730px; left: 145px;
transition-duration: 0.8s;
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
border-radius: 10px;}
.moodimg7:hover { opacity: 0.5;
border-radius: 30px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
filter: blur(2px);
-webkit-filter: blur(2px);
-moz-filter: blur(2px);}
.moodimg8 {width:125px;
height:125px;
opacity: 1;
background: url(http://placehold.it/125);
background-size: 100%;
position: relative; top: -720px; left: 145px;
transition-duration: 0.8s;
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
border-radius: 10px;}
.moodimg8:hover { opacity: 0.5;
border-radius: 30px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
filter: blur(2px);
-webkit-filter: blur(2px);
-moz-filter: blur(2px);}
.moodimg9 { width:125px;
height:125px;
opacity: 1;
background: url(http://placehold.it/125);
background-size: 100%;
position: relative; top: -710px; left: 145px;
transition-duration: 0.8s;
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
border-radius: 10px;}
.moodimg9:hover { opacity: 0.5;
border-radius: 30px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
filter: blur(2px);
-webkit-filter: blur(2px);
-moz-filter: blur(2px);}
</style>
<link href='http://fonts.googleapis.com/css?family=Mrs+Sheppards' rel='stylesheet' type='text/css'>
<div class="mood1">
<div class="mood2">
<table>
<tr><div class="moodimg1"></div></tr>
<tr><div class="moodimg2"></div></tr>
<tr><div class="moodimg3"></div></tr>
<td>
<tr><div class="moodimg4"></div></tr>
<tr><div class="moodimg5"></div></tr>
<tr><div class="moodimg6"></div></tr>
</td>
<td>
<tr><div class="moodimg7"></div></tr>
<tr><div class="moodimg8"></div></tr>
<tr><div class="moodimg9"></div></tr>
</td>
</div>
</div>
</table>
</div>
</div>
</center>
AJÁNLOM AZ OLDALT
Sg
Archvum
ARCHVUM
