body {background : #FFA408; color: #fff; padding : 0; margin : 0; font-family: "Roboto Condensed", Arial, sans-serif; font-weight:600;}

h1 { font-size:60px; margin:0; font-family: "HelveticaNeue-CondensedBold", "HelveticaNeueBoldCondensed", "HelveticaNeue-Bold-Condensed", "Helvetica Neue Bold Condensed", "HelveticaNeueBold", "HelveticaNeue-Bold", "Helvetica Neue Bold", "HelveticaNeue", "Helvetica Neue", 'TeXGyreHerosCnBold', "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif; font-weight: 600; font-stretch: condensed;}
h2 { font-size:25px; color: #FFA408; margin:0; font-weight:normal;}
h3 { font-size : 40px; margin : 10px 0; line-height : 130%; font-weight:300;}
h4 {font-size:30px; margin:10px 0; opacity:0.5;}

p {font-size:18px; }

hr {border: 0; height: 1px; margin:20px 0; background: rgba(0,0,0,0.1);}

header {background:#000; text-align: center; }
header a {padding:10px 10px; font-size:15px; color:#fff; display:block; width:100%; text-align: center;}
header a:hover {text-decoration: underline; color:#fff;}


ul {/*list-style:none; */margin-top:30px; margin-bottom:24px; font-size:24px; text-align: left;}
ul li {color:#333;/* padding:0; margin:10px 0; width:45%;*/}

.u-bg-orange h1 {color:#fff;}
.u-bg-orange h2 {color:#000; opacity:0.5;}
.u-bg-orange h3 {color:#fff; opacity:1;}
.u-bg-orange h4 {color:#fff;}

.sectiontext {text-align: center; margin-bottom:30px;}

.avail { font-size : 20px; color: rgba(255, 255, 255, 0.6); }

.container { clear: both; width:95%; max-width: 1150px; min-width: 320px; margin: 0 auto; }

.hero {
    background:url('/img/hero.jpg'); 
    background-size: cover; 
    background-position: top center;
    position: relative;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to bottom, 
        rgba(0,0,0,0) 0%,
        rgba(0,0,0,0.3) 50%,
        rgba(0,0,0,0.7) 100%);
}

.hero .container {
    position: relative;
    min-height: 700px;
    z-index: 1;
}
.hero h3 {color:#FFA408; margin:0 0 0 -15px; font-size:25px; text-align: center; background:rgba(255, 255, 255, 0.8); padding:10px 20px; border-radius: 3px; position:absolute; bottom:20px;}
.hero h1 {font-size:74px; position:absolute; bottom:80px; text-shadow:0 0 30px rgba(0,0,0,0.7);}

.intro ul {list-style:square; margin:20px 30px; padding: 0 25px; color:#fff;}
.intro ul li {padding-left: 25px; list-style:square;}
.intro p {font-size:24px; color:rgba(0,0,0,0.7);}
.intro .mainscreenshot {width:120%; margin-left:-20%;}

.u-bg-orange ul li {color:#fff;}

.deviceimages {width:100%; list-style: none; margin:0; padding:0;}
.deviceimages li {width:49%; display: inline-block; margin:0; padding:0; text-align: center;}
.deviceimages img {height:auto;}
.deviceimages li:nth-of-type(1) img {width:150px;}
.deviceimages li:nth-of-type(2) img {width:200px;}

.u-move-up {margin-top:-100px;}
.u-move-upmore {margin-top:-150px;}
.u-fullwidth {width:100%; height:auto;}
.u-shadow {-webkit-filter: drop-shadow(0 20px 20px rgba(0,0,0,0.5)); filter: drop-shadow(0 20px 20px rgba(0,0,0,0.5));}
.u-colcenter {text-align: center;}
.u-bg-white {background:#fff; color:#333;}
.u-bg-orange {background:#FFA408; color:#333;}
.u-bg-grey {background:#eee; color:#333; text-align:center;}
.u-vertpadding-30 .container {padding:30px 0;}
.u-vertpadding-50 .container {padding:50px 0;}
.u-vertpadding-150 .container {padding:150px 0;}

.buttondownload {width:100%; margin:0px 0;}
.buttondownload img { margin:10px 10px; height: 60px; -webkit-filter: drop-shadow(0 20px 20px rgba(0,0,0,0.5)); filter: drop-shadow(0 20px 20px rgba(0,0,0,0.5));}
.buttondownload:hover img {opacity:0.9; -webkit-filter: drop-shadow(0 10px 10px rgba(0,0,0,0.7)); filter: drop-shadow(0 10px 10px rgba(0,0,0,0.7));}

.applehealth { width: 100%; margin: 10px auto; }
.applehealth img { margin: 10px 20px; height: 60px; }

.clearfix { clear: both; }

.info-container { display: table; }

.info { font-size : 28px; line-height : 130%; }
.info span { font-size : 20px; color: rgba(255, 255, 255, 0.7); }

ul { margin : 0; }
li { margin-top : 0px; margin-bottom: 0px; line-height : 130%; padding: 8px;}

.finaldownload { margin : 50px auto 0px auto; text-align: center; }
.finaldownload img { height: 60px; }
.finaldownload .buttondownload {margin-top:10px;}

.apple-tv {background:rgba(0,0,0,0.1); display:inline-block; border-radius: 5px; padding:10px 20px; margin : 50px auto; text-align: center; color: rgba(0, 0, 0, 0.75); font-size:20px;}
.apple-tv img { width : 50px; height : 50px; vertical-align: middle; margin-right : 10px; }
.apple-tv strong {  color: rgba(0, 0, 0, 1); font-weight:bold;}

.android { text-align : center; margin : 10px 0 0 0; }

.download { margin : 20px auto 100px auto; text-align: center; }
.download img { width : 200px; }

a { color : rgba(255, 255, 255, 0.8); }

footer { text-align : center; margin: 50px auto 0 auto; padding-top : 20px; font-size : 13px; font-weight : 100; }
footer .container {padding:30px 0; border-top : 1px solid rgba(255, 255, 255, 0.3);}

footer a {color:#fff; text-decoration: underline;}
footer a:hover {color:#fff; opacity:0.8;}

footer ul {list-style: none; margin:20px 0; padding:0; font-size:18px; opacity:0.8; text-align:center;}
footer ul li {margin:0; padding:0 20px; display:inline-block; border-left:1px solid rgba(0,0,0,0.1); width:initial;}
footer ul li:first-of-type {padding-left:0; border-left:0;}

.upsell { text-align : center; background: rgba(0, 0, 0, 0.2); border-radius: 8px; margin: 40px auto; padding: 20px 10px; font-family : Helvetica, Arial, sans-serif; font-size : 16px; font-weight : 100; }
.upsell a { font-weight: bold; color: #fff; }

#privacy { text-align: left; font-family: Helvetica, arial, sans-serif; font-weight: normal; font-size : 16px; line-height : 26px; margin-top : 40px; }
#privacy h3 { font-size : 22px; margin : 20px 0; padding-top : 20px; border-top : 1px solid rgba(255, 255, 255, 0.2); }

#google_translate_element { margin-top : 30px; }

@media (max-width:768px) {

    h3 {font-size:24px; text-align: center;}
    h4 {font-size:24px; text-align: center;}
    p {font-size:18px;}
    ul {font-size:24px; margin:20px 0;}

    .container {width:95%;}
    .hero .container {min-height:500px;}
    .hero h3 {text-align: center; bottom:initial; top:90px; padding-top:5px; padding-bottom:5px; font-size:15px; margin:0 auto; left:50%; transform:translatex(-50%);}
    .hero h1 {text-align: center; bottom:initial; font-size:60px; top:20px; margin:0 auto; left:50%; transform:translatex(-50%);}
    
    .intro h3 {text-align: left; font-size:24px;}
    .intro ul {text-align: left; font-size:24px;}
    .intro ul li {width:100%; border:0; padding:0; margin:0;}
    .intro .mainscreenshot {width:80%; margin-left:0%;}

    .u-vertpadding-30 .container {padding:30px 0;}
    .u-vertpadding-50 .container {padding:50px 0;}
    .u-vertpadding-150 .container {padding:50px 0;}

    .deviceimages li {width:32%;}
    .deviceimages li:nth-of-type(1) img {width:50%; max-width:100%;}
    .deviceimages li:nth-of-type(2) img {width:80%; max-width:100%;}
    .deviceimages li:nth-of-type(3) img {width:50%; max-width:100%;}

    .u-fullwidth {width:80%; margin-bottom:40px; margin-left:auto; margin-right:auto;}


    .u-move-up {margin-top:30px;}
    .u-move-upmore {margin-top:30px;}

    .buttondownload {width:50%; text-align: center; }

    .apple-tv { padding:10px 10px; margin : 30px auto; font-size:18px;}
    .apple-tv img { width : 30px; height : 30px;}

    footer ul li {width:100%; padding:0; margin:0; border:0;}

}

.sticky-navigation {
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    background:transparent;
    border: none;
    padding:10px 0 !important;
    margin-bottom: 0 !important;
    -webkit-backface-visibility: hidden;
    top:0px;
}

.sticky-navigation.scrolled {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    background: rgba(43, 43, 42, 0.6) !important;
}

.navbar{
    margin-bottom: 0px;
	background:rgba(43, 43, 42, 0.2) !important;
}
.navbar-nav {
    float: left;
    margin: 0px !important;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.nav-logo{
    padding: 0px 15px;
    height: 50px;
    width: 250px;
    overflow: hidden;
}
.nav-logo:focus{
    outline: none;
}
.nav-logo img{
    height: 50px;
}

.logo {
    font-size: 40px;  /* 默认大尺寸 */
    font-weight: bold;
    color: white;
}

@media (max-width: 992px) {
    .logo {
        font-size: 36px;
    }
}

@media (max-width: 768px) {
    .logo {
        font-size: 32px;
    }
}

@media (max-width: 576px) {
    .logo {
        font-size: 28px;
    }
}

.navbar-toggler-icon { 
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 1.0)' stroke-width='3' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
    display: inline-block;
    width: 1.5em;
    height: 1.5em;
    vertical-align: middle;
    content: "";
    
    background-size: 100% 100%;
 } 

 .app-icon {
    width: 50px;
    height: 50px;
    border-radius: 10%;
 }

 .feature_row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(var(--bs-gutter-y) * -1);
    margin-right: calc(var(--bs-gutter-x) * -.5);
    margin-left: calc(var(--bs-gutter-x) * -.5);
}