/*
   Copyright Beno Gorancic - www.gorancic.com
*/


body {
   margin: 0;
   padding: 0;
   background-color:#c5c1b9;
   text-align: left;
   font-size: 70%;
   color: #444334;
   font-family: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
}

#mainContainer {
   margin: 0;
   padding: 0;
   background: #f6f4f0 url("background_top.gif") repeat-x;
}

#subContainer {
   margin: 0 auto;
   padding: 69px 0 0 0;
   width:740px;
}

#bodyTop {
   height: 43px;
   background: url("body_top.gif") no-repeat;
}

#bodyMiddle {
   height: auto;
   margin: 0;
   padding: 0 21px 0 19px;
   background: url("body_middle.gif");
   overflow: hidden;
}

#bodyBottom {
   height: 25px;
   background: url("body_bottom.gif") no-repeat;
}

#logo {
   height: 80px;
   margin: 0 0 0 20px;
   padding: 0;
   background: url("logo.gif") no-repeat;
}

#description {
   height: auto;
   margin: 1px 3px 20px 3px;
   padding: 20px;
   font-size:1.2em;
   background: #d6d4d4 url("description_bg.gif") repeat-x;
}

#content {
   width: 460px;
   padding: 0 20px;
   margin-bottom: 20px;
   float: left;
   background: url("nav_seperator.gif") repeat-y;
   background-position:right;
}

#contentFull {
   width: 660px;
   padding: 0 20px;
}

h1 {
   margin: 0 3px 0 3px;
   padding: 14px 0 0 20px;
   height: 37px;
   background: url("title.gif") no-repeat;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-weight: bold;
   font-size: 1.5em;
   color: #f8f6f6;
}

h2 {
   height: 23px;
   margin: 0;
   padding: 7px 0 0 20px;
   background: url("big_heading.gif") no-repeat;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-weight: bold;
   font-size: 1.2em;
   color: #136388;
}

h3 {
   width: 135px;
   height: 23px;
   margin: 0;
   padding: 7px 0 0 20px;
   background: url("small_heading.gif") no-repeat;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-weight: bold;
   font-size: 1.2em;
   color: #136388;
}

h4 {
   margin: 10px 0 15px 0;
   padding: 0;
   font-size: 1.0em;
   font-weight: normal;
}

a:link, a:visited {
   color: #5ba1c2;
   text-decoration: none;
}
a:hover, a:active, a:focus {
   color: #5ba1c2;
   text-decoration: underline
}
a {
   outline: none
}



/* Navigation on right side of the body */
#nav {
   width: 175px;
   float: right;
   margin-right: 4px;
}
/* End of Navigation */



/* Footer */
#footer {
   height: 45px;
   background: url("footer.gif");
}

#footerContent {
   width: 740px;
   margin: 0 auto;
   padding: 8px 0 0 0;
   font-size: 0.9em;
}

#footer a {
   text-decoration: none;
   color: #444334;
}
/* End of Footer */



/* Top Menu */
#menu ul {
   margin: 0;
   padding: 0;
}

#menu {
   height: 80px;
   margin: 0;
   padding: 0;
}
#menu, #menu a {
   background-image: url("menu.gif");
}
#menu li {
   float: left;
   list-style-type: none;
   display: inline;
}
#menu a {
   display: block;
   height: 0;
   overflow: hidden;
   padding-top: 80px;
}
#menu li#menu-01 {
   margin-left: 151px;
}
#menu li#menu-01 a {
   background-position: -154px 0;
   width: 92px;
}
#menu li#menu-01 a:hover {
   background-position: -154px -80px;
}
body#home #menu li#menu-01 a {
   background-position: -154px -160px;
}
#menu li#menu-02 a {
   background-position: -244px 0;
   width: 90px;
}
#menu li#menu-02 a:hover {
   background-position: -244px -80px;
}
body#projects #menu li#menu-02 a {
   background-position: -244px -160px;
}
#menu li#menu-03 a {
   background-position: -335px 0;
   width: 90px;
}
#menu li#menu-03 a:hover {
   background-position: -335px -80px;
}
body#resume #menu li#menu-03 a {
   background-position: -335px -160px;
}
#menu li#menu-04 a {
   background-position: -427px 0;
   width: 90px;
}
#menu li#menu-04 a:hover {
   background-position: -427px -80px;
}
body#blog #menu li#menu-04 a {
   background-position: -427px -160px;
}
#menu li#menu-05 a {
   background-position: -516px 0;
   width: 90px;
}
#menu li#menu-05 a:hover {
   background-position: -516px -80px;
}
body#contact #menu li#menu-05 a {
   background-position: -516px -160px;
}
/* End of Top Menu */



/* Forms ...........................................................*/
label {
   color: #888888;
}

input, textarea{
   font: normal 1.2em "Trebuchet MS", Verdana, Arial, sans-serif;
   color: #444334;
   width: 250px;
   background: #dddbdb;
   height:22px;	
   padding-top:6px;
   padding-left:6px;	
   border:none;
   line-height:22px;
   vertical-align: middle;
   margin-left: 0;
   margin-bottom:8px;
}

textarea {
   width: 400px;
   height: 170px;
   overflow: auto;
   padding-top:6px;
   padding-left:6px;
}

#submit {
   height: 30px;
   width: 71px;
   border: 0px;
   background: url("submit_button.gif");
   cursor: pointer;
}
/* End of forms ....................................................*/



/* Resume */
.resumeEntry {
   margin: 15px 0;
   padding: 0;
}

.resumeEntry li {
   list-style: none;
   margin: 0 0 0 -40px;
   padding: 0;
}

.resumeEntry ul {
   margin:0 0 0 40px;
   padding: 0 0 0 0;
}
	
.resumeLeftSide {
   font-size: 0.9em;
   float:left;
   margin: 0;
}

.resumeRightSide {
   margin: 0 0 0 120px;
}

.bulletPoint li {
   background: url("li_button.gif") no-repeat;
   padding: 0 0 0 15px;
}

#pdf a {
   background: url("pdf.gif") no-repeat;
   height: 50px;
   width: 50px;
   margin: 15px;
   float: left;
}

#word a{
   background: url("word.gif");
   height: 51px;
   width: 50px;
   margin: 15px 0 0 10px;
   float: left;
}
/* End of Resume */



/* Projects */
#project {
   width: 370px;
   margin: 0 auto;
}

#code a {
   background: url("code.gif");
   width: 83px;
   height: 101px;
   float: left;
}

#web a {
   background: url("web.gif");
   width: 83px;
   height: 101px;
   float: right;
}

#code_small a {
   background: url("code_small.gif");
   width: 50px;
   height: 60px;
   margin: 15px;
   float: left;
}

#web_small a{
   background: url("web_small.gif");
   width: 49px;
   height: 60px;
   margin: 15px 0 0 10px;
   float: left;
}

.proj {
   margin: 15px 0;
}

.contentLeft {
   float: left;
   width: 213px;
   margin: 0;
}

.contentRight {
   float: right;
   width: 235px;
   margin: 4px 12px 0 0;
}

* html .contentRight { margin/**/: 4px 0 0 0; } /* hack for IE6/5.5 to ensure contentRight lines up correctly */

img {
   border-color: #0099FF;
   border-width: 1px;
}

.clear {
   clear: both;
}
/* End of Projects */



/* Blog related ----------------------------------------------------- */
#nav ul, #nav ul ol {
   width: 155px;
   margin: 0;
   padding: 0;
   margin-bottom: 12px;
}

#nav ul li {
   list-style-type: none;
   list-style-image: none;
}

#searchform {
   height: 100px;
   background: url("searchblog.gif") no-repeat;
   margin-bottom: 20px;
}

#searchform input {
   margin-top: 55px;
   margin-left: 10px;
   border: none;
   width: 130px;
   height:22px;
   padding-top:6px;
   padding-left:6px;
   font-family:Arial, Helvetica, sans-serif;
   font-size:14px;
   color:#444334;
   background:#ffffff;
}

#blog h2 {
   background: none;
   padding: 0;
   color:#444334;
   font-size:1.4em;
}

.post {
   margin-bottom:30px;
   border-bottom: solid 1px #dbdcc0;
}

small {
   font-family: Arial, Helvetica, Sans-Serif;
   font-size: 0.9em;
   line-height: 1.5em;
}

.noFormatingLink a:link, .noFormatingLink a:visited, .noFormatingLink a:hover, .noFormatingLink a:active, .noFormatingLink a:focus {
   text-decoration: none;
   color: #777;
   font-weight: normal;
}

.postmetadata, small {
   color: #777;
}

.navigation {
   display: block;
   text-align: center;
   margin-top: 10px;
   margin-bottom: 30px;
}

.alt {
   margin: 0;
   padding: 10px;
}

#blog .comments {
   font-size: 1.25em;
}

.commentlist {
   margin: 0;
   padding-left: 15px;
}

.commentlist cite, .commentlist cite a {
   font-style: italic;
   font-size: 1.05em;
}

.commentlist li {
   font: 0.9em 'Lucida Grande', Verdana, Arial, Sans-Serif;
}

.commentlist li {
   font-weight: bold;
   margin-bottom: 25px;
   padding: 0;
   list-style: none;
   border-bottom: 1px dotted #B6B6B6;
}

.commentlist p {
   margin-top: 5px;
   font-weight: normal;
   line-height: 1.5em;
   text-transform: none;
}

.alignright {
   float: right;
}

.alignleft {
   float: left
}

img.alignright {
   display: inline;
   margin: 0 0 2px 5px;
}

img.centered {
   display: block;
   margin-left: auto;
   margin-right: auto;
}

img.alignleft {
   margin: 0 5px 2px 0;
   display: inline;
}

/* End of Blog related ----------------------------------------- */