.heading-font {
   font-family: Catamaran,Helvetica,Arial,sans-serif;
   font-weight: 200;
   letter-spacing: 1px;
}

.body-font {
   font-family: Muli,Helvetica,Arial,sans-serif;
}

.alt-font {
   font-family: Lato,Helvetica,Arial,sans-serif;
   text-transform: uppercase;
   letter-spacing: 2px;
}

body, html {
   height: 100%;
   width: 100%;
}

body {
   font-family: Muli,Helvetica,Arial,sans-serif;
   webkit-tap-highlight-color: #222;
}

.navbar-default, .navbar-default .navbar-header .navbar-brand, h1, h2, h3, h4, h5, h6 {
   font-family: Catamaran,Helvetica,Arial,sans-serif;
   font-weight: 200;
   letter-spacing: 1px;
}

a {
   -webkit-transition: all .35s;
   -moz-transition: all .35s;
   transition: all .35s;
   color: #fdcc52;
}

   a:focus, a:hover {
      color: #fcbd20;
   }

hr {
   max-width: 100px;
   margin: 25px auto 0;
   border-width: 1px;
   border-color: rgba(34,34,34,.1);
}

   hr.light {
      border-color: #fff;
   }

p {
   font-size: 18px;
   line-height: 1.5;
   margin-bottom: 20px;
}

.navbar-default {
   background-color: #fff;
   border-color: rgba(34,34,34,.05);
   -webkit-transition: all .35s;
   -moz-transition: all .35s;
   transition: all .35s;
}

   .navbar-default .navbar-header .navbar-brand {
      color: #fdcc52;
   }

   .btn, .navbar-default .nav > li > a {
      font-family: Lato,Helvetica,Arial,sans-serif;
      text-transform: uppercase;
      letter-spacing: 2px;
   }

   .navbar-default .navbar-header .navbar-brand:focus, .navbar-default .navbar-header .navbar-brand:hover {
      color: #fcbd20;
   }

   .navbar-default .navbar-header .navbar-toggle {
      font-size: 12px;
      color: #222;
      padding: 8px 10px;
   }

   .navbar-default .nav > li > a {
      font-size: 11px;
   }

      .navbar-default .nav > li > a, .navbar-default .nav > li > a:focus {
         color: #222;
      }

         .navbar-default .nav > li > a:focus:hover, .navbar-default .nav > li > a:hover {
            color: #fdcc52;
         }

   .navbar-default .nav > li.active > a, .navbar-default .nav > li.active > a:focus {
      color: #fdcc52 !important;
      background-color: transparent;
   }

      .navbar-default .nav > li.active > a:focus:hover, .navbar-default .nav > li.active > a:hover {
         background-color: transparent;
      }

@media (min-width:768px) {
   .navbar-default {
      background-color: transparent;
      border-color: transparent;
   }

      .navbar-default .navbar-header .navbar-brand {
         color: rgba(255,255,255,.7);
      }

         .navbar-default .navbar-header .navbar-brand:focus, .navbar-default .navbar-header .navbar-brand:hover {
            color: #fff;
         }

      .navbar-default .nav > li > a, .navbar-default .nav > li > a:focus {
         color: rgba(255,255,255,.7);
      }

         .navbar-default .nav > li > a:focus:hover, .navbar-default .nav > li > a:hover {
            color: #fff;
         }

      .navbar-default.affix {
         background-color: #fff;
         border-color: rgba(34,34,34,.1);
      }

         .navbar-default.affix .navbar-header .navbar-brand {
            color: #222;
         }

            .navbar-default.affix .navbar-header .navbar-brand:focus, .navbar-default.affix .navbar-header .navbar-brand:hover {
               color: #fdcc52;
            }

         .navbar-default.affix .nav > li > a, .navbar-default.affix .nav > li > a:focus {
            color: #222;
         }

            .navbar-default.affix .nav > li > a:focus:hover, .navbar-default.affix .nav > li > a:hover {
               color: #fdcc52;
            }
}

header {
   position: relative;
   width: 100%;
   min-height: auto;
   overflow-y: hidden;
   background: url(../img/bg-pattern.png),#7b4397;
   background: url(../img/bg-pattern.png),-webkit-linear-gradient(to left,#7b4397,#dc2430);
   background: url(../img/bg-pattern.png),linear-gradient(to left,#7b4397,#dc2430);
   color: #fff;
}

   header .header-content {
      text-align: center;
      padding: 150px 0 50px;
      position: relative;
   }

      header .header-content .header-content-inner {
         position: relative;
         max-width: 500px;
         margin: 0 auto;
      }

         header .header-content .header-content-inner h1 {
            margin-top: 0;
            margin-bottom: 30px;
            font-size: 30px;
         }

         header .header-content .header-content-inner .list-badges {
            margin-bottom: 25px;
         }

            header .header-content .header-content-inner .list-badges img {
               height: 50px;
               margin-bottom: 25px;
            }

   header .device-container {
      max-width: 300px;
      margin: 0 auto 100px;
   }

      header .device-container .screen img {
         border-radius: 3px;
      }

@media (min-width:768px) {
   header {
      min-height: 100%;
   }

      header .header-content {
         text-align: left;
         padding: 0;
         height: 100vh;
      }

         header .header-content .header-content-inner {
            max-width: none;
            margin: 0;
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
         }

            header .header-content .header-content-inner h1 {
               font-size: 35px;
            }

      header .device-container {
         max-width: none;
         max-height: calc(0vh);
         margin: 250px auto 0;
      }
}

footer, section.contact {
   text-align: center;
}

@media (min-width:992px) {
   header .header-content .header-content-inner h1 {
      font-size: 50px;
   }
}

section {
   padding: 100px 0;
}

   section h2 {
      font-size: 50px;
   }

   section.download {
      padding: 150px 0;
      position: relative;
   }

      section.download h2 {
         margin-top: 0;
         font-size: 50px;
      }

      section.download .badges .badge-link {
         display: block;
         margin-bottom: 25px;
      }

         section.download .badges .badge-link:last-child {
            margin-bottom: 0;
         }

         section.download .badges .badge-link img {
            height: 60px;
         }

@media (min-width:768px) {
   section.download .badges .badge-link {
      display: inline-block;
      margin-bottom: 0;
   }

   section.download h2 {
      font-size: 70px;
   }
}

section.features .section-heading {
   margin-bottom: 100px;
}

   section.features .section-heading h2 {
      margin-top: 0;
   }

   section.features .section-heading p {
      margin-bottom: 0;
   }

section.features .device-container, section.features .feature-item {
   max-width: 300px;
   margin: 0 auto;
}

section.features .device-container {
   margin-bottom: 100px;
}

@media (min-width:992px) {
   section.features .device-container {
      margin-bottom: 0;
   }

   section.features .device-container, section.features .feature-item {
      max-width: none;
   }
}

section.features .feature-item {
   text-align: center;
   margin-bottom: 100px;
}

section.contact h2, section.cta .cta-content h2 {
   margin-top: 0;
   margin-bottom: 25px;
}

section.features .feature-item h3 {
   font-size: 30px;
}

section.features .feature-item i {
   font-size: 80px;
   background: -webkit-linear-gradient(to left,#7b4397,#dc2430);
   background: linear-gradient(to left,#7b4397,#dc2430);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
}

section.cta {
   position: relative;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   background-size: cover;
   -o-background-size: cover;
   background-position: center;
   background-image: url(../img/bg-cta.jpg);
   padding: 250px 0;
}

   section.cta .cta-content {
      position: relative;
      z-index: 1;
   }

      section.cta .cta-content h2 {
         color: #fff;
         max-width: 450px;
         font-size: 50px;
      }

@media (min-width:768px) {
   section.cta .cta-content h2 {
      font-size: 80px;
   }
}

section.cta .overlay {
   height: 100%;
   width: 100%;
   background-color: rgba(0,0,0,.5);
   position: absolute;
   top: 0;
   left: 0;
}

footer ul, section.contact ul.list-social {
   margin-bottom: 0;
}

section.contact h2 i {
   color: #dd4b39;
}

section.contact ul.list-social li a {
   display: block;
   height: 80px;
   width: 80px;
   line-height: 80px;
   font-size: 40px;
   border-radius: 100%;
   color: #fff;
}

footer p, footer ul li a {
   font-size: 12px;
}

footer, footer ul li a {
   color: rgba(255,255,255,.3);
}

section.contact ul.list-social li.social-twitter a {
   background-color: #1da1f2;
}

   section.contact ul.list-social li.social-twitter a:hover {
      background-color: #0d95e8;
   }

section.contact ul.list-social li.social-facebook a {
   background-color: #3b5998;
}

   section.contact ul.list-social li.social-facebook a:hover {
      background-color: #344e86;
   }

section.contact ul.list-social li.social-google-plus a {
   background-color: #dd4b39;
}

   section.contact ul.list-social li.social-google-plus a:hover {
      background-color: #d73925;
   }

footer {
   background-color: #222;
   padding: 25px 0;
}

   footer p {
      margin: 0;
   }

   footer ul li a.active, footer ul li a:active, footer ul li a:focus, footer ul li a:hover {
      text-decoration: none;
   }

.bg-primary {
   background: #fdcc52;
   background: -webkit-linear-gradient(#fdcc52,#fdc539);
   background: linear-gradient(#fdcc52,#fdc539);
}

.text-primary {
   color: #fdcc52;
}

.no-gutter > [class*=col-] {
   padding-right: 0;
   padding-left: 0;
}

.btn-outline {
   color: #fff;
   border: 1px solid;
}

   .btn-outline.active, .btn-outline:active, .btn-outline:focus, .btn-outline:hover {
      color: #fff;
      background-color: #fdcc52;
      border-color: #fdcc52;
   }

.btn {
   border-radius: 300px;
}

.btn-xl {
   padding: 15px 45px;
   font-size: 11px;
}

::-moz-selection {
   color: #fff;
   text-shadow: none;
   background: #222;
}

::selection {
   color: #fff;
   text-shadow: none;
   background: #222;
}

img::selection {
   color: #fff;
   background: 0 0;
}

img::-moz-selection {
   color: #fff;
   background: 0 0;
}