/*
Theme Name: MarcelloKarra Domain: marcellokarra
Version: 1.0*/
/*** fonts ***/
@import url('https://fonts.googleapis.com/css?family=Encode+Sans:100,200,300,400,500,600,700,800,900');

@font-face {
font-family: 'marcellokarra';
src: url('fonts/marcellokarra.eot'); /* IE9 Compat Modes */
src: url('fonts/marcellokarra.eot?iefix') format('eot'), /* IE6-IE8 */
	 url('fonts/marcellokarra.woff') format('woff'), /* Modern Browsers */
	 url('fonts/marcellokarra.ttf')  format('truetype'); /* Safari, Android, iOS */
}

@font-face {
font-family: 'socialnetworks';
src: url('fonts/socialnetworks.eot?v=1'); /* IE9 Compat Modes */
src: url('fonts/socialnetworks.eot?iefix') format('eot'), /* IE6-IE8 */
	 url('fonts/socialnetworks.woff?v=1') format('woff'), /* Modern Browsers */
	 url('fonts/socialnetworks.ttf?v=1')  format('truetype'); /* Safari, Android, iOS */
}

/* 
	http://meyerweb.com/eric/tools/css/reset/  -  v2.0 | 20110126
	html5doctor.com Reset Stylesheet v1.6.1 - Last Updated: 2010-09-17 - Author: Richard Clark
*/
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,button,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,input,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:0 0}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
body{line-height:1;}
blockquote,q{quotes:none}
blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}
button{cursor:pointer}
table{border-collapse:collapse;border-spacing:0}
a,hr{padding:0}
ins,mark{background-color:#ff9;color:#000}
nav ul{list-style:none}
ins{text-decoration:none}
mark{font-style:italic;font-weight:700}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
hr{height:1px;border:0;border-top:1px solid #ccc;margin:1em 0}
input,select{vertical-align:middle;}
*:focus {outline:none}
*, *:after, *:before {-webkit-box-sizing: border-box; box-sizing: border-box;}
a{display:inline-block}
a:link, a:visited, a:before, a:after, a *, a *:before, a *:after, button, input[type="submit"], input[type="radio"]{text-decoration:none;-moz-transition: all 0.2s linear;-webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; color:#29d}
a:hover{text-decoration:underline}




/*** Globale ***/
p{font-size:16px; line-height:19px; color:#444; margin:15px 0}
input, button, select{font-size:12px; line-height:15px; background:#444; color:#fff; padding:10px; }
button{border:none}
.clearfix:after {content: ""; display: table; clear: both;*zoom: 1}
.absolutehidden{position:absolute; top:-9999px;}
.abs-center {position:relative; overflow:hidden}
.abs-center img{position:absolute; margin:auto; left:-9999px; right:-9999px; top:-9999px; bottom:-9999px;}
.overlay{ background-color: #000; height: 100%;  left: 0;  opacity: 0.70; filter: alpha(opacity =70); position: fixed; top: 0; width: 100%;z-index:1;}
.flex-group{display:flex}
.item-3{width:30%}
.item-33{width:33.33%}
.item-5{width:50%}
.item-7{width:70%}
.item-full{width:100%}
.alignleft {	float: left;	margin: 0.375em 1.75em 1.75em 0;}
.alignright {float: right;	margin: 0.375em 0 1.75em 1.75em;}
.aligncenter {clear: both;	display: block;	margin: 0 auto 1.75em;}

@media screen and (max-width:767px){
	.item-7, .item-33, .item-3{width:100%}
}

/*** Layout ***/
body{ min-width:320px; background:#000; color:#fff}
html, body, #header, #main{height:100%; font-family: 'Encode Sans', sans-serif; font-weight:400;}
#header{width:20%; background:#111; position:fixed;}
#main{margin-left:20%}
.home #search-header{padding:0}
.home #main{overflow:hidden}
	
@media screen and (max-width:1023px){
	#header{display:none; width:250px; z-index:2}
	#main{margin:0}
	#showmenu{text-decoration:none; position:relative;left:0; z-index:2; display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px}
	#showmenu:after{content:"m"; font-size:32px; height: 24px; font-family:marcellokarra; display: inline-block; vertical-align:middle}
	#showmenu.open{position:fixed; left:260px}
	#search-header > .item-full, #search-header > .item-7{align-items:center}
}
@media screen and (min-width:1024px){
	.overlay{display:none}
}

/*** Loader ***/
.pace {-webkit-pointer-events: none; pointer-events: none; -webkit-user-select: none;-moz-user-select: none;user-select: none;}
.pace-inactive { display: none;}
.pace .pace-progress {background: #29d;position: fixed;z-index: 2000; top: 0; right: 100%; width: 100%; height: 2px;}

/*** Offline Page ***/
#loginform {max-width:320px; margin:auto}
#loginform label{display:block; color:#fff; margin-bottom:4px}
#loginform #user_login, #loginform #user_pass{width:100%}
#loginform #wp-submit{background: #666 none repeat scroll 0 0; color: #fff;  height: 40px; min-width:200px; cursor:pointer; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}


/*** Main Header ***/
#header {overflow:hidden; border-right:2px solid #222;}
#header .scroll-y{padding:15px 0; height:100%; overflow-y:scroll; width:-webkit-calc(100% + 17px); width: -moz-calc(100% + 17px); width: calc(100% + 17px);}
#header .profile{-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; width:125px; height:125px; border:2px solid #eee; margin:0 auto 10px; overflow:hidden}
#header .profile img{max-width:125px; height: auto;}
#header h1, #header h3{color:#fff; text-align:center; margin:10px 0} 
#header h1 span, #header h3 span{display:block; font-size:16px; font-weight:500; line-height:20px; text-transform:uppercase}
#header h1 span:nth-of-type(2), #header h3 span:nth-of-type(2){font-weight:800; font-size:27px;}
#header nav{text-align:center; margin:20px 0;}
#header nav ul li{border-bottom:1px solid #222}
#header nav ul li:last-child{border:none}
#header nav ul li a{color:#fff; font-size:13px; line-height:16px; font-weight:300; padding:10px 0px; width:100%; text-decoration:none; text-transform: uppercase; width:100% }
#header nav ul li a:hover{background:#222; font-weight:500}
#header .terms ul{margin-top:10px}
#header .terms ul li a, #header .terms p{color:#fff; font-size:9px; line-height:12px; text-align:center}
#header .socials, #header .terms{text-align:center; padding:0 0 10px 0}
#header .socials ul, #header .terms ul{list-style:none; display:inline-block}
#header .socials ul li, #header .terms ul li{float:left; text-align:center; margin:0 10px}
#header .socials ul li a{height:40px; line-height:38px; width:40px; height:40px; color:#fff; text-align:center; text-decoration:none; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;}
#header .socials li a{background:#222}
#header .socials li a:hover{background:#333}
#header .socials li.facebook a:before, #header .socials li.flickr a:before{font-family:socialnetworks; color:#fff; font-size:20px; display:inline-block; vertical-align:middle;}
#header .socials li.facebook a:before{content:"f";  text-transform:lowercase;}
#header .socials li.facebook a:hover{background:#4867AA}
#header .socials li.flickr a:before{content:"F";}
#header .socials li.flickr a:hover{background:#FF0084}
.mobile-header{display:flex; justify-content:space-between; align-items:center}
.mobile-header a, .mobile-header a span{font-size:130%; color:#fff; font-weight:500}
.mobile-header a:hover{text-decoration:none}
.home .mobile-header > a:first-of-type{margin-left:10px}
.home .mobile-header{flex-direction:row-reverse}

@media screen and (min-width:1024px){
	.mobile-header{display:none}
}

/*** Search Header ***/
#search-header {padding:10px; flex-wrap:wrap;}
#search-header h1, #search-header h2, #search-header h3{display:inline-block; font-size:20px; font-weight:200; line-height:39px}
#search-header h1, #search-header h2{font-size:28px}
#search-header [type="text"]{float:left; height:40px; width:80%; -webkit-border-top-left-radius: 3px;-webkit-border-bottom-left-radius: 3px;-moz-border-radius-topleft: 3px;-moz-border-radius-bottomleft: 3px;border-top-left-radius: 3px;border-bottom-left-radius: 3px;}
#search-header [type="text"]:hover{background:#555}
#search-header button{height:40px; width:20%; background:#666; color:#fff; -webkit-border-top-right-radius: 3px;-webkit-border-bottom-right-radius: 3px;-moz-border-radius-topright: 3px;-moz-border-radius-bottomright: 3px;border-top-right-radius: 3px;border-bottom-right-radius: 3px;}
#search-header button:hover{background:#777}

/*@media screen and (max-width:479px){
	#search-header h1, #search-header h3{font-size:18px; line-height:inherit; padding:10px 5px}
}*/
/* @media screen and (min-width:480px) and (max-width:767px){
	#search-header h1, #search-header h3{font-size:22px; line-height:inherit; padding:10px 5px}
} */
@media screen and (max-width:767px){
	#search-header form{margin:10px 0}

}
@media screen and (max-width:1023px){
	#search-header h1, #search-header h2, #search-header h3{padding:0 10px; flex:1; text-align:left}
}
/*** Home Cats Main ***/
#home-cats{flex-wrap:wrap; margin:2px 10px; height:100%; height:-webkit-calc(100% - 64px); height: -moz-calc(100% - 64px); height: calc(100% - 64px);  justify-content: space-between; -webkit-justify-content: space-between;}
#home-cats a {padding:10px; text-decoration:none; margin:0 5px 10px 5px; width:33.33%; width:-webkit-calc(33.33% - 10px); width: -moz-calc(33.33% - 10px); width: calc(33.33% - 10px); max-height: 350px;}
#home-cats a:hover{background:#111;}
#home-cats a figure div.abs-center{min-height:150px;}
#home-cats a figure div.abs-center img{max-width:100%; height: auto;}
#home-cats a:hover figure div.abs-center:after, #home-cats a:hover figure div.abs-center:before{content:""; background:rgba(0,0,0,0.5); position:absolute; bottom:0; left:0; right:0; top:0; margin:auto; z-index:0; }
#home-cats a:hover figure div.abs-center:before{content:"z"; font-family:marcellokarra; z-index:1;display:block; font-size:22px; color:#fff; height:0; text-align:center }
#home-cats a:hover figure div.abs-center img{-ms-transform:scale(1.02); -webkit-transform: scale(1.1); transform: scale(1.1);}
#home-cats a figure figcaption{text-align:justify}
#home-cats a figure figcaption h2{ font-size: 16px; font-weight: 500; line-height: 20px;  text-transform: uppercase; padding-top:10px; color:#eee}
#home-cats a figure figcaption p{color:#eee; font-weight:400; font-size:12px; line-height:15px}

@media screen and (max-width:479px){
	#home-cats a{width:100%; margin:0}
}
@media screen and (min-width:480px) and (max-width:767px){
	#home-cats a{width:50%; width:-webkit-calc(50% - 10px); width: -moz-calc(50% - 10px); width: calc(50% - 10px);}
}
@media screen and (max-width:767px){
	#home-cats{margin:0}
}

/*** Category Filters ***/
#cat-filters{border-bottom:1px solid #222; border-top:1px solid #222; background:#111; height:60px; position:relative; z-index:0; max-width: 100%;}
#cat-filters a{line-height:60px; height:60px; width:100%; text-align:center; font-size:13px; text-decoration:none; text-transform:uppercase; font-weight:700;}
#cat-filters a span{color:#eee}
#cat-filters a:hover{text-decoration:none}
#cat-filters a:before, #cat-filters .current-menu-item a:before{content: "";  position: absolute; width: 100%; height: 4px; bottom: 0px; left: 0; background-color:#006dac; visibility: hidden; -webkit-transform: scaleY(0); transform: scaleY(0); -webkit-transition: all 0.15s ease-in-out 0s; transition: all 0.15s ease-in-out 0s;}
#cat-filters a:hover:before, #cat-filters .current-menu-item a:before{visibility: visible; -webkit-transform: scaleY(1); transform: scaleY(1);}
#cat-filters .owl-theme .owl-nav{ bottom: 0; height: 0;  left: 0; margin: auto;  position: absolute; right: 0; top: 0;} 
#cat-filters .owl-theme .owl-nav .owl-prev, #cat-filters .owl-theme .owl-nav .owl-next{ position: absolute; top:-60px; height:49px;  line-height:50px;filter: alpha(opacity=0); background:#006dac; font-size:28px; font-family:marcellokarra}
#cat-filters .owl-theme .owl-nav [class*=owl-]{margin:5px 0}

@media screen and (-webkit-min-device-pixel-ratio:0) {
  	#cat-filters .owl-theme .owl-nav .owl-prev, #cat-filters .owl-theme .owl-nav .owl-next{top:-30px;}
}

#cat-filters:hover .owl-theme .owl-nav [class*="owl-"]{opacity: 1;  filter: alpha(opacity=100);}
#cat-filters .owl-theme .owl-nav [class*="owl-"]:hover{background:#006dac}
#cat-filters .owl-theme .owl-nav .owl-prev{ left: 15px;}
#cat-filters .owl-theme .owl-nav .owl-next{ right: 15px; }

@media screen and (min-width:1024px){
	#cat-filters.fixed{max-width:80%}
	#cat-filters .owl-theme .owl-nav .owl-prev, #cat-filters .owl-theme .owl-nav .owl-next{ opacity: 0;  }
}

/*** Category Gallery ***/
#masonry-gallery{padding:10px; margin:auto}
#masonry-gallery p{text-align:justify; color:#eee}
#masonry-gallery .image-wrapper{display: inline-block; position:relative; z-index:0}
#masonry-gallery .image-thumb {max-width: 100%;}
#masonry-gallery .images-grid {text-align: justify;font-size: 0;line-height: 0;}
#masonry-gallery .images-grid > figure{display: inline-block; margin-top: 3px; position:relative; z-index:0} 
#masonry-gallery .images-grid figure a{position:relative; overflow:hidden}
#masonry-gallery .images-grid figure a:hover:after{content:""; background:rgba(0,0,0,0.5); position:absolute; bottom:0; left:0; right:0; top:0; margin:auto; z-index:0}
#masonry-gallery .images-grid figure a:hover:before{content:"z"; font-family:marcellokarra; position:absolute; bottom:0; left:0; right:0; top:0; z-index:1; margin:auto; display:block; font-size:22px; color:#fff; height:0; text-align:center }
#masonry-gallery .images-grid figure a:hover img{-ms-transform:scale(1.02); -webkit-transform: scale(1.1); transform: scale(1.1);}

#classic-gallery p{text-align:justify; color:#eee; padding:10px 15px}
#classic-gallery .desc-content {padding:10px 15px; margin:15px 0 0}
#classic-gallery .desc-content p{padding:0; margin:0}
#classic-gallery p.pagination{text-align:center;}
#classic-gallery p.pagination a, #classic-gallery p.pagination .current {background:  #444; color: #fff; font-size: 15px; padding: 10px 15px;}
#classic-gallery p.pagination .current {background: #666666; padding: 9px 15px 10px;}
#classic-gallery p.pagination a:hover{background: #666666; text-decoration:none}
#classic-gallery .images-grid{flex-wrap:wrap; margin:2px 10px; height:100%;/*justify-content: space-between; -webkit-justify-content: space-between;*/}
#classic-gallery .images-grid p{padding:0; font-size:12px; line-height:15px}
#classic-gallery .images-grid figure{padding:10px; cursor:pointer; text-decoration:none; margin:0 5px 10px 5px; width:33.33%; width:-webkit-calc(33.33% - 10px); width: -moz-calc(33.33% - 10px); width: calc(33.33% - 10px); }
#classic-gallery .images-grid figure:hover{box-shadow: inset 0 0 1px #fff;}
#classic-gallery .images-grid figure .abs-center{min-height:150px; width:100%; position:relative}
#classic-gallery .images-grid figure .abs-center img{height:auto!important; max-width:100%}
#classic-gallery .images-grid figure .abs-center:hover:after, #classic-gallery .images-grid figure .abs-center:hover:before{content:""; background:rgba(0,0,0,0.5); position:absolute; bottom:0; left:0; right:0; top:0; margin:auto; z-index:0; }
#classic-gallery .images-grid figure .abs-center:hover:before{content:"z"; font-family:marcellokarra; z-index:1;display:block; font-size:22px; color:#fff; height:0; text-align:center }
#classic-gallery .images-grid figure .abs-center:hover img{-ms-transform:scale(1.02); -webkit-transform: scale(1.1); transform: scale(1.1);}
#classic-gallery .images-grid figure figcaption{text-align:justify;}
#classic-gallery .images-grid figure figcaption h2{ font-size: 16px; font-weight: 500; line-height: 20px;  text-transform: uppercase; padding-top:10px; color:#eee}
#classic-gallery .images-grid figure figcaption p{color:#eee; font-weight:400; font-size:15px; line-height:18px}

@media screen and (max-width:479px){
	#classic-gallery .images-grid figure{width:100%; margin:0}
}
@media screen and (min-width:480px) and (max-width:767px){
	#classic-gallery .images-grid figure{width:50%; width:-webkit-calc(50% - 10px); width: -moz-calc(50% - 10px); width: calc(50% - 10px);}
}
@media screen and (max-width:767px){
	#classic-gallery{margin:0}
	#classic-gallery p, #classic-gallery .images-grid figure figcaption p{font-size:12px; line-height:15px}
}

/*** Page ***/
.main-article p{text-align:justify; color:#eee; padding:10px 0}
/*.main-article .wpcf7-form {display:flex; width:100%; flex-wrap:wrap;}
.main-article .wpcf7-form > p{width:33.33%; width:-webkit-calc(33.33% - 10px); width: -moz-calc(33.33% - 10px); width: calc(33.33% - 10px); }
.main-article .wpcf7-form > p:last-of-type{width:100%}
.main-article .wpcf7-form input{cursor:text}
.main-article .wpcf7-form input, .main-article .wpcf7-form textarea, .main-article .wpcf7-form input, .main-article .wpcf7-form select{width: 100%;}
.main-article .wpcf7-form [type="submit"]{width: auto}
.main-article .wpcf7-form textarea{max-width:100%}
.main-article .wpcf7-form  .wpcf7-not-valid-tip{font-size:11px; margin-top:5px}
.main-article .wpcf7-form .wpcf7-form-control-wrap{display: block; margin: 10px 0 0;}
.main-article .wpcf7-form .wpcf7-submit{background: #666 none repeat scroll 0 0; color: #fff;  height: 40px; min-width:200px; cursor:pointer; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}*/
.page .main-article{padding:20px}
.page .main-article p.cols-100{width:100%}
/*
@media screen and (max-width:479px){
	.main-article .wpcf7-form > p{width:100%; margin:0}
	.main-article .wpcf7-form input, .main-article .wpcf7-form textarea, .main-article .wpcf7-form input, .main-article .wpcf7-form select{width:100%}
}
@media screen and (min-width:480px) and (max-width:767px){
	.main-article .wpcf7-form > p{width:50%; width:-webkit-calc(50% - 10px); width: -moz-calc(50% - 10px); width: calc(50% - 10px); margin:5px}
}
@media screen and (min-width:768px){
}*/

/*** HomeSlide ***/
#homeslide.owl-carousel{height:100%}
#homeslide.owl-carousel:before{content:""; background-image:url("images/loading.gif"); background-repeat:no-repeat;background-size: 10% auto;  background-position: center; position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; z-index:6}
#homeslide.owl-carousel .owl-stage{visibility:hidden;}
#homeslide.owl-carousel.show .owl-stage{visibility:visible}
#homeslide.owl-carousel.show:before{background-image:none; z-index:-1}
#homeslide.owl-carousel .owl-item{overflow:hidden}
#homeslide.owl-carousel .owl-item div{display:flex; justify-content:center}
#homeslide.owl-carousel .owl-item div img{width:auto; max-width:100%; max-height:100vh; height:auto}

@media screen and (min-width:1024px){
	#homeslide.owl-carousel .owl-item div{align-items:center; height:100vh; width:100%;}	
	
}

#cmplz-document .cmplz-dropdown a, #cmplz-document .cmplz-dropdown p, #cmplz-document li, #cmplz-document p, #cmplz-document td, #cmplz-cookies-overview .cmplz-dropdown a, #cmplz-cookies-overview .cmplz-dropdown p {font-size: 16px;line-height: 20px;}
#cmplz-document { max-width: 100%; }
#cmplz-document h2, #cmplz-document h3 { border: none; margin-top: 40px; margin-bottom: 0px; }
#cmplz-cookies-overview .cmplz-dropdown .cookies-per-purpose div, #cmplz-document .cmplz-dropdown .cookies-per-purpose div{color:#222}

/*** cf7 ***/
.wpcf7 div {width: 100%}
.wpcf7 div > div{margin-bottom:20px}
.wpcf7 p{padding:0}
.wpcf7 .wpcf7-list-item{margin:0}
.wpcf7 .wpcf7-form-control-wrap.privacy{margin-right:10px;margin-top: 0;display:inline-block}
.wpcf7 .wpcf7-form-control-wrap, .wpcf7 [type=submit]{margin-top:5px; display:block}
.wpcf7 [type=text], .wpcf7 [type=tel], .wpcf7 [type=email], .wpcf7 textarea{width:100%}
.wpcf7 [type=submit]{color:#fff;text-transform:uppercase;cursor:pointer}
.wpcf7 form .wpcf7-response-output{margin-left:0; margin-right:0}

@media screen and (min-width:768px){
	
.wpcf7 div{font-size:16px;line-height:19px}
.wpcf7 form{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}
.wpcf7 div.cols-3, .wpcf7 div.cols-2{display:-webkit-box;display:-ms-flexbox;display:flex; width:100%}
.wpcf7 div>span{display:block}
.wpcf7 div.cols-3>div{width:33.33%}
.wpcf7 div.cols-3>div:nth-of-type(1){padding-right:20px}
.wpcf7 div.cols-3>div:nth-of-type(2){padding:0 10px}
.wpcf7 div.cols-3>div:nth-of-type(3){padding-left:20px}
.wpcf7 div.cols-2 > p{width: 66.66%; padding-right: 10px}
.wpcf7 textarea{height:110px; display: block;}
.wpcf7 .ajax-loader{position:absolute; margin-top:10px}
.wpcf7 div.cols-3+p{width: calc(66.66% - 10px);}
.wpcf7 [type=submit]{margin:10px 0 0}

}