/* Custom Stylesheet //  Jennifer Paige  //  Showcase Pro */

/* Main 
------------------------------------------------------------ */
.header-wrap.bg-primary:after, .site-header { background-color: hsla(0, 0%, 100%, 0);}
.header-image .site-title > a { width: 600px; }
.with-background-image, .woocommerce-page {background-position: 0 132px; background-size: contain; height: 695px; }
body.single-album .with-background-image { background-image: url(http://www.jenniferpaige.com/wp-content/uploads/2017/02/music.png) !important; }
body.single-post .with-background-image,
body.archive .page-header { background-image: url(http://www.jenniferpaige.com/wp-content/uploads/2017/02/jennifer-paige-eyes.jpg) !important; }
body.archive.woocommerce .page-header { background-image: none !important; }
body.woocommerce-page,
body.woocommerce-cart,
body.woocommerce-checkout,
body.archive.woocommerce,
body.woocommerce .header-wrap.bg-primary.with-background-image { background-image: url(http://www.jenniferpaige.com/wp-content/uploads/2017/04/Contact.jpg) !important; background-repeat: no-repeat; }
body.category .page-header h1,
body.single-album .with-background-image p.entry-meta,
body.woocommerce p.entry-meta { display: none; }
body.single-album .with-background-image .page-header { color: hsl(0, 0%, 20%);}
body.single-album .with-background-image .page-header h1,
body.single .with-background-image .page-header h1 { text-indent: 0; }
body.page .page-header h1,
body.woocommerce .with-background-image .page-header h1 { text-indent: -9999px; }
.header-wrap .page-header { color: hsl(0, 0%, 30%);}
.header-wrap.with-background-image .page-header { color: hsl(0, 0%, 100%)}

@media only screen and (min-width: 1221px) {
    .with-background-image { background-size: cover; }
    body.woocommerce-page, body.woocommerce-cart, body.woocommerce-checkout,body.archive.woocommerce, body.woocommerce .header-wrap.bg-primary.with-background-image {background-size: contain; }
}
@media only screen and (max-width: 1220px) {
    .with-background-image,
body.archive.woocommerce .page-header { height: 600px;}
    .header-image .site-title > a { width: 500px;}
}
@media only screen and (max-width: 1148px) {
    .with-background-image,
body.archive.woocommerce .page-header { height: 575px;}
    .header-image .site-title > a { width: 400px;}
}
@media only screen and (max-width: 1024px) {
    .with-background-image,
body.archive.woocommerce .page-header { height: 495px;}
    .header-image .site-title > a { width: 300px;}
}
@media only screen and (max-width: 800px) {
    .with-background-image,
body.archive.woocommerce .page-header { height: 440px;}
    .header-image .site-title > a { width: 250px;}
}
@media only screen and (max-width: 600px) {
    .with-background-image,
body.archive.woocommerce .page-header { height: 350px;}
    .header-image .site-title > a { width: 200px;}
}
@media only screen and (max-width: 440px) {
    .with-background-image,
body.archive.woocommerce .page-header { height: 290px;}
}

/* Nav 
------------------------------------------------------------ */
.bg-primary, .bg-secondary, .bg-primary a, .bg-secondary a { color: hsl(0, 0%, 30%);}
.nav-primary .genesis-nav-menu > li > a { font-weight: 400;}
.genesis-nav-menu > li > a:hover { color: hsla(320, 31%, 49%, 1); }
.genesis-nav-menu .current-menu-item > a { font-weight: 700 !important;}
.header-image .nav-primary:not(button) { background-color: hsla(0,0%,100%,.8); }

@media only screen and (max-width: 800px) {
    .nav-primary .genesis-nav-menu li { text-align: center;}
}

/* Typography 
------------------------------------------------------------ */
h1, h2, h3, h4, h5, h6 { font-family: 'Montserrat', 'Open Sans Condensed', sans-serif; /*font-weight: 600;*/ }
    .entry-title, .page-title { font-weight: 300; text-align: center; text-transform: uppercase; }
    @media only screen and (min-width: 1024px) { h2, .entry-title, .page-title {font-size: 32px;} }

body, input, textarea, .genesis-nav-menu { font-family: 'Open Sans', sans-serif;}
.entry-content ol, .entry p, .entry-content p, .author-box p, .entry-content ul, .entry ul, .entry ol, .entry-content .wp-video, .entry-content .wp-audio-shortcode, .entry-content .video-player, .quote-caption {
    line-height: 1.8;
}

.caps { text-transform: uppercase; }
.small { font-size: 90%; }
.textcenter { text-align: center; }
blockquote {
    border-left: 3px solid hsla(320, 31%, 49%, 1);
    color: hsl(0, 0%, 35%);
    margin: 40px 40px 40px 0;
    padding-left: 40px;
}
blockquote:before, blockquote:after { content: ""; display: block; }
blockquote:after { clear: both;}
.bquote-author { display: block; font-style: italic; text-align: right; }
.bquote-author:before { content: "\2014 \00a0"; }
/* placeholder text */
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
color: hsl(0,0%,65%) !important; }
input:-moz-placeholder, textarea:-moz-placeholder {
color: hsl(0,0%,65%) !important; }
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
color: hsl(0,0%,65%) !important; }

.album-title { text-decoration: underline; }

@media only screen and (min-width: 1024px) {
    body { font-size: 16px;}
}

/* Clearfix 
------------------------------------------------------------ */
.clearfix:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.clearfix{display:inline-block;width:100%}html[xmlns] .clearfix{display:block}* html .clearfix{height:1%}

/* Colors 
------------------------------------------------------------ */
a, .entry-content a, ul.products a { color: hsl(0, 0%, 20%); }
.entry-content a:hover, ul.products a:hover { color: hsl(0, 0%, 20%); text-decoration: underline; }

/* highlight color*/
::-moz-selection { background-color: hsla(320, 31%, 49%, 1); color: #fff; }
::selection { background-color: hsla(320, 31%, 49%, 1); color: #fff; }

/* Columns (Fifths)
------------------------------------------------------------ */
.four-fifths,.one-fifth,.three-fifths,.two-fifths{float:left;margin:0 0 20px;padding-left:3%}.one-fifth{width:19%}.two-fifths{width:37.8%}.three-fifths{width:58.2%}.four-fifths{width:78.6%}@media only screen and (max-width:1280px){.one-fifth{min-height:380px}}@media only screen and (max-width:1023px){.four-fifths,.one-fifth,.three-fifths,.two-fifths{margin:0;min-height:auto;width:30%}.one-fifth:last-of-type{clear:left;margin:0 auto;width:90%}}@media only screen and (max-width:600px){.four-fifths,.one-fifth,.three-fifths,.two-fifths{margin:0;width:100%}}

/* Content Boxes
------------------------------------------------------------ */
.content-box,
.content-box-light {
    margin: 0 0 25px;
    overflow: hidden;
    padding: 30px 20px 0px;
}

.content-box * {
    color: hsl(0, 0%, 100%);
}

.content-box-light * {
    color: hsl(0, 0%, 20%);
}

.content-box-light a,
.content-box-dark-light a {
    font-style: italic;
}

.content-box {
    background-color: hsla(320, 31%, 49%, 1);
    border: 1px solid hsla(320, 31%, 59%, 1);
}
 
.content-box-light {
    background-color: hsla(320, 31%, 89%, 1);
    border: 1px solid hsla(320, 31%, 79%, 1);
}

/* Color Buttons
------------------------------------------------------------ */
.button {
    border-radius: 5px; 
    color: hsl(0,0%,100%) !important;
    display: inline-block;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 2px;
    padding: 15px 35px;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    width: auto;
}
 
.button:hover{
    text-decoration: none;
}
 
.button,
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.widget .button {
    background-color: hsla(0, 0%, 10%, 1);
    border: 3px solid hsla(0, 0%, 10%, 1);
    transition: none;
}
 
.button:hover,
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
.widget .button:hover {
    background-color: hsla(0, 0%, 100%, 1) !important;
    border: 3px solid hsla(0, 0%, 10%, 1);
    color: hsla(0, 0%, 10%, 1) !important;
    top: 0;
}

.button:active {
    box-shadow: 0 0 hsla(0, 0%, 10%, 1);
    top: 0;
}

.buttoncenter,
.buttonfull { display: block; margin: 24px auto; text-align: center; width: 100%; }
.buttoncenter { max-width: 400px;}
.buttonlarge { font-size: 20px !important; }

button.menu-toggle { background-color: transparent; border: none; }
@media only screen and (max-width: 800px) {
    .menu-toggle:before {color: hsl(0, 0%, 30%);}
}
@media only screen and (max-width: 480px) {
    .entry-content .button { margin-bottom: 20px; width: 100%; }
}

/* Blog 
------------------------------------------------------------ */
body.page-id-2243 h1,
body.page-id-2243 h2,
body.page-id-2243 h3,
body.page-id-2243 h4 { text-transform: uppercase;}
body.page-id-2243 .featured-content .entry-title { font-size: 18px; }
body.page-id-2243 .site-inner { display: none; }

.blog-page-1, .blog-2-outer { margin-bottom: 40px; padding-bottom: 20px; }
.blog-page-3/*, .blog-4-outer*/ { border-bottom: 1px solid hsl(0, 0%, 92%); margin-bottom: 60px; padding-bottom: 20px;}
.blog-page-1 { margin-top: 50px;}
.blog-page-1 .featured-content.widget .entry { float: left; margin: 0 0 40px 3.448275862069%; width: 22.413793103448%; }
    .blog-page-1 .featured-content.widget .entry:nth-of-type(1) { margin-left: 0; }

.blog-2-outer, .blog-4-outer { }
.blog-page-2-left, .blog-page-4-left {float: left; margin-left: 0; width: 65.51724137931%;}
    .blog-page-2-left .entry, .blog-page-4-left .entry { padding-top: 0;}
.blog-page-2-right, .blog-page-4-right {float: left; margin-left: 3.448275862069%; width: 31.034482758621%;}
    #text-9 { font-size: 14px; }
    .blog-page-2-right a.pagelink { clear: both; display: block; font-size: 90%; }
    #blog-read-more { font-size: 12px; margin-top: -15px; }
    #text-16 img.aligncenter { margin-bottom: 16px;}

.blog-page-3 {}
.blog-page-3 .widget { margin-bottom: 40px;}
.blog-page-3 .widget:not(:first-of-type) { float: left; }
.blog-page-3 .shopify-ecommerce-shopping-cart-widget { margin-left: 0;}
.blog-page-3 .shopify-ecommerce-shopping-cart-widget:nth-of-type(n+3) { margin-left: 3.448275862069%;}

.blog-page-4-left .featured-content.widget .entry { float: left; margin-left: 3.448275862069%; width: 48.275862068966%; margin-bottom: 40px; }
.blog-page-4-left .featured-content.widget .entry:nth-of-type(odd) { clear: both; margin-left: 0; }
.blog-page-4-right .widget { margin-bottom: 40px;}
.blog-4-outer { margin-bottom: 60px;}

.blog-page-1 .widgettitle,
.blog-2-outer .widgettitle,
.blog-page-3 .widgettitle,
.blog-4-outer .widgettitle {
    color: hsl(0, 0%, 10%);
    font-weight: bold;
    text-align: center;
    width: 100%;
}

span.alignright img { margin: 0 0 30px 30px;}
p.entry-meta { color: hsl(0, 0%, 70%); font-size: 12px; text-align: center; }

@media only screen and (max-width: 800px) {
    .blog-page-1 .featured-content.widget .entry { margin-left: 0; padding: 0 20px; text-align: center; width: 48.275862068966%;}
    .blog-page-1 .featured-content.widget .entry:nth-of-type(odd),
    .blog-page-4 .featured-content.widget .entry:nth-of-type(odd) { clear: both; margin-left: 0; }

    .blog-page-2-left, .blog-page-2-right, .blog-page-4-left, .blog-page-4-right { margin-left: 0; width: 100%; }
    .blog-page-2-right { margin-left: 0; padding-top: 40px;}

    .blog-page-3 .shopify-ecommerce-shopping-cart-widget,
    .blog-page-3 .shopify-ecommerce-shopping-cart-widget:nth-of-type(n+3) { margin-left: 0; text-align: center; width: 100%; }
}

@media only screen and (max-width: 480px) {
    .blog-page-1 .featured-content.widget .entry,
    .blog-page-3 .widget,
    .blog-page-4-left .featured-content.widget .entry { width: 100%;}
    .blog-page-4-left .featured-content.widget .entry,
    .blog-page-3 .widget { margin-left: 0; text-align: center; }
}

/* Archives, Blog Singles & Specifics
------------------------------------------------------------ */
body.single-post .page-header,
body.single-album .page-header,
body.category h2.entry-title { display: none; }
body.category .post h2.entry-title { display: block; }
article.album .entry-content h3 { font-weight: 400; }


/* Columns : Responsives
------------------------------------------------------------ */
@media only screen and (max-width: 800px) {
    .five-sixths,
    .four-sixths,
    .one-fourth,
    .one-half,
    .one-sixth,
    .one-third,
    .three-fourths,
    .three-sixths,
    .two-fourths,
    .two-sixths,
    .two-thirds,
    .shopify-ecommerce-shopping-cart-widget {
        margin: 0;
        width: 100%;
    }
}

@media only screen and (max-width: 480px) {
    .team-grid .entry { width: 100%;}
}

/* E-News Widgets - Home
------------------------------------------------------------ */
.enews-widget{background-color:hsla(0,0%,100%,0);text-align:center;clear:both;margin:0;padding:15px 10px}
.enews-widget .widget-title{font-size:16px;text-align:center;}
.enews-widget p {float: left; font-size: 12px; margin-bottom: 0; padding-top: 7px; text-transform: uppercase;}
.enews-widget input,.enews-widget input[type=submit]{color:hsla(320,31%,49%,1);font-size:11px;margin:0;padding:5px;width:20%!important}
.enews-widget input[type=submit]{background-color:hsla(320,31%,49%,.3);border:3px solid hsla(320,31%,49%,.3);width:15%!important}
@media only screen and (max-width: 1000px) { .enews-widget p { float: none;} .enews-widget input, .enews-widget input[type="submit"] { width: 25% !important;} }
@media only screen and (max-width:800px){.enews-widget input,.enews-widget input[type=submit]{margin-bottom: 10px;text-align:center;width:100%!important}
}

/* Before Footer 
------------------------------------------------------------ */
#text-5 { margin-bottom: 40px;}
#before-footer .enews-widget input { padding: 10px; width: 39% !important; }
#before-footer .enews-widget input[type="submit"] { padding: 7px; width: 12% !important; }
@media only screen and (max-width:800px) {
    #text-5 .button { margin-bottom: 15px; width: 100%;}
    #before-footer .enews-widget input, #before-footer .enews-widget input[type=submit] {margin-bottom:10px;padding:10px;text-align:center;width:100%!important}
}

/* Footer 
------------------------------------------------------------ */
.site-footer { background-color: hsl(0, 0%, 96%); }
.site-footer, .site-footer a, .site-footer a:visited { color: hsl(0, 0%, 70%); }
    .site-footer a, .site-footer a:visited { opacity: 1;}
    .site-footer a:hover { color: hsla(320, 31%, 49%, 1);}
.creds img {
    max-width: 34px;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20);
    opacity: .15;
    padding-top: 20px;
}

/* iFrames (responsive) 
------------------------------------------------------------ */
.responsivo{overflow:hidden;padding-bottom:56.25%;position:relative;height:0}
.responsivo iframe{left:0;top:0;height:100%;width:100%;position:absolute}

/* Images 
------------------------------------------------------------ */
.wp-caption { max-width: 96% !important; width: auto !important; }
.wp-post-image { margin-bottom: 40px;}
img.centered, .aligncenter { margin: 0 auto 28px; }
a.alignright, img.alignright, .wp-caption.alignright { margin: 0 0 28px 60px; }
a.alignleft, img.alignleft, .wp-caption.alignleft { margin: 0 60px 28px 0; }

/* Print 
------------------------------------------------------------ */
@media print{a[href]:after{content:" (" attr(href) ") "}}

/* Responsives (misc) 
------------------------------------------------------------ */
@media only screen and ( max-width: 32.5em ) /* 520 */ {
    body {
        -webkit-box-shadow: none !important;
        -moz-box-shadow: none !important; 
        box-shadow: none !important;
    }
}

/* Social Icons - Font Awesome 
------------------------------------------------------------ */
ul#social-icons { margin: 0 0 0 22px; text-align: center; }
ul#social-icons li { margin-bottom: 0;}
ul#social-icons li a { margin: 0 22px 0 -22px; padding-right: 22px; }
ul#social-icons li a:hover { text-decoration: none; }
.fa-facebook:before,
.fa-instagram:before,
.fa-spotify:before,
.fa-twitter:before,
.fa-youtube:before { color: hsl(0, 0%, 55%); }

/* Screen Readers 
------------------------------------------------------------ */
.screen-reader-text,
.screen-reader-text span,
.search-form label {
    clip: rect(0, 0, 0, 0);
    height: 0;
    position: absolute;
    width: 0;
}

/* Widget Titles 
------------------------------------------------------------ */
h3.widgettitle { display: table; white-space: nowrap; }
h3.widgettitle:before,
h3.widgettitle:after {
      border-top: 4px double hsl(0, 0%, 75%);
      content: '';
      display: table-cell;
      position: relative;
      top: 5px;
      width: 45%;
    }
h3.widgettitle:before { right: 2.5%; }
h3.widgettitle:after { left: 2.5%; }

@media only screen and (max-width: 600px) {
    .enews h3.widgettitle:before, .enews h3.widgettitle:after { display: none; }
    .enews h3.widgettitle { display: block; white-space: normal; }
}

/* WooCommerce 
--------------------------------------------------------- */
@media only screen and (min-width: 1221px) {
    .woocommerce.archive .site-inner { padding: 380px 0 80px;}
    .woocommerce-cart .site-inner { padding-top: 280px;}
}
@media only screen and (max-width: 1220px) {
    .woocommerce.archive .site-inner { padding: 0 0 80px;}
    .woocommerce-cart .site-inner { padding-top: 180px;}
}
.woocommerce.full-width-content .content-sidebar-wrap { max-width: 1280px; }
.woocommerce ul.products li.product .woocommerce-loop-category__title, .woocommerce ul.products li.product .woocommerce-loop-product__title, .woocommerce ul.products li.product h3 { min-height: 60px; }
.post-type-archive-product .woocommerce-result-count,
.post-type-archive-product .woocommerce-ordering { display: none; }
/*removes main loop on Shop page */
/*.post-type-archive-product ul.products { display: none; }
.post-type-archive-product .columns-4 ul.products { display: block; }*/

/* link colors */
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce ul.products li.product .price { color: hsl(0, 0%, 50%); }

/* product display */
.product_title { text-align: left; }
.product_meta, .woocommerce div.product p.stock { display: none; }

/*button styles */
.woocommerce #content input.button.alt:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover, .woocommerce-page #content input.button.alt:hover, .woocommerce-page #respond input#submit.alt:hover, .woocommerce-page a.button.alt:hover, .woocommerce-page button.button.alt:hover, .woocommerce-page input.button.alt:hover {

background: hsl(0, 0%, 10%) !important;
background-color: hsl(0, 0%, 10%) !important;
color: hsl(0, 0%, 100%) !important;
box-shadow: none;
border: 3px solid hsl(0, 0%, 10%) !important;
}

.woocommerce #content input.button:hover, .woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover, .woocommerce-page #content input.button:hover, .woocommerce-page #respond input#submit:hover, .woocommerce-page a.button:hover, .woocommerce-page button.button:hover, .woocommerce-page input.button:hover {

background: hsl(0, 0%, 100%) !important;
background-color: hsl(0, 0%, 100%) !important;
color: hsl(0, 0%, 10%) !important;
box-shadow: none;
border: 3px solid hsl(0, 0%, 10%) !important;
}

.woocommerce #content input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce-page #content input.button, .woocommerce-page #respond input#submit, .woocommerce-page a.button, .woocommerce-page button.button, .woocommerce-page input.button {

background: hsl(0, 0%, 10%) !important;
color: hsl(0, 0%, 100%) !important;
border: 3px solid hsl(0, 0%, 10%) !important;
}

.woocommerce #content input.button.alt:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover, .woocommerce-page #content input.button.alt:hover, .woocommerce-page #respond input#submit.alt:hover, .woocommerce-page a.button.alt:hover, .woocommerce-page button.button.alt:hover, .woocommerce-page input.button.alt:hover {

background: hsl(0, 0%, 100%) !important;
box-shadow: none;
color: hsl(0, 0%, 10%) !important;
border: 3px solid hsl(0, 0%, 20%) !important;
}

/* Misc. */
.woocommerce .quantity .qty { padding: 10px;}

/* Widget (products, on Blog) */
.woocommerce ul.product_list_widget li {display: inline-block; margin-right: 1%; width: 18%}
.woocommerce ul.product_list_widget li a span.product-title { display: block; }
.woocommerce ul.product_list_widget li img { float: none; margin-left: 0; width: 250px; }

@media only screen and (max-width: 800px) {
    .woocommerce ul.product_list_widget li { padding: 0; margin: 0 auto 25px; text-align: center; width: 100%; }

}