@font-face {
 font-family: MontM;
 src: url(A/MontserratAlternates-Medium.ttf);

}
@font-face {
 font-family: Mont;
 src: url(A/MontserratAlternates-Regular.ttf);

}
html{
overflow:hidden;
background-color:rgb(40,106,165);
user-select:none;
}
/* Container */
.container { 
width:100%;
height:100%;
padding:0;
margin:0;
background-color:transparent;
user-select:none;
}

/* Card */
.card { 
 
}

 
 .card .title, .card .title1, .card .title2 {
  position: relative;
  z-index: 1;
opacity:1;
user-select:none;
  font-family:MontM;
  margin: 0;
  padding: 0;
  color:royalblue;
  text-shadow: 2px 2px 2px silver;
  font-size: 18px;  
 }
.card .title1{
position:absolute;top:14px;right:260px;
}
.card .title2{
position:absolute;top:50px;right:134px;font-size:26px;text-shadow:1px 1px 1px silver;color:cornflowerblue;margin-bottom:10px;
}
 .card .i_c {
  position: relative;
  margin: 0 60px 10px;
font-family:Mont;
 }

  .card .i_c input {
   outline: none;
   z-index: 1;
   position: relative;
   background: none;
   width: 100%;
   height: 55px;
   border: none;
   color: steelblue;
   font-size: 20px;
   font-family:Mont;
  }

   .card .i_c input:focus ~ label {
    color: darkslategray;
    text-shadow: 1px 1px 1px silver;
    transform: translate(-12%, -50%) scale(0.90);
   }

   .card .i_c input:focus ~ .bar:before, .card .i_c input:focus ~ .bar:after {
    width: 50%;
   }

.card .i_c input:hover{
text-shadow:1px 1px 1px silver;
transition: 0.2s ease;
cursor:pointer;
color:cornflowerblue;
}
.card .i_c input:focus{
text-shadow:1px 1px 1px silver;
transition: 0.2s ease;
cursor:default;
color: steelblue;
color:red;
}

   .card .i_c input:valid ~ label {
    transform: translate(-12%, -50%) scale(0.90);
    color: darkslategray;
    text-shadow: 1px 1px 1px silver;
   }

  .card .i_c label {
   position: absolute;
   top: 0;
   left: 0;
   color: darkgray;
   font-size: 13px;
   line-height: 75px;
   transition: 0.2s ease;
   margin-bottom: 2px;
  }

  .card .i_c .bar {
   position: absolute;
   left: 0;
   bottom: 0;
   background: silver;
   width: 100%;
   height: 1px;
  }

   .card .i_c .bar:before, .card .i_c .bar:after {
    content: "";
    position: absolute;
    background: #ed2553;
    width: 0;
    height: 2px;
    transition: 0.2s ease;
   }

   .card .i_c .bar:before {
    left: 50%;
   }

   .card .i_c .bar:after {
    right: 50%;
   }

 .card .b_c {
  text-align: center;
  white-space: nowrap;
  filter: drop-shadow(3px 3px 3px darkgray);
 }

  .b_c button {
   outline: 0;
   cursor: pointer;
   position: relative;
   display: inline-block;
   background: 0;
   width: 200px;
   border: 2px solid lightslategray;
border-radius:4px;
   padding: 20px 0;
   font-size: 24px;
   line-height: 1;
   overflow: hidden;
   transition: 0.3s ease;
			font-family:MontM;
background-color:rgb(120,186,245);
opacity:1;
margin-top:10px;
  }

    .b_c button span {
    position: relative;
    z-index: 1;
    color:white;
    text-shadow: 2px 2px 2px grey;
    transition: 0.3s ease;
background-color:rgb(120,186,245);
opacity:1;
   }

    .b_c button:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
				background-image: radial-gradient(cornflowerblue,dodgerblue, lightskyblue, deepskyblue);
    width: 30px;
    height: 30px;
    border-radius: 100%;
    margin: -15px 0 0 -15px;
    opacity: 0;
    transition: 0.3s ease;
   }

    .b_c button:hover, .b_c button:active, .b_c button:focus {
    border-color: #ed2553;
    box-shadow: 0 0 8px 0 silver inset, 0 0 8px 4px lightgray;
   }

    .card .b_c button:hover span, .card .b_c button:active span, .card .b_c button:focus span {
     color: #ed2553;
    }

    .card .b_c button:active span, .card .b_c button:focus span {
     color: #ffffff;background-color:transparent;
    }

    .card .b_c button:active:before, .card .b_c button:focus:before {
     opacity: 1;
     transform: scale(10);
    }

 .card .footer {
  margin: 40px 0 0;
  font-size: 14px;
font-family:Mont;  
  text-align: center;
  color: darkslategray;
opacity:1;
 }

  .card .footer a {
   color: darkslategray;
   text-decoration: none;
   transition: 0.3s ease;
			opacity:1;
position:absolute;
bottom:30px;
right:96px;
text-shadow: 1px 1px 1px gainsboro; 
  }

   .card .footer a:hover {
    color: #ed2553;
    filter: drop-shadow(1px 1px 1px darkgray);
			opacity:1;
   }

 .card img {  
  position: relative;
  left: 18px;
  top: 45px;
  filter: drop-shadow(3px 3px 3px darkgray);
opacity:0.5;
 }
label div{
opacity:1;
font-size: 14px;
font-family:Mont;
filter: drop-shadow(1px 1px 1px darkgray);
}
.toggle {
 position: relative;
 display: block;
 height: 30px;
 cursor: pointer;
 -webkit-tap-highlight-color: transparent;
 transform: translate3d(0, 0, 0);
opacity:1;
}

 .toggle:before {
  content: "";
  position: relative;
  top: 3px;
  left: 3px;
  width: 34px;
  height: 14px;
  display: block;
  background-color: rgb(240,240,240);
  border: 1px solid silver;
  border-radius: 8px;
  transition: background 0.2s ease;
 }

 .toggle span {
opacity:1;
color:darkslategray;
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  display: block;
  background-color: rgb(240,240,240);
  background-image: radial-gradient(ghostwhite, whitesmoke, gainsboro);
  border: 1px solid silver;
  border-radius: 10px;
  box-shadow: 0 3px 8px rgba(154, 153, 153, 0.8);
  transition: all 0.2s ease;
 }
  .toggle span:hover {
opacity:1;
   border: 1px solid darkgray;
   box-shadow: 0 4px 9px rgba(154, 153, 153, 0.9);
  }
  .toggle span:before {
opacity:1;
   content: "";
   position: absolute;
   display: block;
   margin: -18px;
   width: 56px;
   height: 56px;
   background-color: rgba(220, 20, 60, 0.5);
   border-radius: 50%;
   transform: scale(0);   
   pointer-events: none;
  }

  .toggle div {
opacity:1;
   display: inline-block;
   margin-left: 50px;
   margin-top: -14px;
   font-family: Mont;
   font-size: 14px;
   color: darkslategray;
   transition: 0.3s ease;
  }

  .toggle div:hover {
opacity:1;
   color: #ed2553;
   text-shadow: 1px 1px 1px silver;
  }

#cbx:checked + .toggle:before {
 background-color: rgb(240,240,240);
 border: 1px solid silver;
}

#cbx:checked + .toggle span {
 background:rgba(251,220,121, 0.7);
 border: 1px solid rgb(180,180,180);
 transform: translateX(20px);
 transition: all 0.2s cubic-bezier(0.8, 0.4, 0.3, 1.25), background 0.15s ease;
 box-shadow: 4px 3px -6px rgba(120,127,120, 0.4);
}
 #cbx:checked + .toggle span:hover {
  border: 1px solid darkgray;
  box-shadow: 4px 3px -6px rgba(120,127,120, 0.8);
opacity:1;
 }

 #cbx:checked + .toggle span:before {
  transform: scale(1);
  opacity: 0;
  transition: all 0.4s ease;
 }


#cbxA:checked + .toggle:before {
 background-color: rgb(240,240,240);
 border: 1px solid silver;
}

#cbxA:checked + .toggle span {
opacity:1;
 background:rgba(251,220,121, 0.7);
 border: 1px solid rgb(180,180,180);
 transform: translateX(20px);
 transition: all 0.2s cubic-bezier(0.8, 0.4, 0.3, 1.25), background 0.15s ease;
 box-shadow: 4px 3px -6px rgba(120,127,120, 0.4);
}
#cbxA:checked + .toggle span:hover {
 border: 1px solid darkgray;
 box-shadow: 4px 3px -6px rgba(120,127,120, 0.8);
}
 #cbxA:checked + .toggle span:before {
  transform: scale(1);
  opacity: 0;
  transition: all 0.4s ease;
 }

.checks {
 margin-left: 50px;
 margin-top: 20px;
 margin-bottom: 10px;
}

.err {
user-select:none;
 border-left: 5px solid red;
border-right: 5px solid red;
background-color:white;
opacity:1;
z-index:8;
position:absolute;
bottom:80px;
right:16px;
 border-top: 1px dotted silver;
 border-bottom: 1px dotted silver;
 text-shadow: 1px 1px 1px lightgray;
 color: red;
 font-size: 22px;
font-family:MontM;
box-shadow: 0 0 8px 0 silver inset, 0 0 8px 4px lightgray;
width:360px;
}

 .err img {
  margin-left: 60px;
  padding: 4px;
padding-right:10px;
  position: relative;
  top: 2px;
  left: 0;
  height: auto;
opacity:0.85;
 }

 .err span {
  position: relative;
  top: -16px;
  left: 10px;
background-color:white;
opacity:1;
 }
.lgs{
position:absolute;
top:18px;right:20px;
display:none;
filter: drop-shadow(2px 2px 3px darkgray);
cursor:pointer;
border:none;
padding:0;
margin:0;
opacity:0.7;
}
.lgs:hover {
transition: 0.3s ease;
filter: drop-shadow(-1px 3px 5px darkgray);
opacity:1;
}
.lgsM{
user-select:none;
display:inline-block;
border:none;
background-color:white;
max-width:120px;
height:auto;
max-height:54px;
margin:0;
margin-top:1px;
margin-left:1px;
border-bottom-left-radius:6px;
padding:0;
overflow: hidden;
vertical-align:middle;
opacity:1;
}
.lgsT{
white-space:nowrap;
display:inline-block;
vertical-align:top;
margin-left:10px;
max-width:200px;
font-family:Mont;
font-size:15px;
color:black;
padding-top:16px;
user-select:none;
overflow: hidden;
opacity:1;
}
.lgsI{
white-space:nowrap;
user-select:none;
background-color:white;
height:56px;
margin:10px;
padding:0;
border:1px solid gainsboro;
border-radius:8px;
border-top-left-radius:0;
vertical-align:top;
border:1px solid silver;
cursor:pointer;
box-shadow: 0 1px 1px 1px rgba(51, 51, 51, 0.20);
transition: transform .25s cubic-bezier(.7,.98,.86,.98), box-shadow .25s cubic-bezier(.7,.98,.86,.98);
overflow: hidden;
opacity:1;
}
.lgsI:hover{
transform: scale(1.03);
box-shadow: 0 9px 47px 11px rgba(51, 51, 51, 0.18);
border:1px solid darkgray;
text-shadow:0px 0px 1px darkgray;
opacity:1;
}
.lgsU{
user-select:none;
white-space:nowrap;
float:right;
padding-right:40px;
margin-right:0px;
vertical-align:top;
padding-top:16px;
display:inline-block;
font-family:Mont;
font-size:15px;
color:royalblue;
filter: drop-shadow(1px 1px 1px darkgray);
overflow: hidden;
opacity:1;
}
.lgsC{
padding-left:6px;
padding-right:6px;
transition: 150ms all ease-in;
filter: drop-shadow(1px 2px 3px darkgray);
opacity:1;
}
.lgsD{
position:absolute;
z-index:99;
width:409px;
height:702px;
padding:0;
margin:0;
margin-left:-4px;
margin-top:-4px;
overflow:hidden;
overflow-y:auto;
border-radius: 22px;
display: grid;
row-gap: 8px;
border:3px double silver;
box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 10px 0px;
background-color:rgb(248,248,248);
opacity:1;
}
.lgsD header {
margin:-4px;
border:4px groove rgb(250,250,250);
border-bottom:3px double silver;
border-top-left-radius:10px;
border-top-right-radius:10px;
border-bottom-left-radius:4px;
border-bottom-right-radius:4px;
background: url('A/ta10.png'); 
user-select:none;
pointer-events:none;
z-index:999;
overflow: hidden;
padding:10px;
font-family:Mont;
color: cornflowerblue;
text-shadow: 1px 1px 1px grey;
font-size: 22px;
text-align:center;
opacity:1;
}
.lgsX{
	user-select:none;	
	cursor:default;
	position:absolute;	
	top:0px;	
	right:0px;
	padding-right:0px;
	margin-right:0px;
	background-color:transparent;
	width:20px;
	height:20px;
	font-family:MontM;
	text-align:center;
	vertical-align:central;
padding:4px;
color:black;
border:1px solid transparent;
border-radius:4px;
border-top-right-radius:10px;
overflow: hidden;
opacity:0.5;
}
.lgsX:hover{
	transform: scale(1.2);
	background-color:rgb(245,245,245);	
	color:crimson;
border:1px solid silver;
text-shadow:1px 1px 1px darkgray;
filter: drop-shadow(0px 1px 0px darkgray);
opacity:1;
}
@keyframes mymove {
from {
 transform:scale(0.1);
opacity:0.1;
 }
 to { 
opacity:1;
transform:scale(1);
 }
}
.anim{
animation: mymove 0.3s ease-in-out;
animation-fill-mode: forwards;
}

::-webkit-scrollbar {
 width: 16px;
 z-index: 9999 !important;
}

::-webkit-scrollbar-track {
 border-radius: 2px;
 background-color: whitesmoke;
 border: 1px gainsboro solid;
border-left:1px solid silver;
border-top-right-radius:15px;
border-bottom-right-radius:15px;
}

::-webkit-scrollbar-thumb {
 background: linear-gradient(to top, gainsboro 0%, lightgrey 1%, #eaeaea 26%, #efefef 48%, #e8e8e8 75%, #dcdcdc 100%);
border-radius:2px;
border:3px ridge whitesmoke;
border-top-right-radius:15px;
border-bottom-right-radius:15px;
}

 ::-webkit-scrollbar-thumb:hover {
 background: linear-gradient(to top, lightgrey 0%, gainsboro 1%, #dcdcdc 26%, #e8e8e8 48%, #efefef 75%, #eaeaea 100%);
		
 }
table{
border-spacing:0;
border-width:0;
border:none;
}
tr{
outline:5px double silver;
border-radius:25px;
box-shadow: rgba(14, 30, 37, 0.12) 0px 6px 4px 0px, rgba(14, 30, 37, 0.32) 0px 4px 16px 0px;
}
td, tr{
padding:0;
margin:0;
}

div a{
font-family:MontM;
text-decoration: none;
transition: 0.3s ease;
opacity:1;
color:white;
margin-right:20px;
margin-left:20px;
}
div a:hover{
color: yellow;
text-shadow: 1px 1px 1px silver; 
}

.bgL {
width:700px;
height:100%;
border-top-left-radius:22px;
border-bottom-left-radius:22px; 
border:none;
margin:0;
padding:0;
}
.bgR{
width:400px;
height:100%;
border-top-right-radius:22px;
border-bottom-right-radius:22px; 
background-color:rgba(249,249,249,0.98);
border:none;
border-left:3px double gainsboro; 
margin:0;
padding:0;
}
.pl{
margin-left:-45px;
margin-top:-68px;
background-color:transparent;
background-image:none;
background:none; 
filter: drop-shadow(3px 3px 3px darkgray);
z-index:9999;
}
#_sl{
text-align:center;
width:100%;
}
#_sl img{
cursor:pointer;
filter: drop-shadow(-3px 3px 3px silver);
margin-left:5px;
margin-right:5px;
transition: 0.3s ease;
opacity:0.8;
width:48px!important;
}
#_sl img:hover{
margin-left:5px;
margin-right:5px;
opacity:1;
filter: drop-shadow(3px 3px 3px darkgray);
width:48px!important;
}
#_lk{
width:98%;
text-align:center;
color:yellow;
text-shadow:1px 0px 1px silver;
user-select:none;
font-size:13px;
}
#_lk a{
cursor:pointer;
font-family:MontM; 
font-size:13px;
color:white;
text-shadow:none;
}
#_lk a:hover{
color:yellow;
text-shadow:1px 1px 1px red;
}
.center { 
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 padding:0;
margin:0;
width:1100px;
height:700px;
background-color:transparent;
border-radius: 25px;
 border:none;
 background-size: cover;
 background-repeat: no-repeat;
 background-position: center center;
object-fit:contain;
}
.cpw{
-webkit-text-security:square;
text-security:disc;    
-mox-text-security:disc;
}
.act::before{
content:url(A/warning24.png);
}
.act{
position:absolute;
display:inline-block;
filter:drop-shadow(1px 2px 1px silver);
}
u::before{
display:inline-block;
margin:0;
padding:0;
margin-left:4px;
content:url(A/warning16.png);
filter:drop-shadow(1px 1px 1px silver);
}
p{
display:none;
font-family:MontM;
font-size:14px;
margin:0;
padding:4px;
padding-left:8px;
padding-right:8px;
overflow:clip;
background-color:lightyellow;
border-left:3px solid red;
position:absolute;
color: darkslategray;
text-shadow: 1px 1px 1px gainsboro;
}