body {
  margin: 48px 0 0 0;
}

hr {
  color: #CDD3DD;
}

a {
  color: #165ECC;
  cursor: pointer;
  text-decoration: underline;
}

pre {
  height: 480px;
  overflow: scroll;
  font-family: menlo;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  padding: 12px;
  margin: 0px;
}

.align-right {
  text-align: right !important;
}

.btn {
  cursor: pointer;
}

.bottom-pre {
  background-color: #EEF1F6;
  display: block;
  height: 40px;
  margin-bottom: -14px;
  position: relative;
  top: -14px;
}

.App {
  margin: 0 auto;
  width: 768px;
  font-family: proxima-nova, sans-serif;
  color: #121417;
}

.mr-8 {
  margin-right: 8px;
}
.ml-8 {
  margin-left: 8px;
}
.mt-8 {
  margin-top: 8px;
}
.mb-8 {
  margin-bottom: 8px;
}
.mt-16 {
  margin-top: 16px;
}
.mt-20 {
  margin-top: 20px;
}
.mb-44 {
  margin-bottom: 44px;
}
.mb-48 {
  margin-bottom: 48px;
}
.mt-48 {
  margin-top: 48px;
}
.p-16 {
  padding: 16px;
}
.pb-16 {
  padding-bottom: 16px;
}
.bottom-border {
  border-bottom: 1px solid #CDD3DD;
}

.dashed-border {
  border: 1px dashed #CDD3DD;
  border-radius: 4px;
}

.flex-align {
  display: flex;
  align-items: center;
}

.flex-center {
  justify-content: center;
}

.endpoint-title-url {
  max-width: 575px;
  display: inline-block;
}

.subtext {
  max-width: 560px;
  display: inline-block;
}

.view-toggle {
  width: 64px;
  height: 32px;
  float: right;
  position: relative;
  bottom: -25px;
  right: 0px;
  border: 1px solid #CDD3DD;
  border-radius: 4px;
  display: flex;
}

.toggle-item {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.toggle-item-selected {
  background-color: #EAF1FB;
  border: 1px solid #165ECC;
  border-radius: 4px;
  position: relative;
  top: -1px;
}

.toggle-item-disabled {
  /* color: #A8B1BD; */
  cursor: not-allowed;
}

.right {
  left: -1px;
}

.left {
  right: -1px;
}

.mx-endpoint-body {
  border: 1px solid #E4E8EE;
  box-sizing: border-box;
  border-radius: 4px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  padding: 16px;
}

.mx-endpoint-table {
  border-left: 1px solid #EEF1F6;
  border-right: 1px solid #EEF1F6;
  border-bottom: 1px solid #EEF1F6;
  border-radius: 4px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.hidden {
  display: none;
}

.mx-endpoint-table
tfoot tr td:last-child {
  justify-content: right;
  text-align: right;
}

.guid-table
tbody tr td:first-child {
  font-weight: 700;
  width: 68px;
}

.guid-table {
  border: 1px solid #EEF1F6;
  border-bottom: none;
  border-radius: 4px;
  font-family: menlo;
}

.error-table
tbody tr td:first-child {
  font-weight: 700;
  width: 128px;
}

.error-table {
  border-left: 1px solid #E4E8EE;
  border-right: 1px solid #E4E8EE;
  border-top: none;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  font-family: menlo;
  padding-top: 16px;
}

.code-text {
  font-family: menlo !important;
  font-weight: 400;
}

.title-sm {
  font-size: 14px;
  font-weight: 600;
  line-height: 16px;
}

.loading {
  width: 40px;
  margin: 148px auto 0;
}

.body {
  margin-top: 48px;
}

.status-step {
  -webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
     -moz-animation: fadein 2s; /* Firefox < 16 */
      -ms-animation: fadein 2s; /* Internet Explorer */
       -o-animation: fadein 2s; /* Opera < 12.1 */
          animation: fadein 2s;
}

.widget-params {
  border: 1px solid #CDD3DD;
  border-radius: 4px;
  box-shadow: 0px 0px 15px 0px #cdd3dd;
  font-size: 12px;
  height: 255px;
  left: 50%;
  margin-left: -175px;
  overflow: hidden;
  position: fixed;
  width: 350px;
}

.widget-params pre {
  width: 600px;
  background-color: rgb(248, 249, 251) !important;
}

@keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}
