.Allsections{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    text-align: center;
    width: 50%;
    height: 20%;
    border-style: solid;
    border-color: white;
    margin-top: 2%;
    padding-bottom: 2%;
    margin-left: 15%;
    margin-right: 50%;
    color: rgb(67, 116, 27);
    font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;

    
}

.Allsections h1{
margin-bottom: 5%;

}

.input1 p{
    margin: 2%;
    color: wheat;
    font-size: 50px;
}

.numbers button{
    background-color: rgb(255, 210, 210);
    
}

.numbers{
  float: left;
  margin-left: 10%;
  margin-right: 10%;
  
  
  

}
.Snumber1,.Snumber2,.Snumber3{
    margin: 10%;
    display: flex;
    flex-direction: row;


}


.operations{
    display: flex;
    flex-direction: column;
    bottom: 20%;
    right: 100%;
    width: 5%;
    
}
.operations button{
    background-color: aqua;
    margin-top: 5%;
   
     
}


.operations button{
    background-color: rgb(255, 255, 255);
    width: 200%;
    margin: 10%;
}

#displ{
    background-color: rgb(67, 116, 27);
    border-radius: 30%;
    opacity: 0.7;
    color: black;
}
#numbers{
    position: relative;
    display: flex;
    flex-direction: row;
   
    
}
#egal{
    background-color: rgb(67, 116, 27);
}
.Snumber1 button{
    width: 100%;
}
#displ{
    position: absolute;
    left: 40%;
    top: 15%;
    width: 20%;
    height: 25%;
    text-align: center;
    padding-top: 5%;
    
    
}
#backSpace{
        
    background-color: rgb(67, 116, 27);
     width: 30%;
     margin-left: 13%;
    
} 

@media only screen and (max-width:800px){
    .Allsections{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    text-align: center;
    width: 80%;
    height: 600px;
    border-style: solid;
    border-color: white;
    margin-top: 2%;
    padding-bottom: 2%;
    margin-left: 15%;
    margin-right: 50%;
    color: rgb(67, 116, 27);
    font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
}


    #backSpace{
        position: relative;
        bottom: 3%;
        background-color: rgb(67, 116, 27);
         width: 70%;
         margin-left: 20%;
         margin-top: 5%;

        
    }
    .text-center{
        position: relative;
        bottom: 7%;
        margin-bottom: 0%;
        font-size: 200%;
    }
    #displ{
        position: absolute;
        width: 50%;
        height: 25%;
        left: 30%;
        bottom: 100%;
        margin: 0%;
        

    }
    .onluNumber{
        position: relative;
        margin-top: 80%;
        margin-left: 5%;
    }
    .operations{
        position: relative;
        left: 10%;
        top: 10%;
    }
    .operations .btn-light{
    
      border-radius: 40%;
      text-align: center;
      font-size: 110%;
      

    }

}
@media  screen and (max-width:400px){
    .Allsections{
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        text-align: center;
        width: 80%;
        height: 600px;
        border-style: solid;
        border-color: white;
        margin-top: 2%;
        padding-bottom: 2%;
        margin-left: 15%;
        margin-right: 50%;
        color: rgb(67, 116, 27);
        font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    }
    .text-center{
        position: relative;
        bottom: 0%;
        margin-bottom: 0%;
        font-size: 200%;
    }
    #displ{
        position: absolute;
        left: 32%;
        top: 10%;
        width: 40%;
        height: 25%;
        text-align: center;
        padding-top: 5%;
    }
    #backSpace{
        background-color: rgb(67, 116, 27);
         width: 32%;
         margin-left: 19%;
        
    }
    #resart{
        position: relative;
        bottom: 2%;
    }

}