/* ----------------------------------------------------------------
 * FILE: style.css
 * ----------------------------------------------------------------
 * Created: 05-01-09 (dd-mm-yy)
 * Template: Clean Palette
 * Theme: default
 *
 * ----------------------------------------------------------------
 * TOC:
 * ----------------------------------------------------------------
 * - GLOBAL
 *   - HEADERS
 *   - TEXT
 *   - LINKS
 *   - IMAGES
 *   - LISTS
 *   - TABLES
 *   - FORMS
 *   - CLASSES 
 *     - IMAGES
 *     - LINKS
 *     - ICON-LIST
 * - SKIP-LINK
 * - CONTAINER
 * - HEADER
 *   - LOGO
 *   - NAVIGATION
 *   - CONTACT FORM
 * - CONTENT
 *   - BREADCRUMB
 *   - CLASSES
 *     - INTRO
 *     - FRAME
 * - FOOTER
 * ---------------------------------------------------------------- 
*/

/* ---------------------------------------------------------------- 
 * GLOBAL
 * ---------------------------------------------------------------- 
*/ 
body {
background: #767474 url(img/bg.jpg) repeat-x left 30px;
color: #777;}	

/* ---------------------------------------------------------------- 
 * GLOBAL > HEADERS
 * ---------------------------------------------------------------- 
*/ 
h1, h2, h3, h4, h5, h6 { 
color: #CC3366;}

/* ---------------------------------------------------------------- 
 * GLOBAL > TEXT
 * ---------------------------------------------------------------- 
*/ 
acronym { 
cursor: help;
border-bottom: 1px dotted #ddd;}

pre, code { 
border-left: 3px solid #ccc; 
background: #eee;}  

pre code { 
border: none;}

blockquote {
background: #eee url(../../../img/quote-left.png) no-repeat 15px 15px !important;}

blockquote > div {
background: url(../../../img/quote-right.png) no-repeat right bottom !important;}  

.quote-author {
background: #fff url(../../../img/quote-arrow.png) no-repeat 40px top;}

/* ---------------------------------------------------------------- 
 * GLOBAL > LINKS
 * ---------------------------------------------------------------- 
*/ 
a { 
color: #CC3366;}

a:hover { 
color: #333;}

a.btn {
background: #CC3366 url(img/button-bg.png) repeat-x;
color: #fff;}

a.btn:hover {
background-image: none;
color: #fff;}    

/* ---------------------------------------------------------------- 
 * GLOBAL > IMAGES
 * ---------------------------------------------------------------- 
*/ 
img { 
background-color: #FFF;
border: 0;}

a:hover img { 
border-color: #bbb;}

/* ---------------------------------------------------------------- 
 * GLOBAL > LISTS
 * ---------------------------------------------------------------- 
*/ 
ul { 
list-style-type: disc;}

dl dt, li { 
color: #000;}

li p,
li span { 
color: #777;}	

/* ---------------------------------------------------------------- 
 * GLOBAL > TABLES
 * ---------------------------------------------------------------- 
*/ 
table thead th { 
background: url(img/bg.jpg) repeat-x; 
color: #fff;}

table tbody tr th,
table tbody tr td {
border-bottom: 1px solid #ddd;}

table tbody tr.alt {
background-color: #eee;}

table tfoot tr th,
table tfoot tr td { 
background-color: #ddd;}

/* ---------------------------------------------------------------- 
 * GLOBAL > FORMS
 * ---------------------------------------------------------------- 
*/ 
form fieldset { 
border: 1px solid #eee;}

form fieldset label { 
cursor: pointer;}	

form fieldset input,
form fieldset select,
form fieldset textarea { 
background-color: #eee;
border: 1px solid #ddd;
border-width: 0 1px 1px 0;
color: #666;}

form fieldset fieldset {     
border: 0;}

form fieldset fieldset label {     
color: #666;}

form fieldset input[type="radio"],    
form fieldset input[type="checkbox"] { 
border: 0; 
background-color: transparent;}        

form fieldset button { 
background: #f60 url(img/button-bg.png) repeat-x;
border: 0;
cursor: pointer;
color: #fff;}   

/* ---------------------------------------------------------------- 
 * GLOBAL > CLASSES
 * ---------------------------------------------------------------- 
*/
.hr-top {
border-top: 1px solid #eee;}

.hr-bottom {
border-bottom: 1px solid #eee;}

.hr-right {
border-right: 1px solid #eee;}

.hr-left {
border-left: 1px solid #eee;}   

.icon-design {
background: url(../../../img/icon/golden_offer.png) no-repeat left;}    

.icon-dev {
background: url(../../../img/icon/bag_black.png) no-repeat left;}  

/* ---------------------------------------------------------------- 
 * GLOBAL > CLASSES > IMAGES
 * ---------------------------------------------------------------- 
*/
.images { 
list-style-type: none;}
	
/* ---------------------------------------------------------------- 
 * GLOBAL > CLASSES > LINKS
 * ---------------------------------------------------------------- 
*/ 
.links { 
list-style-type: none;}

.links li { 
border-bottom: 1px solid #ddd;}

.links li.on a { 
background-color: #eee;
color: #333;
text-decoration: none;}

/* ---------------------------------------------------------------- 
 * GLOBAL > CLASSES > ICON-LIST
 * ---------------------------------------------------------------- 
*/        
ul.icon-list li {
color: #000;
background: url(../../../img/icon/settings.png) no-repeat left top;} 

/* ---------------------------------------------------------------- 
 * SKIP-LINK
 * ---------------------------------------------------------------- 
*/ 
#skip-link {
background-color: #CC0033;
border-bottom: 0;
color: #fff;}

/* ---------------------------------------------------------------- 
 * HEADER
 * ---------------------------------------------------------------- 
*/      
#header { 
background: url(../../../img/content-shadow.png) no-repeat center bottom;}

#header > div {
background-color: #fff;}

/* ---------------------------------------------------------------- 
 * HEADER > LOGO
 * ---------------------------------------------------------------- 
*/
#header a.logo {
color: #666;}

#header a.logo span {
color: #906;}

#header img {   
border: 0;
background-color:#FFFFFF;
margin-top: 2px;
}

/* ---------------------------------------------------------------- 
 * HEADER > NAVIGATION
 * ---------------------------------------------------------------- 
*/    
#header ul li a,
#header ul li.on a:hover {
color: #000;
}

#header ul li a:hover {
color: #CC3366;
text-decoration:overline;}

#header ul li.on a {
background-color: #CC3366;
color:#fff;
border: 1px solid #ddd;
border-width: 0 1px;}

/* ---------------------------------------------------------------- 
 * INTRO
 * ---------------------------------------------------------------- 
*/
#intro {
background: transparent;}

#intro h1 {
color: #fff;
}

/* ---------------------------------------------------------------- 
 * CONTENT
 * ---------------------------------------------------------------- 
*/   
#content { 
background: url(../../../img/content-shadow.png) no-repeat center bottom;}

#content > div {
background-color: #fff;
border-top: 1px solid #fff;}

/* ---------------------------------------------------------------- 
 * CONTENT > BREADCRUMB
 * ---------------------------------------------------------------- 
*/      
#breadcrumb {
background-color: #eee;
border-bottom: 1px solid #ddd;
color: #999;} 

#breadcrumb a {
color: #999;}

#breadcrumb a:hover {
color: #666;}

#breadcrumb strong {
color: #888;}

/* ---------------------------------------------------------------- 
 * CONTENT > LATEST WORK
 * ---------------------------------------------------------------- 
*/  
#content #latest-work .details {
background: url(img/bg.jpg);}

#content #latest-work .details p {
color: #fff;}

/* ---------------------------------------------------------------- 
 * CONTENT > CLASSES > INTRO
 * ---------------------------------------------------------------- 
*/   
#content .intro {
color: #999;}

/* ---------------------------------------------------------------- 
 * CONTENT > CLASSES > FRAME
 * ---------------------------------------------------------------- 
*/ 
#content .frame img {
background: url(../../../img/image-frame.png) no-repeat;
border: 0;}	

/* ---------------------------------------------------------------- 
 * FOOTER
 * ---------------------------------------------------------------- 
*/           
#footer p { 
color: #888;}

#footer p a,
#footer ul li a { 
color: #666;}

#footer p a:hover,
#footer ul li a:hover { 
color: #333;}


  /* ---------------------------------------------------------------- 
 * Twitter
 * ---------------------------------------------------------------- 
*/
#twitter_update_list {
list-style:none;
}

#twitter_div {
background: url(../../../img/Twitter-Black.png) no-repeat left bottom;
}