/*
Theme Name: Zamka
Theme URI: http://www.vooshthemes.com
Description: A Premium Portfolio Theme Developed By Voosh Themes.
Author: Voosh Themes
Author URI: http://www.vooshthemes.com
*/

/* Color: Blue - #0072bc */

@import "reset.css";

/*------------------------------------------------*/
/*---------------------TOOLS----------------------*/
/*------------------------------------------------*/
.line { clear: both; background: url(../images/line.png) no-repeat; width: 959px; height: 42px; }
.post-line { width: 100%; border-bottom: 1px solid #eee; margin: 40px 0; }
.grey { color: #888; }

/*------------------------------------------------*/
/*-----------------GENERAL STYLES-----------------*/
/*------------------------------------------------*/
#wrap { width: 960px; margin: 0 auto; text-align: center; }
body { background: url(../images/main-bg.jpg) repeat-x; background-color: #ffffff; color: #555555; line-height: 22px; font-family: Arial; font-size: 12px; text-align: center;  }
h1, h2, h3, h4, h5, h6 { font-weight: normal; }
h1 { font-size: 60px; margin: 35px 0 25px 0; }
h2 { font-size: 28px; margin: 30px 0 20px 0; }
h3 { font-size: 24px; margin: 30px 0 15px 0; line-height: 24px; }
h4 { font-size: 18px; margin: 25px 0 10px 0; }
h5 { font-size: 16px; margin: 20px 0 5px 0; }
h6 { font-size: 14px; margin: 10px 0 0 0;}
a:link, a:visited { color: #0072bc; text-decoration: none; }
a:hover, a:active { color: #555555; }
p { font-size: 14px; margin-bottom: 15px; }

/*------------------------------------------------*/
/*-----------------HEADER-------------------------*/
/*------------------------------------------------*/
#header { padding: 70px 0 0 0; }
.subtitle { margin: 0 0 14px 0; }

/*------------------------------------------------*/
/*-----------------NAVIGATION---------------------*/
/*------------------------------------------------*/
#nav { float:left; width:100%; overflow:hidden; position:relative; margin: 18px 0 38px 0;  }
#nav ul { clear:left; float:left; margin:0; padding:0; position:relative; left:50%; text-align:center; }
#nav ul li { float:left; list-style:none; margin:0; padding:0; position:relative; right:50%; }
#nav ul li a { display:block; margin:0 0 0 1px; padding:3px 10px; font-size:20px; color:#444; text-transform:uppercase; }
#nav ul li a:hover { color: #0072bc; }
#nav li span { padding-left: 20px; color: #fff; }
#nav li.current_page_item a { color: #0072bc; }

/*------------------------------------------------*/
/*-----------------MAIN LAYOUT--------------------*/
/*------------------------------------------------*/
#main { clear: both; padding: 40px 0 0 0; }
#content { float: left; width: 570px; padding: 0 100px 0 2px; }
#sidebar { float: left; width: 288px; text-align: left; }

/*------------------------------------------------*/
/*-------------------FRONTPAGE--------------------*/
/*------------------------------------------------*/
#frontpage-content { clear: both; }
#frontpage-intro {  margin: 0 80px; width: 800px; height: 135px; background-color: #eee; border: 1px #ccc solid; }
#frontpage-intro p { background: url(../images/frontpage-intro-text.png) no-repeat; width: 739px; height: 86px; text-indent: -9999px; margin: 24px 0 0 26px; }
#featured-projects { margin: 40px 0 0 0; }
#featured-projects .title { margin: 0 0 12px 0; text-align: center; }
#featured-projects #featured-projects-bg { float: left; width: 802px; height: 402px; background-color: #eee; border: 1px #ccc solid; margin: 0 80px; }
#featured-projects #featured-projects-bg img { border: 1px #ccc solid; }
#featured-projects .featured-project-image { float: left; margin: 6px 0 0 6px; }
#featured-projects .first {  }

#client-testimonials { float: left; margin: 48px 0 0 0; text-align: center; }
#client-testimonials .title { margin: 0 0 15px 0; }
#client-testimonials .testimonial { float: left; width: 290px; height: 200px; background-color: #eee; border: 1px #ccc solid; margin: 0 0 0 42px; color: #888; }
#client-testimonials .first { margin-left: 0px; }
#client-testimonials .testimonial p { font-size: 12px; text-align: left; line-height: 20px; margin: 8px 10px 6px 10px; }
#client-testimonials .testimonial p.testimonial-author { color: #555; margin-bottom: -12px;  }
#client-testimonials .testimonial p.author-company { font-weight: normal;  }
#client-testimonials .testimonial-bg { background-color: #f5f5f5; width: 250px; height: 160px; border: 1px #ddd solid; margin: 9px 0 0 9px; padding: 10px; }

/*------------------------------------------------*/
/*-------------------PORTFOLIO--------------------*/
/*------------------------------------------------*/
#portfolio { clear: both; margin: 120px 0 0 0; }
#portfolio h3 { text-align: left; font-size: 18px; margin: 0 0 5px 0; }
#portfolio .portfolio-item { float: left; margin: 0 0 40px 45px; }
#portfolio .portfolio-item-first { float: left; margin: 0 0 40px 0; }
#portfolio .portfolio-item .portfolio-img, #portfolio .portfolio-item-first .portfolio-img { float: left; background: url(../images/portfolio-img-bg.png) no-repeat; width: 290px; height: 210px; }
#portfolio .portfolio-item .portfolio-img img, #portfolio .portfolio-item-first .portfolio-img img { margin: 2px 0 0 -5px; }

/*------------------------------------------------*/
/*--------------------PROJECT---------------------*/
/*------------------------------------------------*/
#project { float: left; margin: 40px 0 40px 0; width: 100%; text-align: left; }
#project #project-meta h3 { margin: 0 0 8px 0; }
#project h4 { font-size: 20px; }
#project #screenshots { float: right; margin: -20px 0 0 0; }
#project .screenshot .portfolio-img-bg { background: url(../images/portfolio-img-large-bg.png) no-repeat; width: 460px; height: 310px; margin: 28px 0 0 0; }
#project .screenshot img { margin: 2px 0 0 2px; }
#project #project-content { float: left; margin: 6px 0 0 0; width: 450px; }
#project #project-content .completion { margin-bottom: 25px; }
#project #project-content .portfolio-title { margin-top: 25px; margin-bottom: 15px; }
.testimonial-author { font-weight: bold; margin: -8px 0 -3px 0; }

/*------------------------------------------------*/
/*-----------------POSTS/PAGES--------------------*/
/*------------------------------------------------*/
.post { text-align: left; margin: 0 40px 0 0; }
.post h2 { margin: 0 0 5px 0; line-height: 32px; }
.archive-title { text-align: left; margin: 5px 0 30px 0; }
.post p { margin: 10px 0 0 0; }
.post .meta { font-size: 20px; color: #888; margin: 0 0 25px 0; }
.post .meta a { color: #888; }
.post .meta a:hover { color: #aaa; }
#other-posts { text-align: left; font-size: 16px; }

/*------------------------------------------------*/
/*-----------------SIDEBARS-----------------------*/
/*------------------------------------------------*/
#sidebar { font-size: 14px; }
#sidebar h3.widgettitle { clear: both; color: #888; font-size: 24px; margin: 20px 0 20px 3px; }
#sidebar .sponsors { float: left; padding-bottom: 20px;  }
#sidebar .sponsors h3 { margin-top: 0; color: #888; }
#sidebar .sponsors a img { float: left; margin: 0 10px 10px -3px; }
#sidebar ul li ul { margin: -5px 0 0px 3px; }
#sidebar ul li ul li { padding: 0 0 2px 0; }
#sidebar ul li ul li a { text-decoration: none; }
#sidebar ul li ul li a:hover { color: #555555; }
#sidebar .textwidget, #sidebar #calendar_wrap, #sidebar #searchform { margin: 0 0 0 4px; }
#sidebar #s { border: 1px solid #cccccc; padding: 5px; margin: 0 15px 10px 0; }
.screen-reader-text { display: none; }

/* contact sidebar */
#sidebar-contact { float: right; background: #eee; border:1px solid #ccc; width: 220px; padding: 20px 20px 5px 20px; text-align: left; }
#sidebar-contact h3 { margin: 0; padding: 0 0 20px 0; font-size: 20px; }
#sidebar-contact h4 { margin: 0; padding: 0; font-size: 16px; }
#sidebar-contact p { font-size: 14px; color: #888; margin: 0 0 15px 0; line-height: 18px; }

/*------------------------------------------------*/
/*-----------------COMMENTS-----------------------*/
/*------------------------------------------------*/
#comments { width: 500px; margin: 35px 0 0 0; text-align: left;  }
#comments ol, #comments ul { padding: 0; }
.commentlist { margin: 25px 0 30px 0; }
.commentlist .comment { background: url(../../../images/comment-bg.jpg) repeat-x; border: 1px solid #ccc; background-color: #eee; padding: 15px 15px 0 15px; margin: 0 0 15px 0; list-style: none; }
.commentlist .fn { color: #555555; font-size: 16px; }
.commentlist .url { color: #0072bc; font-size: 16px; font-style: normal; }
.commentlist .comment-meta { color: #888888; text-transform: uppercase; font-size: 10px; margin: -4px 0 0 0; }
.commentlist img { float: right; width: 25px; height: 25px; margin: 5px 0 0 7px; padding: 2px; border: 1px solid #cccccc; }
.commentlist p { margin: 10px 0 10px 0; width: 475px; }
.commentlist .comment-reply-link { margin: 5px 0 10px -7px; background: url(../images/reply-button-blue.png) no-repeat; width: 73px; height: 28px; display: block; }
.commentlist .comment-reply-link:hover { background: url(../images/reply-button-blue-hover.png) no-repeat; }

#respond { text-align: left; }
#respond h3 { margin-bottom: 20px;  }
#commentform { width: 485px; }
#commentform input { border: 1px #ddd solid; float: left; width: 255px; padding: 12px; margin-bottom: 20px; font-family: Arial; font-size: 14px; color: #555555; }
#commentform textarea { border: 1px #ddd solid; margin: 5px 0 0 0; width: 468px; height: 238px; padding: 10px 10px; font-family: Arial; font-size: 14px; color: #555555; }
#commentform .submit { background: url(../images/submit-button-blue.png) no-repeat; cursor: pointer; margin: 20px 0 0 -5px; border: none; width: 109px; height: 38px; }
#commentform .submit:hover { background: url(../images/submit-button-blue-hover.png) no-repeat; }
#commentform label {  float: left; padding: 8px 0 0 20px; text-transform: uppercase; color: #888888; font-size: 10px; }

/*------------------------------------------------*/
/*-----------------CONTACT FORM-------------------*/
/*------------------------------------------------*/
#contact-page { float: left; font-size: 14px; width: 500px; margin: 0 0 40px 0; text-align: left; }
#contact-page .title { margin: 0 0 15px 0; }
#contact-page p { font-size: 14px; margin: 0 0 25px 2px; }
#contact-page #contact { margin: 0 0 0 0; }
#contact-page #contact fieldset { border: none; }
#contact-page #contact input { border: 1px #dddddd solid; padding: 12px 10px 10px 10px; font-size: 12px; color: #555555; font-family: Arial, Helvetica, sans-serif; margin: 0 200px 15px 0; width: 275px; font-size: 14px; }
#contact-page #contact textarea { border: 1px #dddddd solid; width: 515px; height: 249px; border: 1px #dddddd solid;  font-size: 12px; color: #555555; font-family: Arial, Helvetica, sans-serif; line-height: 24px; margin: 0 0 15px 0; padding: 20px 20px 0 15px; width: 450px; font-size: 14px; }
#contact-page #contact .submit { background: url(../images/submit-button-blue.png) no-repeat; width: 109px; height: 38px; border: none; cursor: pointer; margin: 0 0 0 -5px; }
#contact-page #contact .submit:hover { background: url(../images/submit-button-blue-hover.png) no-repeat; }
.contact_error { background: #eee url('../images/cross.png') no-repeat 10px center; display: block; height: 22px; line-height: 22px; padding: 3px 10px 3px 35px; color:#555555; border: 1px solid #ccc; margin: 0 0 20px 0; }
#contact #email_sent { background-color: #eee; border: 1px #ccc solid; padding: 10px; height: 60px; }
#contact #email_sent h3 { background: url('../images/tick.png') left no-repeat; padding-left:22px; margin-top: 4px; }

/*------------------------------------------------*/
/*-----------------FOOTER-------------------------*/
/*------------------------------------------------*/
#footer { clear: both; padding: 50px 0 100px 0; color: #bbb; text-align: center; }
#footer p { font-size: 22px; margin: 10px 0 0 0; }

/* Additional Styles */
#content .post img { float: left; margin: 0 40px 0 40px; }
#contact-info { float: left; margin: 30px 0 40px 0; padding: 20px; width: 530px; background-color: #eee; border: 1px #ccc solid; }
#contact-info p { float: left; margin: 0; }
#project #project-content .completion { margin-bottom: 8px; }