:root {
  --tri-size: clamp(150px, 35vw, 320px);
  --tri-top: calc(var(--tri-size) * 0.25);
}

/* RIGHT TRIANGLE */

img:nth-of-type(1) {
  position: fixed;
  right: -6px;
  width: var(--tri-size);
  top: var(--tri-top);
  transform: rotate(142.4deg);
  z-index: 1;
}

/* LEFT TRIANGLE */

img:nth-of-type(2) {
  position: fixed;
  left: -6px;
  width: var(--tri-size);
  top: calc(var(--tri-top) - 39px);
  z-index: 1;
  transform: scaleX(-1) rotate(142.9deg);
  color: #f4a261;
}

/* LINK — LOCKED TO RIGHT TRIANGLE */

triangle {
  position: fixed;
  right: -109.5px;
  top: var(--tri-top);
  transform: translate( calc(-1 * var(--tri-size) * 0.23), calc(var(--tri-size) * 2.74) );
  font-size: clamp(16px, 15.5vw, 24.2px);
  color: #000;
  text-decoration: none;
  z-index: 10;
  font-family: "Aptos", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  width: var(--tri-size);
}

:root {
  --tri-size: 180px;
  --tri-bottom: -30px;
}

img:nth-of-type(3) {
  position: fixed;
  right: -6px;
  bottom: var(--tri-bottom);
  width: var(--tri-size);
  transform: rotate(142.4deg);
  z-index: 1;
  color: #f4a261;
}

img:nth-of-type(4) {
  position: fixed;
  left: -6px;
  bottom: var(--tri-bottom);
  width: var(--tri-size);
  transform: scaleX(-1) rotate(142.9deg);
  z-index: 1;
  color: #f4a261;
}

h1 {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #000;
  z-index: 2;
  font-family: "Aptos", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.h1, h1 {
  font-size: calc(1.175rem + 1.76411vw);
  font-size: clamp(16px, 15.5vw, 36.3px);
}

p {
  position: fixed;
  left: -22px;
  bottom: -1px;
  transform: translate(45%, -55%);
  color: #000;
  z-index: 10;
  font-family: "Aptos", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: clamp(16px, 17.5vw, 16.1px);
}

span {
  position: fixed;
  right: -18px;
  width: var(--tri-size);
  top: var(--tri-top);
  transform: rotate(0.0deg);
  transform: translate( calc(-1 * var(--tri-size) * -0.21), calc(var(--tri-size) * 0.26) );
  z-index: 10;
  color: #000;
}

.name {
}

.Top.Right {
}

#circle {
  top: -7px;
  right: -8px;
  position: fixed;
  width: 145px;
  height: 145px;
}

#circle1 {
  top: -7px;
  right: -8px;
  position: fixed;
  width: 145px;
  height: 145px;
  color: #f4a261;
}

#circle2 {
  right: -8px;
  position: fixed;
  width: 145px;
  height: 145;
  top: -7px;
  color: #f4a261;
}

.img-fluid {
  max-width: 100%;
  height: auto;
}

#circle3 {
  top: +460px;
  right: -8px;
  position: fixed;
  width: 145px;
  height: 145px;
  color: #f4a261;
}

#circle4 {
  right: -8px;
  position: fixed;
  width: 145px;
  top: +460px;
}

#circle11 {
  width: 110px;
  height: 110px;
  top: 11px;
  left: 10px;
  position: fixed;
}

#circle22 {
  width: 110px;
  height: 110px;
  top: 11px;
  right: 10px;
  position: fixed;
}

#circle33 {
  top: 476px;
  width: 110px;
  height: 110px;
  left: 10px;
  position: fixed;
}

#circle44 {
  height: 110px;
  top: 476px;
  right: 10px;
  width: 110px;
  position: fixed;
}

#contact-information {
  font-size: clamp(16px, 15.5vw, 24.2px);
}

#rhombus1 {
  width: 110px;
  height: 110px;
  top: 11px;
  right: 0px;
  position: fixed;
  rotate: -37.5deg;
}

#Rhombus2 {
  height: 110px;
  top: 11px;
  right: 0px;
  width: 110px;
  rotate: 38.5deg;
}

#Rhombus3 {
  height: 110px;
  top: 470px;
  right: 0px;
  width: 110px;
  rotate: -37.5deg;
}

#Rhombus4 {
  top: 470px;
  right: 0px;
  width: 110px;
  height: 110px;
  rotate: 38.5deg;
}

body {
}

#form {
  top: 50%;
  left: 50%;
}

input {
}

#form {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 9999;
}

#text {
  width: 320px;
  margin-bottom: -3px;
}

#help-text {
  color: #000000;
  bottom: 50vw;
  font-size: 10.7px;
}

button, input, optgroup, select, textarea {
  margin: 0;
  font-family: inherit;
  font-size: 16.1px;
  line-height: inherit;
}

#check-label {
  font-size: 16.1px;
  margin-bottom: 5px;
  margin-left: 3px;
}

#form-box {
  font-size: 16.1px;
  color: #000000;
  margin-bottom: 0px;
  border: 1px solid #000000;
}

#formCheck-1 {
  margin-bottom: 5px;
  font-size: 16.1px;
  border: 1px solid #000000;
  border-radius: 3px;
  padding: 9px;
}

body {
  margin: 0;
  font-family: var(--bs-body-font-family);
  font-size: 24.2px;
  font-weight: var(--bs-body-font-weight);
  line-height: var(--bs-body-line-height);
  color: var(--bs-body-color);
  text-align: var(--bs-body-text-align);
  background-color: var(--bs-body-bg);
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}

#link2 {
  right: 20px;
  position: fixed;
  top: calc(var(--tri-top) + var(--tri-size) - 134px);
  z-index: 10;
  font-size: 16.1px;
}

#link1 {
  right: 26px;
  bottom: calc(var(--tri-bottom) + var(--tri-size) - 122px);
  z-index: 10;
  position: fixed;
}

