﻿@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,400italic,600,700);
@font-face {
font-family:"FontAwesome";
src:url('../font/fontawesome-webfont.eot');
src:url('../font/fontawesome-webfont.eot?#iefix') format('eot'),
	url('../font/fontawesome-webfont.woff') format('woff'),
	url('../font/fontawesome-webfont.ttf') format('truetype'),
	url('../font/fontawesome-webfont.svg#FontAwesome') format('svg');
font-weight:normal;
font-style:normal;
}

/*/ fonts /*/

html {
font-size:62.5%;
-moz-font-feature-settings:'liga=1';
-ms-font-feature-settings:'liga';
-webkit-font-feature-settings:'liga';
-o-font-feature-settings:'liga';
font-feature-settings:'liga';
}
body, button, input, legend, select, textarea {
font:15px/25px 'Open Sans',verdana,'Bitstream Vera Sans',sans-serif;
font-size:1.5rem;
line-height:2.5rem;
}
pre, code, kbd, samp {
font-family:consolas,'Courier New',monospace;
font-size:1.15em;
}
abbr, blockquote, h1, h4, .button, #intro h2 {
font-weight:600;
}
#intro h1, #crumbtrail {
font-weight:300;
}

/*/ basics /*/

html {
-webkit-overflow-scrolling:touch;
-webkit-tap-highlight-color:rgba(0,0,0,0);
-webkit-text-size-adjust:100%;
-ms-text-size-adjust:100%;
}
html, legend {
color:#333333;
}
body {
margin:0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section,
.article, .aside, .details, .figcaption, .figure, .footer, .header, .hgroup, .nav, .section {
display:block;
}
::selection, ::-moz-selection {
background:#e0e0e0;
color:#555;
text-shadow:none;
}
:focus {
outline:0;
}
a:link, a:visited {
color:#005695;
}
a:hover, a:focus, a:active {
text-decoration:none;
color:#e04;
}
.article, .aside, blockquote, caption, dl, form, p, ol, table, ul {
margin:0 0 15px;
margin:0 0 1.5rem;
}
ol {
padding:0 0 0 30px;
padding:0 0 0 3rem;
}
blockquote {
border-left:3px solid #d8d8d8;
border-width:.3rem;
padding:0 0 0 17px;
padding:0 0 0 1.7rem;
}
img {
border:0;
-ms-interpolation-mode:bicubic;
}
h1, h2, h3, h4, h5, h6 {
font-size:inherit;
line-height:inherit;
margin:0 0 15px;
margin:0 0 1.5rem;
}
h1 {
font-size:30px;
font-size:3rem;
line-height:40px;
line-height:4rem;
text-align:center;
}
h2 {
font-size:19px;
font-size:1.9rem;
line-height:30px;
line-height:3rem;
}
h3 {
font-size:16px;
font-size:1.6rem;
}
h4, h5, h6 {
font-size:16px;
font-size:1.6rem;
margin:0;
}
h5 {
font-weight:normal;
}
h6 {
font-weight:normal;
font-style:italic;
}
em, i, ins {
font-style:italic;
}
strong, b {
font-weight:bold;
}
abbr {
text-transform:lowercase;
font-variant:small-caps;
letter-spacing:.1rem;
}
abbr[title] {
border-bottom:1px dotted;
border-width:.1rem;
cursor:help;
}
del {
text-decoration:line-through;
}
mark {
background:#e0e0e0;
color:#555;
}
sub {
bottom:-.25em;
}
sup {
top:-.5em;
}
sub, sup {
font-size:75%;
line-height:0;
position:relative;
vertical-align:baseline;
}
blockquote {
margin:35px 0;
margin:3.5rem 0;
font-weight:bold;
font-size:16px;
font-size:1.6rem;
}
cite {
font-style:italic;
}
q {
quotes:none;
}
q:before {
content:'« ';
}
q:after {
content:' »';
}
dd, li {
margin:0 0 5px;
margin:0 0 .5rem;
}
dt {
font-weight:bold;
}
ul {
list-style:circle;
list-style-image:url(../imgs/list_item.png);
padding:0 0 0 15px;
padding:0 0 0 1.5rem;
}
ol ol, ol ul, ul ol, ul ul {
margin:0;
}

/*/ tables /*/

caption {
margin:0 0 15px;
margin:0 0 1.5rem;
font-style:italic;
color:#5e5d5c;
text-align:left;
}
table {
border-spacing:1px;
width:100%;
text-align:left;
vertical-align:middle;
border: 1px solid gray;
}
td, th {
padding:5px 2% 4px;
padding:.5rem 2% .4rem;
background:#fff;
border-width:.1rem;
vertical-align: top;
border: 1px solid gray;
}
tfoot {
font-weight:bold;
}
th {
text-transform:uppercase;
letter-spacing:.1rem;
background:#3d3c3b;
color:#eee;
}

/*/ icons /*/

.more span, .button span, .back span, #up span, #crumbtrail span, .navToggle span {
text-indent:0;
display:inline-block;
}
.more span:after, .back span:before, #up span:after, #crumbtrail span:after,
#subnav .current a:after, .navToggle span:after, a.imgWrapper:after {
font-family:FontAwesome;
font-weight:normal;
font-style:normal;
display:inline-block;
width:15px;
width:1.5rem;
vertical-align:baseline;
font-size:.85em;
letter-spacing:0;
text-decoration:none;
}
.more span:after, #crumbtrail span:after, #subnav .current a:after {
content:"\f054";
text-align:right;
}
.back span:before {
content:"\f053";
text-align:left;
}
.navToggle span:after {
content:"\f0d7";
width:20px;
width:2rem;
}
.open span:after {
content:"\f0d8";
}
#up span:after {
content:"\f077";
}
a.imgWrapper:after {
content:"\f00e";
text-align:center;
}

/*/ generic styles /*/

.inner {
margin:0 auto;
max-width:37.5em;
min-width:20em;
text-align:left;
padding:25px 4%;
padding:2.5rem 4%;
}
.article {
margin:0 0 25px;
margin:0 0 2.5rem;
}
.aside {
font-style:italic;
}
.section {
padding:0 0 4px;
padding:0 0 .4rem;
border-bottom:1px solid #d8d8d8;
border-width:.1rem;
margin:0 0 25px;
margin:0 0 2.5rem;
width:100%;
overflow:hidden;
}
.codeBlock {
display:block;
white-space:pre;
white-space:pre;
word-wrap:break-word;
overflow-x:auto;
padding:10px 2%;
padding:1rem 2%;
background:#f0f0f0;
margin:0 0 25px;
margin:0 0 2.5rem;
}
.imgWrapper {
overflow:hidden;
display:block;
margin:0 0 20px;
margin:0 0 2rem;
padding:3px;
padding:.3rem;
position:relative;
}
.imgWrapper.left {
float:left;
margin:0 20px 10px 0;
margin:0 2rem 1rem 0;
max-width:40%;
}
.imgWrapper.right {
float:right;
margin:0 0 10px 20px;
margin:0 0 1rem 2rem;
max-width:40%;
}
.imgWrapper img {
width:auto !important;
width:100%;
max-width:100%;
display:block;
border:5px solid #fff;
border-width:.5rem;
}
a.imgWrapper:after {
width:30px;
width:3rem;
height:30px;
height:3.0rem;
padding:10px 8px 0 2px;
padding:1rem .8rem 0 .2rem;
position:absolute;
bottom:8px;
bottom:.8rem;
left:8px;
left:.8rem;
background:#000;
color:#fff;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter:alpha(opacity=50);	
opacity:.5;
font-size:22px;
line-height:30px;
font-size:2.2rem;
line-height:3.0rem;
}
a:hover.imgWrapper:after {
opacity:.75;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
filter:alpha(opacity=75);		
}

/*/ buttons /*/

a.button, a.bigButton {
display:inline-block;
padding:5px 10px;
padding:.5rem 1rem;
background:#005695;
color:#ecf1f4;
text-decoration:none;
}
a.more, a.back, #up {
text-decoration:none;
}
a.button:hover, a.button:focus, a.button:active {
background:#3277a9;
color:#fff;
}
a.bigButton {
background:#fff;
color:#e04;
font-weight:600;
padding:7px 12px 6px;
padding:.7rem 1.2rem .6rem;
border:1px solid #c2c1c1;
border-width:.1rem;
}
a.bigButton:hover, a.bigButton:focus, a.bigButton:active {
background:#fff;
color:#e04;
}

/*/ style /*/

body {
background:#f5f5f5;
text-align:center;
}
#accessibility {
position:absolute;
left:-9999px;
width:1px;
height:1px;
overflow:hidden;
}

/*/ header /*/

#header {
background:#fff;
}
#logo {
display:block;
padding:13px 0 12px;
padding:1.3rem 0 1.2rem;
}
#logo img {
display:block;
margin:0 auto;
width:33%;
max-width:300px;
}

/*/ nav /*/

#nav {
background:#005695;
}
#nav a {
display:block;
color:#c7d8e5;
padding:7px 0 7px;
padding:.7rem 0 .7rem;
text-decoration:none;
font-weight:bold;
border-bottom:1px solid #3277a9;
border-width:.1rem;
}
#nav a:hover, #nav a:focus, #nav a:active, #nav a.current {
color:#fff;
}

/*/ subnav /*/

#subnav {
background:#003459;
}
#subnav .inner {
padding:10px 2%;
padding:1rem 2%;
}
.navToggle {
font-weight:bold;
padding:15px 6% 15px 2%;
padding:1.5rem 6% 1.5rem 2%;
color:#005695;
background:#f5f5f5;
text-align:left;
cursor:pointer;
margin:0 auto;
}
.navToggle span {
float:right;
text-align:center;
font-size:1.3333em;
width:5%;
margin:0 -5% 0 0;
}
#subnav ul {
display:none;
margin:5px auto 0;
margin:.5rem auto 0;
padding:0;
list-style:none;
text-align:left;
overflow:hidden;
}
#subnav .current ul, #subnav .open ul {
display:block;
}
#subnav li {
padding:0;
margin:0 0 1px;
margin:0 0 .1rem;
}
#subnav a {
padding:10px 2% 9px;
padding:1rem 2% .9rem;
display:block;
background:#f5f5f5;
text-decoration:none;
font-weight:bold;
}
#subnav li ul {
margin:0;
padding:0;
}
#subnav li li {
margin:0;
}
#subnav li li a {
padding-left:4%;
border-top:1px solid #c7d8e5;
border-width:.1rem;
margin:0;
font-weight:600;
}
#subnav .current a:after {
display:none;
}

/*/ content /*/

#content {
background:url(../imgs/pattern_top.png) repeat-x center top;
}
#content .inner {
padding-bottom:5px;
padding-bottom:.5rem;
}

/*/ footer /*/

#footer {
background:#1c1b1a url(../imgs/pattern_bottom.png) repeat-x center bottom;
color:#eee;
}
#footer .inner {
padding:40px 4% 80px;
padding:4rem 4% 8rem;
}
#footer .aside {
border-bottom:1px solid #3d3c3b;
border-width:.1rem;
padding:0 0 10px;
padding:0 0 1rem;
margin:0 0 24px;
margin:0 0 2.4rem;
font-style:normal;
}
#footer #contactinfo {
padding:0 0 25px;
padding:0 0 2.5rem;
}
#footer h1, #footer p, #footer dl, #footer .imgWrapper {
font-size:1em;
line-height:25px;
line-height:2.5rem;
margin:0 0 15px;
margin:0 0 1.5rem;
text-align:left;
}
#footer h1 {
color:#f5f5f5;
font-weight:bold;
}
#footer .address span {
display:block;
}
#footer dl {
padding:0;
}
#footer dt {
float:left;
margin:0 2% 0 0;
font-weight:normal;
}
#footer dd {
margin:0;
}
#footer a {
color:#fff;
}
#footer a.imgWrapper:after {
display:none;
}
#up {
display:block;
margin:0 auto;
padding:15px 0;
padding:1.5rem 0;
text-indent:-999em;
color:transparent;
line-height:0;
font-size:0;
}
#up span {
float:left;
width:100%;
display:block;
text-align:center;
color:#fff;
line-height:30px;
font-size:20px;
line-height:3rem;
font-size:2rem;
}

/*/ specific content /*/

#intro {
border-bottom:1px solid #d8d8d8;
}
#graphic .imgWrapper {
background:url(../imgs/glow.png) no-repeat center bottom;
background-size:100% auto;
padding:0 0 14px;
padding:0 0 1.4rem;
border-bottom:1px solid #d8d8d8;
border-width:.1rem;
}
#graphic .imgWrapper img {
border:0;
}
#default, #bottom {
background:#f1f1f1 url(../imgs/pattern_bottom.png) repeat-x center bottom;
padding:0 0 15px;
padding:0 0 1.5rem;
}
#default {
background-color:transparent;
}
#crumbtrail {
display:none;
font-size:24px;
font-size:2.4rem;
line-height:30px;
line-height:3rem;
}
#crumbtrail a, #crumbtrail span {
color:#807f7f;
text-decoration:none;
padding-right:5px;
padding-right:.5rem;
}
#crumbtrail a:hover, #crumbtrail a:focus, #crumbtrail a:active {
color:#e04;
}
#crumbtrail span:after {
font-size:14px;
font-size:1.4rem;
text-align:center;
position:relative;
vertical-align:top;
top:4px;
top:.4rem;
}
.pagination {
width:100%;
overflow:hidden;
padding:0 0 25px;
padding:0 0 2.5rem;
}
.pagination .button {
float:left;
white-space:nowrap;
margin:0 10px 10px 0;
margin:0 10px 1rem 0;
}
.pagination .more {
float:right;
margin-right:0;
}

/*/ icing on the cake /*/

#nav {
-webkit-text-shadow:0 -1px 0 rgba(0,0,0,.4);
-moz-text-shadow:0 -1px 0 rgba(0,0,0,.4);
-o-text-shadow:0 -1px 0 rgba(0,0,0,.4);
text-shadow:0 -1px 0 rgba(0,0,0,.4);
}
#footer {
-webkit-text-shadow:0 -1px 0 rgba(0,0,0,.8);
-moz-text-shadow:0 -1px 0 rgba(0,0,0,.8);
-o-text-shadow:0 -1px 0 rgba(0,0,0,.8);
text-shadow:0 -1px 0 rgba(0,0,0,.8);
}
.button, .bigButton, .codeBlock, .navToggle, #subnav ul, #subnav li, .imgWrapper img {
border-radius:3px;
-webkit-border-radius:.3rem;
-moz-border-radius:.3rem;
-o-border-radius:.3rem;
border-radius:.3rem;
}
#subnav li ul, #subnav li li {
-webkit-border-radius:0;
-moz-border-radius:0;
-o-border-radius:0;
border-radius:0;
}
a.imgWrapper:after {
border-radius:0 40px 0 0;
-webkit-border-radius:0 4rem 0 0;
-moz-border-radius:0 4rem 0 0;
-o-border-radius:0 4rem 0 0;
border-radius:0 4rem 0 0;
}
.imgWrapper img {
-webkit-box-shadow:0 .1rem .3rem rgba(0,0,0,.25);
-moz-box-shadow:0 .1rem .3rem rgba(0,0,0,.25);
-o-box-shadow:0 .1rem .3rem rgba(0,0,0,.25);
box-shadow:0 .1rem .3rem rgba(0,0,0,.25);
}
#intro .imgWrapper img {
-webkit-box-shadow:none;
-moz-box-shadow:none;
-o-box-shadow:none;
box-shadow:none;
}
.button {
-webkit-text-shadow:0 -1px 0 rgba(0,0,0,.4);
-moz-text-shadow:0 -1px 0 rgba(0,0,0,.4);
-o-text-shadow:0 -1px 0 rgba(0,0,0,.4);
text-shadow:0 -1px 0 rgba(0,0,0,.4);
}
.codeBlock, .navToggle, .bigButton {
-webkit-text-shadow:0 1px 0 rgba(255,255,255,.8);
-moz-text-shadow:0 1px 0 rgba(255,255,255,.8);
-o-text-shadow:0 1px 0 rgba(255,255,255,.8);
text-shadow:0 1px 0 rgba(255,255,255,.8);
}
.navToggle, a.bigButton {
background-image:linear-gradient(bottom, #F0F0F0 0%, #FFFFFF 66%);
background-image:-o-linear-gradient(bottom, #F0F0F0 0%, #FFFFFF 66%);
background-image:-moz-linear-gradient(bottom, #F0F0F0 0%, #FFFFFF 66%);
background-image:-webkit-linear-gradient(bottom, #F0F0F0 0%, #FFFFFF 66%);
background-image:-ms-linear-gradient(bottom, #F0F0F0 0%, #FFFFFF 66%);
background-image:-webkit-gradient(linear, left bottom, left top, color-stop(0, #F0F0F0), color-stop(0.66, #FFFFFF));
}

/*/ js helpers /*/

#small .toggle ul {
display:none;
}
#small .toggle ul ul {
display:block;
}
#siteWrapper [data-android-only] {
display:none;
}

/*/ media queries - small (small tablet, tablet portrait) /*/

@media screen and (min-width: 28em) and (max-width: 61em) {
	#nav a {
	display:inline-block;
	border:0;
	padding:15px 1%;
	padding:1.5rem 1%;
	}
	#nav a.current {
	background-image:url(../imgs/current.png);
	background-position:center bottom;
	background-repeat:no-repeat;
	}
	#logo {
	padding:25px 0;
	padding:2.5rem 0;
	}
	#contactinfo {
	width:100%;
	overflow:hidden;
	}
	#footer .imgWrapper {
	float:right;
	width:46%;
	margin:0 0 0 8%;
	}
	#graphic h1, #graphic h2 {
	text-align:center;
	}
}

/*/ js helpers /*/

@media screen and (max-width: 61em) {
	#dummy {
	font-weight:100;
	display:none;
	}
}
@media screen and (min-width: 61em) and (max-width: 110em) {
	#dummy {
	font-weight:200;
	display:none;
	}
}
@media screen and (min-width: 90em) and (min-height: 40em), print {
	#dummy {
	font-weight:300;
	display:none;
	}
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
	#dummy {
	font-weight:400;
	display:none;
	}
}