@font-face {
  font-family: "Helvetica Rounded";
  src: url("/assets/helvetica-rounded/helvetica-rounded.eot");
  src: url("/assets/helvetica-rounded/helvetica-rounded.eot?#iefix") format("embedded-opentype"), url("/assets/helvetica-rounded/helvetica-rounded.ttf") format("truetype"); }

body {
  line-height: 1.5;
  float: none;
  margin: 0 auto;
  background-repeat: repeat;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 0.875em;
  min-width: 320px;
  overflow: auto;
  background-image: none;
  text-align: center; }
  body #page {
    max-width: 1600px;
    margin: 0 auto; }

p {
  font-size: 1em;
  margin-top: 1em;
  margin-bottom: 1em;
  padding: 0; }

a {
  color: gray;
  text-decoration: none; }

.blue {
  color: #91d1ee !important; }

.orange {
  color: #f0d799 !important; }

.green {
  color: #bdd68d !important; }

.header {
  font-size: 2em;
  font-weight: bold; }

.clickable {
  cursor: pointer; }
  .clickable:hover {
    text-decoration: underline; }

.col {
  float: left;
  text-align: center; }
  .col.col4 {
    width: 100%; }
  .col.col2 {
    width: 50%; }
    @media screen and (max-width: 800px) {
      .col.col2 {
        width: 100%; } }
  .col.col1 {
    width: 50%; }
    @media screen and (max-width: 500px) {
      .col.col1 {
        width: 100%; } }
    @media screen and (max-width: 800px) {
      .col.col1.times {
        padding-top: 10px;
        width: 50%; } }
    @media screen and (max-width: 500px) {
      .col.col1.times {
        padding-top: 10px;
        width: 50%; } }
  .col.col3 {
    width: 33%; }
    @media screen and (max-width: 800px) {
      .col.col3 {
        width: 100%; } }

.left {
  float: left;
  width: 66%; }
  @media screen and (max-width: 800px) {
    .left {
      float: left;
      width: 100%; } }

.right {
  float: right;
  width: 33%; }
  @media screen and (max-width: 800px) {
    .right {
      float: left;
      width: 100%;
      padding-top: 20px;
      padding-bottom: 100px; } }
  .right .fixed {
    position: fixed;
    top: 0px; }
  .right .top {
    position: absolute;
    top: 1181px; }

.desktop {
  display: block; }
  @media screen and (max-width: 800px) {
    .desktop {
      display: none; } }

.mobile {
  display: none; }
  @media screen and (max-width: 800px) {
    .mobile {
      display: block; } }

.button.button-blue {
  cursor: pointer;
  -moz-box-shadow: inset 0px 1px 0px 0px #bbdaf7;
  -webkit-box-shadow: inset 0px 1px 0px 0px #bbdaf7;
  box-shadow: inset 0px 1px 0px 0px #bbdaf7;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #97cfed), color-stop(1, #97cfed));
  background: -moz-linear-gradient(top, #97cfed 5%, #97cfed 100%);
  background: -webkit-linear-gradient(top, #97cfed 5%, #97cfed 100%);
  background: -o-linear-gradient(top, #97cfed 5%, #97cfed 100%);
  background: -ms-linear-gradient(top, #97cfed 5%, #97cfed 100%);
  background: linear-gradient(to bottom, #97cfed 5%, #97cfed 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#97CFED', endColorstr='#97CFED',GradientType=0);
  background-color: #97cfed;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  border-radius: 7px;
  border: 1px solid #84bbf3;
  display: inline-block;
  color: white;
  font-family: Trebuchet MS;
  font-size: 17px;
  font-weight: bold;
  padding: 6px 11px;
  text-decoration: none;
  text-shadow: 0px 1px 0px #8f7f24; }
  .button.button-blue:hover {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #378de5), color-stop(1, #79bbff));
    background: -moz-linear-gradient(top, #378de5 5%, #79bbff 100%);
    background: -webkit-linear-gradient(top, #378de5 5%, #79bbff 100%);
    background: -o-linear-gradient(top, #378de5 5%, #79bbff 100%);
    background: -ms-linear-gradient(top, #378de5 5%, #79bbff 100%);
    background: linear-gradient(to bottom, #378de5 5%, #79bbff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#378de5', endColorstr='#79bbff',GradientType=0);
    background-color: #378de5; }
  .button.button-blue:active {
    position: relative;
    top: 1px; }
.button.button-orange {
  cursor: pointer;
  -moz-box-shadow: inset 0px 1px 0px 0px #ffe0b5;
  -webkit-box-shadow: inset 0px 1px 0px 0px #ffe0b5;
  box-shadow: inset 0px 1px 0px 0px #ffe0b5;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #fbb450), color-stop(1, #f89306));
  background: -moz-linear-gradient(top, #fbb450 5%, #f89306 100%);
  background: -webkit-linear-gradient(top, #fbb450 5%, #f89306 100%);
  background: -o-linear-gradient(top, #fbb450 5%, #f89306 100%);
  background: -ms-linear-gradient(top, #fbb450 5%, #f89306 100%);
  background: linear-gradient(to bottom, #fbb450 5%, #f89306 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fbb450', endColorstr='#f89306',GradientType=0);
  background-color: #fbb450;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  border-radius: 7px;
  border: 1px solid #c97e1c;
  display: inline-block;
  color: white;
  font-family: Trebuchet MS;
  font-size: 17px;
  font-weight: bold;
  padding: 6px 11px;
  text-decoration: none;
  text-shadow: 0px 1px 0px #8f7f24; }
  .button.button-orange:hover {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f89306), color-stop(1, #fbb450));
    background: -moz-linear-gradient(top, #f89306 5%, #fbb450 100%);
    background: -webkit-linear-gradient(top, #f89306 5%, #fbb450 100%);
    background: -o-linear-gradient(top, #f89306 5%, #fbb450 100%);
    background: -ms-linear-gradient(top, #f89306 5%, #fbb450 100%);
    background: linear-gradient(to bottom, #f89306 5%, #fbb450 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f89306', endColorstr='#fbb450',GradientType=0);
    background-color: #f89306; }
  .button.button-orange:active {
    position: relative;
    top: 1px; }

#carpool-front .container {
  padding-top: 75px;
  padding-bottom: 75px;
  border-bottom: 1px solid #ededed; }
  #carpool-front .container .contents {
    max-width: 1200px;
    margin: 0 auto; }
#carpool-front .title {
  font-size: 30px;
  font-family: "Myriad Pro", Arial, sans-serif;
  font-weight: bold;
  text-transform: uppercase; }
#carpool-front .subtitle {
  font-size: 18px;
  font-family: "Myriad Pro", Arial, sans-serif;
  color: #939598; }
#carpool-front .text {
  text-align: center;
  color: #939598;
  font-family: "Myriad Pro", Arial, sans-serif;
  font-size: 16px;
  padding-bottom: 50px; }
#carpool-front .white {
  background-color: white; }
#carpool-front .gray {
  background-color: #f3f4f4; }
#carpool-front #header-small {
  background-color: #414042;
  padding: 0px;
  margin: 0 auto;
  float: none; }
  #carpool-front #header-small .inner {
    padding: 10px 10px 0px 10px;
    float: none;
    margin: 0 auto; }
  #carpool-front #header-small .title {
    font-size: 36px;
    float: left; }
    #carpool-front #header-small .title a {
      color: white; }
  #carpool-front #header-small .ctas {
    padding-top: 5px;
    text-align: right; }
    #carpool-front #header-small .ctas .cta {
      display: inline-block;
      padding-bottom: 10px; }
      #carpool-front #header-small .ctas .cta .button {
        float: left; }
        @media screen and (max-width: 400px) {
          #carpool-front #header-small .ctas .cta .button {
            display: block;
            float: none; } }
        #carpool-front #header-small .ctas .cta .button img {
          height: 40px; }
      #carpool-front #header-small .ctas .cta .watch {
        font-size: 18px;
        float: left;
        padding-left: 30px;
        padding-top: 6px; }
        #carpool-front #header-small .ctas .cta .watch a {
          color: white; }
      #carpool-front #header-small .ctas .cta .words {
        display: inline-block;
        float: left; }
      #carpool-front #header-small .ctas .cta .image {
        display: inline-block;
        float: left;
        padding-left: 10px;
        padding-top: 3px; }
        #carpool-front #header-small .ctas .cta .image img {
          height: 20px; }
#carpool-front #header {
  padding-bottom: 0px;
  padding-top: 0px; }
  #carpool-front #header .splash img {
    width: 100%; }
  #carpool-front #header .title {
    font-family: "Helvetica Rounded", Helvetica, Arial, sans-serif; }
  #carpool-front #header .main {
    position: absolute;
    top: 0px;
    padding-top: 100px;
    padding-left: 50px;
    width: 50%;
    max-width: 800px; }
    #carpool-front #header .main .ctas .cta {
      padding-top: 25px;
      display: inline-block;
      height: 65px; }
      #carpool-front #header .main .ctas .cta .button {
        float: left; }
        #carpool-front #header .main .ctas .cta .button img {
          height: 40px; }
      #carpool-front #header .main .ctas .cta .watch {
        font-size: 18px;
        float: left;
        padding-left: 30px;
        padding-top: 6px; }
        #carpool-front #header .main .ctas .cta .watch a {
          color: white; }
      #carpool-front #header .main .ctas .cta .words {
        display: inline-block;
        float: left; }
      #carpool-front #header .main .ctas .cta .image {
        display: inline-block;
        float: left;
        padding-left: 10px;
        padding-top: 3px; }
        #carpool-front #header .main .ctas .cta .image img {
          height: 20px; }
    #carpool-front #header .main .title {
      text-align: center;
      font-size: 50px;
      color: white;
      font-weight: normal; }
  @media screen and (max-width: 1200px) {
    #carpool-front #header .main {
      width: 45%;
      padding-top: 50px; }
      #carpool-front #header .main .title {
        font-size: 40px; }
      #carpool-front #header .main .ctas .cta {
        padding-top: 15px; } }
  @media screen and (max-width: 975px) {
    #carpool-front #header .main {
      width: 100%;
      max-width: none;
      padding-left: 0px;
      padding-top: 15px; }
      #carpool-front #header .main .title {
        font-size: 36px;
        padding-bottom: 5px; }
      #carpool-front #header .main .ctas .cta {
        padding-top: 5px; } }
  @media screen and (max-width: 600px) {
    #carpool-front #header .splash {
      background-image: url(/assets/carpool/front/splash.jpg);
      width: 100%;
      height: 350px;
      background-position: -750px -65px;
      background-repeat: no-repeat; }
      #carpool-front #header .splash img {
        display: none; }
    #carpool-front #header .main {
      width: 100%;
      position: relative;
      padding: 0px; }
      #carpool-front #header .main .title {
        padding: 10px;
        color: black;
        font-size: 32px; }
      #carpool-front #header .main .ctas .cta {
        padding-top: 0px;
        padding-bottom: 15px;
        display: block;
        margin: 0 auto;
        text-align: center; }
        #carpool-front #header .main .ctas .cta .button {
          display: block;
          float: none; }
        #carpool-front #header .main .ctas .cta .watch {
          display: inline-block;
          float: none;
          padding-left: 0px; }
          #carpool-front #header .main .ctas .cta .watch .words {
            color: black;
            float: none; }
          #carpool-front #header .main .ctas .cta .watch .image {
            float: none; } }
  #carpool-front #header #create .create {
    width: 100%;
    height: 315px; }
    #carpool-front #header #create .create .field {
      position: relative;
      margin: 0;
      width: 290px;
      margin: 0 auto;
      line-height: 1; }
      #carpool-front #header #create .create .field label {
        color: #817a70;
        width: 268px;
        height: 14px;
        padding: 11px;
        display: block;
        font-weight: bold;
        text-align: left; }
      #carpool-front #header #create .create .field label {
        position: absolute;
        top: 0;
        left: 0;
        cursor: text; }
      #carpool-front #header #create .create .field input.form-text {
        width: 268px;
        height: 14px;
        border: 1px solid #e2e2d8;
        -moz-border-radius: 6px;
        -webkit-border-radius: 6px;
        border-radius: 6px;
        padding: 10px;
        font-size: 14px;
        font-weight: bold;
        color: #817a70;
        font-family: Georgia, "Times New Roman", serif;
        margin: 0 0 15px 0; }
#carpool-front #article {
  max-width: 600px;
  margin: 0 auto;
  text-align: left;
  float: none;
  padding: 1px 20px; }
#carpool-front #statement {
  padding-top: 25px;
  padding-bottom: 25px; }
  #carpool-front #statement .title {
    padding-bottom: 0px;
    font-size: 30px;
    font-style: italic;
    font-weight: normal;
    color: #a7a9ac; }
#carpool-front #why {
  padding-top: 25px;
  padding-bottom: 25px; }
  #carpool-front #why .reasons .reason .reason-inner {
    padding: 0px 20px; }
    #carpool-front #why .reasons .reason .reason-inner .subtitle {
      color: black;
      font-weight: bold;
      text-transform: uppercase; }
    #carpool-front #why .reasons .reason .reason-inner .image {
      margin-bottom: 10px; }
      #carpool-front #why .reasons .reason .reason-inner .image img {
        height: 65px; }
    #carpool-front #why .reasons .reason .reason-inner .text {
      padding-bottom: 0px; }
#carpool-front #video_demo .text {
  font-size: 20px; }
#carpool-front #video_demo .video {
  padding-top: 10px;
  width: 100%;
  margin: 0 auto;
  height: 400px; }
  #carpool-front #video_demo .video iframe {
    width: 85%;
    max-width: 800px;
    height: 400px; }
#carpool-front #video_demo a {
  text-decoration: underline; }
#carpool-front #onthego .text {
  font-size: 20px; }
#carpool-front #onthego .image img {
  max-width: 800px;
  width: 100%; }
#carpool-front #who .orgs {
  overflow: hidden;
  padding-top: 20px; }
  #carpool-front #who .orgs .org .image {
    width: 100%;
    height: 100px; }
    #carpool-front #who .orgs .org .image img {
      height: 100px; }
  #carpool-front #who .orgs .org .subtitle {
    padding-top: 20px; }
#carpool-front #footer {
  background-color: #414042; }
  #carpool-front #footer .right {
    float: right;
    width: auto;
    padding-right: 50px; }
  #carpool-front #footer .button img {
    height: 40px; }
#carpool-front #logos {
  padding-top: 50px; }
  #carpool-front #logos .images {
    text-align: center; }
    #carpool-front #logos .images .image {
      margin-top: 25px;
      display: inline-block;
      padding: 0px 10px; }
      #carpool-front #logos .images .image img {
        height: 50px; }
#carpool-front #landing-page {
  text-align: center;
  padding: 1px 0px;
  float: none; }
#carpool-front #case-study .title {
  font-size: 28px; }
#carpool-front #case-study .body {
  text-align: left;
  font-size: 18px; }
#carpool-front #verticals .image {
  padding-bottom: 20px; }
#carpool-front #verticals .title {
  font-size: 22px; }
#carpool-front #verticals .text {
  padding: 0; }
#carpool-front #verticals .cta {
  padding-top: 20px;
  padding-bottom: 20px; }
#carpool-front .items .item {
  clear: both;
  padding: 20px 0px; }
  #carpool-front .items .item .image {
    padding-bottom: 20px;
    text-align: center; }
    #carpool-front .items .item .image img {
      max-height: 100px; }
  #carpool-front .items .item .text {
    font-size: 20px;
    width: 100%;
    text-align: center; }
    #carpool-front .items .item .text .label {
      text-transform: uppercase;
      font-weight: bold;
      color: black; }
    #carpool-front .items .item .text .description {
      display: inline-block; }
  @media screen and (min-width: 600px) {
    #carpool-front .items .item .image {
      padding-bottom: 0px;
      width: 200px; }
    #carpool-front .items .item .text {
      width: 50%; }
    #carpool-front .items .item.left {
      width: 100%;
      float: inherit; }
      #carpool-front .items .item.left .image {
        text-align: right;
        float: left;
        padding-right: 30px; }
      #carpool-front .items .item.left .text {
        text-align: left;
        float: left; }
    #carpool-front .items .item.right {
      width: 100%;
      float: inherit; }
      #carpool-front .items .item.right .image {
        text-align: left;
        float: right;
        padding-left: 30px; }
      #carpool-front .items .item.right .text {
        float: right;
        text-align: right; } }
#carpool-front .blog .container {
  padding-top: 15px;
  padding-bottom: 15px; }
#carpool-front .blog a {
  color: black; }
#carpool-front .blog .articles {
  text-align: left; }
#carpool-front .blog .article {
  font-size: 18px;
  text-align: left; }
#carpool-front .blog .field {
  padding-top: 10px;
  width: 100%; }
  #carpool-front .blog .field label {
    font-size: 20px;
    text-align: left;
    width: 100%;
    display: block; }
  #carpool-front .blog .field .helper {
    text-align: left;
    font-size: 10px; }
  #carpool-front .blog .field textarea {
    width: 100%;
    padding: 5px; }
  #carpool-front .blog .field input, #carpool-front .blog .field select {
    width: 100%;
    padding: 5px;
    height: 30px; }
#carpool-front .blog input[type=submit] {
  margin: 20px; }
#carpool-front .blog h2 {
  background: green; }
  #carpool-front .blog h2.content-type-blog {
    background: inherit; }

.compare #header_container {
  background: #eeeeee;
  border: 1px solid #666666;
  left: 0;
  position: fixed;
  width: 100%;
  top: 0;
  padding: 10px 0px; }
  .compare #header_container #header {
    line-height: 1;
    margin: 0 auto;
    text-align: center; }
    .compare #header_container #header .buttons .button {
      float: left;
      width: 50%; }
    .compare #header_container #header .thankyou {
      display: none; }
.compare #container {
  margin: 0 auto;
  overflow: auto;
  padding: 80px 0; }
  .compare #container .images {
    width: 100%; }
    .compare #container .images .image {
      width: 50%;
      float: left;
      text-align: center; }
      .compare #container .images .image img {
        width: 75%; }

/* Have to put this on the outside because of floatingness */
.notes-icon {
  height: 16px;
  padding-right: 5px; }

.person.ui-draggable-dragging {
  z-index: 9999; }
  .person.ui-draggable-dragging .handle {
    width: 16px;
    height: 16px;
    margin-right: 10px;
    display: inline-block;
    background-image: url(images/ui-icons_72a7cf_256x240.png); }

.carpool-header {
  width: 100%;
  background-color: #d1d2d4;
  color: black;
  text-align: center;
  padding: 0;
  margin-bottom: 20px;
  font-size: 2em;
  font-family: "Helvetica Rounded";
  overflow: hidden; }
  .carpool-header .inner {
    margin: 5px 20px;
    overflow: hidden; }
    .carpool-header .inner .text {
      float: left; }
    .carpool-header .inner .links {
      float: right; }
      .carpool-header .inner .links ul {
        list-style: none;
        padding: 0;
        margin: 0; }
        .carpool-header .inner .links ul li {
          display: inline;
          padding-left: 10px; }
          .carpool-header .inner .links ul li a {
            color: black;
            font-size: 14px;
            font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
  .carpool-header button {
    cursor: pointer;
    -moz-box-shadow: inset 0px 1px 0px 0px #ffe0b5;
    -webkit-box-shadow: inset 0px 1px 0px 0px #ffe0b5;
    box-shadow: inset 0px 1px 0px 0px #ffe0b5;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #fbb450), color-stop(1, #f89306));
    background: -moz-linear-gradient(top, #fbb450 5%, #f89306 100%);
    background: -webkit-linear-gradient(top, #fbb450 5%, #f89306 100%);
    background: -o-linear-gradient(top, #fbb450 5%, #f89306 100%);
    background: -ms-linear-gradient(top, #fbb450 5%, #f89306 100%);
    background: linear-gradient(to bottom, #fbb450 5%, #f89306 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fbb450', endColorstr='#f89306',GradientType=0);
    background-color: #fbb450;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
    border: 1px solid #c97e1c;
    display: inline-block;
    color: white;
    font-family: Trebuchet MS;
    font-size: 17px;
    font-weight: bold;
    padding: 6px 11px;
    text-decoration: none;
    text-shadow: 0px 1px 0px #8f7f24; }
    .carpool-header button:hover {
      background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f89306), color-stop(1, #fbb450));
      background: -moz-linear-gradient(top, #f89306 5%, #fbb450 100%);
      background: -webkit-linear-gradient(top, #f89306 5%, #fbb450 100%);
      background: -o-linear-gradient(top, #f89306 5%, #fbb450 100%);
      background: -ms-linear-gradient(top, #f89306 5%, #fbb450 100%);
      background: linear-gradient(to bottom, #f89306 5%, #fbb450 100%);
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f89306', endColorstr='#fbb450',GradientType=0);
      background-color: #f89306; }
    .carpool-header button:active {
      position: relative;
      top: 1px; }

#carpool-list {
  /*GENERIC ELEMENTS */
  /*CONTENT DETAIL */ }
  #carpool-list .title {
    text-align: center;
    font-size: 2.5em;
    padding-bottom: 15px;
    font-family: "Helvetica Rounded", Helvetica, Arial, sans-serif;
    padding: 0;
    border: 0;
    line-height: 1; }
  #carpool-list .header {
    font-size: 2em;
    font-weight: bold;
    text-align: center;
    width: 66%; }
    @media screen and (max-width: 600px) {
      #carpool-list .header {
        float: left;
        width: 100%; } }
  #carpool-list img.join {
    cursor: pointer;
    height: 18px; }
  #carpool-list #join-waitlist img.join {
    height: 30px; }
  #carpool-list .person-wrapper {
    display: block; }
    #carpool-list .person-wrapper .person {
      display: inline-block;
      position: relative; }
      #carpool-list .person-wrapper .person .handle {
        width: 16px;
        height: 16px;
        display: none;
        background-image: none; }
      #carpool-list .person-wrapper .person:hover .handle {
        background-image: url(images/ui-icons_72a7cf_256x240.png);
        left: -16px;
        position: absolute;
        display: inline-block;
        cursor: move; }
  #carpool-list .button {
    background: none;
    filter: none;
    text-shadow: none;
    border: none;
    color: inherit;
    font-size: inherit;
    font-family: inherit;
    cursor: pointer;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    padding: 0px;
    margin: 0px; }
    #carpool-list .button.join {
      height: 22px; }
  #carpool-list .cars .car {
    width: 100%;
    padding: 20px 0px 20px 0px;
    border-bottom: 1px solid gray;
    overflow: auto; }
    #carpool-list .cars .car.add {
      padding: 0px 0px 20px 0px; }
      #carpool-list .cars .car.add .text {
        font-size: 1.6em;
        padding-top: 23px; }
        @media screen and (max-width: 800px) {
          #carpool-list .cars .car.add .text {
            display: none; } }
      @media screen and (max-width: 800px) {
        #carpool-list .cars .car.add .col2,
        #carpool-list .cars .car.add .col1 {
          width: 100%; } }
    @media screen and (max-width: 500px) {
      #carpool-list .cars .car .car-inner .summary.col3 .third {
        width: 100%; } }
    @media screen and (max-width: 500px) {
      #carpool-list .cars .car .car-inner .summary.col4 .third {
        width: 100%; } }
    #carpool-list .cars .car .car-inner .summary .first .image img {
      max-width: 170px;
      width: 100%; }
    #carpool-list .cars .car .car-inner .summary .first .name {
      width: 100%;
      color: #bdd68d;
      font-size: 1.8em;
      height: 36px;
      overflow: hidden; }
    @media screen and (max-width: 800px) {
      #carpool-list .cars .car .car-inner .summary .first .show-details {
        display: none; } }
    #carpool-list .cars .car .car-inner .summary .second .location {
      font-size: 1.2em;
      padding-top: 25px;
      display: block; }
      @media screen and (max-width: 500px) {
        #carpool-list .cars .car .car-inner .summary .second .location {
          padding-top: 0px; } }
    #carpool-list .cars .car .car-inner .summary .third .departure-direction,
    #carpool-list .cars .car .car-inner .summary .fourth .departure-direction {
      display: none; }
      @media screen and (max-width: 800px) {
        #carpool-list .cars .car .car-inner .summary .third .departure-direction,
        #carpool-list .cars .car .car-inner .summary .fourth .departure-direction {
          padding-top: 10px;
          font-weight: bold;
          display: block; } }
    #carpool-list .cars .car .car-inner .summary .third .departure-title,
    #carpool-list .cars .car .car-inner .summary .fourth .departure-title {
      padding-bottom: 10px; }
    #carpool-list .cars .car .car-inner .summary .third .passengers .to,
    #carpool-list .cars .car .car-inner .summary .third .passengers .from,
    #carpool-list .cars .car .car-inner .summary .fourth .passengers .to,
    #carpool-list .cars .car .car-inner .summary .fourth .passengers .from {
      clear: both; }
      #carpool-list .cars .car .car-inner .summary .third .passengers .to .person-image,
      #carpool-list .cars .car .car-inner .summary .third .passengers .from .person-image,
      #carpool-list .cars .car .car-inner .summary .fourth .passengers .to .person-image,
      #carpool-list .cars .car .car-inner .summary .fourth .passengers .from .person-image {
        display: inline;
        padding: 0px 1px; }
        #carpool-list .cars .car .car-inner .summary .third .passengers .to .person-image img,
        #carpool-list .cars .car .car-inner .summary .third .passengers .from .person-image img,
        #carpool-list .cars .car .car-inner .summary .fourth .passengers .to .person-image img,
        #carpool-list .cars .car .car-inner .summary .fourth .passengers .from .person-image img {
          height: 50px; }
    #carpool-list .cars .car .car-inner .summary .fifth {
      display: none; }
      @media screen and (max-width: 800px) {
        #carpool-list .cars .car .car-inner .summary .fifth {
          display: block; } }
    #carpool-list .cars .car .car-inner .summary .show-details,
    #carpool-list .cars .car .car-inner .summary .open-details {
      cursor: pointer; }
    #carpool-list .cars .car .car-inner .details-wrapper {
      display: none;
      clear: both;
      background-color: #e0e0e0;
      border: 1px solid gray;
      overflow: auto;
      padding: 10px; }
      #carpool-list .cars .car .car-inner .details-wrapper .details {
        width: 100%; }
        #carpool-list .cars .car .car-inner .details-wrapper .details .notes {
          clear: both;
          margin-top: 15px;
          padding: 5px;
          background-color: white; }
        #carpool-list .cars .car .car-inner .details-wrapper .details .departure-title {
          font-weight: bold; }
    #carpool-list .cars .car.full .car-inner .summary .first .name {
      color: #d1d2d4; }
  #carpool-list .waitlist {
    overflow: auto;
    text-align: center; }
    #carpool-list .waitlist .image {
      padding-bottom: 20px; }
    #carpool-list .waitlist .helper {
      font-size: 12px;
      margin: 0 auto;
      width: 50%; }
      #carpool-list .waitlist .helper a.add_carpool {
        color: #91d1ee; }
    #carpool-list .waitlist .list {
      overflow: auto;
      padding-top: 10px; }
  #carpool-list .car,
  #carpool-list .waitlist {
    position: relative; }
    #carpool-list .car .image img,
    #carpool-list .waitlist .image img {
      height: 76px; }
    #carpool-list .car .overlay,
    #carpool-list .waitlist .overlay {
      display: none;
      background-color: rgba(0, 0, 0, 0.5);
      height: 100%;
      width: 100%;
      z-index: 9999;
      position: absolute;
      top: 0; }
      #carpool-list .car .overlay .text,
      #carpool-list .waitlist .overlay .text {
        color: white;
        font-size: 1.75em;
        display: block;
        padding-top: 75px;
        text-align: center; }

/* Overlay */
.modal {
  display: none; }

.simplemodal-overlay {
  background-color: black; }
  .simplemodal-overlay#overlayWaitlistCar {
    background-color: #f0d799; }
  .simplemodal-overlay#overlayAddCar {
    background-color: #91d1ee; }
  .simplemodal-overlay#overlayJoinCar {
    background-color: #bdd68d; }

/* Container */
.simplemodal-container {
  width: 300px;
  color: black;
  background-color: white;
  border: 4px solid #444444;
  padding: 10px;
  overflow: hidden !important; }
  .simplemodal-container#containerWaitlistCar {
    background-color: #f0d799; }
  .simplemodal-container#containerAddCar {
    background-color: #91d1ee; }
  .simplemodal-container#containerJoinCar {
    background-color: #bdd68d; }

.modal h3 {
  color: black;
  margin-top: 0px; }
.modal .field {
  padding-bottom: 5px;
  width: 100%; }
  .modal .field label {
    width: 100px;
    display: inline-block;
    vertical-align: top; }
    .modal .field label .required {
      font-size: 10px;
      color: red;
      font-style: italic; }
    .modal .field label.error {
      width: 100%;
      color: red;
      font-size: 10px;
      font-style: italic;
      padding-left: 125px;
      text-align: left; }
  .modal .field input[type=text],
  .modal .field input[type=email],
  .modal .field input[type=password],
  .modal .field textarea,
  .modal .field select {
    display: inline-block;
    width: 150px;
    border: 1px solid grey; }
    .modal .field input[type=text].timepicker,
    .modal .field input[type=email].timepicker,
    .modal .field input[type=password].timepicker,
    .modal .field textarea.timepicker,
    .modal .field select.timepicker {
      width: 125px; }
  .modal .field input.enable {
    width: 15px; }
  .modal .field input[disabled] {
    color: #98925c;
    border: 2px inset #cfcfcf;
    background-color: #cfcfcf; }
  .modal .field textarea {
    height: 50px; }
  .modal .field .subfield {
    padding-left: 100px; }
    .modal .field .subfield label {
      display: inline-block;
      font-weight: normal; }
    .modal .field .subfield input.instructions {
      width: 200px; }
  .modal .field.optional {
    display: none; }
  .modal .field.semi_optional {
    display: block; }
  .modal .field.required label {
    font-weight: bold; }
  .modal .field.required .subfield label {
    font-weight: normal; }
.modal .fields .field {
  width: 50%;
  float: left; }
  .modal .fields .field input {
    width: 90%; }
.modal a {
  color: black; }
  .modal a.modalCloseImg {
    background: url(/assets/x.png) no-repeat;
    width: 25px;
    height: 29px;
    display: inline;
    z-index: 3200;
    position: absolute;
    top: -15px;
    right: -16px;
    cursor: pointer; }
.modal .buttons {
  padding-top: 10px;
  text-align: center; }
  .modal .buttons .extra {
    padding-top: 15px; }
    .modal .buttons .extra a {
      color: #91d1ee; }
  .modal .buttons .showmore {
    padding-bottom: 15px; }
  .modal .buttons .close {
    padding-top: 15px; }
  .modal .buttons .delete {
    display: block;
    margin-top: 25px;
    font-size: 10px; }

#just-created.modal {
  height: 325px;
  overflow: auto; }
  #just-created.modal .content {
    text-align: center; }
    #just-created.modal .content .title {
      font-weight: bold; }
    #just-created.modal .content .url {
      width: 100%; }
      #just-created.modal .content .url input {
        width: 90%; }

@media screen and (max-width: 800px) {
  .zopim {
    display: none !important; } }

@media screen and (max-width: 800px) {
  #uvTab {
    display: none !important; } }

form.new .field {
  position: relative;
  margin: 0;
  width: 290px;
  margin: 0 auto;
  line-height: 1; }
  form.new .field label {
    color: #817a70;
    width: 268px;
    height: 14px;
    padding: 11px;
    display: block;
    font-weight: bold;
    text-align: left; }
  form.new .field.input label {
    position: absolute;
    top: 0;
    left: 0;
    cursor: text; }
  form.new .field.input input.form-text {
    width: 268px;
    height: 14px;
    border: 1px solid #e2e2d8;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    padding: 10px;
    font-size: 14px;
    font-weight: bold;
    color: #817a70;
    font-family: Georgia, "Times New Roman", serif;
    margin: 0 0 15px 0; }
  form.new .field.select label {
    padding-left: 8px; }
  form.new .field.select select {
    width: 100%;
    height: 40px;
    border: 1px solid #e2e2d8;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: bold;
    color: #817a70;
    margin: 0 0 15px 0; }
  form.new .field.textarea label {
    position: absolute;
    top: 0;
    left: 0;
    cursor: text; }
  form.new .field.textarea textarea.form-text {
    width: 268px;
    height: 56px;
    border: 1px solid #e2e2d8;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    padding: 10px;
    font-size: 14px;
    font-weight: bold;
    color: #817a70;
    font-family: Georgia, "Times New Roman", serif;
    margin: 0 0 15px 0; }
  form.new .field .extra {
    font-size: 12px;
    padding-bottom: 15px;
    line-height: 1.5; }
form.new input[type=submit] {
  cursor: pointer;
  -moz-box-shadow: inset 0px 1px 0px 0px #ffe0b5;
  -webkit-box-shadow: inset 0px 1px 0px 0px #ffe0b5;
  box-shadow: inset 0px 1px 0px 0px #ffe0b5;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #fbb450), color-stop(1, #f89306));
  background: -moz-linear-gradient(top, #fbb450 5%, #f89306 100%);
  background: -webkit-linear-gradient(top, #fbb450 5%, #f89306 100%);
  background: -o-linear-gradient(top, #fbb450 5%, #f89306 100%);
  background: -ms-linear-gradient(top, #fbb450 5%, #f89306 100%);
  background: linear-gradient(to bottom, #fbb450 5%, #f89306 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fbb450', endColorstr='#f89306',GradientType=0);
  background-color: #fbb450;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  border-radius: 7px;
  border: 1px solid #c97e1c;
  display: inline-block;
  color: white;
  font-family: Trebuchet MS;
  font-size: 17px;
  font-weight: bold;
  padding: 6px 11px;
  text-decoration: none;
  text-shadow: 0px 1px 0px #8f7f24; }
  form.new input[type=submit]:hover {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f89306), color-stop(1, #fbb450));
    background: -moz-linear-gradient(top, #f89306 5%, #fbb450 100%);
    background: -webkit-linear-gradient(top, #f89306 5%, #fbb450 100%);
    background: -o-linear-gradient(top, #f89306 5%, #fbb450 100%);
    background: -ms-linear-gradient(top, #f89306 5%, #fbb450 100%);
    background: linear-gradient(to bottom, #f89306 5%, #fbb450 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f89306', endColorstr='#fbb450',GradientType=0);
    background-color: #f89306; }
  form.new input[type=submit]:active {
    position: relative;
    top: 1px; }
form.new #error_explanation {
  color: red; }
  form.new #error_explanation ul li {
    list-style: none; }
form.new .options {
  clear: both;
  margin-bottom: 20px; }
  form.new .options.survey.col4 {
    width: 100%; }
    form.new .options.survey.col4 .col1 {
      width: 23%; }
      @media screen and (max-width: 900px) {
        form.new .options.survey.col4 .col1 {
          width: 50%; } }
      @media screen and (max-width: 500px) {
        form.new .options.survey.col4 .col1 {
          width: 100%; } }
  form.new .options .option {
    padding-bottom: 15px; }
    form.new .options .option .inner {
      padding-left: 5px;
      padding-right: 5px; }
      form.new .options .option .inner .title {
        font-size: 18px;
        font-weight: strong;
        padding-bottom: 10px; }
        form.new .options .option .inner .title .radio {
          padding-bottom: 5px; }
      form.new .options .option .inner .description {
        padding-bottom: 5px;
        font-size: 14px;
        line-height: 1.8; }
        form.new .options .option .inner .description ul {
          text-align: left; }
          @media screen and (max-width: 900px) {
            form.new .options .option .inner .description ul {
              text-align: center; } }
          form.new .options .option .inner .description ul li {
            list-style: none; }
      form.new .options .option .inner .example {
        font-size: 12px;
        font-style: italic; }
form.new .fields {
  clear: both; }
form.new .plan .amount {
  text-align: left;
  padding-left: 10px;
  font-weight: bold;
  margin-bottom: 20px; }

form.new2 .options {
  padding-bottom: 20px; }
  form.new2 .options .option .inner {
    padding-left: 40px;
    padding-right: 40px; }
    form.new2 .options .option .inner img {
      width: 100%; }
    form.new2 .options .option .inner .description {
      font-size: 12px; }
  form.new2 .options .option.option_four .inner {
    border-right: 1px solid black; }
form.new2 .cta {
  clear: both; }

.message {
  width: 100%;
  border: 1px solid #7e7900;
  background-color: #f8eea2;
  padding: 20px;
  margin-bottom: 30px; }
  .message .text {
    color: #7e7900; }

form.edit .field {
  clear: both;
  width: 400px;
  margin: 0 auto;
  overflow: hidden; }
  form.edit .field label, form.edit .field .label {
    color: black;
    cursor: text;
    display: block;
    font-weight: bold;
    text-align: left;
    float: left;
    padding-top: 7px;
    margin-right: 10px;
    width: 125px; }
  form.edit .field input.form-text, form.edit .field select {
    float: left;
    height: 14px;
    border: 1px solid #e2e2d8;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    padding: 10px;
    font-size: 14px;
    font-weight: bold;
    color: #817a70;
    font-family: Georgia, "Times New Roman", serif;
    margin: 0 0 15px 0;
    width: 240px; }
  form.edit .field select {
    height: 36px;
    width: 262px; }
  form.edit .field .radios {
    float: left;
    padding-top: 5px; }
    form.edit .field .radios .radio {
      text-align: left;
      padding-bottom: 10px; }
      form.edit .field .radios .radio label {
        float: none;
        display: inline-block;
        width: auto;
        padding: 0;
        font-weight: normal;
        cursor: pointer; }
  form.edit .field .checkbox input {
    float: left;
    margin-top: 10px; }
  form.edit .field .checkbox label {
    float: left;
    padding-left: 5px;
    font-weight: normal;
    display: inline-block;
    width: auto;
    cursor: pointer; }
form.edit input[type=submit] {
  margin-top: 20px;
  cursor: pointer;
  -moz-box-shadow: inset 0px 1px 0px 0px #ffe0b5;
  -webkit-box-shadow: inset 0px 1px 0px 0px #ffe0b5;
  box-shadow: inset 0px 1px 0px 0px #ffe0b5;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #fbb450), color-stop(1, #f89306));
  background: -moz-linear-gradient(top, #fbb450 5%, #f89306 100%);
  background: -webkit-linear-gradient(top, #fbb450 5%, #f89306 100%);
  background: -o-linear-gradient(top, #fbb450 5%, #f89306 100%);
  background: -ms-linear-gradient(top, #fbb450 5%, #f89306 100%);
  background: linear-gradient(to bottom, #fbb450 5%, #f89306 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fbb450', endColorstr='#f89306',GradientType=0);
  background-color: #fbb450;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  border-radius: 7px;
  border: 1px solid #c97e1c;
  display: inline-block;
  color: white;
  font-family: Trebuchet MS;
  font-size: 17px;
  font-weight: bold;
  padding: 6px 11px;
  text-decoration: none;
  text-shadow: 0px 1px 0px #8f7f24; }
  form.edit input[type=submit]:hover {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f89306), color-stop(1, #fbb450));
    background: -moz-linear-gradient(top, #f89306 5%, #fbb450 100%);
    background: -webkit-linear-gradient(top, #f89306 5%, #fbb450 100%);
    background: -o-linear-gradient(top, #f89306 5%, #fbb450 100%);
    background: -ms-linear-gradient(top, #f89306 5%, #fbb450 100%);
    background: linear-gradient(to bottom, #f89306 5%, #fbb450 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f89306', endColorstr='#fbb450',GradientType=0);
    background-color: #f89306; }
  form.edit input[type=submit]:active {
    position: relative;
    top: 1px; }
form.edit #error_explanation {
  color: red; }
  form.edit #error_explanation ul li {
    list-style: none; }

.notice {
  width: 100%;
  padding: 7px;
  text-align: center;
  background-color: #fcd183;
  display: block;
  clear: both; }
  .notice li {
    list-style: none; }
  .notice h2 {
    font-size: 1.4em; }

.ui-timepicker-div dl dt, .ui-timepicker-div dl dd {
  display: inline-block; }

/* Logged in HEADER */
#header-app {
  background-color: #d1d2d4;
  padding: 20px; }
  #header-app ul {
    list-style: none;
    padding: 0px;
    text-align: right;
    margin: 0; }
  #header-app li {
    display: inline-block;
    padding-left: 20px; }

/* USER LINKS */
ul.devise-links {
  list-style: none;
  padding-left: 0; }

/* User List Page */
.user_show {
  padding-top: 10px;
  border: 0;
  background-color: transparent;
  background: transparent; }
  .user_show .created-trips {
    width: 100%;
    clear: both; }
    .user_show .created-trips .created-trip {
      clear: both;
      padding: 15px 30px 15px 20px;
      margin: 0 20px 10px 20px;
      overflow: hidden;
      background-color: #e3e3e2;
      border-top: 1px solid #b9b9b9;
      border-bottom: 1px solid #b9b9b9; }
      .user_show .created-trips .created-trip.active {
        background-color: #eef7fc; }
      .user_show .created-trips .created-trip .info {
        width: 95%;
        float: left; }
      .user_show .created-trips .created-trip .top {
        width: 100%;
        float: left; }
      .user_show .created-trips .created-trip .bottom {
        float: left;
        width: 100%;
        padding: 20px 0px 0px 0px;
        display: none; }
        .user_show .created-trips .created-trip .bottom.active {
          display: block; }
      .user_show .created-trips .created-trip .left {
        float: left;
        width: 50%; }
      .user_show .created-trips .created-trip .right {
        float: left;
        width: 50%;
        padding-top: 5px;
        padding-bottom: 0px; }
      .user_show .created-trips .created-trip .extra {
        float: left;
        width: 5%; }
      .user_show .created-trips .created-trip .action {
        float: left;
        cursor: pointer; }
      .user_show .created-trips .created-trip .name {
        font-family: "Museo Sans 700";
        font-size: 1.5em;
        padding-bottom: 1px;
        text-shadow: 0 1px 0 rgba(0, 0, 0, 0.51);
        text-align: left; }
        .user_show .created-trips .created-trip .name a {
          color: black !important; }
      .user_show .created-trips .created-trip .date {
        float: left;
        padding-top: 4px;
        color: black;
        font-size: 0.85714em; }
      .user_show .created-trips .created-trip .stats {
        text-align: left; }
        .user_show .created-trips .created-trip .stats .stat {
          display: inline-block;
          padding-right: 20px;
          text-align: center; }
          .user_show .created-trips .created-trip .stats .stat .amount {
            font-size: 20px;
            font-weight: bold; }

.plans .five-large {
  float: left;
  width: 20%; }
  @media screen and (max-width: 800px) {
    .plans .five-large {
      display: none; } }
.plans .four-medium {
  float: left; }
  @media screen and (max-width: 800px) {
    .plans .four-medium {
      display: block;
      width: 50%;
      padding-bottom: 50px; } }
  @media screen and (max-width: 500px) {
    .plans .four-medium {
      display: block;
      width: 100%;
      padding-bottom: 50px; } }
.plans .plan .name {
  font-size: 24px;
  font-weight: bold;
  padding-bottom: 10px; }
.plans .plan .price {
  font-size: 18px;
  padding-bottom: 10px; }
.plans .plan .cta {
  min-height: 59px;
  padding-bottom: 20px; }
.plans .plan .other {
  font-style: italic;
  padding-bottom: 20px; }
.plans .plan .features .feature {
  padding-bottom: 5px;
  padding-top: 5px;
  min-height: 22px;
  text-align: center;
  font-size: 14px;
  border-bottom: 1px solid #d1d2d4; }
  .plans .plan .features .feature .fa {
    font-size: 22px;
    color: #bdd68d; }
  .plans .plan .features .feature.bold {
    font-weight: bold; }
