/*
Theme Name: Alan Williams & Co
Author: Horizon Digital Media Ltd
*/

@import url(http://fonts.googleapis.com/css?family=Ubuntu:300);

/* default elements */
html { height:100%; }
body {
	margin:0; padding:0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.8em;
	color:#333;
	background:url(images/bg.jpg) no-repeat center top #2b9c98 fixed;
	height:100%;
}
p { line-height:1.4em; margin:0 0 0.7em 0; }
ul { margin:0 0 1em 1em; padding:0; list-style:disc; }
li { margin:0 0 0 1.5em; padding:0 0 0.5em 1em; line-height:1.3em; }
a { text-decoration:none; color:#2b9c98; font-weight:normal; }
a:hover { text-decoration:underline; }
img { border:0; }

/* texts */
h1, .h1 {
	margin:0 0 0.5em 0; padding:0;
	font-family:Ubuntu, Arial, Helvetica, sans-serif;
	font-size:1.9em;
	font-weight:normal;
	line-height:1em;
	color:#2b9c98;
}
h2 {
	margin:1em 0 0.5em 0; padding:0;
	font-family:Ubuntu, Arial, Helvetica, sans-serif;
	font-size:1.3em;
	font-weight:normal;
	line-height:1em;
}
.big { font-size:1.33em; }
.small { font-size:0.83em; }

/* general classes */
.center { text-align:center; }
.hide { display:none; }
.alignleft { float:left; }
.alignright { float:right; }
.clear { clear:both; }
.caps { text-transform:uppercase; }
/* forms */
input { font-family:Arial, Helvetica, sans-serif; font-size:1em; font-weight:bold; padding:2px; }
textarea { font-family:Arial, Helvetica, sans-serif; font-size:1em; font-weight:bold; padding:2px; vertical-align:top; }
select { font-family:Arial, Helvetica, sans-serif; font-size:1em; font-weight:bold; padding:2px; vertical-align:bottom; }

fieldset { margin:0; padding:0; border:0; }
fieldset legend { display:none; }
fieldset ul { margin:0; list-style:none; }
fieldset li { margin:0; background:none; padding:3px 0 3px 0; }
fieldset label { display:block; }
fieldset li.checklist input { float:left; width:2em !important; margin-left:2.5em; }
fieldset li.checklist label { display:block; text-align:left; width:auto; margin:0; overflow:hidden; }
fieldset li.inline { display:inline-block; }

#msg ul { margin-bottom:0.5em; list-style:none; }
#msg ul.error li { background:url(http://horizontestserver.co.uk/assets/icons/ico-err.gif) 0 50% no-repeat;color:red;line-height:2em;padding-left:30px;}
#msg ul.report li { background:url(http://horizontestserver.co.uk/assets/icons/ico-suc.gif) 0 50% no-repeat;color:green;line-height:2em;padding-left:30px;}
label.error { color:red; }
input.error { background:url(http://horizontestserver.co.uk/assets/icons/ico-errsm.gif) no-repeat 99% 50%; border:1px solid red; padding:4px; }
textarea.error { background:url(http://horizontestserver.co.uk/assets/icons/ico-errsm.gif) no-repeat 99% 5%; border:1px solid red; padding:4px; }
.loader { display:none; padding:0 0 0 20px; background:url(http://horizontestserver.co.uk/assets/icons/ico-loader.gif) 0 0 no-repeat; }

/* page layout style */
#page { width:820px; min-height:100%; margin:0 auto; padding:35px 80px 40px 80px; background:#fff; clear:both; }

#top { margin:0 0 40px 0; overflow:hidden; }
#top h1 { margin:3px 0 0 0; padding:0; float:left; }
#top h1 a { display:block; width:338px; height:95px; background:url(images/logo-1.jpg) no-repeat; }
#top h1 strong { display:none; }
#top-strap { float:right; width:450px; margin:0px 0 0 0; text-align:right; }
#top-strap h2 { text-transform:lowercase; margin:0 0 7px 0; }
#top-strap p { margin:0 0 14px 0; font-family:Ubuntu, Arial, Helvetica, sans-serif; font-size:1.15em; line-height:1em; color:#2b2f88; }
#top-strap fieldset, #top-strap form, #top-strap input { display:inline; vertical-align:middle; }
#top-strap input { margin:0 0 2px 0; padding:5px; height:17px; border:1px solid #999; }
#top-strap input.submit { height:auto; padding:0; border:none; }

#menu { margin:0 0 15px 0; padding:4px 0; border-top:1px dotted #2b9c98; border-bottom:1px dotted #2b9c98; }
#menu ul { margin:0; padding:0; list-style:none; }
#menu li { margin:0 14px; padding:0; display:inline; }
#menu a { display:inline-block; color:#333; font-family:Ubuntu, Arial, Helvetica, sans-serif; text-transform:uppercase; padding:4px 6px; }
#menu a:hover { text-decoration:none; }
#menu a.active { background:#2b9c98; color:#fff; }

#banner-parent { margin:0 0 25px 0; width:820px; height:225px}
#banner { width:217px; height:179px; overflow:hidden; background: rgb(0, 0, 0); background: rgba(0, 0, 0, 0.6); padding:23px; color:#fff; float:right; font-size:1.1em; font-family:Ubuntu, Arial, Helvetica, sans-serif; }

#cycle { margin:-10px 0 25px 0; width:820px; height:145px; border-top:1px dotted #2b9c98; border-bottom:1px dotted #2b9c98; position:relative; }
#cycle-window { width:820px; height:145px; overflow:hidden; }
#cycle-full { width:5000px; }
#cycle-prev, #cycle-next { width:28px; height:111px; top:15px; position:absolute; display:block; }
#cycle-prev { left:-28px; background:url(images/arr-1.png) no-repeat left; }
#cycle-next { right:-28px; background:url(images/arr-1.png) no-repeat right; }

#cycle div.i { float:left; padding:8px; text-align:center; width:110px; } 
#cycle div.i a { color:#333; }
#cycle div.i a:hover { text-decoration:none; }
#cycle div.i img { width:110px; }

#cycle div.i div.j { display:none; padding:25px; background:#2b9c98; width:380px; color:#fff; border:2px solid #fff; position:absolute; top:-225px; left:-190px; }
#cycle div.i div.j div { overflow:hidden; }
#cycle div.i div.j img { float:right; margin:0 0 0 10px; width:170px; height:170px; }
#cycle div.i div.j div:after { 
	border-color: #2c9c98 transparent;
	border-style: solid;
	border-width: 25px 25px 0;
	bottom: -20px;
	content: "";
	display: block;
	right: 190px;
	position: absolute;
	width: 0;
}
#cycle-full .show {display: none;}
#content-left { float:left; width:530px; padding:0 25px 0 0; border-right:1px dotted #2b9c98; }
#content-left p:first-child, .pfirst { font-family:Ubuntu, Arial, Helvetica, sans-serif; font-size:1.2em; color:#2B9C98; }
#content-right { float:right; width:240px; min-height: 400px; }
#content-right-partners { float:right; width:225px; min-height: 200px; }
#content-right img { margin:0 0 15px 0; }
#content-right-partners img { margin:0 0 15px 0; }

#footer { margin:25px 0 0 0; padding:25px 0 25px 0; font-size:0.95em; border-top:1px dotted #2b9c98; border-bottom:1px dotted #2b9c98; overflow:hidden; }
#footer p { margin:0 0 0.5em 0; }
#footer a { color:#333; }
#footer div.i { float:left; width:100px; margin:0 15px 0 0; }
#footer div.ii { float:left; width:150px; margin:0 15px 0 0; }
#footer div.iii { float:left; width:180px; margin:0 5px 0 0; }
#footer div.omega { margin:0; }

.latest-news a { color:#333; }
.latest-news a:hover { text-decoration:none; }
.newslink a{color: #2B9C98;}
#archive div.i { padding:15px; background:url(images/bg-archive.jpg) repeat-x 0 0 #d9d9d9; min-height:75px; position:relative; }
#archive div.i p { margin:0; }
#archive div.i a { color:#333; }
#archive div.i a:hover { text-decoration:none; }
#archive div.i img { float:left; margin:0 15px 0 0; }
#archive div.i div { overflow:hidden; }
#archive div.i strong { font-weight:normal; color:#2B9C98; }
#archive div.i b { display:block; width:28px; height:85px; background:url(images/arr-1.png) no-repeat right center; position:absolute; top:10px; right:-16px; }

.products { padding:15px 0; border-top:1px dotted #2b9c98; overflow:hidden; }
.products.alpha { border:none; padding-top:0; }
.products div.i { float:left; width:189px; margin:0 16px 0 0; }
.products a { color:#333; }
.products a:hover { text-decoration:none; }
.products img { width:auto; height:127px; }

#contact-one { width:255px; float:left; }
#contact-two { width:255px; float:right; }
.hideme {visibility: hidden;}
#quickinfo div.i { 
	position:absolute; 
	z-index:10; 
	background: #2B9C98 url(images/arrowndown.png) no-repeat -5% 50%; 
	font-family:Ubuntu, Arial, Helvetica, sans-serif; 
	overflow:hidden; 
	color: white; 
	border: 2px solid #ffffff; 
}
#content-left-bottom .moreinfo {color: #ffffff; background:#2B9C98;overflow: hidden; padding: 10px; position: relative; box-shadow: 5px 5px 12px #cccccc;}
.moreinfo .close { display: block; width: 7px; height: 6px; line-height: 4px; padding: 5px; font-size: 16px; border: 1px solid white;}
.moreinfo .close:hover {cursor: pointer;}

#content-left-bottom{float: left;  width: 500px; display: block; margin: 20px 0; position: absolute; bottom: 20px;}
#content-left-bottom .left {float: left; width: 48%; text-align: center;}

#content-left-bottom .left img {height: 130px; width: 200px; margin-top: 5px;}
#content-left-bottom .right a {color: #ffffff; position: absolute; bottom: 10px; right: 10px;}
#content-left-bottom .right {float: right; width: 48%; }
#content-left-bottom .right p {padding-top: 15px;}
#quickinfo div.l { display:none;}
#quickinfo div.j { width:375px; height:145px; padding:25px; background:#2b9c98; color:#fff; border:2px solid #fff; position:relative; }
#quickinfo div.i img { width:185px; height:145px; float:right; margin:0 0 0 25px; }
#quickinfo div.i div.k { font-family:Ubuntu, Arial, Helvetica, sans-serif; overflow:hidden; }
#quickinfo  a {color: white; position: absolute; bottom: 10px; left: 10px}
#quickinfo div.j:after { 
	border-color: #2b9c98 transparent;
	border-style: solid;
	border-width: 25px 25px 0;
	bottom: -20px;
	display: block;
	left: 115px;
	position: absolute;
	content: "";
	width: 0;

}

#sectors-compare { border-collapse:collapse; color:#555; font-size:0.9em; }
#sectors-compare td, #sectors-compare th { border:1px solid #ccc; padding:8px 15px; min-width:55px; max-width:55px; }
#sectors-compare th { padding:12px 15px; background:#d5ebea; text-align:center; }
#sectors-compare th.htop { background:#2b9c98; color:#fff; }
#sectors-compare th.hside { min-width:105px; max-width:105px; text-align:left; }
#sectors-compare td { text-align:center; }
#sectors-compare td.blank { background:#ccc; }

.ostooltip { display:none; background:#2B9C98; color:#fff; position:absolute; }
.ostooltip:after { 
	border-left:10px solid transparent;  /* left arrow slant */
	border-right:10px solid transparent; /* right arrow slant */
	border-bottom:10px solid #2B9C98;
	top:-10px;
	right:10px;
	content:"";
	display:block;
	position:absolute;
	width:0;
}




.product-photo {
	width:150%;
	height:150%;
}


#slider {
width: 100%;
height: 100%;
margin: auto;
position: relative;
}
#slide1 {
width: 100%;
height: 100%;
margin: auto;

display: block;
position: absolute;
}
#slide2 {
width: 100%;
height: 100%;
margin: auto;

display: block;
position: absolute;
}
#slide3 img {
width: 100%;
height: 100%;
}
#slide3 {
width: 100%;
height: 100%;
margin: auto;
display: block;
position: absolute;
}

.hovertext {
width: 50%;
float: left;
padding: 10px;
margin-bottom: 100px;
}
.hover h3 {
margin: 0;
margin-bottom: 5px;
font-size: 16px;
}
.hover p {
margin: 0;
}

#thirdimage {

margin: auto;

display: block;
position: absolute;
}
.blaze{z-index: 999;}
#blaze img {
float: right;
width: 80px;
height: 80px;
}
.more {
background: url('images/pointer.png') no-repeat;
position: relative;
width: 100px;
height: 450px;
bottom: 150px;
right: 50px;
padding-bottom: 30px;
background-position:60% 5%;
z-index: 98;
}
figure.blaze{
margin: 0;
background: #039e90;
color: #ffffff;
height: 80px;
width: 200px;
border-radius: 15px;
padding: 10px;
margin: 30px;
z-index: 99;
}
#hover1 {
bottom: 70px;
left: 60px;
z-index:5;
}
#hover2 {
bottom: 30px;
left: 140px;
z-index:4;
}
#hover3 {
bottom: 80px;
left: 290px;
z-index:3;
}
#hover4 {
bottom: 30px;
left: 520px;
z-index:2;
}
#hover5 {
bottom: 70px;
left: 700px;
z-index:1;
}
.hover {
position: absolute;
width: 25px;
height: 25px;
background: url('images/circle.png') no-repeat;

}

#tooltip {
	
}


#tooltip div {
position: absolute;
display:none;
margin:-13% auto 0px auto;
background-color: #2B9C98 ;
padding:10px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
}

#tooltip div img {
	margin:0 auto;
}

p.slide-title {
	margin:5px auto 0px 10px;
}

#tooltip strong {
	color:#FFF;
	padding: 0px 10px 10px 10px;
}

#tooltip p {
	color:#FFF;
	padding:10px;
	width:150px;
}

.closetip {
	margin-left:20px;
	float:right;
	cursor:pointer;
	background:#FFF;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	-webkit-border-radius: 10px;
	text-decoration: none !important;
	padding:1px 5px 3px 5px;
	font-weight: bold;
}

.tip-leftcontent {
	height:100%;
	width:160px;
	float:left;
}
.tip-rightcontent {
	height:100%;
	width:200px;
	float:left;
}

.moreinfo {
color:#FFF !important;
text-decoration: none;
padding-left:10px;
}

.no-products {
	font-weight:bold;
}

.logo-slide {
	width: 200px !important;
}

.logo-slide img {
		vertical-align: middle !important;
		padding-top:20%;
}

/*====== CONTACT FORM DETAILS ========*/

#contactForm input[type=text], #contactForm textarea{
margin-bottom:10px;
	width:100%;
}