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,font,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{margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent;}

body{
  background-color: #313131;
}

#wrapper{
  width: auto;
  height: 800px;

}


#container{
  background: url(images/bg.jpg) no-repeat center;
  width: 1280px;
  height: 800px;
  margin: 0px auto;

}

#header{
  width: 1280px;
  height: 200px;
}

.logo{
  background: url(images/logo.png) no-repeat left;
  width: 277px;
  height: 133px;
  margin: 20px 0px 0px 120px;
  float: left;

}

.nav{
  float: left;
  margin: 80px 0px 0px 140px;

}


.nav ul li{
 list-style: none;
 float: left;
 margin-left: 20px;
}


.nachalo{
  width:71px;
  height: 19px;
  display: block;
  background: url(images/nachalo.png) no-repeat center;
}

.nachalo:hover{
  width:71px;
  height: 16px;
  display: block;
  background: url(images/nachalo_h.png) no-repeat center;
}

.portfolio{
  width:114px;
  height: 19px;
  display: block;
  background: url(images/portfolio.png) no-repeat center;
}

.portfolio:hover{
  width:114px;
  height: 22px;
  display: block;
  background: url(images/portfolio_h.png) no-repeat center;
}

.clients{
  width:76px;
  height: 19px;
  display: block;
  background: url(images/clients.png) no-repeat center;
}
.clients:hover{
  width:76px;
  height: 19px;
  display: block;
  background: url(images/clientsh.png) no-repeat center;
}

.contacts{
  width:84px;
  height: 19px;
  display: block;
  background: url(images/contacts.png) no-repeat center;
}
.contacts:hover{
  width:84px;
  height: 19px;
  display: block;
  background: url(images/contactsh.png) no-repeat center;
}

#content{
  width: 960px;
  margin: 0px auto;
}

.title{
	background: url(images/title.png) no-repeat center;
	width: 146px;
	height: 36px;
	margin-left: 620px;
	position: absolute;
}

.title_clients{
  background: url(images/klients_title.png) no-repeat center;
  width: 160px;
  height: 36px;
  margin-left: 620px;
  position: absolute;

}

.title_out{
  background: url(images/outside_title.png) no-repeat center;
  width: 200px;
  height: 80px;
  margin-left: 620px;
  position: absolute;
}

.title_print{
  background: url(images/print_title.png) no-repeat center;
  width: 140px;
  height: 36px;
  margin-left: 620px;
  position: absolute;

}
.title_portfolio{
  background: url(images/title_portfolio.png) no-repeat center;
  width: 229px;
  height: 36px;
  margin-left: 620px;
  position: absolute;

}

.title_webdesign{
  background: url(images/webdesign_title.png) no-repeat center;
  width: 230px;
  height: 36px;
  margin-left: 620px;
  position: absolute;

}

.title_contacts{
  background: url(images/contacts_title.png) no-repeat center;
  width: 180px;
  height: 36px;
  margin-left: 620px;
  position: absolute;

}
.title_identity{
  background: url(images/identity_title.png) no-repeat center;
  width: 247px;
  height: 27px;
  margin-left: 620px;
  position: absolute;
}

.txt_middle{
  width: 600px;
  float: left;
}
.footer{
	width: 80px;
	height: 34px;
	margin-left: 850px;
	position: absolute;
	margin-top: 520px;
}

.welcome_txt{
	width: 600px;
	color:#3b3b3b;
	font-family: 'Trebuchet MS';
	font-size: 14px;
	margin: 150px 0px 0px 170px;
	text-align: justify;
}

.welcome_txt_bold{
  width: 600px;
  color:#3b3b3b;
  font-family: 'Trebuchet MS';
  font-weight: bold;
  font-size: 15px;
  margin:10px 0px 0px 170px;
}

.sub_nav{
  width: 610px;
  margin: 0px auto;


}

.sub_nav_cont{
  width: 116px;
  height: 170px;
  float: left;
  margin-top: 130px;
  margin-left: 20px;

}

.contacts_cont{
	width: 600px;
	height: auto;
	float: left;
	margin-top: 80px;
	margin-left: 40px;

}

.sub_title1{
  width: 55px;
  height: 15px;
  display: block;
  background: url(images/print.png) no-repeat center;
  margin-left: 7px;
  margin-bottom: 10px;
  margin-top: 23px;

}



.sub_image1{
	width: 70px;
	height: 168px;
	display: block;
	background: url(images/soon_tab.png) no-repeat center;
	/* CSS3 drop shadow: */
     -moz-box-shadow:0 0 10px #006699;
	-webkit-box-shadow:0 0 10px #006699;
	box-shadow:0 0 10px #006699;

}

.sub_image1:hover{
	width: 70px;
	height: 168px;
	display: block;
	background: url(images/soon_tab_h.png) no-repeat center;
	/* CSS3 inset shadow: */
     -moz-box-shadow:0 0 30px #000 inset;
	-webkit-box-shadow:0 0 30px #000 inset;
	box-shadow:0 0 30px #000 inset;
}

.sub_title2{
  width: 66px;
  height: 38px;
  display: block;
  background: url(images/web_design.png) no-repeat center;
  margin-left: 4px;
  margin-bottom: 10px;

}


.sub_image2{
	width: 70px;
	height: 168px;
	display: block;
	background: url(images/web_tab_frost.png) no-repeat center;
	/* CSS3 drop shadow: */
     -moz-box-shadow:0 0 10px #006699;
	-webkit-box-shadow:0 0 10px #006699;
	box-shadow:0 0 10px #006699;
}

.sub_image2:hover{
	width: 70px;
	height: 168px;
	display: block;
	/* CSS3 inset shadow: */
     -moz-box-shadow:0 0 30px #000 inset;
	-webkit-box-shadow:0 0 30px #000 inset;
	box-shadow:0 0 30px #000 inset;
	background-image: url(images/web_tab.png);
}

.sub_title3{
  width: 116px;
  height: 13px;
  display: block;
  background: url(images/identity.png) no-repeat center;
  margin-left: -16px;
  margin-bottom: 10px;
   margin-top: 23px;

}

.sub_image3{
  width: 70px;
  height: 168px;
  display: block;
  background: url(images/identity_tab_frost.png) no-repeat center;
   /* CSS3 drop shadow: */
     -moz-box-shadow:0 0 10px #006699 ;
     -webkit-box-shadow:0 0 10px #006699 ;
      box-shadow:0 0 10px #006699 ;
}

.sub_image3:hover{
  width: 70px;
  height: 168px;
  display: block;
  background: url(images/identity_tab.png) no-repeat center;
   /* CSS3 inset shadow: */
     -moz-box-shadow:0 0 10px #000 inset;
     -webkit-box-shadow:0 0 10px #000 inset;
      box-shadow:0 0 10px #000 inset;
}

.sub_title4{
  width: 87px;
  height: 37px;
  display: block;
  background: url(images/outdoor.png) no-repeat center;
  margin-left: -4px;
  margin-bottom: 10px;


}

.sub_image4{
	width: 70px;
	height: 168px;
	display: block;
	background: url(images/soon_tab.png) no-repeat center;
	/* CSS3 drop shadow: */
     -moz-box-shadow:0 0 10px #006699;
	-webkit-box-shadow:0 0 10px #006699;
	box-shadow:0 0 10px #006699;
}

.sub_image4:hover{
	width: 70px;
	height: 168px;
	display: block;
	background: url(images/soon_tab_h.png) no-repeat center;
	/* CSS3 inset shadow: */
     -moz-box-shadow:0 0 30px #000 inset;
	-webkit-box-shadow:0 0 30px #000 inset;
	box-shadow:0 0 30px #000 inset;
}


.identity_elements{
	width: 300px;
	height: 175px;
	float: left;
	margin: 50px 0px 0px 80px;
	padding: 70px;
}

.identity_elements ul li{
  list-style: none;
  float: left;

}

.filler_empty{
  width:62px;
  height: 62px;
  display: block;
  visibility: hidden;
  margin: 0px 0px 20px 10px;
}


.flaer{
  width: 62px;
  height: 62px;
  background: url(images/flaer_img.jpg) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
   /* CSS3 drop shadow: */
     -moz-box-shadow:0 0 10px #006699 ;
     -webkit-box-shadow:0 0 10px #006699 ;
      box-shadow:0 0 10px #006699 ;

}

.flaer:hover{
  width: 62px;
  height: 62px;
  background: url(images/flaer_img.jpg) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
   /* CSS3 inset shadow: */
     -moz-box-shadow:0 0 30px #000 inset;
     -webkit-box-shadow:0 0 30px #000 inset;
      box-shadow:0 0 30px #000 inset;

}
.web_fury{
  width: 62px;
  height: 62px;
  background: url(images/web_fury_mal.png) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
   /* CSS3 drop shadow: */
     -moz-box-shadow:0 0 10px #006699 ;
     -webkit-box-shadow:0 0 10px #006699 ;
      box-shadow:0 0 10px #006699 ;

}

.web_fury:hover{
  width: 62px;
  height: 62px;
  background: url(images/web_fury_mal.png) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
   /* CSS3 inset shadow: */
     -moz-box-shadow:0 0 30px #000 inset;
     -webkit-box-shadow:0 0 30px #000 inset;
      box-shadow:0 0 30px #000 inset;

}

.web_iceberg{
  width: 62px;
  height: 62px;
  background: url(images/web_iceberg_mal.png) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
   /* CSS3 drop shadow: */
     -moz-box-shadow:0 0 10px #006699 ;
     -webkit-box-shadow:0 0 10px #006699 ;
      box-shadow:0 0 10px #006699 ;

}

.web_iceberg:hover{
  width: 62px;
  height: 62px;
  background: url(images/web_iceberg_mal.png) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
   /* CSS3 inset shadow: */
     -moz-box-shadow:0 0 30px #000 inset;
     -webkit-box-shadow:0 0 30px #000 inset;
      box-shadow:0 0 30px #000 inset;

}

.web_camelot{
  width: 62px;
  height: 62px;
  background: url(images/web_camelot_mal.png) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
   /* CSS3 drop shadow: */
     -moz-box-shadow:0 0 10px #006699 ;
     -webkit-box-shadow:0 0 10px #006699 ;
      box-shadow:0 0 10px #006699 ;

}

.web_camelot:hover{
  width: 62px;
  height: 62px;
  background: url(images/web_camelot_mal.png) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
   /* CSS3 inset shadow: */
     -moz-box-shadow:0 0 30px #000 inset;
     -webkit-box-shadow:0 0 30px #000 inset;
      box-shadow:0 0 30px #000 inset;

}
.web_korect{
  width: 62px;
  height: 62px;
  background: url(images/web_korect_mal.png) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
   /* CSS3 drop shadow: */
     -moz-box-shadow:0 0 10px #006699 ;
     -webkit-box-shadow:0 0 10px #006699 ;
      box-shadow:0 0 10px #006699 ;

}

.web_korect:hover{
  width: 62px;
  height: 62px;
  background: url(images/web_korect_mal.png) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
   /* CSS3 inset shadow: */
     -moz-box-shadow:0 0 30px #000 inset;
     -webkit-box-shadow:0 0 30px #000 inset;
      box-shadow:0 0 30px #000 inset;

}
.web_ice2{
  width: 62px;
  height: 62px;
  background: url(images/web_ice2_mal.png) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
   /* CSS3 drop shadow: */
     -moz-box-shadow:0 0 10px #006699 ;
     -webkit-box-shadow:0 0 10px #006699 ;
      box-shadow:0 0 10px #006699 ;

}

.web_ice2:hover{
  width: 62px;
  height: 62px;
  background: url(images/web_ice2_mal.png) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
   /* CSS3 inset shadow: */
     -moz-box-shadow:0 0 30px #000 inset;
     -webkit-box-shadow:0 0 30px #000 inset;
      box-shadow:0 0 30px #000 inset;

}

.web_cam2{
  width: 62px;
  height: 62px;
  background: url(images/web_cam2_mal.png) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
   /* CSS3 drop shadow: */
     -moz-box-shadow:0 0 10px #006699 ;
     -webkit-box-shadow:0 0 10px #006699 ;
      box-shadow:0 0 10px #006699 ;

}

.web_cam2:hover{
  width: 62px;
  height: 62px;
  background: url(images/web_cam2_mal.png) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
   /* CSS3 inset shadow: */
     -moz-box-shadow:0 0 30px #000 inset;
     -webkit-box-shadow:0 0 30px #000 inset;
      box-shadow:0 0 30px #000 inset;

}
.soon_id{
  width: 62px;
  height: 62px;
  background: url(images/element_soon.jpg) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
}

.soon_id:hover{
  width: 62px;
  height: 62px;
  background: url(images/element_soon.jpg) no-repeat center;
  display: block;
  margin: 0px 0px 20px 10px;
  /* CSS3 inset shadow: */
     -moz-box-shadow:0 0 30px #000 inset;
     -webkit-box-shadow:0 0 30px #000 inset;
      box-shadow:0 0 30px #000 inset;
}
.preview_zone{
	width: 242px;
	height: 316px;
	position: absolute;
	background: url(images/img_preview_flaer.png) no-repeat center;
	display: none;
	margin-top: 70px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 540px;
}

.webpreview_zone{
	width: 242px;
	height: 316px;
	position: absolute;
	background: url(images/web_fury.png) no-repeat center;
	display: none;
	margin-top: 70px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 540px;
}
.webpreview_zone1{
	width: 242px;
	height: 316px;
	position: absolute;
	background: url(images/web_iceberg.png) no-repeat center;
	display: none;
	margin-top: 70px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 540px;
}
.webpreview_zone2{
	width: 242px;
	height: 316px;
	position: absolute;
	background: url(images/web_camelot.png) no-repeat center;
	display: none;
	margin-top: 70px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 540px;
}
.webpreview_zone3{
	width: 242px;
	height: 316px;
	position: absolute;
	background: url(images/web_korekt.png) no-repeat center;
	display: none;
	margin-top: 70px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 540px;
}
.webpreview_zone4{
	width: 242px;
	height: 316px;
	position: absolute;
	background: url(images/web_ice2.png) no-repeat center;
	display: none;
	margin-top: 70px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 540px;
}

.webpreview_zone5{
	width: 242px;
	height: 316px;
	position: absolute;
	background: url(images/web_cam2.png) no-repeat center;
	display: none;
	margin-top: 70px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 540px;
}

.sub_nav2{
  width: 530px;
  height: 30px;
  float: left;
  margin:30px 0px 0px 100px;
}

.sub_nav2 ul li{
  list-style: none;
  float: left;
  margin-left: 10px;

}

.print{
  width: 60px;
  height: 20px;
  background: url(images/print_btn.png) no-repeat center;
  display: block;
}
.print:hover{
  width: 60px;
  height: 20px;
  background: url(images/print_btnh.png) no-repeat center;
  display: block;
}

.web{
  width: 120px;
  height: 20px;
  background: url(images/web_design_btn.png) no-repeat center;
  display: block;
}
.web:hover{
  width: 120px;
  height: 20px;
  background: url(images/web_design_btnh.png) no-repeat center;
  display: block;
}

.id{
  width: 128px;
  height: 20px;
  background: url(images/identity_btn.png) no-repeat center;
  display: block;
}

.id:hover{
  width: 128px;
  height: 20px;
  background: url(images/identity_btn_h.png) no-repeat center;
  display: block;
}

.outdoor{
  width: 177px;
  height: 20px;
  background: url(images/outdoor_btn.png) no-repeat center;
  display: block;
}
.outdoor:hover{
  width: 177px;
  height: 20px;
  background: url(images/outdoor_btnh.png) no-repeat center;
  display: block;
}