/***********************************************************
Global CSS for Smiggle :: Davide L Rizzo :: Created 20/05/08
***********************************************************/

@import "/css/reset.css";
@import "/css/header.css";
@import "/css/nav.css";     /* needed on every page? */
@import "/css/footer.css";


/* Global Tags 
**************************/

html { 
	width:100%; 
	height:100%;
	overflow-y: scroll; /* Always show scrollbars */
}

body {
	margin: 0;
	font-size: 80%;
	font-family: Trebuchet MS, Helvetica, Arial, sans-serif;
	background: #eaebec;
	color: #777;
}


h1, h2, h3, h4, h5, h6 {
	margin: 1em 0 0.3em 0;
	font-weight: bold;
	color: #666;
}

h1 {
	margin-top: 0;
	font-weight: normal;
	font-size: 200%;
	color: #333;
}

h2 {
	margin-top: 0.6em;
	font-size: 140%;
}

h3 {
	font-size: 120%;
}


p {
	margin-bottom: 1em;
}

ul {
	margin: 0 0 1em 2em;
}

ol {
	margin: 0 1em 1.5em 2.2em;
}

li {
	margin-bottom: 0.3em;
}

a {
	color: #1061b6;
	text-decoration: none;
}

a:hover, a:focus, a:active {
	color: #479df7;
	text-decoration: underline;
	outline: none;
}

a img {
	border: none;
}

p {

}

p a {
	text-decoration: underline;
}

p a:hover, p a:focus, p a:active {
	text-decoration: none;
}

/* Use this tag for special words which needs capitalisation,  */
/* add a title to further explain its meaning.   */
acronym, abbr {
	text-transform: none;
	cursor: help;
	border-bottom: dotted 1px #DDD;
}

hr {
	border: none;
	border-top: dashed 1px #CCC; 
	color:#FFFFFF;
	margin: 1.8em 2em;
}

blockquote {
	padding: 0 2em 1em 2em;
}

pre {
	font-size: 140%;
	_font-size: 100%;
}


table {
	margin-bottom: 1.5em;
	border-top: solid 1px #B4B4B4;
	border-left: solid 1px #B4B4B4;
	border-bottom: solid 1px #B4B4B4;
	background: #fbfbfe;
	color: #666;
}

table caption {
	text-align: left;
	font-size: 110%;
	margin-top: 1.2em;
	padding-bottom: 0.3em;
	font-weight: bold;
	text-transform: uppercase;
	color: #444;
	font-size: 90%;
}

table th {
	border-bottom: solid 1px #B4B4B4;
	font-weight: bold;
	text-align: left;
	background: #CCC;
	color: #333;
	text-transform: uppercase;
}

table td, table th{
	border-right: solid 1px #B4B4B4;
	margin: 0;
	padding: 0.2em 0.7em;
	vertical-align: top;
}

table td.currency {
	text-align: right;
	white-space: nowrap;
}

table td.odd {
	background: #F3F3F3;
}

table.reciept {
	width: 100%;
}

/* unstlyled tables */
table.blank,
table.blank th,
table.blank td,
table.blank td.odd {
	border: none;
	background: none;
}

object {
	outline:none;
}


/* Wrapper Classes
************************************/
#middle {
	margin: 0 auto;
	width: 980px;
	_width: 988px;
}

.withnav {
	 margin-left: 150px;
	 _width:830px;
}

#content {
	background: white;
}

.withpadding {
	padding: 10px 15px;
}

/* IE6 wrapper dimensions*/ 
.withnav #content {
	_width:792px;
}

.home #middle {
	_width:980px;
}



/* Shadow */
.shadow-left { background: url(/images/global/shadow_left.gif) repeat-y left; height:1%; }
.shadow-bottom { background: url(/images/global/shadow_bottom.gif) repeat-x bottom; }
.shadow-right { background: url(/images/global/shadow_right.gif) repeat-y right; }
.shadow-top { background: url(/images/global/shadow_top.gif) repeat-x top; }
.shadow-topleft { background: url(/images/global/shadow_topleft.gif) no-repeat top left; }
.shadow-topright { background: url(/images/global/shadow_topright.gif) no-repeat top right; }
.shadow-bottomleft { background: url(/images/global/shadow_bottomleft.gif) no-repeat bottom left; }
.shadow-bottomright { background: url(/images/global/shadow_bottomright.gif) no-repeat bottom right; padding: 4px; }



/* Popup wrappers
*******************************/
.popup #header {
	margin: 0 auto;
	text-align: center;
	width: 738px;
	_width: 718px;
}

.popup #middle {
	width: 738px;
	_width: 718px;
	padding: 1em 0;
}

.popup #content {
	width: 700px;
	_width: 710px;
}




/* Menu
************************************/
.menu {
	padding: 0;
	margin: 0;
}

.menu li {
	display: inline;
	margin: 0;
	padding: 0;
	border-right: solid 1px #d8d5d5;
}

.menu li.last-child,
.menu li:last-child {
	border-right: none;
}

.menu li a {
	padding: 0 0.8em 0 0.5em;
	*padding: 0 0.5em 0 0.8em;
	text-transform: uppercase;
	font-weight: bold;
	color: #414141;
	font-size: 90%;
	white-space: nowrap;
}

.menu li a:hover {
	color: #1061b6;
	text-decoration: none;
}

.menu li.active a {
	color: #aa1426;
}



/* Hotkeys  
************************************/
.hotkey {
	_width:1%;
	float: left;
}
.hotkey img {
	height:100%;
	width:100%;
}
.hotkey.no-link img {
	height:125px;
	width:972px;
}
.hotkey a {
	display:block;
	height: 125px;
}
.hotkey a:hover {
	border: solid 3px white;
	height: 119px;
}

/* Hotkey sizes */
.hotkey.small a {
	width: 237px;
}
.hotkey.small a:hover {
	width: 231px;
}

.hotkey.smallish a {
	width: 332px;
}
.hotkey.smallish a:hover {
	width: 326px;
}

.hotkey.mid a {
	width: 482px;
}
.hotkey.mid a:hover {
	width: 476px;
}

.hotkey.large a {
	width: 727px;
}
.hotkey.large a:hover {
	width: 721px;
}

.hotkey.huge a {
	width: 972px;
}
.hotkey.huge a:hover {
	width: 966px;
}

.hotkey.hugeish a {
	width: 822px;
}
.hotkey.hugeish a:hover {
	width: 816px;
}

/*slider hotkeys*/
.hotkey.huge-slider a {
	width: 912px;
}
.hotkey.huge-slider a:hover {
	width: 906px;
}





/* Common Classes
************************************/

/* Special text (ie, Sale, sold out, reduced price etc...) */
.special {
	color: #aa1426;
	font-weight: bold;
}

/* All phone numbers format */
.phone {
	white-space: nowrap;
	color: #b1655b;
}

ul.linklist {
	list-style-image: url(/images/global/arrow_bullet_right_grey.gif);
}

.screenreader {
	position: absolute;
	top: -10000px;
	left: -10000px;
}

.decoration-image {
	float:right;
	margin-left:15px;
	margin-bottom:5px;
}


/* Break, splits content and pins backgrounds */
.break {
	clear: both;
}


/* A boxlink is <a> tag which contains multiple elements */
.boxlink {
	display: block;
	border: dashed 1px #d1d7e0;
	background: #f3f4f6;
}
.boxlink:hover, .boxlink:focus, .boxlink:active {
	border: solid 1px #d1d7e0;
	background: #edf1f6;
	text-decoration: none;
}

.captiondesc {
	font-size: 80%;
	font-weight:normal;
	
}


#flash {
	position:relative;
	z-index:1;
}