Made by: Barbara Mc
CLICK on “Continue reading” below for code & Preview button!
Designer Comments:
I made the layout with scraps by Flutterby and scrapsdimensions. I made the layout's backgrounds, buttons, comment box and headers with PDN/PSP. This layout was made to be used on individual Ning profiles. No other website has my permission to host this layout or the images used in the layout.
CLICK on “Continue reading” below for code & Preview button!
NingTheme
body /*Background*/{
background-color: #000;
background-image: url(http://i235.photobucket.com/albums/ee49/barbplaytime5/MISC/2012/blk_den/480x480.png);
background-position: top right;
background-repeat: repeat;
background-attachment: fixed;
color: #626262;
font-family: kristen itc;}
a:link, a:visited, a:active {
font-family: kristen itc;
color: #d0d5d6;
text-decoration: none;
font-size: 15px;
font-weight: bold;}
a:hover {
color: #3e6f83;
text-decoration: underline;
font-size: 15px;
font-weight: bold;}
h1 {font-family: kristen itc;color: #000 !important;
text-shadow: 0 2px 1px #626262; font-size: 15px;text-align: center!important; font-weight: bold;}
h2 {font-family: kristen itc; color: #000; !important; text-shadow: 0 2px 1px #626262; font-size: 15px;text-align: center!important; font-weight: bold;}
.xg_lightfont {color: #626262; font-weight: bold;}
.xg_lightborder {border-style: solid; border-color: #626262;}
#xg_body /*Contents*/{
width: 790px;
background-color: #000;
background-image: url("http://i235.photobucket.com/albums/ee49/barbplaytime5/MISC/2012/blk_den/480x480_2.png");
background-repeat: repeat;
background-position: top left;
background-attachment: scroll;
color: #626262; font-size:100%;
border: 2px solid #000 !important;
box-shadow: inset 0 0 15px #000;
}
#xg /*Head Background*/{
margin: auto;
width: 790px;
background-image: url();
background-image: none;
background-repeat: repeat;
background-position: center center;
background-attachment: fixed;
border: 0px solid #000;
box-shadow: 0 0 0px #000;
}
#xg_masthead /*Top Image*/
{display: block;
height: 600px;
width: 800px;
background-color: #000;
background-image: url(http://i235.photobucket.com/albums/ee49/barbplaytime5/MISC/2012/blk_den/800x500_6.png);
background-repeat: no-repeat;
background-position: bottom center;
border-left: solid 2px #000 !important;
border-right: solid 2px #000 !important;
border-bottom: solid 2px #000 !important;
box-shadow: inset 0 0 15px #000;
}
#xg_sitename, #xg_sitedesc /*This covers up the sitename text*/
{display: none}
#xg_navigation /* Navbar*/{
margin-top: -575px;
width: 800px !important;
height: 47px;
overflow: hidden !important;
}
#xg_navigation,
#xn_bar {
position: fixed;
z-index: 50;
}
a.button, button, input.button,
.input textarea:hover, select.quickpost:hover, #xn_bar #xn_bar_menu_search_query:hover{
background:-moz-linear-gradient(center top , #000, #626262) repeat scroll 0 0 transparent;
background:-webkit-gradient(linear, left top, left bottom, from(#000), to(#626262));
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#000',endColorstr='#626262');
border: solid 2px #000;
-moz-border-radius-topleft:7px;
-moz-border-radius-topright:7px;
-moz-border-radius-bottomleft:7px;
-moz-border-radius-bottomright:7px;
box-shadow: inset 0 0 0px #000;
}
#xg_navigation /* Navbar*/,
#xg_navigation ul div.xg_subtab ul li a /*Subtab Font Properties*/
{background-color: transparent;
background-image:none;
background-repeat: repeat;
background-attachment: scroll;
color: #000 !important}
#xg_navigation ul li a /*NavBar Font Properties*/
{background-color:transparent;
font-family:kristen itc;
font-size:10px;
color: #d0d5d6;
font-weight:bold}
a.button:hover, button:hover, input.button:hover,
.input textarea, input.textfield:focus, input.password:focus, input.file:focus, textarea:focus, select:focus, select.quickpost, #xn_bar #xn_bar_menu_search_query, #xn_bar input.text {
background:-moz-linear-gradient(center top , #000, #626262) repeat scroll 0 0 transparent;
background:-webkit-gradient(linear, left top, left bottom, from(#000), to(#626262));
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#000',endColorstr='#626262');
color: #d0d5d6 !important;
border: 2px solid #000;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
box-shadow: inset 0 0 8px #000;
}
#xg_navigation ul li.this a,
#xg_navigation ul li a:hover, /*"This Page" highlight color*/
#xg_navigation ul div.xg_subtab ul li a:hover
{background-color: transparent;
background-image: url(http://i235.photobucket.com/albums/ee49/barbplaytime5/MISC/2012/blk_den/24x30.png);
Background-repeat: no-repeat;
background-position: center;
padding-bottom: 30px;
color: #3e6f83 !important;
}
.xg_widget_profiles_profile_show .xg_3col .xg_2col .blogpost img,
.xg_widget_profiles_profile_show .xg_3col .xg_2col img {
max-width: 475px;
}
a.button,
button,
input.button,
.xg_module_head /*Bg of headers*/ {
background: #000 url(http://i235.photobucket.com/albums/ee49/barbplaytime5/MISC/2012/blk_den/100x100ttst.png)
bottom center repeat scroll !important;
font-size: 15px !important;
color: #d0d5d6 !important;
text-align: center !important;
font-weight: bold;
border: 2px solid #000 !important;
-webkit-box-shadow: inset 0px 0px 4px 14px #000 !important;
box-shadow: inset 0px 0px 14px 4px #000 !important;
-webkit-border-radius: 9px;
-moz-border-radius: 9px;
border-radius: 9px;
margin: auto !important;
padding: 4px !important;
}
.xg_module_head h2 {color: #d0d5d6;
text-align: center;
text-shadow: 0 2px 1px #000;
font-size: 15px;
font-weight: bold;}
.module_about a.button {
width: 185px
}
.xg_widget_profiles_profile_show .xg_2col h1 {
text-align: center;
}
.status-bar,
.xg_widget_profiles_profile_show .xg_2col h1,
.xg_module_body{
background-color: transparent;
background-image: url("");
background-attachment: scroll; font-family: kristen itc; color: #626262;
font-weight: bold;
border: solid 2px;
border-color: #000;
-moz-border-radius-topleft:7px;
-moz-border-radius-topright:7px;
-moz-border-radius-bottomleft:7px;
-moz-border-radius-bottomright:7px;
box-shadow: inset 0 0 14px #000;}
.xg_span-16{
margin-left: -2px;
}
.xg_span-4{
margin-left: -6px;
}
.xg_widget_profiles_profile .xg_3col .xg_1col {
margin-right: 5px;
}
.xg_module_foot /*Bg of footers*/ {
background: #000 url(http://i235.photobucket.com/albums/ee49/barbplaytime5/MISC/2012/blk_den/100x100ttst.png) bottom center repeat scroll !important;
font-size: 12px !important;
font-weight: bold;
text-align: center !important;
border: 2px solid #000 !important;
-webkit-border-radius: 9px;
-moz-border-radius: 9px;
border-radius: 9px;
-webkit-box-shadow: inset 0px 0px 4px 14px #000;
box-shadow: inset 0px 0px 14px 4px #000;
}
.xg_module_foot a
{color: #d0d5d6;
font-weight: bold;
text-shadow: 0 2px 1px #626262;
background-image: none;
background-repeat: repeat;
background-attachment: scroll;
background-position: right bottom;
padding-bottom: 25px;
font-family: kristen itc;
font-weight: bold;}
.xg_module_foot a:hover {
color: #000;
font-weight: bold;
}
#xn_bar /*Ning bar at top*/{
display: block;
height: 100px;
background:-moz-linear-gradient(center top , #000, #626262) repeat scroll 0 0 transparent;
background:-webkit-gradient(linear, left top, left bottom, from(#000), to(#626262));
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#000',endColorstr='#626262');
color: #d0d5d6 !important;
font-family: kristen itc;
font-weight: bold;
border-bottom: double 0px #000;
box-shadow: 0 0 28px #000; }
#xg_foot /* Ning Footer*/{
width: 780px;
background-color: transparent !important; background-image: url(http://i286.photobucket.com/albums/ll88/AnGella_/AnGellaDesigns/Footer-2.png); background-repeat: no-repeat;
background-attachment: scroll;
background-position: center center;
color: #3e6f83;
font-family: kristen itc;
font-size: 8px;}
textarea#xg_profiles_chatterwall_post_comment
{height:191px !important;
width:380px;
background:#000 url(http://i235.photobucket.com/albums/ee49/barbplaytime5/MISC/2012/blk_den/380x191.png) center no-repeat scroll;
color:#d0d5d6 !important;
font-family: kristen itc;
font-weight: bold;
font-size: 125%;
border: solid 2px #000;
box-shadow: inset 0 0 14px #000;
text-shadow: 0 1px 1px #000;
}
/*Start Changing BGComment by Sora */
#xg_profiles_chatterwall_post_comment_ifr {
opacity: 0.5;
filter:alpha(opacity=50);
height: 191px !important;
}
td.mceIframeContainer.mceFirst.mceLast {
background: #000 url(http://i235.photobucket.com/albums/ee49/barbplaytime5/MISC/2012/blk_den/380x191.png) top left no-repeat fixed;
height: 191px; }
/*ENd Code by Sora*/
.html_editor_toolbar defaultSkin,
.xg_module_comment_wall #xg_profiles_chatterwall_post .texteditor {
width: 380px !important;
}
#xg_profiles_chatterwall_post_comment, #xg_profiles_chatterwall_post_comment_ifr{ margin-top: 14px !important;
}
.xg_2col .feed-timestamp {
left:300px;
top:4px;
}
.xg_widget_profiles_profile_show .xg_3col .xg_2col .xg_reset img {
max-width:323px;
}
.xg_widget_profiles_profile_show .xg_3col .xg_2col .comment img {
max-width:295px;
}
.xg_widget_profiles_profile_show .xg_3col .xg_2col .blogpost img {
max-width:323px;
}
.xg_widget_profiles_profile_show .xg_3col .xg_2col img {
max-width:323px;
}
.xg_widget_profiles .xg_2col .module_groups .clist li{
margin: 2px
}
.xg_span-16{width: 600px}
xg_3col first-child
{width: 775px}
xg_colgroup last-child
{width: 775px}
.xg_colgroup .first-child
{width: 600px;
margin:0px}
.xg_widget_profiles_profile_show .xg_3col .xg_2col, .xg_widget_profiles_profile_apps .xg_3col .xg_2col
{padding:0 5px;
width:400px !important;
margin-right: 2px;
overflow: hidden}
.xg_widget_profiles_profile .xg_3col .xg_1col {
width:183px;
overflow: hidden
}
.xg_last, .last-child {
margin: 0px;
}
.xg_span-4{
width: 175px;
display:inline;
overflow: hidden
}
.xg_2col .feed-timestamp {
left:300px;
top:4px;
}
.input button {
bottom:0;
left:275px;
margin-right:0;
max-width:110px;
overflow:hidden;
padding:0.35em 0.5em 0.4em;
position:absolute;
}
embed.xg_slideshow {
max-width: 380px ! important
}
.input textarea {width:250px}
.module_about a.button {margin:0 0 5px;text-align:center;white-space:normal;width:155px;}
#xj_baz17246 /*The code for the side image was written by [email protected]. This attribution must not be removed for legal purposes*/
{background:url(none); top left no-repeat; width:315px; height:308px; position:fixed; bottom:30px; left:0px }
.xg_ad { width: 800px;}
#xn_bar #xn_bar_menu_search_query,
.xg_status .input-container {
background-color: #626262 !important;
border: 1px solid #000;
color: #000;
}
.input textarea,
input.textfield:focus,
input.password:focus,
input.file:focus,
textarea:focus,
select:focus,
select.quickpost,
#xn_bar input.text {
background-color: transparent !important;
color: #000;
}
/* Start Pro Pic Border */
#xg_layout_column_1 .module_user_thumbnail .photo {
margin: 3px;
width:159px !important;
height:159px !important;
border:3px solid #000;
-moz-border-radius: 7px;
border-radius: 7px;
-moz-box-shadow: 0 0 3px 3px #000;
-webkit-box-shadow: 0 0 3px 3px #000;
box-shadow: 0 0 3px 3px #000;
}
/* End Pro Pic border */
/* Start Friend Border */
.module_members .xg_module_body li img{
height:35px !important;
width :35px !important;
}
.module_members .xg_module_body li {
display:inline;
height:35px !important;
width :35px !important;
border:3px groove #000;
padding: 3px 3px 1px 3px;
margin: 4px;
overflow: center;
-moz-border-radius: 7px;
border-radius: 7px;
-moz-box-shadow: 0 0 3px 3px #626262;
-webkit-box-shadow: 0 0 3px 3px #ffffff;
box-shadow: 0 0 3px 3px #626262;
}
/* End Friend border */
/*Start Welcome*/
.xg_widget_profiles_profile_show .xg_2col h1 {
height: 250px;
background-color: transparent !important;
background-image: url(http://i235.photobucket.com/albums/ee49/barbplaytime5/MISC/2012/blk_den/402x250.png);
background-repeat: no-repeat;
background-position: bottom center;
background-attachment: scroll;
border: 2px #000 solid;
box-shadow: inset 0 0 14px #000;
font-family: kristen itc;
color: #d0d5d6 !important;
font-weight: bold;
text-shadow: 0 2px 1px #000;
font-size: 15px;
text-align: center;
}
/*End Welcome___Generated@ SkemaholicsAnonymous.com*/
Designer Comments:
I made the layout with scraps by Flutterby and scrapsdimensions. I made the layout's backgrounds, buttons, comment box and headers with PDN/PSP. This layout was made to be used on individual Ning profiles. No other website has my permission to host this layout or the images used in the layout.
Add to favorites
i love this layout but when i view it the top bar is not grey like in the preview it’s blue. idk if that’s just me..
Thanks Diamond….I don’t know what would cause it. I used black color code w/gray shadow color code and that’s all w/the nav bar. It looks right on my lap top and my desk top too. Is it showing in the site’s default blue?
Yep, it won’t view the same in IE for some reason, webkit CSS not sure if it is supported by IE. Love the way it looks tho in FF and the blue is my favorite shade. Great background too. Which reminds me I haven’t used any of your backgrounds yet for the backgrounds section. CRS strikes again!
Thank you Angel….hate all the browser differences.