samp { 
    font-size: smaller;
}

.nav-link {
    color: white;
}

.nav-link:hover {
    color: grey;
}

body, html {
    height: 100%;
  }

code {
    counter-reset: line;
}

code > span:before {
    counter-increment: line;
    content: counter(line);
    display: inline-block;
    border-right: 1px solid #ddd;
    padding: 0 .5em;
    margin-right: .5em;
    color: grey;
}

samp > span:before {
    counter-increment: line;
    content: counter(line);
    display: inline-block;
    border-right: 1px solid #ddd;
    padding: 0 .5em;
    margin-right: .5em;
    color: grey;
}

/* Masthead */
.masthead {
    position: relative;
    background-color: #343a40;
    background: url("../img/communication-4871245_1920.jpg") no-repeat center center;
    background-size: cover;
    padding-top: 8rem;
    padding-bottom: 4rem;
  }
  
.masthead h1 {
    font-size: 2rem;
}
  
@media (min-width: 768px) {
    .masthead h1 {
    font-size: 3rem;
    }
}

/* Feature Icons */

.features-icons {
    padding-top: 2em;
    padding-bottom: 2em;
  }
  
.features-icons .features-icons-item {
max-width: 20rem;
}

.features-icons .features-icons-item .features-icons-icon {
height: 7rem;
}

.features-icons .features-icons-item .features-icons-icon i {
font-size: 4.5rem;
}

.features-icons .features-icons-item:hover .features-icons-icon i {
font-size: 5rem;
}

/* Code Mirror */

.CodeMirror-wrap pre {
    word-break: break-word;
}
    
.CodeMirror {
    border-color: grey;
    border-style: solid;
    border-width: 1px;
    flex: 1;
}
  /*.col-sm {
    border-color:red;
    border-style: solid;
  }*/
  
.nets-code {
    flex:1 1 auto;
    margin-top:0;
    min-height:100%;
    position:relative;
    /*  border-color:blue;
    border-style: solid;*/
    display: flex;
    flex-direction: column;
}
  
.navbar-nav .nav-item {
    margin-left:10px;
}

/* Main body */
#main-body {
    margin-top: 65px;
    margin-bottom: 40px;
    margin-left: 15px;
    margin-right: 15px;
}

h1:before, h2:before, h3:before {
    display: block;
    content: "";
    height: 65px;
    margin: -65px 0 0;
}

/*Remove underline from icons*/
div.features-icons-item > a:hover {
    text-decoration:none;
}

@media (min-width: 768px) {
    #main-body {
     margin-left: 250px;
   }
 }

 body {
     font-weight: 300;
 }

 #footer-wrapper a {
    color: white;
}