body { background: #dcdcd5 url(../img/common/white_bg.gif) top repeat-y;  color: #333; font-size: 80%; font-family: "Trebuchet MS", Verdana, Arial, sans-serif; padding: 0; margin: 0;}

a { color: #0b67a2; outline: none; }
a:hover, a:focus { color: #0099cc; }
a img { border: none; outline: none; }

h1, h2, h3, h4 { padding: 0; margin: 0 0 1em 0; }

ul { padding: 0; margin: 0; }

p { padding: 0; margin: 0 0 1em 0; }

#wrap { min-width: 770px; max-width: 960px; background: url(../img/common/wrap_bg.gif) center repeat-y; margin: 0 auto; }

#header { position: relative; height: 122px; background: #4d4d4d url(../img/common/header_bg.gif) bottom repeat-x; padding: 0 20px; margin: 0 1px;}
#header h1 { position: absolute; bottom: 0; width: 337px; margin: 0; /*border: solid 1px red;*/}
#header h1 a { display: block; width: 337px; height: 75px; background: url(../img/common/logo.gif) no-repeat; color: #fff; }
#header h1 a span { position: absolute; top: -10000px; left: -10000px; }
#header ul { list-style-type: none; }

#header #lang_menu { float: right; color: #ccc; margin: 15px 15px 0 0; }
#header #lang_menu a { color: #ccc; font-size: 0.9em; text-decoration: none; }
#header #lang_menu li { display: inline; padding: 0 5px;}
#header #lang_menu a:hover { text-decoration: underline; }

#header #main_menu { position: absolute; bottom: 3px; right: 20px; height: 41px; margin: 60px 0 0 0; }
#header #main_menu li { float: left; width: 109px; text-align: center; }
#header #main_menu a,
#header #main_menu strong { display: block; width: 109px; height: 41px; background-position: top; background-repeat: no-repeat; color: #ccc; font-weight: bold; text-decoration: none; }
#header #main_menu a:hover { background-position: bottom; }
#header #main_menu span { position: absolute; top: -10000px; left: -10000px; }

#content { padding: 20px; }

#footer { clear: both; color: #b4b4b4; font-size: 0.9em; text-align: center; padding: 10px 0 0 0; border-top: solid 1px #e1e1e1; margin: 0 20px 20px 20px; }

/* Home */

#home #content { padding: 50px; }

#intro { float: left; width: 58%; }
#portfolio_highlight { width: 38%; background-color: #efefef; font-size: 0.9em; margin: 0 0 0 60%;}
#portfolio_highlight h2 {background-color: #787878; color: #fff; font-size: 1.3em; padding: 0.25em 1em; }
#portfolio_highlight .inner_box { padding: 0.5em 1em; }
#portfolio_highlight img { display: block; width: 200px; height: 136px; border: solid 1px #787878; margin: 0 auto 10px auto; }
#portfolio_highlight a { font-weight: bold; font-size: 1.1em; }

/* Profile */

#about .column_left { float: left; width: 58%; }
#about .column_left .pic { float: left; margin: 0 1em 1em 0;}

#about .column_right { width: 38%; background-color: #efefef; /*font-size: 0.9em;*/ padding: 0.5% 1%; margin: 0 0 0 60%; }
#about .column_right h2 {color: #0b67a2; font-size: 1.2em; margin-bottom: 0.5em; }
#about .column_right ul { list-style-type: none; }
#about .column_right ul li { margin: 0 0 0.5em 0; }
#about .column_right ul li ul { margin: 0 0 0 1em; }
#about .column_right ul li ul li { margin: 0 0 0.25em 0; }

/* Porfolio */

.portfolio_item { float: left; width: 210px; font-size: 0.9em; padding: 10px; /*background-color: red;*/ }
.portfolio_item .item_image { display: block; width: 200px; margin: 0 auto 10px auto;}
.portfolio_item .item_image img { display: block; width: 200px; height: 136px; border: solid 1px #787878; }
.portfolio_item p { margin: 0; }
.portfolio_item p strong { color: #787878; }
.portfolio_item .item_name { text-align: center; }
.portfolio_item .item_name strong { color: #333; }

.portfolio_item .date { color: #787878; text-align: center; }

/* Contact */

#contact form { width: 80%; background-color: #efefef; padding: 2%; margin: 0 auto;}
#contact form label { display: block; margin: 0 0 1em 0;}
#contact form label strong { float: left; width: 25%; color: #4d4d4d; text-align: right; margin: 0 1em 0 0;}
#contact form input[type=text],
#contact form textarea { width: 50%; color: #333; font: 1em "Trebuchet MS", Verdana, Arial, sans-serif; padding-left: 0.25em; padding-right: 0.25em; border: solid 1px #b4b4b4; }
#contact form textarea { height: 8em; }
#contact form input[type=text]:focus,
#contact form textarea:focus { border: solid 1px #000; }
#contact form .form_controls { text-align: center; margin: 0;}
#contact form .form_controls .submit { background-color: #0b67a2; color: #fff; font-weight: bold; border: solid 1px #fff; cursor: pointer; }

/* 404 */

#error404 #content { padding-top: 40px; padding-bottom: 40px; }

/* Recursive styles */

.center { text-align: center; }
.error_msg { color: #ff0000; font-weight: bold; text-align: center; }
.ok_msg { color: #009933; font-weight: bold; text-align: center; }

/* Tricks */

.clearfix:after { content: "\."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix {display: inline-block; }


/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */