@media (min-width: 301px)
{
    .textContainer
{
    
    text-align: center;
    position: absolute;
    top: 1%;
    left: 20%;
    width: 60%;
}

   .textContainer2
{
    
    text-align: center;
    position: absolute;
    top: 330px;
    left: 20%;
    width: 60%;
}


.ButtonsContainer
{
    position: absolute;
    top: 200px;
    left: 20%;
    width: 301px;
     
}




    .InstaBox
{
    display: inline-block;
            
    position: absolute;
    top: 0%;
    left: 0%;

    width: 80px;
      
}
.InstaBox img 
{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.SpotifyBox
{
    display: inline-block;
            
    position: absolute;
    top: 0%;
    left: 90px;

    width: 80px;
    
}
.SpotifyBox img 
{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.BookUsBox
{
    display: inline-block;
            
    position: absolute;
    top: 0px;
    left: 270px;

    width: 100px;
}
.BookUsBox img 
{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.SoundCloudLinkBox
{
    display: inline-block;
            
    position: absolute;
    top: 0%;
    left: 180px;

    width: 80px;
          
}
.SoundCloudLinkBox img 
{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.SoundCloudContainer
{
	
	position: fixed;
    left: 20%;
	bottom: 5%;
	width: 70%;

    background-color:black;
    border: 3px solid rgb(218, 160, 0);

}



a
{
	color:white;
}

body
{
    overflow: auto;
	font-family: Calibri;
    
    min-height: 200vh;

	background-color: black;

	background-image: url("BG.jpg");
	
    background-size: 80%;
    background-repeat: no-repeat;
    background-position-x: center;
	
}

label {
    color: #ffffff; /* Orangefarbener Ton */
}

textarea {
    width: 100%; /* Nimmt die volle Breite des umgebenden Containers */
    max-width: 600px; /* Maximale Breite auf 600px begrenzen */
}

h1 {
    text-align: left;  
    color: white;
    font-size:xx-large;
 }
p {

    text-align: left; 
    color: white;
    font-size:x-large;
}
h2
{
    text-align: left; 
    color: rgb(0, 0, 0);
    font-size:x-large;
}
	




}





@media (max-width: 500px)
{

    .textContainer
{
    
    text-align: center;
    position: absolute;
    top: 1%;
    left: 5%;
    width: 90%;

   
 

}
.ButtonsContainer
{
    position: absolute;
    left: 20%;
    top: 120px;
    width: 60%;
    height: 200px;
    
    
}
.textContainer2
{
    text-align: right;
    position: absolute;
    top: 330px;
    left: 5%;
    width: 95%;
}



.FormContainer
{
    position: absolute;
    top: 20%;
    left: 10%;
    width: 80%;
    
    
}



    .InstaBox
{
    display: inline-block;
            
    position: absolute;
    top: 0%;
    left: 0%;

    width: 40%;

    
    
    
}
.InstaBox img 
{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.SpotifyBox
{
    display: inline-block;
            
    position: absolute;
    top: 0%;
    left: 60%;

    width: 40%;

    
}
.SpotifyBox img 
{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.BookUsBox
{
    display: inline-block;
            
    position: absolute;
    top: 60%;
    left: 60%;

    width: 40%;
}
.BookUsBox img 
{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.SoundCloudLinkBox
{
    display: inline-block;
            
    position: absolute;
    top: 60%;
    left: 0px;

    width: 40%;

       
    
}
.SoundCloudLinkBox img 
{
    width: 100%;
    height: 100%;
    object-fit: cover;
}




     .SoundCloudContainer
    {
	
	position: fixed;
    left: 5%;
	bottom: 5%;
	width: 90%;

    background-color:black;
    border: 1px solid rgb(218, 160, 0);
    }



a
{
	color:white;
}

body
{

	font-family: Calibri;
    
    scroll-behavior: auto;

	background-color: black;

	background-image: url("BG.jpg");
	
    background-size: 80%;
    background-repeat: no-repeat;
    background-position-x: center;
	
}

label {
    color: #ffffff; 
}

textarea {
    width: 100%; /* Nimmt die volle Breite des umgebenden Containers */
    max-width: 600px; /* Maximale Breite auf 600px begrenzen */
}


h1 {
    text-align: left;  
    color: white;
    font-size:x-large;
 }
p {

    text-align: left; 
    color: white;
    font-size:large;
}
h2
{
    text-align: left; 
    color: rgb(0, 0, 0);
    font-size:large;
}
	




}