/*
Theme Name: Portfolium
Author URI: http://www.wpshower.com
Description: Portfolium is a clean and flexible Wordpress grid-based portfolio theme designed in a modern & minimalist style. Portfolium is ideal for designers, artists, photographers, and other creative specialists who require a professional portfolio theme. Portfolium theme is coded in valid CSS and HTML and compatible with all browsers. It supports all Wordpress 3.0 features and gives you extra flexibility.
Author: WPSHOWER
Version: 1.0
License: GNU/GPL Version 2 or later. http://www.gnu.org/licenses/gpl.html
Tags: grids, portfolio, modern, stylish, minimalistic
Copyright: (c) 2010 WPSHOWER
*/

/*** Reset ***/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:top;background:transparent;}
body{margin-right: 15px;
margin-left: 15px;line-height:1;text-align:left;}
body {width:100%;} 
ol,ul{list-style:none;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
:focus {outline:0;}
ins{text-decoration:none;}
del{text-decoration:line-through;}
table{border-collapse:collapse;border-spacing:0;}

/*** Main ***/

html, body {height: 100%;}
body {font: 62.5% "Montserrat",Lucida Grande,Trebuchet MS, sans-serif; background: #fff;}
.clear:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
div.container.clear {width:976px !important;}
.left {float: left;}
.right {float: right;}
.wrapper {width: 976px;
min-height: 100%;
margin:0 auto 0 auto; }

/*** Header ***/
h2 {font-weight:normal }
.header { margin-bottom: 30px; padding-top: 35px;border-bottom: solid 1px;
border-color: white;
}
.logo {font-size: 19px; line-height: 0.95; width: 250px; height: 36px; padding: 0 0 0 0; float: left; position: relative;}
.logo a {color: #ccc; text-decoration: none; position: absolute; bottom: 12px;}
.logo a:hover {color: #333;}

.encadre {text-align:center;font-size:12px;background-color: #E4E4E4!important;display: block; width: 227px; height: 227px; top: 0; left: 0; color : black;   text-transform: uppercase;
  letter-spacing: 2px;
}


/*** Navigation ***/
 .current_page_item a {background-color: #F5F5F5!important; 
}
.post-edit-link{margin:5px; color: orange !important;}

.nav {vertical-align: baseline; float: left; margin-left: 15px; position: relative; z-index: 100;margin-bottom: -10px;}
.nav li { height: 40px; float: left; padding: 0 0 0 0; }
.nav li.current a {color: #333;}
.nav a {
color: black; text-transform: uppercase;
letter-spacing: 2px; font-size: 11px; text-decoration: none; padding-top: 0px;padding: 10px 15px 10px; display: block;}
.nav a:hover, .nav li.current a:hover, .jsddm_hover a, .sub-menu li a:hover {color: black;background-color: #F5F5F5!important;}
li.parent a {}
li.parent a:hover, li.jsddm_hover a {}
ul.sub-menu {position: absolute; visibility: hidden; z-index: 100; background: gainsboro; margin-top: 0px; padding: 0 0;}
ul.sub-menu li {margin-left: 0; height: auto; padding: 0 !important; border: none; float: none; background: none; }
ul.sub-menu li a {background: none !important; color: black; color: black; text-transform: uppercase;
letter-spacing: 2px; font-size: 11px; text-decoration: none; padding-top: 0px;padding: 5px 15px 5px; display: block;background: gainsboro; width:152px !important}
ul.sub-menu li a:hover {color: grey; background-color: light grey!important;}

/*** Faux Menu ***/
.menu-p {vertical-align: baseline; margin-left: 15px; position: relative; width:80px}
.menu-p a{color: black; text-transform: uppercase;letter-spacing: 2px; font-size: 11px; text-decoration: none; padding-top: 0px;padding: 7px 15px 7px; display: block;background-color: #F5F5F5;}

.menu-p a:hover {color: black;background-color: gainsboro!important;}


/*** Content ***/

.middle {padding: 0 0px 61px 0; float: left;}
.container {padding-bottom: 100px;}
.content {width: 750px; float: left;} 
.content_shop{width: 976px; float: left;}
.contentbp {width: 615px; float: left;} 

#show {width: 700px; overflow: hidden; margin-bottom: 10px;}
#show img {cursor: pointer;}
#show_nav a {font-size: 11px; color: #000; text-decoration: none; margin-right: 2px;color: black;
padding: 6px;}
#show_nav a:hover, #show_nav .activeSlide {color: #fff;background: gainsboro;}

.thumb {display: block; width: 460px; height: 460px; margin-bottom: 5px; position: relative; color: #333;}
.thumb img {display: block;}
.thumb span {display: block; width: 460px; height: 460px; position: absolute; top: 0; left: 0; background: gainsboro;}

.post_home {width: 460px; float: left; margin: 0 0 15px 20px;border-bottom: solid 1px white;}
.post_home h2 { text-transform : uppercase ; font-size: 12px; letter-spacing:2px }
.post_home h2 a {color: grey
; text-decoration: none;}
.post_home h2 a:hover {color: black;}

.thumb2 {display: block; width: 145px; height: 145px; margin-bottom: 5px; position: relative; color: #333;}
.thumb2 img {display: block;}
.thumb2 span {display: block; width: 145px; height: 145px; position: absolute; top: 0; left: 0; background: black;}
.post_home2 {width: 145px; float: left; margin: 0 0 0px 15px;}
.post_home2 h2 { text-transform : uppercase ; font-size: 10px; letter-spacing:2px }
.post_home2 h2 a {color: grey
; text-decoration: none;}
.post_home2 h2 a:hover {color: black;}
.recent {float: left;margin-top: 170px;}
.recent h3 {text-transform: uppercase;
font-size: 14px;
letter-spacing: 2px; color: #ccc; margin: 0 0 15px 15px; padding-bottom: 10px; border-bottom: 0px solid #4d4d4d;}
.recent titre {margin-bottom: 8px; border-bottom: 0px solid #4d4d4d;display:block;}



/*** Partie produits ***/
titre {
text-transform: uppercase;
font-size: 16px;
letter-spacing: 2px;

}
titre a { text-decoration: none;color: black;
text-transform: uppercase;
letter-spacing: 2px;
font-size: 11px;
text-decoration: none;
padding-top: 0px;
padding: 5px 15px 5px;
display: block;background-color: #F5F5F5;}

titre a:hover {color: black;background-color:gainsboro;}
.content_shop titre {
    font-style: normal;
}
.content_shop titre {
    font-style: normal;
}

.post_produits {width: 244px; float: left; margin: 0 0 15px 0px;text-decoration: none !important}
.post_produits h2 { text-transform : uppercase ; letter-spacing:2px }
.post_produits h2 a {color: grey; text-decoration: none;}
.post_home h2 a:hover {color: black;}

.produits_single_post .content {width: 700px;}




.thumb_produits {display: block; width: 227px; height: 227px; margin-bottom: 5px; position: relative; color: #333;}
.thumb_produits img {display: block;}
.thumb_produits span {display: block; width: 227px; height: 227px; position: absolute; top: 0; left: 0; background: gainsboro;}

.titre_produits {float: left; width: 960px;  margin-bottom: 0px; padding-top: 20px;border-bottom: solid 0px grey;border-top: solid 0px grey;     padding: 40px 10px 40px 5px; text-decoration: none;
color: black;

}

.menu_produits {

height: 150px;
margin: 0px;
background: #F5F5F5;}

.produits_single_post .l_col {width: 225px;
margin-right: 30px;
margin-left: 10px;
float: left;}

/*** Blog ***/

.posts{width :700px; margin-left:150px;}



.page_meta {height: 100px;}
.page_meta a {color: #ccc; text-decoration: none;}
.page_meta a:hover {color: grey;}
.rss, .tags, .search {width: 145px; height: 100px; float: left; margin-left: 15px; font-size: 11px; font-weight: bold; line-height: 85px; color: #ccc; border-bottom: 0px solid #4d4d4d;}
.heading {width: 290px; height: 100px; float: left; margin-left: 15px; font-size: 31px; font-weight: bold; line-height: 85px; color: #ccc; border-bottom: 0px solid #4d4d4d;}
.tags {position: relative;}
.tags a {background: url("i/tags.gif") 100% 50% no-repeat; padding-right: 10px;}
.tags a:hover {background: url("i/tags.gif") 100% 50% no-repeat;}
.taglist {margin-top: 16px; background: #333; position: absolute; left: -15px; width: 145px; padding: 15px 0 15px 15px; visibility: hidden;}
.taglist li {line-height: 1.5;}
.taglist li a {color: #ccc !important; background: none !important; font-weight: normal; display: block;}
.taglist li a:hover {color: grey !important;}
.tags .jsddm_hover a {color: grey; background: url("i/tags.gif") 100% 50% no-repeat; padding-right: 10px;}

.search input {background: none; border: none; color: #ccc; font: bold 11px 'Montserrat',Helvetica, Arial, sans-serif; width: 460px;}

.post_list, .post_single {padding: 30px 0 0px; background: url("i/post_list.gif") 0 100% no-repeat;}
.post_single {background: none;}
.post_list a, .post_single a {color: grey; text-decoration: none; border-bottom: 1px dashed;}
.post_list a:hover, .post_single a:hover {text-decoration: underline;}
.post_list h2, .post_single h2, .page h2 {font-size: 26px; color: #333; font-weight: normal; margin-bottom: 15px; margin-left: -30px;text-transform: uppercase;
font-size: 14px;
letter-spacing: 2px;
color: black;}
.page {padding-top: 15px;text-transform: uppercase;
font-size: 14px;
letter-spacing: 2px;
color: black;}
.page h2 {padding-left: 0;}
.post_list h2 a, .post_single h2 a, .page h2 a {color: #333; text-decoration: none;border-bottom: 1px dashed;}
.post_list h2 a:hover, .post_single h2 a:hover, .page h2 a:hover {color: grey; text-decoration: none;}
.post_list_meta, .post_single_meta {width: 460px; margin-left: 0px; float: left;}
.post_list_meta p, .post_single_meta p, .post_share {color: #ccc; font-size: 11px; margin-bottom: 11px; line-height: 1.7;float:left}
.post_date {margin-bottom: 0 !important; float:left}
.post_share {}
.sharelist {display: none; margin-top: 11px;}
.sharelist li {margin-bottom: 3px;}

.post_content {width: 700px; margin-left: 0px; float: left;}
.more {margin-bottom: 0; font-weight: bold;}

.post_content h1, .post_content h2, .post_content h3, .post_content h4, .post_content h5, .post_content h6 {color: #333; margin: 15px 0; font-weight: normal;}
.post_content h1, .post_content h2 {font-size: 26px;}


.post_content p {color: #333; font-size: 12px; line-height: 1.5; margin-bottom: 12px;}
.post_content a {color: grey;}
.post_content a:hover {text-decoration: none;}
.post_content ul, .post_content ol {margin-bottom: 12px; padding-left: 40px;}
.post_content li {color: #333; font-size: 12px; line-height: 1.5;}
.post_content ul li {list-style: circle;}
.post_content ol li {list-style: decimal;}
.post_content blockquote {color: #ccc; font: italic 16px Georgia, Geneva, "Times New Roman", times; padding-left: 70px; margin: 15px 0;}
.post_content blockquote p {color: #ccc; font: italic 16px Georgia, Geneva, "Times New Roman", times;}

/*** Images ***/

.post_content img { margin: 0; height: auto; max-width: 700px; width: auto; }
.post_content .attachment img { max-width: 700px; }
.post_content .alignleft, .post_content img.alignleft { display: inline; float: left; margin-right: 15px; margin-top: 4px; }
.post_content .alignright, .post_content img.alignright { display: inline; float: right; margin-left: 15px; margin-top: 4px; }
.post_content .aligncenter, .post_content img.aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; }
.post_content img.alignleft, .post_content img.alignright, .post_content img.aligncenter { margin-bottom: 12px; }
.post_content .wp-caption { background: #f1f1f1; line-height: 18px; margin-bottom: 20px; padding: 4px; text-align: center; }
.post_content .wp-caption img { margin: 5px 5px 0; }
.post_content .wp-caption p.wp-caption-text { color: #888; font-size: 12px; margin: 5px; }
.post_content .wp-smiley { margin: 0; }
.post_content .gallery { margin: 0 auto 18px; }
.post_content .gallery .gallery-item { float: left; margin-top: 0; text-align: center; width: 33%; }
.post_content .gallery img {  }
.post_content .gallery .gallery-caption { color: #888; font-size: 12px; margin: 0 0 15px; }
.post_content .gallery dl { margin: 0; }
.post_content .gallery img { border: 0px !important }
.post_content .gallery br+br { display: none; }
.post_content .attachment img { /* single attachment images should be centered */ display: block; margin: 0 auto; }

/*** Pagination ***/

.pagination {padding: 15px 0 15px 15px;}
.pagination_ctrl {height: 30px; width: 460px; float: left; background-color:white; position: relative;}
.nextpostslink, .previouspostslink {}
.nextpostslink {
float:right;
right: 7px;
text-decoration: none;color: black;
text-transform: uppercase;
letter-spacing: 2px;
font-size: 11px;
text-decoration: none;
padding: 10px;
display: block;background-color: gainsboro;
}
.previouspostslink {
float:left;
text-decoration: none;color: black;
text-transform: uppercase;
letter-spacing: 2px;
font-size: 11px;
text-decoration: none;
padding: 10px;
display: block;background-color: gainsboro;}
.nextpostslink:hover {background-color: #F5F5F5;}
.previouspostslink:hover {background-color: #F5F5F5;}
.pagination_pages {height: 30px; line-height: 30px; float: right; margin-left: 15px;}
.pagination_pages a, .pagination_pages span {margin: 0 6px; padding: 5px; color: grey; text-decoration: none; font-size: 11px;}
.pagination_pages a:hover {text-decoration: underline;}
.pagination_pages .current {color: #ccc;}

/*** Comments ***/

.comments_heading {padding-bottom: 10px;}
.add_comment {width: 460px; height: 25px; float: left; margin-left: 15px; font-size: 11px; border-bottom: 1px solid #4d4d4d;}
.add_comment a {color: grey; text-decoration: none;}
.add_comment a:hover {text-decoration: underline;}
.comment_qty {width: 785px; height: 25px; margin-left: 15px; float: left; border-bottom: 1px solid #4d4d4d; color: #ccc; font-size: 12px;}
.nopassword {color: #ccc; font-size: 12px; padding-left: 15px;}

.comment_item {padding: 15px 0; background: url("i/post_list.gif") 0 100% no-repeat;}
.comment_meta {float: left; width: 460px; margin-left: 15px; color: #ccc; font-size: 11px; line-height: 1.7;}
.comment_meta a {color: grey; text-decoration: none; font-style: normal;}
.comment_meta a:hover {text-decoration: underline;}
.comment_text {width: 785px; margin-left: 15px; float: left; color: #ccc; font-size: 12px; line-height: 1.5;}

#respond {margin-top: 30px;}
.respond_meta {float: left; width: 460px; margin-left: 15px; color: #ccc; font-size: 12px; font-weight: bold;}
.comment_form {padding-bottom: 60px; width: 785px; float: left; margin-left: 15px;}
.comment_fields {margin-bottom: 25px;}
#author, #email, #url {width: 225px; float: left; margin: 0 15px 0 0; padding: 0; color: #ccc; font-size: 12px; border: none; border-bottom: 1px solid #4d4d4d; background: none; padding-bottom: 8px; overflow: hidden;}
#url {width: 305px; margin: 0;}
.comment_form textarea {width: 785px; height: 125px; overflow: auto; border: none; border-bottom: 1px solid #4d4d4d; background: none; color: #ccc; font: 12px 'Montserrat',Helvetica, Arial, sans-serif; margin-bottom: 15px;}
.comment_submit {text-align: right;}
#submit {width: 170px; height: 40px; padding: 0 15px; background: #4d4d4d url("i/comment_submit.gif") 146px 17px no-repeat; border: none; text-align: left; color: #333; font: 12px 'Montserrat',Helvetica, Arial, sans-serif; cursor: pointer;}
#submit:hover {background: grey url("i/comment_submit.gif") 146px -26px no-repeat; color: #4d4d4d;}
.comment_message {color: #333; font-size: 12px; margin-bottom: 12px;}
.comment_message a {color: grey; text-decoration: none;}
.comment_message a:hover {text-decoration: underline;}

/*** Left column ***/

.l_col {width: 215px; margin-left: 10px; float: left;}

.l_col .post_portfolio h2 {text-transform: uppercase;
font-size: 14px;
letter-spacing: 2px;color: black; }
.post_divider {font-size: 11px; color: #b8b8b8;}
.l_col .post_portfolio p {color: grey; line-height: 1.3; margin-bottom: 15px; font-size: 11px;}
.l_col .post_portfolio a {color: black; text-decoration: none;}
.l_col .post_portfolio a:hover {text-decoration: underline;}
.address{color:orange !important}

/*** Footer ***/

.footer {width: 976px; position: relative; margin: -61px 0 0; padding-left: 30px;}
.footer_inn {margin: 0 15px; border-top: 1px solid #4d4d4d; height: 36px; padding-top: 10px;}
.footer_inn p {font-size: 11px; color: #ccc;}
.footer_inn a {color: #fff; text-decoration: none;}
.footer_inn a:hover {color: grey;}
.wpshower_logo {background: url("i/wpshower_logo.png") 0 2px no-repeat; padding: 0 0 0 9px;}


/*** Portfolio brick ***/
/* masonry brick layout */
#container2 {
    width:      1000px; /* width of the entire container for the wall */
        margin-bottom: 10px;
}
 



.brick {
    width:      30%; /* width of each brick less the padding inbetween */
    padding:    0px 10px 0px 0px;
        background-color: white;
float: left;
        margin-top: 0px;
}
 
.brick_header{
border-bottom: solid 0px white;
padding-bottom: 10px;
padding-top: 10px;
}

.brick_featured_image{
width: 100%;
margin-top: 10px;
}
.brick_featured_image img{
opacity: 0.8;
width: 100%;
height: auto;
}


.brick_featured_image img{
    opacity: 1;
    -webkit-transition: all 0.2s ease-in-out;
}

.brick_header h2 { text-transform : uppercase ; font-size: 10px; letter-spacing:2px }
.brick_header h2 a {color: grey
; text-decoration: none;}
.brick_header h2 a:hover {color: black;}




#containerport {
    width:      980px; /* width of the entire container for the wall */
        margin-bottom: 10px;
}

.brickport {
    width:      48%; /* width of each brick less the padding inbetween */
    padding:    0px 0px 0px 0px;
        background-color: white;
float: left;
        margin-top: 0px;
}
 
.brickport_header{
border-bottom: solid 1px white;
padding-bottom: 10px;
padding-top: 10px;
}

.brickport_featured_image{
width: 100%;
margin-top: 10px;
}
.brickport_featured_image img{
    opacity: 1;
    -webkit-transition: all 0.2s ease-in-out;
width: 100%;
height: auto;
}


.brickport_header h2 { text-transform : uppercase ; font-size: 10px; letter-spacing:2px }
.brickport_header h2 a {color: grey
; text-decoration: none;}
.brickport_header h2 a:hover {color: black;}