/*
Template Name: Bobo HTML Template 
Description: A Business / Portfolio HTML Template
Author: Chris Creed
URL: http://www.chris-creed.com
*/

/* Colors: Blue - #0072bc */


/*-------------*/
/* -- Tools -- */
/*-------------*/
.line { clear: both; height: 5px; background-color: #eee; }
.post-line { clear: both; border-bottom: 1px solid #eee; margin: 40px 0; }
.cache-images { visibility: hidden; }

/*----------------------*/
/* -- General Styles -- */
/*----------------------*/
#wrap { width: 800px; margin: 0 auto; text-align: center; }
body {     
    /*background: url("../images/bg.gif") repeat scroll 0 0 transparent;*/
    background: url("../images/bg.jpg") no-repeat center top transparent;
    color: #696853;
    font-family: Tahoma;
    font-size: 11px;
    font-style: normal;
    margin: 0 0 20px;
    padding: 0;
}

a:link, a:visited { color: #0072bc; text-decoration: none; }
a:hover, a:active { color: #555555; }


/*-------------------*/
/* -- Main Layout -- */
/*-------------------*/
#main{width:800px;margin: 0px auto;overflow:hidden;}
#content {     
    background-image: url("../images/center_bg.gif");
    float: left;
    overflow: hidden;
    padding: 0;
    width: 800px;
}
#sidebar { float: left; width: 288px; text-align: left; }

/*--------------*/
/* -- Header -- */
/*--------------*/
#header { overflow: hidden; }
#header h1 { font-size: 45px; color: #444; letter-spacing: -3px; font-weight: bold; margin: 20px 0 0 0; padding: 0; }
#header h2 { color: #aaa; margin: 15px 0 0 0; padding: 0; font-size: 30px; letter-spacing: -1px; }
#header .line { margin: 30px 0 0 0; }
.subtitle { margin: 0 0 14px 0; }
/*#header1{float:left;width:797px;height:36px;line-height:36px;overflow:hidden;font-size:9px;color:#ffffff;text-align:right;padding-right:3px;}*/
#header1{float:left;width:797px;height:36px;line-height:36px;overflow:hidden;font-size:9px;color:#000000;text-align:right;padding-right:3px;}
#header2{float:left;width:800px;overflow:hidden;}
#header2 .head1{float:left;width:800px;height:17px;background-image: url(../images/head_top.gif);}
#topmenu{float:left;width:800px;height:50px;overflow:hidden;}
#topmenu .left{width:7px;height:50px;overflow:hidden;float:left;background-image: url(../images/topmenu/left.gif);}
#topmenu .item{float:left;overflow:hidden;}
#topmenu .right{width:7px;height:50px;overflow:hidden;float:left;background-image: url(../images/topmenu/right.gif);}
#logo{float:left;width:800px;height:185px;overflow:hidden;background-image: url(../images/logo.gif);}
#bottommenu{float:left;width:800px;height:45px;overflow:hidden;}
#bottommenu .left{width:15px;height:45px;overflow:hidden;float:left;background-image: url(../images/bottommenu/left.gif);}
#bottommenu .item{float:left;overflow:hidden;}
#bottommenu .right{width:17px;height:45px;overflow:hidden;float:left;background-image: url(../images/bottommenu/right.gif);}
#grayline{float:left;width:800px;height:9px;overflow:hidden;background-image: url(../images/csik.gif);}

/*-----------*/
/* -- Nav -- */
/*-----------*/
#nav { float: left; width: 100%; overflow: hidden; position: relative; margin: 40px 0 0 0; border-top: 5px #eee solid; border-bottom: 5px #eee solid; padding: 12px 0 8px 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 {  margin: 0 0 0 1px; padding: 3px 0; font-size: 16px; color: #444; text-transform: uppercase; }
#nav ul li a:hover { color: #0072bc; }
#nav li span { padding: 0 20px; color: #444; font-size: 16px; }
#nav li a.current{ color: #0072bc; }

/*-------------*/
/* -- Posts -- */
/*-------------*/
.post { text-align: left; margin: 0 40px 40px 0; float: left; }
.post h2 { margin: 0 0 -5px 0; line-height: 32px; font-size: 20px; }
.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; }
.previous-posts { font-size: 16px; }
#other-posts { text-align: left; font-size: 16px; }
.read-post-link { display: block; margin: 10px 0 0 0; }

/*-------------------------*/
/* -- Frontpage Content -- */
/*-------------------------*/
#frontpage-content { clear: both; margin: 0 75px; width: 810px; overflow: hidden; }
#frontpage-intro {  background-color: #f5f5f5; border: 2px #e5e5e5 solid; padding: 20px; text-align: left; }
#frontpage-intro p { font-size: 18px; color: #888; margin: 0; line-height: 26px; }
#frontpage-intro p span { color: #555; }
#featured-projects h3 { color: #888; font-size: 20px; text-align: left; }
#featured-projects { margin: 40px 0 0 0; }
#featured-projects #featured-projects-bg { float: left;  background-color: #f5f5f5; border: 2px #e5e5e5 solid; padding-bottom: 6px; }
#featured-projects #featured-projects-bg img { border: 2px #e5e5e5 solid; }
#featured-projects .featured-project-image { float: left; margin: 6px 0 0 6px; }
#featured-projects .featured-project-image:hover { opacity: 0.7; }

/*-----------------*/
/* -- Portfolio -- */
/*-----------------*/
#portfolio { clear: both; margin: 15px 0 0 0; width: 960px; overflow: hidden; }
#portfolio h3 { text-align: left; font-size: 16px; margin: 0 0 2px 0; font-style: italic; }
#portfolio .portfolio-item { float: left; margin: 0 0 40px 45px; }
#portfolio .portfolio-item-first { float: left; margin: 0 0 40px 0; }
#portfolio .portfolio-item { float: left; margin: 0 0 40px 54px; }
#portfolio .portfolio-item img, #portfolio .portfolio-item-first img { border: 2px #e5e5e5 solid; }
#portfolio .portfolio-item img:hover, #portfolio .portfolio-item-first img:hover { opacity: 0.7; }

/*---------------*/
/* -- Project -- */
/*---------------*/
#project { float: left; margin: 10px 0 60px 0; width: 100%; text-align: left; }
#project #project-meta h3 { margin: 0 0 8px 0; }
#project h4 { font-size: 20px; }
#project .screenshot img { float: right; margin: 2px 0 0 2px; width: 400px; border: 2px #eee solid; }
#project #project-content { float: left; margin: 6px 0 0 0; width: 450px; }
#project #project-content .completion { margin-bottom: 25px; }
.testimonial-author { font-weight: bold; margin: -8px 0 -3px 0; }
.grey { color: #888; }

/*---------------*/
/* -- Sidebar -- */
/*---------------*/
#sidebar { font-size: 14px; }
#sidebar h3 { font-size: 16px; margin: 20px 0 5px 0; }
#sidebar .sponsors h3 { margin-top: 0; }
#sidebar .sponsors { float: left; padding-bottom: 20px;  }
#sidebar .sponsors a img { float: left; margin: 0 10px 10px -3px; }

/*-----------------------*/
/* -- Sidebar Contact -- */
/*-----------------------*/
#content-left { float: left; width: 574px; padding: 0 0 0 15px; text-align: left; }
#content-left p { text-align: justify;padding: 0 10px 0 30px;line-height: 20px;}
#content-right { float: left; width: 173px; padding: 0px; text-align: left; }
#content-left .title {
    background-image: url("../images/title.gif");
    float: left;
    height: 26px;
    width: 574px;
}
#content-left h1 {
    color: #FD640C;
    float: left;
    font-size: 13px;
    height: 26px;
    line-height: 24px;
    margin: 0;
    padding: 0 0 0 55px;
    width: 514px;
}
/*--------------------*/
/* -- Contact Page -- */
/*--------------------*/
#contact-page { float: left; font-size: 14px; width: 500px; margin: 0 0 70px 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-form { margin: 0 0 0 0; }
#contact-page #contact-form fieldset { border: none; }
#contact-page #contact-form 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-form 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-form .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-form .submit:hover { background: url(../images/submit-button-blue-hover.png) no-repeat; }
.hide { display: none; }
#response { background-color: #f5f5f5; border: 1px #e5e5e5 solid; padding: 15px; color: #cc0000; }

/*--------------*/
/* -- Footer -- */
/*--------------*/
#footer {  
    background-image: url("../images/footer_bg.gif");
    float: left;
    height: 46px;
    width: 800px;
}

#footer .left {
    color: #989797;
    float: left;
    height: 44px;
    line-height: 44px;
    padding: 2px 0 0 25px;
    text-align: left;
    width: 370px;
}
#footer .right {
    float: left;
    height: 44px;
    line-height: 44px;
    padding: 2px 25px 0 0;
    text-align: right;
    width: 375px;
}

#footer_end {
    background-image: url("../images/bottom.gif");
    background-repeat: no-repeat;
    float: left;
    height: 7px;
    width: 800px;
}
.footmenu {
    float: left;
    margin-top: 10px;
    padding: 10px 0 0 15px;
    width: 559px;
}
.footmenu img {
    padding-right: 7px;
}
table.gyarto {
    border-collapse: separate;
    border-color: #D2D2D2;
    border-spacing: 0;
    border-style: solid;
    border-width: 1px;
    margin-top: 10px;
}
table.gyarto th {
    border-color: #D2D2D2;
    border-style: solid;
    border-width: 1px;
    padding: 2px;
}
table.gyarto td {
    border-color: #D2D2D2;
    border-style: solid;
    border-width: 1px;
    padding: 2px;
}
#down .cim {
    border-bottom: 1px solid #B2B2B2;
    color: #3D4965;
    float: left;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 5px;
    width: 528px;
}
#content-left h2 {
    color: #3D4965;
    font-size: 13px;
    font-weight: bold;
    margin: 0;
    padding: 0 0 0 10px;
}

#toptermekek .cim {
    border-bottom: 1px solid #B2B2B2;
    color: #3D4965;
    float: left;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 5px;
    width: 528px;
}

#toptermekek .text {
    float: left;
    font-size: 11px;
    padding: 0;
    text-align: justify;
    width: 528px;
}

INPUT.gomb {
    background: none repeat scroll 0 0 #696853;
    border: 1px solid #696853;
    color: white;
    font-size: 11px;
    padding: 2px 3px 1px;
}
