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

html,body{
height:100%;
font-family: 'Roboto', sans-serif!important;
}

body{
font-family: 'Roboto', sans-serif!important;
}
h1, h2, h3, h4, h5, h6{
font-weight:200;
font-family: 'Roboto', sans-serif!important;
}
li {
	list-style:none;
	font-weight:300;
	font-size:14px!important;
}
p{
font-weight: 300;
font-size:16px;
}
img{
border:none;
width:100%;
max-width: none;
}

.container{
max-width:1400px;
margin-left:auto;
margin-right:auto;
padding:20px;
}

li.current a{
color:#00a4ff !important;
}

.fullframe{
min-height:100%;
background-size:cover;
}

.slide{
	background-attachment:fixed;
	background-size:100%;
	width:100%;
	position: relative;}
.front{
	z-index:500;
}
.shadow{
	box-shadow:0px 0px 8px #000;
}
.white-panel{
	background-color:#fff;
	box-shadow:0px 0px 8px #ccc;
}
#down-button {
margin-top: -40px;
width: 77px;
margin-left: auto;
margin-right: auto;
z-index: 1000;
position: relative;
}
.scroll-holder{
margin-top: -12%;
padding-bottom: 12%;
}
.text-center{
text-align:center;
}
#feature1{
	top:20%;
	left:20%;
}
#hovers{
position:absolute;
height:100%;
width:100%;
top:0px;
left:0px;
background-size:100%;
}
.pop {
  position: absolute;
  display: inline;
 }
.pop_menu {
    display: none;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px; }
.feature-modal {
    background-image: url(../images/techhotspot.png);
    background-repeat: no-repeat;
    background-position: center center;
    width: 50px;
    height: 50px;
    overflow: hidden;
    cursor: pointer;
	background-size:cover; }
	
	#feature5 .feature-modal{
	background-image: url(../images/remote-feature.png);
	}
	#feature2 .feature-modal{
	background-image: url(../images/shake-feature.png);
	}
	#feature3 .feature-modal{
	background-image: url(../images/token-feature.png);
	}
	#feature4 .feature-modal{
	background-image: url(../images/battery-feature.png);
	}
	
	#feature1{
		left:45%;
		top: 12%;
		position:absolute;
	}
	#feature2{
		left:36%;
		top: 74%;
		position:absolute;
	}
	#feature3{
		left:20%;
		top: 32%;
		position:absolute;
	}
	#feature4{
		left:53%;
		top: 35%;
		position:absolute;
	}
	#feature5{
		left:74%;
		top: 61%;
		position:absolute;
	}
[data-magellan-expedition] {
	padding:0px;
	z-index:1500;
	top:0px !important;
	box-shadow:0px 0px 8px #f9f9f9;
}
[data-magellan-expedition] a span{
	margin-left:auto;
	margin-right:auto;
	color:#444 !important;
	line-height: 2.1;
	font-weight: 300;
	font-size: 16px;

}

[data-magellan-expedition] a.active span{
background-color:#00a4ff;
padding: 12px;
color:#fff !important;
}
.active .pop_menu {
  display: block;
background-color: #fff;
color: #fff;
position: absolute;
padding: 20px;
width: 600px;
color: #444;
opacity: 1;
box-shadow: 0px 0px 8px #f1f1f1;
z-index:1200;
margin-top:-100px;
  }
  .active .pop_menu a {
    color: #fff; }
	
.active .pop_toggle {
  z-index: 2000;
  position: absolute;
  top: 0;
  left: 0;
  background-image: url(/images/arrow-up.gif); }
  
.active_close{
position:absolute;
top:0px;
right:0px;
background-color:#00a4ff;
color:#fff;
font-weight:bold;
padding:5px;
}
  
/* Header Styles */
/*
.top-bar, .top-bar-section ul, .top-bar-section li a:not(.button), .top-bar-section ul li > a {
background-image:url(../images/header.jpg);
}
*/
.top-bar{
margin-bottom:0px;
z-index:1000;
position:relative;
}
/* Homepage Styles */
.orbit-container .orbit-slides-container img {
width:100%;
}
.orbit-bullets{
display:none;
}
#homepage-kicker{
padding:1%;
}
.hidden{
	display:none;
}
#kicker-container{
background-image:url(../images/homepage/homepage-transparency.png); 
position:absolute; 
bottom:0px;
}
.orbit-prev, .orbit-next{
	display:none;
}
#homepage-image-1 {
	height:100%;
	width:100%;
	background-size:cover;
	background-position:top;
	background-image:url(../images/homepage/home-0.jpg);
}
#carousel, #fullframe, .boom{
height:100%;
overflow:hidden;
}
#header{
position:absolute;
width:100%;
}
.top-bar, .top-bar-section ul li > a, .top-bar-section li a:not(.button),.top-bar-section ul {
background:none;
font-size:13px;
}
.large10pad{
padding:10%;
}
.large5pad{
padding:10%;
}
.top-bar-section ul {
margin-right:20px;
}
#homepage-band {
right:0px; 
width:100%; 
z-index:100; 
background-image:url(../images/homepage/homepage-transparency.png); 
height:180px; 
margin-top:-245px;
background-repeat:repeat;
z-index:1000;
position:relative;
padding:20px;
}
.homepage-hero-text{
position: absolute;
top: 50%;
width: 40%;
text-align: left;
right: 0%;
z-index: 1;
background-image: url(../images/blk.png);
padding: 30px;
}

.homepage-hero-text h1,.homepage-hero-text p{
color:#fff !important;
text-shadow:0px 0px 18px #000;
}
.active{
color:#fff;
background-color:#00aeff;
}
#homepage-slider-0{
	background-image:url('../images/back1.jpg');
	height:80%;
}
#homepage-slider-1{
	background-color:#fff;
}
#homepage-slider-2{
	background-image:url('../images/back2.jpg');
	height:80%;
}
#homepage-slider-3{
	background-color:#fff;
}
#homepage-slider-4{
	background-image:url('../images/back3.jpg');
	height:80%;
}
#homepage-slider-5{
	background-color:#fff;
}
#homepage-slider-6{
	background-image:url('../images/back4.jpg');
	height:80%;
}
#top-level-navigation ul li a {
border-right: none;
color: #999;
font-size: 16px;
line-height: 18px;
}
.row, .row .row{
margin:0px;
}
#down-button{
width: 77px;
margin-left: auto;
margin-right: auto;
z-index: 1000;
position: relative;
margin-top:-42px;
}
.reveal-modal .close-reveal-modal {
z-index:10000000;
}
#footer{
	background-color:#050505; 
	position: absolute; 
	width: 100%; 
	z-index: 20; 
}

#footer-icons {
	margin-top:15px;
	margin-bottom: 10px;
	text-align:right;
		
}
.full-height { display: table;  }
#footer p {
	font-size:12px;	
	color: #f6f6f6;
}
#footer a {
	color:#fff;
	font-size:13px;
}

#footer-icon-container {
	width:31.3%;
	margin-left:1%;
	margin-right:1%;
	float:right;
	max-width: 30px;
}
.copyright-text{
	text-align:left;
	margin-top:20px;
	color:#999 !important;
}
#subpage-frame-small {
max-width: 80%;
box-shadow: 0 0 15px rgba(0,0,0,0.13);
margin-left: auto;
margin-right: auto;
margin-top: -100px;
min-height: 80%;
padding-bottom: 75px;
padding-top: 20px;
height: auto;
z-index: 20;
position: relative;
background-color:#fff;
}
#subnavigation {
height: 45px;
background-image: url(../images/subnavigationtitle.png);
background-repeat: repeat;
width: 100%;
z-index: 999;
margin:0px;
padding:0px;
}
#subnavigation ul{
margin:0px;
padding:0px;
}
#subnavigation ul li {
list-style: none;
float: left;
padding-top: 2px;
}
#subnavigation-label {
height: 40px;
color: #c5c5c5;
text-align: center;
margin-top: 14px;
padding-left: 10px;
padding-right: 10px;
font-size: 12px;
}
#subnavigation-label.current {
color: #09F;
}
#video-container{
height:100%;
transition: opacity 1 ease-in-out;
-moz-transition: opacity 1 ease-in-out;
-webkit-transition: opacity 1s ease-in-out;
opacity:0;
}
.top-bar-section ul li > a {
font-size:12px;
}
.top-bar-section ul li > a.button {
font-size:12px;
}
#main-logo{
animation:none;
-moz-animation: none;
-webkit-animation: none;
-o-animation: none; 
margin-top:5px; 
margin-bottom: 20px; 
width:250px;
}
input, .button, form{
-webkit-appearance: none;
Safari CSS notes on --webkit-appearance
Mozilla Developer Network's --moz-appearance
}
#submit-box{
padding:5px; 
background-image:url(../images/blk.png); 
width:40%; 
margin-left:auto; 
margin-right:auto;
}
#home-down{
width:5%;
margin: auto;
margin-top: 30px;
}
.touch #video-container{
height:100%;
}
#homepage-token{
width:70%;
}
.mail-form-box{
background-color:#00a4ff;
color:#fff;
text-align:center;
width:30%;
position:relative;
padding:10px;
z-index: 1;
margin-top: -38px;
margin-left: 68%;
}
#mail-form-modal{
text-align:center;
}
.floatingHeader {
  position: fixed;
  top: 0;
  visibility: hidden;
  background-color:#000;
  width:100%;
  height:40px;
  z-index:2000;
  text-align:center;
  padding:10px;
}
#homer .floatingHeader {
  z-index:-20;
  visibility:visible;
  }
.floatingHeader a{
margin-top:5px;
color:#fff !important;
font-size:14px;
}
.floatingHeader a.current {
color:#00a4ff !important;
}
#floatylogo{
width: 75%; 
margin-top:-5px; 
text-align:left;
}
#floatylogo.home{
width: 100%; 
margin-top:5px; 
text-align:left;
max-height: 30px;
max-width: 180px;
}
.hupso_toolbar{
display:none !important;
}
#downner-button{
background-color:none !important;
}
a:link#downner-button.active, a:active#downner-button.active, a:visited#downner-button.active, a:hover#downner-button.active{
background-color:none !important;
background:none !important;
color:none !important;
}
#big-video{
	height:100%;
	width:auto;
}
.touch .reveal-modal.tiny {
	width:50%;
	left:40%;
}
.touch #downner-button{
	display:none !important;
	}
.slide img{
	display:none;
}
.coming-soon-text{
	text-align:center;
	color:#fff;
	font-size:18px;
	position:absolute;
	width: 30%;
	left:68%;
	margin-top:-122px;
}
.touch #video-container{
height:100%;
}
@media only screen and (max-width: 1280px) {
	#video-container{
		height:100%;
	}
	#big-video{
	height:100%;
	width:auto;
}
}
/* Used to alter styles for screens at least 1280px wide. */
@media only screen and (min-width: 1280px) {
	#video-container{
		height:100%;
	}
	#big-video{
	height:100%;
	width:auto;
}
	}
@media only screen and (max-width: 1000px) {
	.homepage-hero-text{
	margin-top:7.5%;	
		}
	.slide{
		background-image:none !important;
		height:auto !important;
	}
	.slide img{
		display:block;
	}
	.top-bar, .top-bar-section ul li > a, .top-bar-section li a:not(.button), .top-bar-section ul {
background: #000;
}
.top-bar-section ul {
margin-right: 0px;
}
#footer-icon-container {
max-width:20px;
}
#main-logo{
width:190px !important;
}
#submit-box{
width:80%; 
}
#homepage-token{
width:100%;
}
#big-video{
	height:100%;
	margin-left:-20%;
	width:auto;
}
.mail-form-box{
width:50%;
margin-left:25%;
}
.coming-soon-text{
	width: 100%;
	left:0px;
}
#floatylogo{
width:100%;
margin-top:0px;
}
}

/* Used to alter styles for screens at least 768px wide. This is where the grid changes. */
@media only screen and (max-width: 768px) {
	h1, h2, h3, h4, h5, h6{
	text-align:center;
	}
	
	#footer-icons {
	text-align:center;	
}
.mail-form-box {
width:90%;
margin-left:auto;
margin-right:auto;
}
#home-down{
width:15%;
margin-top:40px;
}
#footer a {
	color:#fff;
	font-size:10px;
	text-align:center !important;
}

#footer-icon-container {
	width:20%;
	margin-left:6%;
  margin-right:6%;	
  text-align:center;
  max-width:none;
}

.copyright-text{
	text-align:center;
	margin-bottom:20px;
}

#contactpage-text{
	text-align: center !important;	
}
.top-bar, .top-bar-section ul li > a, .top-bar-section li a:not(.button), .top-bar-section ul {
background: #000;
}
.top-bar-section ul {
margin-right: 0px;
}

#batteries{
padding-top:30px;
padding-bottom:30px;
}
#video-container{
height:100%;
background-image:url(../images/home-1.jpg);
background-position-x:50%;
background-size:300%;
}
.touch #video-container{
height:100%;
}
.large10pad{
padding:0%;
}
.large5pad{
padding:2.5%;
}
.button{
width:100%;
}
#big-video{
display:none !important;
}
.homepage-hero-text{
background-image: url(../images/blk.png);
padding-left: 1%;
padding-right: 1%;
width: 100%;
margin-left: 0px;
margin-top: 20%;
text-align: center;
}
.touch .reveal-modal.tiny {
	width:90%;
	margin-left:auto;
	margin-right:auto;
	left:5%;
	right:5%;
}
}
@media only screen and (max-height: 600px) {
	#big-video{
	display:none !important;
}
#video-container{
		height:120%;
	}
	#downner-button{
	display:none !important;
	}
}
@media only screen and (max-height: 400px) {
	.homepage-hero-text{
	position:static;
	padding-bottom:30px;
	}
	#video-container{
		height:auto;
	}
}
/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
.touch #video-container{
		height:98% !important;
	}
}
/* about pages */
