@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-1Thin.woff2') format('woff2');
    font-weight: 100;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-2ExtraLight.woff2') format('woff2');
    font-weight: 200;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-3Light.woff2') format('woff2');
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-4Regular.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-5Medium.woff2') format('woff2');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-6SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-7Bold.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-8ExtraBold.woff2') format('woff2');
    font-weight: 800;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-9Black.woff2') format('woff2');
    font-weight: 900;
    font-display: swap;
}

*{ outline: none; font-family:'Paperozi'; line-height:1.6;}

html,body { margin:0; padding:0; width:100%; height:100%; 
position: relative; display:inline-block; align-items: top;justify-content: center; 
background-color:#fff;
/*-webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; */
}

body[orient="portrait"] { min-height:540px; }
body[orient="landscape"] { min-height:400px; }

video{ max-width:100%; object-fit:cover; 	object-position:center; }
ul{ margin:0; padding:0; list-style:none;}
ul > li{ margin:0; padding:0; list-style:none;}
ol{ margin:0; padding:0; list-style:none;}
ol > li{ margin:0; padding:0; list-style:none;}
dl{ margin:0; padding:0; list-style:none;}
dl > dt{ margin:0; padding:0; list-style:none;}
dl > dd{ margin:0; padding:0; list-style:none;}

p{ margin:0; line-height:1.8;}
s{ color:#cccccc;}

a img{ border:0px;}
a{ color:#555555; outline: none; text-decoration:none; selector-dummy : expression(this.hideFocus=true);}
a:hover{ cursor:pointer; color:#004cff; outline: none; text-decoration:none;}





table{ display:table; border-collapse:collapse;}
th,td{ display:table-cell;}
form{ padding:0; margin:0;}
input[type=button],button{ cursor:pointer;}
input[type=text],input[type=password],input[type=email],input[type=date],input[type=time]{ime-mode:inactive;; background-color:#fff; max-width:96%;}
input[type=number]{ime-mode:inactive; display:inline-block; max-width:96%;}
input[type=password]{ max-width:100%;}

input[type=text]:focus,input[type=password]:focus,input[type=email]:focus,input[type=date]:focus,input[type=time]:focus,input[type=number]:focus,textarea:focus,select:focus{
}

input:-webkit-autofill {
   -webkit-box-shadow: 0 0 0 1000px #fff inset;
}

textarea{ border:1px solid #bbbbbb; padding:3px; line-height:1.6;}
select{ background-color:#fff; border:1px solid #bbb; max-width:96%;}
h1,h2,h3,h4,h5,p{ margin:0; padding:0; line-height:1.6;}
select > option:disabled {
    color:#bbbbbb;
}

svg{margin:0; padding:0;}



.LoadingBar{ position:fixed; left:0; top:0; display:table; width:100%; height:100%; z-index:50000;}
.LoadingBar > li{ position:relative; display:table-cell; text-align:center; vertical-align:middle; color:#ffffff;}
.LoadingBar:before{ content:""; position:fixed; width:100%; height:100%; left:0; top:0; background-color:#000000; opacity:0.6; animation-name:LoadBlackOpacity; animation-duration:0.3s;}

.loading {display:none; position:fixed; top:-4px; left:0; z-index:99; width:100%; height:100%; background:rgba(0, 0, 0, 0.5);}
.loading strong {display:block; position:relative; top:50%; margin:-75px auto 0 auto; width:200px; height:50px; padding:0 30px;border-radius: 10px;-webkit-border-radius: 10px;-moz-border-radius: 10px;box-sizing:border-box; color:#000; font-size:16px; line-height:50px; text-align:center; animation-name:loadings; animation-duration:3s; animation-iteration-count:infinite;}

@keyframes loadings{
    0% {
        background-color: rgba(255,255,255,0.5);
    }
    50% {
        background-color: rgba(255,255,255,1);
    }
    100% {
        background-color: rgba(255,255,255,0.5);
    }
}
.loader,
.loader:after {
  border-radius: 50%;
  width: 10em;
  height: 10em;
}
.loader {
  margin: 60px auto;
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 1.1em solid rgba(255, 255, 255, 0.2);
  border-right: 1.1em solid rgba(255, 255, 255, 0.2);
  border-bottom: 1.1em solid rgba(255, 255, 255, 0.2);
  border-left: 1.1em solid #ffffff;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}
@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


#Work{ display:none;}

@keyframes LoadBlackOpacity {
    from {opacity:0;}
    to {opacity:0.6;}
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color:rgba(0,0,0,0.2);
    font-weight:300;
    letter-spacing:-0.2px;
    background-color:transparent;
}
::-moz-placeholder { /* Firefox 19+ */
    color:rgba(0,0,0,0.2);
    font-weight:300;
    letter-spacing:-0.2px;
    background-color:transparent;
}
input:-ms-input-placeholder { /* IE 10+ */
    color:rgba(0,0,0,0.2);
    font-weight:300;
    letter-spacing:-0.2px;
    background-color:transparent;
}
textarea:-ms-input-placeholder { /* IE 10+ */
    color:rgba(0,0,0,0.2);
    font-weight:300;
    letter-spacing:-0.2px;
    background-color:transparent;
}
:-moz-placeholder { /* Firefox 18- */
    color:rgba(0,0,0,0.2);
    font-weight:300;
    letter-spacing:-0.2px;
    background-color:transparent;
}

.DataLoadingBar{ display:flex; justify-content:center; align-items:center; width:100%; min-height:500px;}
.DataLoadingBar > div{ width:100px; height:100px; display:inline-block; border:30px solid #000; animation-timing-function:linear; animation-name:DataLoadingBarAni; animation-iteration-count:infinite; animation-duration:5s;}
@keyframes DataLoadingBarAni
{
	0%{ border:30px solid rgba(0,0,0,0.5); width:100px; height:100px; transform:rotate(0deg); border-radius:30px;}
	25%{ border:60px solid rgba(0,0,128,0.5); width:40px; height:40px; transform:rotate(360deg); border-radius:50%;}
	50%{ border:30px solid rgba(0,0,0,0.5); width:100px; height:100px; transform:rotate(720deg); border-radius:30px;}
	75%{ border:60px solid rgba(0,0,128,0.5); width:40px; height:40px; transform:rotate(1080deg); border-radius:50%;}
	100%{ border:30px solid rgba(0,0,0,0.5); width:100px; height:100px; transform:rotate(1420deg); border-radius:30px;}
}