html {
            background-color: #efedde;
            height: 100vh;
        }

        body {
            font-family: sans-serif;
            color: black;
            font-size: 1.1em;
            background-color: #efedde;
            height: 100%;
        }

        p {
          text-decoration: none;
        }

        li{
          margin: 10px 0;
        }

        a {
            text-decoration: underline;
            color: black;

        }

        a:visited {
          text-decoration: underline;
          color: black;

        }

        a:hover {
          text-decoration: none;
          color: blue;
          border-bottom: 2.5px solid #D6C5EC;
        }




        #wrapper {
            margin: -50px auto auto;
            width: 90%;
            padding: 5%;
            background-color: #efedde;
            font-size:22px;

}



        #wrapper.index,
        #wrapper.post {
            max-width: 950px;
            background-color: #efedde;
        }



        /*  THIS IS THE TITLE HEADING FORMATTING STUFF FROM HEADY.CSS*/
        p.title	{
        	font-size:32px;
        	font-family:Arial Black, Gadget, sans-serif;
        	color:#000;
        	background-color: #efedde;
        	text-decoration: none;

        	height:35px;
        	font-weight:lighter;
        }
        p.mini_title	{
        	font-family:Arial Black, Gadget, sans-serif;
        	color:#000;
        	font-size:22px;
        	background-color: #efedde;
        	text-decoration: none;
        	/*width:340px;*/
        	height:25px;
        	font-weight:lighter;
        }
        a.mini_title:link{
        	text-decoration: none;
        	color:#000;
        	background-color: #efedde;
        }
        a.mini_title:hover{
        	font-family:Arial Black, Gadget, sans-serif;
        	color:white;
        	font-size:22px;
        	background-color: #efedde;
        	text-decoration: none;
        	height:25px;
        	font-weight:lighter;
        }









        #titlebar {
           margin-bottom: 5%;
           display: inline-block;
           z-index: 10;
       }
       #titlebar span {
            color: gray;
            font-weight: bold;
            font-size: 2em;
            padding-right: 10px;
        }
        #titlebar span:hover {
            font-color: yellow;
        }
        #titlebar a {
            text-decoration: none;
            color:black;
            border-bottom: 6px solid #D6C5EC;
        }
        #titlebar a:hover {
            text-decoration: none;
            color: #b6ffcb;
            background-color: white;
            border-bottom: 6px solid #D6C5EC;
        }




        #titlebar:after {
            font-style: italic;
            white-space: pre;
            position: absolute;
            vertical-align: super;
            font-size: 0.7em;
            padding-left: 1em;
            margin-top: -5px;
            display: none;
        }





        #titlefooter_menu {
            margin-bottom: 5%;
            display: inline-block;
            z-index: 10;
        }

        #titlefooter_menu span {
            color: black;
            font-weight: lighter;
            font-size: 1em;
        }


        #titlefooter_menu a {
            text-decoration: none;
            color: black;
        }

        #titlefooter_menu:after {

        }

        #intro {
            padding-bottom: 1em;
        }


        #intro p {
            border-left: 5px #ed6a5a solid;
            padding-left: 1em;
            font-size: 0.9em;
        }

        .postcontent {
            line-height: 1.5em;
            margin-top: 30px;
        }

        .post .name,
        .post .date {
            color: red;
            font-weight: bold;
        }

        .post .name:after,
        .post .date:after {
            font-weight: bold;
            color: red;
        }

        .post .name:after {
            content: "@";
        }

        .post .date:after {
            content: " $"
        }

        .post .title {
            font-weight: bold;
            color: orchid;

        }

        .post .title:after {
            content: " >>";
            color: red;
        }

        .footer_back {
            margin: 5%;
            color: black;
            font-weight: bold;
            font-size: 0.9em;
        }

        ul.postlist {
            padding-left: 0px;
        }

        ul.postlist li {
            list-style-type: none;
            color: black;
        }

        ul.postlist li span.date {
            margin-top: 10px;
            padding-left: 5%;
            font-size: 0.7em;
            float: left;
            font-weight: bold;

            text-decoration: underline;
            -webkit-text-decoration-color: red;
            text-decoration-color: red;

        }

        ul.postlist li span.title a {
            color: black;
            text-decoration: none;
            font-size: 1.5em;
            font-family:Arial Black, Gadget, sans-serif;
            font-weight: bold;
            border-bottom: 6px solid #ffd700;

        }

        ul.postlist li span.title a:hover {
          text-decoration: none;
          background-color: #ffd700;

        }

        ul.postlist li div.excerpt {
            background-color: #ffffff;
            margin-left: 1em;
            margin-bottom: 6em;
            padding-left: 1em;
        }


/* foooooter */

        .footer_menu {
            font-size: 1.5em;
            font-weight: lighter;
        }
        p.footer_menu	{
        	font-family:Arial Black, Gadget, sans-serif;
        	color:black;
        	font-size:12px;
        	font-weight:lighter;
        	margin:0px 0px;
        	text-align: left;
          line-height: 210%;
        }
        a.footer_menu:link {
        	color: black;
          font-weight:lighter;
        	text-decoration: none;
          border-bottom: none;
        }
        a.footer_menu:visited {
        	text-decoration: none;
        	color: black;
        }
        a.footer_menu:hover {
          text-decoration: none;
          border-bottom: 6px solid #D6C5EC;

        }



        @media only screen and (max-width: 650px) {
            /* For mobile phones: */
            #wrapper {
                width: 85%;
            }
            #titlefooter_menu:after {
                position: absolute;
                float: left;
                padding-left: 5px;
                padding-bottom: 5px;
                display: block;
                margin-top: 15px;
                border-left: 5px solid orchid;
                border-bottom: 3px dashed orchid;
                display: none;
            }
            .postcontent,
            .postlist {
                margin-top: 70px;
            }
        }