@import url("fonts/fonts.css");

::-moz-selection { /* Code for Firefox */ background: #000; color: #fff;}
::selection { background: #000; color: #fff;}

@media (min-width: 768px) {
	.container {
		 max-width: 760px;
	}
}

@media (min-width: 992px) {
	.container {
		 max-width: 790px;
	}
}

@media (min-width: 1200px) {
	.container {
		 max-width: 790px;
	}
}


body{color:#000000;font-family:'ft',Arial,Helvetica,sans-serif;font-size:12px;margin:0;padding:15px 0; min-width:294px}
a{color:#000000;font-weight:bold;text-decoration:none;}
a.links{color:#000000;font-size:12px;font-weight:bold;text-decoration:none;}
a:hover{color:#aa0000;font-weight:bold;text-decoration:none;}
a.links:active{color:#ff0000;font-weight:bold;text-decoration:none;}
a img{transition:opacity 0.25s ease-in-out 0s;}
a img:hover{opacity:0.85;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";filter:alpha(opacity=85);-moz-opacity:0.85;-khtml-opacity:0.85;opacity:0.85;}
td a{display:block;}
td a.lang{display:inline-block; margin-bottom:5px;}
table#photos td{margin:0;padding:0;text-align:center;}
table#photos td.horizontal_spacer{margin:0;padding:0;text-align:center;font-size:5px;line-height:5px;}
.nav_arrow{display:block;text-align:center;}
.border{border:1px solid #000000;}
.betuk{font-weight:bolder;color: #000000;}
table.header {border:1px solid #000000;border-collapse:collapse;border-spacing:0}
table.header img {display:block; margin:8px 0 6px;}
table.mainpage {border:1px solid #000000;}
table.main_nav {border-width:0 1px; border-style:solid; border-color:#000000;}
table.main_nav td {padding:7px 0 6px; vertical-align:middle;}
table.mainpage img {display:block;}
table.inner_table {margin:5px auto 0;}
table.inner_table img {display:block;}
table.nav_table {margin: 0 0 5px;}
table.nav_table td {text-align:center; vertical-align:middle;}

img {
	max-width:100%;
}

/* header */
.main_header {
    border: 1px solid #000;
    font-size: 12px;
    padding: 15px 0 5px;
}


a.site-title{
	border-bottom:2px solid #000; 
	display:inline-block;
	line-height:2;
	margin:0;
}

	a.site-title h1{
		display:inline-block;
		font-weight:400;
		font-size:50px;
		letter-spacing:5px;
		line-height:42px;
		margin:0 0 0 0;
	}
	
	a.site-title:hover h1, a.site-title:hover h2{color:#000;text-decoration:none;}

	a.site-title.long h2{
		display:inline-block;
		font-weight:400;
		font-size:20px;
		letter-spacing:1.5px;
		line-height:20px;
		margin:0;
		white-space:nowrap;
	}
	
	a.site-title h2{
		display: inline-block;
		font-weight: 400;
		font-size: 40px;
		letter-spacing: 5px;
		line-height: 30px;
		margin: 0;
		white-space: nowrap;
	}
	
@media (min-width: 992px) {
		a.site-title h1{font-size:44px;letter-spacing:1px;margin:0 8px 0 0;}
		a.site-title h2{font-size:44px;letter-spacing:1px;}
}
		
@media (min-width: 768px) and (max-width: 991px) {
		a.site-title h1{font-size:38px;letter-spacing:1px;margin:0 8px 0 0;}
		a.site-title h2{font-size:38px;letter-spacing:1px;}
}
	
@media (min-width: 576px) and (max-width: 767px) {
		a.site-title h1{font-size:26px;letter-spacing:1px;margin:0;}
		a.site-title h2{font-size:26px;letter-spacing:1px;}
}
	
@media (min-width: 430px) and (max-width: 576px) {
		a.site-title h1{font-size:30px;letter-spacing:1px;margin:0;}
		a.site-title h2{font-size:30px;letter-spacing:1px;}
}
	
	
a.contact {
	display:block;
	font-weight:400;
	font-size:15px;
}	
	
img.site-logo {
	display:inline-block;
	max-height:64px;
	max-width:64px;
}




nav.navbar.bg-light {
	border-color: #000;
	border-style: solid;
	border-width:0px 1px 1px 1px;
	padding:0;
}

.navbar-brand {
    margin: 0 0 0 10px;
}

.navbar-light .navbar-toggler {
	background-color:#000;
	border-color:#d8d8d8;
	border-radius: 0;
	color:#fff;
	margin:10px;
}

.navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

ul.navbar-nav {width:100%;}



@media (min-width: 576px) {
	ul.navbar-nav li.nav-item {
		background-color: #d8d8d8 !important;
		border-color: #fff;
		border-style: solid;
		border-width:4px 2px;
		padding:5px;
		text-align:center;
		width:25%;
	}

	ul.navbar-nav li.nav-item:before { content:"\00b7"; font-weight:bold; }
	ul.navbar-nav li.nav-item:after { content:"\00b7"; font-weight:bold; }

	ul.navbar-nav li.nav-item:first-child {
		border-width:4px 2px 4px 4px;
	}

	ul.navbar-nav li.nav-item:last-child {
		border-width:4px 4px 4px 2px;
	}

}

@media (max-width: 575px) {
	nav.navbar.bg-light {
		background-color: #d8d8d8 !important;
	}
	.navbar-nav li.nav-item {
		background-color: #d8d8d8 !important;
		border-color: #fff;
		border-style: solid;
		border-width:2px 0;
		padding:5px;
		text-align:center;
		width:100%;
	}
	

	ul.navbar-nav li.nav-item:first-child {
		border-width:4px 0 2px;
	}

	ul.navbar-nav li.nav-item:last-child {
		border-width:2px 0 0;
	}	
	
		ul.navbar-nav li.nav-item a {display:block;}
	
}

.main_page {
		border-color: #000;
		border-style: solid;
		border-width:0 1px 1px 1px;	
		padding-left:10px;
		padding-bottom:10px;
}


 .main_page .pic-container {
	 display:block;
	 height: calc(100% - 15px);
	 margin:10px 10px 0 0;
	 position: relative;
	 text-align:center;
 }

 @media (min-width: 386px) and (max-width: 575px) {
	 .main_page .pic-container {
		 min-height:320px;
	 }
 }

	.main_page .pic-container a {
		border:1px solid #000;
		display:block;
		margin:0 auto;
		position: relative;
		top: 50%;
		transform: translateY(-50%);
	 }


/* ARCHITECTURE */
.item-container { 
	display:table;
	float:left;
	margin:10px 0;
	width:50%;
}
	.item-container .item-thumb {
		display:table-cell;
		height:65px;
		margin:0 10px 0 0;
		vertical-align:middle;
		width:50px;
	}
	
		.item-container .item-thumb a{
			display:block;
		}
			.item-container .item-thumb a img{
				border:1px solid #000;
				display:block;
				height:50px;
				width:50px;
			}
	.item-container .item-title{
		display:table-cell;
		height:65px;
		padding:0 10px 0 10px;
		vertical-align:middle;
		width:calc(100% - 50px);
	}
	 
@media (max-width: 575px) {
	.item-container { 
		display:table;
		width:100%;
	}
}	


.page_content {
		border-color: #000;
		border-style: solid;
		border-width:0 1px 1px 1px;	
		padding:10px 5px 0 5px;		
}

.nav-row {padding:10px 10px}



.nav-inner {
	font-weight:bold;
	text-align:center;
}

	.nav-inner.prev, .nav-inner.prev .nav_arrow {text-align:left;}
	.nav-inner.next, .nav-inner.next .nav_arrow {text-align:right;}
	
.work-title {
	font-weight:bold;
	padding: 10px 0;
	text-align:center;
}

.pic-container {padding-left:5px; padding-right:5px; padding-bottom:10px ; text-align:center; }

	.pic-container img {border:1px solid #000; }

	 
	 
/* PHOTOGRAHPY */
.photography .main_photos {
    padding: 10px 10px 0 0;
}
	.photography .thumb-container {
		background-color:#ededed;
		display: table;
		float: left;
		height:120px;
		min-height: 120px;
		text-align: center;
		width: 18%;
		margin: 0 2% 2% 0;
	}
	
		.photography .thumb-container a {display:table-cell; text-align:center; vertical-align:middle;}

			.photography .thumb-container img {
				max-width:100%;
				max-height:100%;
			}
		
		
@media (min-width: 576px) and (max-width: 767px) {
	 .photography .thumb-container {
		 width: 23%;
	 }
}
		
@media (min-width: 480px) and (max-width: 575px) {
	 .photography .thumb-container {
		 width: 31%;
	 }
}

@media (min-width: 240px) and (max-width: 479px) {
	 .photography .thumb-container {
		 width: 48%;
	 }
 }

 @media (max-width: 239px) {
	 .photography .thumb-container {
		 margin: 0 0 2% 0;
		 width: 100%;
	 }
 }
		 
		 
/* BS4 ADDONS */
@media (max-width: 575px) {
  .col-xs {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }
  .col-xs-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: none;
  }
  .col-xs-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .col-xs-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-xs-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-xs-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .col-xs-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .col-xs-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-xs-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .col-xs-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .col-xs-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-xs-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .col-xs-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .col-xs-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .order-xs-first {
    -ms-flex-order: -1;
    order: -1;
  }
  .order-xs-last {
    -ms-flex-order: 13;
    order: 13;
  }
  .order-xs-0 {
    -ms-flex-order: 0;
    order: 0;
  }
  .order-xs-1 {
    -ms-flex-order: 1;
    order: 1;
  }
  .order-xs-2 {
    -ms-flex-order: 2;
    order: 2;
  }
  .order-xs-3 {
    -ms-flex-order: 3;
    order: 3;
  }
  .order-xs-4 {
    -ms-flex-order: 4;
    order: 4;
  }
  .order-xs-5 {
    -ms-flex-order: 5;
    order: 5;
  }
  .order-xs-6 {
    -ms-flex-order: 6;
    order: 6;
  }
  .order-xs-7 {
    -ms-flex-order: 7;
    order: 7;
  }
  .order-xs-8 {
    -ms-flex-order: 8;
    order: 8;
  }
  .order-xs-9 {
    -ms-flex-order: 9;
    order: 9;
  }
  .order-xs-10 {
    -ms-flex-order: 10;
    order: 10;
  }
  .order-xs-11 {
    -ms-flex-order: 11;
    order: 11;
  }
  .order-xs-12 {
    -ms-flex-order: 12;
    order: 12;
  }
  .offset-xs-0 {
    margin-left: 0;
  }
  .offset-xs-1 {
    margin-left: 8.333333%;
  }
  .offset-xs-2 {
    margin-left: 16.666667%;
  }
  .offset-xs-3 {
    margin-left: 25%;
  }
  .offset-xs-4 {
    margin-left: 33.333333%;
  }
  .offset-xs-5 {
    margin-left: 41.666667%;
  }
  .offset-xs-6 {
    margin-left: 50%;
  }
  .offset-xs-7 {
    margin-left: 58.333333%;
  }
  .offset-xs-8 {
    margin-left: 66.666667%;
  }
  .offset-xs-9 {
    margin-left: 75%;
  }
  .offset-xs-10 {
    margin-left: 83.333333%;
  }
  .offset-xs-11 {
    margin-left: 91.666667%;
  }
}



@media (min-width: 576px) {

	.padl-5 {
		padding-left:5px !important;
	}
	
	.padr-5 {
		padding-right:5px !important;
	}
	
	.padt-5 {
		padding-top:5px !important;
	}
	
	.padb-5 {
		padding-bottom:5px !important;
	}
	
	.padl-10 {
		padding-left:10px !important;
	}
	
	.padr-10 {
		padding-right:10px !important;
	}
	
	.padt-10 {
		padding-top:10px !important;
	}
	
	.padb-10 {
		padding-bottom:10px !important;
	}
	
	
}