/* Main CSS for: VCU Worksupport
 URL: worksupport.com
 Designed and developed by VCU University Relations
 /designer - Vincent Alfaro /
 /developer - Lauren Paul/
 /project manager - Eliza K Robinson /
 /Google fonts used: Droid Sans, 400 & 700 /
 */
 
/* NORMALIZE: normalize.css v1.0.1 | MIT License | git.io/normalize */

/* Corrects `block` display not defined in IE 6/7/8/9 and Firefox 3. */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary { display: block; }

/* Corrects `inline-block` display not defined in IE 6/7/8/9 and Firefox 3. */
audio, canvas, video { 
  display: inline-block;
  *display: inline;
  *zoom: 1;
}

/* Prevents modern browsers from displaying `audio` without controls. Remove excess height in iOS 5 devices. */
audio:not([controls]) { display: none; height: 0; }

/* Addresses styling for `hidden` attribute not present in IE 7/8/9, Firefox 3, and Safari 4. Known issue: no IE 6 support. */
[hidden] { display: none; }

/* 1. Corrects text resizing oddly in IE 6/7 when body `font-size` is set using `em` units.
 * 2. Prevents iOS text size adjust after orientation change, without disabling user zoom.
 */
html {
  font-size: 100%; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -ms-text-size-adjust: 100%; /* 2 */
}

/* Addresses `font-family` inconsistency between `textarea` and other form elements. */
html, button, input, select, textarea { font-family: sans-serif; }

/* Addresses margins handled incorrectly in IE 6/7. */
body { margin: 0; }

/* Links */
/* Addresses `outline` inconsistency between Chrome and other browsers. */
a:focus { outline: thin dotted; }

/* Improves readability when focused and also mouse hovered in all browsers. */
a:active, a:hover { outline: 0; }
/* Addresses font sizes and margins set differently in IE 6/7. Addresses font sizes within `section` and `article` in Firefox 4+, Safari 5, and Chrome. */
h1 { font-size: 2em; margin: 0.67em 0; }
h2 { font-size: 1.5em; margin: 0.83em 0; }
h3 { font-size: 1.17em; margin: 1em 0; }
h4 { font-size: 1em; margin: 1.33em 0; }
h5 { font-size: 0.83em; margin: 1.67em 0; }
h6 { font-size: 0.75em; margin: 2.33em 0; }

/* Addresses styling not present in IE 7/8/9, Safari 5, and Chrome. */
abbr[title] { border-bottom: 1px dotted; }

/* Addresses style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome. */
b, strong { font-weight: bold; }

blockquote { margin: 1em 40px; }

/* Addresses styling not present in Safari 5 and Chrome. */
dfn { font-style: italic; }

/* Addresses styling not present in IE 6/7/8/9. */
mark {  background: #ff0; color: #000; }

/* Addresses margins set differently in IE 6/7. */
p, pre { margin: 1em 0; }

/* Corrects font family set oddly in IE 6, Safari 4/5, and Chrome. */
code, kbd, pre, samp {
  font-family: monospace, serif;
  _font-family: 'courier new', monospace;
  font-size: 1em;
}

/* Improves readability of pre-formatted text in all browsers. */
pre {
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word;
}

/* Addresses CSS quotes not supported in IE 6/7. */
q { quotes: none; }

/* Addresses `quotes` property not supported in Safari 4. */
q:before, q:after { content: ''; content: none; }

/* Addresses inconsistent and variable font size in all browsers. */
small { font-size: 80%; }

/* Prevents `sub` and `sup` affecting `line-height` in all browsers. */
sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup { top: -0.5em; }
sub { bottom: -0.25em; }

/* Addresses margins set differently in IE 6/7. */
dl, menu, ol, ul { margin: 1em 0; }
dd { margin: 0 0 0 40px; }

/* Addresses paddings set differently in IE 6/7. */
menu, ol, ul { padding: 0 0 0 40px; }

/* Corrects list images handled incorrectly in IE 7. */
nav ul, nav ol { list-style: none; list-style-image: none; }

 /* 1. Removes border when inside `a` element in IE 6/7/8/9 and Firefox 3.
 * 2. Improves image quality when scaled in IE 7.
 */
img { border: 0; /* 1 */ -ms-interpolation-mode: bicubic; /* 2 */ }

/* Corrects overflow displayed oddly in IE 9. */
svg:not(:root) { overflow: hidden; }

 /* Addresses margin not present in IE 6/7/8/9, Safari 5, and Opera 11.*/
figure { margin: 0; }

/* Corrects margin displayed oddly in IE 6/7. */
form { margin: 0; }

/* Define consistent border, margin, and padding. */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/* 1. Corrects color not being inherited in IE 6/7/8/9.
 * 2. Corrects text not wrapping in Firefox 3.
 * 3. Corrects alignment displayed oddly in IE 6/7. */
legend {
  border: 0; /* 1 */
  padding: 0;
  white-space: normal; /* 2 */
  *margin-left: -7px;  /* 3 */
}

/* 1. Corrects font size not being inherited in all browsers.
 * 2. Addresses margins set differently in IE 6/7, Firefox 3+, Safari 5, and Chrome.
 * 3. Improves appearance and consistency in all browsers. */
button, input, select, textarea {
  font-size: 100%; /* 1 */
  margin: 0; /* 2 */
  vertical-align: baseline; /* 3 */
  *vertical-align: middle; /* 3 */
}

/* Addresses Firefox 3+ setting `line-height` on `input` using `!important` in the UA stylesheet. */
button, input { line-height: normal; }

/* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls.
 * 2. Corrects inability to style clickable `input` types in iOS.
 * 3. Improves usability and consistency of cursor style between image-type `input` and others.
 * 4. Removes inner spacing in IE 7 without affecting normal text inputs. Known issue: inner spacing remains in IE 6. */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button; /* 2 */
  cursor: pointer; /* 3 */
  *overflow: visible; /* 4 */
}

/* Re-set default cursor for disabled elements. */
button[disabled], input[disabled] { cursor: default; }

/* 1. Addresses box sizing set to content-box in IE 8/9.
 * 2. Removes excess padding in IE 8/9.
 * 3. Removes excess padding in IE 7. Known issue: excess padding remains in IE 6. */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
  *height: 13px; /* 3 */
  *width: 13px; /* 3 */
}

/*1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof). */
input[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box; /* 2 */
  box-sizing: content-box;
}

/* Removes inner padding and search cancel button in Safari 5 and Chrome on OS X. */
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/* Removes inner padding and border in Firefox 3+. */
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/* 1. Removes default vertical scrollbar in IE 6/7/8/9. 
 * 2. Improves readability and alignment in all browsers. */
textarea {
  overflow: auto; /* 1 */
  vertical-align: top; /* 2 */
}

/* Remove most spacing between table cells. */
table { border-collapse: collapse; border-spacing: 0; }

/* GLOBAL  ----------------------------------------------------------------------------------------------*/
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
}

html { font-size: 62.5%; /* Base 10 */ background-color: #ccc; }

body {
  font-family: "Droid Sans", Arial, sans-serif;
  font-weight: 400;
  background-color: #585553;
  margin: 0;
  padding: 0;
  position: relative;
  z-index: 1;
  zoom: 1;
}

/* LISTS ------------------------------------------------------------------------------------------------------------*/
ul, ol { line-height: 1.625em; }
ul li, ol li {
  font-size: 15px;
  font-size: 1.5rem;
  margin-bottom: 10px;
  line-height: 1.5em;
  color: #919191;
}

ul ul, ol ul, ul ol, ol ol {
  font-size: 1em;
  margin: 8px 0 0;
}

ol ol { list-style: lower-alpha; }

/* BASE TYPOGRAPHY ----------------------------------------------------------------------------------------------------------*/
p {
  -webkit-font-smoothing: antialiased;
  font-size: 15px;
  font-size: 1.5rem;
  line-height: 1.75em;
  color: #919191;
}

a {
  color: #0890cf;
  text-decoration: underline;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

a:hover, a:active, a:focus {
  outline: none;
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

h1 {
  -webkit-font-smoothing: antialiased;
  color: #f2a057;
  font-size: 27px;
  font-size: 2.7rem;
  font-weight: 700;
  font-family: "Droid Sans", Arial, sans-serif;
  line-height: 1em;
  letter-spacing: -0.0125em;
}

h2 {
  -webkit-font-smoothing: antialiased;
  color: #688c8c;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1.125em;
  padding-top: 4px;
}

h3 {
  -webkit-font-smoothing: antialiased;
  color: #f2a057;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 700;
}

h4 {
  -webkit-font-smoothing: antialiased;
  color: #688c8c;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: 700;
}

h5 {
  -webkit-font-smoothing: antialiased;
  color: black;
  font-size: 15px;
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: 0;
  line-height: 1.25em;
}

h6 {
  -webkit-font-smoothing: antialiased;
  color: black;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 700;
  margin-bottom: 0;
  line-height: 1.25em;
}

blockquote { text-align: center; margin-top: 0; margin-bottom: 0; }

blockquote p {
  color: #f2a057;
  font-family: Georgia, serif;
  font-weight: normal;
  font-size: 28px;
  font-size: 2.8rem;
  font-style: italic;
  line-height: 1.25em;
}

blockquote p .smallText { font-size: 18px; font-size: 1.8rem; }

hr {
  background-color: #EDEDED;
  border: 0 none;
  clear: both;
  color: #EDEDED;
  height: 1px;
  margin: 20px auto;
  width: 95%;
}

/* IMAGES ----------------------------------------------------------------------------------------------------------*/
img, embed, object, video {
  max-width: 100%;
  height: auto;
  width: auto\9; /* ie8 */
}

img { border: none; }

figure {
  width: auto;
  height: auto;
  margin: 0;
  zoom: 1;
}

figure img {
  margin: 0 auto;
  background-color: #fff;
  display: block;
  padding: 4px;
  border: 1px #e1e1e1 solid;
}
 
figure figcaption {
  color: #666666;
  font-size: 10px;
  font-size: 1rem;
  font-style: italic;
  padding: 8px 3px 2px 6px;
  text-align: right;
}

figure.img-right, img.img-right {
  float: right;
  margin: .25em 0 .5em 1.75em;
}

figure.img-left, img.img-left {
  float: left;
  margin: .25em 1.75em .5em 0;
}

figure.img-centered, img.img-centered { margin: 0 auto; }

.lt-ie8 figure {
  display: table;
  width: 140px;
}

/* TABLES -------------------------------------------------------------------------------------------------------------*/
table {
  font-size: 14px;
  font-size: 1.4rem;
  width: 100%;
  border: 1px #D8D8D8 solid;
  color: #666;
  -webkit-box-shadow: inset 0 1px 1px #c9c9c9;
  -moz-box-shadow: inset 0 1px 1px #c9c9c9;
  box-shadow: inset 0 1px 1px #c9c9c9;
  border-spacing: 0;
  border-collapse: collapse;
}

thead {
  background-color: #e9c98e;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f1d093), color-stop(100%, #dfc188));
  background-image: -webkit-linear-gradient(#f1d093, #dfc188);
  background-image: -moz-linear-gradient(#f1d093, #dfc188);
  background-image: -o-linear-gradient(#f1d093, #dfc188);
  background-image: linear-gradient(#f1d093, #dfc188);
  color: #fff;
}

th {
  padding: 8px 8px 8px 12px;
  text-shadow: 1px 1px 1px #888888;
  text-align: left;
}

td { color: #2e363c; padding: 6px 6px 6px 12px; }

.alt { background-color: #f7f7f7; }

#vcuIdentityWrapper {
  -webkit-box-shadow: 0 0 3px 0 #aaaaaa;
  -moz-box-shadow: 0 0 3px 0 #aaaaaa;
  box-shadow: 0 0 3px 0 #aaaaaa;
}

.lt-ie9 #vcuIdentityWrapper {
  min-width: 1400px;
  width: 100%;
  margin: 0 auto;
}

/* Responsive Tables - Styles for smaller screens */
@media only screen and (max-width: 767px) {
  table.responsive { margin-bottom: 0; }

  .pinned {
    position: absolute;
    left: 0;
    top: 0;
    background: #fff;
    width: 35%;
    overflow: hidden;
    overflow-x: scroll;
    border-right: 1px solid #ccc;
    border-left: 1px solid #ccc;
  }

  .pinned table {
    border-right: none;
    border-left: none;
    width: 100%;
  }

  .pinned table th, .pinned table td { white-space: nowrap; }

  .pinned td:last-child { border-bottom: 0; }

  div.table-wrapper {
    position: relative;
    margin-bottom: 20px;
    overflow: hidden;
    border-right: 1px solid #ccc;
  }

  div.table-wrapper div.scrollable table { margin-left: 35%; }

  div.table-wrapper div.scrollable { overflow: scroll; overflow-y: hidden; }

  table.responsive td, table.responsive th {
    position: relative;
    white-space: nowrap;
    overflow: hidden;
  }

  table.responsive th:first-child, table.responsive td:first-child, table.responsive td:first-child, table.responsive.pinned td { display: none; }
}
/* BASIC COLUMNS --------------------------------------------------------------------------------*/
.col {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  float: left;
}

.w2col { width: 50%; }
.no-boxsizing .w2col { width: 49%; }

.w3col { width: 29%; margin-right: 2%; }

/* MAIN LAYOUT ----------------------------------------------------------------------------------------------------- */
#top { height: 0; }

.masthead { /*HEADER */
  width: 100%;
  background: #688c8c url(../images/layout/masthead-bg.gif.png) repeat scroll 0 0;
  border-bottom: 1px #6f9090 solid;
}

.container {
  width: 100%;
  margin: 0;
  padding-bottom: 0!important;
  position: relative;
}

.container .containerGutter {
  width: 960px;
  margin: 0 auto;
  background: transparent url(../images/layout/containerGutter-bg.gif) repeat-y scroll 0 0;
  -webkit-box-shadow: rgba(68, 66, 64, 0.1) 24px 0 12px, rgba(68, 66, 64, 0.1) -24px 0 12px;
  -moz-box-shadow: rgba(68, 66, 64, 0.1) 24px 0 12px, rgba(68, 66, 64, 0.1) -24px 0 12px;
  box-shadow: rgba(68, 66, 64, 0.1) 24px 0 12px, rgba(68, 66, 64, 0.1) -24px 0 12px;
}

/*  MAIN CONTENT AREA */
.footerWrapper {
  width: 100%;
  background: #688c8c url(../images/layout/masthead-bg.gif) repeat scroll 0 0;
  border-top: 1px #779898 solid;
}

footer {
  width: 960px;
  margin: 0 auto;
  background-color: #457782;
  padding: 18px 1.875%;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #457782), color-stop(100%, #285a65));
  background-image: -webkit-linear-gradient(#457782, #285a65);
  background-image: -moz-linear-gradient(#457782, #285a65);
  background-image: -o-linear-gradient(#457782, #285a65);
  background-image: linear-gradient(#457782, #285a65);
}

.no-boxsizing footer {
  width: 890px;
  padding-right: 35px;
  padding-left: 35px;
}

/* HEADER --------------------------------------------------------------------------------------------------*/
.affiliatedNav {
  width: 100%;
  background-color: #688c8c;
  border-bottom: 1px #779898 solid;
}

.affiliatedNav nav { Width: 1020px; margin: 0 auto; }

.affiliatedNav p {
  width: 92px;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  float: left;
  font-family: "Droid Sans", Arial, sans-serif;
  font-size: 11px;
  font-size: 1.1rem;
  font-weight: 700;
  color: #e4e2e0;
}

.affiliatedNav ul {
  width: 923px;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  float: left;
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.affiliatedNav ul li {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  float: left;
  width: 20%;
  height: 42px;
  margin: 0;
  text-align: center;
  font-family: "Droid Sans", Arial, sans-serif;
  font-size: 11px;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.25em;
}

.no-boxsizing .affiliatedNav ul li { width: 19%; }

.affiliatedNav ul li.nonLink { padding-top: .5em; }

.affiliatedNav ul li a {
  background-color: #608282;
  height: 100%;
  color: #e4e2e0;
  text-decoration: none;
  margin-right: .25em;
  padding: .5em;
  display: block;
}

.affiliatedNav ul li a:hover { background-color: #538282; }

.no-boxsizing .affiliatedNav ul li { background-color: #608282; border-right: 1px #688c8c solid; }

.no-boxsizing .affiliatedNav ul li a { background-color: transparent; }

.mastWrap {
  width: 960px;
  display: block;
  margin: 0 auto;
  background: transparent url(../images/layout/mastWrap-bg-opt.gif.png) no-repeat scroll 216px 0;
}

.masthead p, .masthead h1 a { color: #fff; text-decoration: none; }

.masthead h1 {
  width: 50%;
  float: left;
  text-indent: -99999px;
  margin: 56px 0 50px;
}

.masthead h1 a {
  display: block;
  text-indent: -99999px;
  background: transparent url(../images/layout/icon-sprite-opt.png) no-repeat scroll -2px -177px;
  width: 356px;
  height: 57px;
}

.lt-ie8 .masthead h1 { padding-bottom: 50px; margin-bottom: 0; }

.headerRight { width: 50%; float: right; }

.headerRight p {
  font-family: Georgia, sans-serif;
  background-color: rgba(242, 160, 87, 0.75);
  padding: .25em;
  line-height: 1em;
  width: auto;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  margin-top: 3.75em;
  -webkit-box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 1px;
  -moz-box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 1px;
  box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 1px;
}

.no-rgba .headerRight p { background-color: #f2a057; }

/* MAIN NAV --------------------------------------------------------------------------------------------------*/
.navigation {
  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 -8px 10px -2px inset;
  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 -8px 10px -2px inset;
  box-shadow: rgba(0, 0, 0, 0.2) 0 -8px 10px -2px inset;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: ease-in-out;
  -moz-transition-timing-function: ease-in-out;
  -o-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
}

.navigation nav {
  width: 960px;
  margin: 0 auto;
  -moz-border-radius-topleft: 3px;
  -webkit-border-top-left-radius: 3px;
  border-top-left-radius: 3px;
  -moz-border-radius-topright: 3px;
  -webkit-border-top-right-radius: 3px;
  border-top-right-radius: 3px;
  background: #296774 url(../images/layout/masthead-bg.png) repeat scroll 0 0;
  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 -8px 10px -2px inset;
  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 -8px 10px -2px inset;
  box-shadow: rgba(0, 0, 0, 0.2) 0 -8px 10px -2px inset;
}

.navigation nav ul {
  list-style-image: none;
  list-style-type: none;
  margin-left: 0;
  white-space: nowrap;
  margin: 0;
  padding: 0;
}

.navigation nav ul li {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  float: left;
  text-align: center;
  margin: 0;
  padding: 0;
  font-family: "Droid Sans", Arial, sans-serif;
  font-size: 16px;
  font-size: 1.6rem;
}

.navigation nav ul li:hover { background-color: #f2a057; }

.navigation nav ul li.nav-training {
  width: 13.4375%;
  -moz-border-radius-topleft: 3px;
  -webkit-border-top-left-radius: 3px;
  border-top-left-radius: 3px;
}

.navigation nav ul li.nav-training.current a {
  -moz-border-radius-topleft: 3px;
  -webkit-border-top-left-radius: 3px;
  border-top-left-radius: 3px;
}

.navigation nav ul li.nav-research { width: 13.5417%; }
.navigation nav ul li.nav-resources { width: 13.8542%; }
.navigation nav ul li.nav-projects { width: 12.8125%; }
.navigation nav ul li.nav-employment { width: 22.2916%; }
.navigation nav ul li.nav-store { width: 10.2083%; }
.navigation nav ul li.nav-about {
  width: 13.8542%;
  -moz-border-radius-topright: 3px;
  -webkit-border-top-right-radius: 3px;
  border-top-right-radius: 3px;
}

.navigation nav ul li.nav-about.current a {
  -moz-border-radius-topright: 3px;
  -webkit-border-top-right-radius: 3px;
  border-top-right-radius: 3px;
}

.navigation nav ul li a {
  color: #fff;
  text-shadow: rgba(73, 92, 93, 0.75) 1px 0 2px;
  font-weight: 700;
  text-decoration: none;
  padding-top: 10px;
  padding-bottom: 10px;
  display: block;
}

.navigation nav ul li a:hover { text-decoration: none; }

.navigation nav ul li.current a {
  background-color: #f2a057;
  border-bottom: 1px #f2a057 solid;
  margin-bottom: -1px;
}

#mainNav li .more {
  float: right;
  cursor: pointer;
  z-index: 200;
  position: relative;
  margin: 0 10px 0 0;
  width: 20%;
  height: 40px;
  background: url("../images/layout/topnav-buttons-lvl2.png") no-repeat 60% center transparent;
}

.lt-ie9 #mainNav li .more { display: none; }

/* Drop down for Main Navigation
  -------------------------------------------------------------------------------------------------*/
#mainNav li ul.childNav {
  position: absolute;
  text-align: left;
  text-transform: none;
  width: auto;
  left: -999em;
  padding: 0;
  background-color: #f2a057;
  margin: 0;
  border-right: 1px #f0be91 solid;
  border-left: 1px #f0be91 solid;
}

#mainNav li:hover ul.childNav {
  left: auto;
  z-index: 999;
  zoom: 1;
}

.lt-ie8 #mainNav li:hover ul.childNav { margin-left: -3em; }

#mainNav li ul.childNav li {
  display: block;
  float: none;
  text-align: left;
  margin: 0;
  padding: 0;
}

#mainNav li ul.childNav li a {
  font-size: .925em;
  color: #585553;
  text-align: left;
  display: block;
  padding: .5em 2em;
  height: auto;
  text-shadow: none;
  border-bottom: 1px #f0be91 solid;
  margin-bottom: 0;
}

.lt-ie8 #mainNav li ul.childNav li a { width: 100%; }

#mainNav li ul.childNav li a:hover,
#mainNav li ul.childNav li a:focus,
#mainNav li.highlight ul.childNav li a:hover,
#mainNav li.highlight ul.childNav li a:focus {
  color: #fff;
  background-color: #585553;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
}

/* SEARCH BAR --------------------------------------------------------------------------------------------------*/
#searchBar {
  display: block;
  background-color: #fff;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 2px 0px inset;
  -moz-box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 2px 0px inset;
  box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 2px 0px inset;
  width: 100%;
  height: 25px;
}

#searchTerms {
  font-size: 13px;
  font-size: 1.3rem;
  font-style: italic;
  text-indent: -99999px;
  color: #bebebe;
  border: none;
  padding: 0 10px;
  background-color: transparent;
  float: left;
  display: inline;
  width: 84%;
  height: 24px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}

.lt-ie9 #searchTerms {
  margin-top: 6px;
  padding-top: 0;
  height: 20px;
  width: 110px;
}

.searchsubmit {
  background: transparent url(../images/layout/icon-sprite-opt.png) no-repeat scroll -58px -143px;
  width: 16px;
  height: 13px;
  margin: 7px 4px 0 0;
  border: medium none;
  display: inline;
  float: right;
  text-indent: -9999px;
  vertical-align: middle;
  font-size: 0;
}

.lt-ie8 input.searchsubmit { line-height: 0; }

#searchTerms:focus {
  text-indent: 0;
  color: #333;
  font-style: normal;
}

.lt-ie8 #searchTerms { text-indent: 0; color: #000; }

::-webkit-search-decoration { display: none; }

input[type=search] {
  -webkit-appearance: textfield;
  -webkit-box-sizing: content-box;
  text-indent: 0;
}

/* MAIN CONTENT AREA ---------------------------------------------------------------------------------------*/
.mainContent {
  width: 76.85%;
  float: right;
  display: inline;
  z-index: 99;
  zoom: 1;
  background-color: #fff;
}

.mainContent .mainGutter { padding: 30px; }

#subNav ul {
  margin: 0;
  padding: .5em 0 0 .5em;
  background-color: #fdf9f2;
}

#subNav ul li {
  display: inline;
  float: left;
  margin: .25em .5em;
  font-size: 12px;
  font-size: 1.2rem;
  padding: 0;
}

#subNav ul li.current a { text-decoration: underline; cursor: default; }

#subNav ul li a { color: #779898; text-decoration: none; }

#subNav ul li a:hover { text-decoration: underline; }

/* SIDEBAR -----------------------------------------------------------------------------------------------------*/
.sideBar {
  width: 23.15%;
  float: left;
  display: inline;
  z-index: 9999;
  zoom: 1;
}

.sideBar h3 {
  margin-top: -42px;
  padding: 1em 0 1.5em .25em;
  color: #fff;
  font-size: 13px;
  font-size: 1.3rem;
  font-weight: bold;
  text-transform: uppercase;
}

.sideBar li { color: #fff; }

.sectionGutter { padding: .75em 1.25em 3.025em; }

.calendar .sectionGutter { padding-right: 0; }

.off-canvas-panel {
  display: none;
  position: relative;
  width: 100%;
  height: 50px;
}

.off-canvas-panel li {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  position: absolute;
  top: 0;
  z-index: 9000;
  zoom: 1;
  font-family: "Droid Sans", Arial, sans-serif;
  font-size: 16px;
  font-size: 1.6rem;
}

.off-canvas-panel li.menu-item { left: 0; }

.off-canvas-panel li.menu-item a {
  -moz-border-radius-topright: 25px;
  -webkit-border-top-right-radius: 25px;
  border-top-right-radius: 25px;
}

.off-canvas-panel li.sidebar-item { right: 0; }

.off-canvas-panel li.sidebar-item a {
  -moz-border-radius-topleft: 25px;
  -webkit-border-top-left-radius: 25px;
  border-top-left-radius: 25px;
}

.off-canvas-panel li a {
  color: #fff;
  font-weight: 700;
  padding: 1em 1.5em;
  text-decoration: none;
  display: block;
  background-color: #296774;
}

.sbSection.search {
  background-color: #f2a057;
  background-position: 0 0;
}

.sbSection.newsletter {
  background-color: #779898;
  background-position: 0 -44px;
}

.sbSection.calendar {
  background-color: #e9c27a;
  border-top: 1px #edce95 solid;
  background-position: 0 -88px;
}

.sbSection.connection {
  background-color: #688c8c;
  background-position: 0 -132px;
}

.sbSection .sbIcon {
  background: url(../images/layout/icon-sprite-opt.png) no-repeat scroll 0 0;
  margin: -5px 0 0 -35px;
  width: 42px;
  height: 42px;
}

.sbSection.search .sbIcon { background-position: 0 0; }
.sbSection.newsletter .sbIcon { background-position: 0 -44px; }
.sbSection.calendar .sbIcon { background-position: 0 -88px; }
.sbSection.connection .sbIcon { background-position: 0 -132px; }

.no-boxsizing .sbSection .sbIcon { margin-left: -10px; }

/* Newsletter */
.newsletter .button {
  width: 70%;
  display: block;
  margin: 0 auto;
  font-weight: normal;
}

.newsletter a.newsletterLink {
  color: #fff;
  text-decoration: none;
  text-align: center;
  display: block;
  font-weight: 700;
  font-size: 14px;
  font-size: 1.4rem;
  padding: .75em 0 0;
}

.newsletter a.newsletterLink:hover { color: #1c5a68; }
.newsletter a.newsletterLink:focus { color: #1c5a68; }

/* Calendar events */
.calendar a.calendarLink {
  color: #fff;
  text-decoration: none;
  text-align: center;
  display: block;
  font-weight: 700;
  font-size: 14px;
  font-size: 1.4rem;
  padding: .75em 0 0;
}

.calendar a.calendarLink:hover { color: #1c5a68; }
.calendar a.calendarLink:focus { color: #1c5a68; }

/* Google event feed */
.event {
  clear: both;
  width: 100%;
  margin-bottom: 1em;
  background-color: #f3deb6;
  font-family: "Droid Sans", Arial, sans-serif;
}

.event:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}

* html .event { zoom: 1; }

/* IE6 */
*:first-child + html .event { zoom: 1; }

/* IE7 */
.eventLocation, .eventDescription { display: none; }

.dateholder {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  float: left;
  width: 40%;
  background-color: #e79144;
  padding-bottom: .5em;
}

.eventMonth {
  background-color: #e79144;
  color: #fff;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: 700;
  width: 100%;
  height: auto;
  text-align: center;
  text-transform: uppercase;
  padding: 2% 0 2%;
  display: block;
}

.eventDate {
  margin: 2% auto;
  width: 90%;
  font-size: 32px;
  font-size: 3.2rem;
  font-weight: 700;
  padding: 8% 0;
  text-align: center;
  background-color: #fff;
  color: #779898;
  display: block;
}

p.eventTitle {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  width: 60%;
  padding: 0 1% 1% 3%;
  float: right;
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: 700;
  color: #727884;
  line-height: 1.125em;
}

.no-boxsizing p.eventTitle { width: 50%; }

.connection ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.connection ul li {
  background: transparent url(../images/layout/icon-sprite-opt.png) no-repeat scroll 0 0;
  height: 33px;
  font-size: 13px;
  font-size: 1.3rem;
  margin-bottom: 1.75em;
}

.connection ul li.newsletterLink { background-position: -45px 0; }
.connection ul li.youtubeLink { background-position: -45px -33px; }
.connection ul li.linkedinLink { background-position: -45px -67px; }
.connection ul li.facebookLink { background-position: -45px -100px; }

.connection ul li a {
  padding: .325em 0 0 46px;
  color: #fff;
  text-decoration: none;
  display: block;
  height: 100%;
}

/* FOOTER --------------------------------------------------------------------------------------------------*/
.topFooter {
  background-color: #3d6971;
  display: table;
  width: 100%;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #3d6971), color-stop(100%, #315d66));
  background-image: -webkit-linear-gradient(#3d6971, #315d66);
  background-image: -moz-linear-gradient(#3d6971, #315d66);
  background-image: -o-linear-gradient(#3d6971, #315d66);
  background-image: linear-gradient(#3d6971, #315d66);
}

.topFooter .sitemapRow { display: table-row; }

.topFooter .sitemapCell {
  display: table-cell;
  padding: 1em .5em 1em 1.25em;
  border-right: 1px #4d737b solid;
  border-bottom: 1px #4d737b solid;
}

.no-display-table .sitemapRow { display: block; }

.no-display-table .sitemapCell {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  float: left;
  width: 13%;
  padding: 1% 0 1% 1%;
}

.no-display-table .firstRow { height: 50px; }
.no-display-table .sitemapCell { height: 100%; }
.no-display-table .sitemapRow.firstRow .sitemapCell { height: 60%; }

.lastRow .sitemapCell { border-bottom: none; }

.sitemapCell.lastCell { border-right: none; }

.topFooter h4 {
  color: #c6baa9;
  margin: 0;
  font-size: 14px;
  font-size: 1.4rem;
}

.topFooter h4 a { color: #c6baa9; text-decoration: none; }
.topFooter h4 a:hover { text-decoration: underline; }

.topFooter ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.topFooter ul li {
  padding-left: 0;
  color: #cecece;
  font-size: 11px;
  font-size: 1.1rem;
}

.topFooter ul li a { color: #cecece; text-decoration: none; }

.topFooter ul li a:hover { text-decoration: underline; }

.bottomFooter { text-align: center; padding-top: 1.5em; }

.bottomFooter p {
  font-size: 13px;
  font-size: 1.3rem;
  line-height: 1.5em;
  color: #fbf8f8;
}

.bottomFooter a { color: #f2d194; text-decoration: none; }
.bottomFooter a:hover { text-decoration: underline; }

/* HOME PAGE STYLES -------------------------------------------------------------------------------------------*/
.home .mainContent .mainGutter { padding: 0; }

.welcomeCopy {
  border: 1px #e1e1e1 solid;
  padding: 2em;
  margin: 3em;
}

.welcomeCopy p {
  color: #656262;
  font-size: 20px;
  font-size: 2rem;
  line-height: 1.55em;
  margin: 0;
  padding: 0;
}

.welcomeCopy p a { color: #f2a057; font-weight: 700; }

/* Video carousel */
.html_carousel {
  padding: 3px;
  position: relative;
  background-color: #779898;
  height: 160px;
}

.html_carousel img {
  border: 1px solid #ccc;
  background-color: white;
  padding: 0;
  margin: 0;
  display: block;
  -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0 0 3px;
  -moz-box-shadow: rgba(0, 0, 0, 0.5) 0 0 3px;
  box-shadow: rgba(0, 0, 0, 0.5) 0 0 3px;
}

.html_carousel a {
  display: block;
  float: left;
  width: 129px;
  text-decoration: none;
  margin: 10px 13px 0 13px;
  padding: .25em 1em;
}

.html_carousel p {
  margin: .325em 0 0;
  padding: 0;
  color: #fff;
  font-size: 13px;
  font-size: 1.3rem;
  line-height: 1.25em;
  text-align: center;
}

.no-js #foo1 { margin: 0 auto; width: 85%; }

.no-js #foo1 a:last-of-type, .no-js #googleCalendar { display: none; }

a.prev, a.next {
  background: url(../images/layout/icon-sprite-opt.png) no-repeat transparent;
  width: 33px;
  height: 63px;
  display: block;
  position: absolute;
  top: 22px;
  padding: 0;
}

a.prev {
  left: 10px;
  background-position: -47px -235px;
}

a.next {
  right: 10px;
  background-position: 0px -235px;
}


a.prev span, a.next span { display: none; }

.clearfix2 {
  float: none;
  clear: both;
}

.sectionWrap {
  display: block;
  height: auto;
  position: relative;
}

.employServices, .quickLinks {
  border: 1px #e1e1e1 solid;
  padding: 2em;
  height: 100%;
}

.employServices { margin: 3em 3em 3em 3em; }

.quickLinks { margin: 3em 3em 3em 0; }

.employServices h3, .quickLinks h3 {
  font-size: 20px;
  font-size: 2rem;
  margin: 0;
}

.employServices p, .quickLinks p { line-height: 1.325em; }

.employServices a.learnBtn {
  display: block;
  width: 100%;
  padding: 1em 0;
  background-color: #f2a057;
  color: #fff;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 400;
  text-decoration: none;
  text-align: center;
}

.employServices a.learnBtn:hover { text-decoration: none; }

.feedWrap { background-color: #e1d4c0; }

.feedGutter {
  padding: 16px;
  min-height: 400px;
  height: auto;
}

.feedItem { clear: both; }

.feedIcon {
  display: inline;
  float: left;
  width: 10%;
}

.feedContent {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  float: left;
  width: 88%;
}

.feedItem h3 { font-size: 15px; font-size: 1.5rem; }

.feedItem p {
  font-size: 12px;
  font-size: 1.2rem;
  color: #777;
}

.feedItem p.name, .feedItem h3, .feedItem a { color: #3b599e; }

.feedItem p.name { margin: 0; font-weight: 700; }

/* Facebook feed styles */
.fb-wall {
  font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
  font-size: 13px;
  width: 100%;
  line-height: 1.2em;
  color: #333333;
  padding: 10px;
}


.fb-wall a { text-decoration: none; color: #3B5998; }

.fb-wall a:hover { text-decoration: underline; }

.fb-wall.loading {
  height: 300px;
  background: url(../images/layout/loader-small.gif) no-repeat center center;
}

.fb-wall-box {
  margin-bottom: 10px;
  border-top: 1px solid #eee;
  padding-top: 2em;
  padding-bottom: 2em;
}

.fb-wall-box-first { border: 0; padding-top: 0; }

.fb-wall-avatar { float: left; border: 0; }

.fb-wall-data { margin-left: 60px; }

.fb-wall-media {
  display: block;
  font-size: 11px;
  margin-bottom: 5px;
}

.fb-wall-border-left { border-left: 2px solid #CCCCCC;  padding: 0 0 3px 8px; }

.fb-wall-media-container { display: table; }

.fb-wall-media-link {
  border: 1px solid #ccc;
  display: inline-block;
  color: #3B5998;
  cursor: pointer;
  float: left;
  margin-right: 5px;
}

.fb-wall-media-link:hover { border: 1px solid #3B5998; }

.fb-wall-picture {
  margin-right: 10px;
  border: 0;
  display: block;
  margin: 3px;
}

.fb-wall-name {
  display: block;
  font-weight: bold;
  color: #3B5998;
}

.fb-wall-caption { display: block; color: #3B5998; }

.fb-wall-description {
  display: block;
  color: #777;
  line-height: 1.2em;
}

.fb-wall-icon { float: left; margin-right: 5px; }

.fb-wall-date {
  font-size: 11px;
  color: #777;
  clear: left;
  display: block;
  margin-bottom: 5px;
}

.fb-wall-message { display: block; margin-bottom: 5px; }

.fb-wall-message-from { font-weight: bold; color: #3B5998; }

.fb-wall-link {
  color: #333;
  font-size: 11px;
  text-decoration: none;
}

/* Likes*/
.fb-wall-likes {
  border-bottom: 1px solid #E5EAF1;
  margin-bottom: 2px;
  display: block;
  font-size: 11px;
  background: url(like.gif) no-repeat 0 0 white;
  padding-top: 5px;
}

.fb-wall-likes div {
  margin: 0;
  background: url(like.gif) no-repeat 0 -5px #edeff4;
  padding: 5px 5px 4px 24px;
}

.fb-wall-likes div span { color: #3B5998; }

/* Comments */
.fb-wall-comments { margin-top: 2px; font-size: 11px; }
.fb-wall-comment {
  background-color: #EDEFF4;
  border-bottom: 1px solid #E5EAF1;
  margin-top: 2px;
  padding: 5px 5px 4px;
  display: block;
  overflow: hidden;
}

.fb-wall-comment-message { display: table; }

.fb-wall-comment-from-name { font-weight: bold; color: #3B5998; }

.fb-wall-comment-from-date {
  color: #777;
  clear: left;
  display: block;
}

.fb-wall-comment-avatar {
  width: 32px;
  height: 32px;
  float: left;
  margin-right: 5px;
  overflow: hidden;
}

.fb-wall-comment-avatar img { width: 32px; height: 32px; }

/* Clearfix */
.fb-wall:after, .fb-wall-media:after, .fb-wall-clean {
  content: '.';
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
  font-size: 0;
  line-height: 0;
}

/* SUBSITE STYLES -------------------------------------------------------------------------------------------*/
.subsite .container .containerGutter { background-image: none; background-color: #fff; }

.subsite .sbSection.search {
  height: 360px;
  background-color: #f2a057;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(30%, #f2a057), color-stop(70%, #ffffff));
  background-image: -webkit-linear-gradient(#f2a057 30%, #ffffff 70%);
  background-image: -moz-linear-gradient(#f2a057 30%, #ffffff 70%);
  background-image: -o-linear-gradient(#f2a057 30%, #ffffff 70%);
  background-image: linear-gradient(#f2a057 30%, #ffffff 70%);
}

.no-cssgradients .subsite .sbSection.search { height: auto;  margin-bottom: 2em; }

.subsite .subsiteNav h3 {
  font-size: 16px;
  font-size: 1.6rem;
  margin: 0 1em 0 0;
  padding: 0;
  color: #585553;
  font-weight: 700;
  text-transform: uppercase;
  text-align: right;
}

.subsite .subsiteNav h3 a {
  color: #585553;
  font-weight: 700;
  text-decoration: none;
}

.subsite .subsiteNav h3 a:hover { text-decoration: underline; }

.subsite #subsiteSideNav ul {
  background-color: transparent;
  margin: 0;
  padding: 0;
}

.subsite #subsiteSideNav ul li {
  display: block;
  float: none;
  margin: .25em .5em;
  font-size: 16px;
  font-size: 1.6rem;
}

.subsite .sidebar li, .subsite #subsiteSideNav ul li, .subsite #subsiteSideNav ul li a { color: #585553; }

.subsite #subsiteSideNav ul li a {
  padding: .75em .5em .75em 0;
  display: block;
  border-bottom: 1px #dedddd solid;
  text-align: right;
  text-decoration: none;
}

.subsite #subsiteSideNav ul li a:hover { color: #f2a057; text-decoration: underline; }

.subsite .mainContent h1 {
  font-size: 46px;
  font-size: 4.6rem;
  color: #779898;
  margin: .125em 0 0;
  line-height: .875em;
}

.subsite .mainContent h2 {
  font-size: 27px;
  font-size: 2.7rem;
  color: #f2a057;
  font-weight: 400;
}

/* MISC ------------------------------------------------------------------------------------------------------ */
.clear { clear: both; }

.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}

* html .clearfix { zoom: 1; }

/* IE6 */
*:first-child + html .clearfix { zoom: 1; }

/* IE7 */
.noborder { border: none; }

.centered { margin-left: auto; margin-right: auto; }

.rightFloat { float: right; }
.leftFloat {  float: left; }

.hide { display: none; }

.notetoclient { color: red; }
.notetodeveloper { color: blue; }

#skipnav { position: absolute; top: -10000px; }

/* Fancybox video styles -------------------------------------------------------------------------------------------------------*/
.list { margin: 0 0 15px 15px; padding: 0; }

.smvideo { float: right; }

.list li {
  list-style-image: none;
  list-style-type: none;
  position: relative;
  margin: 0;
  padding: 0;
}

.play-button {
  background: none repeat scroll 0 0 black;
  background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);
  color: #ddd;
  display: block;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 18px;
  height: 55px;
  left: 0;
  padding: 1em 0 0;
  position: absolute;
  text-align: center;
  top: 36%;
  left: 40%;
  width: 20%;
  border-radius: 15px;
  z-index: 12;
}

.play-button:hover {
  background: black;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}

.play-button img { vertical-align: middle; }
.list img { z-index: 10; }

/* to make large videos responsive */
.videoWrapper {
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 */
  padding-top: 25px;
  height: 0;
}

.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* Callout Box -------------------------------------------------------------------------------------------------------*/
.callout-box {
  width: 45%;
  background-color: #ededed;
  border: 1px #dfdfdf solid;
  float: right;
  margin: 20px 0 20px 24px;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  -khtml-border-radius: 7px;
  border-radius: 7px;
}

.callout-box .gutter { padding: 2em; }

.callout-box h3 {
  color: #252525;
  font-size: 38px;
  font-size: 3.8rem;
  margin: 0;
}

.callout-box p {
  font-size: 20px;
  font-size: 2rem;
  line-height: 1.25em;
}

/* Buttons --------------------------------------------------------------------------------------------------------*/
.button {
  width: auto;
  background: #f2a057;
  -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  color: #fff;
  text-transform: uppercase;
  cursor: pointer;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  font-family: inherit;
  font-size: 14px;
  font-weight: bold;
  line-height: 1;
  margin: 0;
  padding: 10px 20px 10px;
  text-align: center;
  text-decoration: none;
  -webkit-transition: background-color 0.1s ease-in-out;
  -moz-transition: background-color 0.1s ease-in-out;
  -o-transition: background-color 0.1s ease-in-out;
  transition: background-color 0.1s ease-in-out;
}

.button:hover, .button:focus {
  background-color: #1c5a68;
  text-decoration: none;
}

.button:active {
  -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) inset;
  -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) inset;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) inset;
  text-decoration: none;
}

/* Back to top (floating) -------------------------------------------------------------------------------------------------------*/
.scrollup {
  width: 40px;
  height: 40px;
  opacity: 0.3;
  position: fixed;
  bottom: 10%;
  right: 7%;
  display: none;
  text-indent: -9999px;
  background: url(../images/layout/arrow_top.png) no-repeat;
  background-size: 40px 40px;
  z-index: 999999;
}

.scrollup:hover { border-bottom: none; }

/* MEDIA QUERIES -------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 1020px) {
  .mastWrap { padding-left: 1em; }
  .headerRight { width: 45%; }
  .headerRight p { width: 95%; }
}
@media screen and (max-width: 990px) {
  .container .containerGutter, .mastWrap, .affiliatedNav nav, .navigation nav, footer { width: 100%; }
  .mastWrap { background-position: right 0; }
  .affiliatedNav p {
    width: 100%;
    float: none;
    display: block;
    text-align: center;
  }

  .affiliatedNav ul {
    width: 100%;
    display: block;
    float: none;
  }

  .navigation nav, .navigation nav ul li.nav-training a:hover, .navigation nav ul li.nav-about a:hover {
    -moz-border-radius-topleft: 0px;
    -webkit-border-top-left-radius: 0px;
    border-top-left-radius: 0px;
    -moz-border-radius-topright: 0px;
    -webkit-border-top-right-radius: 0px;
    border-top-right-radius: 0px;
  }

  .topFooter { display: none; }

  .navigation nav ul li { border-bottom: 1px #447880 solid; }
  .navigation nav ul ul li { border-bottom: none; }
  .navigation nav ul li a { padding-left: 3%; }
  
  .navigation nav ul li.current a,
  .navigation nav ul li a:hover,
  .navigation nav ul li:hover a {
    background-color: #205661;
  }

  .navigation nav ul li:hover ul li a { background-color: transparent; }
  .navigation nav ul li.current ul a { background-color: transparent; }
  
  .sbSection .sbIcon { margin-left: -10px; }

  .sideBar h3 { padding-left: 2em; }
}
@media screen and (max-width: 882px) {
  .affiliatedNav { display: none; }
  .navigation nav ul li { font-size: 14px; font-size: 1.4rem; }
}
@media screen and (min-width: 801px) {
  #mainNav li .more { display: none; }
}
@media screen and (max-width: 800px) {
  .navigation, #subNav { display: none; }
  .active-nav .navigation { display: block; }

  .active-nav .navigation nav ul li {
    width: 100%;
    display: block;
    float: none;
    text-align: left;
  }

  .navigation nav {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
  }

  .navigation nav ul li.current a { border-bottom: 1px #447880 solid; }
  
  #mainNav li ul.childNav li a { padding: .75em 2em; }
  #mainNav li ul.childNav { left: auto; display: none; }
  #mainNav li.hover ul.childNav { display: block; position: relative; width: 100%; }

  body.active-sidebar {
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    position: static;
  }

  .masterWrap { position: relative; }

  .active-sidebar .mainContent {
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
  }

  .active-sidebar .container {
    position: absolute;
    left: 60%;
    -webkit-transform: translate3D(0, 0, 0);
  }

  .container .containerGutter {
    background-image: none;
    background-color: #fff;
  }

  .active-sidebar .container .containerGutter { overflow: hidden; }

  .active-sidebar #realLogo, .active-sidebar .footerWrapper { display: none!important; }

  [role="complementary"] {
    width: 60%;
    float: none;
    position: absolute;
    left: -60%;
  }

  [role="main"] {  width: 100%; }

  .active-sidebar [role="complementary"] {
    top: 0;
    height: 100%;
    position: absolute;
    background-color: #688c8c;
    -webkit-box-shadow: 5px 10px 20px rgba(50, 50, 50, 0.75);
    -moz-box-shadow: 5px 10px 20px rgba(50, 50, 50, 0.75);
    box-shadow: 5px 10px 20px rgba(50, 50, 50, 0.75);
  }

  .subsite.active-sidebar [role="complementary"] { background-color: #fff; }
  .active-sidebar [role="main"] { overflow: hidden; }

  .off-canvas-panel {
    width: 100%;
    overflow: hidden;
    display: block;
    color: #fff;
  }

  .csstransforms3d.csstransitions.js [role="complementary"] {
    left: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    -moz-transform: translate3d(-100%, 0, 0);
    -ms-transform: translate3d(-100%, 0, 0);
    -o-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
  }

  .csstransforms3d.csstransitions.js .container {
    left: 0 !important;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: -webkit-transform 0.2s ease;
    -moz-transition: -moz-transform 0.2s ease;
    -o-transition: -o-transform 0.2s ease;
    transition: transform 0.2s ease;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
  }

  .csstransforms3d.csstransitions.js .active-sidebar .container {
    -webkit-transform: translate3d(60%, 0, 0) scale3d(1, 1, 1);
    -moz-transform: translate3d(60%, 0, 0) scale3d(1, 1, 1);
    -ms-transform: translate3d(60%, 0, 0) scale3d(1, 1, 1);
    -o-transform: translate3d(60%, 0, 0) scale3d(1, 1, 1);
    transform: translate3d(60%, 0, 0) scale3d(1, 1, 1);
  }

  /* Subsite styles */
  .subsite .subsiteNav h3, .subsite #subsiteSideNav ul li a {
    text-align: left;
    padding-left: 1em;
  }

  .subsite #subsiteSideNav { display: block; }
  .subsite .sbSection.search {
    height: auto;
    background-image: none;
    margin-bottom: 1.5em;
  }
  .eventInfo { padding-right: 3%; }

  .welcomeCopy { margin: 2em; padding: 1.5em; }
  .welcomeCopy p { font-size: 18px; font-size: 1.8rem; }
}
@media screen and (max-width: 730px) {
  .masthead h1 { margin-bottom: 0; }

  .headerRight { width: 100%; display: block; float: none; }

  .headerRight p { margin-top: .5em; }

  .callout-box h3 { font-size: 30px; font-size: 3rem; }
}
@media screen and (max-width: 670px) {
  .w2col { width: 100%; }
  .w2col.col { float: none; display: block; }
  .employServices, .quickLinks { margin: 2em; }
  blockquote { margin: 1em 0; }
  blockquote p { font-size: 24px; font-size: 2.4rem; }
  .mainContent .mainGutter { padding: 1.5em 2em 1.5em 2em; }
}
@media screen and (max-width: 650px) {
  .masthead h1 {
    margin: 0 auto;
    padding-top: 20px;
    display: block;
    float: none;
    width: 356px;
    height: 77px;
  }

  .headerRight { text-align: center; }
  .headerRight p { text-align: center; width: auto; }
  .welcomeCopy p { font-size: 16px; font-size: 1.6rem; }
}
@media screen and (max-width: 600px) {
  .callout-box, figure.img-right, figure.img-left, .col.w3col { display: block; float: none; }
  .callout-box { width: 100%; margin-left: 0; }
  .col.w3col { width: 100%; }
  .mastWrap { padding-left: 0; }
  .fb-wall { width: 100%; }
  .subsite .mainContent h1 { font-size: 40px; font-size: 4rem; }
  .subsite .mainContent h2 { font-size: 24px; font-size: 2.4rem; }

  blockquote p { font-size: 20px; font-size: 2rem; }

  .callout-box h3 { font-size: 20px; font-size: 2rem; }
  .callout-box p { font-size: 16px; font-size: 1.6rem; }
  a.prev { left: 3%; }
  a.next { right: 3%; }

  figure.img-right, img.img-right { margin-left: 0; }
  .active-sidebar [role="complementary"] { width: 70%;}

  .csstransforms3d.csstransitions.js .active-sidebar .container {
    -webkit-transform: translate3d(70%, 0, 0) scale3d(1, 1, 1);
    -moz-transform: translate3d(70%, 0, 0) scale3d(1, 1, 1);
    -ms-transform: translate3d(70%, 0, 0) scale3d(1, 1, 1);
    -o-transform: translate3d(70%, 0, 0) scale3d(1, 1, 1);
    transform: translate3d(70%, 0, 0) scale3d(1, 1, 1);
  }
}
@media screen and (max-width: 565px) {
  a.prev { left: 1%; }
  a.next { right: 1%; }
}
@media screen and (max-width: 460px) {
  ol, ul { padding-left: 1.75em; }

  .masthead h1 { width: 177px; height: 49px; }

  .masthead h1 a {
    background-image: url(../images/layout/title-sm.png);
    background-size: 177px 29px;
    width: 177px;
    height: 29px;
    background-position: center center;
  }

  .fb-wall-avatar { float: none; margin-bottom: 1em; }
  .fb-wall-data { margin-left: 0; }
  .fb-wall-media-link { float: none; }

  .welcomeCopy { border: none; margin: 0; }

  .active-sidebar [role="complementary"] { width: 85%; }

  .csstransforms3d.csstransitions.js .active-sidebar .container {
    -webkit-transform: translate3d(85%, 0, 0) scale3d(1, 1, 1);
    -moz-transform: translate3d(85%, 0, 0) scale3d(1, 1, 1);
    -ms-transform: translate3d(85%, 0, 0) scale3d(1, 1, 1);
    -o-transform: translate3d(85%, 0, 0) scale3d(1, 1, 1);
    transform: translate3d(85%, 0, 0) scale3d(1, 1, 1);
  }

  #googleCalendar { display: none; }
  .html_carousel a { padding: .75em 2em; }
}
@media screen and (max-width: 380px) {
  .subsite .mainContent h1 { font-size: 30px; font-size: 3rem; }
  .subsite .mainContent h2 { font-size: 22px; font-size: 2.2rem; }

  .caroufredsel_wrapper {
    width: 170px!important;
    margin: 0 auto!important;
  }
}
/* Print styles--------------------------------------------------------------------------------------------------------*/
@media print {
  * {
    box-sizing: content-box;
    background: transparent !important;
    color: black !important;
    text-shadow: none !important;
    filter: none !important;
    -ms-filter: none !important;
  }

  body {
    font-size: 16pt;
    font-family: Georgia, "Times New Roman", Times, serif;
    line-height: 2;
    width: 100%;
    margin: 0;
  }

  p, h2, h3 { orphans: 3; widows: 3; }

  p { font-size: 13pt  !important; font-family: Georgia, "Times New Roman", Times, serif  !important; }

  h1 {
    font-size: 18pt;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-weight: bold;
  }
  h2 { font-size: 16pt; font-weight: bold; }
  h3 { font-size: 16pt; font-weight: normal; }
  h2, h3 { page-break-after: avoid; }

  a, a:visited {
    text-decoration: underline;
    font-weight: normal;
  }

  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after, .navigation nav ul li a[href]:after, .masthead h1 a[href]:after, .fb-wall a[href]:after { content: ""; }

  /* Don't show links for images, or javascript/internal links */
  .button, .employServices a.learnBtn {
    background-color: transparent!important;
    border: 1px #ccc solid;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    display: inline;
    width: auto;
    padding: .5em;
  }

  body, #wrapper, footer { min-width: 0px; }
  #searchBar, p.breadcrumbs, .affiliatedNav, .sideBar, .html_carousel, .topFooter, .navigation, .js #vcuIdentityWrapper, #vcuIdentityWrapper { display: none !important; }

  .mastWrap, .container .containerGutter, .mainContent, .fb-wall, footer { width: 100%; }
  .masthead, .affiliatedNav { border: none; }
  .masthead h1, .headerRight, .col {
    float: none;
    width: 100%;
    display: block;
    text-indent: 0;
    margin: 0;
  }

  .masthead h1 a {
    margin: 0;
    padding: 1.5em 0 .5em;
    text-indent: 0;
    background-image: none;
    display: block;
    width: auto;
    height: auto;
    text-align: left;
    color: #000;
    text-decoration: none;
    border: none;
    font-size: 19pt;
    font-weight: bold;
  }

  .headerRight p {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    margin-top: .25em;
  }

  .container .containerGutter {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
  }

  .mainContent { float: none; display: block; }
  .mainContent .mainGutter { padding: 0; }
  #subNav ul { padding-left: 0; }
  #feature-slides { width: 100% !important; height: auto !important; }
  .home .flex-viewport {  height: auto !important; }

  #feature-slides li {
    float: none!important;
    display: block!important;
    width: 100%!important;
    clear: both;
  }

  .flexslider .slides img { width: 100%!important; height: auto!important; }

  p.flex-caption {
    background-color: #fff!important;
    position: relative;
    width: 100%;
    top: 0;
    padding: .25em;
  }

  .welcomeCopy {
    border: none;
    padding: 1em 0;
    margin: 0;
  }

  .w2col { width: 100%; }

  .employServices, .quickLinks {
    border: none;
    padding: 1em 0;
    margin: 0;
    height: auto!important;
  }

  .employServices a.learnBtn { text-align: left; }

  .footerWrapper { border-top: none; }

  .headerLeft {
    width: 100%;
    float: none;
    display: block;
    margin: 0;
  }

  .headerLeft p {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    padding: 0;
    margin-top: 1em;
  }

  .colGutter { height: auto!important; padding: .5em; }

  .colGutter.right, .colGutter.left {  margin: 0 0 1em 0; }
  .row { margin: 0; }
  .clearfix:after { visibility: visible;}
}
