/*
classes.css

This contains all the classes used by the website other than those defined in default.css
Typically this will include header and footer css as well as any styles required by any bespoke areas of the website
*/

html
{
    padding: 0px;
    margin: 0px;
    width: 100%;
    height: 100%;
    min-width: 750px;
    overflow: hidden;
}

body
{
    background-color: #000000;
    padding: 0px;
    margin: 0px;
    width: 100%;
    height: 100%;
    font-family: arial, tahoma;
    overflow: hidden;
    min-width: 750px;
}

div#outercontainer
{
    padding: 0px;
    margin: 0px;
    width: 100%;
    height: 100%;
    min-width: 750px;
    vertical-align: middle;
}

div#container
{
    position: absolute;
    display: block;
    top: 50%;
    vertical-align: middle;
    height: 580px;
    width: 100%;
    min-width: 750px;
    margin-top: -290px;
    margin-left: auto;
    margin-right: auto;
    background-image: url(../images/gr-bgslice.jpg);
    background-position: right;
    background-repeat: repeat-x;
}

img#leftimage
{
    float: left;
}

ul#menu
{
    position: relative;
    height: 28px;
    float: right;
    list-style: none;
    margin: 0px;
    padding: 0px;
    margin-top: 70px;
    margin-right: 43px;
    z-index: 100;
    display: block;
}

ul#menu li
{
    list-style: none;
    margin: 0px 0px;
    margin-left: 0px;
    padding: 0px;
    float: left;
    position: relative;
    z-index: 100;
}

ul#menu li a
{
    margin: 0px;
    padding: 0px 5px;
    z-index: 100;
}

ul#menu li a img
{
    margin: 0px;
    padding: 0px;
}

ul#menu li ul
{
    position: absolute;
    left: 0px;
    top: 28px;
    border: 2px solid #F5D66A;
    background-color: #ffffff;
    margin: 0px;
    padding: 0px;
    display: none;
}

ul#menu li:hover ul, ul#menu li.over ul
{
    display: block;
}

ul#menu li ul li
{
    margin: 2px;
    padding: 2px;
    position: relative;
}

ul#menu li ul li a
{
    float: none;
    background-color: #ffffff;
    display: block;
    margin: 0px;
    padding: 5px;
}

ul#menu li ul li a:hover
{
}

ul#menu li.submenugroup
{
    top: 0px;
    float: left;
    width: 100px;
}

ul#menu li.submenugroup ul
{
    position: relative;
    top: 0px;
    border: 0px;
    border-left: 1px solid #3A4B5F;
    float: none;
    margin: 0px;
    padding: 0px;
    margin-left: 3px;
    padding-left: 2px;
}

ul#menu li.submenugroup ul li
{
    float: none;
    padding: 0px;
    padding-left: 2px;
}

ul#menu a.submenuheading
{
    font-weight: 700;
    font-size: 13px;
}

div#contentbg
{
    position: relative;
    top: -150px;
    background-image: url(../images/gr-rightbg.jpg);
    background-position: top right;
    background-repeat: no-repeat;
    margin-top: 0px;
    height: 580px;
    padding: 0px;
    width: 100%;
    z-index: 0;
}

div#content
{
    display: block;
    position: relative;
    margin-top: 150px;
    top: 150px;
    height: 380px;
    margin-right: 60px;
    padding: 0px 20px;
    overflow: auto;
    width: auto;
    z-index: 1;
}

/*
layout items
*/
div.layoutitem_subpages
{
    width: 214px;
}

div.layoutitem_subpages div.header_image
{
    height: 26px;
    background-image: url(../images/gr-submenu-top.png);
}

div.layoutitem_subpages div.subpage_wrapper
{
    margin: 0px;
    padding: 0px;
    background-image: url(../images/gr-submenu-slice.png);
}

ul.layoutitem_subpages
{
}

ul.layoutitem_subpages li
{
}

ul.layoutitem_subpages li a
{
	padding: 10px;
    padding-right: 15px;
	font-size: 20px;
	font-weight: 400;
	text-align: right;
    text-transform: lowercase;
	color: #000000;
    text-decoration: none;
    width: 190px;
}

ul.layoutitem_subpages li a:hover
{
	font-size: 20px;
	font-weight: 400;
	text-align: right;
	color: #29384D;
}

div.layoutitem_subpages div.footer_image
{
    height: 31px;
    background-image: url(../images/gr-submenu-bottom.png);
}

/*
end layout items
*/

/*
general product display (ie applicable to stock, recipes and ingredients
*/
div#leftcolumn
{
    width: auto;
}

div#rightcolumn
{
    width: 360px;
    float: right;
    text-align: center;
}

div.small_product_display
{
    text-align: center;
    border: 1px solid #A4B5BF;
    display: block;
    height: 185px;
    width: 185px;
    background-color: #A4B5BF;
}

div.small_product_display a
{
    color: #ffffff;
}

div.small_product_display h4
{
    color: #ffffff;
    background-color: #879AA8;
    font-size: 14px;
    margin: 0px;
    padding: 3px;
}

div.small_product_display img
{
}

div.small_product_display span
{
    display: block;
    padding: 3px;
    margin-top: 3px;
    color: #ffffff;
}

div.small_product_display:hover
{
    text-align: center;
    border: 1px solid #F8EBB7;
    display: block;
    height: 185px;
    width: 185px;
    background-color: #F8EBB7;
    color: #000000;
}

div.small_product_display:hover a
{
    color: #000000;
}

div.small_product_display:hover h4
{
    background-color: #FCD556;
    font-size: 14px;
    margin: 0px;
    padding: 3px;
    color: #000000;
}

div.small_product_display:hover span
{
    color: #000000;
}

div.small_stock_product_display
{
    text-align: center;
    border: 1px solid #A4B5BF;
    display: block;
    height: 220px;
    width: 185px;
    background-color: #ffffff;
}

div.small_stock_product_display a
{
    color: #ffffff;
}

div.small_stock_product_display h4
{
    color: #ffffff;
    background-color: #879AA8;
    font-size: 14px;
    margin: 0px;
    padding: 3px;
}

div.small_stock_product_display img
{
    vertical-align: middle;
    margin-top: 5px;
}

div.small_stock_product_display span
{
    display: none;
}

div.small_stock_product_display:hover
{
    text-align: center;
    border: 1px solid #F8EBB7;
    display: block;
    height: 220px;
    width: 185px;
    color: #000000;
}

div.small_stock_product_display:hover a
{
    color: #000000;
}

div.small_stock_product_display:hover h4
{
    background-color: #FCD556;
    font-size: 14px;
    margin: 0px;
    padding: 3px;
    color: #000000;
}
/*
end general product display
*/

/*
product display
*/
div#returnlink
{
    margin: 5px 0px;
}

ul#product_submenu
{
    margin: 0px;
    padding: 0px;
    list-style: none;
    margin-bottom: 7px;
    clear: both;
}

ul#product_submenu li
{
    background-image: url(../images/bg-bluesemitrans.png);
    background-repeat: repeat;
    float: left;
    padding: 5px;
    margin-right: 2px;
}

ul#product_submenu li.selected
{
    background-image: url(../images/bg-whitesemitrans.png);
    background-repeat: repeat;
    float: left;
    padding: 5px;
    margin-right: 2px;
}

ul#product_submenu li a
{
    display: block;
}

div.productpage_details
{
    background-repeat: repeat;
    background-image: url(../images/bg-whitesemitrans.png);
    padding: 5px;
    height: 270px;
    overflow: auto;
    clear: both;
}

div#product_description
{
}

ul.ingredientlist
{
    list-style: none;
    margin: 0px;
    padding: 0px;
}

ul.ingredientlist li
{
    width: 100px;
    height: 100px;
    text-align: center;
    float: left;
    display: block;
    margin: 5px 15px;
}

ul.ingredientlist li a
{
    height: 100px;
    width: 100px;
    text-align: center;
    display: block;
    background-color: #ffffff;
    border: 1px solid #EFD566;
    padding: 0px;
    vertical-align: middle;
}

ul.ingredientlist li a div.imgholder
{
    height: 80px;
    vertical-align: middle;
    padding-top: 5px;
}

ul.ingredientlist li a p
{
    margin-top: -7px;
    padding-top: 3px;
    height: 20px;
    background-color: #EFD566;
}

ul.ingredientlist li a:hover
{
    height: 100px;
    width: 100px;
    text-align: center;
    display: block;
    background-color: #ffffff;
    border: 1px solid #324259;
    vertical-align: middle;
}

ul.ingredientlist li a:hover div.imgholder
{
    height: 80px;
    vertical-align: middle;
}

ul.ingredientlist li a:hover p
{
    height: 20px;
    color: #ffffff;
    background-color: #324259;
}

ul.recipelist
{
    list-style: none;
    margin: 0px;
    padding: 0px;
}

ul.recipelist li
{
    width: 200px;
    height: 200px;
    text-align: center;
    float: left;
    display: block;
    padding: 20px;
}

ul.recipelist li a
{
    width: 200px;
    text-align: center;
    display: block;
    padding: 0px;
    border: 1px solid #EFD566;
    background-color: #ffffff;
}


ul.recipelist li a p
{
    padding-top: 3px;
    height: 20px;
    background-color: #EFD566;
    margin: 0px;
    margin-bottom: 3px;
}

ul.recipelist li a:hover
{
    border: 1px solid #324259;
}

ul.recipelist li a:hover p
{
    height: 20px;
    color: #ffffff;
    background-color: #324259;
}

ul.productlist
{
    list-style: none;
    margin: 0px;
    padding: 0px;
}

ul.productlist li
{
    width: 200px;
    height: 200px;
    padding: 20px;
    text-align: center;
    float: left;
    display: block;
}

ul.productlist li a
{
    width: 200px;
    text-align: center;
    display: block;
    padding: 0px;
    border: 1px solid #EFD566;
    background-color: #ffffff;
}


ul.productlist li a p
{
    padding-top: 3px;
    height: 20px;
    background-color: #EFD566;
    margin: 0px;
    margin-bottom: 3px;
}

ul.productlist li a:hover
{
    border: 1px solid #324259;
}

ul.productlist li a:hover p
{
    height: 20px;
    color: #ffffff;
    background-color: #324259;
}

div#product_nutritionalinformation
{
}

div.product_details
{
}

div.product_details div#heading h2
{
    margin-bottom: 2px;
}

div.product_details div#heading div#thai_name
{
    height: 15px;
}

div.product_details div#ingredients ul
{
    list-style: none;
    margin: 0px;
    padding: 0px;
}

div.product_details div#ingredients ul li
{
    list-style: none;
    margin: 0px;
    padding: 0px;
    text-align: center;
    float: left;
    width: 50%;
    height: 60px;
    vertical-align: middle;
}

div.product_details div#ingredients ul li img
{
    vertical-align: middle;
}
/*
end recipe display
*/

/*
amendments to sinc8.css
*/
div#breadcrumbtrail
{
	margin-bottom: 10px;
}

div#breadcrumbtrail a:hover
{
    border-bottom: 1px dashed #52677A
}

div#usermenubar
{
	background-color: #ffffff;
	border-bottom: 1px solid #4A627A;
	opacity: 0.7;
	padding: 2px;
}