// <weight>: Use a value from 100 to 900
// <uniquifier>: Use a unique and descriptive class name

.inter-<uniquifier> {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}


body {
    background-image: url("im-fokus-baustelle-79a85f84-0dc8-44a7-aae9-cd9da177f4f5-1514053269.jpg");
    background-size: cover; /* Bild skaliert passend */
    background-position: center;
    background-repeat: no-repeat;

    position: absolute;
    top: 100px;

    height: 100vh;
    width: 100vw;

    margin-right: 200px;
    color: #1C1C1C;
    font-family: "Inter", sans-serif;
    
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 15px;
    
}

.container {
    display: flex;
    flex-direction: column;
    height: 770px;
    width: 550px;
    align-items: center;
    background-color: #F4F4F4;
    border: 2px solid black;
    border-radius: 3px 3px 0 0; 
}

.convert-window {
    background-color: #eb8a3b;
    width: 550px;
    height:285px;
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-top: 20px;
}

.convert-window h1 {
    word-spacing:-3%;
    font-size: 28px;
    font-weight: extra-bolder;
    margin-top: -60px;
    margin-bottom: 30px;
    color: black;
}

.covert-number {
    width: 500px;
    height: 42px;
    background-color: #FFFFFF;
    border: 1px solid #D9D9D9;
    font-size: 58px;
    margin-bottom: 0px;
    margin-left: 60px;
    border-radius: 5px;
    color: black;

}

.convert-window input {
    border: 2px solid #000000;
    font-size: 58px;
    width: 117px;
    height: 83px;
    text-align: center;
    background-color: #dfcdbe;
    color: black;
    border-radius: 5px;
    font-weight:700;
    margin-bottom: 20px 

}

.convert-window h2 {
    border: 2px solid white;
    text-align: center;
    border: 1px solid #B295FF;
    padding: 10px;
    font-size: 58px;
    border-radius: 5px;
    color: rgb(0, 0, 0);
}

.convert-window button {
    background-color: white;
    color: rgb(0, 0, 0);
    border: 1px solid rgba(0, 0, 0, 0.353);
    padding: 12px 20px;
    font-size: 16px;
    cursor: pointer;
    width: 117px;
    height: 42px;
    font-weight: 500;
    border-radius: 5px;
    margin-top: 4px;
    margin-bottom: -60px;
}

.number-windows {
    display: flex;
    flex-direction:column;
    justify-content: center;
    align-items: center;

}

.number-windows h2 {
    color:#5A537B ;
    font-size: 20px;
    margin-top: 31px;
    text-align: center;
}

.number-windows p {
    font-size: 14px;
    margin-top: 9px;
    text-align: center;
    
}

.number-windows1 {
    background-color: #eb8a3b;
    width: 500px;
    height: 108.57px;
    margin-top: 36px; 
    color: white;
    font-weight: bold;
    border: 1px solid rgba(80, 74, 74, 0.353);


}

.number-windows2 {
    background-color: #dfcdbe;
    width: 500px;
    height: 108.57px;
    margin-top: 36px; 
    font-weight: bold;
    border: 1px solid rgba(80, 74, 74, 0.353);


}

.number-windows3 {
    background-color: #eb8a3b;
    width: 500px;
    height: 108.57px;
    margin-top: 36px; 
    color: white;
    font-weight: bold;
    border: 1px solid rgba(80, 74, 74, 0.353);

}

.number-windows1 p {
    margin-bottom:px ;
}