body
{
    /*position:relative;*/
    
    margin:0px;
    border:0;
    padding:0px;
    
/*    width: 100%;*/
   
/*    background-color: rgb(200,200,200); #E0E0E0; /*whitesmoke; /* #F5F5F5;*/
    /*background-position: left top;
    /*background-size: contain;*/
    /*background-repeat: repeat;*/
    /*background-image: url('../images/background_page.jpeg');*/
    
    font-family: /*"Times New Roman", Times, serif;*/ Arial, Helvetica, sans-serif;
    font-size: 14px;
}

#main_body
{
    position: absolute;
    top:0px;
    left:0px;
    
    margin:0px;
    border:0px solid black;
    padding:0px;
    
    width: 100%;
    min-height: 100%;
    
    background-image: -o-linear-gradient(bottom, rgb(240,240,240) 0%, rgb(176,176,176) 100%);
    background-image: -moz-linear-gradient(bottom, rgb(240,240,240) 0%, rgb(176,176,176) 100%);
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0%, rgb(240,240,240)), color-stop(100%, rgb(176,176,176)));
    background-image: -webkit-linear-gradient(bottom, rgb(240,240,240) 0%, rgb(176,176,176) 100%);
    background-image: -ms-linear-gradient(bottom, rgb(240,240,240) 0%, rgb(176,176,176) 100%);
    background-image: linear-gradient(bottom, rgb(240,240,240) 0%, rgb(176,176,176) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='rgb(240,240,240)', endColorstr='rgb(176,176,176)', GradientType=0); /* ie */  /* corresponds to height of #footer */
    
    /*    background-color:   #0176A0;
    background-image:   -moz-radial-gradient(center, ellipse cover, #029CC9 0%, #005077 100%);
    background-image:   -webkit-radial-gradient(center, ellipse cover, #029CC9 0%, #005077 100%);
    background-image:   -o-radial-gradient(center, ellipse cover, #029CC9 0%, #005077 100%);
    background-image:   -ms-radial-gradient(center, ellipse cover, #029CC9 0%, #005077 100%);
    background-image:   radial-gradient(center, ellipse cover, #029CC9 0%, #005077 100%);
    filter:             progid:DXImageTransform.Microsoft.gradient(startColorstr = '#029CC9', endColorstr = '#005077', GradientType = 0);*/

}

#header
{
    position:relative;
    background-color: rgb(200,200,200);    
    margin:0px;
    border:0;
    padding: 0px;
    /*z-index:1;*/
    
    width:auto;
    height:50px;
}

#container
{
    position:relative;
    
    margin:75px auto 25px auto;
    border:0;
    padding:0px;
    
    width:100%; /*60%*/
    height:auto;
    
    background-color:0; /*whitesmoke; #F5F5F5;*/
    background-position: left top;
    background-size: contain;
    background-repeat: repeat-x;
    /* background-image: url('../images/background_content.jpg'); image doesn't exist */
}

#footer
{
    position:relative;
    
    margin:0px;
    border:0;
    padding:0px;
    
    width:100%;
    height:auto;
    
    background-color: yellow;
    
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10px;
}

#navigation{
    /*float:right;
    position:absolute;
    top:0;
    right:0;*/
}

input[type=text] {
	font-weight: bold;
}

table
{
    /* padding-left:5px; */
}

#body{
    padding:20px 15px 20px 15px;
}

select{
    width:300px;
}

.item{
    display:block;
    float:left;
    border:1px solid;
    margin:5px;
}

.box{
    width:465px; 
    margin:7px; 
    height:200px; 
    border:1px solid; 
    float:left;
}
/* login stuff */

tr.login{
    border:1px solid;
    font-size:2.0em;
}

tr.login td{
    width:300px;
}

input.login, select.login{
    width:300px;
    font-size:1.0em;
}

a img {
   /* border:5px solid aqua;*/
}

ul{
    
}

li{
    list-style: none;
    min-height: 20px;

}

a.chartlink{
    background:url("../images/chart_pie.png") no-repeat left;
    padding-left:20px;
}

ul li{
    background-color:#EEEEEE;
}

li ul li{
    background-color:#F9F7ED;

}

a{
   
}

li img{
    float:right;
}

.noclose .ui-dialog-titlebar-close
{
    display:none;
}

/* #submitForm {
    width: 49.9%!important;
    top: unset!important;
    left:unset!important;
    margin: 0!important;
    padding: 0px!important;
}
#qListfile {
    width: 49.9%!important;
    top: unset!important;
    left:unset!important;  
    margin: 0!important;  
}
#formControls {
    position: absolute!important;
    right: 0px!important;
    width: 47%!important;
    top: 0px!important;
    margin-top: -75px!important;
}
.crystalstyle #GroupHeaderSection2,
.crystalstyle #GroupHeaderSection2 div, .crystalstyle #GroupHeaderSection2 div div, .crystalstyle #GroupHeaderSection2 div div div
.crystalstyle #GroupHeaderSection2 span, .crystalstyle #GroupHeaderSection2 span span .crystalstyle #GroupHeaderSection2 span span span {
    max-width: 450px!important;
} */

.disclaimer-form {
    clear: both;
    max-width: 1024px;
    margin: 60px auto 30px auto;
}

.disclaimer-form h1 {
    text-align: center;
    font-size: 32px;
    border-bottom: solid 2px #666;
    padding-bottom: 1em;
}

.disclaimer-text {
    padding: 32px 32px 100px 32px;
}

.disclaimer-text ul li {
    background: transparent;
    list-style: disc;
}

.disclaimer-agree-container {
    text-align: center;
    margin-top: 16px;
    background: #aaa;
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    align-items: center;
    justify-content: center;
    padding: 8px;
}

.disclaimer-agree-label {
    padding: 16px;
    font-weight: bold;
    font-size: 20px;
    display: flex;
    align-items: center;
}

.disclaimer-agree-label input {
    display: inline-block;
    margin-right: 16px;
    transform: scale(1.5);
}

.disclaimer-agree-button {
    padding: 10px 30px;
    display: inline-block;
    font-size: 18px;
    font-weight: bold;
    border: solid 2px blue;
    border-radius: 30px;
    color: blue;
}
#main_body.disclaimer {
    background: #fff !important;
}

/* override global li colour */
.select2-results ul li {
    background: transparent;
}

/* sections controls */
#sectionsIndexDialog ul {
    padding: 0;
    margin: 16px 0;
}
#sectionsIndexDialog ul li {
    background: transparent;
}
#sectionsIndexDialog ul li button {
    display: block;
    border: solid 1px #ddd;
    background: #eee;
    font-size: 16px;
    padding: 8px;
    text-align: left;
    cursor: pointer;
    width: 100%;
    transition: background .25s;
}
#sectionsIndexDialog ul li button:hover {
    background: #fff;
}
#sections-button {
    width: 80px;
    height: 70%;
    background-color: #EBF5FB;
    padding: 0px;
    text-align: center;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
    border-radius: 12px;
    border: 3px solid blue;
}



/* drag and drop hand entries */
.gu-mirror {
    position: fixed !important;
    margin: 0 !important;
    z-index: 9999 !important;
    opacity: 0.8;
}
.gu-hide {
    display: none !important;
}
.gu-unselectable {
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    user-select: none !important;
}
.gu-transit {
    opacity: 0.8;
}
.target.dragzone {
    background: #ddd;
    border: solid 1px #333;
    border-radius: 3px;
    min-width: 160px;
    min-height: 35px;
    position: relative;
    /* display: flex;
    align-items: center;
    justify-content: center; */
    z-index: 9998;
}
.target.dragzone span {
    color: #707070;
}
.draggable {
    background: #aaa;
    display: inline-block;
    border-radius: 2px;
    padding: 5px 10px;
    cursor: move;
    box-sizing: border-box;
    font-size: 18px;
    margin-left: 5px;
    margin-right: 5px;
}
.top.dragzone {
	position: absolute;
	z-index: 45;
	top: 190px;
	left: 80px;
	width: 678px;
	background: #eee;
	height: 145px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
    transition: top 1s;
    border: solid 1px black;
}
.target.dragzone .draggable {
    position: absolute;
    top: 2px;
    left: 50%;
    transform: translateX(-50%);
    margin: 0;
}


#prev-page-cell,
#page-indicator-cell,
#next-page-cell
{
  position: fixed;
  top: 133px;
  height: 70px !important;
  right: calc(25% + 60px);
  z-index: 50;
}

#next-page-cell {
  right: calc(25% - 100px);
}
#prev-page-cell {
  right: calc(25% + 80px);
}
#page-indicator-cell {
    top: 140px;
  right: calc(25% - 29px);
}
#pageControlsPan::before {
  display: block;
  content: '';
  position: fixed;
  top: 134px;
  background: rgb(240,240,245);
  right: calc(25% - 140px);
  width: 300px;
  height: 55px;
  z-index: 30;
  border-bottom: solid 2px rgb(200,200,200);
  border-left: solid 1px rgb(200,200,200);
  border-right: solid 1px rgb(200,200,200);
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
}

#RightPan {
    height: calc(100% - 55px); background-color: white; position:relative;   border:5;  border-style: single; overflow-y: auto; margin-top: 55px;
    
    
    margin-top: 0;
    height: 100%;
}

body[data-hide-side=answer] #RightGroup,
body[data-hide-side=answer] #pageControlsPan::before
{
    display: none;
}
body[data-hide-side=answer] #prev-page-cell,
body[data-hide-side=answer] #page-indicator-cell,
body[data-hide-side=answer] #next-page-cell {
    left: -8000px;
}
body[data-hide-side=question] #LeftGroup {
    display: none;
}
body[data-hide-side=question] #RightPan {
    margin-top: 0;
    height: 100%;
}



body[data-hide-side=question] #next-page-cell {
  left: calc(25% + 46px);
  right: auto;
}
body[data-hide-side=question] #prev-page-cell {
  left: calc(25% - 132px);
  right: auto;
}
body[data-hide-side=question] #page-indicator-cell {
  left: calc(25% - 50px);
  right: auto;
}
body[data-hide-side=question] #pageControlsPan::before {
  left: 25%;
  transform: translateX(-50%);
  right: auto;
}


.ui-dialog .ui-state-default {
	border: 1px solid #74b2e2 !important;
	background: #e4f1fb url("/assets/images/ui-bg_glass_100_e4f1fb_1x400.png") 50% 50% repeat-x !important;
	font-weight: bold !important;
	color: #0070a3 !important;
}