/* ------------------------------------------------------
	Main CSS for www.dihedrals.com
	(c) 2007 by Dihedrals Group Ltd. All rights reserved.
-------------------------------------------------------*/

body {
	background: url(../images/headerbar.jpg) 0px -77px repeat-x;
	text-align: center;
	font-family: "Lucida Grande", Geneva, Arial, Verdana, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	line-height: 18px;
}
#introHeaderBar {
	background: url(../images/headerbar.jpg) repeat-x;
}

* {
	padding: 0;
	margin: 0;
}
img {
	border: none;
}
h1 {
	font-size: 1.4em;
}
h2 {
	font-size: 1.2em;
}
h3 {
	font-size: 1em;
}
.hidden {
	display: none;
}
a {
	color: rgb(10,52,118);		/* Link blue */
	text-decoration: none;
	background: url(../images/underlineblue.gif) left bottom repeat-x;		/* 1px BLUE dotted underline */
}
a:hover {
	text-decoration: underline;
}
a:visited {
	color: rgb(82,0,0);		/* Link dark red */
}
.center {
	margin: 0 auto;
}

.clear { clear: both; }

.hline {
	margin: 0 auto;
	width: 1050px;
	height: 42px;
	background: url(../images/footersep.gif) center center no-repeat;
	letter-spacing: 0.01em;
	clear: both;
}
.mono {
	font-family: monospace;
}
.red {
	color: maroon;
}

acronym {
	text-decoration: none;
	border: none;
	cursor: default;
	background: url(../images/underlineblue.gif) left bottom repeat-x;		/* 1px BLUE dotted underline */
}
acronym:hover {
	color: rgb(82,0,0);		/* Link dark red */
}
.centerImg {
	margin: 10px auto 0 auto;
	text-align: center;
}
.centerImgTitle {
	margin: 5px auto 10px auto;
	width: 315px;
	font-size: 90% !important;
	color: rgb(10,52,118) !important;		/* Link blue */
	line-height: 1.1em !important;
}
.imgBorder {
	border: 1px black solid;
}


.inset {
	margin: 0 0 0 25px;
}


/* Language Menu */
#langMenu {
	text-align: left;
	position: absolute;
	top: 18px; left: 10px;
	color: rgb(70%,70%,70%);
	cursor: default;
	font-size: 11px;
}
	#langMenu a {
		color: white;
		background: url(/images/underline-light-grey.gif) left bottom repeat-x !important;
		text-decoration: none !important;
	}
#footerLangMenu {
	margin: 0 auto;
	position: relative;
	width: 1050px;
}
	#footerLangMenu #langMenu {
		text-align: center;
		position: relative;
		color: rgb(70%,70%,70%);
		top: 10px; left: 0;
	}
		#footerLangMenu #langMenu a {
			color: rgb(10,52,118);		/* Link blue */
			background: url(/images/underlineblue.gif) left bottom repeat-x !important;
			text-decoration: none !important;
		}
	
	

/* Main Menus */
#headermenu {
	margin: 20px auto 0 auto;
	width: 1050px;
	font-size: 12px;
	font-weight: bold;
	color: rgb(80%,80%,80%); 
	letter-spacing: 0.1em;
}
#headermenu a {
	color: rgb(40%,40%,40%) !important; 
	background-image: none;
}
#headermenu a:hover {
	color: rgb(80%,80%,80%); 
}
#headermenu #selected {
	color: rgb(60%,60%,60%) !important;  
	background: url(../images/underlineblue.gif) left bottom repeat-x !important;		/* 1px BLUE dotted underline */
}

#readmore {
	margin: 0 auto;
	width: 1050px;
}
#readmore .overview {
	position: relative;
	top: -5px;
	color: rgb(10,52,118);		/* Link blue */
	font-size: 11px;
	font-weight: bold;
}
#readmore .col {
	float: left;
	display: inline;
	margin: 0 0 0 20px;
	width: 140px;
	text-align: left;
	line-height: 1.2em;
}
#readmore .firstcol {
	margin-left: 320px;
}
#readmore .col em {
	color: rgb(60%,60%,60%); 
	font-size: 11px;
	font-weight: bold;
	line-height: 1.2em;
}
#readmore .col p {
	margin: 0 0 0 5px;
	color: rgb(30%,30%,30%);	/* text gray */
	font-weight: normal;
}
#readmore .col a {
	background: url(../images/underlinegray.gif) left bottom repeat-x;		/* 1px GRAY dotted underline */
}



/* Page Menus */
.pagebtn {
	display: block;
	margin: 0 auto;
	background: url(../images/pagemenubtn.jpg) center center no-repeat;
	height: 27px;
	font-weight: bold;
	line-height: 2.2em;
	text-indent: 15px;
	font-size: 12px;
	letter-spacing: 0.03em;
}
.pagebtn a {
	display: block;
	margin: 0 auto;
	width: 174px;
	height: 27px;
	text-decoration: none;
	background: none;
	text-align: left;
	color: rgb(82,0,0) !important;		/* Link dark red */
}

.colbox3 .pageMenu {
	margin-left: 100px;
	float: left;
	display: inline;
	width: 184px;
	font-weight: bold;
	line-height: 2.2em;
}


.colbox3 .pageMenu a {
	margin: 0 0 0 10px;
	display: block;
	width: 154px;
	height: 27px;
	text-align: left;
	text-indent: 5px;
	letter-spacing: 0;
	background: url(../images/underlinegray.gif) left bottom repeat-x;		/* 1px GRAY dotted underline */
}
.colbox3 .pageMenu a:visited {
	color: rgb(10,52,118);		/* Link blue */
}

.menuSpacer {
	height: 40px;
	width: 100%;
}


		#contactBox {
			width: 184px;
			float: left;
			display: inline;
		}
		#contactBox a {
			margin: 0;
			padding: 0;
			width: 100%; height: 100%;
			text-indent: 0;
			text-decoration: none;
			background-image: none;
		}
		#liveSupportBox {
			background: url(../images/loading-livechat.jpg) bottom left no-repeat;
			margin: 10px 0 0 0;
			padding: 0;
			width: 100%; height: 120px;
		}
		#skypeBox {
			width: 184px; height: 43px;
			background: url(../images/skypeme.gif) no-repeat;
		}
		#sepBox {
			width: 184px; height: 1px;
			background: url(../images/contacthsep.gif) no-repeat;
		}
		#emailBox {
			width: 184px; height: 45px;
			background: url(../images/contactemail.gif) no-repeat;
		}
		



/* Header Elements */
#introduce {
	margin: 0 auto;
	position: relative;
	width: 1050px;
	height: 159px;
	background: url(../images/introduce.jpg) no-repeat;
}
	#introduce-ES {
		margin: 0 auto;
		position: relative;
		width: 1050px;
		height: 159px;
		background: url(../images/introduce-es.jpg) no-repeat;
	}
#differently {
	margin: 0 auto;
	width: 1050px;
	height: 283px;
	background: url(../images/differently.jpg) 370px 0px no-repeat;
}
	#differently-ES {
		margin: 0 auto;
		width: 1050px;
		height: 283px;
		background: url(../images/differently-es.jpg) 317px 0px no-repeat;
	}
#headerlogo {
	margin: 0 auto;
	width: 1050px;
	height: 133px;
	background: url(../images/headerlogo.jpg) no-repeat;
}
	#headerlogo-ES {
		margin: 0 auto;
		width: 1050px;
		height: 133px;
		background: url(../images/headerlogo-es.jpg) no-repeat;
	}
#headerlogo #webascentHome {
	margin: 0 auto;
	width: 200px;
	height: 133px;
}
#headerlogo #webascentHome a {
	display: block;
	height: 100%;
	width: 100%;
	background-image: none;
	text-decoration: none;
}


/* Features box */
.featuresBox {
	background: url(../images/featuresbox-back.gif) repeat-y;
	width: 506px;
	float: left;
	display: inline;
	position: relative;
	margin: 25px 0 10px 42px;
}
.featuresBox .top {
	background: url(../images/featuresbox-top.gif) no-repeat;
	width: 506px;
	height: 10px;
	margin: 0 0 10px 0
}
.featuresBox .bot {
	background: url(../images/featuresbox-bot.gif) no-repeat;
	width: 506px;
	height: 10px;
	clear: both;
	margin: 5px 0 0 0
}
	.featuresBox .content {
		margin: 10px 15px 0 20px;
		border-bottom: 1px rgb(80%,80%,80%) solid;
	}
	.featuresBox .content h3 {
		color: rgb(10,52,118);		/* Link blue */
		float: left;
		display: inline;
		width: 150px;
	}
	.featuresBox .bottom {
		border-bottom: none;
		padding: 0;
	}
	.featuresBox .content p {
		color: rgb(30%,30%,30%);	/* text gray */
		float: right;
		display: inline;
		width: 300px;
		line-height: 1.1em;
		font-size: 90%;
	}
	.featuresBox .content .clearit {
		clear: both;
		height: 10px;
	}

/* Single Column Contents box */
.mainSingleCol {
	width: 410px;
	min-height: 50px;
	float: left;
	display: inline;
	position: relative;
	margin: 0 0 0 20px;
}
.introSingleCol {
	width: 593px;
	float: left;
	display: inline;
	position: relative;
	margin: 0 0 30px 0;
}
.introSingleCol p {
	text-align: justify;
	line-height: 1.5em;
}


/* Hilite Box */
.hiliteBox {
	width: 594px;
	float: left;
	display: inline;
	position: relative;
	margin: 0 0 10px 0;
	background: url(/images/hilitebox-center.gif) repeat-y;
}
.hiliteBox .top {
	width: 594px;
	height: 81px;
	position: absolute;
	z-index: 10;
	top: 0; left: 0;
	background: url(/images/hilitebox-top.gif) no-repeat;
}
.hiliteBox .bottom {
	position: relative;
	z-index: 10;
	width: 594px;
	height: 16px;
	background: url(/images/hilitebox-bottom.gif) no-repeat;
}
	.hiliteBox h2,
	.hiliteBox h3,
	.hiliteBox ol,
	.hiliteBox ul,
	.hiliteBox p {
		position: relative;
		z-index: 100;
		text-align: left;
		margin: 0 90px 5px 90px;
	}
	.hiliteBox h2 {
		text-align: center;
		border-bottom: 1px silver solid;
	}
	.hiliteBox ol,
	.hiliteBox ul  {
		margin-left: 130px;
	}

/* 3 Column Contents box */
.colbox3 {
	margin: 0 auto 50px auto;
	width: 1050px;
	min-height: 200px;
	text-align: left;
}
.colbox3 .singleCol {
	float: left;
	display: inline;
	width: 280px;
	min-height: 200px;
}
	.colbox3 #next {
		float: right;
		display: inline;
		margin-right: 136px;
	}

.colbox3 .singleCol h1,
.colbox3 .mainSingleCol h1 {
	font-size: 1.2em;
	color: rgb(10,52,118);		/* Link blue */
	background-color: white;
	padding: 10px 0 8px 0;
}
.colbox3 .singleCol h2,
.colbox3 .mainSingleCol h2 {
	font-size: 1.1em;
	color: rgb(10,52,118);		/* Link blue */
	background-color: white;
	padding: 10px 0 3px 0;
	clear: both;
}
.colbox3 .singleCol h3,
.colbox3 .mainSingleCol h3 {
	font-size: 1em;
	color: rgb(10,52,118);		/* Link Red */
	background-color: white;
	padding: 20px 0 0 0;
	clear: both;
}
.colbox3 .singleCol h4,
.colbox3 .mainSingleCol h4 {
	font-size: 1em;
	font-style: italic;
	font-weight: normal;
	color: rgb(10,52,118);		/* Link blue */
	background-color: white;
	padding: 5px 0 0 0;
	clear: both;
}
.colbox3 .singleCol p,
.colbox3 .mainSingleCol p {
	font-size: 12px;
	padding: 0 3px 5px 0;
	color: rgb(30%,30%,30%);	/* text gray */
	line-height: 1.4em;
}
.colbox3 .singleCol .start {
	padding-top: 0;
}
.colbox3 .colspacer22 {
	float: left;
	display: inline;
	margin: 0 auto;
	width: 22px;
	height: 100px;
}
.colbox3 .colspacer33 {
	float: left;
	display: inline;
	margin: 0 auto;
	width: 33px;
	height: 100px;
}
.colclear {
	clear: both;
}
.colbox3 .learnMore {
	float: right;
	display: inline;
	margin: 0 20px 0 0;
	padding: 0 17px 0 0;
	font-variant: small-caps;
	background: url(../images/btn-readmore.gif) right 3px no-repeat;
}
.twoColImgTop {
	margin: -15px 0 0 10px;
	float: right;
	display: inline;
}
.twoColImg {
	margin: 0 0 0 10px;
	float: right;
	display: inline;
}


.colbox3 .mainSingleCol li {
	margin: 0 0 0 55px;
}

/* Steps 1-6 */
.colbox3 .mainSingleCol .step {
	position: relative;
	width: 100%;
	height: 33px;
	line-height: 3em;
	text-indent: 30px;
}
.colbox3 .mainSingleCol .step .top {
	position: absolute;
	right: 0;
	top: 25px;
	height: 1em;
	text-indent: 0;
	line-height: normal;
	font-size: 80%;
}
.colbox3 .mainSingleCol .one {
	background: url(../images/step-simple1.gif) left bottom no-repeat;
}
.colbox3 .mainSingleCol .two {
	background: url(../images/step-simple2.gif) left bottom no-repeat;
}
.colbox3 .mainSingleCol .three {
	background: url(../images/step-simple3.gif) left bottom no-repeat;
}
.colbox3 .mainSingleCol .four {
	background: url(../images/step-simple4.gif) left bottom no-repeat;
}
.colbox3 .mainSingleCol .stepText {
	padding: 5px 0 0 32px;
	font-size: 90%;
	color: black;
}
	.MIBAnchor {
		width: 0; height: 0;
		position: relative;
		top: 100px;
		left: 430px;
		overflow: visible;
	}
	.moreInfoPlain {
		width: 198px;
		position: absolute;
	}
	.moreInfoPlainTitle {
		float: right;
		display: inline;
		padding: 0 0 0 18px;
		font-variant: small-caps;
		background: url(../images/btn-readmore-down.gif) left 2px no-repeat;
	}
	.moreInfoPlain a {
		font-size: 90%;
		display: block;
		width: 100%;
		clear: both;
		background-image: none;
		text-align: right;
	}
	.moreInfoPlain a:visited {
		color: gray;
		text-decoration: underline;
	}
	
	
	
	
	.moreInfoBubble {
		width: 198px;
		position: absolute;
		background: url(../images/moreinfobubble-back.gif) repeat-y;
		padding: 43px 0 0 0;
	}
	.moreInfoBubbleTop {
		width: 198px;
		height: 39px;
		position: absolute;
		top: 0; left: 0;
		background: url(../images/moreinfobubble-top.gif) no-repeat;
	}
	.moreInfoBubble h4 {
		font-size: 90% !important;
		font-weight: bold !important;
		font-style: normal !important;
		background-color: transparent !important;
		margin: 18px 0 0 40px;
	}
	.moreInfoBubbleBottom {
		width: 198px;
		height: 10px;
		position: relative;
		top: 5px; left: 0;
		background: url(../images/moreinfobubble-bot.gif) no-repeat;
	}
	.moreInfoBubbleContents {
		margin: 0 5px 0 22px;
		font-size: 90%;
		line-height: 1.1em;
	}
	.moreInfoBubbleContents ul {
		margin: 5px 0 5px 10px;
	}
	.moreInfoBubbleContents li {
		margin: 0 !important;
	}

/* Showcase Thumbnails */
		.showcaseBox {
			width: 712px;
			float: right;
			display: inline;
			margin: 20px 0 0 0;
			border: 1px rgb(80%,80%,80%) solid;
		}
		
		.showcaseBox .thumbBox {
			width: 218px;
			/* height: 200px; */
			float: left;
			margin: 10px 0 -10px 14px;
			position: relative;
		}
		
		.thumbBox a {
			display: block;
			position: absolute;
			width: 218px; height: 200px;
			background-image: none;
			background-color: white;
			filter: alpha(opacity = 0);		/* IE needs to have a backg. color to have link work! Ick. */
			opacity:0;
			display: inline;
			z-index: 1000;
		}
		.thumbBox:hover h3{
			color: rgb(10,52,118);		/* Link blue */
		}
		.thumbBox:hover p {
			color: black;
		}
		
		.thumbBox h3,
		.thumbBox p {
			margin: -5px 0 0 17px;
			width: 185px;
			line-height: 1.1em;
		}
		.thumbBox h3 {
			font-size: 1.1em;
			line-height: 1.2em;
			color: rgb(40%,40%,40%);
			margin-bottom: 5px;
		}
		.thumbBox p {
			font-size: 0.8em;
			color: rgb(40%,40%,40%);
		}
		

/* Contents FX */
.show {
	display: block;
}
.hide {
	display: none;
}



/* Footer OLD*/
#footermenu, #footersubmenu {
	margin: 0 auto;
	width: 1050px;
	color: rgb(50%,50%,50%);		/* Basic gray */
	font-size: 11px;
}
#footermenu, #footersubmenu {
	clear: both;
	margin: 10px auto 0 auto;
	width: 1050px;
}
#footermenu a, #footersubmenu a {
	color: rgb(10,52,118);		/* Link blue */
	text-decoration: none;
	background: url(../images/underlineblue.gif) left bottom repeat-x;
}
#footermenu a:hover, #footersubmenu a:hover {
	text-decoration: underline;
	background: none;
}


#footercopyright {
	margin: 20px auto;
	width: 1050px;
	height: 20px;
	color: rgb(50%,50%,50%);		/* Basic gray */
	font-size: 9px;
	cursor: default;
}
#footercopyright #dwa {
	background-image: none;
	color: rgb(50%,50%,50%);		/* Basic gray */
	cursor: default;
}
#footercopyright #dwa:hover {
	text-decoration: none;
	background-image: none;
}





/* Footer New */
#footerBox {
	margin: 50px auto 50px auto !important;
	text-align: left;
	line-height: normal;
	color: rgb(30%,30%,30%);
	width: 850px;
}
	#footerBox .menuBox {
		float: left;
		display: inline;
		width: 150px;
		min-height: 100px;
		margin: 0 20px 0 0;
	}	
	#footerBox .menuBox h2 {
		font-size: 100%;
		border-bottom: 1px rgb(80%,80%,80%) solid;		/* Light gray */
		margin: 0 0 5px 0;
	}
	#footerBox .menuBox h2 a {
		color: rgb(30%,30%,30%);
		text-decoration: none;
		background: none !important;
	}
	#footerBox .menuBox h2 a:hover {
		color: rgb(10,52,118);		/* Link blue */
	}

	#footerBox .menuBox ul {
		margin: 0 0 0 10px;
	}
		#footerBox .menuBox ul li {
			list-style-type: none;
			margin: 0 0 2px 0;
		}
			#footerBox .menuBox ul li a{
				color: rgb(30%,30%,30%);
				text-decoration: none;
				background: none !important;
			}
			#footerBox .menuBox ul li a{
				color: rgb(10,52,118);		/* Link blue */
			}


/* Webascent Admin */
#DWAdmin {
	margin: 4px auto 1px auto;
	width: 15px;
	height: 15px;
	background: url(../images/spade.gif) no-repeat;
}
#DWAdmin a {
	display: block;
	width: 100%;
	height: 100%;
}


/* DWA Extended Elements */
.price {
	margin: 0;
	font-variant: small-caps;
	font-weight: bold;
	text-align: left;
}


/* DWA Components */
.learnMoreLink a {
	float: right;
	display: inline;
	margin: 0 20px 0 0;
	padding: 0 17px 0 0;
	font-variant: small-caps;
	background: url(/images/btn-readmore.gif) right 3px no-repeat;
	clear: right;
}
/* Next Section Button */
.dwa-nextSectionButton {
	margin: 15px 0 15px auto;
	text-align: right;
	color: rgb(10,52,118);		/* Link blue */
	width: 300px;
}
	.dwa-nextSectionButton a {
		background: url(/images/btn-next.jpg) right center no-repeat;
		display: block;
		height: 54px;
		line-height: 54px;
		font-weight: bold;
		padding-right: 45px;
		text-align: right;
	}

.dwa-largeProductImg {
	margin: 0 0 10px 10px;
	float: right;
	display: inline;
}

.dwa-addonProductImg {
	margin: 0 0 10px 10px;
	float: right;
	display: inline;
}
.dwa-vSpacer10 {
	clear: both;
	height: 10px;
}
.dwa-vSpacer20 {
	clear: both;
	height: 20px;
}

.dwa-moreInfoImage {
	margin: 0 auto;
	text-align: center;
	z-index: 100;
	position: relative;
}
	.dwa-moreInfoImage img {
		border: 1px rgb(10,52,118) solid;
		margin: 5px 0;
	}
	
.dwa-moreInfoLink {
	text-align: center;
	position: relative;
	height: 60px;
	background: url(/images/btn-next.jpg) top center no-repeat;
}
	.dwa-moreInfoLink .linkBox {
		text-align: center;
		position: absolute;
		top: 0; left: 0;
		width: 100%;
		height: 100%;
	}
	.dwa-moreInfoLink .linkBox a {
		text-align: center;
		position: absolute;
		top: 0; left: 0;
		width: 100%;
		height: 100%;
		line-height: 105px;
		text-decoration: none;
		border-bottom: none;
		background: none;
	}
	.dwa-moreInfoLink .linkBox a:hover {
		text-decoration: underline;
	}
	
	
.dwa-quoteOpen {
	height: 21px;
	background: url(/images/quote-double-left.gif) 50px 0 no-repeat;
	position: relative;
	top: 16px; left: 0;
	z-index: 200;
}
.dwa-closeClose {
	height: 21px;
	background: url(/images/quote-double-right.gif) top right no-repeat;
	position: relative;
	top: -21px; right: 55px;
	z-index: 200
}