/* Artfully masterminded by ZURB  */

/* -------------------------------------------------- 
   Table of Contents
-----------------------------------------------------
:: Shared Styles
:: Page Name 1
:: Page Name 2
*/


/* -----------------------------------------
   Shared Styles
----------------------------------------- */



/* -----------------------------------------
   Page Name 1
----------------------------------------- */

body {
	background-color:#dddbd7;
	background:#000000 url(../images/header/bg.png) repeat;
	}
	
	
a {
	color: #ff9900;
}	

a:hover {
	color: #ff6600;
}
	
.bg-image {
	background: url('../images/header/wrench4.jpg') no-repeat top center;
	height: 300px;
	background-size: 100%;
	/*width:100%;*/
}

.bg-image img{
position: relative;
top:-1.5em;
	
	/*background-size: 100%; */
	
}

@media screen and (max-width:960px) {
.bg-image {
	background: url('../images/header/csaj2.jpg') no-repeat top center;
	height: 300px;
}

}



/* menu */
.nav-background { background: #111111; width: 100%; height:40px; }
.nav-bar { background: #111111; margin-top: 0px !important; border: 0;}
.nav-bar > li { border:0; }
/*menu end */

.main-image {
	vertical-align:top; 
	margin: 0 1em 0.5em 0;
	max-width:250px; 
	height:auto;
	
}



.button { 	background: #ffcc33; border: 1px solid #ff9900; 
			-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; 
			-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; 
			color: #111111; 
			-webkit-transition: background-color 0.15s ease-in-out;
			-moz-transition: background-color 0.15s ease-in-out; 
			-o-transition: background-color 0.15s ease-in-out;
			transition: background-color 0.15s ease-in-out; /* Hovers */ /* Sizes */ /* Colors */ /* Radii */ /* Layout */ /* Disabled ---------- */
			
		}
		
.button:hover { color: #111111; background-color: #ff9900; }

.button:focus { -webkit-box-shadow: 0 0 4px #ffcc33, 0 1px 0 rgba(255, 255, 255, 0.5) inset; -moz-box-shadow: 0 0 4px #ffcc33, 0 1px 0 rgba(255, 255, 255, 0.5) inset; box-shadow: 0 0 4px #ffcc33, 0 1px 0 rgba(255, 255, 255, 0.5) inset; color: #111111; }

h1 {
	font-size: 27px !important;
	margin: 1em 0;
}

h2 {
	font-size: 24px !important;
	margin 1em 0;
	padding: 0 0 0.8em 0;
	color:#333333;
}

h5 {
	padding-top: 1em;
}
		
.nav-bar > li.active > a {
	background: none repeat scroll 0 0 #FFCC33;
	color: #111111; 
	}

hr { border: dashed #ddd; border-width: 1px 0 0; clear: both; margin: 2em 1em 0; height: 0; }
	
	
	
#content img.katalog-thumb {
	max-height:220px;
	padding: 0 0 0 0;
	margin: 1.5em 2em 1.5em 0;
}	
#content img.logo {
	max-height:50px;
	padding: 0 0 0 0;
	margin: 1.5em 2em 1.5em 0;
}

#content img.logotop {
	max-height:45px;
	padding: 0 0 0 0;
	margin-bottom:0 0 1.5em 0;
}

.button .info {
	font-weight:normal;
	font-size:1rem;
}



.mid-content {
    background: none repeat scroll 0 0 #FFFFFF;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.35);
    margin: -105px auto 0;
    max-width: 100%;
    width: 960px;
	padding-bottom:2em;
}
	

.panel.border {
	border: 1px solid #cccccc;
	}

.box-effect {
	color: #666;
	 transition: color .3s ease-in;
	-moz-transition: color .3s ease-in;
	-o-transition: color .3s ease-in;
	-webkit-transition: color .3s ease-in;
	}

.box-effect:hover {
	color:#333;
	}
	
img.img-rotate {
	width:64px;
	height: 64px;
	float:left;
	margin: 0 1em 0em 0;
    transition: 0.8s cubic-bezier(0.2, 0.9, 0.2, 1) 0s;
    -moz-transition: 0.8s cubic-bezier(0.2, 0.9, 0.2, 1) 0s;
	-webkit-transform: 0.8s cubic-bezier(0.2, 0.9, 0.2, 1) 0s;
	-ms-transform: 0.8s cubic-bezier(0.2, 0.9, 0.2, 1) 0s;
	-o-transform: 0.8s cubic-bezier(0.2, 0.9, 0.2, 1) 0s;
}

.imgtrnsf:hover .img-rotate{
	transform: rotate(360deg) translateZ(0px);
	-moz-transform: rotate(360deg) translateZ(0px);
	-webkit-transform: rotate(360deg) translateZ(0px);
	-ms-transform: rotate(360deg) translateZ(0px);
	-o-transform: rotate(360deg) translateZ(0px);
}

h3 {
	font-size: 1.8rem;
	text-transform:uppercase;
	color: #333;
	margin: 0 0 0.3em 0;
}

h4 {
	font-size: 6em;
	font-style: italic;
	text-shadow: 0.01em 0.01em 0.01em #fff;
}

.portfolio-thumb img {
    height: auto;
    vertical-align: bottom;
    width: 100%;
	max-height:50%;
}

.footer {
	width:100%;
	background-color:#333333;
	color: #ccc;
	margin-top:3em;
	padding:0.5em 0;
}

img.katalog {
	margin-top:0em;
}

.catalogue-part h2 {
	font-size:14px !important;
	font-weight:600;
	margin-bottom: 0em !important;
	margin-tio:1em;
}

textarea { 
	height: 10em !important;
	font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-weight: normal; font-size: 14px; line-height: 1.6; margin-bottom: 17px; 
}

.alert-box {
	margin-top: 2em;
}


@media only screen and (max-width: 767px) { 
img.katalog {
	margin-top:0.5em;
	margin-bottom:30px;
}
}