@import url("../../parts/styles/global.css");

/*=====================================================( GLOBALS )===*/
/*===================================================================*/

html
{

}

BODY
{
	color: #000;
	font-family: Verdana, sans, arial, helvetica, sans-serif;
	/* this is okay because we're using the <meta name="viewport" ... /> thing */
	background-color: #fff;
	margin: 0;
	padding: 0;
}

/* Mobile browsers only */
/* @media only screen and (max-device-width: 480px) {       */
/*     #allContainer { -webkit-text-size-adjust:100% }                */
/* } */

a[name=top]
{
	display: block;
	height: 0;
	line-height: 0;
	font-size: 0;
}
#allContainer
{
    /* -webkit-text-size-adjust: none; */
}

/* custom image scaling for portrait mode; landscape mode at bottom */
.image { width: 100%; }
.image img { width: 100%; }



/* banner */


header .machinery
{
	padding: 17px 21px;
}

header.page
{
	position: relative;
	z-index: 2;
	background: #cacbcf;
	/* background: #494c60; */
	/* overflow: hidden; */

	box-shadow: 0 0 3ex 1ex rgba(0,0,0,0.3);
	-webkit-box-shadow: 0 0 3ex 1ex rgba(0,0,0,0.3);
	-moz-box-shadow: 0 0 3ex 1ex rgba(0,0,0,0.3);
}
header.page h1 /* the <h1> box gets the dimensions */
{
	padding: 1ex;
	margin: 0;
	text-align: center;
	color: white;

	/* d2d9e4 */

	background: rgb(168,189,226); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(168,189,226,1) 0%, rgba(99,106,132,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(168,189,226,1)), color-stop(100%,rgba(99,106,132,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(168,189,226,1) 0%,rgba(99,106,132,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(168,189,226,1) 0%,rgba(99,106,132,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(168,189,226,1) 0%,rgba(99,106,132,1) 100%); /* IE10+ */
	background: linear-gradient(top,  rgba(168,189,226,1) 0%,rgba(99,106,132,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a8bde2', endColorstr='#636a84',GradientType=0 ); /* IE6-9 */


	background: rgb(210,217,228); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(210,217,228,1) 0%, rgba(99,106,132,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(210,217,228,1)), color-stop(100%,rgba(99,106,132,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(210,217,228,1) 0%,rgba(99,106,132,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(210,217,228,1) 0%,rgba(99,106,132,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(210,217,228,1) 0%,rgba(99,106,132,1) 100%); /* IE10+ */
	background: linear-gradient(top,  rgba(210,217,228,1) 0%,rgba(99,106,132,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2d9e4', endColorstr='#636a84',GradientType=0 ); /* IE6-9 */

}
/* .inner header.page h1 */
/* { */
/* 	background: transparent; */
/* } */
.inner header.page h1
{
	font-size: 130%;
	text-align: left;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
header.page h1 a
{
	color: white;
	text-shadow: 0 -1px 1px rgba(0,0,0,0.5);
	text-decoration: none;
	font-weight: normal;
}
/* .inner header.page h1 a */
/* { */
/* 	color: rgba(0,0,0,0.5); */
/* 	text-shadow: 0 -1px 1px white; */
/* 	text-decoration: none; */
/* 	font-weight: normal; */
/* } */
header.page img
{
	display: inline-block;
	border: none;
}

a.fullSite
{
	display: block;
	text-align: center;
	padding: 1em;
	margin-top: 5px;

	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;

	color: white;
	text-decoration: none;
	font-weight: bold;

	background: rgb(80,143,114); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(80,143,114,1) 0%, rgba(45,87,67,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(80,143,114,1)), color-stop(100%,rgba(45,87,67,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(80,143,114,1) 0%,rgba(45,87,67,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(80,143,114,1) 0%,rgba(45,87,67,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(80,143,114,1) 0%,rgba(45,87,67,1) 100%); /* IE10+ */
	background: linear-gradient(top,  rgba(80,143,114,1) 0%,rgba(45,87,67,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#508f72', endColorstr='#2d5743',GradientType=0 ); /* IE6-9 */

}
a.fullSite:hover
{
	color: white;
	opacity: 0.5;
}

#mobileContent
{
	padding: 1.6em;
}

/* global stuff */
a {	color: #00009a; }
a:hover { color: #00e; }

/* SEARCH BAR */
.search.bar
{
	line-height: 60px;
	font-size: 100%;
}
.search.bar .fieldAndButton { width: 100%; }
.search.bar .searchField
{
	color: #666;

	font-size: 16px;
	font-size: 100%;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
    box-sizing: border-box;
	width: 100%;
	padding: 8px 48px 8px 8px;

	height: 44px;
	border-radius: 8px;
	border: 1px solid #bbb;
	box-shadow: inset 3px 3px 11px rgba(0, 0, 0, 0.1);
}
.search.bar A.searchButton
{
	display: inline-block;

    left: -6px;
    margin-left: -40px;
    position: relative;
	zoom: 1;
	border: none;
	background-color: transparent;
}
.search.bar A.searchButton img { display: block; width: 28px; height: 28px;}
.search.bar .searchControls { display: none; }


/* SEARCH RESULTS */

h2.search
{
	padding: 1ex;
	font-size: 130%;
}

footer .bumpOut
{
	position: relative;
	z-inde: 5;
	margin: -55px -21px 0 10px;
	float: right;
}
footer .backToTop > span
{
	display: table-cell;
	height: 65px;
	width: 3.4em;

	padding: 6px 6px 6px 15px;
	vertical-align: middle;
}
footer .backToTop
{
	background: #883333;
	color: white;
	border-radius: 5px 0 0 5px;
	border-radius: 100px 0 0 100px;
	text-align: center;
	display: table;
	asdfbox-shadow: 0 0 10px rgba(0,0,0,0.2);sdf
	-moz-box-shadow: 0 0 10px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
footer .upButton
{
	float: left;
	margin: 0 1em 1em 0;
	text-decoration: none;
	padding: 2px 6px;
	border: 1px solid #999;
	border-radius: 4px;
	background: rgba(255,255,255,0.3);
}
footer .upButton:hover
{
	background: rgba(255,255,255,0.6);
}


/*===================================================( HEADLINES )===*/
/*===================================================================*/

h1, h2, h3, nav.cookiecrumb
{
	font-family: 'Cardo', serif;
}

h4, h5
{
	font-size: 100%;
}
h1 { font-size: 160%; }
h2 { font-size: 150%; }
h3 { font-size: 150%; }
h4 {}
h1 a, h2 a, h3 a, h4 a, h5 a {}

/* intended for section intro and promotion headlines */
.sectionIntro h2, .promotion h3
{
	padding-bottom: 4px;
	margin-bottom: 9px;
}
.box > header > h2, .box > header > h3
{
	font-weight: bold;
	border-bottom: 2pt solid rgba(0,0,0,0.3);
}



/*==========================================( MAIN COLUMN PIECES )===*/
/*===================================================================*/

.mobileContent img
{
	max-width: 100%;
}

.summaryDisplay .image
{
    max-width: 42%;
}

.box .body
{
	/* text-align: justify; */
}

.centerColumn .box, .editorContentMain
{
}
.centerColumn .box h3
{
}
.centerColumn .box .body, .editorContentMain
{
}
.attachments
{
}
.centerColumn a, .editorContentMain a
{

}
.centerColumn a:hover, .editorContentMain a:hover
{

}

/* make room for fingers in attachments and quicklist */
.attachments .attachment
{
	padding: 7px 0;
}
.infoblock li
{
	padding: 5px 0;
}


h2 + time
{
	margin-top: -8px;
}
time
{
	opacity: 0.5;
}

/*==========================================( LEFT COLUMN PIECES )===*/
/*===================================================================*/

.leftColumn .box, .editorContentLeft
{
}
.leftColumn .box header
{
	background-color: #CCC;
	padding: 0.5em;
}
.leftColumn .box .body, .editorContentLeft
{
	padding: 1em;
}
.leftColumn a, .editorContentLeft a
{
}
.leftColumn a:hover, .editorContentLeft a:hover
{
}
A.goButton
{
	display: block;
	border: 1px solid #000;
	padding: 2px 3px 2px 3px;
	color: #000;
	text-decoration: none;
	font-weight: bold;
	font-size: 7pt;
	background-color: #ffcc33;
}
A.goButton:hover
{
	background-color: #969bb6;
}
/*=========================================( RIGHT COLUMN PIECES )===*/
/*===================================================================*/

.rightColumn .box, .editorContentRight
{
	margin-bottom: 2em;
}
.rightColumn .box header
{
	background-color: #CCC;
	padding: 0.5em;
}
.rightColumn .box .body, .editorContentRight
{
	color: #666;
	background: #f0f0f0;
	padding: 1em;
}
.rightColumn A, .editorContentRight a
{

}
.rightColumn A:hover, .editorContentRight a:hover
{

}

/*===============================================( FOOTER PIECES )===*/
/*===================================================================*/

footer
{
	padding: 17px 21px;
	background: #cacbcf;
	border-top: 2px solid rgba(0,0,0,0.15);
	box-shadow: 0 0 3ex 1ex rgba(0,0,0,0.3);
	-webkit-box-shadow: 0 0 3ex 1ex rgba(0,0,0,0.3);
	-moz-box-shadow: 0 0 3ex 1ex rgba(0,0,0,0.3);
	clear: both;
}
footer h2
{
	font-size: 120%;
	margin-bottom: 15px;
}
footer .verticalLogo_text a
{
	text-decoration: none;
}
footer nav
{
	margin-bottom: 2em;
}


footer .noNav
{
	margin-bottom: 1em;
	font-size: 120%;
}

footer nav.cookiecrumb
{
	margin: -17px -21px 17px -21px;
	padding: 8px 21px;
	background: rgba(255,255,255,0.2);
	border-bottom: 1px solid rgba(0,0,0,0.1);
}

footer.main div.text
{
	margin: 30px 0;
	opacity: 0.7;
}
footer.main .socialTools
{
	margin: 30px 0;
	opacity: 0.7;
}
footer.main .socialTools > a
{
	margin: 0 2px;
}
footer.main .socialTools h4
{
	position: relative;
	top: 2px;
    display: inline-block;
    line-height: normal;
    margin-right: 1ex;
}

/*===========================================( NAVIGATION PIECES )===*/
/*===================================================================*/

/* first, rules that apply to all navs */

/* nav links */
nav a
{
	color: #006;
}
nav ul
{
	padding: 0;
}
/* all top-level nav links */
nav > ul > li > a
{

}
/* hovers and highlights */
/* also, .open is used only by menu nav, and is distinct from .current */
nav li.current > a,
nav li.open > a,
nav li:hover > a
{
	color: #00a;
}


/* rules that apply to all block-link-style navs */
nav.block ul
{
	clear: both;
}

/* block-style links */
nav.block li a
{
	padding: 12px 1em;
	font-family: "Gudea", sans-serif;
	font-weight: bold;

	color: #333;
	display: block;

	background: rgba(0,0,0,0.1);
	background: -moz-linear-gradient(top, rgba(0,0,0,0.06) 0%, rgba(0,0,0,0.1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.1)), color-stop(100%,rgba(0,0,0,0.2))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0.2) 100%); /* Chrome10+,Safari5.1+ */
}
nav.block ul
{
	border: 1px solid rgba(0,0,0,0.2);
}

/* vertical block */
nav.vertical.block li a
{
	border-bottom: 1px solid rgba(0,0,0,0.2);
}
nav.vertical.block li:last-child a
{
	border-bottom: none;
}

/* inner page "top" nav */
nav.top.block li a
{
	border-left: 2px solid rgba(0,0,0,0.06);
	/* margin-left: 2px; */
	padding: 0 10px;
	height: 40px;
	line-height: 35px;
}
nav.top.block li a > *
{
	display: inline-block;
	vertical-align: middle;
}
nav.top.block li:first-child a
{
	border-left: none;
	margin-left: 0;
}

/* all top-level nav links */
nav.block > ul > li > a
{
}
/* hovers and highlights */
nav.block li.current > a,
nav.block li.open > a
{
	background-color: #ccc;
	box-shadow: inset 0 10px 20px rgba(0,0,0,0.3);
	-moz-box-shadow: inset 0 10px 20px rgba(0,0,0,0.3);
	-webkit-box-shadow: inset 0 10px 20px rgba(0,0,0,0.3);
}
nav.block li.current > a,
nav.block li.open > a
{
	color: #777;
	background: #eee;
}
nav.top li:last-child a
{
	border-right: none;
}
/* special cases */
nav li.subsections.empty span
{
	opacity: 0.5;
}


/* HORIZONTAL NAVS */

/* container */
nav.horizontal { background: none; }

/* home and top level sections */
nav.horizontal > ul  > li
{
	border-right: 1px solid #bbb;
	line-height: 180%;
	padding-right: 1.5ex;
	margin-left: 1.5ex;
}
nav.horizontal > ul  > li:last-child { border-right: none; }
nav.horizontal > ul  > li > a
{
	font-size: 100%;
}

/* hovers and highlights */
nav.horizontal li.current > a,
nav.horizontal li.open > a,
nav.horizontal li:hover > a
{

}



/* HORIZONTAL-BLOCK STYLE */

nav.horizontal.block
{
	background: #eee;
}

/* home and top level sections */
nav.horizontal.block > ul  > li
{
	/* padding and border for these are all on the link */
	margin: 0;
	padding: 0;
	border-right: none;
}
nav.horizontal.block > ul  > li > a
{
	border: none;
	border-left: 1px solid #bbb;
}
nav.horizontal.block > ul  > li:first-child > a { border-left: none; }

/* hovers and highlights */
nav.horizontal.block > ul  > li.current > a,
nav.horizontal.block > ul  > li.open > a,
nav.horizontal.block > ul  > li:hover > a
{
}



nav.cookiecrumb
{
	padding: 7px 15px;
	/* padding: 7px 7px 5px; */
	background: #eee;
	border-bottom: 1px solid rgba(0,0,0,0.1);
	line-height: 120%;
}
nav.cookiecrumb li
{
	display: inline;
	font-size: 100%;
	margin: 0;
}
nav.cookiecrumb li:last-child { font-weight: bold; }
nav.cookiecrumb li:last-child a { margin-bottom: 0; }
nav.cookiecrumb li:last-child .triangle { display: none; }
nav.cookiecrumb li > * { vertical-align: middle; }
nav.cookiecrumb a/* , nav.cookiecrumb li.open a, nav.cookiecrumb a, nav.cookiecrumb li.current a */
{
	display: inline;
	color: #000066;
}
nav.cookiecrumb a:hover
{
	/* background: rgba(0,0,0,0.4); */
	/* border-radius: 4px; */
}
nav.cookiecrumb a span { display: inline; }
nav.primary ul
{
	overflow: hidden;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
}
header nav.primary
{
	margin: 5px 0;
}

/* special style for when cookiecrumb is up in the header */
header nav.cookiecrumb
{
	background: transparent;
	border: none;
}
header nav.cookiecrumb a
{
	display: inline;
	/* color: rgba(255,255,255,0.6); */
	color: rgba(0,0,0,0.6);
}
header nav.cookiecrumb li:last-child a
{
	/* color: white; */
	color: black;
}
nav.cookiecrumb .triangle
{
	display: inline;
	margin: 0 1ex;
	opacity: 0.3;
}

.upButton
{
	position: relative;
}
.upButton span
{
	position: relative;
}
.upButton span, .backButton span
{
	font-size: 120%;
}
.upButton .explanation
{
	color: hsl(60,86%,10%);
	background: hsl(60,50%,85%);
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	box-shadow: 4px 4px 8px rgba(0,0,0,0.3);
	/* white-space: nowrap; */
	padding: 3px;
}
.upButton:hover
{
}
.upButton:hover .explanation
{
	display: block;
}


/* ================================================ */
/* == custom stuff, for display: table menu navs == */
/* ================================================ */

nav.table > ul
{
	display: table;
	width: 100%;
}
nav.table > ul > li
{
	display: table-cell;
	text-align: center;
}



nav.top ul
{
	/* background: #2d3d58; */
	/* background: #636a84; */
	border: none;
}
nav.top a
{
	/* border-right: 2pt solid rgba(255,255,255,0.1); */
}

/* ================================================ */
/* == both other blocks navs ====================== */
/* ================================================ */

/* nav.top a, nav.vertical a, nav.subsections ul a, */
/* nav.top a:hover, nav.vertical a:hover, nav.subsections ul a:hover */
nav.block li a, nav.block li a:hover
{
}

/* the hover is not working consistently, hmmm */
nav.block li.current a, nav.block li.open a, nav.block li a:hover
{
}
nav.block li.current a, nav.block li.open a
{
}

nav.subsections ul
{
	padding-left: 0;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	overflow: hidden;
}
nav.subsections header a, .noNav a
{
	text-decoration: none;
}

/*=================================================( CALENDAR PIECES )===*/
/*=======================================================================*/

/* calendar grid color */
.calMonth, .calMonth .calLinks { font-size: 120%; }
.calMonth table, .calDayHeading th, .calMonthHeading { background-color: #888888; }
.calDayHeading th { background: #aaaaaa; }
.calMonth td { border: 1px solid #888888; }
.calGrayDay
{
	background-color: #cccccc;
	color: #777777;
}
.calToday { background-color: #ffffdd; }

.eventTip
{
	color: black;
	color: rgba(0, 0, 0, 0.8);
    border-color: #525200;
	border-color: rgba(0,0,0,0.4);
	background-color: #ffff88;

	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	width: 200px;
}
.readmore.small { margin-top: 30px; font-size: 120%; }


/*=================================================( haxx0r )===*/
/*===============================================================*/

/* this rule is based on observation of City of Old Town's pasted
content from Word, and is designed to nullify the ways in which
certain styles that it brings with it break layout */
p[class^="Mso"], p.MsoNormal
{
	text-indent: 0 !important;
	margin: 0 !important;
}

font[size=2] { font-size: 100%; }

/* force images to be proportionally scaled to at most 100% width */
#mobileContent div:not(.noImageForcing) img
{
	height: auto !important;
	max-width: 100% !important;
}
#mobileContent div.noMobile { display: none; }
#mobileContent div.mobileOnly {	display: block; }

#mobileContent #tourbookdiv > img[style*=height\:168]
{
	height: 168px !important;
}

iframe
{
	max-width: 100% !important;
}
input
{
	max-width: 100% !important;
}


/*==============================( SPECIAL FOR DIFFERENT ORIENTATIONS )===*/
/*=======================================================================*/

@media screen and (orientation:portrait)
{
	.search.bar .searchField
	{
		/* display: block; */
		/* width: 100%; */
		/* padding: 8px; */
	}

	/* custom margins */
	.image.left, .image.right
	{
		margin: 16px 0;
	}

	/* dynaform field fix */
	DIV.formLabel, 	DIV.formLabelReq
	{
		float: none;
		text-align: left;
		width: auto;
	}
	.calDayHeading .medium { display: none; }
}
@media screen and (orientation:landscape)
{
	.image
	{
		width: 50%;
	}
}