* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;

    color: #000000;
    background: #ffffff;
}
body.dark {
    background: #000000;
    color: #ffffff;
}

body, html, .wrapper { 
    width: 100%; 
    height: 100%; 
}

a {
    text-decoration: none;
    color: inherit;
}

.text-red {color: #D0112B;}
.text-center {text-align: center;}
.js-emaillink {position: absolute;top: 0;}

.wrapper {
    position: relative;
    z-index: 9;
    background: #fff;
    display: table;
    height: 100%;
    width: 100%;
}
body.dark .wrapper {
    background: #000000;
}

.content {
    height: 100%;
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
}

.main {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    padding: 25px;
    padding-top: 30px;
}

.main__top {
    padding-bottom: 24px;
}
.main__mid {
    flex: 1;
    display: flex;
    align-items: center;
}

.block-title {
    display: flex;
    align-items: center;
    margin-bottom: 16px;
    font-size: 16px;

    color: #8A898E;
}
.block-title__icon {
    height: 20px;
    margin-right: 8px;
}

.block {
    padding: 16px;
    border-radius: 14px;

    background: #F5F5F5;
}
.block__img {
    display: block;
    margin: 0 auto 16px auto;
    border: none;
}
.block__title {
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 4px;
}
.block__subtitle {
    text-align: center;
    font-size: 13px;

    color: #8A898E;
}

.block__list {
    list-style: none;
    margin-top: 16px;
}
.block__list li {
    display: flex;
    justify-content: space-between;
    padding: 11px 0;
    font-size: 16px;

    border-top: 1px solid #BCBCBF;
}
.block__list li:last-child{padding-bottom: 0;}
.block__list li span {
    display: flex;
    align-items: center;
}
.block__list li span i {
    display: block;
    width: 24px;
    height: 24px;
    margin-right: 8px;
}

.icon-key {
    background: url('img/icon-key.svg') 50% no-repeat;
    background-size: 100%;
}
.icon-gps {
    background: url('img/icon-gps.svg') 50% no-repeat;
    background-size: 100%;
}
.icon-face {
    background: url('img/icon-face.svg') 50% no-repeat;
    background-size: 100%;
}
.icon-hand {
    background: url('img/icon-hand.svg') 50% no-repeat;
    background-size: 100%;
}


.button__text {
    display: flex;
    flex-direction: column;
    text-align: center;
    font-size: 13px;
    line-height: 1.4;
    margin-bottom: 24px;

    color: #8A898E;
}
.button__text img {
    display: block;
    margin: 0 auto;
    width: 72px;
    margin-bottom: 16px;
}
.midbox {width: 100%;}
.xs {
    flex-direction: row;
    align-items: center;
    text-align: left;
}
.xs img {
    width: 32px;
    margin: 0 8px 0 0;
}

.button {
    display: block;
    padding: 18px;
    border-radius: 13px;
    text-align: center;
    font-size: 20px;
    font-weight: 600;

    color: #0A84FF;
    background: #D7D7D7;
}

/* dark colors */
body.dark .block-title,
body.dark .block__title,
body.dark .button__text {
    color: #fff;
}

body.dark .block {background: #1C1C1E}
body.dark .block__list li {border-color: #38383A}
body.dark .button {background: #1C1C1E}

@keyframes rotate {
    0%{ transform: rotate(0deg) }
    100%{ transform: rotate(360deg) }
}



.modal{ position: fixed; top: 0; left: 0; right: 0; bottom: 0px; z-index: 99; background: rgba(0, 0, 0, .6); align-items: center; justify-content: center; display: none; text-decoration: none; min-height: 100%;padding-bottom: 40px; }
@keyframes show {
    0%{ transform: translateY(-100%); opacity: 0 }
    100%{ transform: translateY(0); opacity: 1 }
}
.modal-content{ width: calc(100% - 30px); max-width: 320px; border-radius: 20px; background: rgb(201 200 200); animation: show 0.5s; transform: translateY(0); opacity: 1 }
.modal-top{ padding: 16px 20px 20px; display: flex; flex-direction: column; align-items: center; text-align: center }
.modal-title{ color: #000; font-size: 18px;
    font-weight: 600;  }
.modal-text{ color: #282828;
    font-size: 14px;
    font-weight: 400;
    margin-top: 4px; }
.modal-btns{ display: flex; align-items: center; border-top: 0.5px solid rgba(0, 0, 0, .3) }
.modal-btn{ padding: 15px 0; text-align: center; color: #0079FA; font-size: 18px;
    width: 50%;
    font-weight: 500;  }
.modal-btn:nth-child(2){ border-left: 0.5px solid rgba(0, 0, 0, .3) }
.modal-btn:nth-child(1){
    color: #FF1300;
}

@media (max-width: 525px) {
    .modal-content{ max-width: 290px }

}
#theTime{
    color: #FF1300;
    font-size: 16px;
    font-weight: 600;
    margin-top: 9px;
    margin-bottom: 6px;
}
.logo img{
    display: block;
    margin: 0 auto;
    width: 70px;
    margin-right: -10px;
}


.nav {
font-size: 16px;
font-weight: 400;
color: #0385FF;
padding-left: 10px;
width: 100%;
}
.nav img {
margin-right: 8px;
vertical-align: middle;
}
.nav {
font-size: 16px;
font-weight: 400;
color: #0385FF;
position: absolute;
left: 0px;
}
.nav span {
vertical-align: middle;
}

.block-title{
    justify-content: center;
    bottom: -2px;
position: relative;
margin-bottom: 30px;
    font-weight: 500;
}
.main{
    position: relative;
}
.block__dt{
    text-align: left;
padding-left: 16px;
margin-bottom: 8px;
}
.block{
    margin-bottom: 24px;
}
.block__list .li1{
    border-top: 0;
    padding-top: 0;
}
.block__list{
    margin-top: 0;
}
.text-red{
    font-size: 14px;
}
.bb1 span {
font-size: 20px;
font-weight: 400;
text-align: left;
position: relative;
bottom: -5px;
}
.bb1 img {
float: right;
}
.blockai {
    text-align: left;
    margin-bottom: 0;
    padding-top: 13px;
    border-top: 1px solid #38383A;
    margin-top: 18px;
    padding-left: 16px;
    padding-right: 16px;
}
.blockai img{
    width: 51px;
    vertical-align: middle;
        float: right;
}
.blockai span{
        vertical-align: middle;
}
.block__title{
    font-weight: 400;
}
.block1{
    padding: 16px 0;
    padding-bottom: 18px;
}
.block2{
    padding: 16px;
    padding-top: 16px;
    padding-bottom: 16px;
}
.block__list li{
    padding: 16px 0;
    
}
.block__img{
    width: 65px;
        margin: 1px auto 14px auto;
}