body {
    
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content: center;
    Background-color: #F5F5F5;
    color: #C724B1;
    font-size: x-large;
    font-family: sans-serif;
    
}

.container-interactive {

    display: grid;
    text-align: center;
    justify-content: center;
    align-self: center;
    background-color: #005151;
    color: #30CEBB; 
    width: 100%;
    height: 375;
    font-size: large;
    box-shadow: #005151 0em 0em 10em .5em;


}

.input-container {

    display: grid;
    padding: none;

}

.input-container .the_contained {

    color: #F5F5F5;
    margin-top: 10px;
	
}

.access-token-container .the_contained {

    color: #F5F5F5;
    margin-top: 10px;
    
}

.submit-tenant-details {

    margin-top: 5%;
    margin-bottom: 5%;
    width: 50%;
    height: 2em;
    border-radius: 2em;
    background-color: #59d7c8;
    color: #53565A;
    border: unset;
    justify-self: center;
    font-size: x-large;

}

.submit-tenant-details:hover {

    background-color: #acebe3;
    color: #59178a;

}

.submit-tenant-details:active {

    background-color: #59d7c8;
    color: #53565A;

}

.loading-container{

    display: none;
    color: #F5F5F5;
    vertical-align: middle;
    flex-direction: column;

}

.access-token-container{

    display: none;
    color: #F5F5F5;
    vertical-align: middle;
    flex-direction: column;

}

.loading {

    appearance: none;
    justify-self: center;
    align-self: center;
    width: 95%;
    height: 200px;
    background-color: #99b9b9;
    border: none;
	resize: none;
	margin-bottom:13%
    
}

.refresh-tenant-details{

    visibility: hidden;
    margin-top: 5%;
    margin-bottom: 5%;
    display: inline-block;
    width: 50%;
    height: 2em;
    border-radius: 2em;
    background-color: #59d7c8;
    color: #53565A;
    border: unset;
    font-size: x-large;
    justify-self: center;
    align-self: center;

}

.error-container {

    margin-top: 5%;
    text-align: center;
    justify-content: center;

}