/*
Theme Name: JLM06
Theme URI: http://just-like-magic.org
Description: The 6th theme for JLM.
Author: Carolynne Tovenar
Author URI: http://redandwhitedesigns.ca
*/
body {
    background: #e6e7e8 url(wall.png) repeat;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #000
    }
/* ============================================================================================================================
== Header
** ============================================================================================================================ */
header {
    background: #83165a url(bg2.jpg) repeat;
    height: 265px;
    width: 100%;
    margin: 0 auto 25px 0;
    -webkit-box-shadow: 0 6px 4px rgba(158, 7, 99, 0.75);
    -moz-box-shadow: 0 6px 4px rgba(158, 7, 99, 0.75);
    box-shadow: 0 6px 4px rgba(158, 7, 99, 0.75)
    }
header p {
    text-align: center;
    background: url(smallbg.png) top center no-repeat;
    line-height: 238px;
    padding: 0;
    margin: 0
    }
/* ============================================================================================================================
== Header Navigation
** ============================================================================================================================ */
nav {
    text-align: center;
    margin: -40px 0 0 0
    }
nav ul {
    list-style: none;
    margin: 0 auto;
    display: block
    }
nav ul li {
    display: inline;
    padding: 10px;
    text-align: center;
    margin: 0 10px;
    background-color: #911060;
    border: 1px dashed #9e0763;
    border-radius: 6px
    }
nav ul li:hover {
    background-color: #751b53
    }
nav ul li a, nav ul li a:link, nav ul li a:active, nav ul li a:visited {
    color: #fff;
    text-decoration: none
    }
nav ul li a:hover {
    text-shadow: 1px 1px 0 #000
    }
nav select {
    display: none
    }
@media (max-width: 755px) {
    nav ul {
        display: none
        }
    nav select {
        display: inline-block;
        margin: 0 auto;
        font-size: 100%;
        background-color: #911060;
        border: 1px dashed #9e0763;
        padding: 5px;
        color: #fff
        }
    }
/* ============================================================================================================================
== Framework
** ============================================================================================================================ */
.container {
    max-width: 1140px;
    margin: 0 auto 20px;
    line-height: 12pt;
    overflow: hidden
    }
.eightcol {
    text-align: justify;
    font-size: 0.9em;
    padding: 0 0 20px 0
    }
.fourcol {
    background: rgba(226, 223, 222, 0.7);
    margin: 2px 0 20px 0;
    font-size: 0.9em;
    text-align: justify;
    padding: 1px 0 15px 0
    }
.content {
    padding: 0 15px 15px 15px
    }
/* ============================================================================================================================
== Headers
** ============================================================================================================================ */
h1 {
    font-family: "Pacifico", cursive;
    font-size: 2em;
    font-weight: normal;
    margin: 15px 0;
    color: #a4006f;
    font-style: italic;
    line-height: 1em
    }
h2 {
    border-top: 1px solid #999;
    border-bottom: 1px solid #999;
    font-size: 0.8em;
    margin: 0 0 10px 0;
    padding: 3px;
    background: #e2dfde
    }
h2.comments {
    text-align: right;
    margin: 0 0 50px 0
    }
/* ============================================================================================================================
== Sidebar Header Ribbons
** ============================================================================================================================ */
.ribbon {
    font-size: 1.4em;
    font-family: "Port Lligat Sans", sans-serif;
    width: 70%;
    position: relative;
    background: #a4006f;
    color: #fff;
    text-align: center;
    padding: 8px;
    margin: 2em auto 2em;
    z-index: 100
    }
.ribbon:before, .ribbon:after {
    content: "";
    position: absolute;
    display: block;
    bottom: -1em;
    border: 1em solid #a4006f;
    z-index: -1
    }
.ribbon:before {
    left: -1.5em;
    border-right-width: 1.5em;
    border-left-color: transparent
    }
.ribbon:after {
    right: -1.5em;
    border-left-width: 1.5em;
    border-right-color: transparent
    }
.ribbon .ribbon-content:before, .ribbon .ribbon-content:after {
    content: "";
    position: absolute;
    display: block;
    border-style: solid;
    border-color: #8b2062 transparent transparent transparent;
    bottom: -0.99em;
    z-index: 1
    }
.ribbon .ribbon-content:before {
    left: 0;
    border-width: 1em 0 0 1em
    }
.ribbon .ribbon-content:after {
    right: 0;
    border-width: 1em 1em 0 0
    }
/* =================================================================================================================
== Posts
** =================================================================================================================*/
section.categories {
    text-align: right;
    margin: 15px 0 5px 0
    }
section.postnavigation {
    float: right
    }
/* ============================================================================================================================
== Footer
** ============================================================================================================================ */
footer {
    background: url(footbg.png) repeat-x;
    line-height: 50px;
    color: #fff;
    text-shadow: 1px 1px 1px #000;
    padding: 0 5px;
    text-align: center;
    font-size: 0.8em
    }
footer a, footer a:link, footer a:active, footer a:visited {
    color: #fff;
    text-decoration: none
    }
footer a:hover {
    text-shadow: 0 0 0 #fff
    }
img#wpstats {
    display: none
    }
/* ============================================================================================================================
== Random/Commonly Used Tags
** ============================================================================================================================ */
img {
    border: 0;
    max-width: 100%
    }
.right {
    float: right;
    padding: 0 0 1px 5px
    }
.left {
    float: left;
    padding: 0 3px 1px 0
    }
.center {
    text-align: center;
    margin: 0 auto
    }
.u {
    text-decoration: underline
    }
ul li, ol li {
    margin: 0 0 0 45px
    }
.divider {
    border-bottom: 2px solid #a4006f;
    margin: 0 0 3px 0
    }
/* =================================================================================================================
== Links
** =================================================================================================================*/
a, a:link, a:active, a:visited {
    color: #a4006f;
    font-style: italic
    }
a:hover {
    text-shadow: 1px 1px 0 #fff
    }
/* ============================================================================================================================
== Sidebar Content
** ============================================================================================================================ */
.twittertime {
    font-size: 0.7em;
    float: right
    }
img.twitt {
    vertical-align: middle
    }
.circle {
    float: right;
    width: 84px;
    height: 84px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border: 4px solid rgba(164, 0, 111, 0.7);
    margin: 0 0 0 4px
    }
.circle img {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%
    }
.center365 {
    text-align: center;
    margin: 0;
    padding: 0
    }
.center365 img {
    border: solid 2px #a4006f
    }
/* ============================================================================================================================
== Search Form
** ============================================================================================================================ */
#searchform input#s, #searchform input#searchsubmit {
    text-transform: lowercase;
    float: none;
    margin: 0;
    padding: 3px;
    font-size: 0.8em
    }
#searchform input#s:focus {
    background: rgba(164, 0, 111, 0.08)
    }
#searchform input[type=submit]#searchsubmit {
    padding: 3px
    }
#searchform input[type=submit]#searchsubmit:hover {
    background: rgba(164, 0, 111, 0.08)
    }
/* ============================================================================================================================
== Archives Page
** ============================================================================================================================ */
ul.archivelist {
    list-style-image: url(/images/arrow.gif)
    }
table#wp-calendar {
    width: 40%;
    margin: 0 0 0 75px;
    text-align: center
    }
table#wp-calendar caption {
    font-weight: bold;
    border-bottom: 2px solid #a4006f
    }
table#wp-calendar #prev {
    text-align: left
    }
/* ============================================================================================================================
== Comments Layout
** ============================================================================================================================ */
ul.commentlist {
    list-style: none
    }
ul.commentlist li {
    margin: 0 0 20px 0
    }
table.commentspretty {
    width: 90%;
    border: 4px solid #a4006f;
    margin: 0 auto;
    line-height: 14px;
    font-size: 0.8em
    }
table.commentspretty td {
    padding: 5px
    }
.commentsname {
    vertical-align: middle;
    background-color: rgba(205, 201, 200, 0.8);
    width: 90%
    }
.commentsavatar {
    vertical-align: middle;
    background-color: rgba(205, 201, 200, 0.8);
    margin: 0 auto;
    width: 10%;
    text-align: center
    }
.avatar {
    border: 2px solid rgba(164, 0, 111, 0.7);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%
    }
.commentsdate {
    vertical-align: middle;
    background-color: rgba(205, 201, 200, 0.8);
    border-bottom: 1px solid #000
    }
.commentsblurb {
    background: rgba(207, 205, 205, 0.3)
    }
ul.children {
    list-style: none;
    margin: 20px 2px 0 35px;
    padding: 25px 0 0 0;
    background: url(replybg.png) no-repeat;
    border: 0 solid #000
    }
/* ============================================================================================================================
== Comments Form
** ============================================================================================================================ */
table#commentswrite {
    width: 90%;
    border: 0 solid #000;
    margin: 0 auto
    }
table#commentswrite label {
    font-size: 0.9em
    }
table#commentswrite input {
    width: 20em
    }
table#commentswrite textarea {
    width: 21em
    }
table#commentswrite input[type=submit] {
    width: 11em
    }
/* =================================================================================================================
== Content Organization
** =================================================================================================================*/
ul.links {
    list-style-image: url(/images/linkarrow.gif)
    }
.goback {
    margin: 20px 0 0 0
    }
/* =================================================================================================================
== Contact Page
** =================================================================================================================*/
table#contact {
    width: 75%;
    margin: 0 auto
    }
table#contact td {
    padding: 4px 0
    }
table#contact input {
    width: 20em
    }
table#contact textarea {
    width: 21em
    }
table#contact input[type=submit] {
    width: 6em
    }
/* =================================================================================================================
== Movies Watched Page
** =================================================================================================================*/
table.movieswatched {
    width: 85%;
    margin: 0 auto
    }
table.movieswatched td {
    padding: 2px 0
    }
/* =================================================================================================================
== Rating Stars Page
** =================================================================================================================*/
table#ratingstars {
    width: 90%;
    margin: 0 auto;
    text-align: center
    }
table#ratingstars td {
    padding: 8px 0
    }
/* =================================================================================================================
== Smilies Page
** =================================================================================================================*/
table#smilies {
    width: 70%;
    margin: 0 auto;
    text-align: center
    }
table#smilies td {
    padding: 8px 0
    }
/* ============================================================================================================================
== Form Prettiness
** ============================================================================================================================ */
input, select, textarea {
    padding: 4px;
    border: 1px solid rgba(164, 0, 111, 0.7);
    background: rgba(164, 0, 111, 0.2);
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 0.9em
    }
input:focus, textarea:focus {
    background: rgba(164, 0, 111, 0.08)
    }
input[type=submit] {
    padding: 4px;
    cursor: pointer;
    text-transform: uppercase;
    float: right;
    margin: 0 0 5px 0
    }
input[type=submit]:hover {
    background: rgba(164, 0, 111, 0.08);
    -moz-box-shadow: 1px 2px 3px #888;
    -webkit-box-shadow: 1px 2px 3px #888;
    box-shadow: 1px 2px 3px #888
    }
/* ============================================================================================================================
== Mobile Styles
** ============================================================================================================================ */
@media only screen and (max-width: 480px) {
    body {
        width: 100%
        }
    img {
        max-width: 100%
        }
    header {
        height: 150px;
        box-shadow: 0 0 0
        }
    header p {
        line-height: 150px;
        -webkit-box-shadow: 0 6px 4px rgba(158, 7, 99, 0.75);
        -moz-box-shadow: 0 6px 4px rgba(158, 7, 99, 0.75);
        box-shadow: 0 6px 4px rgba(158, 7, 99, 0.75)
        }
    nav {
        margin: -50px 0 0 0
        }
    table#commentswrite input, table#contact input {
        width: 16em
        }
    table#commentswrite textarea, table#contact textarea {
        width: 17em
        }
    table#contact input[type=submit] {
        width: 5em
        }
    }