@import url(//fonts.googleapis.com/css?family=Source+Sans+Pro);
.Firehose {
	pointer-events: none
}

.Firehose .text {
	color: #fff;
	font-family: monospace;
	font-size: 7px
}

.Firehose .marker {
	position: absolute;
	top: -5px;
	left: -5px;
	width: 10px;
	height: 10px;
	border-radius: 5px;
	background: #fff;
	display: none
}

.Firehose .infos {
	font-size: 10px;
	position: absolute;
	bottom: 12%;
	left: 2%
}

.Firehose .total-number {
	font-family: Fjalla One;
	font-size: 2.6em
}

.Firehose .total-text {
	font-size: .9em;
	display: inline-block;
	line-height: 1.8em;
	margin: 0
}

.Firehose .countries {
	width: 30em;
	height: 12em;
	position: relative;
	text-align: right
}

@-webkit-keyframes countryPop {
	0% {
		opacity: 0;
		-webkit-transform: translateX(20em);
		transform: translateX(20em)
	}
	to {
		opacity: 1;
		-webkit-transform: translateX(0);
		transform: translateX(0)
	}
}

@keyframes countryPop {
	0% {
		opacity: 0;
		-webkit-transform: translateX(20em);
		transform: translateX(20em)
	}
	to {
		opacity: 1;
		-webkit-transform: translateX(0);
		transform: translateX(0)
	}
}

.Firehose .country {
	position: absolute;
	width: 45%;
	height: 50%;
	transition: all .19s;
	-webkit-animation: countryPop .15s both;
	animation: countryPop .15s both
}

.Firehose .country:first-child {
	top: 0;
	left: 0
}

.Firehose .country:nth-child(2) {
	top: 0;
	left: 50%
}

.Firehose .country:nth-child(3) {
	top: 50%;
	left: 0
}

.Firehose .country:nth-child(4) {
	top: 50%;
	left: 50%
}

.Firehose .country .name {
	font-size: .9em
}

.Firehose .country .count {
	display: block;
	height: 2em;
	font-size: 2.5em;
	line-height: 1.2em;
	text-align: right;
	font-family: Fjalla One
}

.Pricing {
	color: #131313
}

.Pricing .fa-circle {
	position: absolute;
	top: 10px;
	left: 10px;
	font-size: 12px
}

.Pricing .fa-circle.blue {
	color: #3ca9fb
}

.Pricing .fa-circle.green {
	color: #50d168
}

.Pricing .fa-circle.purple {
	color: #723cfb
}

.Pricing .offer {
	text-align: center;
	position: relative;
	background: #fff;
	border-radius: 4px;
	padding-bottom: 20px;
	margin-bottom: 20px
}

.Pricing li {
	position: relative;
	border-top: 1px solid #eee;
	height: 55px;
	padding: 6px 0 0;
	list-style-type: none
}

.Pricing ul {
	list-style-type: none;
	border-bottom: 1px solid #eee;
	margin-bottom: 15px
}

.Pricing h3 {
	padding: .8em 0;
	margin: 0
}

.Pricing .what {
	position: absolute;
	top: 10px;
	left: 8px;
	font-size: 12px;
	text-align: left;
	color: #3ca9fb
}

.Pricing .button-primary {
	box-shadow: 0 8px 18px rgba(0, 0, 0, .2);
	background-color: #3ca9fb;
	border-color: #3ca9fb;
	border-radius: 100px;
	font-weight: 400;
	transition: all .2s
}

.Pricing .button-primary:hover {
	background-color: #2d7ebb;
	border-color: #2d7ebb;
	box-shadow: 0 4px 16px rgba(0, 0, 0, .3)
}

.Pricing .offer strong {
	display: block
}

.Pricing .offer li em {
	padding-top: .2em;
	display: block;
	font-size: 12px;
	color: #666;
	line-height: 1.2em;
	font-style: normal
}

.Pricing .price {
	padding: 10px 0;
	position: relative;
	font-size: 1.3em;
	font-weight: 700
}

.Pricing .price span {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	font-size: .6em;
	font-weight: 400
}

.Pricing .price em {
	font-size: .6em;
	padding-left: .2em;
	font-weight: 400;
	font-style: normal;
	color: #666
}

.Header {
	position: relative;
	width: 100%;
    height: 100%;
	color: #fff;
}

.Header div {
    text-align: center;
}

.Header.bg {
	background: rgba(0, 0, 0, .7)
}

.Header.mobile nav {
	display: none
}

.Header h1 {
	font-size: 33px
}

.Header h2 {
	letter-spacing: .08em;
	z-index: 2;
	top: 51px;
	left: 24px;
	font-size: 9px;
    text-align: center;
}

.Header nav {
	position: absolute;
	text-transform: uppercase
}

.Header nav {
	top: 30px;
	right: 40px;
	z-index: 100;
	color: #fff;
	font-size: 14px
}

.Header a {
	color: #fff;
	text-decoration: none
}

.Header nav a {
	padding: 0 17px;
	transition: color .3s;
	border-right: 1px solid hsla(0, 0%, 100%, .5)
}

.Header nav a:last-child {
	border-right: 0 none
}

.Header nav a:hover {
	color: #00c6ff
}

.Footer {
	position: relative;
	background: #000;
	margin-top: 100px;
	padding: 0 0 100px
}

.Footer h4 {
	text-transform: uppercase;
	text-align: center;
	font-size: 16px
}

.Footer li {
	list-style-type: none;
	text-align: center
}

.Footer ul a {
	color: #777;
	font-size: 12px;
	text-decoration: none;
	text-transform: uppercase;
	transition: color .25s
}

.Footer a:hover {
	color: #3ca9fb
}

.Homepage {
	background: #12151b;
	position: relative;
	color: #fff
}

.Homepage a {
	color: #3ca8fb;
	text-decoration: none
}

.Homepage header {
	color: #fff
}

.Homepage header a {
	color: #fff;
	text-decoration: none
}

.Homepage .section-map {
	position: relative;
    margin-bottom: 100px;
}

.faq-content {
    border: 1px solid #ccc;
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 4px;
}

.faq-content h3 {
    font-size: 18px;
}

.info-content {
    margin-bottom: 30px;
}

.image-banner {
    margin-bottom: 30px;
    border-radius: 4px;
}

.info-content h1, .info-content h2, .info-content h3 {
    font-size: 24px;
}

.flex-row h3 {
    font-size: 24px;
}

.flex-row {
    display: flex;
    flex-wrap: wrap;
}

.flex-row .col-md-6 {
    width: 47%;
    margin-bottom: 20px;
    margin-right: 3%;
}

.input-holder {
    margin-bottom: 10px;
}

.input-holder label {
    display: block;
    margin: 10px 0;
}

.input-holder input, .input-holder textarea {
    width: 100%;
    padding: 10px;
}

.button-send {
    background: #2980b9;
    color: #fff;
    border: none;
    padding: 10px;
    line-height: 0.5em;
}

.footer-nav {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.footer-nav li {
    margin-right: 10px;
}

.footer-nav a {
    text-decoration: none;
}

.footer-nav a:hover {
    text-decoration: underline;
}

@media (max-width: 980px) {
    .flex-row .col-md-6  {
        width: 100%;
    }
}

@-webkit-keyframes goBottom {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}
	50% {
		-webkit-transform: translateY(-22px) scale(1.2);
		transform: translateY(-22px) scale(1.2)
	}
	to {
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}
}

@keyframes goBottom {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}
	50% {
		-webkit-transform: translateY(-22px) scale(1.2);
		transform: translateY(-22px) scale(1.2)
	}
	to {
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}
}

.Homepage .go-down {
	-webkit-animation: goBottom 3.5s infinite;
	animation: goBottom 3.5s infinite;
	position: absolute;
	bottom: 15px;
	left: 50%;
	width: 100px;
	margin: 0 0 0 -50px;
	text-align: center;
	font-size: 16px
}

.Homepage .section h2 {
	margin-bottom: 15px
}

.Homepage .highlight {
	font-size: 1.8em
}

.Homepage .highlight strong {
	position: relative;
	color: #3ca9fb;
	font-weight: 400
}

.Homepage .question {
	position: relative;
	color: #bbb;
	font-size: 13px;
	line-height: 2em;
	text-align: right;
	padding-right: 2.3em
}

.Homepage .question .fa {
	font-size: 2em;
	position: absolute;
	top: 0;
	right: 0
}

.UseCases .columns {
	border-radius: 4px;
	background: rgba(0, 0, 0, .6);
	padding-top: 35px;
	height: 350px;
	position: relative;
	margin-bottom: 20px
}

.UseCases .columns img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%
}

.UseCases .fa {
	display: block;
	color: #3ca9fb;
	font-size: 74px;
	margin-bottom: 35px
}

.UseCases p {
	padding: 5px 15px
}

.UseCases h3 {
	height: 2.2em
}

.References {
	padding: 50px 0
}

.References .item {
	text-align: center;
	display: inline-block;
	position: relative;
	width: 20%;
	line-height: 100px
}

.References img {
	width: 60%;
	-webkit-filter: brightness(0) invert(100%);
	filter: brightness(0) invert(100%);
	opacity: .5;
	transition: opacity .4s
}

.References img:hover {
	opacity: 1
}

.Activity {
	position: absolute;
	border-bottom: 1px solid hsla(0, 0%, 100%, .4);
	margin-bottom: -1px;
	overflow: hidden
}

.Activity .line {
	left: 0;
	height: 1px
}

.Activity .line,
.Activity .time {
	position: absolute;
	transition: all .5s
}

.Activity .time {
	bottom: -14px;
	left: -25px;
	width: 50px;
	font-size: 10px;
	font-family: monospace;
	text-align: center
}

.Activity .plot {
	position: absolute;
	border-top: 1px solid #fff;
	opacity: .4;
	bottom: 0
}

.Activity .plot:hover {
	background-color: #fff!important;
	opacity: 1
}

.Activity .plot .info {
	pointer-events: none;
	position: absolute;
	color: #fff;
	bottom: 0;
	left: 8px;
	font-size: 18px;
	line-height: 18px;
	font-family: Fjalla One;
	display: none;
	min-width: 150px
}

.Activity .plot .info .date {
	display: block;
	font-size: 12px;
	font-family: sans-serif
}

.Activity .plot:hover .info {
	display: block
}

.LastPicture {
	position: absolute;
	bottom: 0
}

.LastPicture .picture {
	display: block;
	margin-top: 5px;
	background-size: cover;
	transition: all .3s;
	opacity: .6;
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	background-color: hsla(0, 0%, 100%, .1);
	background-position: 50% 50%;
	background-repeat: no-repeat
}

.LastPicture .picture:hover {
	-webkit-filter: grayscale(0);
	filter: grayscale(0);
	opacity: 1
}

.TotalCount {
	position: absolute;
	color: #fff;
	text-align: left;
	font-size: 10px
}

.TotalCount h4 {
	margin: 1em 0 0;
	padding: 0;
	border-bottom: 1px solid hsla(0, 0%, 100%, .4);
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: .1em
}

.TotalCount strong {
	display: block;
	text-align: left;
	line-height: 1.25em;
	text-transform: uppercase;
	font-family: Fjalla One
}

.TotalCount .rate strong {
	font-size: 4em
}

.TotalCount .total strong {
	font-size: 6em
}

.TotalCount .time strong {
	font-size: 2.2em
}

.TotalCount .rate,
.TotalCount .time {
	width: 50%
}

.Wall {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden
}

@-webkit-keyframes fadeIn {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-16px);
		transform: translateY(-16px)
	}
	to {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}
}

@keyframes fadeIn {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-16px);
		transform: translateY(-16px)
	}
	to {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}
}

.Wall .top-line {
	border-bottom: 1px solid hsla(0, 0%, 100%, .4)
}

.Wall .tweet {
	height: 60px;
	position: absolute;
	overflow: hidden;
	color: #fff;
	transition: all .1s;
	-webkit-animation: fadeIn .05s;
	animation: fadeIn .05s
}

.Wall .tweet.animated {
	transition: all .3s;
	-webkit-animation: fadeIn .6s;
	animation: fadeIn .6s
}

.Wall .tweet .box {
	position: relative;
	height: 44px;
	margin: 0 auto 5px;
	padding: 0 0 5px;
	overflow: hidden;
	border-bottom: 1px solid hsla(0, 0%, 100%, .4)
}

.Wall .tweet a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transition: background .2s
}

.Wall .tweet a:hover {
	background: hsla(0, 0%, 100%, .1)
}

.Wall .tweet p {
	padding: 0 10px;
	margin: 5px 0 0 45px;
	font-size: 11px;
	line-height: 14px;
	border-left: 1px dotted hsla(0, 0%, 100%, .6);
	height: 39px
}

.Wall .tweet .pict {
	position: absolute;
	top: 5px;
	left: 5px;
	width: 32px;
	height: 32px;
	border-radius: 24px;
	background-repeat: no-repeat;
	background-size: 32px 32px;
	background-position: 0 0
}

.Loader {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 200px;
	height: 100px;
	margin: -50px 0 0 -100px;
	color: #fff;
	opacity: .7;
	text-align: center;
	color: hsla(0, 0%, 100%, .7)
}

.Loader .fa {
	font-size: 30px
}

.Grid .vertical-line {
	left: 50%;
	width: 0;
	border-left: 1px dotted hsla(0, 0%, 100%, .3)
}

.Grid .mask,
.Grid .vertical-line {
	position: absolute;
	top: 0;
	height: 100%
}

.Grid .mask {
	left: 0;
	width: 100%;
	background-image: radial-gradient(ellipse at center, transparent 0, rgba(0, 0, 0, .11) 100%)
}

.Countries {
	color: #fff;
	position: absolute;
	bottom: 0;
	right: 0
}

.Countries .country {
	position: relative;
	text-align: right;
	overflow: hidden;
	float: left;
	border-bottom: 1px solid hsla(0, 0%, 100%, .4)
}

.Countries .country .count {
	bottom: 0;
	left: 10px;
	font-size: .5em;
	line-height: 1.2em;
	font-family: Fjalla One
}

.Countries .country .name {
	font-size: 10px;
	letter-spacing: .1em;
	line-height: 1.5em;
	text-transform: uppercase
}

.Countries .country .circle {
	position: absolute;
	opacity: .7;
	background: #fff;
	border-radius: 3em
}

.Countries .country .content-line {
	position: relative;
	height: 4px
}

.Countries .country .line {
	position: absolute;
	right: 0;
	opacity: .7;
	background-color: #fff;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
	top: 0;
	height: 4px
}

.StreamMenu {
	position: absolute;
	top: 0;
	right: 0;
	width: 300px;
	color: #fff
}

@-webkit-keyframes blinkcircle {
	0% {
		opacity: 1
	}
	50% {
		opacity: .1
	}
	to {
		opacity: 1
	}
}

@keyframes blinkcircle {
	0% {
		opacity: 1
	}
	50% {
		opacity: .1
	}
	to {
		opacity: 1
	}
}

.StreamMenu .mask {
	position: absolute;
	top: 0;
	right: 0;
	background: rgba(0, 0, 0, .15)
}

.StreamMenu header {
	position: absolute;
	top: 5px;
	right: 1%;
	width: 200px;
	text-align: right
}

.StreamMenu h1,
.StreamMenu h2 {
	text-transform: uppercase;
	letter-spacing: .12em
}

.StreamMenu h1 {
	font-size: 11px;
	display: inline;
	margin: 0;
	padding: 0;
	padding-right: 1em;
	cursor: pointer
}

.StreamMenu h2 {
	font-size: 9px;
	margin: 0;
	padding: 0 0 0 8px;
	border-bottom: 1px solid hsla(0, 0%, 100%, .4)
}

.StreamMenu p,
.StreamMenu section {
	font-size: 11px;
	padding: 3px 0 5px 8px;
	margin: 0 0 1em
}

.reccording {
	color: #f33;
	-webkit-animation: blinkcircle 3s infinite;
	animation: blinkcircle 3s infinite
}

.StreamMenu .keywords {
	font-size: 11px;
	font-family: monospace
}

.StreamMenu nav {
	position: absolute;
	top: 0;
	right: 0;
	width: 300px;
	background: rgba(0, 0, 0, .8);
	box-shadow: 0 0 5px #000;
	-webkit-transform: translateX(320px);
	-ms-transform: translateX(320px);
	transform: translateX(320px);
	transition: -webkit-transform .2s;
	transition: transform .2s;
	transition: transform .2s, -webkit-transform .2s
}

.StreamMenu .spacer {
	height: 3%;
	padding-top: 30px
}

.StreamMenu.open nav {
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0)
}

.StreamMenu .SocialMediaShareButton {
	display: inline-block;
	margin: 0 10px 0 0;
	cursor: pointer;
	font-size: 18px
}

.StreamMenu .owner img {
	margin-top: 5px;
	height: 1.1em
}

.StreamMenu .owner a {
	text-decoration: none;
	color: #fff
}

.StreamMenu .about {
	padding-top: 5px
}

.StreamMenu .about a {
	color: #fff
}

.Zoomable {
	color: #fff;
	background: #000;
	overflow: hidden
}

.Zoomable .map-container,
.Zoomable .WebGLLight {
	position: absolute;
	top: 0;
	left: 0
}

.Zoomable .WebGLLight {
	pointer-events: none
}

.Zoomable .dashboard-mask {
	position: absolute;
	bottom: 0;
	left: 0;
	background: transparent
}

.Zoomable .Wall {
	background: rgba(0, 0, 0, .3)
}

.Zoomable .Countries {
	text-shadow: 0 1px 0 #000
}

.Zoomable .Countries .content-line .line {
	opacity: .85
}

.Zoomable .Countries .content-line,
.Zoomable .Countries .count,
.Zoomable .Countries .name {
	background: rgba(0, 0, 0, .2)
}

.Zoomable .Activity .plot {
	opacity: .45
}

@-webkit-keyframes LowTrafficBubble {
	0% {
		opacity: 0
	}
	to {
		opacity: .7
	}
}

@keyframes LowTrafficBubble {
	0% {
		opacity: 0
	}
	to {
		opacity: .7
	}
}

@-webkit-keyframes LowTrafficFx {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 1
	}
	70% {
		-webkit-transform: scale(3);
		transform: scale(3);
		opacity: 1
	}
	to {
		-webkit-transform: scale(4);
		transform: scale(4);
		opacity: 0
	}
}

@keyframes LowTrafficFx {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 1
	}
	70% {
		-webkit-transform: scale(3);
		transform: scale(3);
		opacity: 1
	}
	to {
		-webkit-transform: scale(4);
		transform: scale(4);
		opacity: 0
	}
}

.LowTrafficMapIcons {
	position: absolute;
	top: 0;
	left: 0
}

.LowTrafficMapIcons .bubble {
	position: absolute;
	width: 18px;
	height: 18px;
	margin: -10px 0 0 -10px;
	border-radius: 20px;
	border: 1px solid hsla(0, 0%, 100%, .7);
	-webkit-animation: LowTrafficBubble .4s both;
	animation: LowTrafficBubble .4s both;
	box-shadow: 0 0 6px hsla(0, 0%, 100%, .7)
}

.LowTrafficMapIcons .fx {
	position: absolute;
	width: 18px;
	height: 18px;
	top: 0;
	left: 0;
	border-radius: 20px;
	background: #fff;
	-webkit-animation: LowTrafficFx .15s both;
	animation: LowTrafficFx .15s both
}

.Stream {
	position: relative
}

.Stream h3 {
	position: absolute;
	opacity: .5;
	top: 3%;
	left: 3%;
	z-index: 3000
}

.UserFlow {
	color: #fff
}

@-webkit-keyframes Slide {
	0% {
		opacity: 0;
		-webkit-transform: scale(0);
		transform: scale(0)
	}
	5% {
		opacity: .9;
		-webkit-transform: scale(1);
		transform: scale(1)
	}
	90% {
		opacity: .9
	}
	to {
		-webkit-transform: translateX(1200px);
		transform: translateX(1200px);
		opacity: 0
	}
}

@keyframes Slide {
	0% {
		opacity: 0;
		-webkit-transform: scale(0);
		transform: scale(0)
	}
	5% {
		opacity: .9;
		-webkit-transform: scale(1);
		transform: scale(1)
	}
	90% {
		opacity: .9
	}
	to {
		-webkit-transform: translateX(1200px);
		transform: translateX(1200px);
		opacity: 0
	}
}

.UserFlowItem {
	transition: opacity .3s
}

.UserFlowItem .item {
	display: block;
	position: absolute;
	left: 0;
	width: 2em;
	height: 2em;
	border-radius: 2em;
	margin: -1em 0 0 1em;
	background-size: cover;
	-webkit-animation-name: Slide;
	animation-name: Slide;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	animation-timing-function: ease;
	-webkit-animation-timing-function: cubic-bezier(.04, .4, .96, .76);
	animation-timing-function: cubic-bezier(.04, .4, .96, .76);
	-webkit-animation-timing-function: cubic-bezier(.16, .46, .83, .56);
	animation-timing-function: cubic-bezier(.16, .46, .83, .56)
}

.UserFlowItem .item:hover .hashtag span {
	opacity: 1
}

.UserFlowItem .hashtag {
	position: absolute;
	top: 1em;
	left: 1em;
	width: 0;
	height: 0;
	color: #fff;
	text-decoration: none;
	text-shadow: 0 0 3px rgba(0, 0, 0, .7)
}

.UserFlowItem .hashtag span {
	pointer-events: none;
	transition: all .2s;
	display: block;
	position: absolute;
	left: 0;
	top: -.7em;
	opacity: 0;
	-webkit-transform-origin: 0 50%;
	-ms-transform-origin: 0 50%;
	transform-origin: 0 50%;
	font-weight: 700;
	font-size: .7em
}

.UserFlowItem .attached {
	position: absolute;
	top: .3em;
	right: 1.8em;
	width: 1000px;
	text-align: right
}

.InternalLayer header h1 {
	position: absolute;
	top: 11px;
	margin: 0;
	padding: 0;
	left: 0
}

.InternalLayer header h2 {
	position: absolute;
	text-transform: uppercase;
	z-index: 2;
	top: 48px;
	left: 4px;
	font-size: 11px;
	color: #fff
}

.InternalLayer .firehosewrapper {
	height: 180px;
	overflow: hidden
}

.InternalLayer header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 3
}

.InternalLayer header a {
	color: #fff;
	text-decoration: none
}

.InternalLayer section {
	background: #fff;
	border-radius: 4px;
	color: #000
}

.InternalLayer section .pd {
	padding: 10px 30px 30px
}

.InternalLayer .disabled {
	width: 81px
}

.InternalLayer section h3 {
	border-bottom: 1px solid #ccc;
	padding: 15px 30px
}

.InternalLayer section h3 strong {
	float: right;
	font-family: monospace;
	color: #3ca9fb;
	font-size: .8em;
	padding-top: 12px
}

.InternalLayer section textarea {
	width: 100%
}

.InternalLayer .picker div {
	font-family: monospace;
	box-shadow: 0 0 0 #fff!important
}

.InternalLayer .map-proto {
	position: relative;
	overflow: hidden;
	width: 100%;
	border-radius: 4px
}

.InternalLayer .map-proto div {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: radial-gradient(ellipse at center, rgba(0, 0, 0, .5) 0, rgba(0, 0, 0, .81) 100%)
}

.InternalLayer .map-proto img {
	opacity: .7;
	display: block
}

.InternalLayer .content {
	position: relative;
	min-height: 100%;
	margin-top: -77px
}

.InternalLayer h4 {
	padding-top: 20px
}

.InternalLayer pre {
	border: 1px solid #ddd;
	border-radius: 4px
}

.InternalLayer h4 i {
	color: #3ca9fb;
	font-size: .8em
}

.InternalLayer .error {
	color: #c00
}

.HeaderInnerPage .banner {
	height: 120px;
	background: #3ca9fb url(../../world-map-black.png) no-repeat 50% 20%;
	background-size: cover;
	opacity: .45;
	-webkit-animation: bannerFadeInOut 10s linear infinite;
	animation: bannerFadeInOut 10s linear infinite
}

.CDI {
	position: relative;
	font-size: 10px;
	height: 7em;
	width: 15em;
	color: rgba(0, 0, 0, .05)
}

.CDI .dashboard {
	position: absolute;
	top: 10%;
	height: 80%;
	left: 20%;
	width: 60%;
	border: 3px solid #fff;
	margin: -3px 0 0 -3px;
	background: rgba(0, 0, 0, .1) url(../../img/thumb/custom.png) no-repeat 50% 50%;
	background-size: cover;
	box-shadow: 0 0 3px rgba(0, 0, 0, .4)
}

.CDI .component {
	color: #555;
	position: absolute;
	width: 1.85em;
	height: 1.85em;
	margin: .2em auto;
	background: rgba(0, 0, 0, .4);
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	-webkit-animation-duration: 5.3s;
	animation-duration: 5.3s;
	-webkit-animation-direction: alternate;
	animation-direction: alternate;
	-webkit-transform: translateZ(0);
	transform: translateZ(0)
}

.CDI .component i {
	font-size: 1.3em;
	line-height: 1.6em;
	color: #fff
}

.CDI .c1,
.CDI .c4 {
	top: 0
}

.CDI .c2,
.CDI .c5 {
	top: 33%
}

.CDI .c3,
.CDI .c6 {
	top: 67%
}

.CDI .c1,
.CDI .c2,
.CDI .c3 {
	left: 0
}

.CDI .c4,
.CDI .c5,
.CDI .c6 {
	right: 0
}

@-webkit-keyframes CDIC1 {
	33% {
		-webkit-transform: translate3d(3.2em, 4em, 0);
		transform: translate3d(3.2em, 4em, 0)
	}
	to {
		-webkit-transform: translate3d(3.2em, 4em, 0);
		transform: translate3d(3.2em, 4em, 0)
	}
}

@keyframes CDIC1 {
	33% {
		-webkit-transform: translate3d(3.2em, 4em, 0);
		transform: translate3d(3.2em, 4em, 0)
	}
	to {
		-webkit-transform: translate3d(3.2em, 4em, 0);
		transform: translate3d(3.2em, 4em, 0)
	}
}

@-webkit-keyframes CDIC5 {
	33% {
		-webkit-transform: translate3d(-3.2em, -.5em, 0);
		transform: translate3d(-3.2em, -.5em, 0)
	}
	to {
		-webkit-transform: translate3d(-3.2em, -.5em, 0);
		transform: translate3d(-3.2em, -.5em, 0)
	}
}

@keyframes CDIC5 {
	33% {
		-webkit-transform: translate3d(-3.2em, -.5em, 0);
		transform: translate3d(-3.2em, -.5em, 0)
	}
	to {
		-webkit-transform: translate3d(-3.2em, -.5em, 0);
		transform: translate3d(-3.2em, -.5em, 0)
	}
}

.CDI .c1 {
	-webkit-animation-name: CDIC1;
	animation-name: CDIC1
}

.CDI .c5,
.CDI .c6 {
	-webkit-animation-name: CDIC5;
	animation-name: CDIC5
}

.PricingPage {
	color: #fff
}

.PricingPage .fa-circle {
	position: absolute;
	top: 10px;
	left: 10px;
	font-size: 12px
}

.PricingPage .fa-circle.blue {
	color: #3ca9fb
}

.PricingPage .fa-circle.green {
	color: #50d168
}

.PricingPage .fa-circle.purple {
	color: #723cfb
}

.PricingPage .Footer {
	margin-top: 0
}

@-webkit-keyframes bannerFadeInOut {
	0% {
		opacity: .35
	}
	33% {
		background-color: #00bfaf
	}
	50% {
		opacity: .45
	}
	67% {
		background-color: #7dcc00
	}
	to {
		opacity: .35
	}
}

@keyframes bannerFadeInOut {
	0% {
		opacity: .35
	}
	33% {
		background-color: #00bfaf
	}
	50% {
		opacity: .45
	}
	67% {
		background-color: #7dcc00
	}
	to {
		opacity: .35
	}
}

.PricingPage .content {
	position: relative
}

.PricingPage .offers {
	color: #131313
}

.PricingPage .offers h3 {
	font-size: 2em;
	padding: .7em 0 .3em;
	margin: 0
}

.PricingPage .offers {
	text-align: center
}

.PricingPage .offers .columns {
	position: relative;
	border-radius: 4px;
	background-color: #fff;
	box-shadow: 0 0 4px rgba(0, 0, 0, .1);
	padding-bottom: 1.3em;
	margin-bottom: 1.3em
}

.PricingPage .is-realtime {
	display: none
}

.PricingPage .data,
.PricingPage .description,
.PricingPage .interfaces {
	border-bottom: 1px solid #eee;
	margin: 0 0 12px
}

.PricingPage .description {
	color: #888;
	font-style: italic;
	padding: 0 0 .6em;
	height: 1.4em;
	font-size: .9em
}

.PricingPage .quantity {
	display: none
}

.PricingPage .interfaces {
	height: 9em;
	font-size: .9em
}

.PricingPage .interfaces .CDI {
	margin: 1px auto 5px
}

.PricingPage .interfaces img {
	display: inline-block;
	height: 56px;
	width: 90px;
	background: #777;
	border: 3px solid #fff;
	margin: 0 2px;
	box-shadow: 0 0 3px rgba(0, 0, 0, .4);
	cursor: pointer
}

.PricingPage .offer-premium .interfaces img,
.PricingPage .offer-starter .interfaces img {
	cursor: zoom-in
}

.PricingPage .interfaces .thumbs {
	height: 5em;
	padding-top: .3em
}

.PricingPage .interfaces .thumbs img {
	margin-left: -30px;
	position: relative;
	transition: all .25s
}

.PricingPage .interfaces .thumbs img:first-child {
	margin-left: 0
}

.PricingPage .interfaces .thumbs:hover img:first-child {
	-webkit-transform: translateX(-38px);
	-ms-transform: translateX(-38px);
	transform: translateX(-38px)
}

.PricingPage .interfaces .thumbs:hover img:last-child {
	-webkit-transform: translateX(38px);
	-ms-transform: translateX(38px);
	transform: translateX(38px)
}

.PricingPage .offer-name th {
	border-bottom: 0 none
}

.PricingPage .data {
	height: 3.6em
}

.PricingPage .price {
	padding: 10px 0;
	position: relative;
	font-size: 1.3em;
	font-weight: 700
}

.PricingPage .price span {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	font-size: .6em;
	font-weight: 400
}

.PricingPage .price em {
	font-size: .6em;
	padding-left: .2em;
	font-weight: 400;
	font-style: normal;
	color: #666
}

.PricingPage .question {
	position: relative;
	color: #ddd;
	font-size: 13px;
	line-height: 2em;
	text-align: right;
	padding-right: 2.3em
}

.PricingPage .question .fa {
	font-size: 1.7em;
	position: absolute;
	top: 0;
	right: 0
}

.PricingPage .offers .button-primary {
	box-shadow: 0 8px 18px rgba(0, 0, 0, .2);
	background-color: #3ca9fb;
	border-color: #3ca9fb;
	border-radius: 100px;
	font-weight: 400;
	transition: all .2s
}

.PricingPage .offers .button-primary:hover {
	background-color: #2d7ebb;
	border-color: #2d7ebb;
	box-shadow: 0 0 16px rgba(0, 0, 0, .3)
}

.Subscription .steps {
	margin: 20px 0
}

.Subscription .steps .step {
	text-align: center
}

.Subscription .steps .step .number {
	display: inline-block;
	font-family: Arial, sans-serif;
	font-size: 22px;
	width: 1.7em;
	height: 1.7em;
	border-radius: 2em;
	line-height: 1.8em;
	font-weight: 700;
	background: #fff;
	color: #333
}

.Subscription .steps .step.on .number {
	color: #fff;
	background: #1eaedb
}

.Subscription .steps .step .label {
	color: #fff
}

.Subscription .steps .step.on .label {
	color: #1eaedb
}

.Subscription section {
	background: #fff;
	border-radius: 10px;
	padding: 10px 30px
}

.Subscription textarea {
	width: 100%;
	height: auto
}

.Subscription .TwitterUser {
	line-height: 30px
}

.Subscription .TwitterUser .profile-picture {
	float: left;
	width: 30px;
	height: 30px;
	margin-right: 5px;
	border-radius: 15px
}

.Admin {
	min-height: 100%;
	background: #fff;
	padding: 0 30px;
	font-family: monospace
}

.Admin h1 {
	margin-top: 0
}

.Admin .refresh {
	float: right;
	margin-top: 10px
}

.Admin .color-square {
	display: inline-block;
	height: 11px;
	width: 11px;
	border-radius: 12px
}

.Admin td,
.Admin th {
	padding: 1px 2px
}

.Nutella .custom {
	position: absolute;
	left: 10px
}

.Nutella-day .custom .title-thin {
	font-size: 14px
}

.Nutella .total-legacy {
	text-align: left;
	color: #fff
}

.Nutella .total-legacy .big-number {
	font-size: 3.5em
}

.Nutella .TotalCount .total {
	display: none
}

@-webkit-keyframes CrimesonDotAnimation {
	0% {
		-webkit-transform: scale(8);
		transform: scale(8);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@keyframes CrimesonDotAnimation {
	0% {
		-webkit-transform: scale(8);
		transform: scale(8);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

.CrimesonDot .city {
	position: absolute;
	top: 0;
	left: 0;
	width: 7px;
	height: 7px;
	border-radius: 10px;
	margin: -3px 0 0 -3px;
	background: hsla(0, 0%, 100%, .1);
	-webkit-animation: CrimesonDotAnimation .3s both;
	animation: CrimesonDotAnimation .3s both
}

.CrimesonDot .city .center {
	width: 1px;
	height: 1px;
	margin: 3px 0 0 3px;
	background: hsla(0, 0%, 100%, .45)
}

.NutellaDay .qr-code {
	position: absolute;
	bottom: 2%;
	right: 2%;
	padding: 5px 0;
	overflow: hidden;
	width: 80px;
	text-align: center
}

.NutellaDay .qr-code img {
	display: block;
	padding: 8px 0;
	background: #fff;
	box-shadow: 0 0 5px rgba(0, 0, 0, .7);
	border: 1px solid rgba(0, 0, 0, .7)
}

.NutellaDay .qr-code .title-thin {
	color: #fff;
	font-size: 7.7px
}

.NutellaDay .wall-title {
	position: absolute;
	bottom: 50%;
	left: 10px;
	border-bottom: 0;
	padding-bottom: 2px;
	color: #fff
}

.NutellaDay .baseline {
	position: absolute;
	top: 2%;
	width: 100%;
	left: 0;
	text-align: center;
	font-size: 2.4em;
	color: #fff
}

.NutellaDay .custom {
	top: 20%
}

.NutellaDay .custom .title-thin {
	padding-bottom: 2px
}

.NutellaDay .Wall .tweet p {
	font-size: 13px;
	line-height: 17px;
	height: 62px;
	margin-left: 62px;
	opacity: .95;
	border-left: 1px solid hsla(0, 0%, 100%, .4)
}

.NutellaDay .Wall .pict {
	height: 48px;
	width: 48px;
	background-size: 48px 48px
}

.NutellaDay .Wall .box {
	height: 70px
}

.NutellaDay .UserFlowItem .item {
	width: 44px;
	height: 44px
}

.NutellaDay.NutellaDayWidget .custom {
	top: 5%
}

.NutellaDay .total-legacy .title-thin,
.NutellaDay .wall-title {
	font-size: 13px
}

.CrimesonActivity {
	position: absolute;
	background: rgba(0, 0, 0, .25)
}

.CrimesonActivity .time-column {
	position: absolute
}

.CrimesonActivity .legend .positive,
.CrimesonActivity .plot.positive {
	background: green;
	opacity: .45
}

.CrimesonActivity .legend .negative,
.CrimesonActivity .plot.negative {
	background: red;
	opacity: .4
}

.CrimesonActivity .legend .neutral,
.CrimesonActivity .plot.neutral {
	background: #90ee90;
	opacity: .4
}

.CrimesonActivity .legend {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	font-size: 12px;
	padding-top: 5px;
	color: hsla(0, 0%, 100%, .6)
}

.CrimesonActivity .legend label {
	display: inline;
	margin: 0 9px 0 0
}

.CrimesonActivity .legend span {
	display: inline-block;
	border: 1px solid hsla(0, 0%, 100%, .7);
	height: 9px;
	width: 9px
}

@font-face {
	font-family: Chunkfive;
	src: url("../../fonts/Chunkfive.ttf") format("truetype")
}

.SparkNews {
	overflow: hidden;
	font-size: 10px
}

.SparkNews .wrapper {
	background: url(../../img/custom/sparknews/bg.png) repeat-y 0 0;
	background-size: 100% 100%
}

.SparkNews .share {
	font-size: 20px;
	color: #ed8a46;
	position: absolute;
	right: 1%;
	top: 15px
}

.SparkNews .share i {
	border: 1px solid #ed8a46;
	display: inline-block;
	margin: 3px;
	border-radius: 30px;
	line-height: 30px;
	width: 30px;
	text-align: center
}

.SparkNews .SocialMediaShareButton {
	cursor: pointer;
	display: inline-block
}

.SparkNews header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	color: #505251;
	background: rgba(219, 231, 245, .35)
}

.SparkNews header p {
	padding: 4px 22% 0;
	margin: 0;
	text-align: center
}

.SparkNews .today {
	padding-top: 2%;
	font-family: Chunkfive, sans-serif;
	font-size: 1.6em;
	line-height: 1.1em
}

.SparkNews .follow {
	padding-top: 1%;
	font-family: Source Sans Pro, sans-serif;
	font-size: 1.8em;
	line-height: 1.1em
}

.SparkNews .follow span a {
	font-weight: 700;
	color: #ed8a46;
	font-family: Source Sans Pro, sans-serif!important;
	text-decoration: none
}

.SparkNews .follow strong {
	font-weight: 400;
	display: block;
	padding-top: .5em;
	font-size: 1.3em
}

.SparkNews .logo {
	display: block;
	float: left;
	margin: 0 0 0 1%;
	cursor: pointer;
	max-width: 448px;
	width: 19%
}

.SparkNews .over-scale {
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	transition: -webkit-transform .2s;
	transition: transform .2s;
	transition: transform .2s, -webkit-transform .2s
}

.SparkNews .over-scale:hover {
	-webkit-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2)
}

.SparkNews .logo img {
	display: block;
	width: 100%
}

@-webkit-keyframes fadeIn {
	0% {
		opacity: 0
	}
	70% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@keyframes fadeIn {
	0% {
		opacity: 0
	}
	70% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

.SparkNews .latest {
	-webkit-animation: fadeIn 1.5s;
	animation: fadeIn 1.5s;
	width: 100%;
	position: relative;
	background: rgba(0, 0, 0, .4);
	margin: 0;
	padding: 0;
	font-family: Source Sans Pro, sans-serif;
	font-size: 13px;
	font-weight: 700;
	height: 60px;
	overflow: hidden
}

.SparkNews .latest img {
	float: left;
	width: 60px;
	margin: 0 6px 0 0
}

.SparkNews .latest .text {
	margin: 0;
	padding: 0
}

.SparkNews .latest .text span span {
	margin: 0;
	padding: 0;
	color: #ed8a46!important
}

@-webkit-keyframes slideInLeft {
	0% {
		-webkit-transform: translateX(-100%);
		transform: translateX(-100%);
		opacity: 0
	}
	to {
		-webkit-transform: translateX(0);
		transform: translateX(0);
		opacity: 1
	}
}

@keyframes slideInLeft {
	0% {
		-webkit-transform: translateX(-100%);
		transform: translateX(-100%);
		opacity: 0
	}
	to {
		-webkit-transform: translateX(0);
		transform: translateX(0);
		opacity: 1
	}
}

.SparkNews .latest .tweet {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	transition: all .5s;
	-webkit-animation: slideInLeft .5s;
	animation: slideInLeft .5s;
	opacity: 1
}

.SparkNews .tweet a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%
}

.SparkNews .latest .tweet.before {
	-webkit-transform: translateX(100%);
	-ms-transform: translateX(100%);
	transform: translateX(100%);
	opacity: 0
}

.SparkNews footer {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%
}

.SparkNews .logos {
	display: block;
	width: 100%;
	background-color: #dfebf6;
	border-top: 3px solid #ed8a46;
	border-bottom: 3px solid #ed8a46
}

body,
html {
	overflow-x: hidden
}

body {
	margin: 0;
	padding: 0;
	background: #12151b url(../../map-dot.png) no-repeat center 0
}

.center {
	text-align: center
}

.blue-hr {
	margin: 0 auto 25px;
	display: block;
	background-color: #3ca9fb;
	height: 3px
}

.blue-linear-hr {
	height: 1px;
	background: url(../../bleu-linear-gradient.png) no-repeat top;
	background-size: 100% 100%
}

.map-dot {
	background: url(../../map-dot.png) no-repeat center 0
}

.title-thin {
	margin: 1em 0 0;
	padding: 0;
	border-bottom: 1px solid hsla(0, 0%, 100%, .4);
	font-size: 10px;
	letter-spacing: .1em
}

.big-number,
.title-thin {
	text-transform: uppercase
}

.big-number {
	font-weight: 700;
	display: block;
	line-height: 1.25em;
	font-family: Fjalla One
}

.button-primary {
	transition: background-color .2s
}

.error {
	color: #c30
}

input.error,
input.error:focus,
textarea.error,
textarea.error:focus {
	border-color: #c30
}

.flex-header {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}


/*# sourceMappingURL=main.7f16ed26.css.map*/