/*----------------------------------------

Main stylesheet for: 

Nino's and Joe's

----------------------------------------*/ 



/* Styles reset, HTML & body styling -------------------------------------------------------------------------------------  */     



html, body, div, span, applet, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

a, abbr, acronym, apress, big, cite, code,

del, dfn, em, font, img, ins, kbd, q, s, samp,

small, strike, strong, sub, sup, tt, var,

dl, dt, p, ol, ul, li, title

fieldset, form, legend, input, table

{

    border: 0;

    font-family: inherit;

    font-style: inherit;

    font-weight: inherit;

    line-height: normal;                

    outline: 0;     

}



* {margin:0;padding:0;} 



html

{

    background: url('../images/bk.jpg') top left repeat;  

    height: 100%;    

    overflow-x: hidden;

    overflow-y: scroll;    

}



body

{ 

    background: url('../images/bk-top.jpg') top left repeat-x;      

    color: #4f4e4e;

    font: 14px/1.2em  Arial, sans-serif;

    height: 100%;        

    position: relative;

}



    #forIE7  /* can't have multiple background divs on body or html elements with pie.htc and ie7, so need an extra div */

    {

        height: 100%;        

        position: relative;      /* both of these needed so that it doesn't blow up the sticky footer */        

    }

    

    body#home #forIE7  /* can't have multiple background divs on body or html elements with pie.htc and ie7, so need an extra div */

    {

        background: url('../images/bk-top.jpg') top left repeat-x, url('../images/slider-outer-bk.jpg') center 510px no-repeat;              

    }    



#wrapper

{ 

    margin: 0 auto;

    min-height: 100%;    

    padding: 0;

    position: relative;

    width: 985px;

}



#stickyFooterMain

{

    overflow: auto;

    padding-bottom: 240px; /* must be same height as the footer */

}



/* Type and styling -------------------------------------------------------------------------------------  */



h1, h2, h3, h4, h5, h6

{

    color: #b20932;   

    font-size: 18px; 

    letter-spacing: -1px;

    line-height: 1.2em;  

    margin: 0;

    padding: 0 0 10px 0;    

}



h3

{

    color: #4f4e4e;

    font-size: 15px;

    font-weight: bold;

    letter-spacing: normal;      

    padding-bottom: 8px;

}



h4

{

    font-size: 16px;

}



h5

{

    color: #707070;      

    font-size: 14px;

    font-weight: bold;

    letter-spacing: normal;    

    padding-bottom: 0;

}



p, li, address, .caption, caption, th, td, dt, dd, blockquote

{   

    font-size: 13px;

    line-height: 1.3em; 

    font-style: normal;

    padding: 0 0 10px 0;    

}



em

{

    font-style: normal;

    font-weight: bold;

} 



a

{

    color: #b20932;

    text-decoration: none;

} 

    

    a:hover

    {

        color: #950629;

    }

    

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on October 25, 2011 */

@font-face {

    font-family: 'PMNCaecilia46LightItalic';

    src: url('caecilia-lightitalic-webfont.eot');

    src: url('caecilia-lightitalic-webfont.eot?#iefix') format('embedded-opentype'),

         url('caecilia-lightitalic-webfont.woff') format('woff'),

         url('caecilia-lightitalic-webfont.ttf') format('truetype'),

         url('caecilia-lightitalic-webfont.svg#PMNCaecilia46LightItalic') format('svg');

    font-weight: normal;

    font-style: normal;

}    

    

blockquote

{

    border: 1px solid #c3c2c2;

    border-width: 1px 0;

    color: #a30234;

    clear: both;

    font-family: 'PMNCaecilia46LightItalic';

    font-size: 21px;

    line-height: 27px;

    padding: 13px 190px 13px 0;

    width: 455px;

} 



blockquote span

{

    clear: both;

    color: #605f5f;

    display: block;

    font-size: 14px;

    padding-top: 10px;

}   

       

    

/* Header -------------------------------------------------------------------------------------  */     

#header

{

    overflow: hidden;

    padding: 15px 0 15px 20px;

    position: relative;

}



img#logo

{

    float: left; /* for ie 7 */

}



img#phone

{

    float: right;

    padding-top: 4px;

    padding-right: 15px;

}





/* Navigation -------------------------------------------------------------------------------------  */ 



ul#nav

{

    float: right;

    list-style: none;

    margin: 10px 0;

    min-width: 600px;

    padding: 0;

}



    #nav li

    {

        float: left;

        margin: 0 0 0 3px;

        padding: 0;

    } 

    

    #nav a

    {

        background: transparent;

        -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;         

        color: #b20932;

        display: block;

        font-size: 16px;

        letter-spacing: -1px;

        line-height: 1em;

        margin: 0;

        padding: 10px 15px;

        text-decoration: none;

    }

    

    #nav a:hover, #nav a.active, #about a#nav_about, #news a#nav_news, #gallery a#nav_gallery, #suppliers a#nav_suppliers, #products a#nav_products, #contact #nav_contact  

    {

        background: #b20932;        

        color: #e7e6e1;

        margin: 0;        

    }

    

    a#nav_home

    {

        background: url('../images/nav-home.png') top center no-repeat;   

        height: 15px; width: 17px; 

        padding: 10px;     

        text-indent: -99999px;

    }



    a#nav_home:hover

    {

        background: #b20932 url('../images/nav-home.png') bottom center no-repeat;  

    } 



/* Layout -------------------------------------------------------------------------------------  */ 



.mainContent

{

    padding-right: 15px;

    padding-bottom: 30px;

    position: relative;

    z-index: 999;

    width: 970px;

}



#home .mainContent

{

    overflow: auto

}



img.banner

{

    display: block;

    padding-bottom: 20px;

} 



a.btn

{

    background: #b20932; 

    -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; 

    -webkit-box-shadow: 0px 2px 2px 0px #9e9b9b; -moz-box-shadow: 0px 2px 2px 0px #9e9b9b; box-shadow: 0px 2px 2px 0px #9e9b9b;     

    clear: left;

    color: #fff;

    cursor: pointer;

    font-size: 14px;

    font-weight: bold;

    line-height: 100%;

    margin: 0 0 10px;

    padding: 3px 13px 4px;

    *padding: 4px 7px; /* ie7 padding bug fix */

    text-align: center;

}



    a.btn:hover

    {

        background: #950629;  

    }





.mainCol /* main content area */

{

    display: inline-block; vertical-align: top; /* for ie */ zoom: 1; *display: inline; 

    padding: 0 0 70px;

    width: 675px;

}



.mainCol p

{

    line-height: 1.6em;

    max-width: 625px;

}



.sidebar

{

    display: inline-block; vertical-align: top; /* for ie */ zoom: 1; *display: inline; 

    margin-left: 25px; 

    width: 265px;

} 



.sidebar .short h2, .sidebar .short h3, .sidebar .short h4, .sidebar .short h5, .sidebar .short h6, .sidebar .short p

{

    max-width: 240px;

}



.block, .mapBlock /* content sections in the sidebar */

{

    clear: both;

    overflow: auto;

    padding-bottom: 10px;

    width: 100%;

}



.block img

{

    background: url('../images/frameSm.png') -1px top no-repeat; 

    display: block;

        height: 88px; width: 120px;

    float: left;

    margin: 0 10px 10px 0;

    padding: 8px 7px 20px;

    overflow: hidden;

} 



/* sidebar map. See end of this CSS file for tooltips. */

.map

{

    float: left;

    height: 116px; width: 139px;   

    margin: 0 0 10px 0;    

}



    .point 

    {

        display:block;

        text-indent:-9999px;

        width:15px;

        height:19px;

        outline:none;

        background:url(../images/map-marker.png) no-repeat;

        cursor:pointer;

    } 



.col, .mapCol /* equal width columns, in footer and on home page */

{

    display: block;

    float: left;

    margin: 0 0 0 20px;

    width: 310px;

}



.col:first-child

{

    margin-left: 0;

}



.col img

{

    background: url('../images/frame.png') -1px top no-repeat; 

    display: block;

    float: left;

    margin: 0 10px 5px 0;

    padding: 10px 9px 20px 9px;

}





/* News -------------------------------------------------------------------------------------  */ 



ul.newsListing

{

    list-style: none;

    margin: 5px 0;

    padding: 0;

}



.newsListing li

{

    margin: 0 0 25px;

    padding: 0;

    min-height: 140px;

}



.newsListing img

{

    background: url('../images/news-frame.png') -1px top no-repeat; 

    display: block;

    float: left;

    margin: 0 10px 5px 0;

    padding: 8px 9px 15px 9px; 

}



ul.subNav

{

    list-style: none;

    margin: 20px 0;

    padding: 0;

}



.subNav li

{

    float: left;

    margin: 0 45px 0 0;

    padding: 0;

}



.subNav a

{

    background: url('../images/arrow-back.png') left 1px no-repeat;     

    display: block;

    height: 11px;

    padding: 0 0 0 15px;

}



.subNav a.next

{

    background: url('../images/arrow-forward.png')  right 1px no-repeat;     

    display: block;

    padding: 0 15px 0 0;

}



.subNav a:hover

{

    background-position: left -10px;

}



.subNav a.next:hover

{

    background-position: right -10px;

}



.pagination li

{

    margin: 0 15px 0 0;

}



.subNav.pagination a

{

    background: transparent;     

    padding: 0;

}





.subNav a.prev

{

    background: url('../images/arrow-back.png')  left 1px no-repeat;     

    display: block;

    padding: 0 0 0 15px;

}



.subNav a.next

{

    background: url('../images/arrow-forward.png')  right 1px no-repeat;     

    display: block;

    padding: 0 15px 0 0;

}



.subNav a.prev:hover

{

    background-position: left -10px;

}



.subNav a.next:hover

{

    background-position: right -10px;

}





.pagination a

{

    background: transparent;

}



/* Gallery -------------------------------------------------------------------------------------  */ 



ul.galleryListing

{

    list-style: none;

    margin: 5px 0 5px -3px;

    overflow: auto;

    padding: 0;

}



.galleryListing li

{

    float: left;

    margin: 0 4px 3px 0;

    padding: 0;

}



.galleryListing img

{

    background: url('../images/gallery-frame.png') top left no-repeat; 

    display: block;

    height: 114px; width: 148px;

    margin: 0;

    padding: 7px 8px 17px 9px; 

    overflow: hidden;

}



/* Suppliers -------------------------------------------------------------------------------------  */ 



ul.suppliersListing

{

    list-style: none;

    margin: 10px 0 60px;

    padding: 0;

    overflow: auto;

}



.suppliersListing li

{

    background: url('../images/suppliers-frame.png') top left no-repeat;

    float: left;

    width: 203px; height: 116px;     

    margin: 0 25px 25px 0;

    padding: 1px 3px 5px 2px;

    overflow: hidden;

}



.suppliersListing img

{

    display: block;

    margin: 0 auto;

}





/* Products -------------------------------------------------------------------------------------  */ 



#products .tabs img, img.framed

{

    background: url('../images/products-frame.png') top left no-repeat;

    float: right;

    width: 246px; height: 188px;     

    margin: 0 0px 5px 12px;

    padding: 11px 13px 15px 13px;

    overflow: hidden;

}



.team

{

	min-height: 165px;

}





.team img

{

    background: url('../images/team-frame.png') top left no-repeat;

    float: left;

    width: 140px; height: 116px;     

    margin: 0 12px 25px 0;

    padding: 7px 6px 7px 8px;

    overflow: hidden;

}



#products .tabs p

{

    line-height: 1.5em;

}



/* Footer -------------------------------------------------------------------------------------  */ 



#footer

{

    background: url('../images/footer-bk.jpg') top left repeat;  

    border-top: 1px solid #fff;

    clear: both;

    height: 180px;

    margin-top: -240px; /* negative value of footer height */

    padding: 20px 0 40px;

    position: relative;  

    width: 100%;

}

     

/*Opera Fix for sticky footer*/

body:before {/* thanks to Maleika (Kohoutec)*/

content:"";

height:100%;

float:left;

width:0;

margin-top:-32767px;/* thank you Erik J - negate effect of float*/

}

  

.content

{

    margin: 0 auto;

    overflow: auto;

    position: relative;

    width: 970px;

}



a.facebook, a.twitter

{

    background: url('../images/social-facebook.png') top left no-repeat;  

    clear: left;    

    color: #4f4e4e;

    display: block;

    height: 28px;

    line-height: 28px;

    margin-bottom: 5px;

    padding-left: 37px; 

    text-decoration: none;

    width: 140px;

}



a.twitter

{

    background-image: url('../images/social-twitter.png');      

}



a.facebook:hover, a.twitter:hover

{

    background-position: bottom left;  

}



p.copyright

{

    clear: left;

    color: #989797;

    float: left;

    font-size: 13px;

    padding-top: 25px;

    white-space: nowrap;

}



ul.footerNav

{

    float: right;

    list-style: none;

    margin: 0;

    padding: 0;

}



.footerNav li

{

    float: left;

}



.footerNav a

{

    color: #989797;

    display: block;

    font-size: 13px;

    margin-left: 35px;    

    padding-top: 25px;    

    text-decoration: none;

}



.footerNav a:hover

{

    color: #4f4e4e;        

}



a.TCA

{

    background: url('../images/seventyfour.png') top left no-repeat;  

    height: 30px; width: 31px; 

    margin-top: 15px;

    margin-left: 20px; 

    padding: 0;  

    text-indent: -99999px;

}



a.TCA:hover

{

    background-position: bottom left;  

}



a.GGP

{

    background: url('../images/GG.png') top left no-repeat;  

    height: 23px; width: 42px; 

    margin-top: 19px;

    margin-left: 23px; 

    padding: 0;  

    text-indent: -99999px;

}



/* -------------------------------------------------------------------------------------

    Tooltips

    TipTip CSS - Version 1.2

-------------------------------------------------------------------------------------  */ 



#tiptip_holder {

    display: none;

    position: absolute;

    top: 0;

    left: 0;

    z-index: 99999;

}



#tiptip_holder.tip_top {

    padding-bottom: 5px;

}



#tiptip_holder.tip_bottom {

    padding-top: 5px;

}



#tiptip_holder.tip_right {

    padding-left: 5px;

}



#tiptip_holder.tip_left {

    padding-right: 5px;

}



#tiptip_content {

    background: url('../images/tooltip-bk.png') top left no-repeat;     

    color: #525151;

    display: block;

        height: 74px; width: 147px;

    font-size: 13px;    

    padding: 16px 18px 24px;

}



#tiptip_content span

{

    font-weight: bold;

    color: #b20932;

}



#tiptip_arrow, #tiptip_arrow_inner {

    position: absolute;

    border-color: transparent;

    border-style: solid;

    border-width: 6px;

    height: 0;

    width: 0;

}



#tiptip_holder.tip_top #tiptip_arrow {



}



#tiptip_holder.tip_bottom #tiptip_arrow {



}



#tiptip_holder.tip_right #tiptip_arrow {



}



#tiptip_holder.tip_left #tiptip_arrow {



}



#tiptip_holder.tip_top #tiptip_arrow_inner {

    margin-top: -7px;

    margin-left: -6px;

}



#tiptip_holder.tip_bottom #tiptip_arrow_inner {

    margin-top: -5px;

    margin-left: -6px;

}



#tiptip_holder.tip_right #tiptip_arrow_inner {

    margin-top: -6px;

    margin-left: -5px;

}



#tiptip_holder.tip_left #tiptip_arrow_inner {

    margin-top: -6px;

    margin-left: -7px;

}



/* Webkit Hacks  */

@media screen and (-webkit-min-device-pixel-ratio:0) {    

    #tiptip_content {

        padding: 4px 8px 5px 8px;

        background-color: #f6f6f4;

    }

    #tiptip_holder.tip_bottom #tiptip_arrow_inner { 

        background-color: #f6f6f4;

    }

    #tiptip_holder.tip_top #tiptip_arrow_inner { 

        border-top-color: rgba(249,248,246,1);

    }

}
.mainCol p.home-delivery{float: left; margin-right: 21px;}
.mainCol p.home-order{float: left; margin-right: 21px;}