:root{
	
	--white: #EAEAFA;
	--teal: #1DE6A0;
	--orange: #FF8400;
	--darkblue: #200A56;
	--darkdarkblue: #0F0529;
	--darkpink: #FF00B2;
	
}

h1{
  
    text-align: center;  
  
}

button{
  
   margin: 0px auto;
   width: 130px;
   height: 40px;
   font-size: 16px;
   font-family: tahoma;
   color: var(--darkdarkblue);
   border: solid var(--darkpink) 3px;
   background-color: var(--white);
   font-weight: bold;
   box-shadow: 0px 1px 5px var(--darkdarkblue);
  
}

button:hover{
  
  cursor: pointer;
  border-color: var(--orange);
  color: var(--darkpink);
  
}

button:active{
  
    cursor: pointer;
  border-color: var(--teal);
  color: var(--orange);
  
}

a{
	
	color: var(--darkblue);
	
}

a:hover{
	
	color: var(--darkpink);
	
}

a:active{
	
	color: var(--teal);
	
}


.bg-deco-1{
    
    position: fixed;
    top: 10px;
    left: 20px;
    width: 600px;
    height: 350px;
    background-image: url("/resources/GIFs/Tiles_TP4.gif");
    z-index: -1;
   	opacity: 70%;
    
  
}

.bg-deco-2{
    
    position: fixed;
    bottom: 10px; 
    right: 20px;
    width: 600px;
    height: 350px;
    background-image: url("/resources/GIFs/TP-Dark-Blue-Tiles.gif");
    z-index: -1;
   	opacity: 70%;
    
  
}

.container{
  
    display: flex;
    justify-content: center;
    align-items: center;
    height: 97.5vh;
    
}
  
.main{
  
    border: solid var(--orange) 3px;
    flex-basis: 600px;
    height: 400px;
    display: flex;
    justify-content: space-evenly;
    box-shadow: 0px 1px 5px var(--darkdarkblue);
	  background-image: url("/resources/backgrounds/orange.gif");
  
}

.mainmid1{
  
    border: solid var(--white) 3px;
    width: 50%;
    margin: 3px;
    padding: 5px;
    background-image: url("/resources/backgrounds/dotted-bg.png");
   	box-shadow: 0px 1px 5px var(--darkdarkblue);
   	display: flex;
   	flex-direction: column;
   	align-items: center;
  
  }
  
  
.mainmid2{
  
    width: 50%;
    margin: 3px;
    text-align: center;
  
}

.lip{
  
    width: 80%;
    height: auto;
  
  }
  
body{
  
    font-family: tahoma;
    color: var(--darkblue);
   	background-image: url("/resources/Images/Perma-bg.png");
  	background-size: 70%;
  
  }