* {
	margin:0;
	padding:0;
	border-width:0;
	border-style:solid;
}
		
body,html{
	width:100%;
	height:100%;
}

body{
	font-family:Georgia, serif;
	font-size:13px;
	line-height:20px;
}

h1,h2,h3,h4,h5,h6{
	font-weight:normal;
}

h1{
	font-size:20px;
}

h2{
	font-weight:bold;
	font-size:16px;
	margin-bottom:6px;
	
	padding: 5px 10px;
	width: 260px;
}

h4{
	font-size:16px;
	margin-bottom:10px;
}

body{
	background:#fff;
}

a{
	text-decoration:none;
	transition:0.3s;
}

header{
	background:#aaa;
	padding: 20px;
	/*border-bottom:1px solid black;*/
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height:70px;
}

#title{
	position: absolute;
	bottom: 20px;
	left: 20px;
}

#title a{
	font-size:30px;
	font-style:italic;
	color:rgba(0,0,0,0.9);
}

#title a:hover{
	color:#fff;
}

header h4{	
	font-size: 13px;	
	margin: 8px 0 0 8px;
	color:rgba(0,0,0,0.6);
}

footer{
	background: #111;
	color:#666;
	line-height:32px;
	text-align:center;
	left: 0;
	right: 0;
}

footer, #push{
	height:33px;/*32px;*/
	clear:both;
}

footer a{
	color:#39aef7;
}

footer a:hover{
	color:white;
}

content{
	display:block;
}

section content{
	display:none;
	overflow-x:visible !important;
	width: 600px;
}

section h3{
	cursor:pointer;
	position:relative;
}

section h3:before{
	content:"+ ";
	color:rgba(0,0,0,0.3);
	position:absolute;
	top:0;
	left:0;
	width:40px;
	text-align:center;
	line-height:37px;
	height:40px;
}

section h3.expanded:before{
	content:"- " !important;
}

#topadvert{
	width: 728px;
	height: 90px;
	margin: 10px;
	background: rgba(0,0,0,0.1);
	position: absolute;
	top: 0;
	right: 0;
}

#bottomadvert{
	height: 90px;
	background: #ddd;
	padding: 5px;
	border-top:1px solid #bbb;
}

#menu{
	position:fixed;
	top:110px;
	left:0;
	right:0;
	background:#111;
	height:40px;
	margin-top:0;
	z-index: 500;
}

ul{
	list-style-type:none;
}

#menu li{
	float:left;
	position:relative;
}

#menu li a{
	color:#aaa;
	padding: 0 10px;
	height:40px;
	line-height:40px;
	display:block;
}

#menu li a:hover{
	background:grey;
	color:black;
}

#menu li a.dead{
	color:#555;
}

#menu li ul{
	position:absolute;
	top:40px;
	left:0;
	display:none;
}

#menu li:hover ul{
	display:block;
}

#menu li ul li:hover ul{
	display:block !important;
}

#menu li ul a{
	width:140px;
	display:block;
	float:none;
	background:#111;
}

#menu li ul li ul{
	position:absolute;
	left:160px;
	top:0;
	display:none !important;
}

#menu li ul li ul a{
	width:50px;
	background:#222;
}

/*#main{	
	padding: 171px 20px 50px;
	width: 100%;
	height: 100%;
	display: block;
}*/

#main{
	height:100%;
	min-height:100%;
	height:auto !important;
	margin:0 auto -32px;
	width:100%;
	overflow:auto;
}

#content{
	/*padding:0 160px 0 0 ;/*50px 20px;*/
	margin-top:151px;
}

.page{
	padding: 20px;
	width: 600px;
	padding-left: 300px;
	margin-left: 100px;
}

.sidebar{
	float:left;
	width:300px;
	margin:20px;
}

#sideadvert{
	width: 300px;
	height: 250px;
	margin-bottom: 10px;
	background: rgba(0,0,0,0.1);
}

.sidebar h1{
	border-bottom: 1px solid #ccc;
	color: #888;
	padding: 8px 0;
	font-size: 22px;
	font-style: italic;
	margin-bottom:6px;
}

.sidebar a{
	color:#666;
	display: block;
	padding: 6px;
	width:258px;
}

.sidebar a:hover{
	background:#ccc;
	color:black;
}

h3{
	font-size: 26px;
	font-style: italic;
	padding: 10px 20px 10px 50px;
	color: rgba(0,0,0,0.9);
	background: #ddd;
	display: inline-block;
	clear: both;
	margin: 10px 0 20px -50px;
}

p{
	text-indent:30px;
	margin:0 10px 20px;
}

blockquote, div.example, div.look, div.my-type{
	color:#411d16;
	background:#f7a999;
	padding:20px;
	/*width:560px;*/
	margin:20px 0;
	font-size:16px;
	line-height:24px;
	font-style:italic;
}

div.example{
	color:#112d3e;
	background:#99d3f7;
}

div.look{
	color:#72522f;
	background:#ffcc95;
}

div.my-type{
	font-size: 13px;
	background: #adb;
	color: #132;
	line-height:20px;
}

div.my-type a{
	display:block;
	text-align:right;
	color:#456;
	margin-bottom:-10px;
}

div.my-type a:hover{
	color:#45f;
}

.biglinks a{
	margin:5px 0;
	padding:20px;
	display:block;
	color:black;
	border:1px solid rgba(0,0,0,.1);
}

.biglinks a strong{
	display:block;
}

.contents{
	border:1px solid #eee;
	width:280px;
	padding:10px;
	margin-bottom:30px;
}

.contents h4{
	font-size:16px;
	color:#555;
}

.contents a{
	color: #888;
	padding: 3px 10px;
	margin: 2px 0;
	display: block;
}

.contents a:hover{
	background:#ccc;
	color:#333;
}

/*.g-plusone-cont{
	position:absolute;
	top:8px;
	right:0;
}

.fb-like{
	position:absolute;
	top:10px;
	right:-150px;
}*/

.share-buttons{
	position: absolute;
	top: 4px;
	right: 4px;
	z-index:450;
}

.bigmbti{
	margin: 50px auto;
	font-size: 40px;
	width: 100%;
	text-align: center;
}

ul.normal{
	padding-left:50px;
}

ul.normal li{
	margin:5px 0;
}

table.subtle{
	border-spacing:3px;
	border:1px solid #eee;
	margin:30px auto;
}

table.subtle td{
	background:#ddd;
	padding:20px;
	font-size:13px;
	vertical-align:top;
}

#letter-table tr td:nth-child(1){
	text-align:right;
}

#letter-table tr td:nth-child(2),
#letter-table tr td:nth-child(3){
	font-size:30px;
	width: 24px;
	text-align: center;
}

#mbti-temperament-table td{
	position:relative;
	padding-left:60px;
}

#cogset div, #mbti-temperament-table div{
	background: rgba(0,0,0,0.4);
	color: white;
	width:36px;
	padding:15px 0;
	text-align:center;
	font-size: 18px;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
}

#cogset td.mbti-N,
#cogset td.mbti-S,
#cogset td.mbti-F,
#cogset td.mbti-T{
	position:relative;
	padding-left:50px;
}

#cogset span{
	display:block;
	margin:0 20px;
	padding:20px;
}

#cogset td.thin{
	padding:0;
	background:transparent
}

ul.normal{
	list-style-type:disc;
	margin-bottom:20px;
}

ul.normal li{
	margin:10px;
}

table.stackslots{
	border-spacing:5px;
	width:240px;
	margin:40px auto;
}

table.stackslots td{
	width:50px;
	height:50px;
	vertical-align:middle;
	text-align:center;
	background:#ccc;
	font-size:20px;
}

#mbti-entry{
	background: #eee;
	border: 1px solid #aaa;
	padding: 10px;
	margin: 40px auto;
	display: block;
	font-size: 28px;
	width: 80px;
	text-align: center;
	text-transform: uppercase;
}

#mbti-entry:focus{
	background:#ddd;
	border-color:#888;
}

#mbti-calc-results{
	border:1px solid #ddd;
	margin-bottom: 20px;
	padding:20px;
}

table.mbti-card{
	border-spacing:2px;
	margin:0 auto;
	width:500px;
	border: 1px solid #eee;
}
		
table.mbti-card td.l{
	text-align:right;
	width:10px;
}
		
table.mbti-card td.r{
	text-align:left;
}
		
table.mbti-card .label{
	font-size: 26px;
	padding: 10px 10px 5px;
}
		
table.mbti-card .label .details{
	font-size:10px;
}
		
table.mbti-card td.subc{
	background:#bbb;
}
		
table.mbti-card td.stress{
	background:#999;
}
		
.mbti-card td{
	padding:10px;
	text-align:center;
	vertical-align:middle;
	background:#ddd;
}

#mbti-type-grid{
	margin:30px auto;
	/*width:360px;*/
	border-spacing:5px;
}

#mbti-type-grid td{
	padding:0;
	width:90px;
	line-height:40px;
	font-size:24px;
	text-align:center;
	position:relative;
}

#mbti-type-grid td a{
	display:block;
	position:absolute;
	width:100%;
	height:40px;
	top:0;
	left:0;
	background:rgba(255,255,255,0.6);
}

#mbti-type-grid td a:hover{
	background:transparent;
}

.inline-link{
	background: #ccc;
	color: #000;
	padding: 2px 5px;
}

.inline-link:hover{
	background: #39aef7;
}

#temperaments-table img{
	float: right;
	height: 100px;
	margin-left:20px;
}

#temperaments-table p{
	text-indent:0;
}

#temperaments-table li{
	margin:0;
}

/* COLOURS! */

#menu li a.none:hover{
	background:#aaa;
}

#menu li a.intro:hover,
.biglinks a.intro:hover,
body.intro header,
body.intro h3{
	background:#d9b359;
}

#menu li a.temperaments:hover,
.biglinks a.temperaments:hover,
body.temperaments header,
body.temperaments h3{
	background:#75bf57;
}

#menu li a.mbti:hover,
.biglinks a.mbti:hover,
#mbti-test .block:hover,
body.mbti header,
body.mbti h3{
	background:#ae86ea;
}

#menu li a.enneagram:hover,
.biglinks a.enneagram:hover,
body.enneagram header,
body.enneagram h3{
	background:#3690eb;
}

#menu li a.socionics:hover,
.biglinks a.socionics:hover,
body.socionics header,
body.socionics h3{
	background:#1ca876;
}

#menu li a.five:hover,
.biglinks a.five:hover,
body.five header,
body.five h3{
	background:#e98550;
}

#menu li a.holland:hover,
.biglinks a.holland:hover,
body.holland header,
body.holland h3{
	background:#e14b4a;
}

#menu li a.lovel:hover,
.biglinks a.lovel:hover,
body.lovel header,
body.lovel h3{
	background:#d671be;
}

#menu li a.tests:hover,
.biglinks a.tests:hover,
body.tests header,
body.tests h3{
	background:#a7826a;
}

/* MYERS-BRIGGS COLOURS */

.mbti-I, .ft-mel{
	background:#dec1d8 !important;
}

.mbti-E, .mbti-SP, .ft-san, .creator, .temper .S{
	background:#ffd1a5/*ffd0b8*/ !important;
}

.mbti-N, .mbti-NT, .ft-phl, .intellectual, .Ni, .Ne, .temper .P{
	background:#b6d5b5 !important;
}

.mbti-S, .mbti-SJ, .ft-chl, .protector, .Si, .Se, .temper .C{
	background:#f0aea5 !important;
}

.mbti-F, .mbti-NF, .visionary, .Fi, .Fe{
	background:#b2e4e7 !important;
}

.mbti-T, .Ti, .Te{
	background:#c8ceea !important;
}

.mbti-J{
	background:#dddddd !important;
}

.mbti-P{
	background:#dec6b4 !important;
}

.temper .M{
	background:#d0aedc;
}


#under-construction{
	background-image:url('img/construction_stripes.gif');
	border:1px solid #332812;
	margin:-1px;
}

#under-construction div{
	background:#ffe6b5;
	border:1px solid #332812;
	margin: 4px;
	padding: 6px;
	text-align: center;
}

#text-link-bar{
	padding: 12px;
}

.ttest-word-pair{
	width: 450px;
	margin: 10px auto;
	/*background: #ccc;*/
	padding: 3px;
}

.ttest-word-pair div{
	padding: 5px;
	display: inline-block;
	margin: 0 2px;
}

.ttest-word-pair .l,
.ttest-word-pair .r{
	width:150px;
	background: #ccc;
	padding:5px 8px;
}

.ttest-word-pair .l{
	text-align:right;
}

.ttest-word-pair .box{
	width: 8px;
	margin: 0 2px;
	background: #ddd;
	cursor:pointer;
}

.ttest-word-pair .box:hover{
	background:#8FD971 !important;
}

.ttest-word-pair .box.sel{
	background:#75bf57;
}

.info{
	margin:10px auto;
	width:600px;
	background:#eee;
	padding:20px;
}

.temper{
	width:300px;
	text-align:center;
	line-height:30px;
	font-size:16px;
	height:80px;
	margin:30px auto 50px;
	border: 1px solid #555;
	padding: 2px;
}

.temper .big{
	line-height:50px;
	font-size:22px;
	height:50px;
}

.temper .tagline{
	font-size:11px;
}

#temperaments-test .totals{
	margin-top:50px;
}

.temperament-intro-box{
	padding:16px;
	margin:0 10px 20px;
	min-height:100px;
}

.temperament-intro-box img{
	float: right;
	height: 100px;
	margin-left:20px;
}

.temperament-intro-box.blend img{
	height:70px;
}

.temperament-intro-box.blend img:nth-of-type(1){
	height: 40px;
	margin-top: 15px;
	margin-left: 5px;
}