.theme-light {
  --font-color-primary: black;
  --font-color-secondary: black;
  --background-color: white;
  --image-border1: coral;
  --image-border2: #f8953b;
  --hover-color: white;
  --color-accent: coral;
  --color-code-bg: black;
  --color-code: rgb(0, 255, 0);
}
.theme-dark {
  --font-color-primary: white;
  --font-color-secondary: grey;
  --background-color: black;
  --image-border1: #caa81b;
  --image-border2: #f8d141;
  --hover-color: black;
  --color-accent: goldenrod;
  --color-code-bg: white;
  --color-code: rgb(248, 114, 136);
}
.preloader-wrap {
  width: 100%;
  height: 100%;
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #272727;
  z-index: -100;
}
body {
  background-color: var(--background-color);
  overflow: hidden;
}
.page-head-foot {
  color: var(--font-color-primary) !important;
}
.page-head-foot-bg {
  background-color: var(--font-color-primary) !important;
}
.switch-button {
  float: right;
  margin-right: 20px;
}
.code-statement {
  background-color: var(--color-code-bg);
  color: var(--color-code);
  border-radius: 5px;
  width: unset;
}
.bg-w {
  background-color: var(--background-color);
}
.bg-gy {
  background-color: var(--color-accent);
}

.bord-rd-5 {
  border-radius: 5px;
}
.marg {
  margin: 20px;
}

.marg-40 {
  margin: 40px;
}

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

.inl-flex {
  display: inline-flex;
}

.blok {
  display: block;
}

.bg-w {
  background-color: var(--background-color) !important;
}
a:hover {
  color: var(--color-accent) !important;
}
.min-marg-bl {
  margin-top: -5px;
  margin-bottom: 0px;
}

.logo-marg {
  margin-top: -15px;
  margin-bottom: -5px;
}

.p4h {
  color: var(--color-accent);
  font-weight: 900;
}

.p4sh {
  color: var(--font-color-secondary);
  font-weight: 700;
}

.p4sh2 {
  color: var(--font-color-primary);
  font-weight: 550;
}

.code-image {
  width: 100%;
}

.linkedin1,
.instagram1,
.github1,
.twitter1 {
  color: var(--font-color-primary) !important;
}
.instagram1:hover {
  background: linear-gradient(
    45deg,
    #405de6,
    #5851db,
    #833ab4,
    #c13584,
    #e1306c,
    #fd1d1d
  ) !important;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  border-radius: 6px;
  color: white !important;
}
.github1:hover {
  color: grey !important;
  font-weight: 800;
}
.linkedin1:hover {
  color: #0077b5 !important;
}
.twitter1:hover {
  color: #00acee !important;
}