VidMuzik

İşte mükemmel bir tasarım daha!

Tasarım Sepeti ve arabeskrapin.tr.gg işbirliğiyle sizlerle buluşan bu css tasarım ile bedava-sitem'i video/müzik sitesine çevirebileceksiniz!

BS tasarımları arasında profesyonel görünümlü css tasarım bulmak zordur. Ancak bu VidMüzik teması sayesinde siteniz her zamankinden daha profesyonel görünebilir!

3 büyük reklam alanı bulunduran, sade tasarımıyla ziyaretçileri sitenize hızla ısındırabilecek, kategori işlevli menüsüyle dikkat çeken VidMüzik teması tam size göre! Hemen deneyin, tr gg sitenizi video sitesine çevirin!

Tasarımın
Önizlemesini Gör

Yorumları Gör / Yorum Yap

Nasıl Eklemeliyim?

Tasarımcının Sitesini Ziyaret Et

Tasarım Özellikleri:

3 Büyük Reklam Alanı
Admin Paneli ve Otomatik Video Çekme Botu
Sağ Menü
Hızlı Yükleniş (0.04 MB)

Tasarımın üzerindeki yazı:

</table></div> <center><table style="width: 0px; height: 0px;"><tbody> <tr> <td background="http://img.webme.com/pic/o/osmantalay/bsreklambg13.png"><center> <iframe src="http://ads.webme.com/banner.php?pos=bw" frameborder="0" width="728" height="90" scrolling="no"></iframe>  </table> </center>



<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="tr" class="no-js" lang="tr">
<head>
 <meta charset="utf-8">
 <title>Full Arabesk Rap</title>


</head>
<body>
 <div id="arkaplan"><div id="arkaplan2">
  <div id="ana-tablo">
      
            <header id="header">
             
                <div id="logo">
                 <a href=""></a>
                </div><!-- #logo -->
                
                <div class="reklam">
                <a href="http://www.koddostu.com" target="_blank" style="display:block;width:468px;height:60px;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0kvFhNTxb_nxH9kozeBNiS5JewNxGbG5TR-_B8ynhbyZI5ufA5dBwENr9HTnVpchIpCd4pfJbCwt90Qwy3OX5W-PTjhL-qSOJ1LEU2u11zwP0zNOtzdbV3cBbCEdbPpsPqNZez08St0w/s1600/Ertty.png) no-repeat top left"></a>
                </div><!-- .reklam -->
             
                <nav id="menu">
                 
                    <ul>
                     <li><a href="http://arabeskrapin.tr.gg/ana-sayfa.htm">
                       <h3>Anasayfa</h3>

                     <li><a href="http://arabeskrapin.tr.gg/admin.htm">
                       <h3>Admin</h3>
                     </a></li>
                     <li><a href="http://arabeskrapin.tr.gg/Rapciler.htm">
                       <h3>Rapciler</h3>
                     </a></li>
                     <li><a href="http://arabeskrapin.tr.gg/yasal-uyari.htm">
                       <h3>Yasal Uyari</h3>
                     </a></li>

                     <li><a href="http://arabeskrapin.tr.gg/haberler.htm">
                       <h3>Haberler</h3>
                     </a></li>
                     <li><a href="/Forum/index.htm">
                       <h3>Forum</h3>
                     </a></li>

                    </ul>
                    
                </nav><!-- #menu -->
                
            </header><!-- #header -->
          



            <div id="icerik-tablo" class="clearfix">



  

                <div id="sol-sutun">
                  







                    <div class="dizi-liste-sezon">

Tasarımın altındaki yazı:

                    </div><!-- #yorum-tablo -->
                    
                    
                </div><!-- #sol-sutun -->
                
                <div id="sag-sutun">
                  
                  <div class="sag-sutun-ust"></div>
                  <div class="sag-sutun clearfix">
                   
                    <div class="reklam">
                        <a href=""><img src="http://img.webme.com/pic/a/arabeskrapin/reklam.png" alt=""></a>
                    </div><!-- .reklam -->

                    <div class="diger-bolumler">
                        <div class="baslik"><h3> <b>Kategori</b></h3></div>
                        
                        <ul>

                            <li><a href="">Eklenecek_1</a></li>
                            <li><a href="">Eklenecek_2</a></li>
                            <li><a href="">Eklenecek_3</a></li>
                            <li><a href="">Eklenecek_4</a></li>
                            <li><a href="">Eklenecek_5</a></li>
                            <li><a href="">Eklenecek_6</a></li>
                            <li><a href="">Eklenecek_7</a></li>
                            <li><a href="">Eklenecek_8</a></li>
                            <li><a href="">Eklenecek_9</a></li>
                            <li><a href="">Eklenecek_10</a></li>
 

                        </ul>



                    </div>

                   <div class="reklam">
                     <a href=""><img src="http://img.webme.com/pic/a/arabeskrapin/reklam.png" alt=""></a>
                    </div><!-- .reklam -->
                  
                  </div>
                  <div class="sag-sutun-alt"></div>
                  
                </div><!-- #sag-sutun -->
            
            </div><!-- #icerik-tablo -->
            <div id="icerik-alt"></div>
            

            <footer id="footer">



                    <div class="populer">
                        <h3>TEMA HAKKINDA</h3>

                        <div class="linkler">
                            Bu Temanin Artik bir botu vardir bu temayi sitesine ekleyenlerin sitesine otomatk olarak eklenecektir Arabeskrapin.tr.gg sitesine eklenen her video aninda sizinde sitenizde olacaktir... Sitenin Botunu Koddostu Kodlari Sayesinde Yapacagiz... Botu Görmek icin <a href="http://arabeskrapin.tr.gg/BOT.htm">TIKLA</a>
                        </div>

                    </div>

                    <div class="footer-sag">

                        <div id="footer-logom">
                            <a href="/ana-sayfa.htm"></a>
                        </div>

                        <div class="telif">
                            (c) 2012 - ArabeskRap'in<br>
                            <a href="http://tasarimsepeti.blogspot.com" target="_blank" style="text-decoration:none !important;color:#fff !important;">Tüm haklari saklidir.</a>
                            <br>Tema Semih Ayhan`a ait olup Serhat Gencyigitolu Tarafindan Bedava-sitem'e Cevrilmistir.

<br></br></br>
                            <span>Sitemizde bulunan bütün videolar<br>
                            SerhatWeb adiylan Youtube'den Desteklenmektedir.<br>
<br>
</br>

</span>
                        </div>

                    </div>

            </footer><!-- #footer -->

     </div>
    </div></div>

    <div id="arka"></div>
</body>
</html>












<a onfocus="this.blur();" href="http://sitedoktoru.blogspot.com" target="_blank" class="busited subited" style="margin:0px;padding:0px;display:block;width:120px;height:47px;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBoHyO2cbmYRSmOn7z1HSBKYEXHRpY2NizvHIl5Rt8ylzbDyy3NAyh4SE91nXY97qy8xBpio3_iTB6pXMXPqdVARl7Qibdk8Bbo4OPnHhDpGWRFsqTkfpvzwhvJ_2nC_JC57DQgBylIG4/s1600/koru.png) no-repeat; center"></a>
<!DOCTYPE HTML><style type="text/css">a.busited{position:fixed;z-index:99500;}a.subited{bottom:0px;right:0px;}</style><style type="text/css">a.busited{_position:absolute;}a.subited{_bottom:auto;_top:expression(ie6=(document.documentElement.scrollTop+document.documentElement.clientHeight - 52+"px") );}</style>

CSS kodu:

h1#title{display: none;}
h2#title span {display: none;}
div.header{display: none;}
li.nav_element{list-style-type: none;}
li.nav_element{display: none;}
#arabeskrapin {display:none;}
//--></style> <div id="arabeskrapin"><style type="text/css">
<!--table {margin-left: auto;margin-right: auto} 




/*
 Style Sheet :: style.css
 ----------------------------------------------------------
 
 Author                                      : Semih AYHAN
 Author URL                             : www.smhayhan.com
 bedava-sitem  Author           : Serhat Gencyigitoglu
        Bedava-sitem Url                  :arabeskrapin.tr.gg
 Theme                                     : FDI New Style
 
 This theme built by Semih AYHAN.
 Copyright (c) 2012 Semih AYHAN. All Rights Reserved.
 
-------------------------------------------------------------------------------*/

/* Reset
-------------------------------------------------------------------------------*/
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
 margin: 0;
 padding: 0;
 border: 0;
 outline: 0;
 font-size: 100%;
 vertical-align: baseline;
 background: transparent;
}         

article, aside, figure, footer, header, hgroup, nav, section {display: block;}

img,
object,
embed {max-width: 100%;}

html {overflow-y: scroll;}

ul, ol {list-style: none;}

blockquote, q {quotes: none;}

blockquote:before, 
blockquote:after, 
q:before, 
q:after {content: ''; content: none;}

a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;}

del {text-decoration: line-through;}

abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}

table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}

input, select {vertical-align: middle;}

:focus {outline: none;}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom;}

select, input, textarea {font: 99% sans-serif;}

table {font-size: inherit;}
 
a:hover, a:active {outline: none;}

small {font-size: 85%;}

strong, th {font-weight: bold;}

td, td img {vertical-align: top;} 

sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}

pre, code, kbd, samp {font-family: monospace, sans-serif;}

.clickable,
label, 
input[type=button], 
input[type=submit], 
button {cursor: pointer;}

button, input, select, textarea {margin: 0;}

button {width: auto; overflow: visible;}

.hidden {height: 0px; overflow: hidden; display: none; visibility: hidden;}

.clear {clear: both;}
.clearfix:after { content: ""; display: block; height: 0; overflow: hidden; clear: both; }  
.clearfix { height: 1%; }  

/* Genel
-------------------------------------------------------------------------------*/
html {background: url('http://img.webme.com/pic/a/arabeskrapin/arkaplan.png') repeat center top; height: 100%;}
body {background: url('http://img.webme.com/pic/a/arabeskrapin/arkaplan2.png') repeat-x center top; height: 100%; font-family: "MS Trebuchet", Arial, Helvetica, sans-serif;}
#arka {width: 100%; height: 100%; position: fixed; left: 0px; top: 0px; z-index: 999999999; cursor: pointer; display: none; background: rgba(255,255,255,.5);}
#arkaplan {background: url('http://img.webme.com/pic/a/arabeskrapin/arkaplan3.png') no-repeat center top; height: auto;}
#arkaplan2 {background: url('http://img.webme.com/pic/a/arabeskrapin/footer.png') repeat-x center bottom; height: auto;}
#ana-tablo {width: 946px; margin: 0 auto; position: relative; min-height: 100%; height: 100%; height: auto !important;}

/* Header
-------------------------------------------------------------------------------*/
#header {width: 946px; height: 180px; position: relative;}

#logo {float: left; width: 247px; height: 64px; margin: 30px 0 0 5px; background: url('http://img.webme.com/pic/a/arabeskrapin/logo.png') no-repeat;}
#logo a {width: 247px; height: 64px; display: block;}

#header .reklam {float: right; width: 468px; height: 60px; margin: 30px 10px 0 0; cursor: help; background: url('http://img.webme.com/pic/a/arabeskrapin/site-ust-reklam.png');}

#menu  {width: 946px; height: 63px; position: absolute; bottom: 0px; background: url('http://img.webme.com/pic/a/arabeskrapin/menu.png');}
#menu ul {width: 940px; height: 55px; padding: 3px 3px 0;}
#menu ul li {float: left; padding-right: 2px; position: relative; background: url('http://img.webme.com/pic/a/arabeskrapin/menu-ayrac.png') no-repeat right top;}
#menu ul li h3 {font-weight: 400; text-align: center;}
#menu ul li a {display: block; line-height: 52px; padding: 0 19px 3px; color: #fff; font-size: 16px; text-decoration: none;}
#menu ul li a:hover {background: url('http://img.webme.com/pic/a/arabeskrapin/menu-vurgu.png');}
#menu ul li #uye-paneli {position: absolute; right: -1px; top: 55px; z-index: 999999; display: none; width: 191px; min-height: 100px; padding: 15px 0px; border-bottom-right-radius: 7% 3%; border-bottom-left-radius: 7% 3%; background: url('http://img.webme.com/pic/a/arabeskrapin/uye-paneli.png');}
#menu ul li #uye-paneli h4 {font-size: 13px; font-weight: 900; padding: 0 10px 10px; color: #fff; text-align: left;}
#menu ul li #uye-paneli span {width: 171px; overflow: hidden;}
#menu ul li #uye-paneli a {padding: 5px 10px; margin: 0; line-height: 14px; font-size: 13px;}
#menu ul li #uye-paneli a:hover {background: rgba(0,0,0,.5);}

/* Icerik
-------------------------------------------------------------------------------*/
#icerik-tablo {min-height:800px;width: 940px; padding: 40px 4px 0; background: url('http://img.webme.com/pic/a/arabeskrapin/icerik.png') repeat-y center top;}
#icerik-alt {width: 948px; height: 55px; background: url('http://img.webme.com/pic/a/arabeskrapin/icerik-alt.png') no-repeat center bottom;}

#sol-sutun {float: left; width: 610px; margin-left: 22px;}

#sol-sutun h3.baslik {color: #353535; font-size: 21px; line-height: 20px; padding-left: 20px; background: url('http://img.webme.com/pic/a/arabeskrapin/ok.png') no-repeat left 7px;}

#sol-sutun .dizi-liste {width: 610px; padding-top: 10px;}
#sol-sutun .dizi-liste .dizi-tablo {width: 610px; margin-top: 20px;height:110px;}
#sol-sutun .dizi-liste .dizi-tablo .resim {float: left; width: 145px; height: 132px; margin: 0 10px 0 0;}

#sol-sutun .dizi-liste .dizi-tablo .dizi-isim {float: left; width: 455px; margin-top: 5px;}
#sol-sutun .dizi-liste .dizi-tablo .dizi-isim h3 {font-weight: 700;}
#sol-sutun .dizi-liste .dizi-tablo .dizi-isim h3 a {color: #4a4a4a; text-decoration: none; font-size: 15px;}
#sol-sutun .dizi-liste .dizi-tablo .dizi-isim h3 a:hover {color: #222;}

#sol-sutun .dizi-liste .dizi-tablo .etiketler {float: left; width: 455px; margin: 15px 0;font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;}
#sol-sutun .dizi-liste .dizi-tablo .etiketler a {color: #8e8e8e; text-decoration: none; font-size: 12px; line-height: 16px; float: left; margin-right: 5px;}
#sol-sutun .dizi-liste .dizi-tablo .etiketler a:hover {color: #555;}

#sol-sutun .dizi-liste .dizi-tablo .bilgiler {float: left; width: 455px;}
#sol-sutun .dizi-liste .dizi-tablo .bilgiler div {float: left; margin-right: 20px;}
#sol-sutun .dizi-liste .dizi-tablo .bilgiler div h3 {font-size: 13px; font-weight: 400; color: #4e4e4e;}
#sol-sutun .dizi-liste .dizi-tablo .bilgiler div h3 span {color: #222;}

#sol-sutun .dizi-liste-sezon {width: 610px; padding-top: 10px;}
#sol-sutun .dizi-liste-sezon .dizi-tablo {height: 132px;float: left; width: 305px; margin-top: 20px; position: relative;}
#sol-sutun .dizi-liste-sezon .dizi-tablo .resim {float: left; width: 145px; height: 132px; margin: 0 10px 0 0;}

#sol-sutun .dizi-liste-sezon .dizi-tablo .dizi-isim {float: left; width: 150px; margin-top: 5px;}
#sol-sutun .dizi-liste-sezon .dizi-tablo .dizi-isim h3 {font-weight: 700;}
#sol-sutun .dizi-liste-sezon .dizi-tablo .dizi-isim h3 a {color: #4a4a4a; text-decoration: none; font-size: 15px;}
#sol-sutun .dizi-liste-sezon .dizi-tablo .dizi-isim h3 a:hover {color: #222;}

#sol-sutun .dizi-liste-sezon .dizi-tablo .b-sayi {width: 150px; position: absolute; right: 0px; bottom: 15px;}
#sol-sutun .dizi-liste-sezon .dizi-tablo .b-sayi h3 {font-size: 13px; font-weight: 400; color: #4e4e4e;}
#sol-sutun .dizi-liste-sezon .dizi-tablo .b-sayi h3 span {color: #333; font-weight: 700;}

#sol-sutun #dizi-tablo {width: 610px; padding-top: 10px;}
#sol-sutun #dizi-tablo #video-tablo {width: 610px; height: 410px; position: relative;}
#sol-sutun #dizi-tablo #video-tablo #player {float: left; width: 550px; height: 410px; background: url('http://img.webme.com/pic/a/arabeskrapin/player.png');}
#sol-sutun #dizi-tablo #video-tablo #partlar {float: right; width: 55px; position: relative; right: -10px; text-align: center;}
#sol-sutun #dizi-tablo #video-tablo #partlar h5 {color: #424141; font-size: 15px; font-weight: 900; margin-bottom: 15px;}
#sol-sutun #dizi-tablo #video-tablo #partlar a {font-size: 13px; display: block; line-height: 24px; background: #fff; border-radius: 5px; border: 2px solid #eee; color: #333; text-decoration: none; margin-bottom: 5px;}
#sol-sutun #dizi-tablo #video-tablo #partlar a:hover {color: #fff; background: #329897; border: 2px solid #287d83;}
#sol-sutun #dizi-tablo #video-tablo #partlar a.aktif {cursor: default; color: #1c5269; background: #f4fcff; border: 2px solid #e0f0f7;}

#sol-sutun #dizi-tablo #dizi-bilgi {width: 610px; padding: 25px 0; overflow: auto;}
#sol-sutun #dizi-tablo #dizi-bilgi .resim {float: left; width: 145px; height: 190px; margin: 0 10px 0 0;}


#sol-sutun #dizi-tablo #dizi-bilgi .paylas {float: left; width: 20px; height: 20px; margin-top: 2px; margin-bottom: 2px;}
#sol-sutun #dizi-tablo #dizi-bilgi .paylas ul {float: left; width: 0px; height: 80px;}
#sol-sutun #dizi-tablo #dizi-bilgi .paylas ul li {float: left; width: 0px; height: 80px; margin-right: 10px;}
#sol-sutun #dizi-tablo #dizi-bilgi .paylas ul li a {width: 0px; height: 0px; display: block;}
#sol-sutun #dizi-tablo #dizi-bilgi .paylas ul li.favori {background: url('../img/icon/favori.png');}
#sol-sutun #dizi-tablo #dizi-bilgi .paylas ul li.facebook {background: url('../img/icon/facebook.png');}
#sol-sutun #dizi-tablo #dizi-bilgi .paylas ul li.twitter {background: url('../img/icon/twitter.png');}
#sol-sutun #dizi-tablo #dizi-bilgi .paylas ul li.friendfeed {background: url('../img/icon/friendfeed.png');}
#sol-sutun #dizi-tablo #dizi-bilgi .paylas ul li.delicious {background: url('../img/icon/delicious.png');}
#sol-sutun #dizi-tablo #dizi-bilgi .paylas ul li.digg {background: url('../img/icon/digg.png');}
#sol-sutun #dizi-tablo #dizi-bilgi .paylas ul li.email {background: url('../img/icon/email.png');}
#sol-sutun #dizi-tablo #dizi-bilgi .paylas .puanlama {float: left; margin-left: 0px; height: 0px;}
#sol-sutun #dizi-tablo #dizi-bilgi .paylas .puanlama a {float: left; width: 0px; height: 100px; background: url('../img/icon/star.png');}
#sol-sutun #dizi-tablo #dizi-bilgi .paylas .puanlama a.griYildiz {background: url('../img/icon/star2.png');}


#sol-sutun #dizi-tablo #dizi-bilgi .bilgiler {float: left; width: 455px;}
#sol-sutun #dizi-tablo #dizi-bilgi .bilgiler div {float: left; margin-right: 20px;}
#sol-sutun #dizi-tablo #dizi-bilgi .bilgiler div h3 {font-size: 13px; font-weight: 400; color: #4e4e4e;}
#sol-sutun #dizi-tablo #dizi-bilgi .bilgiler div h3 span {color: #222;}
#sol-sutun #dizi-tablo #dizi-bilgi .etiketler {float: left; width: 455px; margin: 10px 0 0;font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;}
#sol-sutun #dizi-tablo #dizi-bilgi .etiketler a {color: #8e8e8e; text-decoration: none; font-size: 12px; line-height: 16px; float: left; margin-right: 5px;}
#sol-sutun #dizi-tablo #dizi-bilgi .etiketler a:hover {color: #555;}


#sol-sutun #uye-profili {width: 610px;}

#sol-sutun #uye-profili .sol {float: left; width: 160px; margin-right: 25px;}

#sol-sutun #uye-profili .sol .avatar {width: 140px; height: 140px; margin: 0 auto; position: relative; overflow: hidden; border: 2px solid #fff; box-shadow: 0px 0px 4px rgba(0,0,0,.5);}
#sol-sutun #uye-profili .sol .avatar img {width: 140px; height: 140px; display: block;}
#sol-sutun #uye-profili .sol .avatar .nick {position: absolute; left: 0; bottom: 0; width: 130px; padding: 5px; line-height: 20px; color: #fff; font-size: 12px; background: rgba(0,0,0,.8);}

#sol-sutun #uye-profili .sol ul.link {float: left; width: 160px; margin: 15px 0 0 0;}
#sol-sutun #uye-profili .sol ul.link li {width: 160px; font-size: 12px; border-bottom: 1px solid #eee;}
#sol-sutun #uye-profili .sol ul.link li a {color: #333; text-decoration: none; display: block; line-height: 24px;}
#sol-sutun #uye-profili .sol ul.link li a img {float: left; width: 16px; height: 16px; margin: 4px 8px 2px 0;}
#sol-sutun #uye-profili .sol ul.link li a:hover {background: #f6f6f6;}

#sol-sutun #uye-profili .sol .baslik {width: 160px; position: relative; line-height: 24px; color: #333; font-size: 16px; font-weight: 700; border-bottom: 1px solid #ddd;}
#sol-sutun #uye-profili .sol .baslik a {position: absolute; right: 0px; bottom: 3px; line-height: 14px; color: #444; font-size: 12px; font-weight: 100; font-style: italic; text-decoration: none; border-bottom: 1px dotted #aaa;}

#sol-sutun #uye-profili .sol ul.arkadaslar {float: left; widt: 160px; margin: 5px 0 0 0;}
#sol-sutun #uye-profili .sol ul.arkadaslar li {width: 160px; height: 40px; padding: 5px 0 8px; border-bottom: 1px solid #eee;}
#sol-sutun #uye-profili .sol ul.arkadaslar li a.resim {float: left; width: 40px; height: 40px; border: 2px solid #fff; box-shadow: 0px 0px 4px rgba(0,0,0,.2); margin-right: 5px;}
#sol-sutun #uye-profili .sol ul.arkadaslar li a.resim img {width: 40px; height: 40px;}
#sol-sutun #uye-profili .sol ul.arkadaslar li a.isim {float: left; height: 20px; line-height: 20px; font-size: 13px; color: #191817; text-decoration: none;}
#sol-sutun #uye-profili .sol ul.arkadaslar li a.davet {float: left; height: 20px; line-height: 20px; font-size: 11px; font-style: italic; color: #343332; text-decoration: none;}
#sol-sutun #uye-profili .sol ul.arkadaslar li a:hover {color: #000;}

#sol-sutun #uye-profili .sag {float: left; width: 400px;}
#sol-sutun #uye-profili .sag h3.isim {color: #000; font-size: 18px; font-weight: 300; padding-left: 20px; opacity: .75; background: url('../img/ok.png') no-repeat left 6px;}

#sol-sutun #uye-profili .sag ul.bilgi {float: left; width: 400px; margin: 15px 0 0 0;}
#sol-sutun #uye-profili .sag ul.bilgi li {width: 400px; display: block; line-height: 24px; font-size: 14px; color: #434241; border-bottom: 1px solid #eee;}
#sol-sutun #uye-profili .sag ul.bilgi li span {font-weight: 700;}

#sol-sutun #uye-profili .sag .baslik {width: 400px; position: relative; line-height: 24px; color: #333; font-size: 16px; font-weight: 700; border-bottom: 1px solid #ddd;}

#sol-sutun #uye-profili .sag ul.favori-diziler {float: left; width: 400px; margin: 15px 0 0 0;}
#sol-sutun #uye-profili .sag ul.favori-diziler li {float: left; width: 120px; height: 140px; margin: 0 6px 10px; text-align: center;}
#sol-sutun #uye-profili .sag ul.favori-diziler li a.resim {display: block; width: 100px; margin: 0 auto;}
#sol-sutun #uye-profili .sag ul.favori-diziler li a.resim img {width: 100px;}
#sol-sutun #uye-profili .sag ul.favori-diziler li a.isim {height: 40px; color: #333; text-decoration: none; font-size: 13px; font-weight: 700;}




#sol-sutun #dizi-bilgi {width: 610px;}
#sol-sutun #dizi-bilgi h3 {padding-bottom: 10px;}

#sol-sutun #dizi-bilgi .sol {float: left; width: 160px; margin-right: 20px;}
#sol-sutun #dizi-bilgi .sol .resim {float: left; width: 160px;}
#sol-sutun #dizi-bilgi .sol .resim img {width: 160px; display: block;}

#sol-sutun #dizi-bilgi .sol ul.link {float: left; width: 160px; margin: 10px 0 0 0;}
#sol-sutun #dizi-bilgi .sol ul.link li {width: 160px; font-size: 12px; border-bottom: 1px solid #eee;}
#sol-sutun #dizi-bilgi .sol ul.link li a {color: #333; text-decoration: none; display: block; line-height: 24px;}
#sol-sutun #dizi-bilgi .sol ul.link li a img {float: left; width: 16px; height: 16px; margin: 4px 8px 2px 0;}
#sol-sutun #dizi-bilgi .sol ul.link li a:hover {background: #f6f6f6;}

#sol-sutun #dizi-bilgi .sag {float: left; width: 430px;}
#sol-sutun #dizi-bilgi .sag .tanitim {width: 430px; color: #333; font-size: 14px;}
#sol-sutun #dizi-bilgi .sag .tanitim p {padding: 0 0 10px; text-indent: 15px;}



#sol-sutun .sayfalama {width: 250px; height: 27px; padding: 50px 0 25px; margin: 0 auto;}
#sol-sutun .sayfalama li {float: left; width: 28px; height: 27px; margin-right: 2px;}
#sol-sutun .sayfalama li a {width: 28px; height: 27px; display: block; line-height: 25px; text-align: center; font-size: 12px; color: #fff; text-decoration: none; text-shadow: 0px 1px 0px #1c242a; font-family: Helvetica, Arial, sans-serif;}
#sol-sutun .sayfalama li.prev {background: url('http://img.webme.com/pic/a/arabeskrapin/sayfalama.png') no-repeat -27px top;}
#sol-sutun .sayfalama li.prev:hover {background: url('http://img.webme.com/pic/a/arabeskrapin/sayfalama.png') no-repeat -27px -27px;}
#sol-sutun .sayfalama li.next {background: url('http://img.webme.com/pic/a/arabeskrapin/sayfalama.png') no-repeat -56px top;}
#sol-sutun .sayfalama li.next:hover {background: url('http://img.webme.com/pic/a/arabeskrapin/sayfalama.png') no-repeat -56px -27px;}
#sol-sutun .sayfalama li.link {background: url('http://img.webme.com/pic/a/arabeskrapin/sayfalama.png') no-repeat left top;}
#sol-sutun .sayfalama li.link:hover {background: url('http://img.webme.com/pic/a/arabeskrapin/sayfalama.png') no-repeat left -27px;}
#sol-sutun .sayfalama li.current {background: url('.http://img.webme.com/pic/a/arabeskrapin/sayfalama.png') no-repeat left bottom;}

#sag-sutun {float: right; width: 268px; margin-right: 10px;}

#sag-sutun .sag-sutun-ust {width: 268px; height: 4px; background: url('http://img.webme.com/pic/a/arabeskrapin/sag-sutun-ust.png');}
#sag-sutun .sag-sutun {width: 260px; padding: 0 4px; background: url('http://img.webme.com/pic/a/arabeskrapin/sag-sutun.png');}
#sag-sutun .sag-sutun-alt {width: 268px; height: 4px; background: url('http://img.webme.com/pic/a/arabeskrapin/sag-sutun-alt.png');}

#sag-sutun .sag-sutun .dizi-liste-tablo {float: left; width: 260px; margin: 0px;}

#sag-sutun .sag-sutun .dizi-liste-tablo .baslik {}
#sag-sutun .sag-sutun .dizi-liste-tablo .baslik:hover {}
#sag-sutun .sag-sutun .dizi-liste-tablo .baslik.aktif {}
#sag-sutun .sag-sutun .dizi-liste-tablo .baslik.aktif:hover {background: url('../img/sag-sutun-buton-aktif.png') no-repeat top;}
#sag-sutun .sag-sutun .dizi-liste-tablo .baslik h2 {}

#sag-sutun .sag-sutun .dizi-liste-tablo ul {width: 260px; height: auto; overflow: hidden; font-size: 12px; font-family: Tahoma, Geneva, sans-serif;}
#sag-sutun .sag-sutun .dizi-liste-tablo ul li {float: left; width: 260px; height: 26px; display: block; border-bottom: 1px solid #ededed; background: url('http://img.webme.com/pic/a/arabeskrapin/sag-sutun-ok.png') no-repeat 10px;}
#sag-sutun .sag-sutun .dizi-liste-tablo ul li a {color: #878d95; text-decoration: none; width: 235px; height: 26px; display: block; line-height: 26px; padding-left: 25px;}
#sag-sutun .sag-sutun .dizi-liste-tablo ul li:hover {background: #f8fbfb url('http://img.webme.com/pic/a/arabeskrapin/sag-sutun-ok.png') no-repeat 10px;}

#sag-sutun .sag-sutun .diger-bolumler {float: left; width: 260px; margin: 0px;}
#sag-sutun .sag-sutun .diger-bolumler .baslik {float: left; width: 260px; height: 40px; background: url('http://img.webme.com/pic/a/arabeskrapin/sag-sutun-buton-inaktif.png') no-repeat bottom;}
#sag-sutun .sag-sutun .diger-bolumler .baslik h3 {width: 210px; height: 40px; display: block; padding-left: 50px; line-height: 36px; color: #fff; font-size: 15px; font-weight: 400; background: url('../img/icon/video.png') no-repeat 20px; }
#sag-sutun .sag-sutun .diger-bolumler ul {width: 260px; height: auto; overflow: hidden; font-size: 12px; font-family: Tahoma, Geneva, sans-serif;}
#sag-sutun .sag-sutun .diger-bolumler ul li {float: left; width: 260px; height: 26px; display: block; border-bottom: 1px solid #ededed; background: url('../img/sag-sutun-ok.png') no-repeat 10px;}
#sag-sutun .sag-sutun .diger-bolumler ul li a {color: #878d95; text-decoration: none; width: 235px; height: 26px; display: block; line-height: 26px; padding-left: 25px;}
#sag-sutun .sag-sutun .diger-bolumler ul li:hover {background: #f8fbfb url('http://img.webme.com/pic/a/arabeskrapin/sag-sutun-ok.png') no-repeat 10px;}

.ui-accordion .ui-accordion-header {float: left; width: 260px; height: 40px; background: url('http://img.webme.com/pic/a/arabeskrapin/sag-sutun-buton-inaktif.png') no-repeat bottom;}
.ui-accordion .ui-accordion-header:hover {background: url('http://img.webme.com/pic/a/arabeskrapin/sag-sutun-buton-inaktif.png') no-repeat top;}

.ui-accordion .ui-accordion-header h2 { width: 210px; height: 40px; display: block; padding-left: 50px; line-height: 36px; color: #fff; font-size: 15px; font-weight: 400; background: url('../img/icon/video.png') no-repeat 20px; }

#sag-sutun .sag-sutun .reklam {float: left; width: 250px; height: 250px; margin: 5px 5px;}

/* Footer
-------------------------------------------------------------------------------*/
#footer {width: 946px; height: 170px; padding-top: 38px; margin-top: 25px; position: relative; overflow: hidden; background: url('http://img.webme.com/pic/a/arabeskrapin/footer-orta.png') no-repeat center center;}

#footer .populer {margin: 5px 25px; width: 300px; padding-bottom: 10px;}
#footer .populer h3 {color: #fff; font-size: 18px; padding-left: 20px; background: url('http://img.webme.com/pic/a/arabeskrapin/footer-ok.png') no-repeat left 6px;}
#footer .populer .linkler {padding-top: 10px; color: #c4c4c4; font-size: 13px; line-height: 18px; font-family: "MS Trebuchet", Arial, Helvetica, sans-serif;}
#footer .populer .linkler a {color: #c4c4c4; text-decoration: none; text-shadow: 1px 1px 0px #000;}
#footer .populer .linkler a:hover {color: #fff;}

#footer .footer-sag {width: 170px; position: absolute; right: 25px; top: 38px;}
#footer-logo {width: 168px; height: 68px; margin: 0 auto; background: url('http://img.webme.com/pic/a/arabeskrapin/footer-logo.png');}
#footer-logo a {float: left; width: 168px; height: 50px; display: block;}
#footer .footer-sag .telif {color: #d4d4d4; font-size: 12px; text-shadow: 1px 1px 0px #000;}
#footer .footer-sag .telif span {font-size: 11px;}

/* Uye Girisi
-------------------------------------------------------------------------------*/
#uye-girisi {position: absolute; left: 224px; top: 225px; z-index: 9999999999; display: none; background: #fff; border: 5px solid #eee; box-shadow: 0px 0px 5px rgba(0,0,0,.5); width: 350px; height: 150px; padding: 25px;}
#uye-girisi h3 {color: #565554; font-size: 15px; font-weight: 900; margin-top: -5px;}
#uye-girisi label {float: left; width: 350px; height: 24px; padding-bottom: 8px; margin-top: 10px; border-bottom: 1px solid #eee; cursor: default;}
#uye-girisi label span {float: left; width: 150px; height: 24px; line-height: 24px; color: #565554; font-size: 13px; font-weight: 900;}
#uye-girisi label input {float: right; width: 188px; height: 22px; background: #fff; border: 1px solid #aaa; padding: 0 5px; color: #434241; font-size: 12px;}
#uye-girisi label button {float: left; padding: 0 8px; line-height: 22px; border: 1px solid #000; color: #fff; background: #333;}
#uye-girisi label button:hover {background: #000;}
#uye-girisi label a {float: right; color: #333; line-height: 24px; font-size: 14px; font-weight: 900; text-decoration: none;}
#uye-girisi label a:hover {color: #000; border-bottom: 1px dotted #ccc;}

/* Tum Arkadaslar
-------------------------------------------------------------------------------*/
#tum-ark {position: absolute; left: 124px; top: 225px; z-index: 9999999999; display: none; background: #fff; border: 5px solid #eee; box-shadow: 0px 0px 5px rgba(0,0,0,.5); width: 550px; height: 300px; padding: 25px;}
#tum-ark h3 {color: #565554; font-size: 15px; font-weight: 900; margin-top: -5px;}
#tum-ark ul {width: 550px; height: 290px; overflow: auto; border-top: 3px solid #f4f4f4;}
#tum-ark ul li {float: left; margin: 0 15px 5px 0;}


/* Tipsy
-------------------------------------------------------------------------------*/
.tipsy { font-size: 10px; position: absolute; padding: 5px; z-index: 100000; }
  .tipsy-inner { background-color: #000; color: #FFF; max-width: 200px; padding: 5px 8px 4px 8px; text-align: center; }

  /* Rounded corners */
  .tipsy-inner { border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
  
  /* Uncomment for shadow */
  /*.tipsy-inner { box-shadow: 0 0 5px #000000; -webkit-box-shadow: 0 0 5px #000000; -moz-box-shadow: 0 0 5px #000000; }*/
  
  .tipsy-arrow { position: absolute; width: 0; height: 0; line-height: 0; border: 5px dashed #000; }
  
  /* Rules to colour arrows */
  .tipsy-arrow-n { border-bottom-color: #000; }
  .tipsy-arrow-s { border-top-color: #000; }
  .tipsy-arrow-e { border-left-color: #000; }
  .tipsy-arrow-w { border-right-color: #000; }
  
 .tipsy-n .tipsy-arrow { top: 0px; left: 50%; margin-left: -5px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent; }
    .tipsy-nw .tipsy-arrow { top: 0; left: 10px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent;}
    .tipsy-ne .tipsy-arrow { top: 0; right: 10px; border-bottom-style: solid; border-top: none;  border-left-color: transparent; border-right-color: transparent;}
  .tipsy-s .tipsy-arrow { bottom: 0; left: 50%; margin-left: -5px; border-top-style: solid; border-bottom: none;  border-left-color: transparent; border-right-color: transparent; }
    .tipsy-sw .tipsy-arrow { bottom: 0; left: 10px; border-top-style: solid; border-bottom: none;  border-left-color: transparent; border-right-color: transparent; }
    .tipsy-se .tipsy-arrow { bottom: 0; right: 10px; border-top-style: solid; border-bottom: none; border-left-color: transparent; border-right-color: transparent; }
  .tipsy-e .tipsy-arrow { right: 0; top: 50%; margin-top: -5px; border-left-style: solid; border-right: none; border-top-color: transparent; border-bottom-color: transparent; }
  .tipsy-w .tipsy-arrow { left: 0; top: 50%; margin-top: -5px; border-right-style: solid; border-left: none; border-top-color: transparent; border-bottom-color: transparent; }

Ana sayfaya eklenecek kod:

                      <div class="dizi-tablo clearfix">
<div class="resim"><a href="http://www.youtube.com/watch?v=sM0XvXEt2lo"><img border="1" alt="" body="" onmouseout="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseover="this.style.opacity=0.4;this.filters.alpha.opacity=0" style="opacity: 1; width: 280px; height: 110px;" src="http://i3.ytimg.com/vi/Z6j63ImEKyo/default.jpg" /></a></div>
<div class="dizi-isim">
<h3><a href="http://www.youtube.com/watch?v=sM0XvXEt2lo">The Call of Ktulu</a></h3>
</div>
<!-- .dizi-isim -->
<div class="b-sayi">
<h3>Sanatçı: <span>Metallica</span></h3>
</div>
<!-- .b-sayi --></div>
<!-- .dizi-tablo --><div class="dizi-tablo clearfix">
<div class="resim"><a href="http://www.youtube.com/watch?v=sM0XvXEt2lo"><img border="1" alt="" body="" onmouseout="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseover="this.style.opacity=0.4;this.filters.alpha.opacity=0" style="opacity: 1; width: 280px; height: 110px;" src="http://i3.ytimg.com/vi/Z6j63ImEKyo/default.jpg" /></a></div>
<div class="dizi-isim">
<h3><a href="http://www.youtube.com/watch?v=sM0XvXEt2lo">The Call of Ktulu</a></h3>
</div>
<!-- .dizi-isim -->
<div class="b-sayi">
<h3>Sanatçı: <span>Metallica</span></h3>
</div>
<!-- .b-sayi --></div>
<!-- .dizi-tablo --><div class="dizi-tablo clearfix">
<div class="resim"><a href="http://www.youtube.com/watch?v=sM0XvXEt2lo"><img border="1" alt="" body="" onmouseout="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseover="this.style.opacity=0.4;this.filters.alpha.opacity=0" style="opacity: 1; width: 280px; height: 110px;" src="http://i3.ytimg.com/vi/Z6j63ImEKyo/default.jpg" /></a></div>
<div class="dizi-isim">
<h3><a href="http://www.youtube.com/watch?v=sM0XvXEt2lo">The Call of Ktulu</a></h3>
</div>
<!-- .dizi-isim -->
<div class="b-sayi">
<h3>Sanatçı: <span>Metallica</span></h3>
</div>
<!-- .b-sayi --></div>
<!-- .dizi-tablo --><div class="dizi-tablo clearfix">
<div class="resim"><a href="http://www.youtube.com/watch?v=sM0XvXEt2lo"><img border="1" alt="" body="" onmouseout="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseover="this.style.opacity=0.4;this.filters.alpha.opacity=0" style="opacity: 1; width: 280px; height: 110px;" src="http://i3.ytimg.com/vi/Z6j63ImEKyo/default.jpg" /></a></div>
<div class="dizi-isim">
<h3><a href="http://www.youtube.com/watch?v=sM0XvXEt2lo">The Call of Ktulu</a></h3>
</div>
<!-- .dizi-isim -->
<div class="b-sayi">
<h3>Sanatçı: <span>Metallica</span></h3>
</div>
<!-- .b-sayi --></div>
<!-- .dizi-tablo --><div class="dizi-tablo clearfix">
<div class="resim"><a href="http://www.youtube.com/watch?v=sM0XvXEt2lo"><img border="1" alt="" body="" onmouseout="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseover="this.style.opacity=0.4;this.filters.alpha.opacity=0" style="opacity: 1; width: 280px; height: 110px;" src="http://i3.ytimg.com/vi/Z6j63ImEKyo/default.jpg" /></a></div>
<div class="dizi-isim">
<h3><a href="http://www.youtube.com/watch?v=sM0XvXEt2lo">The Call of Ktulu</a></h3>
</div>
<!-- .dizi-isim -->
<div class="b-sayi">
<h3>Sanatçı: <span>Metallica</span></h3>
</div>
<!-- .b-sayi --></div>
<!-- .dizi-tablo --><div class="dizi-tablo clearfix">
<div class="resim"><a href="http://www.youtube.com/watch?v=sM0XvXEt2lo"><img border="1" alt="" body="" onmouseout="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseover="this.style.opacity=0.4;this.filters.alpha.opacity=0" style="opacity: 1; width: 280px; height: 110px;" src="http://i3.ytimg.com/vi/Z6j63ImEKyo/default.jpg" /></a></div>
<div class="dizi-isim">
<h3><a href="http://www.youtube.com/watch?v=sM0XvXEt2lo">The Call of Ktulu</a></h3>
</div>
<!-- .dizi-isim -->
<div class="b-sayi">
<h3>Sanatçı: <span>Metallica</span></h3>
</div>
<!-- .b-sayi --></div>
<!-- .dizi-tablo -->

Alternatif sayfa İçeriği:

<!--Video Çekme Botu-->
<div style="position:absolute; overflow:hidden; width:640px; height:800px;border:0px solid #999;"><iframe width="650" scrolling="no" height="1200" frameborder="0" style="top:-310px;left:-15px;position:absolute" name="arama" src="http://arabeskrapin.tr.gg/" marginwidth="0" marginheight="0"></iframe>
<div>
<div align="right" style="position:absolute;bottom:0px;right:0px;z-index:5000;"><a href="http://siteneeklekodlari.blogspot.com/2011/10/baska-sitenin-sadece-istedigin-ksmn.html"><img alt="" style="border:none;width:55;height:15px;float:right;" src="http://img607.imageshack.us/img607/5117/35219057.png" /></a>  <a href="http://arabeskrapin.tr.gg"><img alt="" style="border:none;width:55;height:15px;float:right;" src="http://img.webme.com/pic/a/arabeskrapin/botresmi.png" /></a></div>
</div>
</div>

Alternatif sayfa İçeriği:

<!--Admin Paneli-->
<div id="uye-profili" class="clearfix">
<div class="sol">
<div class="avatar"><img width="100" height="100" src="http://img.webme.com/pic/a/arabeskrapin/serhatweb.jpg" alt="" />
<div class="nick" style="text-align: center;">Serhat Web</div>
</div>
<!-- .avatar -->
<ul class="link">
    <li><a href=""><img src="http://img.webme.com/pic/a/arabeskrapin/ekle.png" alt="" />Arkadas Olarak Ekle</a></li>
    <li><a href=""><img src="http://img.webme.com/pic/a/arabeskrapin/email.png" alt="" />Mesaj Gönder</a></li>
    <li><a href=""><img src="http://img.webme.com/pic/a/arabeskrapin/facebook.png" alt="" />Facebook Profili</a></li>
    <li><a href=""><img src="http://img.webme.com/pic/a/arabeskrapin/twitter.png" alt="" />Twitter Profili</a></li>
    <li><a href=""><img src="http://img.webme.com/pic/a/arabeskrapin/friendfeed.png" alt="" />Friendfeed Profili</a></li>
    <li><a href=""><img src="http://img.webme.com/pic/a/arabeskrapin/myspace.png" alt="" />MySpace Sayfasi</a></li>
    <li><a href=""><img src="http://img.webme.com/pic/a/arabeskrapin/lastfm.png" alt="" />LastFM Sayfasi</a></li>
</ul>
<!-- .link -->
<div class="clear" style="height: 25px"> </div>
<div class="baslik">Arkadaslari                                 <a href="/sanatcilar.htm" id="tum-arkadaslar">tümü</a></div>
<ul class="arkadaslar">
    <li><a href="" class="resim"><img src="http://img.webme.com/pic/a/arabeskrapin/bsr.png" alt="" /></a>                                     <a href="" class="isim"><span>Bilinmeyen Sahis</span></a>                                     <a href="" class="davet"><span>Arkadas olarak ekle</span></a></li>
    <li><a href="" class="resim"><img src="http://img.webme.com/pic/a/arabeskrapin/eren.png" alt="" /></a>                                     <a href="" class="isim"><span>Bilinmeyen Sahis</span></a>                                     <a href="" class="davet"><span>Arkadas olarak ekle</span></a></li>
</ul>
</div>
<!-- .sol -->
<div class="sag">
<h3 class="isim">Serhat Web</h3>
<ul class="bilgi">
    <li><span>Memleketi :</span> Bingöl, Türkiye</li>
    <li><span>Oturdugu Yer :</span> Hainburg/Donau, Avusturya</li>
    <li><span>Meslegi :</span> Wepmaster</li>
    <li><span>Ilgi Alanlari :</span> Web, Müzik</li>
    <li><span>Kayit Tarihi :</span> 08.09.2012</li>
    <li><span>Son Aktivitesi :</span> 08.09.2012 14:53</li>
    <li><span>Video Ekleme Sayisi :</span> 0</li>
</ul>
<div class="clear" style="height: 25px"> </div>
<div class="baslik">Ekledigi Videolar</div>
<ul class="favori-diziler">
    <li><a href="" class="resim"><img src="_content/images/supernatural.png" alt="" /></a>                                     <a href="" class="isim"><span>Supernatural</span></a></li>
    <li><a href="" class="resim"><img src="_content/images/himym.png" alt="" /></a>                                     <a href="" class="isim"><span>How I Met Your Mother</span></a></li>
</ul>
<!-- .favori-diziler --></div>
<!-- .sag --></div>
<!-- #uye-profili -->

VidMuzik

Benzer Tasarımlar:

Yorum Gönder

Kategoriler

En Popüler Tasarımlar

Son Yorumlar