@charset "UTF-8";
@import url("//hello.myfonts.net/count/34ad65");
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

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

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

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

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

table {
  border-collapse: collapse;
  border-spacing: 0; }

/**
 * @license
 * MyFonts Webfont Build ID 3452261, 2017-09-17T14:54:42-0400
 * 
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are 
 * explicitly restricted from using the Licensed Webfonts(s).
 * 
 * You may obtain a valid license at the URLs below.
 * 
 * Webfont: Geogrotesque-Lt by Emtype Foundry
 * URL: https://www.myfonts.com/fonts/emtype/geogrotesque/light/
 * 
 * Webfont: Geogrotesque-LtIt by Emtype Foundry
 * URL: https://www.myfonts.com/fonts/emtype/geogrotesque/light-italic/
 * 
 * Webfont: Geogrotesque-Md by Emtype Foundry
 * URL: https://www.myfonts.com/fonts/emtype/geogrotesque/medium/
 * 
 * Webfont: Geogrotesque-Bd by Emtype Foundry
 * URL: https://www.myfonts.com/fonts/emtype/geogrotesque/bold/
 * 
 * Webfont: Geogrotesque-Rg by Emtype Foundry
 * URL: https://www.myfonts.com/fonts/emtype/geogrotesque/regular/
 * 
 * Webfont: Geogrotesque-SmBd by Emtype Foundry
 * URL: https://www.myfonts.com/fonts/emtype/geogrotesque/semibold/
 * 
 * 
 * License: https://www.myfonts.com/viewlicense?type=web&buildid=3452261
 * Licensed pageviews: 10,000
 * Webfonts copyright: Copyright (c) 2008-2016 by Eduardo Manso. All rights reserved.
 * 
 * © 2017 MyFonts Inc
*/
/* @import must be at top of file, otherwise CSS will not work */
@font-face {
  font-family: 'Geogrotesque-Lt';
  src: url("../fonts/34AD65_0_0.eot");
  src: url("../fonts/34AD65_0_0.eot?#iefix") format("embedded-opentype"), url("../fonts/34AD65_0_0.woff2") format("woff2"), url("../fonts/34AD65_0_0.woff") format("woff"), url("../fonts/34AD65_0_0.ttf") format("truetype"); }

@font-face {
  font-family: 'Geogrotesque-LtIt';
  src: url("../fonts/34AD65_1_0.eot");
  src: url("../fonts/34AD65_1_0.eot?#iefix") format("embedded-opentype"), url("../fonts/34AD65_1_0.woff2") format("woff2"), url("../fonts/34AD65_1_0.woff") format("woff"), url("../fonts/34AD65_1_0.ttf") format("truetype"); }

@font-face {
  font-family: 'Geogrotesque-Md';
  src: url("../fonts/34AD65_2_0.eot");
  src: url("../fonts/34AD65_2_0.eot?#iefix") format("embedded-opentype"), url("../fonts/34AD65_2_0.woff2") format("woff2"), url("../fonts/34AD65_2_0.woff") format("woff"), url("../fonts/34AD65_2_0.ttf") format("truetype"); }

@font-face {
  font-family: 'Geogrotesque-Bd';
  src: url("../fonts/34AD65_3_0.eot");
  src: url("../fonts/34AD65_3_0.eot?#iefix") format("embedded-opentype"), url("../fonts/34AD65_3_0.woff2") format("woff2"), url("../fonts/34AD65_3_0.woff") format("woff"), url("../fonts/34AD65_3_0.ttf") format("truetype"); }

@font-face {
  font-family: 'Geogrotesque-Rg';
  src: url("../fonts/34AD65_4_0.eot");
  src: url("../fonts/34AD65_4_0.eot?#iefix") format("embedded-opentype"), url("../fonts/34AD65_4_0.woff2") format("woff2"), url("../fonts/34AD65_4_0.woff") format("woff"), url("../fonts/34AD65_4_0.ttf") format("truetype"); }

@font-face {
  font-family: 'Geogrotesque-SmBd';
  src: url("../fonts/34AD65_5_0.eot");
  src: url("../fonts/34AD65_5_0.eot?#iefix") format("embedded-opentype"), url("../fonts/34AD65_5_0.woff2") format("woff2"), url("../fonts/34AD65_5_0.woff") format("woff"), url("../fonts/34AD65_5_0.ttf") format("truetype"); }

html {
  -webkit-font-smoothing: antialiased; }

body {
  color: #000;
  background: #fafafa;
  font-size: 1em;
  font-family: "proxima-nova", Arial, Helvetica, sans-serif; }
  body * {
    -webkit-font-smoothing: antialiased; }

#mit-autonomous-vehicles #main-container {
  width: 1180px;
  height: 800px;
  margin: 0 auto;
  position: relative;
  background: #fff;
  overflow: hidden; }

#mit-autonomous-vehicles #header {
  height: 15px;
  width: 100%;
  background: #c0282d; }

#mit-autonomous-vehicles #main-text {
  width: 860px;
  position: absolute;
  top: 40px;
  left: 45px; }
  #mit-autonomous-vehicles #main-text h1 {
    font-family: "Geogrotesque-Md", Georgia, Times, serif;
    color: #c0282d;
    font-size: 3.4375em; }
  #mit-autonomous-vehicles #main-text p {
    font-family: "proxima-nova", Arial, Helvetica, sans-serif;
    font-weight: 300;
    color: #636466;
    font-size: 1.5em;
    line-height: 1.1875em; }

#mit-autonomous-vehicles #main-key {
  position: absolute;
  bottom: 0;
  left: 50%;
  border-top: 1px solid #c0282d;
  border-left: 1px solid #c0282d;
  border-right: 1px solid #c0282d;
  border-radius: 10px 10px 0 0;
  padding: 12px 10px 8px 10px;
  -moz-transform: translate(-50%, 45px);
  -o-transform: translate(-50%, 45px);
  -ms-transform: translate(-50%, 45px);
  -webkit-transform: translate(-50%, 45px);
  transform: translate(-50%, 45px);
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out; }
  #mit-autonomous-vehicles #main-key.active {
    -moz-transform: translate(-50%, 0px);
    -o-transform: translate(-50%, 0px);
    -ms-transform: translate(-50%, 0px);
    -webkit-transform: translate(-50%, 0px);
    transform: translate(-50%, 0px); }
  #mit-autonomous-vehicles #main-key p {
    font-family: "museo-slab", Arial, Helvetica, sans-serif;
    font-weight: 500; }
    #mit-autonomous-vehicles #main-key p span {
      color: #c0282d; }

#mit-autonomous-vehicles #main-vehicle {
  width: 630px;
  height: 292px;
  position: absolute;
  top: 400px;
  left: 284px;
  z-index: 500;
  background-image: url(../img/main-vehicle.png);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  -moz-transform: translate(-1000px, 0);
  -o-transform: translate(-1000px, 0);
  -ms-transform: translate(-1000px, 0);
  -webkit-transform: translate(-1000px, 0);
  transform: translate(-1000px, 0);
  -webkit-transition: all 2s ease-out;
  transition: all 2s ease-out; }
  #mit-autonomous-vehicles #main-vehicle.active {
    -moz-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0); }
  #mit-autonomous-vehicles #main-vehicle.tilt {
    -webkit-transition: all 1s ease-out;
    transition: all 1s ease-out;
    left: 264px; }
  #mit-autonomous-vehicles #main-vehicle .bubbles {
    position: absolute;
    top: -130px;
    z-index: 10;
    left: -284px; }
    #mit-autonomous-vehicles #main-vehicle .bubbles .bubble {
      position: absolute;
      width: 600px;
      padding: 15px;
      background: #fff;
      border-radius: 10px;
      border: #000 solid 1px;
      display: flex;
      z-index: 10;
      visibility: hidden;
      opacity: 0;
      -webkit-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out; }
      #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.active {
        visibility: visible;
        opacity: 1; }
      #mit-autonomous-vehicles #main-vehicle .bubbles .bubble:after {
        content: '';
        position: absolute;
        border-style: solid;
        border-width: 130px 11px 0;
        border-color: #fff transparent;
        display: block;
        width: 0;
        z-index: 1;
        bottom: -126px;
        left: 465px; }
      #mit-autonomous-vehicles #main-vehicle .bubbles .bubble:before {
        content: '';
        position: absolute;
        border-style: solid;
        border-width: 131px 12px 0;
        border-color: #000 transparent;
        display: block;
        width: 0;
        z-index: 0;
        bottom: -132px;
        left: 464px; }
      #mit-autonomous-vehicles #main-vehicle .bubbles .bubble .bubble-icon {
        width: 70px;
        margin-right: 15px; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble .bubble-icon img {
          width: 100%; }
      #mit-autonomous-vehicles #main-vehicle .bubbles .bubble .bubble-text {
        width: 500px; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble .bubble-text h2 {
          font-family: "Geogrotesque-Md", Georgia, Times, serif;
          font-size: 1.625em; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble .bubble-text p {
          font-family: "Geogrotesque-Rg", Georgia, Times, serif;
          color: #636466;
          font-size: 1.375em; }
      #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-sensor1 {
        left: 437px;
        border-color: #eb2227; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-sensor1:before {
          border-color: #eb2227 transparent; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-sensor1 h2 {
          color: #eb2227; }
      #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-learn {
        left: 50px;
        top: 0px;
        border-color: #70aa9d; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-learn .bubble-text {
          width: 510px; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-learn:before {
          left: 341px;
          border-color: #70aa9d transparent; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-learn:after {
          left: 342px; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-learn h2 {
          color: #70aa9d; }
      #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-local {
        width: 557px;
        left: 260px;
        top: 0px;
        border-color: #942d20; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-local .bubble-text {
          width: 470px; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-local:before {
          left: 301px;
          border-color: #942d20 transparent; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-local:after {
          left: 302px; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-local h2 {
          color: #942d20; }
      #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-gps {
        left: 130px;
        top: 19px;
        border-color: #e98f23; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-gps:before {
          left: 530px;
          border-color: #e98f23 transparent; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-gps:after {
          left: 531px; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-gps h2 {
          color: #e98f23; }
      #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-artificial {
        left: 130px;
        border-color: #754d25; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-artificial:before {
          left: 530px;
          bottom: -82px;
          border-width: 81px 12px 0;
          border-color: #754d25 transparent; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-artificial:after {
          left: 530px;
          bottom: -78px;
          border-width: 82px 12px 0; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-artificial h2 {
          color: #754d25; }
      #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-radar {
        left: 350px;
        top: 0px;
        border-color: #8cc540; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-radar:before {
          left: 341px;
          border-color: #8cc540 transparent; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-radar:after {
          left: 342px; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-radar h2 {
          color: #8cc540; }
      #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-cloud {
        left: 180px;
        top: -20px;
        border-color: #31559e; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-cloud:before {
          left: 530px;
          bottom: -82px;
          border-width: 81px 12px 0;
          border-color: #31559e transparent; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-cloud:after {
          left: 530px;
          bottom: -78px;
          border-width: 82px 12px 0; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-cloud h2 {
          color: #31559e; }
      #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-lidar {
        left: 370px;
        top: 19px;
        border-color: #ec2179; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-lidar:before {
          left: 341px;
          bottom: -183px;
          border-width: 183px 12px 0;
          border-color: #ec2179 transparent; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-lidar:after {
          left: 342px;
          bottom: -163px;
          border-width: 163px 11px 0; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-lidar h2 {
          color: #ec2179; }
      #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-sign {
        left: 280px;
        top: 19px;
        border-color: #029147; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-sign:before {
          left: 490px;
          bottom: -183px;
          border-width: 183px 12px 0;
          border-color: #029147 transparent; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-sign:after {
          left: 491px;
          bottom: -163px;
          border-width: 163px 11px 0; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-sign h2 {
          color: #029147; }
      #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-connect {
        left: 240px;
        top: -22px;
        border-color: #67308f; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-connect:before {
          left: 566px;
          border-color: #67308f transparent; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-connect:after {
          left: 567px; }
        #mit-autonomous-vehicles #main-vehicle .bubbles .bubble.bubble-connect h2 {
          color: #67308f; }

#mit-autonomous-vehicles .icons .icon-box, #mit-autonomous-vehicles #cloud .icon-box {
  position: absolute;
  width: 30px;
  height: 30px;
  cursor: pointer; }
  #mit-autonomous-vehicles .icons .icon-box.active .icon-inactive, #mit-autonomous-vehicles #cloud .icon-box.active .icon-inactive {
    opacity: 0; }
  #mit-autonomous-vehicles .icons .icon-box.active .icon-text, #mit-autonomous-vehicles #cloud .icon-box.active .icon-text {
    opacity: 0; }
  #mit-autonomous-vehicles .icons .icon-box .icon, #mit-autonomous-vehicles #cloud .icon-box .icon {
    width: 30px;
    height: 30px;
    position: absolute; }
    #mit-autonomous-vehicles .icons .icon-box .icon.icon-active, #mit-autonomous-vehicles #cloud .icon-box .icon.icon-active {
      top: 1px;
      left: 1px;
      width: 28px;
      height: 28px; }
    #mit-autonomous-vehicles .icons .icon-box .icon.icon-inactive, #mit-autonomous-vehicles #cloud .icon-box .icon.icon-inactive {
      -webkit-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out; }
    #mit-autonomous-vehicles .icons .icon-box .icon img, #mit-autonomous-vehicles #cloud .icon-box .icon img {
      width: 100%; }
  #mit-autonomous-vehicles .icons .icon-box .icon-text, #mit-autonomous-vehicles #cloud .icon-box .icon-text {
    width: 90px;
    position: absolute;
    opacity: 1;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out; }
    #mit-autonomous-vehicles .icons .icon-box .icon-text.right, #mit-autonomous-vehicles #cloud .icon-box .icon-text.right {
      right: -95px;
      top: 2px; }
    #mit-autonomous-vehicles .icons .icon-box .icon-text.left, #mit-autonomous-vehicles #cloud .icon-box .icon-text.left {
      left: -70px;
      top: 2px; }
    #mit-autonomous-vehicles .icons .icon-box .icon-text.bottom, #mit-autonomous-vehicles #cloud .icon-box .icon-text.bottom {
      bottom: -30px;
      left: -29px; }
      #mit-autonomous-vehicles .icons .icon-box .icon-text.bottom p, #mit-autonomous-vehicles #cloud .icon-box .icon-text.bottom p {
        text-align: center; }
    #mit-autonomous-vehicles .icons .icon-box .icon-text p, #mit-autonomous-vehicles #cloud .icon-box .icon-text p {
      font-family: "Geogrotesque-Md", Georgia, Times, serif;
      color: #95a0a9;
      font-size: 0.8125em;
      text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
      -webkit-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out; }
  #mit-autonomous-vehicles .icons .icon-box.icon-sensor1, #mit-autonomous-vehicles #cloud .icon-box.icon-sensor1 {
    top: 130px;
    left: -14px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-sensor1.active p, #mit-autonomous-vehicles #cloud .icon-box.icon-sensor1.active p {
      color: #eb2227; }
  #mit-autonomous-vehicles .icons .icon-box.icon-learn, #mit-autonomous-vehicles #cloud .icon-box.icon-learn {
    top: 130px;
    left: 105px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-learn.active p, #mit-autonomous-vehicles #cloud .icon-box.icon-learn.active p {
      color: #70aa9d; }
  #mit-autonomous-vehicles .icons .icon-box.icon-local, #mit-autonomous-vehicles #cloud .icon-box.icon-local {
    top: 130px;
    left: 276px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-local.active p, #mit-autonomous-vehicles #cloud .icon-box.icon-local.active p {
      color: #942d20; }
  #mit-autonomous-vehicles .icons .icon-box.icon-gps, #mit-autonomous-vehicles #cloud .icon-box.icon-gps {
    top: 130px;
    left: 375px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-gps .bottom, #mit-autonomous-vehicles #cloud .icon-box.icon-gps .bottom {
      bottom: -42px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-gps.active p, #mit-autonomous-vehicles #cloud .icon-box.icon-gps.active p {
      color: #e98f23; }
  #mit-autonomous-vehicles .icons .icon-box.icon-artificial, #mit-autonomous-vehicles #cloud .icon-box.icon-artificial {
    top: 82px;
    left: 375px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-artificial.active p, #mit-autonomous-vehicles #cloud .icon-box.icon-artificial.active p {
      color: #754d25; }
  #mit-autonomous-vehicles .icons .icon-box.icon-radar, #mit-autonomous-vehicles #cloud .icon-box.icon-radar {
    top: 130px;
    left: 405px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-radar .right, #mit-autonomous-vehicles #cloud .icon-box.icon-radar .right {
      top: 9px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-radar.active p, #mit-autonomous-vehicles #cloud .icon-box.icon-radar.active p {
      color: #8cc540; }
  #mit-autonomous-vehicles .icons .icon-box.icon-cloud, #mit-autonomous-vehicles #cloud .icon-box.icon-cloud {
    top: 82px;
    left: 425px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-cloud .right, #mit-autonomous-vehicles #cloud .icon-box.icon-cloud .right {
      top: -5px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-cloud.active p, #mit-autonomous-vehicles #cloud .icon-box.icon-cloud.active p {
      color: #31559e; }
  #mit-autonomous-vehicles .icons .icon-box.icon-lidar, #mit-autonomous-vehicles #cloud .icon-box.icon-lidar {
    top: 182px;
    left: 425px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-lidar .bottom, #mit-autonomous-vehicles #cloud .icon-box.icon-lidar .bottom {
      bottom: -16px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-lidar.active p, #mit-autonomous-vehicles #cloud .icon-box.icon-lidar.active p {
      color: #ec2179; }
  #mit-autonomous-vehicles .icons .icon-box.icon-sign, #mit-autonomous-vehicles #cloud .icon-box.icon-sign {
    top: 182px;
    left: 485px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-sign.active p, #mit-autonomous-vehicles #cloud .icon-box.icon-sign.active p {
      color: #029147; }
  #mit-autonomous-vehicles .icons .icon-box.icon-connect, #mit-autonomous-vehicles #cloud .icon-box.icon-connect {
    top: 130px;
    left: 520px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-connect .bottom, #mit-autonomous-vehicles #cloud .icon-box.icon-connect .bottom {
      bottom: -16px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-connect.active p, #mit-autonomous-vehicles #cloud .icon-box.icon-connect.active p {
      color: #67308f; }
  #mit-autonomous-vehicles .icons .icon-box.icon-sensor2, #mit-autonomous-vehicles #cloud .icon-box.icon-sensor2 {
    top: 130px;
    left: 615px; }
    #mit-autonomous-vehicles .icons .icon-box.icon-sensor2.active p, #mit-autonomous-vehicles #cloud .icon-box.icon-sensor2.active p {
      color: #eb2227; }

#mit-autonomous-vehicles #road-lines {
  height: 30px;
  width: 1180px;
  overflow: hidden;
  position: relative;
  height: 370px;
  top: 360px;
  z-index: 500;
  opacity: 0;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out; }
  #mit-autonomous-vehicles #road-lines.visible {
    opacity: 1; }
  #mit-autonomous-vehicles #road-lines.active {
    z-index: 0; }
    #mit-autonomous-vehicles #road-lines.active .line {
      animation: marquee 10s linear infinite; }
  #mit-autonomous-vehicles #road-lines.sign .line .dash {
    background: #ffde1e; }
  #mit-autonomous-vehicles #road-lines .line {
    display: block;
    width: 200%;
    height: 30px;
    position: absolute;
    overflow: hidden; }
    #mit-autonomous-vehicles #road-lines .line.line2 {
      margin-top: 350px; }
    #mit-autonomous-vehicles #road-lines .line .dash {
      float: left;
      width: 206px;
      height: 15px;
      margin: 0 93px;
      background: #d5d7d8;
      -webkit-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out; }

@keyframes marquee {
  0% {
    left: 0; }
  100% {
    left: -100%; } }

#mit-autonomous-vehicles #cloud {
  width: 387px;
  height: 161px;
  position: absolute;
  top: 40px;
  right: -128px;
  z-index: 200;
  background-image: url(../img/main-cloud.png);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out; }
  #mit-autonomous-vehicles #cloud .icon-box.icon-cloud {
    left: 114px;
    top: 58px; }
  #mit-autonomous-vehicles #cloud .icon-text {
    opacity: 1; }
  #mit-autonomous-vehicles #cloud.active {
    opacity: 0; }

#mit-autonomous-vehicles #extras {
  z-index: 0; }
  #mit-autonomous-vehicles #extras .vehicle {
    top: 400px;
    animation: driving 10s linear infinite;
    -moz-transform: translate(0px, 20px);
    -o-transform: translate(0px, 20px);
    -ms-transform: translate(0px, 20px);
    -webkit-transform: translate(0px, 20px);
    transform: translate(0px, 20px);
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out; }
    #mit-autonomous-vehicles #extras .vehicle.back {
      left: -475px;
      -webkit-animation-delay: 2s;
      /* Safari 4.0 - 8.0 */
      animation-delay: 2s; }
    #mit-autonomous-vehicles #extras .vehicle.front {
      right: -475px; }
      #mit-autonomous-vehicles #extras .vehicle.front.lidar {
        right: -555px; }

@keyframes driving {
  0% {
    -moz-transform: translate(0px, 10px);
    -o-transform: translate(0px, 10px);
    -ms-transform: translate(0px, 10px);
    -webkit-transform: translate(0px, 10px);
    transform: translate(0px, 10px); }
  25% {
    -moz-transform: translate(-10px, -10px);
    -o-transform: translate(-10px, -10px);
    -ms-transform: translate(-10px, -10px);
    -webkit-transform: translate(-10px, -10px);
    transform: translate(-10px, -10px); }
  50% {
    -moz-transform: translate(10px, 10px);
    -o-transform: translate(10px, 10px);
    -ms-transform: translate(10px, 10px);
    -webkit-transform: translate(10px, 10px);
    transform: translate(10px, 10px); }
  75% {
    -moz-transform: translate(0px, -10px);
    -o-transform: translate(0px, -10px);
    -ms-transform: translate(0px, -10px);
    -webkit-transform: translate(0px, -10px);
    transform: translate(0px, -10px); }
  100% {
    -moz-transform: translate(0px, 10px);
    -o-transform: translate(0px, 10px);
    -ms-transform: translate(0px, 10px);
    -webkit-transform: translate(0px, 10px);
    transform: translate(0px, 10px); } }

#mit-autonomous-vehicles .vehicle {
  width: 630px;
  height: 292px;
  position: absolute;
  top: 430px;
  opacity: 0;
  background-image: url(../img/second-vehicle.png);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out; }
  #mit-autonomous-vehicles .vehicle.active {
    opacity: 1; }

#mit-autonomous-vehicles #section {
  position: absolute;
  top: 200px;
  left: 0;
  height: 668px;
  width: 1180px;
  -webkit-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out; }
  #mit-autonomous-vehicles #section.active {
    left: -20px; }
  #mit-autonomous-vehicles #section .section {
    opacity: 0;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out; }
    #mit-autonomous-vehicles #section .section.active {
      opacity: 1; }
    #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows {
      width: 620px;
      height: 152px;
      position: absolute;
      left: 304px;
      top: 261px; }
      #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont {
        position: absolute;
        overflow: hidden;
        -webkit-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out; }
        #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont .arrow {
          background-size: 100% 100%;
          position: absolute;
          right: 0; }
        #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont.arrow-cont-1 {
          width: 0;
          height: 45px;
          left: 0px;
          top: 28px; }
          #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont.arrow-cont-1.active {
            width: 253px; }
          #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont.arrow-cont-1 .arrow {
            width: 253px;
            height: 45px;
            right: auto;
            background-image: url(../img/graphic-sensor-arrow1.png); }
        #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont.arrow-cont-2 {
          width: 0;
          height: 53px;
          right: 12px;
          top: 102px; }
          #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont.arrow-cont-2.active {
            width: 327px; }
          #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont.arrow-cont-2 .arrow {
            width: 327px;
            height: 53px;
            background-image: url(../img/graphic-sensor-arrow2.png); }
        #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont.arrow-cont-3 {
          width: 0;
          height: 69px;
          right: 5px;
          top: 0px; }
          #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont.arrow-cont-3.active {
            width: 189px; }
          #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont.arrow-cont-3 .arrow {
            width: 189px;
            height: 69px;
            background-image: url(../img/graphic-sensor-arrow3.png); }
        #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont.arrow-cont-4 {
          width: 0;
          height: 8px;
          right: 211px;
          top: 10px; }
          #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont.arrow-cont-4.active {
            width: 28px; }
          #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont.arrow-cont-4 .arrow {
            width: 28px;
            height: 8px;
            background-image: url(../img/graphic-sensor-arrow4.png); }
        #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont.arrow-cont-5 {
          width: 0;
          height: 40px;
          right: 263px;
          top: 37px; }
          #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont.arrow-cont-5.active {
            width: 72px; }
          #mit-autonomous-vehicles #section .section.section-sensor .sensor-arrows .arrow-cont.arrow-cont-5 .arrow {
            width: 72px;
            height: 40px;
            background-image: url(../img/graphic-sensor-arrow5.png); }
    #mit-autonomous-vehicles #section .section.section-sensor .line {
      border: none;
      border-top: 2px dotted #eb2227;
      color: #fff;
      background-color: #fff;
      height: 1px;
      width: 0;
      position: absolute;
      overflow: visible;
      -webkit-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-sensor .line.active {
        width: 170px; }
        #mit-autonomous-vehicles #section .section.section-sensor .line.active:before {
          opacity: 1; }
      #mit-autonomous-vehicles #section .section.section-sensor .line:before {
        content: "";
        display: block;
        width: 11px;
        height: 9px;
        background-image: url(../img/graphic-sensor-arrow-head.png);
        background-size: 100%;
        position: absolute;
        left: -5px;
        top: -5px;
        opacity: 0;
        -webkit-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out; }
    #mit-autonomous-vehicles #section .section.section-sensor .left-sensor {
      position: absolute;
      top: 327px;
      right: 914px;
      width: 200px; }
      #mit-autonomous-vehicles #section .section.section-sensor .left-sensor .line {
        transform-origin: right top;
        right: 0; }
        #mit-autonomous-vehicles #section .section.section-sensor .left-sensor .line.line-1 {
          -moz-transform: rotate(54deg);
          -o-transform: rotate(54deg);
          -ms-transform: rotate(54deg);
          -webkit-transform: rotate(54deg);
          transform: rotate(54deg); }
        #mit-autonomous-vehicles #section .section.section-sensor .left-sensor .line.line-2 {
          top: 9px; }
          #mit-autonomous-vehicles #section .section.section-sensor .left-sensor .line.line-2.active {
            width: 100px; }
        #mit-autonomous-vehicles #section .section.section-sensor .left-sensor .line.line-3 {
          top: 19px;
          -moz-transform: rotate(-54deg);
          -o-transform: rotate(-54deg);
          -ms-transform: rotate(-54deg);
          -webkit-transform: rotate(-54deg);
          transform: rotate(-54deg); }
    #mit-autonomous-vehicles #section .section.section-sensor .right-sensor {
      position: absolute;
      top: 327px;
      left: 931px;
      width: 200px; }
      #mit-autonomous-vehicles #section .section.section-sensor .right-sensor .line {
        transform-origin: left top;
        left: 0; }
        #mit-autonomous-vehicles #section .section.section-sensor .right-sensor .line.line-1 {
          top: 19px;
          -moz-transform: rotate(54deg);
          -o-transform: rotate(54deg);
          -ms-transform: rotate(54deg);
          -webkit-transform: rotate(54deg);
          transform: rotate(54deg); }
        #mit-autonomous-vehicles #section .section.section-sensor .right-sensor .line.line-2 {
          -moz-transform: rotate(-54deg);
          -o-transform: rotate(-54deg);
          -ms-transform: rotate(-54deg);
          -webkit-transform: rotate(-54deg);
          transform: rotate(-54deg); }
        #mit-autonomous-vehicles #section .section.section-sensor .right-sensor .line:before {
          left: auto;
          right: -5px;
          -moz-transform: rotate(180deg);
          -o-transform: rotate(180deg);
          -ms-transform: rotate(180deg);
          -webkit-transform: rotate(180deg);
          transform: rotate(180deg); }
    #mit-autonomous-vehicles #section .section.section-learn .arrow-cont {
      width: 13px;
      height: 0;
      position: absolute;
      top: -32px;
      left: 918px;
      transform-origin: left top;
      overflow: hidden;
      -moz-transform: rotate(54deg);
      -o-transform: rotate(54deg);
      -ms-transform: rotate(54deg);
      -webkit-transform: rotate(54deg);
      transform: rotate(54deg);
      -webkit-transition: all 1s ease-in-out;
      transition: all 1s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-learn .arrow-cont.active {
        height: 622px; }
      #mit-autonomous-vehicles #section .section.section-learn .arrow-cont .arrow {
        width: 13px;
        height: 622px;
        background-image: url(../img/graphic-learn-arrow.png);
        background-size: 100%; }
    #mit-autonomous-vehicles #section .section.section-learn .cloud {
      width: 387px;
      height: 161px;
      position: absolute;
      top: -160px;
      right: -127px;
      z-index: 200;
      opacity: 0;
      background-image: url(../img/graphic-learn-cloud.png);
      background-size: 100% 100%;
      background-repeat: no-repeat;
      -webkit-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-learn .cloud.active {
        opacity: 1; }
    #mit-autonomous-vehicles #section .section.section-learn .gear {
      position: absolute;
      background-size: 100%;
      background-image: url(../img/graphic-learn-gear.png); }
      #mit-autonomous-vehicles #section .section.section-learn .gear.active {
        animation: rotate 10s infinite linear; }
      #mit-autonomous-vehicles #section .section.section-learn .gear.sm {
        width: 38px;
        height: 38px; }
      #mit-autonomous-vehicles #section .section.section-learn .gear.md {
        width: 54px;
        height: 54px; }
      #mit-autonomous-vehicles #section .section.section-learn .gear.lg {
        width: 72px;
        height: 72px; }
      #mit-autonomous-vehicles #section .section.section-learn .gear.gear-1 {
        top: 116px;
        left: 14px; }
      #mit-autonomous-vehicles #section .section.section-learn .gear.gear-2 {
        top: 83px;
        left: 54px; }
      #mit-autonomous-vehicles #section .section.section-learn .gear.gear-3 {
        top: 29px;
        left: 99px; }
      #mit-autonomous-vehicles #section .section.section-learn .gear.gear-4 {
        top: 83px;
        left: 131px; }
      #mit-autonomous-vehicles #section .section.section-learn .gear.gear-5 {
        top: 39px;
        left: 161px; }
      #mit-autonomous-vehicles #section .section.section-learn .gear.gear-6 {
        top: 36px;
        left: 204px; }
      #mit-autonomous-vehicles #section .section.section-learn .gear.gear-7 {
        top: 116px;
        left: 217px; }
    #mit-autonomous-vehicles #section .section.section-local .numbers {
      width: 110px;
      height: 26px;
      position: absolute;
      top: 332px;
      left: 518px;
      opacity: 0;
      background-size: 100%;
      background-image: url(../img/graphic-local-numbers.png);
      -webkit-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-local .numbers.active {
        opacity: 1;
        animation: local .5s linear; }
    #mit-autonomous-vehicles #section .section.section-gps .line-cont {
      width: 16px;
      height: 0;
      position: absolute;
      overflow: hidden;
      left: 676px;
      bottom: 342px;
      transform-origin: left bottom;
      -moz-transform: rotate(44deg);
      -o-transform: rotate(44deg);
      -ms-transform: rotate(44deg);
      -webkit-transform: rotate(44deg);
      transform: rotate(44deg);
      -webkit-transition: all 1s ease-in-out;
      transition: all 1s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-gps .line-cont.active {
        height: 523px; }
      #mit-autonomous-vehicles #section .section.section-gps .line-cont .line {
        width: 16px;
        height: 523px;
        background-image: url(../img/graphic-gps-line.png);
        background-size: 100%; }
    #mit-autonomous-vehicles #section .section.section-gps .satelite {
      width: 154px;
      height: 130px;
      position: absolute;
      z-index: 10;
      left: 958px;
      top: -111px;
      background-image: url(../img/graphic-gps-satelite.png);
      background-size: 100%;
      opacity: 0;
      -moz-transform: scale(1.2);
      -o-transform: scale(1.2);
      -ms-transform: scale(1.2);
      -webkit-transform: scale(1.2);
      transform: scale(1.2);
      -webkit-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-gps .satelite.active {
        opacity: 1;
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        -webkit-transform: scale(1);
        transform: scale(1); }
    #mit-autonomous-vehicles #section .section.section-gps .orb {
      position: absolute;
      background-size: 100%;
      -moz-transform: scale(0);
      -o-transform: scale(0);
      -ms-transform: scale(0);
      -webkit-transform: scale(0);
      transform: scale(0);
      -webkit-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-gps .orb.active {
        opacity: 1;
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        -webkit-transform: scale(1);
        transform: scale(1); }
      #mit-autonomous-vehicles #section .section.section-gps .orb.orb-lg {
        width: 288px;
        height: 288px;
        right: 2px;
        top: -189px;
        background-image: url(../img/graphic-gps-satelite-orb.png); }
      #mit-autonomous-vehicles #section .section.section-gps .orb.orb-sm {
        width: 72px;
        height: 72px;
        left: 637px;
        top: 307px;
        background-image: url(../img/graphic-gps-icon-orb.png); }
    #mit-autonomous-vehicles #section .section.section-artificial .lines {
      position: absolute;
      top: 290px;
      left: 671px; }
      #mit-autonomous-vehicles #section .section.section-artificial .lines .line {
        border: none;
        border-top: 2px dotted #754d25;
        color: #fff;
        background-color: #fff;
        height: 1px;
        width: 0;
        position: absolute;
        transform-origin: left top;
        -webkit-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out; }
        #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-1 {
          -moz-transform: rotate(173deg);
          -o-transform: rotate(173deg);
          -ms-transform: rotate(173deg);
          -webkit-transform: rotate(173deg);
          transform: rotate(173deg); }
          #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-1.active {
            width: 376px; }
        #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-2 {
          -moz-transform: rotate(170deg);
          -o-transform: rotate(170deg);
          -ms-transform: rotate(170deg);
          -webkit-transform: rotate(170deg);
          transform: rotate(170deg); }
          #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-2.active {
            width: 286px; }
        #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-3 {
          -moz-transform: rotate(153deg);
          -o-transform: rotate(153deg);
          -ms-transform: rotate(153deg);
          -webkit-transform: rotate(153deg);
          transform: rotate(153deg); }
          #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-3.active {
            width: 106px; }
        #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-4 {
          left: 4px;
          -moz-transform: rotate(90deg);
          -o-transform: rotate(90deg);
          -ms-transform: rotate(90deg);
          -webkit-transform: rotate(90deg);
          transform: rotate(90deg); }
          #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-4.active {
            width: 56px; }
        #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-5 {
          -moz-transform: rotate(52deg);
          -o-transform: rotate(52deg);
          -ms-transform: rotate(52deg);
          -webkit-transform: rotate(52deg);
          transform: rotate(52deg); }
          #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-5.active {
            width: 66px; }
        #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-6 {
          -moz-transform: rotate(18deg);
          -o-transform: rotate(18deg);
          -ms-transform: rotate(18deg);
          -webkit-transform: rotate(18deg);
          transform: rotate(18deg); }
          #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-6.active {
            width: 146px; }
        #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-7 {
          -moz-transform: rotate(10deg);
          -o-transform: rotate(10deg);
          -ms-transform: rotate(10deg);
          -webkit-transform: rotate(10deg);
          transform: rotate(10deg); }
          #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-7.active {
            width: 238px; }
        #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-8 {
          -moz-transform: rotate(0deg);
          -o-transform: rotate(0deg);
          -ms-transform: rotate(0deg);
          -webkit-transform: rotate(0deg);
          transform: rotate(0deg); }
          #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-8.active {
            width: 56px; }
        #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-9 {
          top: 62px;
          left: 40px;
          -moz-transform: rotate(20deg);
          -o-transform: rotate(20deg);
          -ms-transform: rotate(20deg);
          -webkit-transform: rotate(20deg);
          transform: rotate(20deg); }
          #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-9.active {
            width: 306px; }
        #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-10 {
          top: 62px;
          left: 151px;
          -moz-transform: rotate(30deg);
          -o-transform: rotate(30deg);
          -ms-transform: rotate(30deg);
          -webkit-transform: rotate(30deg);
          transform: rotate(30deg); }
          #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-10.active {
            width: 216px; }
        #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-11 {
          top: 62px;
          left: 242px;
          -moz-transform: rotate(49deg);
          -o-transform: rotate(49deg);
          -ms-transform: rotate(49deg);
          -webkit-transform: rotate(49deg);
          transform: rotate(49deg); }
          #mit-autonomous-vehicles #section .section.section-artificial .lines .line.line-11.active {
            width: 143px; }
    #mit-autonomous-vehicles #section .section.section-artificial .car {
      width: 466px;
      height: 596px;
      position: absolute;
      bottom: -230px;
      right: -120px;
      background-image: url(../img/graphic-artificial-car.png);
      background-size: 100%;
      -moz-transform: rotate(50deg) translate(-228px, 550px);
      -o-transform: rotate(50deg) translate(-228px, 550px);
      -ms-transform: rotate(50deg) translate(-228px, 550px);
      -webkit-transform: rotate(50deg) translate(-228px, 550px);
      transform: rotate(50deg) translate(-228px, 550px);
      -webkit-transition: all 1s ease-in-out;
      transition: all 1s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-artificial .car.active {
        -moz-transform: rotate(0deg) translate(0, 0);
        -o-transform: rotate(0deg) translate(0, 0);
        -ms-transform: rotate(0deg) translate(0, 0);
        -webkit-transform: rotate(0deg) translate(0, 0);
        transform: rotate(0deg) translate(0, 0); }
      #mit-autonomous-vehicles #section .section.section-artificial .car .circle {
        width: 15px;
        height: 15px;
        border-radius: 15px;
        background: #754d25;
        position: absolute;
        top: 157px;
        left: 161px; }
    #mit-autonomous-vehicles #section .section.section-radar .rings {
      position: absolute;
      top: 344px;
      left: 666px; }
      #mit-autonomous-vehicles #section .section.section-radar .rings .ring {
        background-size: 100% 100%;
        position: absolute;
        opacity: 0;
        transform-origin: center center;
        -moz-transform: scale(0);
        -o-transform: scale(0);
        -ms-transform: scale(0);
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out; }
        #mit-autonomous-vehicles #section .section.section-radar .rings .ring.active {
          opacity: 1;
          -moz-transform: scale(1);
          -o-transform: scale(1);
          -ms-transform: scale(1);
          -webkit-transform: scale(1);
          transform: scale(1); }
        #mit-autonomous-vehicles #section .section.section-radar .rings .ring.ring-1 {
          width: 77px;
          height: 77px;
          top: -39px;
          background-image: url(../img/graphic-radar-ring1.png); }
        #mit-autonomous-vehicles #section .section.section-radar .rings .ring.ring-2 {
          width: 154px;
          height: 154px;
          left: -39px;
          top: -77px;
          background-image: url(../img/graphic-radar-ring2.png); }
        #mit-autonomous-vehicles #section .section.section-radar .rings .ring.ring-3 {
          width: 235px;
          height: 235px;
          left: -79px;
          top: -117px;
          background-image: url(../img/graphic-radar-ring3.png); }
        #mit-autonomous-vehicles #section .section.section-radar .rings .ring.ring-4 {
          width: 329px;
          height: 329px;
          left: -127px;
          top: -163px;
          background-image: url(../img/graphic-radar-ring4.png); }
        #mit-autonomous-vehicles #section .section.section-radar .rings .ring.ring-5 {
          width: 424px;
          height: 424px;
          left: -175px;
          top: -212px;
          background-image: url(../img/graphic-radar-ring5.png); }
    #mit-autonomous-vehicles #section .section.section-cloud .orb {
      position: absolute;
      background-size: 100%;
      opacity: 0;
      -moz-transform: scale(0);
      -o-transform: scale(0);
      -ms-transform: scale(0);
      -webkit-transform: scale(0);
      transform: scale(0);
      -webkit-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-cloud .orb.active {
        opacity: 1;
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        -webkit-transform: scale(1);
        transform: scale(1); }
      #mit-autonomous-vehicles #section .section.section-cloud .orb.orb-lg {
        top: -138px;
        right: 80px;
        width: 100px;
        height: 100px;
        background-image: url(../img/graphic-cloud-orb-lg.png); }
      #mit-autonomous-vehicles #section .section.section-cloud .orb.orb-sm {
        top: 262px;
        right: 421px;
        width: 70px;
        height: 70px;
        background-image: url(../img/graphic-cloud-orb-sm.png); }
    #mit-autonomous-vehicles #section .section.section-cloud .arrow-cont {
      width: 25px;
      height: 0;
      overflow: hidden;
      position: absolute;
      left: 725px;
      bottom: 391px;
      transform-origin: left bottom;
      opacity: 0;
      -moz-transform: rotate(40deg);
      -o-transform: rotate(40deg);
      -ms-transform: rotate(40deg);
      -webkit-transform: rotate(40deg);
      transform: rotate(40deg);
      -webkit-transition: all 1s ease-in-out;
      transition: all 1s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-cloud .arrow-cont.active {
        opacity: 1;
        height: 468px; }
      #mit-autonomous-vehicles #section .section.section-cloud .arrow-cont.cloud {
        left: auto;
        bottom: auto;
        right: 130px;
        top: -63px;
        transform-origin: right top; }
        #mit-autonomous-vehicles #section .section.section-cloud .arrow-cont.cloud .arrow {
          right: 0;
          top: 0; }
      #mit-autonomous-vehicles #section .section.section-cloud .arrow-cont .arrow {
        position: absolute;
        width: 25px;
        height: 468px;
        background-image: url(../img/graphic-cloud-arrow.png);
        background-size: 100%; }
    #mit-autonomous-vehicles #section .section.section-cloud .direction-cont {
      width: 0;
      height: 557px;
      overflow: hidden;
      position: absolute;
      left: 860px;
      bottom: -115px;
      -webkit-transition: all 2s ease-in-out;
      transition: all 2s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-cloud .direction-cont.active {
        height: 557px;
        width: 771px; }
      #mit-autonomous-vehicles #section .section.section-cloud .direction-cont .direction {
        width: 771px;
        height: 557px;
        background-image: url(../img/graphic-cloud-direction.png);
        background-size: 100%; }
    #mit-autonomous-vehicles #section .section.section-lidar .line-cont {
      position: absolute;
      top: 270px;
      left: 730px;
      width: 0;
      height: 159px;
      overflow: hidden;
      -webkit-transition: all 1s ease-in-out;
      transition: all 1s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-lidar .line-cont.active {
        width: 379px; }
      #mit-autonomous-vehicles #section .section.section-lidar .line-cont .line {
        width: 379px;
        height: 159px;
        background-image: url(../img/graphic-lidar-line.png);
        background-size: 100%;
        background-repeat: no-repeat; }
    #mit-autonomous-vehicles #section .section.section-lidar .orb {
      position: absolute;
      width: 94px;
      height: 94px;
      top: 29px;
      right: 17px;
      z-index: 1;
      background-image: url(../img/graphic-lidar-orb.png);
      background-size: 100%;
      opacity: 0;
      -webkit-transition: all 1s ease-in-out;
      transition: all 1s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-lidar .orb.active {
        animation: orb 3s linear infinite; }
      #mit-autonomous-vehicles #section .section.section-lidar .orb.orb-1 {
        top: 228px; }
      #mit-autonomous-vehicles #section .section.section-lidar .orb.orb-2 {
        top: 378px; }
    #mit-autonomous-vehicles #section .section.section-lidar .vehicle {
      top: 200px;
      right: -555px;
      z-index: 10;
      background-image: url(../img/third-vehicle.png); }
    #mit-autonomous-vehicles #section .section.section-sign .streetsign {
      width: 142px;
      height: 302px;
      position: absolute;
      right: 50px;
      top: -30px;
      z-index: 10;
      background-image: url(../img/graphic-sign-streetsign.png);
      background-size: 100%;
      -moz-transform: translate(200px, 0px);
      -o-transform: translate(200px, 0px);
      -ms-transform: translate(200px, 0px);
      -webkit-transform: translate(200px, 0px);
      transform: translate(200px, 0px);
      -webkit-transition: all 1s linear;
      transition: all 1s linear; }
      #mit-autonomous-vehicles #section .section.section-sign .streetsign.active {
        -moz-transform: translate(0px, 0px);
        -o-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        -webkit-transform: translate(0px, 0px);
        transform: translate(0px, 0px); }
    #mit-autonomous-vehicles #section .section.section-sign .ray-cont {
      width: 0px;
      height: 375px;
      overflow: hidden;
      position: absolute;
      left: 782px;
      top: 30px;
      opacity: 0;
      -webkit-transition: all 1s ease-in-out;
      transition: all 1s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-sign .ray-cont.active {
        opacity: 1;
        width: 284px; }
      #mit-autonomous-vehicles #section .section.section-sign .ray-cont .ray {
        width: 284px;
        height: 375px;
        background-image: url(../img/graphic-sign-ray.png);
        background-size: 100%; }
    #mit-autonomous-vehicles #section .section.section-connect .arrow-cont1 {
      width: 0;
      height: 25px;
      overflow: hidden;
      position: absolute;
      right: 380px;
      top: 334px;
      -webkit-transition: all 0.8s ease-in-out;
      transition: all 0.8s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-connect .arrow-cont1.active {
        width: 756px; }
      #mit-autonomous-vehicles #section .section.section-connect .arrow-cont1 .arrow {
        width: 756px;
        height: 25px;
        background-image: url(../img/graphic-connect-arrow1.png);
        background-size: 100%; }
    #mit-autonomous-vehicles #section .section.section-connect .arrow-cont2 {
      width: 0;
      height: 25px;
      overflow: hidden;
      position: absolute;
      left: 838px;
      top: 334px;
      -webkit-transition: all 0.8s ease-in-out;
      transition: all 0.8s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-connect .arrow-cont2.active {
        width: 306px; }
      #mit-autonomous-vehicles #section .section.section-connect .arrow-cont2 .arrow {
        width: 306px;
        height: 25px;
        background-image: url(../img/graphic-connect-arrow2.png);
        background-size: 100%; }
    #mit-autonomous-vehicles #section .section.section-connect .arrow-cont3 {
      width: 24px;
      height: 0;
      overflow: hidden;
      position: absolute;
      left: 814px;
      bottom: 352px;
      transform-origin: bottom left;
      -moz-transform: rotate(40deg);
      -o-transform: rotate(40deg);
      -ms-transform: rotate(40deg);
      -webkit-transform: rotate(40deg);
      transform: rotate(40deg);
      -webkit-transition: all 0.8s ease-in-out;
      transition: all 0.8s ease-in-out; }
      #mit-autonomous-vehicles #section .section.section-connect .arrow-cont3.active {
        height: 405px; }
      #mit-autonomous-vehicles #section .section.section-connect .arrow-cont3 .arrow {
        width: 24px;
        height: 405px;
        background-image: url(../img/graphic-connect-arrow3.png);
        background-size: 100%; }
    #mit-autonomous-vehicles #section .section.section-connect .log {
      width: 79px;
      height: 152px;
      position: absolute;
      right: 110px;
      top: 102px;
      background-image: url(../img/graphic-connect-log.png);
      background-size: 100%;
      opacity: 0;
      -moz-transform: rotate(-20deg) translate(260px, 0);
      -o-transform: rotate(-20deg) translate(260px, 0);
      -ms-transform: rotate(-20deg) translate(260px, 0);
      -webkit-transform: rotate(-20deg) translate(260px, 0);
      transform: rotate(-20deg) translate(260px, 0);
      -webkit-transition: all 1s linear;
      transition: all 1s linear; }
      #mit-autonomous-vehicles #section .section.section-connect .log.active {
        opacity: 1;
        -moz-transform: rotate(0deg) translate(0, 0);
        -o-transform: rotate(0deg) translate(0, 0);
        -ms-transform: rotate(0deg) translate(0, 0);
        -webkit-transform: rotate(0deg) translate(0, 0);
        transform: rotate(0deg) translate(0, 0); }
    #mit-autonomous-vehicles #section .section.section-connect .vehicle {
      top: -180px;
      right: -430px;
      -moz-transform: translate(260px, 0) rotate(180deg);
      -o-transform: translate(260px, 0) rotate(180deg);
      -ms-transform: translate(260px, 0) rotate(180deg);
      -webkit-transform: translate(260px, 0) rotate(180deg);
      transform: translate(260px, 0) rotate(180deg);
      -webkit-transition: all 0.5s linear;
      transition: all 0.5s linear; }
      #mit-autonomous-vehicles #section .section.section-connect .vehicle.active {
        -moz-transform: translate(0, 0) rotate(185deg);
        -o-transform: translate(0, 0) rotate(185deg);
        -ms-transform: translate(0, 0) rotate(185deg);
        -webkit-transform: translate(0, 0) rotate(185deg);
        transform: translate(0, 0) rotate(185deg); }

@keyframes rotate {
  from {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  to {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -ms-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg); } }

@keyframes orb {
  0% {
    opacity: .1; }
  25% {
    opacity: 1; }
  75% {
    opacity: 1; }
  100% {
    opacity: .1; } }

@keyframes local {
  0% {
    -moz-transform: scale(0);
    -o-transform: scale(0);
    -ms-transform: scale(0);
    -webkit-transform: scale(0);
    transform: scale(0); }
  75% {
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    transform: scale(1.2); }
  100% {
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1); } }

@media only screen and (max-width: 1180px) {
  #mit-autonomous-vehicles {
    -moz-transform: scale(0.8);
    -o-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
    transform-origin: top left;
    height: 650px; } }

@media only screen and (max-width: 945px) {
  #mit-autonomous-vehicles {
    -moz-transform: scale(0.6);
    -o-transform: scale(0.6);
    -ms-transform: scale(0.6);
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
    height: 490px; } }

@media only screen and (max-width: 709px) {
  #mit-autonomous-vehicles {
    -moz-transform: scale(0.4);
    -o-transform: scale(0.4);
    -ms-transform: scale(0.4);
    -webkit-transform: scale(0.4);
    transform: scale(0.4);
    height: 340px; } }

@media only screen and (max-width: 472px) {
  #mit-autonomous-vehicles {
    -moz-transform: scale(0.3);
    -o-transform: scale(0.3);
    -ms-transform: scale(0.3);
    -webkit-transform: scale(0.3);
    transform: scale(0.3);
    height: 250px; } }
