#main_header{
           /*background-color: rgba(66,33,99, 0.25);*/
           color: #fff;
           padding: 5%;
           background: linear-gradient(to bottom, rgba(66,33,99,.50), rgba(66,33,99,0));
       }

       .logo{
           font-size: 8em;
           color: #fff;
           text-shadow: 4px 4px 4px #639;
           margin: 0;
           font-family: 'Tangerine', cursive;
       }

       @media screen and (max-width: 600px){
           .logo{
               font-size: 6em;
           }
       }

       #top_nav{
           padding: 5%;
           text-align: center;
       }

       #top_nav ul{
           color: #fff;
       }

       .subject{
            font-family: 'Felipa', cursive;
            margin: 80px auto 20px auto;
            font-size: 2em;
            color:#fff;
        }
       #main_content{
           width: 60%;
           padding: 2%;
           float: left;
           margin: 10% 0.5%;
       }

       article{
           background-color: #639;
           color: #fff;
           padding: 2%;
           margin-bottom: 5%;
           

       }

       article a{
           color: #2aa;
       }

       article a:hover{
           text-decoration: none;
       }

       aside {
           float: left;
           margin: 12% 0 0 1%;
           width: 25%;
           background-color: rgba(255,255,255,0.50);
           padding: 3%;
       }


        .passage{
            margin: 50px auto;
            width: 95%;
        }

        .passage p{
            font-size: 1.25em;
            line-height: 2em;
            text-indent: 1em;
        }

        .date{
            font-style:italic;
        }

        .audio_block{
            margin: 3%;
            line-height: 1.5em;
            width: 60%;
            font-size: 1.15em;
        }

        .scripture{
            margin: 3%;
            line-height: 1.5em;
            font-size: 1.5em;
            font-weight: 600;
            font-style: italic;
            text-align: right;
        }

        .fb-comments{
            width:90%;
            margin: 0 auto;
        }

       .clear {
           clear: both;
       }

       li{
        list-style: none;
       }

        @media screen and (max-width: 1024px){
           #main_content {
               width: 90%;
               padding: 2%;
               float: none;
           }

           article {
               padding: 3%;
               width: 100%;
           }

           aside{
               width: 90%;
               float: none;
           }

           audio{
              width: 90%;
           }

           .audio_block{
               width: 95%;
           }

           .audio_block iframe{
               width: 100%;
           }
        }