/* 
   Ca Roule : Master Stylesheet
   ======================================================================================================
   
   RESET DEFAULT STYLING + FOUNDATIONS                             RESET DEFAULT STYLING + FOUNDATIONS ::
--------------------------------------------------------------------------------------------------------- */

@import url("reset.css");

body
{
  background:       #3A0B01 url("../img/bg1.jpg") repeat-x top left;
  font:             normal 62.5% Georgia,"Times New Roman",Times,serif;
  color:            #390C00;
  text-align:       center;
  }
div.wrapper
{
  width:            980px;
  margin:           0 auto;
  text-align:       left;
  }
div.frame
{
  float:            left;
  position:         relative;
  width:            980px;
  }

a { text-decoration:  none; }

a.skiplink { display: none; }

/* HEADER                                                                                       HEADER ::
--------------------------------------------------------------------------------------------------------- */
div#header
{
  height:           151px;
  background:       transparent url("../img/frame_head.png") no-repeat 0 131px;
  }
div#header h2 a
{
  position:         absolute;
  z-index:          50;
  top:              28px;
  left:             13px;
  width:            285px;
  height:           96px;
  background:       transparent url("../img/ca_roule_logo.png") no-repeat 0 0;
  text-indent:      -9999px;
  }
ul#nav
{
  float:            right;
  margin:           109px 14px 0 0;
  }
ul#nav li
{
  float:            left;
  }
ul#nav a
{
  float:               left;
  position:            relative;
  z-index:             100;
  height:              36px;
  text-indent:         -9999px;
  background-color:    transparent;
  background-repeat:   no-repeat;
  background-position: 0 0;
  }

a#navHome      { width: 77px;  background-image: url("../img/nav_home.jpg");      }
a#navVenues    { width: 88px;  background-image: url("../img/nav_venues.jpg");    }
a#navFranchise { width: 110px; background-image: url("../img/nav_franchise.jpg"); }
a#navGallery   { width: 90px;  background-image: url("../img/nav_gallery.jpg");   }
a#navContact   { width: 94px;  background-image: url("../img/nav_contact.jpg");   }

ul#nav a:hover,
body#home       a#navHome,
body#venues     a#navVenues,
body#franchise  a#navFranchise,
body#gallery    a#navGallery,
body#contact    a#navContact
{
  background-position: 0 -36px;
  }

/* CONTENT                                                                                     CONTENT ::
--------------------------------------------------------------------------------------------------------- */
div#content
{
  z-index:          10;
  background:       transparent url("../img/frame_bg.png") repeat-y 0 0;
  padding:          0 0 3px;
  min-height:       550px;
  height:           auto !important;
  height:           550px;
  }
h1#mainHeading
{
  float:               left;
  display:             inline;
  width:               940px;
  margin:              0 20px;
  background-color:    transparent;
  background-repeat:   no-repeat;
  background-position: 0 0;
  text-indent:         -9999px;
  }
body#home h1#mainHeading
{
  height:           258px;
  position:         relative;
  z-index:          10;
  background-image: url("../img/le_nouveau_concept_cafe.jpg");
  }
body#venues h1#mainHeading,
body#franchise h1#mainHeading,
body#gallery h1#mainHeading,
body#contact h1#mainHeading,
body#error404 h1#mainHeading
{
  height:           125px;
  background-image: url("../img/heading_bg.jpg");
  }
h1#mainHeading span
{
  float:               left;
  position:            relative;
  top:                 48px;
  left:                43px;
  height:              24px;
  background-color:    transparent;
  background-repeat:   no-repeat;
  background-position: 0 0;
  }
body#venues h1#mainHeading span
{
  width:            89px;
  background-image: url("../img/heading_venues.jpg");
  }
body#franchise h1#mainHeading span
{
  width:            249px;
  background-image: url("../img/heading_franchise_ca_roule.jpg");
  }
body#gallery h1#mainHeading span
{
  width:            101px;
  background-image: url("../img/heading_gallery.jpg");
  }
body#contact h1#mainHeading span
{
  width:            153px;
  background-image: url("../img/heading_contact_us.jpg");
  }
body#error404 h1#mainHeading span
{
  width:            206px;
  background-image: url("../img/heading_page_not_found.jpg");
  }

/* PRIMARY                                                                                     PRIMARY ::
--------------------------------------------------------------------------------------------------------- */
div#primary
{
  float:            left;
  position:         relative;
  z-index:          50;
  display:          inline;
  width:            600px;
  margin:           -20px 0 0 35px;
  }
div#primary h2
{
  font-size:        2.4em;
  font-style:       italic;
  font-weight:      normal;
  padding:          .8em 0 .3em;
  }
div#primary h3
{
  font-size:        1.5em;
  font-weight:      normal;
  }
div#primary p
{
  font-size:        1.3em;
  line-height:      1.6em;
  margin:           0 0 1.4em;
  }
div#primary p#founders
{
  margin:           -10px 0 .8em;
  width:            260px;
  height:           35px;
  background:       transparent url("../img/founders.jpg") no-repeat 0 0;
  text-indent:      -9999px;
  }
div#primary a
{
  color:            #390C00;
  border-bottom:    1px solid #390C00;
  }
div#primary a:hover
{
  color:            #FF7800;
  border-color:     #FF7800;
  }
div#primary div.hr
{
  float:            left;
  width:            600px;
  height:           13px;
  background:       transparent url("../img/hr.jpg") no-repeat 0 0;
  }
div#primary div.hr hr
{
  display:          none;
  }
div#primary div.panel
{
  float:            left;
  width:            600px;
  w\idth:           574px;
  margin:           15px 0 0;
  padding:          13px 13px 0;
  background-color: #D1C9C0;
  }
div#primary div.panel p
{
  font-size:        1.2em;
  }
div#primary dl
{
  float:            left;
  width:            600px;
  margin:           20px 0;
  }
div#primary dt
{
  float:            left;
  width:            110px;
  }
div#primary dd
{
  float:            right;
  width:            490px;
  }
div#primary dt
{
  font-size:        1.6em;
  }
div#primary dd
{
  font-size:        1.7em;
  }
img#mainImage
{
  float:            left;
  margin:           20px 0 10px;
  }

/* SECONDARY                                                                                 SECONDARY ::
--------------------------------------------------------------------------------------------------------- */
div#secondary
{
  float:            left;
  width:            325px;
  }
h3#franchising a
{
  float:            left;
  position:         relative;
  top:              0;
  left:             20px;
  width:            292px;
  height:           90px;
  background:       transparent url("../img/interested_in_franchising.jpg") no-repeat 0 0;
  text-indent:      -9999px;
  }
body#home h3#franchising a
{
  top:              -17px;
  }
h3#franchising a:hover
{
  background-position: 0 -90px;
  }
div#secondary img
{
  float:            left;
  display:          inline;
  margin:           20px 20px 5px;
  }
body#home div#secondary img
{
  margin-top:       5px;
  }
div#secondary ul
{
  float:            left;
  position:         relative;
  top:              7px;
  left:             20px;
  width:            300px;
  }
div#secondary li
{
  float:            left;
  width:            100px;
  margin:           10px 0 0;
  }
div#secondary li img
{
  margin:           0;
  }

/* CONTACT FORM                                                                           CONTACT FORM ::
--------------------------------------------------------------------------------------------------------- */
div#primary form
{
  float:            left;
  width:            574px;
  margin:           -10px 0 0;
  padding:          0 0 10px;
  }
div.alert
{
  float:            left;
  display:          inline;
  width:            574px;
  margin:           0 0 15px;
  padding:          15px 0;
  background-color: #C00;
  font-size:        1.2em;
  text-align:       center;
  font-weight:      bold;
  color:            #FFF;
  }
div.success
{
  background-color: #51A414;
  }
div#primary form fieldset, div#primary form ol, div#primary form li
{
  float:            left;
  width:            574px;
  }
div#primary form fieldset
{
  margin:           10px 0 0;
  }
div#primary form li
{
  margin:           10px 0 0;
  }
div#primary form span.warning
{
  float:            right;
  display:          inline;
  width:            200px;
  margin-top:       7px;
  font-size:        1.1em;
  color:            #C00;
  }
div#primary form span.full
{
  width:            454px;
  margin-bottom:    5px;
  }
div#primary form label
{
  float:            left;
  width:            120px;
  padding:          6px 0 0;
  font-size:        1.2em;
  }
div#primary form li.warning label
{
  color:            #C00;
  }
div#primary form input.text, div#primary form textarea
{
  float:            left;
  width:            230px;
  w\idth:           222px;
  border:           1px solid #C4BAB1;
  padding:          4px 3px;
  background-color: #FFF !important;
  font-family:      Arial, Helvetica, sans-serif;
  font-size:        1.2em;
  }
div#primary form textarea
{
  float:            right;
  width:            454px;
  w\idth:           446px;
  }
div#primary form li.warning input.text, div#primary form li.warning textarea, div#primary form li.warning select
{
  border-color:     #C00;
  }
div#primary form button
{
  float:            left;
  display:          inline;
  width:            76px;
  height:           28px;
  margin:           0 0 0 120px;
  background:       #D1C9C0 url("../img/send_enquiry.jpg") no-repeat 0 0;
  text-indent:      -9999px;
  cursor:           pointer;
  }
div#primary form button:hover
{
  background-position: 0 -28px;
  }

/* FOOTER                                                                                       FOOTER ::
--------------------------------------------------------------------------------------------------------- */
div#footer
{
  float:            left;
  margin-top:       -190px;
  width:            100%;
  background:       #3A0B01 url("../img/bg2.jpg") repeat-x top center;
  height:           350px;
  }
div#footer div.frame
{
  margin:           190px -3px 0 0;
  background:       transparent url("../img/frame_foot.png") no-repeat 0 0;
  }
div#footer p
{
  float:            left;
  width:            980px;
  margin:           10px 0 0;
  text-align:       center;
  font-family:      Arial, Helvetica, sans-serif;
  font-size:        1.1em;
  color:            #FFF;
  }
div#footer p.links
{
  margin:           70px 0 0;
  }
div#footer a
{
  margin:           0 10px;
  padding:          0 0 2px;
  color:            #FFF;
  }
div#footer a:hover
{
  border-bottom:    1px dotted #FFF;
  }
