
/* common */
body {
    background: #FFFFFF;
    font-size: 1.0em;
    font-family: 'Albert Sans', sans-serif;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden !important
}
.mh-70 { max-height: 70%; }
.mh-65 { max-height: 65%; }
.mh-50 { max-height: 50%; }
.purp { color: #AD2169; }
.vblue { color: #5859bd; }

/* top logo header */
.top-logo {
    max-height: 38px;
}
.lang-logo {
    max-height: 34px;
}
.top-button {
    background: #AF1F67;
    -webkit-border-radius: 36px;
    -moz-border-radius: 36px;
    border-radius: 36px;
    padding: 10px 24px 10px 24px;
    color: #FFFFFF;
    font-size: 1.3em;;
}
.top-button:hover {
    background: #333333;
    color: #FFFFFF;
}

/* top image header */
.head-container {
    background: url(../images/head-background.png) no-repeat right top scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.head-container .head-backg {
    background-image: url(../images/head-right-image.png);
    background-repeat: no-repeat;
    background-position: right top;
    background-size: 98%;
}
.head-container .head-backg .top-h1 {
    font-family: 'Albert Sans', sans-serif;
    font-size: 3.5em;
    line-height: 1.0em;
    margin-top: 5px;
    font-weight: bold!important;
}
.head-container .head-backg .top-descri {
    font-size: 2.1em;
    font-weight: normal;
    line-height: 1.0em;
    color: #4A4A4A;
}
.head-container .head-backg .top-subdesc {
    font-size: 1.7em;
    line-height: 1.4em;
    margin-top: -10px;
}
.head-container .head-backg .top-subdesc .purp {
    color: #AD2169;
    font-weight: bold;
}

/* download app section */
.gstart-container {
    background: url(../images/gstart-background.png) no-repeat right top scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color: #FFFFFF;
}

.gstart-container .title {
    font-size: 1.8em;
    line-height: 1.3em;
}

/* why container */
.why-container {
    background: url(../images/why-box-background.png) no-repeat right top scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    margin-top: 40px;
    padding: 0px;
    -webkit-border-radius: 36px;
    -moz-border-radius: 36px;
    border-radius: 36px;
    color: #EBEBEB;
    margin: 120px 5px 5px 5px!important;
}
.why-man-image {
    max-height: 600px;
}
.why-title {
    font-weight: bold;
    font-size: 3.4em;
    color: #FFFFFF;
    text-align: right;
    margin-top: 30px;
}
.why-content .title {
    font-size: 1.5em;
    font-weight: bold;
    margin-left: 30px;
    margin-top: 20px;
}
.why-content ul {
    margin-left: 20px;
    font-size: 1.4em;
    margin-top: 20px;
}
.why-content ul li {
    background: url(../images/why-list-image.png) no-repeat left top;
    padding: 0px 0px 0px 40px;
    list-style: none;
    line-height: 1.0em;
    margin-top: 10px;
    margin-bottom: 10px;
}

/* functions container */
.functs-container {
    margin: 40px 0px 40px 0px;
}
.functs-container .title {
    font-size: 1.3em;
    font-weight: bold;
    margin-bottom: 10px;
    line-height: 1.3em;;
}
.funct-left-box {
    background: #ADADAD;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    padding: 30px;
    color: #FFFFFF;
    box-shadow: 4px 1px 12px -3px rgba(0,0,0,0.49);
    -webkit-box-shadow: 4px 1px 12px -3px rgba(0,0,0,0.49);
    -moz-box-shadow: 4px 1px 12px -3px rgba(0,0,0,0.49);
    height: 100%!important;
    font-size: 1.3em;
}
.funct-right-box {
    background: #F2F2F2;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    padding: 30px;
    box-shadow: 4px 1px 12px -3px rgba(0,0,0,0.30);
    -webkit-box-shadow: 4px 1px 12px -3px rgba(0,0,0,0.30);
    -moz-box-shadow: 4px 1px 12px -3px rgba(0,0,0,0.30);
    height: 100%!important;
    font-size: 1.3em;
}
.funct-left-box .title, .funct-right-box .title {
    color: #B11D64;
    font-size: 1.5em;
    font-weight: bold;
    padding-left: 25px;
    padding-bottom: 20px;
}
.funct-left-box ul li, .funct-right-box ul li {
    background: url(../images/funct-list-image.png) no-repeat left center;
    padding: 0px 0px 0px 40px;
    list-style: none;
    line-height: 1.3em;;
    margin-top: 14px;
    margin-bottom: 14px;
}

/* Register as a guest container */
.regues-container {
    background-color: #F0F0F0;
    margin-top: 60px;
}
.regues-backg {
    background: url(../images/quick-background.png) no-repeat left top scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.regues-backg .quick-phone-image {
    max-height: 560px;
}
.regues-backg .title {
    font-size: 1.9em;
    font-weight: bold;
    line-height: 1.3em;
}
.regues-backg .subtitle {
    margin-top: 30px;
    font-size: 1.5em;
    font-weight: bold;
}
.regues-backg .content {
    margin-top: 5px;
    font-size: 1.3em;
    line-height: 1.2em;
}

/* have container */
.have-container {
    margin-top: 60px;
}
.have-container .have-text {
    padding-top: 40px;
    padding-bottom: 30px;
}
.have-container .have-text .title {
    font-size: 2.9em;
    font-weight: bold;
    line-height: 1.3em;
    margin-bottom: 30px;
}
.have-container .have-text .subtitle {
    margin-top: -5px;
    font-size: 1.5em;
    font-weight: bold;
}
.have-container .have-text .content {
    margin-top: 5px;
    font-size: 1.3em;
    line-height: 1.2em;
    margin-bottom: 10px;
}
.have-container .have-text .content hr {
    margin: 10px 0px 0px 0px;
    padding: 0px;
    border: solid 1px #C1C1C1;
}

/* testimonials container */
.testi-container .title {
    font-size: 2.9em;
    font-weight: bold;
    line-height: 1.3em;
    margin-bottom: 30px;
}
.testi-container .testi-box {
    background-color: #E5E5E5;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    padding: 0px 20px 30px 20px;
    height: 100%;
}
.testi-container .testi-box .testi-image img {
    width: 120px;
    height: 120px;
    margin-top: -60px;
}
.testi-container .name {
    font-size: 1.2em;
    font-weight: bold;
    line-height: 1.3em;
}
.testi-container .profes {
    font-size: 1.3em;
    line-height: 1.3em;
}
.testi-container .descri {
    font-size: 1.0em;
    line-height: 1.3em;
}

/* register as guest container */
.reguest {
    margin-top: 80px!important;
}
.reguest-title {
    font-size: 1.9em;
    font-weight: bold;
    line-height: 1.0em;
}
.reguest-container {
    background: url(../images/why-box-background.png) no-repeat right top scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding: 0px;
    -webkit-border-radius: 36px;
    -moz-border-radius: 36px;
    border-radius: 36px;
    color: #EBEBEB;
    margin: 40px 5px 5px 5px!important;
}
.reguest-phone-image {
    max-height: 600px;
}
.reguest-content .title {
    font-size: 2.3em;
    font-weight: bold;
    margin-top: 80px;
    line-height: 1.2em;
}
.reguest-content .content {
    font-size: 1.3em;;
    margin-top: 60px;
    line-height: 1.0em;
}
.reguest-content .buttons {
    margin-top: 60px;
}

/* download section container */
.downlo {
    margin-top: 60px!important;
}
.downlo-title {
    font-size: 1.9em;
    font-weight: bold;
    line-height: 1.0em;
}
.downlo-container {
    background: url(../images/downlo-box-background.png) no-repeat right top scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding: 0px;
    -webkit-border-radius: 36px;
    -moz-border-radius: 36px;
    border-radius: 36px;
    margin: 40px 5px 5px 5px!important;
}
.downlo-noti-image {
    max-height: 560px;
}
.downlo-content .title {
    font-size: 2.2em;
    font-weight: bold;
    margin-top: 20px;
    line-height: 1.2em;
}
.downlo-content .content {
    font-size: 1.3em;;
    margin-top: 60px;
    line-height: 1.0em;
}
.downlo-content img {
    max-height: 70px;
}

.footer-top-container {
    background-color: #000000;
}
.footer-top-container img {
    max-height: 90px;
}
.footer-top-container .title {
    font-size: 1.4em;
    line-height: 1.3em;
    color: #aa226c;
    font-weight: bold;
}
.footer-top-container .descri {
    font-size: 1.3em;
    line-height: 1.3em;
    color: #FFFFFF;
}
.footer-top-container .subdesc {
    font-size: 1.3em;
    line-height: 1.3em;
    color: #909090;
}
.footer-bottom-container {
    background-color: #2C2C2C;
    color: #7F7F7F;
    font-size: 1.0em;
    line-height: 1.3em;
}

@media (max-width: 768px) {
    .head-container {
        background: url(../images/head-background-mobile.png) no-repeat right top scroll;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
    .head-container .head-backg {
        background-image: none;
    }
    .head-container .head-backg .top-h1 {
        font-size: 2.9em;
    }
    .head-container .head-backg .top-descri {
        font-size: 1.3em;
    }
    .head-container .head-backg .top-subdesc {
        font-size: 1.6em;
    }
    .functs-container .title {
        font-size: 1.3em;
        font-weight: bold;
        line-height: 1.0em;
    }
    .why-container {
        margin-top: 60px !important;
    }
    .why-title {
        font-size: 2.5em;
        text-align: center;
    }
    .why-man-image {
        max-height: 300px;
    }
    .why-content ul {
        margin-left: -10px;
    }
    .testi-container .title {
        margin-bottom: 50px;
    }
    .testi-container .b-box {
        margin-top: 40px;
        margin-bottom: 40px;
    }
    .reguest-title {
        font-size: 1.3em;
        font-weight: bold;
        line-height: 1.0em;
    }
    .reguest-content .title {
        font-size: 1.3em;
        margin-top: 50px;
        line-height: 1.2em;
    }
}

@media (max-width: 988px) {
    .head-button {
        max-height: 60px;
    }

}
