/**
 * New Pictographics website
 * @author      Roy D. <roy@pictographics.com>
 * @copyright   Copyright (c) 2009+ Pictographics Ltd
 * @since       Oct 5, 2009
 */
/*-------- BEGIN GENERAL --------*/
/*html { height: 100% ; }*/
* { margin: 0 ; padding: 0 ; }


body {
    background: #e9e8e9 url(images/bg.jpg) center repeat-y ;
}


#wrapper {
    width: 900px ;
    min-height: 100% ;
    height: 100% ;
    margin: 0 auto ;
    font: 0.9em/1.3em Lucida Grande, Verdana, sans-serif ;
    background: #f4f5f5 ;
    border: 2px solid orange ;
    border-top: none !important ;
    border-bottom: none ;
}
/*------------- END GENERAL
 BEGIN HEADER ---------------- */
#header {
    width: 900px ;
    height: 96px ;
    padding-top: 20px ;
    background: #f4f5f5 url(images/logo.jpg) 0 20px no-repeat ;
    clear: both; 
}

#pictotext {
    width: 425px ;
    float:left ; 
    text-transform: uppercase ;
}

#pictotext h1 {
  display: none ;
}

#pictotext h2 {
    position: relative ;
    font-size: 14px ;
    top: 10px ;
    left: 47px ;
    font-weight: normal ;
    width: 350px ;
}

#pictotext img {
    position: relative ;
    left: 47px ;
    border: 0 ;
}
/*-------------   MENU   ---------- */

#topmenu {
  float: left ;
  width: 475px;
  height: 90px;
  background: url(images/menu.jpg) 0 0 no-repeat ;
  position: relative ;
}

#topmenu li {margin: 0; padding: 0; list-style: none; position: absolute; bottom: 0px ; }

#topmenu li, #topmenu a {height: 75px; display: block; }
#topmenu a { text-indent: -9999em; }

/* top menu anchors */
#web {left: 0px; width: 75px;}
#printer {left: 75px; width: 75px;}
#it {left: 150px; width: 75px;}
#media {left: 225px; width: 75px;}
#chart {left: 300px; width: 75px;}
#book {left: 375px; width: 75px;}

#web a:hover, #printer a:hover, #it a:hover, #media a:hover, #chart a:hover, #book a:hover {
    background: transparent url(images/hover.png) bottom center no-repeat;
}

/*-------------   INFOBOX   ---------- */

#infobox {
    float: left ;
    background: #ff9900 ;
    height: 40px ;
    width: 100% ; 
    clear: both !important ;
}

#infoboxtext {
  padding: 3px 20px ;
  height: 32px !important ;
		clear:both !important;
}

/* for the default navigation - added Dec 2, 2009 */

ul#default { list-style: none; }
ul#default li { display: inline; padding: 0 10px ;}
ul#default li.first { padding-left: 0 ; }
ul#default a { font-size: 90%; text-decoration: none ; color: #333; font-weight: bold ;}
ul#default a:hover { text-decoration: underline ; }

/* ------------ END HEADER 
  BEGIN CONTENT -------------------- */

/*-------------   SIDEBAR MENU   ---------- */

#sidebar {
    float: left ;
    width: 230px ;
    border: 0px ;
    margin-left: 10px ;
    border-left: 0px solid #999 ;
}


#sidebar ul#contentmenu li {
    list-style-type: none ;
    padding-left: 10px ;
    line-height: 25px ;
}

#sidebar ul#contentmenu li a {
    text-decoration: none ;
    color: #000 ;
    text-transform: capitalize ;
    letter-spacing: 0.1px ;
}

#sidebar ul#contentmenu li a.category {
    color: black ;
    font-weight: bold ;
}

#sidebar ul#contentmenu li a:hover, #sidebar ul#contentmenu li a.active {
    color: #06f ;
}

ul#contentmenu li a.active {
    font-weight: bold ;
}

ul.submenu {
    line-height: 25px ;
}

/*-------------   CONTENT-GENERAL   ---------- */

.contentbox {
    clear: both !important;
    float: left ;
    margin: 15px 15px 0 15px ;
    background: #fff ;
}

.content-top {
    float:left ;
    height: 27px ;
    width: 870px;
    background: url(images/top.png) no-repeat ;
}

.content-bg {
  width: 870px ;
  float: left ;
  background: url(images/content.png) repeat-y;
}

.content {
    padding: 0 10px 10px 10px ;
    float: left; 
    width: 600px ;
    text-align: justify ;
}

.content h1.title {
    margin: 0 0 15px 0 ;
    font-size: 145% ;
    text-align: center ;
}

.content p {
    line-height: 1.3em ;
    margin-bottom: 10px ;
}

.content img {
    margin: 0 15px ;
    border: 0 ;
}

#portfolio img { margin: 0 ;}

.content a {
    text-decoration: none ;
    color: #06f ;
    font-weight: bold ;
}

.content a:hover {
    text-decoration: underline ;
}

.content-bottom {
    clear: both ;
    float: left ;
    height: 40px ;
    width: 870px ;
    background: url(images/bottom.png) no-repeat;
}

.content ul li {
  margin-left: 15px ;
}

.content ul {
  margin-bottom: 15px ;
}

td.col_sep {
  background: url(images/col_bg.jpg) center repeat-y !important;
}

/*-------------   HOME   ---------- */

.home {
    width: 850px ;
}

#portfoliotext {
    float: left ;
    width: 275px ;
    margin-right: 25px ;
}

#portfolio {
    float: left ;
    width: 600px ;
    clear: right ;
}


/* extra divs in the content area */
#extra_1 { clear: both; height: 1% ; }

/*----------END CONTENT 
- BEGIN FOOTER ------------*/

#footer {
    clear: both;
    width: 900px ;
    margin: 0 auto ;
    padding: 20px 0 ;
    text-align: center ;
    font-size: 80% ;
    color: #000 ;
}

#footer a {
    color: #333 ;
    text-decoration: none ;
}

#footer a:hover {
    color: #06f ;
}

#paypal label { clear:both; float:left; width:100%; padding: 0 0 7px 0; }
#paypal label span { float:left; width:210px; }
#paypal label input { float:left; width:200px; padding:4px; border:1px solid #ccc;}
#paypal label input.error {  border-color:#f00; color:#f00; }
p.error { color: #f00; }