body,
        html {
            height: 100%;
        }

        /* The emerging W3C standard
   that is currently Firefox-only */
        * {
            scrollbar-width: thin;
            scrollbar-color: darkblue white;
        }

        /* Works on Chrome/Edge/Safari */
        *::-webkit-scrollbar {
            width: 14px;
        }

        *::-webkit-scrollbar-track {
            background: darkblue;
        }

        *::-webkit-scrollbar-thumb {
            background-color: white;
            border-radius: 20px;
            border: 3px solid darkblue;
        }

        /* remove outer padding */
        .main .row {
            padding: 0px;
            margin: 0px;
        }

        /*Remove rounded coners*/

        nav.sidebar.navbar {
            border-radius: 0px;
            border-right: 1px solid white;
        }

        nav.sidebar,
        .main {
            -webkit-transition: margin 200ms ease-out;
            -moz-transition: margin 200ms ease-out;
            -o-transition: margin 200ms ease-out;
            transition: margin 200ms ease-out;
        }

        /* Add gap to nav and right windows.*/
        .main {

            background-color: #000405;
            background-image: url(../images/image.png);
            min-height: 100vh;
        }

        .mainContainer {
            padding: 15px;
            margin: 0px 50px 0px 50px;
            border-left: 1px solid black;
            border-right: 1px solid black;
            background-color: white;
            min-height: 100vh;
        }

        .mainContainer h2 {
            font-family: 'Berkshire Swash', cursive;
            font-size: 50px;
            text-align: center;
        }

        .mainContainer h3 {
            font-family: 'Berkshire Swash', cursive;
            font-size: 30px;
            text-align: center;
        }

        .mainContainer p {
            font-size: 18px;
        }


        .navbar-inverse {
            background-color: darkblue !important;
        }

        .navbar-inverse .navbar-nav > li > a {
            color: white ! important;
        }

        .navbar-inverse .navbar-nav > li > a:hover {
            color: red ! important;
        }

        .navbar-brand p {
            text-align: center;
            font-family: 'Berkshire Swash', cursive;
            font-size: 22px;
            color: white;
        }

        .neilPic {
            width: 90%;
            height: auto;
            border: 1px solid black;
            border-radius: 50px;
        }

        .quote {
            color: white;
            width: 90%;
            margin: 0 auto;
            padding-top: 5px;
        }

        .bookCover {
            width: 20%;
            height: auto;
            display: block;
            margin: 0 auto;
            border: 1px solid black;
        }

.copyright{
                color: white;
            width: 90%;
            margin: 0 auto;
    text-align:center;
}





















































        /* .....NavBar: Icon only with coloring/layout.....*/

        /*small/medium side display*/
        @media (min-width: 768px) {

            nav.sidebar.navbar {
                position: fixed;
            }

            /*Allow main to be next to Nav*/
            .main {
                position: absolute;
                width: calc(100% - 40px);
                /*keeps 100% minus nav size*/
                margin-left: 40px;
                float: right;
            }

            /*lets nav bar to be showed on mouseover*/
            nav.sidebar:hover + .main {
                margin-left: 200px;
            }


            /*Center Brand*/
            nav.sidebar.navbar.sidebar > .container .navbar-brand,
            .navbar > .container-fluid .navbar-brand {
                margin-left: 0px;
            }

            /*Center Brand*/
            nav.sidebar .navbar-brand,
            nav.sidebar .navbar-header {
                text-align: center;
                width: 100%;
                margin-left: 0px;
            }

            /*Center Icons*/
            nav.sidebar a {
                padding-right: 13px;
            }

            /*adds border top to first nav box */
            nav.sidebar .navbar-nav > li:first-child {
                border-top: 1px #e5e5e5 solid;
            }

            /*adds border to bottom nav boxes*/
            nav.sidebar .navbar-nav > li {
                border-bottom: 1px #e5e5e5 solid;
            }

            /* Colors/style dropdown box*/
            nav.sidebar .navbar-nav .open .dropdown-menu {
                position: static;
                float: none;
                width: auto;
                margin-top: 0;
                background-color: transparent;
                border: 0;
                -webkit-box-shadow: none;
                box-shadow: none;
            }

            /*allows nav box to use 100% width*/
            nav.sidebar .navbar-collapse,
            nav.sidebar .container-fluid {
                padding: 0 0px 0 0px;
            }

            /*colors dropdown box text */
            .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
                color: #777;
            }

            /*gives sidebar width/height*/
            nav.sidebar {
                width: 200px;
                height: 100%;
                margin-left: -160px;
                float: left;
                z-index: 8000;
                margin-bottom: 0px;
            }

            /*give sidebar 100% width;*/
            nav.sidebar li {
                width: 100%;
            }

            /* Move nav to full on mouse over*/
            nav.sidebar:hover {
                margin-left: 0px;
            }

            /*for hiden things when navbar hidden*/
            .forAnimate {
                opacity: 0;
            }
        }

        /*End media Query*/

        /* .....NavBar: Fully showing nav bar..... */

        @media (min-width: 768px) {


            /*Allow main to be next to Nav*/
            .main {
                width: calc(100% - 200px);
                /*keeps 100% minus nav size*/
                margin-left: 200px;
            }

            /*Show all nav*/
            nav.sidebar {
                margin-left: 0px;
                float: left;
                overflow-y: auto;

            }

            /*Show hidden items on nav*/
            nav.sidebar .forAnimate {
                opacity: 1;
            }
        }

        /*End media Query*/




        nav.sidebar .navbar-nav .open .dropdown-menu > li > a:hover,
        nav.sidebar .navbar-nav .open .dropdown-menu > li > a:focus {
            color: #CCC;
            background-color: transparent;
        }

        nav:hover .forAnimate {
            opacity: 1;
        }

        section {
            padding-left: 15px;
        }

        #myCarousel {
            width: 70%;
            margin: 0 auto;
            border: 1px solid black;
        }

        .reflectionsText {
            text-align: center;
        }

        .neilPics {
            width: 80%;
            margin: 0 auto;
            display: block;
            border: 1px solid black;
        }

        .poem {
            text-align: Center;
        }

        .bookCoverTable {
            width: 45%;
            display: block;
            margin: 0 auto;
            border: 1px solid black;
        }

        .bookQuote {
            padding-right: 20%;
            text-align: center;
        }

        .orderRows {
            width: 80%;
            margin: 0 auto;
        }

        .paypalButton {
            display: block;
            margin: 0 auto;
        }

        .col-sm-6 h4 {
            text-align: center;
            padding-bottom: 10px;
        }

        form {
            display: inline-block;
            text-align: center;
        }

        .bookRow {
            display: inline-block;
            vertical-align: middle;
        }

        .archersButton {
            display: block;
            margin: 0 auto;
        }

        #myDIV {
            text-align: center;
            font-size: 18px;
        }

        .radio4Button {
            display: block;
            margin: 0 auto;
        }

        #r4myDIV {
            text-align: center;
            font-size: 18px;
        }



        /*Form CSS*/

        label {
            width: 200px;
            display: block;
            margin: 0 auto;
            text-align: center;
        }

        #name,
        #email,
        #message,
        textarea {
            width: 200px;
            margin: 5px 0;
            border: 1px solid #CCC;
            display: block;
            margin: 0 auto;
        }

        #message {
            width: 90%;
            height: 150px
        }

        #name,
        #email {
            width: 40%;
            height: 30px;
        }

        .formContainer {
            width: 100%;
        }

        #submit {
            display: block;
            margin: 0 auto;
            width: 100px;
            height: 30px;
            border: 1px solid black;
        }


        @media (max-width: 767px) {
            .neilPic {
                display: none;
            }

            .quote {
                display: none;
            }

            .nsheader {
                font-size: 30px !important;
            }

            .navbar {
                margin-bottom: 0px !important;
            }

            nav.sidebar.navbar {
                border-right: none;
            }

            .mainContainer {
                margin: 0px 25px 0px 25px;
            }

            .mainContainer h2 {
                font-size: 32px;
            }

            .bookQuote {
                padding-right: 0;
            }

            p {
                font-size: 14px !important;
            }

            #myDIV {
                font-size: 14px;
            }

            #r4myDIV {
                font-size: 14px;
            }

            h4 {
                font-size: 16px !important;
            }

            h3 {
                font-size: 22px !important;
            }

            #myCarousel {
                width: 100%;
            }
        .bookCover {
            width: 40%;
        }

        }


        @media (max-width: 992px) {

            .bookQuote {
                padding-right: 0;
            }

        }