@import url('https://fonts.googleapis.com/css2?family=Monofett&display=swap');
  @import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@900&display=swap');
  @import url('https://fonts.googleapis.com/css2?family=Outfit:wght@800&display=swap');
  * { padding: 0px; margin: 0px; }
  html { font-family:'Times New Roman',Georgia; text-align:center; overflow-x:hidden; }
  body { background: linear-gradient(to bottom, #b149ff 100%, #d182f0 100%); }
  header { background-color:#000EDD; border:0.5px solid black; font-size:18px; color:white; text-shadow:1px 1px 5px black; padding:20px 0px; }
  .menu { padding-top:5px; color:black; font-size:30px; font-weight:bold; font-family:'Verdana'; text-shadow:1px 1px 3px black; }
  .menu:hover { cursor:pointer; color:white; transition-duration:1s; transition-timing-function: ease; }
  .m { -webkit-transform:rotate(180deg); -ms-transform: rotate(180deg); transform:rotateX(180deg); }
  .menu-geral { position:absolute; width:300px; height:500px; border:0.5px solid black; background-color:yellow; margin-top:20px; z-index:2; display:none; }
  h2 {color:darkblue; font-family: 'Monofett', cursive; font-size:55px; margin-top:5px; margin-bottom:15px;}
  #configurações { width:350px; height:auto; border:0.5px solid #3A3A3A; background-color:#6A5ACD; display:inline-block; position:absolute; right:-327px; top:83.5px; z-index:2; box-shadow:-3px 0px 5px 0px rgba(0,0,0,0.5), 2px 2px 10px 1px #5f51b8 inset;}
  #click-menu { width:20px; height:100%; display:inline-table; font-family:'Verdana'; font-size:25px; text-shadow:1px 1px 3px black; font-weight:700; position:relative; top:0px; right:10px; text-align:center; vertical-align:middle; cursor:pointer; }
  #click-menu p { display:table-cell; vertical-align:middle; }
  #click-menu p:hover { background:rgba(0,0,255,0.1); color:white; transition-timing-function:ease; transition-duration:1s; }
  .seta { -webkit-transform: rotate(180deg); -ms-transform: rotate(0,180deg); transform:rotateY(180deg); }
  #configurações button { width:300px; background-color:#76FF00; padding:10px; margin:2px; margin-top:15px; margin-bottom:15px; border-radius:5px; border-color:blue; border-width:4px; font-family:'Outfit', sans-serif; font-weight:900; font-size:20px; color:#e3eaa7; text-shadow:1px 1px 3px black; cursor: pointer; }
  #configurações button:active { background-color:seagreen; color:white; transition-timing-function: ease; transition-duration:0.1s;}
  #configurações.none { display:none; }
  #center { width:80%; }
  table { border: 1px solid black; background-color:darkgreen; border-radius:5px; }
  th input { width:95%; height:45px; margin-top:5px; margin-bottom:3px; font-family: 'Roboto Slab', sans-serif; font-size:25px; text-align:center; }
  .btn { width:80px; box-sizing: border-box; background-color: orange; border: 2px solid #e74c3c; border-radius: 10px; color: #e74c3c; cursor: pointer; display: table-cell; text-align: center; vertical-align: middle; font-weight: 400; line-height: 1; margin: 2px; padding: 15px 10px; text-transform: uppercase; font-family: 'Roboto Slab', sans-serif; font-size:30px; }
  .btn:active { background-color: #EF9700; border-color:#D84538; color:#D84538; box-shadow: 0 3px #494949; transform: translateY(2px); }
  .btn:hover { box-shadow: 0 3px #494949; }
  .btnyellow { width:80px; box-sizing: border-box; background-color: #FFFF00; border: 2px solid #FFD700; border-radius: 10px; color:#FFD700; cursor: pointer; display: table-cell; text-align: center; vertical-align: middle; font-weight: 400; line-height: 1; margin: 2px; padding: 15px 10px; text-transform: uppercase; font-family: 'Roboto Slab', sans-serif; font-size:30px; }
  .btnyellow:hover { box-shadow: 0 3px #494949; }
  .btnyellow:active { background-color: #F7EF00; border-color:#E5BB00; color:#E5BB00; box-shadow: 0 3px #494949; transform: translateY(2px); }
  .btnazul { width:80px; box-sizing: border-box; background-color: #00FFF2; border: 2px solid #00A1FF; border-radius: 10px; color:#00A1FF; cursor: pointer; display: table-cell; text-align: center; vertical-align: middle; font-weight: 400; line-height: 1; margin: 2px; padding: 15px 10px; text-transform: uppercase; font-family: 'Roboto Slab', sans-serif; font-size:30px; }
  .btnazul:hover { box-shadow: 0 3px #494949; }
  .btnazul:active { background-color: #00E5F2; border-color:#0089E5; color:#0089E5; box-shadow: 0 3px #494949; transform: translateY(2px); }
  .btncinza { width:80px; box-sizing: border-box; background-color: #BFBFBF; border: 2px solid #5C758E; border-radius: 10px; color:#5C758E; cursor: pointer; display: table-cell; text-align: center; vertical-align: middle; font-weight: 400; line-height: 1; margin: 2px; padding: 15px 10px; text-transform: uppercase; font-family: 'Roboto Slab', sans-serif; font-size:30px; }
  .btncinza:hover { box-shadow: 0 3px #494949; }
  .btncinza:active { background-color: #ADADAD; border-color:#425466; color:#425466; box-shadow: 0 3px #494949; transform: translateY(2px); }
  .btnbranco { width:80px; box-sizing: border-box; background-color: #FFFFFF; border: 2px solid #000000; border-radius: 10px; color:#000000; cursor: pointer; display: table-cell; text-align: center; vertical-align: middle; font-weight: 400; line-height: 1; margin: 2px; padding: 15px 10px; text-transform: uppercase; font-family: 'Roboto Slab', sans-serif; font-size:30px; }
  .btnbranco:hover { box-shadow: 0 3px #494949; }
  .btnbranco:active { background-color: #FCFCFC; border-color:#3D3D3D; color:#3D3D3D; box-shadow: 0 3px #494949; transform: translateY(2px); }
  #div-p { margin:5px;}
  #div-p p { padding:10px; }
  #div-p button { width:300px; background-color:#76FF00; padding:10px; margin:2px; margin-top:12px; margin-bottom:12px; border-radius:5px; border-color:blue; border-width:4px; font-family:'Outfit', sans-serif; font-weight:900; font-size:20px; color:#e3eaa7; text-shadow:1px 1px 3px black; cursor: pointer; }
  #div-p button:active { background-color:seagreen; color:white; transition-timing-function: ease; transition-duration:0.1s; }
  #configurar { border:3px black solid; width:380px; margin:auto; background-color:#303091; color:#f5f5fa; border-radius:5px; }
  #configurar button { width:auto; background-color:white; padding:0; margin:1px; border-radius:1px; border-color:gray; border-width:2px; font-family:sans-serif; font-weight:normal; font-size:1px; color:white; text-shadow:0px 0px 0px black; cursor: pointer; }
  #x-de-personalização { text-align:left; margin-bottom:-20px; font-family:Arial; font-weight:700; font-size:20px; cursor:pointer; }
  #x-de-personalização:hover { color:red; }
  #x-de-personalização:active { color:red; }


/* Calculadora Avançada */

#calculadora-avançada { width: 370px; background-color:#DCDCDC; border: 0.5px solid black; border-radius:0px;}
#display { width:385px; height:40px; margin:-1px; text-align: right; background-color: white; border: 0.5px solid white; font-size: 30px; color:black; }
#calculadora-avançada button { width:80px; height:50px; margin:-2.1px; text-align:center; color:white; background-color:black; font-size: 25px; }
#calculadora-avançada .bgcorange { background-color:orange; }