/*  ///////////////////////////////////////////////////////////////////////////
    //                                                                       //
    //  START OF FILE                                                        //
    //                                                                       //
    //  - File Name:        /clients/css/columns.css                         //
    //  - File Type:        Cascading Style Sheet File                       //
    //  - Purpose:          Loads all the website's styling and layout ID's  //
    //                      and classes                                      //
    //  - Editing:          Level 4                                          //
    //  - Description:      All styles and layout's, through use of ID's and //
    //                      classes, are managed and defined here            //
    //  - Notes:            This file should perhaps be broken up to be more //
    //                      comprehensable                                   //
    //  - Created By:       onassar (unknown precise date)                   //
    //  - Editted By:                                                        //
    //                                                                       //
    /////////////////////////////////////////////////////////////////////////*/

/* Set the entire body margins and paramters */
body
{
    margin:              20px;
    padding:             0px;

    /* was Tahoma */
    font:                13px Helvetica, arial, helvetica, sans-serif;
    color:               #808080;
}
/* Set the H1 element, along with it's weight and position */
h1
{
    margin:             0px;
    padding-bottom:     0px;
    padding-top:        10px;
    padding-left:       3px;
    padding-right:      3px;

    background-color:   white;
/* 
    height:             68px; */
    width:              auto;
/*     height:             inherit; */

    font-weight:        900;
    font-size:          36px;
}
/* Set the H1 hack, used primarily for Mozilla based browsers */
html>body h1
{
    height:             58px;
}
/* Set the H2 tag, with margins and coloring (which may be reset via on page css loading) */
h2
{
    margin:             0px;

    padding-top:        0px;
    padding-right:      0px;
    padding-bottom:     0px;
    padding-left:       5px;

    width:              auto;

    font-size:          20px;
    line-height:        24px;
}
/* Set the H3 tag, with margins and coloring (which may be reset via on page css loading) */
h3
{
    margin:             0px;

    padding-top:        0px;
    padding-right:      0px;
    padding-bottom:     0px;
    padding-left:       5px;
/*
    width:              auto;*/
/* The font-size being non-24 allows for g's to be rendered properly (loop isn't cut off in some browsers) */
    font-size:          20px;
    line-height:        24px;

}
/* Set the paragraph tag, with default padding */
p
{
    margin:             0;
    padding-top:        0px;
    padding-bottom:     0px;

    padding-left:       4px;
    padding-right:      4px;

    background-color:   white;
}/* this is used on pages where WYSIWYG editor is used, to make background colour proper */
font
{
    background-color:   white;
    display:            block;
}
/* Set the anchor tag, with coloring and weight */
a
{
    text-decoration:    none;
    font-weight:        900;
}
/* Set the anchor tag hover properties */
a:hover
{
    border-bottom:      2px dashed #808080;
}
.img a:hover
{
    text-decoration:    none;
    border-bottom:      none !important;
}
/* Set the table tag, with font being inheritted
   Note the width of the table, 95% always to make sure no overflow distorting javascript borders */
table
{
    margin:             0px;
    padding:            0px;

/* Using width: 95% !important solves Opera rendering borders problem, but screws up general table widths in
   IE and Firefox, so if Opera, include custom CSS code on each page saying width: auto; */
/*    width:              95%;*/

    /* the font-size is the same as the page font-size
       note: useful if need to fit something into a main table, can lower font */
    font-size:          12px;
}
/* Set the form tag, with margins an padding */
form
{
    margin:             0px;
    padding:            0px;
    background-color:   white;
}
/* Set the custom header ID, which is used for specifying the general height of the header */
#header
{/* 
    height:             100px; */
}
/* Set the custom header_left ID, which defines properties for the headers left portion */
#header_left
{
    position:           absolute;
    left:               20px;
    width:              200px;/*
    background-color:   #fff; */
}
/* Set the customer header_center ID, which defines properties for the headers center portion */
#header_center
{
    margin-left:        210px;
    width:              630px;
    margin-bottom:      10px;
}
/* Set the custom header_right ID, which defines properties for the headers right portion */
#header_right
{
    position:           absolute;
/* CAUTION */
/* This is used to distinguish exactly how far away from the left the right column should start */
    left:               870px;
/* CAUTION */
    top:                20px;
    width:              200px;/* 
    background-color:   #fff; */
}
/* Set the left column properties (custom ID) */
#left
{
    position:           absolute;
    left:               20px;
    top:                175px;
    width:              200px;/* 
    background-color:   #fff; */
}
/* Create Mozilla hack, to re-adjust top of the left ID
   Note: this may not be needed, since appears to be same as normal left ID property */
html>body #left
{
/*     top:                170px; */
}
/* This general class is used when creating a menu section (left/right menus) */
/* Note: I don't think this is used anywhere, consider checking and then removing */
.menu
{
    margin:             0px 10px 20px 0px;
    border:             1px solid #C8EADB;
    padding:            2px;
}
/* This is used when the menu that is to created is an exandable one (thus part of the expand class) */
.menu_expand
{
    overflow:           hidden;
    height:             39px;
}
/* menu_head class controls the properties of the text in the menu headers (eg. My Info) */
.menu_head
{
    margin-bottom:      5px;
}
/* side_menu_text class is the actual content of the side menus (eg. The info in the 'My Info' section) */
.side_menu_text
{
    width:              162px;
    margin-left:        35px;
}
/* This creates a hack for the Mozilla browsers, making width auto, rather than fixed (since Mozilla renders
   differently, thus making it smaller/larger */
html>body .side_menu_text
{
    width:              auto;
    /* this is done so that the menu images are formatted properly with spacing to the right of the image*/
    margin-left:        38px;
}
/* This is the actual text in the center div tags (eg. the real content of the CMS) */
.center_menu_text
{
    width:              592px;
    margin-left:        35px;
}
/* Sets a hack for the Mozilla browsers for the center main content (again, auto, since width's do not agree) */
html>body .center_menu_text
{
    width:              auto;
    /* this is done so that the menu images are formatted properly with spacing to the right of the image*/
    margin-left:        38px;
}
/* This ID controls the center column as a whole, and it's properties */
#center
{
    margin-left:        210px;
    width:              630px;/*
    margin-top:         -10px;*/
    padding-top:        1px;
}
/* This creates a hack for the center column, since Mozilla browsers render the elements above it differently
   thus shifting this a little to upwards/downwards */
html>body #center
{/* 
    margin-top:         50px;
    padding-top:        -0px; */
}
/* Define the right hand column ID with it's properties for position and styles */
#right
{
    position:           absolute;
    padding-top:        0px;
    left:               870px;
    top:                170px;/*
    width:              200px;
    background-color:   #fff;
    top:                140px;*/
}
/* Define the footer ID, which managers the footer content on each page */
#footer
{
    width:              630px;
    margin-left:        210px;
/*
    margin-top:         5px;*/
}
/* Define the right hand column with a hack for Mozilla
   Note: not sure if this is neccessary since above standard has same top defined */
html>body #right
{
    top:                170px;
}

/* Define the footer_con class, which handles the wording of the footer (actual p structures) */
.footer_con
{
    text-align:         center;
    margin-top:         20px;
    font-size:          14px;
}
/* Defines the margins of a bordered section (using niftyCorners) */
.bordered_section
{
    margin:             0px 0px 5px 0px;
}
/* Defines the margins of a bordered section, as a menu (using niftyCorners) */
.menu_brded_section
{
    margin:             0px 0px 5px 0px;
}
/* Defines the H4 tag, used in various places (no set place like the H1,2,3 tags) */
h4
{
    margin:             0px;

    padding-top:        0px;
    padding-right:      0px;
    padding-bottom:     0px;

    font-size:          14px;
    padding-left:       5px;
/*
    width:              auto;*/
}
/* This class defines the properties of the top-left icons in the side menu headers */
.menu_img
{
    float:              left;
    width:              34px;
}
/* This class defines the properties of the top-left icons in the center headers*/
.cen_men_img
{
    float:              left;
    width:              34px;
}
/* This class menu_img_p, is a holder for the above menu_img class, needed since it contains a paragraph call, which
   makes it's width appropriate (see p tag for more info on the width for normal and Mozilla browsers) */
.men_img_p
{
/* Note: I didn't change these following properties when switching from 20x20 to 24x24 quick view images */
    padding-left:       4px;
    padding-right:      3px;
    margin-bottom:      0px;
}
/* This is a hack for the menu_img_p class, which arranges it's bottom margin (again, Mozilla rendering) */
html>body .men_img_p
{
  
    margin-bottom:     0px;
    /* opera needs -3px to display properly, designed for firefox here though */
}
/* This relates to ALL img tags, and makes it such that they never have a border unless defined by the image
   itself, or by an !important statement */
/* Note: look into other sites, and how they make sure img links don't have the same underline effects
   (eg. topfloridavacations.com) */
img
{
    border:             none; 
}
/* This class is used for the color chooser application, and simply creates a small box full of color and
   with a border */
.color_chooser_div
{
    border:             1px solid black;
    width:              20px;
    height:             20px;
}
/* This class defines the vote meter, used in permission slips and surveys */
.vote_meter
{
/*    position:             absolute;
    margin-top:           -5px;
    overflow:             hidden;*/
    float:              left; 
    margin-top:         1px;
}
/* This class meter_votes is used in the same area, but only to display the number of votes */
.meter_votes
{
    position:             absolute;
    margin-top:           -8px;
    width:                100px;
}
th
{
    text-decoration:      underline;
    text-align:           left;
    font-weight:          900;
}
input
{
    font-family:          Tahoma, Helvetica, arial, helvetica, sans-serif;
    font-size:            15px;
}
textarea
{
    font-family:          Tahoma, Helvetica, arial, helvetica, sans-serif;
    font-size:            14px;
}
.profile_card
{
    position:             absolute;
    width:                225px;
    visibility:           hidden;
}
hr
{
    border:               0;
    height:               1px;
}
.content_holder
{
    padding-left:         4px;
    padding-right:        4px;
    background-color:     white;
}
.calendar_cell_active
{
    width:                40px;
    border:               1px solid black;
    font-size:            18px;
    height:               40px;
}
.calendar_cell_inactive
{
    width:                40px;
    border:               1px solid black;
    font-size:            18px;
    height:               40px;
}
.calendar_prev
{/* 
    left:                 20px; */
    font-size:            14px;/* 
    position:             absolute; */
}
.calendar_next
{/* 
    left:                 250px; */
    font-size:            14px;/* 
    position:             absolute; */
}
ol
{
  padding:                0px;
  margin:                 0px;
  background-color:       white;
  padding-left:           50px;
}
/* added: April 19: 11:12 PM */
#page_main_center {
    height:               auto;
}
/*  ///////////////////////////////////////////////////////////////////////////
    //                                                                       //
    //  END OF FILE                                                          //
    //                                                                       //
    /////////////////////////////////////////////////////////////////////////*/