textarea {
width:600px;
height:200px;
}

body {
background-color: #ffffff;
}

textarea#output, textarea#output2  {
width: 100%;
font-size:12pt;
font-family:"Courier";
line-height: 18pt;
}

p {
font-size:12pt;
font-family:"Helvetica";
line-height: 24px;
margin-bottom:0px;
}

h1 {
font-size:18pt;
font-family:"Helvetica";
margin-bottom:0px;
}

h2 {
font-size:14pt;
font-family:"Helvetica";
margin-bottom:18px;
}

h4 {
font-size:14pt;
font-family:"Helvetica";
margin-bottom:8px;
}

hr {
margin-top:24px;
margin-bottom:24px;
height: 0px; 
border-bottom: 0.25px solid black; 
font-size: 1px; 
}

body {
padding:5px;
}

#maindiv{
position: absolute;
left: 50%;
margin-right: -50%;
transform: translate(-50%, 0%);
text-align: left;
width: 800px;
background-color: white;
}

.accordion {
font-size:12pt  !important;
font-family:"Helvetica" !important;
background-color: #eee;
color: #000 !important;
cursor: pointer !important;
padding: 14px !important;
width: 100% !important;
text-align: center !important;
border: .5px solid #000 !important;
outline: none !important;
margin-bottom:8px;
}


.active {
background-color: #eee;
}

.expandall{
font-size:11pt  !important;
font-family:"Helvetica" !important;
width:120px !important;
height:40px !important;
padding:7px !important;
border-radius:4px !important;
border:.5px solid #000 !important;
color:black !important;
background-color: #eee;
}

/* Show hover highlight only on devices that actually support hover + fine pointer */
@media (hover: hover) and (pointer: fine) {
  .accordion:hover { background-color: #9f9; }
  .expandall:hover { background-color: #9f9; }
}

.tocpanel {
padding: 12px !important;
padding-left: 30px !important;
display: none;
overflow: hidden !important;
}


.btn {
  --color: #000000;
  --background-color: #d8d8d8;
  --border-color: darken(#d8d8d8, 7.5%);
  color: var(--color);
  font-family: helvetica !important;
  font-size: 11pt !important;
  background-color: var(--background-color);
  padding: 0.7rem 0.7rem;
  padding-top: 0.8rem;
  border: solid 1px var(--border-color);
  outline: none;
  position: relative;
  border-radius: 0.5rem;
  user-select: none;
  box-shadow: 0 0.1rem 0.1rem rgba(0, 0, 0, 0.25), 0 -0.1rem 0.5rem rgba(0, 0, 0, 0.1) inset;
  transition: box-shadow 64ms ease-out;
  -webkit-appearance:none;
}

.btn:after {
  content: "";
  background-color: #ffffff;
  width: 75%;
  height: 12.5%;
  position: absolute;
  top: 0.15rem;
  left: 12.5%;
  border-radius: 50%;
  filter: blur(0.15rem);
  transition: opacity 64ms ease-out;
}

.btn:active {
  box-shadow: 0 0 0 rgba(0, 0, 0, 0.4), 0 0.4rem 1rem rgba(0, 0, 0, 0.3) inset;
}
.btn:active:after {
  opacity: 0;
}

.btn-info {
  --color: #ffffff;
  --background-color: #0091ea;
  --border-color: #0079c4;
}
.btn-info:active {
  --color: #ececec;
}
.btn-success {
  --color: #ffffff;
  --background-color: #00c853;
  --border-color: #00a243;
}
.btn-success:active {
  --color: #ececec;
}
.btn-warning {
  --color: #3e2723;
  --background-color: #ffc400;
  --border-color: #d9a700;
}
.btn-warning:active {
  --color: #261815;
}
.btn-error {
  --color: #ffffff;
  --background-color: #d50000;
  --border-color: #af0000;
}
.btn-error:active {
  --color: #ececec;
}
.btn-dark {
  --color: #ffffff;
  --background-color: #303030;
  --border-color: #1d1d1d;
}
.btn-dark:active {
  --color: #ececec;
}

.btn-controls{
  --color: black;
  --background-color: lavender;
}

.btn-generate{
  --color: black;
  --background-color: #BBFFBB;
}


/* For modal dialog prompt replacement */
.modal_flat_background { background-color: #000; opacity: 0.4; }
.modal_flat_main { border: 1px solid #333; box-shadow: 0px 0px 15px -2px rgba(0,0,0,0.75);  }

/* font size only */
.modal_flat_main, .modal_flat_main input, .modal_flat_main button {  font-size: 16px; }

.modal_flat_main input, .modal_flat_main button {  padding: 5px; box-sizing: border-box; }
.modal_flat_inner { padding: 30px; background: #fff; color: #000; }
.modal_flat_content { font-family:"Helvetica"; margin: 20px 0px;}
.modal_flat_input { margin: 20px 0px;}
.modal_flat_buttons { text-align:center;margin-top: 40px; }
.modal_flat_main button { background-color: #ccc; color: #000; padding: 10px 20px; border: 0px; cursor: pointer; outline: none; width: 100px;  }
.modal_flat_cancel {margin-left: 5px;}
