/* $Id: grail-devwidth.css,v 1.1 2009/05/25 13:27:27 gausarts Exp $*/

/*
 * grail-devwidth STYLES, useful for dev purposes only
 * Delete this file for good, or use grail-overrides.css once you have created your columns method
 *
 * This layout is based on Holy Grail technique
 *      http://matthewjamestaylor.com/blog/ultimate-3-column-blog-style-pixels.htm
 * Controlled by Grid, see http://960.gs/
 * For other customizations & explanation, see README.TXT, go to the project page, or visit gausarts dot com
 *
 * Only CSS that affects the width of main content area, sidebar-left and sidebar-right listed here
 * Defaults: #sidebar-left = 130px  and #sidebar-right = 230px
 * If you want to override something, do it in grail-overrides.css and keep it safe from the next upgrade
 * Each of 3 alternatives here are generated dynamically via admin/build/themes/settings/plaingrail
 *
 */

/*-----------------------------!!!!!!DO NOT TOUCH! Use grail-overrides.css instead!!!!!!--------*/

/*-----------------------------!!!!!!ALTERNATIVE WIDTH I = 170X170!!!!!!---------------------------------*/
/*BOTH SIDEBARS ACTIVE*/
.grail-170x170 #main-inner {
margin-left:-200px
}

.grail-170x170 .farleft {
margin-left:-200px
}

.grail-170x170 #content-inner {
margin:20px 15px 20px 415px
}

.grail-170x170 #sidebar-left {
width:170px;
left:185px
}

.grail-170x170 #sidebar-right {
width:170px;
left:555px
}


/*-----------------------------!!!!!!ALTERNATIVE WIDTH II = 160X220 - ok!!!!!!---------------------------------*/
/*BOTH SIDEBARS ACTIVE*/
.grail-160x220 #main-inner {
margin-left:-240px
}

.grail-160x220 .farleft {
margin-left:-180px
}

.grail-160x220 #content-inner {
margin:20px 10px 20px 430px
}

.grail-160x220 #sidebar-left {
width:160px;
left:170px
}

.grail-160x220 #sidebar-right {
left:570px;
width:220px
}

/*-----------------------------!!!!!!ALTERNATIVE WIDTH III = 140X300!!!!!!---------------------------------*/
/* BOTH SIDEBARS ACTIVE */
.grail-140x300 #main-inner {
margin-left:-320px
}

.grail-140x300 .farleft {
margin-left:-160px
}

.grail-140x300 #content-inner {
margin:20px 10px 20px 490px
}

.grail-140x300 #sidebar-left {
left:150px;
width:140px
}

.grail-140x300 #sidebar-right {
left:610px;
width:300px
}