﻿@import url("https://fonts.googleapis.com/css2?family=Battambang:wght@700&display=swap&family=Poppins&display=swap");*{-webkit-tap-highlight-color:transparent}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type="number"]{-moz-appearance:textfield}body{padding:0;margin:0px;font-family:"Battambang", "Poppins";letter-spacing:0.5px;position:relative}body a{text-decoration:none}body .box-contianer{position:relative;width:100vw;height:100vh;overflow-x:hidden}body .box-contianer .bg-style{width:100vw;height:100vh;position:absolute;left:0;z-index:-1}body .box-contianer .row-add{height:400px;position:absolute}body .box-contianer .img-left{width:100%;background:url("../image/logo369.png") no-repeat center center;background-size:contain}body .box-contianer .box-login{display:flex;flex-direction:column;align-items:center;margin:auto;position:relative;color:#fff;background:#fff;background-clip:padding-box;border:solid 10px transparent;border-radius:2.5em;box-shadow:0px 0px 25px gray}body .box-contianer .box-login:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;margin:-10px;border-radius:inherit;background:linear-gradient(100deg, #4465a6, #88b6f2)}body .box-contianer .box-login .box-title{width:100vw;background:url("../image/jollenglogo.png") no-repeat center center;background-size:contain}body .box-contianer .box-login form{width:90%;display:flex;flex-direction:column;justify-content:start;color:#fff}body .box-contianer .box-login form .box-label{color:#173965;padding:5px 0;font-weight:bold}body .box-contianer .box-login form .box-input{width:100%;height:40px;border-top:4px solid #173965;border-bottom:4px solid #173965;border-right:4px solid #173965;border-radius:50px;display:flex;flex-direction:row;align-items:center;margin:0 0 8px 0}body .box-contianer .box-login form .box-input .box-icon{background:#173965;display:flex;flex-direction:row;justify-content:center;padding:10px;border-radius:50px}body .box-contianer .box-login form .box-input .box-icon svg{fill:#fff}body .box-contianer .box-login form .box-input input{width:80%;height:98%;outline:none;border:none;box-sizing:border-box;font-size:16px;padding-left:10px;display:flex;flex-direction:row;align-items:center}body .box-contianer .box-login form .box-input input::placeholder{font-size:14px;color:#173965;font-weight:bold;letter-spacing:1px;opacity:0.8;line-height:30px}body .box-contianer .box-login form #box-phone{width:100%;display:flex;flex-direction:row}body .box-contianer .box-login form .box-select{width:100%;height:40px;position:relative;border-radius:50px;overflow:hidden}body .box-contianer .box-login form .box-select::before{position:absolute;content:url("../image/riel.svg");width:40px;height:40px;padding:8px;top:0;left:0;border-radius:50px 50px 50px 50px;text-align:center;box-sizing:border-box}body .box-contianer .box-login form .box-select select{color:#e45c5c;width:100%;height:100%;outline:none;text-align:center;text-indent:calc(100% - 85%);font-size:15px;font-weight:bold;font-family:"battambang", cursive;background-color:#fff;line-height:30px}body .box-contianer .box-login form .box-select select option{width:100%;height:100%}body .box-contianer .box-login form .box-remember{position:relative}body .box-contianer .box-login form .box-remember .styled-checkbox{position:absolute;opacity:0}body .box-contianer .box-login form .box-remember .styled-checkbox+label{position:relative;cursor:pointer;padding:0;color:#173965;font-weight:bold}body .box-contianer .box-login form .box-remember .styled-checkbox+label:before{content:"";display:inline-block;width:18px;height:18px;border:1px solid #173965;border-radius:5px;vertical-align:sub}body .box-contianer .box-login form .box-remember .styled-checkbox:checked+label:after{content:"✔";color:#292a2b;position:absolute;left:3px;top:0px;width:3px;height:3px}body .box-contianer .box-login form .btn-submit{border-radius:50px;cursor:pointer;border:none;background:#173965;color:#fff;font-family:"battambang";text-align:center}body .box-contianer .box-login form .box-bottom{width:100%;display:flex;flex-direction:row;align-items:center;position:absolute;bottom:0;justify-content:center}body .box-contianer .box-login form .box-bottom h2{font-size:15px}body .box-contianer #contain-signup .box-conf{width:100%;display:flex}body .box-contianer #contain-signup .box-conf .box-phonenum{width:55%;display:flex;flex-direction:column;order:2}body .box-contianer #contain-signup .box-conf .box-currency{width:43%;display:flex;flex-direction:column;margin-right:2%;order:1}body .box-contianer #contain-signup .box-conf .box-currency #label-currency{width:100%;text-align:left}@media (min-width: 1200px){body{overflow-y:hidden}body .box-contianer{overflow:hidden}body .box-contianer #contain-signup{height:580px;padding:5px}body .box-contianer .row-add{width:70%;top:45%;left:50%;transform:translate(-50%, -50%)}body .box-contianer .img-left{height:90%}body .box-contianer .box-login{width:500px;height:480px}body .box-contianer .box-login .box-title{height:80px;margin-top:40px;margin-bottom:30px}body .box-contianer .box-login #box-title{background-size:contain;margin:10px 0}body .box-contianer .box-login form .btn-submit{width:40%;height:40px;font-size:18px;margin:30px}body .box-contianer .box-login form .box-bottom .btn-sign-up{width:120px;height:35px;margin-left:20px}body .box-contianer .img-point{width:120px;height:120px}.bg-style{background-image:url("../image/background_loto.svg");background-size:cover}}@media (min-width: 992px) and (max-width: 1199.98px){body{overflow-y:hidden}body .box-contianer .row-add{width:70%;top:50%;left:50%;transform:translate(-50%, -50%)}body .box-contianer .img-left{height:100%}body .box-contianer .box-login{width:450px;height:450px}body .box-contianer .box-login .box-title{height:60px;margin-top:40px;margin-bottom:30px}body .box-contianer .box-login #box-title{background-size:contain;margin:10px 0}body .box-contianer .box-login form .btn-submit{width:150px;height:40px;font-size:22px;margin:30px auto}body .box-contianer .box-login form .box-bottom .btn-sign-up{width:120px;height:35px;margin-left:20px}body .box-contianer .box-login form .box-select select{text-align:left}body .box-contianer #contain-signup{height:630px;padding:5px}body .box-contianer #contain-signup #box-title{margin:10px 0}body .box-contianer #contain-signup .box-conf{flex-direction:column}body .box-contianer #contain-signup .box-conf .box-phonenum{width:100%}body .box-contianer #contain-signup .box-conf .box-currency{width:100% !important}body .box-contianer #contain-signup .box-conf .box-currency #label-currency{text-align:left}body .box-contianer .img-point{width:120px;height:120px}.bg-style{background-image:url("../image/lotobg.png");background-size:cover}}@media (min-width: 768px) and (max-width: 991.98px){body{overflow-y:hidden}body .box-contianer .certain{display:none}body .box-contianer .certain .bg-top{display:none}body .box-contianer .row-add{width:90%;top:50%;left:50%;transform:translate(-50%, -50%)}body .box-contianer .img-left{height:100%}body .box-contianer .box-login{max-width:500px;height:450px}body .box-contianer .box-login .box-title{height:60px;margin-top:40px;margin-bottom:30px}body .box-contianer .box-login #box-title{background-size:contain;margin:10px 0}body .box-contianer .box-login form .btn-submit{width:100px;height:35px;font-size:18px;margin:30px auto}body .box-contianer .box-login form .box-bottom .btn-sign-up{width:120px;height:35px;margin-left:20px}body .box-contianer .box-login form .box-select select{text-align:left}body .box-contianer #contain-signup{height:630px}body .box-contianer #contain-signup #box-title{margin:10px 0}body .box-contianer #contain-signup .box-conf{flex-direction:column}body .box-contianer #contain-signup .box-conf .box-phonenum{width:100%}body .box-contianer #contain-signup .box-conf .box-currency{width:100% !important}body .box-contianer #contain-signup .box-conf .box-currency #label-currency{text-align:left}body .box-contianer .img-point{width:120px;height:120px}.bg-style{background-image:url("../image/BG.png");background-size:cover}}@media (min-width: 576px) and (max-width: 767.98px){body .box-contianer{overflow:hidden}body .box-contianer .row-add{width:100%;margin:0}body .box-contianer .img-left{width:100%;height:220px;margin:10px 0}body .box-contianer .box-login{max-width:500px;margin:auto;height:400px;padding:25px 0}body .box-contianer .box-login .box-title{width:100%;height:80px}body .box-contianer .box-login form .box-input{height:50px}body .box-contianer .box-login form .box-input .box-icon{width:35px;height:35px;align-items:center}body .box-contianer .box-login form .box-input input::placeholder{font-size:14px}body .box-contianer .box-login form .box-select{width:100%;height:50px}body .box-contianer .box-login form .box-select::before{width:50px;height:50px;padding:10px 0}body .box-contianer .box-login form .box-select select{text-align:left}body .box-contianer .box-login form .btn-submit{width:100px;height:34px;font-size:18px;margin:15px auto}body .box-contianer .box-login form .box-bottom .btn-sign-up{width:100px;height:30px;margin-left:10px}body .box-contianer #contain-signup{height:660px}body .box-contianer #contain-signup #box-title{margin:0}body .box-contianer #contain-signup .box-conf{flex-direction:column}body .box-contianer #contain-signup .box-conf .box-phonenum{width:100%}body .box-contianer #contain-signup .box-conf .box-currency{width:100% !important}body .box-contianer #contain-signup .box-conf .box-currency #label-currency{text-align:left}body .box-contianer .img-point{width:80px;height:80px}.bg-style{background-image:url("../image/BG.png");background-size:cover}}@media (max-width: 575.98px){body .box-contianer .bg-top{height:40px}body .box-contianer .bg-bottom-m{height:40px;bottom:18px}body .box-contianer .row-add{width:100%;height:300px;margin:0}body .box-contianer .img-left{width:100%;height:165px;margin:10px 0}body .box-contianer .box-login{height:365px;padding:20px 0}body .box-contianer .box-login .box-title{width:100%;height:60px}body .box-contianer .box-login form .btn-submit{width:40%;height:34px;font-size:18px;margin:20 px 0 0 10%}body .box-contianer .box-login form .box-select select{text-align:left}body .box-contianer .box-login form .box-input input::placeholder{font-size:14px}body .box-contianer .box-login form .box-bottom .btn-sign-up{width:100px;height:30px;margin-left:10px}body .box-contianer #contain-signup{height:570px}body .box-contianer #contain-signup #box-title{margin:0}body .box-contianer #contain-signup .box-conf{flex-direction:column}body .box-contianer #contain-signup .box-conf .box-phonenum{width:100%}body .box-contianer #contain-signup .box-conf .box-currency{width:100% !important}body .box-contianer #contain-signup .box-conf .box-currency #label-currency{text-align:left}body .box-contianer .img-point{width:80px;height:80px}body .bg-style{background-image:url("../image/BG.png");background-size:cover}}
