/*
** Table-based column layout for all browsers.
**
** There's a table-less column layout alternative in the plone_tableless
** skin layer, if you prefer layouts without tables.
*/

#portal-columns {
    width: 768px;
    padding: 0;
    margin: 0;
    display:block;
}

/* we need to make #portal-columns to really wrap floated elements.
   to know more about the technique used here read about 
   EasyClearing at http://www.positioniseverything.net/easyclearing.html
*/
#portal-columns:after {
    content: ".";
    display:block;
    height:0;
    clear: both;
    visibility: hidden;
}
#portal-column-one {
    float: left;
    width: 176px;
    padding: 0;
    /* left margin: -(#portal-column-content.width + #portal-column-one.width) */
    margin: 0 0 0 -592px; 
    overflow: hidden;
}
#portal-column-content {
    float: left; 
    /* width: #portal-columns.width - (#portal-column-one.width + #portal-column-two.width) */   
    width: 416px;
    padding: 0;
    /* margin-left: #portal-column-one.width */
    margin: 0 0 0 176px;
}
#portal-column-content .visualPadding {
    margin: 1em 1em 0pt;
    position: relative;
    overflow: hidden;
}
#portal-column-two {
    float: left;    
    width: 176px;
    padding: 0;    
    margin: 0;    
    overflow: hidden;    
}

/* hide columns */

.visualColumnHideOneTwo #portal-column-content {
    margin-left: 0;
    /* width: #portal-columns.width */
    width: 768px;
}

.visualColumnHideOne #portal-column-content {
    margin-left: 0;
    /* width: #portal-columns.width - #portal-column-one.width */    
    width: 592px;
}

.visualColumnHideTwo #portal-column-content {
    /* width: #portal-columns.width - #portal-column-two.width */        
    width: 592px;
}
.visualColumnHideTwo #portal-column-one {
    /* width: #portal-columns.width - #portal-column-two.width + #portal-column-one.width */            
    margin-left: -768px;
}


/* fullscreen */
body.fullscreen #portal-column-one,
body.fullscreen #portal-column-two {
    display: none;
}
body.fullscreen #portal-column-content { 
    width: 100%; 
    margin: 0; 
    padding: 0; 
}
