/* Layout for desktop version */

@font-face {
    font-family: 'BebasNeueRegular';
    src: url('fonts/BebasNeue-webfont.eot');
    src: url('fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/BebasNeue-webfont.woff') format('woff'),
         url('fonts/BebasNeue-webfont.ttf') format('truetype'),
         url('fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}


/********************/
/****** Layout ******/
/********************/

body {font-size:100%; width:100%; }

.logo a {border-bottom:none; background:url(images/joaquim-logo-new-black.png) center no-repeat; text-indent:-5000px;display:block; width:200px; height:141px;}

#cd-nav li a { font-family: BebasNeueRegular, sans-serif; font-weight:bold; font-size:18px; letter-spacing:0.07em;}

.cbp-rfgrid {
    margin: 35px 0 0 0;

    list-style: none;
    position: relative;
    width: 99%;padding-left:1%;
}
 
.cbp-rfgrid li {
    position: relative;
    float: left;
    overflow: hidden;
    width: 16%; /* Fallback */
    width: -webkit-calc(93.8888% / 5);
    width: calc(93.8888% / 5);
    margin-right:20px;
}

.cbp-rfgrid li:last-child {
	margin-right:0px !important;
	}
 
.cbp-rfgrid li a,
.cbp-rfgrid li a img {
    display: block;
    width: 100%;
    cursor: pointer;
    text-decoration: none;
}
 
.cbp-rfgrid li a img {
    max-width: 100%;
}

/****** Footer ******/

.footer {position:fixed;bottom:0; left:0; z-index:5000;  height:165px; font-family: BebasNeueRegular, sans-serif; font-weight:bold;padding-top:30px; font-size:14px; background:rgba(255,255,255,0.8);}
.header { height:115px; font-family: BebasNeueRegular, sans-serif; font-weight:bold; font-size:14px; position:fixed;}

.footer .categorie, .header .categorie { padding:40px 0; text-align:center; border-bottom:none; /*font-size:35px;*/ font-size:45px; color:white; text-transform:uppercase; display:block; height:55px; line-height:70px; letter-spacing:0.05em;}

.footer .events, .header .events {background:url(images/events.jpg); background-width:150px; }
.footer .people, .header .people {background:url(images/people.jpg); }
.footer .moments, .header .moments {background:url(images/moments.jpg); }
.footer .travel, .header .travel {background:url(images/travel.jpg); }

.impressum {position:fixed; font-size:15px; bottom:5px; left:50%; margin-left:-54px; z-index:10000; color:rgba(0,0,0,0.2); }
.impressum a {color:rgba(0,0,0,0.2); font-family: BebasNeueRegular, sans-serif; text-decoration:none; letter-spacing:0.07em;}
.impressum a:hover {color:black;}

.imprint h3 {font-family: BebasNeueRegular; font-size:30px; margin-top:70px;}
.imprint h4 {margin:30px 0 10px;}
.imprint p {margin:0 !important;}


/****galleries****/
.galleries-content {font-family: BebasNeueRegular, sans-serif; font-weight:bold;padding-top:30px; font-size:28px;text-align:center; }
.galleries-content a {color:#818181; border:none; line-height:100px; }
.galleries-content a:hover {color:black;}

.container {width:90%; margin:0 auto;}

.masonry {
  margin: 0 auto;
}

.masonry .item {margin-bottom:-20px !important;}

.item { width: 23.333%; margin-bottom:-10px !important; }
.item.w2 { width: 47.333%; }

.galleries-photos {margin-top:40px;}
.galleries-photos .fancybox-placeholder { display: block !important; }

.container a {border:none !important;}

/* Layout for mobile version */

@media handheld, only screen (min-width: 1000px) and (max-width: 1400px) {


}


/* Example for media query: change number of items per row */

@media screen and (max-width: 1330px) {
	.cbp-rfgrid li {
		width: 15%; /* Fallback */
		width: -webkit-calc(93.8888%  / 5);
		width: calc(93.8888%  / 5);
		margin-right:15px;
	}
}


@media screen and (max-width: 1190px) {
	.cbp-rfgrid li {
		width: 20%; /* Fallback */
		width: -webkit-calc(93.8888%  / 5);
		width: calc(93.8888%  / 5);
		margin-right:7px;
		height:80px;
	}
	.footer {height:90px; padding-top:10px;}
	.footer li .categorie {font-size:24px; line-height:10px;}
	.logo-home a {background-size:100px auto; height:90px;}
}

@media screen and (max-width: 945px) {
	.cbp-rfgrid li {
		width: 18.888%; /* Fallback */
		width: -webkit-inherit(93.8888%  / 5);
		width: inherit(93.8888%  / 5);
		margin-right:7px;
		height:80px;
	}
	.footer {height:90px; padding-top:10px;}
	.footer li .categorie {font-size:24px; line-height:10px;}
	.logo-home a {background-size:90px auto; height:90px;}
}

@media screen and (max-width: 800px) {
	
	.categorie {display:none;}
		
	.galleries-content .hidden {display:none;}
	.logo a {
	    background: url("images/joaquim-logo-mobile.png") no-repeat scroll center center;
	    border-bottom: medium none;
	    display: block;
	    height: 60px;
	    text-indent: -5000px;
	    width: 200px;
	    margin:0 auto;
	}
	.logo-home a {background-size:120px auto; height:80px;}
}

@media screen and (max-width: 660px) {
	.cbp-rfgrid li {
		width: 33.3333333%; /* Fallback */
		width: -webkit-calc(93.8888%  / 5);
		width: calc(93.8888%  / 5);
	}

}

@media screen and (max-width: 660px) {
	.cbp-rfgrid li {
		width: 20.3333333%; /* Fallback */
		width: -webkit-calc(93.8888%  / 5);
		width: calc(93.8888%  / 5);
	}
	.item {width:100%;}
}

@media screen and (max-width: 400px) {
	.cbp-rfgrid li {
	width: 100%;
	}
}

@media screen and (max-width: 300px) {
	.cbp-rfgrid li {
		width: 100%;
	}
}


/* Provide higher res assets for iPhone 4 */

@media only screen and (-webkit-min-device-pixel-ratio: 2) { 

/* An example of how to override an image with one twice the size for iPhone 4. Specify the original pixel size with background-size.
.download {
background: url(../img/downarrow@2x.png) no-repeat;
background-size: 27px 28px;
}
*/

}