style.css

@import url("https://fonts.googleapis.com/css2?family=Ubuntu:wght@300400500700&display=swap");
* {
  margin: 0;
}

body {
  margin: 0;
  font-family: 'Basis Grotesque Pro', sans-serif;
  font-style: normal;
}

.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1340px;
  margin: 0 auto;
}
.header .header-nav {
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  color: #000000;
  opacity: 0.85;
}
.header .header-nav ul {
  list-style: none;
  display: flex;
  justify-content: space-between;
  padding: 0;
  gap: 40px;
}
.header .header-nav ul li {
  display: flex;
}
.header .header-nav ul li div {
  margin-right: 10px;
}
.header .header-language {
  display: flex;
  gap: 10px;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  color: #0536FC;
  opacity: 0.85;
}

.block-info {
  background: url(./images/bg.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  color: #FFFFFF;
  padding-top: 150px;
}
.block-info .block-info__container {
  max-width: 1020px;
  margin: 0 auto;
}
.block-info .block-info__container .block-info__title {
  padding-bottom: 30px;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  opacity: 0.9;
}
.block-info .block-info__container .block-info__description {
  padding-bottom: 285px;
  font-weight: 700;
  font-size: 38px;
  line-height: 42px;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  opacity: 0.9;
}

.block-reference {
  display: flex;
}
.block-reference .block-reference__item {
  display: flex;
  flex-direction: column;
  flex-basis: 25%;
  justify-content: space-between;
  border-right: 0.5px solid rgba(0, 0, 0, 0.5);
}
.block-reference .block-reference__item .block-reference__container {
  max-width: 200px;
  margin-top: 50px;
  padding: 0 110px 0 50px;
}
.block-reference .block-reference__item .block-reference__container .block-reference__count {
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  opacity: 0.7;
}
.block-reference .block-reference__item .block-reference__container .block-reference__h3 {
  padding-top: 30px;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: -0.03em;
  text-transform: uppercase;
}
.block-reference .block-reference__item .block-reference__container .block-reference__description {
  padding-top: 70px;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: -0.03em;
  opacity: 0.6;
}
.block-reference .block-reference__item:hover {
  color: #FFFFFF;
  background-color: #0536FC;
  border-right: 0.5px solid white;
}
.block-reference .block__item--borderless {
  border-right: none;
}
.block-reference .block__item--borderless:hover {
  border-right: none;
}
.block-reference .block-reference__arrow {
  align-items: end;
  display: flex;
  justify-content: flex-end;
  margin-top: 27px;
}

.header {
  padding-top: 24px
}
.header-logo {
  display: flex;

}
.container-top {
  max-width: 1330px;
  margin: 0 auto;
}
.frontscreen {
  display: flex;
}
.frontscreen-left {
  padding-left: 160px;
}
.frontscreen-right{
  background-image: url('./images/fronscreenimage.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  padding-left: 160px;
  position: relative;
}
.frontscreen-rightarrow{
  position: absolute;
  bottom: 15px;
  right: 15px;
}
.frontscreen-left-second{
  background-image: url('./images/fronscreenimage2.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.small-text-blue {
  padding-top: 100px;
width: 86px;
top: 186px;
font-style: normal;
font-weight: 700;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.03em;
text-transform: uppercase;
color: #0536FC;
opacity: 0.9;
padding-bottom: 30px;
}
.button-top {
  margin-top: 120px;
  margin-bottom: 185px;
  padding: 18px 35px;
  background: #0536fc;
  font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.03em;
text-transform: uppercase;
color: #FFFFFF;
width: fit-content;
}
.pl-50{
  padding-left: 50px;
}
.firstheader {
  font-style: normal;
  font-weight: 700;
  font-size: 57px;
  line-height: 59px;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  color: #000000;
  padding-bottom: 70px;
}
.fs-38 {
  font-size: 38px;
line-height: 42px;
}
.third-bg{
  background-image: url('./images/hoverbg1.png');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  width: 360px;
}
.pt-100 {
  padding-top: 100px;
}
.hoverblock{
  padding-left: 50px;
}
.end {
  margin: 0 0 0 219px;
}
.hoverbg4{
  background-image: url(./images/5.png);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.half-one {
  flex-basis: 25%;
}
.rignt5{
  margin-left: 50%;

}
.bg10 {
  margin-top: 50px;
 height: 100vh;
 margin-bottom: 200px;
}
.rignt5-img {
  margin: 200px 0 0 200px;
}
.hoverbg5{

  background-image: url(./images/6.png);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.hovert{
  padding-bottom: 221px;
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  color: #000000;
  }
.hoverd{
  padding-bottom: 36px;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: -0.03em;
  color: #000000;
  opacity: 0.6;}
.flex {
  display: flex;
}

.half {
  flex-basis: 50%;
}

.column {
 flex-direction: column;
}

.small-text {
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.03em;
color: #000000;
opacity: 0.6;
}

.blue-button {

}

@media all and (max-width: 1444px) {
  .block-reference__description {
    min-width: 200px;
  }
}
@media all and (max-width: 1444px) {
  .block-reference__container {
    max-width: 200px;
    margin-top: 50px;
    padding: 0 55px 0 25px;
  }
}
@media all and (max-width: 1135px) {
  .block-reference {
    display: flex;
    flex-wrap: wrap;
  }
}

/*# sourceMappingURL=style.css.map */