html,
body {
  margin: 0;
  padding: 0;
  font-size: 16px; }
  @media only screen and (max-width: 600px) {
    html,
    body {
      font-size: 3vw; } }

section {
  padding: 3em 0; }

h1,
h2,
h3,
h4,
h5,
h6,
p,
a {
  font-family: "Lato", Verdana, sans-serif;
  padding: 0;
  margin: 0;
  position: relative; }

h1 {
  font-size: 4rem;
  font-weight: 700;
  letter-spacing: 0.5px; }

h2 {
  font-size: 2.1rem;
  font-weight: 700;
  letter-spacing: 0.5px; }
  section h2 {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    margin: 20px 0;
    padding: 0 10px;
    border-left: 10px solid #3095D9;
    color: #242424; }

h3 {
  font-size: 2.1rem;
  font-weight: 400;
  letter-spacing: 0.5px; }

h4 {
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  color: #3095D9; }

h5 {
  font-size: 1.7rem;
  font-weight: 700;
  font-style: italic;
  letter-spacing: 0.5px;
  color: #B9B9B9; }

h6 {
  font-size: 1.5rem;
  font-weight: 400;
  font-style: italic;
  letter-spacing: 0.5px;
  color: #B9B9B9; }

p,
a {
  font-size: 1.1rem;
  font-weight: 400;
  letter-spacing: 0.4px; }

p,
.cta {
  margin: 20px 0; }

.container-fluid {
  padding-left: 10vw;
  padding-right: 10vw; }

header {
  width: 100%;
  height: 100vh;
  position: relative;
  overflow: hidden;
  margin-bottom: 10vw;
  background: url("../assets/img/screenshot.jpg") no-repeat center center;
  background-size: cover; }
  header:before, header:after {
    content: '';
    position: absolute;
    height: 0;
    width: 0;
    bottom: 0;
    z-index: 1000;
    border-bottom: 9vw solid #FFF; }
  header:before {
    left: 0;
    border-right: 50vw solid transparent; }
  header:after {
    right: 0;
    border-left: 50vw solid transparent; }
  header .menu {
    position: absolute;
    top: 3em;
    right: 3em;
    color: #FFF;
    height: 4em;
    width: 4em;
    cursor: pointer; }
    header .menu .bar {
      height: 100%;
      width: 100%; }
      header .menu .bar::before, header .menu .bar::after {
        content: '';
        display: block;
        position: absolute;
        background: #FFF;
        -webkit-box-shadow: 1px 1px #55504C;
        box-shadow: 1px 1px #55504C;
        height: 0.6em;
        width: 100%;
        border-radius: 0.3em;
        -webkit-transition: all 0.3s ease-in-out 0.6s;
        -o-transition: all 0.3s ease-in-out 0.6s;
        transition: all 0.3s ease-in-out 0.6s; }
      header .menu .bar::before {
        top: 0.6em; }
      header .menu .bar::after {
        top: 2.8em; }
    header .menu.active .bar::before, header .menu.active .bar::after {
      background: #EDEDED;
      -webkit-box-shadow: none;
      box-shadow: none; }
    header .menu.active .bar::before {
      top: 50%;
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg); }
    header .menu.active .bar::after {
      top: 50%;
      -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      transform: rotate(-45deg); }
    header .menu .nav-bar {
      height: 0.6em;
      width: 100%;
      border-radius: 0.3em;
      display: block;
      position: absolute;
      top: 1.7em;
      right: 0;
      background: #FFF;
      -webkit-box-shadow: 1px 1px #55504C;
      box-shadow: 1px 1px #55504C;
      z-index: 99999;
      -webkit-transition: height 0.3s ease-in-out, top 0.3s ease-in-out 0.3s, width 0.3s ease-in-out 0.6s, right 0.3s ease-in-out 0.6s, background 0.3s ease-in-out 0.3s;
      -o-transition: height 0.3s ease-in-out, top 0.3s ease-in-out 0.3s, width 0.3s ease-in-out 0.6s, right 0.3s ease-in-out 0.6s, background 0.3s ease-in-out 0.3s;
      transition: height 0.3s ease-in-out, top 0.3s ease-in-out 0.3s, width 0.3s ease-in-out 0.6s, right 0.3s ease-in-out 0.6s, background 0.3s ease-in-out 0.3s; }
      header .menu .nav-bar .content {
        opacity: 0;
        height: 0;
        overflow: hidden;
        -webkit-transition: opacity 0.3s ease-in-out 0, height 0.3s ease-in-out 0;
        -o-transition: opacity 0.3s ease-in-out 0, height 0.3s ease-in-out 0;
        transition: opacity 0.3s ease-in-out 0, height 0.3s ease-in-out 0; }
    header .menu.active .nav-bar {
      height: 85vh;
      width: calc(100vw - 10em);
      border-radius: 0.3em;
      display: block;
      position: absolute;
      top: 0;
      right: 100%;
      background: #3095D9;
      -webkit-transition: width 0.3s ease-in-out, right 0.3s ease-in-out, top 0.3s ease-in-out 0.3s, height 0.3s ease-in-out 0.6s, background 0.3s ease-in-out 0.3s, padding 0.3s ease-in-out 0.3s;
      -o-transition: width 0.3s ease-in-out, right 0.3s ease-in-out, top 0.3s ease-in-out 0.3s, height 0.3s ease-in-out 0.6s, background 0.3s ease-in-out 0.3s, padding 0.3s ease-in-out 0.3s;
      transition: width 0.3s ease-in-out, right 0.3s ease-in-out, top 0.3s ease-in-out 0.3s, height 0.3s ease-in-out 0.6s, background 0.3s ease-in-out 0.3s, padding 0.3s ease-in-out 0.3s;
      z-index: 99999;
      padding: 3em 0 0;
      -webkit-box-shadow: none;
      box-shadow: none;
      cursor: default; }
      header .menu.active .nav-bar .menu-branding h5 {
        color: #FFF;
        font-style: normal;
        font-weight: 100; }
      header .menu.active .nav-bar .menu-branding h3 {
        text-shadow: none; }
      header .menu.active .nav-bar .menu-branding hr {
        width: 10%;
        height: 0;
        border-top: 1px solid #FFF;
        border-bottom: 1px solid #FFF;
        margin: 0.5em auto;
        text-shadow: none;
        -webkit-box-shadow: none;
        box-shadow: none; }
        @media only screen and (max-width: 767px) {
          header .menu.active .nav-bar .menu-branding hr {
            width: 15%; } }
      header .menu.active .nav-bar .menu-branding h5, header .menu.active .nav-bar .menu-branding h3 {
        padding: 0.5em 0; }
      header .menu.active .nav-bar .content {
        display: block;
        position: relative;
        opacity: 1;
        height: 100%;
        width: 100%;
        z-index: 9999;
        -webkit-transition: opacity 0.6s ease-in-out 0.9s, height 0.3s ease-in-out 0.9s;
        -o-transition: opacity 0.6s ease-in-out 0.9s, height 0.3s ease-in-out 0.9s;
        transition: opacity 0.6s ease-in-out 0.9s, height 0.3s ease-in-out 0.9s; }
        header .menu.active .nav-bar .content span {
          color: #FFF; }
        header .menu.active .nav-bar .content .fa-stack-1x {
          color: #3095D9; }
        header .menu.active .nav-bar .content a {
          text-decoration: none; }
        header .menu.active .nav-bar .content .row {
          padding-bottom: 1em; }
          @media only screen and (max-width: 767px) {
            header .menu.active .nav-bar .content .row .social-icons {
              margin-top: 0.6em; } }
        header .menu.active .nav-bar .content ul {
          list-style-type: none;
          margin: 0;
          padding: 0; }
          header .menu.active .nav-bar .content ul li a {
            color: #FFF;
            text-decoration: none;
            font-size: 1.6rem;
            font-weight: 700;
            line-height: 7vh;
            letter-spacing: 0.7px; }
  header .branding {
    position: relative;
    display: inline-block;
    top: 40%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: #FFF;
    text-align: center; }
    header .branding hr {
      width: 10%;
      height: 0;
      border-top: 1px solid #FFF;
      border-bottom: 1px solid #FFF; }
  header #bgndVideo {
    width: 100%;
    height: 100vh;
    position: absolute; }
  header h3,
  header h1 {
    text-shadow: 1px 1px #55504C; }
  header hr {
    -webkit-box-shadow: 1px 1px #55504C;
    box-shadow: 1px 1px #55504C; }

.thumbnails {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }
  .thumbnails img {
    margin: 1vw auto;
    max-height: 200px;
    height: auto;
    max-width: 100%;
    position: relative; }
    @media only screen and (min-width: 1000px) {
      .thumbnails img {
        margin: 10px auto; } }
  .thumbnails a {
    position: relative;
    display: block; }
  .thumbnails .thumb-overlay {
    display: block;
    width: 100%;
    position: absolute;
    text-align: center;
    font-weight: 700;
    bottom: 0.1em;
    letter-spacing: 0.9px; }
  .thumbnails .fa-play-circle-o {
    font-size: 4em;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }
  .thumbnails .thumb-overlay,
  .thumbnails .fa-play-circle-o {
    color: rgba(255, 255, 255, 0.7);
    -webkit-transition: color 0.3s ease;
    -o-transition: color 0.3s ease;
    transition: color 0.3s ease; }
  .thumbnails a:hover .thumb-overlay,
  .thumbnails a:hover .fa-play-circle-o {
    color: white; }

.testi-slider {
  display: block; }
  .testi-slider #next-btn,
  .testi-slider #prev-btn {
    display: block;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    cursor: pointer;
    text-align: center; }

#clients-wrapper {
  padding-bottom: 0; }
  #clients-wrapper #clients {
    background: #EDEDED;
    padding: 3em 0; }
    #clients-wrapper #clients .image-list {
      height: 8em; }
      #clients-wrapper #clients .image-list [class*="col"] {
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center; }
    #clients-wrapper #clients img {
      max-width: 100%;
      max-height: 6em;
      margin: 0 auto;
      display: block;
      position: relative; }

#weddings-wrapper {
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(36, 36, 36, 0.5)), to(rgba(36, 36, 36, 0.5))), url("../assets/img/wedding-bg.jpg") no-repeat right 20%;
  background: -webkit-linear-gradient(rgba(36, 36, 36, 0.5), rgba(36, 36, 36, 0.5)), url("../assets/img/wedding-bg.jpg") no-repeat right 20%;
  background: -o-linear-gradient(rgba(36, 36, 36, 0.5), rgba(36, 36, 36, 0.5)), url("../assets/img/wedding-bg.jpg") no-repeat right 20%;
  background: linear-gradient(rgba(36, 36, 36, 0.5), rgba(36, 36, 36, 0.5)), url("../assets/img/wedding-bg.jpg") no-repeat right 20%;
  background-size: cover;
  color: #FFF;
  position: relative;
  padding-bottom: 0.5em; }
  #weddings-wrapper h2 {
    color: #FFF; }
  #weddings-wrapper h3 {
    font-weight: 700; }
  #weddings-wrapper p {
    margin: 0;
    padding: 40px 0;
    font-size: 1.4rem;
    letter-spacing: 0.5px; }
  #weddings-wrapper .cta {
    padding: 0.5em 3em;
    border: none;
    border-radius: 2em;
    background: #FFF;
    color: #55504C;
    text-decoration: none;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear; }
    #weddings-wrapper .cta:hover {
      background: #3095D9;
      color: #FFF; }

#wedding-levels {
  overflow: hidden;
  padding: 0;
  -webkit-transition: height 0.3s ease;
  -o-transition: height 0.3s ease;
  transition: height 0.3s ease; }
  #wedding-levels.visible {
    padding: 3em 0; }
    #wedding-levels.visible p,
    #wedding-levels.visible .fa {
      font-size: 1em;
      padding: 0.2em 0;
      margin: 0.2em 0; }
    #wedding-levels.visible .fa-check-circle-o {
      color: #27ae60;
      font-size: 1.4em; }
    #wedding-levels.visible .fa-times-circle-o {
      color: #b1000d;
      font-size: 1.4em; }

footer {
  background: #3EA9E2;
  color: #FFF;
  padding: 3em 0;
  text-align: center; }
  footer a {
    margin: 0 auto; }
  footer .fa-stack-2x {
    color: #FFF; }
  footer .fa-stack-1x {
    color: #3EA9E2; }
  footer .social-icons {
    padding-bottom: 2em; }
