Moving the left column

Forums    Joomla Templates Club    JA Mica    Moving the left column
Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • interiority Friend
    August 31, 2009 at 1:59 am #143812

    Hi
    I’d like to move the left column to the left of the page — so that we have left – maincontent – right.

    I know it needs an lot of ediiting of index.php and template.css but I can’t get it to work. Any help would be appreciated.

    Thanks!

    Anonymous Moderator
    August 31, 2009 at 7:48 am #315791

    Hi interiority

    Please kindly try with my guider:

    + Open templatesja_micaindex.php file and change as my code:


    <?php
    /*------------------------------------------------------------------------
    # $JA#PRODUCT_NAME$ - Version $JA#VERSION$ - Licence Owner $JA#OWNER$
    # ------------------------------------------------------------------------
    # Copyright (C) 2004-2008 J.O.O.M Solutions Co., Ltd. All Rights Reserved.
    # @license - Copyrighted Commercial Software
    # Author: J.O.O.M Solutions Co., Ltd
    # Websites: http://www.joomlart.com - http://www.joomlancers.com
    # This file may not be redistributed in whole or significant part.
    -------------------------------------------------------------------------*/

    // no direct access
    defined( '_JEXEC' ) or die( 'Restricted access' );
    include_once (dirname(__FILE__).DS.'ja_vars_1.5.php');
    ?>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>"><head>
    <jdoc:include type="head" />
    <?php JHTML::_('behavior.mootools'); ?>
    <link rel="stylesheet" href="<?php echo $tmpTools->templateurl(); ?>/css/addons.css" type="text/css" />
    <link rel="stylesheet" href="<?php echo $tmpTools->baseurl(); ?>templates/system/css/system.css" type="text/css" />
    <link rel="stylesheet" href="<?php echo $tmpTools->baseurl(); ?>templates/system/css/general.css" type="text/css" />
    <link rel="stylesheet" href="<?php echo $tmpTools->templateurl(); ?>/css/editor.css" type="text/css" />

    <link rel="stylesheet" href="<?php echo $tmpTools->templateurl(); ?>/css/typo.css" type="text/css" />

    <script language="javascript" type="text/javascript" src="<?php echo $tmpTools->templateurl(); ?>/js/ja.script.js"></script>
    <script language="javascript" type="text/javascript">
    var siteurl = '<?php echo $tmpTools->baseurl();?>';
    var tmplurl = '<?php echo $tmpTools->templateurl();?>';
    </script>

    <!-- Menu head -->
    <?php $jamenu->genMenuHead(); ?>
    <link rel="stylesheet" href="<?php echo $tmpTools->templateurl(); ?>/css/template.css" type="text/css" />
    <link rel="stylesheet" href="<?php echo $tmpTools->templateurl(); ?>/css/ja.bulletin.css" type="text/css" />
    <link href="<?php echo $tmpTools->templateurl(); ?>/css/colors/<?php echo strtolower ($tmpTools->getParam(JA_TOOL_COLOR)); ?>.css" rel="stylesheet" type="text/css" />

    <?php if ($tmpTools->isIE()) { ?>
    <link href="<?php echo $tmpTools->templateurl(); ?>/css/ie.php" rel="stylesheet" type="text/css" />
    <link href="<?php echo $tmpTools->templateurl(); ?>/css/colors/<?php echo strtolower ($tmpTools->getParam(JA_TOOL_COLOR));?>-ie.php" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
    window.addEvent ('load', makeTransBG);
    function makeTransBG() {
    makeTransBg($$('img'));
    }
    </script>
    <?php } ?>
    </head>

    <body id="bd" class="<?php echo $tmpTools->getParam(JA_TOOL_LAYOUT);?> <?php echo $tmpTools->getParam(JA_TOOL_SCREEN);?> fs<?php echo $tmpTools->getParam(JA_TOOL_FONT);?>" >
    <a name="Top" id="Top"></a>

    <!-- BEGIN: HEADER -->
    <div id="ja-header" class="wrap">
    <div class="main clearfix">
    <div class="inner clearfix">

    <?php
    $siteName = $tmpTools->sitename();
    if ($tmpTools->getParam('logoType')=='image') { ?>
    <h1 class="logo">
    <a href="index.php" title="<?php echo $siteName; ?>"><span><?php echo $siteName; ?></span></a>
    </h1>
    <?php } else {
    $logoText = (trim($tmpTools->getParam('logoText'))=='') ? $config->sitename : $tmpTools->getParam('logoText');
    $sloganText = (trim($tmpTools->getParam('sloganText'))=='') ? JText::_('SITE SLOGAN') : $tmpTools->getParam('sloganText'); ?>
    <div class="logo-text">
    <h1>
    <a href="index.php" title="<?php echo $siteName; ?>"><?php echo $logoText; ?></a>
    </h1>
    <p class="site-slogan"><?php echo $sloganText;?></p>
    </div>
    <?php } ?>

    <div id="ja-author">
    <jdoc:include type="modules" name="user7" style="raw" />
    </div>

    <!-- BEGIN: MAIN NAVIGATION -->
    <div id="ja-mainnav">
    <ul class="no-display">
    <li><a href="<?php echo $tmpTools->getCurrentURL();?>#ja-content" title="<?php echo JText::_("Skip to content");?>"><?php echo JText::_("Skip to content");?></a></li>
    </ul>

    <?php $jamenu->genMenu (0); ?>
    </div>
    <!-- END: MAIN NAVIGATION -->

    </div>
    </div>
    </div>
    <!-- END: HEADER -->

    <?php if (!$tmpTools->isContentEdit() && $this->countModules('ja-slideshow')) { ?>
    <!-- BEGIN: SLIDESHOW -->
    <div id="ja-slideshow" class="wrap">
    <div class="main clearfix">
    <jdoc:include type="modules" name="ja-slideshow" style="raw" />
    </div>
    </div>
    <!-- END: SLIDESHOW -->
    <?php } ?>

    <div id="ja-pathway" class="wrap">
    <div class="main">
    <div class="inner clearfix">

    <strong>You are here: </strong><jdoc:include type="module" name="breadcrumbs" />

    <?php if ($this->countModules('user4') ) { ?>
    <div id="ja-search">
    <jdoc:include type="modules" name="user4" style="raw" />
    </div>
    <?php } ?>

    </div>
    </div>
    </div>

    <div id="ja-container<?php echo $divid; ?>" class="wrap">
    <div class="main clearfix">
    <div class="inner clearfix">
    <?php if ($ja_left) { ?>
    <div id="ja-col1">
    <div class="inner clearfix">
    <?php if ($hasSubnav) { ?>
    <div id="ja-subnav" class="moduletable_menu">
    <h3 class="clearfix"><span>On this page</span></h3>
    <div class="ja-box-ct">
    <?php $jamenu->genMenu (1,1); ?>
    </div>
    </div>
    <?php } ?>

    <jdoc:include type="modules" name="left" style="jamodule" />
    </div>
    </div>
    <?php } ?>
    <!-- BEGIN: CONTENT -->
    <div id="ja-content">
    <jdoc:include type="message" />
    <div id="ja-current-content">
    <jdoc:include type="component" />
    </div>
    <jdoc:include type="modules" name="user5" style="xhtml" />
    </div>
    <!-- END: CONTENT -->

    <!-- BEGIN: COLUMNS -->

    <?php if ($ja_right) { ?>
    <div id="ja-col2">
    <div class="inner">
    <jdoc:include type="modules" name="right" style="jamodule" />
    </div>
    </div>
    <?php } ?>

    <!-- END: COLUMNS -->

    </div>
    </div>
    </div>

    <?php
    $spotlight = array ('user1','user2','user6');
    $botsl = $tmpTools->calSpotlight ($spotlight,$tmpTools->isOP()?100:99.9, 50);
    if( $botsl ) {
    ?>
    <!-- BEGIN: BOTTOM SPOTLIGHT -->
    <div id="ja-botsl">
    <div class="main">
    <div class="inner clearfix">

    <?php if( $this->countModules('user1') ) { ?>
    <div class="ja-box<?php echo $botsl['user1']['class']; ?>" style="width: <?php echo $botsl['user1']['width']; ?>;">
    <jdoc:include type="modules" name="user1" style="jamodule" />
    </div>
    <?php } ?>

    <?php if( $this->countModules('user2') ) { ?>
    <div class="ja-box<?php echo $botsl['user2']['class']; ?>" style="width: <?php echo $botsl['user2']['width']; ?>;">
    <jdoc:include type="modules" name="user2" style="jamodule" />
    </div>
    <?php } ?>

    <?php if( $this->countModules('user6') ) { ?>
    <div class="ja-box<?php echo $botsl['user6']['class']; ?>" style="width: <?php echo $botsl['user6']['width']; ?>;">
    <jdoc:include type="modules" name="user6" style="jamodule" />
    </div>
    <?php } ?>

    </div>
    </div>
    </div>
    <!-- END: BOTTOM SPOTLIGHT -->
    <?php } ?>

    <!-- BEGIN: FOOTER -->
    <div id="ja-footer" class="wrap">
    <div class="main clearfix">

    <div class="sublogo"></div>
    <div class="ja-info">
    <jdoc:include type="modules" name="user3" />
    <jdoc:include type="modules" name="footer" />
    </div>

    </div>
    </div>
    <!-- END: FOOTER -->

    <jdoc:include type="modules" name="debug" />
    </body>

    </html>

    + Open templatesja_micacsstemplate.css file, from line 615 to 676, change as follows:

    /* PRIMARY COLUMN
    --------------------------------------------------------- */
    #ja-content {
    /*clear: both;*/
    display: block;
    float: left;
    width: 50%;
    }

    #ja-current-content {
    padding-right: 20px;
    }

    /* content + 3 col */
    div.ja-wrap-center {
    clear: both;
    display: block;
    margin: 0;
    padding: 0;
    width: 100%;
    }

    div.ja-wrap-top {}

    div.ja-wrap-bot {
    padding: 20px;
    }

    /* COLUMNS
    --------------------------------------------------------- */
    #ja-cols {
    float: right;
    overflow: hidden;
    width: 50%;
    }

    #ja-col1 {
    clear: both;
    float: left;
    overflow: hidden;
    width: 24.9%;
    }

    #ja-col1 .inner {
    background: none;
    margin: 0;
    padding: 0 10px 0 0;
    }

    #ja-col2 {
    float: right;
    overflow: hidden;
    width: 24.9%;
    }

    #ja-col2 .inner {
    background: none;
    margin: 0;
    padding: 0 0 0 10px;
    }

    1 user says Thank You to JA Developer for this useful post

    1. interiority
    nganji Friend
    October 21, 2009 at 10:10 am #321145

    Hi,

    I have tried that and had this display but the width of the sections just push everything below. What width is advisable?

    leahbartlett Friend
    November 4, 2009 at 11:43 pm #322588

    I have followed all the steps and have it functioning almost correctly.

    However, when only the Right Module is enabled, the content in the right goes below the main content.

    Any idea on how to fix? thanks!

    Anonymous Moderator
    November 9, 2009 at 9:52 am #323016

    Hi leahbartlett

    It think there are some problems with your code.

    Please submit a ticket, send us your live url, admin account, ftp account so that i could have a closer look on the issue.

    Diogo Almeida Friend
    November 30, 2009 at 2:55 am #325256

    <em>@leahbartlett 151582 wrote:</em><blockquote>I have followed all the steps and have it functioning almost correctly.

    However, when only the Right Module is enabled, the content in the right goes below the main content.

    Any idea on how to fix? thanks!</blockquote>

    We have this problem, how to fix?

    Diogo Almeida Friend
    December 7, 2009 at 1:23 am #325853

    Some news about our problem, it occurs only when right column is empty. A temporary solution was enable some modules at right position.

    we2solutions Friend
    January 21, 2010 at 6:53 am #329931

    Same error occers.do the same thing but right colomn went down.plese give us solution.

    we2solutions Friend
    January 21, 2010 at 7:58 am #329935

    i want to make 3column for sub pages.not for the home.home(content+right).JA Developers solution works when something enable to the left colomn.but if i unpublish in the left column contents.the right column contents goes down.solution please

    we2solutions Friend
    January 21, 2010 at 4:43 pm #329990

    Please help us to overcome tis issue.

    Saguaros Moderator
    January 23, 2010 at 8:35 am #330120

    Hello guy!

    Here is the best solution for you:

    Here is the source of the index.php file:

    <?php
    /*————————————————————————
    # $JA#PRODUCT_NAME$ – Version $JA#VERSION$ – Licence Owner $JA#OWNER$
    # ————————————————————————
    # Copyright (C) 2004-2008 J.O.O.M Solutions Co., Ltd. All Rights Reserved.
    # @license – Copyrighted Commercial Software
    # Author: J.O.O.M Solutions Co., Ltd
    # Websites: http://www.joomlart.com – http://www.joomlancers.com
    # This file may not be redistributed in whole or significant part.
    ————————————————————————-*/

    // no direct access
    defined( ‘_JEXEC’ ) or die( ‘Restricted access’ );
    include_once (dirname(__FILE__).DS.’ja_vars_1.5.php’);
    ?>

    <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

    <html xmlns=”http://www.w3.org/1999/xhtml” xml:lang=”<?php echo $this->language; ?>” lang=”<?php echo $this->language; ?>”><head>
    <jdoc:include type=”head” />
    <?php JHTML::_(‘behavior.mootools’); ?>
    <link rel=”stylesheet” href=”<?php echo $tmpTools->templateurl(); ?>/css/addons.css” type=”text/css” />
    <link rel=”stylesheet” href=”<?php echo $tmpTools->baseurl(); ?>templates/system/css/system.css” type=”text/css” />
    <link rel=”stylesheet” href=”<?php echo $tmpTools->baseurl(); ?>templates/system/css/general.css” type=”text/css” />
    <link rel=”stylesheet” href=”<?php echo $tmpTools->templateurl(); ?>/css/editor.css” type=”text/css” />

    <link rel=”stylesheet” href=”<?php echo $tmpTools->templateurl(); ?>/css/typo.css” type=”text/css” />

    <script language=”javascript” type=”text/javascript” src=”<?php echo $tmpTools->templateurl(); ?>/js/ja.script.js”></script>
    <script language=”javascript” type=”text/javascript”>
    var siteurl = ‘<?php echo $tmpTools->baseurl();?>’;
    var tmplurl = ‘<?php echo $tmpTools->templateurl();?>’;
    </script>

    <!– Menu head –>
    <?php $jamenu->genMenuHead(); ?>
    <link rel=”stylesheet” href=”<?php echo $tmpTools->templateurl(); ?>/css/template.css” type=”text/css” />
    <link rel=”stylesheet” href=”<?php echo $tmpTools->templateurl(); ?>/css/ja.bulletin.css” type=”text/css” />
    <link href=”<?php echo $tmpTools->templateurl(); ?>/css/colors/<?php echo strtolower ($tmpTools->getParam(JA_TOOL_COLOR)); ?>.css” rel=”stylesheet” type=”text/css” />

    <?php if ($tmpTools->isIE()) { ?>
    <link href=”<?php echo $tmpTools->templateurl(); ?>/css/ie.php” rel=”stylesheet” type=”text/css” />
    <link href=”<?php echo $tmpTools->templateurl(); ?>/css/colors/<?php echo strtolower ($tmpTools->getParam(JA_TOOL_COLOR));?>-ie.php” rel=”stylesheet” type=”text/css” />
    <script type=”text/javascript”>
    window.addEvent (‘load’, makeTransBG);
    function makeTransBG() {
    makeTransBg($$(‘img’));
    }
    </script>
    <?php } ?>
    </head>

    <body id=”bd” class=”<?php echo $tmpTools->getParam(JA_TOOL_LAYOUT);?> <?php echo $tmpTools->getParam(JA_TOOL_SCREEN);?> fs<?php echo $tmpTools->getParam(JA_TOOL_FONT);?>” >
    <a name=”Top” id=”Top”></a>

    <!– BEGIN: HEADER –>
    <div id=”ja-header” class=”wrap”>
    <div class=”main clearfix”>
    <div class=”inner clearfix”>

    <?php
    $siteName = $tmpTools->sitename();
    if ($tmpTools->getParam(‘logoType’)==’image’) { ?>
    <h1 class=”logo”>
    <a href=”index.php” title=”<?php echo $siteName; ?>”><span><?php echo $siteName; ?></span></a>
    </h1>
    <?php } else {
    $logoText = (trim($tmpTools->getParam(‘logoText’))==”) ? $config->sitename : $tmpTools->getParam(‘logoText’);
    $sloganText = (trim($tmpTools->getParam(‘sloganText’))==”) ? JText::_(‘SITE SLOGAN’) : $tmpTools->getParam(‘sloganText’); ?>
    <div class=”logo-text”>
    <h1>
    <a href=”index.php” title=”<?php echo $siteName; ?>”><?php echo $logoText; ?></a>
    </h1>
    <p class=”site-slogan”><?php echo $sloganText;?></p>
    </div>
    <?php } ?>

    <div id=”ja-author”>
    <jdoc:include type=”modules” name=”user7″ style=”raw” />
    </div>

    <!– BEGIN: MAIN NAVIGATION –>
    <div id=”ja-mainnav”>
    <ul class=”no-display”>
    <li><a href=”<?php echo $tmpTools->getCurrentURL();?>#ja-content” title=”<?php echo JText::_(“Skip to content”);?>”><?php echo JText::_(“Skip to content”);?></a></li>
    </ul>

    <?php $jamenu->genMenu (0); ?>
    </div>
    <!– END: MAIN NAVIGATION –>

    </div>
    </div>
    </div>
    <!– END: HEADER –>

    <?php if (!$tmpTools->isContentEdit() && $this->countModules(‘ja-slideshow’)) { ?>
    <!– BEGIN: SLIDESHOW –>
    <div id=”ja-slideshow” class=”wrap”>
    <div class=”main clearfix”>
    <jdoc:include type=”modules” name=”ja-slideshow” style=”raw” />
    </div>
    </div>
    <!– END: SLIDESHOW –>
    <?php } ?>

    <div id=”ja-pathway” class=”wrap”>
    <div class=”main”>
    <div class=”inner clearfix”>

    <strong><?php echo JText::_(‘YOU ARE HERE:’);?> </strong><jdoc:include type=”module” name=”breadcrumbs” />

    <?php if ($this->countModules(‘user4’) ) { ?>
    <div id=”ja-search”>
    <jdoc:include type=”modules” name=”user4″ style=”raw” />
    </div>
    <?php } ?>

    </div>
    </div>
    </div>

    <div id=”ja-container<?php echo $divid; ?>” class=”wrap”>
    <div class=”main clearfix”>
    <div class=”inner clearfix”>

    <!– BEGIN: CONTENT –>
    <div id=”ja-content”>
    <jdoc:include type=”message” />
    <!– BEGIN: LEFT –>
    <?php if ($ja_left) { ?>
    <div id=”ja-col1″>
    <div class=”inner clearfix”>
    <?php if ($hasSubnav) { ?>
    <div id=”ja-subnav” class=”moduletable_menu”>
    <h3 class=”clearfix”><span>On this page</span></h3>
    <div class=”ja-box-ct”>
    <?php $jamenu->genMenu (1,1); ?>
    </div>
    </div>
    <?php } ?>

    <jdoc:include type=”modules” name=”left” style=”jamodule” />
    </div>
    </div>
    <?php } ?>
    <!– END: LEFT –>
    <div id=”ja-current-content”>
    <jdoc:include type=”component” />
    </div>
    <jdoc:include type=”modules” name=”user5″ style=”xhtml” />
    </div>
    <!– END: CONTENT –>

    <?php if ($ja_right) { ?>
    <!– BEGIN: COLUMNS –>

    <?php if ($ja_right) { ?>
    <div id=”ja-col2″>
    <div class=”inner”>
    <jdoc:include type=”modules” name=”right” style=”jamodule” />
    </div>
    </div>
    <?php } ?>

    <!– END: COLUMNS –>
    <?php } ?>

    </div>
    </div>
    </div>

    <?php
    $spotlight = array (‘user1′,’user2′,’user6’);
    $botsl = $tmpTools->calSpotlight ($spotlight,$tmpTools->isOP()?100:99.9, 50);
    if( $botsl ) {
    ?>
    <!– BEGIN: BOTTOM SPOTLIGHT –>
    <div id=”ja-botsl”>
    <div class=”main”>
    <div class=”inner clearfix”>

    <?php if( $this->countModules(‘user1’) ) { ?>
    <div class=”ja-box<?php echo $botsl[‘user1’][‘class’]; ?>” style=”width: <?php echo $botsl[‘user1’][‘width’]; ?>;”>
    <jdoc:include type=”modules” name=”user1″ style=”jamodule” />
    </div>
    <?php } ?>

    <?php if( $this->countModules(‘user2’) ) { ?>
    <div class=”ja-box<?php echo $botsl[‘user2’][‘class’]; ?>” style=”width: <?php echo $botsl[‘user2’][‘width’]; ?>;”>
    <jdoc:include type=”modules” name=”user2″ style=”jamodule” />
    </div>
    <?php } ?>

    <?php if( $this->countModules(‘user6’) ) { ?>
    <div class=”ja-box<?php echo $botsl[‘user6’][‘class’]; ?>” style=”width: <?php echo $botsl[‘user6’][‘width’]; ?>;”>
    <jdoc:include type=”modules” name=”user6″ style=”jamodule” />
    </div>
    <?php } ?>

    </div>
    </div>
    </div>
    <!– END: BOTTOM SPOTLIGHT –>
    <?php } ?>

    <!– BEGIN: FOOTER –>
    <div id=”ja-footer” class=”wrap”>
    <div class=”main clearfix”>

    <div class=”sublogo”></div>
    <div class=”ja-info”>
    <jdoc:include type=”modules” name=”user3″ />
    <jdoc:include type=”modules” name=”footer” />
    </div>

    </div>
    </div>
    <!– END: FOOTER –>

    <jdoc:include type=”modules” name=”debug” />
    </body>

    </html>

    2) open the file: templates/ja_mica/ja_vars_1.5.php and try to find codes at line 30
    [PHP]
    if ( $ja_left && $ja_right ) {
    //2 columns on the right
    $divid = ”;
    } elseif ( ($ja_left || $ja_right) && !$ja_masscol ) {
    //One column without masscol
    $divid = ‘-c’;
    } elseif (($ja_left || $ja_right) && $ja_masscol) {
    //One column with masscol
    $divid = ‘-cm’;
    } elseif ($ja_masscol) {
    //masscol only
    $divid = ‘-m’;
    } else {
    //No column in right
    $divid = ‘-f’;
    }

    [/PHP]

    >>> replace:

    [PHP]
    if ( $ja_left && $ja_right ) {
    //2 columns on the right
    $divid = ”;
    } elseif ( ($ja_left ) ) {
    //One column without masscol
    $divid = ‘-cl’;
    } elseif (($ja_right)) {
    //One column with masscol
    $divid = ‘-c’;
    } elseif ($ja_masscol) {
    //masscol only
    $divid = ‘-m’;
    } else {
    //No column in right
    $divid = ‘-f’;
    }

    [/PHP]

    and here is the source of the css file:

    /*————————————————————————
    # $JA#PRODUCT_NAME$ – Version $JA#VERSION$ – Licence Owner $JA#OWNER$
    # ————————————————————————
    # Copyright (C) 2004-2008 J.O.O.M Solutions Co., Ltd. All Rights Reserved.
    # @license – Copyrighted Commercial Software
    # Author: J.O.O.M Solutions Co., Ltd
    # Websites: http://www.joomlart.com – http://www.joomlancers.com
    # This file may not be redistributed in whole or significant part.
    ————————————————————————-*/
    html, body, form, fieldset {
    margin: 0;
    padding: 0;
    }

    body {
    background: #FFFFFF;
    color: #000000;
    font-family: “Lucida Grande”, Arial, Geneva, Helvetica, sans-serif;
    line-height: 1.8;
    }

    body#bd {
    background: url(../images/body-bg.gif) repeat-x left top #E5E5E5;
    color: #333333;
    min-width: 980px;
    }

    body.contentpane {
    color: #000000;
    font-size: 12px;
    line-height: 1.3em;
    margin: 0;
    margin: 1em 2em;
    width: auto; /* Printable Page */
    }

    body.fs1 {
    font-size: 10px;
    }

    body.fs2 {
    font-size: 11px;
    }

    body.fs3 {
    font-size: 12px;
    }

    body.fs4 {
    font-size: 13px;
    }

    body.fs5 {
    font-size: 14px;
    }

    body.fs6 {
    font-size: 15px;
    }

    body.fs6 #ja-cssmenu li,
    body.fs6 #ja-splitmenu li,
    body.fs5 #ja-cssmenu li,
    body.fs5 #ja-splitmenu li,
    body.fs4 #ja-cssmenu li,
    body.fs4 #ja-splitmenu li {
    background-position: top right !important;
    }

    /* Normal link */
    a {
    color: #CA430A;
    text-decoration: none;
    }

    a:hover, a:active, a:focus {
    text-decoration: underline;
    }

    a img {
    border: none;
    }

    /* Title text */
    .contentheading, .componentheading, h1, h2, h3, h4 {
    line-height: 1.1;
    }

    /* Small text */
    small, .small, .smalldark, .createby, .createdate, .modifydate, .img_caption,
    p.site-slogan, a.readon, #ja-pathway, #ja-colwrap, #ja-footer {
    font-size: 92%;
    }

    small, .small {
    color: #999999;
    }

    img {
    margin: 0;
    padding: 0;
    }

    img.caption {
    margin-top: 5px;
    }

    .img_caption p {
    background: #999999;
    border-top: 1px solid #FFFFFF;
    color: #FFFFFF;
    margin: 0;
    padding: 3px 0 3px;
    text-transform: uppercase;
    }

    /* Heading */
    h1 {
    font-size: 225%;
    font-weight: normal;
    }

    h2 {
    font-size: 200%;
    font-weight: normal;
    }

    h3 {
    font-size: 150%;
    }

    h4 {
    font-size: 110%;
    }

    p, pre, blockquote, ul, ol, h1, h2, h3, h4, h5, h6 {
    margin: 10px 0;
    padding: 0;
    }

    h1, h2, h3, h4 {
    font-family: Georgia, Cambria, “Times New Roman”, Times, serif;
    }

    ul {
    list-style: none;
    }

    ul li {
    background: url(../images/bullet.gif) no-repeat 20px 7px;
    line-height: 160%;
    padding-left: 30px;
    }

    ol li {
    line-height: 180%;
    margin-left: 20px;
    }

    th {
    font-weight: bold;
    padding: 5px;
    text-align: left;
    }

    fieldset {
    border: none;
    padding: 10px 5px;
    }

    fieldset a {
    font-weight: bold;
    }

    fieldset.input {
    padding: 0;
    }

    hr {
    border-bottom: 0;
    border-left: 0;
    border-right: 0;
    border-top: 1px solid #CCCCCC;
    height: 1px;
    }

    td, div {
    font-size: 100%;
    }

    /* FORM
    ——————————————————— */
    form {
    margin: 0;
    padding: 0;
    }

    form label {
    cursor: pointer;
    }

    input, select, textarea, .inputbox {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%;
    }

    .inputbox {
    background: #FFFFFF;
    border: 1px solid #D5D5D5;
    color: #333333;
    padding: 3px 3px;
    }

    .button {
    background: #333333;
    border: 1px solid #141414;
    color: #FFFFFF;
    font-size: 100%;
    font-weight: bold;
    padding: 1px 8px;
    }

    * html .button {
    padding: 2px 3px !important; /*IE 6*/
    }

    *+html .button {
    padding: 2px 3px !important; /*IE 7*/
    }

    /* JOOMLA STYLE
    ——————————————————— */
    table.blog {
    }

    .article_separator {
    background: url(../images/dot.gif) repeat-x center;
    clear: both;
    display: block;
    height: 30px;
    }

    .article_column {
    }

    .column_separator {
    padding: 0 25px;
    }

    /* content tables */
    td.sectiontableheader {
    background: #333333;
    border: 1px solid #CCCCCC;
    padding: 4px;
    }

    tr.sectiontableentry0 td,
    tr.sectiontableentry1 td,
    tr.sectiontableentry2 td {
    border-bottom: 1px solid #CCCCCC;
    padding: 4px 4px 6px;
    }

    tr.sectiontableentry0:hover td,
    tr.sectiontableentry1:hover td,
    tr.sectiontableentry2:hover td {
    background-color: #F5F5F5;
    }

    tr.sectiontableentry2 td {
    background-color: #FFFFFF;
    }

    table.contentpane {
    border: none;
    width: 100%;
    }

    table.contentpaneopen {
    border: none;
    border-collapse: collapse;
    border-spacing: 0;
    }

    table.contenttoc {
    font-size: 92%;
    margin: 0 0 10px 10px;
    padding: 0;
    width: 35%;
    }

    table.contenttoc a {
    }

    table.contenttoc td {
    background: url(../images/bullet.gif) no-repeat 10px 9px;
    padding: 1px 5px 1px 20px;
    }

    table.contenttoc th {
    border-bottom: 1px solid #CCCCCC;
    padding: 0 0 3px;
    text-indent: 5px;
    }

    table.poll {
    border-collapse: collapse;
    padding: 0;
    width: 100%;
    }

    table.pollstableborder {
    border: none;
    padding: 0;
    text-align: left;
    width: 100%;
    }

    table.pollstableborder img {
    vertical-align: baseline;
    }

    table.pollstableborder td {
    background: none;
    border-collapse: collapse;
    border-spacing: 0;
    padding: 4px !important;
    }

    table.pollstableborder tr.sectiontableentry1 td {
    background: #F5F5F5;
    }

    table.searchintro {
    padding: 10px 0;
    width: 100%;
    }

    table.searchintro td {
    padding: 5px!important;
    }

    table.adminform {
    }

    .adminform .inputbox {
    }

    .blog_more {
    }

    .blog_more strong {
    display: block;
    font-size: 125%;
    margin: 0 0 5px;
    }

    .blog_more ul {
    margin: 0;
    padding: 0;
    }

    .blog_more ul li {
    background: url(../images/bullet.gif) no-repeat 6px 10px;
    margin: 0;
    padding: 0 0 0 17px;
    }

    .category {
    font-size: 125%;
    font-weight: bold;
    }

    h1.componentheading, .componentheading {
    background: url(../images/h3-bg.gif) repeat-x;
    border-bottom: 1px solid #D5D5D5;
    border-top: 1px solid #D5D5D5;
    color: #858585;
    font-size: 100%;
    font-weight: normal;
    letter-spacing: 1px;
    margin: 0 0 10px 0;
    padding: 11px 0;
    text-transform: uppercase;
    }

    h1.componentheading span, .componentheading span{
    background: #333333;
    padding: 6px 10px;
    }

    .contentdescription {
    display: block;
    font-size: 125%;
    font-style: italic;
    margin: 10px 0;
    padding: 10px;
    }

    h2.contentheading, .contentheading {
    color: #333333;
    font-size: 150%;
    margin: 0;
    padding: 0 8px 0 0;
    }

    table.blog .contentheading {
    font-size: 180%;
    }

    a.contentpagetitle,
    a.contentpagetitle:hover,
    a.contentpagetitle:active,
    a.contentpagetitle:focus {
    }

    a.readon {
    background: url(../images/arrow_readmore.gif) no-repeat right 5px;
    color: #CA430A;
    padding: 0 20px 0 0;
    }

    a.readon:hover, a.readon:active, a.readon:focus {
    text-decoration: underline;
    }

    table.contentpaneopen td, table.contentpane td {
    padding: 5px;
    }

    table.contentpaneopen, table.contentpane, table.blog {
    width: 100%;
    }

    ul.pagination {
    margin: 15px auto 0;
    padding: 0;
    }

    ul.pagination li {
    background: none;
    display: inline;
    margin: 0;
    padding: 0;
    }

    ul.pagination li span{
    padding: 2px 5px;
    }

    ul.pagination a {
    padding: 2px 3px;
    }

    ul.pagination a:hover, ul.pagination a:active, ul.pagination a:focus {
    }

    .pagenavbar {
    background: url(../images/icon-pages.gif) no-repeat center left;
    font-weight: bold;
    padding-left: 14px;
    }

    .pagenavcounter {
    background: url(../images/icon-pages.gif) no-repeat 0 11px;
    font-weight: bold;
    padding: 8px 14px 0 14px;
    }

    .sectiontableheader {
    color: #FFFFFF;
    font-weight: bold;
    padding: 8px 5px;
    }

    .sectiontableheader a {
    color: #FFFFFF;
    }

    tr.sectiontableentry1 td {
    padding: 8px 5px;
    }

    tr.sectiontableentry2 td {
    padding: 8px 5px;
    }

    tr.sectiontableentry1:hover td,
    tr.sectiontableentry2:hover td {
    }

    .smalldark {
    text-align: left;
    }

    div.syndicate div {
    text-align: center;
    }

    .pollstableborder tr.sectiontableentry1 td,
    .pollstableborder tr.sectiontableentry2 td {
    background: none;
    }

    /* META
    ——————————————————— */
    .article-tools {
    clear: both;
    color: #999999;
    display: block;
    margin: 0 0 10px;
    padding-top: 5px;
    position: relative;
    width: 100%;
    }

    .article-meta {
    float: left;
    padding: 0;
    width: 70%;
    }

    .article-section, .article-category {
    font-size: 92%;
    text-transform: uppercase;
    }

    .createby {
    padding: 0 5px 0 5px;
    }

    .createdate {
    background: url(../images/vline1.gif) no-repeat right;
    padding: 0 5px 0 0;
    }

    .modifydate {
    color: #999999;
    }

    div.buttonheading {
    padding: 3px;
    position: absolute;
    right: 0;
    top: 0px;
    width: 82px;
    }

    .buttonheading img {
    background: none;
    border: 0;
    float: right;
    margin: 0 5px 0 0;
    }

    /* MAIN LAYOUT
    ——————————————————— */
    .wrap {
    clear: both;
    width: 100%;
    }

    .main {
    margin: 0 auto;
    width: 980px;
    }

    .inner {
    padding: 10px;
    }

    #ja-container,
    #ja-container-f,
    #ja-container-c,
    ja-container-cl{
    padding: 0 0 20px;
    }

    #ja-container .main {
    background: url(../images/trans-bg.png);
    padding: 10px 0 10px;
    }

    #ja-container .inner {
    background: #FFFFFF url(../images/line_right_bg_y.gif) repeat-y 74% top;
    margin: 0 10px;
    padding: 20px;
    }

    #ja-container-f .main {
    background: url(../images/trans-bg.png);
    padding: 10px 0;
    }

    #ja-container-f .main .inner {
    background: #FFFFFF;
    margin: 0 10px;
    padding: 10px 20px;
    }

    #ja-container-c .main,#ja-container-cl .main {
    background: url(../images/trans-bg.png);
    padding: 10px 0;
    }

    #ja-container-c .inner , #ja-container-cl .inner {
    background: #FFFFFF url(../images/line_right_bg_y.gif) repeat-y 74% top;
    margin: 0 10px;
    padding: 20px;
    }

    #ja-container-c #ja-col1 .inner {
    padding: 0 0 0 10px;
    }

    , #ja-container-cl #ja-col1 .inner {
    padding: 0 10px 0 0;
    }

    /* PRIMARY COLUMN
    ——————————————————— */
    #ja-content {
    clear: both;
    display: block;
    float: left;
    width: 70%;
    }

    #ja-current-content {
    /* padding-right: 20px; */
    width:70%;
    float:right
    }
    #ja-content {
    clear: both;
    display: block;
    float: left;
    width: 70%;
    }

    #ja-current-content {
    /* padding-right: 20px; */
    width:70%;
    float:right
    }

    /* content + 3 col */
    div.ja-wrap-center {
    clear: both;
    display: block;
    margin: 0;
    padding: 0;
    width: 100%;
    }

    div.ja-wrap-top {}

    div.ja-wrap-bot {
    padding: 20px;
    }

    /* COLUMNS
    ——————————————————— */
    #ja-cols {
    float: right;
    overflow: hidden;
    width: 50%;
    }

    #ja-col1 {
    clear: both;
    float: left;
    overflow: hidden;
    width: 30%;
    }

    #ja-col1 .inner {
    background: none;
    margin: 0;
    padding: 0 10px 0 0;
    }

    #ja-col2 {
    float: right;
    overflow: hidden;
    width: 30%;
    }

    #ja-col2 .inner {
    background: none;
    margin: 0;
    padding: 0 0 0 10px;
    }

    /* COLLAPSIBLE LAYOUT
    ——————————————————— */
    /* main-right */

    /* content + col */
    #ja-container-c #ja-content{
    width: 70%;
    }
    #ja-container-c #ja-current-content{
    width:100%
    }

    #ja-container-c #ja-col2 {
    width: 30%;
    }

    #ja-container-cl #ja-content{
    width: 100%;
    }

    #ja-container-cl #ja-col1{
    width: 23%;
    }
    #ja-container-cl #ja-current-content{
    width:77%
    }

    /* full */
    #ja-container-f #ja-content{
    width: 100%;
    }
    #ja-container-f #ja-current-content{
    width:100%
    }
    #ja-container-f #ja-cols {
    width: 0%;
    }

    /* COLLAPSIBLE LAYOUT
    ——————————————————— */
    #ja-container,
    #ja-container-fr,
    #ja-container-fl,
    #ja-container-f {
    background: url(../images/cw-bg.gif) repeat-x left top;
    clear: both;
    padding: 0;
    }

    #ja-container .main,
    #ja-container-fr .main,
    #ja-container-fl .main,
    #ja-container-f .main {
    padding-top: 20px;
    }

    /*content + left*/
    #ja-container-fr #ja-mainbody {
    width: 100%;
    }

    #ja-container-fr #ja-col1 {
    width: 25%;
    }

    #ja-container-fr #ja-body {
    width: 75%;
    }

    #ja-container-fr #ja-current-content {
    padding: 0 0 0 15px;
    }

    /*content + right*/
    #ja-container-fl #ja-mainbody {
    width: 75%;
    }

    #ja-container-fl #ja-body {
    float: left;
    width: 100%;
    }

    #ja-container-fl #ja-col2 {
    width: 25%;
    }

    #ja-container-fl #ja-current-content {
    padding-left: 0;
    }

    /*full*/
    #ja-container-f #ja-mainbody {
    width: 100%;
    }

    #ja-container-f #ja-body {
    width: 100%;
    }

    #ja-container-f #ja-current-content {
    padding: 0;
    }

    /* MODULE
    ——————————————————— */

    /* MODULE
    ——————————————————— */
    /* Module Default*/
    div.module h3 {
    font-size: 100%;
    height: 30px;
    line-height: 32px;
    margin: 0 -10px 5px;
    padding: 0;
    position: relative;
    text-indent: 10px;
    text-transform: uppercase;
    }

    div.module h3 span.ja-mdtool {
    display: block;
    height: 17px;
    position: absolute;
    right: 15px;
    top: 8px;
    width: 17px;
    }

    div.module,
    div.module_blank {
    background: url(../images/bor_br.gif) no-repeat right bottom !important;
    clear: both;
    float: left;
    margin-bottom: 10px;
    width: 100%;
    }

    div.module div {
    background: url(../images/bor_bl.gif) no-repeat left bottom;
    margin: 0;
    }

    div.module div div {
    background: url(../images/bor_tr.gif) no-repeat right top;
    }

    div.module div div div {
    background: url(../images/bor_tl.gif) no-repeat left top;
    display: block;
    overflow: hidden;
    padding: 0 10px 10px;
    }

    div.module div div div div {
    background: none;
    clear: both;
    display: block;
    padding: 0;
    width: 100%;
    }

    /* blank module */
    div.module_blank {
    background: none !important;
    margin-bottom: 0;
    padding-bottom: 10px;
    }

    div.module_blank div {
    background: none;
    margin: 0;
    padding: 0;
    }

    /* Module Default */
    div.moduletable h3,
    div.moduletable_menu h3,
    div.moduletable_testimonials h3,
    div.moduletable_highlight h3,
    div.moduletable_blue h3 {
    background: url(../images/h3-bg.gif) repeat-x;
    border-bottom: 1px solid #D5D5D5;
    border-top: 1px solid #D5D5D5;
    color: #858585;
    display: block;
    font-size: 110%;
    font-weight: normal;
    letter-spacing: 1px;
    margin: 0 0 10px;
    padding: 6px 0;
    text-transform: uppercase;
    }

    div.moduletable h3 span,
    div.moduletable_menu h3 span,
    div.moduletable_testimonials h3 span,
    div.moduletable_highlight h3 span,
    div.moduletable_blue h3 span {
    background: #353535;
    display: block;
    float: left;
    padding: 4px 10px;
    }

    div.moduletable,
    div.moduletable_menu,
    div.moduletable_text,
    div.moduletable_testimonials,
    div.moduletable_highlight,
    div.moduletable_blue {
    margin: 0 0 15px;
    padding: 0 0 5px;
    }

    div.ja-box-ct {
    padding: 0;
    }

    /* Module Testimonials */
    div.moduletable_testimonials div.testimonials {
    background: url(../images/bg_bt_tesimonial.gif) no-repeat bottom left;
    padding: 0 0 21px 0;
    }

    div.moduletable_testimonials div.testimonials div {
    background: #F5F5F5;
    border: 1px solid #E5E5E5;
    border-bottom: none;
    color: #555555;
    font-size: 110%;
    font-style: italic;
    font-weight: bold;
    padding: 5px 10px 5px 10px;
    text-align: center;
    }

    div.moduletable_testimonials div.testimonials .text {
    background: url(../images/icon_testi.gif) no-repeat 0 3px;
    border: none;
    font-size: 100%;
    }

    /* Module Hightlight */
    div.moduletable_highlight h3 {
    background: url(../images/h3-bg2.gif) repeat-x left top;
    border-bottom: 1px solid #252525;
    border-top: 1px solid #252525;
    }

    div.moduletable_highlight h3 span {
    background: #252525;
    }

    div.moduletable_highlight {
    background: #353535;
    color: #A5A5A5;
    }

    div.moduletable_highlight div.ja-box-ct {
    padding: 0 10px 10px;
    }

    div.moduletable_highlight img {
    background: #252525;
    border: 1px solid #404040;
    padding: 3px;
    }

    /* Module blue */
    div.moduletable_blue h3 {
    color: #FFFFFF;
    }

    div.moduletable_blue h3 span {
    background: #353535;
    }

    /* mis */
    div.banneritem_text {
    padding: 5px 0 !important;
    }

    div.advs {
    clear: both;
    display: block;
    float: left;
    width: 100%;
    }

    div.moduletable ul,
    div.moduletable_text ul,
    div.moduletable_menu ul,
    div.moduletable_hilte ul {
    margin: 0;
    padding: 0;
    }

    div.moduletable li,
    div.moduletable_text li,
    div.moduletable_menu li,
    div.moduletable_hilite li {
    margin: 0;
    }

    /* HEADER
    ——————————————————— */
    #ja-header {
    margin: 0 0 20px;
    z-index: 100;
    }

    #ja-header .main {
    background: url(../images/trans-bg.png);
    line-height: normal;
    padding: 0;
    }

    #ja-header .inner {
    background: #333333;
    height: 150px;
    margin: 0 10px 10px;
    padding: 0;
    position: relative;
    z-index: 2;
    }

    h1.logo, div.logo-text h1 {
    font-size: 300%;
    margin: 0;
    padding: 0;
    }

    h1.logo a {
    background: url(../images/logo.png) no-repeat;
    display: block;
    height: 80px;
    left: 20px;
    position: absolute;
    top: 10px;
    width: 219px;
    }

    h1.logo a span {
    position: absolute;
    top: -1000px;
    }

    div.logo-text {
    left: 5px;
    position: absolute;
    top: 30px;
    }

    div.logo-text h1 a {
    color: #FFFFFF;
    font-weight: bold;
    letter-spacing: 1px;
    outline: none;
    }

    h1.logo-text a:hover,
    h1.logo-text a:focus,
    h1.logo-text a:active {
    text-decoration: none;
    }

    p.site-slogan {
    color: #999999;
    margin: 5px 0 0;
    padding: 1px;
    }

    /* MAIN NAVIGATION
    ——————————————————— */
    #ja-mainnav {
    background: url(../images/mainnav-bg.gif) repeat-x left top;
    border-top: 1px solid #141414;
    bottom: 0;
    height: 35px;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: 3;
    }

    #ja-mainnav a, #ja-subnav a {
    outline: none;
    }

    #ja-subnav {
    }

    #ja-subnav ul {
    margin: 0;
    padding: 0;
    }

    #ja-subnav li {
    background: url(../images/dot.gif) repeat-x left bottom;
    margin: 0;
    padding: 0;
    }

    #ja-subnav li a {
    background: url(../images/arrow.gif) no-repeat scroll left;
    color: #666666;
    display: block;
    outline: none;
    padding: 6px 0 6px 10px;
    width: 92%;
    }

    #ja-subnav li a:hover,
    #ja-subnav li a:active,
    #ja-subnav li a:focus {
    background: url(../images/arrow_active.gif) no-repeat scroll left;
    color: #CA430A;
    text-decoration: none;
    }

    #ja-subnav li.active a,
    #ja-subnav li.active a:hover,
    #ja-subnav li.active a:active,
    #ja-subnav li.active a:focus {
    background: url(../images/arrow_active.gif) no-repeat scroll left;
    color: #CA430A;
    font-weight: bold;
    }

    /* breadcrumbs */
    #ja-pathway {
    color: #666666;
    padding: 0;
    text-transform: uppercase;
    }

    #ja-pathway .main {
    background: url(../images/trans-bg.png);
    padding: 0;
    }

    #ja-pathway .inner {
    margin: 0;
    padding: 10px 10px 0;
    height: 20px;
    position: relative;
    }

    div#ja-search{
    position: absolute;
    right: 10px;
    top: 10px;
    background: url(../images/icon-search.gif) no-repeat 10px 5px #F5F5F5;
    width: 240px;
    border-top: 1px solid #cbc9c9;
    border-bottom: 1px solid #e3e2e2;
    border-right: 1px solid #e3e2e2;
    border-left: 1px solid #e3e2e2;
    }

    div#ja-search .inputbox{
    background: #F5F5F5;
    margin-left: 25px;
    border: none;
    width: 210px;
    }

    #ja-pathway strong {
    margin-right: 5px;
    }

    #ja-pathway a {
    color: #CA430A;
    }

    #ja-pathway img {
    margin: 1px 5px;
    }

    /* Default Joomla! Menu */
    ul.menu {
    padding: 0;
    }

    ul.menu li {
    background: url(../images/dot.gif) repeat-x left bottom;
    margin: 0;
    padding: 0;
    }

    ul.menu li a {
    background: url(../images/arrow.gif) no-repeat scroll left;
    color: #666666;
    display: block;
    outline: none;
    padding: 6px 0 6px 10px;
    width: 92%;
    }

    ul.menu li a:hover,
    ul.menu li a:active,
    ul.menu li a:focus {
    background: url(../images/arrow_active.gif) no-repeat scroll left;
    color: #CA430A;
    text-decoration: none;
    }

    ul.menu li.active a {
    color: #CA430A;
    font-weight: bold;
    }

    ul.menu li ul {
    list-style: none;
    margin: 0 0 0 10px;
    padding: 0;
    }

    ul.menu li ul li {
    background: none;
    border-bottom: none;
    }

    ul.menu li li a {
    background: url(../images/arrow.png) no-repeat 0px 13px !important;
    color: #333333 !important;
    font-weight: normal !important;
    padding: 6px 0 6px 10px !important;
    }

    ul.menu li li a:hover,
    ul.menu li li a:active,
    ul.menu li li a:focus,
    ul.menu li li.active a{
    background: url(../images/arrow_active.gif) no-repeat 0px 13px !important;
    color: #CA430A !important;
    }

    ul#mainlevel {
    padding: 0;
    }

    ul#mainlevel li {
    background: url(../images/dot.gif) repeat-x left bottom;
    margin: 0;
    padding: 0;
    }

    ul#mainlevel li a {
    background: url(../images/arrow.gif) no-repeat scroll left;
    display: block;
    outline: none;
    padding: 10px 0 10px 15px;
    width: 92%;
    }

    ul#mainlevel li a:hover,
    ul#mainlevel li a:active,
    ul#mainlevel li a:focus,
    ul#mainlevel li.active a {
    background: url(../images/arrow_active.gif) no-repeat scroll left;
    color: #CA430A;
    }

    ul#mainlevel li ul {
    list-style: none;
    margin: 0 0 10px 10px;
    padding: 0;
    }

    ul#mainlevel li ul li {
    border-bottom: none;
    }

    ul#mainlevel li li a {
    background: url(../images/arrow.png) no-repeat 7px 9px !important;
    border: none;
    color: #333333 !important;
    font-weight: normal !important;
    padding: 2px 0 2px 15px !important;
    }

    ul#mainlevel li li a:hover,
    ul#mainlevel li li a:active,
    ul#mainlevel li li a:focus,
    ul#mainlevel li li.active a {
    color: #CA430A !important;
    }

    /* SPOTLIGHT
    ——————————————————— */
    /* Spotlight Box Style */
    .ja-box-full, .ja-box-left, .ja-box-center, .ja-box-right {
    float: left;
    overflow: hidden;
    }

    .ja-box-left, .ja-box-center {
    }

    /* Top spotlight */
    #ja-topsl {
    height: 240px;
    margin: 0 0 10px;
    }

    /* Bot spotlight */
    #ja-botsl {
    background: url(../images/botsl-bg.gif) repeat-x left top #353535;
    color: #999999;
    padding-top: 15px;
    }

    #ja-botsl div.moduletable h3 {
    background: url(../images/h3-bg2.gif) repeat-x;
    border-bottom: 1px solid #252525;
    border-top: 1px solid #252525;
    margin: 0 0 20px;
    }

    #ja-botsl .ja-box-left div.moduletable {
    padding-right: 20px;
    }

    #ja-botsl .ja-box-center div.moduletable {
    padding: 0 20px 0 0;
    }

    #ja-botsl .ja-box-right div.moduletable {
    padding: 0;
    }

    #ja-botsl div.moduletable h3 span,
    #ja-botsl div.moduletable_testimonials h3 span,
    #ja-botsl div.moduletable_menu h3 span,
    #ja-botsl div.moduletable_highlight h3 span {
    background: #252525;
    padding: 3px 7px;
    }

    #ja-botsl .ja-box-left div.moduletable {
    padding-left: 0;
    }

    #ja-botsl .ja-box-right div.moduletable {
    padding-right: 0;
    }

    #ja-botsl ul, #ja-botsl ol {
    margin: 0;
    padding: 0;
    }

    #ja-botsl li {
    border-bottom: none;
    }

    #ja-botsl ol li {
    background: none;
    margin: 0 0 0 20px;
    }

    #ja-botsl ul li {
    background: url(../images/bullet3.gif) no-repeat 0px 8px;
    margin: 0;
    padding-left: 10px;
    }

    /* FOOTER
    ——————————————————— */
    #ja-footer {
    background: url(../images/footer-bg.gif) repeat-x left top #252525;
    color: #666666;
    padding: 1px 0 0;
    }

    #ja-footer small a {
    color: #999999;
    }

    #ja-footer ul {
    line-height: normal;
    margin: 0;
    padding: 0;
    }

    #ja-footer small {
    color: #666666;
    font-size: 100%;
    }

    #ja-footer li {
    background: none;
    display: inline;
    margin: 0;
    padding: 0 10px;
    }

    #ja-footer li a {
    color: #999999;
    display: inline;
    line-height: normal;
    }

    #ja-footer a:hover, #ja-footer a:active, #ja-footer a:focus {
    color: #CCCCCC;
    }

    #mainlevel-nav li.ja-firstitem {
    background: none;
    padding-left: 0;
    }

    #mainlevel-nav li {
    background: url(../images/arrow-vline.gif) no-repeat left center;
    }

    #ja-footer .sublogo {
    background: url(../images/logo_footer.png) no-repeat left top;
    display: block;
    float: left;
    height: 41px;
    margin: 10px 0;
    width: 15%;
    width: 15%;
    }

    #ja-footer .ja-info {
    float: left;
    padding: 20px 0;
    width: 85%;
    }

    /* MISCELLANOUS
    ———————————————————– */
    ul.accessibility {
    position: absolute;
    top: -100%;
    }

    /* Login Form */
    #login-wrap {
    }

    #login-wrap form {
    float: left;
    }

    #login-wrap form label {
    }

    #login-wrap form input.button {
    float: left;
    }

    #login-wrap form #mod_login_username,
    #login-wrap form #mod_login_password {
    font-weight: bold;
    margin: 0px 8px 5px 0;
    width: 90%;
    }

    #login-wrap form #mod_login_username {}

    #login-wrap form #mod_login_password {}

    #login-wrap form a {
    padding: 0 5px;
    text-decoration: none;
    }

    #login-wrap form a:hover,
    #login-wrap form a:active,
    #login-wrap form a:focus {
    text-decoration: underline;
    }

    p#form-login-username,
    p#form-login-password {
    margin-top: 0;
    }

    div.ja-login-links {
    margin-top: 5px;
    }

    div.ja-login-links li {
    background: url(../images/bullet.gif) no-repeat 5px 7px;
    padding-left: 15px;
    }

    div.ja-login-links a {
    color: #666666;
    margin: 0;
    padding: 0 !important;
    }

    div.ja-login-links a:hover,
    div.ja-login-links a:active,
    div.ja-login-links a:focus {
    color: #CA430A;
    }

    /*others*/
    #ja-banner,
    #ja-banner1 {
    margin: 0 0 10px;
    overflow: hidden;
    padding: 0;
    text-align: center;
    width: 100%;
    }

    div.back_button a,
    div.back_button a:hover,
    div.back_button a:active {
    display: block;
    margin: 10px 0;
    }

    .clr {
    clear: both;
    }

    .hastip img {
    background: none;
    border: none;
    float: left;
    margin: 0;
    padding: 0;
    }

    div.ja-innerdiv {
    background: url(../images/dot.gif) repeat-x left bottom;
    clear: both;
    margin-bottom: 5px !important;
    padding-bottom: 10px !important;
    }

    div.ja-innerdiv .img-border {
    border: 1px solid #D5D5D5;
    float: left;
    margin: 5px 10px 0 0;
    padding: 1px;
    }

    /* JA Highslide */
    a.highslide-credits em {
    font-size: 10px !important;
    font-style: normal;
    font-weight: bold;
    }

    a.highslide {
    padding-left: 5px !important;
    padding-right: 5px !important;
    display: block;
    float: left;
    }

    a.highslide img {
    border: 1px solid #404040;
    margin-bottom: 5px;
    padding: 2px;
    }

    a.highslide:hover img {
    border: 1px solid #595959;
    }

    /*about author*/
    #ja-author {
    color: #858585;
    position: absolute;
    right: 20px;
    text-align: right;
    top: 20px;
    width: 400px;
    }

    #ja-author h3 {
    margin-top: 0px;
    font-weight: normal;
    }

    #ja-author p {
    font-style: italic;
    margin: 0;
    }

    #ja-author .img-border {
    border: 1px solid #555555;
    float: right;
    margin-left: 10px;
    padding: 2px;
    }

    /*ja slideshow*/
    #ja-slideshow {
    margin: 0 0 20px;
    padding: 0;
    }

    /* Tooltips */
    .tool-tip {
    background: #FFFFFF;
    border: 1px solid #F5F5F5;
    float: left;
    max-width: 200px;
    padding: 5px;
    }

    .tool-title {
    background: url(../../system/images/selector-arrow.png) no-repeat;
    font-size: 100%;
    font-weight: bold;
    margin: 0;
    margin-top: -15px;
    padding: 0;
    padding-bottom: 5px;
    padding-top: 15px;
    }

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

    #system-message dd.message ul,
    #system-message dd.error ul,
    #system-message dd.notice ul {
    margin: 0;
    padding: 0;
    }

    #system-message dd.message ul li,
    #system-message dd.error ul li,
    #system-message dd.notice ul li {
    background: none;
    color: #FFFFFF;
    margin: 0;
    padding: 5px;
    }

    /* System Standard Messages */
    #system-message dd.message ul {
    background: #666666;
    border: none;
    }

    /* System Error Messages */
    #system-message dd.error ul {
    background: #CA430A;
    border: none;
    }

    /* System Notice Messages */
    #system-message dd.notice ul {
    background: #666666;
    border: none;
    }

    .banneritem {
    text-align: center;
    }

    I testest with some layout models:
    1) full width
    2) left-main-left
    3) left-fullmain
    4)fullmain-right

    They are work well on IE6,7,8 , Firefox,…..

    Note: if the template is clean ja mica template, you only put do as i mentioned, so your site will be work.
    Good luck

    we2solutions Friend
    January 28, 2010 at 5:40 am #330688

    Hi tienhc,

    it working well.but only one problem.when i used left column for publish something the column border goes more right..
    any way thanks lot for your help.rally appricate lot.

    Thanks

    we2solutions Friend
    January 28, 2010 at 11:00 am #330744

    Hi
    i found the solution my self.in template.css now it is like this
    #ja-container-c .inner , #ja-container-cl .inner {
    background: #FFFFFF url(../images/line_right_bg_y.gif) repeat-y 74% top;
    margin: 0 10px;
    padding: 20px;
    }

    and change it to

    #ja-container-c .inner {
    background: #FFFFFF url(../images/line_right_bg_y.gif) repeat-y 70% top;
    margin: 0 10px;
    padding: 20px;
    }

    #ja-container-cl .inner {
    background: #FFFFFF url(../images/line_right_bg_y.gif) repeat-y 23% top;
    margin: 0 10px;
    padding: 20px;
    }

    It work for me:D

    1 user says Thank You to we2solutions for this useful post

    1. JA Developer
  • Author
    Posts
Viewing 13 posts - 1 through 13 (of 13 total)

This topic contains 13 replies, has 7 voices, and was last updated by  we2solutions 14 years, 3 months ago.

We moved to new unified forum. Please post all new support queries in our New Forum

Important Notice :

New Unified Portal is live

Must Read

Jump to forum

Categories