/* Reset CSS
* --------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td {
    padding: 0;
    margin: 0;
}

body{
    max-width: 414px;
    margin: 0 auto;
    background: linear-gradient(to bottom, #fafafa, #ffffff);
    position: relative;
    min-height: 100vh;
    color:#333;
}

#content{
    width: 100%;
    height: 100%;
    text-align: center;
}

#header{
    padding: 10px 0;
    text-align: center;
    width: 100%;
    height: 40px;
    background: linear-gradient(to bottom, #000000, #111111);
}

#logo{
    width: 150px;
}
.logo-icon {
    width: 36px;
}


.bullet {
    width: 8px;
    height: 8px;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAABHNCSVQICAgIfAhkiAAAACxJREFUGFdjrKys7P3+/XsRAxbAycnZx1hQUPC/v78fmzxDYWEhw9BQQMibAL2WK9PK3gTgAAAAAElFTkSuQmCC');
    display: inline-block;
}

#footer{
    width: 100%;
    background-color: transparent;
    padding: 5px 0;
    text-align: center;
    margin-top: 10px;
    position: absolute;
    bottom: 15px;
    left: 0;
}

#footer span, #footer a{
    color: #000;
    display: inline-block;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 12px;
    text-decoration: none;
}

#main-img{
    width: 100%;
    display: block;
    margin: 0 auto;
}

h1 {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: bold;
    margin: 0 auto;
    color: #111;
    font-size: 36px;
    width: 75%;
}
h3 {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: bold;
    margin: 0 auto;
    color: #111;
    font-size: 20px;
    width: 75%;
}

#title {
    font-size: 16px;
    margin-top: 32px;
    font-weight: 500;
    color: #333;
}

button {
    background: linear-gradient(to bottom, #84e054 0%,#61b32d 100%);
    width: 80%;
    border: none;
    border-radius: 12px;
    font-size: 16px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #333;
    font-weight: bold;
    text-transform: uppercase;
    padding: 16px 10px 12px 10px;
    margin-top: 5%;
    margin-bottom: 15px;
    cursor: pointer;
}


#input_msisdn, #input_pin{
    margin: 10px 10px -10px 10px;
    padding: 2px 10px;
    height: 42px;
    font-size: 16px;
    width: 73%;
    border-radius: 10px;
    border:1px solid #eaeaea;
    text-align: center;
}

p, a{
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #444;
    font-size: 12px;
    width: 100%;
    margin: 5px auto;
    text-decoration: none;
}
p.bd_terms {
    width: 76%;
    font-weight: 500;
    text-align: left;
}

.error {
    padding: 15px;
    color: red;
}

#terms_link{
    width: 100%;
    display: block;
}

.red {
    color:red;
}
.hide {
    display:none;
}
.pre-title {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size:17px;
    font-weight:bold;
}
.pre-subtitle-2 {
    font-size: 14px;
    font-weight: 600;
}
.pre-video {
    width: 100%;
    margin: 15px 10px 5px 10px;
    text-align:left !important;
}
.videoplay {
    width: 100%;
}

#video-type {
    margin: 10px 20px !important;
}
.center {
    text-align: center;
}
.left {
    text-align: left !important;
}
.btn-prelanding {
    /*background: linear-gradient(to bottom, #84e054 0%,#61b32d 100%);*/
    background: linear-gradient(to bottom, #1CFF9D 0%,#39F15E 100%);
    width: 60%;
    border: none;
    border-radius: 6px;
    font-size: 18px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #fff;
    font-weight: 600;
    text-transform: uppercase;
    padding: 12px 10px 9px 10px;
    cursor: pointer;
    margin: 0;
}
.text-grn {
    color: #707070 !important;
}
.p-terms {
    padding-bottom: 10px;
}
.pre-body {
    background: #fff;
}
.pre-price {
    font-size:10px;
}
.pre-terms {
    font-size: 9px;
}

.disc1, .disc1 p{
    color:#999999;
    opacity: 0.75;
}
.disc2, .disc2 p{
    color:#bbbbbb;
    opacity: 0.65;
}
.disc3{
    padding-top: 420px;
    display: inline-block; /* or block */
}
.disc4{
    display:none;
}

.footer{
    position: absolute;
    bottom: 10px;
    width: 100%;
}

ul.tc {
    list-style-type: disc;
    text-align: left;
    font-size:12px;
    padding: 4px 20px 4px 40px;
}