  ﻿/* 480 


Content Area Width: 446px

_____________________________________________________

320 and Up boilerplate extension

Author: Andy Clarke
Version: 0.9b
URL: http://stuffandnonsense.co.uk/projects/320andup/
License: http://creativecommons.org/licenses/MIT/
_____________________________________________________

1.ROOT
2.HEADINGS
3.TYPOGRAPHY
4.LINKS
5.FIGURES & IMAGES
6.TABLES
7.FORMS (See css/mylibs/forms.css)
8.BANNER â€” header[role="banner"]
9.NAVIGATION â€” nav[role="navigation"]
10.CONTENT
11.MAIN â€” div[role="main"]
12.WIDGETS â€”Â div[role="complementary"]
13.CONTENTINFO â€” footer[role="contentinfo"]
14.GLOBAL OBJECTS
15.VENDOR-SPECIFIC 
16.TEMPLATE SPECIFICS
17.MODERNIZR

*/

/* 1.ROOT */

body {
    width: 93% /* 446px */;
}

/* 2.HEADINGS */
/* 3.TYPOGRAPHY */
ul, ol {
    margin-left: 59px;
}

/* 4.LINKS */
/* 5.FIGURES & IMAGES */
/* 6.TABLES */
/* 6.1 Table Mimic */
.tableMimic .tableRow .tableDataCell input[type=text],
.tableMimic .tableRow .tableDataCell textarea {
    width: 426px;
}

.tableMimic .tableRow .tableDataCell select {
    width: 446px;
}

/* 7.FORMS (See css/mylibs/forms.css) */
/* 8.BANNER */

#headingInnerContainer #logo img {
    background-image: url('/content2/images/headerlogo_480.gif');
    height: 48px;
    width: 223px;
}

/* 9.NAVIGATION */
/* 10.CONTENT */
span.contentImageLeft-withCaption,
span.contentimageleft-withcaption,
span.contentImageRight-withCaption,
span.contentimageright-withcaption,
span.contentImageLeft-withCaption img,
span.contentimageleft-withcaption img,
span.contentImageRight-withCaption img,
span.contentimageright-withcaption img,
span.contentImageFull-withCaption,
span.contentimagefull-withcaption,
span.contentImageFull-withCaption img,
span.contentimagefull-withcaption img {
    max-width: 426px;
}

/** 10.1 Home Content **/
/** 10.XX Request More Info Form **/
div.design_content .requestInfoForm {
}
div.design_content .requestInfoForm input[type=text],
div.design_content .requestInfoForm textarea,
div.design_content .requestInfoForm ol.design_list_vertical {
	width:406px;
}


div.design_content .requestInfoForm select.fieldStyle1,
div.design_content .requestInfoForm select.fieldStyle2,
div.design_content .requestInfoForm select.fieldStyle3 {
	width:426px;
}
div.design_content .requestInfoForm input[type=text].fieldStyle1,
div.design_content .requestInfoForm textarea.fieldStyle1,
div.design_content .requestInfoForm input[type=text].fieldStyle2,
div.design_content .requestInfoForm textarea.fieldStyle2,
div.design_content .requestInfoForm input[type=text].fieldStyle3,
div.design_content .requestInfoForm textarea.fieldStyle3 {
	width:406px;
}
div.design_content .requestInfoForm .dateClass {
	width:319px;
}
div.design_content .requestInfoForm .finalButtonsContainer input[type=reset],
div.design_content .requestInfoForm .finalButtonsContainer input[type=submit] {
	width:426px;
}
div.design_content .requestInfoForm .specialFieldContainer.fieldStyle1,
div.design_content .requestInfoForm .specialFieldContainer.fieldStyle2,
div.design_content .requestInfoForm .specialFieldContainer.fieldStyle3 {
	width:416px;
}

/*** 10.XX Net Community ***/
.netCommunity-contentContainer .EventTable,
.netCommunity-contentContainer .EventTable * {
    max-width: 424px;
}


/** 10.X Event List **/
.eventListItem img {
    max-width: 406px;
}

/** 10.X Event Detail Page **/
.eventDetailPage-timeLocation {
    text-align: left;
}

.eventDetailPage-image {
    max-height: 268px;
    max-width: 203px;
    margin-right: 0;
    margin-left: 40px;
    float: right;
}

/* 11.MAIN */
/* 12.WIDGETS */
/** 12.2 HIGHLIGHTS **/
.contentWidget.highlight .item img {
    width: 220px;
}

body.homepage .contentWidget.highlight .item img {
    width: auto;
}

.contentWidget.highlight .item .image {
    float: right;
    margin: 0 0 0 20px;
}

.contentWidget.highlight .item h2 {
    margin-top: 0;
}

.contentWidget .moreInfo a {
    float: left;
}



/** 12.04 Link Depot **/
/** 10.X Employee List/Detail **/
.employeeList-categoryTitle {
    text-align: left;
}

.employeeList .item img {
    float: left;
    width: 100px;
    margin: 0 20px 0 0;
    text-align: left;
}

.employeeList-info {
    float: left;
    text-align: left;
}

.twoColumnLayoutContainer > .column1.column .employeeDetail .employeeList-info {
    max-width: 327px;
}

.employeeList .employeeList-contact .item,
.employeeDetail .employeeList-contact .item {
    margin: 0 15px 7px 0;
    display: block;
    float: left;
}

.employeeList .employeeList-contact .row,
.employeeDetail .employeeList-contact .row {
    overflow: visible;
    display: inline;
    clear: none;
    padding: 0;
}

.employeeList-contact .item {
    padding-left: 21px;
}

.employeeList-phone {
    background-position: -1px center;
}

.employeeList-email {
    background-position: -1px center;
}

.employeeList-office {
    background-position: -1px center;
}

.employeeList-fax {
    background-position: -1px center;
}

section.employeeDetail-container header > div {
    float: left;
    margin-left: 20px;
    overflow: hidden;
    max-width: 400px;
}

.employeeDetail header img {
    float: left;
    width: 160px;
    display: inline;
}

section.employeeDetail-container header hgroup h1 {
    font-size: 32px;
    margin-top: -7px;
}

/*** 12.04.1 One Column Link Depot ***/
.linkDepot1Col > .column {
    width: 446px;
}
/*** 12.04.1 Two Column Link Depot ***/
.linkDepot2Col > .column {
    width: 213px;
}
/*** 12.04.1 Three Column Link Depot ***/
.linkDepot3Col > .column {
    width: 135px;
}

    .linkDepot3Col > .column:first-child {
        width: 136px;
    }
/*** 12.04.1 Four Column Link Depot ***/
.linkDepot4Col > .column {
    width: 96px;
}

    .linkDepot4Col > .column:first-child {
        width: 98px;
    }
/** 12.X Ektron Map **/
.twoColumnLayoutContainer > .column1.column .ektronMapContainer .MapPane * {
    max-width: 444px !important; /* varies throughout media queries */
}

.ektronMapContainer #_dvDirection #__DirectionPane input[type=text] {
    width: 426px; /* varies throughout media queries, content width -20 for padding & border */
}

/* 13.CONTENTINFO */
/* 14.GLOBAL OBJECTS */
.only320 {
    display: none;
    visibility: hidden;
}

.only480 {
    display: block;
    visibility: visible;
}

.only768 {
    display: none;
    visibility: hidden;
}

.only992 {
    display: none;
    visibility: hidden;
}

/* 15.VENDOR-SPECIFIC */
/* 16.TEMPLATE SPECIFICS */
/* 17.MODERNIZR */
