html, body { margin:0; padding:0; width:100%; height:100%; }
*,*:before,*:after {-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
body {
    font-family:"Roboto", Arial, Helvetica, sans-serif;
    font-size:1rem; line-height:1.5rem;
    color:#7f7f7f; background:#fff;
}
.header { width:100%; padding:6px 0; margin:0 auto; right:10; position:absolute; z-index:999; }
.menu-button { margin:15px; padding:0; float:right; }
.loginbtn {
    border:1px solid #d2d2d2; color:#d2d2d2; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; padding:9px; cursor:pointer;
}
#aboutus {
    background:url('../img/bgweb.jpg') no-repeat center top; padding-top:60px; padding-bottom:20px; height:100vh; width:100%;
    -webkit-background-size:cover; -moz-background-size:cover; -o-background-size:cover; background-size:cover;
}
.topbanner-title{ color:#ffffff; padding:20px; text-align:center; margin-top:5%; line-height:30px; margin-left:20%; }
.logo { max-width:220px; margin:10px auto; padding:10px; }
.aboutus_content_words { font-size:60px !important; line-height:70px; font-family:'Raleway', sans-serif; text-align:center; }
.subtxt { font-size:30px; line-height:55px; padding:10px 0px;}
.yellowbutton{
    width:100%; padding:16px 10px 11px; cursor:pointer; font-family:'Catamaran', cursive;
    color:#333; font-size:19px; text-align:center; text-decoration:none;
    border:none; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;
    background-color:#ffcb00; max-width:300px; font-weight:800; margin:0 auto; text-align:center; float:none; clear:both;
}
.yellowbutton a { color:#333; }
.yellowbutton:hover{ opacity:0.7; }
/*gallery web*/
.slideshow {
    width:220px; height:100vh;
    position:absolute; top:0; left:80px; z-index:1;
    overflow-y:hidden; display:block;
    transform:translate3d(0, 0, 0); -webkit-transform:translate3d(0, 0, 0);
    -moz-transform:translate3d(0, 0, 0);
}
.slideshow2 {
    width:220px; height:100vh;
    position:absolute; top:0;  left:245px; z-index:1;
    overflow-y:hidden; display:block;
    transform:translate3d(0, 0, 0); -webkit-transform:translate3d(0, 0, 0);
    -moz-transform:translate3d(0, 0, 0);
}
.slideshow > div {
    height:3810px; width:100%;
    background:url('../img/scroll01.png') repeat-y;
    position:absolute; top:0; left:0;
}
.slideshow2 > div {
    height:3810px; width:100%;
    background:url('../img/scroll02.png') repeat-y;
    position:absolute; bottom:0; left:0;
}
.slideshow .mover-1 {
    -webkit-animation:slideWeb 25s linear infinite;
    -moz-animation:slideWeb 25s linear infinite;
    -o-animation:slideWeb 25s linear infinite;
    animation:slideWeb 25s linear infinite;
}
.slideshow2 .mover-3 {
    -webkit-animation:slideWeb3 22s linear infinite;
    -moz-animation:slideWeb3 22s linear infinite;
    -o-animation:slideWeb3 22s linear infinite;
    animation:slideWeb3 22s linear infinite;
}
@keyframes slideWeb {
    100% { transform:translateY(-50%); }
}
@-webkit-keyframes slideWeb {
    100% { -webkit-transform:translateY(-50%); transform:translateY(-50%); }
}
@-moz-keyframes slideWeb {
    100% { -moz-transform:translateY(-50%); transform:translateY(-50%); }
}
@-o-keyframes slideWeb {
    100% { -o-transform:translateY(-50%); transform:translateY(-50%); }
}
@keyframes slideWeb3 {
    100% { transform:translateY(50%); }
}
@-webkit-keyframes slideWeb3 {
    100% { -webkit-transform:translateY(50%); transform:translateY(50%); }
}
@-moz-keyframes slideWeb3 {
    100% { -moz-transform:translateY(50%); transform:translateY(50%); }
}
@-o-keyframes slideWeb3 {
    100% { -o-transform:translateY(50%); transform:translateY(50%); }
}
/*gallery mobi*/
.slideshow-mobi {
    height:130px;  max-width:500px;  margin:30px auto;
    position:relative; overflow:hidden; display:none;
    transform:translate3d(0, 0, 0);
    -webkit-transform:translate3d(0, 0, 0);
    -moz-transform:translate3d(0, 0, 0);
}
.slideshow-mobi > div {
    width:1912px; height:100%;
    background:url('../img/scroll_mb.png') repeat-x;
    position:absolute; top:0; left:0;
    transform:translate3d(0, 0, 0);
    -webkit-transform:translate3d(0, 0, 0);
    -moz-transform:translate3d(0, 0, 0);
}
.slideshow-mobi .mover-2 {
    opacity:1;
    -webkit-animation:moveSlideshow 25s linear infinite;
    -moz-animation:moveSlideshow 25s linear infinite;
    -o-animation:moveSlideshow 25s linear infinite;
    animation:moveSlideshow 25s linear infinite;
}
@keyframes moveSlideshow {
    100% { transform:translateX(-50%); }
}
@-webkit-keyframes moveSlideshow {
    100% { -webkit-transform:translateX(-50%); transform:translateX(-50%); }
}
@-moz-keyframes moveSlideshow {
    100% { -moz-transform:translateX(-50%); transform:translateX(-50%); }
}
@-o-keyframes moveSlideshow {
    100% { -o-transform:translateX(-50%); transform:translateX(-50%); }
}
.section2 { padding:50px 0; }
.yellowline{ height:7px; background-color:#ffd43c; max-width:100px;  width:100%;  margin:15px auto; }
h1 { color:#535353; font-size:36px; font-weight:bold; font-family:'Catamaran', cursive; text-align:center; }
h2 { color:#7f7f7f; font-size:22px; line-height:26px; font-family:'Catamaran', cursive; text-align:center; }
.workbox {
    max-width:900px; margin:20px auto 0;
    display:flex; display:-webkit-flex; display:-ms-flexbox; align-items:center; -webkit-align-items:center; -ms-flex-align:center;
    justify-content:space-between; -webkit-justify-content:space-between; -webkit-flex-direction:row; flex-direction:row;
    gap:30px;
}
.wpoint { display:flex; display:-webkit-flex; display:-ms-flexbox; align-items:center; -webkit-align-items:center; -ms-flex-align:center; }
.wpoint p { margin-left:15px; }
.wtitle{text-align:left;font-weight:bold; font-size:15px; color:#333; }
.section3{
    margin:50px auto 0px;
    width:100%;
    background:url('../img/banner01.png')  no-repeat center top;
    -webkit-background-size:cover;
    -moz-background-size:cover;
    -o-background-size:cover;
    background-size:cover;
    min-height:840px;
    height:100%;
    text-align:center;
}
.row_center{ text-align:left; padding-bottom:0px; margin:15px auto; overflow:hidden; max-width:800px; width:100%; }
.row_promo{ text-align:center; padding-bottom:0px; margin:15px auto; overflow:hidden; max-width:700px; width:100%; }
.banner_title{
    font-size:33px; font-weight:bold; background:#ec1e79;
    max-width:400px; padding:17px; color:#fff; text-align:center;
    margin:50% auto 20px;
    box-shadow:5px 5px 0px rgba(0, 0,0, 0.3);
    -moz-box-shadow:5px 5px 0px rgba(0, 0,0, 0.3);
    -webkit-box-shadow:5px 5px 0px rgba(0, 0,0, 0.3);
    -khtml-box-shadow:5px 5px 0px rgba(0, 0,0, 0.3);
}
.banner_bottom img{ position:relative; z-index:900; width:100%;  margin:0px auto;}
.signup_button{
    width:100%; padding:13px 10px 10px; cursor:pointer; font-family:'Catamaran', cursive; color:#ffffff;
    font-size:19px; text-align:center; text-decoration:none;
    border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;
    background-color:#47c6ba; max-width:260px; font-weight:bold; margin:0 auto; text-align:center; border:2px solid white;
}
.banner_txt{ color:white; font-size:23px; line-height:30px; text-align:center; }
.stnc { color:white; font-size:16px; line-height:20px; }
.section4{
    width:100%;
    background:url('../img/support_bg.jpg');
    -webkit-background-size:cover;
    -moz-background-size:cover;
    -o-background-size:cover;
    background-size:cover;
    top:253%;
    min-height:800px;
}
.contact {
    max-width:900px; margin:20px auto 0;
    display:flex; display:-webkit-flex; display:-ms-flexbox; align-items:center; -webkit-align-items:center; -ms-flex-align:center;
    justify-content:space-between; -webkit-justify-content:space-between; -webkit-flex-direction:row; flex-direction:row;
    gap:30px;
}
.support_txt { font-family:'Catamaran', cursive; font-size:17px; text-align:left; margin:15px auto; color:white; color:#cbcbcb; }
.support_title{ font-family:'Catamaran', cursive; font-size:30px; text-align:left; margin-top:16%; color:white; font-weight:bold; margin:10px auto 20px; }
.contactus_form .btn{
    width:100%;
    padding:15px 10px;
    cursor:pointer;
    font-family:'Catamaran', cursive;
    color:#ffcb00;
    font-size:20px;
    text-align:center;
    text-decoration:none;
    border-radius:5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    background-color:rgba(0,0,0,0.4);
    max-width:260px;
    font-weight:bold;
    margin:0 auto;
    text-align:center;
    float:none;
    clear:both;
    border:2px solid #ffcb00;
}
.contactus_form .btn:hover{
    color:#333;
    background-color:#ffcb00;
    border-color:#ffcb00;
}
.contactus_form input[type='text'], .contactus_form input[type='email'], .contactus_form textarea, .g-recaptcha {
    margin:10px 0;
    background-color:rgba(0,0,0,0.4);
    border-radius:5px;
    border:1px solid #c7c7c7;
    color:#fff;
    width:100%;
    padding:20px;
}
::placeholder { font-family:'Catamaran', cursive; text-align:left; color:#8b8b8b; font-size:16px; font-weight:500; }
::-webkit-input-placeholder { font-family:'Catamaran', cursive; text-align:left; color:#8b8b8b; font-size:16px; font-weight:500; }
:-moz-placeholder { font-family:'Catamaran', cursive; text-align:left; color:#8b8b8b; font-size:16px; font-weight:500; }
::-moz-placeholder { font-family:'Catamaran', cursive; text-align:left; color:#8b8b8b; font-size:16px; font-weight:500; }
:-ms-input-placeholder { font-family:'Catamaran', cursive; text-align:left; color:#8b8b8b; font-size:16px; font-weight:500; }
.hidden { display:none; }
.text-error {
    padding:10px; margin:6px 0; color:#ff5151;
}
.text-success {
    padding:10px; margin:6px 0; color:#25b130;
}
#overlay_bg { display:none; z-index:9999;width:100%; height:100%; top:0; left:0; position:fixed; background-color:#333; opacity:0.75; }
#overlay_box {
    display:none; box-shadow:0 5px 15px rgba(0,0,0,0.3); color:#333; background-color:#f9f9f9;
    max-width:450px; width:90%;
    top:25%; left:0; right:0; position:fixed; z-index:99999;
    border-radius:30px; -moz-border-radius:30px; -webkit-border-radius:30px; -khtml-border-radius:30px;
    text-align:center; padding:40px 15px; margin:0 auto;
}
#overlay_box > .btn {
    color:#fff; font-size:19px; line-height:35px; font-weight:bold; text-decoration:none; max-width:200px;
    width:100%; padding:14px; display:inline-block; cursor:pointer; box-sizing:border-box;
    border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; -khtml-border-radius:10px;
    background:#ff2400;
}
#popbox_title { font-size:2rem; line-height:1.2em; font-weight:bold; margin:0 auto; color:#333; text-align:center; padding:0; }
#popbox_desc { font-size:17px; padding:5px 10px 10px; }
#footer { margin:5% auto 0; padding:20px 0; position:relative; z-index:10; font-size:14px; }
.logo_footer, .logo_footer img { max-width:70px; width:100%; margin:0 auto 5px; }
.footerwrap {
    width:90%; max-width:1800px; margin:0 auto;
    display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-flex-direction:column; flex-direction:column;
    -webkit-justify-content:space-between; justify-content:space-between; -webkit-align-items:center; -ms-flex-align:center; align-items:center;
}
.tnclinks { padding-bottom:5px; }
.extra_link a, .copyright a { color:#8a8a8a; }
 #scroll-top {
    display:none; cursor:pointer; position:fixed; bottom:100px; right:15px; z-index:10; text-align:center;
    background-color:rgba(0,0,0,.5); width:50px; height:50px; color:#fff; font-size:24px; font-weight:800; line-height:50px;
    border-radius:50px; -moz-border-radius:50px; -webkit-border-radius:50px;
}
#scroll-top span { display:block; -webkit-animation:animate 1s infinite; animation:animate 1s infinite; }

@-webkit-keyframes animate {
    0% { -webkit-transform:translate(0, -3px); transform:translate(0, -3px); }
    50% { -webkit-transform:translate(0, 3px); transform:translate(0, 3px); }
    100% { -webkit-transform:translate(0, -3px); transform:translate(0, -3px); }
}
@keyframes animate {
    0% { -webkit-transform:translate(0, -3px); transform:translate(0, -3px); }
    50% { -webkit-transform:translate(0, 3px); transform:translate(0, 3px); }
    100% { -webkit-transform:translate(0, -3px); transform:translate(0, -3px); }
}
@media handheld, only screen and (max-width:1367px) {
    .logo { max-width:200px; }
    .topbanner-title { margin-top:0;}
}
@media handheld, only screen and (max-width:576px) {
    .logo { max-width:120px; }
    #aboutus {  background:url('../img/bgmobi.jpg') no-repeat center top;}
    .aboutus_content_words { font-size:43px !important; line-height:46px; }
    .subtxt { font-size:22px; }
    .topbanner-title { padding:0; margin-left:0; }
    .section3{ margin:0px auto; padding:25px 20px 0px; background:url('../img/banner_mobi2.png')  no-repeat center top; min-height:750px; }
    .workbox, .contact { gap:0; width:90%; -webkit-flex-direction:column; -ms-flex-direction:column; flex-direction:column; justify-content:center; align-items:center;}
    .banner_bottom{ display:none; }
    .banner_title { font-size:26px; margin:32% auto 5px; }
    .banner_txt { font-size:16px; line-height:23px; }
    .stnc { line-height:18px; }
    .slideshow-mobi { display:block; }
    .slideshow, .slideshow2  { display:none; }
    .contact { margin:0 auto; padding:50px 0; }
    .stnc { font-size:14px; line-height:18px; }
}
