/***********************************************/
/* 3col_leftNav.css                             */
/* Use with template 3col_leftNav.html          */
/***********************************************//*
Changed .medium_tbl width: from 70% to 100%;

/*************** Normalise browser behavious *********/
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}                                               
                                                 
/***********************************************/
/* HTML tag styles                             */
/***********************************************/ 

html{
    background-color:#000000;
    font-size: calc(9px + (22 - 9) * ((100vw - 300px) / (1600 - 300)));      
}

body{
    font-family: Arial, Helvetica, sans-serif;
    color: #fafafa;
    line-height: 1.166;
    margin: auto;
    background-color:#000000;
    padding: 0%;
    width: 100%;
}

a{
    color: #b6dafa;
    text-decoration: none;
    word-wrap: break-word;	
}

a:link{
    color: #b6dafa;
    text-decoration: none;
}

a:hover{
    color: #F8891F;
    text-decoration: underline;
}

h1{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 120%;
    color: #fafafa;
    margin: 0%;
    padding: 0%;
}

h2{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 114%;
    color: #fafafa;
    margin: 0%;
    padding: 0%;
}

h3{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%;
    color: #fafafa;
    margin: 0%;
    padding: 0%;
}

h4{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%;
    font-weight: normal;
    color: #fafafa;
    margin: 0%;
    padding: 0%;
}

h5{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%;
    color: #fafafa;
    margin: 0%;
    padding: 0%;
}

ul{
    list-style-type: square;
}

ul ul{
    list-style-type: disc;
}

ul ul ul{
    list-style-type: circle;
}

label{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%;
    font-weight: bold;
    color: #fafafa;
}

img, embed, object, video {
    max-width: 100%;
    max-height: 100%;
}

/***********************************************/
/* Layout Divs                                 */
/***********************************************/

#masthead{
    width: 95%;        
    margin-left: 5%;
    padding: 0.3% 0% 0.3% 0%;
}

#headlines{
    float:right;
    width: 11%;
    border-right: 1px solid #F8891F;
    border-bottom: 1px solid #F8891F;
    border-left: 1px solid #F8891F;
    margin-right: 5%;
    padding: 0.3%;
/*    word-wrap: break-word;*/
}

#content{
    float: left;
    width: 78%;
    margin-left: 5%;      
}

/***********************************************/
/* Components                                  */
/***********************************************/

.sticky {/*makes the navigation stick to the top when scrolling*/
    background-color: #000000;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 1;    
    border-bottom: 1px solid #F8891F;
}

/************* #globalNav styles **************/

#globalNav{
    width: 95%;        
    margin-left: 5%;
    padding: 0.3% 0% 0.3% 0%;    
    color: #ffffff;
}

#globalNav img{
 display: block;
}

#globalNav a {
    font-size: 90%;
    color: #ffffff;
    padding: 0% 0% 0% 1%;
}

#globalNav a:hover{
    color: #F8891F;
    text-decoration: underline;
}

/************** #headlines styles **************/

#headlines a{
    font-size: 85%;
}
#latestnews h2{
    color:#FF0000
}

/************* #localNav styles **************/

#localNav{
    width: 75%;        
    margin-left: 5%;
    padding: 0.3% 0% 0.3% 0%;    
    color: #b6dafa;
}

#localNav a {
    font-size: 90%;
    padding: 0.5% 0.5% 0.5% 0.5%;
}

/*************** #pageName styles **************/

#pageName{
    width: 95%;        
    margin-left: 5%;
    padding: 0.5% 0% 0.5% 0%;
}

/************** .error styles *****************/

.error h3{

    padding: 1% 1% 1% 0%;
    text-align: left;
    color: #FF0000;
    font-size: 100%;	
}

/************** .feature styles ***************/

.feature{
    padding: 0% 0% 0.3% 0%;
    font-size: 90%;
}

.feature h3{
    padding: 30px 0px 5px 0px;
    text-align: left;
}

.feature img{
    float: left;
    padding: 10px 10px 0px 0px;
}

/************** .story styles *****************/

.story{
    clear: both;
    padding: 10px 0px 0px 10px;
    font-size: 90%;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
}

.story p{
    padding: 0px 0px 10px 0px;
}

/************** form styles *****************/
*, *:before, *:after {
  box-sizing: border-box;
}

input[type=text] {
    background-color: #000000;
    color: #fafafa;
    padding: 0.3%;
    border: 1px solid #fafafa;
}
input[type=password] {
    background-color: #000000;
    color: #fafafa;
    padding: 0.3%;    
    border: 1px solid #fafafa;
}
.button {
    display:inline-block;
    border: 0.1rem solid #fafafa;
    border-radius: 0.1rem;
    background: #b6dafa;
    color: #000000;
    line-height: 1.2;
    white-space: nowrap;
    box-sizing: border-box;
    text-decoration: none;
    padding: 0.1rem 0.3rem;
    margin: 0.1rem;
    cursor: pointer;
}
.button:hover {
    background-color: #000000;
    color: #F8891F;
}
/*
.button:hover{
 color:#000000;
 background-color:#FFFFFF;
}*/
select {
    background-color: #000000;
    color: #ffffff;
    padding: 0.3%;    
    border-radius:3px;
}
/************** .narrow_tbl styles *****************/
.narrow_tbl  {
    width: 40%;
    border: 1px;    
    border-collapse: collapse;
    text-align: left;
}
.narrow_tbl th,td{
    padding: 0.3%;
}

.narrow_tbl textarea {
    background-color: #000000;
    color: #ffffff;
    border: 1px solid #ffffff;
}
/************** .medium_tbl styles *****************/
.medium_tbl{
    width: 100%;
    border: 1px;    
    border-collapse: collapse;
    text-align: left;
    table-layout: fixed;
}
.medium_tbl th,td{
    padding: 0.3%;
}

/************** .wide_tbl styles *****************/
.wide_tbl {
    width: 100%;
    border: 1px;
    border-collapse: collapse;
    text-align: left;
    font-size: 80%;
}
.wide_tbl th,td {
    padding: 0.3%;
}
/* Zebra striping */
.wide_tbl tr:nth-of-type(odd) { 
  background: #424242; 
}
.wide_tbl th { 
  background: #424242; 
  color: #fafafa; 
}
.wide_tbl td, th { 
  padding: 0.3%; 
  /*border: 1px solid #fafafa; */
  text-align: left; 
}
.w_5 {
  width: 5%;
}
.w_10 {
  width: 10%;
}
.w_15 {
  width: 15%;
}
.w_20 {
  width: 20%;
}
.w_25 {
  width: 25%;
}
.w_30 {
  width: 30%;
}
.w_35 {
  width: 35%;
}
.w_40 {
  width: 40%;
}

/************** .wide_adm_tbl styles *****************/
.wide_adm_tbl {
    width: 100%;
    border: 1px;
    border-collapse: collapse;
    text-align: left;
    font-size: 80%;
}
.wide_adm_tbl th,td {
    padding: 0.3%;
}
/* Zebra striping */
.wide_adm_tbl tr:nth-of-type(even) { 
  background: #424242; 
}
.wide_adm_tbl th { 
  background: #424242; 
  color: #fafafa; 
}
.wide_adm_tbl td, th { 
  padding: 0.3%; 
  border: 1px solid #fafafa; 
  text-align: left; 
}
@media 
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

/* Set font size for small screen widths  */
    table, thead, tbody, th, td, tr { 
    font-size: 95%;
/*    word-wrap: break-word;*/
    }
}
/*@media 
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

	/* Force table to not be like tables anymore */
/*	.wide_adm_tbl table, thead, tbody, th, td, tr { 
		display: block; 
                font-size: 110%;
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
/*	.wide_adm_tbl thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	.wide_adm_tbl tr { 
            border: 1px solid #fafafa; 
        }
            
	.wide_adm_tbl td { 
		/* Behave  like a "row" */
/*		border: none;
/*		border-bottom: 1px solid #fafafa; */
/*		position: relative;
		padding-left: 1%; 
	}
	
	.wide_adm_tbl td:before { 
		/* Now like a table header */
/*		position: absolute;
		/* Top/left values mimic padding */
/*		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
/*}*/


/************** .result_tbl styles *****************/
.result_tbl  {
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    empty-cells: show;
    table-layout: auto;
    visibility: visible;
    text-align: left;
}
/************** .tbl_picture styles *****************/
.tbl_picture {
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    empty-cells: show;
    table-layout: fixed;
    visibility: visible;
    text-align: left;
    font-size: 10px;
}
/************* #siteInfo styles ***************/

#siteInfo{
    clear: both;
/*	border: 1px solid #cccccc;*/
    font-size: 75%;
    color: #cccccc;
    padding: 0.5% 0.5% 0.5% 5%;
}

#siteInfo img{
    padding: 4px 4px 4px 10px;
    vertical-align: middle;
}


/************* #search styles ***************/

#search{
    sborder: 1px solid #cccccc;
    clear: both;
    font-size: 75%;
    padding: 10px 10px 10px 10px;
    color: #000000;
    width: 20%;
}


/*#SiteSearch{
	float: left;
	width: 29%;
}

/*#VideoSearch{
	float: left;
	width: 29%;
}

/*#WebSearch{
	float: left;
	width: 29%;
}


/*********** #navBar link styles ***********/

#navBar ul a:link, #navBar ul a:visited {display: block;}
#navBar ul {list-style: none; margin: 0; padding: 0;}

/* hack to fix IE/Win's broken rendering of block-level anchors in lists */
#navBar li {border-bottom: 1px solid #EEE;}


/*********** #sectionLinks styles ***********/

#sectionLinks{
    position: relative;
    margin: 0px;
    padding: 0px;
    border-bottom: 1px solid #FFFFFF;
    font-size: 90%;
}

#sectionLinks h3{
    padding: 10px 0px 2px 10px;
}

#sectionLinks a {
    display: block;
    border-top: 1px solid #FFFFFF;
    padding: 2px 0px 2px 10px;
}

#sectionLinks a:hover{
    background-color: #FFFFFF;
}


/*********** .relatedLinks styles ***********/

.relatedLinks{
    position: relative;
    margin: 0px;
    padding: 0px 0px 10px 10px;
    font-size: 90%;
}

.relatedLinks h3{
    padding: 10px 0px 2px 0px;
}

.relatedLinks a:link,
.relatedLinks a:visited {
    display: block; 
}

/************** #advert styles **************/

#advert{
    padding: 30px 0px 10px;
}

#advert img{
    display: block;
}
