@charset "UTF-8";
/*
Theme Name: Seal RO
Theme URI: https://wordpress.org/themes/twentynineteen/
Author: RealOne Programmer
Author URI: https://www.facebook.com/piroonrat.ruenam
Description: Our 2019 default theme is designed to show off the power of the block editor. It features custom styles for all the default blocks, and is built so that what you see in the editor looks like what you'll see on your website. Twenty Nineteen is designed to be adaptable to a wide range of websites, whether you’re running a photo blog, launching a new business, or supporting a non-profit. Featuring ample whitespace and modern sans-serif headlines paired with classic serif body text, it's built to be beautiful on all screen sizes.
Requires at least: 4.9.6
Requires PHP: 5.2.4
Version: 2.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentynineteen
Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, rtl-language-support, sticky-post, threaded-comments, translation-ready, block-patterns

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Twenty Nineteen is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/

Bundled block pattern images:
Abstract Background by HD Wallpapers, CC0. https://stocksnap.io/photo/abstract-background-0SRRVNMKBX
Abstract Waves by HD Wallpapers, CC0. https://stocksnap.io/photo/abstract-waves-0KREGLTZQ3
Abstract Bokeh by HD Wallpapers, CC0. https://stocksnap.io/photo/abstract-bokeh-P4KVZBMQ6L
Colorful Bokeh by HD Wallpapers, CC0. https://stocksnap.io/photo/colorful-bokeh-VN4G84GL8H
*/
@import url('https://fonts.googleapis.com/css2?family=Prompt&family=Roboto&display=swap');
body {
    font-family: 'Prompt', sans-serif;
    background: #000000;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}
@media (max-width: 991px){
    .z-map{
        /*zoom:0.7 !important;*/
    }
    .navbar-header {
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9d0102', endColorstr='#570102', GradientType=0);
        border-radius: 0px;
        padding: 5px;
        width: 100%;
        text-align: center;
        display: block;
        float: left;
        position: relative;
    }
    .navbar-header li {
        display: inline-block;
        padding: 6px;
        width: calc(50% - 10px);
        margin: 5px;
        border-radius: 5px;
        white-space: nowrap;
        float: left;
        box-shadow: 0px 2px 5px rgb(0 0 0 / 65%);
        background-color: #7289da;
        border-color: #7289da;
    }
    .login-form-main{

    }
    .login-form{
        margin-top: 15px;
        margin-bottom: 15px;
        display: inline-block !important;
        padding: 15px !important;
        width: calc(47.1% - 10px);
        margin: 5px !important;
        border-radius: 5px !important;
        white-space: nowrap !important;
        float: left;
        box-shadow: 0px 2px 5px rgb(0 0 0 / 65%);
        background-color: #7289da;
        border-color: #7289da;
    }
    .w-md-warp{
        white-space: initial !important;
    }
    .w-break{
        white-space: initial !important;
    }
    .text-white-md{
        color: white !important;
    }
}
@media (max-width: 767px){
    .zoom-50{
        zoom:0.5 !important;
    }
    .z-map{
        /*zoom:0.5 !important;*/
    }
}
@media (max-width: 375px){
    .navbar-header li{
        font-size: 12px;
    }
    .zoom-50{
        zoom:0.5 !important;
    }
    .z-map{
        /*zoom:0.35 !important;*/
    }
}
.z-map{
    zoom:1;
    overflow: auto;
}
.btn-purple{
    color: #ffffff !important;
    background-color: #7289da;
    border-color: #7289da;
}
.btn-purple:hover{
    color: #ffffff !important;
    background-color: #7e96ed;
    border-color: #7e96ed;
}
.bg-darker{

}
.bg-blue{
    background-color: #d5ecf2;
}
.bg-blue-seal{
    background-color: #dfdfdfb5;
}
.font-blue{
    color:#212529;
}
.left-blue{
    border-left:5px solid #212529;
}
.main-logo {
    width: 50px;
}


.main-bg {
    will-change: transform;
    transition: transform .3s ease-in-out;
    background-image: url('images/bg-01.jpg');
    padding-top: 50%;
    background-position: center;
    background-size: cover;
    overflow: hidden;
}
.main-bg:hover {
    transform: scale(1.01);
}
.floatMotion.motion--float01 {
    width: 171px;
    height: 171px;
    top: 510px;
    right: 1%;
    background: transparent url(img/float-06.png) center top no-repeat;
    -webkit-animation: pokerGril 5s 0s linear infinite;
    animation: pokerGril 5s 0s linear infinite;
}
.floatMotion.motion--float02 {
    width: 171px;
    height: 171px;
    top: 510px;
    right: 1%;
    background: transparent url(img/float-06.png) center top no-repeat;
    -webkit-animation: pokerGril 5s 0s linear infinite;
    animation: pokerGril 5s 0s linear infinite;
}
.w-nowarp{
    white-space: nowrap;
}

/* topup */
[v-cloak] {
    display: none;
}

.copy-me {
    color: #bd2130;
    font-weight: bold;
    border-bottom: dashed 1px;
}

:root {
    --ch-s: 80px;
}

.loader1 {
    position: relative;
    height: var(--ch-s);
    width: var(--ch-s);
    border-radius: 50%;
    border: 3px solid rgba(60, 60, 60, 0.7);
    top: 28%;
    top: -webkit-calc(50% - 43px);
    top: calc(50% - 43px);
    /*left: 35%;*/
    /*left: -webkit-calc(50% - 43px);*/
    /*left: calc(50% - 43px);*/

    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-animation: loader1 3s linear infinite;
    animation: loader1 3s linear infinite;
}

.loader1:after {
    content: "";
    position: absolute;
    top: -5px;
    left: 20px;
    width: 11px;
    height: 11px;
    border-radius: 10px;
    background-color: #2b2b2b;
}

@-webkit-keyframes loader1 {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}

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

.checking {
    display: flex;
    position: relative;
    justify-content: center;
    align-items: center;
    margin-right: 1em;
    width: var(--ch-s);
    height: var(--ch-s);
    font-size: 4em;
    background: transparent;
    border: 3px solid rgba(60, 60, 60, 0.7);
    border-radius: 50%;
    transition: all 250ms cubic-bezier(.4, .0, .23, 1);
}

.checking.done {
    border: .6em solid #1dbe42;
    animation: shrink-bounce 200ms cubic-bezier(.4, .0, .23, 1);
}

.checking.done:before {
    content: "";
    position: absolute;
    top: 0.1em;
    left: -0.24em;
    border-right: 0.1em solid transparent;
    border-bottom: 0.1em solid transparent;
    transform: rotate(45deg);
    transform-origin: 0% 100%;
    animation: checkbox-check 125ms 250ms cubic-bezier(.4, .0, .23, 1) forwards;
}

@keyframes shrink-bounce {
    0% {
        transform: scale(1);
    }
    33% {
        transform: scale(.85);
    }
    100% {
        transform: scale(1);
    }
}

@keyframes checkbox-check {
    0% {
        width: 0;
        height: 0;
        border-color: #212121;
        transform: translate3d(0, 0, 0) rotate(45deg);
    }
    33% {
        width: .2em;
        height: 0;
        transform: translate3d(0, 0, 0) rotate(45deg);
    }
    100% {
        width: .2em;
        height: .5em;
        border-color: #212121;
        transform: translate3d(0, -.5em, 0) rotate(45deg);
    }
}

.bank-inside {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0) scale(0.75);
    width: var(--ch-s);
    border-radius: 50%;
}
/* topup */
.page-numbers {
    display: inline-flex;
    list-style: none;
    padding: 5px 10px;
    margin: 0 2px 0 0;
    border: 1px solid #eee;
    line-height: 1;
    text-decoration: none;
    border-radius: 2px;
    font-weight: 600;
}
.page-numbers.current,
a.page-numbers:hover {
    background: #f9f9f9;
}
.map-mini{
    max-width: 100px;
    height: 100%;
}
.px50{
    max-width: 50px;
    height: 50px;
}
.img-hover-effect{
    -webkit-transform: scale(1) rotate(
            0deg
    );
    transform: scale(1) rotate(0deg);
    transition-duration: .3s;
}
.img-hover-effect:hover{
    -webkit-transform: scale(1.1) rotate(
            4deg
    );
    transform: scale(1.1) rotate(4deg);
    transition-duration: .3s;
}