/*!
 * Project:   Beringia
 * Date:      2015/04/29
/* ---------------------------------------- */

  @import url(https://fonts.googleapis.com/css?family=Merriweather:400,300,300italic,400italic,700,700italic,900,900italic);
  @import url(https://fonts.googleapis.com/css?family=Oswald:400,300,700);
  @import url(https://fonts.googleapis.com/css?family=Raleway:400,900,800,700,600,500,300,200);

  html {
    overflow-y: scroll;
    width: 100%;
    height: 100%;
  }

  body {
    background: #252525;
    font-family: 'Merriweather', Times, serif;
    font-weight: 300;
    font-style: normal;
    font-size: 100%;
    line-height: 1.3em;
    width: 100%;
    min-height: 100%;
    color: #252525;
    margin: 0;
    -webkit-font-smoothing: subpixel-antialiased;
  }

  body:after {
    content: 'base';
    display: none;
    visibility: hidden;
    height: 0;
  }


  /*******************************
      BASIC TEXT STYLES
  ********************************/

  a:link, a:visited {
    color: #252525;
    text-decoration: none;
  }

  h2 a:link, h2 a:visited {
    color: unset;
    border-bottom: initial;
  }

  a:hover, a:active {
    color: #eab010;
  }

  .white-content a {
    text-decoration: underline;
  }

  a.block-link {
    display: block;
    color: inherit;
  }

  .clear {
    clear: both;
  }

  .clearfix {
    zoom: 1;
  }

  .clearfix:before,
  .clearfix:after {
    content: "";
    display: table;
    height: 0;
    visibility: hidden;
  }

  .clearfix:after {
    clear: both;
  }

  h1 {
    font-family: 'Raleway', sans-serif;
    font-weight: 900;
    font-size: 160%;
    line-height: 1.2em;
    color: #fff;
    background-color: rgba(234,176,16,0.9);
    text-transform: uppercase;
    display: inline-block;
    padding: 0.2em;
    margin: 0.6em 0;
  }

  .cover h1 {
    color: #eab010;
    background-color: rgba(0,0,0,0.7);
  }

  h1.date {
    font-family: 'Raleway', sans-serif;
    font-weight: 400;
    font-size: 75%;
    line-height: 1em;
    color: #fff;
    background: #eab010;
    text-align: center;
    -moz-border-radius: 0.5em;
    border-radius: 0.5em;
    padding: 0.75em 1.5em;
    margin: 1.3em 0;
  }

  h1.date .day {
    display: block;
    font-size: 250%;
    line-height: 1.2em;
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
  }

  h2 {
    font-family: 'Raleway', sans-serif;
    font-weight: 800;
    font-size: 150%;
    line-height: 1.2em;
    color: #eab010;
    margin: 0.5em 0;
    display: inline-block;
    text-transform: uppercase;
    border-bottom: 1px solid #eab010;
  }

  h3 {
    font-family: 'Raleway', sans-serif;
    font-weight: 600;
    font-size: 100%;
    line-height: 1.2em;
    color: #252525;
    margin: 0.5em 0;
    text-transform: uppercase;
  }

  h4 {
    font-weight: 700;
    font-size: 95%;
    line-height: 1.2em;
    color: #00aeef;
    text-transform: none;
    margin: 1em 0 0.5em 0;
  }

  p {
    font-size: 95%;
    margin: 0 0 0.8em;
    line-height: 1.6em;
  }

  #content p {
    font-size: 95%;
    /*-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;*/
  }

  ul {
    margin: 0 0 1em;
  }

  li {
    line-height: 1.3em;
  }

  .light {
    font-weight: 300;
  }

  #content ul li {
    list-style-type: disc;
    margin-left: 1em;
    font-size: 95%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  blockquote{
    margin-top: 1em;
    border-left: 5px solid #ccc;
    padding-left: 1em;
    font-style: italic;
    color: #666;
  }

  strong {
    font-weight: 700;
  }

  em {
    font-style: italic;
  }

  figure {
    margin: 10px 0 0;
    padding: 0;
    background: unset;
  }

  figure img, img {
    max-width: 100%;
    height: auto;
  }

  figure > figcaption {
    float: unset;
    font-family: "Merriweather",Times,serif;
    font-size: 0.75em;
    font-style: italic;
    font-weight: 100;
    margin: unset;
    padding: 5px 0;
    text-align: center;
    background-color: #eab010;
    color: #fff;
  }

  .tile > figure {
    margin: unset;
  }

  /*  for content semantics  */
  .outline {
    display: none;
  }

  .icon-goto:before {
    font-size: 145%;
    vertical-align: -0.15em;
  }

  .icononly {
    display: inline-block;
    width: 1em;
    height: 1em;
    overflow: hidden;
  }


  /*******************************
      LAYOUT BLOCKS
  ********************************/

  #viewport {
    width: 100%;
    padding: 0;
    margin: 0 ;
    background: #fff;
    position: relative;
    z-index: 100;
  }

  .wrap {
    width: 95%;
    max-width: 1020px;
    margin: 0 auto;
    padding: 0;
    position: relative;
  }

  .greybg{
    background: #252525;
  }

  .greybgtrans{
    background: rgba(37,37,37,0.7);
  }


  /*******************************
        COLUMNS
  ********************************/

  .col {
    margin: 0 2.5%;
    clear: left;
  }

  .fullwidth .col, .col.gutterless {
    margin: 0 !important;
  }

  .col.single {
    float: none !important;
    clear: left !important;
  }

  .col.third.pairs, .col.sixth {
    float: left;
    clear: none;
    width: 45%;
  }

  .fullwidth .col.third.pairs,
  .fullwidth .col.sixth,
  .col.third.pairs.gutterless,
  .col.sixth.gutterless {
    width: 50%;
  }

/*  Fifths are unique, not conforming to our grid,
    and only used for recommended logos. We'll kick
    them off as thirds, because that suites the logos. */
  .col.fifth {
    float: left;
    clear: none;
    width: 28.33333333333333%
   }

/*
  .col.third.pairs:nth-child(2n+3) {
    clear: left;
  }
*/


  /*******************************
        HEADER
  ********************************/

  header#title {
    height: 50px;
    position: relative;
    z-index: 300;
  }

  header#title a.logo {
    display: block;
    margin: 0 auto;
    padding: 0.5em 0 0;
    width: 100px;
  }

  header#title a.menu {
    display: block;
    float: right;
    margin: 0.5em 0 0;
    padding: 0.35em 0.4em;
    font-size: 110%;
    line-height: 1;
    color: #f8ac46;
    cursor: pointer;
    background: rgba(255,255,255,0.15);
    border-radius: 0.2em;
  }

  header#title a.menu span {
    vertical-align: -0.1em;
  }

  #skip-link {
    display: none;
  }

  /*******************************
        MAIN NAV
  ********************************/

  div#menu-viewport {
    position: fixed;
    right: 0;
    top: 0;
    margin: 0;
    height: 100%;
    width: 200px;
    z-index: 1;
    /*  Text in safari, inside a fixed position element, goes thin... this corrects that.
      Though, the aliasing isn't as crisp, so not necesarrily a good solution */
    -webkit-font-smoothing: antialiased;
    font-weight: 300;
    font-size: 70%;
    line-height: 1em;
    overflow-y: visible;
    overflow-x: hidden;
  }

  header#nav ul {
    margin: 5em 0.5em 0 1em;
    padding: 0;
  }

  header#nav ul li {
    padding: 0;
    margin: 0;
    font-family: 'Raleway', sans-serif;
    font-weight: 400;
    list-style: none;
  }

  header#nav li a:link,
  header#nav li a:visited {
    display: block;
    padding: 0.6em;
    width: 100%;
    text-decoration: none;
    color: #fff;
  }

  header#nav li a:hover,
  header#nav li a:active,
  header#nav li.selected a {
    color: #a3c8e3;
  }

  header#nav ul ul {
    margin: 0;
  }

  header#nav li li {
    margin: 0 0 0 1em;
  }

  header#nav #main {
    text-transform: uppercase;
  }


  /*******************************
      SLIDESHOW
  ********************************/

  .region-slideshow .viewsSlideshowCycle-processed {
    overflow: hidden;
  }

  .region-slideshow .viewsSlideshowCycle-processed>div {
    margin-bottom: 67%;
    position: relative;
  }

  .region-slideshow .views-slideshow-cycle-main-frame-row {
    position: absolute;
    width: 100% !important;
  }

  .region-slideshow .views-slideshow-cycle-main-frame-row img {
    display: block;
    width: 100% !important;
  }

  .region-slideshow .block.block-views {
    position: relative;
  }

  .region-slideshow .views-slideshow-controls-top {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 95%;
    z-index: 10;
  }

  .region-slideshow .views-slideshow-controls-top>div {
    width: 100%;
  }

  .region-slideshow .views-slideshow-controls-top span {
    display: block;
    font-size: 160%;
    line-height: 1em;
    width: 1em;
    height: 1.1em;
  }

  .region-slideshow span.views-slideshow-controls-text-previous {
    float: left;
  }

  .region-slideshow span.views-slideshow-controls-text-pause {
    display: none;
  }

  .region-slideshow span.views-slideshow-controls-text-next {
    float: right;
  }

  .region-slideshow .views-slideshow-controls-top span a {
    display: block;
    position: relative;
    text-indent: -9999px;
  }

  .region-slideshow .views-slideshow-controls-top span a:before {
    display: block;
    position: absolute;
    top: 0;
    text-indent: 0;
    color: #eab010;
    /* Icomoon icon implementation =========== */
    font-family: 'icomoon';
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  .region-slideshow span.views-slideshow-controls-text-previous a:before {
    content: "\e607";
    left: 0;
  }

  .region-slideshow span.views-slideshow-controls-text-next a:before {
    content: "\e603";
    right: 0;
  }

  /* IE needs an extra special kick in the pants to ensure no-underline override of views slideshow css */
  .views_slideshow_controls_text span:hover {
    text-decoration: none !important;
  }

  /*  some style overrides for homepage slideshow  */
  #home-slideshow .region-slideshow .viewsSlideshowCycle-processed>div {
    margin-bottom: 35%;
  }

  #home-slideshow .region-slideshow .views-slideshow-controls-top {
    /*
    top: 39%;
    left: 0;
    */
    width: 100%;
  }

  #home-slideshow .region-slideshow .views-slideshow-controls-top>div {
    width: 85%;
    /*max-width: 1400px;*/
    margin: 0 auto;
  }

  #home-slideshow .region-slideshow .views-slideshow-controls-top span {
    font-size: 200%;
  }

  #home-slideshow .region-slideshow .views-slideshow-controls-top span a:before {
    color: #eab010;
  }


  /*******************************
      CLASSIC FEED
  ********************************/

  .classic-feed a {
    text-decoration: none;
  }

  .classic-feed .col.quarter,
  .classic-feed .col.quarter .banner {
    background: #fff;
  }

  .classic-feed .col.quarter.views-row-even,
  .classic-feed .col.quarter.views-row-even .banner {
    background: #ebebeb;
  }

  .classic-feed .col.quarter a.tile {
    width: 100%;
    display: block;
    position: relative;
    padding: 0.5em 0;
  }

  .classic-feed .col.quarter figure {
    display: none;
  }

  .classic-feed .col.quarter .summary {
    display: none;
  }

  .classic-feed .col.quarter .past {
    display: none;
  }

  .classic-feed .col.quarter .banner {
    padding: 0.75em 0 1.25em;
  }

  .classic-feed h2 {
    display: inline-block;
    width: auto;
    margin: 0 5%;
    padding: 0 0 0.25em;
    border-bottom: 1px solid #f8ac46;
    font-family: 'Merriweather', serif;
    font-weight: 400;
    font-size: 70%;
    color: #252525;
    text-transform: none;
  }

  .classic-feed h2.bold {
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    text-transform: uppercase;
  }

  .classic-feed h3 {
    margin: 0.5em 5% 0;
    padding: 0;
    font-family: 'Merriweather', serif;
    font-weight: 300;
    color: #404041;
    text-transform: none;
    /*text-decoration: none;*/
  }

  .classic-feed h3.bold {
    font-family: "Raleway", sans-serif;
    font-weight: 800;
    font-size: 115%;
    text-transform: uppercase;
  }

  .classic-feed h4 {
    margin: 0.4em 5% 0;
    padding: 0;
    font-family: 'Raleway', sans-serif;
    font-weight: 400;
    color: #6b6b6c;
    font-weight: 300;
    font-size: 77%;
  }

  .classic-feed p {
    font-size: 73%;
    margin: 0.5em 5%;
    padding: 0;
  }


  /*******************************
      HOME INFO FEED
  ********************************/

  .classic-feed .info {
    display: block;
    padding: 1em 0;
    position: relative;
    color: #fff;
  }
  .classic-feed .views-row-first .info {
    padding-bottom: 0;
  }

  .classic-feed .views-row-second .info {
    padding-top: 0.5em;
  }

  .classic-feed .info .col.half {
    width: 50%;
    float: left;
    clear: none;
  }

  .classic-feed .info .col.half div.pad {
    padding: 0.5em 0 0 20%;
  }

  .classic-feed .info .col.single div.pad {
    padding: 0.5em 10% 0;
  }

  .classic-feed .info h2 {
    font-family: 'Raleway', sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    color: #eab010;
    font-size: 85%;
    border: none;
    height: auto;
    overflow: visible;
    margin: 0;
    position: relative;
  }

  .classic-feed .info h2:before {
    position: absolute;
    left: -1.4em;
    top: -0.1em;
    font-size: 125%;
    color: #fff;
    padding: 0;
  }

  .classic-feed .info h2 span {
    border-bottom: 1px solid #eab010;
  }

  .classic-feed .info .upcoming h2,
  .classic-feed .info .upcoming h2 span {
    display: block;
  }

  .classic-feed .info h2 a {
    color: #eab010;
  }

  .classic-feed .info a.icon-goto {
    display: block;
    color: #eab010;
    font-size: 75%;
    margin: 0.75em 0;
  }

  .classic-feed .info a.icon-goto:before {
    color: #fff;
    padding-right: 0.7em;
  }

  .classic-feed .info p {
    margin: 0.5em 0;
    font-family: 'Raleway', sans-serif;
    font-size: 80%;
  }

  .classic-feed .view-homepage-hours-admissions p {
    line-height: 1.1em;
  }

  .classic-feed .view-homepage-hours-admissions table {
    font-size: 80%;
    border: none;
    margin-top: 0.5em;
    font-family: "Raleway",sans-serif;
  }

  .classic-feed .view-homepage-hours-admissions table tbody {
    border: none;
  }

  .classic-feed .view-homepage-hours-admissions table tr {
    line-height: 1.4em;
  }

  .classic-feed .view-homepage-hours-admissions table td {
    border: none;
  }

  .view-home-upcoming-events ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
  }

  .view-home-upcoming-events ul li{
    font-size: 73%;
    margin: .5em 0;
    padding: 0;
    clear: left;
  }

  .view-home-upcoming-events ul li a{
    color: #fff;
  }

  .view-home-upcoming-events ul li .date{
    float: left;
    margin-right: 1em;
    text-align: center;
    text-transform: uppercase;
  }

  .view-home-upcoming-events ul li .date .month{
    display: block;
    font-size: 80%;
    font-family: 'Raleway', sans-serif;
  }

  .view-home-upcoming-events ul li .date .day{
    display: block;
    font-size: 120%;
    font-family: 'Oswald', sans-serif;
  }

  .view-home-upcoming-events ul li .title{
    font-weight: 400;
    text-transform: uppercase;
    font-family: 'Raleway', sans-serif;
  }


  /*******************************
      AJAX GRID
  ********************************/

  .ajax-grid .col.active {
    position: relative;
  }

  .ajax-grid .col.active:after {
    display: block;
    position: absolute;
    left: 50%;
    top: 99.5%;
    margin-left: -0.5em;
    color: #fff;
    font-size: 200%;
    /* Icomoon icon implementation =========== */
    content: "\e605";
    font-family: 'icomoon';
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  .ajax-grid .col.active.views-row-even:after {
    color: #ebebeb;
  }


  /*******************************
        SUB-MENU
  ********************************/

  #submenu {
    padding: 2.2em 0;
  }

  #submenu h2 {
    display: none;
  }

  #submenu ul {
    margin: 0;
    padding: 0;
  }

  #submenu ul li {
    list-style-image: url(../images/menu-bullet.png);
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    white-space: nowrap;
    font-weight: 300;
    font-size: 110%;
    margin: 0;
    padding: 0.5em 0;
  }

  #submenu ul li a.active,
  #submenu ul li:hover a {
    font-weight: 400;
  }

  #submenu ul li a {
    color: #252525;
    text-decoration: none;
  }


  /*******************************
        LANGUAGE SWITCHER
  ********************************/

  .region-header {
    width: 100px;
  }

  div#block-locale-language div.contextual-links-wrapper {
    display: none;
  }

  div#block-locale-language div.item-list {
    float: right;
  }

  ul.lang-list {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
  }

  ul.lang-list li {
    float: left;
  }

  ul.lang-list li a.lang {
    display: block;
  }


  /*******************************
        CONTENT
  ********************************/

  .cover {
    position: relative;
    max-height: 600px;
    overflow-y: hidden;
  }

  .cover img {
    display: block;
    width: 100%;
    max-width: 100%;
  }

  .cover .wrap {
    position: static;
  }

  .cover .wrap .col.title {
    position: absolute;
    bottom: 0;
  }

  .mapbg {
    background-color: #3f3d39;
    background-image: linear-gradient(rgba(0,0,0,0.8), rgba(0,0,0,0.8)), url("../images/MapBG.jpg");
    background-size: cover;
  }

  .cover.mapbg .wrap.img-mapbg {
    width: 100%;
  }

  .cover.mapbg .wrap.img-mapbg .col.single {
    margin: 0;
  }

  .mapbg.no-cover-img h1 {
    display: block;
    color: #eab010;
    background: none;
    margin: 0;
    padding: 1.2em 0 1em;
  }

  .mapbg.no-cover-img .col.single h1 {
    text-align: center;
  }

  .white-content{
    background: #fff;
    position: relative;
  }

  .yellow-content{
    background: #eab010;
    color: #fff;
  }

  .yellow-content h2,
  .yellow-content h3,
  .yellow-content h4,
  .yellow-content .body-content p {
    color: #fff;
    /*-webkit-font-smoothing: none;  <-- none doesn't make sense, it results in ugly un-aliased text*/
    -webkit-font-smoothing: subpixel-antialiased;
    -moz-osx-font-smoothing: auto;
  }

  .yellow-content .body-content a:hover {
    color: #fff;
  }

  .body-content {
    padding: 2em 0;
  }

  .body-content a {
    border-bottom: 1px solid #eab010;
    text-decoration: none;
  }

  .body-content p,
  .body-content ul,
  .body-content table {
    font-size: 82%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  .body-content th {
    font-weight: 100;
  }

  .body-content h2 {
    line-height: 1.1em;
  }

  p.postdate {
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    color: #4c5053;
    font-size: 75%;
  }

  p.postdate strong {
    margin-right: .5em;
  }

  .socialmedia, .partager {
    margin: 2.5em 0 5em 0;
  }

  .socialmedia h3 {
    width: 118px;
    height: 21px;
    background: transparent url(../images/Share.png) no-repeat 0 0;
    text-indent: -9999px;
  }

  .partager h3 {
    width: 150px;
    height: 21px;
    background: transparent url(../images/Partager.png) no-repeat 0 0;
    text-indent: -9999px;
  }

  .p404 .oops strong {
    font-family: 'Raleway', sans-serif;
    font-weight: 900;
    font-size: 150%;
  }

  .fr404 {
    font-size: 130%!important;
  }

  .p404 a.icon-goto {
    text-decoration: none;
    font-family: 'Raleway', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
  }

  .p404 a.icon-goto::before {
    color: #eab010;
  }


  /*******************************
        EXHIBIT
  ********************************/

  .exhibit-text-block, .exposition-text-block {
    padding: 2em 0;
    font-size: 95%;
  }

  .exhibit-text-block p, .exposition-text-block p {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  .exhibit-text-block .intro p, .exposition-text-block .intro p {
    font-size: 170%;
    font-weight: 300;
    text-transform: uppercase;
    font-family: 'Oswald', sans-serif;
    line-height: 1.3em;
    padding-right: 1em;
  }

  .exhibit-text-block p.icon-goto, .exposition-text-block p.icon-goto {
    text-transform: uppercase;
    font-weight: 600;
    font-family: 'Raleway', sans-serif;
  }

  .exhibit-text-block p.icon-goto:before, .exposition-text-block p.icon-goto:before,
  a:hover .exhibit-text-block p.icon-goto, a:hover .exposition-text-block p.icon-goto,
  a:active .exhibit-text-block p.icon-goto, a:active .exposition-text-block p.icon-goto {
    color: #eab010;
  }

  /* THE BERINGIA */
  .cover.node-6 h1, .cover.node-208 h1 {
    background-color: rgba(234,176,16,0.9);
    color: #fff;
  }

  .node-6 .intro, .node-208 .intro {
    color: #eab010;
  }

  /* ICE AGE ANIMALS */
  .cover.node-7 h1, .cover.node-209 h1 {
    background-color: rgba(55, 80, 54, 0.9);
    color: #fff;
  }

  .node-7 .intro, .node-209 .intro {
    color: #375036;
  }

  /* THE FIRST PEOPLE */
  .cover.node-8 h1, .cover.node-210 h1  {
    background-color: rgba(114, 20, 2, 0.9);
    color: #fff;
  }

  .node-8 .intro, .node-210 .intro {
    color: #721402;
  }


  /*******************************
      ANIMALS FEED
  ********************************/

  .classic-feed .yellow-content p {
    font-size: 85%;
    margin: 0 0 0.8em;
    line-height: 1.5em;
    padding-right: 2em;
  }

  .classic-feed .yellow-content h2 {
    font-family: 'Raleway', sans-serif;
    font-weight: 800;
    font-size: 150%;
    line-height: 1.1em;
    color: #fff;
    margin: 0.5em 0 1em 0;
    padding: 0;
    display: inline-block;
    text-transform: uppercase;
    text-decoration: none;
    border-bottom: 1px solid #fff;
  }

  .yellow-content .body-content a.moreanimal {
    margin: 2em 0;
    display:block;
  }


  /*******************************
       EVENTS PAGE / FEED
  ********************************/

  .mapbg .col.upcoming {
    padding: 2em 0;
  }

  .mapbg .col.upcoming h3 {
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    font-size: 70%;
    color: #fff;
    padding: 0 0 0.75em;
    margin: 0 0 0.5em;
    border-bottom: 1px solid #eab010;
  }

  .col.upcoming ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    font-weight: 400;
  }

  .col.upcoming .view-home-upcoming-events ul,
  .col.upcoming .view-events-upcoming-events ul {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
  }

  .col.upcoming .view-home-upcoming-events ul li>div,
  .col.upcoming .view-events-upcoming-events ul li>div {
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .col.upcoming ul li {
    font-size: 73%;
    margin: 0;
    padding: 0;
    clear: left;
  }

  .col.upcoming ul li a:link,
  .col.upcoming ul li a:visited {
    display: block;
    color: #fff;
    width: 100%;
    text-decoration: none;
    padding: 0.6em 0;
  }

  .col.upcoming ul li a:hover,
  .col.upcoming ul li a:active {
    color: #eab010;
  }

  .col.upcoming ul li span {
    display: block;
    line-height: 1;
  }

  .col.upcoming ul li span.icon-goto {
    float: left;
    color: #eab010;
    vertical-align: -0.3em;
  }

  .col.upcoming ul li span.date {
    float: left;
    margin-right: 1em;
    text-align: center;
    text-transform: uppercase;
  }

  .col.upcoming ul li .month {
    font-size: 75%;
  }

  .col.upcoming ul li .day {
    font-size: 80%;
  }

  .col.upcoming ul li .day {
    font-size: 130%;
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    padding-top: 0.1em;
  }

  .col.upcoming ul li span.title {
    text-transform: uppercase;
  }

  .col.upcoming ul li span.category {
    padding-top: 0.2em;
    font-size: 90%;
  }


  /*******************************
         SIDEBAR
  ********************************/

  .sidebar {
    padding: 2em 0;
    font-family: 'Raleway', sans-serif;
    font-weight: 400;
  }

  .sidebar .side-pad {
    padding: 0 15% 0 25%;
  }

  .sidebar h3 {
    color: #eab010;
    border-bottom: 1px solid #eab010;
    display: inline-block;
    font-size: 85%;
    font-weight: 800;
  }

  .sidebar ul {
    margin: 0 0 1em;
    padding: 0;
  }

  .sidebar ul li {
    list-style: none;
    font-size: 73%;
    text-transform: uppercase;
    padding: 0;
    margin: 0.75em 0;
  }

  .sidebar ul li a:link,
  .sidebar ul li a:visited {
    color: #252525;
    text-decoration: none;
  }

  .sidebar ul li a:hover,
  .sidebar ul li a:active {
    color: #eab010;
  }

  .sidebar a.icon-goto {
    text-decoration: none;
    font-size: 75%;
    line-height: 1;
  }

  .sidebar a.icon-goto:before {
    color: #eab010;
  }


  /*******************************
        MODAL
  ********************************/

  .ajax-grid-modal .wrap {
    width: 90%;
    padding: 2em 0;
  }

  .ajax-grid-modal .title {
    display: none;
  }

  .ajax-grid-modal .sidebar {
    padding: 1em 0 0;
  }

  .ajax-grid-modal .body-content {
    padding: 2em 0 0;
  }


  /*******************************
        FOOTER
  ********************************/

  footer .recommended {
    background: #505328;
    padding: 2em 0;
    background: transparent url(../images/bg-recommended.jpg) no-repeat 0 0;
    background-size: cover;
  }

  footer .recommended h2 {
    margin: 0 0 1em;
    text-transform: uppercase;
    color: #fff;
    border: none;
    font-size: 100%;
  }

  footer .recommended h2 span[class^="icon"] {
    font-size: 130%;
    padding-right: 0.25em;
  }

  footer .recommended .col {
    text-align: center;
    position: relative;
  }

  /* vertically align based on http://jsfiddle.net/hashem/46psk/ */
  footer .recommended .col .dummy {
    padding-top: 50%; /* forces 1:1 aspect ratio */
  }

  footer .recommended .col .img-container {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    text-align:center; /* Align center inline elements */
    font: 0/0 a;
  }

  footer .recommended .col .img-container:before {
    content: ' ';
    display: inline-block;
    vertical-align: middle;
    height: 100%;
  }

  footer .recommended .col .img-container img {
    vertical-align: middle;
    display: inline-block;
    width: 75%;
  }

  footer .yellowbar {
    background: transparent url(../images/bg-yellow-footer.jpg) no-repeat 0 0;
    background-size: cover;
    padding: 1.5em 1em .9em 1em;
  }

  footer .yellowbar h2.followus {
    width: 208px;
    height: 18px;
    display: inline-block;
    background: transparent url(../images/FollowUs.png) no-repeat bottom left;
    text-indent: -9999px;
    margin: 0 1em 0 0;
    border: none;
  }

  footer .yellowbar h2.suiveznous {
    width: 240px;
    height: 18px;
    display: inline-block;
    background: transparent url(../images/SuivezNous.png) no-repeat bottom left;
    text-indent: -9999px;
    margin: 0 1em 0 0;
    border: none;
  }

  footer .yellowbar p.social {
    display: inline-block;
    margin: 0;
    text-align: right;
    float: right;
    font-size: 115%;
    letter-spacing: .5em;
  }

  footer .sitemap .wrap:first-child {
    padding: 2em 0 1em;
  }

  footer .sitemap .wrap:last-child {
    padding: 1em 0 2em;
  }

  footer .sitemap .sitemap-pages {
    display: none;
  }

  footer .sitemap h2 {
    display: block;
    text-transform: uppercase;
    border: none;
    font-size: 90%;
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
  }

  footer .sitemap ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-family: 'Raleway', sans-serif;
  }

  footer .sitemap ul li {
    font-size: 75%;
    margin-bottom: .4em;
  }

  footer .sitemap ul li a {
    color: #fff;
    text-decoration: none;
  }

  footer .sitemap ul li a:hover {
    text-decoration: underline;
  }

  footer .contact h3 {
    color: #eab010;
    font-size: 85%;
  }

  footer .contact p {
    color: #fff;
    font-size: 85%;
    font-family: 'Raleway', sans-serif;
  }

  footer .contact p span.or {
    color: #eab010;
    padding: 0 .5em;
  }

  footer .contact p a {
    color: #fff;
    text-decoration: none;
  }

  footer .contact p a:hover {
    text-decoration: underline;
  }

  footer p.copyright, footer p.copyright-fr {
    text-transform: uppercase;
    font-size: 70%;
    color: #969594;
    padding-top: 2.5em;
    font-family: 'Raleway', sans-serif;
  }

  footer p.copyright-fr {
    font-size: 60%;
  }

  footer p.aas, footer p.aas-fr {
    text-align: right;
    text-transform: uppercase;
    font-size: 70%;
    color: #969594;
    padding-top: 2.45em;
    font-family: 'Raleway', sans-serif;
  }

  footer p.aas-fr {
    font-size: 48%;
  }


  footer p.aas img, footer p.aas-french img {
    vertical-align: -0.1em;
    padding-left: 0.3em;
  }

  /*******************************
         DID YOU KNOW
  ********************************/

  .didyouknow {
    float: right;
    background-color: #3d5876;
    background-image: url("../images/light-bulb.svg");
    background-repeat: no-repeat;
    background-position: 10px center;
    background-size: 100px 125px;
    color: #fff;
    font-family: "Raleway",sans-serif;
    font-size: .85em;
    font-weight: 500;
    width: 280px;
    padding: 5px 10px 15px 120px;
    margin: 5px 5px 5px 20px;
    border-radius: 25px 0 0 25px;
  }

  .didyouknow h5 {
    font-size: 1.1em;
    font-weight: 400;
    margin: 15px 0 10px;
  }

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

  /*******************************
         SPECIAL
  ********************************/
  .nowrap {
    white-space: nowrap;
  }
@media only screen and (min-width: 600px) {

	
	body {
		background: #fff;
		font-size: 105%;
	}
	body:after { content: 'medium'; }

	


	/*******************************
			BASIC TEXT STYLES
	********************************/

		h1 { font-size: 240%; }


	
	/*******************************
			LAYOUT BLOCKS
	********************************/

		#viewport { margin-top: 71px; }



	/*******************************
				COLUMNS
	********************************/
	
		.col {
			clear: none;
			float: left;
			margin: 0 1%;
		}

			.col.right { float: right; }
			
			.col.quarter,
			.col.half				{ width: 48%; }

			.col.third,
			.col.third.pairs,
			.col.fifth,
			.col.sixth				{ width: 31.33333333333333%; }
							
			.col.two-thirds,
			.col.five-sixths		{ width: 64.66666666666666%; }
						

			.fullwidth .col.quarter,
			.fullwidth .col.half,
			.col.quarter.gutterless,
			.col.half.gutterless { width: 50%; }

			.fullwidth .col.third,
			.fullwidth .col.third.pairs,
			.col.third.gutterless,
			.col.third.pairs.gutterless { width: 33.33333333333333%; }
			

			/*
			.col.third:nth-child(3n+4)			{ clear: left; }
			
			.col.third.pairs:nth-child(2n+3)	{ clear: none; }
			*/			
			
			


	
	
	/*******************************
				HEADER
	********************************/			
		
		header#title {
			width: 100%;
			height: auto;
			background: transparent;
		}
		
			header#title a.logo {
				float: left;
				margin: 0;
				padding: 0.65em 0 0;
				width: auto;
				max-width: 140px;
				position: fixed;
				z-index: 300;
			}
			
			header#title a.menu { display: none; }

		
		header#nav {
			position: fixed;
			width: 100%;
			background: #252525;
			z-index: 200;
		}
		


	
	
	
	/*******************************
			 NAV
	********************************/
		
		div#menu-viewport {
			position: relative;
			font-size: 90%;
			width: auto;
			top: 0;
			overflow: visible;
			-webkit-font-smoothing: subpixel-antialiased;
		}
		

		header#nav nav {
			float: right;
			clear: right;
			position: relative;
		}

			header#nav ul { margin: 0; }

				header#nav li li { margin: 0; }
			
				header#nav li a:link,
				header#nav li a:visited {
					padding: 0.2em 0.5em;
					width: auto;
				}								
	
				header#nav li a:hover,
				header#nav li a:active,
				header#nav li.selected a {						
					color: #fff;
				}						


			
			/*	Nav Main	*/
			
			header#nav #main { margin-top: 2.5em; }
						
				header#nav #main div.content>ul>li {
					position: relative;
					float: left;
					font-weight: 800;
					letter-spacing: 0.03em;
				}
					
					header#nav #main div.content>ul>li>a { padding: 0.6em 0; }
										
					header#nav #main div.content>ul>li>a span {
						border-left: 1px solid #f8ac46;
						line-height: 1em;
						padding: 0 0.8em;
						display: block;
					}
					header#nav #main div.content>ul>li.first>a span { border-left: none; }
					
					
					header#nav #main ul li a:hover,
					header#nav #main ul li.active-trail a{
						color: #eab010;
					}					
					
					/*
					header#nav #main div.content>ul>li:hover:after,
					header#nav #main div.content>ul>li.active-trail:after
					*/
					header#nav #main div.content>ul>li.menu-313:hover:after,
					header#nav #main div.content>ul>li.menu-315:hover:after,
					header#nav #main div.content>ul>li.menu-316:hover:after, 
					header#nav #main div.content>ul>li.menu-1295:hover:after,
					header#nav #main div.content>ul>li.menu-1301:hover:after,
					header#nav #main div.content>ul>li.menu-1307:hover:after {
						display: block;
						position: absolute;
						bottom: 0;
						left: 50%;
						margin-left: -0.5em;
						font-size: 70%;
						color: #eab010;
						/* Icomoon icon implementation =========== */
						content: "\e606";
						font-family: 'icomoon';
						speak: none;
						line-height: 1;
						-webkit-font-smoothing: antialiased;
						-moz-osx-font-smoothing: grayscale;
					}
					/*header#nav #main ul li.expanded:hover:after { bottom: -1px; }*/
					
					header#nav #main ul ul { display: none; }
					
					header#nav #main ul li:hover ul {
						display: block;
						position: absolute;
						margin: 0;
						background: #eab010;
						width: 9em;
					}
					header#nav #main ul li.menu-313:hover ul { width: 13em; }
					header#nav #main ul li.menu-315:hover ul { width: 10.5em; }
					header#nav #main ul li.menu-1295:hover ul { width: 13em; }
					header#nav #main ul li.menu-1301:hover ul { width: 10.5em; }
					header#nav #main ul li.last:hover ul { width: 13.5em; right: 0; }
					
						header#nav #main li li {
							font-size: 80%;
							font-weight: 400;
							line-height: 1em;
						}
			
							header#nav #main li li a:link,
							header#nav #main li li a:visited {
								color: #252525;
								padding: 0.6em 1em;
							}
							header#nav #main li li a:hover,
							header#nav #main li li a:active {
								color: #fff;
								background: #252525;
							}



			/*	Nav Secondary	*/
			
			header#nav #secondary {
				position: absolute;
				top: 1em;
				right: 0.5em;
				font-size: 70%;
			}
			
				header#nav #secondary>ul>li { float: left; }
				
				header#nav #secondary ul li a:hover,
				header#nav #secondary ul li a:active { color: #f8ac46; }
			
				header#nav #secondary ul li a span[class^=icon] { font-size: 120%; }

	



	/*******************************
			SLIDESHOW
	********************************/			

		.region-slideshow .views-slideshow-controls-top { width: 118%; }
			.region-slideshow .views-slideshow-controls-top span { font-size: 90%; }
				.region-slideshow .views-slideshow-controls-top span a:before { color: #fff; }
		
		#home-slideshow .region-slideshow .views-slideshow-controls-top span { font-size: 325%; }





	/*******************************
			CLASSIC FEED
	********************************/			
				
		.classic-feed .col.quarter a.tile {
			padding: 0 0 4.4em;
			overflow: hidden;
		}
		
		.classic-feed .col.quarter .info a { height: auto; }
	
		.classic-feed .col.quarter figure {
			display: block;
			width: 100%;
			padding: 69% 0 0;
			background-position: 50% 50%;
			background-repeat: no-repeat;
			background-size: cover;
		}
	
		.classic-feed .col.quarter .summary,
		.classic-feed .col.quarter .past {
			position: absolute;
			top: 0;
			right: 0;
			left: 0;
			height: 100%;
			padding: 1.5em 1em 0;
			background: rgba(234,176,16,0.9);
			color: #fff;			
		}
		.classic-feed .col.quarter .past { display: block; background: rgba(0,0,0,0.6); }
		.classic-feed .col.quarter:hover .summary { display: block; }
		.classic-feed .col.quarter:hover .past { display: none; }
		
		.classic-feed .col.quarter .summary p,
		.classic-feed .col.quarter .past p { font-size: inherit; }
		
		.classic-feed .col.quarter .summary p.icon-goto {
			font-family: 'Raleway', sans-serif;
			text-transform: uppercase;
			font-weight: 500;
			font-size: 90%;
		}
		.classic-feed .col.quarter .summary p.icon-goto.center,
		.classic-feed .col.quarter .past p {
			font-size: 110%;
			text-align: center;
			margin-top: 25%;
		}
		.classic-feed .col.quarter .past p { color: #eab010; }
		

		.classic-feed .col.quarter .banner {
			position: absolute;
			bottom: 0;
			width: 100%;
			min-height: 2.4em;
		}
		
		
		/*	Some font-size fine-tuning to play nice with responsive	*/
		.classic-feed .col.quarter a.tile { font-size: 90%; }
		.classic-feed .col.quarter .summary,
		.classic-feed .col.quarter .past { font-size: 2.3vw; }
		@media only screen and (min-width: 800px) {
			.classic-feed .col.quarter a.tile {	font-size: 100%; }
			.classic-feed .col.quarter .summary,
			.classic-feed .col.quarter .past { font-size: 2.1vw; }
		}
	
	
	

	/*******************************
			HOME CLASSIC FEED
	********************************/	
	
	.classic-feed .region-home-feed .info {			
		padding: 15px 0 !important;
		height: 190px;
		overflow-y: visible;
		overflow-x: hidden;	
	}


	/*******************************
				SUB-MENU
	********************************/		

		#submenu {
			-webkit-font-smoothing: antialiased;
		}
		#submenu.fixed {
			position: fixed;
			top: 73px;
		}
		#submenu.fixed.limited {
			position: absolute;
			top: auto;
			bottom: 0;
		}



	/*******************************
				MODAL
	********************************/

		.ajax-grid-modal .wrap {
			width: 95%;
			padding: 2em 0;
		}
		
		.ajax-grid-modal .col { margin: 0 1% !important; }
		.ajax-grid-modal .col.third { width: 31.33333333333333%; }
		.ajax-grid-modal .col.two-thirds { width: 64.66666666666666%; }

		.ajax-grid-modal .title { display: block; }
		.ajax-grid-modal .sidebar,
		.ajax-grid-modal .body-content { padding: 0; }


	/*******************************
				FOOTER
	********************************/	

	footer .recommended h2 { margin: 0 0 2em; }
		footer .recommended .col .dummy { padding-top: 35%; }
			footer .recommended .col .img-container img { width: 50%; }
		
	footer .contact h3 {
		display: inline-block;
		margin-right: 1em;
	}
	footer .contact p {
		display: inline-block;
	}
	
	footer .sitemap .sitemap-pages { display: block; }




}
@media only screen and (min-width: 1020px) {


	body {
		font-size: 110%;
	}
	body:after { content: 'large'; }
		



	/*******************************
			BASIC TEXT STYLES
	********************************/

		h1 { font-size: 320%; }
	
		
		

	/*******************************
			LAYOUT BLOCKS
	********************************/
	
		#viewport { margin-top: 72px; }

		

	/*******************************
				COLUMNS
	********************************/
		
		.col.fifth				{ width: 18%; }
		
		.col.sixth				{ width: 14.66666666666667%; }
		.col.five-sixths		{ width: 81.33333333333335% }
		
		.col.two-thirds .col.sixth,
		.col.quarter			{ width: 23%; }
		
		.fullwidth .col.quarter,
		.col.quarter.gutterless	{ width: 25%; }





	/*******************************
				HEADER
	********************************/
	
		header#title a.logo {
			padding: 0.5em 0 0;
			max-width: 166px;
		}
		
	
	
	/*******************************
				MAIN NAV
	********************************/

		nav#main div.content {
			font-size: 95%;
		}
	
		
		

	/*******************************
			HOME SLIDESHOW
	********************************/			
	
		/*.region-slideshow .views-slideshow-controls-top span { font-size: 300%; }*/
		#home-slideshow .region-slideshow .views-slideshow-controls-top span { font-size: 450%; }




	/*******************************
			CLASSIC FEED
	********************************/			

		.classic-feed .col.quarter .info h2.icon-waypoint a { display: inline; }
/*
		.classic-feed .col.quarter .summary,
		.classic-feed .col.quarter .past { font-size: 1.1vw; }
*/
		/*	Some font-size fine-tuning to play nice with responsive	*/
		.classic-feed .col.quarter a.tile { font-size: 90%; }
		.classic-feed .col.quarter .summary,
		.classic-feed .col.quarter .past { font-size: 1.2vw; line-height: 1.3em; padding-top: 1em; }
		@media only screen and (min-width: 1300px) {
			.classic-feed .col.quarter a.tile {	font-size: 100%; }
			.classic-feed .col.quarter .summary,
			.classic-feed .col.quarter .past { font-size: 1.1vw; line-height: 1.6em; padding-top: 1.5em; }
		}

				
	/*******************************
			HOME CLASSIC FEED
	********************************/	
	
	.classic-feed .region-home-feed .col.quarter a.tile {  height: 365px; padding: 0; }
	.classic-feed .region-home-feed .col.quarter figure { height: 285px; padding: 0; }
	.classic-feed .region-home-feed .col.quarter .summary { height: 345px; padding-top: 20px; }

	.classic-feed .region-home-feed .info {			
		padding: 20px 0 !important;
		height: 325px;
	}



	/*******************************
				CONTENT
	********************************/	
	
		.cover.mapbg h1 { margin-left: 1.4em; }
		.cover.mapbg .wrap.img-mapbg { width: 95%; }
		.cover.mapbg .wrap.img-mapbg .col.single { margin: 0 1%; }



	/*******************************
				FOOTER
	********************************/	
	
	footer .recommended h2 { margin: 0.5em 0 2em; }
		footer .recommended .col .dummy { padding-top: 50%; }
			footer .recommended .col .img-container img { width: auto; }

	
}