@charset "utf-8";
/* CSS Document */

.social {
	float:left;
	padding:2px 2px 2px 15px;
	position:absolute;
	right:145px;
	top:7px;
	height:35px;
	background: url(../images/social-bg.png) bottom left no-repeat;
	width:100px;
}



body {
	padding:0px 0 20px 0;
	margin:0px 0 20px 0;
	font:12px arial;
}

.img-right {float:right;}

#index {	background:url(../images/background.png) repeat-x 0 0 #a9b7b9;}
#about {	background:url(../images/background-about.png) repeat-x scroll 0 0 #a9b7b9;}
#how {	background:url(../images/background-how.png) repeat-x scroll 0 0 #a9b7b9;}
#res {	background:url(../images/background-res.png) repeat-x scroll 0 0 #a9b7b9;}
#faqs, #free-res, #family {	background:url(../images/background-faqs.png) repeat-x scroll 0 0 #d8dfe0;}

p {margin-bottom:1.5em;}

a {color:#687678;}	

a#logo {
	background:url(../images/logo.png) no-repeat scroll 100% 0 transparent;
	text-indent:-2000px;
	width:135px;
	height:55px;
	display:block;
	float:right;
	}
	
a#rigologo {
	background:url(../images/rigologo.png) no-repeat scroll 100% 0 transparent;
	text-indent:-2000px;
	width:167px;
	height:78px;
	display:block;
	float:left;
	}

.container {
	width: 960px;
	position: relative;
	left: 50%;
	margin-left: -480px;
}

.header {
	width:960px;
	height:99px;
}

.header ul {
	list-style:none outside none;
	margin:-17px 0px 0px 170px;
	padding:0;
	position:relative;
	width:790px;
}

.header ul, .header li {
	float:left;
}

.header li a {
	color:#687678;
	display:block;
	font-size:14px;
	padding:10px 13px 12px;
	text-align:center;
	text-decoration:none;
	-moz-border-radius:7px 7px 0px 0px;
	-webkit-border-top-left-radius:7px;
	-webkit-border-top-right-radius:7px;
	margin-right:1px;
}

.header li a:hover {
	background:url(../images/nav-bg.png) repeat-x scroll 100% 0 transparent;
	color:#1c2122;
}

.header li a.selected {
	background:url(../images/nav-bg.png) repeat-x scroll 100% 0 transparent;
	color:#1c2122;
}

.header li a#nav-about:hover, #nav-about.selected {
	background:url(../images/nav-bg-about.png) repeat-x scroll 100% 0 transparent;
	color:#fff;
}

.header li a#nav-how:hover, #nav-how.selected {
	background:url(../images/nav-bg-how.png) repeat-x scroll 100% 0 transparent;
	color:#000;
}

.header li a#nav-resources:hover, #nav-resources.selected {
	background:url(../images/nav-bg-res.png) repeat-x scroll 100% 0 transparent;
	color:#fff;
}

.header li a#nav-faqs:hover, #nav-faqs.selected {
	background:url(../images/nav-bg.png) repeat-x scroll 100% 0 transparent;
	color:#000;
}

.header li a#nav-free-res:hover, #nav-free-res.selected {
	background:url(../images/nav-bg.png) repeat-x scroll 100% 0 transparent;
	color:#000;
}

.header li a#nav-contact:hover, #nav-contact.selected {
	background:url(../images/nav-bg.png) repeat-x scroll 100% 0 transparent;
	color:#000;
}

.maincontent {
	width:960px;
	height:351px;
	padding-top:20px;
}

#index .maincontent {
	background:url(../images/mainimage.png) no-repeat scroll 100% 0 transparent;
	margin-top:1px;
}

#how .maincontent {
	background:url(../images/how-bg.png) no-repeat scroll 100% 0 transparent;
	margin-top:1px;
}

#res .maincontent {
	background:url(../images/res-bg.png) no-repeat scroll 100% 0 transparent;
	margin-top:1px;
}

#free-res .headerpanel {
	background:url(../images/bof-free-res.png) no-repeat scroll 100% 0 transparent;
	margin-top:1px;
	padding-bottom:40px;
}

.maincontent p {width:435px;}


#index .maincontent h2 {
	text-indent:-2000px;
	background:url(../images/header-home.png) no-repeat top left;
	height:80px;
	margin:-8px 0 3px -30px;
	text-indent:-2000px;
}

#about .maincontent h2 {
	text-indent:-2000px;
	background:url(../images/header-about.png) no-repeat top left;
	height:80px;
	margin:0 0 3px -19px;
	text-indent:-2000px;
}

.maincontent h3, .maincontent p {margin:0 0 1em 0;}
.maincontent h3 {font-size:1.4em;}
.maincontent p { font-size:1.2em;}

#how .maincontent h2 {
	text-indent:-2000px;
	background:url(../images/header-how.png) no-repeat top left;
	height:80px;
	margin:-6px 0 15px -19px;
	text-indent:-2000px;
}

#res .maincontent p, #about .maincontent p, #about .maincontent h3 {color:#fff;}

#res .maincontent h2 {
	text-indent:-2000px;
	background:url(../images/header-res.png) no-repeat top left;
	height:80px;
	margin:-6px 0 15px -19px;
	text-indent:-2000px;
}

#faqs .maincontent h2 {
	text-indent:-2000px;
	background:url(../images/header-faqs.png) no-repeat top left;
	height:80px;
	margin:-6px 0 15px -19px;
	text-indent:-2000px;
}

#free-res .maincontent h2 {
	text-indent:-2000px;
	background:url(../images/header-free-res.png) no-repeat top left;
	height:80px;
	margin:-6px 0 15px -19px;
	text-indent:-2000px;
}

#family .maincontent h2 {
	text-indent:-2000px;
	background:url(../images/header-family.png) no-repeat top left;
	height:80px;
	margin:-6px 0 15px -19px;
	text-indent:-2000px;
}


.primary {
	width:480px;
	float:left;
}

.secondary {
	width:460px;
	float:right;
	padding:0;
}


#slider {
	-moz-box-shadow:0 0 10px #333333;
	-webkit-box-shadow:0 0 10px #333333;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	position:relative;
}
#slider img {
	position:absolute;
	top:0px;
	left:0px;
}


/*=== further information ===*/

#further-details {
	margin:15px 0;
	padding-bottom:10px;
	background:url(../images/slider-bottom.png) no-repeat scroll left bottom;
}

#further-details .content {
	background-color:#FFFFFF;
	padding:20px;
	width:920px;
}

#about .content { background: #ffffff url(../images/about-content-bg.png) no-repeat scroll right bottom;}
#how .content { background: #ffffff url(../images/how-content-bg.png) no-repeat scroll right bottom;}

#further-details p {font-size:1.2em; width:500px; margin:1em 0 2em 0;}

#further-details ul li {
	background:url("../images/tick.png") no-repeat scroll 0 -2px transparent;
	list-style-type:none;
	font-size:13px;
	font-weight:bold;
	letter-spacing:0;
	padding:0 20px 0 25px;
	margin-bottom:10px;
}

#further-details h2 {
	text-indent:-9999em;
	font-size:1.3em;
}

.sub-title-01 {background:url(../images/sub-title-01.png) no-repeat 2px 0px;}

.sub-title-02 {background:url(../images/sub-title-02.png) no-repeat 2px 0px;}

.sub-title-03 {background:url(../images/sub-title-03.png) no-repeat 2px 0px;}

.sub-title-04 {background:url(../images/sub-title-04.png) no-repeat 2px 0px;}

.sub-title-05 {background:url(../images/sub-title-05.png) no-repeat 2px 0px;}

.sub-title-06 {background:url(../images/sub-title-06.png) no-repeat 2px 0px; text-indent:-9999em; height:25px;}

.sub-title-07 {background:url(../images/sub-title-07.png) no-repeat 2px 0px; text-indent:-9999em; height:25px;}

.sub-title-08 {background:url(../images/sub-title-08.png) no-repeat 2px 0px; text-indent:-9999em; height:25px;}


blockquote {
	width:500px;
	font-size:1.2em;
	padding:20px 20px 0 20px !important;
	margin:10px 0 0 0 !important;
}

.note {padding-left:20px; font-size:0.9em !important; font-weight:bold;}

/*=== home styling ===*/

		.panel-red, .panel-white, .panel-blue {float:left; padding:0 65px 0 10px; width:235px; height:135px; margin:20px 7px 15px 0; color:#fff;}

		.panel-red {background:url(../images/panel-red.png) no-repeat 0 0;}

		.panel-white {background:url(../images/panel-white.png) no-repeat 0 0; color:#000;}

		.panel-blue {background:url(../images/panel-blue.png) no-repeat 0 0; margin-right:0px;}

		/*--heading replacements--*/
		
		.panel-red h2 {background:url(../images/panel-red-head.png) no-repeat scroll left top transparent;}

		.panel-white h2 {background:url(../images/panel-white-head.png) no-repeat scroll left top transparent;}

		.panel-blue h2 {background:url(../images/panel-blue-head.png) no-repeat scroll left top transparent;}

		.panel-red h2, .panel-white h2, .panel-blue h2, .panel-free-resources h3 {
			margin:15px 0 5px -1px;
			height:23px;
			text-indent:-9999em;
		}
		
		.panel-free-resources {
			float:left;
			background:transparent url(../images/free-res-box.png) no-repeat left top;
			width:384px;
			height:103px;
			margin-top:-6px; /* mac ff fix */
		}
		
		.panel-free-resources h3 {background:url(../images/panel-free-res-head.png) no-repeat scroll left top transparent; margin:12px 0 0 13px;}
		
		.panel-free-resources p {
			margin:0 0 0 13px;
			color:#000;
			width:280px;
			font-size:1em;
		}
		
		.panel-free-resources p {margin-bottom:5px;}
		
		/* alignment tweak*/
		.panel-red p, .panel-white p, .panel-blue p {margin:0;}
		
		.panel-button {
			background:url(../images/button-left.png) no-repeat scroll left top transparent;
			float:left;
			margin-top:6px !important;
			padding:0 0 0 14px;

		}
		.panel-button a {background:url(../images/button-right.png) no-repeat scroll right top transparent;
			float:left;
			display:block;
			padding:2px 15px 4px 6px;
			text-decoration:none;
			color:#fff;
			font-size:11px;
		}
		
		.panel-button a:hover {text-decoration:underline;}
		
/*------- forms ----------*/

.maincontent#resourcereg {
	width:930px;
	border:#d7d7d7 solid 1px;
	background-color:#FFFFFF;
	padding:15px;
	margin:0 0  20px 0;
	float:left;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	height:380px;
}

.dlcontent#resourcereg {
	width:930px;
	border:#d7d7d7 solid 1px;
	background-color:#FFFFFF;
	padding:15px;
	margin:0 0 20px 0;
	float:left;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
}


.maincontent#resourcereg .secondary {
	width:450px;
	padding:0 0 0 15px;
}

.maincontent#resourcereg .primary {width:450px;}

.textfield, .selectfield, .checkfield, .loginfield {
	clear:left;
	overflow:hidden;
	margin:0;
}

.checkfield {
	margin-top:10px;
	padding-left:82px;
}

.checkfield input {
	float:right;
}

.checkfield label {
	width:333px;
	margin-left:10px;
	float:left;
}

.textfield label, .selectfield label, .loginfield label {
	float:left;
	font-weight:bold;
	padding:7px;
	text-align:right;
	width:90px;
}

.loginfield label {
	width:55px;
}

.loginfield input {
	width:120px;
}

.loginpanel {
	width:408px;
	border:#d7d7d7 solid 1px;
	background-color:#ebebeb;
	padding:10px 18px;
	float:left;
	margin-bottom:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
}

.dlpanel {
	width:550px;
	border:#d7d7d7 solid 1px;
	background:#ebebeb url(../images/zip-icon.png) 518px 40px no-repeat;
	padding:10px 18px;
	float:left;
	margin-bottom:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
}

.dlpanel p {width:400px;}

.dlpanel .note {padding-left:0px; font-size:0.9em !important; font-weight:bold;}

.button {
	float:right;
}

.resourcepanel label #right {
	float:right;
}

.textfield textarea {
	font-family:Arial,Helvetica,"Trebuchet MS","Lucida Grande";
	font-size:12px;
	height:50px;
	overflow:auto;
	width:250px;
}

.textfield input, .textfield textarea, .selectfield select, .checkfield input, .loginfield input {
	border:1px solid #CCCCCC;
	margin:2px;
	padding:4px;
	vertical-align:middle;
}

.checkfield input {
	float:left;
	height:15px;
	vertical-align:middle;
	width:auto;
	padding:0px;
	margin:0px;
	border:none;
}

.selectfield input {
	float:right;
	margin-left:5px;
}

.selectfield {
	padding-right:40px;
}

.buttonfield {
	padding:10px 0 0 105px;
}
	
.textfield input, .textfield textarea {
	width:320px;	
}


/*character panels */

.family {margin-bottom:20px;}

.characters {
	background:#fff;
	float:left;
	width:214px;
	height:300px;
	margin:0 10px 10px 0;
	padding:8px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}


.details {
	background:url(../images/char-divider.png) top left repeat-x;
	padding-top:10px;
	width:216px;
	margin-top:5px;
	
}

.details p {font-size:1em; width:220px; margin-bottom:5px;}