@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,700");
@keyframes bounce {
  from {
    transform: translate3d(0, 0, 0); }
  to {
    transform: translate3d(0, 40px, 0); } }
@media only screen and (max-width: 768px) {
  h2 {
    font-size: 2.4rem; }

  /* Modal */
  #modal {
    width: 100vw;
    height: 100vh; }
    #modal .photo {
      width: 100vw;
      height: 320px;
      background-position: top center; }
      #modal .photo .close {
        padding: 20px; }
      #modal .photo .title h3 {
        font-size: 2.4rem; }
      #modal .photo .bounce {
        display: none; }
    #modal .text {
      font-size: 1rem; }

  /* Carousel */
  .carousel .carousel-caption {
    top: .5rem; }
    .carousel .carousel-caption h1 {
      font-size: 2.4rem; }
    .carousel .carousel-caption .btn {
      display: none; }
  .carousel .caption-1 {
    display: none; }
  .carousel .carousel-item {
    height: 30vh; }

  /* Main */
  main {
    /* Invisalign */
    /* Events */ }
    main section#invisalign .video {
      height: 150px; }
      main section#invisalign .video h2 {
        font-size: 2.4rem; }
    main section#events .item {
      position: relative; }
      main section#events .item .gallery {
        display: none; }

  /* Footer */
  .footer div {
    width: 100%;
    text-align: center;
    clear: both; } }

/*# sourceMappingURL=responsive.css.map */