/* www.gaggia.ie - screen styles */

/* ========================================================= */
/* resets */
/* ========================================================= */

html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td
{margin: 0; padding: 0; border: 0; outline: 0; font-style: inherit; font-size: 100%; vertical-align: baseline;}
ol, ul {list-style: none;}

/* ========================================================= */
/* basics */
/* ========================================================= */


body {font-size: 62.5%; font-family: Helvetica, Arial, Sans-Serif; text-align: center; background: #fff url(bg/body/bg0.jpg) center top;
/* background: #fff url(bg/body/rotate.php) center top; */ color: #000; padding: 0 0 86px 0; /* space below footer */}
#wrap {vertical-align: middle; margin: 0 auto; text-align: left;width: 960px;position:relative;}

div.block, div.blockStatic, div.blockFluid {clear: both; float: left; width: 960px; margin: 0 0 10px 0;}
div.block {background: none;}
div.blockStatic, div.blockFluid {background: url(bg/tiles/blocks.gif) left top repeat-y;}
div.blockStatic {height: 260px;}

div.minor {background: #fff; float: left; width: 336px; /* +20px padding = 356px total */ padding: 8px 10px 0 10px; margin-right: 10px;}
div.major {background: #fff; float: left; width: 574px; /* +20px padding = 594px total */ padding: 8px 10px 0 10px;}
div.hanger {
		background: #fff;
		float: right;
		width: 574px; /* +20px padding = 594px total */
		padding: 0 10px 0 10px;
		height: 29px;
		text-align: right;
		padding: 0 10px 0 10px;
}


div#troika {float: left; width: 594px;}

div#troika div.troikette {background: #fff; float: left; width: 177px; height: 200px; margin: 0 0 1px 1px; padding: 8px 10px 0 10px; /* +20px padding = 197px total */}

div.block div.minor {height: 260px;position:relative;}

/* ========================================================= */
/* links */
/* ========================================================= */

a, a:link {color: /* #ed1c24; */ #b4141a; background: url(bg/a/link.gif) left bottom repeat-x; text-decoration: none;}
a:visited {color: #ed1c24;}
a:hover {/* background: #ed1c24; color: #fff; */ background: url(bg/a/hover.gif) left bottom repeat-x;}
a:active {color: #888;}

/* ========================================================= */
/* typography and lists */
/* ========================================================= */

h2 {font-size: 1.4em; margin: 0 0 9px 0; font-weight: normal; clear: both;}
h2.tall {padding: 10px 0 0 0;}

/* order now red title headers, thank you message */
h2.attention {background: #b4151b; color: #fff; padding: 10px; text-align: center; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
h2.shout {clear: both; float: left; width: 320px; margin: 10px 0 0 0; padding: 9px 2px 9px 10px; border: 1px solid #ccc; background:#eee;}

/* hub page prices */
p.attention {background: #b4151b; color: #fff; padding: 3px 6px 3px 6px; margin: 5px 6px 0 0; float: left; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; font-weight: bold;}

p, ul, dl, blockquote, cite {font-size: 1.1em; line-height: 1.6em; margin: 0 0 9px 0; list-style-type: none;}
ul li {padding-left: 9px; background: url(bg/other/li.gif) left top no-repeat;}

/* front > testimonial quotes */
dl.quotes dt {background: url(/site/styles/bg/other/li.gif) left top no-repeat; padding-left: 12px;}
dl.quotes dd {text-align: right; margin: 0 0 6px 0; font-weight: bold;}

/* front > cute images */

a img.cute {float: right; margin: 2px 0 5px 7px; border: 1px solid #b4141a;}
img.aside {float: right; margin: 2px 0 5px 7px; border: 1px solid #666;}
img.aside2 {float: right; margin: 2px 0 5px 7px; border:none;}

/* front > hanger areas */
div.block div.hanger p {padding: 6px 0 0 0;}
div.block div.hanger p.pagination {float: left; text-align: left; padding: 3px 0 0 0;}
div.block div.hanger img {vertical-align: bottom;}

/* front > troika */
div#troika h2 {background: #fff; padding: 8px 10px 6px 10px; margin: 0 0 1px 0;}

/* inner > technical info lists */
dl.info dt {font-weight: bold; float: left; width: 173px; clear: both; color: #666;}
dl.info dd {margin-left: 178px; margin-bottom: 4px;}
dd.yes {background: url(/site/styles/bg/other/tick.png) left top no-repeat; padding-left: 14px; font-weight: bold;}

/* inner > call-to-action buttons */
p.order, p.quotation {display:block; text-indent:-9999px;}
p.order a, p.quotation a {float:left; width:250px; height: 50px; margin: 20px 0 20px 43px;}
p.order a {background:transparent url(/site/styles/bg/other/order.gif) no-repeat top left;}
p.quotation a {background:transparent url(/site/styles/bg/other/quotation.gif) no-repeat top left;}
p.order a:hover, p.quotation a:hover {background-position:0 -50px;}

/* inner > colorbox-initiating thumbnails */
ul.machine {padding: 0; margin: 0;}
ul.machine li {background: none; padding: 0; margin: 3px 2px 0 1px; float: left;}
ul.machine li a img {vertical-align: bottom; border: 1px solid #b4141a;}

/* inner > icon lists */
ul.icons {padding: 0;}
ul.icons li {margin: 0 0 10px 0; clear: both; background: none; padding: 0;}
ul.icons li img {vertical-align: bottom; float: left; margin: 0 10px 12px 0; clear: both;}

/* inner > blockquotes */
blockquote {background: #d0d0d0; padding: 17px 20px 17px 20px; border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px;}
img.inset {float: right; margin: 20px 20px 5px 20px; vertical-align: bottom; border: 1px solid #666;}
cite {font-weight: bold; display: block; margin: 0 0 30px 30px;}

/* ========================================================= */
/* top */
/* ========================================================= */
#navhome {/*width:40px;*/}
div#cartbuttons {margin: 40px 10px 0 0;width:300px;float:right;text-align:right;}
#cartbuttons11 {
	position:relative;
	right:0;
	top:0px;
	width:280px;
	height:40px;
	text-align:right;
}	
	
#cartbuttons a {
	margin:0 0 0 8px;
}

#cartbuttons #account {
	background:url('bg/cart/my-account.png') no-repeat;
	padding:20px 40px 20px 40px;
}

#cartbuttons #account:hover {
 background:url('bg/cart/my-account-hover.png') no-repeat;
}

#cartbuttons #cart {
	background:url('bg/cart/my-cart.png') no-repeat;
	padding:20px 40px 20px 40px;
}

#cartbuttons #cart:hover {
 background:url('bg/cart/my-cart-hover.png') no-repeat;
}

#cartbuttons #checkout {
	background:url('bg/cart/my-checkout.png') no-repeat;
	padding:20px 40px 20px 40px;
}

#cartbuttons #checkout:hover {
 background:url('bg/cart/my-checkout-hover.png') no-repeat;
}
div#top {margin: 32px 0 10px 0;}
div#top div.minor {background: url(bg/tiles/bg85-1x1.png); color: #000; height: 262px;}
div#top div.minor h1 a {background: url(bg/other/gaggia.png) left top no-repeat; float:left; width: 337px; height: 152px; margin: 0 0 51px 0;}
div#top div.minor h1 a span {display: none;}

div#top div.major {padding: 0; margin: 0;}
div#top div.major img {border: 1px solid #000; vertical-align: bottom;}

#ssp {float: right; width: 592px; height: 268px; border: 1px solid #000; z-index: 50;}


#nav {background: #fff;}
#nav ul li {background: none; float: left; padding: 0;}
#nav ul li a {
		padding: 12px;
		margin: 0 1px 0 0;
		float: left; 
		background: url(/site/styles/bg/top/li.gif) center bottom no-repeat;
		font-size: 13px; 
		color: #b4141a;
}
#nav ul li a:hover {color: #fff; background: #b4141a url(/site/styles/bg/top/li2.gif) center bottom no-repeat;}

/* b4141a */

/* ========================================================= */
/* stepcarousel */
/* ========================================================= */
div.rinoth{
float:left;
width:594px;
height:270px;
background-color:#ffffff;
}

div.stepcarousel {
		position: relative; overflow: scroll; /* do not touch */
		width: 532px;
		margin: 0 0 1px 0;
		border-left: 31px solid #fff;
		border-right: 31px solid #fff;
		float: left;
		height: 238px;
}

div.stepcarousel ul.belt {position: absolute; left: 0; top: 0;}

div.stepcarousel li.panel {
		float: left; /* do not touch */
		overflow: hidden; /* clip content that go outside holding panel div */
		margin: 0 0 1px 1px;
		background: url(bg/tiles/panel-176x1.gif) left top repeat-y;
		width: 157px; /* +20px padding = 177px total */
		height: 238px;
		text-align: center;
		padding: 0 10px 0 10px;
}

div.stepcarousel li.panel div {height: 200px;}
div.stepcarousel li.panel div.gap30 {margin: 10px 0 0 0; height: 190px;}
div.stepcarousel li.panel div.gap40 {margin: 20px 0 0 0; height: 180px;}
div.stepcarousel li.panel div.gap40a {margin: 20px 0 0 0; height: 180px;}
div.stepcarousel li.panel div.gap60 {margin: 35px 0 25px 0; height:140px;}
div.stepcarousel li.panel div.gap60a {margin: 35px 0 25px 0; height:140px;}
div.stepcarousel li.panel div.gap70 {margin: 45px 0 25px 0; height:130px;}
div.stepcarousel li.panel div.gap80 {margin: 55px 0 25px 0; height:120px;}

div.stepcarousel li.panel div.gap40a a img {margin: 0 0 0 0; vertical-align: bottom; background: none;}
div.stepcarousel li.panel div.gap60a a img {margin: 0 0 0 0; vertical-align: bottom; background: none;}
div.stepcarousel li.panel a img {margin: 30px 0 0 0; vertical-align: bottom; background: none;}
div.stepcarousel li.panel div a {background: none;}
div.stepcarousel li.panel h3 {font-size: 1.3em; font-weight: normal;}
div.stepcarousel li.panel h3.long {letter-spacing: -1px;}


/* ========================================================= */
/* hub */
/* ========================================================= */

/*
.hub {border-top: 1px solid #666; clear: both; padding: 25px 0 0 0; margin-bottom: 25px;}
.hub h2 {clear: none; padding-top: 2px;}
.hub a img.cute {margin: 2px 0 25px 20px; padding: 5px 15px 5px 15px;}
*/

.hub {width: 277px; height: 220px; float: left; margin: 0 5px 0 5px; padding: 15px 0 5px 0; border-top: 1px solid #666;}
.hub a img.cute {/* margin: 2px 0 25px 20px; */ padding: 5px 10px 5px 10px;}


/* ========================================================= */
/* big image and overlay */
/* ========================================================= */
#service_repeir_box{background:url(/site/styles/bg/other/service_repeir.png) 0 0 repeat;position:absolute; right:5px; top:165px;height:94px; width:95px;z-index:50;}
#service_repeir_box a{display:block; height:94px; width:95px;outline:none;border:none;background:none;}
#special_offer_box{background:url(/site/styles/bg/other/special-offer.png) 0 0 repeat;position:absolute; left:370px; top:420px;height:138px; width:138px;z-index:50;}
#special_offer_box a{display:block; height:138px; width:138px;outline:none;border:none;background:none;}
div.sigh {background: #fff; float: left; width: 574px; /* +20px padding = 594px total */ padding: 8px 10px 0 10px; position: relative; text-align: center;}

div.sigh img#underimage {z-index: 32; position: relative; margin: 22px 0 30px 0; vertical-align: bottom;}

div.sigh div.overlay {z-index: 100; position: absolute; right: 45px; top: 415px;}

div.sigh div.overlay p, div.sigh div.overlay ul {width: 210px; height: 41px; margin: 0; background: url(/site/styles/bg/other/tag.png) left top no-repeat; color: #fff; padding: 9px 0 0 0;}

div.sigh div.overlay p span {font-size: 20px;}

div.sigh div.overlay ul {padding: 8px 0 0 0; height: 42px;}
div.sigh div.overlay li {background: none; padding: 0; font-size: 14px;}

/* ========================================================= */
/* footer */
/* ========================================================= */

#footer {background: #fff; padding: 10px; width: 940px; height: 250px; clear: both;}

#footer div#branding {float: left; width: 341px; height: 235px;}
#footer div#branding a {background: none;}

#footer div#linking {float: left; width: 589px; margin: 0 0 0 10px;}
#footer div#linking div.slot {float: left; width: 135px; margin: 0 0 0 5px;}
#footer div#linking div.slot ul li#twitter {background:url(/site/styles/bg/other/twitter.png) left top no-repeat; padding-left: 20px;}
#footer div#linking div.slot ul li#flickr {background:url(/site/styles/bg/other/flickr.png) left top no-repeat; padding-left: 20px;}
#footer div#linking div.slot ul li#youtube {background:url(/site/styles/bg/other/youtube.png) left top no-repeat; padding-left: 20px;}
#footer div#linking div.slot p {font-weight: bold; border-bottom: 1px solid #666;}

#footer div#base {clear: both; text-align: right;}
#footer div#base p {padding: 0;}
#footer div#base p#flank {float: left;}

/* ========================================================= */
/* forms */
/* ========================================================= */

form {clear: both; float: left; width: 312px; margin: 10px 0 10px 0; padding: 9px 10px 9px 10px; border: 1px solid #ccc; font-size: 11px; line-height: 15px; background:#eee;}

form input, form textarea {
	background: #d5d5d5;
	padding: 1px;
	margin: 5px 0 0 0;
	color: #333;
	font-family: Arial, Helvetica, sans-serif;
}

form textarea {font-size: 11px;}

form span {width: 100px; float: left; margin-top: 7px; font-weight: bold;}
form span em {color: #f00;}

form input#send {font-size: 14px; padding: 5px; width: 150px; font-weight: bold;}

/* ========================================================= */
/* map */
/* ========================================================= */

#map {background: #666; width: 572px; height: 321px; text-align: center; margin: 0 0 10px 0; padding: 1px 0 0 0;}

/* ========================================================= */
/* colorbox styles */
/* ========================================================= */

/*  colorbox core styles -- avoid changing this area, to maintain compatability with future versions of colorbox. */
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:hidden;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

/* other colorbox styles -- tabbed to follow order/nesting of generated html */
#cboxOverlay{background:url(/site/styles/bg/cb/overlay.png) 0 0 repeat;}
#colorbox{}
    #cboxTopLeft{width:21px; height:21px; background: url(bg/cb/controls.png) -100px 0 no-repeat;}
    #cboxTopRight{width:21px; height:21px; background:url(bg/cb/controls.png) -129px 0 no-repeat;}
    #cboxBottomLeft{width:21px; height:21px; background:url(bg/cb/controls.png) -100px -29px no-repeat;}
    #cboxBottomRight{width:21px; height:21px; background:url(bg/cb/controls.png) -129px -29px no-repeat;}
    #cboxMiddleLeft{width:21px; background:url(bg/cb/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(bg/cb/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(bg/cb/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(bg/cb/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0px; background:url(bg/cb/controls.png) -75px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious.hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(bg/cb/controls.png) -50px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext.hover{background-position:-50px -25px;}
        #cboxLoadingOverlay{background:url(bg/cb/loading_background.png) center center no-repeat;}
        #cboxLoadingGraphic{background:url(bg/cb/loading.gif) center center no-repeat;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(bg/cb/controls.png) -25px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose.hover{background-position:-25px -25px;}

/*
    png-transparency fixes for IE6.  
    It is also necessary for png-transparency in IE7 & IE8 to avoid 'black halos' with the fade transition
    
    Since this method does not support CSS background-positioning, it is incompatible with CSS sprites.
    Colorbox preloads navigation hover classes to account for this.
    
    !! Important Note: AlphaImageLoader src paths are relative to the HTML document,
    while regular CSS background images are relative to the CSS document, so all links here are site root links.
*/
.cboxIE #cboxTopLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/site/styles/bg/cb/ie/borderTopLeft.png, sizingMethod='scale');}
.cboxIE #cboxTopCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/site/styles/bg/cb/ie/borderTopCenter.png, sizingMethod='scale');}
.cboxIE #cboxTopRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/site/styles/bg/cb/ie/borderTopRight.png, sizingMethod='scale');}
.cboxIE #cboxBottomLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/site/styles/bg/cb/ie/borderBottomLeft.png, sizingMethod='scale');}
.cboxIE #cboxBottomCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/site/styles/bg/cb/ie/borderBottomCenter.png, sizingMethod='scale');}
.cboxIE #cboxBottomRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/site/styles/bg/cb/ie/borderBottomRight.png, sizingMethod='scale');}
.cboxIE #cboxMiddleLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/site/styles/bg/cb/ie/borderMiddleLeft.png, sizingMethod='scale');}
.cboxIE #cboxMiddleRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/site/styles/bg/cb/ie/borderMiddleRight.png, sizingMethod='scale');}

/* home page pop up */

#mask {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 9000;
  background-color: #000;
  display: none;
}
 
#boxes .window {
  position: absolute;
  left: 0;
  top: 0;
  width: 440px;
  height: 200px;
  display: none;
  z-index: 9999;
  padding: 20px;
  border-radius: 15px;
  text-align: center;
  border:6px solid #B4141A;
}
 
#boxes #dialog {
  width: 750px;
  height: 460px;
  padding: 10px;
  background-color: #ffffff;
  font-family: 'Segoe UI Light', sans-serif;
  font-size: 15pt;
  font-weight:bold;
}

#boxes #dialog h2 {
  font-weight:bold;
}  
 
#popupfoot {
  font-size: 16pt;
  position: absolute;
  bottom: 10px;
  width: 250px;
  left: 250px;
}