@font-face {
    font-family: 'Roboto';
    src: url('/fonts/roboto_regular_macroman/Roboto-Regular-webfont.eot');
    src: url('/fonts/roboto_regular_macroman/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/roboto_regular_macroman/Roboto-Regular-webfont.woff') format('woff'),
         url('/fonts/roboto_regular_macroman/Roboto-Regular-webfont.ttf') format('truetype'),
         url('/fonts/roboto_regular_macroman/Roboto-Regular-webfont.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Macondo';
         url('/fonts/Macondo-Regular.ttf') format('truetype'),
    font-weight: normal;
    font-style: normal;
}
a:link {
	color: #006699;
}


/* visited link */
a:visited {
	color: #006699;
}

/* mouse over link */
a:hover {
	color: #006699;
	
}
.red a {
	color: red;
}
.blue a {
	color: blue;
}
.dkblue a {
	color: #006699;
}
.green a {
	color: #4CAF50;
}
.w3-text-indigo a {
	color: #3f51b5;
}
.w3-btn i.fa{
	margin-right: 0px;
}
/* Use Desktop as default because LIBC desktops have IE9 which doesn't support responsive design CSS elements*/
* {
    box-sizing: border-box;
}

.row:after {
    content: '';
    clear: both;
    display: block;
    text-align: left;
}


html {
    font-family: 'Roboto', sans-serif;
	font-size: 16px;
}

.linkcontent{
	cursor: pointer;
}

body.modal-open {
	position: fixed;
	width: 100%;
}

img.sidebar {
  -webkit-transform: translateZ(0);
  /*transform: translateZ(0);*/
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: box-shadow, transform;
  transition-property: box-shadow, transform;
}

img.sidebar:hover {
  box-shadow: 0 5px 5px -5px rgba(0, 0, 0, 0.5);
  -webkit-transform: scale(1.01);
  transform: scale(1.1);
}

.sidebar_vertical img{
	width: 100%; 
	float: none;
}
.sidebar_horizontal img{
	float: left; 
	margin: 10px; 	
	width: calc(25% - 20px); 
	height: 212px;  
	object-fit: cover;
	object-position: 50% 25%;
}

h1, h2, h3, h4, h5 {
	margin:0;
	color: black;
}

.theme {
	color: #006699;
}
.alttheme {
	color: #707070;
}
.notify {
	color: #FFFFFF;
	background-color: #4d6f31;
}

.newheader {
	background-image: url('/css/banners/lummisland.jpg');
	width: 100%;
	height: 150px;
	background-repeat: no-repeat;
	background-position: center center;
	-o-background-size: cover, auto;
	-moz-background-size: cover, auto;
	-webkit-background-size: cover, auto;
	background-size: cover, auto;
	position: static;
	clear: both;
	display: block;
}
.newheader > div {
	padding: 0px;
	margin: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	height: 100%;
	vertical-align: middle;
	text-align: left;
	display: block; 
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
}
.newheader div img{
	max-height: 100%;
	max-width: 100%;
	float: right;
}

div.newHeading{
	line-height: 36px;
	font-size: 36px;
}

.shadow{
	color: #FFFFFF;
	text-shadow: #000000 0.05em 0.05em 0.1em;	
}

#title{
	display: inline-block;
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
#logotitle{
	display: inline-block;
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
.col-1 {width: 8.33%; max-width: 8.33%; float: left;padding: 15px;}
.col-2 {width: 16.66%; max-width: 16.66%; float: left;padding: 15px;}
.col-3 {width: 24.9%; max-width: 24.9%; float: left;padding: 15px;}
.col-4 {width: 33.3%; max-width: 33.3%; float: left;padding: 15px;}
.col-5 {width: 41.66%; max-width:41.66%; float: left;padding: 15px;}
.col-6 {width: 49.9%; max-width: 49.9%; float: left;padding: 15px;}
.col-7 {width: 58.33%; max-width: 58.33%; float: left;padding: 15px;}
.col-8 {width: 66.6%; max-width: 66.6%; float: left;padding: 15px;}
.col-9 {width: 74.9%; max-width: 74.9%; float: left;padding: 15px;}
.col-10 {width: 83.33%; max-width: 83.33%; float: left;padding: 15px;}
.col-11 {width: 91.66%; max-width: 91.66%; float: left;padding: 15px;}
.col-12 {width: 100%; max-width: 100%; float: left;padding: 15px;}


div.formatting{
	width: 100%;
	padding: 0px;
	margin: 0px;
	text-align: left;
	background-color: white;
	font-size: 10px;
}
div.edit{
	width: 100%;
	padding: 15px;
	text-align: left;
	background-color: white;
}
select.edit {
	background-color: #e8f7fc;
	border: 3px solid grey;
	width: 100%;
	font-family: 'Roboto', sans-serif;
	font-size: 1em;
}
input.edit {
	background-color: #e8f7fc;
	border: 3px solid grey;
	width: 100%;
	font-family: 'Roboto', sans-serif;
	font-size: 1em;
}
input.login {
	background-color: white;
	border: 3px solid #006699;
	width: 100%;
	font-family: 'Roboto', sans-serif;
	font-size: 1em;
}
textarea.edit {
	background-color: #e8F7fc;
	width: 100%;
	border: 3px solid grey;
    	font-family: 'Roboto', sans-serif;
	font-size: 1em;
}
.ShowForEdit {
	padding: 15px;
	margin: 0;
	margin-bottom: 15px;
	text-align: center;
	bacKground: #e8D7Dc;
	border: thin solid black;
}
.deletebutton {
	background: #ff471a;
	margin-top: 15px;
	margin-bottom:5px;
	border: thin solid black;
}
.deletebutton:hover {
	cursor: pointer;
}
.addbutton {
	padding: 10px;
	color: white;
	background: green;
	margin-top: 15px;
	margin-bottom:15px;
	border: thin solid black;
}
.addbutton:hover {
	cursor: pointer;
}
div.preview{
	width: 100%;
	padding: 15px;
	text-align: left;
	background-color: white;
	
}
#preview_content {
	text-align: left;
}

.fileActionsAllowed  {
	margin-top: 35px;
}

.w3-btn{
	border:none;
	display:inline-block;
	outline:0;
	padding:6px 16px;
	vertical-align:middle;
	overflow:hidden;
	text-decoration:none!important;
	color:#fff;
	background-color:#000;
	text-align:center;
	cursor:pointer;
	white-space:nowrap
	}
.w3-btn:hover{box-shadow:0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19)}
.w3-round{border-radius:4px!important}
.w3-large {
	word-wrap: break-word;
	/*margin: 10px;*/
	font-size: 36px;
    color: #000000;
	text-shadow: hsl(0,0%,100%) 0.1em 0.1em 0.2em;
}	
.w3-xlarge {
	word-wrap: break-word;
	/*margin: 10px;*/
	font-size: 36px;
    color: #000000;
	/*text-shadow: hsl(0,0%,100%) 0.1em 0.1em 0.2em;*/
}
	
.w3-large.button{
	color: #FFFFFF;
	text-shadow: hsl(360,100%,0%) 0.1em 0.1em 0.2em;	
}
.w3-xlarge.button{
	color: #FFFFFF;
	text-shadow: hsl(360,100%,0%) 0.1em 0.1em 0.2em;	
}
#adminlink_box, #userlink_box {
	min-width: 250px;
	z-index: 2;
}
#helplink_box {
	min-width: 450px;
}
.shadowless, .noshadow {
	text-shadow: none;	
}
.swatch i.fa{
	color: black;
	text-shadow: none;
	font-size: 32px;
}
.backlink {
	color: #FFFFFF;
	text-shadow: hsl(360,100%,0%) 0.1em 0.1em 0.2em;
	white-space: normal;
	padding-left: 10px;
}
.videobox {
	overflow:hidden;
	margin: 0px;
	margin-bottom: 15px;
	margin-top: 15px;
	width: 100%;
	text-align: center;
	padding: 5px;
	color: black;
	background-color: #fdfdfe;
	border: 2px solid #4d6f31;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	border-top-left-radius: 5px;
	-moz-border-radius-topright: 5px;
	border-top-right-radius: 5px;
}
div.videobox:before{
        font-family: FontAwesome;
        content:'\f03d';
        padding: 0px;
        font-size: 3em;
       color: #4d6f31;
        text-shadow: 1px 1px 4px black;
        float: left;
        margin: 0px;
        margin-right: 15px;
        margin-left:  5px;
}

.newsfeed {
    /*border-radius: 5px;*/
    opacity: 1;
    background-color: white;
    padding: 15px;
    color: white;
    text-align: center;
    font-size: 1em;
    width: 95%;
}
.newsfeed.div{
	text-align: left;
}
.newsfeed.span{
	text-align: left;
}

.newsfeed h3 {
	color: #006699;
	margin: 0px;
	margin-bottom: 7px;
}
.newsfeed h4 {
	margin: 0px;
	margin-bottom: 7px;
	color: #006699;
	
}
.newsfeed h4:hover {
	color: #707070;
}


.isAction:hover {
	cursor: pointer;
}


.newsbit-odd {
	color: #4CAF50;
    border-radius: 5px;
	border: thin solid #4CAF50;
	opacity: 1;
	text-align: left;
	margin-bottom: 7px;
	padding: 7px;
	background-color:white;
}
.newsbit-odd:hover{
	cursor: pointer;
	background-color: #4CAF50;
	color: white;
	
}

.newsbit-even {
	color: #0099cc;
    border-radius: 5px;
	border: thin solid  #0099cc;
	opacity: 1;
	text-align: left;
	margin-bottom: 7px;
	padding: 7px;
	background-color: white;
}

.newsbit-even:hover{
	cursor: pointer;
	background-color: #0099cc;
	color: white;	
}
.timestamp {
	display: inline-block;
	margin: 2px;
	margin-right: 15px;
	color: black;
	font-weight: normal;
}
/*clearfix*/
.clearfix{
	zoom:1;
}
.clearfix:after{
	content:'.';
	display:block;
	clear:both;
	visibility: hidden;
	height:0;
	font-size:0;
	vertical-align: middle;
}

/*Documents*/
.doc-summary{
	text-align: center;	
}
.doc-summary h2 {
	margin-top: 0px;
	margin-bottom: 5px;
	font-size: 1.5em;
}
.doc-summary p{
	padding: 0px;
	margin-top: 5px;
	margin-bottom: 5px;
	font-size: 0.8em;
}
.doc-link{
	color: #006699;
}
.directurl {
	color: grey;
	font-size: 0.8em;
}
.docTags {
	display: inline-block;
	width: 100%;
	clear: left;
}
.moreinfo{
	width: 100%;
	display: inline-block;
	font-size: 0.7em;
	color: 	#006699;
	clear: left;
	
}
.moreinfo span {
	cursor: pointer;
}
.searchbox{

	padding: 5px;

}

/*2018 Document Links*/
	
	.doclink {
		display: inline-block;
		width: calc(33% - 16px);
		max-width: calc(33% - 16px);
		min-width: 370px;
		margin: 5px;
		margin-left: 0px;
		margin-right: 0px;
	}
	.doclink.center, .doclink.w3-center  {
		margin: 5px;
		margin-left: 0px;
		margin-right: 0px;
	}
	.doclink.w3-left {
		margin-right: 5px;
	}
	.doclink.w3-right {
		margin-left: 5px;
	}
	.docIconInfo{
		border-radius: 5px;
		display: table;
		height: 100px;
		color: white;
		padding:0px 5px 0px 120px;
		white-space: nowrap;
		margin: 0px;
		width: 100%;
		overflow-x: hidden!important;
	}
	
	.docIconInfo.docx, .docIconInfo.doc {
		border: thin solid #2a5699;
		background-color: #2a5699;
		background-image: url(/css/docicons/word.svg);
		background-position: left top;
		background-repeat: no-repeat;
	}
	.docIconInfo.xlsx, .docIconInfo.xls {
		border: thin solid #207245;
		background-color: #207245;
		background-image: url(/css/docicons/excel.svg);
		background-position: left top;
		background-repeat: no-repeat;
	}
	.docIconInfo.pdf {
		border: thin solid #006699!important;
		background-color: #006699!important;
		background-image: url(/css/docicons/pdf.svg)!important;
		background-position: left top;
		background-repeat: no-repeat;
	}
	.docIconInfo.pptx,.docIconInfo.ppt {
		border: thin solid #d24625;
		background-color: #d24625;
		background-image: url(/css/docicons/powerpoint.svg);
		background-position: left top;
		background-repeat: no-repeat;
	}
	.docIconInfo.zip {
		border: thin solid #330066;
		background-color: #330066;
		background-image: url(/css/docicons/zip.svg);
		background-position: left top;
		background-repeat: no-repeat;
	}	
	.docIconDetails {
		display: table-cell;
		vertical-align: middle;
		text-align: left;
		white-space: normal;
	}
	
	.docIconName {
		font-size: 13pt;
		line-height: 15pt;
		min-width: 240px;
	}
	.docIconSize {
		float: left;
		font-size: 0.8em;
	}
	.docIconCredit {
		float: left;
		font-size: 0.8em;
		margin-left: 5px;
	}
	#showbox .doclink {
		max-width: calc(20% - 16px);
	}
	#showbox .docIconName {
		min-width: 170px;
	} 
	
/*old doc links*/
.docBox {
	overflow-x: hidden!important;
	padding: 0px;
	margin: 0px;

}

.aDocument{
	text-align: left;
	display: block;
	position: relative;
	border-bottom: 1px solid #707070;
	padding: 5px;
	line-height: 1.1em;
	}

	.goDocument{
		display: block;
		border: 1px solid #707070;
		width: 100%;
		clear: both;
	}
	.sortDoc{
		display: block;
		height: 100px;
		width: 100%;
		clear: both;
		text-align: center;
	}
	#sortColumns{
		display: inline-block;
		width: 80%;
		height: 100px;
		line-height: 100px;
		vertical-align: middle;
	}
	span.colName {
		display: none;
	}
	.selectSort {
		width: 120px;
		height: 80px;
		float:left;
		line-height: normal;
		margin: 10px;
		text-align: center;
		color: black;
		background-color: white;
		border: 1px solid black;
			  -webkit-border-top-left-radius: 10px;
			  -moz-border-radius-topleft: 10px;
			  -ms-border-radius-topleft: 10px;
			  border-top-left-radius: 10px;
			  -webkit-border-top-right-radius: 10px;
			  -ms-border-top-right-radius: 10px;
			  -moz-border-radius-topright: 10px;
			  border-top-right-radius: 10px;
		cursor: move;
			-webkit-transition: -webkit-transform 0.2s ease-out;
			-moz-transition: -moz-transform 0.2s ease-out;
			-o-transition: -o-transform 0.2s ease-out;
			-ms-transition: -ms-transform 0.2s ease-out;
	}
	.selectSort header {
		  display: block;
		  color: #fff;
		  text-shadow: #000 0 1px;
		  box-shadow: 5px;
		  padding: 5px;
		  background: black;
		  background: -moz-linear-gradient(left center, rgb(0,0,0), rgb(79,79,79), rgb(21,21,21));
		  background-color: -moz-linear-gradient(left center, rgb(0,0,0), rgb(79,79,79), rgb(21,21,21));
		  background: -webkit-gradient(linear, left top, right top,
									   color-stop(0, rgb(0,0,0)),
									   color-stop(0.50, rgb(79,79,79)),
									   color-stop(1, rgb(21,21,21)));
		  background: -webkit-linear-gradient(left center, rgb(0,0,0), rgb(79,79,79), rgb(21,21,21));

		  

			  -webkit-border-top-left-radius: 10px;
			  -moz-border-radius-topleft: 10px;
			  -ms-border-radius-topleft: 10px;
			  border-top-left-radius: 10px;
			  -webkit-border-top-right-radius: 10px;
			  -ms-border-top-right-radius: 10px;
			  -moz-border-radius-topright: 10px;
			  border-top-right-radius: 10px;
			  -moz-user-select: none;
		     -khtml-user-select: none;
		     -webkit-user-select: none;
		     user-select: none;
		      /* Required to make elements draggable in old WebKit */
		      -khtml-user-drag: element;
		      -webkit-user-drag: element;
	}
	.selectSort.colover {
		border: 2px dashed #006699;
	}


	.selectSort.moving {
	  opacity: 0.25;
	  -webkit-transform: scale(0.8);
	  -moz-transform: scale(0.8);
	  -ms-transform: scale(0.8);
	  -o-transform: scale(0.8);
	}
	
	
	.SortLabel {
		color: black;
		background-color: white;
		display: block;
		float:left;
		margin: 10px;
		border: none;
		
	}
	.SortSelected {
		color: white;
		background-color: #006699;
		border: 1px solid #006699;
	}
	
	.SortSelected  header{
		color: white;
		 background:#707070;
		 border-bottom: 1px solid #ddd;
		 background-color: #707070;
			  -webkit-border-top-left-radius: 10px;
			  -moz-border-radius-topleft: 10px;
			  -ms-border-radius-topleft: 10px;
			  border-top-left-radius: 10px;
			  -webkit-border-top-right-radius: 10px;
			  -ms-border-top-right-radius: 10px;
			  -moz-border-radius-topright: 10px;
			  border-top-right-radius: 10px;
	}	
	.selectSort.over {
		border: 2px dashed #000;
	}
	.documentsbox{
		padding-top: 0px;
		padding-left: 50px;
		padding-bottom: 120px;
	}
	.selectDoc{
		 -webkit-transform: translateZ(0);
		/*transform: translateZ(0);*/
		box-shadow: 0 0 1px rgba(0, 0, 0, 0);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		-moz-osx-font-smoothing: grayscale;
		-webkit-transition-duration: 0.3s;
		transition-duration: 0.3s;
		-webkit-transition-property: box-shadow, transform;
		transition-property: box-shadow, transform;
		font-size: 0.8em;
		display: block;
		position: relative;
		float: left;
		height: 180px;
		line-height: normal;
		width: 240px;
		text-align: center;
		margin: 6px;
		padding: 0px;
		border: 2px solid grey;
		background-color: white;
		overflow:hidden;
	}

	.selectDoc:hover{
		 -webkit-transform: scale(1.05);
		transform: scale(1.1);
		cursor: pointer;
		border: 4px solid #006699;
		z-index: 3;
		background-color: white;
	}

	.fileDocType{
		margin: 5px;
		margin-right:0px;
		padding: 5px;
		color: White;
		background-color:#006699;
		float:left;
		position:relative;
		display: inline-block;
		clear: left;

	}
	.selYear {
		font-size: 1em;
		padding: 5px;
		padding-left:0px;
		padding-right:0px;
		display: inline-block;
		float: left;
		color: #707070;
		margin: 5px;
		margin-right:0px;
	}
	.selAuthor {
		font-size: 1em;
		padding:0px;
		display: inline-block;
		color: grey;
		margin: 0px;
		margin-right:5px;
		margin-left:5px;
		text-align: center;
		word-wrap: break-word;
		width: 100%;
	}
	.selTitle {
		width: 100%;
		padding: 5px;
		padding-top:0px;
		margin: 0px;
		margin-right:5px;
		margin-left:5px;
		text-align: center;
		display: inline-block;
		word-wrap: break-word;
	}
	.selSize {
		margin: 5px;
		padding: 5px;
		color: White;
		background-color:#006699;
		float:right;
		position:absolute;
		display: block;
		clear: right;
		bottom: 0;
		right:0;
	}
.docMetaData{
	padding: 0px;
	float: left;
	
}
.meta-PDF{

}
.meta-DOC{

}
.meta-DOCX{

}
.meta-XLS{

}
.meta-XLSX{

}
.meta-PPT{

}
.meta-PPTX{

}
.fileMetaData{
	padding: 5px;
	float: left;
	word-wrap: break-word;
	padding: 5px;
	border-radius: 10px;
	color: #000000;
	background: #707070;

}

.docInfo {
	padding: 0px;
	word-wrap: break-word;
	float: left;
}


.file-PDF:before{
	content: 'PDF';
}
.file-DOC:before{
	content: 'DOC';
}
.file-DOCX:before{
	content: 'DOCX';
}
.file-XLS:before{
	content: 'XLS';
}
.file-XLSX:before{
	content: 'XLSX';
}
.file-PPT:before{
	content: 'PPT';
}
.file-PPTX:before{
	content: 'PPTX';
}
.file-ZIP:before{
	content: 'ZIP';
}
.pubYear{
	color: #707070;

}

.docTitle{
	display: inline-block;
	font-size: 1em;
	line-height: 1em;
	width: 100%;
	overflow:hidden;
}
.docAuthor{
	color: #707070;
	display: inline-block;
	font-size: 0.8em;
	word-wrap: break-word;
	text-transform: uppercase;
}

.linkURL{
	display: none;
	visibility: hidden;
}
.fileSize{
	float: right;
	display: inline-block;

}
.uploadDate{
	float: right;
	clear: right;
	display: inline-block;
	font-size: 0.5em;


}
.uploadedBy{
	text-transform: uppercase;
	font-size: 0.5em;
	display: inline-block;

}
.uploadedBy:before{
	content: 'Uploaded By:';
}
.docID{
	visibility: hidden;
	display: none;
}

/*for tags*/
.searchterms {
	width: 100%;
	padding: 5px;

}
.ticket {
    margin-left: 5px;
    font-family: Roboto;
    font-size: 12px;
    font-weight: normal;
    position: relative !important;
    background: #8dc63f;
    float: left;
    padding: 7px 3px;

}
.prioritytags .ticket{
	margin-bottom: 5px;
	opacity: 0.8;
}
.docticket {
	    margin: 3px;
	    padding: 2px 3px;
}
.ticket:after {
    content: '';
    position: absolute !important;
    z-index: 100;
    top: 0;
    left: 0;
    border-right: #fff 7px solid;
    border-bottom: #fff 7px solid;
    -moz-border-radius: 0 0 20px 0;
    -webkit-border-radius: 0 0 20px 0;
    border-radius: 0 0 20px 0;
}
 
.ticket a {

    padding: 4px 10px 4px 20px;
    text-decoration: none;
    color: white;
    white-space: nowrap;

}
 
.docticket.ticket a:hover {
	color: white!important;
}
.prioritytags.ticket a:hover{

} 
.selectedtags .ticket{
	font-size: 18px;
}
.ticket a:before{
	position: absolute !important;
	color: red!important;
	content: 'x';
	right: 0;
	padding-right: 2px;

}

a.ticketTag{
	padding: 2px!important;
	padding-left: 25px!important;
	font-size: 0.9em!important;
}
a.ticketTag:before{
	content: none;
}
.prioritytags a:before{
	content: none;
}
 textarea.policyupdate{
	font-size: 20px;
}
.selectedtags.ticket a:before{
	position: absolute !important;
	color: red!important;
	content: 'x';
	right: 0;
	padding-right: 2px;
}

.ticket a:after {
    content: '';
    position: absolute !important;
    z-index: 100;
    bottom: 0;
    left: 0;
    border-right: #fff 7px solid;
    border-top: #fff 7px solid;
    -moz-border-radius: 0 20px 0 0;
    -webkit-border-radius: 0 20px 0 0;
    border-radius: 0 20px 0 0;
}
.ticket .circle {
    position: absolute !important;
    z-index: 100;
    border: 5px #fff solid;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    margin-top: -5px;
    width: 0;
    height: 0;
    top: 50%;
    left: 8px;
    -moz-box-shadow: 0 -1px 0 rgba(0,0,0,0.5),
        0 1px 0 rgba(255,255,255,0.3);
    -webkit-box-shadow: 0 -1px 0 rgba(0,0,0,0.5),
        0 1px 0 rgba(255,255,255,0.3);
    box-shadow: 0 -1px 0 rgba(0,0,0,0.5),
        0 1px 0 rgba(255,255,255,0.3);
}


.unUsedTicket {
	line-height: 0.9em;  
	margin: 3px; 
	padding: 3px; 
	float: left;
	font-size: 0.8em;
	cursor: pointer;
}


/*newsticker*/
.newsticker, .ticker{
	cursor: pointer;
	background:#4d6f31;
	color: #FFFFFF;
	overflow: hidden;
	padding: 0px;
	padding-left: 5px;
	padding-right: 5px;
	width: calc(100% - 40px);
	height: 60px;
	margin-bottom: 7px;
	display: block;
}

.newsticker ul, .ticker ul{
	display: block;
	padding: 0px;
	margin: 0px;
}

.newsticker ul li, .ticker ul li{
	vertical-align: middle;
	display: block;
	background-color:#4d6f31;
	background:#4d6f31;
	overflow: hidden;
	word-wrap: normal;
	display:none;
	BOX-SHADOW: NONE;
	font-size: 0.8em;
	cursor: pointer;
	padding: 0px;
	padding-left: 5px;
	line-height: 60px;
	height: 60px;
	color: #FFFFFF;
}
.newsticker ul li:hover {
 	text-shadow: hsl(360,100%,0%) 0.1em 0.1em 0.2em;
}
.newsheader, .tickerheader{
	background-color:#4d6f31;
	background:#4d6f31;
	WIDTH: 40px;
	height: 60px;
	line-height: 60px;
	display: inline-block;
	float: left;
	color: #FFFFFF;
	font-size: 0.8em;
 	text-shadow: hsl(360,100%,0%) 0.1em 0.1em 0.2em;
	vertical-align: middle;
	text-align: center;
	
}
.newsheadline {
	vertical-align: middle;
	font-size: 1.2em;
	line-height: 1.2em;
	display: inline-block;
	position: relative;
}
.tickertext{
	vertical-align: middle;
	font-size: 1.2em;
	line-height: 1.1em;
	display: inline-block;
	position: relative;
	color: white;
	text-shadow: hsl(360,100%,0%) 0.1em 0.1em 0.2em;
}
a.tickerlink:hover {
	background-color: inherit!important;
}
.socialbox{
    width: 100%;
    overflow: hidden;
    padding:0px;
    margin: 0px;
}

.sociallink{
   float: left;
   width:30px;
}

.socialbutton{
   width:100%;
}

.menu ul {
    list-style:none; 
    list-style-type: none;
    margin: 0;
    padding: 0;
    margin-bottom:6px;
    display: block;
}

.menu li {
    padding: 8px;
    margin-bottom: 7px;
    background-color:#FFFFFF;
    color: #000000;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    display: block;
}

.menu li a:hover {
    background-color: #707070;
    text-shadow: hsl(0,0%,35.2%) 0.1em 0.1em 0.2em;
	color: #FFFFFF;
}
.menu li a:hover, .menu li a:hover i {
	color: #FFFFFF!important;
	text-shadow: hsl(0,0%,35.2%) 0.1em 0.1em 0.2em!important;
}

.menuicon{
	display: inline-block; 
	font-size: 24px; 
	float: right;
	margin-left: 5px;
}
.menu ul li:before {
	display: none;
}
.menu a {
	display: block;
	text-decoration: none;
    color: #000000;
	width: 100%;
}
.menu li a{
	width: 100%;
	display: inline-block;
}
.nav ul {
    list-style:none; 
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: block;
}

.nav li{
	opacity: 1;
	overflow: hidden;
	margin:0;
	padding:0;
    margin-left: 15px;
	margin-bottom: 1px;
    margin-right: 5px;
    background-color:#FFFFFF;
    color: #000000;
	display: block;
}
.nav li:hover {
	opacity: 1;
	background-color:#707070;
}
.nav ul li:before {
	display: none;
}
.link_group_heading {
	margin-top: 8px;
}
i.fa{
	margin-right: 10px;
}
.w3-btn-block i.fa, .w3-accordion i.fa{
	margin-left: 10px;
}
.w3-display-topright i.fa, .w3-display-right i.fa {
	margin-top: 10px;
}
i.fa.nomargin {
	margin-right: 0px;
	margin-left: 0px;
}
.aside {
    background-color: #FFFFFF;
    padding: 15px;
    padding-top: 0px;
    color: #000000;
    text-align: center;
    font-size: 14px;
    box-shadow: none;
	border: thin solid #707070;
}

.footer {
    display: block;
    position: relative;
    background-color: #FFFFFF;
    color: #000000;
    text-align: center;
    font-size: 12px;
    padding: 5px;
    clear: both;
    margin: 0;
}
.footer a{
	font-size:12px; 
	margin:0; 
	padding:0; 
	color: #000000;
}
.breadcrumbs {
    position: relative;
    background-color: white;
    color: #4d6f31;
    text-align: left;
    font-size: 14px;
    padding: 2px;
    clear: both;
    border:0;
    margin: 0px;
}

.userlinks {
    display:block;
    position: relative;
    background-color:  #4d6f31;
    color: grey;
    text-align: center;
    font-size: 12px;
    padding: 15px;
    clear: both;
    border: thin solid  #4d6f31;
    margin: 0px;
    margin-top: 5px;
    margin-bottom: 5px;
	overflow:hidden;
}
.nopadding{
	padding: 0px!important;
}

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1000; /* Sit on top */
    padding-top: 60px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */

    
}

/* Modal Content */
.modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    border: 0px;
    width: 90%;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s

}


.modal-content.fullscreenmod {
    width: 100%;
}
.modal.fullscreenmod{
	padding-top: 0px; /* Location of the box */
}
.modal-header.fullscreenmod {
	overflow: hidden;
	height: 40px;
}
.modal-content.fullscreenmod {
	width: 100%;
	min-height: 100vh;
}
.modal-body.fullscreenmod {
	padding-top: 0px;
	top: 40px;
	bottom: 0px;
	left: 0px;
	right: 0px;
}

.modal-header h2{
	color: white;
}
/* Add Animation */
@-webkit-keyframes animatetop {
    from {top:-300px; opacity:0} 
    to {top:0; opacity:1}
}

@keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

/* The Close Button */
.close {
    color: #FFFFFF;
    float: right;
    /*font-size: 28px;*/
    font-weight: bold;
}

.close:hover, .close:focus {
    text-decoration: none;
    cursor: pointer;
}
.modal-content {
	min-height: 80%;
    background-color: white;
	background: white;
	display: block;
    border-radius: 15px;
}
.modal-header {
	position:absolute;
	display: block;
	top: 0px;
	left: 0px;
    padding: 15px;
	PADDING-TOP: 0PX;
    background-color: #4d6f31;
    color: #FFFFFF;
	width: 100%;
	height: 66px;
	border: none;
	/* border-top: 1px solid black;*/
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    
}
.filler {

}
.listSetupMode{
	width: 100%;
	text-align: center;
}
.modal-body {
	display:block;
	/*width: 100%;*/
	padding: 5px;
	padding-top: 66px;
	
	overflow-y: auto;
	position:absolute;
	-webkit-overflow-scrolling: touch;
    border-radius: 15px;
}

.addexistingUsers{
	left: 0px;
	top: 45px;
	right: 1px;
	bottom: 0px;
	position: absolute;
	display: inline-block!important;
	overflow-y: scroll;
}
.addNewUser {
	position: relative;
}

.modal-Leftside{
	background-color: #4d6f31;
	width: 15px;
	color: #000000;
	position: absolute;
	left: 0px;
	height: 100%;
	margin: 0px;
	padding: 0px;
	padding-left: 5px;
	border: none;
	/*border-left: 1px solid black;
	border-top: 1px solid black;*/
    border-top-left-radius: 15px;
    border-bottom-left-radius: 10px;
}
.modal-Rightside{
	background-color: #4d6f31;
	width:15px;
	color: #000000;
	position: absolute;
	right:0px;
	height: 100%;
	margin:0px;
	padding:0px;
	padding-right: 5px;
	border: none;
	/*border-right: 1px solid black;
	border-top: 1px solid black;*/
    border-top-right-radius: 15px;
    border-bottom-right-radius: 10px;
}

.modal-footer {
	margin-top: 5px;
	display: block;
    	padding: 10px;
    	background-color: #4d6f31;
    	color: #000000;
	position: absolute; 
	bottom: 0;
	width: 100%;
	border: none;
	/*border-bottom: 1px solid black;
	border-right: 1px solid black;
	border-left: 1px solid black;*/
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}

.w3-hide{display:none!important}
.w3-show-block,.w3-show{display:block!important}
.w3-show-inline-block{display:inline-block!important}

.useraction{
	border:none;
	display:inline-block;
	outline:0;
	padding: 0px;
	margin:0px;
	vertical-align:middle;
	overflow:hidden;
	text-decoration:none!important;
	text-align:left;
	cursor:pointer;
	color: #000000;
    background-color: #FFFFFF;
	}

.w3-btn-block{
	border:none;
	display:inline-block;
	outline:0;
    margin-bottom: 7px;
	vertical-align:middle;
	overflow:hidden;
	text-decoration:none!important;
    color: #FFFFFF;
	background-color:#006699;
	text-align:left;
	cursor:pointer;
	box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
	}
	
.w3-btn-block.w3-disabled{
	cursor:not-allowed;
	opacity:0.3
	}
.w3-btn-block.w3-disabled{
	pointer-events:none
	}
.w3-btn-block.w3-disabled:hover{
	box-shadow:none
	}
.w3-btn-block:hover,{
	box-shadow: 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19)
	}


.w3-container:after {
	overflow: hidden;
	content:'';
	display:table;
	clear:both; 
	padding:0.01em 16px
	}
	
.w3-accordion {
	width:100%;
	cursor:pointer
	}
	
.w3-accordion-content{
	background-color: white;
	opacity:1;
	cursor: auto;
	display:none;
	position:relative;
	width:100%;
	margin:0;
	padding:0;
	}
	
.w3-accordion-content a{
	padding:6px 16px;
	display:block
	}
	
.w3-btn-block{
	padding: 0px;
	text-align: left;
	width: 100%
}

.noboxshadow {
	box-shadow: none!important;
}
	
.openButton, .closeButton {
	white-space: normal!important;	
}
.openButton:After {
	float: right;
	font-family: FontAwesome;
	content: ' \f077';
	margin-top: 8px;
	margin-right: 10px;
}
.closeButton:After {
	float: right;
	font-family: FontAwesome;
	/*content: ' \f078';*/
	content: ' \f00d';
	margin-top: 8px;
	margin-right: 10px;
}	

.rotate.down:After{
	animation: spin-cat-2 0.2s;
	 animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
}

/*
.rotate.up:After{
	animation: spin-cat-1 0.5s;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
}*/

.rotate.start:After{
	animation: spin-cat-3 1s;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
}

.rotate.start.down:After{
	animation: spin-cat-4 0.5s;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
}
@keyframes spin-cat-1 {100%{transform:rotateX(180deg);}}
@keyframes spin-cat-2 {100%{transform:rotateX(180deg);}}
@keyframes spin-cat-3 {100%{transform:rotateY(360deg);}}
@keyframes spin-cat-4 {100%{transform:rotateY(180deg) rotateX(180deg);}}
	
img {
	border: 0;
}

.relatedPageRow{
	margin-top: 10px;
}
.PreviewEdit {
	display:block;
	margin-top: 5px;
	margin-left: 5px;
	background:#707070;
	background:-moz-linear-gradient(top,#707070 0%,#FFFFFF 100%);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#707070),color-stop(100%,#FFFFFF));
	background:-webkit-linear-gradient(top,#707070 0%,#FFFFFF 100%);
	background:-o-linear-gradient(top,#707070 0%,#FFFFFF 100%);
	background:-ms-linear-gradient(top,#707070 0%,#FFFFFF 100%);
	background:linear-gradient(top,#707070 0%,#FFFFFF 100%);
	filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#707070', endColorstr='#FFFFFF',GradientType=0);
	padding:5px;
	color:#fff;
	font-family:'Helvetica Neue',sans-serif;
	font-size:16px;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border:1px solid #707070}
.PreviewEdit:hover {
	cursor: pointer;
}
.SaveEdit {
	font-size:24px;
	display:block;
	text-align: center;
	width: 100%;
	background:#006699;
	background:-moz-linear-gradient(top, green 0%,#4AA400 100%);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,green),color-stop(100%,#4AA400));
	background:-webkit-linear-gradient(top,green 0%,#4AA400 100%);
	background:-o-linear-gradient(top,green 0%,#4AA400 100%);
	background:-ms-linear-gradient(top,green 0%,#4AA400 100%);
	background:linear-gradient(top,green 0%,#4AA400 100%);
	filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='green', endColorstr='#4AA400',GradientType=0);
	padding:5px;
	color:#fff;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border:1px solid #459A00
}
.SaveEdit:hover {
	cursor: pointer;
}

a.CancelEdit {
	font-size: 24px;
	display:block;
	text-align: center;
	width: 100%;
	background:#ffcc00;
	padding:5px;
	color: white;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border:1px solid #ffcc00
}
a.DeletePage {
	font-size: 24px;
	display:block;
	text-align: center;
	width: 100%;
	background: #ff0000 ;
	background:-moz-linear-gradient(top,#ff0000 0%,#ff3333 100%);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#ff0000),color-stop(100%,#ff3333));
	background:-webkit-linear-gradient(top,#ff0000 0%,#ff3333 100%);
	background:-o-linear-gradient(top,#ff0000 0%,#ff3333 100%);
	background:-ms-linear-gradient(top,#ff0000 0%,#ff3333 100%);
	background:linear-gradient(top,#ff0000 0%,#ff3333 100%);
	filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ff0000', endColorstr='#ff3333',GradientType=0);
	padding:5px;
	color: grey;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border:1px solid #ff0000
}
hr {
	margin:5px;
	
}

hr.floatclear {
    background: none;
    border: 0;
    clear: both;
    display: block;
    float: none;
    font-size: 0;
    margin: 0;
	margin-bottom: 15px;
    padding: 0;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
    }

.editaction {
	width: 100%;
	margin: 0px;
	margin-top: 5px;
	background:#b3e6ff;
	background:-moz-linear-gradient(top#b3e6ff 0%, #cceeff 100%);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#b3e6ff),color-stop(100%,#cceeff));
	background:-webkit-linear-gradient(top,#b3e6ff 0%,#cceeff 100%);
	background:-o-linear-gradient(top,#b3e6ff 0%,#cceeff 100%);
	background:-ms-linear-gradient(top,#b3e6ff 0%,#cceeff 100%);
	background:linear-gradient(top,#b3e6ff 0%,#cceeff 100%);
	filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#b3e6ff', endColorstr='#cceeff',GradientType=0);
	padding:2px;
	color:black;
	font-size:16px;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border:1px solid #459A00;
}

.caput {
	font-size: 36px;
	color: 	 #b3b3cc;
	background: white;
	border: none;
	cursor: default;
}
.active {
	font-size: 36px;
	color: #000066;
	background: white;
	border: none;
	cursor: pointer;
}
.colorpicker {
		width: 100%;
		padding:0;
		background: white;
}
.swatch {
    text-align: center;
    text-decoration: none;
    display: inline-block;
	width: 25%;
	padding:0;
	padding-top: 0%;
	margin: 0px;
	color:black;
	float:left;
	border: 1px solid black;
	vertical-align: middle;
}
.swatch:hover {
	cursor: pointer;
}
hr {float:none; clear: both; width: 100%; text-align: center;}
hr {border:0; border-top:1px solid #ccc; margin:20px 0}
hr.dkblue {border-top:1px solid #006699;}
hr.green {border-top:1px solid #4AA400;}
hr.black {border-top:1px solid #000000;}
hr.red {border-top:1px solid #FF0000;}

a.userlink {
    color: white;
}
.userlink:hover {
    text-shadow: black 0.1em 0.1em 0.2em;
}
.submitLogin {
	width: 100%;
	margin: 0px;
	background:#006699;
	background:-moz-linear-gradient(top, green 0%,#4AA400 100%);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,green),color-stop(100%,#4AA400));
	background:-webkit-linear-gradient(top,green 0%,#4AA400 100%);
	background:-o-linear-gradient(top,green 0%,#4AA400 100%);
	background:-ms-linear-gradient(top,green 0%,#4AA400 100%);
	background:linear-gradient(top,green 0%,#4AA400 100%);
	filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#006699', endColorstr='#4AA400',GradientType=0);
	padding:15px;
	color:#fff;
	font-size:16px;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border:1px solid #459A00
}
	.Search{
		padding:0;
		margin:0;
		width: 100%;
	}
	.top-search{
		font-size: 1em;
		text-align: right;
		width: 33%;
		position: absolute;
		top:40px;
		right: 10px;
	}
	
	#searchform #q{
		font-family: 'Roboto', sans-serif;
		color: #a7a7a7;
		font-size: 1em;
		width: 100%;
		opacity: 0.5;
		margin: 0px 0px 5px 0px;
		padding: 2px 35px 2px 8px;
		border: 0;
		background: white;
		border-radius: 10px;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
	}
	#searchform #searchsubmit{
		font-family: 'Roboto', sans-serif;
		position: absolute;
		visibility: none;
		display: none;
	}
	
	.gsc-result-info {
		text-align: left;
		font-size: 1em;
		padding-left: 8px;
		margin: 10px 0 10px 0;
	}
	.gs-result .gs-title, .gs-result .gs-title *{
		text-decoration: none !important;
		font-family: 'Roboto', sans-serif;
	}
	.gs-result a.gs-visibleUrl, .gs-result .gs-visibleUrl {

		text-decoration: none;
	}
	.gs-result .gs-snippet {
		font: 12px Tahoma, Geneva, sans-serif;
	}
	.gsc-results .gsc-cursor-box .gsc-cursor-page {
		cursor: pointer;
		text-decoration: none !important;
		margin-right: 5px;
		display: inline;
		padding: 2px 5px 2px 5px;
	}
	.imagesbox{
		padding-left: 5px;
		padding-bottom: 120px;
	}
	.image-item{
		 -webkit-transform: translateZ(0);
		/*transform: translateZ(0);*/
		box-shadow: 0 0 1px rgba(0, 0, 0, 0);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		-moz-osx-font-smoothing: grayscale;
		-webkit-transition-duration: 0.3s;
		transition-duration: 0.3s;
		-webkit-transition-property: box-shadow, transform;
		transition-property: box-shadow, transform;
		display: block;
		position: relative;
		float: left;
		height: 180px;
		line-height: 168px;
		width: 240px;
		text-align: center;
		margin: 7px;
		padding: 0px;
		border: 2px solid grey;
		background-color: white;
	}
	.image-item:hover{
		 -webkit-transform: scale(1.05);
		transform: scale(1.1);
		cursor: pointer;
		border: 4px solid #006699;
		z-index: 3;
		background-color: white;
	}
	.image-item img{
		margin: 0px;
		border: none;
		line-height: normal;
		vertical-align: middle;
		display: inline-block;
		max-width: 100%;
		max-height: 100%;
	}
	
	.over {
		line-height: normal;
		z-index: 2;

		position: absolute;
		display: inline-block;
		bottom: 0px;
		left: 0px;
		right: 0px;
		opacity: 0.7;
		background: black;
		color: white;
		font-size: 0.6em;
	}

	.boxDoc{
		 -webkit-transform: translateZ(0);
		/*transform: translateZ(0);*/
		box-shadow: 0 0 1px rgba(0, 0, 0, 0);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		-moz-osx-font-smoothing: grayscale;
		-webkit-transition-duration: 0.3s;
		transition-duration: 0.3s;
		-webkit-transition-property: box-shadow, transform;
		transition-property: box-shadow, transform;
		font-size: 0.8em;
		display: inline-block;
		position: relative;
		float: none;
		height: 180px;
		line-height: normal;
		width: 240px;
		text-align: center;
		margin: 10px;
		padding: 0px;
		border: 2px solid grey;
		background-color: white;
		overflow:hidden;
	}

	.boxDoc:hover{
		 -webkit-transform: scale(1.02);
		transform: scale(1.25);
		cursor: pointer;
		border: 4px solid #006699;
		z-index: 3;
		background-color: white;
	}
    .boxDoc:after{
        content: 'Click to Open';
        color: white;
        background-color: green;
        padding: 5px;
        border-radius: 5px;
    }

.lnrdiv {
	width: 50%;
	display: inline-block;
	/*margin: 15px;*/
	text-align: center;
	color: #000000;
	background-color: #FFFFFF;
	padding: 5px;
	border-radius: 7px;
	/*border: thin solid #0099cc;*/
	border: none;
}
.lnrdiv.center{
	display: block;
	float: none;
	overflow: hidden;
	clear: both;
	margin-left: auto;
	margin-right: auto;
}
.lnrdiv.w3-center{
	display: block;
	float: none;
	overflow: hidden;
	clear: both;
	margin-left: auto;
	margin-right: auto;
}
.captionText{
	line-height: 1em;
	display: inline-block;
	text-align: center;
	opacity: 1;
	color: inherit;
	background-color: inherit;
	font-size: 0.8em;
	padding: 3px;
	width: 100%;
	margin: 0px;
}

.lnrdiv > a {
	line-height: 0%;
	/*display: inline-block;*/
	margin: 0px;
	padding: 0px;
	width: calc(100% - 10px);
}

.lnrdiv img{
	width: 100%;
	margin: 0px;
	margin-bottom: -5px;
	border-radius: 4px;
}
.lnrdiv.w100 {
	width: calc(100%);	
}
.lnrdiv.w90 {
	width: calc(90%);	
}
.lnrdiv.w80 {
	width: calc(80%);		
}
.lnrdiv.w70 {
	width: calc(70%);			
}
.lnrdiv.w60 {
	width: calc(60%);		
}
.lnrdiv.w50 {
	width: calc(50%);		
}
.lnrdiv.w45 {
	width: calc(45%);	
}
.lnrdiv.w40 {
	width: calc(40%);		
}
.lnrdiv.w30 {
	width: calc(30%);		
}
.lnrdiv.w20 {
	width: calc(20%);		
}
.TableCols, .tablecols {
	display: block;
	position: relative;
	width: 70%;
	font-size: 0.9em;
	/*clear: both;*/
	margin-top: 15px;
	margin-bottom: 15px;
	/*margin-left: auto;*/
	/*margin-right: auto;*/
	overflow: hidden;
	text-align:center;
	padding: 0px;
	border: thin solid #006699;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	border-top-left-radius: 5px;
	-moz-border-radius-topright: 5px;
	border-top-right-radius: 5px;
}
.tableHeader{
	width: 100%;
	display: block;
	text-align: center;
	color: #FFFFFF;
	background-color: #006699;
	font-size: 1.1em;
}

.colA {
	padding: 3px;
	margin: 0px;
	width: 49%;
	display: inline-block;
	text-align: center;
	clear: left;
}
.colB {
	padding: 3px;
	margin: 0px;
	width: 49%;
	display: inline-block;
	text-align: center;
	clear: right;
}
div.question {
	overflow:hidden;
	margin: 5px;
	margin-bottom: 5px;
	width: 90%;
	text-align: left;
	font-style: italic;
	padding:10px;
	color: #707070;
	background-color:white;
	border: thin solid #707070;
	/*BELOW 4 LINES add rounded bottom corners to each menu item.
	  ONLY WORKS IN FIREFOX AND FUTURE CSS3 CAPABLE BROWSERS
	  REMOVE IF DESIRED*/
	-moz-border-radius-bottomleft: 5px;
	border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	border-top-left-radius: 5px;
	-moz-border-radius-topright: 5px;
	border-top-right-radius: 5px;
}

div.quote {
	position: relative;
	overflow:hidden;
	width:100%;
	margin: auto;
    font-family: Macondo;
	text-align: justify;
	font-style: italic;
	padding:15px;
	padding-left:20px;
	padding-right:20px;
	color: #404040;
	font-size: 24px;
	background-color: #fafafa;
	/*border: thin solid #4CAF50;*/
	box-shadow: 2px 2px 5px rgba(0,0,0,0.12), 2px 2px 5px rgba(0,0,0,0.24);
	/*BELOW 4 LINES add rounded bottom corners to each menu item.
	  ONLY WORKS IN FIREFOX AND FUTURE CSS3 CAPABLE BROWSERS
	  REMOVE IF DESIRED*/
	-moz-border-radius-bottomleft: 5px;
	border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	border-top-left-radius: 5px;
	-moz-border-radius-topright: 5px;
	border-top-right-radius: 5px;
}
div.quote:before{
		color: gray;
		opacity: 0.2;
        font-family: FontAwesome;
        content:"\f10d";
        font-size: 36px;
		width: 50px;
		margin: 0px;
		margin-top: 0px;
		margin-left: 0px;
		position: absolute;
		left: 0px;
		top: 0px;
		padding: 10px;
		padding-top: 0px;
}
div.quote:after{
		color: gray;
		opacity: 0.2;
        font-family: FontAwesome;
        content:"\f10e";
        font-size: 36px;
		width: 60px;
		margin: 0px;
		margin-bottom: 0px;
		margin-right: 0px;
		position: absolute;
		right: 0px;
		bottom: 0px;
		padding: 10px;
		padding-bottom: 0px;
}

div.question a{
	color: #FFFFFF;
}

div.question:before{
        font-family: FontAwesome;
        content:"\f10d";
        padding: 15px;
        font-size: 3em;
        float: left;
        margin-right: 15px;
}
div.answer {
	overflow:hidden;
	margin: 5px;
	margin-top: 0px;
	margin-bottom: 25px;
	width: 90%;
	text-align: left;
	padding:10px;
	color: #006699;
	background-color: white;
	border: thin solid  #006699;
	/*BELOW 4 LINES add rounded bottom corners to each menu item.
	  ONLY WORKS IN FIREFOX AND FUTURE CSS3 CAPABLE BROWSERS
	  REMOVE IF DESIRED*/
	-moz-border-radius-bottomleft: 5px;
	border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	border-top-left-radius: 5px;
	-moz-border-radius-topright: 5px;
	border-top-right-radius: 5px; 
}
div.answer a{
	color: #006699;
}
div.answer:before{
        font-family: FontAwesome;
        content:"\f05a";
        padding: 15px;
        font-size: 3em;
        float: left;
        margin-right: 15px;
}
.fullscreen{
    position: fixed; /* Stay in place */
    z-index: 1000; /* Sit on top */
    left: 0;
    top: 0;
	max-width: 100%!important;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background: rgba(0, 0, 0, 0.5);
    text-align: center;
    font-size: 2em;
}
div.tide-inner-container{
	border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	border: 1px solid #006699;
}
.fullscreen div.tide-inner-container{
	margin-top: 5vh;
	position: relative;
	display: block;
	margin-left:auto;
	margin-right:auto;
	width: 95vw;
	height: 90vh;
	background-color: white;
	overflow: hidden;
}
.fullscreen iframe{
	max-width: 95vw!important;
    width: 95vw!important; /* Full width */
    height: 60vh!important;
}
.toggle-button{
	font-size: 1em;
	float: right;
	margin-right: 5px;
	cursor: pointer;
	padding: 0px;
	color: white;
	background-color: #006699;
	display: inline-block;
}
.fullscreen div.tide-inner-container span.toggle-button{
    display: inline-block;
	
}
.fullscreen .tide-disclaimer{
	display: block;
}
#tides-container {
	max-width: 600px;
	margin-bottom: 1em;
}
.tide-inner-container h4{
	display: inline-block;
	width: 100%;
	color: white;
	background-color: #006699;
	cursor: pointer;
	padding: 5px;
     font-size: 0.8em;
}
#tidesWidget{
    width: 100%;
    height: 200px;
}
.tide-input{
	display: inline-block;
	cursor: pointer!important;
	color: #006699;
	width: 90%;
    font-size: 1em;
}
.tide-select{
    color: #006699;
    font-size: 1em;
    display: inline-block;
    background: transparent;
    width: 100%;
    padding: 5px;
    padding-top: 0px;
    border: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    text-align: center;
   	line-height: 1em;
    
}
.tide-select-label{
    display: none;
    line-height: 0.5em;
    font-size: 0.5em;
    color: grey;
}
.tide-disclaimer{
    display: none;
    font-size: 0.5em;
    text-align: left;
    padding: 15px;
}
.data-source{
	color:#006699;
}
.calicon{
	color: #006699;
	width: 9%;
	text-align: right;
	display: inline;
	float:left;
}
.togbtn{
	float: right;
	background: #459A00;
	border-radius: 5px;
	clear: right;
	margin: 3px;
	margin-top: 0px;
}
h3{
	overflow:hidden;
}
.togbtn:after{clear:both;}

.hidebox {
	width: 100%;
	clear: both;
}

.radioblock{
	position: relative;
	padding-left: 50px!important;
}
.radiocontainer{
	margin-top: 5px;
	margin-bottom: 5px;
	margin-right: 50px;
}
.radiocontainer input[type="radio"] {
	display: none;
}
.radiocontainer input[type="checkbox"] {
	display: none;
}
.radiocontainer label {
  position: relative;
}
.radiocontainer span::before,
.radiocontainer span::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
.radiocontainer span.radio:hover {
  cursor: pointer;
}
.radiocontainer span.radio::before {
  left: -52px;
  width: 45px;
  height: 25px;
  background-color: #A8AAC1;
  border-radius: 50px;
}
.radiocontainer span.radio::after {
  left: -49px;
  width: 17px;
  height: 17px;
  border-radius: 10px;
  background-color: white;
  transition: left .25s, background-color .25s;
}
.radiocontainer input[type="radio"]:checked + label span.radio::after {
  left: -27px;
  background-color: green;
}
.radiocontainer input[type="checkbox"]:checked + label span.radio::after {
  left: -27px;
  background-color: green;
}
.radiocolumn{
	padding-top:0;
	padding-bottom:0;
}
.adjacentradio{
	margin-left: 75px;
}
.privatepage{
	float: right;
	border-radius: 5px;
}
.odd {
	background-color: #ffffff;
}
.even{
	background-color:  #d2eff9;
}
.switchname{
	vertical-align: middle;
	text-align: left;
	display: block;
	height: 100%;
	width: 50%;
	position: absolute;
    left: 0px;
    top: 0px;
	margin: 0px;
	padding: 5px;
}

.switch {
	position: relative;
	display: inline-block;
	width: 100px;
	height: 30px;
	padding: 3px;
	margin: 2px;
	/*background: linear-gradient(to bottom, #eeeeee, #FFFFFF 25px);
	background-image: -webkit-linear-gradient(top, #eeeeee, #FFFFFF 25px);*/
	border-radius: 18px;
	box-shadow: inset 0 -1px white, inset 0 1px 1px rgba(0, 0, 0, 0.05);
	cursor: pointer;
}
.switch-input {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
}
.switch-label {
	position: relative;
	display: block;
	height: inherit;
	font-size: 10px;
	text-transform: uppercase;
	background: #eceeef;
	border-radius: inherit;
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 2px rgba(0, 0, 0, 0.15);
}
.switch-label:before, .switch-label:after {
	position: absolute;
	top: 50%;
	margin-top: -.5em;
	line-height: 1;
	-webkit-transition: inherit;
	-moz-transition: inherit;
	-o-transition: inherit;
	transition: inherit;
}
.switch-label:before {
	content: attr(data-off);
	right: 11px;
	color: #aaaaaa;
	text-shadow: 0 1px rgba(255, 255, 255, 0.5);
}
.switch-label:after {
	content: attr(data-on);
	left: 11px;
	color: #FFFFFF;
	text-shadow: 0 1px rgba(0, 0, 0, 0.2);
	opacity: 0;
}
.switch-input:checked ~ .switch-label {
	background: #0099cc;
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 0 3px rgba(0, 0, 0, 0.2);
}
.switch-input:checked ~ .switch-label:before {
	opacity: 0;
}
.switch-input:checked ~ .switch-label:after {
	opacity: 1;
}

.switch-handle {
	opacity: 1;
	position: absolute;
	top: 4px;
	left: 4px;
	width: 28px;
	height: 28px;
	filter: alpha(opacity=100);
	background: linear-gradient(to bottom, #FFFFFF 40%, #f0f0f0);
	background-image: -webkit-linear-gradient(top, #FFFFFF 40%, #f0f0f0);
	border-radius: 100%;
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
}

.switch-handle:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -6px 0 0 -6px;
	width: 12px;
	height: 12px;
	background: linear-gradient(to bottom, #eeeeee, #FFFFFF);
	background-image: -webkit-linear-gradient(top, #eeeeee, #FFFFFF);
	border-radius: 6px;
	box-shadow: inset 0 1px rgba(0, 0, 0, 0.02);
}
.switch-input:checked ~ .switch-handle {
	transition: All 0.3s ease;
	left: 74px;
	box-shadow: -1px 2px 5px rgba(0, 0, 0, 0.2);
}
.switch-input:checked ~ .switch-handle:before {
	background: green;
}

.switch-label, .switch-handle {
	transition: All 0.3s ease;
	-webkit-transition: All 0.3s ease;
	-moz-transition: All 0.3s ease;
	-o-transition: All 0.3s ease;
}

.calSubs{
	border-bottom: thick solid #006699;
	margin-left: 15px;
	margin-right: 15px;
	margin-bottom: 15px;
}
.subbtn{
	 border-radius: 5px 5px 0px 0px; /* top left, top right, bottom right, bottom left */
}
.subbtn:hover ~ #subbord{
	box-shadow:0 4px 8px 0 rgba(0,0,0,0.2),0 3px 10px 0 rgba(0,0,0,0.19);
}
.policyWidget{
	clear: both;
}
.widgetheader{
		clear: both;
		overflow: hidden;
}
.widget-headline{
	display: inline-block;
}
.broadissue{
	padding: 2px;
	display: inline-block;
}
.limitedissue{
	padding: 2px;
	display: inline-block;
	margin-left: 30px;
}
.issues.w3-show{
	transition: All 0.7s ease;
	-webkit-transition: All 0.7s ease;
	-moz-transition: All 0.7s ease;
	-o-transition: All 0.7s ease;
}

.showMore{
	font-size: 24px;
	margin-top: 6px;
	text-align: center;
}
.showMore:hover{
	cursor: pointer;
	box-shadow: 0 5px 15px white;
}
.editable{
	/*min-height: 62px;*/
	overflow: auto;
	word-wrap: break-word;
	margin-top: 1px;
	margin-bottom: 1px;
	border: 2px solid red!important;
	border-style:dashed!important;
}
.editable.textbox{
	min-height: 62px;
}
.editable:hover{
	cursor: text;
}
.noselect {
	-moz-user-select: none; 
	-webkit-user-select: none; 
	-ms-user-select:none; 
	user-select:none;
	-o-user-select:none;
}
.issueattributebox{
	position: relative;
}
.issuesdata.issueHeader{
	font-size: 36px;
	text-align: left;
}

/*
[contentEditable=true]:empty:not(:focus):before{
    content:attr(data-text);
	color: grey;
}*/
.issueattributebox{
	overflow: hidden;
	position: relative;
	width: 100%;
	margin-bottom: 5px;
	margin-top: 5px;
}

.savebox {
	overflow: visible;
	margin: 2px;
	margin-bottom: 4px;
	padding-top: 2px;
	position: absolute;
	right: 0;
	bottom: 0;
}
.savebox i:hover{
	cursor:pointer;
	box-shadow:0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
}
i.hover:hover{
	cursor:pointer;
	box-shadow:0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);	
}
.goalrow {
	padding-left: 10px;
	padding-right: 10px;
}
.goalrow.odd{
	border: thin solid #d2eff9!important;
}
.goalrow.odd .issueattributebox{
	border: thin solid #ebebe0!important;
}

.goalrow.even .issueattributebox{
	border: thin solid white!important;
}
.goalpage .goalrow.odd{
	border: none!important;
}
.goalrow .privacy{
	padding: 4px;
	padding-top: 8px;
	padding-bottom: 0px;
}
.feedeventtype{
	width: 100%!important;
}
.feedHeadline {
	color: grey;
}
.postEdit {
	display: inline-block;
	color: green;
	margin-left: 25px;
}
.preEdit {
	color: red;
	margin-left: 25px;
	display: none;
}
.preEdit:before {
	font-family: FontAwesome;
	content: 'Previously \f061';
}
.postEdit:hover~.preEdit{
    display: inline-block;
}
.nowrap {
	white-space: nowrap;
}
.lostfound.photobox {
	padding: 0px;
	padding-top: 5px;
}
.lostfound_claim {
	max-width: 100%;
	cursor: pointer;
}
.lostfound_claim.thumb{
	float: right;
	max-height: 200px;
	margin-right: 5px;
	margin-left: 5px;
	margin-bottom: 5px;
}
.lostfound_thumb.newline {
	clear: left;
}
.lostfound.photobox img{
	width: 100%;
}
.lostfound_thumb{
		overflow: hidden;
		display: block;
		position: relative;
		float: left;
		margin: 0px;
		margin-right: 10px;
		margin-top: 10px;
		padding: 0px;
		background-color: white;
}
.lostfound_thumb.landscape{
	height: 20vw;
	width: calc(25% - 10px);
}
.lostfound_thumb.portrait{
	height: 30vw;
	width: calc(16.6% - 10px);
}
.lostfound_thumb.landscape img {
	height: 20vw;
	width: 100%;
}
.lostfound_thumb.portrait img {
	height: 30vw;
	width: 100%;
}
.lostfound_thumb:hover{
	border-radius: 5px;
	border: thick solid #006699;
}

.lostfound_thumb:hover img{
	border-radius: 0px!important;
}

.profile_apps .w3-bar-item {
	margin-bottom: 20px;
	margin-right: 10px;
}
span.dept_link {
	/*display: inline-block;*/
    margin: 2px;
}
.dept_link:hover a{
	color: white;
}

@media all and (max-width: 600px) {
/* For Phones */
	.w3-padding {
		padding:2px 4px!important
	}
	.modal{
		padding-top: 0px; /* Location of the box */
	}
	.modal-header {
		font-size: 18px;
		height: 33px;
	}
	.modal-header h1,.modal-header h2,.modal-header h3,.modal-header h4{
		font-size: 18px;
	}
	.modal-content {
		width: 100%;
		min-height: 480px;
		height: 100vh;
		overflow-y: scroll;
	}
	.modal-body {
		padding-top: 0px;
		top: 33px;
		bottom: 15px;
		left: 0px;
		right: 0px;
	}
	.modal-Rightside, .modal-Leftside {
		display: none;
	}
	.breadcrumbs {display: none;}
	.nomobile {display: none;}
	.w3-btn.mobile{
		margin-left: 2px;
		margin-right: 2px;
		width: calc(100% - 10px);
	}
	.docIconInfo {
		background-size: 25%;
		padding: 0px 5px 0px 26%;
	}

	.newheader {
		position: static;
		width: 100%;
    	height: 80px;
		background-repeat: no-repeat;
		background-position: center center;
		-o-background-size: cover, auto;
		-moz-background-size: cover, auto;
		-webkit-background-size: cover, auto;
		background-size: cover, auto;
		z-index:0;
		clear: both;
		display: block;
		filter: alpha(opacity=100);
	}		
	div.newHeading{
		line-height: 14px;
		font-size: 14px;
	}
	.col-m-1 {width: 100%; max-width: 100%;}
	.col-m-2 {width: 100%; max-width: 100%;}
	.col-m-3 {width: 100%; max-width: 100%;}
	.col-m-4 {width: 100%; max-width: 100%;}
	.col-m-5 {width: 100%; max-width: 100%;}
	.col-m-6 {width: 100%; max-width: 100%;}
	.col-m-7 {width: 100%; max-width: 100%;}
	.col-m-8 {width: 100%; max-width: 100%;}
	.col-m-9 {width: 100%; max-width: 100%;}
	.col-m-10 {width: 100%; max-width: 100%;}
	.col-m-11 {width: 100%; max-width: 100%;}
	.col-m-12 {width: 100%; max-width: 100%;}
	.col-m-0 {display:none;}
		
	.newsfeed {
		width: 100%;
		margin-right: 0px;
		}
	.aside {
		width: 100%;
		float: left;
		margin-left: 0px;
		}

	.w3-xlarge {
		font-size: 19px;
		}

	.top-search{
		font-size: 1em;
		text-align: right;
		width: 100%;
		position: relative;
		clear: both;
		padding:0;
		display: inline-block;
		top: 0;
		right: 0;

	}
	#q{
		font-family: 'Roboto', sans-serif;
		color: #a7a7a7;
		font-size: 1em;
		width: 100%;
		margin: 0px;
		margin-top: 15px;
		margin-bottom: 15px;
		padding: 5px 5px 5px 5px;
		border: thin solid #006699;
		background: white;
		border-radius: 10px;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		opacity:0.6; 
		-moz-opacity:0.6; 
		filter: alpha(opacity=60);
	}
	.doclink {
		width: calc(20% - 16px);
		max-width: calc(100% - 16px);
	}
	
	.lnrdiv {
		width: 100%;
		font-size: 0.6em;
	}

	.right {
		float: none;
		margin: 15px;
	}
	.left {
		float: none;
		margin: 15px;
	}
	.center {
		margin: 15px;		
	}
	.lnrdiv.w100{
		width: 100%;	
	}
	.lnrdiv.w90{
		width: 100%;	
	}
	.lnrdiv.w80{
		width: 100%;	
	}
	.lnrdiv.w70{
		width: 100%;	
	}
	.lnrdiv.w60{
		width: 100%;	
	}
	.lnrdiv.w50{
		width: 100%;	
	}
	.lnrdiv.w45{
		width: 100%;	

	}
	.lnrdiv.w40{
		width: 100%;	
	}
	.lnrdiv.w30{
		width: 50%;	
	}
	.lnrdiv.w20{
		width: 50%;	
	}
      .TableCols, .tablecols {
	    width: 100%;
	    font-size: 0.8em;
      }
      .colA {
	    text-align: center;
      }
      .colB {
	    text-align: center;
      }
      .doc-summary{
          text-align: center;	
      }
      div.quote {
        font-size: 1em;
		width: 100%;
      }
	  .fullscreen {
		  font-size: 1em;
	  }
      .fullscreen div.tide-inner-container{
		 margin-top: 0px;
		 display: inline-block;
         width: 100%;
         height: 100vh;
      }
      .fullscreen iframe{
         max-width: 100%!important;
         width: 100%!important; /* Full width */
         height: 50%!important;
      }
      #tidesWidget{
          width: 100%;
          height: 50vw;
      }

	  .sidebar_horizontal img{
		float: left; 
		margin: 10px; 	
		width: calc(100% - 20px); 
		height: 212px;  
		object-fit: cover;
		object-position: 50% 25%;
	  }
	  
	  div[name='Position_G'] .aside, div[name='Position_A'] .aside, div[name='Position_B'] .aside, div[name='Position_C'] .aside{
		display: none;
	  }  
	.lostfound_thumb.landscape{
		height: 25vw;
		width: calc(50% - 10px);
	}
	.lostfound_thumb.portrait{
		height: 50vw;
		width: calc(50% - 10px);
	}
	.lostfound_thumb.landscape img{
		height: 25vw;
	}

	.lostfound_thumb.portrait img{
		height: 50vw;
	}	
	.w3-center.mobile-left{
		text-align: left!important;
	}
	.mobile-left{
		text-align: left!important;
	}
	div.tab{
		width: 100%!important;
	}
}


@media all and (min-width: 600px) {
/* For tablets: */
		.modal{
			padding-top: 0px; /* Location of the box */
		}
		.modal-header {
			height: 66px;
			font-size: 30px;
		}
		.modal-header h1,.modal-header h2,.modal-header h3,.modal-header h4{
			font-size: 30px;
		}
		.modal-content {
			width: 100%;
			min-height: 100vh;
		}
		.modal-body {
			padding-top: 0px;
			top: 66px;
			bottom: 15px;
			left: 15px;
			right: 15px;
		}
		.docIconInfo.filemanager {
			background-size: auto 60px;
			padding: 65px 5px 0px 0px;
		}
		.addexistingUsers{
			top: 90px;
		}
		.breadcrumbs {display: none;}
		.nomobile {display: none;}

		.newheader {
			width: 100%;
			height: 120px;
			background-repeat: no-repeat;
			background-position: center center;
			-o-background-size: cover, auto;
			-moz-background-size: cover, auto;
			-webkit-background-size: cover, auto;
			background-size: cover, auto;
			filter: alpha(opacity=100);
			}
			div.newHeading{
				line-height: 24px;
				font-size: 24px;
			}
		.w3-xlarge {
			font-size: 32px;
			}

		.newsfeed {
			display: inline-block;
			position: relative;
			float: none;
			}
		.aside {
			display: block;
			position: relative;
			float: none;
			width: 80%;
			}
			.col-m-1 {width: 8.33%; max-width: 8.33%}
			.col-m-2 {width: 16.66%; max-width: 16.66%}
			.col-m-3 {width: 24.9%; max-width: 24.9%}
			.col-m-4 {width: 33.3%; max-width: 33%;}
			.col-m-5 {width: 41.66%; max-width: 41.66%}
			.col-m-6 {width: 49.9%; max-width: 49.9%}
			.col-m-7 {width: 58.33%; max-width: 58.33%}
			.col-m-8 {width: 66.6%; max-width: 66.6%}
			.col-m-9 {width: 75%; max-width: 75%}
			.col-m-10 {width: 83.33%; max-width: 83.33%}
			.col-m-11 {width: 91.66%; max-width: 91.66%}
			.col-m-12 {width: 100%; max-width: 100% }
			.col-m-0 {display:none;}
		.w3-btn-block{max-width: 100%}
		.doclink {
			width: calc(50% - 16px);
			max-width: calc(50% - 16px);
		}
		.top-search{
			font-size: 1em;
			text-align: right;
			width: 100%;
			position: relative;
			clear: both;
			margin-bottom: 15px;
			display: inline-block;
			top: 0;
			right: 0;
		}
		#q{
			font-family: 'Roboto', sans-serif;
			color: #a7a7a7;
			font-size: 1em;
			width: 100%;
			margin: 0px;
			margin-top: 15px;
			margin-bottom: 15px;
			padding: 5px 5px 5px 5px;
			border: thin solid #006699;
			background: white;
			border-radius: 10px;
			-moz-border-radius: 10px;
			-webkit-border-radius: 10px;
			opacity:0.6; 
			-moz-opacity:0.6; 
			filter: alpha(opacity=60);
		}
		.lnrdiv {
			width: 100%;
			font-size: 0.8em;
		}

		.right {
			float: none;
			margin: 15px;
		}
		.left {
			float: none;
			margin: 15px;
		}
		.center {
			margin: 15px;		
		}

		.TableCols, .tablecols   {
			width: calc(100% - 30px);	
		}
		.lnrdiv.w100   {
			width: calc(100%);	
		}
		.lnrdiv.w90 {
			width: calc(90%);
		}
		.lnrdiv.w80 {
			width: calc(80%);		
		}
		.lnrdiv.w70 {
			width: calc(70%);			
		}
		.lnrdiv.w60 {
			width: calc(60%);		
		}
		.lnrdiv.w50 {
			width: calc(50%);	
		}
		.lnrdiv.w45 {
			width: calc(45%);	
		}
		.lnrdiv.w40 {
			width: calc(40%);		
		}
		.lnrdiv.w30 {
			width: calc(40%);		
		}
		.lnrdiv.w20 {
			width: calc(40%);		
		}
      .colA {
	    text-align: right;
      }
      .colB {
	    text-align: left;
      }
      .doc-summary{
		text-align: center;	
      }
      div.quote {
	    font-size: 1em;
		width: 100%;
      }
      .fullscreen div.tide-inner-container{
		 margin-top: 0px;
         width: 100%;
         height: 100vh;
      }
      .fullscreen iframe{
         max-width: 100%!important;
         width: 100%!important; /* Full width */
         height: 50%!important;
      }
	  
      #tidesWidget{
          width: 100%;
          height: 50vw;
      }
	  .fullscreen {
		  font-size: 1.2em;
	  }
	  
	.lostfound_thumb.landscape{
		height: 12vw;
		width: calc(33% - 10px);
	}

	.lostfound_thumb.portrait{
		height: 25vw;
		width: calc(33% - 10px);
	}

	.lostfound_thumb.landscape img{
		height: 12vw;
	}

	.lostfound_thumb.portrait img{
		height: 25vw;
	}	
	.w3-center.mobile-left{
		text-align: left!important;
	}
}

@media only screen and (min-width: 993px) {
    	/* For desktop: */
	.nomobile {display: block;}
	.modal{
		padding-top: 60px; /* Location of the box */
	}
	.modal-header {
		height: 66px;
	}

	.modal-content {
		width: 90%;
		min-height: calc(100vh - 120px);
	}
	.modal-body {
		padding-top: 0px;
		top: 66px;
		bottom: 15px;
		left: 15px;
		right: 15px;
	}
	.addexistingUsers{
		top: 45px;
	}
	.breadcrumbs {display: block;}

	.newheader {
		width: 100%;
		height: 150px;
		background-repeat: no-repeat;
		background-position: center center;
		-o-background-size: cover, auto;
		-moz-background-size: cover, auto;
		-webkit-background-size: cover, auto;
		background-size: cover, auto;
		filter: alpha(opacity=100);
	}
	.doclink {
		width: calc(33% - 16px);
		max-width: calc(33% - 16px);
	}	
	.docIconInfo.filemanager {
		background-size: auto;
		padding: 0px 5px 0px 120px;
	}
	#showbox .doclink {
		min-width: 310px;
		margin-left: 2px;
		margin-right: 2px;
		max-width: calc(15% - 16px);
	}
	#showbox .docIconName {
		width: 130px;
	} 
	#showbox .doclink.w3-left {
		margin-right: 5px;
		margin-left: 0px;
	}
	#showbox .doclink.w3-right {
		margin-left: 5px;
		margin-right: 0px;
	}
	div.newHeading{
		line-height: 36px;
		font-size: 36px;
	}
	.w3-xlarge {
		font-size: 36px;	
		}

	.col-1 {width: 8.33%; max-width: 8.33%;}
	.col-2 {width: 16.66%; max-width: 16.66%;}
	.col-3 {width: 24.9%; max-width: 24.9%;}
	.col-4 {width: 33.3%; max-width: 33.3%;}
	.col-5 {width: 41.66%; max-width: 41.66%;}
	.col-6 {width: 49.9%; max-width: 49.9%;}
	.col-7 {width: 58.33%; max-width: 58.33%;}
	.col-8 {width: 66.6%; max-width: 66.6%;}
	.col-9 {width: 75%; max-width: 75%;}
	.col-10 {width: 83.33%; max-width: 83.33%;}
	.col-11 {width: 91.66%; max-width: 91.66%;}
	.col-12 {width: 100%; max-width: 100%;}
	.col-0 {display:none;}
	.w3-btn-block{max-width: 100%;}
	.newsfeed {
		width: 100%;
		}
	.aside {
		position: relative;
		float: left;
		width: 100%;
		}
	.top-search{
		clear: none;
		font-size: 1em;
		text-align: right;
		width: 33%;
		position: absolute;
		top:40px;
		right: 10px;
		
	}
	#q{
		font-family: 'Roboto', sans-serif;
		color: #a7a7a7;
		font-size: 1em;
		width: 75%;
		margin: 0px;
		margin-top: 10px;
		margin-right: 25px;
		padding: 10px;
		border: 0;
		background: white;
		border-radius: 10px;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		opacity:0.6; 
		-moz-opacity:0.6; 
		filter: alpha(opacity=60);
	}
	.TableCols.w100, .tablecols.w100  {
		width: calc(100% - 30px);	
	}
	
	.TableCols.w90, .tablecols.w90  {
		width: calc(90% - 30px);		
	}

	.TableCols.w80, .tablecols.w80    {
		width: calc(80% - 30px);		
	}
	.TableCols.w70, .tablecols.w70    {
		width: calc(70% - 30px);		
	}
	.TableCols.w60, .tablecols.w60    {
		width: calc(60% - 30px);		
	}
	.TableCols.w50, .tablecols.w50   {
		width: calc(49.5% - 30px);		
	}
	.TableCols.w45, .tablecols.w45   {
		width: calc(45% - 30px);		
	}
	.TableCols.w40, .tablecols.w40   {
		width: calc(40% - 30px);		
	}
	.TableCols.w30, .tablecols.w30   {
		width: calc(30% - 30px);		
	}
	.TableCols.w20, .tablecols.w20   {
		width: calc(20% - 30px);		
	}

     .TableCols, .tablecols{
	   width: 70%;
	}
     .colA {
	    text-align: right;
      }
     .colB {
	    text-align: left;
	}
	.left{
		float: left;
		clear: left;
	}
	.right {
		float: right;
		clear: right;	
	}
	.doc-summary{
		text-align: center;	
	}
     div.quote {
	   font-size: 24px;
	}
	.fullscreen div.tide-inner-container{
		margin-top: 5vh;
	    width: 95vw;
	    height: 90vh;
	    background-color: white;
	    overflow: hidden;
	}
    .fullscreen iframe{
	   
       max-width: 95vw!important;
       width: 95vw!important; /* Full width */
       height: 60%!important;
    }
    .toggle-button{
       display: inline-block;
    }
	
	#tidesWidget{
       width: 100%;
       max-width: 600px;
       height: 150px;
	}
	  .fullscreen {
		  font-size: 1.5em;
	  }
	.lostfound_thumb.landscape{
		height: 10vw;
		width: calc(25% - 10px);
	}
	.lostfound_thumb.portrait{
		height: 20.5vw;
		width: calc(16.6% - 10px);
	}

	.lostfound_thumb.landscape img{
		height: 10vw;
	}

	.lostfound_thumb.portrait img{
		height: 20.5vw;
	}
	.w3-center.mobile-left{
		text-align: center!important;
	}
	.lnrdiv.w100 {
		width: calc(100%);	
	}
	.lnrdiv.w90 {
		width: calc(90%);	
	}
	.lnrdiv.w80 {
		width: calc(80%);		
	}
	.lnrdiv.w70 {
		width: calc(70%);			
	}
	.lnrdiv.w60 {
		width: calc(60%);		
	}
	.lnrdiv.w50 {
		width: calc(50%);		
	}
	.lnrdiv.w45 {
		width: calc(45%);	
	}
	.lnrdiv.w40 {
		width: calc(40%);		
	}
	.lnrdiv.w30 {
		width: calc(30%);		
	}
	.lnrdiv.w20 {
		width: calc(20%);		
	}
}

a {text-decoration: none;}
.orange{color: #ff6600;}
.orangebg{background: #ff6600;}
.black{color: black;}
.blackbg{background: black;}
.blue{color: #33b5e5;}
.bluebg{background: #33b5e5; background-color: #33b5e5!important;}
.dkblue{color: #006699!important;}
.dkbluebg{background-color: #006699; background: #006699;}
.w3-dkblue{background-color: #006699; background: #006699; color: #ffffff!important;}
.grey{color: grey;}
.red{color: red;}
.redbg{background-color: red; background: red;}
.green{color: #459A00;}
.greenbg {background-color: #459A00; background: #459A00;}
.purple {color: purple;}
.purplebg {background: purple;  background: purple;}
.lavender{color: #e8D7Dc;}
.lavenderbg {background: #e8D7Dc;}
.yellow{color: yellow;}
.yellowbg{background: yellow;}
.white{color: white;}
.whitebg{background: white;}
.grnHL{background: #99ff66;}
.ltgrn{color: #99ff66;}
.ltblueHL{background: #66ffff;}
.ltblue{color: #66ffff;}
.pinkHL{background: #ff33cc;}
.pink{color: #ff33cc;}

.Big, .big {font-size: 2em;}
.Small, .small {font-size: 0.8em;}
.Medium, .medium {font-size: 1.2em;}

.weather-container{
	display: inline-block;
	overflow: hidden;
	width: 100%;
	max-width: 300px;
	padding: 0px;
	margin: 0px;
	margin-top: 15px;
	text-align: left;
}
.weather-select-box{
	vertical-align: bottom;
	box-sizing: border-box;
	display: block;
	overflow: hidden;
	position: relative;
	width: 100%;
	max-width: 300px;
	border-bottom: 4px solid #006699;
}

.weather-selecter {
	vertical-align: bottom;
	overflow: hidden;
	text-align: center;
	padding: 0px;
	padding-top:2px;
	margin: 0px;
	display: inline-block;
	border-radius: 6px 6px  0px 0px;
	width: 48%;
	height: 1.7em;
}
.select-label{
	display: block;
	font-size 0.9em;
	line-height: 0.9em;
}
.select-subhead{
	line-height: 0.7em;
	font-size: 0.6em;
	padding-top: 3px;
}
.weathersource{
	color: white;
	background-color: #006699;
}

.weatheralternate{
	color: #006699;
	background-color: white;
	cursor: pointer;
}

		.weatherwidgetbox{
			font-size:1em;
			box-sizing: border-box;
			max-width: 300px;
			width: 100%;
			padding: 0px;
			margin: 0px;
		}
		.weatherwidgetbox p{
			color: grey;
			font-size: 0.7em;
			text-align: center;
			margin-top: 0;
		}
		.current-conditions, .forecast-box {
			display: inline-block;
			width: 66%;
			height: 200px;
			position: relative;
			padding: 0px;
			margin: 0px;
			float:left;
		}
		.choose-period{
			display: inline-block;
			width: 34%;
			height: 200px;
			position: relative;
			padding: 0px;
			margin: 0px;
			font-size: 0.9em;
			line-height: 0.9em;
			float:left;
			border-left: 4px solid #006699;
		}
		.period{
			width: 100%;
			height: 28px;
			display: table;
			padding-left: 3px;
			cursor: pointer;
		}
		.period:hover{
			background-color: #FFFFFF;
		}
		.period p{
			text-align: left;
			color: black;
			font-size: 0.8em;
			display: table-cell; 
			vertical-align: middle; 
		}
		
		.period.selected{
			background-color: #006699;
		}
		.period.selected p{
			color: white;
		}
		.show-text{
			color: #006699;
			display: block;
			width:100%;
			font-size: 0.7em;
			text-align: left;
			text-transform: capitalize;
		}
		.current-icon img{
			width: 100%;
			height: 200px;
		}
		
		.current-temp{
			color: white;
			position: absolute;
			font-size: 3em;
			top: 0;
			left: 7px;
			text-shadow: black 0.1em 0.1em 0.2em;
		}

		.current-temp.night{
			color: #0099cd;
			text-shadow: black 1px 1px 2px;;
		}
		.current-temp.day{
			color: red;
			text-shadow: black 1px 1px 2px;;
		}
		.current-temp.currently{
			color: white;
			text-shadow: black 1px 1px 2px;
		}
		.current-text{
			width: 100%;
			color: #006699;
			position: absolute;
			font-size: 0.8em!important;
			top: 4.5em;
			left: 0px;
			padding: 2px;
			line-height: 0.8em!important;
			text-align: left;
			z-index: 1;
			
		}

		.current-text.night{
			background-color:rgba(255,255,255,0.8);
			text-shadow: white 1px 1px 2px;
		}
		.current-text.day{
			background-color:rgba(255,255,255,0.7);
			text-shadow: white 1px 1px 2px;
		}
		.noaa_credit{
			z-index: 0;
			float: left;
		}
		.zone-forecast a{
			margin: 5px;
			display: inline-block;
			border-radius: 3px;
			padding: 5px;
			font-size: 0.8em;
			color: white;
			background-color: #006699;
		}
ul.indent-0, ol.indent-0{
	margin-left: 0px;
}
ul.indent-1, ol.indent-1{
	margin-left: 40px;	
}
ul.indent-2, ol.indent-2{
	margin-left: 80px;	
}		
ul.disc {
	list-style-type: disc;
}
ul.circle {
	list-style-type: circle;
}
ul.square {
	list-style-type: square;
}
ol.ualpha, ol.alpha {
	list-style-type: upper-alpha;
}
ol.lalpha {
	list-style-type: lower-alpha;
}
ol.uroman {
	list-style-type: upper-roman;
}
ol.lroman {
	list-style-type: lower-roman;
}

ol {
	margin-top:10px;
}
ol li {
	margin-bottom:10px;
}
.Warning{
	z-index: 10000;
    position: fixed;
	padding: 50px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	background-color: red;
	background: rgba(255, 0, 0, 0.95);
	width: 70vw;
	color: white;
} 
.Notification{
	z-index: 10000;
    position: fixed;
	padding: 50px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	background-color: green;
	background: rgba(76, 175, 80, 0.95);
	width: 70vw;
	color: white;
} 
.appDebug{
	z-index: 10000;
    position: fixed;
	padding: 50;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	background-color: red;
	background: rgba(255, 0, 0, 0.95);
	width: 70vw;
	color: white;
}
.padding-left {
	padding-left: 8px;
}
.padding-right {
	padding-right: 8px;
}

  
div.newheader {background-image: url(https://www.lummi-nsn.gov/css/banners/lummisland.jpg);	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/css/banners/lummisland.jpg, sizingMethod='scale');}
@media all and (max-width: 600px) {div.newheader {background-image: url(https://www.lummi-nsn.gov/css/banners/lummisland_sm.jpg);}
@media all and (min-width: 600px) {div.newheader {background-image: url(https://www.lummi-nsn.gov/css/banners/lummisland_med.jpg);}
@media only screen and (min-width: 993px) {div.newheader {background-image: url(https://www.lummi-nsn.gov/css/banners/lummisland.jpg);}