﻿/*----------------------------------------------------------------------------- 
JoniParsley.com Screen Stylesheet 

theme:     2015-01-justsayin
version:   1.0 
date:      2014-01-21
author:    Jay Baldwin IV
email:     webmaster at rodparsley dot com
website:   joniparsley.com

version history: 

DATE         AUTHOR     CHANGES
2014-01-21   JJBIV      Initial version
-----------------------------------------------------------------------------*/


/* FONTS
-----------------------------------------------------------------------------*/

@import url("https://fonts.googleapis.com/css?family=Roboto:400,300,700");
@import url("https://fonts.googleapis.com/css?family=Oswald:400,300,700");
@import url("https://fonts.googleapis.com/css?family=Clicker+Script:400,300,700");
@import url("/assets/site/fonts/font-awesome.min.css");

img { max-width: 100%; }
body, td, span, div
{
    font-size: 16px;
    line-height: 1.5rem;

    font-family: "Roboto", Arial, 'Helvetica' , Tahoma, Verdana, sans-serif;
    font-weight: 300;    
}


h1, h2, h3, h4, h5, h6 {
    font-family: "Oswald", "Roboto", Arial, 'Helvetica' , Tahoma, Verdana, sans-serif;
    font-weight: 300;
}
h1 { font-size: 3rem; line-height: 3.5rem; margin-bottom: 1rem; }
h2 { font-size: 2rem; line-height: 2.5rem; margin-bottom: 1rem; }


/* LINKS
-----------------------------------------------------------------------------*/

/*#page-side-region a:link, #page-side-region a:visited
{
    color: #ba7f7e;
}

#page-side-region a:hover
{
    color: #F078B8;
}

#content #content-top, a:link, #content #content-top a:visited, .blog-item-title a:link, .blog-item-title a:visited {
    color: #ba7f7e;
}


#content #content-top a:hover, .blog-item-title a:hover
{
    color: #EFA8E6;
}*/




/* NEWSLETTER BUTTON
-----------------------------------------------------------------------------*/

/*.newsletter-signup-button
{
    color: #faddde;
    border: solid 1px #980c10;
    background: #d81b21;
    background: -webkit-gradient(linear, left top, left bottom, from(#ed1c24), to(#aa1317));
    background: -moz-linear-gradient(top, #ed1c24, #aa1317);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ed1c24', endColorstr='#aa1317');


    display: inline-block;
    zoom: 1;
    vertical-align: baseline;
    margin-top: 5px;
    outline: none;
    padding: 4px !important;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    font: 14px/100% Arial, Helvetica, sans-serif;
    text-shadow: 0 1px 1px rgba(0,0,0,.3);
    -webkit-border-radius: .5em;
    -moz-border-radius: .5em;
    border-radius: .5em;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
}

.newsletter-signup-button:hover
{
    background: #b61318;
    background: -webkit-gradient(linear, left top, left bottom, from(#c9151b), to(#a11115));
    background: -moz-linear-gradient(top, #c9151b, #a11115);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c9151b', endColorstr='#a11115');
}*/



/* OVERRIDES
-----------------------------------------------------------------------------*/


#intersite-nav {
    /*display: none;*/
    background: rgba(125,125,125,0.2);
}

#intersite-nav,
#intersite-nav * {
    
    font-family: 'Arial Narrow', 'Oswald', sans-serif !important;
    font-weight: 300;
    text-transform: uppercase;
    text-decoration: none;

}

    @media (max-width: 800px) 
    {
        #intersite-nav {
            display: none;
        }
    }




/* INTERFACE
-----------------------------------------------------------------------------*/

body { 
    background: rgba(0,0,0,0.1);  /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(rgba(0,0,0,0.1) , rgba(0,0,0,0.05)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(rgba(0,0,0,0.1), rgba(0,0,0,0.05)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(rgba(0,0,0,0.1), rgba(0,0,0,0.05)); /* For Firefox 3.6 to 15 */
    background: linear-gradient(rgba(0,0,0,0.1) , rgba(0,0,0,0.05)); /* Standard syntax */
}

#site_sizer 
{
    max-width: 75rem;
    margin: 0 auto;
    box-sizing: border-box;
}

#site 
{
    background: white;
    box-sizing: border-box;
}

    #topbar 
    {
        box-sizing: border-box;
        padding: 1rem;
    }
        @media (max-width: 570px) 
        {
            #topbar 
            {
                padding: 0 1rem;
            }
        }

        #topbar a.site-title 
        {
            font-family: 'Clicker Script', 'Oswald', sans-serif;
            font-size: 4rem;
            line-height: 4.5rem;
            color: black;
            text-decoration: none;
        }


#topbar .tagline {
    font-family: 'Clicker Script', 'Oswald', sans-serif;
    font-style: italic;
    font-size: 2rem;
    margin-left: 1rem;
    line-height: 4.5rem;
    color: #69120f;
    text-transform: lowercase;
    text-decoration: none;

    display: block;
    margin-top: -2.5rem;
    margin-left: 8rem;
    margin-bottom: -2rem;
}

#topbar a.site-title i.fa, #topbar a.site-title i.fas, #topbar a.site-title svg {
    color: #69120f;
}
            
            @media (max-width: 570px) {
                #topbar a.site-title
                {
                    font-size: 12vw;
                    line-height: 8.1vwrem;
                }
            }
            @media (max-width: 570px) {
                #topbar .tagline {
                    font-size: 8vw;
                    display: block;
                    margin-top: -2.5rem;
                    margin-left: 5rem;
                    margin-bottom: -1rem;
                }
            }


nav#nav_desktop {
    box-sizing: border-box;
    /*padding: 0.25rem 0.5rem;*/
    /*background: #095495;*/ /*PHIL COOKE*/
    background: #69120f;
    position: relative;
}

    nav#nav_desktop ul 
    {
        margin: 0;
        padding: 0;
        display: inline-block;
    }
        nav#nav_desktop ul li 
        {
            display: inline-block;
        }
            @media (max-width: 570px) 
            {
                nav#nav_desktop ul
                {
                    text-align: center;
                }
                    nav#nav_desktop ul li.home 
                    {
                        display: none;
                    }
            }
            @media screen and (max-width: 800px) {
                #nav_desktop ul li {
                    left: unset;
                    padding-right: unset;
                }
            }

        nav#nav_desktop ul.menu li a 
        {
            display: inline-block;
            line-height: 1.5rem;
            padding: 0.75em 1.25em;
            font-family: 'Oswald',sans-serif;
            font-weight: 300;
            text-transform: uppercase;
            text-decoration: none;
        }
        nav#nav_desktop ul li a:link,
        nav#nav_desktop ul li a:visited
        {
            /*PHIL COOKE*/
            /*color: #A7B8C5;*/
            color: #bebebe;
        }
        nav#nav_desktop ul li a:hover
        {
            color: white;
        }
        

        nav#nav_desktop ul.social_media 
        {
            position: absolute;
            top: 0.75em;
            right: 1rem;
            /*float: right;
            height: 100%;*/
        }
            @media (max-width: 570px) 
            {
                nav#nav_desktop ul.social_media 
                {
                    display: none;
                }
            }
        nav#nav_desktop ul.social_media li a {
            padding: .75em 0.5em;
            line-height: 1.5rem;
        }


        ul.secondary_nav 
        {
            text-align: center;
        }
        ul.secondary_nav li
        {
            display: inline-block;
        }
            @media (max-width: 570px) 
            {
                ul.secondary_nav li
                {
                    display: block;
                }
                ul.secondary_nav li a.button
                {
                    display: block;
                    text-align: center;
                }
            }


        #site_stage
        {
            position: relative;
            z-index: 10;
            overflow: hidden;
            max-height: 32rem;
            /*max-height: 30rem;*/
        }
            .stage_item img 
            {
                margin: 0;
                max-width: 100%;
                height: auto;
            
                display: block;
            }
            .stage_item.scale5 img 
            {
                -webkit-transform: scale(1.05);
                transform: scale(1.05);
                transition: opacity 1s, -webkit-transform 1s;
                transition: opacity 1s, transform 1s;
                transition: opacity 1s, transform 1s, -webkit-transform 1s;
            }
                @media (max-width: 570px) 
                {
                    .stage_item.scale5 img 
                    {
                        -webkit-transform: scale(1.0);
                        transform: scale(1.0);
                    }
                }
            .stage_item:hover img 
            {
                opacity: 1;
                -webkit-transform: scale(1);
                transform: scale(1);
            }

            .stage_item.stage_item_default img 
            {
                margin-top: -1rem;
            }
                @media (max-width: 800px) 
                {
                    .stage_item.stage_item_default img 
                    {
                        margin-top: -2rem;
                    }
                }
                @media (max-width: 570px) 
                {
                    .stage_item.stage_item_default img 
                    {
                        margin-top: 0rem;
                        margin-bottom: -2rem;
                    }
                }


        #content_wrapper
        {
            box-sizing: border-box;
            position: relative;
            z-index: 100;
            /*margin-top: -8.75rem;*/
            margin-top: -2.75rem;
            margin-left: 1.5rem;
            padding: 1.5rem 2rem;

            background: white;
            border-top: 0.625rem solid #69120f;
        }

            @media (max-width: 800px) {
                #content_wrapper 
                {
                    margin-top: 0rem;
                    margin-left: 0rem;
                }
            }
        
        #content
        {
            width: 49.75rem;
            max-width: 66%;
            float: left;
        }

            @media (max-width: 800px) {
                #content 
                {
                    width: unset;
                    max-width: 100%;
                    float: none;
                }
            }


        #secondary_region
        {
            box-sizing: border-box;
            width: 24rem;
            max-width: 34%;
            float: right;
        }

            @media (max-width: 800px) {
                #secondary_region 
                {
                    width: unset;
                    max-width: 100%;
                    float: none;
                }
            }

        .side_widget
        {
            box-sizing: border-box;
            margin-top: 1rem;
            margin-right: 1rem;
            margin-left: 1rem;
            margin-bottom: 2rem;
            padding: 0.5em 1em;
            color: #59595;
            font-size: 0.9em;
            background: #f2f2f2;
            border-radius: 0.625rem;
        }

            .side_widget h3
            { 
                font-size: 1.1rem;
                margin-bottom: 1rem;
            }

        .side_widget.about_joni 
        {
            position: relative;
            margin-top: 3rem;
        }
        .about_joni .joni_photo 
        {
            display: inline-block;
            width: 10rem;
            height: 10rem;
            max-width: 100%;
            max-height: 100%;
            border-radius: 50%;
            overflow: hidden;
        }
            .about_joni .joni_photo img 
            {
                display: inline-block;
                width: 100%;
                height: auto;
            }
            .side_widget.about_joni h3
            { 
                font-size: 2rem;
                display: inline-block;
                position: absolute;
                top: 3rem;
                right: 3rem;
            }

                @media (max-width: 1000px) 
                {
                    .side_widget.about_joni h3
                    {
                        display: block;
                        position: relative;
                        top: unset;
                        right: unset;
                    }
                }


            .side_widget .read_more_wrapper 
            {
                text-align: right;
                margin-top: 1rem;
            }
                .side_widget .read_more_wrapper a
                {
                    text-decoration: none;
                    text-transform: uppercase;
                    font-weight: 700;
                    font-size: 0.8rem;
                }
                
                .side_widget .read_more_wrapper a:link,
                .side_widget .read_more_wrapper a:visited
                {
                    color: #ff6a00;
                }
                .side_widget .read_more_wrapper a:hover
                {
                    color: #333333;
                }

            
            .side_widget:not(.button) a
            {
                text-decoration: none;
            }
                
            .side_widget a:link,
            .side_widget a:visited
            {
                color: #333333;
            }
            .side_widget a:hover
            {
                color: red;
            }


/* BLOG
-----------------------------------------------------------------------------*/

.blog_item_title {
    font-size: 2.25rem;
    line-height: 3.0rem;
    font-family: 'Oswald',sans-serif;
    font-weight: 300;
    margin-bottom: 1.5rem;
}
    .blog_item_title a
    {
        text-decoration: none;
    }
    .blog_item_title a:link,
    .blog_item_title a:visited 
    {
        color: #333333;
    }
    .blog_item_title a:hover 
    {
        color: #69120f;
    }

    .blog_item_datetime
    {
        font-family: 'Oswald',sans-serif;
        font-weight: 300;
        font-size: 0.9375rem;
        color: #999999;
        margin-bottom: 0.75rem;
    }
    
        .blog_item_datetime::before
        {
            content: "Posted on ";
        }

    .blog_item_datetime 
    {
        display: none;
    }


    .blog_item_preview_markup img
    {
        display: inline-block;
        width: auto;
        height: auto;
        max-width: 9rem;
        max-height: 9rem;
        margin-right: 0.5rem;
        margin-bottom: 0.5rem;

    }

    .blog_item_read_more_link 
    {
        margin-top: 1rem;
    }
        .blog_item_read_more_link a 
        {
            text-decoration: none;
            text-transform: uppercase;
            font-weight: 700;
        }
        .blog_item_read_more_link a:link,
        .blog_item_read_more_link a:visited 
        {
            color: #ff6a00;
        }
        .blog_item_read_more_link a:hover 
        {
            color: #333333;
        }
    
    .blog_comment_summary 
    {
        display: none;
    }
    .blog_item_separator
    {
        margin-top: 2rem;
        margin-bottom: 2rem;
        height: 1px;
        background-color: rgba(0,0,0,0.3);
    }



/* BUTTONS
-----------------------------------------------------------------------------*/

.button,
*:not(#intersite_upSignIn) input[type="text"],
input[type="email"]
{
    box-sizing: border-box;
    display: inline-block;
    border-radius: 0.3125rem;
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    position: relative;
    white-space: nowrap;
    padding: 0.4375rem 0.625rem;
    text-decoration: none;
    transition: 0.3s;
    margin-bottom: 0.5rem;
    margin-right: 0.5rem;
    /*margin-left: 0.5rem;*/
}
.button 
{
    text-transform: uppercase;
}
.button.fill
{
    /*margin-bottom: 0rem;*/
    margin-right: 0rem;
    display: block;
    text-align: center;
    max-width: 100%;
    overflow: hidden;
}

.button:first-child { margin-left: 0; }
.button:last-child { margin-right: 0; }

.button:link,
.button:visited
{
    color: #797777;
    background: #efeded;
}

.button:hover
{
    background: #69120f;
    color: white;
}


.button.alt:link,
.button.alt:visited
{
    background: #69120f;
    color: white;
}

.button.alt:hover
{
    color: #797777;
    background: #efeded;
}



/* COPYRIGHT
-----------------------------------------------------------------------------*/

footer#footer
{
    box-sizing: border-box;
    background: #a9a7a7;
    position: relative;
    padding: 1rem;
}


.footer_column
{
    box-sizing: border-box;
    position: relative;
    display: inline-block;
    padding: 1rem;
    vertical-align: top;
}


.footer_column_header
{
    font-family: 'Oswald',sans-serif;
    font-weight: 300;
    font-size: 1.1rem;
    text-transform: uppercase;
    color: white;
    margin-bottom: 0.5rem;
}



/* COPYRIGHT
-----------------------------------------------------------------------------*/

.copyright
{
    padding: 0.5rem 0;
    font-family: 'Oswald',sans-serif;
    font-weight: 300;
    font-size: 0.8rem;
    color: #333333;
}















fieldset {
    border-top: 0;
    border-right: 0;
    border-left: 0;
}

legend {
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 1rem;
    padding: 0;
    font-size: 2rem;
    font-family: 'Oswald',sans-serif;
    font-weight: 300;
    color: #797777;
}



.divFirstName,
.divMiddleName,
.divLastName
{
    display: block !important;
    width: 100% !important;
}

.ContactInformation input[type="text"],
.ContactInformation select
{
    box-sizing: border-box;
    width: 100%;
}
