/*  
Style sheet for Bella Design Concepts
Author: Ralph Leonen
Author URI: http://www.ralphworlddesign.com/
*/

/***** reset defaults *****/
body, h1, h2, h3, h4, h5, h6, blockquote, p{
	margin: 0;
	padding: 0;
  }
/***** end reset defaults *****/

html{
  height: 100%;
  }

body{
  background: #262127;
	font-family: Arial,Helvetica,Verdana,Sans-serif;
	font-size: 14px;
	height: 100%;
  text-align: center;  
  }

a:link, a:visited{
	text-decoration: none;
	color: #336699;
  }
a:hover{
  text-decoration: underline;
  }  

#container{
  background-color: #262127;
  min-height: 100%;
  margin: 0 auto;
  padding: 0;
  width: 1022px;
  text-align: left;
  }

/*****  header section *****/
#header{
  border-top: 5px solid #63988e;
  border-bottom: 5px solid #63988e;
  background: transparent url(../images/bellaheader1.jpg) no-repeat top left;
  height: 453px;
  margin: 0;
  padding: 0;
  text-align: left;
  width: 1022px;
  }

#services #header{
  border-top: 5px solid #63988e;
  background: transparent url(../images/guavaheader_services_P_a.jpg) no-repeat top left;
  }  

#about #header{
  border-top: 5px solid #63988e;
  border-bottom: 5px solid #63988e;
  background: transparent url(../images/bellaheader2.jpg) no-repeat top left;
  }   

#portfolio #header{
  border-top: 1px solid #98d88f;
  background: transparent url(../images/guavaheader_faq_P_a.jpg) no-repeat top left;
  }   

#testimonials #header{
  border-top: 1px solid #98d88f;
  background: transparent url(../images/guavaheader_news_P_a.jpg) no-repeat top left;
  }     

#contact #header{
  border-top: 5px solid #63988e;
  background: transparent url(../images/guavaheader_contactus_P_a.jpg) no-repeat top left;
  }   

  #content ul#mainmenu{
    border-top: 3px solid #fff1ce;
    width: 1022px;
   	height: 39px;
  	margin: 0 0 0 0;
  	padding: 0 0 0 0;
  	list-style: none;
  	font: 17px Arial, Helvetica, sans-serif;
  	text-align: right;
    }   

  #content ul#mainmenu li{
  	display: inline;
  	float: right;  
  	height: 39px;
  	margin: 0 0 0 25px;   
  	overflow: visible;    
    }   

  #content ul#mainmenu li a{
    background: transparent;
    color: #b4b08d;
    display: block;
    padding-top: 12px;
    padding-bottom: 11px;
    text-decoration: none;
    }

	#content ul#mainmenu li a#current{
    background: transparent url(../images/circle_bottom.gif) no-repeat top center;	 
    color: #fff1ce;
    display:block;
    }

	#content ul#mainmenu li a#current:hover{
    text-decoration: none;    
    }    
				
	#content ul#mainmenu li a:hover{
  	background: transparent url(../images/circle_bottom.gif) no-repeat top center;
    display: block;
    text-decoration: underline;
    }       
/*****  end header section *****/

/*****  content section  *****/
#content{
  background:#262127;  
  height: 380px;
  margin-top: 0px;
  text-align: left;
  min-height: 380px;
  padding-bottom: 0;
  }

  #content #col1{
    background-color: #262127;
    float: left;
    margin: 14px 0 0 0;
    padding-bottom: 60px;
    width: 677px;
    }

    

   #content #col1 p{
      color: #b4b08d;
      font-size: 14px;
      line-height: 28px;
      margin: 0 26px 16px 36px;
      }      

   #content #col1 p.lead_para{
      font-size: 16px;
      line-height: 38px;
      }

   #content #col1 p.cases{
      color: #b4b08d;
      clear: both;
      font-size: 14px;
      line-height: 28px;
      margin: 0 26px 16px 36px;
      }       

   #content #col1 p.callout{
      color: #5d9632;
      font-size: 28px;
      font-style: italic;
      line-height: 42px;
      margin-top: 42px;
      }  

    #content #col1 p b{
      font-size: 14px;
      }

    #content #col1 h1{
      color: #fff1ce;
      height: 46px;
      line-height: 34px;
      margin: -10px 0 14px 32px; 
      padding-left: 8px;
      padding-bottom: 14px;    
      }   

    #content #col1 h1#header1{
       background: #262127 url(../images/headline1.gif) no-repeat top left;
       text-indent: -9999px;
       }      

    #content #col1 h1#header2{
       background: #262127 url(../images/design_and_project_mgmt.gif) no-repeat top left;
       text-indent: -9999px;
       margin-bottom: 2px;
       }  

    #content #col1 h1#about{
       background: #262127 url(../images/about.gif) no-repeat top left;
       text-indent: -9999px;
       }

    #content #col1 h1#contact{
       background: #262127 url(../images/contact_h1.gif) no-repeat top left;
       text-indent: -9999px;
       }                    

    #content #col1 h1#services{
       background: #262127 url(../images/services.gif) no-repeat top left;
       text-indent: -9999px;
       }  

    #content #col1 h1#case_histories{
       background: #262127 url(../images/cases_h1.gif) no-repeat top left;
       text-indent: -9999px;
       } 

    #content #col1 h1#owners_rep{
       background: #262127 url(../images/owners_rep.gif) no-repeat top left;
       text-indent: -9999px;
       }  
       
    #content #col1 h1#vendor{
       background: #262127 url(../images/vendor_procurement.gif) no-repeat top left;
       text-indent: -9999px;
       }          

    #content #col1 h1#site_selection{
       background: #262127 url(../images/site_selection.gif) no-repeat top left;
       text-indent: -9999px;
       } 

    #content #col1 h1#project_mgmt{
       background: #262127 url(../images/project_mgmt.gif) no-repeat top left;
       text-indent: -9999px;
       }
       
    #content #col1 h1#brand_mgmt{
       background: #262127 url(../images/design_and_brand_mgmt.gif) no-repeat top left;
       text-indent: -9999px;
       }
       
    #content #col1 h1#planning{
       background: #262127 url(../images/master_planning.gif) no-repeat top left;
       text-indent: -9999px;
       }

    #content #col1 h1#construction{
       background: #262127 url(../images/construction_admin.gif) no-repeat top left;
       text-indent: -9999px;
       }

    #content #col1 h1#architecture{
       background: #262127 url(../images/architecture.gif) no-repeat top left;
       text-indent: -9999px;
       }

    #contact #content #col1 h1{
      font-size: 22px;
      line-height: 30px;
      }       

    #staffing #content #col1 h1{
      font-size: 22px;
      }       

    #content #col1 h2, h3{
      color: #fff1ce;
      font-size: 21px;
      font-weight: normal;
      line-height: 22px;
      margin: 20px 0 0 28px; 
      padding-left: 8px;
      padding-bottom: 6px; 
      width: 322px;    
      }         

    #content #col1 h3{
      margin: -8px 0 8px 28px;
      font-size: 18px;
      }       
    
    #content #col1 h3.cases{
      clear: both;
      margin: 8px 0 8px 28px;
      font-size: 18px;
      }        

    #content #col1 h4{
      font-size: 18px;
      line-height: 22px;
      margin: 8px 20px 0 64px;      
      }    

    #content #col1 b{
      font-size: 12px;
      }     

   #content #col1 img.img_left{
      border: 4px solid #b4b08d;
      float: left;
      margin: 9px 8px 4px 36px;
      padding: 3px;
      }

   #content #col1 img.img_right{
      border: 4px solid #b4b08d;
      float: right;
      margin: 9px 14px 14px 10px;
      padding: 3px;
      }      

   #content #col1 img.img_std{
      border: 4px solid #b4b08d;
      float: left;
      margin: 9px 2px 18px 36px;
      padding: 3px;
      }

   #content #col1 sup{
      font-size: 10px;
      }   

   #content #col1 a.to_top{
    margin-left: 8px;
    }

  #content #col1 ul#services{
    list-style: none;
    margin: 0 0 0 30px;
    }

  #content #col1 ul#services li{
    line-height: 24px;
    color: #b4b18d;
    margin-bottom: 16px;
    }

   #content #col1 ul#services li a{
    color: #d6d39f;
    line-height: 24px;    
    }        

/*****  column 2  *****/ 

#contact #content #col2 h2{
  margin: 16px 8px 6px 8px;
  } 

 #content #col2{
    background-color: #262127;
    color: #b4b08d;
    float: left;
    margin: 34px 0 0 90px;
    width: 232px;
    }

    #content #col2 h1, h2{
      color: #fff1ce;
      font-size: 23px;
      font-weight: normal;
      height: 44px;
      line-height: 22px;
      margin: 14px 0 14px 0; 
      padding-left: 8px;
      padding-bottom: 14px; 
      width: 220px;    
      }      
      
      #content #col2 h2#contact_us{
        background: #262127 url(../images/contact_us.gif) no-repeat top left;
        text-indent: -9999px;
        }

      #content #col2 h2#locations{
        background: #262127 url(../images/locations.gif) no-repeat top left;
        text-indent: -9999px;
        }

      #content #col2 h2#cases_h2{
        background: #262127 url(../images/cases_h2.gif) no-repeat top left;
        height: 48px;
        text-indent: -9999px;
        }

      #content #col2 h2#services_h2{
        background: #262127 url(../images/services_h2.gif) no-repeat top left;
        text-indent: -9999px;
        margin: 0 0 16px 0;
        }

      #content #col2 h2#featured{
        background: #262127 url(../images/featured.gif) no-repeat top left;
        text-indent: -9999px;
        }        

    #content #col2 h2{
      border-bottom: none;
      font-size: 20px;
      padding: 0;
      margin: 30px 0 2px 8px;

      }
    
     #content #col2 p{
        font-size: 14px;
        line-height: 24px;
        margin: 6px 0 0 12px;
        }

     #content #col2 p a{
        color: #b4b08d;
        text-decoration: underline;
        }

   #content #col2 img.img_right{
      border 3px solid #b4b08d;
      float: right;
      margin: 10px 0 0 4px;
      }        

  #content #col2 img.img_left{
    border: 2px solid #b4b08d;  
    float: left;
    margin: 10px 8px -2px 10px;
    padding: 2px;
    }  

   #content #col2 ul#sidenav{
    margin: 2px 0 2px 6px;    
    }

   #content #col2 ul#sidenav li{
    border-bottom: 1px dashed #484349;   
    font-size: 12px;
    margin: 2px 4px 0 -24px;
    padding-bottom: 2px;
    list-style: circle;
    }



   #content #col2 ul#sidenav li a{
    color: #b4b08d;
    display: block;
    line-height: 20px;
    margin: 0;
    width: 100%;
    text-decoration: none;
    }    

   

   #content #col2 ul#sidenav li a:hover{
    background-color: #b4b08d;
    color: #262127;
    }
    
    #content #col2 ul#sidenav li a#sidecurrent{
    background-color: #b4b08d;
    color: #262127;    
    }

   #content #col2 img{
    border-style: none;
    }    

/***** content footer section *****/      

        

#content #footer{
  background-color: #63988e;
  border-top: 3px solid #b4b08d;
  color: #262127;
  clear: both;
  margin-top: 80px;
  width: 1022px;
  }

    

  #content #footer p#navigation, p#navigation a{
    font-size: 12px;
    line-height: 16px;
    margin: 170px 0 4px 0;
    padding-top: 170px;
    text-align: center;
    }

  #content #footer p.legal{
    color: #000;
    font-size: 10px;
    line-height: 14px;
    margin: 44px 36px 0 36px;
    padding-bottom: 40px;
    text-align: left;
    }       

  #content #footer p#credits{
    font-size: 11px;
    line-height: 18px;
    margin: 10px 36px 0 36px;
    padding-bottom: 10px;
    text-align: right;
    }   

  #content #footer table{
    margin: 2px 0 12px 36px;
    }
  
  #content #footer tr.header a{
    color: #262127;
    font-weight: bold;
    text-decoration: none;
    border-bottom: 1px dashed #262127;
    }

  #content #footer td{
    padding: 5px 38px 5px 0px;
    }

  #content #footer tr.detail a{
    color: #262127;
    font-size: 12px;
    text-decoration: none;
    border-bottom: 1px dashed #262127;
    }

/***** end content footer section *****/    

/*****  end content section  *****/



/***** form section *****/


#contact form{
  color: #b4b08d;
	display: block;
	float: left;	
	margin: 10px 0 0px 0;
	padding: 0;
	text-align: left;
	width: 540px;}
	
#contact label{
  font-weight: bold;
  margin: 0 0 0 36px;
  }
	
	#contact fieldset{
		border: none;
		margin:0;
		padding:0;}

#contact input, textarea{
	display: block;
	margin: 6px 0 26px 36px;
	padding: 0;
	width: 530px;}
	
#contact .submit{
	margin: 20px 0 0 36px;
	width: 100px;}

/***** end form section *****/









	


