/* HTML tags */
*,
*:after,
*:before {
    box-sizing: border-box;
}
        
/* DEFAULTS
----------------------------------------------------------*/
BODY                        {font-family: Lato; font-size: .875em; line-height:1.25em; margin: 0; padding: 0; background: #f5f5f5; color: #606163;}
P                           {font-style: normal; font-weight: 500; margin-bottom: 1.75em; line-height:1.4em;}
A[disabled="disabled"], 
A.disabled                  {text-decoration:none;}
TH                          {text-align:left;}
IMG                         {border:none;    vertical-align: middle;}
A                           {font-weight:normal; text-decoration:underline; color:#606163;}
A:hover                     {text-decoration:none;	}
dl, dt, dd, ol, ul          {margin-left:1em; padding-left:3em; margin-bottom:1.75em}
P + ul                      {margin-top: -1.5em;}
ul ul                       {margin-bottom:0;}

/* HEADINGS   
----------------------------------------------------------*/
H1, H2, H3, H4, H5, H6      {text-transform: none; margin-bottom: .6em; color: #a9925e;}
H1                          {font-weight: 300; font-size: 1.6em; color:#0063a4;}
H2                          {font-weight: 300; font-size: 1.3em; color:#a9925e; font-style:italic;}
H3                          {font-size: 1em; color:#A6CE39}
H1 EM, H2 EM, H3 EM         {font-weight: bold; font-style: italic;}
h2.leadertext               {margin-bottom: 1.75em; line-height: 1.3em; font-style: italic;}

/* PRIMARY LAYOUT ELEMENTS */
.headertop                  {width: 100%; height: 128px; background-color: #c8eaf0; border-top: 40px solid #008d90; border-bottom: 20px solid #fff;
                             background:repeating-linear-gradient(135deg, #c8eaf0, #c8eaf0 6px, #b5dfec 6px, #b5dfec 7px);}
.container                  {max-width: 1140px; margin: 0 auto; }
.container[role="main"]     {background:url('../content/images/logo-fade.png') no-repeat bottom left; position:relative; padding:40px; background-color:#FFF; margin-top:-115px; overflow:hidden; }
footer                      {width: 100%; margin: 0; padding:40px; background-color: #00494a; color: #fff; clear: both;}
.main-section               {float:left; width:60%; padding-right:50px;}
.tovaccess-section          {float:right; width:40%; font-size:.85em; }


/* HEADER */
.logo                       {position:absolute; top:16px;}
.banner                     {width:100%; height: auto; min-height: 200px}



/* CONTENT AREA */
.tovaccess-section h1        {display: none;}
.tovaccess-section h2        {color: #a6ce39; font-style:normal; font-weight:400; font-size:1.75em; line-height:1.25em}
.tovaccess-section h3        {color: #a6ce39; }
.tovaccess-section button               {cursor: pointer; width:80%; padding: 2em; border: solid 1px; border-radius: 5px; margin: 0 0 1em 0; text-transform: uppercase; text-align: center; font-weight: 400;}
.tovaccess-section button.lightgreen    {color: #fff; background-color: #a6ce39;}
.tovaccess-section button.darkgreen     {color: #fff; background-color: #38b549;}
.tovaccess-section button:hover         {background: #00494a; transition: all .5s}
.tovaccess-section button:disabled       {background-color: lightgray; color: darkgrey; cursor: default}
.tovaccess-section .formelement                         {width:100%;}
.tovaccess-section .formelement label                   {float:left; width: 80%; margin-bottom:1.5em}
.tovaccess-section .formelement input                   {float:right}
.tovaccess-section .formelement input[type='checkbox']  {width:2em; height: 2em;}
.tovaccess-section select {font-size:1.5em;}
.tovaccess-section .preface {font-size: 1.2em;}



/* FOOTER */
footer a                    {color: #fff;}
footer ul                   {display: inline-block; float: left; margin: 0; padding: 0;}
footer ul li                {display: inline-block; float: left; margin: 0 31px 0 0; padding: 0;font-size:.75em}
footer .contactdetails      {float: right;font-size:.75em}
footer .developedby         {clear:both; padding-top:20px; display:block; xtext-align:right; font-size:.75em}
footer .enginesolutions     {display: inline-block; line-height: 20px;}
footer .enginesolutions a span {font-weight: 700; color: #8e9499;}



.roundedbox {
    border: 1px solid;
    padding: 21px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-color: #e7e7e7;
    border-color: #dbdbdb;
}

.select-style {
    width:100%;
    padding: 0;
    margin: 0 0 2em 0;
    border: 1px solid #ccc;
    border-radius: 0;
    overflow: hidden;
    background: #dad9d9 url("../content/images/downarrow_gold.png") no-repeat right 50%;
}

.select-style select {
    cursor: pointer;
    color: #a9925e;
    padding:22px 20px;    
    height:70px;    
    width: 100%;
    border: none;
    box-shadow: none;
    background-color: transparent;
    background-image: none;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}

.select-style select:focus {
    outline: none;
}



.container[role="main"] .squarebox {width: 100%; border-bottom: dotted 1px #606163; padding-bottom: 20px;margin-bottom: 2em;}
.container[role="main"] .squarebox table { width:100%; margin-bottom: 1em; font-size:.9em; }
.container[role="main"] .squarebox th {font-weight: 700;}
.container[role="main"] li {line-height: 1.4em;}




.datasettable th {vertical-align: bottom; background-color: #007c7e; border-right: 1px solid #005a5d; color: #fff; font-weight: 700;line-height: 1.4em;}
.datasettable th.datasetsubheader {background-color:#bde5ed; color: #606163;}
.datasettable th.blank {background-color:white;}
.datasettable th, .datasettable td {padding: 10px 8px; border: solid 1px #d0d0d0;}
.datasettable td.hcptitle    {background-color: #f4eddb;}
.datasettable td.hcotitle    {background-color: #e9dcba;}
.datasettable td.randdtitle  {background-color: #cfe6f6;}
.datasettable .notapplicable {background: url('../content/images/notapplicable.png') repeat;}

.datasettable .rotate {
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);

  /* also accepts left, right, top, bottom coordinates; not required, but a good idea for styling */
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  transform-origin: 50% 50%;

  /* Should be unset in IE9+ I think. */
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
.datasettable td.graycell    {background-color: #f4eddb;background-color: #e7e7e7; border-bottom: 1px solid #d0d0d0; font-style: italic;}

.back {background: url(../content/images/icon_back.png) no-repeat left; color: #606163; font-size: 1.1em; padding: 10px 0 10px 25px;}

/* Cookie Message */
#cookiemessage
{
    position: fixed; 
    left: 0; 
    bottom: 0; 
    z-index: 100000; 
    width:100%; 
    background:#00494a; 
    opacity: .95; 
    overflow: hidden; 
    display: none;
    padding: 0 40px;
}
#cookiemessage h2
{
    color: #fff; 
    font-size:22px; 
    padding: 20px 0 10px 0;
}
#cookiemessage p
{
    color: #fff; 
    font-size:13px; 
    padding-bottom: 20px;
}
#cookiemessage #continuelink
{
    float: right; 
    font-size: 23px; 
    text-align: center; 
    padding-top: 40px;
}
#cookiemessage a.policy
{
    color: #fff; 
    text-decoration: underline;
}
#cookiemessage a.policy:hover
{
    text-decoration: none;
}

/* Misc */
.right
{
	float:right;
}