@font-face {
	font-family: stateFace;
	src: url("../fonts/stateface.ttf"), url("../fonts/stateface.eot");
}

p.stateFont, span.stateFont {
	font-family: 'stateFace', serif;
}

@media (min-width: 0px) {
	body {
        font-size: 12px;
        padding-top: 60px;
    }
    
     #headerFlex {
       height: 60px;
    }
    
    #Title, #Subtitle {
        width: 45%;
    }
    
    img.mainlogo {
        height: 66px;
        width: auto;
    }
    
    img.menuicon {
        height: 36px;
        width: auto;
        padding: 12px 0 0 12px;
    }
    
    img.vermenuicon {
        height: 36px;
        width: auto;
        padding: 12px 12px 0 12px;
    }
    
    img.stateicon {
        height: 36px;
        width: auto;
        padding: 12px 12px 0 0;
    }
    
    span.stateicon {
        height: 36px;
        width: auto;
        padding: 12px 12px 0 0;
        font-size: 36px;
        
    }
    
    #Title {
        margin-top: 10px;
        font-size: 1.1em;
    }
    
    #Subtitle {
        font-size: 1.0em;
    }
    
    div.stssnIdDiv {
        font-size: 1.0em;
    }

    div.container, div.infoContainer, div.verContainer {
        margin-top: 10px;
    }
    
    div.dragDropArea, div.dragDropHalf, div.dragDropInline {
        width: 85%;
        min-height: 80px;
        margin-left: 5%;
    }
    
    .action, .mainAction, .functionButton, a.linkAsButton {
        min-width: 65px;
        margin-right: 5px;
    }
    
    button.sumcontainerbutton {
        min-width: 60px;
        margin-right: 10px;
    }
    
    span.reviewButton {
        display: block;
        padding-top: 10px;
        width: 50%;
        margin: auto;
    }
    
    div[data-appui='textarea'] {
        width: 98%;
    }
}

@media (min-width: 375px) {
	#Title, #Subtitle, div.stssnIdDiv {
        width: 55%;
    }
}

@media (min-width: 425px) {
	span.reviewButton {
        display: initial;
        padding-top: initial;
        width: inherit;
        margin: initial;
    }
    
    #Title, #Subtitle, div.stssnIdDiv {
        width: 61%;
    }
}

@media (min-width: 524px) {
    #Title, #Subtitle, div.stssnIdDiv {
        width: 66%;
    }
}

@media (min-width: 768px) {
    body {
        font-size: 14px;
    }
    
    img.mainlogo {
        height: 110px;
        width: auto;
    }
    
    img.menuicon {
        height: 60px;
        width: 60px;
        padding: 20px 0 0 20px;
    }
    
    img.vermenuicon {
        display: none;
    }
    
    #headerFlex {
        height: 100px;
        padding-left: 1%;
        padding-right: 1%;
        font-size: 1.1em;
    }
    
    #headerFlex #appTitle {
        width: 65%;
    }
    
    #headerFlex .mega-anchorsTopButton {
        padding-left: 1px;
        padding-right: 1px;
    }
    
    img.stateicon {
        height: 60px;
        width: 60px;
        padding: 20px 20px 0 0;
    }
    
    span.stateicon {
        font-size: 80px;
        height: 80px;
        width: auto;
        padding: 20px 20px 0 0;
    }
    
    #Title {
        margin-top: 20px;
        font-size: 1.5em;
    }
    
    #Subtitle {
        font-size: 1.3em;
    }
    
    div.stssnIdDiv {
        font-size: 1.3em;
    }
    
    div.container, div.infoContainer, div.verContainer {
        margin-top: 15px;
    }
    
    div.containerHeader > p:first-of-type, div.infoContainerHeader > p:first-of-type, div.verContainerHeader > p:first-of-type {
        height: 35px;
    }
    
    div.dragDropHalf {
       width: 37%;
       min-height: 80px;
       margin-left: 5%;
       margin-right: 5%;
       display: inline-block;
    }
    
    div.dragDropHalf ~ div.dragDropHalf {
       margin-left: 0%;
    }
    
    div.dragDropArea {
        width: 50%;
        min-height: 80px;
        margin-left: 25%;
    }
    
    div.dragDropInline {
        width: 43%;
        min-height: 80px;
        margin-left: 1%;
    }
    
    div.dragDropSideCol {
        width: 90%;
        min-height: 80px;
        margin-left: 3%;
    }
    
    .action, .mainAction, .functionButton, a.linkAsButton {
        min-width: 120px;
        margin-right: 10px;
    }
    
    button.sumcontainerbutton {
        min-width: 120px;
        margin-right: 25px;
    }
}

@media (min-width: 1024px) {
	div[data-appui='textarea'] {
        width: 83%;
    }
    
    #headerFlex {
        padding-left: 3%;
        padding-right: 2%;
        font-size: 1.3em;
    }
    
    #headerFlex #appTitle {
        width: 60%;
    }
    
    #headerFlex .mega-anchorsTopButton {
        padding-left: 2px;
        padding-right: 2px;
    }
}

@media (min-width: 1440px) {
    div[data-appui='textarea'] {
        width: 80%;
    }
    
    #headerFlex {
        padding-left: 3%;
        padding-right: 3%;
        font-size: 1.5em;
    }
    
    #headerFlex #appTitle {
        width: 50%;
    }
    
    #headerFlex .mega-anchorsTopButton {
        padding-left: 3px;
        padding-right: 3px;
    }
}

@media screen {
	.notOnScreen {
		display: none;
	}
}

body {
    font-family: Arial;
    background-color: #f5ffff;
}

img {
  border: 0;
}

a{ 
  color: #0055bb;
  text-decoration: none;
}

.hideElement {
    display: none!important;
}

.displayOnHover {
	color: rgba(0, 0, 0, 0);
}

.displayOnHover:hover {
	color: rgba(0, 0, 0, 1);
}

a:hover, a:focus {
  color: #144169;
  text-decoration: none;
}

a:visited {
  color: #990066;
}

.hr {
  background-image:url('../images/hr.png');
  background-repeat:no-repeat;
  height:1px;
  margin:10px 0 10px 0;
  text-align:center;
}

hr {
  color:#0c2e51;
  height:1px;
}

.centered {
  margin: 0 auto;
  padding: 0px;
  margin-left: 8%;
}

#header {
  border-bottom: 1px #051930 solid;
  background-color: #0098d7;
  color: white;
  width:100%;
  position: fixed;
  z-index: 2;
}

div.menuSpacer {
    height: 0;
}

#logo {
  float: left;
  position: relative;
  z-index: 100;
  margin: 0;
  padding: 5px 5px 0 0;
}

.creditsBlock {
    display: inline-block;
    padding-right: 5px;
}

.creditsLogo {
  display: inline-block;
  z-index: 100;
  margin: 0;
  padding: 0 5px 0 0;
}

.creditsAddress {
  display: inline-block;
  vertical-align: top;
  font-weight: normal;
}

.creditsSimple {
	  font-weight: normal;
}

#Title, #Subtitle, div.stssnIdDiv {
  text-align: left;
  float: left;
}

div.stssnIdDiv {
	padding-top: 6px;
}

#Title {
    font-weight: bold;
}
    
#Subtitle {
    font-weight: bold;
    font-style: italic;
}

div.stsssnIdDiv {
	color: red;
}

span.stssIdHdr {
	font-weight: normal;
}

span.stssnIdText {
    font-weight: bold;
}

#eyebrow {
  position: fixed;
  right: 12.5%;
  top: 5px;
  border-radius: 5px;
  /*padding: 0 5px 4px 5px;
  background-color: #034694; */
  background-color: #296a08;
  min-height: 40px;
  max-width: 40%;
  z-index: 5000;
  display: flex;
  flex: 0 0 40px;
  flex-wrap: wrap;
}

div.eyebrow-flex-item {
	/*
  margin:5px 0px 5px 2px;
  padding:2px 2px 4px 2px;
  */
  margin: 5px 0px 5px 0px;
  padding: 2px;
  height: 20px;
  text-align: center;
  vertical-align: middle;
}

div.eyebrow-flex-item-first {
	align-self: stretch;
}

div.eyebrow-flex-item-last {
	align-self: stretch;
}

/* original eyebrow except min-width should be commented out */
/*
#eyebrow {
  float: right;
  padding: 0 5px 4px 5px;
  background-color: #034694;
  height: 35px;
  min-width: 370px;
}
*/
.eyebrowImageButton {
    background: none;
    border: none;
}

.eyebrowImageButton:hover {
    cursor: pointer;
}

.eyebrowReportCount {
    padding: 4px 6px;
    border-radius: 3px;
    font: 14px Verdana;
    color: white;
    font-weight: bold;
}

#menu {
  background-color:#e0c8a6;
  min-height:80px;
  max-height:80px;
  padding-top:5px;
  border-bottom:1px #fffbf8 solid;
  margin-bottom:0px;
}

img.menuicon, img.vermenuicon {
	float: left;
	cursor: pointer;
}

img.stateicon {
	float: right;
	cursor: pointer;
}

span.stateicon {
    float: right;
    cursor: pointer;
    font-family: 'stateFace';
}

#no-wrap {
  white-space:nowrap;
  overflow:hidden;
}

#pageBody-top {

  background-repeat:repeat-x;
  float:left;
  width:100%;
}
.shadow {
  width:960px;
  margin:-25px auto 0 auto;
  padding:10px;
  background-image:url('../images/shadow.png');
  background-repeat:no-repeat;
}

#FeaturedTop {
  background-color:#f3eedc;
  padding:15px;
  position:relative;
  z-index:300;
}
#FeaturedTop-Inner {
  background-image:url('../images/Featured-Top-Inner-Background.png');
  background-repeat:no-repeat;
  padding:0px;
  width:930px;
  height:300px;
}

#mission {
  background-image:url('../images/mission-background.png');
  background-repeat:no-repeat;
  min-height:84px;
  font-size:15px;
  font-style:italic;
  padding-top:20px;
  text-align:center;
  margin-bottom:0px;
  vertical-align:middle;
}
#mission .right {
  float:left;
  width:250px;
  height:64px;
  text-align:left;
  display:block;
  vertical-align:middle;
}

/*
#mission .left {
  float:left;
  width:250px;
  height:64px;
  text-align:right;
  display: block;
  vertical-align: middle;
}

#mission .center {
  width:360px;
  display:block;
  text-align:center;
  border:0px;
padding:0px;
margin:0px auto;
}
*/

#pageBody-bottom {

  background-repeat:repeat-x;
  background-position:bottom left;
  float:left;
  width:100%;
  z-index:1;
}
#pageBody-ask{
 text-align:center;
  background-color:#eee9dd;
}
#pageBody-bottom .right {
  float:left;
  width:28%;
  display:block;
  border-left:1px #0c2e51 solid;
  border-right:1px #0c2e51 solid;
  margin:5px;
  padding:15px;
}

#pageBody-bottom .left {
  float:left;
  width:28%;
  display:block;
  border-left:1px #0c2e51 solid;
  border-right:1px #0c2e51 solid;
  margin:5px;
  padding:15px;
}
#pageBody-bottom .center {
  width:28%;
  display:block;
  float:left;
  margin:5px;
  padding:15px;
}

.More {
  background-image:url('../images/more-background.png');
  background-repeat:no-repeat;
  min-height:121px;
  width:100%;
  margin-top:-121px;
  z-index:-1;
  position:relative;
}

#video {
position:relative;
display:block;
}
.video{
position: relative;
top:110px;

} 
#HomeFeaturesDiv {
  width: 610px;
  height: 273px;
  margin-top: -16px;
  color: #fff;
  display: inline;
}

#HomeFeaturesDiv div {

  color: #fff;
  padding: 0px;
}

#HomeFeaturesDiv h3 {
  color:#fff;
  font-family:Verdana;
  font-size:15px;
  margin:8px 0 0 0;
  padding:0;
}
#HomeFeaturesDiv h4 {
  color:#000;
  font-family:Verdana;
  font-size:15px;
  margin:8px 0 0 0;
  padding:0;
}
#HomeFeaturesDiv h1 {
  color:#fff;
  font-family:Verdana;
  font-size:22px;
  margin:8px 0 0 0;
  padding:0;
  text-align:center;
}
.homeFeatureImage {
  position:absolute;
  left:0;
  top:0;
  z-index:-1;
}
#Ask {
  font-size:14px;
  font-weight:bold;
  font-family:Verdana;
  padding:10px 30px;
  background-image:url('../images/border-bottom.png');
  background-repeat:no-repeat;
  background-position:bottom;
  color:#144169;
}

.tidbit {
  color: #144169;
  text-align:center;
}

#simpleFooter {
    border-top: 1px dashed gray;
    min-height:30px;
    width: 100%;
    color: #333333;
    font-size: 9pt;
    font-weight: bold;
    font-family: Arial;
    margin:0 auto;
    padding-left:20px;
}

#simpleFooter a {
  color:#333333;
  text-decoration:none;
}
#simpleFooter a:hover {
  color:#0066ff;
}

#footer {
    border-top: 1px dashed gray;
    min-height:30px;
    width: 100%;
    color: #333333;
    font-size: 9pt;
    font-weight: bold;
    font-family: Arial;
    margin:0 auto;
    padding-left:20px;
}

#footer a {
  color:#333333;
  text-decoration:none;
}
#footer a:hover {
  color:#0066ff;
}

#footer .right {
  float:right;
  width:285px;
  display:block;
  margin:0px;
  padding:15px;
border:0px;
}

#footer .left {
  float:left;
  width:290px;
  display:block;
  padding:15px;
  padding-left:5px;
  border:0px;
}
#footer .center {
  float:left;
  border-left:1px #9e9585 solid;
  border-right:1px #9e9585 solid;
  width:270px;
  display:block;
  margin:5px 0px 5px -1px;
  padding:15px;
}

.Social {
  color:#6d655d;
  font-size:12px;
  font-family:Verdana;
  text-align:center;
  padding:0px;
  margin:0px;
}

.date {
  color:#999;
  padding:5px 0 0 5px;
  margin:0px;
  font-size:12px;
  text-align:left;
}
.text-small {
  margin:0px;
  font-size:12px;
  text-align:left;
}

.text {
  color:#000;
  padding:5px;
  margin:0px;
  font-size:14px;
  text-align:left;
}
p {
  padding:5px;
  margin:0px;
}
.title {
  color:#404040;


  font-size:16px;
  text-align:left;
}

h2 {
  font-size:20px;
  text-align:center;
  color:#2c3e50;
  font-weight:bold;
}
.text-center {
  color:#000;
  padding:5px 0 0 5px;
  margin:0px;
  font-size:14px;
  text-align:center;
}
.more-link{
  text-align:center;
  position:relative;
  z-index:500;
}
.more-link a{
  color:#144169;
  font-size:12px;
  font-weight:bold;
}

.search {
  background-color:#0c273f;
  color:#fff;
  padding:5px;
  border:0;
  height:40px;
  width:40px;
  text-align:center;
  margin:0px 20px 0 -2px;
}

ul {
  margin:2px 15px;
  padding:10px;
  list-style-type:square;
}
ul li ul {
  margin:2px 15px;
  padding:0px 10px;
  list-style-type:square;
}

div.textAreaCharCount {
	margin-left: 2px;
	margin-top: 3px;
	padding-top: 2px;
	padding-bottom: 2px;
	min-width: 57.1%;
	height: 18px;
	text-align: center;
	border: 1px solid #b5d5ef;
	display: inline-block;
}


/*google news feed*/

    #feedControl { 
      margin-top : 20px;
      margin-left: auto;
      margin-right: auto;
      width : 275px;
      font-size: 14px;
    }
    .gfg-root {
  width : 100%;
  height : auto;
  position : relative;
  overflow : hidden;
  text-align : center;
  font-family: "Verdana", sans-serif;
  font-size: 12px;
}

.gfg-title {
  font-size: 16px;
  color : #404040;
  line-height : 0px;
  overflow : hidden;
  white-space : nowrap;
  display:none;
  
}

.gfg-title a {
  color : #404040;
}

.gfg-subtitle {
  font-size: 16px;
  color : #404040;
  margin-bottom : 5px;
}

.gfg-subtitle a {
  color : #404040;
}

.gfg-entry {
  width : 100%;
  height : 12em;
  position : relative;
  overflow : hidden;
  text-align : left;
  margin-top : 3px;
}

/* To allow correct behavior for overlay */
.gfg-root .gfg-entry .gf-result {
  position : relative;
  width : auto;
  height : 100%;
  padding-left : 20px;
  padding-right : 5px;
}

.gfg-list {
  position : relative;
  overflow : hidden;
  text-align : left;
  margin-bottom : 5px;
}

.gfg-listentry {
  line-height : 1.5em;
  overflow : hidden;
  white-space : nowrap;
  text-overflow : ellipsis;
  -o-text-overflow : ellipsis;
  padding-left : 15px;
  padding-right : 5px;
  margin-left : 5px;
  margin-right : 5px;
}
.gfg-listentry-highlight { 
  background-image : url('../images/button-not-active.png');
  background-repeat: no-repeat;
  background-position : bottom left;
}

/*
 * FeedControl customizations.
 */

.gfg-root .gfg-entry .gf-result .gf-title {
  font-size: 14px;
  text-overflow : ellipsis;
  -o-text-overflow : ellipsis;
  margin-bottom : 2px;
}

.gfg-root .gfg-entry .gf-result .gf-snippet {
  height : 3.8em;
  color: #000000;
  margin-top : 3px;
}


.gfg-branding {
  white-space : nowrap;
  overflow : hidden;
  text-align : left;
  position : absolute;
  right : 0px;
  top : 0px;
  width : 80px;
}

.gfg-collapse-closed {
  background-repeat : no-repeat;
  background-position : center;
  cursor : pointer;
  float : right;
  width : 17px;
  height : 20px;
}


.gfg-collapse-open {
  background-repeat : no-repeat;
  background-position : center;
  cursor : pointer;
  float : right;
  width : 17px;
  height : 20px;
}


.gfg-collapse-href {
  float : left;
}

.clearFloat {
  clear : both;
  height:1px;
}
 

/* mega menu */
.megamenu{
position:absolute;
display: none;
left: 0;
top: 0;
background:#fff;
border: 2px solid #0c2e51;
padding: 0px;
z-index: 100;
margin:0px;
color:#0c2e51;
font-size: 12px;

}

.megamenu .column{
float: left;
width: 163px; /*width of each menu column*/
margin: 0px 5px 0px -2px;
border-left:1px #0c2e51 solid;
padding:10px;
}

.megamenu .column ul{
margin: 0;
padding:0px 0px 0px 5px;
list-style-type: none;
font-family:Verdana;
}

.megamenu .column ul li{
padding-bottom: 0px;
}

.megamenu .column h3{
font: bold 13px Verdana;
margin: 0 0 2px 0;
}

.megamenu .column a{
text-decoration: none;
display:block;
padding:2px 3px;
color:#0c2e51;
}

.megamenu .column a:hover{
  background-image:url('../images/eyebrow.png');
  background-position:center top;
  background-repeat:repeat-x;
  color:#fff;
}

.megamenu .column ul li ul{
margin: 0px 0px 0px 5px;
padding:0px 0px 0px 2px;
list-style-type: none;
font-size:10px;
}


.mega-anchors {
  margin:0px;
  padding:5px;
  padding-bottom:20px;
  float:left;
  min-width:95px;
  max-width:100px;
  height:40px;
  text-align:center;
  font-weight:bold;
white-space: normal; 
  position:relative;

 }
.mega-anchors:hover {
  background-image:url('../images/menu-rollover.png');
  background-position:center bottom;
  background-repeat:repeat-x;
  color:#fff;
}
.mega-anchors a {
  color:#0c2e51; /*navy Blue */
  font-size:14px;
  font-family:Verdana;
  text-decoration:none;
  display:block;
  padding:5px 8px 10px 8px;
  position:absolute;
  bottom:10px;
}
.mega-anchors a:hover {
  color:#fff;
}

.mega-anchorsTop {
  margin:5px 0px 5px 2px;
  padding:5px;
  float:left;
  height:20px;
  text-align:center;
  vertical-align:middle;
}

.mega-anchorsTopText {
  margin:6px 0px 4px 2px;
  padding:5px;
  float:left;
  height:20px;
  text-align:center;
  vertical-align:middle;
}

.mega-anchorsTopButton {
  margin:5px 0px 5px 2px;
  padding:2px 2px 4px 2px;
  float:left;
  height:20px;
  text-align:center;
  vertical-align:middle;
}

.mega-anchorsTop a {
  color:#fff; 
  font-size:12px;
  font-family:Verdana;
  text-decoration:none;
  display:block;
}



/* featured content */


/* The containing box for the gallery. */
#container {
  position: relative;
  width: 680px;
  height: 273px;
  margin: 0px auto 0 auto;
  background: url('/media/3217222/fyccnbannerfishing.png') no-repeat 80px 10px;
  padding:5px;
  z-index:700;
  float:left;
  overflow:hidden;

}
#container img {
padding:0px;
margin:0px;
}

/* Removing the list bullets and indentation */
/* set the size of the unordered list to neatly house the thumbnails */
#container ul {
  padding: 0;
  list-style-type: none;
  width: 80px;
  height: 275px;
  margin: 5px 0px 0 0;
  float: left;
}
#container li {
  float: left;
  padding:0px;
  margin:0px;
}

/* Remove the images and text from sight */
/*#container a.gallery span {
  position: absolute;
  width: 1px;
  height: 1px;
  top: 5px;
  left: 5px;
  overflow: hidden;
  z-index:-1;
}*/

/* jQuery will now handle removing the text and images from site */
#container a.gallery span {
    height: 274px;
    left: 80px;
    overflow: hidden;
    position: absolute;
    top: 10px;
    width: 610px;
    z-index: -1;
}

/* Adding the thumbnail images */
#container a.gallery:visited {
  text-decoration: none;
  text-align: center;
  color:#414042;
  font-size:12px;
  display:block;
  min-width:80px;
  min-height:55px;
}
#container a.gallery {
  text-decoration: none;
  text-align: center;
  color:#414042;
  font-size:12px;
  display:block;
  min-width:80px;
  min-height:55px;
}
/* change the thumbnail hover state */
#container a.gallery:hover {
  position:inherit;
  z-index:1000;
}
/* styling the :hover span */
#container a.gallery:hover span {
  position: absolute;
  width: 610px;
  height: 274px;
  top: 10px;
  left: 80px;
}
#container a.gallery:hover span img {
  float: right;
  margin-right: 0px;
  border:0px;
}


#Featured-Buttons {
  font-size:19px;
  text-align:right;
  width:360px;
  float:right;
  margin:-279px 5px 0 0px;

}
#Featured-Buttons a{
  padding:5px;
  display: block;
  text-decoration: none;
  color:#414042;
  min-height:48px;
  position:relative;
  z-index:0;
  background:url('../images/button-not-active.png') transparent no-repeat right;
}
/* change the thumbnail hover state */
#Featured-Buttons a:hover {
  background-image:url('../images/button-highlight.png');
  background-repeat:no-repeat;
  background-position:right;
  color:#fff;
}

/*Fix display issue in IE7*/
div.commission h4
{
  clear:both;
}


#tilted-text {

margin:-80px 0px 0px 0px;
  padding:0px;
  font-weight:bold;
  white-space:nowrap;
  overflow:visible;
  min-width:200%;
  line-height: normal;

  transform: rotate(-5deg);
  -webkit-transform: rotate(-5deg);
  -moz-transform: rotate(-5deg);
  filter:  progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand',
   M11=0.9986295347545738, M12=0.1, M21=-0.1, M22=0.9986295347545738); 
   /* IE6,IE7 */
   -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(SizingMethod='auto expand',M11=0.9986295347545738, M12=0.1, M21=-0.1, M22=0.9986295347545738)"; 
   /* IE8 */
   zoom: 1; 

 }
#tilted-text p {
  margin:65px 0px 10px 5px;
  padding:0px;
  white-space:nowrap; 
  overflow:visible;
    min-width:200%;
  line-height: normal;

}

#outlined-text p{
  margin:5px 0 0 0;
  padding:0;
   -webkit-text-stroke: 1px #968c7f;
   color: #df9b55;
   text-shadow:
       1px 1px 0 #000,
     -1px -1px 0 #000,
      1px -1px 0 #000,
      -1px 1px 0 #000,
       1px 1px 0 #000;

filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=1, OffY=1, Color='black', Positive='true');
}

/* contour matrix question */
table.matrix_control
{
  width: 100%;
  padding: 0px;
  margin: 5px 0px 20px 0px;
  float: left;
}

table.matrix_control thead tr td h3
{
  font-size: 12px;
  width: 100%;
  min-width: 40px;
  text-align: center;
  margin-top: 0px !important;
}

table.matrix_control tbody tr td input
{
  text-align: center;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: 2px;
}
table.matrix_control tbody tr td span
{
  display: block;
  width: 100%;
}
.gsc-search-button {
  display:none;
 
}
.gsc-input {
  width:175px;
  padding: 0,0,0,0;
  margin-right: auto;
  margin-left: auto;
}
 .gsc-clear-button {
  visibility:hidden;


}


/*Table Styles */
#greentable {
    background-color: #fff;
    border-collapse: collapse;
    width: 100%;
}

#greentable td, #greentable th {
    border: 1px solid #ddd;
    padding: 8px;
}

#greentable tr:nth-child(even){background-color: #ebf7de;}

#greentable tr:hover {background-color: #ddd;}

#greentable th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #4CAF50;
    color: white;
}

#purpletable {
    background-color: #fff;
    border-collapse: collapse;
    width: 100%;
}

#purpletable td, #purpletable th {
    border: 1px solid #ddd;
    padding: 8px;
}

#purpletable tr:nth-child(even){background-color: #e4d2fa;}

#purpletable tr:hover {background-color: #ddd;}

#purpletable th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #333866;
    color: white;
}

.StandardAlternatingRows tr:nth-child(even) {
    background-color: #CFCBC2;
}

img.randomPic {
    width: 80%;
    margin-right: 10px;
    border-radius: 4px;
    border: 1px solid #0e8541;
    box-shadow: 6px 6px 6px -2px rgba(214,211,214,1);
}

.dataTable-button {
	margin-left: 4px;
	border: none!important;
	height: 27px;
}

.dataTable-button:hover > span {
    background-color: inherit!important;
}

/* Redball and Yellowball Styles */
#redballsummary {
    font-size: 14px;
}

div > p > span.redball {
    padding-left: 10px;
    font-weight: bold;
}

div > span > p > span.redball {
    padding-left: 10px;
    font-weight: bold;
}

td > p > span.redball {
    padding-left: 4px;
    font-weight: bold;
    font-size: 12px;
}

.redballImage {
	height: 18px;
	padding-right: 6px;
}

.yellowballImage {
	height: 18px;
	padding-right: 6px;
}

.infoballImage {
    height: 18px;
    padding-right: 6px;
    vertical-align: bottom;
}

.inputWrapper.inputError {
    padding-top: 2px;
}

.inputError {
    border: 2px solid red;
}

input[type=text].inputError, input[type=email].inputError {
    border-bottom: 2px solid red;
    background-color: #f5acb9;
}

.inputWrapper.inputWarning {
    padding-top: 2px;
}

.inputWarning {
    border: 2px solid #ffff00;
}

input[type=text].inputWarning, input[type=email].inputWarning, input[type=number].inputWarning {
    border-bottom: 2px solid #ffff00;
    background-color: #ffff80;
}

textArea.inputWarning {
    background-color: #ffff80;
}

.inputWarning.inputError {
    border: 2px solid #ffff00;
}

input[type=text].inputError.inputWarning, input[type=email].inputError.inputWarning, input[type=number].inputError.inputWarning {
    border-bottom: 2px solid #ffff00;
    background: linear-gradient(to right, #f5acb9, #ffff80);
}

textArea.inputError.inputWarning {
    background: linear-gradient(to right, #f5acb9, #ffff80);
}

#warninglistheader {
    padding-left:8px;
    font-size: 16px;
    font-weight: bold;
}

img.yellowballHeaderImage {
    padding-right: 8px;
    height: 18px;
}

span.warninglistheadertext {
    vertical-align: middle;
}

#yellowballsummary {
    font-size: 14px;
}

div > p > span.yellowball {
    padding-left: 10px;
    font-weight: bold;
}

div > span > p > span.yellowball {
    padding-left: 10px;
    font-weight: bold;
}

td > p > span.yellowball {
    padding-left: 4px;
    font-weight: bold;
    font-size: 12px;
}

div > p > span.yellowball > img.yellowballImage {
    padding-right: 6px;
    height: 18px;
}

div > span > p > span.yellowball > img.yellowballImage {
    padding-right: 6px;
    height: 18px;
}

td > p > span.yellowball > img.yellowballImage {
    padding-right: 4px;
    height: 18px;
}

.inputWarning {
    border: 2px solid yellow;
}

.inputWrapper.inputWarning {
    padding-top: 6px;
}

.inputWrapper {
    display: inline;
}

div.dataMap {
	border: 1px double #0e8541;
	height: 80vh;
	width: 73vw;
	margin-left: 12px;
}

div.speciesCounts {
	background: white;
	margin-left:12px;
    margin-bottom: 4px;
    padding-left: 6px;
    padding-right: 6px;
    border: 1px solid transparent;
    border-radius: 2px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    outline: none;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}

div.speciesCounts-wide {
	min-width: 70%;
}

p.speciesCountBlock {
	padding-right: 0;
}

p.speciesCountLabel {
	font-size: 14px;
	font-weight: 800;
	padding-right: 0;
}

span.speciesCountLabel {
	font-size: 14px;
	font-weight: 800;
}

ul.speciesCounts {
	padding: 2px;
}

div.hideCountsToggle {
	cursor: pointer;
	font-size: 14px;
	text-decoration: underline;
}

span.speciesLabel {
	font-size: 12px;
	display: inline-block;
	width: 120px;
}

span.speciesCount {
	font-size: 12px;
	font-weight: 800;
}

div.googleMapsButtonBase {
	direction: ltr; 
    overflow: hidden; 
    text-align: center; 
    position: relative; 
    color: rgb(0, 0, 0);
    font-family: Roboto, Arial, sans-serif;
    user-select: none;
    font-size: 11px!important;
    background-color: rgb(255, 255, 255); 
    padding: 8px;
    background-clip: padding-box; 
    box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; 
    min-width: 40px;
}

div.googleMapsButtonSingle {
	border-radius: 2px;
}

div.googleMapsButtonLeft {
    border-bottom-left-radius: 2px;
    border-top-left-radius: 2px;     
}

div.googleMapsButtonRight {
    border-bottom-right-radius: 2px; 
    border-top-right-radius: 2px; 
    border-left: 0px;
}

div.googleMapsButtonOn {
	font-weight: 500!important;
}

div.googleMapsButtonOff {
	color: rgb(86, 86, 86)!important;
}

div.googleMapsButtonBase:hover {
	background-color: #e8e8e8;
	color: rgb(0, 0, 0)!important;
}

.ui-autocomplete {
	position: absolute; 
	cursor: default;
	z-index: 2000 !important;}  


/* datatable style enhancements */
.dataTables_paginate .previous {
    border: 1px solid #dee2e6;
}

.fg-button.previous {
	border-top-left-radius: .25rem!important;
    border-bottom-left-radius: .25rem!important;
}

.fg-button {
	margin-left: 0!important;
	margin-right: 0!important;
}

.ui-widget-header {
	background: inherit!important;
	border: none!important;
}

span > a.fg-button.ui-button.ui-state-disabled {
	color: #fff!important;
    background-color: #007bff!important;
    border-color: #007bff!important;
}

span > .fg-button {
	border-radius: 0!important;
}
    
 .ui-state-disabled {
    opacity: 1!important;
 }

.fg-button.next {
    border-top-right-radius: .25rem!important;;
    border-bottom-right-radius: .25rem!important;
}

.fg-button.ui-state-default:not(.ui-state-disabled) {
    color: #007bff!important;
    background-color: #fff!important;
    border-color: #dee2e6!important;
}

.fg-button.ui-state-disabled.previous {
	color: #6c757d!important;
	background-color: #fff!important;
    border-color: #dee2e6!important;
}

.fg-button.ui-state-disabled.next {
    color: #6c757d!important;
    background-color: #fff!important;
    border-color: #dee2e6!important;
}

.alertBall {
	padding-right: 6px;
	vertical-align: middle;
}
.importIcon {
	padding-left: 5px;
	padding-right: 6px;
}

div.dragDropArea, div.dragDropHalf, div.dragDropInline, div.dragDropSideCol {
    border: #4c5fc5 dashed 1px;
    border-radius: 12px;
    margin-top: 8px;
    padding-left: 10px;
    background-color: #f5f2ec;
}

div.containerRow > div.dragDropRow {
    padding-left: 0;
    text-align: center;
    
}

div.dragDropArea.dragOn, div.dragDropHalf.dragOn, div.dragDropInline.dragOn, div.dragDropSideCol.dragOn {   
    background-color: #98bad4;
}

div.dragDropArea.uploaded, div.dragDropHalf.uploaded, div.dragDropInline.uploaded {   
    background-color: #bae4ba;
}

p.dragDropText {
    text-align: center;
    font-size: 14px;
}

p.uploadDone {
	text-align: center;
    font-size: 14px;
}

div.compoundInput {

}

div.compoundInputInline {
    display: inline-block;
}

div.mainLabel {
	display: inline-block;
	font-family: Verdana;
    font-size: 14px;
    vertical-align: top;
    margin-top: 8px;
    
}

div.subInput {
	display: inline-block;
	padding: 4px 0 0 2px;
}

div.subInput:not(:last-of-type) {
	margin-right: 4px;
}

label.subLabel {
	font-style: italic;
}

input::placeholder {
	opacity: .6;
}

input[type=file].dragDropFile {
	display: none;
}

label.dragDropFileLabel {
	cursor : pointer;
}

div.quarterFull {
	
}

@media not print {
	.printOnly {
	   display: none;
	}
}

div.userInput {
	padding: 5px 5px 5px 0;
	margin: 0;
}

div.valErrors {
	padding-left: 10px;
}

ul.valErrors {
	list-style-image: url('../images/redball_18px.svg');
	list-style-type: circle;
	padding-top: 0;
	padding-bottom: 0;
}

ul.valErrors li {
	font-weight: bold;
	padding-left: 2px;
	
}

div.valWarnings {
    padding-left: 10px;
}

ul.valWarnings {
    list-style-image: url('../images/yellowball_18px.svg');
    list-style-type: circle;
    padding-top: 0;
    padding-bottom: 0;
}

ul.valWarnings li {
    font-weight: bold;
    padding-left: 2px;
    
}

.straightUnitsLabel {
	font-weight: 600;
}

.curvedUnitsLabel {
    font-weight: 600;
}

div.container {
    background-color: #fcffff;
}

div.containerHeader {
	padding-top: 5px;
    padding-bottom: 5px;
    color: white;
    font-weight: bold;
    font-size: 1.2em;
}

div.verContainerHeader {
    padding-top: 5px;
    padding-bottom: 5px;
    color: white;
    font-weight: bold;
    font-size: 1.2em;
    border-top: 1px solid #0e8541;
    border-left: 1px solid #0e8541;
    border-right: 1px solid #0e8541;
    border-bottom: 1px dashed black;
}

div.verContainerHeader.headerIncomplete {
    background: #c37676; 
}

div.verContainerHeader.headerUnverified {
    background: #abab20; 
}

div.verContainerHeader.headerVerified {
    background: green; 
}

div.verContainerHeader.headerLocked {
    background: black; 
}

div.verContainerHeader.headerUnlocked {
    background: #c0c0c0; 
}

div.headerLocked > p > img.statusIcon, div.headerUnlocked > p > img.statusIcon {
	padding-right: 4px;
	padding-left: 12px;
}

.containerHeaderInfo {
    font-size: .8em;
    font-weight: normal;
    padding-top: 0;
}


div.containerRow {
    padding-top: 8px;
    padding-bottom: 8px;
}

/*
div.containerRow:last-child {
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}
*/

div.containerRow:nth-child(n+3) {
    border-top: 1px dashed rgb(137, 140, 144);
}

div.containerBottom {
    height: 2px;
}

div.infoContainer {
    background-color: #fcffff;
}

div.infoContainerHeader {
	padding-top: 8px;
    padding-bottom: 8px;
    color: white;
    font-weight: bold;
    font-size: 1.2em;
	border-top: 1px solid #1f3ee4;
    border-left: 1px solid #1f3ee4;
    border-right: 1px solid #1f3ee4;
    border-bottom: 1px dashed black;   
    background-color: #4141e0;
}



div.infoContainerHeader > p {
    padding-left: 10px;
}

div.infoContainerHeader img.icon {
	padding-right: 8px;
}

div.infoContainerRow {
    background-color: #fcffff;
    border-left: 1px solid #1f3ee4;
    border-right: 1px solid #1f3ee4;
    padding-top: 8px;
    padding-bottom: 8px;
}

div.infoContainerRow > p {
    padding-left: 10px;
}

div.infoContainerBottom {
	border-left: 1px solid #1f3ee4;
    border-right: 1px solid #1f3ee4;
    border-bottom: 1px solid #1f3ee4;
    height: 9px;
}


/* Input Styling */
input[type=submit], button {
	-webkit-appearance: none;
	-webkit-border-radius: 0;
	border-radius: 0;
}

input[type=text], input[type=date], input[type=number], input[type=password], input[type=email], input[type=tel], input[type=search] {
    font-size: .8em;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
    border: none;
    border-bottom: 2px solid gray;
    transition-property: border-bottom;
    transition-duration: 2s;
}

input[type=text]:hover, input[type=date]:hover, input[type=number]:hover, input[type=password]:hover, input[type=email]:hover, input[type=tel]:hover, input[type=search]:hover {
    border-bottom: 2px solid darkblue;
    transition-property: border-bottom;
    transition-duration: 0.5s;
}

input[type=text]:focus, input[type=date]:focus, input[type=number]:focus, input[type=password]:focus, input[type=email]:focus, input[type=tel]:focus, input[type=search]:focus {
	outline: none;	
	border-bottom: 2px solid red;
}

.action, .mainAction, .functionButton {
	height: 40px;
	border: 1px solid black;
	font-size: 1.2em;
	color: white;
	transition-property: background;
    transition-duration: 0.5s;
}

.mainAction {
    font-weight: bold;
    background: #0e8541;
}

.mainAction:hover {
    background: #50a235;
}

.action, .functionButton {
	background: #1818e8;
}
.action:hover, .functionButton:hover {
    background: #5353ff;
}

button[type=submit].action  {
    float: right;
    margin-right: 0;
    margin-left: 8px;
}

button.action:disabled {
	background: #bfbaba;
	border: gray;
}

.action:last-child, .mainAction:last-child, .functionButton:last-child {
	margin-right: 0;
}


button.linkButtonBase {
    background: none;
    border: none;
    display: inline;
    font: inherit;
    margin: 0;
    padding: 0;
    outline: none;
    outline-offset: 0;
    /* Additional styles to look like a link */
    text-align: left;
}

button.linkButtonBase:hover {
    background: none;
}

button.linkButtonBaseDetails {
	cursor: zoom-in;
}

button.linkButtonBaseCell {
    cursor: cell;
}

button.linkButtonBaseLink {
    cursor: pointer;
}

span.linkButtonBaseLink {
    cursor: pointer;
}

button.linkButton {
    background: none;
    border: none;
    display: inline;
    font: inherit;
    margin: 0;
    padding: 0;
    outline: none;
    outline-offset: 0;
    /* Additional styles to look like a link */
    cursor: pointer;
    text-align: left;
}

button.linkButton:hover {
    background: none;
}

button.linkButtonUnvisited {
    color: blue;
}

button.linkButtonVisited {
    color: #990066;
}

button.utilities, button.sumcontainerbutton {
    height: 35px;
    font-size: 14px;
    font-weight: 600;
    padding-right: 15px;
    padding-left: 15px;
    border: 1px solid black;
    background-color: #e6e6e6; 
    cursor: pointer;
}

button.sumcontainerbutton {
	float: right;
}

a.linkAsButton {
    font-size: 1.2em;
    color: white;
    background-color: #1818e8;
    height: 22px;
    border: 1px solid black;
    padding: 8px 12px 8px 12px;
    margin-bottom: 8px;
    margin-right: 12px;
    float: right;
    transition-property: background;
    transition-duration: 0.5s;
}

a.linkAsButton:hover {
    background: #5353ff;
    transition-property: background;
    transition-duration: 0.5s;
}

.statusIcon {
    height: 24px;
    padding-right: 2px;
    padding-left: 6px;
    vertical-align: text-bottom;
}

/* Photo Carousel Styles */
div.photoCarousel {
    height: 75vh;
    overflow-y: auto;
}

div.photoCarousel > figure.photoContainer {
    display: inline-block;
    width: 22vw;
    padding-bottom: 15px;
    transition-duration: 1s;
    transition-delay: 1.5s;
}

div.photoCarousel > figure.photoContainer:hover {
    width: 44vw;
    transition-duration: 1s;
    transition-delay: 1s;
}

div.photoCarousel > figure.photoContainer.hidden {
    display: none;
    width: 22vw;
    padding-bottom: 15px;
}

img.photoCarouselImage {
    width: 90%; 
    /* border-radius: 3px; */
    border: 1px solid #330d8e;
    /* box-shadow: 6px 6px 6px -2px rgba(214,211,214,1); */
    margin-bottom: 4px;
}

/* State Info Menu Styles */

div.stateInfo, div.versmallmenu {
	height: 100%;
	background-color: black;
	position: fixed;
	z-index: 101;
	color: white;
	transition-timing-function: ease-in-out;
	transition: left 1s;
}

div.stateInfo a, div.versmallmenu a {
	font-size: 1.2em;
	color: white;
}

div.verMenuReports {
	color: red;
	font-weight: bold;
	font-size: 2em;
	padding: 0 0 10px 10px;
}

.menuReportCount {
    padding: 2px 6px;
    border-radius: 3px;
    font-size: .9em;
    color: white;
    font-weight: bold;
}

.reportCount-tot {
	background-color: red;
}
.reportCount-non {
	background-color: #05b055;
}

.reportCount-leg {
	background-color: #c45a20;
}

div.verMenuEntry {
	padding: 8px 0 8px 5px;
	border-bottom: 1px solid gray;
}

div.verMenuEntry.firstEntry {
    border-top: 1px solid gray;
}

div.verMenuEntry.logOut {
    margin-top: 40px;
    border-bottom: none;
}

div.verMenuEntryIcon {
	width: 40px;
	display: inline-block;
}

button.verMenuEntryButton {
	width: 100%;
	background: none;
    border: none;
    text-align: left;
}

span.verMenuEntryLabel {
	color: white;
	vertical-align: super;
	font-size: 1.5em;
}

span.verMenuAnchorEntryIcon {
	width: 40px;
	height: 28px;
	display: inline-block;
	padding-left: 6px;
}

div.stateInfo a:visited, div.versmallmenu a:visited {
    font-size: 1.2em;
    color: #0e8541;
}

div.stateInfoOpen, div.versmallmenuOpen {
    left: 0;
}

div.closemenuheader {
	width: 100%;
	height: 1.8em;
	padding: 10px 0 5px 0;
}

div.menuContents, div.verMenuContents {
	padding: 0 15px;
}

span.closemenuicon {
	font-size: 1.8em;
	cursor: pointer;
	margin-right: 10px;
	float: right;
}

@media (min-width: 0px) {
	div.stateInfoClosed, div.versmallmenuClosed {
	   left: -100%;
    }
    
	div.stateInfo, div.versmallmenu {
       width: 100%;         
	}
}

@media (min-width: 401px) {
    div.stateInfoClosed {
       left: -75%;
    }
    
    div.stateInfo {
       width: 75%;         
    }
    
    div.versmallmenuClosed {
       left: -100%;
    }
    
     div.versmallmenu {
       width: 100%;         
    }
}

@media (min-width: 640px) {
	div.stateInfoClosed, div.versmallmenuClosed {
       left: -50%;
    }
    
    div.stateInfo, div.versmallmenu {
       width: 50%;         
    }
}

@media (min-width: 768px) {
	div.stateInfoClosed {
       left: -35%;
    }
    
    div.stateInfo {
       width: 35%;
    }
}

td.centerCell, th.centerCell {
	text-align: center!important;
}

figcaption.photoContainer:hover {
	
}

img.downloadOrigForm, img.downloadMisc, img.downloadTake, img.downloadLegacy, img.downloadFibro, img.downloadNecro, img.downloadRelease, img.downloadCurForm, img.downloadFullRes, img.thumbDl {
	cursor: pointer;
}

span.origName {
	font-weight: 400;
}

div.photoCapText {
	width: 70%;
	padding-top: 3px;
}

div.figCapFull {
    width: 20%;
    text-align: right;	
}
div.photoCapText, div.figCapFull {
	display: inline-block;
}
.textError {
	color: darkred;
}

/* button group properties */
div.bg-div {	
	text-align: center;
	height: 20px;
	padding-bottom: 24px;
}

div.bg-button {
	height: 20px;
	display: inline-block;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 6px;
	min-width: 50px;
}

div.bg-first {
	border-top-left-radius: .25rem;
	border-bottom-left-radius: .25rem;
	border: 1px solid #dee2e6;
}

div.bg-middle {
    border-width: 1px;
    border-style: solid;
    border: 1px solid #dee2e6;
    border-left: none;    
}

div.bg-last {
    border-top-right-radius: .25rem;
    border-bottom-right-radius: .25rem;
    border: 1px solid #dee2e6;  
}

div.bg-active {
	background: #fff;
	color: #6c757d;
	cursor: pointer;
}

div.bg-inactive {
	background: #007bff;
	color: #fff;
	border-color: #007bff;
}

/* collapsible styles */
div.collapsible-group {
	margin-top: 8px;
	margin-bottom: 8px;
}
div.collapsible-header {
	height: 25px;
	font-weight: 600;
	padding-top: 7px;
	padding-left: 10px;
	cursor: pointer;
}

div.collapsible-header-active {
	background: #716868;
    color: white;
}

div.collapsible-header-inactive {
    background: #8aa5c1;
    color: black;
}

div.collapsible-header:hover {
    background: #007bff;
    color: white;
}

div.collapsible-content {
	background: #f7eded;
	color: black;
	padding: 5px 10px 5px 20px;
}

li.collapsible-li-closed {
	list-style-image: url('../images/collClosed.png');
}

li.collapsible-li-open {
    list-style-image: url('../images/collOpen.png');
}

span.collapsible-li-header {
	font-weight: 600;
	font-size: 16px;
	cursor: pointer;
}

span.collapsible-li-content {
	font-weight: normal;
	font-size: 14px;
}

span.answer-option::before {
	content: '"';
}

span.answer-option::after {
    content: '"';
}

span.screen-question {
	font-weight: 600;
}

span.superscript {
	font-size: .83em;
	vertical-align: super;
}

span.subscript {
	font-size: .83em;
	vertical-align: sub;
}

span.app-section {
	font-weight: 600;
	font-style: italic;
}

span.screen-control {
	font-weight: 600;
	font-style: italic;
}

div.photoPopup {
	z-index: 104;
	color: #0445a9;
	background-color: rgba(255,255,255,.9);
	text-align: center;
	position: absolute;
	left: 20%;
	top: 10%;
	border: 1px solid black;
	max-height: 80%;
	max-width: 60%;
	border-radius: 4px;
	box-shadow: 10px 10px 5px 0px rgba(0,0,0,.3);
}

div.photoPopupClose {
	z-index: 106;
	width: 10%;
	float: right;
	text-align: right;
	padding-top: 5px;
	padding-right: 5px;
	height: 20px;
	font-size: 20px;
	font-weight: 500;
	color: black;
}

div.photoPopupClose:hover {
    cursor: pointer;
}

div.photo-popup-drag {
	z-index: 105;
	width: 100%;    
    padding-top: 5px;
    height: 20px;
}

img.button-image-popup {
	height: 14px;
	width: 14px;
	padding-left: 2px;
	padding-right: 2px;
}

img.button-image-popup:hover {
    cursor: pointer;
}

span[data-popupimage]:hover {
	cursor: pointer;
}

figure {
	margin-left: 10px;
	margin-right: 10px;
}

figure.figure-set {
	display: inline-block;
}

figure.figure-set-left {
    margin-left: 10px;
    margin-right: 5px;
    width: 45%;
}

figure.figure-set-right {
    margin-right: 10px;
    margin-left: 5px;
    width: 45%;
}

img.image-popup {
    height: auto;
    width: 80%;
}

img.image-popup-square {
    height: auto;
    width: 60%;
}

img.image-popup-horizontal {
    height: auto;
    width: 50%;
}

img.image-popup-horizontal-long {
    height: auto;
    width: 75%;
}

img.image-popup-horizontal-full {
    height: auto;
    width: 100%;
}

img.image-popup-vertical {
    height: 50%;
    width: auto;
}

img.image-popup-vertical-long {
    height: auto;
    width: 35%;
}

figcaption.image-popup-caption {
	font-size: 16px;
	font-weight: 600;
	padding-top: 5px;
	margin-top: 5px;
	border-top: gray dashed 1px;
}

figcaption.image-popup-caption-block {
	font-size: 16px;
	padding-top: 5px;
	margin-top: 5px;
	border-top: gray dashed 1px;
}

span.image-popup-title {
	font-weight: 600;
}

span.image-popup-text-bold {
	font-weight: 600;
}

span.text-italic {
	font-style: italic;
}

figcaption.image-popup-caption-left-just {
	text-align: left;
}

header {
	font-size: 10px;
}
#headerFlex {
	display: flex;
	justify-content: center;
	border-bottom: 1px #051930 solid;
    background-color: #0098d7;
    color: white;
}

#headerFlex img.menuicon {
	align-self: flex-start;
}

#headerFlex img.stateicon {
	align-self: flex-end;
}

#headerFlex div.centered {
	display: inline-flex;
	width: 100%;
}

#headerFlex #appTitle {
	
}

#headerFlex #Title {
	display: block;
	width: 100%;
}

#headerFlex #Subtitle {
    display: block;
    float: none;
    width: 100%;
}

#headerFlex #stssnIdDiv {
    display: block;
    width: 100%;
}

#headerFlex #eyebrow {
	margin-right: 0;
}

table.dataTable tbody tr.selected {
	background-color: green!important;
	color: white;
	font-weight: 600;
}

span.successIcon {
	display: inline-block;
	vertical-align: middle;
}

span.successIconE {
    display: inline-block;
    vertical-align: super;
}

img.successIcon {
	height: 22px;
	width: 22px;
}

span.successText {
	display: inline-block;
	width: 90%;
}

div.dtsp-searchPane.dtsp-columns-4 {
	min-width: 220px!important;
}

div.dtsp-topRow {
	background: inherit!important;
	border: none!important;
}

span.showSubRows, span.showStus {
	cursor: pointer;
	font-weight: 600;
	font-size: 14px;
}

div.leaflet-right-bottom-control {
	border-radius: 2px;
	border: black 1px;
	font-size: 14px;
	background-color: white;
}

div.mainPieDiv {
	display: inline-block;
	vertical-align: top;
	text-align: center;
	font-size: 18px;
	font-weight: 600;
	width: 64%;
}

div.subPieDiv {
    display: inline-block;
    vertical-align: top;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    width: 33%;
}

button.retainActive {
	background: #81dda2;
}

div.poor-photo-div {
	height: 20px;
}

span.poor-photo-yb {
	font-size: 14px;
}

img.poor-photo-yb {
	height: 18px;
	width: auto;
	vertical-align: bottom;
	margin-right: 6px;
}

/* Photo Slideshow Styles */
.photo-slide-container {
  position: relative;
  width: 90%;
  height: 85%;
}

.photo-slides {
	height: 100%;
}

.photo-slides-container {
	border: solid 2px #0e8541; 
	width: 65%;
	display: inline-block;
}

.photo-slide {
	display: flex;
	height: 700px;
	justify-content: center;
	align-items: center;
	background-image: radial-gradient(white, gray);
}

.photo-slide-image {
	max-width: 100%;
	max-height: 100%;
}

.photo-slide-cursor {
	cursor: pointer;
}

.photo-slide-prev, .photo-slide-next {
    cursor: pointer;
    position: absolute;
    top: 45%;
    width: auto;
	padding: 16px;
	margin-top: -50px;
	color: #0e8541;
	font-weight: bold;
	font-size: 40px;
	border-radius: 0 3px 3px 0;
	user-select: none;
	-webkit-user-select: none;
}

.photo-slide-next {
	right: 34.9%;
    border-radius: 3px 0 0 3px;
}

.photo-slide-prev:hover, .photo-slide-next:hover {
	background-color: rgba(0, 0, 0, 0.8);
	color: #a2cef5;
}

.photo-slide-number {
    color: #cfe7d9;
    font-size: 22px;
    font-weight: 600;
    padding: 8px 12px;
    position: absolute;
    top: 0;
    left: 0;
}

.photo-slide-fullres {
	padding: 8px 12px;
	position: absolute;
	top: 0;
	right: 0;
	cursor: pointer;
}

#filterHeader {
	cursor: pointer;
}

.photo-zoom-lens {
  position: absolute;
  border: 1px solid #d4d4d4;
}

.photo-zoom-lens-2x {
    width: 210px;
    height: 180px;
}

.photo-zoom-lens-4x {
    width: 105px;
    height: 90px;
}

.photo-zoom-lens-6x {
    width: 70px;
    height: 60px;
}

.photo-zoom-lens-8x {
    width: 52.5px;
    height: 45px;
}

.photo-zoom-lens-10x {
    width: 42px;
    height: 36px;
}

.photo-slide-caption-container {
  text-align: center;
  background-color: #222;
  padding: 2px 16px;
  color: white;
}

.photo-slide-thumb-container {
	margin-left: 20px;
	display: inline-block;
	width: 30%;
	vertical-align: top;
}

.photo-slide-thumb-row:after {
  content: "";
  display: table;
  clear: both;
}

.photo-slide-thumb-col {
  float: left;
  width: 25%;
  text-align: center;
}

.photo-slide-thumb {
	max-width: 100%;
	max-height: 100px;
}

.photo-slide-opac {
  opacity: 0.6;
}

.photo-slide-header-text {
	font-weight: bold;
    font-size: 18px;
    margin-right: 10px;
}

.photo-slide-header {
	margin-bottom: 4px;
}

.photo-slide-active, .photo-slide-opac:hover {
  opacity: 1;
}

.slide-zoom-container {
	width: 100%;
}

.photo-slide-zoom-factor {
	display: inline-block;
	background-color: gray;
	color: black;
	width: 40px;
	border-radius: 5px;
	font-size: 15px;
	text-align: center;
	margin-left: 5px;
}

.photo-slide-zoom-factor:hover {
	background-color: black;
    color: white;
}

.active-zoom {
	background-color: green;
    color: white;
}

.photo-slide-thumbs {
	/*
	position: absolute;
	bottom: 0;
	*/
}

.slide-zoom-result {
	border: 1px solid #d4d4d4;
	width: 420px;
    height: 360px;
    display: inline-block;
}

.slide-cat-filter-label {
	font-weight: bold;
    font-size: 16px;
}

#filterKeyCbs, #filterLocCbs, #filterGearCbs {
	padding-left: 15px;
}

div.photo-popup-thumb-row {
	width: 100%;
}

img.photo-popup-thumb:last-child {
    margin-right: 0;
}

img.photo-popup-thumb {
	width: 23.5%;
	margin-right: 2%;
	height: auto;
}

ul.base_ul_style {
	list-style-type: disc;
}

ul.base_ul_style li {
	list-style-image: none;
}

img.flagThumb {
	width: 80px;
	height: 80px;
	object-fit: cover;
	margin-right: 10px;
	margin-bottom: 5px;
	filter: brightness(70%);
	border: solid white 3px;
}

img.flagThumb:hover {
	filter: brightness(100%);
}

img.flagThumb-selected {
	filter: brightness(100%);
	border: solid green 3px;
}

img.flagThumbDetails {
	width: 46.9%;
	height: 180px;
	object-fit: cover;
	margin-right: 2%;
	margin-bottom: 5px;
	border: solid green 2px;
	cursor: zoom-in;
}

img.flagThumbTable {
	width: 40px;
	height: 40px;
	object-fit: cover;
	margin-right: 5px;
	margin-bottom: 2px;
	border: solid green 1px;
}

img.flagThumbLarge {
	width: 98%;
	border: solid green 2px;
	cursor: zoom-out;
}

div.report-alerts {
	border: solid #c1861b 1px;
}

div.report-alerts-header {
	background-color: orange!important;
}

.alertIcon {
    height: 24px;
    padding-right: 2px;
    padding-left: 6px;
    vertical-align: text-bottom;
}

.alertIcon:hover {
	cursor: pointer;
}

.ui-dialog {
	z-index: 1047!important;
}

.leaflet-center {
    left: 40%;
    transform: translate(-20%, 0%);
    min-width: 60%;
}

div.leaflet-popup-separator {
	border-top: 1px solid black;
	height: 4px;
	margin-top: 8px;
}

table.polyTable {
	width: 95%!important;
}

div.leaflet-button-group {
	text-align: center;
}

button.leaflet-control-button {
	height: 30px;
    font-size: 14px;
    font-weight: 600;
    padding-right: 15px;
    padding-left: 15px;
    margin-top: 5px;
    margin-bottom: 5px;
    border: 1px solid black;
    background-color: #e6e6e6; 
    cursor: pointer;
}

button.leaflet-popup-button {
	display: block;
	margin-top: 4px;
	height: 27px;
	width: 100%;
}

button.leaflet-popup-button:hover {
	background-color: #d3d3dd;
	border-color: blue;
}

.div-upper-border {
	border-top: 1px solid black;
	padding-top: 4px;
	margin-top: 8px;
	padding-left: 10px;
	padding-right: 10px;
}

ul.tight-top {
	padding-top: 0px;
}

div.note-indent {
	margin-left: 12px;
}
span.hideToggleRight {
	cursor: pointer;
	font-size: 14px;
	font-weight: 200;
	text-decoration: underline;
	float: right;
	margin-left: 15px;
}

input[type=text].text-field-datepicker, input[type=date].text-field-datepicker {
	min-width: 100px;
	max-width: 120px;
}

input[type=number].text-field-number-short {
	min-width: 70px;
	max-width: 90px;
}

input[type=number].text-field-number-medium {
	min-width: 100px;
	max-width: 120px;
}

input[type=number].text-field-number-long {
	min-width: 130px;
	max-width: 150px;
}

div.two-column {
	display: table-cell;
	width: 50%;
	vertical-align: top;
}

div.two-column-left {
	border-right: 1px solid green;
}

div.two-column-right {
	padding-left: 10px;
}

p.summarySectionTightHeader {
    font-weight: bold;
    font-size: 16px;
    padding-bottom: 0px;
}

ul.gearList {
	padding-top: 0!important;
}

nav.flexDisplay {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-content: center;
	margin-top: 20px;
}

button.nav-block {	
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
	border: solid 1px #5a5555;
	
	width: 20%;
	height: 40px;
	color: white;
	font-weight: bold;
	font-size: 20 px;
}

button.nav-first {
	clip-path: polygon(0% 0%, 95% 0%, 100% 50%, 95% 100%, 0% 100%);
}

button.nav-middle {
	clip-path: polygon(0 0, 95% 0, 100% 50%, 95% 100%, 0% 100%, 5% 50%);
}

button.nav-last {
	clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%, 5% 50%);
}

button.nav-current {
	background-color: #1818e8;
}

button.nav-current:hover {
	background-color: #5353ff;
}

button.nav-active {
	background-color: #108544;
}

button.nav-active:hover {
	background-color: #17bf63;
}

button.nav-inactive {
	background-color: #7f7f7f;
}

button.nav-inactive:hover {
	background-color: #c8c8c8;
}

span.textsearch-exactmatch {
	font-weight: 700;
	background-color: #6af56a;
	text-decoration: underline double;
}

span.textsearch-soundexmatch {
	font-weight: 700;
	background-color: yellow;
	text-decoration: underline dotted;
}

div.eyebrowFlex {
	position: fixed;
	right: 10%;
	top: 2px;
  	float: right;
	padding: 0 5px 4px 5px;
	background-color: #034694;
	min-height: 35px;
	max-height: 70px;
	max-width: 40%;
	min-width: 10%;
	display: flex;
	/* min-width: 370px; */
}

img.photo-icon, img.pdf-icon {
	height: 24px;
	width: 24px;
}

img.photo-icon-popup:hover {
	cursor: pointer;
}

img.pdf-icon {
	height: 24px;
	width: 24px;
}

img.pdf-icon {
	height: 24px;
	width: 18px;
}

img.cur-pdf-icon {
	height: 26px;
	width: 18px;
}


button.table-action {
	 position: relative;
    display: inline-block;
    box-sizing: border-box;
    margin-left: .167em;
    margin-right: .167em;
    margin-bottom: .333em;
    padding: .5em 1em;
    border: none;
    /*
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 2px;
    */
    cursor: pointer;
    font-size: .88em;
    line-height: 1.6em;
    color: inherit;
    white-space: nowrap;
    overflow: hidden;
    background-color: rgba(0, 0, 0, 0.1);
    background: linear-gradient(to bottom, rgba(230, 230, 230, 0.1) 0%, rgba(0, 0, 0, 0.1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr="rgba(230, 230, 230, 0.1)", EndColorStr="rgba(0, 0, 0, 0.1)");
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    text-decoration: none;
    outline: none;
    text-overflow: ellipsis;
    height: 27px;
    margin-bottom: 4px;
}

button.table-action:last-child {
	margin-bottom: 0px;
}

button.table-action:hover:not(.disabled) {
	/*
	border: 1px solid #666;
	*/
	background-color: rgba(0, 0, 0, 0.1);
	background: linear-gradient(to bottom, rgba(153, 153, 153, 0.1) 0%, rgba(0, 0, 0, 0.1) 100%);
}


button.minMaxButton, button.showMoreButton {
	float: right;
	margin-right: 10px;
    min-height: 30px;
    min-width: 130px;
    color: white;
    border: 1px lightgray;
    border-radius: 5px;
}

button.minMaxButton.minMaxOpen, button.showMoreButton.showMoreOpen {
	background-color: #238523;
}

button.minMaxButton.minMaxOpen:hover, button.showMoreButton.showMoreOpen:hover {
background-color: #13a013;
}

button.minMaxButton.minMaxClosed, button.showMoreButton.showMoreClosed {
	background-color: #1b3798;
}

button.minMaxButton.minMaxClosed:hover, button.showMoreButton.showMoreClosed:hover {
background-color: #0e65a5;
}

div.sectionSum {
	text-align: left;
}

p.sectionSum-desc {
	padding-top: 15px;	
}
/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */