/* ============================================= reset grup ============================================= */
* { margin: 0; padding: 0; text-decoration: none; border: none; list-style: none; outline: none; }

/* ============================================= home body and content body ============================================= */
body { background:url("../images/bg.jpg") repeat-x #FFF; margin:0; padding:0; font-family:Verdana, Geneva, sans-serif; font-size:12px; color:#5e5e5e; line-height:16px; }
body#home { background:url("../images/bgr.jpg") repeat-x #FFF; margin:0; padding:0; font-family:Verdana, Geneva, sans-serif; font-size:12px; color:#5e5e5e; line-height:16px; }

/* ============================================= input and textarea ============================================= */

/* ============================================= tag heading ============================================= */
h1, h2, h3, h4, h5, h6 { color:#5e5e5e; padding:0; font-weight:normal; }
h1 { font-size:28px; margin:20px 0; }
h2 { font-size:26px; margin:16px 0; }
h3 { font-size:24px; margin:14px 0; }
h4 { font-size:22px; margin:12px 0; }
h5 { font-size:20px; margin:10px 0; }
h6 { font-size:18px; margin:8px 0; }

/* ============================================= general needed styles ============================================= */
ul, li { line-height:26px; }
p { }
.float_left { float:left; }
.float_right { float:right; }
.margin_0_32 { margin:0 32px; }
.margin_0_40 { margin:0 10px; width:380px; }
hr { background:url("../images/hr.gif") no-repeat; height:20px; width:600px; padding:10px 0;  }
.clear { clear:both; height:1%; }
.float-left { float:left; }
.float-right { float:left; }

/* ============================================= header ============================================= */
#header_container { height:480px; width:100%; }
#header { width:860px; position:relative; margin:auto; }
#logo { width:300px; float:left; padding:16px 0 0 0; }

/* ============================================= menu ============================================= */
#menu { background:url("../images/menu_bg.png") no-repeat; width:531px; height:43px; margin:40px 0 0 0; padding:0; float:right;  }
#menu li { display:block; position: relative; float:left;  }
#menu a, #menu a:visited { display:block; text-align:center; width:105px; line-height:43px; color:#3f3f3f; text-decoration:none;  }

/* ============================================= sub navigation ============================================= */
#menu li ul.subnav { list-style: none; position: absolute; left: 0; top: 42px; background:#FFF; margin: 0; padding:0; display: none; float: left; width: 140px; z-index:100; -moz-border-radius-bottomleft:8px; -moz-border-radius-bottomright:8px; -webkit-border-bottom-left-radius:8px; -webkit-border-bottom-right-radius:8px; border-top:none; border-bottom:1px solid #ebebeb; border-left:1px solid #ebebeb; border-right:1px solid #ebebeb; }
#menu li ul.subnav li{ margin: 0; padding: 0; clear: both; width: 140px; z-index:5; border-top:1px solid #ebebeb; }
#menu li ul.subnav li a { margin: 0; padding: 0 10px; float: left; width: 140px; background: fff; z-index:135; line-height:30px; text-align:left; }
#menu li.current li a { color:#3f3f3f; }

/* ============================================= search ============================================= */
#search { background:url("../images/search.png") right top no-repeat; height:26px; text-align:right; margin:10px 0; padding-top:2px; float:right; width:500px; }
#search_input { border:none; width:200px; color:#3f3f3f; height:16px; }
#search_btn { background:none; border:none; width:25px; height:20px; padding-top:5px; }

/* ============================================= content ============================================= */
#content { width:860px; position:relative; margin:auto; color:#777777; line-height:18px; }
#content a, #content a:visited { color:#3f3f3f; text-decoration:none; }

/* ============================================= full view ============================================= */
#big_content_left { background:url("../images/big_content_left.png") no-repeat; width:816px; float:left; padding:16px 22px; }
.big_nav { margin:0 25px 20px 25px; border-bottom:1px solid #dfdfdf; }
.big_nav li { display:inline-block; width:170px; text-align:center; line-height:46px; }

/* ============================================= content left ============================================= */
#content_left { background:url("../images/content_left.png") no-repeat; width:620px; float:left; padding:10px 22px; line-height:18px; }
#content_left p { margin:10px 0 20px 0; padding:0; }
#content_left a, #content_left a:visited { color:#3f3f3f; }

/* ============================================= title and description for each page ============================================= */
#title_description { width:632px; float:left; padding:2px 16px; }
#title_description h1, h6 { display:inline-block; }
#title_description h1 { color:#fff; margin:10px 10px 0 0; padding:0 10px; border-right:1px dashed #393939; }

/* ============================================= content right ============================================= */
#content_right { float:right; width:188px; margin:0 0 0 8px; }
#content_right ul { color:#999999; font-size:12px; margin:10px 0 30px 0; }
#content_right li { border-bottom:1px #eeeeee solid; }
#content_right a, #content_right a:visited { color:#7f7f7f; display:block; padding:5px; margin:0; }
#content_right li.current a { font-weight: bold; }

/* ============================================= icon from right of page - under search input ============================================= */
#page_icon { height:160px; text-align:center; padding:20px 0 0 0; }

/* ============================================= blog ============================================= */
.blog_title { margin:5px 0; }
#content_left .blog_title a:hover { color:#434343; }
#content_left .blog_title a, .blog_title a:visited { display:inline-block; padding:0 4px; color:#ffffff; }

/* ============================================= big image ============================================= */
.big_img { background:url("../images/big_img_bg.png") no-repeat bottom; margin:10px 0; padding:0 0 10px 0; width:620px; height:250px; }
.big_img img { margin:10px 0; }

/* ============================================= small image left ============================================= */
.small_img_left { margin:5px 0; }
.small_img_left p { float:left; position:relative; overflow:hidden; }
.small_img_left img { float:left; margin:0 15px 0 0; border:1px solid #dfdfdf; padding:4px; }

/* ============================================= small image right ============================================= */
#small_img_right { margin:5px 0; }
#small_img_right img { float:right; margin:0 15px 0 0; border:1px solid #dfdfdf; padding:4px; }

/* ============================================= note block ============================================= */
#note_block { background-color:#e7e7e7; margin:5px 0; border-left:3px solid #add058; padding: 10px 15px; color:#5e5e5e; }
#small_img_right img { float:right; margin:0 15px; }
#note_block a { color:#848484; }

/* ============================================= center title ============================================= */
#center_title { float:right; text-align:center; width:370px; }
#center_title p { text-align:left; margin:5px 0; padding:0; }

/* ============================================= list styles ============================================= */
#list_style { float:left; width:250px; }
.default_list { margin:0 30px; }
.default_list li { list-style:decimal; }
.arrow_list li { background:url("../images/arrow.gif") no-repeat left top; padding:0px 4px 0 26px; }
.wrong_list li { background:url("../images/wrong.gif") no-repeat left; padding:0px 4px 0 26px; }
.avatar_list li { background:url("../images/avatar.gif") no-repeat left; padding:0px 4px 0 26px; }
.check_list li { background:url("../images/check.gif") no-repeat left; padding:0px 4px 0 26px; }
.add_list li { background:url("../images/add.gif") no-repeat left; padding:0px 4px 0 26px; }

/* ============================================= more panels ============================================= */
.more_panels { float:left; width:170px; margin:5px 18px; }

/* ============================================= more lists ============================================= */
#more_lists { margin:5px 0; }

/* ============================================= text inputs, textarea and buttons ============================================= */
#contact_form { margin:50px 0; padding:0 80px; }
.field { background:url("../images/text_input.png") no-repeat right; width:460px; height:37px; margin:10px 0; }
#contactname { float:right; background:none; width:355px; height:37px; font-size:14px; }
#email { float:right; background:none; width:355px; height:37px; font-size:14px; }
#phone { float:right; background:none; width:355px; height:37px; font-size:14px; }
.message_field { background:url("../images/message.gif") no-repeat top right; width:460px; height:226px; margin:10px 0; border:0; }
#message { float:right; background:none; width:355px; font-size:14px; padding:5px 0; overflow:hidden; resize: none; }
.contactlabel { float:left; width:100px; vertical-align:top; font-weight:bold; margin:0; padding:0; height:18px; }
#send { background:url("../images/big_button.png") no-repeat; height:40px; width:190px; text-transform:uppercase; margin:10px 0; color:#FFF; float:right; }
.error { color:#be2020; margin:0; padding:0; }

/* ============================================= comments ============================================= */
#comments { width:560px; padding:0 30px; } 
#comments h2 { text-align:right; margin-right:30px; } 
#comments a, #comments a:visited { color:#FFF; } 
#comments a:hover { color:#000; } 
.comment { width:500px; margin-left:20px; } 
.comment_reply { width:440px; margin-left:80px; }
.name { margin:0 10px 0 40px; font-size:18px; border-right:1px dashed #bbbbbb; padding:0 20px; color:#65696e; } 
.admin { margin:0 10px 0 40px; font-size:18px; border-right:1px dashed #bbbbbb; padding:0 20px; } 
.comment_nr { background:url("../images/comment_arrow.gif") no-repeat left top; display:inline-block; width:48px; height:20px; text-align:center; cursor:pointer; }
.comment_message { font-size:11px; margin:10px 0; line-height:16px; }

/* ============================================= comment form ============================================= */
#comment_form { margin:60px 0; width:466px; }

/* ============================================= pagination ============================================= */
#pagination { text-align:center; margin-top:40px; } 
#pagination a, #pagination a:visited { background-color:#f1f1f1; display:inline-block; margin:0 2px; padding:3px; width:20px; color:#333333; } 
#pagination a:hover { background-color:#e2e2e2; } 
#pagination a.current { color:#fff; font-weight:bold; }

/* ============================================= welcome text ============================================= */
#welcome_container { height:70px; margin:5px 0 0 0; }
#welcome { margin:10px 0 0 0; padding:0; width:700px; float:left; }
#welcome h5 { margin:10px 0; }
#welcome h6 { margin:0; }
#our_portfolio { float:right; width:100px; }

/* ============================================= home top panels ============================================= */
#first_panel { width:261px; float:left; margin:0 15px 0 0; }
#first_panel img { border:1px solid #dfdfdf; padding:4px; }
#first_panel p { text-align:justify; margin:0; padding:0; line-height:18px; padding-right:10px;}
#second_panel { width:261px; float:left; padding:0 15px 0 0px; }
#second_panel img { border:1px solid #dfdfdf; padding:4px; }
#second_panel p { text-align:justify; margin:0; padding:0; line-height:18px; padding-right:10px;}
#third_panel { width:261px; float:left; margin:0 0 0 0px; }
#third_panel img { border:1px solid #dfdfdf; padding:4px; }
#third_panel p { text-align:left; margin:0; padding:0; line-height:18px; padding-right:10px;}

.black { color:#65696e; margin:15px 0; display: inline-block; }
.green { margin:15px 0; display:inline-block; }

.big_button { background:url("../images/big_button.png") no-repeat; height:32px; width:190px; display:block; text-decoration:none; text-transform:uppercase; padding-top:8px; margin:30px 0 10px 34px; text-align:center; }
.big_button:link, .big_button:visited { color:#fff; }

/* ============================================= testimonials ============================================= */
#testimonials { width:400px; float:left; padding:0; margin:0 0 20px 0; }
#testimonials p { background:url("../images/quote.gif") no-repeat left top; margin:12px 0 9px 0; padding:0 0 0 40px; line-height:18px; font-style:italic; }

/* ============================================= clients ============================================= */
#clients { width:400px; float:right; padding:2px 0 0 0; margin:0; }
#clients img { margin:4px; }

/* ============================================= gray line separator ============================================= */
.gray_line { background: url("../images/gray_line.gif") no-repeat; width:700px; height:1px; margin:20px 0; }

/* ============================================= boxes ============================================= */
a.box { display: block; padding: 12px 12px 12px 52px; color: #333; text-decoration: none; -moz-border-radius: 6px; -webkit-border-radius: 6px; margin: 20px 0; }	
a.box:hover { color: #000; text-decoration:none; }
.close { width: 9px; height: 9px; float: right; background: url("../images/close_box.png") no-repeat left top; margin: 6px 0; }
.close:hover { background: url("../images/close_box.png") no-repeat left bottom; }
.succes { border: 1px solid #b3dc7c; background: url("../images/success.png") no-repeat 10px 50% #e8ffca; }
.error { border: 1px solid #ebb1b1; background: url("../images/error.png") no-repeat 10px 50% #ffd6d6; }
.warning { border: 1px solid #efdc75; background: url("../images/warning.png") no-repeat 10px 50% #fff7cb; }
.info { border: 1px solid #afdbee; background: url("../images/info.png") no-repeat 10px 50% #e4f5fd; }
.empty { color:#cf4521; }

/* ============================================= zoom effect for portfolio images ============================================= */
.zoom { background: url("../images/zoom.png") no-repeat #FFF 50% 50%; position:absolute; width:240px; height:120px; top:142px; left:5px; margin:0; padding:0; opacity:0.5; filter: alpha(opacity = 50); }

/* ============================================= single project image slideshow ============================================= */
.pics { background:url(../images/big_img_bg.png) no-repeat bottom; height: 338px; width: 816px; padding:0 0 16px; margin:0; overflow: hidden; }
.pics img { height: 320px; width: 816px; padding: 15px 0 15px 0; top:0; left:0 }

/* ============================================= portfolio single top images slideshow ============================================= */
.portfolio_single_nav { margin:0 0 10px 0; text-align:center; }
#portfolio_single_nav a { background:url(../images/silde-nav.png) no-repeat top #FFF; height:8px; width:8px; text-decoration: none; display: inline-block; margin:0 2px; }
#portfolio_single_nav a.activeSlide { background:url(../images/silde-nav.png) no-repeat bottom #FFF; }
#portfolio_single_nav a:hover { background:url(../images/silde-nav.png) no-repeat bottom #FFF; }

/* ============================================= footer ============================================= */
#footer { background:url("../images/footer.png"); height:25px; position:relative; margin:20px auto; font-size:11px; color:#999999; padding-top:15px; }
#footer span { float:right; }
#footer a, #footer a:visited { text-decoration:none; color:#999999; }
#footer .inner { width:850px; text-align:center; margin:0px auto;}

/* ============================================= error style ============================================= */
#error { background:url("../images/error_bg.gif") repeat; }
#error div { background: url("../images/stop.png") no-repeat right top #FFF; position:relative; width:400px; margin:140px auto; padding:10px; -moz-border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; -webkit-border-radius:10px; }
#error h5 { color:#cf4521; margin:35px 0 20px 0; }



/* ============================================= menu ============================================= */
#menu a:hover { color:#bbc315; }
#menu li.current a { color:#84b41b; }

/* ============================================= sub navigation ============================================= */
#menu li.current li a:hover { color:#bbc315; }

/* ============================================= content ============================================= */
#content a:hover { color:#bbc315; }

/* ============================================= content left ============================================= */
#content_left a:hover { color:#bbc315; }
#content_left h3 a, #content_left h3 a:visited { color:#84b41b; }
#content_left h3 a:hover { color:#bbc315; }

/* ============================================= title and description for each page ============================================= */
#title_description h6 { color:#bbc315; }

/* ============================================= content right ============================================= */
#content_right a:hover { color:#bbc315; }
#content_right li.current a { color: #84b41b; }

/* ============================================= blog ============================================= */
#content_left .blog_title a, .blog_title a:visited { background-color:#84b41b; }

/* ============================================= note block ============================================= */
#note_block a:hover { color:#bbc315; }

/* ============================================= text inputs, textarea and buttons ============================================= */
#send:hover { color:#84b41b; cursor:pointer; }

.admin { color:#bbc315; } 

/* ============================================= pagination ============================================= */
#pagination a:hover { color:#bbc315; } 
#pagination a.current { background-color:#87a932; }

/* ============================================= home top panels ============================================= */
.green { color:#84b41b; }
.big_button:hover { color:#84b41b; }

/* ============================================= footer ============================================= */
#footer a:hover { color:#bbc315; }

/*---------------------------- CONTACTUS PAGE ----------------------------*/

.emaillink{
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #00b6fa;
	text-decoration: none;
}
.formtitle{
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #00b6fa;
	text-decoration: none;
}
.input{
	background:#fff;
	border:1px solid #ccc;
	height:22px;
	margin-bottom:5px;
	width:200px;
}
textarea{
	background:#fff;
	border:1px solid #ccc;
	height:100px;
	margin-bottom:5px;
	width:300px;
}
.textareakisa{
	background:#fff;
	border:1px solid #ccc;
	height:50px;
	margin-bottom:5px;
	width:200px;
}