.container-calculator {
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #e950ba;
  border-radius: 30px;

}

.calculator {
  background-color: #ecf0f3;
  padding: 5px;
  border-radius: 20px;
  box-shadow: inset 5px 5px 12px #ffffff, 5px 5px 12px rgba(0, 0, 0, .16);
  display: grid;
  grid-template-columns: repeat(4, 68px);
}

input {
  grid-column: span 4;
  height: 70px;
  widows: 260px;
  background-color: #ecf0f3;
  box-shadow: inset -5px -5px 12px #ffffff, inset 5px 5px 12px rgba(0, 0, 0, .16);
  border: none;
  border-radius: 30px;
  color: rgb(70, 70, 70);
  font-size: 50px;
  text-align: end;
  margin-top: 40px;
  margin-bottom: 30px;
  padding: 20px;
}


button {
  height: 48px;
  width: 48px;
  background-color: #ecf0f3;
  box-shadow: -5px -5px 12px #ffffff, 5px 5px 12px rgba(0, 0, 0, .16);
  border: none;
  border-radius: 50%;
  margin: 8px;
  font-size: 16px;
  font-weight: bold;
}


.equal {
  width: 115px;
  border-radius: 40px;
  background-color: #ecf0f3;
  box-shadow: -5px -5px 12px #ffffff, 5px 5px 12px rgba(0, 0, 0, .16);
}


/*! CSS Used from: https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/css/all.min.css */
.fab{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:inline-block;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1;}
.fa-facebook-f:before{content:"\f39e";}
.fa-linkedin-in:before{content:"\f0e1";}
.fa-twitter:before{content:"\f099";}
.fa-youtube:before{content:"\f167";}
.fab{font-family:"Font Awesome 5 Brands";}
/*! CSS Used from: https://themewagon.github.io/proman/lib/animate/animate.min.css */
.fadeInUp{animation-name:fadeInUp;}
/*! CSS Used from: https://themewagon.github.io/proman/css/bootstrap.min.css */
*,*::before,*::after{box-sizing:border-box;}
hr{margin:1rem 0;color:inherit;background-color:currentColor;border:0;opacity:.25;}
hr:not([size]){height:1px;}
h1,h3{margin-top:0;margin-bottom:.5rem;font-weight:600;line-height:1.2;color:#12141D;}
h1{font-size:calc(1.375rem + 1.5vw);}
@media (min-width: 1200px){
h1{font-size:2.5rem;}
}
h3{font-size:calc(1.3rem + .6vw);}
@media (min-width: 1200px){
h3{font-size:1.75rem;}
}
p{margin-top:0;margin-bottom:1rem;}
a{color:#6244C5;text-decoration:none;}
a:hover{color:#4e369e;}
label{display:inline-block;}
button{border-radius:0;}
button:focus:not(:focus-visible){outline:0;}
input,button,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit;}
button{text-transform:none;}
button,[type="submit"]{-webkit-appearance:button;}
button:not(:disabled),[type="submit"]:not(:disabled){cursor:pointer;}
textarea{resize:vertical;}
.display-5{font-size:calc(1.425rem + 2.1vw);font-weight:700;line-height:1.2;}
@media (min-width: 1200px){
.display-5{font-size:3rem;}
}
.container,.container-xxl{width:100%;padding-right:var(--bs-gutter-x, .75rem);padding-left:var(--bs-gutter-x, .75rem);margin-right:auto;margin-left:auto;}
@media (min-width: 576px){
.container{max-width:540px;}
}
@media (min-width: 768px){
.container{max-width:720px;}
}
@media (min-width: 992px){
.container{max-width:960px;}
}
@media (min-width: 1200px){
.container{max-width:1140px;}
}
@media (min-width: 1400px){
.container,.container-xxl{max-width:1320px;}
}
.row{--bs-gutter-y:0;display:flex;flex-wrap:wrap;margin-top:calc(var(--bs-gutter-y) * -1);margin-right:calc(var(--bs-gutter-x) / -2);margin-left:calc(var(--bs-gutter-x) / -2);}
.row>*{flex-shrink:0;width:100%;max-width:100%;padding-right:calc(var(--bs-gutter-x) / 2);padding-left:calc(var(--bs-gutter-x) / 2);margin-top:var(--bs-gutter-y);}
.col-12{flex:0 0 auto;width:100%;}
.g-3{--bs-gutter-x:1rem;}
.g-3{--bs-gutter-y:1rem;}
.g-5{--bs-gutter-x:3rem;}
.g-5{--bs-gutter-y:3rem;}
@media (min-width: 768px){
.col-md-6{flex:0 0 auto;width:50%;}
}
@media (min-width: 992px){
.col-lg-5{flex:0 0 auto;width:41.66667%;}
.col-lg-6{flex:0 0 auto;width:50%;}
.col-lg-7{flex:0 0 auto;width:58.33333%;}
}
.form-control{display:block;width:100%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#5A5A5A;background-color:#fff;background-clip:padding-box;border:1px solid #ced4da;appearance:none;border-radius:10px;transition:border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out;}
@media (prefers-reduced-motion: reduce){
.form-control{transition:none;}
}
.form-control:focus{color:#5A5A5A;background-color:#fff;border-color:#b1a2e2;outline:0;box-shadow:0 0 0 .25rem rgba(98,68,197,0.25);}
.form-control::placeholder{color:#6c757d;opacity:1;}
.form-control:disabled{background-color:#e9ecef;opacity:1;}
textarea.form-control{min-height:calc(1.5em + .75rem + 2px);}
.form-floating{position:relative;}
.form-floating>.form-control{height:calc(3.5rem + 2px);padding:1rem .75rem;}
.form-floating>label{position:absolute;top:0;left:0;height:100%;padding:1rem .75rem;pointer-events:none;border:1px solid transparent;transform-origin:0 0;transition:opacity 0.1s ease-in-out,transform 0.1s ease-in-out;}
@media (prefers-reduced-motion: reduce){
.form-floating>label{transition:none;}
}
.form-floating>.form-control::placeholder{color:transparent;}
.form-floating>.form-control:focus,.form-floating>.form-control:not(:placeholder-shown){padding-top:1.625rem;padding-bottom:.625rem;}
.form-floating>.form-control:focus ~ label,.form-floating>.form-control:not(:placeholder-shown) ~ label{opacity:.65;transform:scale(0.85) translateY(-0.5rem) translateX(0.15rem);}
.btn{display:inline-block;font-weight:400;line-height:1.5;color:#5A5A5A;text-align:center;vertical-align:middle;cursor:pointer;user-select:none;background-color:transparent;border:1px solid #e950ba;padding:.375rem .75rem;font-size:1rem;border-radius:10px;transition:color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out;}
@media (prefers-reduced-motion: reduce){
.btn{transition:none;}
}
.btn:hover{color:#5A5A5A;}
.btn:focus{outline:0;box-shadow:0 0 0 .25rem rgba(98,68,197,0.25);}
.btn:disabled{pointer-events:none;opacity:.65;}
.btn-primary{color:#fff;background-color:#6244C5;border-color:#6244C5;}
.btn-primary:hover{color:#fff;background-color:#533aa7;border-color:#4e369e;}
.btn-primary:focus{color:#fff;background-color:#533aa7;border-color:#4e369e;box-shadow:0 0 0 .25rem rgba(122,96,206,0.5);}
.btn-primary:active{color:#fff;background-color:#4e369e;border-color:#4a3394;}
.btn-primary:active:focus{box-shadow:0 0 0 .25rem rgba(122,96,206,0.5);}
.btn-primary:disabled{color:#fff;background-color:#6244C5;border-color:#6244C5;}
.d-flex{display:flex!important;}
.w-100{width:100%!important;}
.me-2{margin-right:.5rem!important;}
.mb-0{margin-bottom:0!important;}
.mb-2{margin-bottom:.5rem!important;}
.mb-4{margin-bottom:1.5rem!important;}
.mb-5{margin-bottom:3rem!important;}
.px-5{padding-right:3rem!important;padding-left:3rem!important;}
.py-3{padding-top:1rem!important;padding-bottom:1rem!important;}
.py-5{padding-top:3rem!important;padding-bottom:3rem!important;}
.pt-2{padding-top:.5rem!important;}
.pb-5{padding-bottom:3rem!important;}
.fw-bold{font-weight:700!important;}
@media (min-width: 992px){
.text-lg-end{text-align:right!important;}
}
/*! CSS Used from: https://themewagon.github.io/proman/css/style.css */
.btn{font-weight:500;transition:.5s;}
.btn.btn-primary{color:#FFFFFF;}
.btn-square{width:38px;height:38px;}
.btn-square{padding:0;display:flex;align-items:center;justify-content:center;font-weight:normal;}
/*! CSS Used keyframes */
@keyframes fadeInUp{0%{opacity:0;transform:translate3d(0,100%,0);}to{opacity:1;transform:none;}}
/*! CSS Used fontfaces */
@font-face{font-family:"Font Awesome 5 Brands";font-style:normal;font-weight:normal;font-display:auto;src:url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/webfonts/fa-brands-400.eot);src:url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/webfonts/fa-brands-400.eot?#iefix) format("embedded-opentype"),url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/webfonts/fa-brands-400.woff2) format("woff2"),url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/webfonts/fa-brands-400.woff) format("woff"),url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/webfonts/fa-brands-400.ttf) format("truetype"),url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/webfonts/fa-brands-400.svg#fontawesome) format("svg");}