body { margin:0; padding:0; font-size:14px; line-height :19px; font-family: Arial; border:0px solid #000; }
a { color:#006699; text-decoration:none;}
a:hover { text-decoration:underline;}
a:active { color: #608F9F;}
p { padding: 0 10px 0 10px; color:#444;}
h1 { margin:0; padding:10px 0 0 10px; font-size:15pt; color:#999; font-weight:normal;}
h3 { margin:0; padding:10px 0 0 10px; font-size:16pt;; color:#888; font-weight:normal;}
h4 { margin:0; padding:10px 0 0 10px; font-size:20pt; color:#999; font-weight:normal;}
 
img { border-style: none}
li {list-style:none; padding-left:20px; background:url(images/bullet.png) no-repeat 0px 4px;color:#444;}

#header { height:120px; width: 950px; margin: 0 auto;}
#headertitle { float:right; font-size:28pt; color:#d0d0d0; padding:69px 10px 10px 0;}
#logo {margin-left: 5px; margin-top:15px; float:left;}
#menubar {background:url(images/menu.jpg) repeat-x; height:34px; font-size: 16px; color:#bbbbbb  }
#menuwrap {width: 925px; margin: 0 auto; text-align:right; padding-top: 7px; letter-spacing:1px; }
#menuwrap a{ color:#edf6f9;}
#menuwrap a:hover{ color:#b6cae3; text-decoration:none}
#menu a { display:block; color:#000000; float:left; font-size:14px; text-transform:uppercase; text-decoration:none; margin:0 19px; padding-top:8px;}
#menu a:hover{padding-top:10px;}
#menu .active { border-bottom:thin #bcbcbc solid}
#main { float:left; padding:0 0 25px 0;}
#portfolio{display: block;width: 120px;height: 40px;background: url("images/menu_portfolio.jpg") no-repeat 0 0; float: right;}
#portfolio:hover{ background-position: 0 -40px;}
#portfolioactive {display: block;width: 120px;height: 40px;background: url("images/menu_portfolio_active.jpg") no-repeat 0 0; float: right;}
#portfolio span{display: none;}
#about{display: block;width: 120px;height: 40px;background: url("images/menu_about.jpg") no-repeat 0 0; float: right;}
#about:hover{ background-position: 0 -40px;}
#aboutactive {display: block;width: 120px;height: 40px;background: url("images/menu_about_active.jpg") no-repeat 0 0; float: right;}
#about span{display: none;}
#blog{display: block;width: 120px;height: 40px;background: url("images/menu_blog.jpg") no-repeat 0 0; float: right;}
#blog:hover{ background-position: 0 -40px;}
#blogactive {display: block;width: 120px;height: 40px;background: url("images/menu_blog_active.jpg") no-repeat 0 0; float: right;}
#blog span{display: none;}
#contact{display: block;width: 107px;height: 40px;background: url("images/menu_contact.jpg") no-repeat 0 0; float: right;}
#contact:hover{ background-position: 0 -40px;}
#contactactive {display: block;width: 107px;height: 40px;background: url("images/menu_contact_active.jpg") no-repeat 0 0; float: right;}
#contact span{display: none;}

.wrap { width: 950px; margin: 0 auto; }
.splitter { display:block; float:left;}
.featured {background: #fff; padding:8px; border:1px solid #d0d0d0; width: 245px; margin-top:3px; line-height:16px; }
.featured a { display:block; color:#006699;}
.featured a:hover { text-decoration:underline;}
.description { font-family:"Georgia", Times, serif; display:block; margin: 10px 0 10px 0; color:#444;}
.itembutton { display:block; float:right; margin-top:10px}
p.additional { margin:0 10px; color:#9c9c9c; font-size:11px; line-height:12px; border-top:1px solid #bdbdbd; padding: 10px 10px 30px 45px; background:url(images/umbrella.gif) no-repeat 0 12px;}
p.parked { margin:0 10px; color:#9c9c9c; font-size:11px; line-height:12px; padding: 10px;}
.p2 { padding: 0 0 0 10px; color:#9f9f9f; width:610px}

.textbox { border:1px solid #d0d0d0; margin-bottom:15px; margin-left: 5px;}
.input  { background: url(images/fieldw.gif) #fff top repeat-x; border: thin #b3b3b3 solid; width: 200px; height: 16px; vertical-align: middle; font-family: arial; font-size:12px; }
.input2  { background: url(images/fieldw.gif) #fff top repeat-x; border: thin #b3b3b3 solid; overflow: auto; font-family: arial; font-size:12px; }
.sub { float: right; font-size:11px }
.subheader { display:block; font-size: 12px; margin: 0 0 10px 10px; color:#888;}
.right { display:block; float:right; margin: 0 10px 10px 10px; color:#888;}

#text { width: 580px; float:left; }
#sidebar { background:url(images/sidebar_bckg.gif) no-repeat #fff; float:right; width:250px; height:410px; padding: 0px 25px 0 25px;}
#sidebar h1 { margin:0; padding:10px 0 0 0; font-size:16pt; color:#999; font-weight:normal;}
#sidebar h1.homeside {padding: 30px 0 10px 7px}
#sidebar ul { margin:6px;}

#showhide a{color:#fff; background:#999;}

#footer {background:url(images/footer.jpg) repeat-x #0f0c0d; bottom:0; width:100%; height:310px; clear:both; }
#footer h1{ margin-top: 20px; font-size:14pt; }
#footer h2{ margin: 15px 0 0 10px; font-size:1.1em; padding-top:5px; color:#97b3bd;}
#footer p{ color:#d8d8d8; margin: 0 0 3px 0; }
#footer a{ color:#97b3bd;}
#footerwrap { width: 950px; margin: 0 auto;}
#subfooter { width: 950px; float: right; text-align:center; border-top: 2px #2b2b2b dotted; padding: 10px 0 10px 0; color: gray}
.footerbox { width: 280px; margin-right:40px; float: left; color:#d8d8d8;}
.footerboxright { width: 265px; margin-right:20px; float: right; color:#d8d8d8;}
.footertable {border-collapse: collapse; margin:10px 0 15px 10px}
.footerfield {background: url(images/field.gif) #4d4d4c top repeat-x; border: thin #343434 solid; color:#d8d8d8; font-family: arial; font-size:12px; }
.footertextarea {background: url(images/field.gif) #4d4d4c top repeat-x; border: thin #343434 solid; color:#d8d8d8;overflow: auto; font-family: arial; font-size:12px; }
.footerdotted {border-top: 2px #2b2b2b dotted;}

.clear { clear: both;  height: 0;  visibility: hidden;  display: block;  }  
p.contact { color:#ececec; padding: 0 0 0 70px; background:url(images/java.png) no-repeat;}
p.secure  { color:#ececec; padding: 5px 0 0 65px; background:url(images/lock.png) no-repeat; font-size: 11px; line-height: 12px; height: 60px;}
.socialicon { padding-top: 7px; }
.socialicon:hover { background-color:#FFFFFF; padding:0 0 3px 0; }
.dotted {border-top: 2px #dcdcdc dotted; padding: 15px 0 15px 0;}
.dotted2 {border-top: 2px #dcdcdc dotted; padding: 5px 0 2px 0; margin-top:5px}
.homepic {margin-top:15px;}
.leftspace {margin-left: 10px;}
.friends {background: url("images/transparent.png") repeat; padding: 8px;border: 1px solid #d0d0d0;width: 235px;margin-top: 3px; font-size: 12px;line-height:16px;
text-align: center;}

 /******* THUMBNAILS *******/ 
#otto{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_otto.jpg") no-repeat 0 0;}
#otto:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#art{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_art.jpg") no-repeat 0 0;}
#art:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#dmo{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_dmo.jpg") no-repeat 0 0;}
#dmo:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#drg{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_drg.jpg") no-repeat 0 0;}
#drg:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#cor{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_cor.jpg") no-repeat 0 0;}
#cor:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#casa{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_casa.jpg") no-repeat 0 0;}
#casa:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#shi{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_shi.jpg") no-repeat 0 0;}
#shi:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#te{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_te.jpg") no-repeat 0 0;}
#te:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#ysw{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_ysw.jpg") no-repeat 0 0;}
#ysw:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#tpj{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_tpj.jpg") no-repeat 0 0;}
#tpj:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#tal{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_tal.jpg") no-repeat 0 0;}
#tal:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#stc{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_stc.jpg") no-repeat 0 0;}
#stc:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#tri{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_tri.jpg") no-repeat 0 0;}
#tri:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#gs{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_gs.jpg") no-repeat 0 0;}
#gs:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#bct{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_bct.jpg") no-repeat 0 0;}
#bct:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#dnw{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_dnw.jpg") no-repeat 0 0;}
#dnw:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#fik{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_fik.jpg") no-repeat 0 0;}
#fik:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#trid{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_trid.jpg") no-repeat 0 0;}
#trid:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#cog{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_cog.jpg") no-repeat 0 0;}
#cog:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#ukr{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_ukr.jpg") no-repeat 0 0;}
#ukr:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
#misc{display:block; width:230px; margin-left:10px; height:173px; border:1px solid #999; background: url("images/thumb/thumb_misc.jpg") no-repeat 0 0;}
#misc:hover{ background-position: 0 -173px; border:1px solid #6ea3cd;}
.border {border:1px solid #999;}

#nomove { vertical-align:bottom; position:fixed; left:85%; top:90%; }

 /******* BOX MENU *******/  
 #container{  width: 610px;  float: left; padding-top: 0px;margin-right:20px;margin-left:5px;}  
 #container ul{  list-style: none;  list-style-position: outside; }  
 #container ul.menu li{  float: left;  margin-right: 5px;  margin-bottom: -1px; }  
 #container ul.menu li{  font-weight: 700;  display: block;  font-size: 12pt;padding: 5px 10px 5px 10px;  background: #f6f6f6;  margin-bottom: -1px;  
 border: 1px solid #d0ccc9;  border-width: 1px 1px 1px 1px;  position: relative;  color: #608F9F;  cursor: pointer;  }  
 #container ul.menu li:hover{background: #fcfcfc;}
 #container ul.menu li.active{ background: #fff; border-bottom: 1px solid #fff;  color: #898989;  }  

 /******* CONTENT *******/  
 .content{  margin: 0pt auto;  background: #fff; border: 1px solid #d0ccc9;  text-align: left;  padding: 10px;  height: 300px;
 padding-bottom: 5px;  font-size:18px; }  
 .content h1{  line-height: 1em;  vertical-align: middle;  height: 30px;  padding: 15px 10px 0px 10px;  font-size: 28px;  }  
 .content p{  margin-left:210px; padding-top:10px; line-height: 17pt;  color: #555; }  
 .content.news{display: block;}  
 .content.tutorials{display: none}  
 .content.links{display: none;}  
 .content.links a{color: #5f95ef;}  
 .content.marketing{display: none;}