How??
My skin is Brilliance V1
My Stile.CSS code is:
*{
margin:0;
padding:0;
}
body{
background:#fff;
font:11px/20px Tahoma,Helvetica,sans-serif;
color:#222;
}
/* Layout Styles Starts */
#wrapper{
width:900px;
margin:0 auto;
position:relative;
padding:0 0 10px 0;
}
#header-top{
height:80px;
overflow:hidden;
padding:20px 25px 0 25px;
}
#logo{
float:left;
}
#logo h1{
background:url(../images/logo.jpg) no-repeat;
width:173px;
}
#logo h1 a{
display:block;
height:66px;
}
#logo h1 a span{
display:none;
}
#s3slider{
position:relative;
height:263px;
overflow:hidden;
}
#s3sliderContent {
width: 900px; /* important to be same as image width or wider */
position: absolute; /* important */
top: 0; /* important */
margin-left: 0; /* important */
}
.s3sliderImage {
float: left; /* important */
position: relative; /* important */
display: none; /* important */
}
.s3sliderImage span {
position: absolute; /* important */
left: 0;
font: 10px/15px Arial, Helvetica, sans-serif;
padding: 10px 13px 15px 13px;
width: 874px;
background-color: #000;
filter: alpha(opacity=50); /* here you can set the opacity of box with text */
-moz-opacity: 0.7; /* here you can set the opacity of box with text */
-khtml-opacity: 0.7; /* here you can set the opacity of box with text */
opacity: 0.5; /* here you can set the opacity of box with text */
color: #fff;
display: none; /* important */
bottom: 0;
/*
if you put
top: 0; -> the box with text will be shown at the top of the image
if you put
bottom: 0; -> the box with text will be shown at the bottom of the image
*/
}
#menu{
background:url(../images/menu-bg.jpg) no-repeat;
height:62px;
margin:1px 0 0 0;
overflow:hidden;
}
#menu ul{
list-style:none;
text-align:center;
}
#menu li, #menu li a, #menu li a.current{
display:block;
float:left;
}
#menu li{
line-height:44px;
text-transform:uppercase;
border-right:1px solid #444444;
}
#menu li.noborder{border:none;}
#menu li a{
color:#939393;
text-decoration:none;
padding:0 31px;
}
#menu li a:hover{
color:#fff;
text-decoration:none;
}
#menu li a.current{
text-decoration:none;
padding:0 31px;
color:#fff;
text-decoration:none;
}
#container{
margin:0 0 10px 0;
padding:15px 10px 0 10px;
background:transparent url(../images/container-divider.jpg) no-repeat 625px top;
}
#mainarea{
width:605px;
float:left;
}
#sidearea{
width:245px;
float:right;
}
.block1{
width:286px;
margin:0 10px 10px 0;
display:block;
float:left;
}
.block1 p{
text-align:center;
}
.block1 img{
border:1px solid #d9d9d9;
padding:3px;
background:#fff;
}
#footer{
background:url(../images/footer-bg.jpg) no-repeat;
height:60px;
overflow:hidden;
color:#939393;
padding:0 20px;
line-height:44px;
font-size:10px;
}
#footer a{
color:#939393;
text-decoration:none;
}
#footer a:hover{
color:#fff;
text-decoration:underline;
}
/* Layout Styles Ends */
/* Panel Tab/button */
.tab {
background: url(../images/tab_b.png) repeat-x 0 0;
height: 42px;
position: relative;
top: 0;
z-index: 999;
}
.tab ul.login {
display: block;
position: relative;
float: right;
clear: right;
height: 42px;
width: auto;
font-weight: bold;
line-height: 42px;
margin: 0;
right: 50px;
color: white;
font-size: 80%;
text-align: center;
}
.tab ul.login li.left {
background: url(../images/tab_l.png) no-repeat left 0;
height: 42px;
width: 30px;
padding: 0;
margin: 0;
display: block;
float: left;
}
.tab ul.login li.right {
background: url(../images/tab_r.png) no-repeat left 0;
height: 42px;
width: 30px;
padding: 0;
margin: 0;
display: block;
float: left;
}
.tab ul.login li {
text-align: left;
padding: 0 6px;
display: block;
float: left;
height: 42px;
background: url(../images/tab_m.png) repeat-x 0 0;
}
.tab ul.login li a {
color: #bfbfbf;
}
.tab ul.login li a:hover {
color: white;
}
.tab .sep {color:#414141}
.tab a.open, .tab a.close {
height: 20px;
line-height: 20px !important;
padding-left: 30px !important;
cursor: pointer;
display: block;
width: 100px;
position: relative;
top: 11px;
}
.tab a.open {background: url(../images/bt_open.png) no-repeat left 0;}
.tab a.close {background: url(../images/bt_close.png) no-repeat left 0;}
.tab a:hover.open {background: url(../images/bt_open.png) no-repeat left -19px;}
.tab a:hover.close {background: url(../images/bt_close.png) no-repeat left -19px;}
/* sliding panel */
#toppanel {
position: absolute;
top: 0;
width: 100%;
z-index: 999;
text-align: center;
margin-left: auto;
margin-right: auto;
}
#panel {
width: 100%;
height: 270px;
color: #999999;
background: #272727;
overflow: hidden;
position: relative;
z-index: 3;
display: none;
}
#panel h1 {
font-size: 1.6em;
padding: 5px 0 10px;
margin: 0;
color: white;
}
#panel h2{
font-size: 1.2em;
padding: 10px 0 5px;
margin: 0;
color: white;
}
#panel p {
margin: 5px 0;
padding: 0;
}
#panel a {
text-decoration: none;
color: #bfbfbf;
}
#panel a:hover {
color:#fff;
}
#panel a-lost-pwd {
display: block;
float: left;
}
#panel .content {
width: 960px;
margin: 0 auto;
padding-top: 15px;
text-align: left;
font-size: 0.85em;
}
#panel .content .left {
width: 280px;
float: left;
padding: 0 15px;
border-left: 1px solid #333;
}
#panel .content .right {
border-right: 1px solid #333;
}
#panel .content form {
margin: 0 0 10px 0;
}
#panel .content label {
float: left;
padding-top: 8px;
clear: both;
width: 280px;
display: block;
}
#panel .content input.field {
border: 1px #1A1A1A solid;
background: #414141;
margin-right: 5px;
margin-top: 4px;
width: 200px;
color: white;
height: 16px;
}
#panel .content input:focus.field {
background: #545454;
}
/* BUTTONS */
/* Login and Register buttons */
#panel .content input.bt_login,
#panel .content input.bt_register {
display: block;
float: left;
clear: left;
height: 24px;
text-align: center;
cursor: pointer;
border: none;
font-weight: bold;
margin: 10px 0;
}
#panel .content input.bt_login {
width: 74px;
background: transparent url(../images/bt_login.png) no-repeat 0 0;
}
#panel .content input.bt_register {
width: 94px;
color: white;
background: transparent url(../images/bt_register.png) no-repeat 0 0;
}
#panel .lost-pwd {
display: block;
float:left;
clear: right;
padding: 15px 5px 0;
font-size: 0.95em;
text-decoration: underline;
}
/* Links Styles Starts */
readmore{
font-size:9px;
}
a.readmore{
font-size:10px;
}
#container p.hr{
border:solid #d3d3d3;
border-width:1px 0 0 0;
margin:0;
outline:none;
}
#mainarea a{
border-bottom:1px dotted;
}
#mainarea a:hover{
text-decoration:none;
}
/* Links Styles Ends */
/* Form Styles */
#mainarea form{
padding:0 5px;
}
#mainarea form p{
margin:0 0 5px 0;
}
#mainarea form p.floatleft{
margin-right:15px;
}
.input{
border:1px solid #a5a5a5;
background:none;
cursor:text;
margin:5px 0;
padding:2px;
width:200px;
}
textarea.input{
width:415px;
height:100px;
}
.input:focus, .textarea:focus{
border:1px solid #000;
}
.signin-btn, .button1{
background: transparent url(../images/bt_register_black.png) no-repeat 0 0;
width:94px;
height:24px;
line-height:20px;
margin:8px 0;
padding:2px 10px !important;
padding:2px 0;
color:#fff;
font-weight:bold;
border:none;
outline:none;
cursor:pointer;
}
/* Form Styles */
/* Paragraph and list Styles */
#container p{
margin:0 0 15px 0;
}
#container form p{
margin:0 0 5px 0;
}
#container p img.floatleft{
margin:0 20px 0 0;
}
#container p img.floatright{
margin:0 0 0 20px;
}
#mainarea img.floatleft, #mainarea p img.floatleft{
margin:10px 10px 10px 0;
}
#mainarea img.floatright, #mainarea p img.floatright{
margin:10px;
}
#container ul, #container ol{
margin:0 0 0 20px;
}
#container ol{
margin:0 0 0 30px;
}
#container ul#works{list-style:none;margin:0;}
#container dt{
font-weight:bold;
margin:5px 0;
}
/* Paragraph Styles */
/* Genric Styles Starts */
.clearfix:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
.clearfix {
display: inline-block;
}
html[xmlns] .clearfix {
display: block;
}
* html .clearfix {
height: 1%;
}
a {
color:#222;
text-decoration:none;
font-weight:bold;
}
a:hover {text-decoration:underline;color:#ea4900;}
h1{font-size:32px;}
h2{font-size:22px;}
h3{font-size:18px;}
h4{font-size:16px;}
h5, h6{font-size:14px;}
h1,h2,h3,h4,h5,h6{margin:0 0 15px 0; color:#5c5b5b;font-family:"Trebuchet MS";font-weight:normal;}
img{border:none;}
.clear{clear:both;}
.floatleft{float:left;}
.floatright{float:right;}
.center{text-align:center;}
.text-left{text-align:left;}
.text-right{text-align:right;}
.normal, .normal a{font-weight:normal;}
.textbold{font-weight:bold;}
#container .nomargin, .nomargin{margin:0;}
#container.nobg, .nobg{background:none;}
/* Genric Styles Ends */
Thanks in Advanced!
