/* IE8/9 conditional classes; IE10/11 no-script CSS detection below. */
.ie-browser body{background:#101a18;color:#f2eee3}
.ie-browser button,.ie-browser a{color:inherit}
.ie-browser .primary{color:#1b2923;background:#d9bc83}
.ie-browser .secondary,.ie-browser .header-action,.ie-browser .text-button{color:#d9bc83}
.ie-browser header,.ie-browser main,.ie-browser section,.ie-browser article,.ie-browser [role="contentinfo"],.ie-browser nav{display:block}
.ie-browser .header{display:block;height:90px;padding-top:20px}
.ie-browser .header>.brand{float:left}
.ie-browser .brand{display:inline-block}
.ie-browser .brand-mark{display:inline-block;vertical-align:middle;margin-right:13px}
.ie-browser .brand>span:last-child{display:inline-block;vertical-align:middle}
.ie-browser .header [role="navigation"]{position:absolute;left:31%;top:0;display:block;height:90px;margin:0}
.ie-browser .header [role="navigation"] a{display:inline-block;height:90px;line-height:90px;margin-right:25px}
.ie-browser .header-action{float:right;margin-top:4px}
.ie-browser .hero{display:block;height:850px;height:100vh;min-height:730px}
.ie-browser .hero-content{position:relative;top:22%;margin:0 0 0 10%}
.ie-browser .hero h1{font-size:96px}
.ie-browser .hero-art{top:0;right:0;bottom:0;left:0}
.ie-browser .eyebrow>span{display:inline-block;vertical-align:middle;margin-right:13px}
.ie-browser .hero-actions{display:block}
.ie-browser .button{display:inline-block;vertical-align:middle;text-align:center}
.ie-browser .hero-actions .button{margin-right:16px}
.ie-browser .button>span{display:inline-block;margin:0 10px}
.ie-browser .hero-bottom{display:block}
.ie-browser .hero-bottom>a{display:inline-block}
.ie-browser .hero-bottom>a .scroll-icon{display:inline-block;vertical-align:middle;margin-right:12px}
.ie-browser .hero-bottom>span{position:absolute;left:38%;top:9px}

.ie-browser .section-heading{display:block;overflow:hidden}
.ie-browser .section-heading>div{float:left;max-width:70%}
.ie-browser .section-heading>p{float:right;padding-top:20px}
.ie-browser .intro-layout{display:table;width:100%;table-layout:fixed}
.ie-browser .intro-copy{display:table-cell;width:50%;vertical-align:middle;padding-right:50px}
.ie-browser .intro-art{display:table-cell;width:50%;height:380px}
.ie-browser .gallery.has-screenshots{display:block;margin:0 -1%;font-size:0}
.ie-browser .has-screenshots .gallery-item{display:inline-block;vertical-align:top;width:31.333%;margin:0 1% 24px;font-size:16px}
.ie-browser .has-screenshots .gallery-caption{display:block;min-height:176px}
.ie-browser .gallery-caption strong,.ie-browser .gallery-caption>span,.ie-browser .gallery-caption small{display:block}
.ie-browser .ie-thumbnail{display:block;position:relative;overflow:hidden;height:245px;background:#101a18}
.ie-browser .ie-thumbnail-picture{position:absolute;top:-4%;left:-1%;width:102%;height:108%;background-position:center;background-repeat:no-repeat;background-size:cover}
.ie-browser .service-grid{display:block;overflow:hidden}
.ie-browser .service-card{float:left;width:48%;margin-right:4%;min-height:315px}
.ie-browser .service-card:last-child{margin-right:0}
.ie-browser .chronicle{display:block;overflow:hidden}
.ie-browser .chronicle>div:first-child{float:left}
.ie-browser .join-steps{float:right}
.ie-browser [role="contentinfo"]{display:block;overflow:hidden}
.ie-browser [role="contentinfo"] .brand{float:left}
.ie-browser [role="contentinfo"] p{display:inline-block;margin:10px 0 0 12%}
.ie-browser [role="contentinfo"]>a:last-of-type{float:right;margin-top:15px}
.ie-browser [role="contentinfo"]>small{display:block;clear:both;padding-top:25px}
.ie-browser .lightbox{display:block;top:0;right:0;bottom:0;left:0;overflow:auto;padding:20px}
.ie-browser .lightbox-shade{position:fixed;top:0;right:0;bottom:0;left:0}
.ie-browser .lightbox-panel{margin:0 auto;width:90%;max-height:calc(100vh - 40px)}
.ie-browser .lightbox-toolbar,.ie-browser .lightbox-bottom{display:block;overflow:hidden}
.ie-browser #viewer-title{display:inline-block;padding-top:8px}
.ie-browser .viewer-close{float:right}
.ie-browser .lightbox-bottom>span:last-child{float:right}
.ie-browser .lightbox-stage{position:relative;overflow:hidden}
.ie-browser .lightbox-stage img{position:absolute;left:50%;max-width:none;max-height:none;margin:0;transform:none}
.ie-browser .viewer-arrow{z-index:2}
.ie-browser [hidden]{display:none!important}
.ie-browser button:focus,.ie-browser a:focus{outline:2px solid #d9bc83;outline-offset:3px}
@media(max-width:1050px){
 .ie-browser .header [role="navigation"]{left:28%}.ie-browser .header [role="navigation"] a{margin-right:15px;font-size:13px}
 .ie-browser .has-screenshots .gallery-item{width:48%}
 .ie-browser .intro-copy{padding-right:30px}
}
@media(max-width:760px){
 .ie-browser .header{height:76px;padding-top:15px}.ie-browser .menu-toggle{float:right;margin-left:12px}
 .ie-browser .header [role="navigation"]{display:none;top:76px;left:0;right:0;height:auto}
 .ie-browser .header [role="navigation"].open{display:block}.ie-browser .header [role="navigation"] a{height:auto;line-height:2;margin-right:20px}
 .ie-browser .hero{height:760px;min-height:700px}.ie-browser .hero-content{top:24%;margin:0 6%}
 .ie-browser .hero h1{font-size:65px}.ie-browser .hero-actions .button{margin-right:8px;padding:12px 15px}
 .ie-browser .button>span{margin:0 4px}.ie-browser .hero-bottom>span{display:none}
 .ie-browser .section-heading>div,.ie-browser .section-heading>p{float:none;max-width:none}
 .ie-browser .intro-layout,.ie-browser .intro-copy,.ie-browser .intro-art{display:block;width:100%}
 .ie-browser .intro-copy{padding-right:0;margin-bottom:28px}.ie-browser .intro-art{height:300px}
 .ie-browser .has-screenshots .gallery-item{display:block;width:98%}
 .ie-browser .service-card{float:none;width:100%;margin:0 0 24px;min-height:0}
 .ie-browser .chronicle>div:first-child,.ie-browser .join-steps{float:none}
 .ie-browser [role="contentinfo"] p{display:none}.ie-browser .lightbox{padding:10px}.ie-browser .lightbox-panel{width:100%}
}

/* IE8/9: basic content and native links work with scripting disabled. */
.old-ie body{min-width:960px;font-family:"Microsoft YaHei",Arial,sans-serif}
.old-ie .header{height:90px;padding-left:5%;padding-right:5%}
.old-ie .hero{height:820px;min-height:0}
.old-ie .hero-art{background-image:url('assets/lost-world.jpg');background-position:center center;background-repeat:no-repeat;background-color:#14241e}
.old-ie .hero-grain{position:absolute;top:0;right:0;bottom:0;left:0;background:#071a13;opacity:.48;filter:alpha(opacity=48)}
.old-ie .hero-content{top:185px}
.old-ie .section{width:84%;max-width:1200px;padding:70px 0}
.old-ie .intro-layout{display:block;overflow:hidden}
.old-ie .intro-copy{display:block;float:left;width:45%;padding:0}
.old-ie .intro-art{display:block;float:right;width:50%;height:380px;background:#14251e url('assets/legend-warrior.jpg') center center no-repeat}
.old-ie .gallery.has-screenshots{font-size:0}
.old-ie .has-screenshots .gallery-item{display:inline-block;*display:inline;zoom:1;width:31%;margin:0 1% 24px;background:#16251f;border:1px solid #34473a}
.old-ie .has-screenshots .gallery-item img{width:100%;height:auto;max-height:none;border:0}
.old-ie .gallery-caption{position:static;display:block;width:auto;min-height:170px;background:#16251f}
.old-ie .gallery-caption strong,.old-ie .gallery-caption span,.old-ie .gallery-caption small{display:block}
.old-ie .service-card{background:#1b3025;border:1px solid #3a4a37}
.old-ie .secondary,.old-ie .header-action{background:#172b21;border:1px solid #d9bc83}
.old-ie .primary{background:#d9bc83;color:#1b2923;border:1px solid #d9bc83}
.old-ie .chronicle{background:#162720;border-top:1px solid #34473a;border-bottom:1px solid #34473a}
.old-ie .service-card{width:40%;margin-right:3%;min-height:280px}
.old-ie .service-card#recharge{margin-right:0}
.old-ie #screenshot-viewer{display:none!important}
.old-ie .menu-toggle{display:none}

@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none){
/* IE8/9 conditional classes; IE10/11 no-script CSS detection below. */
body{background:#101a18;color:#f2eee3}
button,a{color:inherit}
.primary{color:#1b2923;background:#d9bc83}
.secondary,.header-action,.text-button{color:#d9bc83}
header,main,section,article,[role="contentinfo"],nav{display:block}
.header{display:block;height:90px;padding-top:20px}
.header>.brand{float:left}
.brand{display:inline-block}
.brand-mark{display:inline-block;vertical-align:middle;margin-right:13px}
.brand>span:last-child{display:inline-block;vertical-align:middle}
.header [role="navigation"]{position:absolute;left:31%;top:0;display:block;height:90px;margin:0}
.header [role="navigation"] a{display:inline-block;height:90px;line-height:90px;margin-right:25px}
.header-action{float:right;margin-top:4px}
.hero{display:block;height:850px;height:100vh;min-height:730px}
.hero-content{position:relative;top:22%;margin:0 0 0 10%}
.hero h1{font-size:96px}
.hero-art{top:0;right:0;bottom:0;left:0}
.eyebrow>span{display:inline-block;vertical-align:middle;margin-right:13px}
.hero-actions{display:block}
.button{display:inline-block;vertical-align:middle;text-align:center}
.hero-actions .button{margin-right:16px}
.button>span{display:inline-block;margin:0 10px}
.hero-bottom{display:block}
.hero-bottom>a{display:inline-block}
.hero-bottom>a .scroll-icon{display:inline-block;vertical-align:middle;margin-right:12px}
.hero-bottom>span{position:absolute;left:38%;top:9px}

.section-heading{display:block;overflow:hidden}
.section-heading>div{float:left;max-width:70%}
.section-heading>p{float:right;padding-top:20px}
.intro-layout{display:table;width:100%;table-layout:fixed}
.intro-copy{display:table-cell;width:50%;vertical-align:middle;padding-right:50px}
.intro-art{display:table-cell;width:50%;height:380px}
.gallery.has-screenshots{display:block;margin:0 -1%;font-size:0}
.has-screenshots .gallery-item{display:inline-block;vertical-align:top;width:31.333%;margin:0 1% 24px;font-size:16px}
.has-screenshots .gallery-caption{display:block;min-height:176px}
.gallery-caption strong,.gallery-caption>span,.gallery-caption small{display:block}
.ie-thumbnail{display:block;position:relative;overflow:hidden;height:245px;background:#101a18}
.ie-thumbnail-picture{position:absolute;top:-4%;left:-1%;width:102%;height:108%;background-position:center;background-repeat:no-repeat;background-size:cover}
.service-grid{display:block;overflow:hidden}
.service-card{float:left;width:48%;margin-right:4%;min-height:315px}
.service-card:last-child{margin-right:0}
.chronicle{display:block;overflow:hidden}
.chronicle>div:first-child{float:left}
.join-steps{float:right}
[role="contentinfo"]{display:block;overflow:hidden}
[role="contentinfo"] .brand{float:left}
[role="contentinfo"] p{display:inline-block;margin:10px 0 0 12%}
[role="contentinfo"]>a:last-of-type{float:right;margin-top:15px}
[role="contentinfo"]>small{display:block;clear:both;padding-top:25px}
.lightbox{display:block;top:0;right:0;bottom:0;left:0;overflow:auto;padding:20px}
.lightbox-shade{position:fixed;top:0;right:0;bottom:0;left:0}
.lightbox-panel{margin:0 auto;width:90%;max-height:calc(100vh - 40px)}
.lightbox-toolbar,.lightbox-bottom{display:block;overflow:hidden}
#viewer-title{display:inline-block;padding-top:8px}
.viewer-close{float:right}
.lightbox-bottom>span:last-child{float:right}
.lightbox-stage{position:relative;overflow:hidden}
.lightbox-stage img{position:absolute;left:50%;max-width:none;max-height:none;margin:0;transform:none}
.viewer-arrow{z-index:2}
[hidden]{display:none!important}
button:focus,a:focus{outline:2px solid #d9bc83;outline-offset:3px}

}
