@charset "UTF-8";
/* CSS Document */

html, body, #index {
	height: 100%;
	min-height: 100%;
	font-family: Roboto, sans-serif;
	font-size: 14px;
	color: #475666;
	font-weight: 100
}
* {
	padding: 0;
	margin: 0;
	outline:none;
}
section {
	height: 100%;
	min-height: 100%;
	text-align: center;
	overflow: hidden;
}
section.Regulatory {
	height: 70%;
	min-height: 70%
}
.container {
	width: 1000px;
	margin: 0 auto;
	padding: 3% 0;
}
.twocolors {
	position: relative;
	z-index: 9;
	background: #333
}
.twocolors:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	right: 50%;
	bottom: 0;
	left: 0;
	background: #2f2f2f
}
#Home {
	background: #d9d3c6
}
#Home.twocolors:before {
	background: #e8e2d4
}
#Logdata {
	background: #e46566
}
#Logdata:before {
	background: #ca5253
}
#Average {
	background: #222836
}
#Average:before {
	background: #252c3f
}
#Solutions {
	background: #eec53b
}
#Solutions:before {
	background: #ffd74b
}
#Deploying {
	background: #6ed1a6
}
#Deploying:before {
	background: #5ec195
}
#Weather {
	background: #82cbe7
}
#Weather:before {
	background: #70b9d5
}
#Regulatory {
	background: #365e8a
}
#Regulatory:before {
	background: #3c699a
}
h1 {
	font-size: 12em;
	font-weight: 700;
	letter-spacing: 40px
}
h1 span:first-child {
	margin-left: 67px
}
h2 {
	height: 80px
}
h2 span {
	font-size: 2em;
	font-weight: 300
}
h2.slogan {
	opacity: 0
}
.fl {
	float: left
}
.fr {
	float: right
}
.clear:before, .clear:after {
	content: "\0020";
	display: block;
	height: 0;
	overflow: hidden
}
.clear:after {
	clear: both
}
.tow-bk {
	margin: 70px 0 0
}
.tow-bk div {
	width: 30%
}
.tow-bk div.tow1 {
	margin-top: 27px
}
.pr {
	position: relative
}
.pa {
	position: absolute
}
.tl {
	text-align: left
}
.tr {
	text-align: right
}
.tc {
	text-align: center
}
.hidden {
	opacity: 0
}
.tow-bk p {
	font-size: 3.5em;
	font-weight: 100;
	width: 40%;
	margin: 130px auto 0
}
span.cross {
	width: 220px;
	height: 6px;
	background: url(../images/tow-cross.png) repeat-x left top;
	position: absolute;
	bottom: 29px;
	left: 40px;
	display: block
}
.hide {
	display: none
}
.globe-cont {
	background: url(../images/siem-stars.png) no-repeat left top;
	min-height: 300px;
}
.star {
	background: #FDF5CE;
	width: 4px;
	height: 4px;
	border-radius: 100px;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	-o-border-radius: 100px;
	top: 15%;
	left: 22%;
	opacity: .7;
}
#Logdata h2, #Average h2, #Solutions h2, #Deploying h2, #Weather h2, #Regulatory h2, #Regulatory h3, .site-url {
	color: #FFF;
	font-size: 2em;
	font-weight: 100
}
.site-url {
	color: #696969;
	margin: 10px 0;
	font-size: 3em;
	text-decoration: none
}
.site-url:hover {
	color: #FFF
}
#Solutions h2 {
	color: #433735;
}
#Weather h2 strong {
	font-weight: 300;
}
#Weather h3 {
	font-weight: 300px;
	font-size: 4em;
	margin: 0 5%;
}
#Regulatory h3 {
	position: absolute;
	top: -50px;
	width: 200px;
	font-size: 2.5em;
}
#Average h2, #Average p, #Weather p {
	color: #bdb590;
	height: auto
}
#Average p, #Weather p {
	font-size: 1.2em;
	margin: 20px 0 0
}
#Solutions p, #Deploying h3 {
	font-size: 1.4em;
	font-weight: 300;
	margin: 10px 0 30px;
	color: #433735;
}
#Deploying h2, #Deploying h3 {
	color: #222b37;
}
#Deploying h3 {
	margin: 0;
}
#Weather h2 {
	height: auto;
}
#Weather h3 {
	color: #FFF;
	font-size: 4em;
	font-weight: 300
}
#Weather p {
	color: #FFF;
	margin-bottom: 30px;
}
#Logdata {
	position: relative
}
.ldata, .rdata {
	width: 18%;
	text-align: left;
	font-size: 1.2em;
	color: #FFF;
	font-weight: 100;
	position: absolute;
	bottom: 5%;
	left: 5%;
	line-height: 35px
}
.rdata {
	text-align: right;
	left: auto;
	right: 5%;
	bottom: 10%
}
.pieContainer {
	height: 500px;
	width: 500px;
	margin: 0 auto
}
.pieBackground {
	background-color: #f4f4db;
	position: absolute;
	width: 50px;
	height: 50px;
	-moz-border-radius: 500px;
	-webkit-border-radius: 500px;
	-o-border-radius: 500px;
	border-radius: 500px;
	margin: 0 auto
}
.pie {
	position: absolute;
	width: 500px;
	height: 500px;
	-moz-border-radius: 500px;
	-webkit-border-radius: 500px;
	-o-border-radius: 500px;
	border-radius: 500px;
	clip: rect(0,250px,500px,0)
}
.hold {
	position: absolute;
	width: 500px;
	height: 500px;
	-moz-border-radius: 500px;
	-webkit-border-radius: 500px;
	-o-border-radius: 500px;
	border-radius: 500px;
	clip: rect(0,500px,500px,250px)
}
#pieSlice1 .pie {
	background-color: #afea49;
	-webkit-transform: rotate(50deg);
	-moz-transform: rotate(50deg);
	-o-transform: rotate(50deg);
	transform: rotate(50deg)
}
#pieSliceBlue .pie {
	background-color: #afea49;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg)
}
.pieContainer.active #pieSliceBlue .pie {
	-webkit-transform: rotate(175deg);
	-moz-transform: rotate(175deg);
	-o-transform: rotate(175deg);
	transform: rotate(175deg);
	transition: all 1s linear 2s;
	-webkit-transition: all 1s linear 2s
}
.logdata-cont {
	top: 0px;
	width: 500px;
}
.logdata-cont>div {
	top: 250px;
	position: absolute
}
.ld1 {
	left: -100%
}
.ld2 {
	right: -100%
}
.paper {
	bottom: 0px;
	height: 547px;
	width: 278px;
}
.paper span {
	height: 0;
	display: block;
	overflow: hidden;
}
.anim-slow {
	-moz-animation: paralax 5s infinite;
	-webkit-animation: paralax 5s infinite;
	-o-animation: paralax 5s infinite;
	-ms-animation: paralax 5s infinite;
	-khtml-animation: paralax 5s infinite;
	animation: paralax 5s infinite
}
@-moz-keyframes paralax {
0% {
top:80px
}
25% {
top:87px
}
50% {
top:80px
}
75% {
top:87px
}
100% {
top:80px
}
}
@-webkit-keyframes paralax {
0% {
top:80px
}
25% {
top:85px
}
50% {
top:80px
}
75% {
top:85px
}
100% {
top:80px
}
}
@-o-keyframes paralax {
0% {
top:80px
}
25% {
top:87px
}
50% {
top:80px
}
75% {
top:87px
}
100% {
top:80px
}
}
@-ms-keyframes paralax {
0% {
top:80px
}
25% {
top:87px
}
50% {
top:80px
}
75% {
top:87px
}
100% {
top:80px
}
}
@-khtml-keyframes paralax {
0% {
top:80px
}
25% {
top:87px
}
50% {
top:80px
}
75% {
top:87px
}
100% {
top:80px
}
}
@keyframes paralax {
0% {
top:80px
}
25% {
top:87px
}
50% {
top:80px
}
75% {
top:87px
}
100% {
top:80px
}
}
.sglobe {
	margin: 0 auto;
	width: 506px;
	left: -4px
}
.smoon {
	left: -100%;
	top: 160px
}
.ssun {
	right: -100%;
	top: 140px
}
.sflight {
	left: 350px;
	top: 125px
}
.anim-flight {
	-moz-animation: flight 5s infinite;
	-webkit-animation: flight 5s infinite;
	-o-animation: flight 5s infinite;
	-ms-animation: flight 5s infinite;
	-khtml-animation: flight 5s infinite;
	animation: flight 5s infinite
}
@-moz-keyframes flight {
0% {
top:115px
}
25% {
top:120px
}
50% {
top:115px
}
75% {
top:120px
}
100% {
top:115px
}
}
@-webkit-keyframes flight {
0% {
top:115px
}
25% {
top:120px
}
50% {
top:115px
}
75% {
top:120px
}
100% {
top:115px
}
}
@-o-keyframes flight {
0% {
top:115px
}
25% {
top:120px
}
50% {
top:115px
}
75% {
top:120px
}
100% {
top:115px
}
}
@-ms-keyframes flight {
0% {
top:115px
}
25% {
top:120px
}
50% {
top:115px
}
75% {
top:120px
}
100% {
top:115px
}
}
@-khtml-keyframes flight {
0% {
top:115px
}
25% {
top:120px
}
50% {
top:115px
}
75% {
top:120px
}
100% {
top:115px
}
}
@keyframes flight {
0% {
top:115px
}
25% {
top:120px
}
50% {
top:115px
}
75% {
top:120px
}
100% {
top:115px
}
}
.yes-bounce {
	-webkit-animation: bounce 1s both 1;
	-moz-animation: bounce 1s both 1;
	-o-animation: bounce 1s both 1;
	animation: bounce 1s both 1
}
@-webkit-keyframes bounce {
0% {
-webkit-transform: translateY(0);
}
50% {
-webkit-transform: translateY(30px);
}
100% {
-webkit-transform: translateY(0px);
}
}
 @-moz-keyframes bounce {
0% {
-moz-transform: translateY(0);
}
25% {
-moz-transform: translateY(-30px);
}
50% {
-moz-transform: translateY(30px);
}
75% {
-moz-transform: translateY(-30px);
}
50% {
-moz-transform: translateY(0px);
}
}
 @-o-keyframes bounce {
0% {
-o-transform: translateY(0);
}
25% {
-o-transform: translateY(-30px);
}
50% {
-o-transform: translateY(30px);
}
75% {
-o-transform: translateY(-30px);
}
50% {
-o-transform: translateY(0px);
}
}
@keyframes bounce {
0% {
transform: translateY(0);
}
50% {
transform: translateY(30px);
}
100% {
transform: translateY(0px);
}
}
.no-bounce {
	-webkit-animation: shake 1s both 1;
	-moz-animation: shake 1s both 1;
	-o-animation: shake 1s both 1;
	animation: shake 1s both 1;
}
 @-webkit-keyframes shake {
0%, 100% {
-webkit-transform: translateX(0);
}
10%, 30%, 50%, 70% {
-webkit-transform: translateX(-10px);
}
20%, 40%, 60%, 80% {
-webkit-transform: translateX(10px);
}
}
 @-moz-keyframes shake {
0%, 100% {
-moz-transform: translateX(0);
}
10%, 30%, 50%, 70%, 90% {
-moz-transform: translateX(-10px);
}
20%, 40%, 60%, 80% {
-moz-transform: translateX(10px);
}
}
 @-o-keyframes shake {
0%, 100% {
-o-transform: translateX(0);
}
10%, 30%, 50%, 70%, 90% {
-o-transform: translateX(-10px);
}
20%, 40%, 60%, 80% {
-o-transform: translateX(10px);
}
}
 @keyframes shake {
0%, 100% {
transform: translateX(0);
}
10%, 30%, 50%, 70%, 90% {
transform: translateX(-10px);
}
20%, 40%, 60%, 80% {
transform: translateX(10px);
}
}
.rotate {
	-webkit-animation: spin 20s linear infinite;
	-moz-animation: spin 20s linear infinite;
	animation: spin 20s linear infinite
}
.rotate1 {
	-webkit-animation: spin 50s linear infinite;
	-moz-animation: spin 50s linear infinite;
	animation: spin 50s linear infinite
}
@-moz-keyframes spin {
100% {
-moz-transform:rotate(360deg)
}
}
@-webkit-keyframes spin {
100% {
-webkit-transform:rotate(360deg)
}
}
@keyframes spin {
100% {
-webkit-transform:rotate(360deg);
transform:rotate(360deg)
}
}
.bright {
	-webkit-animation: glow 3s linear infinite;
	-moz-animation: glow 3s linear infinite;
	animation: glow 3s linear infinite
}
.siren-bright {
	-webkit-animation: glow .8s linear infinite;
	-moz-animation: glow .8s linear infinite;
	animation: glow .8s linear infinite
}
@-webkit-keyframes glow {
0% {
opacity:1
}
50% {
opacity:.2
}
100% {
opacity:1
}
}
@-moz-keyframes glow {
0% {
opacity:1
}
50% {
opacity:.2
}
100% {
opacity:1
}
}
@-o-keyframes glow {
0% {
opacity:1
}
50% {
opacity:.3
}
100% {
opacity:1
}
}
@keyframes glow {
0% {
opacity:1
}
50% {
opacity:.2
}
100% {
opacity:1
}
}
@-webkit-keyframes flip {
0% {
-webkit-transform:scaleX(-1)
}
50% {
-webkit-transform:scaleX(1)
}
100% {
-webkit-transform:scaleX(-1)
}
}
@-moz-keyframes flip {
0% {
-moz-transform:scaleX(-1)
}
50% {
-moz-transform:scaleX(1)
}
100% {
-moz-transform:scaleX(-1)
}
}
@-o-keyframes flip {
0% {
-o-transform:scaleX(-1)
}
50% {
-o-transform:scaleX(1)
}
100% {
-o-transform:scaleX(-1)
}
}
@keyframes flip {
0% {
transform:scaleX(-1)
}
50% {
transform:scaleX(1)
}
100% {
transform:scaleX(-1)
}
}
.fixed-bar{
	position:fixed;
	top:34%;
	right:0px;
	z-index:9999999999;
	width:38px;
}
.share-block{
	text-align:right;
	padding-left:3px;
}
.share-block a{
	display:block;
	width:38px;
	height:35px;
}
.share-block a:hover{
	opacity:.9;
}
.shome a, .sdownload a{
	padding:10px 10px 10px 35px;
	color:#FFF;
	font-size:14px;
	display:block;
	text-decoration:none;
	width:100px;
}
.shome a{
	background:#5abc29 url(../images/icon-home.png) no-repeat 8px center;
}
.sdownload a{
	background:#5abc29 url(../images/icon-download.png) no-repeat 8px center;
}
div.sdownload, div.shome{
	left:3px;
	-webkit-transition: left .3s  ;
	-moz-transition: left .3s;
	transition: left .3s;
	padding-top:10px;
	position:relative;
}
div.shome:hover{
	left: -60px;
}
div.sdownload:hover{
	left:-100px;
}
.flip-cont {
	-webkit-animation: flip .8s linear infinite;
	-moz-animation: flip .8s linear infinite;
	animation: flip .8s linear infinite;
	opacity: .8
}
.g50, .g25, .g75 {
	float: left
}
.g50 {
	width: 50%
}
.g25 {
	width: 25%
}
.g75 {
	width: 75%
}
.siren {
	margin: -40px auto -100px auto;
	width: 222px
}
.siren-ring {
	top: 55px;
	left: 77px
}
.siren-light {
	left: 0;
	top: 0
}
.ladder, .ladder2 {
	bottom: -550px;
	vertical-align: bottom;
	height: 548px;
	left: 0
}
.ladder2 {
	left: auto;
	right: 0
}
.ladder img {
	margin-top: 17px;
}
.ladder h3 {
	top: 10%;
	right: 20%;
}
.ladder2 h3 {
	top: 10%;
	left: 42%;
}
#Deploying .container {
	min-height: 100%
}
h4.yes, h4.no {
	position: absolute;
	top: 55%;
	left: 7%;
	color: #FFF;
	font-size: 2em;
	font-weight: 100;
	width: 200px
}
h4.no {
	left: auto;
	right: 7%;
	color: #4b93af
}
.chart {
	width: 800px;
	margin: 0 auto;
	height: 350px;
	overflow: hidden;
	padding-top: 100px
}
.chart .g25 {
	background: #6386ad;
	height: 350px;
	margin-top: 350px
}
.chart .g25 img {
	margin-top: 30px
}
ul.menu {
	position: fixed;
	right: 60px;
	top: 40%;
	width: 20px;
	z-index: 999999999;
	list-style: none
}
ul.menu li {
	padding: 5px;
	margin: 0
}
ul.menu li a {
	width: 10px;
	height: 10px;
	border-radius: 50px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	-o-border-radius: 50px;
	background: #FFF;
	text-indent: -9999em;
	display: block;
	padding: 0;
	margin: 0
}
ul.menu li a.active {
	background: #555;
}
.des-cont {
	color: #999;
	line-height: 25px;
	margin: 150px 20px 0 20px;
}
.count-val {
	font-size: 3.5em;
	font-weight: 300;
	color: #5e646c;
	top: 20px;
	left: 20%;
	width: 200px
}
.c2 {
	left: 41%;
}
.globenew {
	width: 0;
	height: 0
}
.cloud1 {
	left: 25%;
	-moz-animation: cmove 7s infinite;
	-webkit-animation: cmove 7s infinite;
	-o-animation: cmove 7s infinite;
	-ms-animation: cmove 7s infinite;
	-khtml-animation: cmove 7s infinite;
	animation: cmove 7s infinite;
}
.cloud2 {
	left: 45%;
	-moz-animation: cmove 7s infinite;
	-webkit-animation: cmove 7s infinite;
	-o-animation: cmove 7s infinite;
	-ms-animation: cmove 7s infinite;
	-khtml-animation: cmove 7s infinite;
	animation: cmove 7s infinite;
}
@-moz-keyframes cmove {
0% {
top:450px
}
25% {
top:454px
}
50% {
top:450px
}
75% {
top:454px
}
100% {
top:450px
}
}
@-webkit-keyframes cmove {
0% {
top:450px
}
25% {
top:454px
}
50% {
top:450px
}
75% {
top:454px
}
100% {
top:450px
}
}
@-o-keyframes cmove {
0% {
top:450px
}
25% {
top:454px
}
50% {
top:450px
}
75% {
top:454px
}
100% {
top:450px
}
}
@-ms-keyframes cmove {
0% {
top:450px
}
25% {
top:454px
}
50% {
top:450px
}
75% {
top:454px
}
100% {
top:450px
}
}
@-khtml-keyframes cmove {
0% {
top:450px
}
25% {
top:454px
}
50% {
top:450px
}
75% {
top:454px
}
100% {
top:450px
}
}
@keyframes cmove {
0% {
top:450px
}
25% {
top:454px
}
50% {
top:450px
}
75% {
top:454px
}
100% {
top:450px
}
}

 
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
html, body, #index {
	font-size: 10px;
}
.container, .chart, .logdata-cont {
	width: 95%;
}
#Deploying .ladder img {
	width: 100%;
	height: auto;
}
.ld1 img, .ld2 img {
	width: 70%;
	height: auto;
}
span.cross {
	width: 180px;
}
.ldata {
	left: 0px;
}
.rdata {
	right: 0px;
}
.ladder2 h3 {
	left: 70%;
}
.sglobe img.globenew {
	width: 300px !important;
	height: auto !important;
	margin-top: 70px;
}
.ladder img {
	margin-top: 100px;
}
}
 
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
html, body, #index {
	font-size: 10px;
	line-height: inherit;
}
.container, .chart, .logdata-cont {
	width: 95%;
}
img {
	width: 85%;
	height: auto;
}
.g50 img, .g25 img {
	width: 95%;
}
.ladder, .ladder2 {
	height: auto;
}
.siren {
	margin: -50px auto;
	width: 150px;
}
.siren-light {
	display: none;
}
.siren-ring {
	top: 25px;
	left: 52px;
	width: 45px;
}
h4.yes, h4.no {
	top: 70%;
	width: auto;
}
#Weather .container {
	min-height: 100%;
}
.sglobe {
	width: 80%;
}
.pieContainer {
	width: 80%;
}
.globenew, #Logdata .pieContainer, #Logdata .pieBackground, #Logdata #pieSliceBlue, .pieContainer.active #pieSliceBlue .pie {
	width: 250px !important;
	height: 250px !important;
}
.logdata-cont > div {
	width: 40%;
	top: 130px !important;
}
#Solutions .g50 img {
	width: 25%;
}
.c1, .c2 {
	width: auto;
	top: 110px;
	left: 40%;
}
.c2 {
	left: 55%;
}
.des-cont {
	margin-top: 20px;
	line-height: 12px;
}
h1 span:first-child {
	margin-left: 20px;
}
#Regulatory h3 {
	width: auto;
}
span.cross {
	display: none;
}
}
 
/* Landscape phones and down */
@media (max-width: 480px) {
html, body, #index {
	font-size: 8px;
	line-height: auto;
}
.ldata, .rdata {
	line-height: 12px;
}
h1 span {
	font-size: 30px;
}
.globenew, #Logdata .pieContainer, #Logdata .pieBackground, #Logdata #pieSliceBlue, .pieContainer.active #pieSliceBlue .pie {
	width: 150px !important;
	height: 150px !important;
}
.tow-bk p {
	font-size: 1.5em;
}
.c1, .c2 {
	top: 15px;
}
.c1 {
	left: 16%;
}
.smoon, .ssun {
	top: 130px;
	width: 70px;
}
.smoon img {
	width: 40%;
	height: auto;
}
.ssun img {
	width: 70%;
	height: auto;
}
#Solutions .g50 img {
	width: 20%;
}
.ladder2 img, .ladder img {
	width: 54%;
}
.weather-block img, .chart img {
	width: 35%;
}
.chart .g25 img {
	margin-top: 5px;
}
.chart {
	padding-top: 30px;
	height: 200px;
}
#Regulatory h3 {
	top: -30px;
}
.chart .g25 {
	height: 200px;
}
.sflight {
	left: 35% !important;
	top: 55px;
}
.sflight img {
 width:50%:
}
@-webkit-keyframes cmove {
0% {
top:200px
}
25% {
top:207px
}
50% {
top:200px
}
75% {
top:207px
}
100% {
top:200px
}
}
@keyframes cmove {
0% {
top:200px
}
25% {
top:207px
}
50% {
top:200px
}
75% {
top:207px
}
100% {
top:200px
}
}	
@-webkit-keyframes flight {
0% {
top:15px
}
25% {
top:20px
}
50% {
top:15px
}
75% {
top:20px
}
100% {
top:15px
}
}
}



