@charset "utf-8";
/* CSS Document */

* { margin: 0; border: 0; padding: 0; outline: 0; }
html, body {
height: 100%;
background-color:#000000;
}

body {	font-family:Arial, Helvetica, sans-serif; background:#000 url(../images/backbody.jpg) center top no-repeat; font-size:1em; color:#FFF; }
h1, h2, h3{ font-family:"Century Gothic"; padding: 0 0 .5em 0; font-weight:normal; }
h1 { font-size:2.125em; word-spacing:-8px;}
h2 { font-size: 1.687em; padding: 0 0 .65em 0;}
h3 { font-size: 1.2em; font-weight:bold;}
p { font-size:.88em; line-height:1.75em; font-weight: normal; padding: 0 0 1em 0; text-align:justify; }
a { color: #FFF; text-decoration:none;}
a img{ border:0px}
.clear { clear: both; height: 0; line-height: 0; font-size: 0; overflow: hidden; }
ul { margin:0; padding:0 0 15px; }
ol { }
li { margin:0 0 0 0; padding:3px 0; line-height:2em; font-size:1em; list-style:inside; }

table, td, div, img { border:0; border-collapse:collapse;}
td {vertical-align:top;}
ul { list-style: none;}
	
@font-face { font-family: 'Century Gothic'; font-weight: 400;
	src: url('http://www.ourdemolink.com/zeptepi/GOTHIC.TTF');
	 src: local("Century Gothic 400"), local("Century Gothic-300"),
              url("Century Gothic400-Regular.woff") format("woff"),
              url("Century Gothic400-Regular.otf") format("opentype"),
              url("Century Gothic400-Regular.svg#Century Gothic-400") format("svg");
}

#wrapper{ width:960px; min-height:100%; margin:0 auto; padding:0;}

#header{ height:102px; margin:0; padding:0 10px 0 0;}
#header h1{ width:134px; height:100px; float:left; margin:0; padding:0; background:url(../images/logo_zeptepi.gif) no-repeat;}
#header h1 a{ display:block; width:134px; height:100px;}
#header h1 a span{ display:none}
#nav{ width:790px; float:right; margin:0; padding:0;}
#nav ul{ list-style-type:none; margin:20px 0 0 0; padding:0; width:515px; float:right;}
#nav ul li{ display:block; float:left; margin:0; padding:0;}
#nav ul li a{ font-family:Arial, Helvetica, sans-serif; font-size:1.125em; margin:0; padding:0 0 0 15px; color:#FFF; text-decoration:none; text-transform:uppercase; }
#nav ul li a:hover{ font-family:Arial, Helvetica, sans-serif; font-size:1.125em; margin:0; padding:0 0 0 15px; color:#FFF; text-decoration:none; text-transform:uppercase; color:#06ca9b }

#nav .search{ width:138px; height:26px; float:right; margin:10px 0 0 0; background:url(../images/search_back.png) no-repeat;}
#nav .search a{ display:block;width:138px; height:26px;}
#nav .search a hover{ display:block;width:138px; height:26px;}
#nav .search a span{ display:none;}

#containerHome{ margin:0; padding:40px 0px;}
#container{ margin:0; padding:40px 10px;}
#banner_area{ width:960px; height:350px; margin:40px 0 0; padding:0; overflow:hidden;}

#leftcol{ width:662px; margin:0; padding:0 40px 0 0; float:left;}

#rightcol{ width:238px; margin:0; padding:0; float:right;}
#roundblock{ width:238px; background: url(../images/roundblock_top.png) no-repeat left top; margin:0; padding:0;}
#roundblock h1,#roundblock p{ color:#000; padding-bottom:.3em;}
#roundblock .content{width:238px; margin:0; padding:10px 0 10px 0; background:url(../images/roundblock_bottom.png) left bottom no-repeat;}
#roundblock .content div.body{ background:url(../images/roundblock_body.png) repeat-y; width:220px; padding:0 6px 0 12px;}
#roundblock .content div.body ul{ list-style-type:none; margin:0; padding:0; list-style:none;}
#roundblock .content div.body ul li{ display:block; float:left; width:195px;margin:0; padding:0 0 0 25px; background:url(../images/tik.gif) left 8px no-repeat;color:#000;}
#roundblock .content div.body ul li a{display:block;font-size:15px; color:#000; text-decoration:none; margin:0; padding:0;}

#roundblock2{ width:201px; background: url(../images/roundblock2_top.png) no-repeat left top; margin:0; padding:0;}
#roundblock2 h2,#roundblock2 p{ color:#000; padding-bottom:.3em; font-weight:normal;}
#roundblock2 .content{width:201px; margin:0; padding:10px 0 10px 0; background:url(../images/roundblock2_bot.png) left bottom no-repeat;}
#roundblock2 .content div.body{ background:url(../images/roundblock2_body.png) repeat-y; width:170px; padding:0 6px 0 25px;}
#roundblock2 .content div.body ul{ list-style-type:none; margin:0; padding:0; list-style:none;}
#roundblock2 .content div.body ul li{ display:block; float:left; width:170px;margin:0; padding:0;}
#roundblock2 .content div.body ul li a{display:block;font-size:17px; color:#000; text-decoration:none; margin:0; padding:0;}

#latestwork{ margin:40px 0; padding:0;}
#workblock { margin:10px 0 0 0; }
.workblock p,.workblock_last p{ color:#7c7c7e; padding:10px; line-height:1.5em;}
.workblock{ width:268px; height:240px; padding:5px; margin:10px 50px 0 0; float:left; background:#FFF; position:relative;}
.workblock_last{  width:268px; height:240px; padding:5px; margin:10px 0 0 0; float:left; background:#FFF; position:relative;}
.more{width:55px; height:16px; position:absolute; right:10px; bottom:10px;}

#about_cont{ width:800px; height:166px; background:url(../images/cont_back.png) no-repeat; overflow:hidden; margin:0 0 30px; padding:30px 40px 10px 100px; color:#000;}
.leftimageblock{ margin:0 0 20px 0; padding:0;}
.leftimageblock img{ float:left; margin:0 10px 10px 0; padding:0;}
.leftimageblock h2{ padding-top: 0px;}
.rightimageblock{ margin:0 0 20px 0; padding:0;}
.rightimageblock img{ float:right; margin:0 0 10px 10px; padding:0;}

.project{ min-height:500px;}
*html .project{ height:500px; overflow:auto;}

.contact_left{ width:492px; margin:0; padding:0; float:left;}
.contact_right{ width:392px; margin:0; padding:0; float:right; overflow:hidden;}
.contact_right img{ border:3px solid #FFF;}

.myform{margin:0;width:492px;padding:0;}

#enquiry{ font-weight:normal;}
#enquiry h1 {font-size:18px; background:url(../images/sayhello.png) no-repeat; width:492px; height:56px; text-align:center; line-height:40px; margin:0 0 15px 0; padding:0; color:#6a96a5; font-size:30px;}
#enquiry p{font-size:14px;color:#FFF;margin-bottom:30px;border-bottom:solid 3px #badae6;padding-top:40px; text-align:center;}
#enquiry label{display:block;text-align:left;width:100px;float:left; color:#FFF; font-size:14px; font-weight:bold; font-family:Arial, Helvetica, sans-serif;}
#enquiry .small{color:#9d9f9f;display:block;font-size:14px;font-weight:normal;text-align:left;width:100px; font-style:italic;}
#enquiry input{float:left;width:375px; height:25px;margin:2px 0 30px 10px; font-size:14px;font-weight:normal; font-family:Arial, Helvetica, sans-serif;}
#enquiry textarea{float:left;width:375px; height:150px;margin:2px 0 30px 10px; font-size:14px;font-weight:normal; font-family:Arial, Helvetica, sans-serif;}
#enquiry .button{ float:right;margin-right:10px;background:url(../images/send.gif) no-repeat; width:97px; height:30px;color:#FFFFFF; cursor:pointer;}
#enquiry .left{float:left;
               width:375px;
			   margin:-25px 0 12px 110px;
			   color:#FFF;
			   font-size:14px;
              }

#maparea{ background:url(../images/contactinfo.png) right top no-repeat; height:292px; width:940px; margin:35px 0 0 0; position:relative;}
#maparea .map{ position:absolute; left:0; top:0;}
.adress{ padding:20px 10px 20px 50px;width:385px; position:absolute; right:0; top:0;}
.adress h1{ font-size:24px; font-weight:normal; padding-bottom:8px;color:#FFF;font-family:"Century Gothic";}
.adress dl{ margin:0; padding:0; color:#333; font-size:17px; font-weight:normal;}
.adress dl dt{ float:left; width:100px;margin:0; padding:5px 0;color:#FFF;font-weight:normal;}
.adress dl dd{ width:280px; float:left; margin:0; padding:5px 0;color:#FFF; font-weight:normal;}

#media_left{ width:710px; float:left; overflow:hidden;}
#media_right{ width:201px; float:right;}


#footer{ background:url(../images/footer_back.jpg) center top no-repeat; height:77px; width:100%; padding:33px 0 0 0;}
#footer .content{ width:960px; margin:0 auto; padding:0;}
#footer .content .copy{ float:left; width:325px;}
#footer .content .copy p{ font-size:.85em; line-height:1.5em;}
#footer .content ul{ width:625px; float:right; margin:0; list-style-type:none;}
#footer .content ul li{ display:block; float:left; margin:0; padding:0 3px;}
#footer .content ul li a{display:block; float:left; margin:0; padding:0;}
#footer .content ul li a span{ display:none;}

#footer .content ul li.myspace a{ background:url(../images/myspace.png) no-repeat; width:148px; height:37px;}
#footer .content ul li.facebook a{ background:url(../images/facebook.png) no-repeat; width:122px; height:37px;}
#footer .content ul li.vimeo a{ background:url(../images/vimeo.png) no-repeat; width:97px; height:37px;}
#footer .content ul li.twitter a{ background:url(../images/twitter.png) no-repeat; width:139px; height:37px;}
#footer .content ul li.skype a{ background:url(../images/skype.png) no-repeat; width:88px; height:37px;}