/*
    The Footer of the Layout
*/
#myFooter {
    background-color: #f8f8f8;
    color: white;
    padding-top: 5px;
}

    #myFooter .footer-copyright {
        background-color: #e7e7e7;
        padding-top: 3px;
        padding-bottom: 3px;
        text-align: center;
    }

    #myFooter .row {
        margin-bottom: 20px;
    }

    #myFooter .navbar-brand {
        margin-top: 45px;
        height: 65px;
    }

    #myFooter .footer-copyright p {
        margin: 10px;
        color: #0086bc;
    }

    #myFooter ul {
        list-style-type: none;
        padding-left: 0;
        line-height: 1.7;
    }

    #myFooter h5 {
        font-size: 18px;
        color: #0086bc;
        font-weight: bold;
        margin-top: 30px;
    }

    #myFooter li {
        color: #0086bc;
        text-decoration: none;
        line-height: 20px;
    }

    #myFooter h2 a {
        font-size: 50px;
        text-align: center;
        color: #0086bc;
    }

    #myFooter a {
        color: #0086bc;
        text-decoration: none;
    }

        #myFooter a:hover,
        #myFooter a:focus {
            text-decoration: none;
            color: #005b80;
        }

    #myFooter .btn {
        color: white;
        background-color: #d84b6b;
        border-radius: 20px;
        border: none;
        width: 150px;
        display: block;
        margin: 0 auto;
        margin-top: 10px;
        line-height: 25px;
    }

@media screen and (max-width: 767px) {
    #myFooter {
        text-align: center;
    }
}


/* CSS used for positioning the footers at the bottom of the page. */
/* You can remove this. */

html {
    height: 100%;
}

body {
    display: flex;
    display: -webkit-flex;
    flex-direction: column;
    -webkit-flex-direction: column;
    height: 100%;
}

.content {
    flex: 1 0 auto;
    -webkit-flex: 1 0 auto;
    min-height: 200px;
}

#myFooter {
    flex: 0 0 auto;
    -webkit-flex: 0 0 auto;
}