@import url('https://fonts.googleapis.com/css?family=Open+Sans');

body{

    font-family: 'Open Sans', sans-serif;

    Background: linear-gradient(to bottom, #567788 0%,#121f25 100%) no-repeat center center;
    font-size: 14px;
    color: #333333;
}

    nav{
       background-color: #EFF4F7;
        margin: 35px;
        height: 80px;
        z-index: 5;
        position: relative;
    }

    nav ul{
        color: #AFB4B8;
        letter-spacing: 2px;
        Padding: 20px 20px 0 20px;
        float: right;
    }

        nav ul li{
            display: inline-block;

            list-style-type: none;
            margin-right: 20px;
            border-bottom: 23px;

        }

        nav ul li a{
            text-decoration: none;
            color: #323335;
        }

        nav ul li a:hover{

            cursor: pointer;
            border-bottom: 5px solid #7AE5F7;
            text-decoration: none;
        }

        .logo{
            background-color: #ea3d51;
            position: absolute;
            top: -7px;
            left: 550px;
            width: 140px;
            height: 140px;
            margin: 20px;
            z-index: -1;
        }
            .brand{
                color: white;
                text-transform: uppercase;
                font-size: 50px;
                text-align: center;
                position: relative;
                top: 43px;
                font-weight: 900;
                letter-spacing: 10px;
            }

        main{
            background-color: #CCD0D9;
            width: 80%;
            margin: 0 auto;
        }
            .book-title{
                position: relative;
                z-index: 10;
                font-size: 54px;
                color: #121f25;
                text-transform: uppercase;
                margin-bottom: 15px;
                text-align: center;
                margin: 0;
            }

            .book-genre{
                color: #6dffb8;
                text-transform: uppercase;
                font-size: 120px;
                z-index: 3;
                position: relative;
                left: 75px;
                top: -80px;
                text-align: center;
                margin: 0;
            }

            .red-container{

                background: linear-gradient(to bottom, #eb3c53 0%, #e6135c 100%) no-repeat center center;
                margin: 0 auto;
                z-index: 8;
                color: #ffffff;
                width: 300px;
                text-align: center;
                position: relative;
                padding: 40px;
            }

            .red-container img{

                padding-top: 10px;
                margin: 0 auto;
                display: block;
                max-width: 80px;
                width: 100%;
                border-radius: 50%;
            }

            p:nth-child(3)::before {

                content: ' " ';
                color: #af213d;
                font-size: 30px;
                font-weight: 800;
            }

            p:nth-child(3)::after {

                content: ' " ';
                color: #af213d;
                font-size: 30px;
                font-weight: 800;
            }

            .donate-button{

                background: none;
                border: 3px solid #6FECFE;
                margin: 3px;
                padding-right: 10px;
                padding-left: 10px;
                padding-bottom: 5px;
                padding-top: 5px;
                text-transform: uppercase;
                color: #ffffff;
                font-size: 12px;
            }

            .donate-button:hover{

                cursor: pointer;
                color: black;
                background-color: #6FECFE;
            }

            .second-section{

                background: white;
                width: 80%;
                margin: 0 auto;
                position: relative;
                z-index: 4;
                padding: 250px 35px 35px 35px;
                top: -190px;
            }

            .second-section h1{

                color: #47EF98;
                text-transform: capitalize;
                font-size: 42px;
            }

            .second-section p {
                width: 70%;
            }

            .second-section button{

                background: none;
                border: 3px solid #628291;
                color: #333;
                font-size: 12px;
                text-transform: uppercase;
            }

                .second-section button:hover{

                    background-color: #628291;
                    color: #92E8CF;
                    cursor: pointer;
                    text-transform: uppercase;
                }