/**
*
* @note             css file for layout elements
* 
* @appdef           front end starter kit
* @app-myapp-theme  
* @app-myapp-used   True
* @media            screen
* @valid            true
* 
* @author           Alp Uçkan
* @version          1.0
* @link             http://alp-uckan.net/free/frontend-starterkit/
* @copyright        Copyright(c) by Alp Uçkan
* @license          http://creativecommons.org/licenses/GPL/2.0/
* 
* @date             2008-09-22
* @lastmodified     2008-11-29 21:21
* 
* @colordef         rgb(0,0,0); Black; Text
* @colordef         rgb(255,255,255); White; Background
*/


/**
* @section                      html elements
*/

body                            {
                                color: #000;
                                background-color: #fff;
                                }
#Canvas                         {
                                width: 100%;
                                width: 50em;
                                margin: 0 auto 1em auto;
                                }

/**
* @section                      faux absolute positioning
*/

.screen                         {
                                float: left;
                                width: 100%;
                                display: block;
                                position: relative;
                                }
.section                        {
                                position: relative;
                                float: left;
                                left: 100%;
                                }

/**
* @section                      example faux absolute positioning
*/

#Section1                       {
                                margin-left: -98%;
                                width: 46%;
                                border: 1px solid #ccc;
                                }
#Section2                       {
                                margin-left: -48%;
                                width: 46%;
                                border: 1px solid #ccc;
                                }


/**
* @section                      2 cols (float)
*/


.two-col-container              {
                                width: 100%;
                                border: 1px solid #f00;
                                margin-bottom: 3em;
                                }
.two-col-container .col-left    {
                                width: 21.8em;
                                border: 1px solid blue;
                                float: left;
                                margin: 0 2em 0 0;
                                padding: 1em;
                                }
.two-col-container .col-right   {
                                width: 21.8em;
                                border: 1px solid purple;
                                float: left;
                                padding: 1em;
                                }

.two-col-container2             {
                                width: 100%;
                                border: 1px solid #f00;
                                margin-bottom: 3em;
                                }
.two-col-container2 .col-left   {
                                width: 21.8em;
                                border: 1px solid blue;
                                float: left;
                                padding: 1em;
                                }
.two-col-container2 .col-right  {
                                width: 21.8em;
                                border: 1px solid purple;
                                float: right;
                                padding: 1em;
                                }

* html .two-col-container .col-right   {
                                width: 16.9em;
                                }

/**
* @section                      3 cols (float)
*/

.three-col-cont                 {
                                width: 100%;
                                border: 1px solid #f00;
                                margin-bottom: 3em;
                                }
.three-col-cont .col1           {
                                width: 14.5em;
                                border: 1px solid blue;
                                float: left;
                                margin: 0 1em 0 0;
                                padding: 1em;
                                }
.three-col-cont .col2           {
                                width: 13.5em;
                                border: 1px solid purple;
                                float: left;
                                margin: 0 1em 0 0;
                                padding: 1em;
                                }
.three-col-cont .col3           {
                                width: 13.5em;
                                border: 1px solid orange;
                                float: left;
                                padding: 1em;
                                }