﻿/* TYPOGRAPHY */
	
@font-face {
	font-family: 'FrutigerLTStd-Bold';
	src: url('fonts/FrutigerLTStd-Bold.eot');
	src: local('☺'), url('fonts/FrutigerLTStd-Bold.woff') format('woff'), url('fonts/FrutigerLTStd-Bold.ttf') format('truetype'), url('fonts/FrutigerLTStd-Bold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
	
@font-face {
	font-family: 'Frutiger-Light';
	src: url('fonts/FrutigerLTStd-Light.eot');
	src: local('☺'), url('fonts/FrutigerLTStd-Light.woff') format('woff'), url('fonts/FrutigerLTStd-Light.ttf') format('truetype'), url('fonts/FrutigerLTStd-Light.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'FrutigerLTStd-Roman';
	src: url('fonts/FrutigerLTStd-Roman.eot');
	src: local('☺'), url('fonts/FrutigerLTStd-Roman.woff') format('woff'), url('fonts/FrutigerLTStd-Roman.ttf') format('truetype'), url('fonts/FrutigerLTStd-Roman.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* GENERAL */



body{background-color: #0d0d0d;font-family: 'Frutiger-Light';}
#header{display: block;overflow: auto;height: 108px;}

#band{width: 1038px;margin:auto;height: 108px;position: absolute;background-color:#f5f5f5;left:50%;top:0px;margin-left:-519px;position:absolute;}
#wrapper{height:100%;width: 1038px;background-color:#ffffff;left:50%;top:0px;margin-left:-519px;position:absolute;}
#logo{margin-top:15px;float: left; }
#logo img{width:494px;}

#search{float: right;margin-top:25px;margin-bottom: 40px; margin-right:20px;}
#search input{float: left;}
#search input[type="text"]{border:1px solid #999999;background: white;
	height: 34px;line-height: 34px;width:180px;
	font-size: 24px;padding-left: 10px;
}
#search input[type="submit"]{width: 44px;height: 38px;background: url(../img/search.png) no-repeat;border: none;margin-left: -2px;}

div#page{width: 956px;margin:auto;margin-top:20px;padding-bottom:80px;margin: auto;position: relative;z-index: 10;}
ul#nav{list-style:none;margin:0;padding:0;text-align:center;width: 942px;overflow: hidden;}
ul#nav a{text-decoration: none;}
ul#nav li{margin-top:0px;display:inline;text-align: center;background-color:#454545;height: 30px;line-height: 30px;padding-top: 7px;padding-bottom: 7px;width:234px;margin-left: -2px;}
ul#nav a:first-of-type>li{margin-left: -10px;}
ul#nav a:last-of-type>li{}
ul#nav li{display:inline-block;}
ul#nav li{font-family: "FrutigerLTStd-Roman";color:white;text-decoration: none;font-size: 22px;
}
ul#nav li.active{background-color: #cdcdcd;}
ul#nav a li:hover{background-color: #cdcdcd;}


#content{margin-top:30px;}
#content h1{font-size: 32px;}
#content a{color:#333333;font-weight: bold;font-family: "FrutigerLTStd-Roman"; }

/* BIO */
span.year{background-color: #444444;color: white;clear: both;line-height:25px;padding:6px 8px 4px 7px;font-family: "FrutigerLTStd-Bold";}
.desc{margin-top:5px;margin-bottom:30px;  }

/*	AUSTELLUNGEN */
.issuuembed{margin-top:20px;height: 800px;}
p.album{line-height: 32px;font-size: 24px;}

/*	KONTAKT */
.lf{float: left;width: 30%;}
.rf{float: right;width: 65%;}
.bt{float: left;width: 100%;}

#contact-info{margin-top: 20px;}
#status{background-color: #f5f5f5;border-top: 1px solid #dddddd;border-bottom: 1px solid #dddddd;height: 70px;line-height: 70px;margin-top: 20px;margin-bottom: 20px;padding-left: 20px;}

#contact form{margin-top: 10px;width: 95%;}
#contact form p{clear: both;}
#contact form label{display: block;margin-bottom:20px;margin-top:20px;font-size: 11px;color: #39335b;font-family: "FrutigerLTStd-Roman"; }
#contact form input,textarea{clear: both;border: 1px solid #e2e2e2;}
#contact form input{width: 60%;height: 30px;line-height: 30px;}
#contact form textarea{width: 100%;}
#contact form input[type=submit]{float: right;width: 70px!important;background-color: #f0f0f0;margin-top:15px; }

/* CUSTOM CHECKBOX */
.checkbox{float: left;}
.checkbox:not(:first-of-type){margin-left: 10px;}
.first span#title{font-size:24px;float: left;padding-top: 2px;padding-left:0px;padding-right:25px;font-family: "FrutigerLTStd-Roman";}
.first p{float: left;padding-top: 8px;margin-left: 15px;text-transform: uppercase;font-size: 11px;font-family: "FrutigerLTStd-Bold";}
.first .checkbox{margin-top: 3px;}

.others{width: 100%;overflow: auto;margin-top:20px;}
input[type="checkbox"] {display:none;}
input[type="checkbox"] + label span {display:inline-block;width:24px;height:24px;margin:-5px 0px 5px 0;vertical-align:middle;background:url(../img/checkbox.png) -24px top no-repeat;cursor:pointer;}
input[type="checkbox"]:checked + label span {background:url(../img/checkbox.png) left top no-repeat;}
input[type="checkbox"] + label {font-size: 11px;font-family: "FrutigerLTStd-Bold";}

/* GALLERY */
.pagination-container{margin-bottom: 20px;margin-top:25px;clear: both; alignment-adjust:central; text-align:center;}
.pagination-container#last{margin-top:52px;}
ul#pagination{list-style:none;margin:0;padding:0;text-align:center;margin-left: -10px}
ul#pagination li{display:inline;background-color:#cdcdcd;height: 20px;padding:7px;float: left;margin-left:10px;width:20px; }
ul#pagination a:first-of-type > li{width:55px;}
ul#pagination a:last-of-type > li{width:55px;}
ul#pagination li{display:inline-block; width:20px; height:20px; line-height:20px;}
ul#pagination li{font-family: "FrutigerLTStd-Bold";color:black;text-decoration: none;font-size: 18px;text-transform:uppercase;}
ul#pagination li.active{background-color: #454545;color: white;}
ul#pagination a{text-decoration: none;}
ul#pagination a li:hover{background-color: #cdcdcd;}
ul#pagination a.not-clickable  li{background-color:#eee!important;cursor:default;color:#aaa;}

.item-container{margin-top: 30px;}
.item{width:221px;height:271px;float:left;/*margin-left: 18px;*/; margin-right:18px; margin-bottom:20px;text-decoration:none;}
.item-container a:nth-child(4n+1) > .item{margin-left: 0;}
.item-img{background-position: 50% 50%;}
.item .item-img{height: 221px;width:100%;border: 1px solid #efefef;margin: auto;margin-bottom:5px;}
.item span.bold{font-size: 12px;font-family: "Arial";font-weight: bold;margin-top:0px;padding-top:0px;}
.item p{font-size: 12px;font-family: "Arial";font-weight: normal;line-height:15px;color:#333;}

input{border-radius: none;}

/* RESPONSIVE */
@media all and (max-width: 940px) and (min-width: 740px) {
	#band,#wrapper,#page,#header{width: 100%!important;margin: 0;left:0;overflow: hidden;}
	ul#nav{width: 101%;}
	ul#nav li{display: inline-block;width:24.5%;margin: 0;border-left: 0;border-right: 0;}
}

@media all and (max-width: 740px) and (min-width: 0px){
	#band,#wrapper,#page,#header{width: 100%!important;margin: 0;left:0;overflow: hidden;}
	#page p,h1{padding-left: 20px;}
	#band,#header{height: 170px;}
	#logo {float: none;clear: both;}
	#logo img{clear: both;float: none;margin: auto!important;}
	#search{float: none;display: block;margin-bottom:50px;padding-left:10%;}
	#search input[type="text"]{width: 70%;}
	ul#nav {margin-top:-5px;width: 100%;overflow: hidden;}
	ul#nav li{display:block;margin-top: 3px;line-height:35px;width: 100%;}
	.item{margin:auto!important;float:none;margin-bottom:20px;}
	#logo img{margin: auto;}
	ul#pagination li{margin-top:4px;display:inline;text-align: center;background-color:#cdcdcd;/*padding:5px 8px 2px 8px;*/float: none;}
	ul#pagination li{display:inline-block;width:20px; height:20px; line-height:20px;}
	.biopic{width: 100%;margin: auto!important;clear: both;float: none!important;padding-bottom: 30px;}
	.lf,.rf{display: block;float: none;width: 100%;padding-top: 20px;}
	.lf{border-bottom: 1px solid #e2e2e2;padding-bottom: 20px;}
	#contact form{width:95%;}
	#contact form input,textarea{clear: both;border: 1px solid #e2e2e2;}
	#contact form input{width: 60%;height: 30px;line-height: 30px;}
	#contact form textarea{width: 100%;}
	.others{width: 80%;margin: auto;}
	.first{text-align: center;}	
	.first span#title{float: none;clear: both}
	.first .checkbox{float: none;}
	.first p{float: none;clear: both;width: 80%;margin: auto;}
	.item{padding-bottom: 20px;}
	ul#nav a:first-of-type>li,ul#nav a>li{margin-left:0;}
}

@media all and (max-width: 550px) and (min-width: 0px){
#logo img{width: 100%;}
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px){
	#search input[type="text"]{height: 25px!important;}
}

@media only screen and (-webkit-min-device-pixel-ratio : 1.5){#search input[type="text"]{height: 25px!important;}}
