/* elements */
a {
    text-decoration: none;

}
/* ID's */
#NavBar {
    position: fixed;
    border: 4px;
    margin-top: 55px;
    margin-left: -10px;
    height: 40px;
    width: 100%;
    z-index: 102;
    background-color: green;
    background: linear-gradient(to right,green, rgb(64, 187, 68, 0.753));
    transition: 2s;
}
#TopBar {
    position: fixed;
    border: 10px;
    margin-top: -10px;
    margin-left: -10px;
    height: 65px;
    width: 100%;
    z-index: 101;
    opacity: 1.0;
    
    background: linear-gradient(to right, green,rgba(64, 187, 68, 0.753));
    background-image: url('../TopBar.jpg');
    background-repeat: no-repeat;
    background-color: rgba(64, 187, 68, 0.753);
}
#pageTitle {
    position: fixed;
    margin-top: 5.1%;
    margin-left: 7%;
    padding-left: 10%;
    font-size: 220%;
    width: 100%;
    z-index: 102;
    opacity: 1.0;
    color: darkslategray;
    background-color: white;
}
#pageBody {
    position: absolute;
    margin-top: 10%;
    margin-left: 9%;
    margin-right: 4%;
    margin-bottom: 15%;
    padding-bottom: 5%;
    font-size: normal;
    color:darkslateblue;
}

.navigationBar {
    margin-top:110px;
    display: inline;
}

.navigationItem {
    padding: 10px 10px 10px 10px;
    margin-left: 5px;
    margin-bottom: 10px;
    border-radius: 15px 0 15px 0;
    transition: 0.5s;
    display: inline;
}

.navigationItem:hover {
    text-decoration: underline;
    border-radius: 0 15px 0 15px;

}

.inactive {
    background-color: lightcyan;
    background: linear-gradient(lightcyan, lightcoral);
}
.inactive>a {
    color:darkslateblue;
    padding-left: 10px;

}

.active {
    background-color:teal;
    background-color: lightcoral;
    background: linear-gradient(lightcoral, lightcyan);
    padding-left: 20px;
}
.active>a {
    color: teal;
}

.bibleQuote {
    background-color: lightcyan;
    margin-left: 2%;
    margin-right: 3%;
}
.leftImage {
    float: left;
    padding: 2px;
    margin: 15px 18px 10px 18px;
    border: 1px solid black;
}
.rightImage {
    float: left;
    margin: 3px 12px 3px 0px;
    border: 1px solid black;
}
li {
    margin-left: 5px;
    list-style-type: none;
}
footer {
    font-size: small;
    position: fixed;
    margin-left: -10px;
    padding-left: 210px;
    bottom: 0px;
    height: 20px;
    width: 100%;
    background: cadetblue;
    background: linear-gradient(to right, green,rgb(64, 187, 68, 0.753));
}

.col-3 {
    width: 25%;
    display: inline-block;

}

.preview {
    width: 150px;
    height: 150px;
}