/***************************************************

    Application CSS
    ===============

    font-family: verdana, arial, helvetica, sans-serif;

    2006-11-30  Dan Bettles     Created
    2006-11-30  Dylan Thomas    Formatted the Floyd site

***************************************************/

/*====== Layout ======*/

body {
    font-family: verdana, arial, helvetica, sans-serif; 
    font-size: 0.8em; 
    color: #FFF7CD;
    text-align: center;  /* IE */
    background-color: #582102;
    margin: 0; 
    padding: 0 0 .6em 0;
}
a,
a:visited  {
    color: #FFF7CD;
}


#centeringContainer {
    width: 937px;
    text-align: left;  /* Reset alignment */
    margin: 0 auto; 
    padding: 0;
}



div#header,
div#mainContent,
div#footer {
    float: left;
    width: 937px;
    margin: 0; padding: 0;
}

h2  {
    font-family: georgia;
    font-variant: small-caps;
    font-size: 170%;
}

div#header {
}

div#footer {
    font-size: 80%;
    text-align: right;
    padding: .5em 0 1em 0;
}

div#footer  p {
    margin: 0; padding: 0;
}

#collection,
#garment,
#location,
#service,
#whoWeAre,
#admin,
#contactUs {
   background-color: #180F00;
   background-image: url(/images/blackBottom.gif);
   background-repeat: no-repeat;
   background-position: bottom left;
   float: left;
   width: 877px;
   margin: 0;
   padding: 20px 30px;
}

h1.siteHeading  {
    width: 922px;
    margin: 0;
    padding: 20px 0 0 15px;
    background-color: #180F00;
    background-image: url(/images/blackTop.gif);
    background-repeat: no-repeat;
    background-position: top left;
    float: left;
}

    /*brown 300px wide panel floated right*/
    #service  .panel,
    #contactUs  .panel {
        float: right;
        width: 300px;
        background: #9E4C14 url(/images/brown300top.gif) no-repeat top left;
        margin: 0 0 0 20px;
        padding: 0;
    }
    #service  .panel  .content,
    #contactUs  .panel  .content {
        float: left; 
        width: 250px;
        background: transparent url(/images/brown300bottom.gif) no-repeat bottom left;
        margin: 0;
        padding: 25px;
    }
    /*end*/

    /*brown 300px wide panel floated left*/
    #whoWeAre .panel  {
        float: left;
        width: 300px;
        background: #9E4C14 url(/images/brown300top.gif) no-repeat top left;
        margin: 0 20px 0 0;
        padding: 0;
    }
    #whoWeAre .panel .content  {
        float: left; 
        width: 250px;
        background: transparent url(/images/brown300bottom.gif) no-repeat bottom left;
        margin: 0;
        padding: 25px;
    }
    /*end*/
/*====== end Layout ======*/

/*====== Main Menu ======*/
ul#mainMenu  {
    font-family: georgia;
    font-variant: small-caps;
    margin: 0;
    padding: 0;
    list-style-type: none;
    text-align: right;
    float: right;
}
ul#mainMenu li  {
    display: inline;
}
ul#mainMenu li a,
ul#mainMenu li a:visited  {
    color: #C8FFFF;
    font-size: 100%;
    text-decoration: none;
    float: left;
    padding: .6em 10px;
    font-weight: bold;
}
ul#mainMenu li a:hover  {
    text-decoration: underline;
}


/*===== end Main Menu ===*/


/*====== HomePage ========*/
#homePage  {
    background-image: url(/images/homeBG.jpg);
    background-repeat: no-repeat;
    background-position: left -50px;
    float: left;
    width: 100%;
}
#homePage #logoArea  {
    width: 480px;
    height: 278px;
    float: left;
}
#homePage #featuredArea  {
    float: left;
    width: 480px;
    height: 150px;
    padding: 5px 0 0 0;
}
#homePage #intro  {
    float: left;
    width: 340px;
    height: 100px;
    padding: 10px 30px 0 80px;    
}
#homePage #buttons  {
    float: left;
    width: 370px;
    height: 160px;
    padding: 0 0 0 75px;
}
#homePage .buttonArea {
   /* border: 1px solid #ff9; */
    background-color: #ff9;
    height: 115px;
    color: #000;
    width:350px;
}
#homePage #featuredLink  {
    float: left;
}
#homePage #featuredArea ul {
    list-style-type: none;
    padding: 5px 0 5px 12px;
    margin: 0;
    float: left;
}
#homePage #featuredArea ul li {
    float: left;
    padding: 20px 12px 0 12px;
}
#homePage #featuredArea .price  {
    font-size: 80%;
}
#homePage #featuredArea #collectionLink  {
    text-align: right;
    width: 320px;
    float: left;
}
#homePage #featuredArea #collectionLink a,
#homePage #featuredArea #collectionLink a:visited  {
    font-size: 90%;
    color: #582102;
    text-decoration: none;
    display: block;
    font-weight: bold;
}
#homePage #featuredArea #collectionLink a:hover  {
    text-decoration: underline;
}

/*====== end HomePage =======*/

/*====== Where to find us =======*/

#location #streetMap   {
    float: left;
    margin: 0;
}
#location #storeFront   {
    margin: 20px 20px 0 0;
}
#location address  {
    font-size: 120%;
    font-weight: bold;
    font-style: normal;
    float: left;
    clear:left;
    width: 260px;
    text-align: centre;
    border: 1px solid #fff;
    margin: 20px 20px 0 0;
    padding: 20px;
}
#location p {
    width: 400px;
    margin: 30px 0 10px 0;
}
#location .mapAddress  {
    display: inline;
    float: right;
    
}
/*==== End Where to find us =====*/

/*====== Who we are =======*/
#whoWeAre .internalShot  {
    float: right;
    margin: 0 0 20px 20px;
}
/*====== End Who we are =======*/


/*==== Garment =====*/

#garment div.image  {
   width: 300px;
   float: left;
}
#garment div.details  {
    float: right;
    width: 335px;
}

#garment  dt,
#garment  dd {
    height: 1%;
    margin: 0 0 1em 0;
    padding: 0;
}

#garment  dt {
    float: left;
    width: 140px;
    font-weight: bold;
    clear: left;
    text-align: right;
    padding-right: 10px;
}

#garment  dd {
    margin-left: 50px;
}

#garment  dt.productCode,
#garment  dd.productCode {
    font-size: 85%;
    font-weight: normal;
    margin-bottom: 2em;
}

#garment  dt.description {
    float: none;
    width: auto;
    display: none;
}

#garment  dd.description {
    margin-left: 0;
    margin-bottom: 2em;
}

#garment span.productCode  {
    font-size: 80%;
    width: 300px;
    display: block;
    text-align: right;
}
#garment a.enquiry,
#garment a.enquiry:visited  {
    color: #FFF7CD;
    text-align: right;
    display: block;
    margin-top: 5em;
}
/*==== End Garment =====*/

/*==== Garment Menu =====*/
#garmentMenu  {
    width: 200px;
    float: left;
    margin: 0 30px 0 0;
}
#garmentMenu ul  {
    padding: 0;
    margin: 0;
    list-style-type: none;
}
#garmentMenu li  {
    margin: 0;
    background-image: url(/images/menuItemL.gif);
    background-repeat: no-repeat;
    background-position: left middle;
    height: 35px;
}
#garmentMenu li a,
#garmentMenu li a:visited  {
    display: block;
    padding: .8em 0 .8em 20px; 
    color: #FFF7CD;
    text-decoration: none;
    width: 178px;
    font-size: 80%;
    font-weight: bold;
    
}
#garmentMenu li.selected a,
#garmentMenu li.selected a:visited  {
    background-image: url(/images/menuItemActiveL.gif);
    background-repeat: no-repeat;
    background-position: left middle;
    color: #C8FFFF;
}

#garmentMenu li a:hover  {
    text-decoration: underline;

}
/*==== End Garment Menu =====*/


/*==== Garment Listing =====*/

#collection #garments {
    float: left;
    width: 640px;
}

/* Override */
#adverts  #collection {
   background-color: transparent none no-repeat bottom left;
   float: none;
   width: auto;
   margin: 0; padding: 0;
}

/* Override */
#adverts #collection #garments {
    float: none;
    width: auto;
}

#collection #garments ul {
    list-style-type: none;
    margin: 0; padding: 0;
}
/* Override */
#adverts  #collection  #garments  ul {
    float: left;
    width: 160px;
    padding-left: 45px;
    padding-right: 45px;
}

#collection #garments li img {
    width: 150px;
    border: 5px solid #fff;
}

#collection #garments li {
    display: inline;
    position: relative;
    float: left;
    width: 200px;
    margin: 5px;
    padding: 0;
}
#adverts  #collection  #garments  li {
    clear: both;
    width: 150px;
    margin: 0 0 10px 0;
}

#collection #garments li.newLine  {
    clear:left;
}

#collection #garments li .caption {
    position: absolute;
    bottom: 3px;
    left: 5px;
    background-color: #fff;
    color: #000;
    padding: 5px 10px 5px 10px;
    width: 130px;
    text-align: center;
}

/*==== end Garment Listing =====*/


/*==== Our Services =====*/

#service .wine  {
    float: left;
    margin-right: 10px;
}
/*==== End Our Services =====*/



/*====== Admin TabNav =======*/

ul#admin_tabnav {
    float: left;
    width: 767px;
    list-style-type: none; 
	margin: 0; 
	padding: 0 0 0 10px;
	z-index: 1;
}

ul#admin_tabnav  li {
    display: block;
    float: left;
    color: #000;
    background-color: #FFEBBF;
    margin: 0; padding: 0;
	border: 2px solid #000;
	border-bottom: 0 solid #000;
}

ul#admin_tabnav  a, 
ul#admin_tabnav  a.active {
    display: block;
    float: left;
	text-decoration: none;
	background-color: #582102;
    margin: 0;
    padding: 2px 5px 2px 5px;
}

ul#admin_tabnav  a.active,
ul#admin_tabnav  a:hover {
	color: #fff;
	background-color: #FFB000;
}

#admin_content {
    float: left;
    width: 833px;
    clear: both;  /* Just in case */
    background: #FFB000;
    margin: 0;
    padding: 20px;
    border: 2px solid black;
    border-top: none;
    z-index: 2;	
}

p.logOutLink {
    float: left; 
    width: 90px;
    clear: right;
    text-align: right;
    margin: 0; 
    padding: 0 10px 0 0;
}
#admin_content fieldset  {
    margin-bottom: 2em;
}
#admin_content label  {
    margin-right: 2em;
}
/*====== end Admin TabNav =======*/



/*====== Contact Us =======*/

#contactUs  input,
#contactUs  textarea {
    width: 30em;
}
#contactUs  input.submit {
    width: auto;
}
#contactUs  textarea {
    height: 20em;
}



#contactUs  span.label {
    font-weight: bold;
}



/*
 * The image in this container adds nothing content-wise so I'm not prepared to 
 * drop it in an image tag
 */
#contactUs  div.panel  div.dressing {
    width: 247px;
    height: 145px;
    background: transparent url(/images/contactus_contactdetails.jpg) no-repeat top left;
    margin: 0; padding: 0;
}

#contactUs  dl.contactDetails {
    display: block;
    float: left;
    margin: 1em 0;
}

#contactUs  dl.contactDetails  dt,
#contactUs  dl.contactDetails  dd {
    margin: 0 0 .5em 0;
    padding: 0;
}

#contactUs  dl.contactDetails  dt {
    float: left; 
    width: 90px;
    height: 1%;
    font-weight: bold;
}

#contactUs  dl.contactDetails  dd {
    height: 1%;
    margin-left: 95px;
}

#contactUs  dl.contactDetails  dt.first {
    display: none;
    float: none;
    width: auto;
}
#contactUs  dl.contactDetails  dd.first {
    margin-left: 0;
}

/*====== end Contact Us =======*/



/*====== Flash Messages =======*/

p.flashMessage {
    font-weight: bold;
    text-align: center;
    padding: 10px;
    border: 1px solid #000;
}

p.flashMessageError {
}

p.flashMessageNotice {
}

#contactUs  p.flashMessage {
    font-weight: normal;
    text-align: left;
    padding: 0;
    border: 0 solid #000;
}



div.errorNotification {
    font-weight: bold;
    text-align: left;
    background-color: #f00;
    padding: 10px;
    border: 1px solid #fff;
}

#contactUs  div.errorNotification {
    width: 480px;
}

/*====== end Flash Messages =======*/