/********************************************
   AUTHOR:          http://www.ambitiouswebdesign.com 
   WEBSITE:     http://www.goldies.com/
   TEMPLATE NAME:  GOLDIES
   DATE:           DEC-30th-2008
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 
 
* { margin: 0; padding: 0px; }

html, body { 
margin: 0;
padding: 0px;
height: 100%; 
background: #000 url(/images/bg.gif) repeat-x;
} 


/* ----------Centered Container Or the Layout--------------------- */

#container { 
min-height: 100%; 
height: auto !important; 
height: 100%; 
margin: 0 auto -4em; /* make sure this matches in the body footer DIV */
width: 951px;
background: url(/images/containerbg.gif) repeat-y;

} 


/* --------------LABELS BUTTONS & FORMS-----------*/
 
label {
font: 10pt 'century gothic', Sans-Serif;
color: #777;
}
 
.form, textarea, input {
font: 10pt 'century gothic', Sans-Serif;
color: #000;
padding: 2px;
margin-bottom: 0px;
}
 
.button {
border: 0px
}

.formtable{
width: 655px;
border: #87401a 1px solid;
}

.formtable td{
padding: 5px;
}


/* --------------HEADER------------- */

#header {
height: 201px;
width: 373px;
margin: 0 auto;
}


/* --------------LOGO IN HEADER *always use this*------------- */

.logolink, #swap {
height: 161px;
width: 373px;
}

.logolink {
background-image: url('/images/logo.gif');
background-repeat: no-repeat;
}
 
.logolink a {   }
 
#swap {
background-image: url(/images/logo.gif);  
}
 
.rollover { display: block; } /* Allow setting widths and heights */
.rollover img { width: 100%; height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */


/* --------------MAIN CONTENT, LEFT NAVIGATION----------------*/

#main {
min-height: 585px; 
width: 933px;
height: auto !important; 
height: 100%; 
background: #0d0401 url(/images/mainbg.jpg) repeat-x; /* Main DIV Background Img */
margin: 0px 0px 0px 9px;

}


#main .content {
padding: 18px 10px 0px 0px;
margin: 0px 0px 0px 0px;
min-height: 100%; 
height: auto; 
height: 100%;
color: #e5c194;
font: 10pt 'century gothic', Sans-Serif;
width: 684px;
float: right;
}

#main .content a{
color: #d80001;
font: 10pt 'century gothic', Sans-Serif;
text-decoration: underline;
}

.bottom {
background: url(/images/mainbottom.gif) no-repeat;
height: 9px;
width: 951px;
margin: 0 auto;
}

.pageheader{
height: 98px; 
width: 684px;
}

#navleft  {
float: left;
width: 217px;
margin: 18px 0px 10px 10px;
padding: 0px;
background-image:url('/images/navbg.gif');
height: auto !important; 
height: 100%;
min-height: 600px;
}

#navleft .navtop {
width: 217px;
height: 9px;
background-image:url('/images/navtop.gif');
}

#navleft .navbottom {
width: 217px;
height: 219px;
}

#navleft .navimages {
width: 217px;
}

#navleft .navimages a { float: left; }

#swap01 {background-image: url(/images/home2.gif);  width: 217px;  height: 47px; }
#swap02 { background-image: url(/images/menu2.gif); width: 217px;  height: 47px; }
#swap03 { background-image: url(/images/locations2.gif); width: 217px;  height: 47px; }
#swap04 { background-image: url(/images/awards2.gif); width: 217px;  height: 47px; }
#swap05 { background-image: url(/images/catering2.gif); width: 217px;  height: 47px; }
#swap06 { background-image: url(/images/jobopportunities2.gif); width: 217px;  height: 47px; }
#swap07 { background-image: url(/images/comments2.gif); width: 217px;  height: 47px; }

.rollover { display: block; } /* Allow setting widths and heights */
.rollover img { height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */


/* --------------FOOTER------------- */

.clear {
clear: both;
}

#footer, .push { 
clear: both;
height: 4em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer {
background-color: #000;
height: auto;
text-align: center;
}

#footer .content { 
margin: 0 auto; 
position: relative; 
color: #a60309;
font: 10pt Arial, 'Trebuchet MS', Sans-Serif;
}

/* --------------FOOTER LINKS------------- */

#footer ul {
padding: 5px;
}

#footer .links ul {
margin: 0px;
padding: 0px;
}

#footer .links li {
display: inline;
list-style-type: none;
}

#footer .links li a {
color: #a60309;
text-decoration: underline;
padding: 0px;
font: 8pt 'century gothic', Sans-Serif;
line-height: 15px;
}


#footer .asc ul {
margin: 0px;
padding: 0px;
}

#footer .asc li {
display: block;
list-style-type: none;
}

#footer .asc li a {
color: #874d30;
text-decoration: none;
padding: 0px;
font: 8pt 'century gothic', Sans-Serif;
line-height: 15px;
}

/* --------------TEXT----------------*/

#text{
color: #e5c194;
font: 10pt 'century gothic', Sans-Serif;
padding: 25px 15px 15px 15px;
float: left;
line-height: 20px;
}

#text ul.bullet{
padding: 15px;
}

#text .bullet li{
background: url(/images/bullet.gif) no-repeat;
padding-left: 20px;
list-style-type: none;
display: block;
padding-top: 0px;
padding-bottom: 7px;
color: #e5c194;
font: bold 10pt 'century gothic', Sans-Serif;
}

#text .bullet li a{
color: #e5c194;
text-decoration: underline;
font: bold 10pt 'century gothic', Sans-Serif;
padding-top: 0px;
padding-bottom: 7px;
}

#text .bullet li a:hover{ /*hover state CSS*/
color: #e5c194;
}

#text ul.arrow{
padding: 5px 0px 0px 0px;
}

#text .arrow li{
background: url(/images/arrowgold.gif) no-repeat;
padding: 0px 10px 7px 12px;
list-style-type: none;
display: inline;
color: #ffc423;
font: bold 8pt 'century gothic', Sans-Serif;
}

#text .arrow li a{
color: #ffc423;
text-decoration: underline;
font: bold 8pt 'century gothic', Sans-Serif;
padding: 0px 0px 7px 0px;
}

#text .arrow li a:hover{ /*hover state CSS*/
color: #ca9607;
}


.picright {
float: right;
width: 325px;
margin: 0px 15px 0px 25px;
border: #000 1px solid;
}

#text .left{
float: left;
width: 300px;
margin: 0px 15px 0px 0px;
}

#text .right{
float: right;
width: 300px;
margin: 0px 15px 0px 0px;
}

#text h1{
color: #ffc423;
font: bold 14pt 'century gothic', Sans-Serif;
}


.redheader {
color: #c70508;
font: bold 12pt 'century gothic', Sans-Serif;
line-height: 15px;
}

.gold {
color: #e4a808;
font: bold 10pt 'century gothic', Sans-Serif;
}

.note {
color: #874d30;
font: 8pt 'century gothic', Sans-Serif;
font-style:italic;
}

.headercell{
background-color: #c70508;
font: bold 12pt 'century gothic', Sans-Serif;
}


/* --------------HOMEPAGE----------------*/

.hometext{
width: 350px;
color: #e5c194;
font: 10pt 'century gothic', Sans-Serif;
padding: 25px 15px 15px 15px;
float: left;
line-height: 24px;
}

.homepic{
height: 217px; 
width: 684px;
background-image: url(/images/homepic.jpg);
}


/* --------------Locations----------------*/
.location {
margin-top: 20px;

}

.location p{
color: #c70508;
font: bold 12pt 'century gothic', Sans-Serif;
line-height: 15px;
margin-top: 20px;
}


/* --------------MAIN THREE BLOCKS----------------*/

#threeblocks {
width: 262px;
float: right;
}
 
#locations {
float: right;
width: 262px;
height: 118px;
padding: 0px;
background: url(/images/locationsbox.jpg) no-repeat; 
}

#locations a{
float: right;
width: 262px;
height: 118px;
}

#locations p{
float: right;
width: 262px;
height: 118px;
}

#menu {
float: right;
width: 262px;
height: 118px;
padding: 0px;
background: url(/images/menubox.jpg) no-repeat; 
}

#menu a{
float: right;
width: 262px;
height: 118px;
}

#menu p{
float: right;
width: 262px;
height: 118px;
}


#employment {
float: right;
width: 262px;
height: 118px;
padding: 0px;
background: url(/images/employmentbox.jpg) no-repeat; 
}

#employment a{
float: right;
width: 262px;
height: 118px;
}

#employment p{
float: right;
width: 262px;
height: 118px;
}

/* --------------FRANCHISE PAGE----------------*/


.franchisetable{
width: 660px;
}

.franchisetable td{
padding: 5px;
border: #87401a 1px solid;
}

/* --------------AWARDS PAGE----------------*/

#awards{
text-align: center;
margin: 0 auto;
}

#awards .award {
width: 600px;
text-align: center;
margin: 0px 0px 6px 0px;
}

#awards .award img{
border: 1px solid #d0a058;
}



/* --------------PAGEHEADERS----------------*/

#pageheader{
height: 98px; 
width: 684px;
background: url(/images/pageheaderbg.jpg) no-repeat; 
}

#pageheadermenu{
height: 98px; 
width: 684px;
background: url(/images/headerMenu.jpg) no-repeat; 
}

#pageheaderlocations{
height: 98px; 
width: 684px;
background: url(/images/headerlocations.jpg) no-repeat; 
}

#pageheadercatering{
height: 98px; 
width: 684px;
background: url(/images/headercatering.jpg) no-repeat; 
}

#pageheaderawards{
height: 98px; 
width: 684px;
background: url(/images/headerawards.jpg) no-repeat; 
}

#pageheadercontact{
height: 98px; 
width: 684px;
background: url(/images/headercontact.jpg) no-repeat; 
}

#pageheaderjobs{
height: 98px; 
width: 684px;
background: url(/images/headerjobs.jpg) no-repeat; 
}

#pageheaderfranchise{
height: 98px; 
width: 684px;
background: url(/images/headerfranchising.jpg) no-repeat; 
}







/* ----- Customer Cart TABLES ---------- */
#awscustomertables table{margin: 1em; border-collapse: collapse;}
#awscustomertables td{ padding: .3em; border: 1px #F2F2F2 solid; }
#awscustomertables th{ padding: .3em; border: 1px #F2F2F2 solid; background: #F2F2F2; }