html, body{
    margin: 0px;
    padding: 0px;
    background-color: rgb(255, 255, 255);
}

#title{
    margin: 0;
    padding: 0;
    margin-bottom: 0;
    text-align: right;
    margin-top: 0px;
    padding-top:0px;
    flex: 2;
    z-index: 2;
    font-size: 1.7rem;
    margin-right: 10px;
}

/* The Bible version Book and Chapter*/
main{
    margin-top: 1%;
    flex: 1;
    text-align: center;
}

.page{
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.header{
    position:relative;
    display:flex;
    padding-bottom: 0px;
}

/* Button to get to different windows */
#MENU{
    margin-top: 0.1%;
    margin-left: 10px;
    z-index: 2;
    flex: 1;
    font-size: 1.5rem;
}

#other{
    text-align: center;
    margin-top: 10px;
}

#footer{
    text-align: center;
    position: static;
    bottom: 0;
    margin-bottom: 0px;
    margin-top: 20px;
    background-color: lightgray;
    width: 100%;
    height: 6%;
}

footer{
    width:100;
}

#footer-hr{
    margin-top: 0px;
    margin-bottom: 0px;
}

p{
    margin-top: 0px;
    margin-bottom: 0px;
}

/* Buttons to choose version chapter and verse */
select{
    border-color: black;
    color: black;
    background-color: rgb(137, 160, 170);
    border-radius: 0px;
}

#biblestudy{
    padding: 0px;
    margin-top: 0;
}

/* Back, and Next buttons */
.buttons{
    border-color: black;
    color: black;
    background-color: rgb(159, 174, 179);
}

/* Menu button */
.menu{
    border-color: black;
    color: black;
    background-color: lightgrey;

}


/* Share button */
.share{
    border-color: black;
    color: black;
    background-color: rgb(198, 218, 216);

}

/* The text you read */
#verse{
    margin: auto;
    width: 700px
    
}

/* The border around the scripture */
.box{
    border: 2px solid black;
    border-radius: 4px;
}

/* Centers the text in the bible plans/studys */
.bibleStudytext{
    width: 50%;
    margin: auto;
    text-align: center;
}

/* Mobile version */
@media (max-width: 600px) {
    #verse{
        border: 0px;
        width: 90%;
    }

    .bibleStudytext{
        width: 90%;
        margin: auto;
        text-align: center;
    }   

}

.biblestudyButtons{
    width: 300px;
    height: 100px;
    border-radius: 10px;

}

/* Buttons for months Bible in a year */

.biblestudybutton{

    margin: center;
    margin-left: 20px;
    margin-top: 10px;
    width: 200px;
    height: 100px;
    border-radius: 10px;
}


/* Image for the January bible in a year plan*/
#bibleinayearjan{
    background-image: 
    url(/assets/January.jpg);
    background-size: 100%;
    background-position: 30%;
}
#bibleinayearfeb{
    background-image: 
    url(/assets/Febuary.jpg) ;
    background-position: 40%;
}
#bibleinayearmar{
    background-image: 
    url(/assets/March.jpg) ;
    background-size: 100%;
    background-position: 40%;
}
#bibleinayearapr{
    background-image: 
    url(/assets/April.jpg) ;
    background-size: 100%;
    background-position: 40%;
}
#bibleinayearmay{
    background-image: 
    url(/assets/May.jpg) ;
    background-size: 100%;
    background-position: 40%;
}
#bibleinayearjun{
    background-image: 
    url(/assets/June.jpg) ;
    background-size: 100%;
    background-position: 100%;
}
#bibleinayearjul{
    background-image: 
    url(/assets/July.jpg) ;
    background-size: 100%;
    background-position: 40%;
}
#bibleinayearaug{
    background-image: 
    url(/assets/August.jpg) ;
    background-size: 100%;
    background-position: 40%;
}
#bibleinayearsep{
    background-image: 
    url(/assets/September.jpg) ;
    background-size: 130%;
    background-position: 50%;
}
#bibleinayearoct{
    background-image: 
    url(/assets/October.jpg) ;
    background-size: 120%;
    background-position: 40%;
}
#bibleinayearnov{
    background-image: 
    url(/assets/November.jpg) ;
    background-size: 110%;
    background-position: 40%;
}
#bibleinayeardec{
    background-image: 
    url(/assets/December.jpg) ;
    background-size: 100%;
    background-position: 40%;
}

#unashamed{
    background-image: 
        linear-gradient(rgba(255,255,255,0.1), rgba(255,255,255,0.3)),
        url(/assets/fire.jpg);
    background-position: 70%;
}

/* Image for the bible in a year plan*/
#bibleinayear{
    background-image: 
    linear-gradient(rgba(255,255,255,0.4), rgba(255,255,255,0.4)),
    url(/assets/calendar.jpg);
}

/* Home button */
#HOME{
    padding-top: 0.5%;
    z-index: 2;
    flex: 0;
    display: flex;
    padding-left: 10px;
}

nav{
    display: flex;
    padding-top: 0.5%;
    z-index: 2;
}