:root {
  --black: #000000;
  --white: #ffffff;
  --blue: #001cef;
  --bs-primary: #001cef;
}



body {
  /*font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;*/
  font-family:"Montserrat",Verdana,Arial,Sans-Serif !important;
  background-color: var(--black);
  color: var(--black);
}


.code-block {
  background: #1e1e1e;
  color: #d4d4d4;
  padding: 20px;
  border-radius: 8px;
  overflow-x: auto;
  margin: 20px 0;
}
.code-block code {
  font-family: "Courier New", monospace;
  font-size: 14px;
}

.code-block h3,
.code-block p,
.code-block a {
  color: #ffffff !important;
}

.vh-100 {
  height: auto !important;
  min-height: 100vh !important;
}
.btn-round {
  border-radius:50px;
}

.bg-dark {
  background-color: rgb(23, 23, 23) !important;
}

.bg-dark-black {
  background: linear-gradient(0deg, rgb(0, 0, 0) 25%, rgb(23, 23, 23) 75%);
}
.bg-black-dark {
  background: linear-gradient(0deg, rgb(23, 23, 23) 25%, rgb(0, 0, 0) 75%);
}

.bg-primary {
  background-color: var(--blue) !important;
}

.btn-outline-primary {
  border-color:var(--blue) !important;
  color:#fff;
}

.btn-outline-primary:hover {
  background-color:var(--blue) !important;
  border-color:var(--blue) !important;
}




.modal-content {
  border-left: 20px solid var(--blue);
}
.modal-header {
  border-radius: 0;
}

.jumbotron {
  border-left: 10px solid var(--blue);
}

header.navbar {
  background-color: var(--black);
}

header .navbar-brand img {
  height: 20px;
}

@media (max-width: 576px) {
  header .navbar-brand img {
    height: 16px;
    margin-left: 4px;
  }
}


h1 {
  font-size: 2.5rem;
  margin-bottom: 1rem;
}


.text-primary,
h1,
h2,
h3,
h4 {
  color: var(--blue)!Important;
}

.fw-100 {font-weight: 100;}
.fw-200 {font-weight: 200;}
.fw-300 {font-weight: 300;}
.fw-400 {font-weight: 400;}
.fw-500 {font-weight: 500;}
.fw-600 {font-weight: 600;}
.fw-700 {font-weight: 700;}
.fw-800 {font-weight: 800;}
.fw-900 {font-weight: 900;}


.opacity-75 {
  opacity: .75 !important;
}
.opacity-50 {
  opacity: .5 !important;
}
.opacity-25 {
  opacity: .25 !important;
}
.opacity-0 {
  opacity: 0 !important;
}

.btn-primary {
  color: #fff;
  background-color: var(--blue)!Important;
  border-color: var(--blue)!Important;
}


p {
  font-size: 1.2rem;
  margin-bottom: 2rem;
}



.bg-black{
  background:#000000;
}

footer {
  padding: 1rem;
  color: var(--white);
  font-size: .8rem;
}
footer a {
  color: var(--white);
  text-decoration: none;
}
footer .navbar-brand img {
  height: auto;
  display: block;
  width: 370px;
  max-width: 90%;
}




.card-body.text-center i {
  color: var(--blue);
}
.card-text {
  color: #555;
  font-size: 1rem;
}


.text-left {
  text-align: left;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.sticky-top {
  top: 120px;
}

.accordion-button:not(.collapsed),
.accordion-button.collapsed {
  background: black;
  color: #fff;
}

.accordion-button.collapsed::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.accordion-body {
  padding: 1rem 1.25rem;
  background: #fff;
  color: #000;
}


.accordion-item {
  background: #000;
}


.modal-body {
  min-height: 200px;
}

.rounded-50 {
  border-radius: 50%;
}
.hover-zoom {
  transition: transform 0.3s ease;
}
.hover-zoom:hover {
  transform: scale(1.05);
}



.svg-border-angled svg {
  height: 3rem;
  width: 100%;
}


.svg-border-rounded svg {
  height: 3rem;
  width: 100%;
}




.text-gradient {
  background: -webkit-linear-gradient(315deg, #1e30f3 0%, #e21e80 100%);
    background-clip: border-box;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.bg-gradient-primary-to-secondary {
  background: #1e30f3;
  background: linear-gradient(135deg, #1e30f3 0%, #e21e80 100%);
}
.profile {
  position: relative;
  height: 75vw;
  width: 75vw;
  border-radius: 5vw;
  margin-top: 5vw;
  max-height: 40rem;
  max-width: 40rem;
}
.profile .profile-img {
  height: 80vw;
  max-height: 45rem;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
.profile .dots-1 {
  position: absolute;
  width: 3vw;
  right: 1.5vw;
  top: 4vw;
}
.profile .dots-1 svg {
  fill: #fff;
}
.profile .dots-2 {
  position: absolute;
  width: 3vw;
  right: -4vw;
  top: 6.05vw;
}
.profile .dots-2 svg {
  fill: #1e30f3;
}
.profile .dots-3 {
  position: absolute;
  width: 3vw;
  left: 1.5vw;
  bottom: 6.05vw;
}
.profile .dots-3 svg {
  fill: #fff;
}
.profile .dots-4 {
  position: absolute;
  width: 3vw;
  left: -4vw;
  bottom: 4vw;
}
.profile .dots-4 svg {
  fill: #1e30f3;
}

@media (min-width: 576px) {
  .profile {
    height: 60vw;
    width: 60vw;
  }
  .profile .profile-img {
    height: 65vw;
  }
  .profile .dots-1 {
    width: 3vw;
    right: 1.5vw;
  }
  .profile .dots-2 {
    width: 3vw;
    right: -4vw;
  }
  .profile .dots-3 {
    width: 3vw;
    left: 1.5vw;
  }
  .profile .dots-4 {
    width: 3vw;
    left: -4vw;
  }
}
@media (min-width: 768px) {
  .profile {
    height: 50vw;
    width: 50vw;
  }
  .profile .profile-img {
    height: 55vw;
  }
  .profile .dots-1 {
    width: 3vw;
    right: 1.5vw;
  }
  .profile .dots-2 {
    width: 3vw;
    right: -4vw;
  }
  .profile .dots-3 {
    width: 3vw;
    left: 1.5vw;
  }
  .profile .dots-4 {
    width: 3vw;
    left: -4vw;
  }
}
@media (min-width: 992px) {
  .profile {
    height: 40vw;
    width: 40vw;
  }
  .profile .profile-img {
    height: 45vw;
  }
  .profile .dots-1 {
    width: 1.5vw;
    right: 0.75vw;
  }
  .profile .dots-2 {
    width: 1.5vw;
    right: -2vw;
  }
  .profile .dots-3 {
    width: 1.5vw;
    left: 0.75vw;
  }
  .profile .dots-4 {
    width: 1.5vw;
    left: -2vw;
  }
}
@media (min-width: 1200px) {
  .profile {
    height: 30vw;
    width: 30vw;
  }
  .profile .profile-img {
    height: 35vw;
  }
  .profile .dots-1 {
    width: 1.5vw;
    right: 0.75vw;
  }
  .profile .dots-2 {
    width: 1.5vw;
    right: -2vw;
  }
  .profile .dots-3 {
    width: 1.5vw;
    left: 0.75vw;
  }
  .profile .dots-4 {
    width: 1.5vw;
    left: -2vw;
  }
}