// Import files
@import "above_the_fold";
@import "below_the_fold";
@import url(https://fonts.googleapis.com/css?family=Roboto+Condensed:400,300italic,300);


body{
    padding-bottom: 50px; 
}

.navbar-gitboard{
    background: $logo-color !important;
    color:#fff !important;
}

body,h1,h2,h3,h4,h5,h6 { 
    font-family: 'Roboto Condensed', sans-serif;
    font-weight:300;
}


img.github-ribbon{
    z-index:2000;
    position: fixed;
    bottom: 0;
    right: 0;
    border: 0;
}

@media(min-width:992px){
    #features{
        img{
            width:80%;
        }
    }
}

#features{

    p{
        margin-top:40px;
        text-align:left;
    }
    div.row{
        margin-bottom:40px;
    }
    div.diagram{
        text-align:center;
    }
}

footer {background:#fff; padding-top:10px;}

a {color:#006; font-weight:bolder;}
a:hover,a:active {color: #008; text-decoration:none;}
a:visited {color:#006;}

@media (max-width:991px){
    
    #features{
        img{
            width:60%;
        }
    }

    img.github-ribbon{
        display:none; //we do not show the ribbon on mobile devices since it obstructs everything...
    }
    footer{
        margin-top:20px;
    }
    .navbar-fixed-bottom{
        position:relative;
    }
}

@media (min-width: 992px) {
  .narrow-container {
    width: 970px;
  }

  .jumbotron{
    margin-top:30px;
    margin-bottom:50px !important;
    }
}

#app{
  padding-top:20px !important;
}

.left-tilt{
  -ms-transform: rotate(-1deg); /* IE 9 */
  -webkit-transform: rotate(-1deg); /* Chrome, Safari, Opera */
  transform: rotate(-1deg);
}

.right-tilt{
  -ms-transform: rotate(1deg); /* IE 9 */
  -webkit-transform: rotate(1deg); /* Chrome, Safari, Opera */
  transform: rotate(1deg);
}
