body{
padding-bottom: env(safe-area-inset-bottom);
}

:root {
color-scheme: light dark;
background-color: white;
color: black;
}

@-webkit-keyframes my {
	 0% { color: #FF66FF; } 
	 50% { color: #FF3333;  } 
	 100% { color: #008080;  } 
 }
 @-moz-keyframes my { 
	 0% { color: #FF66FF;  } 
	 50% { color: #FF3333;  }
	 100% { color: #008080;  } 
 }
 @-o-keyframes my { 
	 0% { color: #FF66FF; } 
	 50% { color: #FF3333; } 
	 100% { color: #008080;  } 
 }
 @keyframes my { 
	 0% { color: #FF66FF;  } 
	 50% { color: #FF3333;  }
	 100% { color: #008080;  } 
 } 
 .tqm {
         background:#CCFFFF;
         border: 1px solid  #fff;
         font-size:15px;
         font-family: 'Open Sans Condensed', sans-serif;
         border-radius: 10px;
         isolation: isolate; 
	 -webkit-animation: my 500ms infinite;
	 -moz-animation: my 500ms infinite; 
	 -o-animation: my 500ms infinite; 
	 animation: my 500ms infinite;
box-shadow: 0px 0px 10px #77325a;
}

 .tqm2 {
         background:#CCFFFF;
         border: 1px solid  #fff;
         font-size:18px;
         font-family: 'Open Sans Condensed', sans-serif;
         border-radius: 10px;
         isolation: isolate;
         width: 35%;
	 -webkit-animation: my 500ms infinite;
	 -moz-animation: my 500ms infinite; 
	 -o-animation: my 500ms infinite; 
	 animation: my 500ms infinite;
box-shadow: 0px 0px 10px #77325a;
}

 .tqm3 {
         background:#CCFFFF;
         border-radius: 0px;
         isolation: isolate;
         width: 100%;
box-shadow: 0px 0px 10px #77325a;
}

.btn btn-dominant-yellow btn-repo {
color: white;
display: block;
float: right;
margin-top:10px;
width: 40px;
border-radius: 17px 0px 0px 17px;
padding-top: 10px;
padding-bottom: 10px;
background: linear-gradient(-45deg, red, #027bfd);
font-size: 14px;
font-weight: 700;
text-align: center;
font-family: 'Open Sans Condensed', sans-serif;
text-decoration: none;
isolation: isolate; 
box-shadow: 0px 0px 10px #77325a;
}

#img {
pointer-events: none;
isolation: isolate; 
box-shadow: 0px 0px 10px #77325a;
}

.alert {
padding: 5px;
background-color: #218185;
color: #cacccc;
}

.card {
pointer-events: none;
isolation: isolate; 
border: 1px solid  #fff;
}

.title {
padding-top: 5px;
background-color: white;
width: 100%;
z-index: 99;
position: absolute;
top: 0px;
left: 0px;
}

.small-title {
text-align: center;
padding-top: 10px;
padding-bottom: 10px;
background: rgba(0, 0, 0, 0.1);
-webkit-backdrop-filter: saturate(180%) blur(20px);
backdrop-filter: saturate(180%) blur(20px);
position: fixed;
top: 0px;
left: 0px;
width: 100%;
z-index: 1 !important;
margin-top: 0px;
margin-bottom: 0px;
font-weight: 600;
font-size: 17px;
color:#008080;
box-shadow: 0px 0px 10px #00CC99;

}
User Agent Style Sheeth3 {
display: block;
font-size: 1.17em;
margin-block-start: 1em;
margin-block-end: 1em;
margin-inline-start: 0px;
margin-inline-end: 0px;
font-weight: bold;
}

.block {
padding: 15px;
box-sizing: border-box;
border: 1px solid rgb(45, 45, 45);
background-color: rgb(29, 29, 29);
border-radius: 15px;
margin: 10px;
box-sizing: border-box;
position: relative;
}

.cell {
width: 97%;
padding: 2px;
border-radius: 15px;
height: 55px;
margin-bottom:25px;
margin-top:20px;
}

.icon {
float: left;
width: 55px;
border-radius: 35%;
isolation: isolate; 
border: 1.5px solid  #008080;
box-shadow: 0px 0px 10px #77325a;
}

.get-btn {
color: white;
display: block;
float: right;
border: 1px solid  #008080;
margin-top:10px;
width: 40px;
border-radius: 0px 17px 17px 0px;
padding-top: 10px;
padding-bottom: 10px;
background: linear-gradient(-45deg, cyan, #027bfd);
font-size: 14px;
font-weight: 700;
text-align: center;
font-family: 'Open Sans Condensed', sans-serif;
text-decoration: none;
isolation: isolate; 
box-shadow: 0px 0px 10px #00CC99;
}

.get-btn2 {
color: white;
display: block;
float: right;
border: 1px solid  #008080;
margin-top:10px;
width: 40px;
border-radius: 17px 0px 0px 17px;
padding-top: 10px;
padding-bottom: 10px;
background: linear-gradient(-45deg, red, #027bfd);
font-size: 14px;
font-weight: 700;
text-align: center;
font-family: 'Open Sans Condensed', sans-serif;
text-decoration: none;
isolation: isolate; 
box-shadow: 0px 0px 10px #77325a;
}

.get-btn3 {
color: white;
display: block;
float: left;
border: 1px solid  #008080;
margin-left:13.7px;
margin-top:-2px;
width: 50px;
border-radius: 8px;
padding-top: 7px;
padding-bottom: 7px;
background: linear-gradient(-45deg, red, #027bfd);
font-size: 12px;
font-weight: 700;
text-align: center;
font-family: 'Open Sans Condensed', sans-serif;
text-decoration: none;
isolation: isolate; 
box-shadow: 0px 0px 10px #77325a;
}

.app-info p {
font-size: 11px;
display: block;
font-family: 'Open Sans Condensed', sans-serif;
text-align: justify;
margin-top: 2px;
margin-bottom: 3px;
margin-left: 65px;
color: #008080;
text-shadow: 0px 0px 30px #000;
}

.app-info h3 {
font-size: 17px;
font-weight: bold;
font-family: 'Open Sans Condensed', sans-serif;
text-align: justify;
margin-top: 6px;
margin-bottom: 0px;
margin-left: 65px;
color: #008080;
text-shadow: 0px 0px 30px #000;
}





.nav {
margin-bottom: env(safe-area-inset-bottom);
margin-bottom:0px;
padding-bottom: env(safe-area-inset-bottom);
left: 0;
position: fixed;
bottom: 0;
width: 100%;
height: 50px;
-webkit-backdrop-filter: saturate(180%) blur(20px);
backdrop-filter: saturate(180%) blur(20px);
background: rgba(0, 0, 0, 0);
display: flex;
overflow-x: auto;
box-shadow: 0px 0px 30px #77325a;
}

.tab1 {
height: 25px;
width: 25px;
}

.nav__link {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
flex-grow: 1;
min-width: 50px;
overflow: hidden;
white-space: nowrap;
font-family: sans-serif;
font-size: 12px;
color: #444444;
text-decoration: none;
-webkit-tap-highlight-color: transparent;
transition: background-color 0.1s ease-in-out;
text-shadow: 0px 0px 10px #FFFF33;
}

.navtxt1 {
color: #007aff;
}

.title-txt{

 padding-left:13px;
}





h2{
font-family: 'Open Sans Condensed', sans-serif;
padding-left:10px;
isolation: isolate; 
text-shadow: 0px 0px 30px #FFFF33;
}

h3{
font-family: 'Open Sans Condensed', sans-serif;
color:#000;
text-shadow: 0px 0px 30px #FFCCFF;
}

h33{
font-family: 'Open Sans Condensed', sans-serif;
color:red;
font-size: 17px;
font-weight: bold;
isolation: isolate; 
text-shadow: 0px 0px 30px #FFFF33;
}

p{
font-family: 'Open Sans Condensed', sans-serif;
color:#000;
font-size: 13.5px;
}

h55{
font-family: 'Open Sans Condensed', sans-serif;
color:red;
font-size: 13.5px;
font-weight: bold;
isolation: isolate;
text-shadow: 0px 0px 30px #FFFF33;
}

h66{
font-family: 'Open Sans Condensed', sans-serif;
color:#008080;
font-size: 13.5px;
font-weight: bold;
isolation: isolate;
text-shadow: 0px 0px 30px #FFFF33;
}

h1{
font-family: 'Open Sans Condensed', sans-serif;
font-weight: bold;
padding-left:10px;
color:#000;
text-shadow: 0px 0px 35px #111;
}





@media (prefers-color-scheme: dark) {
  :root {
background-color: #000;
color: #fff;
    }
}

@media only screen and (orientation: portrait){
    .card{
        width:90%;
        margin-top:-25px;
        border-radius:30px;
    }
}

@media only screen and (orientation: landscape){
    
     .card{
        width:50%;
        border-radius:30px;
    }
}




#myInput {
width: 85%;
border: 1px solid  cyan;
font-size: 15px;
padding: 7px 1px 7px 40px;
margin-top: -15px;
border-radius: 10px;
background: #e7e7e7;
box-shadow: 0px 0px 10px #77325a;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2013%2013'%20enable-background%3D'new%200%200%2013%2013'%3E%3Cg%3E%3Cpath%20fill%3D'%23939398'%20d%3D'M5%2C1c2.2%2C0%2C4%2C1.8%2C4%2C4S7.2%2C9%2C5%2C9S1%2C7.2%2C1%2C5S2.8%2C1%2C5%2C1%20M5%2C0C2.2%2C0%2C0%2C2.2%2C0%2C5s2.2%2C5%2C5%2C5s5-2.2%2C5-5S7.8%2C0%2C5%2C0%20L5%2C0z'%2F%3E%3C%2Fg%3E%3Cline%20stroke%3D'%23939398'%20stroke-miterlimit%3D'10'%20x1%3D'12.6'%20y1%3D'12.6'%20x2%3D'8.2'%20y2%3D'8.2'%2F%3E%3C%2Fsvg%3E");
border: rgba(0,0,0,.1);
background-size: 20px 20px;
background-repeat: no-repeat;
background-position: 8px center;
}

#myInput {
width: 85%;
border: 1px solid  cyan;
font-size: 15px;
padding: 7px 1px 7px 40px;
margin-top: -15px;
border-radius: 10px;
background: #1c1c1e;
color: white;
box-shadow: 0px 0px 10px #77325a;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2013%2013'%20enable-background%3D'new%200%200%2013%2013'%3E%3Cg%3E%3Cpath%20fill%3D'%23939398'%20d%3D'M5%2C1c2.2%2C0%2C4%2C1.8%2C4%2C4S7.2%2C9%2C5%2C9S1%2C7.2%2C1%2C5S2.8%2C1%2C5%2C1%20M5%2C0C2.2%2C0%2C0%2C2.2%2C0%2C5s2.2%2C5%2C5%2C5s5-2.2%2C5-5S7.8%2C0%2C5%2C0%20L5%2C0z'%2F%3E%3C%2Fg%3E%3Cline%20stroke%3D'%23939398'%20stroke-miterlimit%3D'10'%20x1%3D'12.6'%20y1%3D'12.6'%20x2%3D'8.2'%20y2%3D'8.2'%2F%3E%3C%2Fsvg%3E");
border: rgba(0,0,0,.1);
background-size: 20px 20px;
background-repeat: no-repeat;
background-position: 8px center;
}

#myUL {
list-style-type: none;
padding: 0;
margin: 0;
}

input:focus { 
    outline: none !important;
}





.tbpopup .tboverlay {
position:fixed;
top:0px;
left:0px;
width:100%;
height:100%;
background:rgba(0,0,0,0.8);
z-index:1;
display:none;
box-shadow: 0px 0px 10px #111;
}

.tbpopup .tbcontent {
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%) scale(0);
background:#C0C0C0;
max-width:500px;
z-index:2;
text-align:center;
padding:20px;
box-sizing:border-box;
font-family:"Open Sans",sans-serif;
border-radius:20px;
display: block;
position: fixed;
box-shadow: 0px 0px 10px #111;
}
@media (max-width: 700px) {
.tbpopup .tbcontent {width:90%;}
}

.tbpopup .tbclose-btn {
cursor:pointer;
position:absolute;
right:20px;
top:20px;
width:35px;
height:35px;
color:#ff4444;
font-size:30px;
font-weight:600;
line-height:35px;
text-align:center;
border-radius:50%;

}

.tbpopup.active .tboverlay {
display:block;
}

.tbpopup.active .tbcontent {
transition:all 300ms ease-in-out;
transform:translate(-50%,-50%) scale(1);
}
.tbbuttom{background:#00cc00;color:#fff}





.fa {
  padding: 18px;
  width: 16px;
  text-align: center;
  text-decoration: none;
  margin: -7px 2px;
  border-radius: 100px;
  border: 1px solid  #008080;
  isolation: isolate; 
box-shadow: 0px 0px 10px #77325a;
}

.fa:hover {
    opacity: 0.9;
}


.fa-twitter {
  background: #55ACEE;
  color: white;
isolation: isolate; 
}


.fa-facebook {
  background: #3399FF;
  color: white;
isolation: isolate; 
}

.fa-telegram {
  background: #264f5c;
  color: white;
isolation: isolate; 
}

.fa-paypal {
  background: #3366CC;
  color: white;
isolation: isolate; 
}

