﻿/* ---------------------------------------------------------------------------------

	File: 			layout.css
	Author: 		Walter Botich
	Created: 		08/14/07
	Modified:		03/25/09
	Description: 	Sets the default layout for the site
					Included as part of screen.css

---------------------------------------------------------------------------------- */

/* GLOBALS ----------------------------------------------------------------------- */

/* For IE6-7 page elements with width set to 100% */
/* 1.) Wrap the element with a div having this class, or 2.) class the parent container */
/* This prevents the element from running outside of their parent container */
.ie-bugfix-width {
    height: 1%;
}

/* For IE6-7 images */
/* Removes the extra pixel space below images */
.ie-bugfix-image {
    display: block;
}

/* For .NET controls that render as tables */
/* 1.) Wrap the element with a div having this class, or 2.) class the parent container */
/* This prevents .NET controls that are nested in tables from getting the parent table's attributes */
.net-bugfix-table table tr td {
    padding: 0;
    border-width: 0;
}

body {

}

/* Pop-up windows */
#popup {

}

/* Substitute for clear='all'(depricated) */
.clear {
    clear: both;
}

/* Force parent element to enclose any floated divs it contains */
.enclose-floats {
        /* IE fix because it does not recognize ':after' */
        zoom: 1;
    }
    .enclose-floats:after {
        content: ".";
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }
    
/* Container alignment */
.float-right {
    float: right;
}
.float-left {
    float: left;
}

/* Container visibility */
.hide {
    display: none;  
}
.show {
    display: inline;   
}

/* Columns */
.two-column, .three-column, .four-column {
    /* IE 5.5/6 bug fix */
    display: inline;
    /* end bug fix */
    float: left;
    margin: 0 10px 0 0;
}
    /* 2 column layout */
    .two-column {
        width: 45%;
    }
    /* 3 column layout */
    .three-column {
        width: 28%;
    }
    /* 4 column layout */
    .four-column {
        width: 20%;
    }

/* Scrollable region containers */
.scroll-vert, .scroll-horz {
    margin: 1em 0;
    overflow: auto;
    background: #ffffff;
    border: 1px solid #cccccc;
}
    .scroll-vert {
        /* IE bug fix */
        overflow-x: hidden;
        overflow-y: scroll;
        /* end bug fix */   
    }
    .scroll-horz {
        /* IE bug fix */
        overflow-x: scroll;
        overflow-y: hidden;
        /* end bug fix */
    }
    
/* Multimedia containers */
.media-video, .media-map, .media-interactive {
    margin: 1em 0;
    background: #000000;
    border: 1px solid #cccccc;
}
    .media-video {
        width: 332px;
        height: 290px;
    }
    .media-map {
        width: 100%;
        height: 450px;
    }
    .media-interactive {
        width: 680px;
        height: 200px;
    }


#mainContentContainer {
 border: 1px solid #000000;
 margin-bottom:15px;
 margin-top:15px;
 /*padding: .3em .3em .3em .3em*/
}

#pageHeaderContainer {
 border-bottom: 1px solid #000000;
 background-color:Gray;
 color: #ffffff;
 padding: .3em .3em .3em .3em
}

#pageContentContainer {
    padding: .5em .5em 1em .5em
}

.group-container {
    border: 1px solid #000000;
    margin-bottom:15px;
    margin-top:15px;
}

.group-header {
    border-bottom: 1px solid #000000;
    background-color:Gray;
    color: #ffffff;
    padding: .3em .3em .3em .3em
}

.group-content {
    border: 1px solid #000000;
    /*margin-bottom:15px;
    margin-top:15px;*/
}

.marker-pad {
    padding: 0 50px 0 0;
}

/* single bar of a bar graph */
.bar
{
    float: left;
    display: block;
    width: 200px;
    vertical-align: middle;
    border: 1px solid #dadada;
}
    .bar img 
    {
        display: block;
        height: 20px;
    }

/* UNIQUE PAGE CONTAINERS ----------------------------------------------------------- */

/* Can be used as the "root" container */
#page {

}
    
/* Header content */
#header {

}       

/* Navigation menus */
#nav-horz {
    
}

#nav-vert {
       
}

/* Main content */
#content {
    margin: 0;
}
    
/* Footer content */
#footer {

}

/* ADDITIONAL CLASSES --------------------------------------------------------------- */

/* Optional container for path information */
.breadcrumbs {

}

/* Optional containers for user authentication */
.login {
    width: 50%;
    margin: 1em auto;
}
.logout {

}

/* Optional container for search */
.search {
    
}

/* Optional container for separating body elements */
.section {

}
    .section h2, .section h3, .section h4, .section h5, .section h6 {
        font-family: Arial, Helvetica, sans-serif;
        color: #000000;
        font-weight: bold;
        margin: 0;
    }
    .section h2 {
        font-size: 1.8em;
    }
    .section h3 {
        margin-top: .5em;
        font-size: 1.6em;
        color: #6a82a4;
        text-transform: uppercase;
    }
    .section h5 {
        color: #000099;
    }
    
.small {
    font-size: .6em;
}

.comments-grouping {
    font-family: Arial, Helvetica, sans-serif;
    color: #000000;
    font-weight: bold;
    margin: 0;
    margin-top: .5em;
    font-size: 1.6em;
    color: #6a82a4;
    text-transform: uppercase;
}

.question {
    padding: 1em;
    margin: .5em 0;
}
    .question .number {
        float: left;
        display: inline-block;
        /* Firefox 2 bug fix */
        display: -moz-inline-box;
        /* end bug fix */
        width: 2em;
        height: 3.5em;
        margin-right: .5em;
        font-weight: bold;
        text-align: right;
    }
.question.alternate { background: #cccccc; }

/* Optional container for redundant, modularized page elements */
.module {
    
}

/* Optional container for providing additional information */
.details {
    
}

/* Optional container for advertisements */
.ad {
    
}

