/* $Id: layout.css,v 1.3 2009/05/29 12:42:35 gausarts Exp $*/

/*
 * LAYOUT STYLES
 *
 * Define CSS classes to create a table-free, 3-column, 2-column, or single
 * column layout depending on whether blocks are enabled in the left or right
 * columns.
 *
 * This layout is developed under the Zen Columns layout method, here and there 
 * are changed to suit the need though.
 *     http://drupal.org/node/201428
 * For other customizations, see README.TXT, go to the project page, or visit gausarts dot com
 *
 * Only CSS that affects the layout (positioning) of major elements should be
 * listed here.  Such as:
 *   display, position, float, clear, width, height, min-width, min-height
 *   margin, border, padding, overflow
 *
 * Please note: do not edit holy grail widths here, instead use grail-overrides.css to safe upgrades
 *
 */

/** body **/

body {
margin:0;
padding:0;
}

#page,#closure-blocks {
/*
     * If you want to make the page a fixed width and centered in the viewport,
     * this is the standards-compliant way to do that. See also the ie.css file
     * for the necessary IE5 hack to center a div.
     */
margin-left:auto;
margin-right:auto;
width:960px;
}

#page-inner {
padding-top:10px;
}

#navigation-top,#navigation {
position:absolute;
/* Take the named anchors out of the doc flow    */
left:-10000px
/* and prevent any anchor styles from appearing. */
}

/** header **/
#header {
min-height:60px;
margin:0;
padding:0
}

#header-inner {
}

#logo-title {
}

#logo {
float:left;
margin:0 10px 0 0;
padding:0   
}

#site-name {
}

#site-slogan {
display:block;
padding:0
}

#header-blocks {
clear:both
/* Clear the logo */
}

/** navbar **/
#navbar {
padding:5px 0;
position:relative
}

#navbar ul /* Primary and secondary links */ {
margin:0;
padding:0
}

#navbar li /* A simple method to get navbar links to appear in one line. */ {
display:inline
}

#navbar-inner {
width:100%;
clear:both;
padding:0;
overflow:hidden;
position:relative;
}

/* Primary links or alternatively support primary-links as block for advance theming, such as with icons.
Use #block-menu-primary-links instead of #primary. Choose one!*/
#primary{
line-height:32px;
max-height:32px;
overflow:hidden;
}

/* Secondary links */
#secondary{
clear:both;
float:left;/*make border appear*/
line-height:32px;
width:100%;
}

/*-----------------------------!!!!!!HOLY GRAIL - begins!!!!!!!!-------------------------*/

/*To remove all holy grail borders, do it via admin/build/themes/settings/plaingrail or here for good*/
#main-inner, .farleft{border-right:1px solid #eaeaea;}
#main{border-top:1px solid #eaeaea;}

.noborder #main-inner, .noborder .farleft {border-right:0}
.noborder #main{border-top:0;}
.nobg #main-inner{background-color:transparent}

/*BOTH SIDEBARS ACTIVE DEFAULTS, do not add widths here, otherwise use grail-overrides.css*/
#main {
position:relative;
overflow:hidden;
clear:both;
float:left;
width:100%;
min-height:320px;
background-color: #fff;
}

#main-inner {
float:left;
width:200%;
position:relative;
right:100%;
background-color:#eaeaea;
margin-left:-250px;
}
.farleft {
float:left;
width:100%;
background-color:#fff;
margin-left:-150px;
}

#content {
float:left;
width:50%;
padding-bottom:1em
}

#content-inner {
position:relative;
left:100%;
overflow:hidden;
margin:20px 10px 20px 410px;
}

#sidebar-left {
float:right;
position:relative;
left:140px;
width:130px;
background: #fff;
}

#sidebar-left-inner {
margin:0;
padding:20px 0
}

#sidebar-right {
float:right;
position:relative;
left:520px;
width:230px;
}

#sidebar-right-inner {
margin:0;
padding:20px 0
}

/*ONE SIDEBAR ACTIVE GENERIC, do overrides on grail-overrides.css*/
body.one-sidebar #main-inner {
margin-left:-300px;
}

body.one-sidebar .farleft {
margin-left:0;
}

body.one-sidebar #content-inner {
margin:20px 10px 20px 410px;
}

body.one-sidebar #sidebar-left, body.one-sidebar #sidebar-right  {
left:390px;
width:380px;
}
/*NO SIDEBAR ACTIVE GENERIC, do overrides on grail-overrides.css*/
.no-sidebars #content,.no-sidebars .farleft,
.no-sidebars #main-inner,.no-sidebars #main {
margin:0;
width:100%;
border-right:0
}

.no-sidebars #content-inner {
margin:0;
width:96%
}

/*-----------------------------!!!!!!HOLY GRAIL - ends!!!!!!!!-------------------------*/

/** footer **/
#footer {
clear:both;
float:left;
width:100%;
}

#footer-inner {
padding:10px 0 0;
height:30px
}

/** closure **/
#closure-blocks /* See also the #page declaration above that this div shares. */ {
float:left
}

/** Prevent overflowing content **/
#header,#content,#navbar,#sidebar-left,#sidebar-right,#footer,#closure-blocks {
overflow:visible;
word-wrap:break-word
/* A very nice CSS3 property */
}

#navbar {
overflow:hidden
/* May need to be removed if using a dynamic drop-down menu */
}

/* If a div.clear-block doesnt have any content after it and its bottom edge
     touches the bottom of the viewport, Firefox and Safari will mistakenly
     place several pixels worth of space between the bottom of the div and the
     bottom of the viewport. Uncomment this CSS property to fix this.
     Note: with some over-large content, this property might cause scrollbars
     to appear on the #page div.
  */
/*
  #page
  {
    overflow-y: hidden;
  }
  */