@charset "UTF-8";
/*-------------------------------------------------------------*/
/*===========================================*/
/*Product Name : Silva — Beautiful App HTML Template*/
/*Author: Kenul Jain*/
/*Version : 1.0 (Initial Release)*/
/*File Name : base.css*/
/*===========================================*/
/*-------------------------------------------------------------*/
/*-------------------------------------------------------------*/
/*===========================================*/
/*                               Table of Contents                                       */
/*===========================================*/
/*-------------------------------------------------------------*/
/* 	1. Medium Screens (1440X900) 	*/
/* 	2. Tablets (>768) 	*/
/* 	3. Mobiles (<768) 	*/
/*-------------------------------------------------------------*/
/*-------------------------------------------------------------*/
/*===========================================*/
/*                      1. Medium Screens (1440X900)                    */
/*===========================================*/
/*-------------------------------------------------------------*/
@media (min-width: 1200px) and (max-width: 1599px) {
  /*===========================================*/
  /*	Container Styles	*/
  /*===========================================*/
  .container-full {
    width: 90%;
  }
  /*===========================================*/
  /*	iPhone Styles	*/
  /*===========================================*/
  .iphone-left img {
    margin-left: auto;
    margin-right: 0;
  }
  .iphone-right img {
    margin-left: 0;
    margin-right: auto;
  }
  .iphone-float img {
    margin-left: auto;
    margin-right: auto;
  }
  /*===========================================*/
  /*	Video Styles	*/
  /*===========================================*/
  .video {
    width: 80%;
    margin: 0 auto;
    padding-top: 45% !important;
  }
  /*===========================================*/
  /*	Review Styles	*/
  /*===========================================*/
  .review {
    padding-left: 6em;
    padding-right: 6em;
  }
  /*===========================================*/
  /*	Social Links Styles	*/
  /*===========================================*/
  .social li {
    margin-right: 2.5em;
  }
  /*===========================================*/
  /*	Nav Links Styles	*/
  /*===========================================*/
  nav.main li {
    padding-right: 2.5em;
  }
}

/*-------------------------------------------------------------*/
/*===========================================*/
/*           			      2. Tablets (>768)        		                   */
/*===========================================*/
/*-------------------------------------------------------------*/
@media (min-width: 768px) and (max-width: 1199px) {
  /*===========================================*/
  /*	Logo Styles	*/
  /*===========================================*/
  .logo img {
    width: auto !important;
    height: 3em !important;
  }
  /*===========================================*/
  /*	Typography Styles	*/
  /*===========================================*/
  .heading h2 {
    max-width: 50%;
  }
  p {
    line-height: 1.75em;
  }
  /*===========================================*/
  /*	Spacing & Container Styles	*/
  /*===========================================*/
  .container-full {
    width: 90%;
  }
  section {
    margin-top: 3em;
    margin-bottom: 3em;
  }
  .inner-space {
    margin-top: 4em;
  }
  /*===========================================*/
  /*	iPhone Styles	*/
  /*===========================================*/
  .iphone-left img {
    margin-left: auto;
    margin-right: 0;
  }
  .iphone-right img {
    margin-left: 0;
    margin-right: auto;
  }
  .iphone-float img {
    margin-left: auto;
    margin-right: auto;
  }
  .iphone-float img, .iphone-right img, .iphone-left img {
    max-width: 100% !important;
  }
  /*===========================================*/
  /*	Features Styles	*/
  /*===========================================*/
  .features {
    margin-top: 2em !important;
  }
  #extra-feature-1, #extra-feature-2 {
    margin: 3em auto;
  }
  /*===========================================*/
  /*	Video Styles	*/
  /*===========================================*/
  .video {
    width: 90%;
    margin: 0 auto;
    padding-top: 50% !important;
  }
  /*===========================================*/
  /*	Review Styles	*/
  /*===========================================*/
  .review {
    padding-left: 5em;
    padding-right: 5em;
  }
  /*===========================================*/
  /*	Social Links Styles	*/
  /*===========================================*/
  .social li {
    margin-right: 2.5em;
  }
  /*===========================================*/
  /*	Nav Links Styles	*/
  /*===========================================*/
  nav.main li {
    padding-right: 2em;
  }
}

/*-------------------------------------------------------------*/
/*===========================================*/
/*      		               3. Mobiles (<768)		                           */
/*===========================================*/
/*-------------------------------------------------------------*/
@media (min-width: 0px) and (max-width: 767px) {
  /*===========================================*/
  /*	Logo Styles	*/
  /*===========================================*/
  .logo img {
    width: auto !important;
    height: 2em !important;
  }
  /*===========================================*/
  /*	Banner Styles	*/
  /*===========================================*/
  #banner .iphone-float, #banner .iphone-right, #banner .iphone-rotate, #banner .ipad-rotate {
    display: none;
  }
  #banner .video-button a {
    margin-left: -13.5%;
    margin-top: -10%;
  }
  .v-lightbox h1.pop {
    margin-top: 3.25em;
  }
  .scroll-down {
    display: none;
  }
  .download-cta span {
    padding: 0 1em;
  }
  .app h1.pop {
    padding: 0;
  }
  .app-logo img {
    width: 25%;
  }
  /*===========================================*/
  /*	Typography Styles	*/
  /*===========================================*/
  .heading h2 {
    max-width: 90%;
    min-width: 80%;
  }
  h1.pop {
    font-size: 3em;
    line-height: 1.15em;
  }
  p {
    line-height: 1.75em;
  }
  /*===========================================*/
  /*	Spacing & Container Styles	*/
  /*===========================================*/
  .container-full {
    width: 90%;
  }
  section {
    margin-top: 3em;
    margin-bottom: 3em;
  }
  .inner-space {
    margin-top: 2em;
  }
  /*===========================================*/
  /*	iPhone Styles	*/
  /*===========================================*/
  .iphone-left img, .iphone-right img {
    margin-left: auto;
    margin-right: auto;
    max-width: 100% !important;
    height: 35em;
    margin-top: 2em;
  }
  .iphone-hand img {
    width: 110%;
  }
  .ipad-land {
    width: 100%;
    padding: 0 4%;
    margin-top: 2%;
  }
  .iphone-port {
    display: none;
  }
  /*===========================================*/
  /*	Header Styles	*/
  /*===========================================*/
  #header {
    padding: 1.25em 0;
    position: relative;
  }
  #header .download-button {
    display: none;
  }
  nav.main {
    margin-top: 3em;
    opacity: 0;
    position: absolute;
    top: 20%;
    width: 100%;
    left: 0;
    z-index: -10;
    background-color: white;
  }
  nav.main ul, nav.main li {
    display: block;
  }
  nav.main li {
    padding-right: 0;
  }
  nav.main a {
    padding: .65em 0;
    display: block;
    font-size: 1.125em;
    text-align: center;
  }
  span.nav-button, span.close-button {
    display: block;
  }
  /*===========================================*/
  /*	About Styles	*/
  /*===========================================*/
  .about, .features {
    margin-top: 2em;
  }
  .about:first-child, .features:first-child {
    margin-top: 0;
  }
  .about-section {
    margin-top: 4em;
  }
  .about-section .iphone-hand {
    margin-top: 1.5em;
  }
  .iphone-front {
    margin-top: 2em;
  }
  /*===========================================*/
  /*	Features Styles	*/
  /*===========================================*/
  #extra-feature-1, #extra-feature-2 {
    margin: 2em auto !important;
  }
  #extra-feature-1 .content, #extra-feature-2 .content {
    margin-top: 3em;
  }
  /*===========================================*/
  /*	Screenshots Styles	*/
  /*===========================================*/
  .app-screen {
    width: 50%;
    margin-top: 2%;
  }
  .app-screen:nth-child(n+5) {
    display: none;
  }
  /*===========================================*/
  /*	Video Styles	*/
  /*===========================================*/
  .video.card {
    padding-top: 65%;
  }
  .video.card img {
    top: 0;
  }
  .card {
    border-radius: 1em;
  }
  .video-button a {
    margin-left: -7%;
    width: 2.75em;
    height: 2.75em;
    line-height: 2.8em;
    text-align: center;
    font-size: 1.25em;
  }
  .video-container {
    margin-top: 2em;
  }
  /*===========================================*/
  /*	Reviews Styles	*/
  /*===========================================*/
  .review {
    padding: 2em 1.5em;
  }
  .review h3.quote {
    font-size: 2em;
  }
  .review .r-name {
    margin: .8em auto;
  }
  .owl-prev, .owl-next {
    font-size: 3em;
  }
  .owl-prev {
    left: -7.5%;
  }
  .owl-next {
    right: -7.5%;
  }
  .brand img {
    margin-top: 1.25em;
  }
  /*===========================================*/
  /*	Subscribe Styles	*/
  /*===========================================*/
  #subscribe.image {
    height: 42.5em;
  }
  form input, form button.primary, form button.primary.center {
    width: 100% !important;
    margin-left: 0 !important;
    margin-top: 1.5em !important;
  }
  form input:first-child, form button.primary:first-child, form button.primary.center:first-child {
    margin-top: 0 !important;
  }
  /*===========================================*/
  /*	Download Styles	*/
  /*===========================================*/
  #download.small {
    height: 47em;
  }
  #download.large {
    height: 63em;
  }
  form.download button {
    margin-top: 1.5em;
    width: 100%;
  }
  /*===========================================*/
  /*	Footer Styles	*/
  /*===========================================*/
  footer.default {
    padding: 1.5em 0;
  }
  .social ul {
    text-align: center;
  }
  .social li {
    margin-right: 2.5em;
  }
  .logo-info .vr {
    display: none;
  }
  .logo-info .logo img {
    width: 100% !important;
    height: auto !important;
  }
  .logo-info .info p {
    margin-top: 6%;
    text-align: center;
  }
  /*===========================================*/
  /*	Coming Soon Styles	*/
  /*===========================================*/
  .coming {
    overflow: visible;
  }
  /*===========================================*/
  /*	Forms Styles	*/
  /*===========================================*/
  .login-page .form.adv, .login-page .form {
    margin-top: 10%;
    top: 10%;
  }
  .login-page .bg-image {
    left: -10%;
    width: auto;
    height: 100%;
    top: 0;
  }
}
