@-webkit-keyframes battery-border{from{opacity:1}to{opacity:0;border:none}}@keyframes battery-border{from{opacity:1}to{opacity:0;border:none}}.tint-graphic{background:url(../images/tint-outer.jpg) center center/cover no-repeat;display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;font-family:'Open Sans',sans-serif;padding:5vh 1vh}@media screen and (min-width:960px){.tint-graphic{padding:10vh 5vh;-webkit-box-align:center;align-items:center;justify-content:space-around}}.tint-graphic *{display:-webkit-box;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box}.tint-graphic__intro{-webkit-box-flex:2;flex:2 1 auto;margin:0 1.875rem;margin-bottom:1.875rem}.tint-graphic__intro h3{font-size:1.875rem;color:#fff!important}.tint-graphic__main{flex-wrap:wrap}@media screen and (min-width:960px){.tint-graphic__main{flex-wrap:nowrap}}.tint-graphic__disclaimer{margin-top:3.4375rem;color:#fff;-webkit-box-pack:center;justify-content:center}@media screen and (min-width:960px){.tint-graphic__disclaimer{align-self:flex-end}}.tint-graphic__inner{background:url(../images/tint-inner.jpg) center center/cover no-repeat;border-radius:6px;border:6px solid #fff;color:#fff;display:-webkit-box;display:flex;flex-wrap:wrap;-webkit-box-flex:2;flex:2 1 auto;margin:0 1.875rem}@media screen and (min-width:960px){.tint-graphic__inner{margin:0;flex-wrap:nowrap}}.controls-color{-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-flex:1;flex:1 1 auto;margin-bottom:1.875rem;-webkit-box-pack:end;justify-content:flex-end;position:relative}@media screen and (min-width:960px){.controls-color{margin:0;-webkit-box-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-pack:start;justify-content:flex-start;min-height:18.75rem}}.controls-color .control-color{align-self:flex-end;height:2.1875rem;margin-left:.9375rem;position:relative;width:2.1875rem}@media screen and (min-width:960px){.controls-color .control-color{align-self:flex-start;margin-left:auto;margin-bottom:.3125rem;margin-right:.625rem;margin-top:.3125rem}}.controls-color .control-color--blue label{background-color:#063555}.controls-color .control-color--green label{background-color:#4fa368}.controls-color .control-color--grey label{background-color:#606060}.controls-color .control-color--orange label{background-color:#a0804d}.tint-graphic__option{-webkit-box-align:center;align-items:center;display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-flex:0;flex:0 0 100%;position:relative;min-height:3.75rem}@media screen and (min-width:960px){.tint-graphic__option{min-height:18.75rem;-webkit-box-flex:0;flex:0 0 calc(100% / 7);-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}}.tint-graphic__option .filler{display:none}@media screen and (min-width:960px){.tint-graphic__option .filler{display:-webkit-box;display:flex;-webkit-box-flex:1;flex:1}}.tint-graphic__option .percentage{-webkit-box-flex:1;flex:1;font-size:1.875rem;margin-left:1.25rem;width:100%}@media screen and (min-width:768px){.tint-graphic__option .percentage{font-size:2.5rem}}@media screen and (min-width:960px){.tint-graphic__option .percentage{font-size:3.75rem;margin-left:0;-webkit-box-pack:center;justify-content:center;align-self:center}}@media screen and (min-width:1140px){.tint-graphic__option .percentage{font-size:4.375rem}}.tint-graphic__option .message{-webkit-box-flex:1;flex:1;padding:.625rem;padding-right:1.5rem;line-height:1.2}@media screen and (min-width:768px){.tint-graphic__option .message{-webkit-box-pack:center;justify-content:center;padding-right:.625rem}}@media screen and (min-width:960px){.tint-graphic__option .message{font-size:1rem;padding:0;text-align:center;-webkit-box-align:center;align-items:center}}.tint-graphic__option .message p{font-size:.75rem;flex-wrap:wrap}@media screen and (min-width:960px){.tint-graphic__option .message p{font-size:1rem;-webkit-box-pack:center;justify-content:center;flex-wrap:wrap;font-size:.75rem}}.tint-graphic__option .message p strong{display:contents}.tint-graphic__option .control-tint{-webkit-box-flex:0;flex:0 0 1.25rem;height:2.1875rem;width:2.1875rem;position:absolute;right:-1.25rem}@media screen and (min-width:960px){.tint-graphic__option .control-tint{bottom:-1.0625rem;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}}.tint-graphic--blue .tint-graphic__option--60{background-color:#839aaa;background-color:rgba(6,53,85,.5)}.tint-graphic--blue .tint-graphic__option--50{background-color:#6a8699;background-color:rgba(6,53,85,.6)}.tint-graphic--blue .tint-graphic__option--40{background-color:#517288;background-color:rgba(6,53,85,.7)}.tint-graphic--blue .tint-graphic__option--30{background-color:#385d77;background-color:rgba(6,53,85,.8)}.tint-graphic--blue .tint-graphic__option--20{background-color:#1f4966;background-color:rgba(6,53,85,.9)}.tint-graphic--blue .tint-graphic__option--10{background-color:#123f5e;background-color:rgba(6,53,85,.95)}.tint-graphic--blue .tint-graphic__option--0{background-color:#063555;background-color:#063555}.tint-graphic--green .tint-graphic__option--60{background-color:#a7d1b4;background-color:rgba(79,163,104,.5)}.tint-graphic--green .tint-graphic__option--50{background-color:#95c8a4;background-color:rgba(79,163,104,.6)}.tint-graphic--green .tint-graphic__option--40{background-color:#84bf95;background-color:rgba(79,163,104,.7)}.tint-graphic--green .tint-graphic__option--30{background-color:#72b586;background-color:rgba(79,163,104,.8)}.tint-graphic--green .tint-graphic__option--20{background-color:#61ac77;background-color:rgba(79,163,104,.9)}.tint-graphic--green .tint-graphic__option--10{background-color:#58a870;background-color:rgba(79,163,104,.95)}.tint-graphic--green .tint-graphic__option--0{background-color:#4fa368;background-color:#4fa368}.tint-graphic--grey .tint-graphic__option--60{background-color:#b0b0b0;background-color:rgba(96,96,96,.5)}.tint-graphic--grey .tint-graphic__option--50{background-color:#a0a0a0;background-color:rgba(96,96,96,.6)}.tint-graphic--grey .tint-graphic__option--40{background-color:#909090;background-color:rgba(96,96,96,.7)}.tint-graphic--grey .tint-graphic__option--30{background-color:gray;background-color:rgba(96,96,96,.8)}.tint-graphic--grey .tint-graphic__option--20{background-color:#707070;background-color:rgba(96,96,96,.9)}.tint-graphic--grey .tint-graphic__option--10{background-color:#686868;background-color:rgba(96,96,96,.95)}.tint-graphic--grey .tint-graphic__option--0{background-color:#606060;background-color:#606060}.tint-graphic--orange .tint-graphic__option--60{background-color:#d0c0a6;background-color:rgba(160,128,77,.5)}.tint-graphic--orange .tint-graphic__option--50{background-color:#c6b394;background-color:rgba(160,128,77,.6)}.tint-graphic--orange .tint-graphic__option--40{background-color:#bda682;background-color:rgba(160,128,77,.7)}.tint-graphic--orange .tint-graphic__option--30{background-color:#b39971;background-color:rgba(160,128,77,.8)}.tint-graphic--orange .tint-graphic__option--20{background-color:#aa8d5f;background-color:rgba(160,128,77,.9)}.tint-graphic--orange .tint-graphic__option--10{background-color:#a58656;background-color:rgba(160,128,77,.95)}.tint-graphic--orange .tint-graphic__option--0{background-color:#a0804d;background-color:#a0804d}.control-color label,.control-tint label{border-radius:6.25rem;border:3px solid #fff;height:2.1875rem;width:2.1875rem;position:absolute;cursor:pointer;border-radius:50px;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;text-align:center}.control-color label::after,.control-tint label::after{content:'';width:14px;height:6px;border:5px solid #fff;border-top:none;margin-bottom:.375rem;border-right:none;background:0 0;opacity:0;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transition:.2s all ease-in;transition:.2s all ease-in;margin-bottom:5px}.control-color label:hover::after,.control-tint label:hover::after{opacity:.3}.control-color input[type=radio],.control-tint input[type=radio]{visibility:hidden}.control-color input[type=radio]:checked+label::after,.control-tint input[type=radio]:checked+label::after{opacity:1}.control-tint input[type=radio]+label{background-color:#fff}.control-tint input[type=radio]+label:hover::after{border-color:#063555}.control-tint input[type=radio]:checked+label{background-color:#faaf41}.control-tint input[type=radio]:checked+label:hover::after{border-color:#fff}.container-battery{-webkit-box-flex:1;flex:1 1 auto}.container-battery__inner{position:relative}@media screen and (min-width:960px){.container-battery__inner{margin-left:1.25rem;-webkit-box-align:end;align-items:flex-end}}.container-battery--desktop{display:none;min-height:18.75rem}@media screen and (min-width:960px){.container-battery--desktop{display:-webkit-box;display:flex}}.container-battery img.charge-icon{position:absolute;width:18px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);bottom:10px}.battery{border-radius:3px;background-color:transparent;border:3px #fff solid;display:block;height:100px;width:50px}.battery::before{content:"";height:7px;width:15px;border:3px solid #fff;border-radius:3px;border-bottom:transparent;position:absolute;margin-top:-10px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.battery::after{content:"";background-color:#16c44b;width:44px;position:absolute;display:block;bottom:3px;-webkit-transition:.5s height ease-in,.5s border ease-in;transition:.5s height ease-in,.5s border ease-in}.battery.battery--level-0::after{-webkit-animation:battery-border 1s forwards;animation:battery-border 1s forwards}.battery--level-0::after{border-top:3px solid #fff;height:calc(91px * 0)}.battery--level-1::after{border-top:3px solid #fff;height:calc(91px * .01)}.battery--level-2::after{border-top:3px solid #fff;height:calc(91px * .02)}.battery--level-3::after{border-top:3px solid #fff;height:calc(91px * .03)}.battery--level-4::after{border-top:3px solid #fff;height:calc(91px * .04)}.battery--level-5::after{border-top:3px solid #fff;height:calc(91px * .05)}.battery--level-6::after{border-top:3px solid #fff;height:calc(91px * .06)}.battery--level-7::after{border-top:3px solid #fff;height:calc(91px * .07)}.battery--level-8::after{border-top:3px solid #fff;height:calc(91px * .08)}.battery--level-9::after{border-top:3px solid #fff;height:calc(91px * .09)}.battery--level-10::after{border-top:3px solid #fff;height:calc(91px * .1)}.battery--level-11::after{border-top:3px solid #fff;height:calc(91px * .11)}.battery--level-12::after{border-top:3px solid #fff;height:calc(91px * .12)}.battery--level-13::after{border-top:3px solid #fff;height:calc(91px * .13)}.battery--level-14::after{border-top:3px solid #fff;height:calc(91px * .14)}.battery--level-15::after{border-top:3px solid #fff;height:calc(91px * .15)}.battery--level-16::after{border-top:3px solid #fff;height:calc(91px * .16)}.battery--level-17::after{border-top:3px solid #fff;height:calc(91px * .17)}.battery--level-18::after{border-top:3px solid #fff;height:calc(91px * .18)}.battery--level-19::after{border-top:3px solid #fff;height:calc(91px * .19)}.battery--level-20::after{border-top:3px solid #fff;height:calc(91px * .2)}.battery--level-21::after{border-top:3px solid #fff;height:calc(91px * .21)}.battery--level-22::after{border-top:3px solid #fff;height:calc(91px * .22)}.battery--level-23::after{border-top:3px solid #fff;height:calc(91px * .23)}.battery--level-24::after{border-top:3px solid #fff;height:calc(91px * .24)}.battery--level-25::after{border-top:3px solid #fff;height:calc(91px * .25)}.battery--level-26::after{border-top:3px solid #fff;height:calc(91px * .26)}.battery--level-27::after{border-top:3px solid #fff;height:calc(91px * .27)}.battery--level-28::after{border-top:3px solid #fff;height:calc(91px * .28)}.battery--level-29::after{border-top:3px solid #fff;height:calc(91px * .29)}.battery--level-30::after{border-top:3px solid #fff;height:calc(91px * .3)}.battery--level-31::after{border-top:3px solid #fff;height:calc(91px * .31)}.battery--level-32::after{border-top:3px solid #fff;height:calc(91px * .32)}.battery--level-33::after{border-top:3px solid #fff;height:calc(91px * .33)}.battery--level-34::after{border-top:3px solid #fff;height:calc(91px * .34)}.battery--level-35::after{border-top:3px solid #fff;height:calc(91px * .35)}.battery--level-36::after{border-top:3px solid #fff;height:calc(91px * .36)}.battery--level-37::after{border-top:3px solid #fff;height:calc(91px * .37)}.battery--level-38::after{border-top:3px solid #fff;height:calc(91px * .38)}.battery--level-39::after{border-top:3px solid #fff;height:calc(91px * .39)}.battery--level-40::after{border-top:3px solid #fff;height:calc(91px * .4)}.battery--level-41::after{border-top:3px solid #fff;height:calc(91px * .41)}.battery--level-42::after{border-top:3px solid #fff;height:calc(91px * .42)}.battery--level-43::after{border-top:3px solid #fff;height:calc(91px * .43)}.battery--level-44::after{border-top:3px solid #fff;height:calc(91px * .44)}.battery--level-45::after{border-top:3px solid #fff;height:calc(91px * .45)}.battery--level-46::after{border-top:3px solid #fff;height:calc(91px * .46)}.battery--level-47::after{border-top:3px solid #fff;height:calc(91px * .47)}.battery--level-48::after{border-top:3px solid #fff;height:calc(91px * .48)}.battery--level-49::after{border-top:3px solid #fff;height:calc(91px * .49)}.battery--level-50::after{border-top:3px solid #fff;height:calc(91px * .5)}.battery--level-51::after{border-top:3px solid #fff;height:calc(91px * .51)}.battery--level-52::after{border-top:3px solid #fff;height:calc(91px * .52)}.battery--level-53::after{border-top:3px solid #fff;height:calc(91px * .53)}.battery--level-54::after{border-top:3px solid #fff;height:calc(91px * .54)}.battery--level-55::after{border-top:3px solid #fff;height:calc(91px * .55)}.battery--level-56::after{border-top:3px solid #fff;height:calc(91px * .56)}.battery--level-57::after{border-top:3px solid #fff;height:calc(91px * .57)}.battery--level-58::after{border-top:3px solid #fff;height:calc(91px * .58)}.battery--level-59::after{border-top:3px solid #fff;height:calc(91px * .59)}.battery--level-60::after{border-top:3px solid #fff;height:calc(91px * .6)}.battery--level-61::after{border-top:3px solid #fff;height:calc(91px * .61)}.battery--level-62::after{border-top:3px solid #fff;height:calc(91px * .62)}.battery--level-63::after{border-top:3px solid #fff;height:calc(91px * .63)}.battery--level-64::after{border-top:3px solid #fff;height:calc(91px * .64)}.battery--level-65::after{border-top:3px solid #fff;height:calc(91px * .65)}.battery--level-66::after{border-top:3px solid #fff;height:calc(91px * .66)}.battery--level-67::after{border-top:3px solid #fff;height:calc(91px * .67)}.battery--level-68::after{border-top:3px solid #fff;height:calc(91px * .68)}.battery--level-69::after{border-top:3px solid #fff;height:calc(91px * .69)}.battery--level-70::after{border-top:3px solid #fff;height:calc(91px * .7)}.battery--level-71::after{border-top:3px solid #fff;height:calc(91px * .71)}.battery--level-72::after{border-top:3px solid #fff;height:calc(91px * .72)}.battery--level-73::after{border-top:3px solid #fff;height:calc(91px * .73)}.battery--level-74::after{border-top:3px solid #fff;height:calc(91px * .74)}.battery--level-75::after{border-top:3px solid #fff;height:calc(91px * .75)}.battery--level-76::after{border-top:3px solid #fff;height:calc(91px * .76)}.battery--level-77::after{border-top:3px solid #fff;height:calc(91px * .77)}.battery--level-78::after{border-top:3px solid #fff;height:calc(91px * .78)}.battery--level-79::after{border-top:3px solid #fff;height:calc(91px * .79)}.battery--level-80::after{border-top:3px solid #fff;height:calc(91px * .8)}.battery--level-81::after{border-top:3px solid #fff;height:calc(91px * .81)}.battery--level-82::after{border-top:3px solid #fff;height:calc(91px * .82)}.battery--level-83::after{border-top:3px solid #fff;height:calc(91px * .83)}.battery--level-84::after{border-top:3px solid #fff;height:calc(91px * .84)}.battery--level-85::after{border-top:3px solid #fff;height:calc(91px * .85)}.battery--level-86::after{border-top:3px solid #fff;height:calc(91px * .86)}.battery--level-87::after{border-top:3px solid #fff;height:calc(91px * .87)}.battery--level-88::after{border-top:3px solid #fff;height:calc(91px * .88)}.battery--level-89::after{border-top:3px solid #fff;height:calc(91px * .89)}.battery--level-90::after{border-top:3px solid #fff;height:calc(91px * .9)}.battery--level-91::after{border-top:3px solid #fff;height:calc(91px * .91)}.battery--level-92::after{border-top:3px solid #fff;height:calc(91px * .92)}.battery--level-93::after{border-top:3px solid #fff;height:calc(91px * .93)}.battery--level-94::after{border-top:3px solid #fff;height:calc(91px * .94)}.battery--level-95::after{border-top:3px solid #fff;height:calc(91px * .95)}.battery--level-96::after{border-top:3px solid #fff;height:calc(91px * .96)}.battery--level-97::after{border-top:3px solid #fff;height:calc(91px * .97)}.battery--level-98::after{border-top:3px solid #fff;height:calc(91px * .98)}.battery--level-99::after{border-top:3px solid #fff;height:calc(91px * .99)}.battery--level-100::after{border-top:none;height:calc(94px)}.controls-color-battery-container{-webkit-box-flex:1;flex:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;margin:0 1.875rem;margin-bottom:.9375rem;-webkit-box-pack:center;justify-content:center}@media screen and (min-width:450px){.controls-color-battery-container{-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row}}@media screen and (min-width:960px){.controls-color-battery-container{margin-right:0}}.controls-color-battery-container .container-battery{-webkit-box-pack:center;justify-content:center;margin-bottom:.9375rem}@media screen and (min-width:450px){.controls-color-battery-container .container-battery{-webkit-box-pack:start;justify-content:flex-start;margin-bottom:0}}@media screen and (min-width:960px){.controls-color-battery-container .container-battery{display:none}}.controls-color-battery-container .controls-color{-webkit-box-pack:center;justify-content:center}@media screen and (min-width:450px){.controls-color-battery-container .controls-color{-webkit-box-pack:end;justify-content:flex-end}}@media screen and (min-width:960px){.controls-color-battery-container .controls-color{-webkit-box-pack:start;justify-content:flex-start}}
/*# sourceMappingURL=tint-graphic.min.css.map */
