Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Alignment of Menu Items

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #29600
    SDG
    Member

    Hello

    I am having difficulty styling this menu.

    With longer menu items, when it wraps to the second line, the text is not lining up correctly. It is sitting to the left of the first line by two letters.

    How can I rectify this?

    Kind regards
    Danielle

    HTML of Menu

    CSS

    Code:
    /* CSS Document */
    /*————————————–body—*/
    body, input {
    color:#808080;
    font:normal 12px/14px Arial, Helvetica, sans-serif;
    }
    label {
    color:#808080;
    font:normal 12px/14px Arial, Helvetica, sans-serif;
    font-weight: bold;
    }
    input, select {
    color:#000;
    margin-top:0px;
    font-size:11px;
    }
    a, a:visited, a:hover {
    color:#000;
    }
    a {text-decoration:underline;}
    a:hover {text-decoration:none}
    fieldset {padding:5px;}

    fieldset td {padding:2px 0 2px 0;}
    /*———————————————————-content—*/
    /*—————————–article_settings-*/
    h6 {font:bold 12px Arial, Helvetica, sans-serif;}

    .article-decor {
    padding:0px 0px 12px 0px;
    }
    #contact_text {
    height:auto;
    overflow:auto;
    margin:0px 0px 5px 0px;
    width:90%
    }
    .article_separator {
    display:block;
    line-height:1px;
    padding:0px 0px 15px 0px;
    margin:15px 0px 0px 0px;
    height:1px;
    font-size:1px;
    }
    .column_separator {
    padding:0px 0px 0px 12px !important;
    }
    .article_column {
    padding:0px 0px 0px 0px;
    }
    .contentpane {
    padding:0px 0px 10px 0px;
    }
    .contentpaneopen h3 {
    overflow:hidden;
    }
    .contentpaneopen h3 img {
    margin:0px 3px 0px 0px !important;
    float:left
    }
    .contentpaneopen ul, .article-indent ul {
    list-style:none;
    margin:0px 0px 0px 15px;
    }
    .contentpaneopen ul li, .article-indent ul li {
    padding:0px 0px 6px 10px;
    background:url(../images/listMarker.gif) no-repeat 0 8px;
    }
    .contentdescription img {
    margin:0px 20px 0px 0px;
    }
    .contentpaneopen img{
    margin:0px 15px 0px 0px;
    }
    /*—————————content-heading—*/

    .contentheading, .componentheading {
    padding:5px 0px 8px 0px;
    color:#808080;
    font:bold 15px/15px Arial, Helvetica, sans-serif;
    text-transform:uppercase;
    font-style:italic;
    }
    td.contentheading {
    font:bold 15px/15px Arial, Helvetica, sans-serif;
    font-style:italic;
    }
    .componentheading {
    margin:0px 0px 20px 0px;
    }
    .contentpane .componentheading {
    background:none;
    }
    .contentpaneopen p {
    padding:0px 0px 10px 0px;
    }
    .buttonheading {
    padding:5px 5px 6px 0px;
    }
    .buttonheading img {
    padding:0;
    margin:0 4px;
    }
    span.contentheading {
    font-weight:normal;
    display:block;
    padding:15px 0px 15px 0px;
    margin:0px 0px 15px 0px;
    }
    /*—————————–item-info—*/

    .iteminfo {
    padding:0px 0px 6px 0px;
    margin:0px 0px 15px 0px;
    }
    .modifydate {
    font-size:11px;
    padding:10px 0px 10px 0px;
    text-decoration:none !important;
    }
    .createdby {
    display:block;
    text-transform:none;
    }
    .createdate {
    line-height:11px;
    font-size:11px;
    margin:0px 0px 0px 0px;
    padding:0px 0px 15px 0px;
    display:block;
    }
    div.small { /* Written by */
    display:block;
    font-size:11px;
    font-weight:normal;
    margin:0px 0px 0px 0px;
    padding:0px 0px 7px 0px;
    white-space:nowrap;
    line-height:11px;
    }

    /*———————————–buttons—*/

    .button,
    .validate,
    .modal-button,
    .readmore a,
    div.blank a {
    background:#F47B20;
    border:none;
    color:#fff;
    font:bold 15px/15px Arial, Helvetica, sans-serif;
    padding:0px 0px 1px 0px;
    margin:0px 0px 0px 0px;
    text-decoration:none;
    width:86px;
    height:20px;
    display:block;
    vertical-align:top;
    text-transform:uppercase;
    text-align:center;
    font-style:italic;
    cursor:pointer;
    }
    *+html .button,
    *+html .validate {
    display:block;
    }
    .button2-left {width:95px; float:left; margin-right:5px;}
    .button2-left, .image {display:inline}
    .button2-left a:hover,
    .readmore a:hover,
    div.blank a:hover {
    color:#fff;
    background:#666;
    padding:2px 0 1px 0;
    margin:0;
    }
    .modal-button, .readmore a, div.blank a {
    color:#fff;
    float:left;
    padding:2px 0px 1px 0;
    margin:0px 1px 0px 0px;
    font:normal 10px/12px Arial, Helvetica, sans-serif;
    height:auto;
    background:#000;
    text-align:center;
    }
    #editor-xtd-buttons {padding:5px 0px 5px 0px; overflow:hidden; width:300px; float:left}
    #editor-xtd-buttons .readmore {display:inline}
    .blank {margin:5px 0px 0px 0px;}
    *+html .blank {margin:10px 0 0 0;}
    div.blank a {
    width:114px;
    background:#000;
    }

    /*———————————–read-more—*/

    div.readmore {
    overflow:hidden;
    margin:0px 0px 0px 0px;
    padding:0px 0px 0px 0px;
    }
    div a.readon {
    background:#F47B20;
    border:none;
    color:#fff;
    display:inline-block;
    font:bold 15px/15px Arial, Helvetica, sans-serif;
    width:130px;
    padding:2px 0px 3px 0px;
    text-align:center;
    text-decoration:none;
    text-transform:uppercase;
    font-style:italic;
    }
    a.readon:hover {
    text-decoration:none;
    background:#000;
    }
    a.readon:visited {
    color:#fff;
    }

    /*—————————–blog-more—*/

    .blog_more {
    padding:0px 0px 10px 0px;
    }
    .blog_more h2 {
    font-size:12px;
    padding:0px 0px 0px 0px;
    }
    .blog_more ul {
    margin:10px 0px 0px 15px;
    }
    .blog_more ul li {
    padding:0px 0px 0px 0px !important;
    }
    .blog_more a {
    text-decoration:underline
    }
    .blog_more a:hover {
    text-decoration:none;
    }

    /*—————————–pagenav—*/

    .pagenav {
    font-size:12px;
    font-weight:normal
    }
    a.pagenav {
    font-weight:normal;
    padding:0px 2px 0px 2px;
    margin:0px 2px 0px 0px;
    text-decoration:none
    }
    a.pagenav:hover {
    text-decoration:underline
    }
    a.pagenav:visited {
    text-decoration:none
    }
    .pagination_nav {
    font-size:12px;
    padding:10px 20px 0px 27px;
    }
    .pagination_nav div {
    padding:5px 0px 5px 0px;
    }

    .pagination {
    margin-top:10px
    }
    .pagination li {
    padding:0px 5px 0px 5px;
    }
    .pagination_result {
    padding:5px 0px 0px 0px;
    line-height:16px;
    }
    .pagination span {padding:0px 10px 0px 0px;}
    .pagination strong span {padding:0px 6px 0px 6px; font-weight:normal}

    /*————————————–result—*/
    .searchArea {
    border:1px solid #303030;
    padding:10px;
    }
    .sectiontableentry0 td {
    }
    .sectiontableentry1 td, .sectiontableentry0 td, .sectiontableentry2 td {
    border-bottom:1px dotted #ccc;
    padding-bottom:7px;
    padding-top:7px;
    padding-right:5px;
    }
    .var1 {
    background:#f9f9f9;
    padding:5px !important;
    margin:5px 0px 5px 0px;
    }
    .var2 {
    background:#f0f0f0;
    padding:5px !important;
    margin:5px 0px 5px 0px;
    }
    .results {
    padding:0px 20px 15px 20px;
    }
    .results ol li {
    padding:0px 0px 10px 0px;
    text-align:justify;
    }
    .searchintro {
    padding:10px 0px 10px 20px;
    }
    .searchintro b, .searchintro strong {
    color:#be0404
    }
    .sectiontableheader {
    padding:6px 0px 6px 0px;
    background:#ccc;
    color:#000;
    }
    .sectiontableheader a, .sectiontableheader a:visited{
    color:#000;
    }
    .sectiontableheader strong {
    color:#666;
    }
    /*————————————–archive—*/
    .archiveBlock .button {
    display:inline-block;
    margin:0px 0px 0px 5px;
    }
    ul#archive-list h4 a {
    font-size:12px;
    text-transform:none
    }
    /*————————————–poll—*/
    dl.poll {
    padding:10px 0px 20px;
    }
    #poll h3 {
    font-size:120%;
    padding:0px 0px 10px 0px;
    }
    dl.poll dt {
    font-weight:bold;
    padding:7px 0px 0px 0px;
    }
    .poll .question {
    color:#dfded0;
    font-size:13px;
    font-weight:bold;
    padding:0px 10px 10px 0px;
    }
    .poll .poll-body {
    padding:0px 0px 0px 0px;
    }
    .poll-body label {
    font:normal 12px/20px Arial, Helvetica, sans-serif;
    color:#dfded0;
    padding:0px 0px 0px 0px;
    }
    .poll .buttons {
    padding:8px 0px 6px 0px;
    }
    .poll .button {
    background:#F47B20;
    border:none;
    color:#fff;
    font:bold 13px/15px Arial, Helvetica, sans-serif;
    cursor:pointer;
    display:inline;
    margin:0px 0px 0px 0px;
    padding:0px 0px 2px 0px;
    width:70px;
    height:21px;
    text-align:center;
    text-transform:uppercase;
    font-style:italic;
    }
    *+html .poll .button {
    padding:0;
    }
    .poll .section {
    overflow:hidden;
    padding:6px 0px 0px 0px;
    width:100%;
    color:#000;
    }
    .poll .section2 {
    overflow:hidden;
    padding:6px 0px 0px 0px;
    width:100%;
    }
    .poll .section2 label {
    }
    .poll .radio {
    float:left;
    width:20px;
    }
    .poll .radio input {
    display:block;
    width:16px;
    height:16px;
    vertical-align:middle;
    }
    .poll .var {
    margin:0px 0px 0px 20px;
    text-align:left
    }
    .display {
    padding:0px 0px 10px 0px;
    }
    .display select {
    border:1px solid #46462f;
    width:100px;
    }
    .sectiontableentry1 div,
    .sectiontableentry0 div {
    font-size:1px
    }
    .td_1, .td_2 {
    width:5%;
    text-align:center;
    }
    .td_3 {
    width:90%;
    padding:0px 0px 0px 10px;
    }
    #itema, #itemb, #itemc {
    background:#aaa;
    padding-bottom:5px;
    padding-top:5px;
    font-weight:bold;
    color:#000;
    }
    .pollstableborder .question {
    padding:0px 0px 0px 85px;
    }
    /*————————————–userforms—*/

    dl.contentpane dt {
    padding:10px 0px 20px 0px;
    }
    dl.contentpane dd {
    width:100%;
    overflow:hidden;
    }
    dl.contentpane div {
    vertical-align:middle
    }
    dl.contentpane .description {
    width:110px;
    padding:0px 0px 0px 0px;
    vertical-align:middle
    }
    dl.contentpane .input-field {
    width:160px;
    padding:0px 0px 0px 0px;
    vertical-align:middle
    }
    dl.contentpane .button-field {
    width:140px;
    padding:2px 0px 0px 0px;
    vertical-align:middle
    }

    /*————————————-search—*/

    .search .button {
    background:url(../images/searchButton.gif) no-repeat 0 0;
    border:none;
    float:right;
    width:60px;
    height:21px;
    font:normal 11px/12px Arial, Helvetica, sans-serif;
    margin:0px 0px 0px 0px;
    padding:0 0 2px 0;
    color:#fff;
    text-align:center;
    text-transform:uppercase;
    }
    *+html .search .button {
    padding:0;
    }
    .search .inputbox {
    background:#010101 url(../images/search-bg.gif) right top no-repeat;
    border:1px solid #1b1b1e;
    color:#696969;
    font:normal 11px/14px Arial, Helvetica, sans-serif;
    height:auto;
    padding:1px 0px 3px 4px;
    margin:0px 0px 0px 0px;
    vertical-align:top;
    width:180px;
    float:left;
    }
    .module-search .boxIndent {
    padding:7px 14px 8px 15px;
    }
    /* ———————————— manufacturers —————- */

    #manufacturers h3 {
    float:left;
    padding:2px 5px 0 0;
    font:bold 11px/14px Tahoma, Geneva, sans-serif;
    text-transform:uppercase;
    color:#ff4d00;
    }
    #manufacturers a {
    display:block;
    float:left;
    font:bold 11px/14px Tahoma, Geneva, sans-serif;
    text-transform:uppercase;
    color:#ff4d00;
    text-decoration:none;
    }
    #manufacturers br {
    display:none;
    }

    #manufacturers .inputbox {
    background:#000;
    border:none;
    border-right:1px solid #403938;
    border-bottom:1px solid #403938;
    color:#fff;
    font:normal 11px/14px Arial, Helvetica, sans-serif;
    height:auto;
    margin:0px 0px 0px 0px;
    vertical-align:top;
    width:162px;
    float:left;
    }
    /*————————————-search-result—*/
    .search_result {
    padding:0px 20px 0px 0px;
    }
    .search_result h3 {
    color:#808080;
    font-size:14px;
    }
    .highlight { /* highlight sought word */
    color:#be0404;
    font-weight:bold
    }
    /*————————————-admin-form—*/

    .adminform td {padding:0px 0px 2px 0px;}

    /*—————————system-error-messages–*/

    .error {
    margin:0px 0px 10px 0px;
    }
    #system-message dt.error, dt.message {
    display: none;
    }
    .error dd ul {
    background: #ce0303 ;
    border-top: 3px solid #670606;
    border-bottom: 3px solid #670606;
    color: #fff;
    margin:0;
    padding:5px 0px 5px 5px;
    }
    .error dd ul li {
    background:none !important;
    color:#fff !important;
    margin:0px 0px 0px 20px !important;
    }

    /*———————————————————————————boxes—*/
    .module, .module_text {
    margin:0px 0px 0px 0px;
    background:#1b1b1d;
    }
    .module .boxIndent, .module_text .boxIndent {
    padding:25px 18px 39px 28px;
    }
    .module .module-bg, .module_text .module-bg {
    background:#49403d;
    padding:10px 0 0 0;
    }
    #header .moduletable h3 {
    text-transform:none !important;
    background:none !important;
    margin:0 !important;
    }
    /*——————-title—-*/

    .module h3, .module-search h3, .module_text h3, .module-categories h3 {
    background:#F47B20;
    font-weight:bold;
    font-size:15px;
    line-height:15px;
    color:#fff;
    margin:0px;
    padding:11px 0px 11px 11px;
    text-transform:uppercase;
    font-style:italic;
    }
    .moduletable h3, .title, .categoryName, #vmMainPage h3, .categoryName {
    font:bold 15px/15px Arial, Helvetica, sans-serif;
    color:#808080;
    margin:0px 10px 20px 0px;
    padding:13px 18px 6px 24px;
    position:relative;
    font-style:italic;
    text-transform:uppercase;
    }
    .categoryName {
    background:none !important;
    }
    .extra-divider td {
    border:none;
    background:url(../images/extra-divider.gif) repeat-x left center;
    padding:13px 0;
    }

    .module-new .width {
    overflow:hidden;
    width:100%;
    }

    /*———————- categories ———-*/
    .module-categories {
    margin:0px 0px 0px 0px;
    }
    .module-categories .boxIndent {
    padding:0px 0 30px 0;
    }
    .module-categories .module-bg {
    background:#ff4d00;
    padding:10px 0 0 0;
    }
    .module-categories .bottom-bg {
    background:url(../images/categories-bg.gif) bottom left no-repeat;
    height:56px;
    }
    .module-categories h3 {
    background:#F47B20;
    font-weight:bold;
    font-size:15px;
    line-height:15px;
    color:#fff;
    margin:0px;
    padding:10px 0px 10px 11px;
    text-transform:uppercase;
    font-style:italic;
    }
    /*——————-content—-*/

    .module ul {
    list-style:none;
    margin:0px 0px 0px 0px;
    }
    .module ul li {
    padding:3px 0px 4px 0px;
    margin:0px 0px 0px 0px;
    line-height:16px;
    font-size:12px;
    color:#dfded0;
    background:url(../images/module-menu-divider.gif) repeat-x left bottom;
    }
    .module li a, .module li a:visited {
    background:url(../images/listMarker.gif) no-repeat 0 6px;
    font:normal 12px/14px Arial, Helvetica, sans-serif;
    color:#7d7d7d;
    padding:0px 0px 0px 12px;
    margin:0px 0px 0px 0px;
    text-decoration:none;
    }
    .module li a:hover {
    color:#afafaf;
    text-decoration:none !important;
    }
    .module a {
    color:#dfded0;
    text-decoration:underline;
    }
    .module a:hover {
    text-decoration:none !important;
    }
    .count { /* count users */
    text-decoration:underline;
    }

    /*————————————-mainmenu—*/

    .module_menu {
    margin:0px 0px 0px 0px;
    background:#1b1b1d;
    }
    .module_menu .boxIndent {
    padding:0;
    }
    .module_menu .module-bg {
    background:#49403d;
    padding:10px 0 0 0;
    }
    .module_menu .bottom-bg {
    background:url(../images/module-bg.gif) top left no-repeat;
    height:45px;
    }

    /*——————-title—-*/

    .module_menu h3 {
    background:url(../images/title-tail.gif) repeat-x left top;
    font:bold 15px/15px Arial, Helvetica, sans-serif;
    color:#fff;
    margin:0px;
    padding:11px 0px 11px 11px;
    text-transform:uppercase;
    font-style:italic;
    }

    /*—————–content—-*/

    .module_menu div {
    color:#fff;
    font-size:12px;
    }
    .module_menu ul, .module-categories ul {
    list-style:none;
    margin:0px 0px 0px 0px;
    }
    .module_menu li, .module-categories li {
    padding:0px 0px 0px 0px;
    margin:0px 0px 0px 0px;
    line-height:16px;
    font-size:12px;
    color:#cfcfcf;
    }
    .module_menu li a, .module-categories li a, .module_menu li a:visited, .module-categories li a:visited, a.mainlevel, .module-categories a.mainlevel, a.mainlevel:visited, a.sublevel, .module-categories a.sublevel, a.sublevel:visited {
    font:normal 12px/14px Arial, Helvetica, sans-serif;
    color:#fff;
    padding:7px 0px 7px 29px;
    margin:0px 0px 0px 0px;
    display:block;
    background:#141416;
    border-bottom:1px solid #1b1b1d;
    text-decoration:none;
    }
    /*——————-hover—-*/

    .module_menu li a:hover, a.mainlevel:hover, a.sublevel:hover {
    background:url(../images/menu-marker.gif) no-repeat 14px 11px #F47B20;
    color:#fff;
    text-decoration:none;
    }

    /*——————active—-*/

    .module_menu li.active a, #active_menu {
    color:#aaa;
    }

    /* ————–vm categories */

    a.sublevel, a.sublevel:visited {

    text-decoration:none;
    display:block;
    }
    .module-categories a:hover {
    color:#fff !important;
    }
    .module-categories #active_menu {
    color:#F47B20 !important;
    }
    /*————————————-topmenu—*/

    ul.menu-nav {
    background:#F47B20;
    padding:0px;
    margin:0;
    list-style:none;
    width:100%;
    overflow:hidden;
    }
    ul.menu-nav li, ul.menu-nav li.active {
    float:left;
    border:none;
    width:145px;
    padding:0px 0px 0px 0px;
    border-right:1px solid #000;
    }
    ul.menu-nav li a, ul.menu-nav li a:visited {
    color:#ffffff;
    display:block;
    font:bold 15px/15px Arial, Helvetica, sans-serif;
    text-decoration:none;
    text-transform:uppercase;
    font-style:italic;
    padding:22px 0 21px 0;
    text-align:center;
    }
    /*——————-hover—-*/

    ul.menu-nav li a:hover {
    background:#ffffff;
    color:#000000;
    }

    /*——————-active—-*/

    ul.menu-nav li.active a {
    background:#F47B20;
    color:#000000;
    }

    /*————————userMenu—*/

    #userMenu {
    padding:10px 0 0 0;
    float:left;
    }

    #userMenu ul li {
    display:inline;
    border-right:1px solid #99a3a7;
    padding:0 9px 0 0;
    margin:0 9px 0 0;
    font:normal 11px/11px Arial, Helvetica, sans-serif;
    }
    #userMenu ul li a {
    text-decoration:none;
    }

    /*—————————————-login-form—*/

    .module-login {
    margin:0px 0px 5px 0px;
    position:relative;
    }
    .module-login .space {
    padding:22px 7px 10px 31px;
    }
    .module-login .boxIndent {
    padding:20px 24px 19px 25px;
    }
    .module-login h3 {
    margin:0px 0px 0px 0px;
    padding:11px 10px 13px 36px;
    color:#fff;
    font:bold 11px/15px Tahoma, Geneva, sans-serif;
    text-transform:uppercase;
    background:#be0404 url(../images/title-marker2.gif) no-repeat 26px 17px;
    }
    #form-login-username {
    display:block;
    width:100%;
    }

    /*—————–content—-*/
    #form-login-remember {
    padding:3px 0px 0px 0px;
    }
    .module-login label {
    color:#666;
    font:normal 12px/12px Tahoma, Geneva, sans-serif;
    }
    label.remember {
    color:#fff;
    font:normal 11px/12px Tahoma, Geneva, sans-serif;
    display:inline;
    font-weight:normal;
    }
    #mod_login_username, #mod_login_password {
    background:#fff;
    width:130px;
    border:none;
    padding:3px 0px 4px 7px;
    font:normal 11px/11px Tahoma, Geneva, sans-serif;
    color:#939194;
    margin:0px 0px 5px 0px;
    }
    .module-login a {
    color:#fff;
    font:normal 12px/18px Tahoma, Geneva, sans-serif;
    }
    .form-login .button { /* button */
    background:#F47B20;
    border:none;
    color:#fff;
    font:bold 15px/15px Arial, Helvetica, sans-serif;
    padding:0 0 2px 0;
    margin:0px;
    width:137px;
    height:20px;
    text-align:center;
    font-style:italic;
    display:block;
    }
    *+html .form-login .button {
    padding:0px;
    }
    .form-login .rememberCheck {
    padding:12px 0 0 0;
    }
    input.checkbox { /* checkbox */
    border:none;
    display:block;
    float:left;
    margin:0px 5px 0px 0px;
    vertical-align:middle;
    width:12px;
    height:12px
    }
    #inputs {
    padding:5px 0px 15px 0px;
    width:100%;
    overflow:hidden;
    }
    #form-login-remember {
    font:normal 11px/12px Arial, Helvetica, sans-serif;
    color:#7b7b7b;
    }
    #form-login-remember a {
    color:#7b7b7b;
    }
    #form-login-remember a:hover {
    text-decoration:none !important;
    }
    /*———————————————————structure—*/

    #body {
    background:#000 url(../images/body-bg.jpg) top center no-repeat;
    }

    .main {
    width:877px;
    }
    .mainBg {
    background:url(../images/bgTop.png) no-repeat 0 0px;
    }
    .mainIndent {
    padding:0px 0px 0px 0px;
    }

    /*————————————-header—*/

    #header .float-right {
    width:556px;
    }
    .logo-bg {
    background:url(../images/logo-bg.gif) no-repeat 10px 0;
    }
    #logo {
    width:480px;
    float:left;
    padding:30px 0 30px 0px;
    }
    .currency {
    padding:0px 0px 0px 28px;
    width:210px;
    overflow:hidden;
    margin:0;
    float:right;
    }
    .cart {
    padding:9px 15px 0 0px;
    width:235px;
    margin:0px;
    float:right;
    background:transparent url(../images/cart.png) no-repeat scroll 0 5px;
    }
    #search {
    float:left;
    padding:8px 0px 7px 7px;
    }
    .banner {
    margin:0 -24px 14px -24px;
    background:url(../images/banner-bg.png) no-repeat top left;
    padding:55px 571px 70px 100px;
    height:313px;
    color:#7e7d7d;
    font:normal 12px/14px Arial, Helvetica, sans-serif;
    position:relative;
    }
    .banner p {
    padding-top:14px;
    }
    .banner .button {color:#fff;
    background:none;
    margin:10px 0 0 0;
    width:145px;
    }
    .banner-title {margin-bottom:17px;}
    .bannergroup_text a {
    color:#ccc;
    }
    .bannergroup {width:100%; overflow:hidden;}
    .banneritem {
    float:left;
    overflow:hidden;
    margin:0 10px 0 0;
    }
    .search-bg {
    background:url(../images/search-bg.png) repeat;
    }
    /*————————————-content—*/
    #left {
    float:left;
    width:194px;
    }
    .container {
    overflow:hidden;
    }

    .whiteBg {
    background:#fff;
    margin-bottom:10px;
    padding:15px;
    position:relative;

    }
    .right-corner {
    background:url(../images/corner-right.gif) right top no-repeat;
    padding-right:480px;
    }
    .right-corner .corner-tail {
    background:#49403d;
    height:40px;
    }
    /*————————————-footer—*/

    #footer {
    padding:0 0 35px 0;
    }
    #footer .space {
    background:#131415;
    padding:13px 0px 17px 26px;
    }
    #footer .clear div {
    font:normal 11px/14px Tahoma, Geneva, sans-serif;
    color:#7b7b7b;
    float:left;
    }
    #footer a {
    color:#7b7b7b;
    font:normal 11px/14px Tahoma, Geneva, sans-serif;
    }

    #footer ul {
    padding:0px 0px 6px 0px;
    margin:0px 0px 0px 0px;
    display:block;
    height:auto;
    background:none;
    }
    #footer ul.menu-nav li, #footer ul.menu-nav li.active{
    background:none;
    border:none;
    padding:0;
    margin:0 22px 0 0;
    width:auto;
    }
    #footer ul.menu-nav li a {
    text-decoration:none !important;
    color:#fff;
    padding:0px 0px 0px 0px;
    font:normal 11px/14px Tahoma, Geneva, sans-serif;
    text-transform:none;
    width:auto;
    }
    #footer ul.menu-nav li a:hover, #footer ul.menu-nav li a, #footer ul.menu-nav li a:hover span {
    color:#fff;
    background:none;
    text-decoration:underline;
    }
    #footer ul.menu-nav li.active a span {
    color:#fff;
    text-decoration:underline;
    }
    /*——————————————————–VM—*/

    .clear {overflow:hidden; width:100%; position:relative;}
    .float-left {float:left;}
    .float-right {float:right;}
    .contact_email input {margin-bottom:10px;}
    .contact_email #contact_email_copy {margin:0; vertical-align:middle;}

    .lists {border-top:1px dotted #ccc; padding:10px 0 7px 10px;}
    .list-column {float:left; width:215px;}
    .lists ul {list-style:none; margin:0;}
    .lists li {line-height:16px; background:url(../images/listMarker.gif) no-repeat 0 8px; padding-left:10px;}
    .lists li a {color:#787a81;}

    .indent {padding:0 0 20px 0;}
    /* Tooltips */
    .tool-tip {
    float: left;
    background: #ffc;
    border: 1px solid #D4D5AA;
    padding: 5px;
    max-width: 200px;
    text-align:left;
    }

    .tool-title {
    padding: 0;
    margin: 0;
    font-size: 100%;
    font-weight: bold;
    margin-top: -15px;
    padding-top: 15px;
    padding-bottom: 5px;
    color:#000;
    }

    .tool-text {
    font-size: 100%;
    margin: 0;
    color:#000;
    }

    ul.menu-nav li.item30 {
    border:none;}

    #footer ul.menu-nav li a:hover, #footer ul.menu-nav li a:hover span {

    background:transparent none repeat scroll 0 0;
    color:#F47B20;
    text-decoration:underline;
    }

    #wr {
    background:transparent url(../images/joker_logo.png) no-repeat scroll right 30px;
    }

    .desc .button {
    background:transparent none repeat scroll 0 0;
    color:#000000;
    cursor:pointer;
    display:inline;
    font-family:Arial,Helvetica,sans-serif;
    font-size:12px;
    font-size-adjust:none;
    font-stretch:normal;
    font-style:normal;
    font-variant:normal;
    font-weight:normal;
    height:20px;
    margin:0;
    padding:0 0 1px;
    text-align:center;
    text-decoration:underline;
    text-transform:none;
    vertical-align:top;
    width:auto;
    }

    .desc .button:hover {

    color:#F47B20;

    }

    #79631

    Please use this coding which i have edited from your codings

    Code:
    body, input {
    color:#808080;
    font:normal 12px/14px Arial, Helvetica, sans-serif;
    }
    label {
    color:#808080;
    font:normal 12px/14px Arial, Helvetica, sans-serif;
    font-weight: bold;
    }
    input, select {
    color:#000;
    margin-top:0px;
    font-size:11px;
    }
    a, a:visited, a:hover {
    color:#000;
    }
    a {text-decoration:underline;}
    a:hover {text-decoration:none}
    fieldset {padding:5px;}

    fieldset td {padding:2px 0 2px 0;}
    /*———————————————————-content—*/
    /*—————————–article_settings-*/
    h6 {font:bold 12px Arial, Helvetica, sans-serif;}

    .article-decor {
    padding:0px 0px 12px 0px;
    }
    #contact_text {
    height:auto;
    overflow:auto;
    margin:0px 0px 5px 0px;
    width:90%
    }
    .article_separator {

    line-height:1px;
    padding:0px 0px 15px 0px;
    margin:15px 0px 0px 0px;
    height:1px;
    font-size:1px;
    }
    .column_separator {
    padding:0px 0px 0px 12px !important;
    }
    .article_column {
    padding:0px 0px 0px 0px;
    }
    .contentpane {
    padding:0px 0px 10px 0px;
    }
    .contentpaneopen h3 {
    overflow:hidden;
    }
    .contentpaneopen h3 img {
    margin:0px 3px 0px 0px !important;
    float:left
    }
    .contentpaneopen ul, .article-indent ul {
    list-style:none;
    margin:0px 0px 0px 15px;
    }
    .contentpaneopen ul li, .article-indent ul li {
    padding:0px 0px 6px 10px;
    background:url(../images/listMarker.gif) no-repeat 0 8px;
    }
    .contentdescription img {
    margin:0px 20px 0px 0px;
    }
    .contentpaneopen img{
    margin:0px 15px 0px 0px;
    }
    /*—————————content-heading—*/

    .contentheading, .componentheading {
    padding:5px 0px 8px 0px;
    color:#808080;
    font:bold 15px/15px Arial, Helvetica, sans-serif;
    text-transform:uppercase;
    font-style:italic;
    }
    td.contentheading {
    font:bold 15px/15px Arial, Helvetica, sans-serif;
    font-style:italic;
    }
    .componentheading {
    margin:0px 0px 20px 0px;
    }
    .contentpane .componentheading {
    background:none;
    }
    .contentpaneopen p {
    padding:0px 0px 10px 0px;
    }
    .buttonheading {
    padding:5px 5px 6px 0px;
    }
    .buttonheading img {
    padding:0;
    margin:0 4px;
    }
    span.contentheading {
    font-weight:normal;

    padding:15px 0px 15px 0px;
    margin:0px 0px 15px 0px;
    }
    /*—————————–item-info—*/

    .iteminfo {
    padding:0px 0px 6px 0px;
    margin:0px 0px 15px 0px;
    }
    .modifydate {
    font-size:11px;
    padding:10px 0px 10px 0px;
    text-decoration:none !important;
    }
    .createdby {

    text-transform:none;
    }
    .createdate {
    line-height:11px;
    font-size:11px;
    margin:0px 0px 0px 0px;
    padding:0px 0px 15px 0px;

    }
    div.small { /* Written by */

    font-size:11px;
    font-weight:normal;
    margin:0px 0px 0px 0px;
    padding:0px 0px 7px 0px;
    white-space:nowrap;
    line-height:11px;
    }

    /*———————————–buttons—*/

    .button,
    .validate,
    .modal-button,
    .readmore a,
    div.blank a {
    background:#F47B20;
    border:none;
    color:#fff;
    font:bold 15px/15px Arial, Helvetica, sans-serif;
    padding:0px 0px 1px 0px;
    margin:0px 0px 0px 0px;
    text-decoration:none;
    width:86px;
    height:20px;

    vertical-align:top;
    text-transform:uppercase;
    text-align:center;
    font-style:italic;
    cursor:pointer;
    }
    *+html .button,
    *+html .validate {

    }
    .button2-left {width:95px; float:left; margin-right:5px;}
    .button2-left, .image {display:inline}
    .button2-left a:hover,
    .readmore a:hover,
    div.blank a:hover {
    color:#fff;
    background:#666;
    padding:2px 0 1px 0;
    margin:0;
    }
    .modal-button, .readmore a, div.blank a {
    color:#fff;
    float:left;
    padding:2px 0px 1px 0;
    margin:0px 1px 0px 0px;
    font:normal 10px/12px Arial, Helvetica, sans-serif;
    height:auto;
    background:#000;
    text-align:center;
    }
    #editor-xtd-buttons {padding:5px 0px 5px 0px; overflow:hidden; width:300px; float:left}
    #editor-xtd-buttons .readmore {display:inline}
    .blank {margin:5px 0px 0px 0px;}
    *+html .blank {margin:10px 0 0 0;}
    div.blank a {
    width:114px;
    background:#000;
    }

    /*———————————–read-more—*/

    div.readmore {
    overflow:hidden;
    margin:0px 0px 0px 0px;
    padding:0px 0px 0px 0px;
    }
    div a.readon {
    background:#F47B20;
    border:none;
    color:#fff;
    display:inline-block;
    font:bold 15px/15px Arial, Helvetica, sans-serif;
    width:130px;
    padding:2px 0px 3px 0px;
    text-align:center;
    text-decoration:none;
    text-transform:uppercase;
    font-style:italic;
    }
    a.readon:hover {
    text-decoration:none;
    background:#000;
    }
    a.readon:visited {
    color:#fff;
    }

    /*—————————–blog-more—*/

    .blog_more {
    padding:0px 0px 10px 0px;
    }
    .blog_more h2 {
    font-size:12px;
    padding:0px 0px 0px 0px;
    }
    .blog_more ul {
    margin:10px 0px 0px 15px;
    }
    .blog_more ul li {
    padding:0px 0px 0px 0px !important;
    }
    .blog_more a {
    text-decoration:underline
    }
    .blog_more a:hover {
    text-decoration:none;
    }

    /*—————————–pagenav—*/

    .pagenav {
    font-size:12px;
    font-weight:normal
    }
    a.pagenav {
    font-weight:normal;
    padding:0px 2px 0px 2px;
    margin:0px 2px 0px 0px;
    text-decoration:none
    }
    a.pagenav:hover {
    text-decoration:underline
    }
    a.pagenav:visited {
    text-decoration:none
    }
    .pagination_nav {
    font-size:12px;
    padding:10px 20px 0px 27px;
    }
    .pagination_nav div {
    padding:5px 0px 5px 0px;
    }

    .pagination {
    margin-top:10px
    }
    .pagination li {
    padding:0px 5px 0px 5px;
    }
    .pagination_result {
    padding:5px 0px 0px 0px;
    line-height:16px;
    }
    .pagination span {padding:0px 10px 0px 0px;}
    .pagination strong span {padding:0px 6px 0px 6px; font-weight:normal}

    /*————————————–result—*/
    .searchArea {
    border:1px solid #303030;
    padding:10px;
    }
    .sectiontableentry0 td {
    }
    .sectiontableentry1 td, .sectiontableentry0 td, .sectiontableentry2 td {
    border-bottom:1px dotted #ccc;
    padding-bottom:7px;
    padding-top:7px;
    padding-right:5px;
    }
    .var1 {
    background:#f9f9f9;
    padding:5px !important;
    margin:5px 0px 5px 0px;
    }
    .var2 {
    background:#f0f0f0;
    padding:5px !important;
    margin:5px 0px 5px 0px;
    }
    .results {
    padding:0px 20px 15px 20px;
    }
    .results ol li {
    padding:0px 0px 10px 0px;
    text-align:justify;
    }
    .searchintro {
    padding:10px 0px 10px 20px;
    }
    .searchintro b, .searchintro strong {
    color:#be0404
    }
    .sectiontableheader {
    padding:6px 0px 6px 0px;
    background:#ccc;
    color:#000;
    }
    .sectiontableheader a, .sectiontableheader a:visited{
    color:#000;
    }
    .sectiontableheader strong {
    color:#666;
    }
    /*————————————–archive—*/
    .archiveBlock .button {
    display:inline-block;
    margin:0px 0px 0px 5px;
    }
    ul#archive-list h4 a {
    font-size:12px;
    text-transform:none
    }
    /*————————————–poll—*/
    dl.poll {
    padding:10px 0px 20px;
    }
    #poll h3 {
    font-size:120%;
    padding:0px 0px 10px 0px;
    }
    dl.poll dt {
    font-weight:bold;
    padding:7px 0px 0px 0px;
    }
    .poll .question {
    color:#dfded0;
    font-size:13px;
    font-weight:bold;
    padding:0px 10px 10px 0px;
    }
    .poll .poll-body {
    padding:0px 0px 0px 0px;
    }
    .poll-body label {
    font:normal 12px/20px Arial, Helvetica, sans-serif;
    color:#dfded0;
    padding:0px 0px 0px 0px;
    }
    .poll .buttons {
    padding:8px 0px 6px 0px;
    }
    .poll .button {
    background:#F47B20;
    border:none;
    color:#fff;
    font:bold 13px/15px Arial, Helvetica, sans-serif;
    cursor:pointer;
    display:inline;
    margin:0px 0px 0px 0px;
    padding:0px 0px 2px 0px;
    width:70px;
    height:21px;
    text-align:center;
    text-transform:uppercase;
    font-style:italic;
    }
    *+html .poll .button {
    padding:0;
    }
    .poll .section {
    overflow:hidden;
    padding:6px 0px 0px 0px;
    width:100%;
    color:#000;
    }
    .poll .section2 {
    overflow:hidden;
    padding:6px 0px 0px 0px;
    width:100%;
    }
    .poll .section2 label {
    }
    .poll .radio {
    float:left;
    width:20px;
    }
    .poll .radio input {

    width:16px;
    height:16px;
    vertical-align:middle;
    }
    .poll .var {
    margin:0px 0px 0px 20px;
    text-align:left
    }
    .display {
    padding:0px 0px 10px 0px;
    }
    .display select {
    border:1px solid #46462f;
    width:100px;
    }
    .sectiontableentry1 div,
    .sectiontableentry0 div {
    font-size:1px
    }
    .td_1, .td_2 {
    width:5%;
    text-align:center;
    }
    .td_3 {
    width:90%;
    padding:0px 0px 0px 10px;
    }
    #itema, #itemb, #itemc {
    background:#aaa;
    padding-bottom:5px;
    padding-top:5px;
    font-weight:bold;
    color:#000;
    }
    .pollstableborder .question {
    padding:0px 0px 0px 85px;
    }
    /*————————————–userforms—*/

    dl.contentpane dt {
    padding:10px 0px 20px 0px;
    }
    dl.contentpane dd {
    width:100%;
    overflow:hidden;
    }
    dl.contentpane div {
    vertical-align:middle
    }
    dl.contentpane .description {
    width:110px;
    padding:0px 0px 0px 0px;
    vertical-align:middle
    }
    dl.contentpane .input-field {
    width:160px;
    padding:0px 0px 0px 0px;
    vertical-align:middle
    }
    dl.contentpane .button-field {
    width:140px;
    padding:2px 0px 0px 0px;
    vertical-align:middle
    }

    /*————————————-search—*/

    .search .button {
    background:url(../images/searchButton.gif) no-repeat 0 0;
    border:none;
    float:right;
    width:60px;
    height:21px;
    font:normal 11px/12px Arial, Helvetica, sans-serif;
    margin:0px 0px 0px 0px;
    padding:0 0 2px 0;
    color:#fff;
    text-align:center;
    text-transform:uppercase;
    }
    *+html .search .button {
    padding:0;
    }
    .search .inputbox {
    background:#010101 url(../images/search-bg.gif) right top no-repeat;
    border:1px solid #1b1b1e;
    color:#696969;
    font:normal 11px/14px Arial, Helvetica, sans-serif;
    height:auto;
    padding:1px 0px 3px 4px;
    margin:0px 0px 0px 0px;
    vertical-align:top;
    width:180px;
    float:left;
    }
    .module-search .boxIndent {
    padding:7px 14px 8px 15px;
    }
    /* ———————————— manufacturers —————- */

    #manufacturers h3 {
    float:left;
    padding:2px 5px 0 0;
    font:bold 11px/14px Tahoma, Geneva, sans-serif;
    text-transform:uppercase;
    color:#ff4d00;
    }
    #manufacturers a {

    float:left;
    font:bold 11px/14px Tahoma, Geneva, sans-serif;
    text-transform:uppercase;
    color:#ff4d00;
    text-decoration:none;
    }
    #manufacturers br {
    display:none;
    }

    #manufacturers .inputbox {
    background:#000;
    border:none;
    border-right:1px solid #403938;
    border-bottom:1px solid #403938;
    color:#fff;
    font:normal 11px/14px Arial, Helvetica, sans-serif;
    height:auto;
    margin:0px 0px 0px 0px;
    vertical-align:top;
    width:162px;
    float:left;
    }
    /*————————————-search-result—*/
    .search_result {
    padding:0px 20px 0px 0px;
    }
    .search_result h3 {
    color:#808080;
    font-size:14px;
    }
    .highlight { /* highlight sought word */
    color:#be0404;
    font-weight:bold
    }
    /*————————————-admin-form—*/

    .adminform td {padding:0px 0px 2px 0px;}

    /*—————————system-error-messages–*/

    .error {
    margin:0px 0px 10px 0px;
    }
    #system-message dt.error, dt.message {
    display: none;
    }
    .error dd ul {
    background: #ce0303 ;
    border-top: 3px solid #670606;
    border-bottom: 3px solid #670606;
    color: #fff;
    margin:0;
    padding:5px 0px 5px 5px;
    }
    .error dd ul li {
    background:none !important;
    color:#fff !important;
    margin:0px 0px 0px 20px !important;
    }

    /*———————————————————————————boxes—*/
    .module, .module_text {
    margin:0px 0px 0px 0px;
    background:#1b1b1d;
    }
    .module .boxIndent, .module_text .boxIndent {
    padding:25px 18px 39px 28px;
    }
    .module .module-bg, .module_text .module-bg {
    background:#49403d;
    padding:10px 0 0 0;
    }
    #header .moduletable h3 {
    text-transform:none !important;
    background:none !important;
    margin:0 !important;
    }
    /*——————-title—-*/

    .module h3, .module-search h3, .module_text h3, .module-categories h3 {
    background:#F47B20;
    font-weight:bold;
    font-size:15px;
    line-height:15px;
    color:#fff;
    margin:0px;
    padding:11px 0px 11px 11px;
    text-transform:uppercase;
    font-style:italic;
    }
    .moduletable h3, .title, .categoryName, #vmMainPage h3, .categoryName {
    font:bold 15px/15px Arial, Helvetica, sans-serif;
    color:#808080;
    margin:0px 10px 20px 0px;
    padding:13px 18px 6px 24px;
    position:relative;
    font-style:italic;
    text-transform:uppercase;
    }
    .categoryName {
    background:none !important;
    }
    .extra-divider td {
    border:none;
    background:url(../images/extra-divider.gif) repeat-x left center;
    padding:13px 0;
    }

    .module-new .width {
    overflow:hidden;
    width:100%;
    }

    /*———————- categories ———-*/
    .module-categories {
    margin:0px 0px 0px 0px;
    }
    .module-categories .boxIndent {
    padding:0px 0 30px 0;
    }
    .module-categories .module-bg {
    background:#ff4d00;
    padding:10px 0 0 0;
    }
    .module-categories .bottom-bg {
    background:url(../images/categories-bg.gif) bottom left no-repeat;
    height:56px;
    }
    .module-categories h3 {
    background:#F47B20;
    font-weight:bold;
    font-size:15px;
    line-height:15px;
    color:#fff;
    margin:0px;
    padding:10px 0px 10px 11px;
    text-transform:uppercase;
    font-style:italic;
    }
    /*——————-content—-*/

    .module ul {
    list-style:none;
    margin:0px 0px 0px 0px;
    }
    .module ul li {
    padding:3px 0px 4px 0px;
    margin:0px 0px 0px 0px;
    line-height:16px;
    font-size:12px;
    color:#dfded0;
    background:url(../images/module-menu-divider.gif) repeat-x left bottom;
    }
    .module li a, .module li a:visited {
    background:url(../images/listMarker.gif) no-repeat 0 6px;
    font:normal 12px/14px Arial, Helvetica, sans-serif;
    color:#7d7d7d;
    padding:0px 0px 0px 12px;
    margin:0px 0px 0px 0px;
    text-decoration:none;
    }
    .module li a:hover {
    color:#afafaf;
    text-decoration:none !important;
    }
    .module a {
    color:#dfded0;
    text-decoration:underline;
    }
    .module a:hover {
    text-decoration:none !important;
    }
    .count { /* count users */
    text-decoration:underline;
    }

    /*————————————-mainmenu—*/

    .module_menu {
    margin:0px 0px 0px 0px;
    background:#1b1b1d;
    }
    .module_menu .boxIndent {
    padding:0;
    }
    .module_menu .module-bg {
    background:#49403d;
    padding:10px 0 0 0;
    }
    .module_menu .bottom-bg {
    background:url(../images/module-bg.gif) top left no-repeat;
    height:45px;
    }

    /*——————-title—-*/

    .module_menu h3 {
    background:url(../images/title-tail.gif) repeat-x left top;
    font:bold 15px/15px Arial, Helvetica, sans-serif;
    color:#fff;
    margin:0px;
    padding:11px 0px 11px 11px;
    text-transform:uppercase;
    font-style:italic;
    }

    /*—————–content—-*/

    .module_menu div {
    color:#fff;
    font-size:12px;
    }
    .module_menu ul, .module-categories ul {
    list-style:none;
    margin:0px 0px 0px 0px;
    }
    .module_menu li, .module-categories li {
    padding:0px 0px 0px 0px;
    margin:0px 0px 0px 0px;
    line-height:16px;
    font-size:12px;
    color:#cfcfcf;
    }
    .module_menu li a, .module-categories li a, .module_menu li a:visited, .module-categories li a:visited, a.mainlevel, .module-categories a.mainlevel, a.mainlevel:visited, a.sublevel, .module-categories a.sublevel, a.sublevel:visited {
    font:normal 12px/14px Arial, Helvetica, sans-serif;
    color:#fff;
    padding:7px 0px 7px 29px;
    margin:0px 0px 0px 0px;
    line-height:50px;
    background:#141416;
    border-bottom:1px solid #1b1b1d;
    text-decoration:none;
    }
    /*——————-hover—-*/

    .module_menu li a:hover, a.mainlevel:hover, a.sublevel:hover {
    background:url(../images/menu-marker.gif) no-repeat 14px 11px #F47B20;
    color:#fff;
    text-decoration:none;
    }

    /*——————active—-*/

    .module_menu li.active a, #active_menu {
    color:#aaa;
    }

    /* ————–vm categories */

    a.sublevel, a.sublevel:visited {

    text-decoration:none;

    }
    .module-categories a:hover {
    color:#fff !important;
    }
    .module-categories #active_menu {
    color:#F47B20 !important;
    }
    /*————————————-topmenu—*/

    ul.menu-nav {
    background:#F47B20;
    padding:0px;
    margin:0;
    list-style:none;
    width:100%;
    overflow:hidden;
    }
    ul.menu-nav li, ul.menu-nav li.active {
    float:left;
    border:none;
    width:145px;
    padding:0px 0px 0px 0px;
    border-right:1px solid #000;
    }
    ul.menu-nav li a, ul.menu-nav li a:visited {
    color:#ffffff;

    font:bold 15px/15px Arial, Helvetica, sans-serif;
    text-decoration:none;
    text-transform:uppercase;
    font-style:italic;
    padding:22px 0 21px 0;
    text-align:center;
    }
    /*——————-hover—-*/

    ul.menu-nav li a:hover {
    background:#ffffff;
    color:#000000;
    }

    /*——————-active—-*/

    ul.menu-nav li.active a {
    background:#F47B20;
    color:#000000;
    }

    /*————————userMenu—*/

    #userMenu {
    padding:10px 0 0 0;
    float:left;
    }

    #userMenu ul li {
    display:inline;
    border-right:1px solid #99a3a7;
    padding:0 9px 0 0;
    margin:0 9px 0 0;
    font:normal 11px/11px Arial, Helvetica, sans-serif;
    }
    #userMenu ul li a {
    text-decoration:none;
    }

    /*—————————————-login-form—*/

    .module-login {
    margin:0px 0px 5px 0px;
    position:relative;
    }
    .module-login .space {
    padding:22px 7px 10px 31px;
    }
    .module-login .boxIndent {
    padding:20px 24px 19px 25px;
    }
    .module-login h3 {
    margin:0px 0px 0px 0px;
    padding:11px 10px 13px 36px;
    color:#fff;
    font:bold 11px/15px Tahoma, Geneva, sans-serif;
    text-transform:uppercase;
    background:#be0404 url(../images/title-marker2.gif) no-repeat 26px 17px;
    }
    #form-login-username {

    width:100%;
    }

    /*—————–content—-*/
    #form-login-remember {
    padding:3px 0px 0px 0px;
    }
    .module-login label {
    color:#666;
    font:normal 12px/12px Tahoma, Geneva, sans-serif;
    }
    label.remember {
    color:#fff;
    font:normal 11px/12px Tahoma, Geneva, sans-serif;
    display:inline;
    font-weight:normal;
    }
    #mod_login_username, #mod_login_password {
    background:#fff;
    width:130px;
    border:none;
    padding:3px 0px 4px 7px;
    font:normal 11px/11px Tahoma, Geneva, sans-serif;
    color:#939194;
    margin:0px 0px 5px 0px;
    }
    .module-login a {
    color:#fff;
    font:normal 12px/18px Tahoma, Geneva, sans-serif;
    }
    .form-login .button { /* button */
    background:#F47B20;
    border:none;
    color:#fff;
    font:bold 15px/15px Arial, Helvetica, sans-serif;
    padding:0 0 2px 0;
    margin:0px;
    width:137px;
    height:20px;
    text-align:center;
    font-style:italic;

    }
    *+html .form-login .button {
    padding:0px;
    }
    .form-login .rememberCheck {
    padding:12px 0 0 0;
    }
    input.checkbox { /* checkbox */
    border:none;

    float:left;
    margin:0px 5px 0px 0px;
    vertical-align:middle;
    width:12px;
    height:12px
    }
    #inputs {
    padding:5px 0px 15px 0px;
    width:100%;
    overflow:hidden;
    }
    #form-login-remember {
    font:normal 11px/12px Arial, Helvetica, sans-serif;
    color:#7b7b7b;
    }
    #form-login-remember a {
    color:#7b7b7b;
    }
    #form-login-remember a:hover {
    text-decoration:none !important;
    }
    /*———————————————————structure—*/

    #body {
    background:#000 url(../images/body-bg.jpg) top center no-repeat;
    }

    .main {
    width:877px;
    }
    .mainBg {
    background:url(../images/bgTop.png) no-repeat 0 0px;
    }
    .mainIndent {
    padding:0px 0px 0px 0px;
    }

    /*————————————-header—*/

    #header .float-right {
    width:556px;
    }
    .logo-bg {
    background:url(../images/logo-bg.gif) no-repeat 10px 0;
    }
    #logo {
    width:480px;
    float:left;
    padding:30px 0 30px 0px;
    }
    .currency {
    padding:0px 0px 0px 28px;
    width:210px;
    overflow:hidden;
    margin:0;
    float:right;
    }
    .cart {
    padding:9px 15px 0 0px;
    width:235px;
    margin:0px;
    float:right;
    background:transparent url(../images/cart.png) no-repeat scroll 0 5px;
    }
    #search {
    float:left;
    padding:8px 0px 7px 7px;
    }
    .banner {
    margin:0 -24px 14px -24px;
    background:url(../images/banner-bg.png) no-repeat top left;
    padding:55px 571px 70px 100px;
    height:313px;
    color:#7e7d7d;
    font:normal 12px/14px Arial, Helvetica, sans-serif;
    position:relative;
    }
    .banner p {
    padding-top:14px;
    }
    .banner .button {color:#fff;
    background:none;
    margin:10px 0 0 0;
    width:145px;
    }
    .banner-title {margin-bottom:17px;}
    .bannergroup_text a {
    color:#ccc;
    }
    .bannergroup {width:100%; overflow:hidden;}
    .banneritem {
    float:left;
    overflow:hidden;
    margin:0 10px 0 0;
    }
    .search-bg {
    background:url(../images/search-bg.png) repeat;
    }
    /*————————————-content—*/
    #left {
    float:left;
    width:194px;
    }
    .container {
    overflow:hidden;
    }

    .whiteBg {
    background:#fff;
    margin-bottom:10px;
    padding:15px;
    position:relative;

    }
    .right-corner {
    background:url(../images/corner-right.gif) right top no-repeat;
    padding-right:480px;
    }
    .right-corner .corner-tail {
    background:#49403d;
    height:40px;
    }
    /*————————————-footer—*/

    #footer {
    padding:0 0 35px 0;
    }
    #footer .space {
    background:#131415;
    padding:13px 0px 17px 26px;
    }
    #footer .clear div {
    font:normal 11px/14px Tahoma, Geneva, sans-serif;
    color:#7b7b7b;
    float:left;
    }
    #footer a {
    color:#7b7b7b;
    font:normal 11px/14px Tahoma, Geneva, sans-serif;
    }

    #footer ul {
    padding:0px 0px 6px 0px;
    margin:0px 0px 0px 0px;

    height:auto;
    background:none;
    }
    #footer ul.menu-nav li, #footer ul.menu-nav li.active{
    background:none;
    border:none;
    padding:0;
    margin:0 22px 0 0;
    width:auto;
    }
    #footer ul.menu-nav li a {
    text-decoration:none !important;
    color:#fff;
    padding:0px 0px 0px 0px;
    font:normal 11px/14px Tahoma, Geneva, sans-serif;
    text-transform:none;
    width:auto;
    }
    #footer ul.menu-nav li a:hover, #footer ul.menu-nav li a, #footer ul.menu-nav li a:hover span {
    color:#fff;
    background:none;
    text-decoration:underline;
    }
    #footer ul.menu-nav li.active a span {
    color:#fff;
    text-decoration:underline;
    }
    /*——————————————————–VM—*/

    .clear {overflow:hidden; width:100%; position:relative;}
    .float-left {float:left;}
    .float-right {float:right;}
    .contact_email input {margin-bottom:10px;}
    .contact_email #contact_email_copy {margin:0; vertical-align:middle;}

    .lists {border-top:1px dotted #ccc; padding:10px 0 7px 10px;}
    .list-column {float:left; width:215px;}
    .lists ul {list-style:none; margin:0;}
    .lists li {line-height:16px; background:url(../images/listMarker.gif) no-repeat 0 8px; padding-left:10px;}
    .lists li a {color:#787a81;}

    .indent {padding:0 0 20px 0;}
    /* Tooltips */
    .tool-tip {
    float: left;
    background: #ffc;
    border: 1px solid #D4D5AA;
    padding: 5px;
    max-width: 200px;
    text-align:left;
    }

    .tool-title {
    padding: 0;
    margin: 0;
    font-size: 100%;
    font-weight: bold;
    margin-top: -15px;
    padding-top: 15px;
    padding-bottom: 5px;
    color:#000;
    }

    .tool-text {
    font-size: 100%;
    margin: 0;
    color:#000;
    }

    ul.menu-nav li.item30 {
    border:none;}

    #footer ul.menu-nav li a:hover, #footer ul.menu-nav li a:hover span {

    background:transparent none repeat scroll 0 0;
    color:#F47B20;
    text-decoration:underline;
    }

    #wr {
    background:transparent url(../images/joker_logo.png) no-repeat scroll right 30px;
    }

    .desc .button {
    background:transparent none repeat scroll 0 0;
    color:#000000;
    cursor:pointer;
    display:inline;
    font-family:Arial,Helvetica,sans-serif;
    font-size:12px;
    font-size-adjust:none;
    font-stretch:normal;
    font-style:normal;
    font-variant:normal;
    font-weight:normal;
    height:20px;
    margin:0;
    padding:0 0 1px;
    text-align:center;
    text-decoration:underline;
    text-transform:none;
    vertical-align:top;
    width:auto;
    }

    .desc .button:hover {

    color:#F47B20;

    }

    Code:
    <div class="module-categories">
    <h3><span>Category</span></h3>
    <div class="boxIndent">
    <div class="width clear">

    <a title="American Street -&gt;" style="font-style:italic;" class="mainlevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=90&amp;option=com_virtuemart&amp;Itemid=54" id="active_menu">American Street -&gt;</a>
    <a title="Sportster Parts" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=91&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Sportster Parts</a>
    <a title="V-Rod Specific Parts" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=92&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;V-Rod Specific Parts</a>

    <a title="Hand Controls" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=93&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Hand Controls</a>
    <a title="Mirrors" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=94&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Mirrors</a>
    <a title="Footpegs, Shift Pegs &amp; Brake Pedal Covers" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=95&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Footpegs, Shift Pegs &amp; Brake Pedal Covers</a>
    <a title="Air Cleaners &amp; Covers" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=96&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Air Cleaners &amp; Covers</a>
    <a title="Breathers" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=97&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Breathers</a>

    <a title="Choke Knobs" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=98&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Choke Knobs</a>
    <a title="Axle Covers" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=99&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Axle Covers</a>
    <a title="Cable Clamps" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=100&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Cable Clamps</a>
    <a title="Dashes, Panels &amp; Bagger Accessories" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=101&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Dashes, Panels &amp; Bagger Accessories</a>
    <a title="Drag Racing Products" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=102&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Drag Racing Products</a>

    <a title="Driveline Covers &amp; Accessories" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=103&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Driveline Covers &amp; Accessories</a>
    <a title="Engine Covers &amp; Accessories" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=104&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Engine Covers &amp; Accessories</a>
    <a title="Exhaust Systems" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=105&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Exhaust Systems</a>
    <a title="Fork Accessories" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=106&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Fork Accessories</a>
    <a title="Forward Controls &amp; Footpegs" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=107&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Forward Controls &amp; Footpegs</a>

    <a title="Grips &amp; Throttle Tubes" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=108&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Grips &amp; Throttle Tubes</a>
    <a title="Handlebar Clamps &amp; Risers" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=109&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Handlebar Clamps &amp; Risers</a>
    <a title="Handlebar Components &amp; Mirrors" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=110&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Handlebar Components &amp; Mirrors</a>
    <a title="Headlights" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=111&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Headlights</a>

    <a title="Licence Frames, Frame Clamps, Axle Caps &amp; Covers" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=112&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Licence Frames, Frame Clamps, Axle Caps &amp; Covers</a>
    <a title="Transmission Covers &amp; Accessories" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=113&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Transmission Covers &amp; Accessories</a>
    <a title="Tail &amp; Tag Light Licence Plate Frame Assemblies" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=114&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Tail &amp; Tag Light Licence Plate Frame Assemblies</a>
    <a title="Turn Signals &amp; Marker Lights" style="" class="sublevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=115&amp;option=com_virtuemart&amp;Itemid=54" >&nbsp;&nbsp;&nbsp;Turn Signals &amp; Marker Lights</a>

    <a title="Triumph -&gt;" style="" class="mainlevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=140&amp;option=com_virtuemart&amp;Itemid=54" >Triumph -&gt;</a>
    <a title="Ducati -&gt;" style="" class="mainlevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=132&amp;option=com_virtuemart&amp;Itemid=54" >Ducati -&gt;</a>
    <a title="Dirt Bike -&gt;" style="" class="mainlevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=124&amp;option=com_virtuemart&amp;Itemid=54" >Dirt Bike -&gt;</a>
    <a title="Speedway -&gt;" style="" class="mainlevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=135&amp;option=com_virtuemart&amp;Itemid=54" >Speedway -&gt;</a>
    <a title="Cafe Racer -&gt;" style="" class="mainlevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=119&amp;option=com_virtuemart&amp;Itemid=54" >Cafe Racer -&gt;</a>
    <a title="Apparel &amp; Accessories -&gt;" style="" class="mainlevel" href="/~sdgmotor/index.php?page=shop.browse&amp;category_id=116&amp;option=com_virtuemart&amp;Itemid=54" >Apparel &amp; Accessories -&gt;</a> </div>

    </div>
    </div>

    Please don’t use inline CSS. Please assign a separate class for the the tag and write the css in the style sheet.

    Mistake you have done in the codings by you

    In the anchor tag, you have written the style as "Display:block". I have removed the css from the anchor tag and now the menu will goes in the right side of the wrapper.

    If you want any help regarding HTML and CSS Please contact me!! :-)

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘CSS’ is closed to new topics and replies.