/*		@font-face {
		    font-family: "BPreplay";
		    src: url("../fonts/bpreplay-webfont.eot");
		    src: url("../fonts/bpreplay-webfont.eot?#iefix") format("embedded-opentype"),
		         url("../fonts/bpreplay-webfont.woff2") format("woff2"),
		         url("../fonts/bpreplay-webfont.woff") format("woff"),
		         url("../fonts/bpreplay-webfont.ttf") format("truetype"),
		         url("../fonts/bpreplay-webfont.svg#bpreplayregular") format("svg");
		    font-weight: normal;
		    font-style: normal;
		}

		@font-face {
		    font-family: "BPreplayBold";
		    src: url("../fonts/bpreplaybold-webfont.eot");
		    src: url("../fonts/bpreplaybold-webfont.eot?#iefix") format("embedded-opentype"),
		         url("../fonts/bpreplaybold-webfont.woff2") format("woff2"),
		         url("../fonts/bpreplaybold-webfont.woff") format("woff"),
		         url("../fonts/bpreplaybold-webfont.ttf") format("truetype"),
		         url("../fonts/bpreplaybold-webfont.svg#bpreplaybold") format("svg");
		    font-weight: normal;
		    font-style: normal;
		}

		@font-face {
		    font-family: "BPreplayBoldItalics";
		    src: url("../fonts/bpreplaybolditalics-webfont.eot");
		    src: url("../fonts/bpreplaybolditalics-webfont.eot?#iefix") format("embedded-opentype"),
		         url("../fonts/bpreplaybolditalics-webfont.woff2") format("woff2"),
		         url("../fonts/bpreplaybolditalics-webfont.woff") format("woff"),
		         url("../fonts/bpreplaybolditalics-webfont.ttf") format("truetype"),
		         url("../fonts/bpreplaybolditalics-webfont.svg#bpreplaybold_italic") format("svg");
		    font-weight: normal;
		    font-style: normal;
		}

		@font-face {
		    font-family: "BPreplayItalics";
		    src: url("../fonts/bpreplayitalics-webfont.eot");
		    src: url("../fonts/bpreplayitalics-webfont.eot?#iefix") format("embedded-opentype"),
		         url("../fonts/bpreplayitalics-webfont.woff2") format("woff2"),
		         url("../fonts/bpreplayitalics-webfont.woff") format("woff"),
		         url("../fonts/bpreplayitalics-webfont.ttf") format("truetype"),
		         url("../fonts/bpreplayitalics-webfont.svg#bpreplayitalic") format("svg");
		    font-weight: normal;
		    font-style: normal;
		}*/

	  	/*reset css*/

		html, body, div, span, applet, object, iframe,
		h1, h2, h3, h4, h5, h6, p, blockquote, pre,
		a, abbr, acronym, address, big, cite, code,
		del, dfn, em, img, ins, kbd, q, s, samp,
		small, strike, strong, sub, sup, tt, var,
		b, u, i, center,
		dl, dt, dd, ol, ul, li,
		fieldset, form, label, legend,
		table, caption, tbody, tfoot, thead, tr, th, td,
		article, aside, canvas, details, embed, 
		figure, figcaption, footer, header, hgroup, 
		menu, nav, output, ruby, section, summary,
		time, mark, audio, video {				
			margin: 0;
			padding: 0;
			border: 0;
			font-size: 100%;
			font: inherit;
			vertical-align: baseline;
			/*font-family: "BPreplay", sans-serif !important;*/
			/*font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif; */
			font-family: Helvetica,Arial,sans-serif; 
		}
		/* HTML5 display-role reset for older browsers */
		article, aside, details, figcaption, figure, 
		footer, header, hgroup, menu, nav, section {
			display: block;
		}
		body {
			line-height: 1;
		}
		ol, ul {
			list-style: none;
		}
		blockquote, q {
			quotes: none;
		}
		blockquote:before, blockquote:after,
		q:before, q:after {
			content: "";
			content: none;
		}
		table {
			border-collapse: collapse;
			border-spacing: 0;
		}
		html, body {
			width: 100%;
			height: 100%;
		}

		/*css reset*/

		body {
			background: #ccc;
		}

		.backgroundGradient {
			background: #666666 no-repeat fixed; /* Old browsers */
			background: -moz-linear-gradient(-45deg, #666666 0%, #333333 100%) no-repeat fixed; /* FF3.6-15 */
			background: -webkit-linear-gradient(-45deg, #666666 0%,#333333 100%) no-repeat fixed; /* Chrome10-25,Safari5.1-6 */
			background: linear-gradient(135deg, #666666 0%,#333333 100%) no-repeat fixed; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#666666', endColorstr='#333333',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
		}

		.link {
			text-decoration: underline;
			cursor: pointer;
		}

		.link:hover {
			color: #000;
		}

		.LoginContainer {
			position: absolute;
			top: 50%;
			left: 50%;
			width: 400px;
			height: 400px;
			margin-left: -200px;
			margin-top: -200px;
			background: #636363;
			color: #fff;
			z-index: 3;
			padding: 20px;
			box-sizing: border-box;
		}

		.containerBackButton {
			float: left;
   			width: 100%;
    		text-align: left;
    		color: #fff !important;
    		text-decoration: none;
		}

		input, button, select, textarea {
			-webkit-appearance: none;
			-moz-appearance: none;
			appearance: none;
			width: 100%;
			height: 40px;
			line-height: 38px;
			display: block;
			box-sizing: border-box;
			/*font-family: "BPreplay", sans-serif !important;*/
			border: 1px solid #444;			
			margin-bottom: 10px;
			background-color: #fff;
			font-size: 16px;
			padding: 0;
			margin: 0;
			border-radius: 0 6px 6px 6px;
			margin-bottom: 15px;			
		}

		input, select, textarea {
			box-shadow: inset 2px 2px 0px rgba(0,0,0,0.25);
			padding-left: 10px;
			max-width: 700px;
		}

		textarea {
			resize: none;
			min-height: 130px;
			line-height: 1.3;
			padding: 10px;
		}

		.charCounterWrapper {
			position: relative;
			margin-bottom: 40px;
		}

		.charCounter {
			background: #444;
			padding: 5px 10px;
			border-radius: 0 0 4px 4px;
			display: inline-block;
			position: absolute;
			color: #fff;
			font-size: 12px;
			bottom: -22px;
			right: 0;
		}	

		.hasCharCounter {
			border-radius: 0 6px 0 6px;
		}

		input:focus, select:focus {
		    background-color: #ffff88;
		}

		input[type='checkbox']{
			border: 0;
			box-shadow: none;
			display: inline-block;
			width: auto;
			position: absolute;
			left: 5px;
    		top: -5px;
		}

		.zeroMargin {
			margin: 0;
		}

		.inlineWithLabelsMargin {
			margin-top: 22px;
		}

		label {
			background: #444;
			padding: 5px 10px;
			border-radius: 4px 4px 0 0;
			display: inline-block;
			color: #fff;
			font-size: 12px;
		}

		.altLabel {
			background: #1F71B8;
		}

		select {
			background: #fff url(../img/icon/dropdownarrow.svg) no-repeat;
			background-size: 12px;
			background-position: right 14px center;
		}	

		button {
			background-color: #a7a7a7;			
			border-radius: 6px;
			color: #000;
			font-weight: bold;
			text-align: center;
			border: 1px solid rgba(0,0,0,0.4);
   			border-bottom: 2px solid rgba(0,0,0,0.5);
   			width: auto;
    		padding: 0 15px;
		}

		button:hover {
			color: #fff;
			background-color: #000000;
			border: 1px solid #000;
		}

		.button-red {
			background-color: #FF616E;
		}

		.button-yellow {
			background-color: #FFC033;
		}

		.button-green {
			background-color: #74DE4A;
		}

		.button-blue {
			background-color: #80B2F2;   			
		}

		.disabledButton {
			/*pointer-events: none;*/
			color: rgba(0,0,0,0.2);
			border: 1px solid rgba(0,0,0,0.1);
   			border-bottom: 2px solid rgba(0,0,0,0.2);
		}

		.disabledRow {
			background-color: #ccc;
		}

		.button-inline {
			display: inline-block;
			margin-right: 6px;
		}

		.commentBoxes {
			border: 1px solid #444;
			background: #ddd;
			border-radius: 0 6px 6px 6px;
			margin-bottom: 15px;
			padding: 10px;
			font-family: arial;
		}		

		.inputNoLabel {
			border-radius: 6px;
		}

		.cardContainer {
			background: #eaeaea;
			/*background: #fff;*/
			padding: 20px;			
			box-sizing: border-box;
			border-radius: 8px;
		    box-shadow: 2px 2px 0px rgba(0,0,0,0.25);
			/*overflow: hidden;*/
			/*backface-visibility: hidden;*/
			display: inline-block;
			position: relative;
			margin-bottom: 20px;
			width: 100%;			
		}

		.noSelect {
		  -webkit-touch-callout: none; /* iOS Safari */
		    -webkit-user-select: none; /* Safari */ /* Konqueror HTML */
		       -moz-user-select: none; /* Firefox */
		        -ms-user-select: none; /* Internet Explorer/Edge */
		            user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
		}

	  	.headerBar {
	  		background-color: blue;
	  		width: 100%;
	  		height: 60px;
	  		float: left;
	  	}

	  	.sideBar {
	  		width: 250px;	  		
    		min-height: 100%;
	  		float: left;
	  		box-sizing: border-box;
	  		display: inline-block;
	  		position: relative;
	  		color: #fff;
	  		padding-bottom: 60px;
	  		background-color: #333;
	  	}

	  	.sideBarSubHeading {
			padding: 10px;
			font-size: 14px;
			/*font-family: "BPreplayBold", sans-serif;*/
	  	}

	  	.sideBarFooter {
	  		position: fixed;
	  		bottom: 0;
	  		left: 0;
	  		width: 250px;
	  		height: 56px;
	  		background-color: #000;
	  	}

	  	.sideFooterBtn {
		    width: 50%;
		    height: 100%;
	    	box-sizing: border-box;
	    	text-align: center;
	    	display: inline-block;
	    	float: left;
	    	border-right: 1px solid #fff;
	    	font-size: 13px;
	  	}

	  	.sideFooterBtn:last-child {
	  		border-right: none;
	  	}

	  	.sideFooterBtn:hover {
	  		background-color: #999;
	  	}

	  	.logoutBtn:hover {
	  		background-color: #e74c3c;
	  	}

	  	.sideFooterIcon {
	  		position: relative;
	  		margin: 8px auto ;
	    	width: 16px;
	    	height: 16px;    	
	  	}

	  	.sideFooterIcon img{
	  		width: 100%;
	  		height: 100%;
	  	}

	  	.mainAreaWrapper {
	  		position: absolute;
	  		box-sizing: border-box;
	  		top: 0;
	  		left: 0;
	  		width: 100%;
	  		min-height: 100%;
	  		padding-left: 250px;
	  	}

	  	.contentHeadline {
			width: 100%;
			line-height: 1.3;
			font-size: 20px;
			background-color: #000000;
			padding: 10px 20px;
			box-sizing: border-box;
			color: #ffffff;
	  	}

	  	.breadcrumbParent {
	  		color: rgba(255,255,255,0.6);
	  	}

	  	.breadcrumbCurrent {
	  		color: #ffffff;
	  	}

	  	.contentPanel {
	  		height: 100%;
	  		width: 100%;
	  		box-sizing: border-box;
	  		background-color: #ccc;
		    padding: 20px;
		    display: none;
		    position: relative;
	        min-height: 300px;
	  	}

	  	.contentTabBtn {
			color: #000;
			height: 35px;
			line-height: 35px;
			padding: 0 10px;
			background: #A7A7A7;
			display: inline-block;
			margin: 5px 0px 0px 10px;
			border-radius: 6px 6px 0 0;			    
    		box-sizing: border-box;
    		border-bottom: 3px solid rgba(0,0,0,0.15);
	  	}

	  	.contentTabBtn:hover {
	  		background-color: #ccc;
	  	}

	  	.reportTabBtn {
			color: #fff;
			height: 35px;
			line-height: 35px;
			padding: 0 10px;
			background: #4485d6;
			display: inline-block;
			float: right;
			margin: 5px 10px 0px 10px;
			border-radius: 6px 6px 0 0;			    
    		box-sizing: border-box;
    		border-bottom: 3px solid rgba(0,0,0,0.15);
	  	}

	  	.reportTabBtn:hover {
	  		background-color: #000;
	  	}

	  	.activeTabBtn {
	  		background: #ccc;
	  		border-bottom: none;
	  	}

	  	.credentialsSection {
			font-size: 13px;
			box-sizing: border-box;
			width: 100%;
			height: 60px;
			padding-left: 60px;
			padding-top: 10px;
			position: relative;
			background-color: #272727;
	  	}

		.userAvatar {
			position: absolute;
			left: 10px;
		    width: 40px;
	    	height: 40px;
	    	border-radius: 100%;
	    	overflow: hidden;
	    	-webkit-backface-visibility: hidden; /* Chrome, Safari, Opera */
	    	backface-visibility: hidden;
		}

		.userAvatar img {
			width: 100%;
			height: 100%;
		}

		.userOrg {
		    padding-top: 5px;
			width: 100%;
			height: 13px;
			word-break: break-all;
			overflow: hidden;
		}

		.userName {
			width: 100%;
			height: 40px;
			word-break: break-all;
			overflow: hidden;
			line-height: 40px;
		}

	  	.menuListTop {
	  		color: #fff;
	  		height: auto;
	  		cursor: pointer;
	  	}

	  	.menuListTop li {		
			font-size: 16px;
			box-sizing: border-box;
	  	}

	  	.topLevelItemWrapper {
	  		height: 40px;  		
	  		padding-left: 40px;
	  		line-height: 40px;
			position: relative;
			box-sizing: border-box;
	  	}

	  	.topLevelItemWrapper:hover, .activeSection {
	  		background-color: #1F71B8;
	  	}
	  	
	  	.menuListIcon {
	  		width: 18px;
	  		height: 18px;
	  		position: absolute;
	  		top: 11px;
	  		left: 11px;
	  	}

	  	.menuListIcon img {
	  		fill: #fff;
	  		position: absolute;
	  		width: 100%;
	  		top: 0;
	  		left: 0;
	  		right: 0;
	  		bottom: 0;  		
	  	}

	  	.subMenu {
	  		display: none;
	  	}

	  	.subMenu li {
	  		color: #fff;
	  		font-size: 13px;
	  		padding-left: 40px;
	  		/*padding-right: 10px;*/
	  		line-height: 18px;
	  		border-top: 1px solid #585858;
	  		margin-bottom: 4px;
			padding-top: 4px;
	  	}

	  	.subMenu li:hover {
	  		color: #fff;
	  	}


	  	.subMenuChild li {
	  		padding-left: 13px;
	  	}

	  	.liArrow {
	  		width: 8px;
	  		height: 8px;
	  		pointer-events: none;
	  	}

	  	.logoHeader {
	  		width: 100%;
	  		height: auto;
	  		text-align: center;
	  		margin-bottom: 20px;
	  	}

	  	.logoHeader img {
	  		margin: 20px auto 5px auto;
	  		width: 60%;  		
	  	}

	  	.logoHeaderTxt {
	  		color: #999;
	  		font-size: 15px;
	  		/*font-family: "BPreplayBold", sans-serif;*/
	  	}

	  	.productSection {  		
	  		/*height: 702px;*/
	  	}

	  	.productSelectorWrapper {
	  		padding: 10px;
	  		margin-bottom: 10px;
	  	}

	  	.productSectionHeader {
	  		background: #fff;  		
	  		margin-top: 1px;
  		    padding: 30px 20px;
	        padding-right: 80px;		
	  		position: relative;	  
  		    display: table;
    		width: 100%;	
    		box-sizing: border-box;
	  	}

	  	.productSectionHeaderTitle {
	  		color: #000;
	  		text-align: left;
	  		display: table-cell;
	  		width: 100%;
    		vertical-align: middle;    		
	  	}

	  	.productSectionHeader img {
		    height: 60px;
		    width: 60px;
		    position: absolute;
		    right: 15px;
		    top: 50%;
		    margin-top: -30px;
	  	}  

	  	.productSectionControls {
	  		display: none;
	  	}

	  	.opened {
	  		-webkit-transform: rotate(90deg);
	  		        transform: rotate(90deg);
	  	}

	  	.subSectionActive {
	  		background-color: #444;
	  	}  




	  	#previewIFrame {
	  		border: 2px solid black;
	  		box-sizing: border-box;
	  		width: 100%; 
	  		height: 720px; 
	  		background: #ffffff;
	  	}

	  	#currentStatus {
	    	width: 100%;
	    	background-color: #777;
	    	color: #fff;
	    	margin-bottom: 20px;
	    	border-radius: 40px 8px 8px 40px;	    	
	  	}

	  	#currentStatus .statusIcon_active, #currentStatus .statusIcon_disabled, #currentStatus .statusIcon_pending, #currentStatus .statusIcon_undefined {
	  		width: 40px;
    		height: 40px;
    		border-width: 4px;
    		margin-right: 10px;
    		float: left;
	  	}

	  	.pendingArticles, .activeArticles {
			color: #000;
			border-radius: 20px;
			padding: 0 3px;
			height: 12px;
			line-height: 12px;
			font-size: 10px;
			background: #fff;
			display: inline-block;
			text-align: center;
			margin-right: 3px;
	  	}

	  	.pendingArticles {
	  		background: #fb0;
	  	}

	  	.activeArticles {
	  		background: #0f0;
	  	}

	  	.articleStatus {
			line-height: 40px;
			height: 40px;
			margin: 0;
			padding: 0;
			display: inline-block;
			float: left;
	  	}

	  	.previewCol {

	  		display: inline-block;
	  		width: 100%;
	  		max-width: 620px;
	  		min-width: 240px;
	  		box-sizing: border-box;
	  		float: left;
	  		padding: 10px;	  

	  	}

	  	.col1 {
	  		display: inline-block;
	  		width: 100%;
	  		box-sizing: border-box;
	  		float: left;
	  		padding: 10px;
	  		position: relative;
	  	}


	  	.col2 {
	  		display: inline-block;
	  		width: 50%;
	  		box-sizing: border-box;
	  		float: left;
	  		padding: 10px;	  	
	  		position: relative;	
	  	}

	  	.col3 {
	  		display: inline-block;
	  		width: 33.333%;
	  		box-sizing: border-box;
	  		float: left;
	  		padding: 10px;
	  		position: relative;
	  	}

	  	.col4 {
	  		display: inline-block;
	  		width: 25%;
	  		box-sizing: border-box;
	  		float: left;
	  		padding: 10px;
	  		position: relative;
	  	}

	  	.col5 {
	  		display: inline-block;
	  		width: 20%;
	  		box-sizing: border-box;
	  		float: left;
	  		padding: 10px;
	  		position: relative;
	  	}

	  	.col6 {
	  		display: inline-block;
	  		width: 16.66%;
	  		box-sizing: border-box;
	  		float: left;
	  		padding: 10px;
	  		position: relative;
	  	}

		.col7 {
	  		display: inline-block;
	  		width: 14.28%;
	  		box-sizing: border-box;
	  		float: left;
	  		padding: 10px;
	  		position: relative;
	  	}

	  	.cardTitle {
			position: absolute;
			width: 100%;
			box-sizing: border-box;
			top: 0;
			left: 0;
			background: #585858;
			color: #fff;
			padding: 10px 20px;
			border-radius: 8px 8px 0 0;
		}

		.cardContainerWithTitle {
			padding-top: 56px;
		}

		.cardContainerWithGraph {
			padding: 70px 30px 130px 30px;
			background: #fff;
		}

		.cardContainerFlatBottom {
			margin-bottom: 0;
    		border-radius: 8px 8px 0 0;
		}

		.cardContainerRightSide {
			margin: 0;
			border-radius: 0 8px 8px 0;
			width: 150px;
			height: 700px;
			float: right;
			z-index: 3;
			border-left: 1px solid #555;
			box-sizing: border-box;
		}

		.filterContainer {
			padding: 0;
			padding-top: 35px;
			margin: 0;
		}

		.filterInput {
			margin: 0;
		}

		.dataSliderVertical {
/*			-webkit-appearance: slider-vertical;
			-moz-appearance: slider-vertical;
			appearance: slider-vertical;
			box-shadow: none;
			height: 100%;
			width: 20px;
			padding: 0;
			margin: 0;
			position: relative;
			z-index: 8;*/
			-webkit-appearance: slider-vertical;
		    -moz-appearance: slider-vertical;
		    appearance: slider-vertical;
		    box-shadow: none;
		    height: 678px;
		    width: 20px;
		    padding: 0;
		    margin: 0;
		    margin-top: -10px;
		    position: relative;
		    z-index: 8;
		}

		.sliderLabelWrapper {
			/*height: 100px;*/
		    /*width: 100px;*/
		    position: absolute;
		    right: 8px;
		    top: 8px;
		    z-index: 4;		    
		}

		.sliderLabel {
			font-weight: normal;
			font-size: 13px;
			width: 100px;
			height: 20px;
			line-height: 20px;
			position: absolute;
			top: 0;
			left: 30px;
			padding-left: 20px;
			margin-top: -10px;
			
		}

		.sliderNotch {
			width: 15px;
			height: 2px;
			background-color: #666;
			position: absolute;
			left: 0;
			top: 9px;
		}

		.sliderLabelActive {
			color: #fff;
			background-color: #1F71B8;
		}

		#statsHeatMap, #singleArticleChoroplethMap {
			width: 100%;
			height: 100%;
			border-radius: 8px;
			box-shadow: 2px 2px 0px rgba(0,0,0,0.25);
			float: left;
			z-index: 2;
		}

		.spinnerWrapper {
			position: relative;
			width: 100%;
			height: 200px;
		}

		.spinner {
		  position: absolute;
		  left: 50%;
		  top: 50%;
		  z-index: 1;
		  width: 60px;
		  height: 60px;
		  margin: -30px 0 0 -30px;
		  border: 16px solid #f3f3f3;
		  border-radius: 50%;
		  border-top: 16px solid #1F71B8;
		  border-bottom: 16px solid #1F71B8;
		  width: 60px;
		  height: 60px;
		  -webkit-animation: spin 2s linear infinite;
		  animation: spin 2s linear infinite;
		  box-sizing: border-box;
		}

		@-webkit-keyframes spin {
		  0% { -webkit-transform: rotate(0deg); }
		  100% { -webkit-transform: rotate(360deg); }
		}

		@keyframes spin {
		  0% { transform: rotate(0deg); }
		  100% { transform: rotate(360deg); }
		}

	  	/*column max min modifiers*/

	  	.mm620 {
	  		width: 620px;
	  	}

	  	.mm300-620 {
	  		min-width: 300px;
    		max-width: 620px;
	  	}

		.clearFix:after {
			content: "";
			display: table;
			clear: both;
		}

		.toggleStatusWrapper, .chooseStatusWrapper {
	  		display: none;
	  	}

	  	.particleWrapper {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			overflow: hidden;

			background: #666666 no-repeat fixed; /* Old browsers */
			background: -moz-linear-gradient(-45deg, #666666 0%, #333333 100%) no-repeat fixed; /* FF3.6-15 */
			background: -webkit-linear-gradient(-45deg, #666666 0%,#333333 100%) no-repeat fixed; /* Chrome10-25,Safari5.1-6 */
			background: linear-gradient(135deg, #666666 0%,#333333 100%) no-repeat fixed; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#666666', endColorstr='#333333',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
		}

	 	.particles{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;		
			z-index: 1;
		}
		
		.particles li{
			position: absolute;
			list-style: none;
			display: block;
			width: 40px;
			height: 40px;
			background-color: rgba(255,255,255,0.15);
			bottom: -160px;					
			-webkit-animation: square 25s infinite;					
			        animation: square 25s infinite;					
			-webkit-transition-timing-function: linear;					
			        transition-timing-function: linear;
		}
			
		.particles li:nth-child(1){
			left: 10%;
		}
		
		.particles li:nth-child(2){
			left: 20%;				
			width: 80px;
			height: 80px;				
			-webkit-animation-delay: 2s;				
			        animation-delay: 2s;
			-webkit-animation-duration: 17s;
			        animation-duration: 17s;
		}
		
		.particles li:nth-child(3){
			left: 25%;
			-webkit-animation-delay: 4s;
			        animation-delay: 4s;
		}
		
		.particles li:nth-child(4){
			left: 40%;
			width: 60px;
			height: 60px;				
			-webkit-animation-duration: 22s;				
			        animation-duration: 22s;				
			background-color: rgba(255,255,255,0.25);
		}
		
		.particles li:nth-child(5){
			left: 70%;
		}
		
		.particles li:nth-child(6){
			left: 80%;
			width: 120px;
			height: 120px;				
			-webkit-animation-delay: 3s;				
			        animation-delay: 3s;
			background-color: rgba(255,255,255,0.20);
		}
		
		.particles li:nth-child(7){
			left: 32%;
			width: 160px;
			height: 160px;				
			-webkit-animation-delay: 7s;				
			        animation-delay: 7s;
		}
		
		.particles li:nth-child(8){
			left: 55%;
			width: 20px;
			height: 20px;
			
			-webkit-animation-delay: 15s;
			
			        animation-delay: 15s;
			-webkit-animation-duration: 40s;
			        animation-duration: 40s;
		}
		
		.particles li:nth-child(9){
			left: 25%;
			width: 10px;
			height: 10px;				
			-webkit-animation-delay: 2s;				
			        animation-delay: 2s;
			-webkit-animation-duration: 40s;
			        animation-duration: 40s;
			background-color: rgba(255,255,255,0.3);
		}
		
		.particles li:nth-child(10){
			left: 90%;
			width: 160px;
			height: 160px;				
			-webkit-animation-delay: 11s;				
			        animation-delay: 11s;
		}

		@-webkit-keyframes square {

			0%   { -webkit-transform: translateY(0); transform: translateY(0); }

			100% { -webkit-transform: translateY(-1400px) rotate(600deg); transform: translateY(-1400px) rotate(600deg); }

		}

		@keyframes square {

			0%   { -webkit-transform: translateY(0); transform: translateY(0); }

			100% { -webkit-transform: translateY(-1400px) rotate(600deg); transform: translateY(-1400px) rotate(600deg); }

		}

		.statusIcon_active {
			width: 10px;
			height: 10px;
		    border-radius: 200px;
			background-color: #0f0;
			display: inline-block;
			margin-right: 6px;
			box-sizing: border-box;
			border: 2px solid rgba(0,0,0,0.25);

		}

		.statusIcon_disabled {
			width: 10px;
			height: 10px;
		    border-radius: 200px;
			background-color: #f00;
			display: inline-block;
			margin-right: 6px;
			box-sizing: border-box;
			border: 2px solid rgba(0,0,0,0.25);
		}

		.statusIcon_pending {
			width: 10px;
			height: 10px;
		    border-radius: 200px;
			background-color: #fb0;
			display: inline-block;
			margin-right: 6px;
			box-sizing: border-box;
			border: 2px solid rgba(0,0,0,0.25);
		}

		.statusIcon_undefined {
			width: 10px;
			height: 10px;
		    border-radius: 200px;
			background-color: #666;
			/*display: inline-block;*/
			margin-right: 6px;
			display: none;
			box-sizing: border-box;
			border: 2px solid rgba(0,0,0,0.25);
		}

		.statusIcon_pendingWarning {
			width: 10px;
			height: 10px;   	
			display: inline-block;
			margin-right: 6px;
			box-sizing: border-box;
			background: url(../img/icon/warningYellow.svg) no-repeat;	
		}

		#editorIFrame{
			width: 100%;
			height: 800px;
		}

		#catchContentEditor{
			display: none;
		}

		.displayNone{
			display: none !important;
		}

		.table{
	        display: table;
	        margin: auto;
   			width: 100%;
   			margin-bottom: 10px;
			border-radius: 8px;
			overflow: hidden;
			border: 1px solid #555;
			border-collapse: collapse;
			box-shadow: 2px 2px 0px rgba(0,0,0,0.25);
	    }

	    .tableTitle{
	        display: table-caption;
	        text-align: center;
	        font-weight: bold;
	        font-size: larger;
	    }

	    .tableHeading{
	        display: table-row;
	        font-weight: bold;
	        text-align: center;
	        background-color: #666;
	        color: #fff;
	    }

	    .tableRow{
	        display: table-row;
	        background-color: #ddd;
	        border: solid 1px #555;
	    }

	    .tableRow:nth-child(even) {
	    	background-color: #eee;
	    }

	    .tableCell{
			display: table-cell;
			border-right: solid 1px #555;
			font-size: 15px;
			padding: 10px;
			vertical-align: top;
	    }

	    .tableCellUnpadded {
	    	padding: 0px;
	    }

	    .timelineDateMilestone {
			background-color: #F3EBB6 !important;
		}		

	    .miniTable {
			position: absolute;
			bottom: 0;
			left: 0;
			z-index: 4;
			background: #eaeaea;
			border-radius: 0 8px 0 8px;
			border-top: 1px solid #555;
			border-right: 1px solid #555;
	    }

	    .miniTableCell {
	    	font-size: 12px;
	    	border-bottom: 1px solid #555;
	    	padding: 4px;
	    }

	    .miniTableCell:last-child {
	    	border-bottom: none;
	    }

	    .miniTableCell span {
	    	float: right;
	    	margin-left: 10px;
	    }

	    #mainChart {
	    	margin-bottom: 40px;
	    }

	    .mapWrapper {
	    	position: relative;
	    	width: 100%;
    		height: 700px;
	    }

	    .filtersWrapper {
			position: absolute;
			top: 8px;
			left: 8px;
			z-index: 4;
	    }

	    .filterSection {
	    	margin-bottom: 5px;
	    }

	    .filterSectionInline {
	    	display: inline-block;
	    }

	    .filterBtn {
			height: 36px;
			line-height: 34px;
			display: block;
			box-sizing: border-box;
			border: 1px solid rgba(0,0,0,0.4);
			background-color: #585858;
			color: #fff;
			font-size: 12px;
			margin: 0;
			border-radius: 0px;
			border-bottom: 2px solid rgba(0,0,0,0.5);
			font-weight: bold;
			text-align: center;
			float: left;
			padding: 0 10px;
			border-right: none;
	    }

	    .filterBtn:first-child {
	    	border-radius: 6px 0 0 6px;
	    }

	    .filterBtn:last-child {
	    	border-radius: 0 6px 6px 0;
	    	border-right: 1px solid rgba(0,0,0,0.4);
	    }

	    .filterBtnSingle {
	    	border-radius: 6px !important;
    		border-right: 1px solid rgba(0,0,0,0.4) !important;
	    }

	    .filterBtnActive, .dateFilterActive, .ageTriggerActive{
	    	background-color: #4485d6;
	    }

	    .dateFilter, .dateFilter:first-child , .dateFilter:last-child {
	    	border-radius: 0px;
	    	float: none;
	    	clear: both;
	    	width: 100%;
	    	margin-bottom: 0px;
	    	border: 1px solid rgba(0,0,0,0.4);
	    	border-right: 1px solid rgba(0,0,0,0.4);
	    	border-bottom: none;	    	
	    }

	    .dateFilter:first-child {
	    	border-radius: 6px 6px 0 0;
	    }

	    .dateFilter:last-child {
	    	border-radius: 0 0 6px 6px;
	    	border-bottom: 2px solid rgba(0,0,0,0.5);
	    }


	    .filterBtn:hover {
	    	background-color: #000;
	    	border-top: 1px solid rgba(0,0,0,0.4);
	    }

		.editorTabsData{
			display: none;
		}

		.inlineInput {
			float: left;
			width: 80px;
			margin-left: 10px;
			height: 36px;
			line-height: 34px;
			margin-bottom: 0;
		}

		.inlineFilterGroup {
			float: left;
		}

		.inlineFilterGroupMargin {
			float: left;
			margin-left: 10px;
		}

		.allScreens{
			display: none;
		}

		#usersScreen{
			background-color: #c1c1c1;
			width: 100%;
			height: 100%;
		}

		.floatRight {
			float: right;
		}

		.floatLeft {
			float: left;
		}

		.emptySectionShield {
			position: absolute;
			width: calc(100% - 250px);
			height: 100%;
			z-index: 999;

			background: #666666 no-repeat fixed; /* Old browsers */
			background: -moz-linear-gradient(-45deg, #666666 0%, #333333 100%) no-repeat fixed; /* FF3.6-15 */
			background: -webkit-linear-gradient(-45deg, #666666 0%,#333333 100%) no-repeat fixed; /* Chrome10-25,Safari5.1-6 */
			background: linear-gradient(135deg, #666666 0%,#333333 100%) no-repeat fixed; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#666666', endColorstr='#333333',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
		}

		.tabMessageOverlay {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			z-index: 666;
			background: rgba(0,0,0,0.4);
		}

		.centralMessageBubble {
			position: absolute;
			width: 400px;
			min-height: 50px;
			margin-left: -200px;
			margin-top: -50px;
			padding: 20px 20px;
			text-align: center;
			top: 50%;
			left: 50%;
		}

		.helpMessage {
			padding: 14px;
			width: 100%;
			font-size: 14px;
		    float: left;
    		margin: 10px 0;
    		font-family: Arial;
		}

		.centralMessageBubble, .helpMessage, .notificationSlider {
			border-radius: 8px;
			box-sizing: border-box;
			color: #4A460D;
    		background-color: #F3EBB6;
   			border: 1px solid rgba(0,0,0,0.4);
		}

		.notificationSlider {

			font-size: 14px;
    		font-family: Arial;
			position: fixed;
			width: 300px;
			text-align: center;
			padding: 20px 20px;
			text-align: center;
			bottom: -100px;
			left: 50%;
			margin-left: -150px;
			z-index: 666666;		

		}

		.notificationGreen {
			color: #105B13;
			background: #b9ffbb;
		}

		.notificationRed {
			color: #450C0C;
			background: #ff8f8f;
		}

		.articleLink {
			text-decoration: underline;
			color: #195B94;
		}



/*		#singleArticleChoroplethMap{
			width: 700px;
			height: 600px;
			margin-top: 20px;
			margin-left: 150px;
			position: absolute;
		}

		#singleArticleChoroplethMapDateSlider{
			width: 350px;
		    height: 55px;
		    top: 50%;
		    left: 50%;
		    margin-top: 200px;
		    margin-left: 150px;
		    position: absolute;
		}

		#singleArticleChoroplethMapMonthLabel{
		    top: 35%;
		    left: 50%;
		    margin-top: 370px;
		    margin-left: 290px;
		    position: absolute;
		}

		#statsHeatMap{
			height: 500px;
			width: 500px;
		}*/

		.mapboxgl-popup-close-button{
			display: none;
		}

		.scrollList {
			overflow-y: scroll;
    		height: 480px;
		}

		.scrollListItem {
		    padding: 10px;
		    position: relative;
		    padding-left: 32px;
		    border-bottom: 1px solid #ddd;
		    box-sizing: border-box;
		}

		.popupPanel {
			position: fixed;
			top: 50%;
			left: 50%;
			width: 600px;
		    height: 710px;
    		margin-top: -360px;
			margin-left: -300px;
		}

		.popupPanelExpander{
			height: 100%;
			width: 100%;
			margin: 0;
		}

		.popupPanelWrapper {
			background-color: rgba(0,0,0,0.7);
			position: fixed;
			left: 0;
			right: 0;
			top: 0;
			bottom: 0;
			z-index: 999999;
			display: none;
		}		

/*		.stickyHeader {
			position: fixed;
			top: 0;
			width: 100%;
		}*/
		
/*		.scrollListItem:nth-child(even) {
	    	background-color: #ddd;
	    }*/

		.filterInput {
			width: 59%;
			display: inline-block;
		}

		.uncheckBtn {
			width: 40%;
			display: inline-block;
		}

		#generate_url_wrapper{
			clear: both;
		}

		.generate_url_checkbox{
			-webkit-appearance: radio;
		}

		#sendArticleToProductionContainer{
			display: none;
		}

		.remoteNotificationAgeRangeSelectionWrapper {
			display: block;
			width: 100%;
			float: left;
		}

		.inputDisabled{
			background-color: transparent;
			box-shadow: none;
			border: 1px solid rgba(0,0,0,0.2);			
		}

		.notificationListText {
		    width: 280px;
    		height: 140px;
		}

		.inputDisabled:focus {
			background-color: #ffff88;
			outline: none;
			border: 1px solid #444;	
			box-shadow: inset 2px 2px 0px rgba(0,0,0,0.25);
		}

		.loadingCentered {
			width: 64px;
			height: 64px;
			position: absolute;
			top: 50%;
			left: 50%;
			margin-top: -32px;
			margin-left: -32px;
		}

		.triggerInputSmall {
			width: 70px;
		}

		/*dropdown menu classes*/

		.dropdownWrapper {
			position: relative;
		}

		.dropdown {		
			position: absolute;
			left: 2px;
			top: 2px;
		}

		.dropdown ul {
			padding: 0;
		  	margin: 0;
			list-style: none;
			/* 	position: relative; */
		 	border-radius: 6px;
		  	z-index: 999999;
		}
			
		.dropdown ul li {
			display:inline-block;
			/*background-color: #888;*/
			text-decoration:none;
			height: 36px;
			line-height: 34px;
			/*display: block;*/
			box-sizing: border-box;
			border: 1px solid rgba(0,0,0,0.4);
			background-color: #585858;
			color: #fff;
			font-size: 12px;
			margin: 0;
			border-radius: 0px;
			border-bottom: 2px solid rgba(0,0,0,0.5);
			font-weight: bold;
			text-align: left;
			float: left;
			padding: 0 10px;
			border-bottom: none;
		}

		.dropdown ul li:first-child {
	    	border-radius: 0 6px 0 0;
	    }

	    .dropdown ul li:last-child {
	    	border-radius: 0 0 6px 6px;
	    	border-bottom: 2px solid rgba(0,0,0,0.5);
	    }

	    .dropdownBtnSingle {
	    	width: 80px;
	    	height: 36px;
	    	border-radius: 6px !important;
    		border-right: 1px solid rgba(0,0,0,0.4) !important;
	    }

	    .dropdownBtnSingle:hover {
	    	border-radius: 6px 0 0 6px !important;
	    }

	    .dropdown ul li:hover {
			background-color: #000;
	    	border-top: 1px solid rgba(0,0,0,0.4);
	    	/*border-bottom-right-radius: 0;*/
		}

		.dropdown a {
			text-decoration: none;
			color: #fff;
		}
/*
		.dropdown a:hover { 
			background-color: #000000; 
		}*/

		/* Hide Dropdowns by Default */
		.dropdown ul ul {
			display: none;
			position: absolute; 
		 	top: 0px;
		 	left: 80px;
		  /* the height of the main nav */
		}


			
		/* Display Dropdowns on Hover */
		.dropdown ul li:hover > ul {
			display:inherit;
		}
			
		/* First Tier Dropdown */
		.dropdown ul ul li {
			width: 200px;
			float:none;
			display:list-item;
			position: relative;
		}

		/* Second, Third and more Tiers	*/
		.dropdown ul ul ul li {
			/* 	position: absolute; */
			top: -1px;
			left: 119px;
		}

			
		/* Change this in order to change the Dropdown symbol */
		li > a:after { content:  ' >'; }
		li > a:only-child:after { content: ''; }

		.hasTimePicker {
			padding-left: 90px;
		}	

		.ct-chart .ct-bar {
		    stroke-width: 30px
		}	

		.ct-series-a .ct-bar, .ct-series-a .ct-line, .ct-series-a .ct-point, .ct-series-a .ct-slice-donut {
		    stroke: #4485d6 !important;
		}

		.ct-series-a .ct-area {
			fill: #4485d6 !important;
		}

		.ct-series-a .ct-bar-label {
			fill: #000 !important;
		}

		.custom-popup .mapboxgl-popup-content {
		    position: relative;
		    border-radius: 6px;		    
		    padding: 10px 10px 15px;
		    pointer-events: auto;
		    background: #4485d6;
			color: #ffffff;
			font-family: Helvetica,Arial,sans-serif;
			font-weight: bold;
		}

		.custom-popup .mapboxgl-popup-anchor-bottom .mapboxgl-popup-tip {
		    -webkit-align-self: center;
		    align-self: center;
		    border-bottom: none;
		    border-top-color: #4485d6;
		}

		.custom-popup .mapboxgl-popup {
		    position: absolute;
		    top: 0;
		    left: 0;
		    display: -webkit-flex;
		    display: flex;
		    will-change: transform;
		    pointer-events: none;
		}

		.sourceImageWrapper {
			background-color: #a7a7a7;	
			border: 1px solid rgba(0,0,0,0.4);
			width: 200px;
			min-height: 100px;
			border-radius: 0 6px 6px 6px;
			background: url("../img/generic_image.png") 50% 50% no-repeat;
			background-size: 50%;
			overflow: hidden;
			margin-bottom: 15px;
		}

		#source_image {
			width: 100%;
		}

		/*#remoteNotificationChildAgeWrapper{
			display: none;
		}
*/
		#remoteNotificationNewsIDWrapper{
			display: none;
		}

		#remoteNotificationChildAgeExact{
			display: none;
		}

		#remoteNotificationChildAgeRange{
			display: none;
		}

		.sourceImage{
			width: 150px;
		}

		.metaTitlePopup{
			position: absolute;
			display: none;
		}

		/* Jquery Tooltip */
		.ui-tooltip {
			padding: 8px;
			position: absolute;
			z-index: 9999;
			max-width: 300px;
			background-color: white;
		}
		body .ui-tooltip {
			border-width: 2px;
		}
		.ui-widget-shadow {
			-webkit-box-shadow: 0px 0px 5px #666666;
			box-shadow: 0px 0px 5px #666666;
		}
		.ui-corner-all,
		.ui-corner-top,
		.ui-corner-left,
		.ui-corner-tl {
			border-top-left-radius: 3px;
		}
		.ui-corner-all,
		.ui-corner-top,
		.ui-corner-right,
		.ui-corner-tr {
			border-top-right-radius: 3px;
		}
		.ui-corner-all,
		.ui-corner-bottom,
		.ui-corner-left,
		.ui-corner-bl {
			border-bottom-left-radius: 3px;
		}
		.ui-corner-all,
		.ui-corner-bottom,
		.ui-corner-right,
		.ui-corner-br {
			border-bottom-right-radius: 3px;
		}
		.ui-controlgroup-horizontal .ui-controlgroup-label.ui-widget-content {
			border-right: none;
		}
		.ui-controlgroup-vertical .ui-controlgroup-label.ui-widget-content {
			border-bottom: none;
		}
		.ui-widget {
			font-family: Arial,Helvetica,sans-serif;
			font-size: 1em;
		}
		.ui-widget .ui-widget {
			font-size: 1em;
		}
		.ui-widget input,
		.ui-widget select,
		.ui-widget textarea,
		.ui-widget button {
			font-family: Arial,Helvetica,sans-serif;
			font-size: 1em;
		}
		.ui-widget.ui-widget-content {
			border: 1px solid #c5c5c5;
		}
		.ui-widget-content {
			border: 1px solid #dddddd;
			background: #ffffff;
			color: #333333;
		}
		.ui-widget-content a {
			color: #333333;
		}

		#notificationsTimelineViewer{
			width:100%;
			height: 700px;
		}

		.notificationsSubRow, .subRowGeneric{
			height:170px;
			border-top: 1px solid #a0a0a0;
			float: left;
    		display: block;
    		padding: 10px;
    		width: 100%;
		}

		.notificationsTable{
			display: none;
		}

		#sourceUpdateSelectorIframe{
			height: 560px;
			width:100%;
		}