Music (external CSS) layout | Friendster-Layouts.com

Music (external CSS)

Layout designer

Rate this layout

» Layout Preview

Friendster-Layouts.com - Music (external CSS)

please drop some comments..thnx.. get the code here!
Mind you this is not a crossover so if you want this layout and you have many applications better not to use it.
thanks switpotato for the idea.

Code for CSS section

/* {--friendster-layouts.com css code start--} */

/********************
CSS BOX POSITIONING
*********************/
.photos{position:absolute! important; top: 445px ! important; left:150px!   important;border:none ! important;width: 180px;height: 300px! important;overflow-Y:auto! important;overflow-X:hidden! important;
scrollbar-base-color: #23251D;
scrollbar-arrow-color: #ffffff;
scrollbar-3dlight-color: #23251D;
scrollbar-darkshadow-color: #23251D;
scrollbar-face-color: #23251D;
scrollbar-highlight-color: #23251D;
scrollbar-shadow-color: #23251D;
scrollbar-track-color: #23251D;}
.photos .viewall{display:none!important;}

.scrapbook{position:absolute! important; top: 660px ! important; left:150px!  important;border:none ! important;width: 180px;height: 180px! important; overflow-Y:auto! important;overflow-X:hidden! important;
scrollbar-base-color: #23251D;
scrollbar-arrow-color: #ffffff;
scrollbar-3dlight-color: #23251D;
scrollbar-darkshadow-color: #23251D;
scrollbar-face-color: #23251D;
scrollbar-highlight-color: #23251D;
scrollbar-shadow-color: #23251D;
scrollbar-track-color: #23251D;text-align:center! important;}
.friends{position:absolute! important; top: 850px ! important; left:150px!   important;border:none ! important;width: 180px;height: 300px! important; overflow-Y:auto! important;overflow-X:hidden! important;
scrollbar-base-color: #23251D;
scrollbar-arrow-color: #ffffff;
scrollbar-3dlight-color: #23251D;
scrollbar-darkshadow-color: #23251D;
scrollbar-face-color: #23251D;
scrollbar-highlight-color: #23251D;
scrollbar-shadow-color: #23251D;
scrollbar-track-color: #23251D;}

.friends .viewall {text-align:center; margin-left:30px; width:120px;position:relative;right:30px}

#logo {position:relative! important; top:20px! important; left:595px! important}
.primary_links {  position: absolute!important; top: 260px!important; left:79px!important;width: 130px!important;} 

#cpShoutoutBox {  height : 40px! important; width : 230px! important;background-color: #23251D  ;border:1px solid #FFFFFF! important;color: #ffffff ;  overflow:auto! important;
scrollbar-base-color: #23251D;
scrollbar-arrow-color: #ffffff;
scrollbar-3dlight-color: #23251D;
scrollbar-darkshadow-color: #23251D;
scrollbar-face-color: #23251D;
scrollbar-highlight-color: #23251D;
scrollbar-shadow-color: #23251D;
scrollbar-track-color: #23251D; }

.controlpanel{position:absolute; left: 410px!important; top: 350px!important;height : 100px! important; width : 200px! important}

.moreabout{position:absolute! important; left: 410px!important; top: 700px!important; width:525px! important; height:400px! important; overflow:auto! important; text-align: left! important;
scrollbar-base-color: #79796E;
scrollbar-arrow-color: #ffffff;
scrollbar-3dlight-color: #79796E;
scrollbar-darkshadow-color: #79796E;
scrollbar-face-color: #79796E;
scrollbar-highlight-color: #79796E;;
scrollbar-shadow-color: #79796E;
scrollbar-track-color: #79796E;}

.publiccomments{position:absolute; left: 410px!important; top: 1120px!important; width:525px! important; height:400px! important;overflow-Y:auto! important;overflow-X:hidden! important;
scrollbar-base-color: #79796E;
scrollbar-arrow-color: #ffffff;
scrollbar-3dlight-color: #79796E;
scrollbar-darkshadow-color: #79796E;
scrollbar-face-color: #79796E;
scrollbar-highlight-color: #79796E;;
scrollbar-shadow-color: #79796E;
scrollbar-track-color: #79796E;}

#footer_container{ padding-top:1400px! important; padding-bottom:1px;width:500px!important;font-size:4px! important;}
#footer a {color: #FFFFFF; }
#footer a:hover {color: #CCCCCC; }
#footer {color: #ffffff; }


/* MISC: TESTIMONIALS/REVIEWS TEXT */
.publiccomments div div .dtd ul {  border:1px solid #ffFFFF; padding:2px; overflow: auto;text-align:center; width:310px;  height: 60px;
   background-color: #23251D ;background-attachment: fixed;background-position:  left bottom ;background-repeat: repeat;
scrollbar-base-color: #23251D;
scrollbar-arrow-color: #ffffff;
scrollbar-3dlight-color: #23251D;
scrollbar-darkshadow-color: #23251D;
scrollbar-face-color: #23251D;
scrollbar-highlight-color: #23251D;
scrollbar-shadow-color: #23251D;
scrollbar-track-color: #23251D}

.evenrow{background-color:transparent! important}


/***********
MAINNAV CODE
***********/
#mainnav{margin: 0 0px;background:transparent! important;border: transparent!important; width: 800px !important;position:absoulte; top:8px! important; left: 70px! important;font-size: 12px!important; }
#mainnav ul li ul li.sublink_top {border-top: 0px none transparent!important;}
#mainnav ul li ul li{display: list-item;float: none;border-bottom: 0px none transparent;background-color: tranparent!important;}
#mainnav { text-align: center !important; }
.secondary_links{display:none! important}

/* HOME  , My Apps , Search   */
#mainnav ul li span.noSubMenu a { 
background:url('http://i200.photobucket.com/albums/aa73/fs-layouts/fslybg/2008/08/esormusic/esormusic.gif')! important;
background-attachment:scroll !important; background-position-x: left bottom !important;
background-repeat:no-repeat !important;background-color: transparent! important;
border:none! important;  font-family: Arial, Sans-serif; font-size: 11px!important; 
text-align:left; color: #cccccc! important; 
font-weight:bold; height:15px! important; text-decoration: none! important;  
margin: 3px 15px 0 10px! important;   padding: 0px 5px 0 24px! important; }

#mainnav ul li span.noSubMenu a:hover { 
background:url('http://i200.photobucket.com/albums/aa73/fs-layouts/fslybg/2008/08/esormusic/esormusic.gif')! important;
background-attachment:scroll !important; background-position-x: left bottom !important;
background-repeat:no-repeat !important;background-color: transparent! important;
border:none! important;  font-family: Arial, Sans-serif; 
font-size: 11px!important; text-align:left;color: #ffffff! important; 
font-weight:bold; height:15px! important; text-decoration: none! important;  
margin: 3px 15px 0 10px! important;   padding: 0px 5px 0 24px! important; }

#mainnav ul li a { 
background:url('http://i200.photobucket.com/albums/aa73/fs-layouts/fslybg/2008/08/esormusic/esormusic.gif')! important;
background-attachment:scroll !important; background-position-x: left bottom !important;background-repeat:no-repeat !important;
background-color: transparent! important;border:none! important;  font-family: Arial, Sans-serif; 
font-size: 11px!important; text-align:left; color: #cccccc! important; font-weight:bold; 
height:15px! important; text-decoration: none! important;  margin: 3px 15px 0 10px! important;   padding: 0px 5px 0 24px! important; }


#mainnav a:hover{ 
background:url('http://i200.photobucket.com/albums/aa73/fs-layouts/fslybg/2008/08/esormusic/esormusic.gif')! important;
background-attachment:scroll !important; background-position-x: left bottom !important;background-repeat:no-repeat !important;
background-color: transparent! important;border:none! important;  font-family: Arial, Sans-serif; font-size: 11px!important; text-align:left;color: #ffffff! important; 
font-weight:bold; height:15px! important; text-decoration: none! important;  margin: 3px 15px 0 10px! important;   
padding: 0px 5px 0 24px! important; 

/*SUBLINK DROP DOWN MENU*/
#mainnav ul li ul li a {visibility:hidden!important; background:transparent! important}

/*REMOVE BLUE BACKGROUND SUBLINK CONTAINER*/
#mainnav ul li ul {background-color: transparent;}


/************
RESIZE IMAGES
*************/

/*REMOVE GALLERY PIC WHITE BG*/
.flogridp .flogriditem {background:none;}
.flogrid75, .flogrid50 {margin-bottom: 17px;margin-left:25px! important;}

#content_2{width:120px;height:auto;overflow-X:hidden;}

/*RESIZE GALLERY PIC*/
#content_1 .flogridp .ir img { margin: 0 auto; height: 80px! important; width:80px!important;border: 1px solid #ffffff! important; }

/*RESIZE FRIEND PIC INDIVIDUAL CONTAINER */
#content_2 .flogrid75 .ir { width: 80px! important; height: 80px! important;border: 1px solid #ffffff! important; margin-right:0px;}

/*RESIZE FRIEND IMAGE*/
#content_2 .flogrid75 .ir img {height: 80px! important; width: 80px!important;margin-bottom:20px!important;  }

/*RESIZE FRIENDS NAME CONTAINER*/
#content_2 .flogrid75 .flogriditem { width: 80px! important; height:80px! important; }

/*REMOVE SMALL PHOTO NAMES white line*/
.dr {border-top:none;padding:0px 0px 5px 0px! important; }


/*RESIZE TESTI IMAGE */
.imgblock75 img { width: 55px! important; height: 55px! important; margin: 0px ;border: 1px solid #ffffff! important;  }

/*RESIZE TESTI IMAGE CONTAINER*/
.imgblock75 { width: 60px! important; height: 60px! important; background:transparent;  }

/*IMAGE AND LINK HOVER EFEX - IE ONLY remove :hover if u want to reverse the efex*/
a:hover img { filter:alpha(opacity=60); }
A:hover img{filter:alpha(Opacity=100,finishopacity=0, style=2);}  
a:hover {background-image:url(''); width: inherit; height: 0; background-position-y:50%}  


/* MISC: TESTIMONIALS/REVIEWS TEXT */
.data {
  font-family: Arial, Sans-serif; color: #cccccc;  text-transform: }

/* MISC: VIEW ALL LINKS */
.commonbox .viewall { color: #ffffff;}

/* MISC: SMALL PHOTOS */
.commonbox .imgblock75, .ir {  background-color: transparent;}

/* MISC: SMALL PHOTO NAMES */
.commonbox .dr {  color: #ffffff;  background-color: transparent;}






/* PAGE BACKGROUND */
body {
border-left:10px solid #FF1493; border-right:10px solid #Ff1493; border-top:10px solid #FF1493; border-bottom:10px solid #Ff1493; background:#000000 url('http://i135.photobucket.com/albums/q157/lady_wilrose/music.jpg') NO-repeat top center; cursor: url();
scrollbar-face-color: #000000;
scrollbar-shadow-color: #FF69B4;
scrollbar-highlight-color: #7FFF00;
scrollbar-3dlight-color: #FF69B4;
scrollbar-darkshadow-color: #7FFF00;
scrollbar-track-color: #FF69B4;
scrollbar-arrow-color: #7FFF00;
overflow-x: hidden
}



/************
HIDING CODES
************/
/*REMOVE ADS*/
#googleAdPlacement{display:none!important}
.commonbox_noborder{display:none!important}
.commonbox h1, .commonbox h2 {display:none!important}
div #mainnav div div { display:none ! important;}
#navLang{display:none! important}
#subnav_search{display:none!important;}
#subnav {display:none!important;}
#navdivider {display:none!important;background:transparent;}
#banneradrow { display:none!important;}
#marketing_bg {display:none!important;background:transparent;}
#headersearch{display:none!important ;background:transparent;}
a.more{display:none! important}
.controlpanel p{display:none! important}
.user_tracker {display:none!important;}
.so, .soc, .sol, .sob { background: transparent !important; }
.editlink { display:none }
.Application{ display: none!important;}
.badge { display: none!important;}
#content_0 .itd {font-size: 0px !important;}
#content_0 .itd ul {font-size: 0px!important;}
.blogs, .reviews, .fanof, .groups, .meettrail{display:none!important;}


/* CURSOR */
a, a:link, a:visited, a:active, a:hover {
cursor:url(),default;
}
/* GLOBAL FONTS */
.usercontent {
  font-family: trebuchet;
  color: #FFCCCC ;
  text-transform: none;
}

/* GLOBAL LINKS */
.usercontent a, .usercontent a:link, .usercontent a:visited, .usercontent a:hover, .usercontent a:active {
font-family: trebuchet;
color: #FFE4B5;
text-transform: none;
}

/* GLOBAL LINKS HOVER */
.usercontent a:hover {
color: #FF1493;
text-decoration: underline;}

/* MASTER BOXES */
.commonbox {
border:1px solid #FFffff; background-repeat: repeat;
background-color: #000000;
background-position-y:center
}
.commonbox .evenrow {
background-repeat: ;
background-color: #000000
}

/* MASTER HEADERS */
.commonbox h1, .commonbox h2 {
 background-image: url('http://');
 background-position:  center;
 background-repeat: no-repeat;
 background-color: #FFffff;
 font-family: trebuchet;
 color: #CC0000;
 text-transform: none;
 border: 1px solid #FF1493;
}

/* MAIN BOXES: BULLETS */
.controlpanel .q {
background-position: center left; padding-left:25px; padding-right:0; padding-top:0; padding-bottom:0; background-color:transparent; background-repeat:no-repeat; background-attachment:scroll}
.usercontent .q{
background: url('http://h1.ripway.com/27248571/icons/7.gif') no-repeat left; 
padding-left:16px; padding-right:0; padding-top:0; padding-bottom:0}

/* CONTROL PANEL: BOX */
.controlpanel {
 background-attachment: ;
 background-repeat: ;
 border:1px solid #ffffff; background-color: #000000
 
}

/* CONTROL PANEL: USER PHOTO */
.controlpanel .imgblock200 {
 border-width: 1px;
 border-color: #Ffffff;
 border-style: solid;
}

/* CONTROL PANEL: DATA */
.controlpanel .q {
font-family: trebuchet;
color: #ffffff;
text-transform: none;
}
.controlpanel .data {
font-family: trebuchet;
color: #ffffff;
text-transform: none;
}
.data a {
font-family: trebuchet;
color: #ffffff;
text-transform: none;
}
a.more {
font-family: trebuchet;
color: #ffffff;
text-transform: none;
}


/* CONTROL PANEL: BUTTONS */
#controlPanelButtons a, #controlPanelButtons a:link, #controlPanelButtons a:visited {
border:1px solid #Ffffff; background-color: #000000;
font-family: trebuchet;
color: #ffffff;
text-transform: none
}


/*************controlbuttons************/

#controlPanelButtons li { display: -moz-inline-box; }
#controlPanelButtons a, #controlPanelButtons a:link, #controlPanelButtons a:visited {
border: medium none;
background: url('http://i193.photobucket.com/albums/z39/xinoxs/kawaibuton.png') no-repeat 0 0;
display:block; color:#FFCC66; font-family:trebuchet; font-size:10px; background-repeat:no-repeat }
#controlPanelButtons a:hover {
    color: #FF1493;
    border: none;
    background-position: -100px 0; }

/* {--friendster-layouts.com css code end--} */

Code for Media/About Me

<p align="center"><a title="Friendster Layouts" href="http://friendster-layouts.com/"><img border="0" src="http://btn.friendster-layouts.com/03.gif" alt="Friendster Layouts"></a><br /><a href="http://friendster-layouts.com/" title="Friendster Layouts">Friendster-Layouts.com</a>: <a href="http://friendster-layouts.com/author/esor/" title="esor's layouts">esor's layouts</a></p>

Download Background Image

Add Layouts Widget

• Published by esor on August 1st, 2008 (3:05 GMT).

Other layouts from 'Uncategorized' category:

Friendster-Layouts.com

Music (external CSS)

Navigation Links

Browse Layouts

Sponsors