/*===============================================================
CSS Stylesheet for Vancouver Community College
Copyright 2013 
Written by Michael Mason and Hugh Law on behalf of TERMINALFOUR
www.terminalfour.com
=================================================================*/
/* Bootstrap */
/*
 * Bootstrap v2.3.1
 *
 * Copyright 2012 Twitter, Inc
 * Licensed under the Apache License v2.0btn
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Designed and built with all the love in the world @twitter by @mdo and @fat.
 */


@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic,700italic);/*--googlefont:Source Sans Pro---*/
@import url(https://fonts.googleapis.com/css?family=Roboto:700); /*---googlefont: RobotoCondensed fior H1---*/
/* Edmond Sans font */
@font-face {
  font-family: "EdmondSans";
  font-weight: normal;
  src: url(/media/vancouver-community-college/style-assets/fonts/regular/edmondsans-regular-webfont.eot);
  /* IE 9 */
  src: url(/media/vancouver-community-college/style-assets/fonts/regular/edmondsans-regular-webfont.eot#iefix) format("embedded-opentype"), url(/media/vancouver-community-college/style-assets/fonts/regular/edmondsans-regular-webfont.woff) format("woff"), url(/media/vancouver-community-college/style-assets/fonts/regular/edmondsans-regular-webfont.ttf) format("truetype"), url(/media/vancouver-community-college/style-assets/fonts/regular/edmondsans-regular-webfont.svg) format("svg"); }

@font-face {
  font-family: "EdmondSans";
  font-weight: 500;
  src: url(/media/vancouver-community-college/style-assets/fonts/medium/edmondsans-medium-webfont.eot);
  /* IE 9 */
  src: url(/media/vancouver-community-college/style-assets/fonts/medium/edmondsans-medium-webfont.eot#iefix) format("embedded-opentype"), url(/media/vancouver-community-college/style-assets/fonts/medium/edmondsans-medium-webfont.woff) format("woff"), url(/media/vancouver-community-college/style-assets/fonts/medium/edmondsans-medium-webfont.ttf) format("truetype"), url(/media/vancouver-community-college/style-assets/fonts/medium/edmondsans-medium-webfont.svg) format("svg"); }

@font-face {
  font-family: "EdmondSans";
  font-weight: bold;
  src: url(/media/vancouver-community-college/style-assets/fonts/bold/edmondsans-bold-webfont.eot);
  /* IE 9 */
  src: url(/media/vancouver-community-college/style-assets/fonts/bold/edmondsans-bold-webfont.eot#iefix) format("embedded-opentype"), url(/media/vancouver-community-college/style-assets/fonts/bold/edmondsans-bold-webfont.woff) format("woff"), url(/media/vancouver-community-college/style-assets/fonts/bold/edmondsans-bold-webfont.ttf) format("truetype"), url(/media/vancouver-community-college/style-assets/fonts/bold/edmondsans-bold-webfont.svg) format("svg"); }

html, body { width:100%; }

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
  display: block; }

audio,
canvas,
video {
  display: inline-block;
  *display: inline;
  *zoom: 1; }

audio:not([controls]) {
  display: none; }

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; }

a:focus {
  outline: thin dotted #333;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px; }

a:hover,
a:active {
  outline: 0; }

sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

img {
  /* Responsive images (ensure images don't scale beyond their parents) */
  max-width: 100%;
  /* Part 1: Set a maxium relative to the parent */
  width: auto\9;
  /* IE7-8 need help adjusting responsive images */
  height: auto;
  /* Part 2: Scale the height according to the width, otherwise you get stretching */
  vertical-align: middle;
  border: 0;
  -ms-interpolation-mode: bicubic; }

#map_canvas img,
.google-maps img {
  max-width: none; }

button,
input,
select,
textarea {
  margin: 0;
  font-size: 100%;
  vertical-align: middle; }

button,
input {
  *overflow: visible;
  line-height: normal; }

button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0;
  border: 0; }

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer; }

label,
select,
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
input[type="radio"],
input[type="checkbox"] {
  cursor: pointer; }

input[type="search"] {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  -webkit-appearance: textfield; }

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none; }

textarea {
  overflow: auto;
  vertical-align: top; }

@media print {
  * {
   text-shadow: none !important;
   color: #000 !important;
   background: transparent !important;
   box-shadow: none !important; }

a, a:visited { text-decoration: underline; }
a[href]:after { content: " (" attr(href) ")"; }
abbr[title]:after { content: " (" attr(title) ")"; }
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }
pre,blockquote { border: 1px solid #999; page-break-inside: avoid; }
thead { display: table-header-group; }
tr, img { page-break-inside: avoid; }
img { max-width: 100% !important; }
@page { margin: 0.5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3 { page-break-after: avoid; } }

.centered iframe { padding: 0 17.44186046511628% ; /* 150px */ width: 65.11627906976744%; border: 0px; }
.iframeLeft iframe { padding-left:0; }

body {
  margin: 0;
  font-family: 'Source Sans Pro', 'EdmondSans',  'Helvetica Neue', Helvetica, Arial, sans-serif, 'Open Sans',  'Ubuntu', 'Roboto';  
  font-size: 17px;/*--was-14----*/font-weight:400;
  line-height: 1.5em;/*---was-20px-----*/
  color: #4d4d4d;
  background-color: white; 
}
a { color: #2b45d9;/*---hz--from:#327ec1, #005bcc, #0000ff--*/ text-decoration: none; }
a:hover, a:focus { 
  color: #3a8600;/*---hz--from:#004278--*/
  text-decoration: underline; 
} /*haziel: from "underline" to "none" - remove underline on mouseover of matrix promo homepage...but not it's not it.*/

.img-rounded { -webkit-border-radius: 6px; moz-border-radius: 6px; border-radius: 6px; }
/*.img-polaroid {
  padding: 4px;
  background-color: #fff;
  border: 1px solid #ccc;
  border: 1px solid rgba(0,0,0,.2);
  @include box-shadow(0 1px 3px rgba(0,0,0,.1));
} */
/*img-circle {
  @include border-radius(500px); // crank the border-radius so it works with most reasonably sized images
}*/
.row { margin-left: -20px; *zoom: 1; }
.row:before, .row:after { display: table; content: ""; line-height: 0; }
.row:after { clear: both; }

[class*="span"] { float: left; min-height: 1px; margin-left: 20px; }

.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container { width: 940px; }

.span1 { width: 60px; }
.span2 { width: 140px; }
.span3 { width: 220px; }
.span4 { width: 300px; }
.span5 { width: 380px; }
.span6 { width: 460px; }
.span7 { width: 540px; }
.span8 { width: 620px; }
.span9 { width: 700px; }
.span10 { width: 780px; }
.span11 { width: 860px; }
.span12 { width: 940px; }
.offset1 { margin-left: 100px; }
.offset2 { margin-left: 180px; }
.offset3 { margin-left: 260px; }
.offset4 { margin-left: 340px; }
.offset5 { margin-left: 420px; }
.offset6 { margin-left: 500px; }
.offset7 { margin-left: 580px; }
.offset8 { margin-left: 660px; }
.offset9 { margin-left: 740px; }
.offset10 { margin-left: 820px; }
.offset11 { margin-left: 900px; }
.offset12 { margin-left: 980px; }

[class*="span"].hide, .row-fluid [class*="span"].hide { display: none; }
[class*="span"].pull-right, .row-fluid [class*="span"].pull-right { float: right; }

.container { margin-right: auto; margin-left: auto; *zoom: 1; } 
.container:before, .container:after { display: table; content: ""; line-height: 0; }
.container:after { clear: both; }

p { margin: 0 0 10px; }
.lead { margin-bottom: 20px; font-size: 21px; font-weight: 200; line-height: 30px; }
small { font-size: 85%; }
strong { font-weight: bold; }
em { font-style: italic; }
cite { font-style: normal; }
.muted { color: #687c87; }

a.muted:hover, a.muted:focus { color: #52626a; }

.text-warning { color: #c09853; }
a.text-warning:hover, a.text-warning:focus { color: #a47e3c; }
.text-error { color: #b94a48; }
a.text-error:hover, a.text-error:focus { color: #953b39; }
.text-info { color: #3a87ad; }
a.text-info:hover, a.text-info:focus { color: #2d6987; }
.text-success { color: #468847; }
a.text-success:hover, a.text-success:focus { color: #356635; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }

h1 { font-family: 'Roboto Condensed','Source Sans Pro',Arial,'EdmondSans', 'Helvetica Neue', Helvetica,  sans-serif;} /*---hz-roboto---*/
h1, h2, h3, h4, h5, h6 {
  margin: 10px 0;
  font-family: font-family: 'Roboto Condensed','Source Sans Pro',Arial,'EdmondSans', 'Helvetica Neue', Helvetica,  sans-serif;/*-----was inherit-----*/
  font-weight: bold;
  line-height: 1.5em; /*--was 20px--*/
  color: inherit;
  text-rendering: optimizelegibility; 
}
h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
   font-weight: normal;
   line-height: 1;
   color: #687c87; 
}
h1, h2, h3 { line-height: 40px; }
h1 { font-size: 38.5px; }
h2 { font-size: 31.5px; }
h3 { font-size: 24.5px; }
h4 { font-size: 17.5px; }
h4.plainheader { font-size: 17.5px; margin:0; padding:0; font-weight:normal;display: inline;}/*for visually impaired who needs headers for JAW reader*/
h5 { font-size: 14px; }
h6 { font-size: 11.9px; }
h1 small { font-size: 24.5px; }
h2 small { font-size: 17.5px; }
h3 small { font-size: 14px; }
h4 small { font-size: 14px; }

.page-header { padding-bottom: 9px; margin: 20px 0 30px; border-bottom: 1px solid #7d7d7d; }

ul, ol { padding: 0; margin: 0 0 10px 25px; }
ul ul, ul ol, ol ol, ol ul { margin-bottom: 0; }
li { line-height: 1.5em; }/*hz: from 20px*/

ul.unstyled, ol.unstyled { margin-left: 0; list-style: none; }
ul.inline, ol.inline { margin-left: 0; list-style: none; }
ul.inline > li, ol.inline > li {
 display: inline-block;
 *display: inline;
 /* IE7 inline-block hack */
 *zoom: 1;
 padding-left: 5px;
 padding-right: 5px; 
}
dl { margin-bottom: 20px; }
dt, dd {   line-height: 1.5em; }/*--was 20px--*/
dt { font-weight: bold; }
dd { margin-left: 10px; }
.dl-horizontal { *zoom: 1; }
.dl-horizontal:before, .dl-horizontal:after {
 display: table;
 content: "";
 line-height: 0; 
}
.dl-horizontal:after { clear: both; }
.dl-horizontal dt {
 float: left;
 width: 160px;
 clear: left;
 text-align: right;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap; 
}
.dl-horizontal dd { margin-left: 180px; }

hr {
  margin: 20px 0;
  border: 0;
  border-top: 1px solid #7d7d7d;
  border-bottom: 1px solid white; 
}

abbr[title],
abbr[data-original-title] {
  cursor: help;
  border-bottom: 1px dotted #687c87; }

abbr.initialism {
  font-size: 90%;
  text-transform: uppercase; }

blockquote {
  padding: 0 0 0 15px;
  margin: 0 0 20px;
  /*border-left: 5px solid #7d7d7d;*/ }
  blockquote p {
   margin-bottom: 0;
   /*font-size: 17.5px;
   font-weight: 300;
   line-height: 1.25;*/ }
  blockquote small {
   display: block;
   line-height: 1.5em;/*--was 20px--*/
   color: #687c87; }
   blockquote small:before {
    content: '\2014 \00A0'; }
  blockquote.pull-right {
   float: right;
   padding-right: 15px;
   padding-left: 0;
   border-right: 5px solid #7d7d7d;
   border-left: 0; }
   blockquote.pull-right p,
   blockquote.pull-right small {
    text-align: right; }
   blockquote.pull-right small:before {
    content: ''; }
   blockquote.pull-right small:after {
    content: '\00A0 \2014'; }

q:before,
q:after,
blockquote:before,
blockquote:after {
  content: ""; }

address {
  display: block;
  margin-bottom: 20px;
  font-style: normal;
  line-height: 1.5em; }/*--was 20px--*/

form {
  margin: 0 0 20px; }

fieldset {
  padding: 0;
  margin: 0;
  border: 0; }

legend {
  display: block;
  width: 100%;
  padding: 0;
  margin-bottom: 20px;
  font-size: 21px;
  line-height: 40px;
  color: #4d4d4d;
  border: 0;
  border-bottom: 1px solid #e5e5e5; }
  legend small {
   font-size: 15px;
   color: #687c87; }

label,
input,
button,
select,
textarea {
  font-size: 14px;
  font-weight: normal;
  line-height: 1.5em; }

input,
button,
select,
textarea {
  font-family:  'Source Sans Pro','EdmondSans', 'Helvetica Neue', Helvetica, Arial, sans-serif;}
label {
  display: block;
  margin-bottom: 5px; }

select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
  display: inline-block;
  height: 20px;
  padding: 4px 6px;
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 1.5em;/*--was 20px--*/
  color: #4b4c4f;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  vertical-align: middle; }

input,
textarea,
.uneditable-input {
  width: 206px; }

textarea {
  height: auto; }

textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
  background-color: white;
  border: 1px solid #cccccc;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
  -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
  -o-transition: border linear 0.2s, box-shadow linear 0.2s;
  transition: border linear 0.2s, box-shadow linear 0.2s; }
  textarea:focus,
  input[type="text"]:focus,
  input[type="password"]:focus,
  input[type="datetime"]:focus,
  input[type="datetime-local"]:focus,
  input[type="date"]:focus,
  input[type="month"]:focus,
  input[type="time"]:focus,
  input[type="week"]:focus,
  input[type="number"]:focus,
  input[type="email"]:focus,
  input[type="url"]:focus,
  input[type="search"]:focus,
  input[type="tel"]:focus,
  input[type="color"]:focus,
  .uneditable-input:focus {
   border-color: rgba(82, 168, 236, 0.8);
   outline: 0;
   outline: thin dotted \9;
   /* IE6-9 */
   -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
   -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); }

input[type="radio"],
input[type="checkbox"] {
  margin: 4px 0 0;
  *margin-top: 0;
  /* IE7 */
  margin-top: 1px \9;
  /* IE8-9 */
  line-height: normal; }

input[type="file"],
input[type="image"],
input[type="submit"],
input[type="reset"],
input[type="button"],
input[type="radio"],
input[type="checkbox"] {
  width: auto; }

select,
input[type="file"] {
  height: 30px;
  /* In IE7, the height of the select element cannot be changed by height, only font-size */
  *margin-top: 4px;
  /* For IE7, add top margin to align select with labels */
  line-height: 30px; }

select {
  width: 255px; /* 220px */
  border: 1px solid #cccccc;
  background-color: white; }

select[multiple],
select[size] {
  height: auto; }

select:focus,
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
  outline: thin dotted #333;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px; }

.uneditable-input,
.uneditable-textarea {
  color: #687c87;
  background-color: #fcfcfc;
  border-color: #cccccc;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.025);
  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.025);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.025);
  cursor: not-allowed; }

.uneditable-input {
  overflow: hidden;
  white-space: nowrap; }

.uneditable-textarea {
  width: auto;
  height: auto; }

input:-moz-placeholder,
textarea:-moz-placeholder {
  color: #687c87; }
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #687c87; }
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #687c87; }

.radio,
.checkbox {
  min-height: 20px;
  padding-left: 20px; }

.radio input[type="radio"],
.checkbox input[type="checkbox"] {
  float: left;
  margin-left: -20px; }

.controls > .radio:first-child,
.controls > .checkbox:first-child {
  padding-top: 5px; }

.radio.inline,
.checkbox.inline {
  display: inline-block;
  padding-top: 5px;
  margin-bottom: 0;
  vertical-align: middle; }

.radio.inline + .radio.inline,
.checkbox.inline + .checkbox.inline {
  margin-left: 10px; }

.input-mini {
  width: 60px; }

.input-small {
  width: 90px; }

.input-medium {
  width: 150px; }

.input-large {
  width: 210px; }

.input-xlarge {
  width: 270px; }

.input-xxlarge {
  width: 530px; }

input[class*="span"],
select[class*="span"],
textarea[class*="span"],
.uneditable-input[class*="span"],
.row-fluid input[class*="span"],
.row-fluid select[class*="span"],
.row-fluid textarea[class*="span"],
.row-fluid .uneditable-input[class*="span"] {
  float: none;
  margin-left: 0; }

.input-append input[class*="span"],
.input-append .uneditable-input[class*="span"],
.input-prepend input[class*="span"],
.input-prepend .uneditable-input[class*="span"],
.row-fluid input[class*="span"],
.row-fluid select[class*="span"],
.row-fluid textarea[class*="span"],
.row-fluid .uneditable-input[class*="span"],
.row-fluid .input-prepend [class*="span"],
.row-fluid .input-append [class*="span"] {
  display: inline-block; }

input,
textarea,
.uneditable-input {
  margin-left: 0; }

.controls-row [class*="span"] + [class*="span"] {
  margin-left: 20px; }

input.span1,
textarea.span1,
.uneditable-input.span1 {
  width: 46px; }

input.span2,
textarea.span2,
.uneditable-input.span2 {
  width: 126px; }

input.span3,
textarea.span3,
.uneditable-input.span3 {
  width: 206px; }

input.span4,
textarea.span4,
.uneditable-input.span4 {
  width: 286px; }

input.span5,
textarea.span5,
.uneditable-input.span5 {
  width: 366px; }

input.span6,
textarea.span6,
.uneditable-input.span6 {
  width: 446px; }

input.span7,
textarea.span7,
.uneditable-input.span7 {
  width: 526px; }

input.span8,
textarea.span8,
.uneditable-input.span8 {
  width: 606px; }

input.span9,
textarea.span9,
.uneditable-input.span9 {
  width: 686px; }

input.span10,
textarea.span10,
.uneditable-input.span10 {
  width: 766px; }

input.span11,
textarea.span11,
.uneditable-input.span11 {
  width: 846px; }

input.span12,
textarea.span12,
.uneditable-input.span12 {
  width: 926px; }

.controls-row {
  *zoom: 1; }
  .controls-row:before, .controls-row:after {
   display: table;
   content: "";
   line-height: 0; }
  .controls-row:after {
   clear: both; }

.controls-row [class*="span"],
.row-fluid .controls-row [class*="span"] {
  float: left; }

.controls-row .checkbox[class*="span"],
.controls-row .radio[class*="span"] {
  padding-top: 5px; }

input[disabled],
select[disabled],
textarea[disabled],
input[readonly],
select[readonly],
textarea[readonly] {
  cursor: not-allowed;
  background-color: #7d7d7d; }

input[type="radio"][disabled],
input[type="checkbox"][disabled],
input[type="radio"][readonly],
input[type="checkbox"][readonly] {
  background-color: transparent; }

.form-actions {
  padding: 19px 20px 20px;
  margin-top: 20px;
  margin-bottom: 20px;
  background-color: whitesmoke;
  border-top: 1px solid #e5e5e5;
  *zoom: 1; }
  .form-actions:before, .form-actions:after {
   display: table;
   content: "";
   line-height: 0; }
  .form-actions:after {
   clear: both; }


input.search-query {
  padding-right: 14px;
  padding-right: 4px \9;
  padding-left: 14px;
  padding-left: 4px \9;
  /* IE7-8 doesn't have border-radius, so don't indent the padding */
  margin-bottom: 0;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px; }



[class^="icon-"],
[class*=" icon-"] {
  display: inline-block;
  width: 14px;
  height: 14px;
  *margin-right: .3em;
  line-height: 14px;
  vertical-align: text-top;
  background-image: url("../img/glyphicons-halflings.png");
  background-position: 14px 14px;
  background-repeat: no-repeat;
  margin-top: 1px; }

.btn {
  display: inline-block;
  *display: inline;
  /* IE7 inline-block hack */
  *zoom: 1;
  padding: 5px 12px;
  margin-bottom: 0;
  font-size: 12.6px;
  line-height: 1.5em;/*--was 20px--*/
  text-align: center;
  text-transform: none;/*----was-uppercase-----*/
  vertical-align: middle;
  cursor: pointer;
  color: #4d4d4d;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  background-color: whitesmoke;
  background-image: -moz-linear-gradient(top, white, #e6e6e6);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(white), to(#e6e6e6));
  background-image: -webkit-linear-gradient(top, white, #e6e6e6);
  background-image: -o-linear-gradient(top, white, #e6e6e6);
  background-image: linear-gradient(to bottom, white, #e6e6e6);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFE6E6E6', GradientType=0);
  border-color: #e6e6e6 #e6e6e6 #bfbfbf;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #e6e6e6;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  border: 1px solid #2d2d2d;
  /**border: 0; // Remove the border to prevent IE7's black border on input:focus*/
  /*border-bottom-color: darken($btnBorder, 10%);*/
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  *margin-left: .3em;
  /*@include box-shadow(inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05));*/ }
  .btn:hover, .btn:focus, .btn:active, .btn.active, .btn.disabled, .btn[disabled] {
   color: #4d4d4d;
   background-color: #e6e6e6;
   *background-color: #d9d9d9; }
  .btn:active, .btn.active {
   background-color: #cccccc \9; }
  .btn:first-child {
   *margin-left: 0; }
  .btn:hover, .btn:focus {
   color: #4d4d4d;
   text-decoration: none;
   background-position: 0 -15px;
   -webkit-transition: background-position 0.1s linear;
   -moz-transition: background-position 0.1s linear;
   -o-transition: background-position 0.1s linear;
   transition: background-position 0.1s linear;

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

}
  .btn:focus {
   outline: thin dotted #333;
   outline: 5px auto -webkit-focus-ring-color;
   outline-offset: -2px; }
  .btn.active, .btn:active {
   background-image: none;
   outline: 0;
   -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
   -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
   box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); }
  .btn.disabled, .btn[disabled] {
   cursor: default;
   background-image: none;
   opacity: 0.65;
   filter: alpha(opacity=65);
   -webkit-box-shadow: none;
   -moz-box-shadow: none;
   box-shadow: none; }

.btn-large {
  padding: 11px 19px;
  font-size: 17.5px;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px; }

.btn-large [class^="icon-"],
.btn-large [class*=" icon-"] {
  margin-top: 4px; }

.btn-small {
  padding: 2px 10px;
  font-size: 11.9px;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px; }

.btn-small [class^="icon-"],
.btn-small [class*=" icon-"] {
  margin-top: 0; }

.btn-mini [class^="icon-"],
.btn-mini [class*=" icon-"] {
  margin-top: -1px; }

.btn-mini {
  padding: 0px 6px;
  font-size: 10.5px;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px; }

.btn-block {
  display: block;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.btn-block + .btn-block {
  margin-top: 5px; }

input[type="submit"].btn-block,
input[type="reset"].btn-block,
input[type="button"].btn-block {
  width: 100%; }

.btn-primary.active,
.btn-warning.active,
.btn-danger.active,
.btn-success.active,
.btn-info.active,
.btn-inverse.active {
  color: rgba(255, 255, 255, 0.75); }

.btn-primary {
  color: white;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #003278;
  background-image: -moz-linear-gradient(top, #004278, #001a78);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#004278), to(#001a78));
  background-image: -webkit-linear-gradient(top, #004278, #001a78);
  background-image: -o-linear-gradient(top, #004278, #001a78);
  background-image: linear-gradient(to bottom, #004278, #001a78);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF004278', endColorstr='#FF001A78', GradientType=0);
  border-color: #001a78 #001a78 #00092b;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #001a78;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); }
  .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-primary.disabled, .btn-primary[disabled] {
   color: white;
   background-color: #001a78;
   *background-color: #00145e; }
  .btn-primary:active, .btn-primary.active {
   background-color: #000f45 \9; }

.btn-warning {
  color: white;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #f9a732;
  background-image: -moz-linear-gradient(top, #fbb450, #f89406);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fbb450), to(#f89406));
  background-image: -webkit-linear-gradient(top, #fbb450, #f89406);
  background-image: -o-linear-gradient(top, #fbb450, #f89406);
  background-image: linear-gradient(to bottom, #fbb450, #f89406);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFBB450', endColorstr='#FFF89406', GradientType=0);
  border-color: #f89406 #f89406 #ad6704;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #f89406;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); }
  .btn-warning:hover, .btn-warning:focus, .btn-warning:active, .btn-warning.active, .btn-warning.disabled, .btn-warning[disabled] {
   color: white;
   background-color: #f89406;
   *background-color: #df8505; }
  .btn-warning:active, .btn-warning.active {
   background-color: #c67605 \9; }

.btn-danger {
  color: white;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #c0004e;
  background-image: -moz-linear-gradient(top, #b7044d, #c0004e);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b7044d), to(#c0004e));
  background-image: -webkit-linear-gradient(top, #b7044d, #c0004e);
  background-image: -o-linear-gradient(top, #b7044d, #c0004e);
  background-image: linear-gradient(to bottom, #b7044d, #c0004e);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEE5F5B', endColorstr='#FFBD362F', GradientType=0);
  border-color: #c0004e #c0004e #c0004e;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #c0004e;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); }
  .btn-danger:hover, .btn-danger:focus, .btn-danger:active, .btn-danger.active, .btn-danger.disabled, .btn-danger[disabled] {
   color: white;
   background-color: #c0004e;
   *background-color: #c0004e; }
  .btn-danger:active, .btn-danger.active {
   background-color: #c0004e \9; }

.btn-success {
  color: white;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #7fac02;
  background-image: -moz-linear-gradient(top, #7fba00, #819705);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#7fba00), to(#819705));
  background-image: -webkit-linear-gradient(top, #7fba00, #819705);
  background-image: -o-linear-gradient(top, #7fba00, #819705);
  background-image: linear-gradient(to bottom, #7fba00, #819705);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF7FBA00', endColorstr='#FF819705', GradientType=0);
  border-color: #819705 #819705 #424d03;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #819705;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); }
  .btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active, .btn-success.disabled, .btn-success[disabled] {
   color: white;
   background-color: #819705;
   *background-color: #6c7e04; }
  .btn-success:active, .btn-success.active {
   background-color: #576603 \9; }

.btn-info {
  color: white;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #49afcd;
  background-image: -moz-linear-gradient(top, #5bc0de, #2f96b4);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5bc0de), to(#2f96b4));
  background-image: -webkit-linear-gradient(top, #5bc0de, #2f96b4);
  background-image: -o-linear-gradient(top, #5bc0de, #2f96b4);
  background-image: linear-gradient(to bottom, #5bc0de, #2f96b4);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF5BC0DE', endColorstr='#FF2F96B4', GradientType=0);
  border-color: #2f96b4 #2f96b4 #1f6377;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #2f96b4;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); }
  .btn-info:hover, .btn-info:focus, .btn-info:active, .btn-info.active, .btn-info.disabled, .btn-info[disabled] {
   color: white;
   background-color: #2f96b4;
   *background-color: #2a85a0; }
  .btn-info:active, .btn-info.active {
   background-color: #24748c \9; }

.btn-inverse {
  color: white;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #403f40;
  background-image: -moz-linear-gradient(top, #444444, #3b393a);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#444444), to(#3b393a));
  background-image: -webkit-linear-gradient(top, #444444, #3b393a);
  background-image: -o-linear-gradient(top, #444444, #3b393a);
  background-image: linear-gradient(to bottom, #444444, #3b393a);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF444444', endColorstr='#FF3B393A', GradientType=0);
  border-color: #3b393a #3b393a #141314;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #3b393a;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); }
  .btn-inverse:hover, .btn-inverse:focus, .btn-inverse:active, .btn-inverse.active, .btn-inverse.disabled, .btn-inverse[disabled] {
   color: white;
   background-color: #3b393a;
   *background-color: #2e2c2d; }
  .btn-inverse:active, .btn-inverse.active {
   background-color: #212021 \9; }

button.btn,
input[type="submit"].btn {
  *padding-top: 3px;
  *padding-bottom: 3px; }
  button.btn::-moz-focus-inner,
  input[type="submit"].btn::-moz-focus-inner {
   padding: 0;
   border: 0; }
  button.btn.btn-large,
  input[type="submit"].btn.btn-large {
   *padding-top: 7px;
   *padding-bottom: 7px; }
  button.btn.btn-small,
  input[type="submit"].btn.btn-small {
   *padding-top: 3px;
   *padding-bottom: 3px; }
  button.btn.btn-mini,
  input[type="submit"].btn.btn-mini {
   *padding-top: 1px;
   *padding-bottom: 1px; }

.btn-link,
.btn-link:active,
.btn-link[disabled] {
  background-color: transparent;
  background-image: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none; }

.btn-link {
  border-color: transparent;
  cursor: pointer;
  color: #004278;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0; }

.btn-link:hover,
.btn-link:focus {
  color: #004278;
  text-decoration: underline;
  background-color: transparent; }

.btn-link[disabled]:hover,
.btn-link[disabled]:focus {
  color: #4d4d4d;
  text-decoration: none; }

.btn-group {
  position: relative;
  display: inline-block;
  *display: inline;
  /* IE7 inline-block hack */
  *zoom: 1;
  font-size: 0;
  vertical-align: middle;
  white-space: nowrap;
  *margin-left: .3em; }
  .btn-group:first-child {
   *margin-left: 0; }

.btn-group + .btn-group {
  margin-left: 5px; }

.btn-toolbar {
  font-size: 0;
  margin-top: 10px;
  margin-bottom: 10px; }
  .btn-toolbar > .btn + .btn,
  .btn-toolbar > .btn-group + .btn,
  .btn-toolbar > .btn + .btn-group {
   margin-left: 5px; }

.btn-group > .btn {
  position: relative;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0; }

.btn-group > .btn + .btn {
  margin-left: -1px; }

.btn-group > .btn,
.btn-group > .dropdown-menu,
.btn-group > .popover {
  font-size: 14px; }

.btn-group > .btn-mini {
  font-size: 10.5px; }

.btn-group > .btn-small {
  font-size: 11.9px; }

.btn-group > .btn-large {
  font-size: 17.5px; }

.btn-group > .btn:first-child {
  margin-left: 0;
  -webkit-border-top-left-radius: 0px;
  -moz-border-radius-topleft: 0px;
  border-top-left-radius: 0px;
  -webkit-border-bottom-left-radius: 0px;
  -moz-border-radius-bottomleft: 0px;
  border-bottom-left-radius: 0px; }

.btn-group > .btn:last-child,
.btn-group > .dropdown-toggle {
  -webkit-border-top-right-radius: 0px;
  -moz-border-radius-topright: 0px;
  border-top-right-radius: 0px;
  -webkit-border-bottom-right-radius: 0px;
  -moz-border-radius-bottomright: 0px;
  border-bottom-right-radius: 0px; }

.btn-group > .btn.large:first-child {
  margin-left: 0;
  -webkit-border-top-left-radius: 0px;
  -moz-border-radius-topleft: 0px;
  border-top-left-radius: 0px;
  -webkit-border-bottom-left-radius: 0px;
  -moz-border-radius-bottomleft: 0px;
  border-bottom-left-radius: 0px; }

.btn-group > .btn.large:last-child,
.btn-group > .large.dropdown-toggle {
  -webkit-border-top-right-radius: 0px;
  -moz-border-radius-topright: 0px;
  border-top-right-radius: 0px;
  -webkit-border-bottom-right-radius: 0px;
  -moz-border-radius-bottomright: 0px;
  border-bottom-right-radius: 0px; }

.btn-group > .btn:hover,
.btn-group > .btn:focus,
.btn-group > .btn:active,
.btn-group > .btn.active {
  z-index: 2; }

.btn-group .dropdown-toggle:active,
.btn-group.open .dropdown-toggle {
  outline: 0; }

.btn-group > .btn + .dropdown-toggle {
  padding-left: 8px;
  padding-right: 8px;
  -webkit-box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.125), inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.125), inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
  box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.125), inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
  *padding-top: 5px;
  *padding-bottom: 5px; }

.btn-group > .btn-mini + .dropdown-toggle {
  padding-left: 5px;
  padding-right: 5px;
  *padding-top: 2px;
  *padding-bottom: 2px; }

.btn-group > .btn-small + .dropdown-toggle {
  *padding-top: 5px;
  *padding-bottom: 4px; }

.btn-group > .btn-large + .dropdown-toggle {
  padding-left: 12px;
  padding-right: 12px;
  *padding-top: 7px;
  *padding-bottom: 7px; }

.btn-group.open .dropdown-toggle {
  background-image: none;
  -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); }
.btn-group.open .btn.dropdown-toggle {
  background-color: #e6e6e6; }
.btn-group.open .btn-primary.dropdown-toggle {
  background-color: #001a78; }
.btn-group.open .btn-warning.dropdown-toggle {
  background-color: #f89406; }
.btn-group.open .btn-danger.dropdown-toggle {
  background-color: #bd362f; }
.btn-group.open .btn-success.dropdown-toggle {
  background-color: #819705; }
.btn-group.open .btn-info.dropdown-toggle {
  background-color: #2f96b4; }
.btn-group.open .btn-inverse.dropdown-toggle {
  background-color: #3b393a; }

.btn .caret {
  margin-top: 8px;
  margin-left: 0; }

.btn-large .caret {
  margin-top: 6px; }

.btn-large .caret {
  border-left-width: 5px;
  border-right-width: 5px;
  border-top-width: 5px; }

.btn-mini .caret,
.btn-small .caret {
  margin-top: 8px; }

.dropup .btn-large .caret {
  border-bottom-width: 5px; }

.btn-primary .caret,
.btn-warning .caret,
.btn-danger .caret,
.btn-info .caret,
.btn-success .caret,
.btn-inverse .caret {
  border-top-color: white;
  border-bottom-color: white; }

.btn-group-vertical {
  display: inline-block;
  *display: inline;
  /* IE7 inline-block hack */
  *zoom: 1; }

.btn-group-vertical > .btn {
  display: block;
  float: none;
  max-width: 100%;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0; }
.btn-group-vertical > .btn + .btn {
  margin-left: 0;
  margin-top: -1px; }
.btn-group-vertical > .btn:first-child {
  -webkit-border-radius: 0px 0px 0 0;
  -moz-border-radius: 0px 0px 0 0;
  border-radius: 0px 0px 0 0; }
.btn-group-vertical > .btn:last-child {
  -webkit-border-radius: 0 0 0px 0px;
  -moz-border-radius: 0 0 0px 0px;
  border-radius: 0 0 0px 0px; }
.btn-group-vertical > .btn-large:first-child {
  -webkit-border-radius: 0px 0px 0 0;
  -moz-border-radius: 0px 0px 0 0;
  border-radius: 0px 0px 0 0; }
.btn-group-vertical > .btn-large:last-child {
  -webkit-border-radius: 0 0 0px 0px;
  -moz-border-radius: 0 0 0px 0px;
  border-radius: 0 0 0px 0px; }
.form-inline input { margin-bottom: 0px ;}
.input-append, .input-prepend {
   display: inline-block;
   font-size: 0;
   margin-bottom: 10px;
   vertical-align: middle;
   white-space: nowrap;
   margin-bottom: 0px ;
}

.btn-radius {

 -webkit-border-radius: 12px;
   -moz-border-radius: 12px;
   border-radius: 12px;
}

.btnWhite {
  background-color: #ffffff !important;
  border: 2px solid #84bd00;
  color: #3a8600 !important;
  text-shadow: none !important;
  background-image: none !important;
}


.input-append .add-on, .input-append .btn, .input-append .btn-group {
   margin-left: -1px;
   vertical-align: top;
}
.nav {
  margin-left: 0;
  margin-bottom: 20px;
  list-style: none; }
.nav > li > a {
  display: block; }
.nav > li > a:hover,
.nav > li > a:focus {
  text-decoration: none;
  background-color: #7d7d7d; }
.nav > li > a > img {
  max-width: none; }
.nav > .pull-right {
  float: right; }
.nav-header {
  display: block;
  padding: 3px 15px;
  font-size: 11px;
  font-weight: bold;
  line-height: 1.5em;/*--was 20px--*/
  color: #687c87;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  text-transform: uppercase; }
.nav li + .nav-header {
  margin-top: 9px; }
.nav > .disabled > a {
  color: #687c87; }
.nav > .disabled > a:hover,
.nav > .disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: default; }
.breadcrumb {
  padding: 8px 15px;
  margin: 0 0 20px;
  list-style: none;
  background-color: #f5f5f5;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px; }
  .breadcrumb > li {
   display: inline-block;
   *display: inline;
   /* IE7 inline-block hack */
   *zoom: 1;
   text-shadow: 0 1px 0 white; }
   .breadcrumb > li > .divider {
    padding: 0 5px;
    color: #ccc; }
  .breadcrumb .active {
   color: #687c87; }

.thumbnails {
  margin-left: -20px;
  list-style: none;
  *zoom: 1; }
  .thumbnails:before, .thumbnails:after {
   display: table;
   content: "";
   line-height: 0; }
  .thumbnails:after {
   clear: both; }

.row-fluid .thumbnails {
  margin-left: 0; }

.thumbnails > li {
  float: left;
  margin-bottom: 20px;
  margin-left: 20px; }

.thumbnail {
  display: block;
  padding: 4px;
  line-height: 1.5em; /*--was 20px--*/
  border: 1px solid #ddd;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out; }

a.thumbnail:hover,
a.thumbnail:focus {
  border-color: #004278;
  -webkit-box-shadow: 0 1px 4px rgba(0, 105, 214, 0.25);
  -moz-box-shadow: 0 1px 4px rgba(0, 105, 214, 0.25);
  box-shadow: 0 1px 4px rgba(0, 105, 214, 0.25); }

.thumbnail > img {
  display: block;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto; }

.thumbnail .caption {
  padding: 9px;
  color: #4b4c4f; }

.accordion {
  margin-bottom: 20px; }

.accordion-group {
  margin-bottom: 2px;
  border: 1px solid #e5e5e5;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px; }

.accordion-heading {
  border-bottom: 0; }

.accordion-heading .accordion-toggle {
  display: block;
  padding: 8px 15px; }

.accordion-toggle {
  cursor: pointer; }

.accordion-inner {
  padding: 9px 15px;
  border-top: 1px solid #e5e5e5; }

.pull-right {
  float: right; }

.pull-left {
  float: left; }

.hide {
  display: none; }

.show {
  display: block; }

.invisible {
  visibility: hidden; }

.affix {
  position: fixed; }

.clearfix {
  *zoom: 1; }
  .clearfix:before, .clearfix:after {
   display: table;
   content: "";
   line-height: 0; }
  .clearfix:after {
   clear: both; }

.hide-text {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0; }

.input-block-level {
  display: block;
  width: 100%;
  min-height: 30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

/*@import "lib/responsive.scss";*/
/*============================
Table of Contents
==============================

Typography
Global
Sprites (Not yet complete)
Header
Matrix
Content Area
Grid overwrites 
Footer
Content Elements
Lists
Tables
Utility Classes
Background Color Classes
Misc
Homepage Content Elements
Inner pages

3rd Party CSS
-- Dropkick

============================*/
/*============================
Typography
============================*/
h1, h2, h3, h4, h5 {
  font-weight: normal; }
h1 {font-weight: bold; color: #2d2d2d;font-family: 'Roboto Condensed','Source Sans Pro',Arial,'EdmondSans', 'Helvetica Neue', Helvetica,  sans-serif;letter-spacing: -0.5px;}/*---haziel added to make all h1 roboto----*/
/*---h1,--hz took out---*/ h2, h3 {
  font-weight: bold;
  color: #2d2d2d;
  font-family: font-family: 'Roboto Condensed','Source Sans Pro',Arial,'EdmondSans', 'Helvetica Neue', Helvetica,  sans-serif;
  letter-spacing: -0.5px; }

#info-pathways h1, #info-pathways h2, .test h1, .test h2 {
   font-family:  'Roboto Condensed','Source Sans Pro',Arial,'EdmondSans', 'Helvetica Neue', Helvetica,  sans-serif;
  font-weight: 400; }/*---was-"normal"-hz----*/
#info-pathways h2, .test h2 {
  font-size: 1.3em; }

h1 {
  font-size: 1.875em; font-family:  'Roboto Condensed','Source Sans Pro',Arial,'EdmondSans', 'Helvetica Neue', Helvetica,  sans-serif;
  /* 30px */ }

h2 {
  font-size: 1.5em;
  /* 24px */ }

h3 {
  font-size: 1.250em;
  /* 20px */ }

.heading-green {
  font-family:  'Source Sans Pro','EdmondSans', 'Helvetica Neue', Helvetica, Arial, sans-serif; 
  color: #7fba00;
  font-weight: 600;
  letter-spacing: normal;line-height:1.5em; }

h4 {
  font-size: 1.063em;
  /* 17px  uses EdmondSans*/ }

h5 {
  font-size: 1em;
  /* 16px uses EdmondSans */ }
p {
  line-height: 1.5em;
 font-family:  'Source Sans Pro','EdmondSans', 'Helvetica Neue', Helvetica, Arial, sans-serif; }
/* indent by ~60px */
ol, ul {
  margin-left: 6.38298%;
  /* 60px / 940px */ }

ul li {
  line-height: 1.8em; }

/* Override form elements font size */
label,
input,
button,
select,
textarea {
  font-size: inherit;
  /* 18px from <body> */ }

.small-text {
  font-size: 0.66666666666667em; }

.large-text {
  font-size: 1.2em; }

/* Responsive type */
@media screen and (max-width: 480px) {
  h1, h2 {
   margin: 0.21em 0;
   line-height: 35px; }

  h3, h4 {
   margin: 0.21em 0;
   line-height: 24px; }

  ul li {
   line-height: 1.65em; } }
/*============================
Global
============================*/
body {
  border-top: 5px solid #4d4d4d;
  font-family: 'Source Sans Pro', 'EdmondSans',  'Helvetica Neue', Helvetica, Arial, sans-serif, 'Open Sans', 'Ubuntu', 'Roboto';   font-weight:400;/*haziel google font*/
  font-size: 17px;line-height: 1.5em; /*---was 20px---*/
  /* 16px */
  padding: 0px;}


form {
  margin: 0; }

.row {
  margin-bottom: 20px; }

.row.no-margin {
  margin-bottom: 0; }

/* .btn overrides. Create a $green to $greenDark and $grayLighter to $black gradient */
.btn.greenButton {
  color: #fff;
  /*text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);*/
  background-color: #7fac02;
  background-image: -moz-linear-gradient(top, #7fba00, #819705);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#7fba00), to(#819705));
  background-image: -webkit-linear-gradient(top, #7fba00, #819705);
  background-image: -o-linear-gradient(top, #7fba00, #819705);
  background-image: linear-gradient(to bottom, #7fba00, #819705);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF7FBA00', endColorstr='#FF819705', GradientType=0);
  border-color: #819705 #819705 #424d03;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #819705;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  border: 1px solid #819705; }
  .btn.greenButton:hover, .btn.greenButton:focus, .btn.greenButton:active, .btn.greenButton.active, .btn.greenButton.disabled, .btn.greenButton[disabled] {
   color: #fff;
   background-color: #819705;
   *background-color: #6c7e04; }
  .btn.greenButton:active, .btn.greenButton.active {
   background-color: #576603 \9; }

.btn.blackButton {
  color: white;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  background-color: #5d5d5d;
  background-image: -moz-linear-gradient(top, #7d7d7d, #2d2d2d);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#7d7d7d), to(#2d2d2d));
  background-image: -webkit-linear-gradient(top, #7d7d7d, #2d2d2d);
  background-image: -o-linear-gradient(top, #7d7d7d, #2d2d2d);
  background-image: linear-gradient(to bottom, #7d7d7d, #2d2d2d);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF7D7D7D', endColorstr='#FF2D2D2D', GradientType=0);
  border-color: #2d2d2d #2d2d2d #070707;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #2d2d2d;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  border: 1px solid #2d2d2d;
  text-shadow: none; }
  .btn.blackButton:hover, .btn.blackButton:focus, .btn.blackButton:active, .btn.blackButton.active, .btn.blackButton.disabled, .btn.blackButton[disabled] {
   color: white;
   background-color: #2d2d2d;
   *background-color: #202020; }
  .btn.blackButton:active, .btn.blackButton.active {
   background-color: #141414 \9; }

.btn.blueDarkButton {
  background-color: #002b52;
  border: 1px solid #2d2d2d;
  background-image: none; }

/* Break point 460px */
@media screen and (max-width: 480px) {
  body {
   font-size: 95%;
   border-top: none; } }
/*============================
Sprites
============================*/
.sprite { background: url(/media/vancouver-community-college/style-assets/css/style-images/sprites-23-june-2016.png) no-repeat top left; } /* sprites.png */
.sprite-arrow-left-dark-jumbo { background-position: 0 0; width: 22px; height: 35px; }
.sprite-arrow-left-small-light { background-position: 0 -55px; width: 9px; height: 11px; }
.sprite-arrow-right-blue-large { background-position: 0 -86px; width: 11px; height: 19px; }
.sprite-arrow-right-dark-jumbo { background-position: 0 -125px; width: 22px; height: 35px; }
.sprite-arrow-right-dark-small { background-position: 0 -180px; width: 9px; height: 11px; }
.sprite-arrow-right-dark-blue-small{ background-position:0 -1663px;width:9px;height:15px; }
.sprite-arrow-right-small-light { background-position: 0 -211px; width: 9px; height: 11px; }
.sprite-calendar-dark-small { background-position: 0 -242px; width: 16px; height: 13px; }
.sprite-calendar-white-large { background-position: 0 -275px; width: 68px; height: 67px; }
.sprite-conversation-white-large { background-position: 0 -362px; width: 109px; height: 74px; }

@media screen and (max-width: 480px) {
 .sprite-conversation-white-large {
    width: 75px;
    height: 51px;
    background-position: 0 0px;
    background-image: url(/media/vancouver-community-college/style-assets/css/style-images/conversation-white-75x51.png); } 
}
.sprite-conversation-white-mid { background-position: 0 -456px; width: 45px; height: 33px; }
.sprite-dollar-white-mid { background-position: 0 -509px; width: 13px; height: 25px; }
.sprite-facebook-black-small { background-position: 0 -554px; width: 22px; height: 22px; }
.sprite-facebook-dark-small { background-position: 0 -596px; width: 15px; height: 15px; }
.sprite-facebook-white { background-position: 0 -631px; width: 22px; height: 22px; }
.sprite-flickr-black-small { background-position: 0 -673px; width: 22px; height: 10px; }
.sprite-flickr-white { background-position: 0 -698px; width: 22px; height: 22px; }
.sprite-grad-white-large { background-position: 0 -733px; width: 45px; height: 56px; }

@media screen and (max-width: 480px) {
  .sprite-grad-white-large { width: 26px; height: 32px; background-position: 0 -805px; } 
  .sprite-tv-white-large { width: 36px; height: 51px; background-position: 0 -2253px; } 
  .sprite-tuxedo-white-large { width: 111px; height: 78px; background-position: 0 -2480px; }
  .sprite-attache-case-white-large { width: 60px; height: 58px; background-position: 0 -2553px; }
 }
.sprite-graduation-white-mid { background-position: 0 -809px; width: 26px; height: 32px; }
.sprite-graph-white-mid { background-position: 0 -861px; width: 31px; height: 27px; }
.sprite-head-question-white-mid { background-position: 0 -908px; width: 22px; height: 26px; }
.sprite-head-tick-white-mid { background-position: 0 -954px; width: 22px; height: 26px; }
.sprite-house { background-position: 0 -997px; width: 36px; height: 37px; }
.sprite-info-white-mid { background-position: 0 -1054px; width: 24px; height: 24px; }
.sprite-news-dark-small { background-position: 0 -1098px; width: 20px; height: 14px; }
.sprite-person-white-mid { background-position: 0 -1132px; width: 31px; height: 29px; }
.sprite-pin-dark-large { background-position: 0 -1181px; width: 41px; height: 41px; }
.sprite-star-white-mid { background-position: 0 -1242px; width: 31px; height: 30px; }
.sprite-thumbs-up-white-mid { background-position: 0 -1292px; width: 26px; height: 27px; }
.sprite-twitter-black-small { background-position: 0 -1339px; width: 22px; height: 17px; }
.sprite-twitter-white { background-position: 0 -1374px; width: 22px; height: 22px; }
.sprite-white-arrow-small-right { background-position: 0 -1413px; width: 5px; height: 10px; }
.sprite-youtube-black-small { background-position: 0 -1443px; width: 25px; height: 17px; }
.sprite-youtube-white { background-position: 0 -1478px; width: 25px; height: 22px; }
.sprite-instagram-black-small { background-position: 0 -2367px; width: 23px; height: 23px; }
.sprite-instagram-white-small { background-position: 0 -2395px; width: 23px; height: 23px; }
.sprite-show-more { background-position: 0px -1530px; width: 25px; height: 20px; }
.sprite-show-less { background-position: 0 -1550px; width: 564px; height: 28px; }
.sprite-show-more-progareas { background-position: 0px -1704px; width: 564px; height: 28px; } /*Haziel: Program Areas collapsed +*/
.sprite-show-less-progareas { background-position: 0 -1550px; width: 25px; height: 20px; }/*Haziel: Program Areas collapsed -*/
.sprite-mouse-white { background-position: 0 -1580px; width: 27px; height: 27px; }
.sprite-pdf-download { background-position: 0 -1615px; width: 15px; height: 15px; margin: 0 5px; }
.sprite-dept-event-white { background-position: 0 -1686px; height: 36px; width: 36px; }
.sprite-dept-jobs-white { background-position: 0 -2324px; height: 28px; width: 32px; }
.sprite-dept-event-white-small { background-position: 0 -1890px; height: 28px; width: 28px; }
.sprite-dept-gallerycamera-white { background-position: 0 -1729px; width: 26px; height: 20px;}
.sprite-dept-news-white { background-position: 0 -1757px; width: 26px; height: 28px; }
.sprite-dept-partnerships-white { background-position: 0 -1800px; width: 26px; height: 23px; }
.sprite-dept-memberships-white { background-position: 0 -2098px; width: 38px; height: 23px; }
.sprite-dept-giveback-white { background-position: 0 -2126px; width: 16px; height: 26px; }
.sprite-dept-testimonyquotes-white { background-position: 0 -1828px; width: 36px; height: 22px; }
.sprite-dept-bios-white { background-position: 0 -1857px; width: 39px; height: 27px; }
.sprite-dept-success-white { background-position: 0 -2055px;/*0 -2013px*/ width: 28px;/*34px;*/ height: 26px;/*32px;*/ }
.sprite-dept-success-white-large { background-position: 0 -2013px; width: 28px;/*34px*/ height: 26px;/*32px*/ }
.sprite-dept-awards-white { background-position: 0 -1970px; width: 26px;/*28px;*/ height: 26px;/*28px;*/ }
.sprite-dept-video-white { background-position: 0 -1928px; width: 28px; height: 28px; }
.sprite-tv-white-large { background-position: 0 -2168px; width: 55px; height: 78px; }
.sprite-form-white-sm { background-position: 0 -2438px; width: 28px; height: 32px; }
.sprite-tuxedo-white-large { background-position: 0 -2480px; width: 111px; height: 78px; }
.sprite-attache-case-white-large { background-position: 0 -2553px; width: 60px; height: 58px; }
.sprite-chat-white-small { background-position: 0 -2623px; width: 31px; height: 22px; }
span.sprite { display: inline-block; }
/*============================
Header
============================*/
.logo {
  margin-top: 10px; }
  .logo img {
   border: 2px solid white;/*2px*/
   margin-left: 0px; } /*20px*/

/* Meta-navigation updated 6th Mar 2014 to tidy up and add International link - Michael TERMINALFOUR */
.meta-nav { 
  /*width: 570px;*/ /*original 570px*/ ; 
  float: right; 
  line-height: 14px; 
  position: relative; 
} 
.meta-nav nav.quick-links ul {
  list-style: none;
  position: relative;
  display: block;
  margin: 0;
  z-index: 9999; 
}
.meta-nav nav.quick-links ul:after { content: ""; clear: both; display: block; }
.meta-nav nav.quick-links ul li { float: left; padding: 6px 1.739130434782609% 3px; display: block; }
.meta-nav nav.quick-links ul li a { display: block; }
.meta-nav nav.quick-links a:hover, .meta-nav .quick-links a:focus  { text-decoration: none; }
.meta-nav nav.quick-links li.switch-site-link, .meta-nav nav.quick-links #myVCC-link, .meta-nav nav.quick-links .quick-links {
  padding: 3px 20px;
  /*padding-right: 25px;*/
}

.meta-nav nav.quick-links li.switch-site-link { background-position: 115px -1399px; }
.meta-nav nav.quick-links li.switch-site-link a:hover, .meta-nav li.switch-site-link a:focus { text-decoration: underline;}
.meta-nav nav.quick-links #myVCC-link { background-position: 75px -1399px; }
.meta-nav nav.quick-links ul li.quick-links { 
  position: relative;
  margin-top: 3px;
  margin-right: 0px;
  height: 22px;
/*  padding-left: 18px; */
  padding-top: 0px;
  padding-bottom: 10px;
  background-position: 104px -1402px; 
}
.meta-nav nav.quick-links ul li.quick-links a:hover { text-decoration: underline; }
.meta-nav nav.quick-links ul li.quick-links ul { left: 0px; }
.meta-nav nav.quick-links ul li.border {
  color: white;
  width: 2px;
  height: 24px;
  padding-left: 0px; padding-right: 0px ; padding-top: 0px ; 
  font-size: 1.1em; 
}
.meta-nav nav.quick-links li#meta-fb-link { padding-left: 3.260869565217391%;}
.meta-nav nav.quick-links ul.quick-links li.green {
  padding-left: 18px;
  padding-right: 34px;
  height: 22px;
  background-position: 76px -1399px 
}
.meta-nav nav.quick-links ul ul { display: none; text-align: left; position: absolute; top: 100%; }
.meta-nav nav.quick-links ul li:hover > ul { display: block; }
.meta-nav nav.quick-links ul ul li {
  float: none;
  position: relative;
  white-space: nowrap; 
  padding: 3px 8px ;
}
/* End meta-navigation */
/* For the 'sticky' row that contains the main-nav and site search - class added when page scrolls */
.row.sticky {
  border-bottom: 2px solid #7fba00;
  position: fixed;
  z-index: 500;
  width: 100%;
  background-color: rgba(0, 43, 82, 0.85);
  left: 0px;
  top: 0px;
  padding: 2px 0px; }
  .row.sticky .sticky-wrap {
   margin: 0 auto;
   width: 940px; }
  .row.sticky .site-search {
   margin-top: 6px; }
  .row.sticky #primary-nav {
   margin-top: 0px; }

/* Make the subnavs sticky - fix their position and make background 0.85 opacity. They are fixed below the sticky top level navigation */
.subnav.sticky-subnav {
  position: fixed;
  width: 100%;
  background-color: rgba(77, 77, 77, 0.95);
  top: 39px;
  z-index: 600; }

#primary-nav {
  text-transform: uppercase;
  font-size: 15px;/*0.938em*/
  /* 15px */
  margin-top: 10px;
  margin-left: auto; }
  #primary-nav ul {
   margin: 0; }
  #primary-nav li {
   display: block;
   float: left;
   padding: 5px 0; }
  #primary-nav li:hover, #primary-nav li.active {
   background-color: #7fba00; }
   #primary-nav li:hover a, #primary-nav li.active a {
    border-right-color: #7fba00; }
  #primary-nav li.last a {
   border-right: none; }
  #primary-nav a {
   color: white;
   padding: 0px 10px;
   border-right: 1px solid #4d4d4d;
   text-decoration: none; }

.site-search {
  float: right;
  margin-top: 12px;
  margin-right: 1.041666666666667% ;
  /* margin-left: 640px ; */
  text-align: right; }
  .site-search form {
   width: auto; }
  .site-search input, .site-search button, #mob-site-search button {
   height: 29px;/*---was 26px---*/
   line-height: 25px;
   padding: 0;
   margin: 0;
   border: none; }
  .site-search input {
   padding: 0 5px; }
  .site-search input#q {
   width: 180px;
   margin-right: -7px; }
  .site-search button, #mob-site-search button {
   width: 30px;
   background-image: url(/media/vancouver-community-college/style-assets/css/style-images/magnifying_glass_16x16.png);
   background-repeat: no-repeat;
   background-position: 8px 5px; }

/**
  Responsive overrides for Header
  Michael TERMINALFOUR Sept '13 
**/
@media only screen and (min-width : 768px) and (max-width : 1023px) {
  .row.header-top-row { height: 120px; }
  .span6.meta-nav {min-width: 340px;}
  .span4.site-search {min-width: 259px; /* margin-right: 1.063829787234043%; 10px /940px */ }

  /* For the subnav elements */
  .faux-heading.span3 { width: 100%;}

}

/** Mega subnav **/
.subnav {
  border-top: 5px solid #7fba00;
  border-bottom: 1px solid #3f3f3f;
  padding-top: 10px; }

#programs-subnav #prog-areas-links {
  width: 510px ; padding-right: 30px ;
}
#programs-subnav #prog-areas-links ul.split-list.split-2 li {
  width: 245px ;
  padding-right: 10px ;
}
#programs-subnav .mega-search-buttons {
  padding: 20px 25px 0px;
  height: 220px;
  margin-left: -30px;
  margin-right: 10px;
  border-color: white;
  border-style: solid;
  border-width: 0px;
  border-right-width: 1px;
  border-left-width: 1px; }

#programs-subnav .ways-to-study {
  width: 210px;
  margin-left: 10px; }
.container.header .row { margin-left: 0px ; margin-right: 0px;}


/* Mega subnavs responsive - Michael TERMINALFOUR Sept-Oct 2013 */
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .subnav .container { padding: 0px 2.127659574468085%; width: 95.74468085106383% ;}
  #programs-subnav #prog-areas-links { width: 28.8888888888889% !important; /* 260px */ padding-right:  1.111111111111111%;  margin-right: 1.111111111111111% ;/* 20px */ }
  #programs-subnav .mega-search-buttons.span2 {width:26.66666666666667% !important; /* 260px/900px */ padding-right: 2.22222222222222% !important; padding-left: 2.22222222222222% !important; /* 10px / 900*/ margin: 0; margin-right: 2.22222222222222% !important; /* 10px */ }
  #programs-subnav .ways-to-study { width: 33.33333333333333%; margin-right: 0px ; margin-left: 0px}
  #programs-subnav .offset6 { margin-left: 41.04018912529551% !important; }
}

@media screen and (max-width: 1024px) {
  .sticky-wrap { width: 100%}
}

/* Mobile header */
.container.mobile-header {
  padding: 0px;
  width: 100% !important; }


/* Logo */
.logo-mobile {
  margin-top: 10px;
  margin-left: 4.34782608695652%;
  width: 115px;/*80px for plain logo*/
  float: left; }
  .logo-mobile img {
   border: 0px solid white; /*2px*/}

/* 
  Tablet adjustments 
  Covers tablet portrait
*/

/*unhide line 1991 - 2000 to replace the 50th logo with the plain logo*/
/*@media screen and (min-width:481px) and (max-width: 768px) {
.logo-mobile {
  margin-left: 4.34782608695652%;
width:13%;  
  float: left; }
  .logo-mobile img {
   width: 100% ;
   border: 2px solid white;  
}*/

/*============lines   for 50th logo====================*/
@media screen and (max-width:481px) /*(min-width:481px) and (max-width: 768px)*/ {
.logo-mobile {
  margin-left: 4.34782608695652%;
width:13%px;  /*115px*/
  float: left; }
  .logo-mobile img {
   width: 100% ;
   border: 0px solid white;
  margin-top:15px;}  
}

@media screen and (max-width: 768px) {
.logo-mobile {
  margin-left: 4.34782608695652%;
  width: 13%; /*widht of acutal logo*//*width: 13%;*//* 80px /320px /115px*/
  float: left; }
  .logo-mobile img {
   width: 100% ;
   border: 2px solid white;
  margin-top:15px;}  
}
/*============END lines for 50th logo====================*/


/* Nav buttons */
.mobile-nav-buttons {
  width: 160px;/*188px for plain logo*/
  float: right;
  margin-top: 36px;
  margin-right: 10px;
  text-align: right;
  height: 40px; }
  .mobile-nav-buttons .button-wrap {
   width: 42px;
   height: 45px;
   margin-left: 8px;
   display: inline-block; }
   .mobile-nav-buttons .button-wrap .btn {
    box-shadow: 0px 0px 1px 1px #7d7d7d; }
    .mobile-nav-buttons .button-wrap .btn a {
      background-repeat: no-repeat;
      display: inline-block;
      background-position: 0px 0px; }
   .mobile-nav-buttons .button-wrap .btn.active {
    border: 1px solid #b9b9b9; }
   .mobile-nav-buttons .button-wrap #search {
    padding: 13px 13px;
    width: 14px;
    height: 14px; }
   .mobile-nav-buttons .button-wrap #my-VCC-login {
    padding: 13px 13px;
    width: 14px;
    height: 14px; }
   .mobile-nav-buttons .button-wrap #site-nav {
    padding: 10px 8px;
    width: 24px;
    height: 20px; }
 .mobile-nav-buttons #search a {
    background-image: url(/media/vancouver-community-college/style-assets/css/style-images/magnifying_glass_16x16.png);
    width: 16px;
    height: 16px; }
  .mobile-nav-buttons #my-VCC-login a {
    background-image: url(/media/vancouver-community-college/style-assets/css/style-images/person-white-small.png); /* person-white-small.png */
    width: 16px;
    height: 14px; }
  .mobile-nav-buttons #site-nav a {
    background-image: url(/media/vancouver-community-college/style-assets/css/style-images/mob_nav_2.png); /* mob_nav_2.png */
   width: 24px;
   height: 21px; }
  .mobile-nav-buttons .black-line {
   width: 17px;
   height: 43px;
   margin-left: 6px;
   background-color: #2d2d2d;
   display: none; }

/* drop down menus hidden until associated button is clicked. */
#mobile-menus-wrap {
  overflow: hidden; }

.mobile-menu {
  position: absolute;
  top: 0px;
  left: 0px;
  margin-left: 0.625%;
  /* 1px / 320px */
  margin-left: 0.625%;
  /* 1px / 320px */
  margin-bottom: 20px;
  width: 100%;
  display: none; }
  .mobile-menu ul {
   width: 100%;
   list-style: none;
   margin: 0; }
   .mobile-menu ul li {
    clear: both;
    width: 100%;
    *zoom: 1;
    padding-top: 7px;
    background-color: #2d2d2d;
    border-bottom: 1px solid #002b52;
    text-transform: uppercase; }
    .mobile-menu ul li:before, .mobile-menu ul li:after {
      display: table;
      content: "";
      line-height: 0; }
    .mobile-menu ul li:after {
      clear: both; }
    .mobile-menu ul li a {
      padding-left: 23px;
      padding-bottom: 5px;
      width: 75%;
      display: block;
      float: left; }
    .mobile-menu ul li span.more-less {
      float: right;
      height: 24px;
      width: 24px;
      display: block;
      background-image: url(/media/vancouver-community-college/style-assets/css/style-images/mob_nav_more_less_sprite.png); /* mob_nav_more_less_sprite.png */
      background-repeat: no-repeat;
      margin-top: 0px; }
      .mobile-menu ul li span.more-less:hover {
       cursor: pointer; }
    .mobile-menu ul li ul {
      margin: 0;
      display: none; }
      .mobile-menu ul li ul li {
       background-color: #4b4c4f;
       border-bottom: none;
       list-style: none;
       margin: 0;
       border-top: 1px solid #002b52; }
       .mobile-menu ul li ul li a {
        padding-left: 46px; }
       .mobile-menu ul li ul li:first-child {
        margin-top: 4px; }
       .mobile-menu ul li ul li span.more-less {
        background-position: 0px -24px; }
        .mobile-menu ul li ul li ul li a {
          padding-left: 69px ; }
   .mobile-menu ul li.expanded {
    background-color: #4b4c4f; }
    .mobile-menu ul li.expanded > span.more-less {
      background-position: 0px -48px; }

#my-VCC-login-menu {
  z-index: 100; }

#site-nav-menu {
  z-index: 200; }


/* Mobile site  search */
#mob-site-search { padding: 10px 0.625% ; /* 2px */ background-color: #2d2d2d; z-index: 50; }
#mob-site-search form { width: 98.75%; /*316px*/ }
/* text inputs have 6px padding r- and l-. Width is to be 90% of 316px which is 284.4px, there is a 1px broder on either side so available width is 270.4 */
#mob-site-search input#q { padding: 4px 0.6329113924050633%; width: 85.56962025316456%; /* 272.4/316px */ display: block; float: left; margin-right: 0px; }
/* should be 10% of 316px = 31.6px. padding is 6px r- and l- so width is 19.6px.  */
#mob-site-search button#searchsubmit { width: 12.5%; display: block; float: left; height: 30px; padding: 4px 0.6329113924050633%; background-position: 48% 7px ;}
/* mobile site search options */
#mobile-menus-wrap #searchScope { width: 100% ; /*316px*/ margin-bottom: 0px; font-size: 14px}
#mobile-menus-wrap label[for*='searchScope'] { float: none; clear: both; width: 100% ; font-size: 14px; }

@media screen and (min-width: 321px) and (max-width: 768px) {
  #mob-site-search button#searchsubmit { width: 12.5%; }
}


/*============================
Matrix
============================*/
/* class used to add background wrap to containers to provide background colour */
.background-wrap {
  min-width: 940px;
  width: 100%; }

.background-wrap-matrix {
  /*background-image: url(/media/vancouver-community-college/style-assets/css/style-images/main-background-blue.png); *//* main-background-blue.png */   
  /*background-image: url(/media/vancouver-community-college/style-assets/css/style-images/main-background-experience-3colours-50px.png);*/ /* experience VCC 3 colours */   
  /*background-repeat: no-repeat;
  background-position: -80px 100px;*/ }
.container.matrix {
  padding: 20px 0 0 0;
  /* .matrix-stat p { font-size:  1em ;} */ }
  .container.matrix h3 {
   font-weight: 500; }


.matrix p {
  line-height: 1.25em; }

.matrix-item {
  width: 100%;
  height: 270px;
  overflow: hidden; }
.matrix-item.promo a { display: none ; }
.matrix-item.promo a:hover { text-decoration: none ;}

 .item-billboard { height: 187px ;}
  .item-billboard h3 {
   padding-left: 8px !important;
   padding-top: 2px !important;
   padding-bottom: 2px !important;
   line-height: normal; }

  .item-detail {
   display: block; } 

.item-billboard {
  margin-top: 0px;
  height: 270px ;
  position: relative;
  transition-property: margin-top;
   transition-duration: .4s; }
  .item-billboard h3 {font-size:18px;  /*Haziel: resize homepage matrix - added line "font-size:18px" - made text smaller or prog name on matrix promo blocks*/
   letter-spacing: -0.5px ;
   position: absolute;
   bottom: 0px;
   left: 0px;
   padding: 0 15px 0 15px;/*Haziel: changed "padding:0 50px 0 15px" to "padding: 0 15px 0 15px;" to fit prog name in one line*/
   margin: 0;
   background: black;
   background: -moz-linear-gradient(left, black 100%, rgba(125, 185, 232, 0) 100%);/*Haziel: changed 65% to 100% - remove opacity on black box bg on program name on matrix promo blocks*/
   background: -webkit-gradient(linear, left top, right top, color-stop(100%, black), color-stop(100%, rgba(125, 185, 232, 0)));/*Haziel: changed 65% to 100%*/
   background: -webkit-linear-gradient(left, black 100%, rgba(125, 185, 232, 0) 100%);/*Haziel: changed 65% to 100%*/
   background: -o-linear-gradient(left, black 100%, rgba(125, 185, 232, 0) 100%);/*Haziel: changed 65% to 100%*/
   background: -ms-linear-gradient(left, black 100%, rgba(125, 185, 232, 0) 100%);/*Haziel: changed 65% to 100%*/
   background: linear-gradient(to right, black 100%, rgba(125, 185, 232, 0) 100%);/*Haziel: changed 65% to 100%*/
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#007db9e8',GradientType=1 );
   color: white; }
.item-billboard.slideshow { width: 460px ;}
.item-billboard.slideshow img { height: 270px; width: 460px ;}
.item-detail {
  height: 270px; }

.detail-content {
  padding: 30px; }

.matrix-item:hover .item-billboard {
  margin-top: -270px; }
.matrix-item:hover .item-billboard.static {
  margin-top: 0; }

.matrix-stat, .matrix-cta {
 height: 90px; /* fixed height of stats box, apply button, infosession button, career services button*/
  padding: 20px;
  margin-bottom: 10px;}

.matrix-stat:hover {background-color:  #4d4d4d ; cursor: pointer ;}
.matrix-stat a:hover, .matrix-stat a:hover .stat-figure { text-decoration: none ;}
.matrix-stat a:hover p { text-decoration: none ;}/*haziel: "underline" to "none" - removed underline on matrix stats*/

.matrix-cta {
  position: relative; }
  .matrix-cta p {
   font-size: 1.3em;
   font-weight: 500; }
  .matrix-cta p.cta-text {
   position: absolute;
   bottom: 10px;
   left: 20px;
   margin-bottom: 0px; }

.matrix-stat p {
  font-size: 0.97em; }/*change the font size of stats info text*/
.matrix-stat .stat-figure {
  font-size: 2.3em; }

.matrix-cta:last-child, .matrix-stat:last-child {
  margin-bottom: 0px; }

.matrix-cta.green:hover {
  background-color: #90d300; }

.matrix-cta.blue:hover {
  background-color: #00b0fa; }

.matrix-cta.pink:hover {
  background-color: #da0058; }

.matrix .slideshow-item {
  position: relative; }
  .matrix .slideshow-item h3 {
   position: absolute;
   bottom: 0;
   left: 0; }

.matrix .slideshow-nav {
  position: absolute;
  top: 105px;
  z-index: 9999;
  width: 51px;
  height: 51px;
  background-repeat: no-repeat; }

.matrix .slideshow-nav.prev {
  left: -51px;
 background-image: url(/media/vancouver-community-college/style-assets/css/style-images/slideshow_prev_next.png); /* slideshow_prev_next.png */
  background-position: 0px 0px; }

.matrix .slideshow-nav.next {
  right: -51px;
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/slideshow_prev_next.png); /* slideshow_prev_next.png */
  background-position: 0px 0px; }

.matrix .slideshow-nav {
  transition-property: all;
  /* Original below*/
  transition-duration: .2s;
  transition-delay: 0.2s; 
  /* Longer timer below Doris 
  transition-duration: 1s;
  transition-delay: 1s;*/
  cursor: pointer; }

.matrix-item:hover .slideshow-nav.prev {
  left: -25px; }
.matrix-item:hover .slideshow-nav.next {
  right: -27px; }

/* Specific overrides for matrix elements */
.video-holder {
  padding: 20px;
  height: 230px; }
  .video-holder > div {
   width: 200px;
   height: 110px; }
  .video-holder hr {
   margin-top: 10px;
   margin-bottom: 25px; }
  .video-holder h3 {
   margin-top: 0px;
   margin-bottom: 0px;
   color: #7fba00;
   text-transform: uppercase;
   font-size: 1.8em; }
  .video-holder .first {
   margin-right: 20px; }
  .video-holder a.overlay {
   position: absolute;
   top: 0;
   left: 0;
   z-index: 100;
   background: url(/media/vancouver-community-college/style-assets/css/style-images/youtube_play.png) no-repeat 80px 61px; /* youtube_play.png */
   width: 200px;
   height: 150px;
   display: block; }
  .video-holder img {
   width: 200px;
   height: 150px; }


/** 
  Homepage matrix Responsive overrides
  Michael TERMINALFOUR Sept '13.
**/
/* Phone and Tablet portrait */
@media screen and (max-width: 320px) {
  .homepage .background-wrap, .homepage .background-wrap-matrix { width: 100%; min-width: 320px;}    
  .container.matrix {padding: 2px 0.625% ;} /* 2px / 320px */
  .matrix .row {
    max-height: 187px; }
   .matrix .row .matrix-info_sess p {
    margin-bottom: 0px;
    margin-top: 2px; }
   .matrix .row #matrix-apply-reg p {
    margin-top: 5px;
    margin-bottom: 8px; }

  .matrix .row {
   min-width: 316px; }

  .matrix .no-stack {
   float: left;
   margin-left: 6.32911%;
   /* 20px / 316px */ }

  .matrix .no-stack-full-cols {
   width: 100%; }

  .matrix .no-stack-half-cols {
   width: 46.83544%;
   /* 148px / 316px */
   height: 183px; }

  .matrix .no-stack:first-child {
   margin-left: 0; }

   .container.matrix { width: 98.75% !important;} /*316/320 px */

  .matrix-stat, .matrix-cta {
   height: 77px;
   /* 66.5px / 183px */
   padding: 5px 10px;
   /* 5px / 76.5px */ }
   .matrix-stat p.cta-text, .matrix-cta p.cta-text {
    font-size: 1.15em;
    bottom: 3px;
    left: 10px; } 
  .matrix-item { height: 187px !important;}
  .matrix .item-billboard { height: 187px}
  .matrix .matrix-row1col1 .item-billboard { height:auto; }
  
}/* End matrix @phone view */

/* General >= tablet portrait view */
@media screen and (max-width: 768px) {
  .background-wrap, .background-wrap-matrix { min-width: inherit; width: 100%; }  
  .background-wrap-matrix { background-image: none; } 

  /* Make images 100% width */   
  .matrix .item-billboard img { width: 100% ;}  
  .matrix .matrix-row2col1 .item-billboard img { width: 100%; height: auto; } 
  .matrix .m-prom-img img { width:100%; }
  
  /* for the visible billboard items span wrappers */
  .matrix .span3 { width: 48.93617021276596% ; /* 470px / 960px */ margin-left: 0px }  
  .matrix .span3:first-child { margin-right: 2.127659574468085%;  /* 20px / 960px */  }
  .matrix-item:hover .item-billboard { margin-top: 0px ;}

}/* End general >= tablet portrait view */

/* Specific tablet portrait view */
@media screen and (min-width: 321px) and (max-width: 768px) {
  .homepage .background-wrap, .homepage .background-wrap-matrix { width: 100% ; } /*768px*/
  
  .matrix-item { height: 270px !important;}
  .matrix-row1col1 { height:auto !important; }
  .matrix .item-billboard { height: 270px}
  .matrix .matrix-row1col1 .item-billboard { height:auto; }
  
  /*
  .homepage .container#info-pathways { width: 768px!important ; padding-right: 10px !important ; padding-left: 10px !important ;} 
  .homepage #info-pathways .span4 { width: 48.66131191432396% }
  .homepage #info-pathways .span4:first-child  { margin-right: 2.677376171352075% ;}
  .homepage footer { width: 768px } 
  */
  .homepage .container#info-pathways { width: 100%!important ; padding-right: 10px !important ; padding-left: 10px !important ;} 
  .homepage #info-pathways .span4 { width: 100%; }
  .homepage footer { width: 100%; }   
}


/* iphone 5 portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait)
  {
  .homepage .background-wrap, .homepage .background-wrap-matrix { width: 100%; } 
  
  .matrix-item { height: 100% !important;} /*height of cs flyer and trades box*/
  .matrix-row1col1 { height: auto; }
  .matrix-row2col1 { position:relative; }  
  .matrix .item-billboard { height: 100%;} /*black text box location*/
  .matrix .matrix-row1col1 .item-billboard { height: auto; }
  .matrix .matrix-row2col1 .item-billboard { position: absolute; height:200px; width:100%;}
  .matrix .matrix-row2col1 .item-detail { height:200px; }
  
  .homepage .container#info-pathways { width: 95% !important ; padding-right: 10px !important ; padding-left: 10px !important ;} /*infosession and social media container*/
  .homepage #info-pathways .span4 { width: 98%;} /*infosession and social media container*/
  .homepage #info-pathways .span4:first-child  { margin-right: 0% ;}
  .homepage footer { width: 100%;}
  
    .logo-mobile {
  margin-left: 4.34782608695652%;
  width: 20%; 
  float: left; }
  .logo-mobile img {
  /* width: 100% ;*/
   border: 2px solid white;
  margin-top:15px;}  
 
  .matrix-stat, .matrix-cta {
 height: 100%; /*  height of stats box, apply button, infosession button, career services button*/
  padding: 20px;
  margin-bottom: 10px;}
  
}
/*end -iphone 5 portrait*/



/* iphone 6 portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 677px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait)
{
  .homepage .background-wrap, .homepage .background-wrap-matrix { width: 100%; } 
  
  .matrix-item { height: 200px !important;} /*height of cs flyer and trades box*/
  .matrix-row1col1 { height:auto !important; }
  .matrix-row2col1 {height:270px !important;}
  .matrix .item-billboard { height: 200px; } /*black text box location*/
  .matrix .matrix-row1col1 .item-billboard { height: auto; }
  
  .homepage .container#info-pathways { width: 95% !important ; padding-right: 10px !important ; padding-left: 10px !important ;} /*infosession and social media container*/
  .homepage #info-pathways .span4 { width: 98%;} /*infosession and social media container*/
  .homepage #info-pathways .span4:first-child  { margin-right: 0% ;}
  .homepage footer { width: 100%;}
  
  .logo-mobile {
  margin-left: 4.34782608695652%;
  width: 20%; 
  float: left; }
  .logo-mobile img {
   /* width: 100% ;*/
   border: 2px solid white;
  margin-top:15px;}  
 
  .matrix-stat, .matrix-cta {
 height: 100%; /*  height of stats box, apply button, infosession button, career services button*/
  padding: 20px;
  margin-bottom: 10px;}
  
}
/*end -iphone 6 portrait*/


/* iphone 6 landscape */

@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape)
{

 .homepage .background-wrap, .homepage .background-wrap-matrix { width: 100%; }
  
  .matrix-item { height: 367px !important;} /*height of cs flyer and trades*/
  .matrix-row1col1 { height: auto !important; }
  .matrix-row2col1 { position:relative; }
  
  .matrix .item-billboard { height: 367px;} /*base of black text*/
  .matrix .matrix-row1col1 .item-billboard { height: auto; }
  .matrix .matrix-row2col1 .item-billboard { position: absolute; width: 100%; } 
  .matrix .matrix-row2col1 .item-billboard img { width: 100%; height: 367px; } 
  
  .homepage .container#info-pathways { width: 95% !important ; padding-right: 10px !important ; padding-left: 10px !important ;} /*affects the black feedback*/
  .homepage #info-pathways .span4 { width: 48%; }/*100% will put social media under Quick links*/ /*width of Quick links and social media*/
  .homepage #info-pathways .span4:first-child  { margin-right: 2.677376171352075% ;}
  .homepage footer { width: 100%;}



.logo-mobile {
  margin-left: 4.34782608695652%;
  width: 20%; 
  float: left; }

.logo-mobile img {
   /**/ width: 60% ;
   border: 2px solid white;
  margin-top:15px;}  
 
  .matrix-stat, .matrix-cta {
 height: 138px; /*  height of stats box, apply button, infosession button, career services button*/
 padding: 20px;
 margin-bottom: 10px; }

}

/* END iphone 6 landscape */




/* iphone 6+ portrait */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3) 
  and (orientation: portrait)
  { 
  .homepage .background-wrap, .homepage .background-wrap-matrix { width: 100%; }
  
  .matrix-item { height: 200px !important;} /* height of cs flyer and trades box */
  .matrix-row1col1 { height: auto; }
  .matrix .item-billboard { height: 200px;} /* black text box location */
  .matrix .matrix-row1col1 .item-billboard { height: auto; }
  .matrix .matrix-item.matrix-row1col1.promo { height: 230px !important;} /* big promo box on first row */
  
  .homepage .container#info-pathways { width: 95% !important ; padding-right: 10px !important ; padding-left: 10px !important ;} /*infosession and social media container*/
  .homepage #info-pathways .span4 { width: 98%;} /*infosession and social media container*/
  .homepage #info-pathways .span4:first-child  { margin-right: 0% ;}
  .homepage footer { width: 100%;}
  
    .logo-mobile {
  margin-left: 4.34782608695652%;
  width: 20%; 
  float: left; }
  .logo-mobile img {
   /* width: 100% ;*/
   border: 2px solid white;
  margin-top:15px;}  
 
  .matrix-stat, .matrix-cta {
 height: 100%; /*  height of stats box, apply button, infosession button, career services button*/
  padding: 20px;
  margin-bottom: 10px;}
  
}
/*end -iphone 6+ portrait*/


/* iphone 6+ landscape */

@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) {

 .homepage .background-wrap, .homepage .background-wrap-matrix { width: 100%; }
  
  .matrix-item { height: 405px !important;} /*height of cs flyer and trades*/
  .matrix-row1col1 { height: auto; }
  .matrix .item-billboard { height: 405px;} /*base of black text*/
  .matrix .matrix-row1col1 .item-billboard { height: auto; }
  
  .homepage .container#info-pathways { width: 95% !important ; padding-right: 10px !important ; padding-left: 10px !important ;} /*affects the black feedback*/
  .homepage #info-pathways .span4 { width: 48%; }/*100% will put social media under Quick links*/ /*width of Quick links and social media*/
  .homepage #info-pathways .span4:first-child  { margin-right: 2.677376171352075% ;}
  .homepage footer { width: 100%;}



.logo-mobile {
  margin-left: 4.34782608695652%;
  width: 20%; 
  float: left; }

.logo-mobile img {
   /**/ width: 60% ;
   border: 2px solid white;
  margin-top:15px;}  
 
  .matrix-stat, .matrix-cta {
 height: 157px; /*  height of stats box, apply button, infosession button, career services button*/
 padding: 20px;
 margin-bottom: 10px; }

}

/* END iphone 6+ landscape */


@media only screen and (min-width : 769px) and (max-width : 1024px) {  
  .background-wrap, .background-wrap-matrix { min-width: inherit; width: 100%; }
  .homepage .container { width: 940px; }
  .homepage .background-wrap, .homepage  .background-wrap-matrix { width: 1024px; }
  .homepage #info-pathways { width: 940px }
  .homepage .container.matrix { width: 940px !important;}
}
/* 
  Primary nav has its own break points in inner pages
  Homepage is adaptive so it stays the way it is
  Michael TERMINALFOUR 6th March 2014 
 */
@media only screen and (min-width : 769px) and (max-width : 931px) {
  .inner-page #primary-nav a { padding: 0px 6px ; }

  /*.inner-page  #primary-nav { width: 100%; clear: both; }*/
}
@media only screen and (max-width : 870px) {
  .inner-page #primary-nav, .inner-page .site-search { font-size: 0.824em ; }
  .inner-page .site-search input#q { width: 150px}
}
/* End Tablet @media only screen and (min-width : 768px) and (max-width : 1024px), (min-width : 600px) and (max-width : 1024px) for .background wrap */ 

/*============================
Content Area
============================*/
.breadcrumb {
  background-color: #fff;
  padding: 0;
  margin: 7px 20px 10px; 
  font-size: 85%; }

  .breadcrumb > a span {
   margin-right: 10px; }

  .breadcrumb ul.inline li {
  background: url(/media/vancouver-community-college/style-assets/css/style-images/sprites-23-june-2016.png) 5px -203px no-repeat transparent; /* 0 -200px sprites.png 0-83px*/
   padding-left: 25px; /* 20px */
   margin-top: 10px; 
   margin-right: 4px ;}
   .breadcrumb ul.inline li:first-child {
  background: none; /* no house icon*/
   padding-left: 10px;
   margin-top: 10px; 
   margin-right: 4px ;}/*replacing HOME icon with text*/

/* <= 768px */
@media screen and (max-width: 768px) {
  .breadcrumb {
   margin-right: 0px;  margin-left: 0px;
   margin-bottom: 0px; }
 
   .breadcrumb ul.inline li {
    background-position: 0px -173px;/*0px -170p*/
    padding-right: 0px;
    padding-left: 15px;
    margin-top: 0px; }
  .breadcrumb ul.inline li:first-child {
    background: none;
    padding-right: 0px;
    padding-left: 0px;
    margin-top: 0px; }   /*replacing HOME icon with tex on phonet*/   
   .breadcrumb span.sprite-house {
    background-position: 0px -1640px;
    margin-right: 0px;
    width: 25px;
    height: 20px; } 
}
/*==============
Grid overwrites 
================*/
.container { width: 940px; max-width: 940px; }
.container.main-body { padding-bottom: 40px; }

/* Columns is use */
.span140 { width: 140px; }
.span260 { width: 260px; }
.span414 { width: 414px; }
.span685 { width: 625px; }
.span820 { width: 820px; }
.span860 { width: 860px; }
.span900 { width: 900px; }
.span140, .span414, .span685, .span820, .span860 {
  margin-left: auto;
  margin-right: auto;
  float: none;
  clear: both;
  *zoom: 1; 
}
.span140:before, .span140:after, .span685:before, .span685:after, .span820:before, .span820:after, .span860:before, .span860:after {
   display: table;
   content: "";
   line-height: 1.5em; 
}/*---was 20px---*/
.span140:after, .span685:after, .span820:after, .span860:after { clear: both; }

[class*="span"]:first-child { margin-left: 0px !important; }
[class*="span"].centered { margin-left: auto !important; margin-right: auto; }
.row { margin-left: 0px ; }

/* offset classes */
.offset3 { margin-left: 260px !important; }

/** 
  Tablet portrait and phone grid overrides. Michael TERMINALFOUR Sept '13
**/ 
/* > 1024px make flexible except for homepage which needs fixed widths to account for the matrix */
@media only screen and (max-width: 1023px) {
  #content-wrap { min-width: 95.83333333333333%; /* 920 / 960 */ padding-left: 2.083333333333333%; /* 20px / 960px */ padding-right: 2.083333333333333%; /* 20px / 960px */} 
  .container { width: 100% ; }
  /* Homepage needs fixed widths */
  .row { margin-left: 0% ; margin-right: 0% ; }
  .span860 { width: 100%; }
  .news-landing .span860 { width:91.48936170212766%; }
}

@media only screen and (min-width : 768px) and (max-width : 1023px) {
  .container { width: 100% ; min-width: 640px ;} 
  /* Bootstrap spans */
  .span3 { width: 23.40425531914894%; /* 220px / 940px */  }
  .span4 { width: 31.91489361702128%; /* 300px / 940px */ } 
  .span6 { width: 48.93617021276596%; /* 460px / 940px */ } 
  .span7 { width: 57.4468085106383%; /* 540px / 940px */ } 
  .span8 { width: 65.95744680851064%; /* 620px / 940px */ } 
  .span12 { width: 100%; /* 620px / 940px */ } 

  /* Span margins */
  [class*="span"] { margin-left: 2.083333333333333% ; /* 20px / 940px */ } 
  /* Offsets */
  .offset3 { margin-left: 27.08333333333333% !important ; /* 260px / 940px */}
  .offset6 { margin-left: 53.19148936170213% !important ; /* 500px / 940px */}
} /* end @media only screen and (min-width : 768px) and (max-width : 1024px) */
@media screen and (max-width: 768px) {
  .container {
     width: 93.75% !important;
     /* 320 - 20 (300) / 320 */
     /*min-width: 300px;*/
     padding: 0 3.125%;
     /* 10px / 320px */ 
   }
  .container.main-body { padding-bottom: 20px; }
  .span140, .span685, .span820, .span860, .news-landing .span860, .span900 { width: 100%; }
  #content-wrap { width: auto ; min-width: 0 ;} 
}

/* News page features */
.news-row { *zoom: 1; }
.news-row:before, .news-row:after { display: table; content: ""; line-height: 0; }
.news-row:after { clear: both; }
.news-feature {
  font-size: 0.95em;
  width: 30.9%;/*30.34883720930233%;*/
  padding: 10px;/*10px 1.976744186046512% 0 2.093023255813953%;*/
  border-right: 0px solid #b9b9b9; /*1px solid #b9b9b9;*/
  border-bottom: 1px solid #b9b9b9;
  float: left;
  height: 410px; /*380px*/
}
.news-feature:first-child { padding-left: 0; }
.news-feature:first-child .soc_icons { position: absolute; bottom: 10px; left: 3px; }
.news-feature img { width: 100%; }
.news-feature > span.news-date { display: block; margin-top: 12px; }
.news-feature h3 { line-height: 1.25em; margin-top: 8px; }
.news-feature p { line-height: 1.4em; }
.news-feature p a { color: inherit; }
.news-feature .soc_icons { position: absolute; bottom: 10px; left: 18px; padding-bottom:25px; }
.news-feature.first .soc_icons {
 *zoom: 1;
 position: absolute;
 bottom: 10px;
 left: 3px; 
}
.news-feature .soc_icons:before, .news-feature .soc_icons:after {
  display: table;
  content: "";
  line-height: 0; 
}
.news-feature .soc_icons:after { clear: both; }
.news-feature .soc_icons a {
  display: block;
  background-position: 0px 0px;
  height: 16px;
  width: 16px; 
  background-repeat: no-repeat;
  float: left;
  margin-right: 10px; 
}
.news-feature .soc_icons .fbook_link { background-image: url(/media/vancouver-community-college/style-assets/css/style-images/facebook-icon_16px.png); } /* facebook-icon_16px.png */
.news-feature .soc_icons .twitter_link { background-image: url(/media/vancouver-community-college/style-assets/css/style-images/twitter-icon_16px.png); } /* twitter-icon_16px.png */
.news-feature .soc_icons .folder_link { background-image: url(/media/vancouver-community-college/style-assets/css/style-images/folder_fill_16x16.png); } /* folder_fill_16x16.png */
.news-feature.first { padding-left: 10px ; }/*0px;*/
.news-feature.first .soc_icons { bottom: 10px; left: 3px; position: absolute;}
.news-feature.third { padding-right: 10px ; border-right: none ;}/*0px;*/
.news-feature:last-child { padding-right: 10px ; border-right: none ;} <!-----catalogue of gifts------->
/* News page */
.news-row.first .news-feature { padding-top: 0px; }
.news-feature h3, .news-listings h3 { font-family:  'Source Sans Pro','EdmondSans', 'Helvetica Neue', Helvetica, Arial, sans-serif; letter-spacing: normal; }

.news-listings h3 {
  margin-top: 15px;
  margin-bottom: 0px;
  margin-left: 16px;
  font-size: 1.188em; 
}
.news-listings h3 a {
   color: inherit; 
 }
.news-listings .news-date { margin-left: 16px; margin-top: 10px; }

/* Additional styling for Events features - Micheal TERMINALFOUR March 2014 */
.news-feature.event-feature .event-date { font-family: 'Source Sans Pro','EdmondSans', 'Helvetica Neue', Helvetica, Arial, sans-serif; letter-spacing: normal; color: #fff;}
.news-feature.event-feature .event-month, .news-feature.event-feature .event-day, .news-feature.event-feature img { position: relative; display: block; }  
.news-feature.event-feature .event-date .event-month, .news-feature.event-feature .event-date .event-day { z-index: 10; }
.news-feature.event-feature .event-date .event-month { width: 96.16858237547893%; margin-top: 20px; padding-left: 3.831417624521073%; font-size: 1.750em;  }
.news-feature.event-feature .event-date .event-day { width: 91.9% ;  text-align: center; font-size: 2.5em; margin-top: 15px; padding-left: 8.1%;  }
.news-feature.event-feature .event-date img { margin-top: -85px ; } 

/* Responsive News >= 768px */
@media screen and (max-width: 930px) {
  /* news landing only */
  .news-landing .main-body .row { margin-bottom: 0px; }

  /* news features */
  .news-feature {
   width: 47%;
   padding: 0px 0px 10px;
   border-right: none;
   margin-bottom: 15px;
   font-size: 1em;
   min-height: 400px; 
  }
  .news-feature:nth-child(even) { margin-left: 6%; }
  .news-feature h3 { margin-bottom: 10px; }
  .news-feature.third {padding-right: 0px !important ; }
  .news-listings h3 { margin-top: 15px; line-height: 1.3; }
  .news-listings h3, .news-listings span.news-date { margin-left: 0; }
  .news-listings span.news-date { margin-top: 0px; } 
  .news-feature .soc_icons { bottom: 10px; left: 3px; }
  
  /* Additional styling for Events features - Micheal TERMINALFOUR March 2014 */
  .news-feature.event-feature .event-date .event-month { margin-top: 35px; font-size: 2.25em; }
  .news-feature.event-feature .event-date .event-day { margin-top: 30px; font-size: 4.5em;  }
  .news-feature.event-feature .event-date img { margin-top: -115px ; } 
  
}  

@media screen and (max-width: 520px) {
  .news-feature {
     width: 100% !important;
     margin-left: 0px !important; 
  }
}
@media screen and (min-width: 400px) and (max-width: 520px) {
 .news-feature {
    height: auto ;
     min-height: 420px ;
  } 
}
@media screen and (max-width: 399px) {
 .news-feature {
    height: auto ;
     min-height: 360px ;
  } 
}

@media screen and (max-width: 768px)  {
  .news-feature.event-feature .event-date .event-month { font-size: 1.75em; }
  .news-feature.event-feature .event-date .event-day { font-size: 4.0em;  }
  .news-feature.event-feature .event-date .event-month { margin-top: 30px; }
  .news-feature.event-feature .event-date img { margin-top: -110px ; } 
}
@media screen and (max-width: 720px)  {
  .news-feature.event-feature .event-date .event-month { margin-top: 20px; font-size: 1.5em; }
  .news-feature.event-feature .event-date .event-day { margin-top: 30px; font-size: 3.5em; padding-left: 4%; }
  .news-feature.event-feature .event-date img { margin-top: -100px ; } 
}
@media screen and (max-width: 620px)  {
  .news-feature.event-feature .event-date .event-day { margin-top: 25px; font-size: 3em; padding-left: 4%; }
  .news-feature.event-feature .event-date img { margin-top: -95px ; } 
}
@media screen and (max-width: 530px)  {
  .news-feature.event-feature .event-date .event-month { margin-top: 10px; font-size: 1.25em; }
  .news-feature.event-feature .event-date .event-day { margin-top: 20px; font-size: 2.75em; padding-left: 4%; }
  .news-feature.event-feature .event-date img { margin-top: -80px ; } 
}
@media screen and (max-width: 521px) {
  .news-feature.event-feature .event-date .event-month { margin-top: 40px; font-size: 2em; }
  .news-feature.event-feature .event-date .event-day { margin-top: 60px; font-size: 4em; padding-left: 4%; }
  .news-feature.event-feature .event-date img { margin-top: -145px ; } 
  .news-feature { width: 100% !important; margin-left: 0px !important; }
}
@media screen and (max-width: 480px) {
  .news-feature.event-feature .event-date .event-month { margin-top: 30px; font-size: 2em; }
  .news-feature.event-feature .event-date .event-day { margin-top: 60px; font-size: 4em; padding-left: 4%; }
  .news-feature.event-feature .event-date img { margin-top: -135px ; } 
  .news-feature { width: 100% !important; margin-left: 0px !important; }
}
@media screen and (min-width: 400px) and (max-width: 520px) {
 .news-feature { height: auto ; min-height: 420px ; } 
}
@media screen and (max-width: 399px) {
  .news-feature { height: auto ; min-height: 360px ;} 
  .news-feature.event-feature .event-date .event-month { margin-top: 30px; font-size: 1.75em; }
  .news-feature.event-feature .event-date .event-day { margin-top: 35px; font-size: 3.5em;  }
  .news-feature.event-feature .event-date img { margin-top: -110px ; } 
}
@media screen and (max-width: 320px) {
  .news-feature.event-feature .event-date .event-month { margin-top: 20px; font-size: 1.75em; }
  .news-feature.event-feature .event-date .event-day { margin-top: 25px; font-size: 3.5em;  }
  .news-feature.event-feature .event-date img { margin-top: -90px ; } 
}



p.top-video-feature a {
 color:#4d4d4d; 
   line-height: 1.4em;
  font-size: 0.95em;
 font-family:  'Source Sans Pro','EdmondSans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/*============================
Footer
============================*/
footer.small-text { /* 0.722em*/ }
footer.green { color: #2d2d2d; }
footer.green a { color: #2d2d2d; }
footer { font-size: 0.875em; /** Social media links **/ }
footer .gray { color: white; }
footer .gray a { color: white; }
/*footer .background-wrap-footer { background: url(/media/vancouver-community-college/style-assets/css/style-images/main-background-footer.png) no-repeat -10px 0px; }*/ /* main-background-footer.png.png */
footer #subscribe-study-at { width: 474px; }
footer #subscribe { width: 255px; margin-right: 20px; }
footer #study-at-vcc { padding-left: 10px; width: 189px; }
footer #connect-media-follow { width: 464px; }
footer #connect, footer #media { width: 143px; padding-left: 10px; }
footer h4 { text-transform: uppercase; font-weight: 600; }
footer > div { padding-top: 10px; }
footer address { margin-bottom: 0; }
footer .green, footer .green a { color: #2d2d2d; }
footer form + p { margin-top: 10px; }
footer div#social-follow {
 margin-left: 15px;
 padding-left: 14px;
 padding-bottom: 20px;
 width: 126px;
 border-left: 1px solid #2d2d2d;
 height: 100%; 
}
footer div#social-follow li { clear: both; margin-bottom: 10px;margin-right:20px; }
footer div#social-follow li span.sprite-flickr-black-small { background-position: 0 -666px; }
footer div#social-follow li a { margin-top: 2px; margin-left: 10px; }
.footer-meta ul { margin-left: 0px; }
.footer-meta li a { padding: 0 10px; border-right: 1px solid white; }
.footer-meta li.last-child a { border-right: none; }

@media screen and (max-width: 768px) {
  footer {
   font-size: 0.855em;
   /* 13px */
   min-width: 320px;
   /* 280px available - #media needs padding-left of 10px and has a 1px border-left. #connect width is 130px */ 
  }
  footer .background-wrap-footer { background-image: none; }
  footer ul li { line-height: 2em; }
  footer #subscribe-study-at, footer #subscribe, footer #study-at-vcc, footer #connect-media-follow, footer #connect, footer #media, footer #social-follow {
    width: 100%;
    padding: 0;
    margin: 0px; 
  }
  footer #connect, footer #media { font-size: 1em; }
  footer #connect-media-follow .btn { padding: 2px 0px; margin-top: 10px; }
  footer #connect { width: 46.42857%; /* 130px / 280px*/ border-right: 1px solid white; }
  footer #media {
   width: 46.07142857142857%;
   /* 129px / 280px */
   padding-left: 7.14286%;
   /* 10 / 140px */ 
  }
  footer #subscribe { margin-top: 10px; } 
} /* end query max-width 767px */


@media screen and (min-width: 769px) and (max-width: 1024px)  { 
  body.homepage {width: 1024px}
  footer #social-follow { display: none !important ;}
  .homepage footer {width: 1024px; }
  .homepage footer .container { margin-right: auto ; margin-left: auto; }
  footer #subscribe-study-at { width:  470px; margin-right: 10px ; } 
  footer #subscribe-study-at #subscribe { width: 255px; margin-right: 10px ;  /* 255 / 490 */ } 
  footer #subscribe-study-at #study-at-vcc { width: 185px;  /* 215px / 490px */}
  footer .row { margin-left: 1.04% ; margin-right: 1.04% ; /* 10px / 960px */}
  footer #connect-media-follow {width: 440px; padding-left: 2.272727272727273}
  footer #connect-media-follow #connect { width: 47.72727272727273% ;}
  footer #connect-media-follow #media { width: 47.72727272727273%}
  footer #connect-media-follow #social-follow { display: none !important; }
}
@media screen and (max-width: 935px) {
  footer #subscribe-study-at #study-at-vcc { display: none !important;}
}
/*============================
Content Elements
============================*/
.box, .box .box-heading {
  padding: 5px 10px;
  margin-bottom: 10px; }
  .box .box-heading {
   margin: -5px -10px 0 -10px; }

.box-heading-arrow {
  width: auto;
  height: 10px;
  margin-top: -1px;
  background-color: none;
  background-repeat: no-repeat;
  background-position: -6px 0px;
  position: relative;
  z-index: 2; }

.box-heading {
  height: 20px;
  box-shadow: 0px 2px 4px 0px #b9b9b9; }
  .box-heading a, .box-heading span {
   display: block;
   float: left; }
  .box-heading a {
   color: #4d4d4d !important;
   padding-top: 1px; }
  .box-heading span.icon {
   /*width: 8.93470790378007% ; 26 / 291 */ }
  .box-heading span.arrow-right-icon {
   width: 15px;
    background-image: url(/media/vancouver-community-college/style-assets/css/style-images/sprites-23-june-2016.png); /* sprites.png */
   background-position: 0px -175px; }

/* full-width images */
img.full-width {
  width: 800px;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 10px;
  display: block; }

@media screen and (max-width: 320px) {
  img.full-width {
   width: 100%;
   margin-bottom: 5px; } }
/*============================
Lists
============================*/
.no-bullets {
  list-style: none;
  margin: 0; }

ul.inline-list li {
  display: inline-block; }

ul.split-list {
  margin: 0; }
  ul.split-list li {
   width: 100%;
   float: left;
   margin-bottom: 0.5em; line-height:1.5em;}/*Haziel: navigation line spacing*/

ul.split-list.split-2 li {
  width: 50%; } 

ul.split-list.split-3 li {
  width: 33.333333%; }

ul.split-list.split-4 li {
  width: 25%; }

ul.divided-list li {
  border-bottom: 1px solid #b9b9b9;
  padding: 8px 0px; }
ul.divided-list li:last-child {
  border-bottom: none;
  padding-bottom: 0; }

ul.quick-links {
  text-transform: uppercase;
  margin: 10px;
  padding: 0; }

ul.quick-links .part-full-time {
  text-transform: none;
 }  /*Haziel: part/full-time image*/

  ul.quick-links li {
   line-height: 1.5em;/*--was 20px--*/
   margin: 0 0 1em 0;
   padding: 0 0 0 1em;
   list-style: none;
   background: url(/media/vancouver-community-college/style-assets/css/style-images/sprites-23-june-2016.png) 0 -173px no-repeat transparent; } /* sprites.png 0 -177px*/

/*============================
 Forms 
 ============================*/
form {
  width: 100%; }
  form label {
   display: block;
   float: left;
   width: 11.90476%;
   /* 100px / 840 */
   margin-right: 2.39234%;
   /* 20px */
   padding-top: 4px; }
  form input, form textarea {
   display: block;
   float: left;
   width: 79.52381%;
   /* 668px / 100 */
   border-color: #4d4d4d; }
  form input {
   height: 1.6em; }
  form textarea {
   resize: none;
   height: 120px; }
  form input[type="submit"] {
   height: auto;
   /*width: 11.90476%;*/ /*--hz hid this---*/
   /* 100px / 840 */
   clear: both;
   margin-left: auto; /*----was 83.45238%;----*/
   /* 681px / 840px */
   margin-top: 10px;
   background-color: #002b52;
   color: white;
   border: 1px solid #2d2d2d;
   text-transform: none;
   font-size: 0.9em;
   padding: 4px 15px; 
 }

/* Responsive */
@media screen and (max-width: 320px) {
.program-detail form label, .program-detail form input, .program-detail form textarea {
    width: 96.05263157894737%;
    clear: left;
    float: none ; 
  }
  .program-detail form input[type=submit] {
    width: 100% ;
    margin-left: auto ;
    margin-right: auto ;
  } 

 } /* End form responsive for phone */

@media screen and (min-width: 321px) and (max-width: 794px) { 
  .program-detail form input[type=submit] {
    width: auto ;
    margin-left: 0 ;
  } 
}
@media screen and  (max-width: 794px) { 
  .program-detail form label, .program-detail form input, .program-detail form textarea {
    width: 96.05263157894737%;
    clear: left;
    float: none ; 
  } 
}

/*============================
Tables
============================*/
/* Bootstrap overrides */
table {
  width: 100%; }

.table {
  font-size: 0.95em;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  border-collapse: collapse; 
}
.table th, .table td { border-width: 3px; width: 20%; text-align: left; }
.table th {
 padding: 10px 1.4556%;
 /* 10px / 687px */
 vertical-align: middle;
 border-top-style: solid;
 border-top-color: #b9b9b9;
 border-left-style: solid;
 border-left-color: white;
 background-color: #4d4d4d;
 color: white; 
}
.table td {
 padding: 15px 1.14613%;
 /* 16px / 687px */
 border-right-style: solid;
 border-right-color: #b9b9b9;
 border-bottom: 1px solid #b9b9b9; 
}
.table th:first-child, .table td:first-child { border-left-style: solid; border-left-color: #b9b9b9; }
.table th:last-child { border-right-style: solid; border-right-color: #b9b9b9; }


/* Course outline table including styling for the header which is a div */
.course-outline-table-head {
  width: 98.21429%;
  margin-left: 0px;/*-3px;*/
  *zoom: 1;
  color: #2d2d2d;
  padding: 6px 0.9%;/*6px 1.19048%;*/
  /* 10px */ 
}
.course-outline-table-head:before, .course-outline-table-head:after {
 display: table;
 content: "";
 line-height: 0; 
}
.course-outline-table-head:after { clear: both; }
.course-outline-table-head > span { display: block; }
.course-outline-table-head .course-title {
 float: left;
 font-weight: 500;
 font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
 letter-spacing: 1px; 
  color:#0000ff; padding-right:10px; text-decoration:underline;}

.course-outline-table-head > .course-title > a:hover,  .course-outline-table-head > .course-title > a:focus {
 float: left;
 font-weight: 300;
 font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
 letter-spacing: 1px; 
color:#0000ff;
text-decoration:underline;padding-right:10px;}

.course-outline-table-head > .course-title > a {
 float: left;
 font-weight: 300;
 font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
 letter-spacing: 1px; 
color:#0000ff;
text-decoration:underline;padding-right:10px;}

.course-outline-table-head .course-title .course-required { font-family:  'Source Sans Pro','EdmondSans', 'Helvetica Neue', Helvetica, Arial, sans-serif; }
.course-outline-table-head .course-required { content: ""; float: left; }
.course-outline-table-head .course-outline-download { text-align: right; float: right; color:#0000ff;}
.course-outline-table-head > .course-outline-download > a {text-align: right; float: right;color:#0000ff;text-decoration:underline;}
.course-outline-table-head > .course-outline-download > a:hover,  .course-outline-table-head > .course-outline-download > a:focus {text-align: right; float: right; color:#0000ff; text-decoration:underline;}
.course-outline-download  {text-align: right; float: right; color:#0000ff; text-decoration:underline;}

.course-outline-table-head .course-credits { text-align: right; float: right; margin-left: 5.35714%;color:#fff; /* 45px */ }


.course-outline-table {
  max-width: none;
  width: 820px;
  margin-left: -3px;
  border-width: 1px;
  border-style: solid;
  border-color: #a3a3a3;
  margin-bottom: 20px; 
}
.course-outline-table td {
 text-align: center;
 border-left-width: 1px;
 border-bottom-color: #a3a3a3;
 width: auto;
 border-right: 1px solid #b9b9b9;
 width: 13.13008%; /* ~107px */ 
}
.course-outline-table td:first-child { text-align: left; padding-left: 0.85366%; padding-right: 0.85366%; }
.course-outline-table .course-start-end { width: 31.21951219512195%; /* 256px */ }
.course-outline-table .course-time { width: 19.02439%; }
.course-outline-table .course-day { width: 10.36585%; /* 85px */ }

/* Styling for responsive tables - Michael TERMINAFOUR March 2014 */
@media screen and (max-width: 480px) {
  table.resp-with-header { border: 2px #b9b9b9 solid; border-bottom: none; margin-right: 0px; width: 99.0% ; background-color: #fff; color: #2d2d2d;}
  table.resp-with-header, table.resp-with-header thead, table.resp-with-header tbody, table.resp-with-header tr, table.resp-with-header th, table.resp-with-header td { display: block; }
  table.resp-with-header thead tr { position: absolute; top: -9999px; left: -9999px; }
  table.resp-with-header tbody, table.resp-with-header tbody tr {width: 100%; min-width: 100%; }
  table.resp-with-header tbody td { position: relative; padding-left: 50%;  width: 48.85387%; border-left: none !important; border-right: none; border-bottom: 1px #b9b9b9 solid; text-align: left }
  table.resp-with-header tbody td a { color: #2d2d2d ; }
  table.resp-with-header tbody td:nth-child(even) { background-color: #687c87; color: #fff;  }
  table.resp-with-header tbody td:nth-child(even) a { color: #fff ; }
  table.resp-with-header tbody td:last-child { border-bottom: 2px #b9b9b9 solid; }
  table.resp-with-header tbody td:before { 
    position: absolute;
    font-weight: bold;
    top: 10px;
    left: 1.75%;
    width: 48.25%; 
    height: 42px; 
    white-space: nowrap;
    content: attr(data-headervalue) ; 
  }
  /* For the program-availability table */
  .program-availability-table tbody tr.program-area td { padding: 10px 1%;  } 
}

/*============================
Utility
============================*/
.left { float: left; }
.right { float: right; }
.cf { clear: both; }
.hidden { display: none !important; }
.visible { display: block !important; }
.relative { position: relative; }
.padded { padding: 0.25em 0.5em; }
.bordered { border: 1px solid #b9b9b9; }
.borderThick { border-width: 2px; border-style: solid; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.icon { width: 26px; height: 23px; background-repeat: no-repeat; }
.margin-right-none { margin-right: 0px !important; }
.margin-left-none { margin-left: 0px !important; }
.not-bold { font-weight: normal; }
.display-block { display: block; }

/*============================
Background Color Classes
============================*/
.green { background-color: #7fba00; color: white; }
.grayDarker { background-color: #3b393a; color: white; }
.grayDark { background-color: #4d4d4d; color: white; }
.grayDarkBorder { border-color: #4d4d4d; }
.gray { background-color: #4b4c4f; color: white; }
.grayLight { background-color: #687c87; color: white; }
.grayLighter { background-color: #7d7d7d; color: white; }
.grayLighterBorder { border-color: #7d7d7d; }
.grayWhite { background-color: #b9b9b9; color: white; }
.white { background-color: white; }
.blue { background-color: #009ee0; color: white; }
.blueBorder { border-color: #009ee0; }
.blueDark { background-color: #002855; color: white; color: white; }
.blueDarkBorder { border-color: #002855; }
.black { background-color: #2d2d2d; color: white; color: white; }
.blackBorder { border-color: #2d2d2d; }
.seaBlue { background-color: #0699bf; color: white; }
.seaBlueBorder { border-color: #0699bf; }
.blueGray { background-color: #687c87; color: white; }
.blueGrayborder { background-color: #ccc;}/*a3a3a3;*/
.verylightGray { background-color: #ccc;}
.greenLight { background-color: #95c62c; color: white; }
.greenVCC { background-color: #84bd00;}
.greenBorder { border-color: #7fba00; }
.greenDark { background-color: #819705; color: white; }
.greenmintVCC { background-color: #ccea8a;}
.greenDarkBorder { border-color: #819705; }
.seaGreen { background-color: #01a89e; color: white; }
.seaGreenBorder { border-color: #01a89e; }
.yellowHoney { background-color: #c7be14; color: white; }
.yellowHoneyBorder { border-color: #c7be14; }  
.tealLight { background-color: #73b89b; color: white; }
.tealLightBorder { border-color: #73b89b; }  
.oliveGreen { background-color: #dbe06a; }
.red { background-color: #bc0505; color: white; }
.redBorder { border-color: #bc0505; }
.yellow { background-color: #ffc40d; color: white; }
.orange { background-color: #f89406; color: white; }
.pink { background-color: #ea1d76;; color: white; }
.pinkBorder { border-color: #ea1d76; }/*c004e*/
.purple { background-color: #014a7f; color: white; }
.cyan { background-color: #009ee0; color: white; }
.cyanBorder { border-color: #009ee0; }  
.yellowGreen { background-color: #bfc942; color: white; }
.teal { background-color: #5daab4; color: white; }
.blue-teal { background-color: #51b3b4; color: white; }

 /*--------colors used in Dept marketing buttons----------------------*/ 
.teal-news { background-color: #05997e; color: white; }
.teal-news-border { border-color: #05997e;} 
.green-bio { background-color: #99cc00; color: white; }
.green-bio-border { border-color: #99cc00;}
.mustard-testimonials { background-color: #b3a900; color: white; }
.mustard-testimonials-border { border-color: #b3a900; }
.grass-events { background-color: #659400; color: white; }
.grass-events-border { border-color: #659400;}
.muteblue-jobs { background-color: #007fb3; color: white; }
.muteblue-jobs-border { border-color: #007fb3;}
.bluegreen-partnerships { background-color: #3c9495; color: white; }
.bluegreen-partnerships-border { border-color: #3c9495; }
.blueteal-memberships { background-color: #51b3b4; color: white; }
.blueteal-memberships-border { border-color: #51b3b4; }
.yellow-giveback { background-color: #c2b800; color: white; }  
.yellow-giveback-border { border-color: #c2b800; }  
.green-galleries { background-color: #5ba20b; color: white; }
.green-galleries-border { border-color: #5ba20b; }
  
 /*-------END-colors used in Dept marketing buttons----------------------*/ 
.green a, .grayDarker a, .grayDark a, .gray a, .grayLight a, .grayLighter a, .grayWhite a, .white a, .blue a, .blueDark a, .seaBlue a, .blueGrey a, .greenLight a, .greenDark a, .seaGreen a, .red a, .yellow a, .orange a, .pink a, .purple a, .cyan a, .yellowGreen a, .teal a , .teal-news a, .green-bio a, .mustard-testimonials a, .grass-events a,.grass-events a,.bluegreen-partnerships a, .green-galleries a ,.blueteal-memberships a,.yellow-giveback a {
  color: white; }
/*============================
Misc
============================*/
.faux-heading {
  font-size: 1.125em;
  line-height: 1.25em;
  background-color: #3b393a;
  padding: 5px 8px;
  margin-left: -5px;
  font-weight: 500; }

/*============================
3rd Party CSS
============================*/
/* Lightview */
.lv_window {
  position: absolute;
  top: 50%;
  left: 50%;
  padding: 0;
  overflow: hidden;
  text-align: left;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

.lv_window,
.lv_controls_top,
.lv_controls_top_close,
.lv_thumbnails,
.lv_thumbnails_top_close {
  z-index: 100000; }

.lv_skin {
  float: left;
  width: 100%;
  height: 100%;
  position: relative;
  overflow: visible; }

.lv_bubble,
.lv_shadow {
  position: absolute; }

.lv_bubble * {
  display: inline;
  position: relative;
  float: left;
  z-index: none; }

.lv_skin * {
  margin: 0;
  padding: 0; }

.lv_overlay {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 99999; }

/* wrapper for the spinner */
.lv_spinner_wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  cursor: pointer; }

/* The the previous/next overlay buttons on top of images */
.lv_inner_previous_next_overlays {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  overflow: hidden;
  zoom: 1;
  background: url(/media/vancouver-community-college/style-assets/css/style-images/lightview-imgs/blank.gif); } /* lightview/blank.gif */

.lv_inner_previous_next_overlays * {
  padding: 0;
  margin: 0; }

.lv_inner_previous_next_overlays .lv_button {
  position: relative;
  height: 100%;
  width: 49%;
  background: url(/media/vancouver-community-college/style-assets/css/style-images/lightview-imgs/blank.gif); /* lightview/blank.gif */
  zoom: 1;
  cursor: pointer; }

.lv_button_inner_previous_overlay {
  float: left; }

.lv_button_inner_next_overlay {
  float: right; }

.lv_title_caption {
  position: absolute;
  font: 11px/18px "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Tahoma, Arial, sans-serif;
  color: #eaeaea; }

.lv_title_caption_slider {
  position: relative;
  float: left;
  overflow-y: hidden; }

.lv_title_caption_slide {
  position: relative;
  float: left;
  top: 0;
  left: 0;
  padding: 15px 0 7px 0; }

.lv_title {
  font-weight: bold; }

.lv_title, .lv_caption {
  float: left;
  clear: both; }

.lv_update_queue {
  position: absolute;
  top: -15000px;
  left: -15000px;
  width: 5000px;
  height: 5000px;
  visibility: hidden; }

.lv_update_queue .lv_window,
.lv_update_queue .lv_content {
  position: relative;
  overflow: visible;
  float: left;
  top: auto;
  left: auto;
  width: 100%; }

.lv_content .lv_content_wrapper {
  float: left;
  clear: both;
  position: relative; }

.lv_update_queue .lv_content_wrapper {
  position: absolute;
  top: 0;
  left: 0; }

.lv_content_wrapper canvas {
  float: left;
  zoom: 1; }

.lv_content {
  position: absolute;
  padding: 0;
  margin: 0;
  overflow: auto;
  /* scrollbars */
  text-align: left;
 background: url(/media/vancouver-community-college/style-assets/css/style-images/lightview-imgs/blank.gif); /* lightview/blank.gif */
  /* Chrome 18+ opacity bug */ }

.lv_measure_element {
  position: relative;
  float: left;
  clear: both; }

.lv_content_canvas,
.lv_content_image,
.lv_content_flash,
.lv_content_object,
.lv_content_iframe,
.lv_content_html {
  float: left;
  border: 0;
  clear: both;
  padding: 0;
  margin: 0;
  background: none; }

.lv_blank_background,
.lv_content {
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/lightview-imgs/blank.gif); /* lightview/blank.gif */ }

/* The buttons on the side when you view a gallery */
.lv_side_buttons_underneath {
  position: absolute;
  top: 50%;
  left: 50%;
  clear: both;
  width: 100%;
  padding: 0;
  height: 67px;
  margin-top: -34px; }

.lv_side_buttons_underneath * {
  padding: 0;
  margin: 0; }

.lv_side_buttons_underneath .lv_side_left {
  float: left; }

.lv_side_buttons_underneath .lv_side_right {
  float: right; }

.lv_side,
.lv_side_button {
  height: 37px;
  width: 41px;
  position: absolute; }

.lv_side {
  position: relative;
  overflow: hidden;
  padding: 15px 0;
  cursor: pointer; }

.lv_side_left {
  margin-left: -41px; }

.lv_side_right {
  margin-right: -41px; }

.lv_side_button {
  height: 31px;
  width: 41px;
  cursor: pointer; }

.lv_side_button_previous {
  margin-left: 0px;
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/lightview-imgs/blank.gif); /* lightview/lv-sprite.png */
  background-repeat: no-repeat;
  background-position: 0px -33px; }

.lv_side_button_previous:hover,
.lv_side_left .lv_side_button_out {
  background-position: 0px -64px; }

.lv_side_button_next {
  margin-left: 0px;
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/lightview-imgs/blank.gif); /* lightview/lv-sprite.png */
  background-repeat: no-repeat;
  background-position: -41px -33px; }

.lv_side_button_next:hover,
.lv_side_right .lv_side_button_out {
  background-position: -41px -64px; }

.lv_side_buttons_underneath .lv_side_button_out {
  margin-left: 0; }

/* disabled states */
.lv_side_buttons_underneath .lv_side_left_disabled .lv_side_button,
.lv_side_buttons_underneath .lv_side_left_disabled:hover .lv_side_button {
  background-position: 0px -95px; }

.lv_button_top_close {
  width: 33px;
  height: 33px;
  position: absolute;
  cursor: pointer;
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/lightview-imgs/blank.gif); /* lightview/lv-sprite.png */
  background-repeat: no-repeat;
  background-position: 0px 0px;
  /* the spacing option set on the relative controls is taken into account when positioning */
  top: 17px;
  /* left or right is set on the css of the skin */ }

.lv_button_top_close:hover {
  background-position: -33px 0px; }

/*
 * Top Controls
 */
.lv_controls_top {
  position: fixed;
  top: 0;
  left: 50%;
  width: 126px;
  margin-left: -63px;
  height: 63px;
  overflow: hidden; }

.lv_controls_top_with_slideshow {
  width: 147px;
  margin-left: -74px; }

.lv_controls_top .lv_top_middle {
  width: 100%;
  height: 33px;
  margin-top: 15px;
  float: left;
  position: relative; }

.lv_controls_top .lv_top_button {
  height: 100%;
  float: left;
  position: relative; }

.lv_controls_top .lv_icon {
   background-image: url(/media/vancouver-community-college/style-assets/css/style-images/lightview-imgs/blank.gif); /* lightview/lv-sprite.png */
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  float: left;
  cursor: pointer;
  font-family: "Lucida Sans", "Lucida Grande", Tahoma, sans-serif;
  color: #d4d4d4;
  text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
  position: relative; }

.lv_controls_top .lv_icon_disabled {
  cursor: default;
  color: #2e2e2e;
  text-shadow: none; }

.lv_top_previous {
  width: 63px; }

.lv_top_previous .lv_icon {
  background-position: 0px -96px; }

.lv_top_previous:hover .lv_icon {
  background-position: 0px -129px; }

.lv_top_previous .lv_icon_disabled,
.lv_top_previous:hover .lv_icon_disabled {
  background-position: 0px -162px; }

.lv_top_slideshow {
  width: 21px;
  display: none;
  position: relative; }

.lv_controls_top_with_slideshow .lv_top_slideshow {
  display: block; }

.lv_top_slideshow .lv_icon {
  background-position: -63px -96px; }

.lv_top_slideshow:hover .lv_icon {
  background-position: -63px -129px; }

.lv_top_slideshow .lv_icon_disabled,
.lv_top_slideshow:hover .lv_icon_disabled {
  background-position: -63px -162px; }

.lv_top_slideshow_playing .lv_icon {
  background-position: -148px -96px; }

.lv_top_slideshow_playing:hover .lv_icon {
  background-position: -148px -129px; }

.lv_top_next {
  width: 62px; }

.lv_top_next .lv_icon {
  background-position: -84px -96px; }

.lv_top_next:hover .lv_icon {
  background-position: -84px -129px; }

.lv_top_next .lv_icon_disabled,
.lv_top_next:hover .lv_icon_disabled {
  background-position: -84px -162px; }

.lv_icon span {
  margin-top: 5px;
  width: 30px;
  text-align: center;
  line-height: 23px; }

.lv_top_previous span {
  float: right;
  margin-right: 7px; }

.lv_top_next span {
  float: left;
  margin-left: 6px; }

.lv_controls_top_close {
  height: 33px;
  width: 33px;
  /* 46 */
  position: fixed;
  top: 0;
  right: 0;
  padding: 13px; }

.lv_controls_top_close_button {
  height: 33px;
  width: 33px;
  float: left;
  position: relative;
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/lightview-imgs/blank.gif); /* lightview/lv-sprite.png */
  background-repeat: no-repeat;
  background-position: -166px -21px;
  cursor: pointer; }

.lv_controls_top_close_button:hover {
  background-position: -166px -54px; }

/*
 * Relative Controls / Slider
 */
.lv_controls_relative {
  position: absolute;
  bottom: 10px;
  left: 50%;
  margin-left: -150px;
  height: 50px;
  overflow: hidden;
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/lightview-imgs/blank.gif); /* lightview/lv-sprite.png */ }

.lv_slider {
  font-family: "Lucida Sans", "Lucida Grande", Tahoma, sans-serif;
  font-size: 9px;
  height: 21px;
  line-height: 21px;
  padding: 15px 0 14px 0;
  position: relative;
  overflow: hidden; }

.lv_slider .lv_slider_numbers {
  float: left;
  position: relative;
  height: 21px;
  overflow: hidden;
  margin: 0 2px; }

.lv_slider .lv_slider_slide {
  position: absolute;
  top: 0;
  left: 0;
  height: 21px; }

.lv_slider_number,
.lv_slider_number_empty {
  float: left;
  position: relative;
  height: 21px;
  width: 28px;
  line-height: 21px;
  overflow: hidden;
  color: #d4d4d4;
  text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
  background: #4a4a4a;
  text-align: center;
  padding: 0;
  margin: 0;
  zoom: 1;
  text-transform: none;
  text-decoration: none;
  border: none;
  background-repeat: no-repeat;
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/lightview-imgs/blank.gif); /* lightview/lv-sprite.png */
  background-position: -67px 0px;
  cursor: pointer; }

.lv_slider_number_empty {
  background-position: -151px 0px;
  cursor: default; }

.lv_slider_number_last {
  margin-right: 0; }

.lv_slider_number:hover {
  background-position: -95px 0px; }

.lv_slider_numbers .lv_slider_number_active,
.lv_slider_numbers .lv_slider_number_active:hover {
  background-position: -123px 0px;
  color: #808080;
  cursor: default; }

.lv_slider .lv_slider_icon,
.lv_slider .lv_icon {
  height: 21px;
  width: 21px; }

.lv_slider .lv_slider_icon {
  zoom: 1;
  padding: 0 2px;
  /* IE6 needs padding instead of margin */
  display: inline;
  position: relative;
  cursor: pointer;
  float: left; }

.lv_slider .lv_icon {
 background-image: url(/media/vancouver-community-college/style-assets/css/style-images/lightview-imgs/blank.gif); /* lightview/lv-sprite.png */
  background-repeat: no-repeat;
  /* IE6 */
  position: absolute;
  top: 0;
  left: 2px;
  display: block; }

.lv_slider_previous .lv_icon {
  background-position: -82px -21px; }

.lv_slider_previous .lv_icon:hover {
  background-position: -82px -42px; }

.lv_slider_previous_disabled .lv_icon,
.lv_slider_previous_disabled .lv_icon:hover {
  background-position: -82px -63px;
  cursor: default; }

.lv_slider_next .lv_icon {
  background-position: -103px -21px; }

.lv_slider_next .lv_icon:hover {
  background-position: -103px -42px; }

.lv_slider_next_disabled .lv_icon,
.lv_slider_next_disabled .lv_icon:hover {
  background-position: -103px -63px;
  cursor: default; }

.lv_slider_slideshow {
  position: relative;
  top: 0;
  left: 0;
  display: inline; }

.lv_slider_slideshow .lv_icon {
  background-position: -125px -21px; }

.lv_slider_slideshow .lv_icon:hover {
  background-position: -125px -42px; }

.lv_slider_slideshow_playing .lv_icon {
  background-position: -146px -21px; }

.lv_slider_slideshow_playing .lv_icon:hover {
  background-position: -146px -42px; }

.lv_slider_slideshow_disabled .lv_icon,
.lv_slider_slideshow_disabled .lv_icon:hover {
  background-position: -125px -63px;
  cursor: default; }

/* thumbnails */
.lv_thumbnails {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 92px;
  padding: 15px 0 25px 0;
  overflow: hidden;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

.lv_thumbnails_slider {
  position: relative;
  width: 100%;
  height: 100%;
  float: left;
  overflow: hidden; }

.lv_thumbnails_slide {
  position: absolute;
  top: 0;
  left: 0; }

.lv_thumbnail {
  width: 92px;
  height: 92px;
  float: left;
  position: relative;
  display: inline;
  overflow: hidden;
  /* IE6 */ }

.lv_thumbnail_image {
  position: relative;
  background: red;
  background: #161616;
  width: 80px;
  height: 80px;
  margin: 6px;
  float: left;
  box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.3);
  cursor: pointer;
  overflow: hidden;
  display: inline;
  /* IE6 */
  z-index: 0;
  /* IE8 */ }

.lv_thumbnail_image img {
  position: absolute; }

.lv_thumbnail_active .lv_thumbnail_image {
  filter: alpha(opacity=35);
  opacity: .35;
  display: inline; }

.lv_thumbnail_icon {
  width: 36px;
  height: 36px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -18px;
  margin-top: -18px;
  background-position: 99px 99px;
  background-repeat: no-repeat;
  display: block !important;
  display: none;
  /* IE6 */ }

.lv_thumbnail_image_spinner_overlay {
  width: 100%;
  height: 100%;
  float: left;
  position: relative;
  background: #161616; }

.lv_thumbnail_icon_video {
  background-position: 0px -196px; }

.lv_thumbnail:hover .lv_thumbnail_icon_video {
  background-position: -36px -196px; }

.lv_thumbnail_active:hover .lv_thumbnail_icon_video {
  background-position: 0px -196px; }

/* 
 * Skins
 */
/* normalization for all skins */
.lv_content {
  text-align: left; }

.lv_content,
.lv_content h1,
.lv_content h2,
.lv_content h3,
.lv_content h4,
.lv_content h5,
.lv_content h6 {
  color: #333; }

.lv_content a,
.lv_content a:hover {
  color: #0088cc;
  font-weight: normal;
  background: none;
  border: 0;
  text-decoration: none; }

.lv_content a:hover {
  text-decoration: underline; }

.lv_title_caption a,
.lv_title_caption a:hover {
  color: #b4b4b4;
  font-weight: normal;
  background: none;
  border: 0;
  text-decoration: none; }

.lv_title_caption a:hover {
  text-decoration: underline; }

/** DropKick.js theme **/
/* One container to bind them... */
/* Styling for Vancouver by T4 */
.dk_container {
  text-align: left;
  background-color: #687c87;
  font-family: 'Source Sans Pro','EdmondSans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  position: relative; 
  z-index: 100;
  /* Opens the dropdown and holds the menu label */ }
  .dk_container a {
   padding: 3px 8px;
   cursor: pointer;
   text-decoration: none;
   width: 30px !important;
   height: 23px; }
  .dk_container:focus {
   outline: 0; }
  .dk_container .dk_options, .dk_container .dk_options a {
   background-color: inherit; }
  .dk_container .dk_toggle {
   background-image: url(/media/vancouver-community-college/style-assets/css/style-images/sprites-23-june-2016.png); /* sprites.png */
   background-repeat: no-repeat;
   background-position: 30px -1501px;/*30px -1504px;*/
   color: white; }
  .dk_container .dk_options {
   border: 1px solid #7fba00;
   width: 120px;
   padding: 12px;
   left: 0;
	top:25px; 
   margin-top: 0px;
   display: none;
   position: absolute;
   z-index: 1000;
   /* Inner ul for options, this is what makes the scrollbar possible. */ }
   .dk_container .dk_options li:first-child {
    display: none; }
   .dk_container .dk_options a, .dk_container .dk_options a:link, .dk_container .dk_options a:visited {
    display: block; }
   .dk_container .dk_options li {
    height: 26px;
    display: block; }
   .dk_container .dk_options li a {
    width: 120px !important;
    overflow: hidden; }
   .dk_container .dk_options .dk_options_inner {
    color: #333;
    max-height: 250px;
    margin: 0px; }
    .dk_container .dk_options .dk_options_inner .dk_option_current a {
      background-color: #7fba00; }

/* Set a max-height on the options inner */
.dk_options_inner,
.dk_touch .dk_options {
  max-height: 250px; }

/*.dk_open a.dk_toggle { height: 29px;}*/
/******  End Theme ******/
/***** Critical to the continued enjoyment of working dropdowns - set-up CSS ******/
.dk_container {
  display: none;
  float: left;
  position: relative; }
  .dk_container a {
   outline: 0; }
  .dk_container .dk_toggle {
   display: -moz-inline-stack;
   display: inline-block;
   *display: inline;
   position: relative;
   zoom: 1; }
  .dk_container .dk_options_inner {
   overflow: hidden;
   position: relative; }

.dk_open {
  position: relative; }
  .dk_open .dk_options {
   display: block; }
  .dk_open .dk_label {
   color: inherit; }

.dk_touch .dk_options {
  overflow: hidden; }
.dk_touch .dk_options_inner {
  max-height: none;
  overflow: visible; }

.dk_fouc select {
  position: relative; }

/*============================
Homepage Content Elements
============================*/
/* Info sessions boxes */
#info_sessions {
  font-size: 0.813em; }

#info_sessions .box-heading-arrow {
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/upside_down_triangle_gn.png); } /* upside_down_triangle_gn.png */

/** Social, more news, more events boxes **/
#social, #more_news, #more_events, #bulletins-box {
  font-size: 0.889em;
  position: relative; }

#social [class*="features"], #more_news [class*="features"], #more_events [class*="features"], #bulletins-box [class*="features"] {
   height: 100px;
   margin-top: 3%;
   width: 258px;
   margin-left: auto;
   margin-right: auto; }

#social .feature-item, #more_news .feature-item, #more_events .feature-item, #bulletins-box .feature-item {
   width: 258px;
   /* 228px / 280px */ }

#social .feature-item p a, #more_news .feature-item p a, #more_events .feature-item p a, #bulletins-box .feature-item p a {
    display: inline;
    width: auto; }

#social .feature-item p, #more_news .feature-item p, #more_events .feature-item p, #bulletins-box .feature-item p {
    line-height: 1.25em;
    padding: 0px 12px; }

#social .next, #social .prev, #more_news .next, #more_news .prev, #more_events .next, #more_events .prev, #bulletins-box .next, #bulletins-box .prev {
   display: block;
   height: 50px;
   position: absolute;
   top: 57.14285714285714%;
   width: 8.66667%;
   z-index: 800;
   /* 26px / 300px */ }

#social .next:hover, #social .prev:hover, #more_news .next:hover, #more_news .prev:hover, #more_events .next:hover, #more_events .prev:hover {
    cursor: pointer; }

#social .next, #more_news .next, #more_events .next {
   right: 0px;
   background-image: url(/media/vancouver-community-college/style-assets/css/style-images/arrow-right-small-light.png); /* arrow-right-small-light.png */
   background-position: 8px 0px; }

#social .next:hover, #more_news .next:hover, #more_events .next:hover {
    background-image: url(/media/vancouver-community-college/style-assets/css/style-images/arrow-right-dark-small.png); } /* arrow-right-dark-small.png */

#social .prev, #more_news .prev, #more_events .prev {
   left: 0px;
   background-image: url(/media/vancouver-community-college/style-assets/css/style-images/arrow-left-small-light.png); /* arrow-left-small-light.png */
   background-position: 8px 0px; }

#social .prev:hover, #more_news .prev:hover, #more_events .prev:hover {
    background-image: url(/media/vancouver-community-college/style-assets/css/style-images/arrow-left-dark-small.png); } /* arrow-left-dark-small.png */

#social .feature-date, #more_news .feature-date, #more_events .feature-date, #bulletins-box .feature-date {
   font-size: 0.875em;
   display: block;
   margin-top: 3px; }

#social .feature-item a, #more_news .feature-item a, #more_events .feature-item a, #bulletins-box .feature-item a {
   display: block; }

#social a.more, #more_news a.more, #more_events a.more, #bulletins-box a.more {
   width: 245px;
   margin-right: 8px; }

#more_news a, #more_events a, #bulletins-box a {
  width: 12px;
  margin-right: 0;
  height: 100%; }

#more_news .box-heading a, #bulletins-box .box-heading a {
  color: #2d2d2d !important; }

#more_news .box-heading .arrow-right-icon {
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/arrow-right-black-small.png); /* arrow-right-black-small.png */
  background-position: 0px 4px; }

#more_news .box-heading-arrow {
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/upside_down_triangle_blGray.png); } /* upside_down_triangle_blGray.png */

#bulletins-box span.bulletins-icon {
  background-image: url(/media/vancouver-community-college/content-assets/image/icons/icon-pin-25x23.png); /* icon-pin-25x23.png */
  background-position: 0px 0px; 
  background-size: 20px; }

#more_news span.news-icon {
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/news-black-small.png); /* news-black-small.png */
  background-position: 0px 3px; }

#more_events .box-heading-arrow {
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/upside_down_triangle_grayWhite.png); } /* upside_down_triangle_grayWhite.png */

#more_events span.calendar-icon {
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/sprites-23-june-2016.png); /* sprites.png */
  background-position: 0px -239px; }

#social {
  height: 260px; }/*---was160px---*/

  #social .box-heading-arrow {
    background-image: url(/media/vancouver-community-college/style-assets/css/style-images/upside_down_triangle_yellowGreen.png); } /* upside_down_triangle_yellowGreen.png */

  #social .box-heading {
    float: left;
    width: 50%;
    /* 139px / 278px */ }

    #social .box-heading span.icon {
      width: 26px;
      /* 26px / 139px */ }

    #social .box-heading .twitter-icon {
      background-image: url(/media/vancouver-community-college/style-assets/css/style-images/twitter_grey.png); /* twitter_grey.png */
      background-position: 0px 0px; }

    #social .box-heading .facebook-icon {
      background-image: url(/media/vancouver-community-college/style-assets/css/style-images/sprites-23-june-2016.png); /* sprites.png */
    background-position: 5px -593px; }

  #social .facebook_box, #social .twitter_box {
   position: absolute;
   top: 40px;
   left: 0px;
   width: 280px;
   height: 100px;
   overflow: hidden;
   padding: 0px 10px; }

@media screen and (max-width: 320px) {
  #social .next {
   right: 5px; } 
 }
/*============================
Inner pages
============================*/
.inner-page .container, .program-page .container {
  position: relative; }


#content-wrap > .back-to-boxes {
  top: 800px;
  position: absolute;
  right: 0;
  *zoom: 1; }
  #content-wrap > .back-to-boxes:before, #content-wrap > .back-to-boxes:after {
   display: table;
   content: "";
   line-height: 0; }
  #content-wrap > .back-to-boxes:after {
   clear: both; }

.back-to-top, .back-to-prog-menu {
  float: right;
  clear: right;
  text-align: center;
  font-size: 0.7em;
  line-height: 1.2; }

.back-to-top {
  width: 30px;
  height: 55px;
   background-image: url(/media/vancouver-community-college/style-assets/css/style-images/up_arrow.png); /* up_arrow.png */
  background-repeat: no-repeat;
  background-position: 9px 13px;
  margin-bottom: 10px; }
  .back-to-top a {
   display: inline-block;
   width: 30px;
   height: 55px; }

.back-to-prog-menu {
  background-color: #c0004e;
  color: white;
  width: 51px;
  height: 40px;
  padding: 24px 0px 10px;
  text-align: center;
  background: url(/media/vancouver-community-college/style-assets/css/style-images/white_arrow_up.png) 9px 10px no-repeat #c0004e; } /* white_arrow_up.png */
  .back-to-prog-menu a {
   color: white; }

/* Override span11 and span9 to center in the page */
.article, .prog-details-container, .expand-details {
  margin-left: auto !important;
  margin-right: auto  !important;
  float: none !important; }

.program-status {
  width: 820px;/*690px;*/
  margin-bottom: 50px; }
  .program-status span.sprite {
   display: block;
   float: left;
   height: 40px;
   width: 40px;
   margin-right: 20px; }
  .program-status p {
   float: left;
   width: 100%;/*630px*/
   margin-left:60px;
   margin-top:-15px;
   /* 560px / 620px */ }

@media (max-width: 320px) {
   .program-status span.sprite {
    width: 20px !important;
    height: 20px !important;
    margin-right: 10px;
    background-image: url(/media/vancouver-community-college/style-assets/css/style-images/pin-dark-small.png); /* pin-dark-small.png.png */
    background-position: 0px 0px; }
   .program-status p {
    width: 87%;
    margin-bottom: 0px; 
    } 
}
@media screen and (max-width: 768px) {
  .program-status {
   width: 100%;
   margin-bottom: 0px; }
} 
.program-menu {
  *zoom: 1; }
  .program-menu:before, .program-menu:after {
   display: table;
   content: "";
   line-height: 0; }
  .program-menu:after {
   clear: both; }
  .program-menu .row {
   margin: inherit;
   margin-bottom: 30px; }
  .program-menu .prog-menu-item {
  margin-left: 0px ;
   margin-right: 30px;
   margin-bottom: 20px;
   float: left;
   clear: none;
   height: 115px; }
   .program-menu .prog-menu-item:last-child {
    margin-right: 0; }
   .program-menu .prog-menu-item a {
    height: 95px;
    display: block;
    margin: 10px 7.14286%;
    /* 10px /140px */
    position: relative; }
    .program-menu .prog-menu-item a:hover {
      text-decoration: none; }
   .program-menu .prog-menu-item .text-bottom {
    position: absolute;
    left: 0px;
    bottom: 0px; }
  .program-menu .prog-menu-item:first-child {
   margin-left: 0; }
  .program-menu .prog-menu-item.pink:hover {
   background-color: #600027; }
  .program-menu .prog-menu-item.green:hover {
   background-color: #405d00; }
  .program-menu .prog-menu-item.seaBlue:hover {
   background-color: #034d60; }
  .program-menu .prog-menu-item.grayLighter:hover {
   background-color: #3f3e3e; }
  .program-menu .prog-menu-item.seaGreen:hover {
   background-color: #01544f; }
  .program-menu .prog-menu-item.grayDark:hover {
   background-color: #3f3e3e; }
  .program-menu .prog-menu-item.blue:hover {
   background-color: #004f70; }
  .program-menu .prog-menu-item.blueDark:hover {
   background-color: #0595bd; }
  .program-menu .prog-menu-item.greenDark:hover {
   background-color: #414c03; }
  .program-menu .prog-menu-item.red:hover {
   background-color: #5e0303; }

.prog-row {
  display: none; }

.prog-details {
  display: block;
  width: 100%; }

.prog-details-container {
  margin-left: auto;
  margin-right: auto; }

.prog-detail-tab {
  float: left;
  width: 260px;
  margin-left: 0px;
  height: 40px; }
  .prog-detail-tab .sprite {
   display: block;
   float: left;
   margin: 8px 0 7px 5%;
   /* 15px / 300px */ }
  .prog-detail-tab p {
   margin: 9px 0 0 6.66667%;
   float: left; }

/* styling for program detail boxes */
.program-detail {
  *zoom: 1;
  clear: left;
  padding: 20px 2.39234%;
  /*  20px / 840px */
  /* Course availability-type inline drop-down */ }
  .program-detail:before, .program-detail:after {
   display: table;
   content: "";
   line-height: 0; }
  .program-detail:after {
   clear: both; }
  .program-detail h3:first-child {
   margin-top: 0px; }
  .program-detail h3 {
   line-height: 30px; }
  .program-detail select.filterer {
   margin-left: 1.19048%;
   /* 10px / 840px */
   font-size: 0.95em;
   line-height: auto; }
  .program-detail .program-title {
   display: none; }
  .program-detail .program-detail-title {
   display: none; }

/* Sprite margin overrides */
#applyNow .sprite, #progHighlights .sprite {
  margin-top: 5px; }

#infoSessions .sprite {
  margin-top: 4px; }

#contact .sprite {
  margin-top: 6px; }

/* Table within program details */
.program-status .table, .apply-now-table {
  width: 820px;/*685px*/
  margin: 30px auto; }

.program-detail .table th {
  background-repeat: no-repeat;
  background-position: 18px 12px;
  padding: 15px 20px 15px 60px; }
.program-detail .table th.apply-online {
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/mouse_white.png); } /* mouse_white.png */
.program-detail .table th.apply-in-person {
  background-image: url(/media/vancouver-community-college/style-assets/css/style-images/person-white-smaller.png); } /* person-white-smaller.png */

/* background colors for hot-links in program details blocks */
.program-detail.pinkBorder a.hot-link {
  background-color: #c0004e;
  color: white; }
  .program-detail.pinkBorder a.hot-link:hover {
   background-color: white;
   color: #c0004e; }

.program-detail.greenBorder a.hot-link {
  background-color: #7fba00;
  color: white; }
  .program-detail.greenBorder a.hot-link:hover {
   background-color: white;
   color: #7fba00; }

.program-detail.seaBlueBorder a.hot-link {
  background-color: #0699bf;
  color: white; }
  .program-detail.seaBlueBorder a.hot-link:hover {
   background-color: white;
   color: #0699bf; }

.program-detail.grayLighterBorder a.hot-link {
  background-color: #7d7d7d;
  color: white; }
  .program-detail.grayLighterBorder a.hot-link:hover {
   background-color: white;
   color: #7d7d7d; }

.program-detail.seaGreenBorder a.hot-link {
  background-color: #01a89e;
  color: white; }
  .program-detail.seaGreenBorder a.hot-link:hover {
   background-color: white;
   color: #01a89e; }

.program-detail.grayDarkBorder a.hot-link {
  background-color: #4d4d4d;
  color: white; }
  .program-detail.grayDarkBorder a.hot-link:hover {
   background-color: white;
   color: #4d4d4d; }

.program-detail.blueBorder a.hot-link {
  background-color: #009ee0;
  color: white; }
  .program-detail.blueBorder a.hot-link:hover {
   background-color: white;
   color: #009ee0; }

.program-detail.blueDarkBorder a.hot-link {
  background-color: #002b52;
  color: white; }
  .program-detail.blueDarkBorder a.hot-link:hover {
   background-color: white;
   color: #002b52; }

.program-detail.greenDarkBorder a.hot-link {
  background-color: #819705;
  color: white; }
  .program-detail.greenDarkBorder a.hot-link:hover {
   background-color: white;
   color: #819705; }

.program-detail.redBorder a.hot-link {
  background-color: #bc0505;
  color: white; }
  .program-detail.redBorder a.hot-link:hover {
   background-color: white;
   color: #bc0505; }

/* For the +/- sprite used for hidden details eg 'International Students' */
.expand-details {
  margin-bottom: 50px; }
  .expand-details li {
   padding: 0 5px; }

.expand-details li:first-child {
   border-right: 1px solid #2d2d2d;
   padding-left: 0px;
   padding-right: 12px; }

/* expandible block which uses +/- sprite position -1530px in sprites.png */
.is-expandible div {
  display: none;
  margin-top: 5px;
  margin-left: 25px; }


.is-expandible:hover {
  cursor: pointer; }



  /* Program details, program status boxes responsive <= 480px ie for phone */
@media screen and (max-width: 480px) {
  .span820.expand-details { margin-left: 5px !important; } 
  .prog-detail-tab { display: none; }
  .program-detail .program-title {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    letter-spacing: -1px;
    color: #2d2d2d;
    font-weight: bold;
    font-size: 1.17em;
    display: block;
   
    /* 40px / 304px */
    padding-top: 12px;
   
    margin-top: -10px;
    margin-bottom: 10px;
  }
  .program-detail { color: white; border: none; } 
  .program-detail .program-title:hover { cursor: pointer; }
  .program-detail .program-title a {
      display: block;
      width: 86.84211%;
      color: #2d2d2d; 
       background: url(/media/vancouver-community-college/style-assets/css/style-images/mob-back-to-program-menu.png) no-repeat 0px 0px;  /* mob-back-to-program-menu.png */
        padding-left: 13.15789%;
  }
  #contact .program-title a { color: #fff;}
  .program-detail .program-detail-title { display: block; }
  .program-detail .program-detail-title p {
     padding-left: 15px;
     padding-bottom: 8px;
     margin-bottom: 12px;
     border-bottom: 2px solid white;
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
     font-weight: bold;
     font-size: 1.2em;
     letter-spacing: -1px; 
  }
  .program-detail h2, .program-detail h3, .program-detail a { color: white; }

  .program-detail .btn-group a { width: 100%; padding-top: 8px ; padding-bottom: 8px   }
  .program-detail .btn-large  { padding-left: inherit !important;  padding-right: inherit !important; font-size: 14px } 
  #applyNow .table-wrapper .pinned { background-color: #c0004e !important; }
  /* Specific background colors for program details boxes */  
  #applyNow .program-detail { background-color: #c0004e; }
  #progDescription .program-detail { background-color: #7fba00; }
  #admissionReqs .program-detail { background-color: #0699bf; }
  .program-detail .table th {
    background-repeat: no-repeat;
    background-position: 18px 12px;
    padding: 10px 3.125% 10px 3.125% ; /* 10 / 320 */ 
  }
  .mob-back-to-menu a {
   background: url(/media/vancouver-community-college/style-assets/css/style-images/up-arrow_blue.png) no-repeat 30px 7px !important; /* up-arrow_blue.png */
    float: right ;
    display: block;
    width: 200px;
    height: 100%; 
  }
  /*----------------Dept marketing page buttons-------------------*/
  #dept-news .program-detail { background-color: #05997e; }
  #dept-bios .program-detail {background-color: #99cc00; }
  #dept-testimonials .program-detail { background-color: #b3a900; }
  #dept-events .program-detail { background-color: #659400; }
  #dept-partnerships .program-detail { background-color: #3c9495; }
  #dept-galleries .program-detail { background-color: #5ba20b; }
  #dept-awards .program-detail {background-color: #73b89b; }
  #dept-success .program-detail {background-color: #c7be14; }
  #dept-memberships .program-detail {background-color: #51b3b4; }
  #dept-giveback .program-detail {background-color: #c2b800; }
/*-----------------------------------*/
  #courseSched .program-detail { background-color: #7d7d7d; }
  #fees .program-detail { background-color: #01a89e; }
  #fees .program-detail { background-color: #01a89e; }
  #programFAQ .program-detail { background-color: #4d4d4d; }
  #infoSessions .program-detail { background-color: #009ee0; }
  #contact .program-detail { background-color: #002b52; }
  #contact .program-detail input[type=submit] { border-color: #687c87; }
  #progHighlights .program-detail { background-color: #819705; }
  #career .program-detail { background-color: #bc0505; } 

}/* End media query Program details, program status boxes responsive for phone */

/* Program details, program status boxes responsive <= 767px - uses phone view */
@media screen and (max-width: 768px) {
  /* tables */
  iframe { width: 100% !important;}
.centered iframe { padding: 0 0% ; /* 150px */ }
  .table-wrapper { width: 100%; }
  /* Course availability table head div */
  .course-outline-table-head { width: 100%; }
  .course-outline-table-head .course-outline-download { float: left !important; margin-top: 6px; color:#0000ff; text-decoration:underline;}
  .course-outline-table-head .course-credits {
    margin-top: 6px;
    /*float: left !important;*/
    clear: left;
    margin-left: 0px;
    margin-right: 10px; 
  }
  .course-outline-table { width: 102.5%; border-bottom-width: 0px; }
  .course-outline-table td {
    display: block;
    width: 141px !important;
    padding: 4px 5px !important;
    float: left;
    min-height: 40px; 
  }
  .course-outline-table td:first-child {
    border-left-width: 0px !important;
    width: 140px;
    text-align: center; 
  }
  .course-outline-table td:nth-child(even) { border-right: none; }
  .program-status .table, .apply-now-table { width: 100%; }
  .apply-now-table td { background-color: white; color: #2d2d2d; }
  .container.program-menu-wrap, .container.program-descriptions-wrap { width: 100% !important; padding: 0px !important; }
  .program-menu {
    width: 93.75%; /* 300px / 320px */
    background-color: #b9b9b9;
    padding: 5px 3.125% 0% 3.125%; /* 10px / 320px */ 
  }
  .program-menu .prog-menu-item {
    width: 48.33333%;
    /* 145px / 300px */
    margin-right: 3.33333% !important;
    /* 10px / 300px */
    margin-bottom: 10px !important;
  }
  .program-menu .prog-menu-item:nth-child(even) { margin-right: 0% !important; }
  .program-detail {
    /*Hidden in Desktop*/
    width: 95%;
    /* padding left and right ~8px, width is 304px */
    padding-left: 2.5%;
    /* 8px / 320px */
    padding-right: 2.5%;
    /* 8px / 320px */
  }
  .program-detail a { text-decoration: underline; }
  .program-detail a:hover { text-decoration: none; }

}/* End media query Program details, program status boxes responsive <= 767px */
@media screen and (max-width: 852px) {
  .program-menu {
    width: 93.75%; /* 300px / 320px */
    background-color: #b9b9b9;
    padding: 5px 3.125% 0% 3.125%; /* 10px / 320px */ 
  }
  .program-menu .prog-menu-item {
    width: 48.33333%;
    /* 145px / 300px */
    margin-right: 3.33333% !important;
    /* 10px / 300px */
    margin-bottom: 10px !important;
  }
  .program-menu .prog-menu-item:nth-child(even) { margin-right: 0% !important; }
}

@media screen and (min-width: 481px) and (max-width: 767px) {
  .mob-back-to-menu a {
   background: url(/media/vancouver-community-college/style-assets/css/style-images/up-arrow_blue.png) no-repeat 15px 7px; /* up-arrow_blue.png */
    float: right ;
    display: block;
    width: 200px;
    height: 100%; 
  }

}


/* Program details boxes responsive */
/* Image slideshow */
#image-slider-wrap {
  margin-bottom: 60px; }
  #image-slider-wrap .slideshow {
   margin-left: 20px !important; }
  #image-slider-wrap .slideshow-items {
   margin-left: auto;
   margin-right: auto;
   width: 820px; }
  #image-slider-wrap h3 {
   position: absolute;
   bottom: 30px;
   left: 0px;
   background-color: #7fba00;
   color: white;
   width: 45.1219512195122%;
   padding-left: 2.43902%;
   padding-top: 2px;
   padding-bottom: 2px;
   padding-right: 1.21951%;
   font-family:  'Source Sans Pro','EdmondSans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
   letter-spacing: normal;
   font-weight: 500;
   font-size: 1.625em;
   /* 26px */
   /* background opacity */
   background-color: rgba(127, 186, 0, 0.75); }
   #image-slider-wrap h3 a {
    display: block;
    color: inherit;
    background-color: transparent; }
  #image-slider-wrap .image-slide {
   width: 820px;
   height: 500px;
   overflow: hidden;
   margin-bottom: 20px; }
  #image-slider-wrap img {
   width: 820px; }
  #image-slider-wrap .next, #image-slider-wrap .prev {
   position: absolute;
   width: 40px;
   height: 500px;
   top: 0px; }
   #image-slider-wrap .next span, #image-slider-wrap .prev span {
    display: block;
    height: 40px;
    width: 40px;
    margin-top: 230px;
    background-image: url(/media/vancouver-community-college/style-assets/css/style-images/sprites-23-june-2016.png); /* sprites.png */
    background-repeat: no-repeat; }
    #image-slider-wrap .next span:hover, #image-slider-wrap .prev span:hover {
      cursor: pointer; }
  #image-slider-wrap .next {
   right: 0px; }
   #image-slider-wrap .next span {
    background-position: 7px -125px; }
  #image-slider-wrap .prev {
   left: 0px; }
   #image-slider-wrap .prev span {
    background-position: 9px 0px; }
/* End Image slideshow */
/* Image slideshow Responsive */
@media screen and (max-width: 480px) {
  #image-slider-wrap {
   margin-bottom: 20px;
   padding: 0px;
   width: 100%;
   min-width: 480px; }
   #image-slider-wrap .slideshow {
    margin-left: 0px !important; }
   #image-slider-wrap .slideshow-items {
    width: 100%;
    max-width: 260px; }
   #image-slider-wrap h3 {
    font-size: inherit; }
   #image-slider-wrap .image-slide {
    width: 100%;
    height: 159px;
    overflow: hidden; }
   #image-slider-wrap img {
    width: 100% !important;
    max-width: 260px; }
   #image-slider-wrap .next, #image-slider-wrap .prev {
    width: 30px;
    height: 159px; }
    #image-slider-wrap .next span, #image-slider-wrap .prev span {
      width: 30px;
      height: 20px;
      background-position: 0px;
      margin-top: 72px; }
   #image-slider-wrap .prev span {
    background-image: url(/media/vancouver-community-college/style-assets/css/style-images/arrow-left-dark-small.png); /* arrow-left-dark-small.png */
    background-position: 19px 0px; }
   #image-slider-wrap .next span {
     background-image: url(/media/vancouver-community-college/style-assets/css/style-images/arrow-right-dark-small.png); /* arrow-right-dark-small.png */
    background-position: 2px 0px; } }
/* End Image slideshow Responsive */
/* Student testimonial boxes */
#student-testimonials h3 {
  background-color: #7fba00;
  color: white;
  width: 45.12195%;
  /* padding is 20px left and right, so it's half the width minus 40 = 370px */
  padding: 0px 1.21951%;
  /* 12px / 820 px */ }
#student-testimonials .testimonial {
  width: 816px;
  border: 2px solid #7fba00;
  border-bottom: none; }
  #student-testimonials .testimonial sub, #student-testimonials .testimonial sup {
   font-size: 3.1em;
   color: #7fba00;
   font-weight: bold; }
  #student-testimonials .testimonial p {
   margin: 25px;
   margin-left: 0px;
   float: left;
   width: 728px;
   line-height: 1.6em;
   font-size: 1.1em;
   font-weight: 500;
   color: #4b4c4f; }
  #student-testimonials .testimonial p.super {
   margin-right: 0px;
   margin-left: 25px;
   width: 23px; }
  #student-testimonials .testimonial sup {
   margin-right: 1px;
   top: 0.2em; }
  #student-testimonials .testimonial sub {
   margin-left: 1px;
   bottom: -0.7em; }
#student-testimonials .tesimonial-bottom {
  width: 816px;
  height: 37px;
  border: 2px solid #7fba00;
  border-top: none;
  position: relative;
  margin-bottom: 20px; }
  #student-testimonials .tesimonial-bottom .bottom-left {
   position: absolute;
   bottom: 1px;
   left: 44px;
   width: 246px;
   border: 2px solid #7fba00;
   border-top: none;
   border-right: none;
   height: 34px;
   transform: skew(68deg, 0deg);
   -ms-transform: skew(68deg, 0deg);
   /* IE 9 */
   -webkit-transform: skew(68deg, 0deg);
   /* Safari and Chrome */
   display: none; }
  #student-testimonials .tesimonial-bottom .student {
   position: absolute;
   bottom: -2px;
   right: -2px;
   color: #4d4d4d;
   background-color: #b9b9b9;
   text-align: right;
   width: 508px;
   clear: left;
   float: right;
   padding: 5px 20px;
   font-weight: bold; }
   #student-testimonials .tesimonial-bottom .student .student-skew {
    display: none;
    background-color: inherit;
    position: absolute;
    height: 100%;
    width: 100px;
    left: -36px;
    bottom: 0px;
    transform: skew(48deg, 0deg);
    -ms-transform: skew(48deg, 0deg);
    /* IE 9 */
    -webkit-transform: skew(48deg, 0deg);
    /* Safari and Chrome */ }

/* Student testimonial responsive */
@media screen and (max-width: 480px) {
  #student-testimonials {
   width: 98.75% !important;
   /* 320 - 4px for padding = 316px / 320px */
   margin: 0px !important;
   padding-left: 0.625%;
   /* 2px / 320px*/
   padding-right: 0.625%;
   /* 2px / 320px*/
   max-width: 480px;
   /* testimonial availiable width = 312 (316 -- 4px for the border) */ }
   #student-testimonials h3 {
    width: 93.67088607594937%;
    letter-spacing: normal;
    margin-bottom: 8px;
    padding: 5px 3.16456%; }
   #student-testimonials .testimonial {
    padding-top: 10px;
    width: 98.73418%;
    /* 312px / 316px */ }
    #student-testimonials .testimonial p {
      width: 286px !important;
      line-height: 1.6em;
      margin: 0;
      margin-right: 2px;
      margin-left: 5px;
      margin-top: 10px;
      font-size: 1em;
      line-height: inherit;
      font-weight: normal; }
   #student-testimonials p.super {
    width: 1.602564102564103% !important;
    /* 5px */
    margin: 0px !important;
    margin-left: 5px !important;
    margin-top: 10px; }
    #student-testimonials p.super sup {
      font-size: 1.3em; }
   #student-testimonials p sub {
    font-size: 1.3em !important;
    margin-left: 3px !important;
    bottom: -0.9em; }

  .tesimonial-bottom {
   width: 312px !important;
   border-right: 2px solid #7fba00 !important; }

  .student {
   width: 290px !important;
   /* 280 / 312px */
   bottom: 0px;
   right: 0px;
   font-size: 0.85em;
   padding: 4px 1.602564102564103% !important;
   /* 5px */
   line-height: 1.3em; } }
/*==================================== 
Responsive utility class overrides 
to make layout responsive. 
Supports Desktop, tablet and phone.
Phone is 0px <= 767px ;
Tablet 768px <= 960px 
=====================================*/

.visible-desktop { display: inherit !important; }
.hidden-tablet { display: inherit !important; }
.hidden-desktop { display: none !important; }

@media screen and (max-width: 320px) {
  .visible-phone { display: block !important;} 
  .hidden-phone { display: none !important;}
}

@media screen and (min-width: 321px) and (max-width: 768px) {
  .visible-tablet { display: inherit !important;} 
  .hidden-tablet { display: none !important;}
}
/* this covers everything up to 767px ie phone and tablet portrait */
@media (max-width: 768px) {
  /* general grid elements */
  [class*="span"] { margin-left: 0px; }
  .span6, .span12 {
   width: 100% !important;
   min-width: 100% !important; } 
}

@media screen and (max-width: 769px) and (max-width: 1020px) {
    div.mob-back-to-menu { 
      display: block !important;
      width: 98.75%;
      text-align: right;
      margin-top: 10px; 
    }
  .mob-back-to-menu a {
   background: url(/media/vancouver-community-college/style-assets/css/style-images/up-arrow_blue.png) no-repeat 10px 7px; /* up-arrow_blue.png */
   
  }
  .back-to-boxes { display: none !important;}
}

/*----start-tooltip-(HK)----*/
.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 250px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;

    /* Position the tooltip */
    /*position: absolute;
    z-index: 1;*/
	 position: absolute;
    z-index: 1;
    top: -5px;
    left: 145%;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

/*----end-tooltip-(HK)----*/


/*----homepage-(top matrix bill board where CS goes)----*/
.heightauto,  .heightauto .item-billboard {
	height:auto;
}


.p-15 { padding: 15px; }
.pr-15 { padding-right:15px; }
.pl-15 { padding-left:15px; }
.pt-15 { padding-top: 15px; }
.pb-15 { padding-bottom: 15px; }