

body {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  margin: 0px;
  padding: 0px;
  overflow-x: hidden;
	perspective: 1px;
  transform-style: preserve-3d;
  min-width: 350px;
}


.a-all{

  --anchor-a : 0px;
  --anchor-b : 0px;
  --slide-width : 100%;
  --fs-1 : 2.5vh;
  --fs-2 : 3.5vh;
  --fs-logo : 8vh;
  
}

/* _____________MOBILE VERSION___________________ */

#img-waves-wallet{
  position: relative;
  left: calc(var(--anchor-b) + 2vh);
  margin-left: 3vh;
  margin-top: -58vh;
  width: 20vh;
}

#img-trust-wallet{
  position: relative;
  left: calc(var(--anchor-b) + 8vh);
  margin-left: 2vh;
  margin-top: -58vh;
  width: 20vh;
}


#a-info1{
  position: absolute;
  margin-left: 2vh;
  left: var(--anchor-b);
  top: 30vh;
}

#a-logo {
  position: relative;
  margin-left: 6vh;
  left: var(--anchor-b);
  top: 10vh;
  font-size: var(--fs-logo);
}

#a-logo a{
  text-decoration: none;
  color: black;
  font-weight: 500;
}



#a-aboutus{
  position: relative;
  margin-left: 2vh;
  left: var(--anchor-a);
  top: -16vh;
}

#blackslideAboutUs {
  position: relative;
  bottom: 7vh;
  left: -8vh;
  z-index: -20;
}

#blackslideAboutLPoS {
  position: relative;
  bottom: 7vh;
  left: -8vh;
  z-index: -20;
}



#a-social{
  position: relative;
  margin-left: 2vh;
  left: var(--anchor-a);
  top: 40vh;   
}

#a-aboutlpos{
  position: relative;
  margin-left: 2vh;
  left: var(--anchor-b);
  top: -41vh;  
}



#gen_balance{
  position: relative;
  margin-left: 6vh;
  left: var(--anchor-b);
  top: 57vh;     
}

#gen_balance_num{
  font-size: 9vh; 
  display: inline;
  margin-left: 1vh;
}

#gen_balance_caption{
  font-size: 4vh;
  margin-top: -5vh;
  margin-left: 15vh; 
  font-weight: 300; 
}

#roubm2 {
  position: absolute;
  width: 25vh; 
  height: 25vh;
  right: 10vw;
  top: 156vh;
  background: #1f5af6;
  transform: rotate(-45deg);
  z-index: 50;
  opacity: 0.50;
}
#roubm3 {
  position: absolute;
  width: 9vh;
  height: 9vh;
  right: 6vw;
  top: 180vh;
  background: #1f5af6;
  transform: rotate(-45deg);
  z-index: 50;
  opacity: 0.50;
}

#mined_num {
  position: relative;
  color: white;
  transform: rotate(45deg);
  right: 8vh;
  left: 13vh;
  top: 15vh;
  font-size: 10vh;
  display: none;
}

#mined_txt {
  position: relative;
  color: white;
  transform: rotate(45deg);
  right: 1vh;
  top: 9vh;
  font-size: 5vh;
  display: none;
}

#mined_txt2 {
  position: relative;
  color: white;
  transform: rotate(45deg);
  right: 1vh;
  top: 9vh;
  font-size: 3vh;
  display: none;
}

#pureblack_bottom {
  position: relative;
  bottom: auto;
}


#text_bottom {
  position: absolute;
  top: 10vh;
  width: 113.5%;
  height: 46vh;
  background-color: black;
}

#text_bottom p{
  color: white;
  margin-top: 2vh;
  margin-right: 6.8vh;
  padding-left: 2vh;
  padding-right: 1vh;
  padding-top: 1vh;
  padding-bottom: 0.5vh;
}




#blacklogo {
  position: relative;
  top: -258px;
  left: 12vh;
  z-index: -20;
}


/* _____________ULTRAMOBILE VERSION___________________ */


@media only screen and (max-width: 580px) {
  .a-all {
  --anchor-a : 0px;
  --anchor-b : 0px;
  --slide-width : 100%;
  --fs-1 : 2.35vh;
  --fs-2 : 2.88vh;
  --fs-logo : 6.3vh;
  }

  #gen_balance{
    position: relative;
    margin-left: 6vh;
    left: var(--anchor-b);
    top: 57vh;
    font-weight: 600;    
  }

  #gen_balance_num{
    font-size: 6vh; 
    display: inline;
    margin-left: 1vh;
    --slide-width : 175%;
    font-weight: 600;
  }
  
  #gen_balance_caption{
    font-size: 3vh;
    margin-top: -5vh;
    margin-left: 13.8888vh;
    --slide-width : 175%;
    font-weight: 300; 
  }

  #a-info1{
    position: absolute;
    margin-left: 2vh;
    left: var(--anchor-b);
    top: 31vh;
  }


  #a-aboutus{
    position: relative;
    margin-left: 2vh;
    left: var(--anchor-a);
    top: -16vh;
  }

  #a-social{
    position: relative;
    margin-left: 2vh;
    left: -4vh;
    top: 48vh;   
    transform: scale(0.88);
  }

  #a-aboutlpos{
    position: relative;
    margin-left: 2vh;
    left: var(--anchor-b);
    top: -33vh;  
  }
  
  #img-waves-wallet{
    position: relative; 
    margin-left: 3vh;
    margin-top: -48vh;
    width: 15vh;
  }
  
  #img-trust-wallet{
    position: relative;
    margin-top: -48vh;
    width: 15vh;
  }

  #roubm2 {
    position: absolute;
    width: 25vh; 
    height: 25vh;
    right: 10vw;
    top: 162vh;
    background: #1f5af6;
    transform: rotate(-45deg);
    z-index: 50;
    opacity: 0.50;
  }
  #roubm3 {
    position: absolute;
    width: 9vh;
    height: 9vh;
    right: 6vw;
    top: 186vh;
    background: #1f5af6;
    transform: rotate(-45deg);
    z-index: 50;
    opacity: 0.50;
  }



}

@media only screen and (max-width: 375px) {

  #gen_balance{
    position: relative;
    margin-left: 6vh;
    left: var(--anchor-b);
    top: 57vh;
    font-weight: 500;    
  }

  #gen_balance_num{
    font-size: 5vh; 
    display: inline;
    margin-left: 1vh;
    --slide-width : 175%;
    font-weight: 500;
  }
  
  #gen_balance_caption{
    font-size: 3vh;
    margin-top: -5vh;
    margin-left: 13.8888vh;
    --slide-width : 175%;
    font-weight: 250; 
  }

  #a-logo {
    position: relative;
    margin-left: 6vh;
    left: var(--anchor-b);
    top: 10vh;
    font-size: 5vh;
  }
  
  #a-logo a{
    text-decoration: none;
    color: black;
    font-weight: 500;
    font-size: 5vh;
  }

  #a-social{
    position: relative;
    margin-left: 2vh;
    left: -6vh;
    top: 48vh;
    --slide-width: 135%;
    transform: scale(0.75);
  }

}



/* _____________DESCTOP VERSION___________________ */




@media only screen and (min-width: 768px) {
  .a-all{
    --anchor-b : calc(100vw - 768px);
    --slide-width : 768px;
    --fs-1 : 3vh;
    --fs-2 : 5vh;
    --fs-logo : 11vh;
  }


  #a-logo {
    position: relative;
    margin-left: 0vh;
    left: var(--anchor-b);
    top: 75vh;
    font-size: var(--fs-logo); 
  }

 

  #a-logo a{
    text-decoration: none;
    color: black;
    font-weight: 400;
  }

  #gen_balance{
    position: relative;
    margin-left: 0vh;
    left: var(--anchor-b);
    top: 76vh;     
  }

  #gen_balance_num{
    font-size: 9vh; 
    display: inline;
    margin-left: 3vh;
  }
  
  #gen_balance_caption{
    font-size: 4vh;
    margin-top: -5vh;
    margin-left: 17.8vh;  
  }

  #a-aboutus{
    position: relative;
    left: var(--anchor-a);
    top: 10vh;
  }

  #a-social{
    position: relative;
    left: var(--anchor-a);
    top: 75vh;   
  }

  #roubm2 {
    position: absolute;
    width: 40vh;
    height: 40vh;
    right: 10vw;
    top: 180vh;
  
    background: #1f5af6;
    transform: rotate(-45deg);
    z-index: 50;
    opacity: 1;
  }

  #mined_num {
    position: relative;
    color: white;
    right: auto;
    left: 4vh;
    top: 8vh;
    font-size: 10vh;
    opacity: 1;
    text-align: center;
    display: block;
  }

  #mined_txt {
    position: relative;
    color: white;  
    right: 1vh;
    top: 9vh;
    font-size: 5vh;
    opacity: 1;
    display: block;
  }

  #mined_txt2 {
    position: relative;
    color: white;
    right: 1vh;
    top: 9vh;
    font-size: 3vh;
    opacity: 1;
    display: block;
  }
  
  #roubm3 {
    position: absolute;
    width: 13vh;
    height: 13vh;
    right: 7vw;
    top: 220vh;
  
    background: #1f5af6;
    transform: rotate(-45deg);
    z-index: 50;
    opacity: 1;
  }

  #a-aboutlpos{
    position: relative;
    left: var(--anchor-b);
    top: 30vh;  
  }

  #img-waves-wallet{
    position: relative;
    left: calc(var(--anchor-b) + 2vh);
    margin-top: 35vh;
    width: 20vh;
  }
  
  #img-trust-wallet{
    position: relative;
    left: calc(var(--anchor-b) + 12vh);
    margin-top: 35vh;
    width: 20vh;
  }
  
  #pureblack_bottom {
    position: absolute;
    bottom: auto;
    display: none;
  
  }
  
  #text_bottom p{
    position: relative;
      margin-left: 2vh;
      margin-bottom: 3vh;
      top: 6vh;
      color: white;
      opacity: 0;
  }

  #blackslideAboutUs {
    position: relative;
    bottom: 6.58vh;
    left: -8vh;
    z-index: -20;
    opacity: 0;
  }
  
  #blackslideAboutLPoS {
    position: relative;
    bottom: 6.58vh;
    left: -8vh;
    z-index: -20;
    opacity: 0;
  }

  #blacklogo {
    position: relative;
    top: -258px;
    left: 12vh;
    z-index: -20;
    opacity: 0;
  }
}




/* _____________WALLETS LEFT___________________ */



@media only screen and (min-width: 1200px) {
  .a-all{
    --anchor-a : calc((100vw - 1200px)/2);
    --anchor-b : calc((100vw - 1200px)/2 + 432px);
  }

  #img-waves-wallet{
    position: absolute;
    left: var(--anchor-a);
    margin-left: 0vh;
    margin-top: -12vh;
    width: 30vh;
    padding-left: 2vh;
  }
  
  #img-trust-wallet{
    position: absolute;
    left: var(--anchor-a);
    margin-left: 0vh;
    margin-top: 8vh;
    width: 30vh;
    padding-left: 2vh;
  }
}

/* _____________GLOBAL___________________ */


.a-content{
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100%
}

.a-frame{
  height: 100vh;
}

.navbar-brand{
  font-size: 5vmin;
  padding-right: 2vmin;
}


.nav-item{
  font-size: 4vmin;
  padding-right: 2vmin;
  background: white;
}

.nav-item a{
  background: white;
}


.a-slide{
  padding-right: 2vw;
  padding-left: 2vw;
  width: var(--slide-width);
}




.a-slide h1{
  font-size: var(--fs-2);
  color: #1f5af6;
  padding-bottom: 2vh;
}

.a-slide p{
  font-size: var(--fs-1);
  color: black;
  margin-right: 1vh;
}


.roubm {
  position: absolute;
  width: 200vh;
  height: 200vh;
  left: calc(var(--anchor-b) - 245vh);
  top: -50vh;

  background: #1f5af6;
  transform: rotate(-45deg);
  z-index: 50;
}

#bgcanv{
  position: absolute;
  left: 0;
  top: 0;
}

#a-navbar{
  position: absolute;
  left: var(--anchor-b);
  top: 2vh;
  margin-left: 8px;
  z-index: 1500;
  width: 75%;
}

#a-social a{
  text-decoration: none;  
}

#hndpayout{
  position: relative;
  left: calc(var(--anchor-b) - 60vh);
  top: 43vh; 
  color: white;
  z-index: 100;
  font-size: 8vh;  
}

#every_mond{
  font-size: 0.5em;
  padding-left: 1vh;
}

.copybtn{
  cursor: pointer;
}

.copybtn:hover{
  color: #1f5af6;
}

/* to-do make this realy unvisible!!! */
.unvisible{
  opacity: 0;
}

#notification{
  display: none;
  position: absolute;
  left: 33%;
  top: 68vh;
  z-index: 2000;
	background-color:white; 
	color:#555; 
  border:.1em solid;
	border-color: #3229CF;
  border-radius:10px;
  font-size: 3vmin;
  padding:10px 10px 10px 10px;
  margin:10px;
  cursor: default;
  box-shadow: 10px 5px 5px rgba(0, 0, 0, .15);
}


.symbol {
	font-size: 0.9em;
	font-family: Times New Roman;
	border-radius: 1em;
	padding: .1em .6em .1em .6em;
	font-weight: bolder;
	color: white;
	background-color: #4E5A56;
}

.icon-info { background-color: #3229CF; }

.icon-info:before { content: 'i'; }

#notification_text{
  padding-left: 8px;
}


.nav-item-inner{
  background: white;
}

#w8logo{
  color: yellow;
  font-size: 3.5vh;
  margin-top: -7vh;
  margin-left: 44.4vh;
}
