﻿/* ------------------------------------------------------------ */
/* APPETISERS - RESETS */
/* ------------------------------------------------------------ */
@import "/css/reset.css";
img, div
{
    behavior:url('/fx-iepngfix.htc');
}
* {margin:0;}
html, body 
{
    height:100%;
    width:100%;
}
a, a:visited, a:active
{
    color:#0a274c;
    text-decoration:none;  
}
a:hover
{
    color:#496b97;   
}
/* ------------------------------------------------------------ */
/* MAINS - BARONJON (Myriad Pro,) */
/* ------------------------------------------------------------ */
body
{
    font-family: Segoe UI, Calibri, Tahoma, Verdana, Arial, sans-serif;
    font-size: 62.5%;
    background-color:#242424;
    background-image:url('/images/ui/background.jpg');
    background-position:center center;
    background-attachment:fixed;
}
h1 {
	font-size: 3.0em;
	line-height:35px;
	color: #7E7E7E;
	font-weight: bold;
}
h2 {
	font-size: 2.5em;
	color: #c4c2bc;
	font-weight: bold;
}
h3 {
	font-size: 2.0em;
	line-height:30px;
	color: #ffa415;
}
h4 {
	font-size: 1.5em;
	color: #7E7E7E;
}
#page
{
    position:relative;
    width: 980px;
    margin-left:auto;
    margin-right:auto;
}
#container
{
    position:relative;
    margin-top:15px;
    width:100%;
}
#header
{
    position:relative;
    width:100%;
    height:65px;
}
#logo
{
    position:relative;
    margin-top:10px;
    padding-left:25px;
    width:308px;
    height:83px;
    float:left;
}
#container-head
{
    background-image:url('/images/ui/mainpage-top.png');
    background-repeat:no-repeat;
    position:relative;
    height:36px;
}
#page-content
{
    position:relative;
    width:930px;
    padding-left:25px;
    padding-right:25px;
}
#container-content
{
    background-image:url('/images/ui/mainpage-page.png');
    background-repeat:repeat-y;
}
#container-bottom
{
    background-image:url('/images/ui/mainpage-bottom.png');
    background-repeat:no-repeat;
    position:relative;
    height:36px;
}
/* The following are for the cloth tabs */
#tabs 
{
	z-index : 95;
	height : 40px;
	width : 98%;
	margin-left : auto;
	margin-right : auto;
	margin-bottom : -20px;
}
#tabs ul {
	background-repeat : no-repeat;
	background-position : top right;
	float : right;
	margin-right : 8px;
	height : 40px;
}
#tabs ul li {
	float : left;
	text-align : center;	
	height : 40px;					
}
#tabs ul li p {
	margin-top : 18px;
	font-size : 1.6em;
}

#navlogin {
	background-image : url(/images/navtabs/login.png);
	background-repeat : no-repeat;
	width : 111px;				
}

#navregister, 
#navsearch {
	background-image : url(/images/navtabs/register.png);
	background-repeat : no-repeat;
	width : 110px;
	margin-left : -25px;
}

#navcc {
	background-image : url(/images/navtabs/customer.png);
	background-repeat : no-repeat;
	width : 176px;	
	margin-left : -30px;			
}

#navbasket {
	background-image : url(/images/navtabs/basket.png);
	background-repeat : no-repeat;
	width : 149px;	
	margin-left : -30px;			
}
/* End of tabs */
#mainpage
{
    position:relative;
    width:930px;
    margin-left:13px;
    clear:left;    
}
#mainmenu
{
    width:930px;
    height:60px;
    margin-left:13px;
}
#mainmenu ul
{
    position:relative;
    list-style:none;
    padding-top:14px;
    margin:0;
}
#mainmenu ul li
{
    font-size:1.4em;
    float:left;
}
#mainmenu ul li a
{
    color:#6a6a6a;
    font-size:120%;
    font-weight:bold;
}
#mainmenu ul li a:hover
{
    color:#c72e39;
}
#stockpanel
{
    position:relative;
    float:left;
    width:446px;
    height:676px;
    background-color:#000000;
    margin-left:10px;
}
#specialoffers
{
    position:relative;
    float:left;
    background-color:#bebebd;
    width:310px;
    height:676px;
    margin-left:10px;
}
#sidemenu
{
    position:relative;
    width: 125px;
    float:left;
}
.navitem
{
    font-size:1.3em;
    line-height:19px;
}
#specialoffers-content
{
    width:290px;
    height:656px;
    padding:10px;
	background-image : url(/images/offers/bucket-container.jpg);
	background-position : top left;
}
.specialoffers-header
{
    font-size:2.6em;
    color:#ffffff;
    line-height:34px;
}
.specialoffers-text
{
    font-size:1.4em;
    color:#ffffff;
}								
.specialoffer-bucket {																				
	width:135px; 
	height:175px;
	margin-bottom : 20px;
}

.specialoffer-bucket img {
	margin-top : 10px;
	margin-left : 10px;
}

.specialoffer-bucket p {
	color : white;
	margin-top : 5px;
	margin-left : 10px;
	font-size : 1.0em;
}

a:hover .bucket-grey {
	background-image : url(/images/offers/bucket-red.gif); 
}
.bucket-grey {
	background-image : url(/images/offers/bucket-grey.gif);
}
.bucket-right {
	float : right;
}
.bucket-left {
	float : left;
}
.contactcard
{
    font-size:1.4em;
}
.menusplit
{
    position:relative;
    width:121px;
    height:3px;
    margin-top:10px;
    margin-bottom:10px;
    background-image:url('/images/ui/leftsplit.png');
    background-repeat:no-repeat;
}
.split
{
    position:relative;
    width:765px;
    height:3px;
    border-bottom:solid 1px #7E7E7E;
    margin-bottom:10px;
    padding-top:10px;
}
.menuhead span
{
    position:relative;
    color:#249ac1;
    font-size:2.0em;   
}
.menuhead a
{
    position:relative;
    color:#249ac1;
    font-size:2.0em;   
}
.menutext
{
    position:relative;
    margin-top:3px;
    color:#5a5a5a;
    font-size:1.2em; 
}
#innersleeve
{
    position:relative;
    float:left;
    width:785px;
}
#innersleeve-offhome
{
    position:relative;
    float:left;
    width:762px;
    margin-left:10px;
}
#bins
{
    position:relative;
    clear:left;
    width:776px;
    height:115px;
    padding-top:10px;
    margin-left:10px;
}
.nav
{
	list-style: none;
	margin-left: 0;
	padding-left: 1em;
	text-indent: -1em;
	line-height: 14px;
}
#loggedin
{
    color:#ffffff;
    position:relative;
    width:420px;
    margin-right:19px;
    float:right;
    text-align:right;
    top:25px;
    height:10px;
    font-size:1.1em;
}
#loggedin a
{
    color:#ffc05d;
}
.bin
{
   position:relative;
   float:left;
   padding-right:10px;
   width:183px;
   height:114px;
}
#footer
{
    position:relative;
    width:100%;
    text-align:center;
    font-size:1.2em;
    height:90px;
}
#footer a
{
    color:#ffffff;
}
#tabs
{
    position:relative;
    width:980px;
}
.proddesc
{
    font-size: 1.4em;
    color: #848484;
    line-height:16px;
}
.productdesc
{
    font-size: 1.0em;
    color: #7E7E7E; 
    text-transform:capitalize;
}
.button
{
	font-family: "calibri", Segoe UI, Trebuchet MS, Tahoma, Verdana, Arial, Sans-Serif;
	font-size: 1.4em;
}
.textbox
{
	font-family: "segoe ui", Calibri, Trebuchet MS, Tahoma, Verdana, Arial, Sans-Serif;
	font-size: 1.4em;
	background: #232323;
	border-color: #444444;
	border-style: dotted;
	border-width: 1px;
	color: #b3b3b3;
}
.droplabels
{
    font-family: Lucida Fax, Georgia, Times New Roman, Serif;
	font-size: 70%;  
	text-transform: capitalize;
	color: #000;
}
#messages, #customers, #products, #orders, #staff, #categories, #images, #stock {
    width: 100%;
    font-size:1.4em;
    line-height:16px;
    padding: 0;
    margin: 0;
}
caption {
    padding: 0 0 5px 0;
    width: 400px;	 
    font: italic 11px "Segoe UI", "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    text-align: right;
}
#messages th tr.head, #customers th tr.head, #products th tr.head, #orders th tr.head, #staff th tr.head, #categories th tr.head, #images th tr.head, #stock th tr.head {
    font: bold 110% "Segoe UI", "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    color: #af1313;
    border: 1px solid #000;
    letter-spacing: 2px;
    text-transform: uppercase;
    text-align: left;
    padding: 6px 6px 6px 12px;
    background-color: #320404;
}

#messages th.nobg, #customers th.nobg, #products th.nobg, #orders th.nobg, #staff th.nobg, #categories th.nobg, #images th.nobg, #stock th.nobg {
    border-top: 0;
    border-left: 0;
    border-right: 1px solid #000;
    background: none;
}

#messages td, #customers td, #products td, #orders td, #staff td, #categories td, #images td, #stock td
{
	border: 1px solid #7E7E7E;
    /*border-right: 1px solid #C1DAD7;
    border-bottom: 1px solid #C1DAD7;*/
    background: #FFFFFF;
    vertical-align:top;
    padding: 6px 6px 6px 12px;
    color: #7E7E7E;
}
#messages td.alt, #customers td.alt, #products td.alt, #orders td.alt, #staff td.alt, #categories td.alt, #images td.alt, #stock td.alt {
    background: #FFFFFF;
    vertical-align:top;
    color: #868686;
}
#messages th.spec, #customers th.spec, #products th.spec, #orders th.spec, #staff th.spec, #categories th.spec, #images td.alt, #stock td.alt {
    border-left: 1px solid #131313;
    border-top: 0;
    background: #fff;
    font: bold 100% "Segoe UI", "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
}
#products a, #products a:visited
{
	color: #af1313;
	text-decoration: none;
	outline: none;	
}
#products a:hover
{
	text-decoration: underline;
}
.opac
{
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
}
.innerframe
{
	position:relative;
	height:150px;
	width:150px;
}
#frame
{
	position:absolute;
	z-index:1;
	width:150px;
	height:150px;
	filter:progid;
	visibility:visible;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/frame.png');	
}
.errorbubble
{
	border: solid 1px #630909;
	background-color: #f39f9f;
	font-size: 1.4em;
	line-height: 18px;
	color: #310707;
	width: 750px;
	position: relative;
	padding: 5px 5px 5px 5px;
	/*margin: 0px 0px 0px 10px;*/
}
.readme
{
	border: solid 1px #f2a332;
	background-color: #fcefdd;
	font-size: 1.4em;
	line-height: 18px;
	color: #202020;
	width: 100%;
	position: relative;
	padding: 5px 5px 5px 5px;
}
.instruct
{
	position:relative;
	line-height:18px;
	width:740px;
	font-size: 1.4em;
	padding: 10px;
	border: solid 1px #59aab9;
	background-color: #ccf2f9;
	color: #0b4a64;
}
div.first 
{
	border-top: solid 2px #131313;
	border-bottom: 1px dotted #ccc;
}
dl {
	clear: both;
	border-top: 1px dotted #eaeaea;
}
dl.first {
	border-top: none;
}
dl dt {
	float: left;
	color: #000;
	font-size: 1.4em;
	width: 200px;
	padding: 8px 10px 0 0;
}
dl dd {
	float: left;
	width: 500px;
	padding: 6px 0 6px 20px;
}
dt.error {
	color: #c3402f;
	font-size:1.4em;
	font-weight: bold;
}
dd.error {
	/*background: transparent url(../images/error_arrow.gif) no-repeat 0px 12px;*/
	font-size:1.4em;
}
dd.error input.textfield, dd.error input.password, dd.error select, dd.error textarea {
	background-color: #e1e1e1;
	border: 1px solid #ef5858;
}
input.textfield, input.password, textarea, select {
		width: 330px;
		color: #000;
		background-color: #e1e1e1;
		font: 1.4em Calibri, Segoe UI, Tahoma, Verdana, Trebuchet MS, sans-serif;
		padding: 4px;
		border: none;
}
input.textfieldsearch {
		width: 620px;
		color: #000;
		background-color: #e1e1e1;
		font: 2.5em Calibri, Segoe UI, Tahoma, Verdana, Trebuchet MS, sans-serif;
		padding: 5px;
		border: none;
}
.alreadyregistered
{
 position:relative;
 height:207px;
 width:304px;
 float:left;
 margin-left:60px;
 -moz-box-shadow: 2px  2px 3px #969696; /* for Firefox 3.5+ */
 -webkit-box-shadow: 2px 2px 3px #969696; /* for Safari and Chrome */
 filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=145, Strength=3);
}
.newuser
{
 position:relative;
 height:207px;
 width:304px; 
 float:left;  
 margin-left:25px;
 -moz-box-shadow: 2px  2px 3px #969696; /* for Firefox 3.5+ */
 -webkit-box-shadow: 2px 2px 3px #969696; /* for Safari and Chrome */
 filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=145, Strength=3);
}
.continueshopping, .viewbasket, .changemydetails, .logout
{
 position:relative;
 height:116px;
 width:232px; 
 float:left;  
 margin-left:10px;
 -moz-box-shadow: 2px  2px 3px #969696; /* for Firefox 3.5+ */
 -webkit-box-shadow: 2px 2px 3px #969696; /* for Safari and Chrome */
 filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=145, Strength=3);
}
.logout
{
    width:231px;
}
input.textfield-minified
{
  	color: #000;
	background-color: #e1e1e1;
	font: 0.9em Calibri, Segoe UI, Tahoma, Verdana, Trebuchet MS, sans-serif;
	padding: 4px;
	border: none;  
}