html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

a{
	outline:none;
	
	&:focus{
		outline:none;
	}
}

@font: 'Open Sans', arial, sans-serif;
@colorblk:#000;
@colorwt:#fff;
@colorpch:#ff6774;
@colorblu:#194399;

.marginzero{
	margin:0px;
}
.paddingzero{
	padding:0px;
}
.marpad0{
	margin:0px 0px;
	padding:0px 0px;
}

body{
	font-family: @font !important;
}

.container {
	max-width: 1302px !important;
}

.top-bar{
	background:@colorblk;
	padding:7px 0px;
	.marginzero;
	
	p{
		font:400 12px/14px @font;
		color: @colorwt;
		.marginzero;
		padding:4px 10px 0 0;
	
		a{
			color: inherit;
			transition:all 0.2s ease-in-out;
		
			&:hover{
				color:@colorpch;
				text-decoration:none;
			}
		}
	}
	
	ul{
		li{
			font:400 12px/14px @font;
			color: @colorwt;
			.marginzero;
			padding:0px 10px 1px;
			display:inline;
			border-right:1px solid darken(@colorwt,10%);
		
			a{
			color: inherit;
			transition:all 0.2s ease-in-out;
		
				&:hover{
					color:@colorpch;
					text-decoration:none;
				}
			}
		}
	}
}

.peach-wrap{
	background:url(../images/bg-light1.jpg) no-repeat left bottom, url(../images/bg-light2.jpg) no-repeat right top, @colorpch;
}

.hdr-wrap{
	background: @colorwt;
	.marpad0;

	.logo{
		padding:10px 10px 5px;
		
		img{
			
			@media screen and(max-width:420px){
				width:100%;
			}	
		}
	}
	
	.menu-btn{
		display:none;
		float:right;
		padding:30px 60px;
		
		@media screen and(max-width:992px){
			display:block;
		}
	}
	
	.menu-box{
		display:none;
		position:absolute;
		right:15px;
		width:230px;
		z-index:9999;
		background:#ebebeb;
	
		ul{
			.marginzero;
			.paddingzero;
		
			li{
				margin:0px 0px 10px;
				list-style:none;
				font:400 14px/16px @font;
				color: @colorblk;
				border-bottom:1px solid #cccccc;
			
				a{
					color:inherit;
				
					&:hover{
						text-decoration:none;
					}
				}
				
				p{
					text-align:center;
					padding:10px 0 0;
					font:600 14px/20px @font;
					float:left;
				}
				
				.mitem{
					float:left;
					width:80px;
				}
				
				.brass{
					background:url(../images/mi1-p.png) no-repeat  center center;
					height:55px;
				}
				
				.wood{
					background:url(../images/mi2-p.png) no-repeat center center;
					height:55px;
				}
				.iron{
					background:url(../images/mi3-p.png) no-repeat center center;
					height:55px;
				}
				.alu{
					background:url(../images/mi4-p.png) no-repeat center center;
					height:55px;
				}
				.tin{
					background:url(../images/mi5-p.png) no-repeat center top;
					height:55px;
				}
				.ceramic{
					background:url(../images/mi6-p.png) no-repeat center center;
					height:55px;
				}
				.bead{
					background:url(../images/mi7-p.png) no-repeat center center;
					height:55px;
				}
				.glass{
					background:url(../images/mi8-p.png) no-repeat center center;
					height:55px;
				}
				.steel{
					background:url(../images/mi9-p.png) no-repeat center center;
					height:55px;
				}
			}
		}
	}
	
	.menu-wrap{
		.marpad0;
		
		@media screen and(max-width:992px){
			display:none;
		}
		
		
		ul{
			.marpad0;
			
			li{
				float:left;
				list-style:none;
				.marginzero;
				border-left:1px solid #ff6774;
				padding:0px 15px 7px;
				font:400 14px/16px @font;
				color: @colorblk;
				text-align:center;
				transition:all .1s ease-in-out;
				
				@media screen and (max-width: 1275px){
					padding:0px 8px 7px;
				}
				
				a{
					color: @colorblk;
					
					&:hover{
						text-decoration:none;
					}
				}
			
				p{
					text-align:center;
					padding:10px 0 0;
					font:600 14px/20px @font;
				}
				
				.brass{
					background:url(../images/mi1-p.png) no-repeat  center bottom;
					height:55px;
				}
				
				.wood{
					background:url(../images/mi2-p.png) no-repeat center bottom;
					height:55px;
				}
				.iron{
					background:url(../images/mi3-p.png) no-repeat center top;
					height:55px;
				}
				.alu{
					background:url(../images/mi4-p.png) no-repeat center bottom;
					height:55px;
				}
				.tin{
					background:url(../images/mi5-p.png) no-repeat center top;
					height:55px;
				}
				.ceramic{
					background:url(../images/mi6-p.png) no-repeat center bottom;
					height:55px;
				}
				.bead{
					background:url(../images/mi7-p.png) no-repeat center bottom;
					height:55px;
				}
				.glass{
					background:url(../images/mi8-p.png) no-repeat center bottom;
					height:55px;
				}
				.steel{
					background:url(../images/mi9-p.png) no-repeat center bottom;
					height:55px;
				}
			}
		}
	}
}

.menu-wrap li:hover {
	background: #194399;
	color:@colorwt;
}
.menu-wrap li:hover a p{
	color:@colorwt;
}
.menu-wrap li:hover a .brass{
	background:url(../images/mi1-w.png) no-repeat  center bottom;
} 
.menu-wrap li:hover a .wood{
	background:url(../images/mi2-w.png) no-repeat  center bottom;
} 
.menu-wrap li:hover a .iron{
	background:url(../images/mi3-w.png) no-repeat  center top;
}
.menu-wrap li:hover a .alu{
	background:url(../images/mi4-w.png) no-repeat  center bottom;
}
.menu-wrap li:hover a .tin{
	background:url(../images/mi5-w.png) no-repeat  center top;
}
.menu-wrap li:hover a .ceramic{
	background:url(../images/mi6-w.png) no-repeat  center bottom;
}
.menu-wrap li:hover a .bead{
	background:url(../images/mi7-w.png) no-repeat  center bottom;
}
.menu-wrap li:hover a .glass{
	background:url(../images/mi8-w.png) no-repeat  center bottom;
}
.menu-wrap li:hover a .steel{
	background:url(../images/mi9-w.png) no-repeat  center bottom;
}

.wrap-index{
	background:url(../images/slider-shadow.jpg) no-repeat center top;
	padding:20px 0;
	
	h1{
		font:400 16px/24px @font;
		color:#3e3e3e;
		text-align:center;
		margin:20px 0;
	
		span{


			font: 300 54px/26px 'Herr Von Muellerhoff', cursive;
		}
	}
	
	.index-txt-main{
		border-bottom: 2px solid #194399;
		margin: 0 0 40px;
		padding: 0;
	
		h2{
			text-align:center;
			background:#fff;
			display:inline-block;
			font:400 34px/36px 'Open Sans',arial,sans-serif;
			color:#194399;
			padding:0 20px;
			position:relative;
			top:16px;
			left:50%;
			margin:10px 0 0 -165px;
			
			@media screen and (max-width: 500px){
				left:auto;
				margin:10px 0 0 0;
				position:static;
				text-align:center;
				font:400 28px/30px 'Open Sans',arial,sans-serif;
			}
		}
		
		@media screen and (max-width: 500px){
			border-bottom:0 solid #194399;
			margin:0 0 20px;
		}
	}
}

footer{
	.ftr-top{
		background: @colorblk;
		margin:20px 0 0;
		padding:30px 0 10px;
		
		ul{
			padding: 10px 0px 5px 30px;
			border-right:1px solid darken(@colorwt, 50%);
			
			@media screen  and (max-width: 992px) {
				border:0;
				padding: 10px 0px 20px 30px;
			}	
			
			@media screen  and (max-width: 767px) {
				border:0;
				padding: 10px 0px 0px 30px;
			}	
		
			li{
				margin:0px 0px 15px;
				font:400 16px/18px @font;
				color:@colorwt;
				list-style:none;
			
				a{
					color:inherit;
					transition: all 0.2s ease-in-out;
					
					&:hover{
						text-decoration:none;
						color:@colorpch;
					}
				}
			}
		}
		
		.newsltr-wrap{
			padding:10px 0;
			
			h2{
				font:400 18px/20px @font;
				color:@colorwt;	
				padding:0 0 10px;
			}
			
			input[type="text"]{
				width:100%;
				box-sizing:border-box;
				.marginzero;
				padding:6px 5px;
				font:400 13px/16px @font;
				color:@colorblk;
				border-radius:0;
				border:0;	
			}
			
			input[type="submit"]{
				background: @colorblu;
				width:100%;
				box-sizing:border-box;
				.marginzero;
				padding:6px 10px;
				font:400 14px/16px @font;
				color:@colorwt;	
				border:0;
			}
			
			.brochr{
				margin:15px 0 0;
				background:url(../images/pdf.jpg) no-repeat left center;
				padding:10px 0 10px 40px;
				font:600 16px/18px @font;
				color:@colorwt;	
				
				a{
					color:inherit;
					transition: all 0.2s ease-in-out;
				
					&:hover{
						text-decoration:none;
						color:@colorpch;
					}
				}
			}
		}
	}

	.ftr-btm{
		background:url(../images/slider-shadow.jpg) no-repeat top center;
		padding:10px 0;
	
		p{
			font:400 12px/14px @font;
			color:lighten(@colorblk, 20%);	
			
			a{
				color:inherit;
			}
		}
	}
}

.product-block-wrap{
	background:url(../images/service-shadow.jpg) no-repeat center bottom;
	.marginzero;
	padding:0 0 9px;
	cursor:pointer;
	transition:all .2s ease-in-out;
	
	.product-block{
		background:#f1f1f1;
		padding:10px;
				
		img{
			transition:all .2s ease-in-out;
		}
		
		h4{
			font:400 20px/22px 'Open Sans',arial,sans-serif;
			color:#3b3b3b;
			.marginzero;
			padding:20px 0 10px;
			text-align:center;
			transition:all .2s ease-in-out;
		}
	}
	
	&:hover img{opacity:0.8}
	
	&:hover h4{color:#f04755}
}

.wrap-in{
	
	h2{	
		font:600 34px/36px 'Open Sans',arial,sans-serif;
		color:#f44554;
		.marginzero;
		padding:10px 0 20px;
	}
	
	p{
		font:400 16px/24px @font;
		color:#3e3e3e;
		text-align:justify;
		margin:0px 0 20px;
		
		strong{
			font-weight:700;
		}
	}
	
	h3{	
		font:400 24px/26px 'Open Sans',arial,sans-serif;
		color:@colorblu;
		.marginzero;
		padding:0px 0px 10px;
	}	
}

.form-hdr{
	background:@colorblu;
	padding:10px 20px 12px;	
	font:400 24px/26px 'Open Sans',arial,sans-serif;
	color:@colorwt;
}

.form-block{
	background:#e4e4e4;
	padding:20px;
	
	td{
		padding:0 0 15px 0;	
	}

	.txtbx{
		width:100%;
		padding:10px 10px;
		box-sizing: border-box;
		font:400 14px/16px 'Open Sans',arial,sans-serif;
		color:@colorblk;
		background:@colorwt;
		border:0;
	}
	
	input[type='submit']{
		width:100%;
		padding:10px 10px;
		box-sizing: border-box;
		font:400 16px/18px 'Open Sans',arial,sans-serif;
		color:@colorwt;
		background:@colorpch;
		border:0;
		transition:all .2s ease-in-out;
	
		&:hover{
			background:darken(@colorpch, 5%);
		}
	}
}

.thumb-block{
  position: relative;
  width: 180px;
  height: 150px;
  overflow: hidden;
  background:#eaeaea;
  float:left;
  margin:0 1px 1px 0;
  
	img {
	  position: absolute;
	  left: 50%;
	  top: 50%;
	  height: 100%;
	  width: auto;
	  -webkit-transform: translate(-50%,-50%);
	  -ms-transform: translate(-50%,-50%);
	  transform: translate(-50%,-50%);
	  transition:all .2s ease-in-out;
	
		&:hover{
			opacity:0.8;
		}
	}

	img.portrait {
	  width: 100%;
	  height: auto;
	}
}

::-moz-selection { 
    color:@colorwt;
    background: #194399;
}

::selection {
    color:@colorwt;
    background: #194399;
}

#nav-toggle { cursor: pointer; padding: 5px 0px 0px 0px; /*float:left;*/}
#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after {
  cursor: pointer;
  border-radius: 1px;
  height: 5px;
  width: 35px;
  background: #000;
  position: absolute;
  display: block;
  content: '';
}
#nav-toggle span:before {
  top: -10px; 
}
#nav-toggle span:after {
  bottom: -10px;
}

#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after {
  transition: all 0.3s ease-in-out;
}
#nav-toggle.active span {
  background-color: transparent;
}
#nav-toggle.active span:before, #nav-toggle.active span:after {
  top: 0;
}
#nav-toggle.active span:before {
  transform: rotate(45deg);
}
#nav-toggle.active span:after {
  transform: rotate(-45deg);
}
.map{
	width:100%;
	height:500px;
}