/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */

/* #Page Styles
================================================== */

/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
	#footer-sponsor { display: none;}
	#section-top { display: none;}
	span.copyright a { display: none;}
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
	#footer-sponsor { display: none;}
	#section-top { display: none;}
	span.copyright a { display: none;}
	}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/

/* #Mobile App
================================================== */

nav.about ul { width 100%; font-color: #000000; }

nav.about li {
padding-left: 2px;
padding-right: 2px;
margin-bottom: -1px;
margin-top: -1px;
}

nav.about li p{
color: #FFFFFF;
text-decoration: none;
font-size: 10px; 
font-weight: bold;
display: inline-block;
line-height: 16px;
width:100%;
height: 22px;
padding: 0 2px;
text-align: center;
background-color:#CCCCCC;
margin-bottom: 0px;
margin-top: 0px;
}

nav.about li a{
color: #FFFFFF;
text-decoration: none;
font-size: 10px; 
font-weight: bold;
display: inline-block;
line-height: 16px;
width:100%;
height: 22px;
padding: 0 2px;
text-align: center;
background-color: #000000;
margin-bottom: 0px;
margin-top: 0px;
}

nav.about li a.selected,
nav.about li a:hover{ background-color:#CCCCCC; }

nav.working ul {
width 100%;
font-color: #000000;
}

nav.working li {
padding-left: 2px;
padding-right: 2px;
margin-bottom: -1px;
margin-top: -1px;
}

nav.working li a{
color: #FFFFFF;
text-decoration: none;
font-size: 10px; 
font-weight: bold;
display: inline-block;
line-height: 16px;
width:100%;
height: 22px;
padding: 0 2px;
text-align: center;
background-color:#000000;
}

nav.working li p{
color: #FFFFFF;
text-decoration: none;
font-size: 10px; 
font-weight: bold;
display: inline-block;
line-height: 16px;
width:100%;
height: 22px;
padding: 0 2px;
text-align: center;
background-color:#CCCCCC;
margin-bottom: 0px;
margin-top: 0px;
}

p.top_menu {
display: block;
width: 100%;
margin: 0 auto;
line-height: 10px;
height: 22px;
padding: 0 0px;
font-size: 10px; 
font-weight: bold;
text-align: center;
width: 100%;
}

nav.working li a.selected,
nav.working li a:hover{ background-color:#CCCCCC; }

#body { color: #FFFFFF; }

#branding h2 {
width: 940px;
padding: 1px 0px;
margin: 0 auto;
text-transform: uppercase;
font-size: 18px;
font-weight: bold;
background-color: black;	
}
		
h2 { color: #6F2586; }

#section-top {
background-color: #343434;
padding-top: 0.5em;
padding-bottom: 0.5em;
}

#section-top-main {
background-color: #343434;
padding-top: 0.5em;
padding-bottom: 0.5em;
}

#section-sub-footer {
background-color: #343434;

position: fixed;
bottom: 0;
width: 100%;

}

.tagline {
font-size: 1.5em;
font-weight: bold;
color: #6F2586;
color: #FFFFFF;
}

.tag {
padding-left: 3px;
padding-right: 3px;
}

.center {
padding-left: 3px;
padding-right: 3px;
text-align: center;
}

.center.strongtext {
font-weight: bold;
}

.example {
background-color: red;
width: 100%;
height: 40px;
}

hr { 
border: none;
border-top: 1px solid #3b3b3b;
border-bottom: 1px solid #3b3b3b;
clear: both; 
margin: 10px 0 30px; 
height: 3px; 
}

#footer-sponsor { height: 80px; width: 670px; background-color: #343434; }
h1 { padding-top: 20px; }
.reveal, .collapse { cursor: pointer; margin: 5px 0; }
.reveal:hover, .collapse:hover { color: #44F; }
span.copyright a { color: #747476; text-decoration: none; font-size: 9px; }
p.end { color: #747476; text-decoration: none; font-size: 9px; text-align: center;}

label.error { 
float: none; 
color: black; 
padding-left: 0em;
position:relative;
bottom: 20px;
display: block;
font-size: 9px; 
color: red;
}

/*FORM*/

input.mini-input {
display:inline-block;
border: 2px solid #CCCCCC;
width: 50px;
-moz-box-shadow: none !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
margin-bottom: 0px;
margin-left: 2px;
margin-right: 2px;
}

input.mini-input:focus {
display:inline-block;
border: 2px solid #CCCCCC;
-moz-box-shadow: none !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
background-color: #F0F0F0;
font-weight: bold;
}

input.inputlabel {
margin-bottom: 0px;
display:inline-block;
*display: inline;     /* for IE7*/
zoom:1;              /* for IE7*/
vertical-align:middle;
background-color: #FFFFFF;
border: 2px solid #000000;
width: 90px;
height: 20px;
text-align:center;
font-weight:900;
font-size:20px;
}

input.inputlabeltwo {
margin-bottom: 0px;
display:inline-block;
*display: inline;     /* for IE7*/
zoom:1;              /* for IE7*/
vertical-align:middle;
margin-left:-8px;
background-color: #FFFFFF;
border: 2px solid #000000;
width: 80px;
height: 20px;
text-align:center;
font-weight:900;
font-size:20px;
}

input.inputlabeltable {
margin-bottom: 0px;
display:inline-block;
*display: inline;     /* for IE7*/
zoom:1;              /* for IE7*/
vertical-align:middle;
background-color: #FFFFFF;
border: 1px solid grey;
width: 45px;
height: 12px;
text-align:center;
}



input.inputlabel:focus {
border: 2px solid #000000;
background: #F0F0F0; 
font-weight: bold;
}

label.answerlabelthree {
border: 3px solid #000000;
display:inline-block;
*display: inline;     /* for IE7*/
zoom:1;              /* for IE7*/
padding-top: 5px;
padding-bottom: 4px;
padding-left: 2px;
padding-right: 2px;
text-align: left;
width: 52px;
background-color: #000000;
color: #FFFFFF;
font-size: 10px; 
}

label.answerlabelfour {
border: 3px solid #000000;
display:inline-block;
*display: inline;     /* for IE7*/
zoom:1;              /* for IE7*/
padding-top: 5px;
padding-bottom: 4px;
padding-left: 2px;
padding-right: 2px;
text-align: left;
width: 52px;
background-color: #000000;
color: #FFFFFF;
font-size: 10px; 
}

label.answerlabelone {
border: 2px solid #000000;
display:inline-block;
*display: inline;  /* for IE7*/
zoom:1; /* for IE7*/
padding-top: 5px;
padding-bottom: 6px;
padding-left: 2px;
padding-right: 2px;
text-align: left;
width: 52px;
background-color: #000000;
color: #FFFFFF;
font-size: 13px; 
}

label.answerlabeltwo {
border: 2px solid #000000;
display:inline-block;
*display: inline; /* for IE7*/
zoom:1; /* for IE7*/
padding-top: 5px;
padding-bottom: 6px;
padding-left: 2px;
padding-right: 2px;
text-align: left;
width: 52px;
background-color: #000000;
color: #FFFFFF;
font-size: 13px; 
}

label.answerlabelincreaseone {
display:inline-block;
*display: inline; /* for IE7*/
zoom:1;  /* for IE7*/
padding-top: 5px;
padding-bottom: 6px;
padding-left: 2px;
padding-right: 2px;
width: 65px;
color: #FFFFFF;
font-size: 13px; 
background: url('../img/decrease-increase.gif');
background-repeat:no-repeat;
background-position: center center;
text-align: center;
height: 20px;
font-weight: bold;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

label.answerlabelincreasetwo {
display:inline-block;
*display: inline; /* for IE7*/
zoom:1; /* for IE7*/
padding-top: 5px;
padding-bottom: 6px;
padding-left: 2px;
padding-right: 2px;
width: 65px;
color: #FFFFFF;
font-size: 13px; 
background: url('../img/decrease-increase.gif');
background-repeat:no-repeat;
background-position: center center;
text-align: center;
height: 20px;
font-weight: bold;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}


label.answerlabelincreasethree {
display:inline-block;
*display: inline; /* for IE7*/
zoom:1; /* for IE7*/
padding-top: 5px;
padding-bottom: 6px;
padding-left: 2px;
padding-right: 2px;
width: 65px;
color: #FFFFFF;
font-size: 13px; 
background: url('../img/decrease-increase.gif');
background-repeat:no-repeat;
background-position: center center;
text-align: center;
height: 20px;
font-weight: bold;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}


.questionbox {
height: 48px;
width: 187px;
background-color: #000000;
margin:auto;
	
}


label.submitlabel {
border: 2px solid #000000;
display:inline-block;
*display: inline; /* for IE7*/
zoom:1; /* for IE7*/
padding-top: 5px;
padding-bottom: 6px;
padding-left: 2px;
padding-right: 2px;
margin-left: -5px;
text-align: left;
width: 52px;
background-color: #000000;
color: #FFFFFF;
font-size: 13px; 
}

label.submitlabel:hover {
border: 2px solid #CCCCCC;
display:inline-block;
*display: inline; /* for IE7*/
zoom:1; /* for IE7*/
padding-top: 5px;
padding-bottom: 6px;
padding-left: 2px;
padding-right: 2px;
margin-left: -5px;
text-align: left;
width: 52px;
background-color: #CCCCCC;
color: #FFFFFF;
font-size: 13px; 
cursor: hand; 
cursor: pointer;
}

.check-button {
color: #FFFFFF;
font-size: 13px; 
background-color: #000000;
height: 20px;
width:80px;
align: center;
padding: 3px;
text-align: center;
margin:0 auto;
margin-top: 15px;
margin-bottom:15px;
font-weight: bold;
cursor: hand; 
cursor: pointer;
}

.check-button:hover {
background-color: #CCCCCC;
padding: 3px;
margin:0 auto;
margin-top: 15px;
margin-bottom:15px;
font-weight: bold;
cursor: hand; 
cursor: pointer;
}


.check-button-yes {
color: #FFFFFF;
font-size: 13px; 
background-color: orange;
height: 20px;
width:80px;
align: center;
padding: 3px;
text-align: center;
margin-left: 3px;
margin-right: 3px;
margin-top: 15px;
margin-bottom:15px;
font-weight: bold;
cursor: hand; 
cursor: pointer;
float:left;
}

.check-button-yes:hover {
background-color: #CCCCCC;
padding: 3px;
margin-left: 3px;
margin-right: 3px;
margin-top: 15px;
margin-bottom:15px;
font-weight: bold;
cursor: hand; 
cursor: pointer;
float:left;
}

.check-button-no {
color: #FFFFFF;
font-size: 13px; 
background-color: blue;
height: 20px;
width:80px;
align: center;
padding: 3px;
text-align: center;
margin-left: 3px;
margin-right: 3px;
margin-top: 15px;
margin-bottom:15px;
font-weight: bold;
cursor: hand; 
cursor: pointer;
float:left;
}


.check-button-no:hover {
background-color: #CCCCCC;
padding: 3px;
margin-left: 3px;
margin-right: 3px;
margin-top: 15px;
margin-bottom:15px;
font-weight: bold;
cursor: hand; 
cursor: pointer;
float:left;
}

#wrap {
width:200px;
margin:0 auto;	
}


.check-button-large {
color: #FFFFFF;
font-size: 13px; 
background-color: #000000;
height: 20px;
width:200px;
align: center;
padding: 3px;
text-align: center;
margin:0 auto;
margin-top: 15px;
margin-bottom:15px;
font-weight: bold;
cursor: hand; 
cursor: pointer;
}

.check-button-large:hover {
background-color: #CCCCCC;
padding: 3px;
margin:0 auto;
margin-top: 15px;
margin-bottom:15px;
font-weight: bold;
cursor: hand; 
cursor: pointer;
}

/*Article*/
.detail {
/*display:none;*/
 }
  #article-one {
	 border-bottom:double;
 }
 
 
 
 #article-two { border-bottom:double;}
 #article-three { border-bottom:double;}
 #article-four { border-bottom:double;}
 #article-five { border-bottom:double;}
 #article-six { border-bottom:double;}
 #article-seven { border-bottom:double;}
 
 .articleclass {
	  border-bottom:double;
	 border-top:double;
	 background-color:#F0FFF0;
	 
 }
 
.right_image {
	float: right;
	margin-left: 99%;
	margin-bottom: 15px;
	margin-top: -15px;
	
	
}
 
 p.answer {
text-decoration: none;
text-align: right;
position:relative;
right:-80px;
top: -30px;

width: 70px;
display: block; 
 float: right;
}
 
p.breadcrumbs {
margin-top: 0px;
}

p.breadcrumbs a {
	text-decoration: none;	
}



p.hint-ecp1 {
text-align: center;
font-size: 13px; 
color: #000000;
}

p.hint-edp1 {
text-align: center;
font-size: 13px; 
color: #000000;
}

p.hint-eep1 {
text-align: center;
font-size: 13px; 
color: #000000;
}


p.hint-sia {
text-align: center;
font-size: 13px; 
color: #000000;
}

p.hint-sib {
text-align: center;
font-size: 13px; 
color: #000000;
}


p.breadcrumbs {
margin-top: 0px;
}

hr.article-hr {
  margin: 0px;
  margin-bottom: 4px;
}

.view-table a {
color: #FFFFFF;
text-decoration: none;
font-size: 13px; 
line-height: 20px;
font-weight: bold;
}

.view-table {
width: 100px;
height: 20px;
padding: 4px;
margin: 0 auto;
background-color: #000000;
/*background: url('../img/table.gif');*/
/*background-repeat: no-repeat;*/
text-align: center;
}

.view-table:hover {
width: 100px;
height: 20px;
padding: 4px;
margin: 0 auto;
background-color: #CCCCCC;
/*background: url('../img/table.gif');*/
/*background-repeat: no-repeat;*/
text-align: center;
}


.hidden-button a {
color: #FFFFFF;
text-decoration: none;
font-size: 13px; 
line-height: 20px;
font-weight: bold;
}

.hidden-button  {
width: 100px;
height: 20px;
padding: 4px;
margin: 0 auto;
background-color: #000000;
/*background: url('../img/table.gif');*/
/*background-repeat: no-repeat;*/
text-align: center;
display:none;
}

.hidden-button:hover {
width: 100px;
height: 20px;
padding: 4px;
margin: 0 auto;
background-color: #CCCCCC;
/*background: url('../img/table.gif');*/
/*background-repeat: no-repeat;*/
text-align: center;
}

p.view-answer {
color: #FFFFFF;
text-decoration: none;
font-size: 13px; 
line-height: 20px;
font-weight: bold;
cursor: pointer; 
}

#view-answer {
width: 100px;
height: 20px;
padding: 4px;
margin: 0 auto;
background-color: #000000;
/*background: url('../img/table.gif');*/
/*background-repeat: no-repeat;*/
text-align: center;
}

#view-answer:hover {
width: 100px;
height: 20px;
padding: 4px;
margin: 0 auto;
background-color: #CCCCCC;
/*background: url('../img/table.gif');*/
/*background-repeat: no-repeat;*/
text-align: center;
cursor: pointer; 
}

form, central-form {
margin:0 auto;
width:230px;
padding: 5px;
}

.single-price-one {
margin:0 auto;
width:250px;
margin-bottom: 15px;
}

.single-price-one tbody td {
border: 1px solid #CCCCCC;
background-color: #333;
font-size: 10px; 
font-weight: bold;
color: #FFFFFF;
margin:0 auto;
}

.single-price-one thead th {
border: 1px solid #CCCCCC;
background-color: #FFFFFF;
font-size: 10px; 
font-weight: bold;
color: #333;
text-align: center;
}

.single-price-one tbody th {
background-color: #FFFFFF;
font-size: 10px; 
font-weight: bold;
color: #333;
text-align: center;
}

.single-price-one .single-priceone {
background-color: #CCCCCC;
border: 1px solid #FFFFFF;
font-size: 10px; 
font-weight: bold;
color: #333;
text-align: center;
padding: 0px;
}

.single-price-one .single-pricetwo {
background-color: #FFFFFF;
border: 1px solid #FFFFFF;
font-size: 10px; 
font-weight: bold;
color: #333;
text-align: center;
padding: 0px;
}

label.answerlabelone {
width: 73px;
text-align: center;
}

#tick {
font-size: 14px; 
font-weight: bold;
color: green;
}

a.csvdownload {
color: #FFFFFF;
font-size: 13px; 
background-color: #333333;
height: 20px;
width:130px;
padding: 7px;
margin:0 auto;
margin-top: 15px;
margin-bottom:15px;
font-weight: bold;
cursor: hand; 
cursor: pointer;
text-decoration: none;
text-align: center;
display:block;
}

a.csvdownload:hover {
background-color: #CCCCCC;
color: #FFFFFF;
padding: 7px;
margin:0 auto;
margin-top: 15px;
margin-bottom:15px;
font-weight: bold;
cursor: hand; 
cursor: pointer;
}


a.button_link {
color: #FFFFFF;
font-size: 13px;
font-weight: bold;
text-decoration: none;
cursor: hand; 
cursor: pointer;
}

a.button_link:hover {
color: #FFFFFF;
cursor: hand; 
cursor: pointer;
}





p.highlight {
color: red;
font-weight: bold;
display:inline;
}

.hidden-text {
padding-top: 10px;
display: none;
}

/*Question CSS Construction*/
.piq1aclass {padding-top: 10px; display: none;}
.piq1bclass {padding-top: 10px; display: none;}
.eep1class {padding-top: 10px; display: none;}
.eap1class {padding-top: 10px; display: none; font-weight: bold;}
.ebp1class {padding-top: 10px; display: none; font-weight: bold;}
.ecp1class {padding-top: 10px; display: none; font-weight: bold;}
.edp1class {padding-top: 10px; display: none; font-weight: bold;}
.eep1class {padding-top: 10px; display: none; font-weight: bold;}
.efp1class {padding-top: 10px; display: none; font-weight: bold;}
.egp1class {padding-top: 10px; display: none; font-weight: bold;}
.ehp1class {padding-top: 10px; display: none; font-weight: bold;}
.siaclass {padding-top: 10px; display: none; font-weight: bold;}
.sibclass {padding-top: 10px; display: none; font-weight: bold;}
.siq1class {padding-top: 10px; display: none;}
.tsie1class {padding-top: 10px; display: none; font-weight: bold;}
.siq2class {padding-top: 10px; display: none;}
.siq3class {padding-top: 10px; display: none;}
.siq4class {padding-top: 10px; display: none;}
.min1class {padding-top: 10px; display: none;}
.cpie1class {padding-top: 10px; display: none;}
.cpie2aclass {padding-top: 10px; display: none; font-weight: bold;}
.cpie2bclass {padding-top: 10px; display: none; font-weight: bold;}
.cpie3aclass {padding-top: 10px; display: none; font-weight: bold;}
.cpie3bclass {padding-top: 10px; display: none; font-weight: bold;}
.rre1class {padding-top: 10px; display: none;}
.rre2class {padding-top: 10px; display: none;}
.rre2bclass {padding-top: 10px; display: none;}
.tsde1class {padding-top: 10px; display: none;}
.tsde2class {padding-top: 10px; display: none;}
.tsde3class {padding-top: 10px; display: none;}
.tsde4class {padding-top: 10px; display: none;}
.tsde4class {padding-top: 10px; display: none;}
.tsde4bclass {padding-top: 10px; display: none;}
.tsma1class {padding-top: 10px; display: none;}
.pcex1class {padding-top: 10px; display: none;}


p.source {
font-size: 9px; 
line-height: 10px;
font-weight: bold;
}


/* Construction Style */
.construction_one {
margin-left:-90px;
border: 3px solid #FFFFFF; 
height: 345px;
width: 345px;
margin: 0 auto;
display:block;
}
	
/* Deflating Style */
.deflating_one {
margin-left:-90px; 
border: 3px solid #FFFFFF; 
height: 345px; 
width: 345px; 
margin: 0 auto; 
display:block;
}

/* CPI Style*/
p.keyfacts {font-size: 10px; line-height: 10px; font-weight: bold; color: darkgrey; margin:7px;}
p.keyfacts-head {font-size: 11px; line-height: 10px; font-weight:900; color: darkgrey; margin:0;}
.keyfacts_list li { list-style: square; font-size: 10px; line-height: 10px; font-weight: bold; color: darkgrey; margin:7px}
.keyfacts_list { padding-left: 20px;}

/* Rebasing Style */
.rebasing_one {
margin-left:-90px;
border: 3px solid #FFFFFF; 
height: 230px;
width: 345px;
margin: 0 auto;
display:block;
}

/* Time Series Style */
.timeseries_one {
margin-left:-90px; 
border: 3px solid #FFFFFF; 
height: 345px; 
width: 345px; 
margin: 0 auto; 
display:block;
}
	
	
sub {font-size:xx-small; vertical-align:sub;}
i {font-style:italic}
p.sameline {display: block; width: 240px; margin: 0 auto;}
p.source { font-size: 9px; line-height: 10px; font-weight: bold; text-align: center; }
.letter-list { list-style-type: lower-alpha; margin-left:15px;}
.highlight-keyword em {color: DarkOrange; font-weight:bold;}
.highlight-keyword-blue em {color: blue; font-weight:bold; font-style:normal;}
.square_list {list-style: square; margin-left:15px;}
.dodgy-bullets li {list-style-type: square; text-align:justify;}
	
.highlight-keyword a {
	text-decoration:none;
		
}