style_system | Sep. 2nd, 2016

Hi again. It's me, Syx, and I'm trying to get rid of the underline under the navigation links. I also want to know where I can fix the size and font-size of the navigation bar too.

Here is the code:

/* 
base style: blanket
layout name: window
6thirty.dreamwidth.org color: #06273A;
*/
body {
background: #06273A url('http://i.imgur.com/4FiybPa.png') repeat; background-position: left bottom; background-attachment: fixed;
font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif; font-size: 10pt; text-align: center; color: #000000;
margin: 0; padding: 0; }

a, a:link, a:visited { color: #06273A;
-webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s;
transition: 0.5s; }

a:hover, a:active { -webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-image: -webkit-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -moz-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -o-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -ms-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f); }

i {}

em {}

b {}

strong {}

code {}

q { font-style: italic; }

input, textarea { color: #000000;
background-color: #e0ddd7; border: solid 1px #9b9181;
padding: 5px; line-height: 1.8em; }

#canvas { margin: 0 auto 3em; padding: 0; text-align: justify; }

#content { margin: 0; padding: 0; }

#primary { margin: 0 auto; padding: 0; z-index: 0; }

/* contextual pop-up */
.contextualpopup { color: #0d0d0f; font-family: Helvetica, Tahoma, sans-serif;
background: #ffffff url('') no-repeat; background-position: left top; background-attachment: scroll;
margin: 0; padding: 0; }

.contextualpopup div.inner a, .contextualpopup div.inner a:link, .contextualpopup div.inner a:visited { color: #06273A; text-decoration: none;
-webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s;
transition: 0.5s; }

.contextualpopup div.inner a:active .contextualpopup a:hover { -webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-image: -webkit-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -moz-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -o-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -ms-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f); }

.contextualpopup a, .contextualpopup a:link, .contextualpopup a:visited { color: #768fa3; }

.contextualpopup a:hover, .contextualpopup a:active { color: #dbe3ee; }

.contextualpopup .userpic { margin: .5em; padding: 0; }
    
.has-userpic .entry .userpic, .has-userpic .comment .userpic { float: right; }

.has-userpic .entry .header { margin-right: 135px; }

.has-userpic .comment .header { margin-right: 135px; }

/* control strip */
#lj_controlstrip { color: #0F2427; font-family: Helvetica, Tahoma, sans-serif; text-decoration: none;
background-color: #FAFCFB; background-image: none; 
opacity: 0.5; }

#lj_controlstrip:hover { opacity: 1;-webkit-transition: opacity 1s linear; }

#lj_controlstrip td { color: #768fa3; border-bottom: 1px solid #ffffff; }

#lj_controlstrip_statustext { color: #768fa3; }

#lj_controlstrip a, #lj_controlstrip a:link, #lj_controlstrip a:visited  { color: #768fa3; }

#lj_controlstrip a:hover, #lj_controlstrip a:link:hover { color: #dbe3ee;}

#lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic { color: #947152;
border-right: 1px solid #ffffff; }

#lj_controlstrip_login td { border-bottom: 0; }https://cmv-ds-images.s3.amazonaws.com/wp-content/uploads/innerinsetshadow-1.jpg

#lj_controlstrip td td { border-bottom: 0; }

/* header, footer */
#header {
background-color: #FEFEFE; border-left: 20px solid #06273A; border-radius: 25px;
margin: 0 auto 2em; display: none; opacity: 0.5;
-webkit-filter: grayscale(100%); filter: grayscale(100%); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; }

#header:hover { opacity: 1.0;
-webkit-filter: grayscale(0); filter: grayscale(0); }

#header>.inner { padding: 4em 2em; }

@media only screen and (min-width: 40em) {
    #primary, #header, #secondary, .page-top { width: 60%; }
}

#footer { clear: both; display: block; }

.page-top { text-align: right; text-transform: uppercase;
margin: 0 auto; }

.navigation { text-align: center; text-transform: none; }

.navigation a, .navigation a:link, .navigation a:visited { text-decoration: none;
-webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s;
transition: 0.5s; }

.navigation a:hover, .navigation a:active { -webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-image: -webkit-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -moz-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -o-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -ms-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f); }

li.page-back, li.page-forward { display: inline; margin: 0 0 0 .3125em; padding: 0; }

li.page-separator { display: none; }

.navigation ul { display: inline; margin: 0; padding: 0; }

.navigation li { display: inline; }

/* header, subtitle */
#header h1#title { color: #000000;
 font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif; font-size: 1.25em; font-weight: normal; text-transform: none;
letter-spacing: 0; margin: 0; padding: 0; }

#header h2#subtitle { color: #000000; font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif; font-size: 1em; font-weight: normal; text-transform: none;
letter-spacing: 1px; margin: 0; padding: 0; }

#header h2#pagetitle { color: #1e1e1e; font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif; font-size: 1em; font-weight: normal; text-transform: none;
letter-spacing: 1px; margin: 1em 0 0; padding: 0; }

/* navigation */
.module-navlinks { color: #000000; text-decoration: none;
background-color: #FAFCFB;
bottom: 0; margin: 0 auto; padding: .75em; position: fixed; width: 100%; z-index: 100; opacity: 0.5;
-webkit-filter: grayscale(100%); filter: grayscale(100%); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; }

.module-navlinks:hover { opacity: 1.0;
-webkit-filter: grayscale(0); filter: grayscale(0); }

.module-navlinks a, .module-navlinks a:link, .module-navlinks a:visited { -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s;
transition: 0.5s; }

.module-navlinks a:hover, .module-navlinks a:active { -webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-image: -webkit-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -moz-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -o-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -ms-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f); }

.module-navlinks ul.module-list { text-transform: none; 
display: inline; letter-spacing: -0.5px; margin: 0 0 0 2em; padding: 0; }

.module-navlinks ul.module-list li { display: inline; margin: 0 1em 0 0; padding: 0 .5em 0 0; }

.module-navlinks a, .module-navlinks a:link, .module-navlinks a:visited, { color: #06273A;
-webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s;
transition: 0.5s; }

/* modules */
#secondary { color: #000000;
background-color: #FEFEFE; border-left: 20px solid #06273A; border-radius: 25px;
margin: 0 auto; padding: 0; z-index: 0; opacity: 0.5;
-webkit-filter: grayscale(100%); filter: grayscale(100%); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; }

#secondary:hover { opacity: 1.0;
-webkit-filter: grayscale(0); filter: grayscale(0); }

#secondary>.inner { padding: 1em 1em; }

#secondary .module { float: left; margin-left: 1em; }

#secondary .module-header, #secondary .module-header a { color: #000000; }

#secondary .module-header { font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif; }

#secondary .separator-after { clear: both; }

#secondary a, #secondary a:link, #secondary a:visited { color: #06273A; text-decoration: none;
-webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s;
transition: 0.5s; }

#secondary a:hover, #secondary a:active {  -webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-image: -webkit-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -moz-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -o-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -ms-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f); }

.module-tags_cloud { border-bottom: 1px solid #9b9181; border-top: 1px solid #9b9181;
float: none; margin: 3em 0; width: 100%; }

.module-tags_cloud .module-content { padding: 0 3em 1em; }

.module-tags_cloud li, .tags_cloud li { display: inline; }

#secondary .module-content { text-align: left; font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif; }

#secondary .module-content ul { list-style: outside; margin-left: 1em; padding-left: 0; }

#secondary .module-content li { margin: .5em 0; }

ul.userlite-interaction-links.icon-links { margin-left: 0; padding-left: 0; }

ul.userlite-interaction-links.icon-links li { display: inline; padding: 0 .20em; }

.module-calendar td a { display: block; padding: 2px; }

.module-credit .category-title { font-weight: bold; margin-right: .5em; }

.module-search .search-form { margin: .2em auto; }

.module-search .search-box { max-width:100%; margin: .2em; }

/* entry */
.entry a,  .entry a:link, .entry a:visited { color: #06273A; text-decoration: none; 
-webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s;
transition: 0.5s; }
    
.entry a:hover, .entry a:active { -webkit-text-fill-color: transparent;
background-image: -webkit-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -moz-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -o-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -ms-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);  }

.entry { color: #000000;
background-color: #FEFEFE; border-left: 20px solid #06273A; border-radius: 25px;
margin: 150px 0 100px 0; padding: 2em; opacity: 0.5; 
-webkit-filter: grayscale(100%); filter: grayscale(100%); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; }

.entry:hover { opacity: 1.0;
-webkit-filter: grayscale(0); filter: grayscale(0); }

.entry-content { margin: 1em 0 0; }

.header { margin: 0 0 1em; padding: 0; }

h3.entry-title {
font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif; font-size: 1.5em; color: #000000; font-weight: normal
letter-spacing: -1px; margin: 0; padding: 0; text-transform: none; }

.no-subject .entry .entry-title { background: none; }

h3.entry-title a, h3.entry-title a:link, h3.entry-title a:visited { color: #06273A; text-decoration: none; 
-webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s;
transition: 0.5s; }

h3.entry-title a:hover, .entry a:active, { -webkit-text-fill-color: transparent;
background-image: -webkit-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -moz-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -o-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -ms-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f); }

.datetime { color: #000000; font-size: .9em; font-weight: normal; text-transform: none;
letter-spacing: 1px; padding: 0; }

.datetime a, .datetime a:link, .datetime a:visited { color: #06273A; text-decoration: none; 
-webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s;
transition: 0.5s; }

.datetime a:hover, .datetime a:active { -webkit-text-fill-color: transparent;
background-image: -webkit-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -moz-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -o-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -ms-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f); }

.userpic { display: block; }

.userpic img { border-left: solid 10px #06273A; border-radius: 10px; }

.userpic img:hover { filter: contrast(0.50%) }

.poster { color: #1e1e1e; font-size: 0.9em; font-weight: normal;
letter-spacing: 0; padding: 0; text-transform: none; }

/* ensure comment content stretches out horizontally so it's readable */
.comment-content:before { content: ""; display: block; overflow: hidden; width: 10em; }

.comment-content { border-top: 1px transparent solid; } /* for firefox */

/* To prevent overlapping when icon's on the left */
/* and list is the first thing in content */
.entry-content li, .comment-content li { list-style-position: inside; }

/* To constrain the width and prevent layout breaking */
.entry-content img, .comment-content img { max-width: 100%; height: auto; }

@media only screen and (min-width: 64em) { .entry-content img, .comment-content img { max-width: none; }

.metadata { margin: 2em 0 0; }

.metadata.top-metadata { margin: 1em 0 2em; }

.metadata ul { list-style: none; margin: 0; padding: 0; }

.metadata ul li { color: #1e1e1e; font-size: .9em; font-weight: normal;
letter-spacing: 0; padding: 0; text-transform: none; }

.metadata-label-location, .metadata-label-mood, .metadata-label-music { display: none; }

.metadata-item-location, .metadata-item-mood, .metadata-item-music { padding: 0 0 0 1.3em; }

.tag-text { display: none; }

.tag ul { display: inline; margin: 0; padding: 0 0 0 1.3em; }

.tag ul li { color: #1e1e1e; font-size: .9em; font-weight: normal; text-transform: none;
display: inline; letter-spacing: 0; padding: 0; }

ul.entry-management-links { margin: 2em 0 0; padding: 0; }

ul.entry-management-links li { olor: #1e1e1e; display: inline; font-size: .9em; font-weight: normal;
letter-spacing: 0; padding: 0 5px 0 0; text-transform: none; }

ul.entry-interaction-links { text-align: center;
border-bottom: 1px solid #9b9181;
margin: 1em 0 0; padding: 0 0 .5em; }

ul.entry-interaction-links li { color: #1e1e1e; font-size: .9em; font-weight: normal; text-transform: uppercase;
display: inline; letter-spacing: 0; padding: 0 5px 0 0; }

/* comments */
.comment-wrapper { margin: 2em 0; padding: 0; min-width: 15em; }

.comment { color: #000000;
background-color: #e0ddd7; border-left: 20px solid #9b9181;
margin: 0 auto 2em; padding: 40px 20px; }

.comment a, .comment a:link, .comment a:visited { color: #06273A;
-webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s;
transition: 0.5s; }

.comment a:hover, .comment a:active { -webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-image: -webkit-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -moz-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -o-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -ms-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f); }

.comment .admin-poster { color: #000000;
background-color: #e0ddd7; }

.comment-title { font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif; 
margin: 0; }

.no-subject .comment .comment-title { background: none; }

.comment-posted { font-weight:bold; }

hr.above-entry-interaction-links, hr.below-reply-container { display: none; }

textarea.textbox { width: 100% !important; }

.bottomcomment, .comments-message { color: #000000;
background-color: #e0ddd7; border-left: 20px solid #9b9181;
margin: 0 auto 2em;
padding: 4em 2em; }

.comment-management-links ul, .comment-interaction-links ul { margin: 0; padding: 0; }

.comment-management-links li, .comment-interaction-links li { display: inline; }

#qrform table { border: 0 !important; }

/* archive */
li.active { color: #8e048c; text-transform: none; text-align: center;
display: inline; margin: 0; padding: 0; }

.month { color: #000000;
background-color: #e0ddd7; border-left: 20px solid #9b9181;
margin: 0 auto 2em; padding: 4em 2em; }

.month h3 { color: #000000; font-size: 1em; font-weight: normal; text-align: right; text-transform: lowercase;
letter-spacing: 1px; margin: 0; padding: 0; }

.month th { color: #0d0c0b; text-transform: none; font-size: .9em;  font-weight: normal; text-align: center;
background-color: #9b9181;
padding: 5px; }

.month table { border: 0;
margin: auto; width: 100%; }

.month caption { display: none; }

td.day { border: .1em solid #9b9181;
padding: .5em; }

/* tags */
.page-tags .tags-container { color: #000000;
background-color: #e0ddd7; border-left: 20px solid #9b9181;
margin: 0 auto 2em; padding: 4em 2em; }

.page-tags .tags-container h2 { color: #000000; text-align: right; text-transform: none;
font-size: 1em; font-weight: normal;
letter-spacing: 1px; margin: 0; padding: 0; }

.page-tags .tags-container ul { list-style: none; margin: 1em; padding: 0; }

.page-tags .tags-container ul li { margin: 0 0 0 1em; padding: 0; }

/* icons*/
.icons-container { color: #000000;
background-color: #e0ddd7; border-left: 20px solid #9b9181;
margin: 0 auto 2em; padding: 4em 2em; }

.icons-container a, .icons-container a:link, .icons-container a:visited, { color: #06273A;
-webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s;
transition: 0.5s; }

.icons-container a:hover, .icons-container a:active { -webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-image: -webkit-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -moz-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -o-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f);
background-image: -ms-linear-gradient(left, #f69, #fc0, #3c3, #09f, #96f); }

.icons-container h2 { color: #000000; font-size: 1em; font-weight: normal; text-transform: none; text-align: right;
letter-spacing: 1px; margin: 0; padding: 0; }

.sorting-options ul { padding-left: 0; text-align: right; }

.sorting-options ul li { display: inline; }

.icons-container .icon { margin: 1em 0; }

.icon-image { float: left; clear: left; margin-bottom: .25em; min-width: 100px; padding-right: 1em; }

.icon-info { min-height: 100px; }

.icon-info span { font-weight: bold; }

.icon-info .default { text-decoration: none; }

.icon-keywords ul { display: inline; margin: 0; padding: 0; }

.icon-keywords ul li { display: inline; padding: 0; }

.userpic { float: left; margin: 0 10px 10px 0; }

Could you please help me figure it out? There may be an excessive amount of code when dealing with navigation bar and navi-links section.

Dreamwidth style system discussion

Sep. 2nd, 2016

Sep. 2nd, 2016

How to get rid of the underline of navigation links, as well as the size of the bar and font

Profile

July 2025

Links

Most Popular Tags

Page Summary

Style Credit

Expand Cut Tags