/* $Id: layout.css,v 1.1 2005/07/02 05:02:10 ankur Exp $ */

/**
 * -----------------------------------------------
 * Democratica layout styles
 * -----------------------------------------------
 *
 * These are the layout styles for Democratica.
 *
 */

/**
 * =Body Margins & Padding
 */

* {
  zoom:                         1; /* IE peekaboo fix */
}
html, body { 
  margin:                       0; 
  padding:                      0; 
}
                            
body {                        
  margin-bottom:                40px; 
  text-align:                   center; 
  min-width:                    740px
}
.quote  /* Beyond Tantra */ { font-size: 11px; font-family: verdana, Helvetica, sans-serif; text-align: justify; padding: 4pt; }
/**
 * =Branding
 */

#branding {
  width:                        100%;
}
#branding, #branding-container {
  padding:                      0;
  margin:                       0;
  text-align:                   left; 
}
#wrapper {
  clear:                        both;
  margin-left:                  auto;
  margin-right:                 auto;
  min-height:                   100%; 
  width:                        100%;
}


/**
 * =Notices
 */

#notices {
  position:                     relative;     
  width:                        auto; 
  height:                       2.5em;
  text-align:                   left; 
  margin-top:                   0;
  margin-bottom:                1.0em;
  margin-left:                  auto; 
  margin-right:                 auto; 
  padding:                      0.5em 8px 0.2em;
  border-top:                   1px solid #447799; 
  clear:                        both;
}


/**
 * =Hacks & global layout styles
 */

/* Prevents long urls from breaking layout in IE */
.outer, .main-content {
  word-wrap:                    break-word;
}
.outer {
  margin-top:                   0;
  min-height:                   100%;
}
/* \*/
* html .outer a, * html .container-left, * html .container-right { height:                       1%; }
/* */

/* \*/
* html .outer p {
  margin-right:                 -4px;
}
/* */

.left {
  margin-right:                 -1px;
}
/*** Margin fixes for IE5/win ***/
.right {
  margin-left:                  -1px;
}
.left, .right {
  text-align:                   left;
}
.main-content {
  margin:                       0 2.0em 0 1.0em;
}
/*** This element clears the cols without bugs in Gecko ***/
hr {
  display:block; 
  margin:                       0; 
  height:                       0; 
  font-size:                    0; 
  line-height:                  0; 
  clear:                        both;
} 
.center, .container-left, .container-right { overflow:                     visible; }


/**
 * -----------------------------------------------
 * Column layout styles
 * -----------------------------------------------
 *
 * With props to Big John of P.I.E.
 * http://www.positioniseverything.net
 *
 */

/**
 * =Three-columns
 */

.three-column .outer {
  margin-left:                  150px;    /*** Critical left col width value ***/
  margin-right:                 220px;    /*** Critical right col width value ***/
}
/* \*/
* html .three-column .outer {
  height:                       100%;
}
/* */

.three-column .float-wrap {
  float:                        left;
  width:                        100%;
  margin:                       0 -1px 0 0;
}
.three-column .center {
  text-align:                   left;
  float:                        right;
  width:                        100%;
  position:                     relative; /* Needed for IE/win */
}
.three-column .left {
  text-align:                   left;
  float:                        left;
  position:                     relative; /* Needed for IE/win */
  width:                        150px;    /*** Critical left col width value ***/ /*** Critical left divider dimension value ***/
  margin-left:                  -150px;    /*** Critical left col width value ***/ /*** Critical left divider dimension value ***/
}
/* \*/
* html .three-column .left {
  margin-right:                 -2px;
}
/* */

.three-column .right {
  text-align:                   left;
  float:                        right; 
  position:                     relative; /* Needed for IE/win */
  width:                        220px;    /*** Critical right col width value ***/ /*** Critical right divider dimension value ***/
  margin-right:                 -220px;    /*** Critical right col width value ***/ /*** Critical right divider dimension value ***/
}


/**
 * =Two-columns
 */

.two-column .outer {
  margin-left:                  225px;    /*** Critical left col width value ***/
  margin-right:                 0;    /*** Critical right col width value ***/
}  


/* \*/
* html .two-column .outer {
  height:                       100%;
}
/* */



.two-column .float-wrap {
  float:                        left;
  width:                        100%;
  margin:                       0 -1px 0 0;
}
.two-column .center {
  float:                        right;
  width:                        100%;
  position:                     relative; /* Needed for IE/win */
  padding-top:                  0;
  text-align:                   left;

}
.two-column .left {
  float:                        left;
  position:                     relative; /* Needed for IE/win */
  width:                        224px;    /*** Critical left col width value ***/ /*** Critical left divider dimension value ***/
  margin-left:                  -225px;    /*** Critical left col width value ***/ /*** Critical left divider dimension value ***/
}
/* \*/
* html .two-column .left {
  margin-right:                 -2px;
}
/* */

.two-column .right {
  display:                      none;
}
.two-column .main-content {
  margin-right:                 0;
  padding-right:                1.0em;
}


/**
 * =Two-columns, right-sided
 */

.two-column-right .outer {

  margin-left:                  0;    /*** Critical left col width value ***/
  margin-right:                 225px;    /*** Critical right col width value ***/
}  


/* \*/
* html .two-column-right .outer {
  height:                       100%;
}
/* */

.two-column-right .float-wrap {
  float:                        left;
  width:                        100%;
  margin:                       0 0 0 -1px;
}
.two-column-right .center {
  width:                        100%;
  position:                     relative; /* Needed for IE/win */
  padding-top:                  0;

  text-align:                   left;
}

.two-column-right .right {
  float: right;
  position: relative; /* Needed for IE/win */
  width:                        224px;
  margin-right:                 -225px;
}
.two-column-right .left {
  display:                      none;
}
.two-column-right .main-content {
  margin-left:                  0;
}


/**
 * =One-column
 */

.one-column .outer {

  margin-left:                  0;    /*** Critical left col width value ***/
  margin-right:                 0;    /*** Critical right col width value ***/
}  


/* \*/
* html .one-column .outer {
  height:                       100%;
}
/* */

.one-column .center {
  width:                        100%;
  position:                     relative; /* Needed for IE/win */
  padding-top:                  0;

  text-align:                   left;
}
.one-column .left, .one-column .right {
  display:                      none;

}
.one-column .main-content {
  margin-right:                 0; 
  margin-left:                  0;
  padding:                      0 1.0em;
}
