/* --------------------------------

Primary style

-------------------------------- */
*, *::after, *::before {
  box-sizing: border-box;
}

h1,h2,h3,h4 {
  font-family: "lexia",serif;
}

h5,h6,p,body{
  font-family: "fira-sans",sans-serif;
}

html {
  font-size: 62.5%;
}

body {
  font-size: 16px;
  font-size: 1.6rem;
  color: #83b0b9;
  background-color: #343943;
}

h2 {
  color: #E2231A;
  font-size: 34px;
  font-size: 3vw;
  margin: 0 auto 25px;
  margin: 0 auto 2vw;
}

a {
  color: #d35657;
  text-decoration: none;
}

blockquote {
  font-family: 'kepler-std';
  color: #00833C;
  font-size: 32px;
  font-size: 2.5vw;
  margin: 0 auto 25px;
  margin: 0 auto 2vw;
  line-height: 45px;
  line-height: 3.5vw;
  text-align: center;
  font-style: italic;
}

blockquote .attr {
  font-size: 1.85vw;
}

blockquote::before {
    content: url('/sites/default/files/sinclair_dino_sm.png');
    display: block;
    text-align: center;
}

.container ul,
.container ol{
  padding-left: 40px;
  list-style-type: disc;
  font-size: 20px;
  font-size: 1.5vw;
  margin: 0 auto 20px;
  margin: 0 auto 1.5vw;
  line-height: 1.6;
  color: #777;
}

.container ol {
  list-style-type: decimal;
}

.container ul li {

}

.pull-left {
  float: left;
}

.pull-right {
  float: right;
}

.responsive-img {
  width: 100%;
  height: auto;
  max-width: 100%;
}

.clearfix:before,
.clearfix:after {
    display: table;
    content: " ";
}

.clearfix:after {
    clear: both;
}

.center {
  margin: 0 auto;
  text-align: center;
}

.p10 {
  padding:10px 0px;
}

.p20l {
  padding-left: 20px;
}

.p20r {
  padding-right: 20px;
}

.p40r {
  padding-right: 40px;
}

.m20b{
	margin-bottom:20px;
}

.m40r {
  margin-right: 40px;
}

.img50{
	width:50%;
	height:auto;
}

strong {
  font-weight: 900;
}

.ie_image,
.mobile-title h1 {
  display: none;
}

/* --------------------------------

Navigation

-------------------------------- */
.cd-side-navigation {
  position: fixed;
  z-index: 3;
  top: 0;
  left: 0;
  height: 100vh;
  width: 74px;
  overflow: hidden;
}
.cd-side-navigation::before {
  /* background color of the side navigation */
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: -webkit-calc(100% - 4px);
  width: calc(100% - 4px);
  background-color: #131519;
}
.cd-side-navigation ul {
  height: 100%;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.cd-side-navigation li {
  width: 90px;
  width: -webkit-calc(100% - 4px);
  width: calc(100% - 4px);
}

.cd-side-navigation a {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: center;
  -ms-flex-align:center;
  align-items: center;
  position: relative;
  justify-content: center;
  font-size: 12px;
  font-size: 1.2rem;
  text-align: center;
  color: #4a5261;
  height: 80px;
  height: 8.333vh;
  -webkit-transition: background-color 0.2s, color 0.2s;
  -moz-transition: background-color 0.2s, color 0.2s;
  transition: background-color 0.2s, color 0.2s;
}

.cd-side-navigation a svg {
  /* this is the icon */
  position: absolute;
  left: 50%;
  right: auto;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  top: 1.3em;
}
.cd-side-navigation a svg * {
  -webkit-transition: stroke 0.2s;
  -moz-transition: stroke 0.2s;
  transition: stroke 0.2s;
}
.cd-side-navigation a::after {
  /* 4px line to the right of the item - visible on hover */
  content: '';
  position: absolute;
  top: 0;
  right: -4px;
  height: 100%;
  width: 4px;
  background-color: #00833E;
  opacity: 0;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  transition: opacity 0.2s;
  pointer-events: none;
}
.no-touch .cd-side-navigation a:hover {
  background-color: #08090b;
}
.no-touch .cd-side-navigation a:hover::after {
  opacity: 1;
}
.cd-side-navigation a.selected, .no-touch .cd-side-navigation a.selected:hover {
  background-color: #ffffff;
  color: #00833E;
}
.cd-side-navigation a.selected > svg *, .no-touch .cd-side-navigation a.selected:hover > svg * {
  stroke: #00833E;
}

.cd-side-navigation li:nth-of-type(2) a::after {
  background-color: #00833E;
}
.cd-side-navigation li:nth-of-type(3) a::after {
  background-color: #00833E;
}
.cd-side-navigation li:nth-of-type(4) a::after {
  background-color: #00833E;
}
@media only screen and (min-width: 480px) {
  .cd-side-navigation {
    width: 94px;
  }
  .cd-side-navigation a {
    font-size: 20px;
    font-size: 2.0rem;
    font-weight: bold;
}
  }
  .cd-side-navigation a svg {
    top: 1.6em;
  }
}

/* --------------------------------

 Main Content

-------------------------------- */
.cd-main {
  height: 100vh;
  overflow: hidden;
}

.cd-section {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  overflow-y: auto;
  padding-left: 70px;
  /* Force Hardware Acceleration */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -o-transform: translateX(-100%);
  transform: translateX(-100%);
  -webkit-transition: -webkit-transform 0s 0.5s;
  -moz-transition: -moz-transform 0s 0.5s;
  transition: transform 0s 0.5s;
}
.cd-section.overflow-hidden {
  /* this class is used to hide the scrolling bar while a new section is entering the viewport */
  overflow: hidden;
}
.cd-section header {
  position: relative;
  height: auto;
  width: 100%;
  overflow: hidden;
}

.cd-section .y2010_header {
  background: #009448;
}

.cd-section header svg{
  width: 100%;
  height: 100%;
  margin-bottom: -3px;
}

.cd-section .cd-scroll {
  /* this is the arrow at the bottom of the header */
  display: block;
  position: absolute;
  bottom: 60px;
  left: -webkit-calc(50vw - (74px - 4px)/2);
  left: calc(50vw - (74px - 4px)/2);
  width: 44px;
  height: 44px;
  /* image replacement */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  visibility: hidden;
  -webkit-transition: -webkit-transform 0s 0.5s, visibility 0s 0.5s;
  -moz-transition: -moz-transform 0s 0.5s, visibility 0s 0.5s;
  transition: transform 0s 0.5s, visibility 0s 0.5s;
  -webkit-transform: translateX(-50%) scale(0);
  -moz-transform: translateX(-50%) scale(0);
  -ms-transform: translateX(-50%) scale(0);
  -o-transform: translateX(-50%) scale(0);
  transform: translateX(-50%) scale(0);
  background: url("../img/cd-icon-arrow.svg") no-repeat center center;
}
.cd-section.visible {
  /* this is the visible/selected section */
  position: relative;
  z-index: 2;
  -webkit-overflow-scrolling: touch;
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
  -webkit-transition: -webkit-transform 0.5s 0s;
  -moz-transition: -moz-transform 0.5s 0s;
  transition: transform 0.5s 0s;
  box-shadow: 1px 1px 5px #00833E;
}
.cd-section.visible .cd-scroll {
  visibility: visible;
  -webkit-transform: translateX(-50%) scale(1);
  -moz-transform: translateX(-50%) scale(1);
  -ms-transform: translateX(-50%) scale(1);
  -o-transform: translateX(-50%) scale(1);
  transform: translateX(-50%) scale(1);
  -webkit-transition: -webkit-transform 0.3s 0.5s, visibility 0s 0s;
  -moz-transition: -moz-transform 0.3s 0.5s, visibility 0s 0s;
  transition: transform 0.3s 0.5s, visibility 0s 0s;
  -webkit-animation: cd-scroll-down 1.2s 0.9s;
  -moz-animation: cd-scroll-down 1.2s 0.9s;
  animation: cd-scroll-down 1.2s 0.9s;
  -webkit-animation-iteration-count: 2;
  -moz-animation-iteration-count: 2;
  animation-iteration-count: 2;
}
@media only screen and (min-width: 480px) {
  .cd-section {
    padding-left: 90px;
  }
  .cd-section .cd-scroll {
    left: -webkit-calc(50vw - (94px - 4px)/2);
    left: calc(50vw - (94px - 4px)/2);
  }
}

@-webkit-keyframes cd-scroll-down {
  0% {
    -webkit-transform: translateX(-50%) scale(1);
  }
  50% {
    -webkit-transform: translateY(10px) translateX(-50%) scale(1);
  }
  100% {
    -webkit-transform: translateX(-50%) scale(1);
  }
}
@-moz-keyframes cd-scroll-down {
  0% {
    -moz-transform: translateX(-50%) scale(1);
  }
  50% {
    -moz-transform: translateY(10px) translateX(-50%) scale(1);
  }
  100% {
    -moz-transform: translateX(-50%) scale(1);
  }
}
@keyframes cd-scroll-down {
  0% {
    -webkit-transform: translateX(-50%) scale(1);
    -moz-transform: translateX(-50%) scale(1);
    -ms-transform: translateX(-50%) scale(1);
    -o-transform: translateX(-50%) scale(1);
    transform: translateX(-50%) scale(1);
  }
  50% {
    -webkit-transform: translateY(10px) translateX(-50%) scale(1);
    -moz-transform: translateY(10px) translateX(-50%) scale(1);
    -ms-transform: translateY(10px) translateX(-50%) scale(1);
    -o-transform: translateY(10px) translateX(-50%) scale(1);
    transform: translateY(10px) translateX(-50%) scale(1);
  }
  100% {
    -webkit-transform: translateX(-50%) scale(1);
    -moz-transform: translateX(-50%) scale(1);
    -ms-transform: translateX(-50%) scale(1);
    -o-transform: translateX(-50%) scale(1);
    transform: translateX(-50%) scale(1);
  }
}
.cd-title {
  position: absolute;
  bottom: 0;
  right: 20%;
  /* this prevents title from jumping when the section scroll bar is visible */
  width: auto;
  padding: 0;
  color: #ffffff;
  text-align: center;
  /* Force Hardware Acceleration */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  opacity: 0;
 /* -webkit-transform: translateY(-50%) translateX(-80px);
  -moz-transform: translateY(-50%) translateX(-80px);
  -ms-transform: translateY(-50%) translateX(-80px);
  -o-transform: translateY(-50%) translateX(-80px);
  transform: translateY(-50%) translateX(-80px);
  -webkit-transition: -webkit-transform 0s 0.5s, opacity 0s 0.5s;
  -moz-transition: -moz-transform 0s 0.5s, opacity 0s 0.5s;
  transition: transform 0s 0.5s, opacity 0s 0.5s;*/
}
.cd-title h1 {
  font-size: 10vmax;
  line-height: 7.5vw;
}

.visible .cd-title {
  opacity: 1;
  /*-webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transition: -webkit-transform 0.4s 0.3s, opacity 0.4s 0.3s;
  -moz-transition: -moz-transform 0.4s 0.3s, opacity 0.4s 0.3s;
  transition: transform 0.4s 0.3s, opacity 0.4s 0.3s;*/
}
@media only screen and (min-width: 768px) {
  .cd-title h2 {
    font-size: 50px;
    font-size: 5rem;
  }
}

.cd-content {
  padding: 2em 0;
  background-color: #fff;
}
.container {
  width: 80%;
  margin: 0 auto;
}

p{
  margin: 0 auto 20px;
  margin: 0 auto 1.5vw;
  line-height: 1.6;
  color: #777;
}
@media only screen and (min-width: 768px) {
  .cd-content {
    padding: 4em 0 0;
    overflow: hidden;
  }
  .cd-content p {
    font-size: 20px;
    font-size: 1.5vw;
  }
}

/* --------------------------------

 Loading Bar

-------------------------------- */
#cd-loading-bar {
  position: fixed;
  z-index: 2;
  left: 70px;
  width: 4px;
  visibility: hidden;
  /* Force Hardware Acceleration */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
}
#cd-loading-bar {
  background-color: #00833E;
}

#cd-loading-bar.loading {
  visibility: visible;
}
@media only screen and (min-width: 480px) {
  #cd-loading-bar {
    left: 90px;
  }
}

/* --------------------------------

Header Animations

-------------------------------- */

@keyframes slide {
  0% {
    transform:translate(0px,0px);
  }
  50% {
   transform:translate(0px,-200px);
  }
  100% {
   transform:translate(0px,0px);
  }
}

@-webkit-keyframes rotating /* Safari and Chrome */ {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-webkit-keyframes fill_change {
    0%     {fill:#f00;}
    50%     {fill:#00f;}
    100%  {fill:#f00;}
}

@keyframes slant_up {
  0%{
      left: -281px;
      bottom: 507px;
  }
  50%{
      left: -381px;
      bottom: 407px;
  }
  100%{
      left: -281px;
      bottom: 507px;
  }

}

@keyframes slant_down {

  0%{
      left: -281px;
      bottom: 507px;
  }
  50%{
      left: -181px;
      bottom: 607px;
  }
  100%{
      left: -281px;
      bottom: 507px;
  }

}

@keyframes square_shift_tl {
  0%{
      background-position: top left;
  }
  6%{
      background-position: top left;
  }
  22%{
      background-position: top right;
  }
  28%{
      background-position: top right;
  }
  47%{
      background-position: bottom right;
  }
  53%{
      background-position: bottom right;
  }
  72%{
      background-position: bottom left;
  }
  78%{
      background-position: bottom left;
  }
  94%{
      background-position: top left;
  }
  100%{
      background-position: top left;
  }
}

@keyframes square_shift_tr {
  0%{
      background-position: top right;
  }
  10%{
      background-position: top right;
  }
  15%{
      background-position: top left;
  }
  22%{
      background-position: top left;
  }
  35%{
      background-position: bottom left;
  }
  45%{
      background-position: bottom left;
  }
  77%{
      background-position: bottom right
  }
  84%{
      background-position: bottom right
  }
  96%{
      background-position: top right
  }
  100%{
      background-position: top right
  }
}

@keyframes square_shift_br {
  0%{
      background-position: bottom right;
  }
  4%{
      background-position: bottom right;
  }
  26%{
      background-position: bottom left;
  }
  28%{
      background-position: bottom left;
  }
  40%{
      background-position: top left;
  }
  47%{
      background-position: top left;
  }
  68%{
      background-position: top right;
  }
  73%{
      background-position: top right;
  }
  90%{
      background-position: bottom right;
  }
  100%{
      background-position: bottom right;
  }
}

@keyframes square_shift_bl {
  0%{
      background-position: bottom left;
  }
  8%{
      background-position: bottom left;
  }
  28%{
      ;background-position: bottom right
  }
  33%{
      ;background-position: bottom right
  }
  50%{
      background-position: top right;
  }
  59%{
      background-position: top right;
  }
  76%{
      ;background-position: top left
  }
  82%{
      ;background-position: top left
  }
  95%{
      background-position: bottom left;
  }
  100%{
      background-position: bottom left;
  }
}

@keyframes orange {
  0%{
    fill:#F9A737;
  }
  50%{
    fill:#8AB3B2;
  }
  100%{
    fill:#F9A737;
  }
}

@keyframes pink {
  0%{
    fill:#F6597A;
  }
  50%{
    fill:#C9C007;
  }
  100%{
    fill:#F6597A;
  }
}

@keyframes yellow_green {
  0%{
    fill:#C9C007;
  }
  50%{
    fill:#C126B8;
  }
  100%{
    fill:#C9C007;
  }
}

@keyframes purple {
  0%{
    fill:#C126B8;
  }
  50%{
    fill:#FFFFFF;
  }
  100%{
    fill:#C126B8;
  }
}

@keyframes teal {
  0%{
    fill:#8AB3B2;
  }
  50%{
    fill:#F6597A;
  }
  100%{
    fill:#8AB3B2;
  }
}

@keyframes white {
  0%{
    background: #fff;
  }
  50%{
     background: #C126B8;
  }
  100%{
     background: #fff;
  }
}

@keyframes wobble1 {
  0%{
    transform:translate(-5px,5px);
  }
  13%{
    transform:translate(0px,10px);
  }
  26%{
     transform:translate(5px,5px);
  }
  40%{
    transform:translate(10px,0px);
  }
  53%{
     transform:translate(5px,-5px);
  }
  66%{
    transform:translate(0px,-10px);
  }
  80%{
     transform:translate(-5px,-5px);
  }
  93%{
    transform:translate(-10px,0px);
  }
  100%{
     transform:translate(-5px,5px);
  }
}

@keyframes wobble2 {
  0%{
    transform:translate(-5px,5px);
  }
  13%{
    transform:translate(-10px,0px);
  }
  26%{
     transform:translate(-5px,-5px);
  }
  40%{
    transform:translate(0px,-10px);
  }
  53%{
     transform:translate(5px,-5px);
  }
  66%{
    transform:translate(10px,0px);
  }
  80%{
     transform:translate(5px,5px);
  }
  93%{
    transform:translate(0px,10px);
  }
  100%{
     transform:translate(-5px,5px);
  }
}

@keyframes wobble3 {
  0%{
    transform:translate(5px,5px);
  }
  13%{
    transform:translate(0px,10px);
  }
  26%{
     transform:translate(-5px,5px);
  }
  40%{
    transform:translate(-10px,0px);
  }
  53%{
     transform:translate(-5px,-5px);
  }
  66%{
    transform:translate(0px,-10px);
  }
  80%{
     transform:translate(5px,-5px);
  }
  93%{
    transform:translate(10px,0px);
  }
  100%{
     transform:translate(5px,5px);
  }
}

@keyframes wobble4 {
  0%{
    transform:translate(3px,3px);
  }
  13%{
    transform:translate(0px,6px);
  }
  26%{
     transform:translate(-3px,3px);
  }
  40%{
    transform:translate(-6px,0px);
  }
  53%{
     transform:translate(-3px,-3px);
  }
  66%{
    transform:translate(0px,-6px);
  }
  80%{
     transform:translate(3px,-3px);
  }
  93%{
    transform:translate(6px,0px);
  }
  100%{
     transform:translate(3px,3px);
  }
}

@keyframes wobble5 {
  0%{
    transform:translate(-2px,2px);
  }
  13%{
    transform:translate(-4px,0px);
  }
  26%{
     transform:translate(-2px,-2px);
  }
  40%{
    transform:translate(0px,-4px);
  }
  53%{
     transform:translate(2px,-2px);
  }
  66%{
    transform:translate(4px,0px);
  }
  80%{
     transform:translate(2px,2px);
  }
  93%{
    transform:translate(0px,4px);
  }
  100%{
     transform:translate(-2px,2px);
  }
}

@keyframes wobble6 {
  0%{
    transform:translate(-4px,4px);
  }
  13%{
    transform:translate(0px,8px);
  }
  26%{
     transform:translate(4px,4px);
  }
  40%{
    transform:translate(8px,0px);
  }
  53%{
     transform:translate(4px,-4px);
  }
  66%{
    transform:translate(0px,-8px);
  }
  80%{
     transform:translate(-4px,-4px);
  }
  93%{
    transform:translate(-8px,0px);
  }
  100%{
     transform:translate(-4px,4px);
  }
}

@keyframes hex_red {
  0%{
    fill:#FF2F00;
  }
  25%{
    fill:#FF8700;
  }
  50%{
    fill:#FDCF00;
  }
  75%{
    fill:#FF8700;
  }
  100%{
     fill:#FF2F00;
  }
}

@keyframes hex_orange {
  0%{
    fill:#FF8700;
  }
  25%{
    fill:#FDCF00;
  }
  50%{
    fill:#FF2F00;
  }
  75%{
    fill:#FDCF00;
  }
  100%{
     fill:#FF8700;
  }
}

@keyframes hex_yellow {
  0%{
    fill:#FDCF00;
  }
  25%{
    fill:#FF8700;
  }
  50%{
    fill:#FF2F00;
  }
  75%{
    fill:#FF8700;
  }
  100%{
     fill:#FDCF00;
  }
}

@keyframes hex_yellow_bg {
  0%{
    background:#FDCF00;
  }
  25%{
    background:#FF8700;
  }
  50%{
    background:#FF2F00;
  }
  75%{
    background:#FF8700;
  }
  100%{
     background:#FDCF00;
  }
}

@keyframes moving_gradient {
  0%{
    background-position: 0px, 0px;
  }
  100%{
    background-position: 1676px, 0px;
  }
}

@keyframes wiggle_1 {
  0%{
    transform: translate(0px, 0px);
  }
  25%{
    transform: translate(1px, 0px);
  }
  50%{
    transform: translate(0px, 0px);
  }
  75%{
    transform: translate(-1px, 0px);
  }
  100%{
    transform: translate(0px, 0px);
  }
}

@keyframes wiggle_2 {
  0%{
    transform: translate(0px, 0px);
  }
  25%{
    transform: translate(0px, 1px);
  }
  50%{
    transform: translate(0px, 0px);
  }
  75%{
    transform: translate(0px, -1px);
  }
  100%{
    transform: translate(0px, 0px);
  }
}

@keyframes wiggle_3 {
  0%{
    transform: translate(0px, 0px);
  }
  25%{
    transform: translate(0px, -1px);
  }
  50%{
    transform: translate(0px, 0px);
  }
  75%{
    transform: translate(0px, 1px);
  }
  100%{
    transform: translate(0px, 0px);
  }
}

@keyframes wiggle_4 {
  0%{
    transform: translate(0px, 0px);
  }
  25%{
    transform: translate(-1px, 0px);
  }
  50%{
    transform: translate(0px, 0px);
  }
  75%{
    transform: translate(1px, 0px);
  }
  100%{
    transform: translate(0px, 0px);
  }
}


.animated_background{
  position: absolute;
  z-index: -1;
  top: 0px;
  width: 100%;
}

/*.y1910 path{
  animation: fill_change 20s linear infinite;
}*/
.y1900{
  background: #fff;
}

.y1900 svg{
  animation: slide 20s linear infinite;
}

.y1910{
  -webkit-animation: rotating 30s linear infinite;
  -moz-animation: rotating 30s linear infinite;
  -ms-animation: rotating 30s linear infinite;
  -o-animation: rotating 30s linear infinite;
  animation: rotating 30s linear infinite;
  width: 70%;
  top: -30%;
}

.y1920{
  background: #333;
}

.y1920 .bg_slice{
  position: relative;
  left: -281px;
  bottom: 507px;
  float: left;
  transform: rotate(45deg);
  margin-right: 25px;
}

.bg_slice.even{
  animation: slant_up 20s linear infinite;
}

.bg_slice.odd{
  animation: slant_down 20s linear infinite;
}

.y1930{
  background: #652718;
}

.y1930 .bg_slice{
  float: left;
  height: 113px;
  width: 113px;
  background: url('../img/1930s-bg.png') no-repeat top left;
  overflow: hidden;
  margin: 1px;
}

.y1930 .bg_slice.shift_top_left{
  background-position: top left;
  animation: square_shift_tl 8s linear infinite;
}

.y1930 .bg_slice.shift_top_right{
  background-position: top right;
  animation: square_shift_tr 11s linear infinite;
}

.y1930 .bg_slice.shift_bottom_left{
  background-position: bottom left;
  animation: square_shift_bl 13s linear infinite;
}

.y1930 .bg_slice.shift_bottom_right{
  background-position: bottom right;
  animation: square_shift_br 9s linear infinite;
}

.y1940{
  background: #FCCE00;
  animation: hex_yellow_bg 5s linear infinite;
}

.y1940 .hex_red{
  animation: hex_red 5s linear infinite;
}

.y1940 .hex_orange{
  animation: hex_orange 5s linear infinite;
}

.y1940 .hex_yellow{
  animation: hex_yellow 5s linear infinite;
}

.y1950{
  background: #DEDECB;
}

.y1950 svg > g{
  position: relative;
  animation: rotating 10s linear infinite;
  transform-origin: 50% 50%;
}

.y1960{
  background: #adc068;
}

.y1960 .wobble1{
  animation: wobble1 7s linear infinite;
}

.y1960 .wobble2{
  animation: wobble2 4s linear infinite;
}

.y1960 .wobble3{
  animation: wobble3 5s linear infinite;
}

.y1960 .wobble4{
  animation: wobble4 8s linear infinite;
}

.y1960 .wobble5{
  animation: wobble5 3s linear infinite;
}

.y1960 .wobble6{
  animation: wobble6 4s linear infinite;
}

.y1960 .wobble7{
  animation: wobble5 9s linear infinite;
}

.y1960 .wobble8{
  animation: wobble1 4s linear infinite;
}

.y1960 .wobble9{
  animation: wobble2 6s linear infinite;
}

.y1970{
  background: #fff;
  animation: white 7s linear infinite;
}

.y1970 .orange{
  animation: orange 4s linear infinite;
}

.y1970 .pink{
  animation: pink 3s linear infinite;
}

.y1970 .yellow_green{
  animation: yellow_green 4s linear infinite;
}

.y1970 .purple{
  animation: purple 5s linear infinite;
}

.y1970 .teal{
  animation: teal 6s linear infinite;
}

.y1980{
  background-image: url('../img/1908s_background.jpg');
  animation: moving_gradient 10s linear infinite;
}

.y1990 .wiggle_1{
  animation: wiggle_1 1s linear infinite;
}

.y1990 .wiggle_2{
  animation: wiggle_2 1s linear infinite;
}

.y1990 .wiggle_3{
  animation: wiggle_3 1s linear infinite;
}

.y1990 .wiggle_4{
  animation: wiggle_4 1s linear infinite;
}

/* --------------------------------

Body Styles

-------------------------------- */
.home_logo{
  position: absolute;
  top: 10px;
  right: 10px;
}

.home_logo img{
  width: 200px;
  height: auto;
  position: relative;
  z-index: 1000;
}

.history_home{
  /*background: url('../img/history_home_bg.png') fixed no-repeat center center;*/
  background-size: cover;
  min-height: 100vh;
}

.history_home header{
  background: #000;
  padding: 10px 0px;
}

.history_home .main{
  text-align: center;
}

.history_home h1{
  font-size: 68px;
  color: #fff;
  text-shadow: 0px 2px 4px #000;
  margin: 60px 0 10px;
}

.history_home p{
  color: #fff;
  font-size: 24px;
  font-weight: 100;
  margin: 20px 0;
}

.history_home .home_video iframe{
  width: 991px;
  height: 558px;
}

.history_home .btn{
  margin-bottom: 40px;
}

ul.home_nav{
  padding: 0px;
  margin: 0px;
}

ul.home_nav li{
  list-style: none;
  width: 33%;
  display: block;
  float: left;
  position: relative;
  margin-bottom: 40px;
}

.home_nav img{
  width: 100%;
  height: auto;
}

.home_nav a{

}

.home_nav span{
  position: absolute;
  top: 5px;
  left: 10px;
  color: #fff;
  font-size: 48px;
  text-shadow: 0px 2px 4px #000;
}

.addthis_sharing_toolbox {		
  margin-bottom: 15px;
}


.btn-primary{
  background: #E2231A;
  border: 1px solid #B1140c;
  color: #fff;
}

.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus{
  background: #B1140c;
  border: 1px solid #8a0700;
  outline: none;
}

.btn {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 20px;
  font-weight: normal;
  line-height: 1.428571429;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 1px solid transparent;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

.static_bg .container{
  text-align: center;
  position: absolute;
  top: -100px;
  width: 100%;
}

.static_1900{
  /*background: url('../img/1900s_static_bg.jpg') center center;*/
  padding: 20px 0px;
  margin: 120px 0 100px;
  height: 400px;
  position: relative;
}

.static_1910{
  /*background: url('../img/1910s_static_bg.jpg') center center;*/
  padding: 20px 0px;
  margin: 100px 0 100px;
  height: 250px;
  position: relative;
}

.static_1910 .container{
  top: -50px;
}

.static_1920{
  /*background: url('../img/1920s_static_bg.jpg') center center;*/
  padding: 20px 0px;
  margin: 100px 0 100px;
  height: 300px;
  position: relative;
}

.static_1920 .container{
  top: -77px;
}

.static_1920 .image_1{
  width: 450px;
  height: auto;
  left: 50%;
  position: absolute;
  margin-left: 65px;
  top: 100px;
}

.static_1920 .image_2{
  width: 250px;
  height: auto;
  left: 50%;
  position: absolute;
  margin-left: -94px;
  top: 2px;
  z-index: 2;
}

.static_1920 .image_3{
  width: 400px;
  height: auto;
  left: 50%;
  position: absolute;
  margin-left: -475px;
  top: 50px;
  z-index: 1;
}

.static_1930{
  /*background: url('../img/1930s_static_bg.jpg') center center;*/
  padding: 20px 0px;
  margin: 100px 0 100px;
  height: 450px;
  position: relative;
}

.static_1930 .container{
  top: -77px;
}

.static_1930 .image_1{
  width: 550px;
  height: auto;
  left: 50%;
  position: absolute;
  margin-left: -595px;
  top: 158px;
  z-index: 1;
}

.static_1930 .image_2{
  width: 350px;
  height: auto;
  left: 50%;
  position: absolute;
  margin-left: -155px;
  top: 50px;
  z-index: 2;
}

.static_1930 .image_3{
  width: 500px;
  height: auto;
  left: 50%;
  position: absolute;
  margin-left: 89px;
  top: 69px;
  z-index: 1;
}

.static_1940{
  /*background: url('../img/1940s_static_bg.jpg') center center;*/
  padding: 20px 0px;
  margin: 100px 0 100px;
  height: 300px;
  position: relative;
}

.static_1940 .container{
  top: -40px;
}

.static_1950{
  /*background: url('../img/1950s_static_bg.jpg') center center;*/
  padding: 20px 0px;
  margin: 100px 0 100px;
  height: 385px;
  position: relative;
}

.static_1950 .container{
  top: -40px;
}

.static_1960{
  /*background: url('../img/1960s_static_bg.jpg') center center;*/
  padding: 20px 0px;
  margin: 100px 0 100px;
  height: 350px;
  position: relative;
}

.static_1960 .container{
  top: -40px;
}

.static_1960 .image_1{
  width: 350px;
  height: auto;
  position: absolute;
  left: 50%;
  margin-left: -437px;
  top: 0px;
}

.static_1960 .image_2{
  width: 300px;
  height: auto;
  position: absolute;
  left: 50%;
  margin-left: -383px;
  top: 223px;
}

.static_1960 .image_3{
  width: 578px;
  height: auto;
  position: absolute;
  left: 50%;
  margin-left: -109px;
  top: 0px;
}

.video_container{
  text-align: center;
  padding: 40px 0px;
  background: #ccc;
}


.static_1970{
  /*background: url('../img/1970s_static_bg.jpg') center center;*/
  padding: 20px 0px;
  margin: 100px 0 100px;
  height: 265px;
  position: relative;
}

.static_1970 .container{
  top: -40px;
}

.historic_photo{
  position: relative;
  padding-bottom: 40px;
}

.historic_photo .overlay{
  position: absolute;
  top: 0px;
  background: #000;
  background: rgba(0,0,0,0.8);
  color: #fff;
  font-size: 20px;
  font-style: 1.5vw;
  text-align: center;
  width: 100%;
  padding: 40px 0px;
}

.historic_photo img{
  height: auto;
  width: 100%;
  margin: 0 0 -3px;
}

footer{
  background: #E2231A;
  padding: 40px 0;
  font-size: 20px;
  font-size: 1.5vw;
}

.next_link{
  margin: 0 auto;
  text-align: center;
}

.next_link a,
.next_link a:hover,
.next_link a:active,
.next_link a:visited{
  color: #fff;
}

.next_link img{
  width: 300px;
  height: auto;
}

/*-------------Firefox Only---------------*/

@-moz-document url-prefix() {
  .y1950{
    background: #DEDECB;
  }

  .y1950 svg > g{
    position: relative;
    animation: none;
    transform-origin: none;
  }

  @keyframes yellow_50 {
    0%{
      fill:#e6d782;
    }
    50%{
      fill:#e98a8a;
    }
    100%{
      fill:#e6d782;
    }
  }

  @keyframes pink_50 {
    0%{
      fill:#e98a8a;
    }
    50%{
      fill:#84B7B4;
    }
    100%{
      fill:#e98a8a;
    }
  }

  @keyframes seafoam_50 {
    0%{
      fill:#bacf8c;
    }
    50%{
      fill:#e6d782;
    }
    100%{
      fill:#bacf8c;
    }
  }

  @keyframes teal_50 {
    0%{
      fill:#84B7B4;
    }
    50%{
      fill:#bbba23;
    }
    100%{
      fill:#84B7B4;
    }
  }

  @keyframes darkgreen_50 {
    0%{
      fill:#bbba23;
    }
    50%{
      fill:#bacf8c;
    }
    100%{
      fill:#bbba23;
    }
  }


  .yellow_50{
    animation: yellow_50 3s linear infinite;
  }

  .pink_50{
    animation: pink_50 3s linear infinite;
  }

  .seafoam_50{
    animation: seafoam_50 3s linear infinite;
  }

  .teal_50{
    animation: teal_50 3s linear infinite;
  }

  .darkgreen_50{
    animation: darkgreen_50 3s linear infinite;
  }
}

/*--------------IE 10-11-------------------*/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    svg,
    .animated_background,
    header h1{
      display: none;
    }

    .ie_image{
      display: block;
    }

    .ie_image img{
      width: 100%;
      height: auto;
    }
}


/*--------------------additional styles------------------*/
@keyframes y2kPoly {
  0% {
    transform: skew(0deg, 0deg);
  }
  5% {
    transform: skew(7deg, -7deg);
  }
  6% {
    transform: skew(5deg, -5deg);
  }
  15% {
    transform: skew(-1deg, 1deg);
  }
  16%{
    transform: skew(0deg, 0deg);
  }
}
@keyframes y2010_anim {
  0% {
    transform: scale(10);
  }
  100% {
    transform: scale(1);
  }
}

polygon {
  animation: y2kpoly 3s linear infinite;
}

.y2010_dino {
  transform-origin: 40% 60%;
  animation-fill-mode: forwards;
  animation: y2010_anim 1.5s linear;
}





/*--------------------Mobile------------------*/

@media (max-width: 1200px) {

  .history_home h1{
    font-size: 58px;
    margin: 60px 0 10px;
  }

  .history_home .home_video iframe{
    width: 768px;
    height: 432px;
  }

  .history_home .btn{
    margin-bottom: 40px;
  }

  ul.home_nav li{
    list-style: none;
    width: 33%;
    display: block;
    float: left;
    position: relative;
    margin-bottom: 40px;
  }

  .home_nav span{
    position: absolute;
    top: 5px;
    left: 10px;
    color: #fff;
    font-size: 38px;
  }

}

@media (max-width: 1050px) {

  @keyframes slide {
    0% {
      transform:translate(0px,0px);
    }
    50% {
     transform:translate(0px,-100px);
    }
    100% {
     transform:translate(0px,0px);
    }
  }

  .home_logo img {
      width: 150px;
      height: auto;
  }

  .static_bg .container {
      text-align: center;
      position: relative;
      top: inherit;
      width: 100%;
  }

  .static_bg .container img {
      position: static !important;
      margin: 0px;
      left: inherit;
      top: inherit;
      max-width: 100%;
  }

  .next_link {
      margin: 0 auto;
      text-align: center;
      font-size: 24px;
  }

  .static_bg{
    height: auto !important;
    margin: 0px;
  }

  .historic_photo .overlay {
      position: static;
      top: 0px;
      background: #000;
      color: #fff;
      font-size: 1.5vw;
  }

}

@media (max-width: 991px) {

  .history_home h1{
    font-size: 48px;
    margin: 40px 0 10px;
  }

  .history_home .home_video iframe{
    width: 614px;
    height: 345px;
  }

  .history_home .btn{
    margin-bottom: 40px;
  }

  ul.home_nav li{
    list-style: none;
    width: 33%;
    display: block;
    float: left;
    position: relative;
    margin-bottom: 40px;
  }

  .home_nav span{
    position: absolute;
    top: 5px;
    left: 10px;
    color: #fff;
    font-size: 38px;
  }

}

@media (max-width: 768px) {

  @keyframes slide {
    0% {
      transform:translate(0px,0px);
    }
    50% {
     transform:translate(0px,-50px);
    }
    100% {
     transform:translate(0px,0px);
    }
  }

  @keyframes slant_up {
    0%{
        left: -281px;
        bottom: 507px;
    }
    50%{
        left: -381px;
        bottom: 407px;
    }
    100%{
        left: -281px;
        bottom: 507px;
    }

  }

  @keyframes slant_down {

    0%{
        left: -281px;
        bottom: 507px;
    }
    50%{
        left: -181px;
        bottom: 607px;
    }
    100%{
        left: -281px;
        bottom: 507px;
    }

  }

  .pull-left,
  .pull-right{
    float: none;
  }

  .p20r,
  .p40r,
  .p20l{
    padding: 0px;
  }

  .m40r{
	margin-right:0px;
  }

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

  .img50{
	width:100%;
	height:auto;
  }


  .cd-title {
      display: none;
  }

  .mobile-title h1 {
      display: block;
      font-size: 60px;
      color: #00833C;
  }

  .cd-content {

  }

  h2 {
      font-size: 28px;
  }

  p {
      font-size: 16px;
  }

  .container ul,
  .container ol {
      font-size: 16px;
  }

  blockquote {
      font-size: 24px;
      line-height: 28px;
  }

  .historic_photo .overlay {
      font-size: 18px;
      padding: 40px 20px;
  }

  video,
  iframe.video {
    width: 320px;
    height: auto;
  }

  .y1930 .bg_slice {
      float: left;
      height: 50px;
      width: 50px;
      background: url('../img/1930s-bg.png') no-repeat top left;
      overflow: hidden;
      background-size: 72px;
      margin: 1px;
  }

  .history_home h1{
    font-size: 38px;
    margin: 40px 0 10px;
  }

  .history_home .home_video iframe{
    width: 416px;
    height: 234px;
  }

  .history_home .btn{
    margin-bottom: 40px;
  }

  ul.home_nav li{
    list-style: none;
    width: 50%;
    display: block;
    float: left;
    position: relative;
    margin-bottom: 40px;
  }

  .home_nav span{
    position: absolute;
    top: 5px;
    left: 10px;
    color: #fff;
    font-size: 28px;
  }

}

@media (max-width: 610px) {
  .cd-section header svg {
      width: 700px;
      height: 200px;
      margin-bottom: -3px;
      margin-left: -200px;
  }

  .cd-section header .animated_background svg{
      height: 300px;
      width: 700px;
  }

  .home_logo {
      position: absolute;
      top: inherit;
      right: 10px;
      bottom: 10px;
  }

  .home_logo img {
      width: 100px;
      height: auto;
  }

  .y1920{
    margin-left: -100px;
  }

  .history_home h1 {
      font-size: 34px;
  }

  .history_home .main img {
      margin: 20px 0px;
  }

  .history_home .btn{
      margin-bottom: 40px;
  }
}

@media (max-width: 520px) {
  .cd-side-navigation a{
    font-size: 18px;
  }

  .history_home h1{
    font-size: 38px;
    margin: 20px 0;
  }

  .history_home .home_video iframe{
    width: 256px;
    height: 144px;
  }

  .history_home .btn{
    margin-bottom: 40px;
  }

  ul.home_nav li{
    list-style: none;
    width: 100%;
    display: block;
    float: left;
    position: relative;
    margin-bottom: 40px;
  }
}
