:root {
  --red: #E00A0E;
  --red-l: #f52629;
  --red-d: #ac0a0d;
  --red-dd: #180301;
  --blue: #005DC2;
  --blue-d: #004692;
  --green: #53AE27;
  --yellow: #FFB500;
  --gray: #F4F4F4;
  --white: #FFFFFF;
  --dark: #121212;
}

body {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  color: var(--dark);
}

.text-light {
  color: var(--white);
}

.nav-item {
  padding-left: 1rem;
}

.nav-link {
  font-weight: 500;
}

.nav-link .active {
  color: var(--red)!important;
}

.img-logo {
  height: 2rem;
  margin-top:1rem;
  margin-bottom:1rem;
}

.container {
  max-width: 1140px;
}

.heroline {
  background-color: var(--blue);
  padding-top: .8rem;
  padding-bottom: .8rem;
  color: var(--white);
  font-weight: 500;
}
.heroline i{
  padding-right: .5rem;
}

.heroline a{
  color: var(--white);
  text-decoration: none;
}

.heroline span{
  margin-left:1.5rem;
}

.herobox {
  background-image: url(../imgg/fotovoltaika-herobox-bg-01.jpg);
  background-size: cover;
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.herobox h1{
  margin-bottom: 2rem;
  color: var(--dark);
}

.herobox p{
  margin-bottom: 2rem;
}

.herobox-img{
  padding-bottom:1rem;
  max-height: 20rem;
}

.stripe {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.stripe img{
  border-radius: 1rem;
  margin-bottom:2rem;
  max-height: 17rem;
}

.stripe-head {
  padding-bottom: 1rem;
}

.stripe-foot {
  padding-top: 2rem;
}

.stripe.red {
  background-color: var(--red);
}
.stripe.red .btn-link{
  color: var(--white);
}
.stripe.red .btn-link:hover{
  color: var(--gray);
}

.stripe.red-d {
  background-color: var(--red-d);
}
.stripe.red-d .btn-link{
  color: var(--white);
}
.stripe.red-d .btn-link:hover{
  color: var(--gray);
}
.stripe.blue .btn-link{
  color: var(--white);
}
.stripe.blue-d {
  background-color: var(--blue-d);
}
.stripe.blue-d .btn-link{
  color: var(--white);
}
.stripe.blue-d .btn-link:hover{
  color: var(--gray);
}

.stripe.gray {
  background-color: var(--gray);
}

.stripe.blue {
  background-color: var(--blue);
}

.stripe.green {
  background-color: var(--green);
}

.stripe.yellow {
  background-color: var(--yellow);
}

.stripe.dark {
  background-color: var(--red-dd);
}

.points {
  text-align: center;
}

.point {
  margin: 0 0rem;
}

.point h3{
  margin-bottom: 1rem;
  margin-top:.6rem;
  font-weight: 500;
}

.point i{
  color: var(--red);
  font-size: 4rem;
}

.footer i{
  font-size:4rem;
}

.steps {

}

.step {
  margin: 0 0rem;
}

.step h3{
  margin-bottom: .5rem;
  margin-top:.6rem;
  font-weight: 500;
  font-size: 1.2rem;
}

.step i{
  color: var(--red);
  font-size: 3rem;
}

.references {
  text-align: center;
}

.reference img{
  border-radius: .4rem;
  margin-bottom: 1rem;
  max-width: 15rem;
}

.reference .info{
  margin-bottom: 1.5rem;
}

.reference .photo{
  display: inline-block;
}

.reference .photo img{
  max-width: 20rem;
  margin-bottom:1rem;
}

.reference .info .photo img{
  max-width: 10rem;
  margin-bottom:1rem;
  border-radius: 20rem;
}

.reference .name{
  font-weight: 300;
  font-size: 1.5rem;
}

.reference .item{
  font-weight: 300;
  font-size: 1.2rem;
}


.reference .location{
  font-weight: 600;
}
.reference .date{
  font-weight: 300;
  text-align: left;
}

.reference .text{
  font-weight: 400;
  margin-top: 1rem;
}

.profil{
  padding-bottom: 1rem;
  color: var(--white);
}

.profil a{
  color: var(--white);
}

.accordion-item {
  margin-bottom: .5rem;
}

.accordion-header {
  border-radius: .2rem!important;
  border: 1px solid var(--red);
}

.accordion-flush {
  border-radius: .2rem!important;
}

.accordion-button:not(.collapsed) {
  color: var(--dark);
  background-color: var(--red);
  border-radius: .2rem!important;
}

.kontakt a{
  text-decoration: none;
}

.kontakt img{
  max-width: 15rem;
}

h3 {
  font-size: 1.4rem;
}

.btn {
  border-radius: 0rem;
  padding: .8rem 1.2rem 0.7rem 1.2rem;
  margin-right: 1rem;
  margin-bottom: 1rem;
  font-weight: 600;
}

.btn-red {
  background-color: var(--red);
  color: var(--white);
}

.btn-red:hover {
  background-color: var(--red-d);
  color: var(--white);
}

.btn-blue {
  background-color: var(--blue);
  color: var(--white);
}

.btn-blue:hover {
  background-color: var(--blue-d);
  color: var(--white);
}

.btn-white {
  background-color: var(--white);
  color: var(--blue);
}

.btn-white:hover {
  background-color: var(--gray);
  color: var(--blue);
}

.btn-link {
  color: var(--blue);
}

.btn-link:hover {
  color: var(--blue-d);
}

.btn-red-outline {
  border: 2px solid var(--red);
}

.btn-red-outline:hover {
  border: 2px solid var(--red-d);
}

.btn-blue-outline {
  border: 2px solid var(--blue);
}

.btn-blue-outline:hover {
  border: 2px solid var(--blue-d);
}

.form-label {
  font-weight: 600;
}

@media (max-width: 767.98px) {
  .herobox-img{
    padding-top: 1rem;
    padding-bottom: 1rem;
    max-width: 20rem;
  }
}

@media (max-width: 991.98px) {
  .nav-item {
    padding-left: 0rem;
  }
}