html {
  font-size: 14px;
  font-family: Roboto,Helvetica,Arial,sans-serif;
  
}
@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

body
{
    background-color:#f0f0f0;
}

.navbar-brand {
    font-size:24px;
    color:#222;
    font-weight:500;
}

.navbar-brand span {
   font-weight:500;
}

nav a {
    color:#888;
}

section {
    padding:40px 0;
}

footer {
    padding:80px 0;
}

@media (max-width: 767px) {
    h1, h2 {
        padding:8px 0;
    }
}


@media (min-width: 768px) {
    .navbar-brand {
        margin-left:20px;
    }

    footer {
        padding:200px 0;
        text-align:center;
    }
    
    .img-skewed {
        perspective: 1500px; 
    }

    .img-skewed-left {
        perspective-origin: left center; 
    }
    .img-skewed-left .img-skewed-item {
        transform: rotateY(-35deg) rotateX(15deg);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden; 
    }

    .img-skewed-right {
        perspective-origin: right center; 
    }
    .img-skewed-right .img-skewed-item {
        transform: rotateY(35deg) rotateX(15deg);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden; 
    }
    .mw-md-130 {
        max-width: 130% !important;
    }

    .screenshot {
        box-shadow: 25px 60px 125px -25px rgba(80, 102, 144, 0.1), 16px 40px 75px -40px rgba(0, 0, 0, 0.2); 
    }
}

.screenshot {
    border-radius:8px;
}