CMS Made Simple Forums

Code: Select all

<div id="pagewrapper">

    <!-- start accessibility skip links -->
    <ul class="accessibility">
      <li>{anchor anchor='menu_vert' title='Skip to navigation' accesskey='n' text='Skip to navigation'}</li>
      <li>{anchor anchor='main' title='Skip to content' accesskey='s' text='Skip to content'}</li>
    </ul>
    <!-- end accessibility skip links -->


    <hr class="accessibility" />
    <!-- Horizontal ruler that is hidden for visual browsers by CSS -->


   <!-- Start Header, with logo image that links to the default start page. Logo image is changed in the stylesheet  "For template: Top menu + left submenu + 1 column" -->
   <div id="header">
           <h1>{cms_selflink dir="start" text="$sitename"}</h1>
   <hr class="accessibility" />
   </div>
   <!-- End Header -->


   <!-- Start Navigation -->
   <div id="menu_horiz">
   <div id="newsletter" style="float: right;">
     {global_content name='newsletter'}
   </div>
      <h2 class="accessibility">Navigation</h2>
      {menu template='simple_navigation.tpl' number_of_levels='1'}
   <hr class="accessibility" />
   </div>
   <div id="menu_horiz2">
      {menu template='extra-menu'  start_page='hd-menu' show_all='1'}
   <hr class="accessibility" />
   </div>   

   <!-- End Navigation -->

   <!-- Start Content (Navigation and Content columns) -->
   <div id="content">

      <!-- Start Sidebar -->
      <div id="leftsidebar">

      <!-- Start Sub Navigation -->
      <div id="menu_vert">
         <h2 class="accessibility">Sub Navigation</h2>
         {menu template='simple_navigation.tpl' start_level='2' collapse='1'}
         <br />
         <br />
         {menu template='extra-menu'  start_page='sb-menu' show_all='1'}
         <br />
         <br />
         <hr class="accessibility" />
      </div>
      
      <!-- End Sub Navigation -->

      </div>
      <!-- End Sidebar -->

      <!-- Start Content Area -->
      <div id="main">
         <h2>{title}</h2>
         {content} <br />
         <!-- Start relational links -->
<!-- RK         <div class="hr"></div> -->
         <!-- End relational links -->
       <hr class="accessibility" />
      </div>
      <!-- End Content Area -->

     <div id="rightsidebar" align='center'>
     <h4>FEATURED PROPERTIES</h4>
     <br />
     <div id="prop1">
     {BannerText category='Prop1'}
     </div>
     <div id="prop2">
     {BannerText category='Prop2'}
     </div>
     <div id="prop3">
     {BannerText category='Prop3'}
     </div>
     <div id="prop4">
     {BannerText category='Prop4'}
     </div>
     <hr class="accessibility" />
     </div>
   </div>
   <!-- End Content -->



   <!-- Start Footer. Edit the footer in the Global Content Block called "footer" -->
   <div id="footer">
   <div id="footermenu" style="float: right;"> 
   {menu template='extra-menu'  start_page='ft-menu' show_all='1'}
   </div> 
   {valid_xhtml}
<!--      {global_content name='footer'} -->
   </div>
   <!-- End Footer  -->


</div><!-- end pagewrapper -->

Code: Select all

/*****************
basic layout 
*****************/
body {
   background-color: #000000;
   color: #333;
   margin:1em; /* gives some air for the pagewrapper */
}

/* center wrapper, min max width */
div#pagewrapper {
   border: 1px solid black;
   margin: 0 auto;     /* this centers wrapper */
   min-width: 1014px;
   max-width: 1014px;
   background-color: #9D9B9C;
/*   background-color: #DADADA; */
   color: black;
}


/*** header ***
we will hide text and replace it with a image
we need to assign a height for it
*/

div#header {
   height: 118px; /* adjust according your image size */
   background: #9D9B9C url(uploads/rk:_zon_-_3col/header2.jpg) no-repeat 0px; 
}

div#header h1 a {
/* you can set your own image here */
   display: block; 
   height: 118px;             /* adjust according your image size */
   text-indent: -999em;  /* this hides the text */
   text-decoration:none; /* old firefox would have shown underline for the link, this explicitly hides it */
}

div.breadcrumbs span.lastitem { 
   font-weight:bold; 
 } 

div#content {
/* background-color: #9D9B9C; */
background-color: #B3B3B3;
padding-top: 3px;
}

div#leftsidebar {
   float: left;
   margin-left: 0px;
   margin-right: 0px;
   width: 150px;   
   padding: 2px;
}

div#rightsidebar {
   float: right;
   margin-left: 3px;
   margin-right: 3px;
   width: 150px;
   padding: 0px;
}

div#main {
   float: left;
   width: 700px;
   margin-left: 0px;
   margin-right: 0px;
   padding: 0px;
   background-color: #EFEFEF ;
}

div#footer {
   clear:both;       /* keep footer below content and menu */
   color: #fff;
   background-color: #4F4F4F;
   height: 50px; 
}

div#footer p {
   font-size: 0.8em;
   padding: 1.5em;      /* some air for footer */
   text-align: center; /* centered text */
   margin:0;
}

div#footer p a {
   color: #fff; /* needed becouse footer link would be same color as background otherwise */
}