/*  
New
Theme Name: Theme 32
Description:  Focus
Version: 1
Author: Queensberry
Author URL: http://www.queensberry.com

TABLE OF CONTENTS

01 - Global 
02 - General Layout
03 - Header
04 - Navigation
05 - Galleries
06 - Album
07 - Widgets
08 - Shopping Cart
09 - Blog CSS
10 - Footer
11 - Responsive CSS
*/

/* ///////////////////////////////////////////////////////////////////// 
//  01 - Global
/////////////////////////////////////////////////////////////////////*/
/*--------------------------------------
Font Styles 
---------------------------------------*/

hr {
border-top: 1px solid #ccc;
}

p {
color: black;
font-family: 'Lato', sans-serif;
font-size: 1.1em;
line-height: 24px;
letter-spacing:1px;
font-weight:300;
}

a {
color:#CCB676;
text-decoration: none;
font-family: 'Lato', sans-serif;
}

a:hover {
color: #aaaaaa;
}

h1 {
font-family: 'Lato', sans-serif;
font-weight: 300;
font-size: 1.5em;
text-transform:uppercase;
color:black;
border-bottom: 0px solid #dddddd;
padding:0px;
clear:both;
padding-bottom: 27px;
margin-top:1.875em;
text-align: center;
letter-spacing:3px;
}

h1#mainPageHeader {
visibility:hidden;
height:0px;
padding:0px;
margin:0px;
}

h1#myqby_header {
font-family: 'Lato', sans-serif;
clear:both;
font-size: 1.375em;
text-transform: uppercase;
margin-top: 3.125em;
padding-bottom: 10px;
color: black;
font-weight:300;
letter-spacing: 0.12em;
text-align:center;
}

h1#galleryNavTitle {
margin-top: 2.125em;
padding-bottom: 5px;
}

.postHeader .subject h1 {
float:left;
text-align:left;
}

h2 {
font-family: 'Lato', sans-serif;
clear:both;
font-size: 1.063em;
text-transform: uppercase;
margin-top: 3.125em;
padding-bottom: 0px;
color:black;
font-weight: 300;
letter-spacing: 0.15em;
line-height: 2.1;
}

h3 {
font-family: 'Lato', sans-serif;
clear:both;
color:black;
font-size:0.938em;
font-weight:400;
margin-top:1.875em;
margin-bottom:10px;
text-transform:uppercase;
}


h4 {
font-family: 'Lato', sans-serif;
clear:both;
color:black;
font-size:0.938em;
font-weight:400;
margin-top:1.875em;
margin-bottom:10px;
}

h5 {
font-family: 'Lato', sans-serif;
clear:both;
color:#555;
font-size:0.813em;
font-weight:400;
margin-top:0;
text-transform: uppercase;
margin-top:1.875em;
margin-bottom:10px;
}

h6 {
font-family: 'Lato', sans-serif;
clear:both;
color:#555;
font-size:0.813em;
font-weight:400;
margin-top:1.875em;
margin-bottom:10px;
}

#mainPageHeader {
visibility:hidden;
float:none !important;
padding:0px;
height:0px;
margin:0px;
}

ul {
padding-left:20px;

}

#popup_title2 {
font-weight: normal !important;
}

blockquote,address {
font-style:italic;
font-weight:400;
font-family: MS Sans Serif4, Geneva, sans-serif;
border-left:4px solid #0fcce3;
padding:0 30px;
}

.hr_aa {
background-color:#eee;
margin:0 !important;
}

.cart-hr {
border-top:1px solid #dddddd;
height:5px;
}

/*--------------------------------------
Page Element Styles (lists, lines, etc)
---------------------------------------*/

ul {
padding-left: 15px;
}


.hr_aa {
background-color: #dddddd;
margin: 15px 0 25px 0 !important;
}


/*--------------------------------------
Page Styles 
---------------------------------------*/

body {
background-color: #ffffff;
font-family: 'Lato', sans-serif;
}

#pageWidth {
margin:auto;
margin-top: 0px;
padding:0;
width: 100%;
font-size: 100%;
font-family: 'Lato', sans-serif;
color: #555555;
line-height: 18px;
}

#pgContent {
padding-left: 1.250em;
padding-right: 1.250em;
width: 90%;
margin: auto;
min-height: 500px;
max-width:1022px;
}

.mainPageContent {
min-height:500px;
}

#inner_mainPageContent {
padding-bottom:15px;
}

.photographer-custom-page {
width:100%;
}

#mainPageWrapper {
clear:both;
min-height:670px;
padding-top: 35px;
}

/* ///////////////////////////////////////////////////////////////////// 
//  03 - header
/////////////////////////////////////////////////////////////////////*/

#pgLogo {
text-align: center;
padding: 10px;
}

#pgCompany {
font-family: 'Lato', sans-serif;
font-size:1.500em;
text-transform:uppercase;
padding-top:20px;
margin-bottom:20px;
line-height: 30px;
text-align:center;
margin-left:auto;
margin-right:auto;
width:100%;
letter-spacing:2px;
font-weight:300;
}

#isPageHeader {
margin-top:45px;
}

/* ///////////////////////////////////////////////////////////////////// 
//  04 - Navigation
/////////////////////////////////////////////////////////////////////*/


#pgNavigation {
display:block;
clear:both;
margin: -20px 10px 10px 10px;
text-align: center;
width: 98%;
}

#pgNavigation li {
width: auto;
display: inline-block;
padding-right: 20px;
padding-left: 20px;
}

#pgNavigation li a{
color: #333333;
text-decoration: none;
}

#pgNavigation li a:hover{
color: #aaaaaa;
text-decoration: none;
}

#nav-pg ul li {
font-family: 'Lato', sans-serif;
text-transform: uppercase;
font-size: 0.9em;
color: #333333;
font-weight:300;
letter-spacing: 1px;
}

#nav-pg ul {
display: inline-block;
margin-top:20px;
margin-bottom: 20px;
}

li.item29.current a {
color: #151517;
}

/* ///////////////////////////////////////////////////////////////////// 
//  05 - Galleries
/////////////////////////////////////////////////////////////////////*/


/*--------------------------------------
Event Page Styles 
---------------------------------------*/

#galleriesList_2 {
margin:auto;
width:96%;
}

.galleryImage .imagePublic {
height: 226px;
}

#pgGallery {
height: 212px;
width: 314px;
background-color: #eeeeee;
position: relative;
margin:2px;
overflow:visible;
}

#pgGallery .wraptocenterGallery {
height: 212px;
width: 314px;
position: relative;
overflow: hidden;
}

#galleryTitle {
font-family: 'Lato', sans-serif;
text-transform: uppercase;
color: #000000;
height: auto;
width: 316px;
padding: 6px 10px 6px 10px;
font-size: 0.85em;
margin: 10px 0;
letter-spacing: 2px;
overflow: visible !important;
font-weight:300;
z-index: 1;
}

#galleryParent {
width: 322px;
height:260px;
display: inline-block;
float:none !important;
vertical-align:top;
}

#allGalleries {
text-align: center;
}

.pgGalleryImg {
height:100%;
}

.pgGalleryImgV , .albumImageV{
    position: absolute;
    margin: auto;
    left: -100%;
    right: -100%;
    top: -100%;
    bottom: -100%;
    width: 100%;
    height: auto;
}

.pgGalleryImgH, .albumImageH{
    position: absolute;
    margin: auto;
    left: -100%;
    right: -100%;
    top: -100%;
    bottom: -100%;
    width: auto;
    height: 100%;
}

#imgCat {
    font-size:0.750em;
    width: 100%;
    text-align: center;
}

#imgCat li {
    float: none !important;
    display: inline-block
}

.paging_container {
font-size:0.750em;
margin-top:10px;
}

.galleryImage .imagePublic {
height: 226px;
}


.gal_list_pagination {
margin-left:0px !important;
margin-top: 4px;
font-family: 'Lato', sans-serif;
font-style: italic;
}

.pagination li.hover a {
background-color: #353535;
}

.pagination li.active a {
background-color: #353535;
}

#collabInfo {
font-size:0.750em;
}

/* ///////////////////////////////////////////////////////////////////// 
//  06 - Album
/////////////////////////////////////////////////////////////////////*/

/*--------------------------------------
Album Page Styles 
---------------------------------------*/

#allAlbums {
margin-top:25px;
margin-left: auto;
margin-right: auto;
text-align: center;
}

#main .wrap {
width: 100%;
margin: 0 auto;
padding: 0 0 0 0;
}

#pgAlbum {
height: 226px;
width:305px;
background-color: #eeeeee;
overflow: visible;
position: relative;
}

#pgAlbum .wraptocenter {
    position: relative;
    overflow: hidden;
}

#albumsParent {
width:326px;
margin-bottom: 15px;
height: 286px;
display: inline-block;
float:none !important;
overflow: visible;
vertical-align:top;
}

#albumTitle {
font-family: 'Lato', sans-serif;
text-transform: uppercase;
color: #000000;
height: auto;
width:auto;
padding: 6px 10px 6px 10px;
font-size: 0.85em;
margin: 10px 0;
letter-spacing: 2px;
overflow: visible !important;
font-weight:300;
z-index: 1;
}

/* ///////////////////////////////////////////////////////////////////// 
//  07 - Widgets
/////////////////////////////////////////////////////////////////////*/

/*--------------------------------------
Connect Widgets
---------------------------------------*/


#pg_connectFull {
padding-top: 20px;
}

#header_connectFull {
text-transform: uppercase;
margin-bottom: 10px;
border-top: 1px solid #dddddd;
padding-top: 13px;
font-size:0.813em;
}

.sharename {
text-transform: uppercase;
font-size: 0.725em;
margin-right: 24px;
padding-top: 0px !important;
padding-left: 5px;
}

img.pgconnectfull_imgpad {
height: 18px !important;
width: auto !important;
padding: 0 0px 0 0;
}

#frmContact {
margin-bottom: 0px;
padding: 0px;
font-size: 0.813em;
}

/* ///////////////////////////////////////////////////////////////////// 
//  08 - Shopping Cart
/////////////////////////////////////////////////////////////////////*/


#popup_title {
font-size: 0.813em;
}

#popup_title h4 {
font-size: 1.3em;
}

.buyFooter p {
font-size: 1em;
}

.cart-hr {
border-top:1px solid #dddddd;
height:5px;
}
  
/* ///////////////////////////////////////////////////////////////////// 
//  10 - Footer
/////////////////////////////////////////////////////////////////////*/

#pgFooter {
padding: 10px 0 60px 0;
}

#poweredby {
padding-top: 50px;
}

.socialmedia-footer {
text-align:left;
}

.pg_connectFull_type {
    text-align: center;
}

.pg_connectFull_type .social_icons {
 float: none;
 display: inline-block;    
}

#copyright-footer p {
font-size:10px;
text-align:center;
letter-spacing:1px;
margin-bottom:15px;
font-weight:300;
color:black;
margin-top:10px;
}

/* ///////////////////////////////////////////////////////////////////// 
//  11 - RESPONSIVE CSS
/////////////////////////////////////////////////////////////////////*/

/*  HandHeld - Ipad in Portrait or screen smaller that 980px CSS */


@media only screen 
and (max-device-width : 1024px) { 

/*--------------------------------------
General
---------------------------------------*/

#nav-pg ul li {
font-size:0.950em;
}

#pgContent {
width: 98%;
}

p {
font-size: 1.3em;
}

/*--------------------------------------
Blog
---------------------------------------*/    

.blogMain {
width:100% !important;
}

.blogMainWrapper {
width:100% !important;
}

.blogSidePannel {
display:none;
}

.blogWrapper p {
font-size: 1.3em;
}

.useraboutme {
width:95% !important;
padding-top: 10px;
}

#galleryParent, #albumsParent {
width: 290px;
margin-bottom: 15px;
height: 270px;
}


#pgGallery, #pgAlbum {
height: 200px;
width: 270px;
}

#pgGallery .wraptocenterGallery {
height: 200px;
width:270px;
}

#galleryTitle, #albumTitle {
height: auto;
padding: 6px 10px 6px 10px;
width: auto;
font-size: 0.750em;
}

.buttonYel1 {
margin-right: 108px !important;
}
}

@media only screen and (max-width: 884px) {

/*--------------------------------------
Blog
---------------------------------------*/    

.blogMain {
width:100% !important;
    }

.blogMainWrapper {
width:100% !important;
}

.blogSidePannel {
display:none;
    }

#replyform {
width: 95% !important;
}

.blogWrapper p {
font-size: 1.3em;
}

.useraboutme {
width:95% !important;
padding-top: 10px;
}
}

@media only screen 
and (max-device-width : 480px) {

/*--------------------------------------
General
---------------------------------------*/

#pgContent {
    width: 100%;
    padding-left: 5px;
    padding-right: 5px;
    margin: 0;
}

p {
font-size: 1.3em;
}

/*--------------------------------------
Blog
---------------------------------------*/    

    .blogMain {
       width:100% !important;
    }

.blogMainWrapper {
width:100% !important;
}

.blogWrapper p {
font-size: 1.3em;
}

    .blogSidePannel {
       display:none;
    }

#commentContainer {
width: 93% !important;
}

#replyform {
width: 96% !important;
}

#replyform .buttonYel1 {
margin-right: 30px !important;
}

#replyform input {
width: 100% !important;
}

.useraboutme {
width:95% !important;
padding-top: 10px;
}

/*--------------------------------------
Gallery Thumbnails
---------------------------------------*/    

#galleryParent {
                        width: 235px !important;
                        height: 220px !important;
                        padding-top: 34px;
                        padding-right:1px;
}

#galleryTitle {
                        width: 100%;
                        margin-bottom: 50px;
}

.galleryParentC {
                        width: 235px !important;
                        height:220px;
}

#pgGallery {
                        width: 225px !important;
                        height:150px !important;
                        margin:0px !important;
}

.wraptocenterGallery {
                        width: 235px !important;
                        height:150px !important;
}

/*--------------------------------------
Album Thumbnails
---------------------------------------*/ 

#albumsParent {
                        width: 235px !important;
                        height:184px !important;
                        padding-top: 34px;
                        padding-right:1px;
}

.albumsParentC {
                        width: 235px !important;
                        height:150px !important;
}

#pgAlbum{
                        width: 225px !important;
                        height:150px !important;
                        margin:0px !important;
}

#albumTitle {
                        top:-150px !important;
                        width: 225px !important;
                        margin-bottom: 50px !important;
}

.pgAlbumImg {
                        height: 150px !important;
                        width:auto !important;
}

.wraptocenterAlbum {
                        width: 235px !important;
                        height:150px !important;
}

}

/*--------------------------------------
Responsive navigation
---------------------------------------*/
@media (max-width: 768px) {
    #isPageHeader {

    }
    #pgLogo {
    }
    #pgNavigation, #nav-pg {
        padding-right: 0;
        margin:0;
        width:100%;
    }
    #nav-toggle {
        background-image: url("//workspace-cdn.s3.amazonaws.com/images/settings_navigation_icons/dropdown_menu.png");
        display: block !important;
        float: left;
        width: 100%;
        height: 45px;
        background-position: calc(100% - 22px) 22px;
        background-repeat: no-repeat;
        position: fixed;
        top: 0;
        right: 0;
        z-index: 100;
        background-color: white;
    }
    #pgNavigation ul {
        display:block;
        max-height: 0px;
        overflow: hidden;
        transition: max-height 300ms ease 0s;
        list-style: none outside none;
        padding: 0;
        position: static;
        z-index: 100;
        margin-top: 0;
    }

    #nav-pg {
        padding-left: 5px !important;
        padding-right: 10px !important;
    }

    #pgNavigation li {
        margin-left:0px !important;
        margin-right:0px !important;
        padding-left: 0px !important;
    }
    
    #pgLogo.open {
        position: static;
        width: 100%;
        /*background-color:white;*/
        z-index:101;
    }
    
    #pgNavigation ul.open {
        position: static;
        max-height: 1000px; 
        /*background-color: white;*/ 
    }
    #pgNavigation ul li { display: block; list-style: none; text-align: left; width: 100%; padding-right: 0; }
    #pgNavigation ul li a { display: block; padding: 15px 10px; border:none; text-decoration: none; }
    #pgNavigation ul.open li a { border-top: 1px solid #ccc;}
    #pgNavigation ul li a:hover { }
}