/*
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied.  See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */
/* jetbrains-mono-regular - latin */
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 400;

  src: local(""),
    /* Modern Browsers */ url("../fonts/JetBrainsMono-Regular.ttf")
      format("truetype");
}

* {
}

body {
  font-family: "JetBrains Mono", monospace;
  font-size: 22px;
  font-weight: 700;
}

progress {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 50px;

  /*make background color #343434*/
  background-color: #343434;

  /*border 3px color #2e302d*/
  border: 3px solid #2e302d;

  /*shadow #dcdcdc 5px*/
  box-shadow: 10px 10px 10px #dcdcdc;
}

progress::-webkit-progress-bar {
  background-color: #343434;
}

progress::-webkit-progress-value {
  background-color: #03fe33;
}

progress::-moz-progress-bar {
  background-color: #03fe33;
}

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* Portrait layout (default) */
.app {
  /*margin 20px*/
  margin: 20px;

  /*center vertically*/
  display: flex;
  flex-direction: column;
}

/* Landscape layout (with min-width) */
@media screen and (min-aspect-ratio: 1/1) and (min-width: 400px) {
  .app {
  }
}

@media screen and (prefers-color-scheme: dark) {
  body {
  }
}

/* Default margin for smaller screens */
.content {
  margin-left: 10%;
  margin-right: 10%;
}

/* Media query for screens larger than 768px */
@media screen and (min-width: 768px) {
  .content {
    margin-left: 10rem; /* Adjust this value for larger screens */
    margin-right: 10rem; /* Adjust this value for larger screens */
  }
}

/* Media query for screens larger than 1200px */
@media screen and (min-width: 1200px) {
  .content {
    margin-left: 20rem; /* Adjust this value for even larger screens */
    margin-right: 20rem; /* Adjust this value for even larger screens */
  }
}

.donate-button {
    margin-top: 10px;
}