/* www.watermark.ie | screen styles */

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

* {margin: 0; padding: 0;}
hr {display: none;}

body {text-align: center; font-size: 62.5%; color: #111;
font-family: Arial, Helvetica, sans-serif; background: #f3f3f3;}

#wrapmain {background: #fff url("/site/img/top/bg1.jpg") center top no-repeat;}
#wrapbase {border-top: 1px solid #888; clear: both;}

#top, #main, #footer {text-align: left; vertical-align: middle; margin: 0 auto; width: 900px;}

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

a, a:link {color: #c41b27; background: url("/site/img/a/link.gif") left bottom repeat-x; text-decoration: none;}
a:visited {color: #c41b27;} /* to be changed */
a:hover {background: #c41b27; color: #fff;}
a:active {color: #888;} /* to be changed */

/* ========================================================= */
/* basic layout classes */
/* ========================================================= */

#main div.block {float: left; width: 336px; margin: 0 8px 0 0;}
#main div.aside {float: right; width: 212px;}
#main div.wide {clear: left; width: 678px; float: left;}
#main div.wider {clear: left; width: 688px; float: left;}
#main div.vessel {clear: left;}
#main div.bigblock {float: right; width: 556px;}
#main div.banner {background: #f3f3f3; border: 1px solid #ccc; margin-bottom: 40px;}
#main div.item {clear: left; width: 678px; float: left; margin: 0 0 10px 0;}
#main div.inset {float: right; margin: -7px 0 10px 10px;}
#main div.inset img {vertical-align: bottom; border: 1px solid #ccc;}
#main div.hack {clear: both; color: #fff; height: 24px;}
#main div.hack p {margin: 0;}

/* ========================================================= */
/* typography and repeated elements */
/* ========================================================= */

#main h2 {
	font-size: 1.6em;
	line-height: 16px;
	font-weight: normal;
	border-bottom: 1px solid #ccc;
	padding: 0 0 8px 0;
	margin: 0 0 6px 0;
	clear: left;
}

#main h2.bare {border-bottom: none; margin: 0; padding: 0 0 4px 0;}
#main h2.tall {margin-top: 51px;}
#main h2 span {color: #888; float: right;}
#main div.banner h2 {border-bottom: 1px solid #ccc; padding: 10px; margin: 0 0 10px 0;}
#main div.bigblock h2 {border-bottom: none; margin: 0; padding: 0 0 8px 0;}

#main div.banner p {margin-left: 10px; margin-right: 10px;}

#main h3 {
	border-bottom: 1px solid #ccc;
	padding: 0 0 5px 0;
	margin: 0 0 7px 0;
	clear: both;
}

#main h3.big {width: 677px; padding-top: 20px;}

#main p, #main li, #main dt, #main dd, #main h3
{font-size: 1.1em; line-height: 1.5em;}

#main p {margin: 0 0 9px 0;}
#main p.thin {margin: 0;}
#main p.cwid {text-align: right; font-size: 10px; color: #888; margin: 6px 0 0 0; padding: 2px 0 0 0;}

#main div.block h2, #main div.block h3, #main div.block p {margin-right: 2px;} /* workaround to let thumbs fit in block divs */

#main ul {list-style-type: none;}

#main ul li, #main dl dt {background: url("/site/img/li/main.gif") left top no-repeat; padding-left: 12px; font-weight: normal;}

#main dl dt {float: left; clear: left; width: 80px;}

#main dl dd {margin: 0 0 0 92px;}

#main ul.thumbs {padding-top: 4px;}
#main ul.thumbs li {background: none; padding: 0; float: left; margin: 0 2px 0 0;}

#main ul.thumbs li a img {border: 1px solid #c41b27; vertical-align: bottom;}
#main ul.thumbs li a:hover img {border: 1px solid #111;}

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

/* ========================================================= */
/* top */
/* ========================================================= */

#top {height: 130px;}

#top div#skipnav {position: absolute; top: -10000px;}

#top h1 {font-size: 10px; letter-spacing: -5px; text-align: center;}

#top h1 a {background: url("/site/img/other/logo.gif") left top no-repeat; width: 213px; height: 58px; float: left; margin: 26px 0 15px 0; color: #f3f3f3;}

/* ========================================================= */
/* top » nav */
/* ========================================================= */

#top ul {list-style-type: none; clear: both;}

#top ul li {
	float:left;
	margin:0 4px 0 0;
	padding:0 0 0 7px;
	border-bottom:1px solid #888;
	background: url("/site/img/nav/left.png") no-repeat left top;
}

#top ul li a {
	float:left;
	display:block;
	padding:8px 11px 6px 3px;
	text-decoration:none;
	font-size: 16px;
	line-height: 16px;
	color:#a41a2f;
	background:url("/site/img/nav/right.png") no-repeat right top;
}

#top ul li a:hover {color:#111;}

#top ul li.active {background-position:0 -150px; border-width:0;}

#top ul li.active a {background-position:100% -150px; padding-bottom: 7px; color:#111;}

#top ul li.active a:hover {color:#111;}

#top ul li:hover, #top ul li:hover a {background-position:0% -150px; color:#888;}

#top ul li:hover a {background-position:100% -150px;}

/* ========================================================= */
/* top » search */
/* ========================================================= */

#top div#search {float: right; width: 173px; text-align: right; margin: 2px 0 0 0;}
#top div#search p#searchtitle {float: left; margin: 5px 0 0 0; font-size: 1.1em;}
#search form input#searchtext {width: 95px; margin: 2px 0 0 0;}

/* ========================================================= */
/* main div » push down blocks to equalize with text */
/* ========================================================= */

#main div#eyecandy,
#main div#contact-box dl,
#main div.video,
#main div#focus-on img
{margin-top: 4px;}

/* ========================================================= */
/* breadcrumb */
/* ========================================================= */

#breadcrumb {clear: both; border-bottom: 1px solid #ccc; margin: 0 0 36px 0;}

#breadcrumb p {font-size: 10px; line-height: 10px; margin: 5px 0 5px 3px; color: #333;}

#unbreadcrumb {clear: both; border-bottom: 1px solid #fff; margin: 0 0 36px 0;}

#unbreadcrumb p {font-size: 10px; line-height: 10px; margin: 5px 0 5px 5px; color: #fff;}

/* ========================================================= */
/* contact box */
/* ========================================================= */

#main div#contact-box dl {
	padding: 14px 0 0 14px;
	height: 175px;
	background: url("/site/img/other/contact-box.gif") left top no-repeat;
}

#main div#contact-box dl dt {width: 50px;}

#main div#contact-box dl dd {margin: 0 0 3px 72px;}

/* ========================================================= */
/* front page » intro, focus-on */
/* ========================================================= */

#main div.video p, #main div#focus-on p {margin: 2px 2px 16px 2px;}
#main div#focus-on p p {background: #ccc;}
#main div.video {width: 332px; height: 187px;border: 1px solid #888;}
#main div#focus-on a img {border: 1px solid #c41b27; vertical-align: bottom;}

/* ========================================================= */
/* front page, inner page » logos */
/* ========================================================= */

#main div#logos ul.thumbs li {margin: 0 9px 0 0;}
#main div#logos ul.thumbs li.last {margin: 0;}

#main div.wide ul.thumbs li {margin: 0 9px 0 0;}
#main div.wide ul.thumbs li.last {margin: 0;}

/* ========================================================= */
/* front page » why, about-snippet */
/* ========================================================= */

#main div#about-snippet p {margin: 0;}

/* ========================================================= */
/* inner page » eyecandy */
/* ========================================================= */

#eyecandy {height: 242px;}
#eyecandy img {border: 1px solid #888; vertical-align: bottom;}

/* ========================================================= */
/* inner page » chunk */
/* ========================================================= */

div.chunk {float: left; width: 161px; margin: 0 10px 10px 0;}

div.chunk a img {border: 1px solid #c41b27; vertical-align: bottom;}

div#main div.chunk p {margin: 0; padding: 0;}

div#main img.contextual {float: right; border: 1px solid #888; margin: 3px 0 5px 10px;}

/* ========================================================= */
/* inner page » sitemap */
/* ========================================================= */

/*
#main div.wide div#sitemap {border: 1px solid #ccc; background: #f3f3f3;}
#main div.wide div#sitemap dl {margin: 20px;}
#main div.wide div#sitemap dl dt {float: left; width: 153px; font-weight: bold;}
#main div.wide div#sitemap dl dd {float: left; width: 153px; margin: 0; padding: 0 0 0 12px;}
*/

#main dl.sitemap dt {font-weight: bold; float: none; width: auto; padding: 1px 4px 6px 12px; margin: 3px 0 0 0;}
#main dl.sitemap dd {float: left; margin: 0; padding: 0 2px 4px 23px;}

/* ========================================================= */
/* inner page » coffee tips */
/* ========================================================= */

#main div.tip {border-bottom: 1px solid #ccc; margin: 2px 0 11px 0; padding: 0 0 4px 0;}


/* ========================================================= */
/* inner page » next-prev links */
/* ========================================================= */

#main div#nextprev {border-top: 1px solid #ccc; text-align: right; margin: 9px 0 0 0; padding: 6px 0 0 0; clear: both;}
#main div#nextprev p.hover {float: left;}

/* ========================================================= */
/* inner page » contact page form */
/* ========================================================= */

#main form, .zemThanks {background: #f3f3f3; margin: 6px 0 0 0; padding: 6px 2px 6px 10px; border: 1px solid #ccc; font-size: 11px; line-height: 15px;}
#main form legend {display: none;}
#main form fieldset {border: none;}
#main form textarea {font-size: 11px; line-height: 15px; width: 300px;}

/* ========================================================= */
/* inner page » contact page map */
/* ========================================================= */

#map {border: 1px solid #ccc;}

#map iframe {vertical-align: bottom;}


/* ========================================================= */
/* inner page » other stuff » search results */
/* ========================================================= */

div.result {background: #f3f3f3; padding: 10px; border: 1px solid #ccc; margin: 10px 0 0 0;}

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

#footer {text-align: right; font-size: 1.1em; margin-top: 6px; margin-bottom: 7px; padding: 0 2px 0 2px;}

#footer p#sublinks {float: left; text-align: left;}

/* ========================================================= */
/* mediaboxAdvanced styles */
/* ========================================================= */

#mbOverlay {position: fixed; z-index: 9998; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; cursor: pointer;}

#mbOverlay.mbOverlayFF {
	background: transparent url(/site/img/mb/80.png) repeat;
}

#mbOverlay.mbOverlayIE {
	position: absolute;
}

#mbCenter {
	position: absolute;
	z-index: 9999;
	left: 50%;
	overflow: hidden;
	background-color: #000;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-box-shadow: 0px 10px 40px rgba(0,0,0,0.70);
	-webkit-box-shadow: 0px 10px 40px rgba(0,0,0,0.70);
}

#mbCenter.mbLoading {
	background: #000 url(/site/img/mb/loading.gif) no-repeat center;

/*	This style is applied only during animation.	*/
/*	For example, the following turns off shadows,	*/
/*	helping browser performance on slow systems.	*/
/*	To leave shadows on, just remove these lines:	*/
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
}

#mbImage {
	position: relative;
	left: 0;
	top: 0;

/*	Begin styles for inline content, if no style is given	*/

	font-family: Arial, Helvetica, sans-serif;
	line-height: 20px;
	font-size: 11px;
	color: #fff;
	text-align: left;
	background-position: center center;
	background-repeat: no-repeat;
	padding: 10px;
}

#mbImage a, #mbImage a:link, #mbImage a:visited {
	color: #ddd;
}

#mbImage a:hover, #mbImage a:active {
	color: #fff;
}

/*	End inline content styles	*/

#mbBottom {
	min-height: 20px;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 20px;
	font-size: 11px;
	color: #999;
	text-align: left;
	padding: 0 10px 10px;
}

#mbTitle {
	display: inline;
	color: #fff;
	font-weight: bold;
	line-height: 20px;
	font-size: 11px;
}

#mbNumber {
	display: inline;
	color: #999;
	line-height: 14px;
	font-size: 10px;
	margin: auto 10px;
}

#mbCaption {
	display: block;
	color: #999;
	line-height: 14px;
	font-size: 11px;
}

#mbPrevLink, #mbNextLink, #mbCloseLink {
	display: block;
	float: right;
	height: 20px;
	margin: 0;
	outline: none;
}

#mbPrevLink {
	width: 69px;
	background: transparent url(/site/img/mb/prev.png) no-repeat center;
}

#mbNextLink {
	width: 41px;
	background: transparent url(/site/img/mb/next.png) no-repeat center;
}

#mbCloseLink {
	width: 46px;
	background: transparent url(/site/img/mb/close.png) no-repeat center;
}

/*	Styles for flash version alert	*/

#mbError {
	position: relative;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 20px;
	font-size: 11px;
	color: #fff;
	text-align: center;
	border: 10px solid #700;
	padding: 10px 10px 10px;
	margin: 20px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

#mbError a, #mbError a:link, #mbError a:visited, #mbError a:hover, #mbError a:active {
	color: #d00;
	font-weight: bold;
	text-decoration: underline;
}

/* www.watermark.ie | screen styles | end */